UNPKG

@duoduo-oba/ng-devui

Version:

DevUI components based on Angular

2 lines 25 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("ng-devui/i18n"),require("@angular/common"),require("@angular/forms"),require("ng-devui/checkbox"),require("ng-devui/search"),require("ng-devui/dragdrop")):"function"==typeof define&&define.amd?define("ng-devui/transfer",["exports","@angular/core","ng-devui/i18n","@angular/common","@angular/forms","ng-devui/checkbox","ng-devui/search","ng-devui/dragdrop"],t):t(((e=e||self)["ng-devui"]=e["ng-devui"]||{},e["ng-devui"].transfer={}),e.ng.core,e["ng-devui"].i18n,e.ng.common,e.ng.forms,e["ng-devui"].checkbox,e["ng-devui"].search,e["ng-devui"].dragdrop)}(this,(function(e,t,r,n,i,s,a,o){"use strict";var l={SOURCE:0,TARGET:1};l[l.SOURCE]="SOURCE",l[l.TARGET]="TARGET";var c=function(){function e(r){this.i18n=r,this.sourceOption=[],this.targetOption=[],this.titles={source:"source",target:"target"},this.height="320px",this.isSearch=!1,this.disabled=!1,this.isSourceDroppable=!1,this.isTargetDroppable=!1,this.customSourceCheckedLen=0,this.customTargetCheckedLen=0,this.transferToTarget=new t.EventEmitter,this.transferToSource=new t.EventEmitter,this.transferDirection=l,this.sourceDisplayOption=[],this.sourceDisplayOptionLen=0,this.sourceCheckedLen=0,this.sourceHalfChecked=!1,this.sourceAllChecked=!1,this.sourceCanTransfer=!1,this.targetDisplayOption=[],this.targetDisplayOptionLen=0,this.targetCheckedLen=0,this.targetHalfChecked=!1,this.targetAllChecked=!1,this.targetCanTransfer=!1,this.sourceSearchText="",this.targetSearchText="",this.id=e.ID_SEED++,this.setI18nText()}return e.prototype.ngOnInit=function(){this.sourceDisplayOption=this.sourceOption,this.sourceDisplayOptionLen=this.sourceDisplayOption.length,this.targetDisplayOption=this.targetOption,this.targetDisplayOptionLen=this.targetDisplayOption.length},e.prototype.setI18nText=function(){var e=this;this.i18nCommonText=this.i18n.getI18nText().common,this.i18nSubscription=this.i18n.langChange().subscribe((function(t){e.i18nCommonText=t.common}))},e.prototype.ngOnChanges=function(e){e&&(e.customSourceCheckedLen||e.customTargetCheckedLen)&&(this.targetCanTransfer=this.targetCanTransfer||e.customSourceCheckedLen&&e.customSourceCheckedLen.currentValue>0,this.sourceCanTransfer=this.sourceCanTransfer||e.customTargetCheckedLen&&e.customTargetCheckedLen.currentValue>0)},e.prototype.checkboxChange=function(e,t){e===l.SOURCE?(this.sourceDisplayOption.filter((function(e){return e.checked})).length>0?this.targetCanTransfer=!0:this.targetCanTransfer=!1,this.listTotalCheck(e)):e===l.TARGET&&(this.targetDisplayOption.filter((function(e){return e.checked})).length>0?this.sourceCanTransfer=!0:this.sourceCanTransfer=!1,this.listTotalCheck(e))},e.prototype.listTotalCheck=function(e){if(e===l.SOURCE){var t=this.sourceDisplayOption.filter((function(e){return e.checked})).length;this.sourceCheckedLen=t,0===t?(this.sourceAllChecked=!1,this.sourceHalfChecked=!1):t!==this.sourceDisplayOption.length?(this.sourceAllChecked=!1,this.sourceHalfChecked=!0):(this.sourceAllChecked=!0,this.sourceHalfChecked=!1)}else if(e===l.TARGET){var r=this.targetDisplayOption.filter((function(e){return e.checked})).length;this.targetCheckedLen=r,0===r?(this.targetAllChecked=!1,this.targetHalfChecked=!1):r!==this.targetDisplayOption.length?(this.targetAllChecked=!1,this.targetHalfChecked=!0):(this.targetAllChecked=!0,this.targetHalfChecked=!1)}this.sourceDisplayOptionLen=this.sourceDisplayOption.length,this.targetDisplayOptionLen=this.targetDisplayOption.length},e.prototype.transferTo=function(e){var t=this;e===l.TARGET?(this.sourceDisplayOption.filter((function(e){return!0===e.checked})).forEach((function(e){var r={name:e.name,value:e.value,id:e.id,checked:!1};t.targetOption.push(r)})),this.sourceOption=this.sourceOption.filter((function(e){return!0!==e.checked})),this.targetCanTransfer=!1,this.sourceCustomViewTemplate?this.transferToTarget.next():this.transferToSource.next({sourceOption:this.sourceOption,targetOption:this.targetOption}),this.isSearch&&""!==this.sourceSearchText&&(this.sourceSearchText="")):e===l.SOURCE&&(this.targetDisplayOption.filter((function(e){return!0===e.checked})).forEach((function(e){var r={name:e.name,value:e.value,id:e.id,checked:!1};t.sourceOption.push(r)})),this.targetOption=this.targetOption.filter((function(e){return!0!==e.checked})),this.sourceCanTransfer=!1,this.targetCustomViewTemplate?this.transferToSource.next():this.transferToSource.next({sourceOption:this.sourceOption,targetOption:this.targetOption}),this.isSearch&&""!==this.targetSearchText&&(this.targetSearchText="")),this.targetDisplayOption=this.targetOption,this.sourceDisplayOption=this.sourceOption,this.listTotalCheck(l.TARGET),this.listTotalCheck(l.SOURCE)},e.prototype.checkAll=function(e,t){e===l.SOURCE?(t?(this.sourceHalfChecked=!1,this.sourceCheckedLen=this.sourceDisplayOption.filter((function(e){return!0!==e.disabled})).length):this.sourceCheckedLen=0,this.targetCanTransfer=t,this.sourceDisplayOption.forEach((function(e){e.checked!==t&&!0!==e.disabled&&(e.checked=t)}))):e===l.TARGET&&(t?(this.targetHalfChecked=!1,this.targetCheckedLen=this.targetDisplayOption.filter((function(e){return!0!==e.disabled})).length):this.targetCheckedLen=0,this.sourceCanTransfer=t,this.targetDisplayOption.forEach((function(e){e.checked!==t&&!0!==e.disabled&&(e.checked=t)})))},e.prototype.search=function(e,t){""!==t?e===l.SOURCE?this.sourceDisplayOption=this.sourceOption.filter((function(e){return null!==e.name.match(t)})):e===l.TARGET&&(this.targetDisplayOption=this.targetOption.filter((function(e){return null!==e.name.match(t)}))):e===l.SOURCE?this.sourceDisplayOption=this.sourceOption:e===l.TARGET&&(this.targetDisplayOption=this.targetOption),this.listTotalCheck(e)},e.prototype.onDrop=function(e,t){var r=t.dropIndex,n=t.dragFromIndex;-1!==r?(-1!==n&&r>n&&r--,e===l.SOURCE?(this.sourceOption.splice(r,0,-1===n?t.dragData:this.sourceOption.splice(n,1)[0]),this.transferToSource.next({sourceOption:this.sourceOption,targetOption:this.targetOption})):(this.targetOption.splice(r,0,-1===n?t.dragData:this.targetOption.splice(n,1)[0]),this.transferToTarget.next({sourceOption:this.sourceOption,targetOption:this.targetOption}))):e===l.SOURCE?(this.sourceOption.push(t.dragData),this.transferToSource.next({sourceOption:this.sourceOption,targetOption:this.targetOption})):(this.targetOption.push(t.dragData),this.transferToTarget.next({sourceOption:this.sourceOption,targetOption:this.targetOption}))},e.prototype.ngOnDestroy=function(){this.i18nSubscription&&this.i18nSubscription.unsubscribe()},e.ID_SEED=0,e.decorators=[{type:t.Component,args:[{selector:"d-transfer",template:'<div class="container">\r\n <div class="source">\r\n <div class="left">\r\n <ng-container *ngIf="!sourceCustomViewTemplate">\r\n <div class="title">\r\n <d-checkbox\r\n [label]="titles.source"\r\n [disabled]="disabled || sourceDisplayOptionLen === 0"\r\n [isShowTitle]="false"\r\n (change)="checkAll(transferDirection.SOURCE, $event)"\r\n [halfchecked]="sourceHalfChecked"\r\n [(ngModel)]="sourceAllChecked"\r\n >\r\n </d-checkbox>\r\n <span class="num">{{ sourceCheckedLen }}/{{ sourceDisplayOptionLen }}</span>\r\n </div>\r\n <div class="line"></div>\r\n <div class="content" [class.disabled]="disabled">\r\n <div class="search" *ngIf="isSearch">\r\n <d-search\r\n style="width:100%"\r\n [placeholder]="i18nCommonText?.searchPlaceholder"\r\n [size]="\'sm\'"\r\n [(ngModel)]="sourceSearchText"\r\n (searchFn)="search(transferDirection.SOURCE, $event)"\r\n ></d-search>\r\n </div>\r\n <ul\r\n [id]="\'default-left-\' + id"\r\n dDroppable\r\n [placeholderTag]="\'li\'"\r\n [dropScope]="\'transfer-source-\' + id"\r\n (onDrop)="onDrop(transferDirection.SOURCE, $event)"\r\n [ngStyle]="{ height: height }"\r\n dSortable\r\n >\r\n <li\r\n dDraggable\r\n [enableDragFollow]="true"\r\n [dragScope]="\'transfer-source-\' + id"\r\n [dragHandle]="\'.drag-handle\'"\r\n [dragData]="item"\r\n [dragHandleClass]="\'drag-handle\'"\r\n *ngFor="let item of sourceDisplayOption; let i = index"\r\n >\r\n <span class="drag-ico">\r\n <svg\r\n *ngIf="isSourceDroppable"\r\n [class.disabled]="disabled"\r\n class="drag-handle"\r\n width="16px"\r\n height="16px"\r\n viewBox="0 0 16 16"\r\n version="1.1"\r\n xmlns="http://www.w3.org/2000/svg"\r\n xmlns:xlink="http://www.w3.org/1999/xlink"\r\n >\r\n <g id="draggable-big-left" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n <g fill="#CACFD8" fill-rule="nonzero">\r\n <path\r\n d="M5.5,0 C6.32842712,-1.3527075e-16 7,0.596953667 7,1.33333333 C7,2.069713 6.32842712,2.66666667 5.5,2.66666667 C4.67157288,2.66666667 4,2.069713 4,1.33333333 C4,0.596953667 4.67157288,1.3527075e-16 5.5,0 Z M5.5,4.44444444 C6.32842712,4.44444444 7,5.04139811 7,5.77777778 C7,6.51415744 6.32842712,7.11111111 5.5,7.11111111 C4.67157288,7.11111111 4,6.51415744 4,5.77777778 C4,5.04139811 4.67157288,4.44444444 5.5,4.44444444 Z M5.5,8.88888889 C6.32842712,8.88888889 7,9.48584256 7,10.2222222 C7,10.9586019 6.32842712,11.5555556 5.5,11.5555556 C4.67157288,11.5555556 4,10.9586019 4,10.2222222 C4,9.48584256 4.67157288,8.88888889 5.5,8.88888889 Z M5.5,13.3333333 C6.32842712,13.3333333 7,13.930287 7,14.6666667 C7,15.4030463 6.32842712,16 5.5,16 C4.67157288,16 4,15.4030463 4,14.6666667 C4,13.930287 4.67157288,13.3333333 5.5,13.3333333 Z M10.5,0 C11.3284271,-1.3527075e-16 12,0.596953667 12,1.33333333 C12,2.069713 11.3284271,2.66666667 10.5,2.66666667 C9.67157288,2.66666667 9,2.069713 9,1.33333333 C9,0.596953667 9.67157288,1.3527075e-16 10.5,0 Z M10.5,4.44444444 C11.3284271,4.44444444 12,5.04139811 12,5.77777778 C12,6.51415744 11.3284271,7.11111111 10.5,7.11111111 C9.67157288,7.11111111 9,6.51415744 9,5.77777778 C9,5.04139811 9.67157288,4.44444444 10.5,4.44444444 Z M10.5,8.88888889 C11.3284271,8.88888889 12,9.48584256 12,10.2222222 C12,10.9586019 11.3284271,11.5555556 10.5,11.5555556 C9.67157288,11.5555556 9,10.9586019 9,10.2222222 C9,9.48584256 9.67157288,8.88888889 10.5,8.88888889 Z M10.5,13.3333333 C11.3284271,13.3333333 12,13.930287 12,14.6666667 C12,15.4030463 11.3284271,16 10.5,16 C9.67157288,16 9,15.4030463 9,14.6666667 C9,13.930287 9.67157288,13.3333333 10.5,13.3333333 Z"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n <d-checkbox\r\n [label]="item[\'name\']"\r\n [isShowTitle]="false"\r\n [(ngModel)]="item[\'checked\']"\r\n [disabled]="item[\'disabled\'] || disabled"\r\n (change)="checkboxChange(transferDirection.SOURCE, $event)"\r\n >\r\n </d-checkbox>\r\n </li>\r\n </ul>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf="sourceCustomViewTemplate">\r\n <ng-template [ngTemplateOutlet]="sourceCustomViewTemplate" [ngTemplateOutletContext]="{$implicit: this}"></ng-template>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div class="option">\r\n <div class="transfer-op">\r\n <svg\r\n *ngIf="!sourceCanTransfer"\r\n width="36px"\r\n height="36px"\r\n viewBox="0 0 36 36"\r\n class="default-svg"\r\n version="1.1"\r\n xmlns="http://www.w3.org/2000/svg"\r\n xmlns:xlink="http://www.w3.org/1999/xlink"\r\n >\r\n <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n <g id="transfer" transform="translate(-942.000000, -542.000000)">\r\n <g\r\n id="transfer_icon/left-default"\r\n transform="translate(960.000000, 560.000000) scale(-1, 1) translate(-960.000000, -560.000000) translate(942.000000, 542.000000)"\r\n >\r\n <circle stroke="" fill="" cx="18" cy="18" r="17.5"></circle>\r\n <path\r\n d="M20,22.003961 C20,22.2801034 20.2238576,22.503961 20.5,22.503961 C20.7761424,22.503961 21,22.2801034 21,22.003961 L21,13.503961 L12.5,13.503961 C12.2238576,13.503961 12,13.7278187 12,14.003961 C12,14.2801034 12.2238576,14.503961 12.5,14.503961 L20,14.503961 L20,22.003961 Z"\r\n fill="#CACFD8"\r\n fill-rule="nonzero"\r\n transform="translate(16.500000, 18.003961) rotate(-315.000000) translate(-16.500000, -18.003961) "\r\n ></path>\r\n </g>\r\n </g>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf="sourceCanTransfer"\r\n [class.disabled]="disabled"\r\n (click)="transferTo(transferDirection.SOURCE)"\r\n width="36px"\r\n height="36px"\r\n class="active-svg"\r\n viewBox="0 0 36 36"\r\n version="1.1"\r\n xmlns="http://www.w3.org/2000/svg"\r\n xmlns:xlink="http://www.w3.org/1999/xlink"\r\n >\r\n <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n <g id="transfer-right" transform="translate(-942.000000, -1086.000000)">\r\n <g id="transfer_icon/left-activated" transform="translate(942.000000, 1086.000000)">\r\n <circle fill="#5170FF" cx="18" cy="18" r="18"></circle>\r\n <path\r\n d="M23,22.003961 C23,22.2801034 23.2238576,22.503961 23.5,22.503961 C23.7761424,22.503961 24,22.2801034 24,22.003961 L24,13.503961 L15.5,13.503961 C15.2238576,13.503961 15,13.7278187 15,14.003961 C15,14.2801034 15.2238576,14.503961 15.5,14.503961 L23,14.503961 L23,22.003961 Z"\r\n fill="#FFFFFF"\r\n fill-rule="nonzero"\r\n transform="translate(19.500000, 18.003961) scale(-1, 1) rotate(-315.000000) translate(-19.500000, -18.003961) "\r\n ></path>\r\n </g>\r\n </g>\r\n </g>\r\n </svg>\r\n </div>\r\n <div class="transfer-op" style="margin-top:10px;">\r\n <svg\r\n width="36px"\r\n *ngIf="!targetCanTransfer"\r\n height="36px"\r\n viewBox="0 0 36 36"\r\n class="default-svg"\r\n version="1.1"\r\n xmlns="http://www.w3.org/2000/svg"\r\n xmlns:xlink="http://www.w3.org/1999/xlink"\r\n >\r\n <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n <g id="transfer-left" transform="translate(-942.000000, -1030.000000)">\r\n <g id="transfer_icon/right-default" transform="translate(942.000000, 1030.000000)">\r\n <circle stroke="" fill="" cx="18" cy="18" r="17.5"></circle>\r\n <path\r\n d="M20,22.003961 C20,22.2801034 20.2238576,22.503961 20.5,22.503961 C20.7761424,22.503961 21,22.2801034 21,22.003961 L21,13.503961 L12.5,13.503961 C12.2238576,13.503961 12,13.7278187 12,14.003961 C12,14.2801034 12.2238576,14.503961 12.5,14.503961 L20,14.503961 L20,22.003961 Z"\r\n fill="#CACFD8"\r\n fill-rule="nonzero"\r\n transform="translate(16.500000, 18.003961) rotate(-315.000000) translate(-16.500000, -18.003961) "\r\n ></path>\r\n </g>\r\n </g>\r\n </g>\r\n </svg>\r\n <svg\r\n width="36px"\r\n [class.disabled]="disabled"\r\n *ngIf="targetCanTransfer"\r\n (click)="transferTo(transferDirection.TARGET)"\r\n height="36px"\r\n viewBox="0 0 36 36"\r\n version="1.1"\r\n class="active-svg"\r\n xmlns="http://www.w3.org/2000/svg"\r\n xmlns:xlink="http://www.w3.org/1999/xlink"\r\n >\r\n <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n <g id="transfer" transform="translate(-942.000000, -486.000000)">\r\n <g\r\n id="transfer_icon/right-activated"\r\n transform="translate(960.000000, 504.000000) scale(-1, 1) translate(-960.000000, -504.000000) translate(942.000000, 486.000000)"\r\n >\r\n <circle fill="#5170FF" cx="18" cy="18" r="18"></circle>\r\n <path\r\n d="M23,22.003961 C23,22.2801034 23.2238576,22.503961 23.5,22.503961 C23.7761424,22.503961 24,22.2801034 24,22.003961 L24,13.503961 L15.5,13.503961 C15.2238576,13.503961 15,13.7278187 15,14.003961 C15,14.2801034 15.2238576,14.503961 15.5,14.503961 L23,14.503961 L23,22.003961 Z"\r\n fill="#FFFFFF"\r\n fill-rule="nonzero"\r\n transform="translate(19.500000, 18.003961) scale(-1, 1) rotate(-315.000000) translate(-19.500000, -18.003961) "\r\n ></path>\r\n </g>\r\n </g>\r\n </g>\r\n </svg>\r\n </div>\r\n </div>\r\n <div class="target">\r\n <div class="right">\r\n <ng-container *ngIf="!targetCustomViewTemplate">\r\n <div class="title">\r\n <d-checkbox\r\n [disabled]="disabled || targetDisplayOptionLen === 0"\r\n [label]="titles.target"\r\n [isShowTitle]="false"\r\n (change)="checkAll(transferDirection.TARGET, $event)"\r\n [halfchecked]="targetHalfChecked"\r\n [(ngModel)]="targetAllChecked"\r\n >\r\n </d-checkbox>\r\n <span class="num">{{ targetCheckedLen }}/{{ targetDisplayOptionLen }}</span>\r\n </div>\r\n <div class="line"></div>\r\n <div class="content" [class.disabled]="disabled">\r\n <div class="search" *ngIf="isSearch" [class.disabled]="disabled">\r\n <d-search\r\n style="width:100%"\r\n [placeholder]="i18nCommonText?.searchPlaceholder"\r\n [size]="\'sm\'"\r\n [(ngModel)]="targetSearchText"\r\n (searchFn)="search(transferDirection.TARGET, $event)"\r\n ></d-search>\r\n </div>\r\n <ul\r\n dDroppable\r\n dSortable\r\n [placeholderTag]="\'li\'"\r\n [dropScope]="\'transfer-target-\' + id"\r\n (onDrop)="onDrop(transferDirection.TARGET, $event)"\r\n [ngStyle]="{ height: height }"\r\n >\r\n <li\r\n dDraggable\r\n [enableDragFollow]="true"\r\n [dragScope]="\'transfer-target-\' + id"\r\n [dragHandle]="\'.drag-handle\'"\r\n [dragData]="item"\r\n [dragHandleClass]="\'drag-handle\'"\r\n *ngFor="let item of targetDisplayOption; let i = index"\r\n >\r\n <span class="drag-ico">\r\n <svg\r\n *ngIf="isTargetDroppable"\r\n [class.disabled]="disabled"\r\n class="drag-handle"\r\n width="16px"\r\n height="16px"\r\n viewBox="0 0 16 16"\r\n version="1.1"\r\n xmlns="http://www.w3.org/2000/svg"\r\n xmlns:xlink="http://www.w3.org/1999/xlink"\r\n >\r\n <g id="draggable-big-right" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n <g fill="#CACFD8" fill-rule="nonzero">\r\n <path\r\n d="M5.5,0 C6.32842712,-1.3527075e-16 7,0.596953667 7,1.33333333 C7,2.069713 6.32842712,2.66666667 5.5,2.66666667 C4.67157288,2.66666667 4,2.069713 4,1.33333333 C4,0.596953667 4.67157288,1.3527075e-16 5.5,0 Z M5.5,4.44444444 C6.32842712,4.44444444 7,5.04139811 7,5.77777778 C7,6.51415744 6.32842712,7.11111111 5.5,7.11111111 C4.67157288,7.11111111 4,6.51415744 4,5.77777778 C4,5.04139811 4.67157288,4.44444444 5.5,4.44444444 Z M5.5,8.88888889 C6.32842712,8.88888889 7,9.48584256 7,10.2222222 C7,10.9586019 6.32842712,11.5555556 5.5,11.5555556 C4.67157288,11.5555556 4,10.9586019 4,10.2222222 C4,9.48584256 4.67157288,8.88888889 5.5,8.88888889 Z M5.5,13.3333333 C6.32842712,13.3333333 7,13.930287 7,14.6666667 C7,15.4030463 6.32842712,16 5.5,16 C4.67157288,16 4,15.4030463 4,14.6666667 C4,13.930287 4.67157288,13.3333333 5.5,13.3333333 Z M10.5,0 C11.3284271,-1.3527075e-16 12,0.596953667 12,1.33333333 C12,2.069713 11.3284271,2.66666667 10.5,2.66666667 C9.67157288,2.66666667 9,2.069713 9,1.33333333 C9,0.596953667 9.67157288,1.3527075e-16 10.5,0 Z M10.5,4.44444444 C11.3284271,4.44444444 12,5.04139811 12,5.77777778 C12,6.51415744 11.3284271,7.11111111 10.5,7.11111111 C9.67157288,7.11111111 9,6.51415744 9,5.77777778 C9,5.04139811 9.67157288,4.44444444 10.5,4.44444444 Z M10.5,8.88888889 C11.3284271,8.88888889 12,9.48584256 12,10.2222222 C12,10.9586019 11.3284271,11.5555556 10.5,11.5555556 C9.67157288,11.5555556 9,10.9586019 9,10.2222222 C9,9.48584256 9.67157288,8.88888889 10.5,8.88888889 Z M10.5,13.3333333 C11.3284271,13.3333333 12,13.930287 12,14.6666667 C12,15.4030463 11.3284271,16 10.5,16 C9.67157288,16 9,15.4030463 9,14.6666667 C9,13.930287 9.67157288,13.3333333 10.5,13.3333333 Z"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n <d-checkbox\r\n [label]="item[\'name\']"\r\n [isShowTitle]="false"\r\n [(ngModel)]="item[\'checked\']"\r\n [disabled]="item[\'disabled\'] || disabled"\r\n (change)="checkboxChange(transferDirection.TARGET, $event)"\r\n >\r\n </d-checkbox>\r\n </li>\r\n </ul>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf="targetCustomViewTemplate">\r\n <ng-template [ngTemplateOutlet]="targetCustomViewTemplate" [ngTemplateOutletContext]="{$implicit: this}"></ng-template>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</div>\r\n',styles:[".container{width:100%;display:-webkit-box;display:flex;flex-wrap:warp;-webkit-box-pack:center;justify-content:center;-moz-justfy-center:center;-ms-justify-center:center;-o-justfy-cneter:center;-webkit-box-align:center;align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center}.source,.target{width:48%;border:1px solid #adb0b8}.option{padding:0 10px}.search{margin:0 15px 10px 20px}.num{-webkit-box-flex:1;flex:1;text-align:right;-ms-grid-row-align:center;align-self:center;-webkit-align-self:center;-moz-align-self:center;-ms-align-self:center;-o-align-self:center;font-size:12px;color:#575d6c;margin-right:10px}.disabled{opacity:.3;cursor:not-allowed}.transfer-op .default-svg circle{fill:#fff;stroke:#e3e5e9}.transfer-op .active-svg circle{fill:#5e7ce0}.content ul{overflow:auto}.content li{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;height:36px;line-height:36px}.content li:hover svg{display:inline-block;cursor:move}.content li .drag-ico{display:inline-block;width:16px;height:16px;line-height:16px;margin-right:5px}.content li svg{display:none}.content li .drag-handle{width:16px;height:16px}.title{display:-webkit-box;display:flex;height:40px;line-height:40px;-webkit-box-align:center;align-items:center;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;margin-left:20px}.line{height:1px;background:#dfe1e6;margin-bottom:10px}.option-btn{display:inline-block}"]}]}],e.ctorParameters=function(){return[{type:r.I18nService}]},e.propDecorators={sourceOption:[{type:t.Input}],targetOption:[{type:t.Input}],titles:[{type:t.Input}],height:[{type:t.Input}],isSearch:[{type:t.Input}],disabled:[{type:t.Input}],isSourceDroppable:[{type:t.Input}],isTargetDroppable:[{type:t.Input}],customSourceCheckedLen:[{type:t.Input}],customTargetCheckedLen:[{type:t.Input}],sourceCustomViewTemplate:[{type:t.ContentChild,args:["sourceTemplate",{static:!1}]}],targetCustomViewTemplate:[{type:t.ContentChild,args:["targetTemplate",{static:!1}]}],transferToTarget:[{type:t.Output}],transferToSource:[{type:t.Output}]},e}();var h=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule,i.FormsModule,a.SearchModule,s.CheckBoxModule,o.DragDropModule],exports:[c],declarations:[c],providers:[]}]}],e}();e.TransferComponent=c,e.TransferDirection=l,e.TransferModule=h,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=ng-devui-transfer.umd.min.js.map