[{"__symbolic":"module","version":4,"metadata":{"DisplaySettingComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../../base/resizable-element-setting-modal","name":"ResizableElementSettingModal","line":35,"character":45},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":28,"character":1},"arguments":[{"selector":"display-setting","styles":[".element-setting-base{ .inline-label { margin: 10px 0px 0px 10px; display: inline-block; } .border-group { // border: 1px solid #ddd; padding: 5px; margin-bottom: 0px; } .inline-selector { display: inline-block; margin: 5px 0px; } .inline-variable { display: inline-block; margin: 5px 0px; } .inline-input { display: inline-block; margin: 5px 0px; }     } .date-time-setting-modal { .modal-content { width: 600px; } .cursor-pointer{ cursor: pointer; } .recode-input{ width: calc(100% - 70px); border: 1px solid #d7dbe5;   padding:  5px 10px; } textarea.noResize { resize: none; } } .toggleViewSettingModal { .modal-content { width: 600px; } } .textSettingModal { .modal-content { width: 600px; } } ",".display-setting-base{ .position-and-rotate{ width: 100%; } .position,.rotate{ width: calc(50% - 5px); } .position .fe-modal-content,.rotate .fe-modal-content{ height: 90px; } .rotate .fe-modal-content{ position: relative; } .position{ float: left; } .rotate{ float: right; } .position .flexem-form-body{ height: 90px; } .width-and-height{ height: 30px; width: 100%; } .width-and-height>div{ width: 50%; display: inline-block; max-width: 137px; } .width-and-height:nth-child(1){ margin-bottom: 10px; } .inline-block{ display: inline-block; } span.inline-block{ width: 20px; } input.inline-block{ width: 80px; height: 30px; } .width-and-height:nth-child(2){ margin-bottom: 0; } .rotate-body{ width: 64px; height: 64px; margin: 2px 10px;   position: relative; top: -5px;  } .rotate-border{ width: 54px; height: 54px; position: absolute; border: 1px solid #b5c2ca; top: 11px; left: 5px; } .rotate-top,.rotate-middle,.rotate-bottom{ width: 100%; height: 10px; display: flex; justify-content: space-between; align-items: center; } .rotate-middle,.rotate-bottom{ margin-top:16px;  } .rotate-top>div,.rotate-middle>div,.rotate-bottom>div{ width: 10px; height: 10px; } .rotate-body{ height: 66px; } .rotate-body input[type=radio]{ width: 10px; height: 10px; position: relative; } .rotate-body input[type=radio]::before{ width: 10px; height: 10px; background: white; border: 1px solid #b5c2ca; border-radius: 0; position: absolute; left: 0; top:0; } .rotate-body input[type=radio]::after{ top: 1px; left: 1px; } .rotate-body input[type=radio]:checked:before{ width: 10px; height: 10px; background: #3695ff; } .rotate-body input[type=radio]:checked:after{ top: 1px; left: 1px; } .angle{ width:130px; position: absolute; right: 10px; bottom: 10px; } .angle span{ width: 45px; line-height: 30px; font-size: 14px; } .angle input{ width: 80px; height: 30px; padding: 5px 10px; } .flexem-form-body{ position: relative; input{ padding: 0 5px; } } .primeng-datatable-container{ .ui-table-thead{ tr{ border-bottom: 0!important; } } th,td{ box-sizing: border-box; background: transparent; padding: 0 10px!important; line-height: 29px; } } .primeng-datatable-container .primeng-no-data{ box-sizing: border-box; padding: 5px 10px; height: 30px; } .ui-table-scrollable-body{ margin-top: -1px; } .btns button{ margin-right: 10px; } .btns{ margin: 10px 0;  } .margin-top-5{ margin-top: 5px; } .and-or-select{ font-size: 12px; color: #666666; height: 24px; width: 80px; } } "],"template":"<div class=\"fe-modal-body element-setting-base display-setting-base\"> <div class=\"position-and-rotate clearfix\"> <div class=\"position\" [hidden]=\"!isSizeEnable&&!isLocationEnable\" [ngStyle]=\"{'width':!isFixedPositionVisible?'100%':'calc(50% - 5px)'}\"> <div class=\"fe-option-head\"> {{lc('Position')}} </div> <div class=\"fe-modal-content\"> <div *ngIf=\"isSizeEnable\" class=\"width-and-height clearfix\"> <div> <span class=\"inline-block\">{{lc(\"Width\")}}：</span> <input type=\"number\" name=\"Width\"  class=\"inline-block\" (change)=\"widthChanged($event.target.value)\" [(ngModel)]=\"width\"> </div> <div> <span class=\"inline-block\">{{lc(\"Height\")}}：</span> <input type=\"number\" name=\"Height\"  class=\"inline-block\" (change)=\"heightChanged($event.target.value)\" [(ngModel)]=\"height\"> </div> </div> <div class=\"width-and-height\" *ngIf=\"isLocationEnable\"> <div> <span class=\"inline-block\">X:</span> <input type=\"number\" name=\"LocationX\" class=\"inline-block\"  [(ngModel)]=\"locationX\"> </div> <div> <span class=\"inline-block\">Y:</span> <input type=\"number\" name=\"LocationY\" class=\"inline-block\"  [(ngModel)]=\"locationY\"> </div> </div>           </div> </div> <div class=\"rotate\" [hidden]=\"!isFixedPositionVisible\" [ngStyle]=\"{'width':!isSizeEnable&&!isLocationEnable?'100%':'calc(50% - 5px)'}\"> <div class=\"fe-option-head\"> {{lc('Rotation')}} </div> <div class=\"fe-modal-content\"> <div class=\"rotate-body\"> <div class=\"rotate-border\"> </div> <div class=\"rotate-top\"> <div> <input type=\"radio\" position=\"TopLeft\" name=\"position\" [checked]=\"fixedPositionType == 0\" [value]=\"0\" (change)=\"changeFixedPositionType(0)\"/> </div> <div> <input type=\"radio\" position=\"TopCenter\" name=\"position\" [value]=\"1\" [checked]=\"fixedPositionType == 1\" (change)=\"changeFixedPositionType(1)\"/> </div> <div> <input type=\"radio\" position=\"TopRight\" name=\"position\" [value]=\"2\" [checked]=\"fixedPositionType == 2\" (change)=\"changeFixedPositionType(2)\"/> </div> </div> <div class=\"rotate-middle\"> <div> <input type=\"radio\" position=\"CenterLeft\" name=\"position\" [value]=\"3\" [checked]=\"fixedPositionType == 3\" (change)=\"changeFixedPositionType(3)\"/> </div> <div> <input type=\"radio\" position=\"CenterCenter\" name=\"position\" [value]=\"4\" [checked]=\"fixedPositionType == 4\" (change)=\"changeFixedPositionType(4)\"/> </div> <div> <input type=\"radio\" position=\"CenterRight\" name=\"position\" [value]=\"5\" [checked]=\"fixedPositionType == 5\" (change)=\"changeFixedPositionType(5)\"/> </div> </div> <div class=\"rotate-bottom\"> <div> <input type=\"radio\" position=\"BottomLeft\" name=\"position\" [value]=\"6\" [checked]=\"fixedPositionType == 6\" (change)=\"changeFixedPositionType(6)\"/> </div> <div> <input type=\"radio\" position=\"BottomCenter\" name=\"position\" [value]=\"7\" [checked]=\"fixedPositionType == 7\" (change)=\"changeFixedPositionType(7)\"/> </div> <div> <input type=\"radio\" position=\"BottomRight\" name=\"position\" [value]=\"8\" [checked]=\"fixedPositionType == 8\" (change)=\"changeFixedPositionType(8)\"/> </div> </div> </div> <div class=\"angle\" *ngIf=\"isAngle\"> <span class=\"inline-block\">{{lc('Angel')}}：</span> <input type=\"number\" name=\"Angle\" class=\"inline-block\" [(ngModel)]=\"rotationAngel\"> </div> </div> </div>  </div> <div class=\"ShowOrHide\"> <div class=\"fe-option-head\"> {{lc('ShowOrHide')}} </div> <div class=\"fe-modal-content\"> <div class=\"fe-radio-select-header\"> <label *ngFor=\"let option of displayTypes\"> <input type=\"radio\" name=\"{{radioName}}\" [value]=\"option.key\" [(ngModel)]=\"selectedTypeKey\" (change)=\"onChangeDisplayOption(option)\" required /> <span>{{option.name}}</span> </label> </div> <div *ngIf=\"!isAwaysDisplay\"  class=\"fe-radio-select-body\"> <control-permission-setting #controlPermissionSetting [configureId]=\"configureId\" [permissionSettingResult]=\"permissionsResult\" (permissionChange)=\"onPermissionChanged($event)\"></control-permission-setting> <label> <input type=\"checkBox\" [(ngModel)]=\"displayLogicEnabled\" (change)=\"changeDisplayLogicalControlCheck()\" /> <span>{{lc(\"LogicalEnableSetting\")}}</span> </label> <div *ngIf=\"displayLogicEnabled\" class=\"margin-top-5 fe-form\"> <div class=\"align-items-center\"> <div class=\"primeng-datatable-container\"> <p-table #dataTable [value]=\"conditionItems\" scrollable=\"true\" scrollHeight=\"100px\" ScrollWidth=\"100%\" selectionMode=\"single\" [(selection)]=\"selectedCondition\" [responsive]=\"true\" [style]=\"{'Height':'110px'}\"> <ng-template pTemplate=\"header\"> <tr> <th style=\"width:105px\">{{lc('Logic')}}</th> <th>{{lc('Condition')}}</th> </tr> </ng-template> <ng-template pTemplate=\"body\" let-rowData let-record=\"$implicit\"> <tr [pSelectableRow]=\"rowData\" (dblclick)=\"onRowDbSelect(record)\" class=\"cursor-pointer\"> <td style=\"width: 105px\"> <div *ngIf=\"record.relationType==1 || record.relationType==2\"> <select class=\"and-or-select\"  name=\"relation\" [(ngModel)]=\"record.relationType\"> <option *ngFor=\"let option of logicTypes \" [value]=\"option.key \">{{option.name}}</option> </select> </div> </td> <td> <div *ngIf=\"getConditionType(record)==0\"> <span *ngIf=\"!record.condition.isBitwiseIndex\">{{record.condition.variableName}}</span> <span *ngIf=\"record.condition.isBitwiseIndex\">{{record.condition.variableName}} . {{record.condition.bitIndex}}</span> <span>=</span> <span>{{bitConditionTypeOptionService.getOptionNameByKey(record.condition.bitConditionLogic)}}</span> </div> <div *ngIf=\"getConditionType(record)==1\"> <span>{{record.condition.variableName}}</span> <span>{{comparatorTypeOptionService.getOptionNameByKey(record.condition.baseVariableValue.operator)}}</span> <span *ngIf=\"record.condition.baseVariableValue.valueType==1\">{{record.condition.baseVariableValue.variableName}}</span> <span *ngIf=\"record.condition.baseVariableValue.valueType==0\">{{record.condition.baseVariableValue.constValue}}</span> <span *ngIf=\"record.condition.realtionVariableValue\">{{relationTypeOptionService.getOptionNameByKey(record.condition.relationType)}}</span> <span *ngIf=\"record.condition.realtionVariableValue\">{{record.condition.variableName}}</span> <span *ngIf=\"record.condition.realtionVariableValue\">{{comparatorTypeOptionService.getOptionNameByKey(record.condition.realtionVariableValue?.operator)}}</span> <span *ngIf=\"record.condition.realtionVariableValue?.valueType==1\">{{record.condition.realtionVariableValue?.variableName}}</span> <span *ngIf=\"record.condition.realtionVariableValue?.valueType==0\">{{record.condition.realtionVariableValue?.constValue}}</span> </div> </td> </tr> </ng-template> </p-table> <div class=\"primeng-no-data\" *ngIf=\"!conditionItems.length\"> {{l('NoData')}} </div> </div> </div> <div class=\"btns\"> <button (click)=\"onAdd()\" type=\"button\" class=\"fe-btn fe-btn-small fe-btn-operate\">{{lc('AddNew')}}</button> <button (click)=\"onModify()\" type=\"button\" class=\"fe-btn fe-btn-small fe-btn-operate\">{{lc('Modify')}}</button> <button (click)=\"onDelete()\" type=\"button\" class=\"fe-btn fe-btn-small fe-btn-operate\">{{lc('Delete')}}</button> </div> </div> </div> </div> </div> </div> "}]}],"members":{"dataTable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":37,"character":5},"arguments":["dataTable",{"static":true}]}]}],"paginator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":38,"character":5},"arguments":["paginator",{"static":false}]}]}],"controlPermissionSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":39,"character":5},"arguments":["controlPermissionSetting",{"static":false}]}]}],"isSizeEnable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":5}}]}],"isLocationEnable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":5}}]}],"isFixedPositionVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":5}}]}],"isSameSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":5}}]}],"isAngle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":64,"character":9},"arguments":[{"__symbolic":"reference","module":"../../../core/variable/variable.service","name":"VARIABLE_SERVICE","line":64,"character":16}]}],null,null,null,null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":61,"character":26},{"__symbolic":"reference","module":"./display-type-option.service","name":"DisplayTypeOptionService","line":62,"character":34},{"__symbolic":"reference","module":"../condition/bit/bit-condition-type-option.service","name":"BitConditionTypeOptionService","line":63,"character":48},{"__symbolic":"reference","module":"../../../core/variable/variable.services","name":"VariableService","line":64,"character":68},{"__symbolic":"reference","module":"../condition/comm/relation-type-option.service","name":"RelationTypeOptionService","line":65,"character":44},{"__symbolic":"reference","module":"../condition/comm/relational-operator-option.service","name":"RelationalOperatorOptionService","line":66,"character":46},{"__symbolic":"reference","module":"ngx-bootstrap","name":"BsModalService","line":67,"character":39},{"__symbolic":"reference","module":"../condition/comm/logic-type-option.service","name":"LogicTypeOptionService","line":68,"character":49}]}],"init":[{"__symbolic":"method"}],"initConditions":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"changeWidthsAndHeights":[{"__symbolic":"method"}],"onChangeDisplayOption":[{"__symbolic":"method"}],"checkVariablesName":[{"__symbolic":"method"}],"saveDisplayInfo":[{"__symbolic":"method"}],"onAdd":[{"__symbolic":"method"}],"onModify":[{"__symbolic":"method"}],"onDelete":[{"__symbolic":"method"}],"onRowDbSelect":[{"__symbolic":"method"}],"setConditionsType":[{"__symbolic":"method"}],"setConditionItem":[{"__symbolic":"method"}],"onPermissionChanged":[{"__symbolic":"method"}],"changeDisplayLogicalControlCheck":[{"__symbolic":"method"}],"heightChanged":[{"__symbolic":"method"}],"widthChanged":[{"__symbolic":"method"}],"changeFixedPositionType":[{"__symbolic":"method"}],"leftPointChangeFixedPositionType":[{"__symbolic":"method"}],"centerPointChangeFixedPositionType":[{"__symbolic":"method"}],"rightPointChangeFixedPositionType":[{"__symbolic":"method"}],"showConditionModal":[{"__symbolic":"method"}]}}}}]