[{"__symbolic":"module","version":4,"metadata":{"MultiSelectComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"multi-select","template":"<div class=\"row\" style=\"padding: 10px 30px;\"> <div class=\"col-6\"> <div class=\"row\"> <div class=\"col-10\"> <fieldset [style.height]=\" height + 'px' \"> <legend>{{leftTitle}}：</legend> <div class=\"container columns-box\" [style.height]=\" (height - 40) + 'px' \"> <perfect-scrollbar [config]=\"{}\"> <ng-container *ngIf=\"displayType === 'List'; else tree\"> <ul class=\"list-group list-group-flush\" style=\"margin: 0 15px\"> <li  class=\"list-group-item\" *ngFor=\"let data of dataSource\"> <div class=\"custom-control custom-checkbox  custom-control-inline\" (click)=\"leftDataChecked([data])\"> <input type=\"checkbox\" class=\"custom-control-input\" [checked]=\"isChecked(data, 'L')\" [disabled]=\"!canChecked(data)\"> <label class=\"custom-control-label\" > <display-text [template]=\"displayTemplate\" [data]=\"data\"></display-text> </label> </div> </li> </ul> </ng-container> <ng-template #tree> <farris-treetable #tt [data]=\"dataSource\" [idField]=\"idField\" [striped]=\"false\" [singleSelect]=\"false\" [showIcon]=\"false\" [showFilterBar]=\"false\" [selectOnCheck]=\"true\" [checkOnSelect]=\"true\"> <ng-template farrisTemplate=\"body\" let-rowNode let-treeNode=\"node\" let-rowData=\"rowData\" > <tr #row=\"row\" [selectRow]=\"rowNode\" [dblclick]=\"true\" [selectRowDisabled]=\"!canChecked(treeNode)\"> <td style=\"border: 0\" [style.color]=\"row.selectRowDisabled? '#a6a6a6': '#333'\"> <farris-treeTableToggler [disabled]=\"!canChecked(treeNode)\" [rowNode]=\"rowNode\"></farris-treeTableToggler> <display-text [template]=\"displayTemplate\" [data]=\"rowData\"></display-text> </td> </tr> </ng-template> </farris-treetable> </ng-template> </perfect-scrollbar> </div> </fieldset> </div> <div class=\"col-2 v-center\"> <button title=\"右移\" class=\"btn btn-outline-light icon right\" type=\"button\" (click)=\"moveToRight()\"></button> <button title=\"全部右移\" class=\"btn btn-outline-light icon right-all\" type=\"button\" (click)=\"moveAllToRight()\"></button> <button title=\"左移\" class=\"btn btn-outline-light icon left\" type=\"button\" (click)=\"moveToLeft()\"></button> <button title=\"全部左移\" class=\"btn btn-outline-light icon left-all\" type=\"button\" (click)=\"moveAllToLeft()\"></button> </div> </div> </div> <div class=\"col-6\"> <div class=\"row\"> <div class=\"col-10\"> <fieldset [style.height]=\" height + 'px' \"> <legend>{{rightTitle}}：</legend> <div class=\"container columns-box\" [style.height]=\" (height - 40) + 'px' \"> <perfect-scrollbar [config]=\"{}\"> <ul class=\"list-group list-group-flush\"  style=\"margin: 0 15px\"> <li class=\"list-group-item\" *ngFor=\"let data of selections\" (click)=\"rightDataChecked(data)\" [class.active]=\"isChecked(data, 'R')\"> <display-text [template]=\"displayTemplate\" [data]=\"data\"></display-text> </li> </ul> </perfect-scrollbar> </div> </fieldset> </div> <div class=\"col-2 v-center\"> <button title=\"置顶\" type=\"button\" class=\"btn btn-outline-light icon top\" (click)=\"moveTop()\"></button> <button title=\"上移\" type=\"button\" class=\"btn btn-outline-light icon up\" (click)=\"moveUp()\"></button> <button title=\"下移\" type=\"button\" class=\"btn btn-outline-light icon down\" (click)=\"moveDown()\"></button> <button title=\"置底\" type=\"button\" class=\"btn btn-outline-light icon end\" (click)=\"moveBottom()\"></button> </div> </div> </div> </div>","styles":[" .icon { background-repeat: no-repeat; background-position: center; background-size: 26px; height: 30px; margin-bottom: 10px; } .right { background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cstyle%3E.icon-canvas-transparent{opacity:0;fill:%23f6f6f6}.icon-vs-bg{fill:%23424242}.icon-vs-out{fill:%23f6f6f6}%3C/style%3E%3Cpath class='icon-canvas-transparent' d='M16 16H0V0h16v16z' id='canvas'/%3E%3Cpath class='icon-vs-out' d='M6.391 13.694L3.916 11.22 7.135 8 3.916 4.78l2.475-2.475L12.084 8l-5.693 5.694z' id='outline'/%3E%3Cg id='iconBg'%3E%3Cpath class='icon-vs-bg' d='M6.39 12.28l-1.06-1.06L8.549 8 5.33 4.78l1.06-1.06L10.67 8l-4.28 4.28z'/%3E%3C/g%3E%3C/svg%3E\"); } .right-all { background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' enable-background='new 0 0 16 16'%3E%3Cstyle type='text/css'%3E.icon-canvas-transparent{opacity:0;fill:%23F6F6F6;} .icon-vs-out{fill:%23F6F6F6;} .icon-vs-bg{fill:%23424242;}%3C/style%3E%3Cpath class='icon-canvas-transparent' d='M0 0h16v16h-16v-16z' id='canvas'/%3E%3Cpath class='icon-vs-out' d='M5 7.684l-2.58-2.58 2.121-2.121 2.018 2.017h.34l2.018-2.018 5.017 5.018-5.018 5.018-2.018-2.018h-.34l-2.018 2.018-2.12-2.122 2.58-2.58v-.632z' id='outline'/%3E%3Cpath class='icon-vs-bg' d='M3.834 10.896l2.896-2.896-2.896-2.897.707-.707 3.604 3.604-3.604 3.604-.707-.708zm5.082.708l3.604-3.604-3.604-3.604-.707.707 2.896 2.897-2.896 2.896.707.708z' id='iconBg'/%3E%3C/svg%3E\"); } .left { background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cstyle%3E.icon-canvas-transparent{opacity:0;fill:%23f6f6f6}.icon-vs-bg{fill:%23424242}.icon-vs-out{fill:%23f6f6f6}%3C/style%3E%3Cpath class='icon-canvas-transparent' d='M0 0h16v16H0V0z' id='canvas'/%3E%3Cpath class='icon-vs-out' d='M9.609 2.306l2.475 2.475L8.865 8l3.219 3.22-2.475 2.475L3.916 8l5.693-5.694z' id='outline'/%3E%3Cg id='iconBg'%3E%3Cpath class='icon-vs-bg' d='M9.61 3.72l1.06 1.06L7.451 8l3.22 3.22-1.061 1.06L5.33 8l4.28-4.28z'/%3E%3C/g%3E%3C/svg%3E\"); } .left-all{ background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' enable-background='new 0 0 16 16'%3E%3Cstyle type='text/css'%3E.icon-canvas-transparent{opacity:0;fill:%23F6F6F6;} .icon-vs-out{fill:%23F6F6F6;} .icon-vs-bg{fill:%23424242;}%3C/style%3E%3Cpath class='icon-canvas-transparent' d='M16 16h-16v-16h16v16z' id='canvas'/%3E%3Cpath class='icon-vs-out' d='M11 8.316l2.58 2.58-2.121 2.121-2.018-2.017h-.34l-2.018 2.018-5.017-5.018 5.018-5.018 2.018 2.018h.34l2.018-2.018 2.121 2.121-2.581 2.581v.632z' id='outline'/%3E%3Cpath class='icon-vs-bg' d='M11.459 11.604l-3.604-3.604 3.604-3.604.707.707-2.896 2.897 2.896 2.897-.707.707zm-3.668-.708l-2.896-2.896 2.897-2.897-.708-.707-3.604 3.604 3.604 3.604.707-.708z' id='iconBg'/%3E%3C/svg%3E\"); } .up { background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cstyle type='text/css'%3E.icon-canvas-transparent{opacity:0;fill:%23F6F6F6;} .icon-vs-out{fill:%23F6F6F6;} .icon-vs-bg{fill:%23424242;}%3C/style%3E%3Cpath class='icon-canvas-transparent' d='M16 16h-16v-16h16v16z' id='canvas'/%3E%3Cpath class='icon-vs-out' d='M1.586 11l6.414-6.414 6.414 6.414h-12.828z' id='outline'/%3E%3Cpath class='icon-vs-bg' d='M12 10h-8l4-4 4 4z' id='iconBg'/%3E%3C/svg%3E\"); } .down { background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cstyle%3E.icon-canvas-transparent{opacity:0;fill:%23f6f6f6}.icon-vs-out{fill:%23f6f6f6}.icon-vs-bg{fill:%23424242}%3C/style%3E%3Cpath class='icon-canvas-transparent' d='M16 16H0V0h16v16z' id='canvas'/%3E%3Cpath class='icon-vs-out' d='M1.586 5h12.828L8 11.414 1.586 5z' id='outline'/%3E%3Cg id='iconBg'%3E%3Cpath class='icon-vs-bg' d='M8 10L4 6h8l-4 4z'/%3E%3C/g%3E%3C/svg%3E\"); } .end { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgAgMAAACf9p+rAAAACVBMVEUAAAAzMzMyMjIH2j3VAAAAA3RSTlMA/4CE6rqMAAAAc0lEQVR4Ae3NoQ0CUBAFQXLuCrmSHkFSCk1cvySo0QQB5I9dsZfjDXk54YTPhQ2uhAluhA7uhAoeTtaFxoXahSoutC40LtQuVHGhdaFxoXahigutC40LtQtVXGhdaFyoXajiQutC40LtQuXivyT63XB8iycdcJ0OPAoNRAAAAABJRU5ErkJggg=='); } .top { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgAgMAAACf9p+rAAAACVBMVEUAAAAzMzMyMjIH2j3VAAAAA3RSTlMA/4CE6rqMAAAAd0lEQVR4Ae3ToQ2AABAEwQ+OQijpCJJSaIJ+sRNAYYDk154YddV9sMT+NrzRsBXRuBbRtBTRPhdBJCASCYhEAiKRiEiISEREIiISEZE4IxAiEiISIhJXBEJEQkRCREJEQkTiDoEQkRCREJEQkQAxT9NDD8+Gb9YdVAydDo2xY38AAAAASUVORK5CYII='); } :host fieldset { height: 550px; } :host .v-center { justify-content: center; display: flex; flex-direction: column; } .columns-box { height: 510px; padding: 0; border: 1px solid #d0d0d0; } :host legend { font-size: 0.9rem; font-weight: bold; }"]}]}],"members":{"dataSource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":5}}]}],"displayType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"enableTargetSort":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"idField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":5}}]}],"textField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":5}}]}],"valueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":5}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":5}}]}],"noDataMoveMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":5}}]}],"tt":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":38,"character":5},"arguments":["tt"]}]}],"leftTitle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":5}}]}],"rightTitle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":5}}]}],"dataChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":42,"character":5}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":43,"character":5}}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":45,"character":5},"arguments":[{"__symbolic":"reference","module":"../../common/farris-template.directive","name":"FarrisTemplateDirective","line":45,"character":21}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../container/modal","name":"MessagerService","line":56,"character":36}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"isChecked":[{"__symbolic":"method"}],"canChecked":[{"__symbolic":"method"}],"isTree":[{"__symbolic":"method"}],"leftDataChecked":[{"__symbolic":"method"}],"hasCheckeds":[{"__symbolic":"method"}],"rightDataChecked":[{"__symbolic":"method"}],"moveToRight":[{"__symbolic":"method"}],"clearSelections":[{"__symbolic":"method"}],"convertTreeDataToPlainData":[{"__symbolic":"method"}],"moveAllToRight":[{"__symbolic":"method"}],"moveToLeft":[{"__symbolic":"method"}],"moveAllToLeft":[{"__symbolic":"method"}],"_getSelectInfo":[{"__symbolic":"method"}],"moveTop":[{"__symbolic":"method"}],"moveUp":[{"__symbolic":"method"}],"moveDown":[{"__symbolic":"method"}],"moveBottom":[{"__symbolic":"method"}]}},"DisplayTextComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":368,"character":1},"arguments":[{"selector":"display-text","template":"\n        <ng-container *ngIf=\"template\" >\n            <ng-container  *ngTemplateOutlet=\"template; context: {$implicit: data}\"></ng-container>\n        </ng-container>\n        <ng-container *ngIf=\"!template\">\n            {{ data[ms.textField] }}\n        </ng-container>\n    "}]}],"members":{"template":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":380,"character":5}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":381,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"MultiSelectComponent"}]}],"ngOnInit":[{"__symbolic":"method"}]}}}}]