@sd-angular/core/bundles/sd-angular-core-table.umd.min.js

Sd Angular Core Lib

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@sd-angular/core/common"),require("@angular/core"),require("@angular/common"),require("@angular/material/icon"),require("@angular/material/paginator"),require("@angular/material/sort"),require("@angular/material/table"),require("@angular/animations"),require("uuid"),require("rxjs"),require("@sd-angular/core/notify"),require("rxjs/operators"),require("@sd-angular/core/modal"),require("ngx-device-detector"),require("@sd-angular/core/export"),require("@sd-angular/core/setting"),require("@sd-angular/core/quick-action"),require("object-hash"),require("@angular/cdk/drag-drop"),require("@sd-angular/core/loading"),require("@sd-angular/core/translate"),require("@angular/forms"),require("@angular/material/progress-spinner"),require("@angular/cdk/table"),require("@angular/material/menu"),require("@angular/material/button"),require("@sd-angular/core/service"),require("@angular/material/tooltip"),require("@angular/material/slide-toggle"),require("@sd-angular/core/form"),require("@angular/material/checkbox"),require("@angular/material/list"),require("@sd-angular/core/group"),require("@angular/material/chips")):"function"==typeof define&&define.amd?define("@sd-angular/core/table",["exports","@sd-angular/core/common","@angular/core","@angular/common","@angular/material/icon","@angular/material/paginator","@angular/material/sort","@angular/material/table","@angular/animations","uuid","rxjs","@sd-angular/core/notify","rxjs/operators","@sd-angular/core/modal","ngx-device-detector","@sd-angular/core/export","@sd-angular/core/setting","@sd-angular/core/quick-action","object-hash","@angular/cdk/drag-drop","@sd-angular/core/loading","@sd-angular/core/translate","@angular/forms","@angular/material/progress-spinner","@angular/cdk/table","@angular/material/menu","@angular/material/button","@sd-angular/core/service","@angular/material/tooltip","@angular/material/slide-toggle","@sd-angular/core/form","@angular/material/checkbox","@angular/material/list","@sd-angular/core/group","@angular/material/chips"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["sd-angular"]=e["sd-angular"]||{},e["sd-angular"].core=e["sd-angular"].core||{},e["sd-angular"].core.table={}),e["sd-angular"].core.common,e.ng.core,e.ng.common,e.ng.material.icon,e.ng.material.paginator,e.ng.material.sort,e.ng.material.table,e.ng.animations,e.uuid,e.rxjs,e["sd-angular"].core.notify,e.rxjs.operators,e["sd-angular"].core.modal,e["ngx-device-detector"],e["sd-angular"].core.export,e["sd-angular"].core.setting,e["sd-angular"].core["quick-action"],e["object-hash"],e.ng.cdk.dragDrop,e["sd-angular"].core.loading,e["sd-angular"].core.translate,e.ng.forms,e.ng.material.progressSpinner,e.ng.cdk.table,e.ng.material.menu,e.ng.material.button,e["sd-angular"].core.service,e.ng.material.tooltip,e.ng.material.slideToggle,e["sd-angular"].core.form,e.ng.material.checkbox,e.ng.material.list,e["sd-angular"].core.group,e.ng.material.chips)}(this,(function(e,t,n,r,i,l,o,a,s,c,d,u,f,p,m,h,g,v,y,b,x,F,w,C,O,D,S,k,I,T,E,A,M,P,R){"use strict";function L(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function j(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var z=j(y),N=L(y),H=function(e){this.templateRef=e};H.decorators=[{type:n.Directive,args:[{selector:"[sdTableCellDef]"}]}],H.ctorParameters=function(){return[{type:n.TemplateRef}]},H.propDecorators={sdTableCellDef:[{type:n.Input}]};var V=function(){function e(e){this.templateRef=e}return Object.defineProperty(e.prototype,"showing",{set:function(e){this.defaultShowing=""===e||e},enumerable:!1,configurable:!0}),e}();V.decorators=[{type:n.Directive,args:[{selector:"[sdTableFilterDef]"}]}],V.ctorParameters=function(){return[{type:n.TemplateRef}]},V.propDecorators={sdTableFilterDef:[{type:n.Input}],showing:[{type:n.Input,args:["defaultShowing"]}]};
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */
var q=function(e,t){return(q=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)};function W(e,t,n,r){return new(n||(n=Promise))((function(i,l){function o(e){try{s(r.next(e))}catch(e){l(e)}}function a(e){try{s(r.throw(e))}catch(e){l(e)}}function s(e){var t;e.done?i(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(o,a)}s((r=r.apply(e,t||[])).next())}))}function B(e,t){var n,r,i,l,o={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return l={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(l[Symbol.iterator]=function(){return this}),l;function a(l){return function(a){return function(l){if(n)throw new TypeError("Generator is already executing.");for(;o;)try{if(n=1,r&&(i=2&l[0]?r.return:l[0]?r.throw||((i=r.return)&&i.call(r),0):r.next)&&!(i=i.call(r,l[1])).done)return i;switch(r=0,i&&(l=[2&l[0],i.value]),l[0]){case 0:case 1:i=l;break;case 4:return o.label++,{value:l[1],done:!1};case 5:o.label++,r=l[1],l=[0];continue;case 7:l=o.ops.pop(),o.trys.pop();continue;default:if(!(i=o.trys,(i=i.length>0&&i[i.length-1])||6!==l[0]&&2!==l[0])){o=0;continue}if(3===l[0]&&(!i||l[1]>i[0]&&l[1]<i[3])){o.label=l[1];break}if(6===l[0]&&o.label<i[1]){o.label=i[1],i=l;break}if(i&&o.label<i[2]){o.label=i[2],o.ops.push(l);break}i[2]&&o.ops.pop(),o.trys.pop();continue}l=t.call(e,o)}catch(e){l=[6,e],r=0}finally{n=i=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}([l,a])}}}Object.create;function U(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],r=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&r>=e.length&&(e=void 0),{value:e&&e[r++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function Q(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var r,i,l=n.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(r=l.next()).done;)o.push(r.value)}catch(e){i={error:e}}finally{try{r&&!r.done&&(n=l.return)&&n.call(l)}finally{if(i)throw i.error}}return o}function G(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(Q(arguments[t]));return e}Object.create;function J(e,t,n,r){if("a"===n&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!r:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?r:"a"===n?r.call(e):r?r.value:t.get(e)}function K(e,t,n,r,i){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!i:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?i.call(e,n):i?i.value=n:t.set(e,n),n}var Y,Z,X={paginate:{pageSize:20,pages:[20,50,100,200]}},_=new n.InjectionToken("sd-table.configuration"),$=function(){function e(e){var t=this;this.cdRef=e,Y.set(this,void 0),this.externalFilters=[],this.externalFilter={},this.inlineExternal={},this.columns=[],this.columnFilter={},this.inlineColumn={},this.filterDefs=[],this.filterDef={},this.inlineFilterDef={},this.open=function(){var e=J(t,Y).configuration.get();t.inlineColumn=JSON.parse(JSON.stringify(e.inlineColumn)),t.inlineExternal=JSON.parse(JSON.stringify(e.inlineExternal)),t.inlineFilterDef=JSON.parse(JSON.stringify(e.inlineFilterDef));var n=J(t,Y).value.get();t.columnFilter=JSON.parse(JSON.stringify(n.columnFilter)),t.externalFilter=JSON.parse(JSON.stringify(n.externalFilter)),t.filterDef=JSON.parse(JSON.stringify(n.filterDef)),t.modal.open(),t.cdRef.markForCheck()},this.close=function(){t.modal.close(),t.cdRef.markForCheck()},this.onApply=function(){J(t,Y).configuration.set({inlineColumn:t.inlineColumn,inlineExternal:t.inlineExternal,inlineFilterDef:t.inlineFilterDef}),J(t,Y).value.set({columnFilter:t.columnFilter,externalFilter:t.externalFilter,filterDef:t.filterDef}),t.modal.close(),t.cdRef.markForCheck()}}return Object.defineProperty(e.prototype,"filterRegister",{set:function(e){K(this,Y,e)},enumerable:!1,configurable:!0}),e.prototype.ngAfterViewInit=function(){},e.prototype.ngOnDestroy=function(){},e.prototype.onClear=function(){J(this,Y).value.remove(),this.modal.close(),this.cdRef.markForCheck()},e}();Y=new WeakMap,$.decorators=[{type:n.Component,args:[{selector:"sd-popup-filter",template:'<sd-modal width="500px" [title]="\'Filter\' | sdTranslate">\r\n  <sd-modal-body class="c-popup-filter">\r\n    <ng-container *ngFor="let column of columns | sdFilterColumn">\r\n      <div class="d-flex align-items-baseline">\r\n        <ng-container>\r\n          <div *sdDesktop class="c-checkable">\r\n            <mat-slide-toggle [(ngModel)]="inlineColumn[column.field]" color="primary"></mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class="c-filterable">\r\n          <sd-input\r\n            *ngIf="column.type === \'string\'"\r\n            [label]="column.title"\r\n            type="text"\r\n            [(model)]="columnFilter[column.field]"\r\n            appearance="outline">\r\n          </sd-input>\r\n          <sd-input\r\n            *ngIf="column.type === \'number\'"\r\n            [label]="column.title"\r\n            type=" number"\r\n            [(model)]="columnFilter[column.field]"\r\n            appearance="outline">\r\n          </sd-input>\r\n          <sd-select\r\n            *ngIf="column.type === \'bool\'"\r\n            [label]="column.title"\r\n            [items]="[\r\n              { value: \'1\', display: column.trueValue || \'True\' },\r\n              { value: \'0\', display: column.falseValue || \'False\' }\r\n            ]"\r\n            valueField="value"\r\n            displayField="display"\r\n            [(model)]="columnFilter[column.field]"\r\n            appearance="outline">\r\n          </sd-select>\r\n          <sd-autocomplete\r\n            *ngIf="column.type === \'values\' || column.type === \'lazy-values\'"\r\n            [label]="column.title"\r\n            [items]="column.option.items"\r\n            [valueField]="column.option.valueField"\r\n            [displayField]="column.option.displayField"\r\n            [(model)]="columnFilter[column.field]"\r\n            appearance="outline">\r\n          </sd-autocomplete>\r\n          <sd-date-time\r\n            *ngIf="column.type === \'date\' || column.type === \'datetime\' || column.type === \'time\'"\r\n            [label]="column.title"\r\n            [(model)]="columnFilter[column.field]"\r\n            type="date"\r\n            appearance="outline">\r\n          </sd-date-time>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngFor="let item of externalFilters | sdFilterExternal">\r\n      <div class="d-flex align-items-baseline">\r\n        <ng-container>\r\n          <div *sdDesktop class="c-checkable">\r\n            <mat-slide-toggle [(ngModel)]="inlineExternal[item.field]" color="primary"></mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class="c-filterable">\r\n          <sd-input\r\n            [label]="item.title"\r\n            *ngIf="item.type === \'string\'"\r\n            type="text"\r\n            [(model)]="externalFilter[item.field]"\r\n            appearance="outline">\r\n          </sd-input>\r\n          <sd-input-number [label]="item.title" *ngIf="item.type === \'number\'" [(model)]="externalFilter[item.field]" appearance="outline">\r\n          </sd-input-number>\r\n          <sd-select\r\n            [label]="item.title"\r\n            *ngIf="item.type === \'bool\'"\r\n            [items]="[\r\n              { value: \'1\', display: item.option?.displayOnTrue || \'True\' },\r\n              { value: \'0\', display: item.option?.displayOnFalse || \'False\' }\r\n            ]"\r\n            valueField="value"\r\n            displayField="display"\r\n            [(model)]="externalFilter[item.field]"\r\n            appearance="outline">\r\n          </sd-select>\r\n          <ng-container *ngIf="item.type === \'values\' && item.option">\r\n            <sd-select\r\n              *ngIf="item.option?.selection === \'MULTIPLE\'"\r\n              [label]="item.title"\r\n              [items]="item.option.items"\r\n              [valueField]="item.option.valueField"\r\n              [displayField]="item.option.displayField"\r\n              [(model)]="externalFilter[item.field]"\r\n              [selectAll]="item.option.selectAll"\r\n              appearance="outline"\r\n              multiple>\r\n            </sd-select>\r\n            <sd-autocomplete\r\n              *ngIf="item.option?.selection === \'AUTOCOMPLETE\'"\r\n              [label]="item.title"\r\n              [items]="item.option.items"\r\n              [valueField]="item.option.valueField"\r\n              [displayField]="item.option.displayField"\r\n              [(model)]="externalFilter[item.field]"\r\n              appearance="outline">\r\n            </sd-autocomplete>\r\n            <sd-select\r\n              *ngIf="item.option?.selection === \'MULTIPLEAUTOCOMPLETE\'"\r\n              [label]="item.title"\r\n              [items]="item.option.items"\r\n              [valueField]="item.option.valueField"\r\n              [displayField]="item.option.displayField"\r\n              [(model)]="externalFilter[item.field]"\r\n              filtered\r\n              appearance="outline"\r\n              multiple>\r\n            </sd-select>\r\n            <sd-select\r\n              *ngIf="!item.option?.selection"\r\n              [label]="item.title"\r\n              [items]="item.option.items"\r\n              [valueField]="item.option.valueField"\r\n              [displayField]="item.option.displayField"\r\n              [(model)]="externalFilter[item.field]"\r\n              appearance="outline">\r\n            </sd-select>\r\n          </ng-container>\r\n          <ng-container *ngIf="item.type === \'lazy-values\' && item.option">\r\n            <sd-select\r\n              *ngIf="item.option?.selection === \'MULTIPLE\'"\r\n              [label]="item.title"\r\n              [items]="item.option.items"\r\n              [valueField]="item.option.valueField"\r\n              [displayField]="item.option.displayField"\r\n              [(model)]="externalFilter[item.field]"\r\n              appearance="outline"\r\n              multiple\r\n              filtered>\r\n            </sd-select>\r\n            <sd-autocomplete\r\n              *ngIf="!item.option?.selection"\r\n              [label]="item.title"\r\n              [items]="item.option.items"\r\n              [valueField]="item.option.valueField"\r\n              [displayField]="item.option.displayField"\r\n              [(model)]="externalFilter[item.field]"\r\n              appearance="outline">\r\n            </sd-autocomplete>\r\n          </ng-container>\r\n          <sd-date-time\r\n            [label]="item.title"\r\n            *ngIf="item.type === \'date\' || item.type === \'datetime\'"\r\n            [(model)]="externalFilter[item.field]"\r\n            [type]="item.type"\r\n            appearance="outline">\r\n          </sd-date-time>\r\n          <sd-date-range\r\n            [label]="item.title"\r\n            *ngIf="item.type === \'daterange\' && externalFilter[item.field]"\r\n            [(from)]="externalFilter[item.field].from"\r\n            [(to)]="externalFilter[item.field].to"\r\n            [min]="item.minDate"\r\n            [max]="item.maxDate"\r\n            appearance="outline">\r\n          </sd-date-range>\r\n          <ng-container *ngIf="item.type === \'custom\' && item.filterDef">\r\n            <ng-container *ngTemplateOutlet="item.filterDef; context: { externalFilter: externalFilter }"> </ng-container>\r\n          </ng-container>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngFor="let filter of filterDefs">\r\n      <div class="d-flex align-items-baseline">\r\n        <ng-container>\r\n          <div *sdDesktop class="c-checkable">\r\n            <mat-slide-toggle [(ngModel)]="inlineFilterDef[filter.sdTableFilterDef]" color="primary"> </mat-slide-toggle>\r\n          </div>\r\n        </ng-container>\r\n        <div class="c-filterable">\r\n          <ng-container *ngTemplateOutlet="filter.templateRef; context: { filterDef: filterDef }"> </ng-container>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n  </sd-modal-body>\r\n  <sd-modal-footer *sdDesktop>\r\n    <sd-button class="mr-auto" (action)="onClear()" title="Mặc định" size="sm" type="link"> </sd-button>\r\n    <sd-button (action)="onApply()" title="Đồng ý" color="primary" size="sm" type="fill"></sd-button>\r\n  </sd-modal-footer>\r\n  <sd-modal-footer *sdMobileTablet>\r\n    <sd-button style="flex: 1; padding-right: 5px" (action)="onClear()" title="Mặc định" width="100%" size="sm" type="link"></sd-button>\r\n    <sd-button\r\n      style="flex: 1; padding-left: 5px"\r\n      (action)="onApply()"\r\n      title="Đồng ý"\r\n      color="primary"\r\n      width="100%"\r\n      size="sm"\r\n      type="fill"></sd-button>\r\n  </sd-modal-footer>\r\n</sd-modal>\r\n',changeDetection:n.ChangeDetectionStrategy.OnPush,styles:[".c-checkable{width:50px}.c-filterable{flex:1}::ng-deep sd-modal-body.c-popup-filter .mat-form-field-wrapper{padding-bottom:0}"]}]}],$.ctorParameters=function(){return[{type:n.ChangeDetectorRef}]},$.propDecorators={modal:[{type:n.ViewChild,args:[p.SdModal]}],filterRegister:[{type:n.Input}],externalFilters:[{type:n.Input}],columns:[{type:n.Input}],filterDefs:[{type:n.Input}]};var ee=function(){function e(e,t){var n=this;this.ref=e,this.deviceService=t,this.columns=[],this.externalFilters=[],this.filterDefs=[],this.filterRegisterChange=new d.BehaviorSubject(null),this.filterDef={},this.inlineFilterDef={},this.columnFilter={},this.inlineColumn={},this.externalFilter={},this.inlineExternal={},Z.set(this,new d.Subscription),this.onFilter=function(e){n.filterRegister.value.set({columnFilter:n.columnFilter,externalFilter:n.externalFilter,filterDef:n.filterDef})},this.updateFilter=function(){n.filterRegister.value.set({columnFilter:n.columnFilter,externalFilter:n.externalFilter,filterDef:n.filterDef,notReload:!0})},this.open=function(){n.popupFilter.open()},this.isMobileOrTablet=!this.deviceService.isDesktop(),this.ref.markForCheck()}return Object.defineProperty(e.prototype,"_filter",{set:function(e){this.filter=e},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"_externalFilters",{set:function(e){this.externalFilters=e||[]},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"_filterRegister",{set:function(e){this.filterRegister=e,this.filterRegisterChange.next(this.filterRegister)},enumerable:!1,configurable:!0}),e.prototype.ngAfterViewInit=function(){var e=this;J(this,Z).add(this.filterRegisterChange.pipe(f.startWith(this.filterRegister)).subscribe((function(t){e.filterRegister&&(J(e,Z).add(e.filterRegister.configuration.observer.subscribe((function(t){var n=t.inlineColumn,r=t.inlineExternal,i=t.inlineFilterDef;e.inlineColumn=n,e.inlineExternal=r,e.inlineFilterDef=i,e.ref.markForCheck()}))),J(e,Z).add(e.filterRegister.value.observer.subscribe((function(t){var n=t.columnFilter,r=t.externalFilter,i=t.filterDef;e.columnFilter=n,e.externalFilter=r,e.filterDef=i,e.ref.markForCheck()}))))})))},e.prototype.ngOnDestroy=function(){J(this,Z).unsubscribe()},e}();Z=new WeakMap,ee.decorators=[{type:n.Component,args:[{selector:"sd-table-filter",template:'<ng-container *ngIf="!filter?.disabled">\r\n  <ng-container *ngIf="filter?.enableCollapse; else noCollapse">\r\n    <sd-group class="p-12" [isExpanded]="false" title="Tìm kiếm" expandable>\r\n      <div sdGroupBody>\r\n        <ng-container *ngTemplateOutlet="noCollapse"></ng-container>\r\n      </div>\r\n    </sd-group>\r\n  </ng-container>\r\n  <ng-template #noCollapse>\r\n    <div *ngIf="!isMobileOrTablet && (externalFilters?.length || filterDefs?.length)" class="row mx-0 mb-8">\r\n      <ng-container *ngIf="filter?.sorts?.length">\r\n        <ng-container *ngFor="let field of filter?.sorts">\r\n          <ng-container *ngIf="externalFilters?.length">\r\n            <ng-container *ngFor="let item of externalFilters | sdFilterExternal : field">\r\n              <ng-container *ngTemplateOutlet="filterExternal; context: { item: item }"></ng-container>\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngFor="let item of filterDefs">\r\n            <div *ngIf="inlineFilterDef[item.sdTableFilterDef] && item.sdTableFilterDef === field" class="col-lg-2 col-md-3 col-sm-6 px-8">\r\n              <ng-container *ngTemplateOutlet="item.templateRef; context: { filterDef: filterDef, isInline: true }"> </ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-container *ngIf="!filter?.sorts?.length">\r\n        <ng-container *ngIf="externalFilters?.length">\r\n          <ng-container *ngFor="let item of externalFilters | sdFilterExternal">\r\n            <ng-container *ngTemplateOutlet="filterExternal; context: { item: item }"></ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor="let item of filterDefs">\r\n          <div *ngIf="inlineFilterDef[item.sdTableFilterDef]" class="col-lg-2 col-md-3 col-sm-6 px-8">\r\n            <ng-container *ngTemplateOutlet="item.templateRef; context: { filterDef: filterDef, isInline: true }"> </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n    </div>\r\n    <ng-template #filterExternal let-item="item">\r\n      <div *ngIf="inlineExternal[item.field]" class="col-lg-2 col-md-3 col-sm-6 px-8">\r\n        <sd-input\r\n          [label]="item.title"\r\n          *ngIf="item.type === \'string\'"\r\n          type="text"\r\n          [(model)]="externalFilter[item.field]"\r\n          (keyupEnter)="onFilter(item)"\r\n          appearance="outline">\r\n        </sd-input>\r\n        <sd-input-number\r\n          [label]="item.title"\r\n          *ngIf="item.type === \'number\'"\r\n          [(model)]="externalFilter[item.field]"\r\n          (keyupEnter)="onFilter(item)"\r\n          appearance="outline">\r\n        </sd-input-number>\r\n        <sd-select\r\n          [label]="item.title"\r\n          *ngIf="item.type === \'bool\'"\r\n          [items]="[\r\n            { value: \'1\', display: item.option?.displayOnTrue || \'True\' },\r\n            { value: \'0\', display: item.option?.displayOnFalse || \'False\' }\r\n          ]"\r\n          valueField="value"\r\n          displayField="display"\r\n          [(model)]="externalFilter[item.field]"\r\n          (sdChange)="onFilter(item)"\r\n          appearance="outline">\r\n        </sd-select>\r\n        <ng-container *ngIf="item.type === \'values\' && item.option">\r\n          <sd-select\r\n            *ngIf="item.option?.selection === \'MULTIPLE\'"\r\n            [label]="item.title"\r\n            [items]="item.option.items"\r\n            [valueField]="item.option.valueField"\r\n            [displayField]="item.option.displayField"\r\n            [(model)]="externalFilter[item.field]"\r\n            (sdChange)="onFilter(item)"\r\n            [selectAll]="item.option.selectAll"\r\n            appearance="outline"\r\n            multiple>\r\n          </sd-select>\r\n          <sd-autocomplete\r\n            *ngIf="item.option?.selection === \'AUTOCOMPLETE\'"\r\n            [label]="item.title"\r\n            [items]="item.option.items"\r\n            [valueField]="item.option.valueField"\r\n            [displayField]="item.option.displayField"\r\n            [(model)]="externalFilter[item.field]"\r\n            (sdChange)="onFilter(item)"\r\n            appearance="outline">\r\n          </sd-autocomplete>\r\n          <sd-select\r\n            *ngIf="item.option?.selection === \'MULTIPLEAUTOCOMPLETE\'"\r\n            [label]="item.title"\r\n            [items]="item.option.items"\r\n            [valueField]="item.option.valueField"\r\n            [displayField]="item.option.displayField"\r\n            [(model)]="externalFilter[item.field]"\r\n            (sdChange)="onFilter(item)"\r\n            filtered\r\n            appearance="outline"\r\n            multiple>\r\n          </sd-select>\r\n          <sd-select\r\n            *ngIf="!item.option?.selection"\r\n            [label]="item.title"\r\n            [items]="item.option.items"\r\n            [valueField]="item.option.valueField"\r\n            [displayField]="item.option.displayField"\r\n            [(model)]="externalFilter[item.field]"\r\n            (sdChange)="onFilter(item)"\r\n            appearance="outline">\r\n          </sd-select>\r\n        </ng-container>\r\n        <ng-container *ngIf="item.type === \'lazy-values\' && item.option">\r\n          <sd-select\r\n            *ngIf="item.option?.selection === \'MULTIPLE\'"\r\n            [label]="item.title"\r\n            [items]="item.option.items"\r\n            [valueField]="item.option.valueField"\r\n            [displayField]="item.option.displayField"\r\n            [(model)]="externalFilter[item.field]"\r\n            (sdChange)="onFilter(item)"\r\n            appearance="outline"\r\n            multiple\r\n            filtered>\r\n          </sd-select>\r\n          <sd-autocomplete\r\n            *ngIf="!item.option?.selection"\r\n            [label]="item.title"\r\n            [items]="item.option.items"\r\n            [valueField]="item.option.valueField"\r\n            [displayField]="item.option.displayField"\r\n            [(model)]="externalFilter[item.field]"\r\n            (sdChange)="onFilter(item)"\r\n            appearance="outline">\r\n          </sd-autocomplete>\r\n        </ng-container>\r\n        <sd-date-time\r\n          [label]="item.title"\r\n          *ngIf="item.type === \'date\' || item.type === \'datetime\'"\r\n          [(model)]="externalFilter[item.field]"\r\n          [type]="item.type"\r\n          (sdChange)="onFilter(item)"\r\n          appearance="outline">\r\n        </sd-date-time>\r\n        <sd-date-range\r\n          [label]="item.title"\r\n          *ngIf="item.type === \'daterange\' && externalFilter[item.field]"\r\n          [(from)]="externalFilter[item.field].from"\r\n          [(to)]="externalFilter[item.field].to"\r\n          [min]="item.minDate"\r\n          [max]="item.maxDate"\r\n          (sdChange)="onFilter(item)"\r\n          appearance="outline">\r\n        </sd-date-range>\r\n        <ng-container *ngIf="item.type === \'custom\' && item.filterDef">\r\n          <ng-container *ngTemplateOutlet="item.filterDef; context: { externalFilter: externalFilter }"> </ng-container>\r\n        </ng-container>\r\n      </div>\r\n    </ng-template>\r\n    <sd-popup-filter [filterRegister]="filterRegister" [columns]="columns" [externalFilters]="externalFilters" [filterDefs]="filterDefs">\r\n    </sd-popup-filter>\r\n  </ng-template>\r\n</ng-container>\r\n',changeDetection:n.ChangeDetectionStrategy.OnPush,styles:[":host{display:block;padding-left:0;padding-right:0}:host ::ng-deep .mat-form-field-wrapper{padding-bottom:0}"]}]}],ee.ctorParameters=function(){return[{type:n.ChangeDetectorRef},{type:m.DeviceDetectorService}]},ee.propDecorators={popupFilter:[{type:n.ViewChild,args:[$]}],_filter:[{type:n.Input,args:["filter"]}],columns:[{type:n.Input}],_externalFilters:[{type:n.Input,args:["externalFilters"]}],filterDefs:[{type:n.Input}],_filterRegister:[{type:n.Input,args:["filterRegister"]}]};var te=function(e){this.templateRef=e};te.decorators=[{type:n.Directive,args:[{selector:"[sdTableExpandDef]"}]}],te.ctorParameters=function(){return[{type:n.TemplateRef}]};var ne,re,ie,le,oe=function(e){this.templateRef=e};oe.decorators=[{type:n.Directive,args:[{selector:"[sdTableFooterDef]"}]}],oe.ctorParameters=function(){return[{type:n.TemplateRef}]},oe.propDecorators={sdTableFooterDef:[{type:n.Input}]};var ae=function(e,t){var n=this;this.settingService=e,this.gridMaterialConfiguration=t,ne.set(this,{SUBINFORMATION:"sdSubInformationAction",COMMAND:"sdCommand",SELECTION:"sdSelection",GROUP:"sdGroup"}),re.set(this,"c9e94836-6ace-4aeb-b148-4f0be63589ee"),ie.set(this,(function(e){return(null==e?void 0:e.key)?n.settingService.create({prefix:J(n,re),key:e.key},{default:J(n,le).call(n,e)}):null})),this.loadConfiguration=function(e){return(null==e?void 0:e.key)?J(n,ie).call(n,e).get():J(n,le).call(n,e)},this.loadConfigurationResult=function(e,t){var r,i,l,o={column:{},fixedColumn:{},firstColumns:[],secondColumns:[],firstHeaders:[],secondHeaders:[],displayedColumns:[],displayedFooters:[],multipleHeader:!1},a=e||{},s=a.selector,c=a.commands,d=a.group;return(null==s?void 0:s.visible)&&(o.firstHeaders.push(J(n,ne).SELECTION),o.displayedColumns.push(J(n,ne).SELECTION)),(null==c?void 0:c.length)&&(o.firstHeaders.push(J(n,ne).COMMAND),o.displayedColumns.push(J(n,ne).COMMAND)),(null===(r=null==d?void 0:d.fields)||void 0===r?void 0:r.length)&&(o.firstHeaders.push(J(n,ne).GROUP),o.displayedColumns.push(J(n,ne).GROUP)),null===(i=null==t?void 0:t.columns)||void 0===i||i.filter((function(e){return!e.invisible})).forEach((function(t){var n,r=null==e?void 0:e.columns.find((function(e){return e.field===t.origin.field}));r&&(o.column[t.origin.field]={title:t.title||t.origin.title,width:t.width||t.origin.width},t.fixed&&(o.fixedColumn[t.origin.field]={title:t.title||t.origin.title,width:t.width||t.origin.width}),o.firstColumns.push(Object.assign(Object.assign({},r),{title:t.title||t.origin.title,width:t.width||t.origin.width})),o.firstHeaders.push(t.origin.field),o.displayedColumns.push(t.origin.field),"children"===r.type&&(null===(n=r.children)||void 0===n||n.forEach((function(e){o.secondColumns.push(e),o.secondHeaders.push(e.field),o.displayedColumns.push(e.field)}))))})),null===(l=null==e?void 0:e.columns)||void 0===l||l.filter((function(e){var n;return!(null===(n=null==t?void 0:t.columns)||void 0===n?void 0:n.some((function(t){return t.origin.field===e.field})))})).forEach((function(e){var t;o.firstColumns.push(Object.assign(Object.assign({},e),{title:e.title,width:e.width})),o.firstHeaders.push(e.field),o.displayedColumns.push(e.field),"children"===e.type&&(null===(t=e.children)||void 0===t||t.forEach((function(e){o.secondColumns.push(e),o.secondHeaders.push(e.field),o.displayedColumns.push(e.field)})))})),e.expand&&(o.firstHeaders.push(J(n,ne).SUBINFORMATION),o.displayedColumns.push(J(n,ne).SUBINFORMATION)),o.multipleHeader=o.secondHeaders.length>0,o.displayedFooters=o.displayedColumns.filter((function(e){return e!==J(n,ne).SUBINFORMATION})),o},this.init=function(e){return J(n,ie).call(n,e)},le.set(this,(function(e){var t;return{columns:(null===(t=null==e?void 0:e.columns)||void 0===t?void 0:t.filter((function(e){return!e.hidden})).map((function(e){return{origin:{field:e.field,title:e.title,width:e.width,invisible:e.invisible},invisible:e.invisible,fixed:!1}})))||[]}}))};ne=new WeakMap,re=new WeakMap,ie=new WeakMap,le=new WeakMap,ae.decorators=[{type:n.Injectable}],ae.ctorParameters=function(){return[{type:g.SdSettingService},{type:void 0,decorators:[{type:n.Inject,args:[_]},{type:n.Optional}]}]};var se,ce,de,ue,fe,pe,me,he,ge=function(e){return{data:e,meta:{id:z(e),display:{},expand:{isExpanding:!1,isExpanded:!1},group:{},selector:{actions:[],isSelected:!1,selectable:!1}}}},ve=function(e){var t=this;this.settingService=e,se.set(this,"GRID-FILTER-CONFIGURATION"),ce.set(this,"GRID-FILTER-VALUE"),de.set(this,{}),this.register=function(e,n){var r=!1,i=n.id,l=n.columns,o=n.externalFilters,a=N.default({id:i,columns:(null==l?void 0:l.map((function(e){return e.field})).filter((function(e){return!!e})))||[],externalFilters:(null==o?void 0:o.map((function(e){return e.field})).filter((function(e){return!!e})))||[]}),s=(null==e?void 0:e.key)||a;if((null==e?void 0:e.key)||(r=!0),!J(t,de)[s]){var c=t.settingService.create({prefix:J(t,se),key:s},{default:J(t,ue).call(t,n),type:r?"session":void 0});c.set(J(t,pe).call(t,n,c.get()));var d=t.settingService.create({prefix:J(t,ce),key:(null==e?void 0:e.cacheFilter)?s:a},{default:J(t,fe).call(t,n),type:r||!(null==e?void 0:e.cacheFilter)?"session":void 0});d.set(J(t,me).call(t,n,d.get())),J(t,de)[s]={configuration:{get:function(){return c.get()},set:function(e){var t=e.inlineColumn,n=e.inlineExternal,r=e.inlineFilterDef;return c.set({inlineColumn:t,inlineExternal:n,inlineFilterDef:r}),{inlineColumn:t,inlineExternal:n,inlineFilterDef:r}},remove:function(){c.set(J(t,ue).call(t,n))},observer:c.observer.pipe(f.startWith(c.get()),f.map((function(e){return e||J(t,ue).call(t,n)})))},value:{get:function(){return d.get()},set:function(e){var t=Object.keys(e||{}),n=d.get(),r=n.columnOperator,i=n.columnFilter,l=n.externalFilter,o=n.filterDef,a=(n.notReload,{columnOperator:t.includes("columnOperator")?(null==e?void 0:e.columnOperator)||{}:r,columnFilter:t.includes("columnFilter")?(null==e?void 0:e.columnFilter)||{}:i,externalFilter:t.includes("externalFilter")?(null==e?void 0:e.externalFilter)||{}:l,filterDef:t.includes("filterDef")?(null==e?void 0:e.filterDef)||{}:o,notReload:!!(null==e?void 0:e.notReload)});return d.set(a),a},remove:function(){d.set(J(t,fe).call(t,n))},observer:d.observer.pipe(f.startWith(d.get()),f.map((function(e){return e||J(t,fe).call(t,n)})))}}}return J(t,de)[s]},ue.set(this,(function(e){var t,n,r,i,l,o,a,s=e.columns,c=e.externalFilters,d=e.filterDefs,u={},f={},p={};try{for(var m=U(s||[]),h=m.next();!h.done;h=m.next())u[(x=h.value).field]=null===(a=null==x?void 0:x.filter)||void 0===a?void 0:a.defaultShowing}catch(e){t={error:e}}finally{try{h&&!h.done&&(n=m.return)&&n.call(m)}finally{if(t)throw t.error}}try{for(var g=U(c||[]),v=g.next();!v.done;v=g.next())f[(x=v.value).field]=null==x?void 0:x.defaultShowing}catch(e){r={error:e}}finally{try{v&&!v.done&&(i=g.return)&&i.call(g)}finally{if(r)throw r.error}}try{for(var y=U(d||[]),b=y.next();!b.done;b=y.next()){var x;p[(x=b.value).sdTableFilterDef]=null==x?void 0:x.defaultShowing}}catch(e){l={error:e}}finally{try{b&&!b.done&&(o=y.return)&&o.call(y)}finally{if(l)throw l.error}}return{inlineColumn:u,inlineExternal:f,inlineFilterDef:p}})),fe.set(this,(function(e){var t,n,r,i,l,o,a,s,c,d,u,f={},p={},m={},h=e.columnOperator||{},g=e.columns,v=e.externalFilters,y=e.filterDefs;try{for(var b=U(g||[]),x=b.next();!x.done;x=b.next())f[(D=x.value).field]=null===(a=null==D?void 0:D.filter)||void 0===a?void 0:a.default,(null===(c=null===(s=null==D?void 0:D.filter)||void 0===s?void 0:s.operator)||void 0===c?void 0:c.enable)&&(null===(u=null===(d=null==D?void 0:D.filter)||void 0===d?void 0:d.operator)||void 0===u?void 0:u.default)&&(h[D.field]=D.filter.operator.default)}catch(e){t={error:e}}finally{try{x&&!x.done&&(n=b.return)&&n.call(b)}finally{if(t)throw t.error}}try{for(var F=U(v||[]),w=F.next();!w.done;w=F.next())p[(D=w.value).field]=null==D?void 0:D.default}catch(e){r={error:e}}finally{try{w&&!w.done&&(i=F.return)&&i.call(F)}finally{if(r)throw r.error}}try{for(var C=U(y||[]),O=C.next();!O.done;O=C.next()){var D;m[(D=O.value).sdTableFilterDef]=void 0}}catch(e){l={error:e}}finally{try{O&&!O.done&&(o=C.return)&&o.call(C)}finally{if(l)throw l.error}}return{columnFilter:f,externalFilter:p,filterDef:m,columnOperator:h}})),pe.set(this,(function(e,t){var n,r,i,l,o,a,s,c,d,u,f,p,m,h=e.columns,g=e.externalFilters,v=e.filterDefs,y={},b={},x={};try{for(var F=U(h||[]),w=F.next();!w.done;w=F.next())y[(k=w.value).field]=null!==(c=null===(s=null==t?void 0:t.inlineColumn)||void 0===s?void 0:s[k.field])&&void 0!==c?c:null===(d=null==k?void 0:k.filter)||void 0===d?void 0:d.defaultShowing}catch(e){n={error:e}}finally{try{w&&!w.done&&(r=F.return)&&r.call(F)}finally{if(n)throw n.error}}try{for(var C=U(g||[]),O=C.next();!O.done;O=C.next())b[(k=O.value).field]=null!==(f=null===(u=null==t?void 0:t.inlineExternal)||void 0===u?void 0:u[k.field])&&void 0!==f?f:null==k?void 0:k.defaultShowing}catch(e){i={error:e}}finally{try{O&&!O.done&&(l=C.return)&&l.call(C)}finally{if(i)throw i.error}}try{for(var D=U(v||[]),S=D.next();!S.done;S=D.next()){var k;x[(k=S.value).sdTableFilterDef]=null!==(m=null===(p=null==t?void 0:t.inlineFilterDef)||void 0===p?void 0:p[k.sdTableFilterDef])&&void 0!==m?m:null==k?void 0:k.defaultShowing}}catch(e){o={error:e}}finally{try{S&&!S.done&&(a=D.return)&&a.call(D)}finally{if(o)throw o.error}}return{inlineColumn:y,inlineExternal:b,inlineFilterDef:x}})),me.set(this,(function(e,t){var n,r,i,l,o,a,s,c,d,u,f,p,m,h,g,v,y,b,x,F,w,C,O,D,S,k={},I={},T={},E=e.columnOperator||{},A=e.columns,M=e.externalFilters,P=e.filterDefs;try{for(var R=U(A||[]),L=R.next();!L.done;L=R.next())k[(V=L.value).field]=null!==(c=null===(s=null==t?void 0:t.columnFilter)||void 0===s?void 0:s[V.field])&&void 0!==c?c:null===(d=null==V?void 0:V.filter)||void 0===d?void 0:d.default,(null===(f=null===(u=null==V?void 0:V.filter)||void 0===u?void 0:u.operator)||void 0===f?void 0:f.enable)&&(null===(m=null===(p=null==V?void 0:V.filter)||void 0===p?void 0:p.operator)||void 0===m?void 0:m.default)&&(E[V.field]=V.filter.operator.default)}catch(e){n={error:e}}finally{try{L&&!L.done&&(r=R.return)&&r.call(R)}finally{if(n)throw n.error}}try{for(var j=U(M||[]),z=j.next();!z.done;z=j.next())"daterange"===(V=z.value).type?I[V.field]={from:null!==(v=null===(g=null===(h=null==t?void 0:t.externalFilter)||void 0===h?void 0:h[V.field])||void 0===g?void 0:g.from)&&void 0!==v?v:null===(y=V.default)||void 0===y?void 0:y.from,to:null!==(F=null===(x=null===(b=null==t?void 0:t.externalFilter)||void 0===b?void 0:b[V.field])||void 0===x?void 0:x.to)&&void 0!==F?F:null===(w=V.default)||void 0===w?void 0:w.to}:I[V.field]=null!==(O=null===(C=null==t?void 0:t.externalFilter)||void 0===C?void 0:C[V.field])&&void 0!==O?O:null==V?void 0:V.default}catch(e){i={error:e}}finally{try{z&&!z.done&&(l=j.return)&&l.call(j)}finally{if(i)throw i.error}}try{for(var N=U(P||[]),H=N.next();!H.done;H=N.next()){var V;T[(V=H.value).sdTableFilterDef]=null!==(S=null===(D=null==t?void 0:t.filterDef)||void 0===D?void 0:D[V.sdTableFilterDef])&&void 0!==S?S:void 0}}catch(e){o={error:e}}finally{try{H&&!H.done&&(a=N.return)&&a.call(N)}finally{if(o)throw o.error}}return{columnFilter:k,externalFilter:I,filterDef:T,columnOperator:E}}))};se=new WeakMap,ce=new WeakMap,de=new WeakMap,ue=new WeakMap,fe=new WeakMap,pe=new WeakMap,me=new WeakMap,ve.decorators=[{type:n.Injectable}],ve.ctorParameters=function(){return[{type:g.SdSettingService}]};var ye,be,xe,Fe=function(){function e(e,t,r){var i=this;this.ref=e,this.notifyService=t,this.tableConfigurationService=r,this.changes=new n.EventEmitter,he.set(this,void 0),this.isCreatingColumn=!1,this.selected={},this.disabledDrag=!0,this.open=function(){return W(i,void 0,void 0,(function(){return B(this,(function(e){return K(this,he,this.tableConfigurationService.init(this.tableOption)),this.configuration=J(this,he).get(),this.modal.open(),[2]}))}))},this.onSave=function(){J(i,he).set(i.configuration),i.modal.close(),i.ref.detectChanges()},this.onReset=function(){return W(i,void 0,void 0,(function(){var e=this;return B(this,(function(t){return this.notifyService.confirm("Xác nhận đưa tất cả thiết lập về mặc định").then((function(){J(e,he).remove(),e.modal.close(),e.ref.detectChanges()})),[2]}))}))}}return e.prototype.ngOnInit=function(){},e.prototype.mouseUp=function(e){this.disabledDrag=!0},e.prototype.dropTable=function(e){b.moveItemInArray(this.configuration.columns,e.previousIndex,e.currentIndex),this.table.renderRows()},e.prototype.handleMouseDown=function(){this.disabledDrag=!1},e.prototype.handleMouseUp=function(){this.disabledDrag=!0},e}();he=new WeakMap,Fe.decorators=[{type:n.Component,args:[{selector:"sd-popup-configuration",template:'<sd-modal width="sm" [title]="\'Configuration\' | sdTranslate" #modal>\r\n  <sd-modal-body *ngIf="configuration">\r\n    <div class="c-container">\r\n      <div class="c-table" style="max-height: 70vh">\r\n        <table\r\n          #table\r\n          mat-table\r\n          [dataSource]="configuration.columns"\r\n          cdkDropList\r\n          [cdkDropListData]="configuration.columns"\r\n          (cdkDropListDropped)="dropTable($event)">\r\n          >\r\n          <ng-container matColumnDef="stt">\r\n            <th mat-header-cell class="c-th text-center px-5" *matHeaderCellDef style="width: 50px">#</th>\r\n            <td class="text-center px-5" mat-cell *matCellDef="let item; let idx = index">\r\n              <div class="c-handle" (mousedown)="handleMouseDown()" (mouseup)="handleMouseUp()">\r\n                <svg width="24px" fill="currentColor" viewBox="0 0 24 24">\r\n                  <path\r\n                    d="M10 9h4V6h3l-5-5-5 5h3v3zm-1 1H6V7l-5 5 5 5v-3h3v-4zm14 2l-5-5v3h-3v4h3v3l5-5zm-9 3h-4v3H7l5 5 5-5h-3v-3z"></path>\r\n                  <path d="M0 0h24v24H0z" fill="none"></path>\r\n                </svg>\r\n              </div>\r\n            </td>\r\n          </ng-container>\r\n          <ng-container matColumnDef="title">\r\n            <th mat-header-cell class="c-th px-5" *matHeaderCellDef>{{ \'Title\' | sdTranslate }}</th>\r\n            <td class="px-5" mat-cell *matCellDef="let item">\r\n              <sd-input [placeholder]="item?.origin?.title" [(model)]="item.title" disableErrorMessage></sd-input>\r\n            </td>\r\n          </ng-container>\r\n          <ng-container matColumnDef="width">\r\n            <th mat-header-cell class="c-th px-5" *matHeaderCellDef style="width: 80px">{{ \'Width\' | sdTranslate }}</th>\r\n            <td class="px-5" mat-cell *matCellDef="let item">\r\n              <sd-input [placeholder]="item?.origin?.width" [(model)]="item.width" disableErrorMessage></sd-input>\r\n            </td>\r\n          </ng-container>\r\n          <ng-container matColumnDef="invisible">\r\n            <th mat-header-cell class="c-th text-center px-5" *matHeaderCellDef style="width: 80px">{{ \'Hidden\' | sdTranslate }}</th>\r\n            <td class="text-center px-5" mat-cell *matCellDef="let item">\r\n              <mat-slide-toggle [(ngModel)]="item.invisible" color="primary"> </mat-slide-toggle>\r\n            </td>\r\n          </ng-container>\r\n          <ng-container matColumnDef="fixed">\r\n            <th mat-header-cell class="c-th text-center px-5" *matHeaderCellDef style="width: 80px">{{ \'Freeze\' | sdTranslate }}</th>\r\n            <td class="text-center px-5" mat-cell *matCellDef="let item">\r\n              <mat-slide-toggle [(ngModel)]="item.fixed" color="primary"></mat-slide-toggle>\r\n            </td>\r\n          </ng-container>\r\n          <tr mat-header-row *matHeaderRowDef="[\'stt\', \'title\', \'width\', \'invisible\', \'fixed\']; sticky: true"></tr>\r\n          <tr\r\n            mat-row\r\n            *matRowDef="let row; columns: [\'stt\', \'title\', \'width\', \'invisible\', \'fixed\']"\r\n            cdkDrag\r\n            [cdkDragData]="row"\r\n            cdkDragLockAxis="y"\r\n            [cdkDragDisabled]="disabledDrag"></tr>\r\n        </table>\r\n      </div>\r\n    </div>\r\n  </sd-modal-body>\r\n  <sd-modal-footer>\r\n    <sd-button class="mr-8" (action)="onReset()" title="Mặc định" color="info" size="sm"> </sd-button>\r\n    <sd-button (action)="onSave()" title="Lưu" type="fill" color="info" size="sm"> </sd-button>\r\n  </sd-modal-footer>\r\n</sd-modal>\r\n',styles:[".c-table{overflow:auto;position:relative}.c-table table{width:100%}.c-table .c-th{color:#000;font-size:14px;font-weight:500;line-height:20px}.c-container{min-height:200px;position:relative}.c-handle{color:#ccc;cursor:move}"]}]}],Fe.ctorParameters=function(){return[{type:n.ChangeDetectorRef},{type:u.SdNotifyService},{type:ae}]},Fe.propDecorators={tableOption:[{type:n.Input}],modal:[{type:n.ViewChild,args:["modal"]}],table:[{type:n.ViewChild,args:["table"]}],mouseUp:[{type:n.HostListener,args:["window:mouseup",["$event"]]}]};var we,Ce,Oe,De,Se,ke,Ie,Te,Ee,Ae,Me,Pe,Re,Le,je,ze,Ne,He,Ve,qe,We,Be,Ue,Qe,Ge,Je,Ke=function(){function e(e,t,r,i,l){var o=this;this.ref=e,this.loadingService=t,this.exportService=r,this.notifyService=i,this.translateService=l,this.columns=[],this.enableCreating=!1,this.selected={},this.files=[],this.export=new n.EventEmitter,this.form=new w.FormGroup({}),ye.set(this,(function(){return G(o.tableColumns,o.additionalColumns)})),this.open=function(){return W(o,void 0,void 0,(function(){return B(this,(function(e){return this.key?(this.loadFiles(null),this.selected={},this.modal.open(),this.ref.detectChanges(),[2]):(this.exportDefault(),[2])}))}))},be.set(this,(function(){if(o.configuration){var e=G(o.tableColumns),t=o.configuration,n=G(t.firstColumns,t.secondColumns).reduce((function(e,t){var n=o.tableOption.columns.find((function(e){return e.field===t.field}));return n?"children"!==n.type?G(e,[n]):G(e,n.children):e}),[]);return G(n.map((function(t){return Object.assign(Object.assign({},t),{data:e.find((function(e){return e.field===t.field}))})})).filter((function(e){return!!e.data})).map((function(e){return e.data})),o.additionalColumns)}return o.columns})),this.exportDefault=function(){o.export.emit({file:null,columns:J(o,be).call(o),isCSV:!1})},this.exportCSV=function(){o.export.emit({file:null,columns:J(o,be).call(o),isCSV:!0})},this.loadFiles=function(e){return void 0===e&&(e=null),W(o,void 0,void 0,(function(){var t;return B(this,(function(n){switch(n.label){case 0:return t=this,[4,this.exportService.filesInFolder({key:this.key,group:e})];case 1:return t.files=n.sent(),this.ref.markForCheck(),[2]}}))}))},xe.set(this,(function(e){return W(o,void 0,void 0,(function(){var t,n,r,i,l,o,a,s,c,d,u,f,p,m;return B(this,(function(h){switch(h.label){case 0:if(l=[],!Array.isArray(null===(n=null===(t=this.tableOption)||void 0===t?void 0:t.export)||void 0===n?void 0:n.sheets))return[3,9];h.label=1;case 1:h.trys.push([1,7,8,9]),o=U(this.tableOption.export.sheets),a=o.next(),h.label=2;case 2:return a.done?[3,6]:(s=a.value).name&&s.items&&s.fields?Array.isArray(s.items)?(l.push({name:s.name,items:s.items,fields:s.fields}),[3,5]):[3,3]:[3,5];case 3:return d=(c=l).push,u={name:s.name},[4,s.items()];case 4:d.apply(c,[(u.items=h.sent(),u.fields=s.fields,u)]),h.label=5;case 5:return a=o.next(),[3,2];case 6:return[3,9];case 7:return f=h.sent(),p={error:f},[3,9];case 8:try{a&&!a.done&&(m=o.return)&&m.call(o)}finally{if(p)throw p.error}return[7];case 9:return[4,this.exportService.generateTemplate({fileName:e||(null===(i=null===(r=this.tableOption)||void 0===r?void 0:r.export)||void 0===i?void 0:i.fileName),columns:this.columns,sheets:l})];case 10:return[2,h.sent()]}}))}))})),this.generateTemplate=function(){return W(o,void 0,void 0,(function(){return B(this,(function(e){switch(e.label){case 0:return this.loadingService.start(),[4,J(this,xe).call(this).finally(this.loadingService.stop)];case 1:return e.sent(),[2]}}))}))},this.generateAndUploadTemplate=function(e){return W(o,void 0,void 0,(function(){var t,n,r,i,l,o,a,s,c,d,u,f,p,m,h,g,v=this;return B(this,(function(y){switch(y.label){case 0:if(a=[],!Array.isArray(null===(n=null===(t=this.tableOption)||void 0===t?void 0:t.export)||void 0===n?void 0:n.sheets))return[3,9];y.label=1;case 1:y.trys.push([1,7,8,9]),s=U(null===(i=null===(r=this.tableOption)||void 0===r?void 0:r.export)||void 0===i?void 0:i.sheets),c=s.next(),y.label=2;case 2:return c.done?[3,6]:(d=c.value).name&&d.items&&d.fields?Array.isArray(d.items)?(a.push({name:d.name,items:d.items,fields:d.fields}),[3,5]):[3,3]:[3,5];case 3:return f=(u=a).push,p={name:d.name},[4,d.items()];case 4:f.apply(u,[(p.items=y.sent(),p.fields=d.fields,p)]),y.label=5;case 5:return c=s.next(),[3,2];case 6:return[3,9];case 7:return m=y.sent(),h={error:m},[3,9];case 8:try{c&&!c.done&&(g=s.return)&&g.call(s)}finally{if(h)throw h.error}return[7];case 9:return[4,this.exportService.generateUploadTemplate({key:this.key,template:{fileName:e||(null===(o=null===(l=this.tableOption)||void 0===l?void 0:l.export)||void 0===o?void 0:o.fileName),columns:this.columns.filter((function(e){return v.selected[e.field]})),sheets:a}})];case 10:return[2,y.sent()]}}))}))},this.onExport=function(e){o.export.emit({file:e,columns:o.columns}),o.ref.detectChanges()},this.uploadTemplate=function(){return W(o,void 0,void 0,(function(){var e;return B(this,(function(t){switch(t.label){case 0:return[4,this.exportService.uploadTemplate({key:this.key})];case 1:return(e=t.sent())&&(this.files=G(this.files,[e]),this.ref.detectChanges()),[2]}}))}))},this.removeFile=function(e){o.notifyService.confirm(o.translateService.translate("Remove template")).then((function(){o.exportService.removeFile({key:o.key,fileName:e.fileName});var t=o.files.indexOf(e);o.files.splice(t,1),o.files=G(o.files),o.ref.detectChanges()}))},this.createTemplate=function(){return W(o,void 0,void 0,(function(){var e,t,n,r=this;return B(this,(function(i){switch(i.label){case 0:i