raise-common-lib 0.0.149 → 0.0.151

package/fesm2015/raise-common-lib.js

@@ -9,6 +9,7 @@ import { TreeGridComponent } from '@syncfusion/ej2-angular-treegrid';
 import { CarouselAllModule, ToolbarModule, TabModule, TreeViewModule } from '@syncfusion/ej2-angular-navigations';
 import { NavigationEnd, Router, ActivatedRoute, RouteReuseStrategy } from '@angular/router';
 import { filter } from 'rxjs/operators';
+import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { setCulture, L10n } from '@syncfusion/ej2-base';
 import ResizeObserver from 'resize-observer-polyfill';
@@ -1511,6 +1512,10 @@ if (false) {
     DialogConfig.prototype.hideSaveBtn;
     /** @type {?|undefined} */
     DialogConfig.prototype.hideCloseBtn;
+    /** @type {?|undefined} */
+    DialogConfig.prototype.showZoomBtn;
+    /** @type {?|undefined} */
+    DialogConfig.prototype.onCloseRequest;
 }
 class CommonDeleteComponent {
     /**
@@ -1525,6 +1530,7 @@ class CommonDeleteComponent {
         this.cancelBtnLabel = "";
         this.description = "";
         this.size = "small";
+        this.showZoomBtn = false;
     }
     /**
      * @return {?}
@@ -1542,6 +1548,7 @@ class CommonDeleteComponent {
                 this.translation.IF_YOU_DELETE_THIS_RECORD_WARNING ||
                 ".If you delete this record, you won't be able to recover it. Do you want to delete it?";
         this.size = this.data.size || "small";
+        this.showZoomBtn = this.data.showZoomBtn || false;
     }
     /**
      * @param {?} e
@@ -1550,11 +1557,31 @@ class CommonDeleteComponent {
     onSave(e) {
         this.dialogRef.close(e);
     }
+    /**
+     * @param {?} e
+     * @return {?}
+     */
+    onClose(e) {
+        if (this.data.onCloseRequest) {
+            this.data.onCloseRequest(e).then((/**
+             * @param {?} confirmed
+             * @return {?}
+             */
+            (confirmed) => {
+                if (confirmed) {
+                    this.dialogRef.close();
+                }
+            }));
+        }
+        else {
+            this.dialogRef.close();
+        }
+    }
 }
 CommonDeleteComponent.decorators = [
     { type: Component, args: [{
                 selector: "kt-common-delete-dialog",
-                template: "<kt-common-dialog\r\n\t[size]=\"size\"\r\n\t[title]=\"title\"\r\n\t[hideHeader]=\"false\"\r\n\t[hideCloseBtn]=\"data.hideCloseBtn === undefined ? false : data.hideCloseBtn\"\r\n\t[hideSaveBtn]=\"data.hideSaveBtn === undefined ? false : data.hideSaveBtn\"\r\n\t[saveBtnLabel]=\"saveBtnLabel\"\r\n\t[cancelBtnLabel]=\"cancelBtnLabel\"\r\n\t[showErrorIcon]=\"\r\n\t\tdata.showErrorIcon === undefined ? false : data.showErrorIcon\r\n\t\"\r\n\t[hideCloseIcon]=\"\r\n\t\tdata.hideCloseIcon === undefined ? false : data.hideCloseIcon\r\n\t\"\r\n\t(saveEmit)=\"onSave($event)\"\r\n>\r\n\t<div class=\"mapping-dialog\">\r\n\t\t{{ description }}\r\n\t</div>\r\n</kt-common-dialog>\r\n",
+                template: "<kt-common-dialog\r\n\t[size]=\"size\"\r\n\t[title]=\"title\"\r\n\t[hideHeader]=\"false\"\r\n\t[hideCloseBtn]=\"data.hideCloseBtn === undefined ? false : data.hideCloseBtn\"\r\n\t[hideSaveBtn]=\"data.hideSaveBtn === undefined ? false : data.hideSaveBtn\"\r\n\t[saveBtnLabel]=\"saveBtnLabel\"\r\n\t[cancelBtnLabel]=\"cancelBtnLabel\"\r\n\t[showZoomBtn]=\"showZoomBtn\"\r\n\t[showErrorIcon]=\"\r\n\t\tdata.showErrorIcon === undefined ? false : data.showErrorIcon\r\n\t\"\r\n\t[hideCloseIcon]=\"\r\n\t\tdata.hideCloseIcon === undefined ? false : data.hideCloseIcon\r\n\t\"\r\n\t(saveEmit)=\"onSave($event)\"\r\n>\r\n\t<div class=\"mapping-dialog\">\r\n\t\t{{ description }}\r\n\t</div>\r\n</kt-common-dialog>\r\n",
                 styles: [".mapping-dialog{color:#44566c;font-family:Arial;font-size:12px;line-height:16px;white-space:pre-line}"]
             }] }
 ];
@@ -1577,6 +1604,8 @@ if (false) {
     /** @type {?} */
     CommonDeleteComponent.prototype.size;
     /** @type {?} */
+    CommonDeleteComponent.prototype.showZoomBtn;
+    /** @type {?} */
     CommonDeleteComponent.prototype.data;
     /** @type {?} */
     CommonDeleteComponent.prototype.dialogRef;
@@ -3054,6 +3083,19 @@ class MultiTabComponent {
             this.ref.markForCheck();
         }
     }
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    onTabDrop(event) {
+        const { previousIndex, currentIndex } = event;
+        console.log("previousIndex", previousIndex, "currentIndex", currentIndex);
+        if (previousIndex === 0 || currentIndex === 0) {
+            return;
+        }
+        moveItemInArray(this.tabList, event.previousIndex, event.currentIndex);
+        sessionStorage.setItem("TabCache", JSON.stringify(this.tabList));
+    }
     /**
      * @return {?}
      */
@@ -3110,8 +3152,8 @@ class MultiTabComponent {
 MultiTabComponent.decorators = [
     { type: Component, args: [{
                 selector: "rs-multi-tab",
-                template: "<div class=\"rs-multi-tab\" [ngClass]=\"{ 'b-line': tabList.length > 0 }\">\r\n\t<ul>\r\n\t\t<ng-container *ngFor=\"let tab of tabList; let i = index\">\r\n\t\t\t<li\r\n\t\t\t\t[ngClass]=\"selectedTab === i ? 'isSelect' : 'notSelect'\"\r\n\t\t\t\t(click)=\"changeTab(tab, i)\"\r\n\t\t\t>\r\n\t\t\t\t<ejs-tooltip\r\n\t\t\t\t\tid=\"notSelectTooltip\"\r\n\t\t\t\t\t[showTipPointer]=\"false\"\r\n\t\t\t\t\t[openDelay]=\"500\"\r\n\t\t\t\t\t*ngIf=\"tab.displayTitle !== tab.title; else originText\"\r\n\t\t\t\t\tstyle=\"height: 27px\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<ng-template #content>\r\n\t\t\t\t\t\t<div class=\"tooltip-content\">\r\n\t\t\t\t\t\t\t{{ tab.title }}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</ng-template>\r\n\t\t\t\t\t<span class=\"tabTitle\">{{ tab.displayTitle }}</span>\r\n\t\t\t\t</ejs-tooltip>\r\n\t\t\t\t<ng-template #originText>\r\n\t\t\t\t\t<span class=\"tabTitle\">\r\n\t\t\t\t\t\t{{ tab.displayTitle }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</ng-template>\r\n\t\t\t\t<span\r\n\t\t\t\t\tclass=\"img-block\"\r\n\t\t\t\t\t*ngIf=\"selectedTab !== i && i !== 0\"\r\n\t\t\t\t></span>\r\n\t\t\t\t<img\r\n\t\t\t\t\t*ngIf=\"i !== 0\"\r\n\t\t\t\t\tsrc=\"../../../assets/img/close-url.svg\"\r\n\t\t\t\t\t(click)=\"closeTab(i)\"\r\n\t\t\t\t/>\r\n\t\t\t</li>\r\n\t\t</ng-container>\r\n\t</ul>\r\n\t<div class=\"refresh-tab\" (click)=\"refreshTab()\" *ngIf=\"tabList.length > 0\">\r\n\t\t<ejs-tooltip\r\n\t\t\tid=\"notSelectTooltip\"\r\n\t\t\tcssClass=\"notSelectTooltip\"\r\n\t\t\t[showTipPointer]=\"false\"\r\n\t\t\t[openDelay]=\"500\"\r\n\t\t\tstyle=\"height: 27px\"\r\n\t\t>\r\n\t\t\t<ng-template #content>\r\n\t\t\t\t<div class=\"tooltip-content\">Refresh Current Tab</div>\r\n\t\t\t</ng-template>\r\n\t\t\t<img\r\n\t\t\t\tid=\"loadingIcon\"\r\n\t\t\t\talt\r\n\t\t\t\tclass=\"refresh-btn\"\r\n\t\t\t\tsrc=\"../../../assets/img/desktop-refresh-btn.svg\"\r\n\t\t\t/>\r\n\t\t</ejs-tooltip>\r\n\t</div>\r\n</div>\r\n",
-                styles: [".rs-multi-tab{width:100%;display:flex;justify-content:space-between;margin:0 auto;max-width:1886px}.rs-multi-tab.b-line{border-bottom:1px solid #e5eaef}.rs-multi-tab ul{display:flex;margin:0 8px;padding:0;overflow:hidden;height:100%}.rs-multi-tab ul li{max-width:164px;padding:0 12px;display:flex;align-items:center;flex:auto;border:1px solid #e5eaef;border-bottom:none;color:#5f6f81;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;height:28px;background:#f8fafb;vertical-align:top;position:relative;cursor:default}.rs-multi-tab ul li .tabTitle{display:inline-block;white-space:nowrap;font-size:11px;font-family:Arial;font-style:normal;font-weight:400;line-height:16px;transition:width .3s}.rs-multi-tab ul li img{border-radius:4px;padding:4px;margin-left:6px;margin-top:1px;vertical-align:top;cursor:pointer}.rs-multi-tab ul li img:hover{background:#dce8f6}.rs-multi-tab ul li:not(:last-child){border-right:none}.rs-multi-tab ul li:first-of-type{border-top-left-radius:8px}.rs-multi-tab ul li:last-child{border-top-right-radius:8px}.rs-multi-tab ul .isSelect{color:#1f3f5c;background:#fff}.rs-multi-tab ul .notSelect img{display:none}.rs-multi-tab ul .notSelect .img-block{display:inline-block;width:22px}.rs-multi-tab ul .notSelect:hover{color:#1f3f5c;background-color:rgba(31,123,255,.04)}.rs-multi-tab ul .notSelect:hover .img-block{display:none}.rs-multi-tab ul .notSelect:hover img{display:inline-block}.rs-multi-tab .refresh-tab{cursor:pointer;text-align:right;color:#6c7c90;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;padding-right:12px}.rs-multi-tab .refresh-tab img{vertical-align:middle;margin-right:4px}.refresh-tab-loading{-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}.notSelectTooltip{transform:translateX(-12px)}@-webkit-keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.tooltip-content{padding:4px;color:#f8fafb;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:14px}@media (max-width:1400px){.refresh-tab{padding-right:0!important}.refresh-tab span{display:none!important}}@media (max-width:1100px){.rs-multi-tab ul li img{position:absolute;right:3px;background-color:#fff}.notSelect:hover img{position:absolute;right:3px;background-color:#eff5fb}.img-block{display:none!important}.isSelect:not(:first-child){padding-right:20px!important}}@media (max-width:600px){.rs-multi-tab ul li{padding:0 8px}.rs-multi-tab ul .notSelect .img-block{width:0!important}}"]
+                template: "<div class=\"rs-multi-tab\" [ngClass]=\"{ 'b-line': tabList.length > 0 }\">\r\n  <ul\r\n    cdkDropList\r\n    cdkDropListOrientation=\"horizontal\"\r\n    (cdkDropListDropped)=\"onTabDrop($event)\"\r\n  >\r\n    <li\r\n      class=\"tab-item\"\r\n      *ngFor=\"let tab of tabList; let i = index\"\r\n      [ngClass]=\"selectedTab === i ? 'isSelect' : 'notSelect'\"\r\n      [cdkDragDisabled]=\"i === 0\"\r\n      cdkDrag\r\n      (click)=\"changeTab(tab, i)\"\r\n    >\r\n      <ng-template cdkDragPlaceholder let-item>\r\n        <div class=\"placeholder\">\r\n\t\t</div>\r\n      </ng-template>\r\n\t  \r\n      <ejs-tooltip\r\n        id=\"notSelectTooltip\"\r\n        [showTipPointer]=\"false\"\r\n        [openDelay]=\"500\"\r\n        *ngIf=\"tab.displayTitle !== tab.title; else originText\"\r\n        style=\"height: 27px\"\r\n      >\r\n        <ng-template #content>\r\n          <div class=\"tooltip-content\">\r\n            {{ tab.title }}\r\n          </div>\r\n        </ng-template>\r\n        <span class=\"tabTitle\">{{ tab.displayTitle }}</span>\r\n      </ejs-tooltip>\r\n      <ng-template #originText>\r\n        <span class=\"tabTitle\">\r\n          {{ tab.displayTitle }}\r\n        </span>\r\n      </ng-template>\r\n      <span class=\"img-block\" *ngIf=\"selectedTab !== i && i !== 0\"></span>\r\n      <img\r\n        *ngIf=\"i !== 0\"\r\n        src=\"../../../assets/img/close-url.svg\"\r\n        (click)=\"closeTab(i)\"\r\n      />\r\n    </li>\r\n  </ul>\r\n  <div class=\"refresh-tab\" (click)=\"refreshTab()\" *ngIf=\"tabList.length > 0\">\r\n    <ejs-tooltip\r\n      id=\"notSelectTooltip\"\r\n      cssClass=\"notSelectTooltip\"\r\n      [showTipPointer]=\"false\"\r\n      [openDelay]=\"500\"\r\n      style=\"height: 27px\"\r\n    >\r\n      <ng-template #content>\r\n        <div class=\"tooltip-content\">Refresh Current Tab</div>\r\n      </ng-template>\r\n      <img\r\n        id=\"loadingIcon\"\r\n        alt\r\n        class=\"refresh-btn\"\r\n        src=\"../../../assets/img/desktop-refresh-btn.svg\"\r\n      />\r\n    </ejs-tooltip>\r\n  </div>\r\n</div>\r\n",
+                styles: ["@charset \"UTF-8\";.rs-multi-tab{width:100%;display:flex;justify-content:space-between;margin:0 auto;max-width:1886px}.rs-multi-tab.b-line{border-bottom:1px solid #e5eaef}.rs-multi-tab ul{display:flex;margin:0 8px;padding:0;overflow:hidden;height:100%}.rs-multi-tab ul .tab-item{max-width:164px;padding:0 12px;display:flex;align-items:center;flex:auto;border:1px solid #e5eaef;border-bottom:none;color:#5f6f81;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;height:28px;background:#f8fafb;vertical-align:top;position:relative;cursor:default}.rs-multi-tab ul .tab-item .tabTitle{display:inline-block;white-space:nowrap;font-size:11px;font-family:Arial;font-style:normal;font-weight:400;line-height:16px;transition:width .3s}.rs-multi-tab ul .tab-item img{border-radius:4px;padding:4px;margin-left:6px;margin-top:1px;vertical-align:top;cursor:pointer}.rs-multi-tab ul .tab-item img:hover{background:#dce8f6}.rs-multi-tab ul .tab-item:not(:last-child){border-right:none}.rs-multi-tab ul .tab-item:first-of-type{border-top-left-radius:8px}.rs-multi-tab ul .tab-item:last-child{border-top-right-radius:8px}.rs-multi-tab ul.cdk-drop-list-dragging .tab-item.cdk-drag-disabled:hover{background:#f8fafb!important;cursor:no-drop}.rs-multi-tab ul .isSelect{color:#1f3f5c;background:#fff}.rs-multi-tab ul .notSelect img{display:none}.rs-multi-tab ul .notSelect .img-block{display:inline-block;width:22px}.rs-multi-tab ul .notSelect:hover{color:#1f3f5c;background-color:rgba(31,123,255,.04)}.rs-multi-tab ul .notSelect:hover .img-block{display:none}.rs-multi-tab ul .notSelect:hover img{display:inline-block}.rs-multi-tab .refresh-tab{cursor:pointer;text-align:right;color:#6c7c90;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;padding-right:12px}.rs-multi-tab .refresh-tab img{vertical-align:middle;margin-right:4px}.refresh-tab-loading{-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}.notSelectTooltip{transform:translateX(-12px)}.tab-item.cdk-drag{max-width:164px;padding:0 12px;display:flex;align-items:center;flex:auto;border:1px solid #e5eaef;border-bottom:none;color:#5f6f81;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;height:28px;background:#f8fafb;vertical-align:top;position:relative;cursor:default}.tab-item.cdk-drag .tabTitle{display:inline-block;white-space:nowrap;font-size:11px;font-family:Arial;font-style:normal;font-weight:400;line-height:16px;transition:width .3s}.tab-item.cdk-drag img{border-radius:4px;padding:4px;margin-left:6px;margin-top:1px;vertical-align:top;cursor:pointer}.tab-item.cdk-drag img:hover{background:#dce8f6}@-webkit-keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.tooltip-content{padding:4px;color:#f8fafb;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:14px}@media (max-width:1400px){.refresh-tab{padding-right:0!important}.refresh-tab span{display:none!important}}@media (max-width:1100px){.rs-multi-tab ul .tab-item img{position:absolute;right:3px;background-color:#fff}.notSelect:hover img{position:absolute;right:3px;background-color:#eff5fb}.img-block{display:none!important}.isSelect:not(:first-child){padding-right:20px!important}}@media (max-width:600px){.rs-multi-tab ul .tab-item{padding:0 8px}.rs-multi-tab ul .notSelect .img-block{width:0!important}}"]
             }] }
 ];
 /** @nocollapse */
@@ -21764,6 +21806,175 @@ if (false) {
     ToolbarItemComponent.prototype.ImageType;
 }
 
+/**
+ * @fileoverview added by tsickle
+ * Generated from: lib/dialog/common-dialog/index.component.ts
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class CommonDialogComponent {
+    /**
+     * @param {?} dialogRef
+     */
+    constructor(dialogRef) {
+        this.dialogRef = dialogRef;
+        // 隐藏元素相关属性
+        this.hideHeader = false;
+        this.hideCloseIcon = false;
+        this.hideCloseBtn = false;
+        this.hideSaveBtn = false;
+        this.saveBtnLabel = "";
+        this.cancelBtnLabel = "";
+        this.showErrorIcon = false;
+        this.showZoomBtn = false;
+        // 显示相关属性
+        this.dialogStyle = {};
+        this.size = "";
+        this.title = "Dialog";
+        this.loading = false;
+        this.saveEmit = new EventEmitter();
+        this.closeEmit = new EventEmitter();
+        this.defaultSize = "";
+        this.customFooter = false;
+    }
+    /**
+     * @return {?}
+     */
+    ngAfterContentInit() {
+        this.customFooter = !!this.footerContent;
+    }
+    /**
+     * @return {?}
+     */
+    ngOnInit() {
+        this.getInfo();
+    }
+    /**
+     * @return {?}
+     */
+    onClose() {
+        if (this.onCloseRequest) {
+            this.onCloseRequest().then((/**
+             * @param {?} confirmed
+             * @return {?}
+             */
+            (confirmed) => {
+                if (confirmed) {
+                    this.dialogRef.close();
+                }
+            }));
+        }
+        else {
+            this.dialogRef.close();
+        }
+    }
+    /**
+     * @return {?}
+     */
+    onZoom() {
+        if (this.size === "largest") {
+            this.size = this.defaultSize; // 恢复到原始大小
+        }
+        else {
+            this.size = "largest"; // 设置为最大化
+        }
+    }
+    /**
+     * @return {?}
+     */
+    onSave() {
+        // 这里把关闭事件emit上去，但是必须使用箭头函数保存this对象
+        this.saveEmit.emit((/**
+         * @param {?} res
+         * @return {?}
+         */
+        (res) => {
+            this.dialogRef.close(res);
+        }));
+    }
+    /**
+     * @private
+     * @return {?}
+     */
+    getInfo() {
+        this.translation = JSON.parse(localStorage.getItem("translation")) || {};
+        this.saveBtnLabel = this.saveBtnLabel || this.translation.SAVE || ".SAVE";
+        this.cancelBtnLabel =
+            this.cancelBtnLabel || this.translation.CANCEL || ".CANCEL";
+        this.defaultSize = this.size;
+    }
+}
+CommonDialogComponent.decorators = [
+    { type: Component, args: [{
+                selector: "rs-common-dialog",
+                template: "<div class=\"dialog\" [ngClass]=\"size\" [ngStyle]=\"dialogStyle\">\r\n  <!-- \u5934\u90E8 -->\r\n  <div *ngIf=\"!hideHeader\" mat-dialog-title class=\"dialog__header\">\r\n    <div class=\"header__title\">\r\n      <img\r\n        src=\"../../../assets/img/notification-status-warning.svg\"\r\n        alt=\"\"\r\n        *ngIf=\"showErrorIcon\"\r\n      />\r\n      {{ title }}\r\n    </div>\r\n    <div class=\"header__actions\">\r\n      <div *ngIf=\"showZoomBtn\" class=\"header__close-btn\" (click)=\"onZoom()\">\r\n        <img\r\n          class=\"header__close-icon\"\r\n          *ngIf=\"size === 'largest'\"\r\n          src=\"../../../assets/img/shrink-icon.svg\"\r\n        />\r\n        <img\r\n          class=\"header__close-icon\"\r\n          *ngIf=\"size !== 'largest'\"\r\n          src=\"../../../assets/img/grow-icon.svg\"\r\n        />\r\n      </div>\r\n      <div *ngIf=\"!hideCloseIcon\" class=\"header__close-btn\" (click)=\"onClose()\">\r\n        <img class=\"header__close-icon\" src=\"../../../assets/img/close.svg\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!-- \u5185\u5BB9 -->\r\n  <div class=\"dialog__content\" mat-dialog-content>\r\n    <ng-content></ng-content>\r\n  </div>\r\n  <!-- \u5E95\u90E8\u6309\u94AE -->\r\n  <div mat-dialog-actions class=\"dialog__footer\">\r\n    <ng-content select=\"[footerSlot]\"></ng-content>\r\n    <!-- \u9ED8\u8BA4\u5C55\u793A\u4FDD\u5B58/\u5173\u95ED\u6309\u94AE -->\r\n    <ng-container *ngIf=\"!customFooter\">\r\n      <ng-template [ngTemplateOutlet]=\"defaultTemplate\"></ng-template>\r\n    </ng-container>\r\n    <ng-template #defaultTemplate>\r\n      <button\r\n        *ngIf=\"!hideCloseBtn\"\r\n        class=\"e-btn\"\r\n        (click)=\"onClose()\"\r\n      >\r\n        {{ cancelBtnLabel }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"!hideSaveBtn\"\r\n        class=\"e-btn e-primary\"\r\n        (click)=\"onSave()\"\r\n      >\r\n        {{ saveBtnLabel }}\r\n      </button>\r\n    </ng-template>\r\n  </div>\r\n  <!-- loading -->\r\n  <div class=\"dialog__loading\" [hidden]=\"!loading\">\r\n    <img src=\"../../../assets/img/raise_loading.gif\" alt=\"\" />\r\n  </div>\r\n</div>\r\n",
+                styles: [":host::ng-deep .dialog{position:relative;max-height:90vh;font-weight:400;padding:20px;overflow:hidden;display:flex;flex-direction:column}:host::ng-deep .dialog.largest{width:80vw!important;max-width:1885px;padding:20px}:host::ng-deep .dialog.medium{width:500px;padding:20px}:host::ng-deep .dialog.small{width:350px;padding:20px 16px}:host::ng-deep .dialog.small .dialog__header{color:#002c4f;margin-bottom:16px}:host::ng-deep .dialog.small .dialog__header .header__title{font-size:13px;line-height:16px}:host::ng-deep .dialog.small .dialog__content{font-size:12px;line-height:16px}:host::ng-deep .dialog.small .dialog__footer{min-height:42px;padding:16px 0 0;font-size:12px;line-height:14px}:host::ng-deep .dialog.small .dialog__footer button{padding:6px 12px;min-width:60px}:host::ng-deep .dialog.large{width:800px;padding:20px}:host::ng-deep .dialog .dialog__header{width:100%;display:flex;justify-content:space-between;align-items:center;padding:0}:host::ng-deep .dialog .dialog__header::before{display:none}:host::ng-deep .dialog .dialog__header .header__title{color:#002c4f;font-family:Arial;font-size:15px;font-weight:700;line-height:18px;flex:1;overflow:hidden;display:flex;align-items:center;gap:8px}:host::ng-deep .dialog .dialog__header .header__actions{display:flex;align-items:center;gap:20px}:host::ng-deep .dialog .dialog__header .header__close-icon{display:block;width:100%;height:100%}:host::ng-deep .dialog .dialog__header .header__close-btn{cursor:pointer;flex:0 0 20px;padding:4px;width:20px;height:20px;display:flex;justify-content:center;align-items:center}:host::ng-deep .dialog .dialog__content{width:100%;min-height:38px;position:relative;overflow-y:auto;overflow-x:hidden;margin:0;padding:0;font-size:13px;line-height:19px;flex:1;height:0}:host::ng-deep .dialog .dialog__footer{position:relative;display:flex;align-items:center;justify-content:flex-end;padding:20px 0 0;font-size:13px;line-height:16px;margin-bottom:0}:host::ng-deep .dialog .dialog__footer button{border-radius:4px;padding:6px 16px;border:none;min-width:70px}:host::ng-deep .dialog .dialog__footer button+button{margin-left:12px}:host::ng-deep .dialog .dialog__footer .save-btn{background:#1364b3;border:1px solid #1364b3;font-weight:700;color:#fff}:host::ng-deep .dialog .dialog__footer .cancel-btn{border:1px solid #adb5bd;background:#fff}:host::ng-deep .dialog .dialog__loading{height:100%;background:0 0;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999}:host::ng-deep .dialog .dialog__loading img{position:absolute;left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-50%)}"]
+            }] }
+];
+/** @nocollapse */
+CommonDialogComponent.ctorParameters = () => [
+    { type: MatDialogRef }
+];
+CommonDialogComponent.propDecorators = {
+    hideHeader: [{ type: Input }],
+    hideCloseIcon: [{ type: Input }],
+    hideCloseBtn: [{ type: Input }],
+    hideSaveBtn: [{ type: Input }],
+    saveBtnLabel: [{ type: Input }],
+    cancelBtnLabel: [{ type: Input }],
+    showErrorIcon: [{ type: Input }],
+    showZoomBtn: [{ type: Input }],
+    onCloseRequest: [{ type: Input }],
+    dialogStyle: [{ type: Input }],
+    size: [{ type: Input }],
+    title: [{ type: Input }],
+    loading: [{ type: Input }],
+    saveEmit: [{ type: Output }],
+    closeEmit: [{ type: Output }],
+    footerContent: [{ type: ContentChild, args: ["footerSlot", { static: false },] }]
+};
+if (false) {
+    /** @type {?} */
+    CommonDialogComponent.prototype.translation;
+    /** @type {?} */
+    CommonDialogComponent.prototype.hideHeader;
+    /** @type {?} */
+    CommonDialogComponent.prototype.hideCloseIcon;
+    /** @type {?} */
+    CommonDialogComponent.prototype.hideCloseBtn;
+    /** @type {?} */
+    CommonDialogComponent.prototype.hideSaveBtn;
+    /** @type {?} */
+    CommonDialogComponent.prototype.saveBtnLabel;
+    /** @type {?} */
+    CommonDialogComponent.prototype.cancelBtnLabel;
+    /** @type {?} */
+    CommonDialogComponent.prototype.showErrorIcon;
+    /** @type {?} */
+    CommonDialogComponent.prototype.showZoomBtn;
+    /** @type {?} */
+    CommonDialogComponent.prototype.onCloseRequest;
+    /** @type {?} */
+    CommonDialogComponent.prototype.dialogStyle;
+    /** @type {?} */
+    CommonDialogComponent.prototype.size;
+    /** @type {?} */
+    CommonDialogComponent.prototype.title;
+    /** @type {?} */
+    CommonDialogComponent.prototype.loading;
+    /** @type {?} */
+    CommonDialogComponent.prototype.saveEmit;
+    /** @type {?} */
+    CommonDialogComponent.prototype.closeEmit;
+    /** @type {?} */
+    CommonDialogComponent.prototype.defaultSize;
+    /** @type {?} */
+    CommonDialogComponent.prototype.footerContent;
+    /** @type {?} */
+    CommonDialogComponent.prototype.customFooter;
+    /** @type {?} */
+    CommonDialogComponent.prototype.dialogRef;
+}
+
 /**
  * @fileoverview added by tsickle
  * Generated from: lib/service/icon-loader.service.ts
@@ -21948,139 +22159,6 @@ KeepAliveService.decorators = [
 ];
 /** @nocollapse */ KeepAliveService.ngInjectableDef = ɵɵdefineInjectable({ factory: function KeepAliveService_Factory() { return new KeepAliveService(); }, token: KeepAliveService, providedIn: "root" });
 
-/**
- * @fileoverview added by tsickle
- * Generated from: lib/dialog/common-dialog/index.component.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class CommonDialogComponent {
-    /**
-     * @param {?} dialogRef
-     */
-    constructor(dialogRef) {
-        this.dialogRef = dialogRef;
-        // 隐藏元素相关属性
-        this.hideHeader = false;
-        this.hideCloseIcon = false;
-        this.hideCloseBtn = false;
-        this.hideSaveBtn = false;
-        this.saveBtnLabel = "";
-        this.cancelBtnLabel = "";
-        this.showErrorIcon = false;
-        // 显示相关属性
-        this.size = "";
-        this.title = "Dialog";
-        this.loading = false;
-        this.saveEmit = new EventEmitter();
-        this.closeEmit = new EventEmitter();
-        this.customFooter = false;
-    }
-    /**
-     * @return {?}
-     */
-    ngAfterContentInit() {
-        this.customFooter = !!this.footerContent;
-    }
-    /**
-     * @return {?}
-     */
-    ngOnInit() {
-        this.getInfo();
-    }
-    /**
-     * @param {?=} res
-     * @return {?}
-     */
-    onClose(res) {
-        this.dialogRef.close(res);
-        this.closeEmit.emit(res);
-    }
-    /**
-     * @return {?}
-     */
-    onSave() {
-        // 这里把关闭事件emit上去，但是必须使用箭头函数保存this对象
-        this.saveEmit.emit((/**
-         * @param {?} res
-         * @return {?}
-         */
-        (res) => {
-            this.onClose(res);
-        }));
-    }
-    /**
-     * @private
-     * @return {?}
-     */
-    getInfo() {
-        this.translation = JSON.parse(localStorage.getItem("translation")) || {};
-        this.saveBtnLabel =
-            this.saveBtnLabel || this.translation.SAVE || ".SAVE";
-        this.cancelBtnLabel =
-            this.cancelBtnLabel || this.translation.CANCEL || ".CANCEL";
-    }
-}
-CommonDialogComponent.decorators = [
-    { type: Component, args: [{
-                selector: "kt-common-dialog",
-                template: "<div class=\"dialog\" [ngClass]=\"size\">\r\n\t<!-- \u5934\u90E8 -->\r\n\t<div *ngIf=\"!hideHeader\" mat-dialog-title class=\"dialog__header\">\r\n\t\t<div class=\"header__title\">\r\n\t\t\t<img\r\n\t\t\t\tsrc=\"../../../assets/img/notification-status-warning.svg\"\r\n\t\t\t\talt=\"\"\r\n\t\t\t\t*ngIf=\"showErrorIcon\"\r\n\t\t\t/>\r\n\t\t\t{{ title }}\r\n\t\t</div>\r\n\t\t<div\r\n\t\t\t*ngIf=\"!hideCloseIcon\"\r\n\t\t\tclass=\"header__close-btn\"\r\n\t\t\t(click)=\"onClose()\"\r\n\t\t>\r\n\t\t\t<img\r\n\t\t\t\tclass=\"header__close-icon\"\r\n\t\t\t\tsrc=\"../../../assets/img/close.svg\"\r\n\t\t\t/>\r\n\t\t</div>\r\n\t</div>\r\n\t<!-- \u5185\u5BB9 -->\r\n\t<div class=\"dialog__content\" mat-dialog-content>\r\n\t\t<ng-content></ng-content>\r\n\t</div>\r\n\t<!-- \u5E95\u90E8\u6309\u94AE -->\r\n\t<div mat-dialog-actions class=\"dialog__footer\">\r\n\t\t<ng-content select=\"[footerSlot]\"></ng-content>\r\n\t\t<!-- \u9ED8\u8BA4\u5C55\u793A\u4FDD\u5B58/\u5173\u95ED\u6309\u94AE -->\r\n\t\t<ng-container *ngIf=\"!customFooter\">\r\n\t\t\t<ng-template [ngTemplateOutlet]=\"defaultTemplate\"></ng-template>\r\n\t\t</ng-container>\r\n\t\t<ng-template #defaultTemplate>\r\n\t\t\t<button *ngIf=\"!hideCloseBtn\" class=\"e-btn\" [ngClass]=\"size\" mat-dialog-close>\r\n\t\t\t\t{{ cancelBtnLabel }}\r\n\t\t\t</button>\r\n\t\t\t<button *ngIf=\"!hideSaveBtn\" class=\"e-btn e-primary\" [ngClass]=\"size\" (click)=\"onSave()\">\r\n\t\t\t\t{{ saveBtnLabel }}\r\n\t\t\t</button>\r\n\t\t</ng-template>\r\n\t</div>\r\n\t<!-- loading -->\r\n\t<div class=\"dialog__loading\" [hidden]=\"!loading\">\r\n\t\t<img src=\"../../../assets/img/raise_loading.gif\" alt=\"\" />\r\n\t</div>\r\n</div>\r\n",
-                styles: [":host::ng-deep .dialog{position:relative;max-height:90vh;font-weight:400;overflow:hidden}:host::ng-deep .dialog.medium{width:500px;padding:20px}:host::ng-deep .dialog.small{width:350px;padding:20px 16px}:host::ng-deep .dialog.small .dialog__header{color:#002c4f;margin-bottom:16px}:host::ng-deep .dialog.small .dialog__header .header__title{font-size:13px;line-height:16px}:host::ng-deep .dialog.small .dialog__content{font-size:12px;line-height:16px}:host::ng-deep .dialog.small .dialog__footer{min-height:42px;padding:16px 0 0;font-size:12px;line-height:14px}:host::ng-deep .dialog.small .dialog__footer button{padding:6px 12px;min-width:60px}:host::ng-deep .dialog.large{width:800px;padding:20px}:host::ng-deep .dialog .dialog__header{width:100%;display:flex;justify-content:space-between;align-items:center;padding:0}:host::ng-deep .dialog .dialog__header::before{display:none}:host::ng-deep .dialog .dialog__header .header__title{color:#002c4f;font-family:Arial;font-size:15px;font-weight:700;line-height:18px;flex:1;overflow:hidden;display:flex;align-items:center;gap:8px}:host::ng-deep .dialog .dialog__header .header__close-icon{display:block;width:100%;height:100%}:host::ng-deep .dialog .dialog__header .header__close-btn{cursor:pointer;flex:0 0 20px;padding:4px;width:20px;height:20px;display:flex;justify-content:center;align-items:center}:host::ng-deep .dialog .dialog__content{width:100%;min-height:38px;position:relative;overflow-y:auto;overflow-x:hidden;margin:0;padding:0;font-size:13px;line-height:19px}:host::ng-deep .dialog .dialog__footer{position:relative;display:flex;align-items:center;justify-content:flex-end;padding:20px 0 0;font-size:13px;line-height:16px;margin-bottom:0}:host::ng-deep .dialog .dialog__footer button{border-radius:4px;padding:6px 16px;border:none;min-width:70px}:host::ng-deep .dialog .dialog__footer button+button{margin-left:12px}:host::ng-deep .dialog .dialog__footer .save-btn{background:#1364b3;border:1px solid #1364b3;font-weight:700;color:#fff}:host::ng-deep .dialog .dialog__footer .cancel-btn{border:1px solid #adb5bd;background:#fff}:host::ng-deep .dialog .dialog__loading{height:100%;background:0 0;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999}:host::ng-deep .dialog .dialog__loading img{position:absolute;left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-50%)}"]
-            }] }
-];
-/** @nocollapse */
-CommonDialogComponent.ctorParameters = () => [
-    { type: MatDialogRef }
-];
-CommonDialogComponent.propDecorators = {
-    hideHeader: [{ type: Input }],
-    hideCloseIcon: [{ type: Input }],
-    hideCloseBtn: [{ type: Input }],
-    hideSaveBtn: [{ type: Input }],
-    saveBtnLabel: [{ type: Input }],
-    cancelBtnLabel: [{ type: Input }],
-    showErrorIcon: [{ type: Input }],
-    size: [{ type: Input }],
-    title: [{ type: Input }],
-    loading: [{ type: Input }],
-    saveEmit: [{ type: Output }],
-    closeEmit: [{ type: Output }],
-    footerContent: [{ type: ContentChild, args: ["footerSlot", { static: false },] }]
-};
-if (false) {
-    /** @type {?} */
-    CommonDialogComponent.prototype.translation;
-    /** @type {?} */
-    CommonDialogComponent.prototype.hideHeader;
-    /** @type {?} */
-    CommonDialogComponent.prototype.hideCloseIcon;
-    /** @type {?} */
-    CommonDialogComponent.prototype.hideCloseBtn;
-    /** @type {?} */
-    CommonDialogComponent.prototype.hideSaveBtn;
-    /** @type {?} */
-    CommonDialogComponent.prototype.saveBtnLabel;
-    /** @type {?} */
-    CommonDialogComponent.prototype.cancelBtnLabel;
-    /** @type {?} */
-    CommonDialogComponent.prototype.showErrorIcon;
-    /** @type {?} */
-    CommonDialogComponent.prototype.size;
-    /** @type {?} */
-    CommonDialogComponent.prototype.title;
-    /** @type {?} */
-    CommonDialogComponent.prototype.loading;
-    /** @type {?} */
-    CommonDialogComponent.prototype.saveEmit;
-    /** @type {?} */
-    CommonDialogComponent.prototype.closeEmit;
-    /** @type {?} */
-    CommonDialogComponent.prototype.footerContent;
-    /** @type {?} */
-    CommonDialogComponent.prototype.customFooter;
-    /** @type {?} */
-    CommonDialogComponent.prototype.dialogRef;
-}
-
 /**
  * @fileoverview added by tsickle
  * Generated from: lib/raise-common-lib.module.ts
@@ -22117,13 +22195,14 @@ RaiseCommonLibModule.decorators = [
                     RsCommentaryComponent,
                     RSNavCardGroupComponent,
                     RSToolbarComponent,
-                    TruncatedTextToggleComponent
+                    TruncatedTextToggleComponent,
                 ],
                 imports: [
                     CommonModule,
                     HttpClientModule,
                     ReactiveFormsModule,
                     FormsModule,
+                    DragDropModule,
                     MatSnackBarModule,
                     MatMenuModule,
                     MatTooltipModule,
@@ -22208,6 +22287,7 @@ RaiseCommonLibModule.decorators = [
                     HttpClientModule,
                     ReactiveFormsModule,
                     FormsModule,
+                    DragDropModule,
                     MatSnackBarModule,
                     MatMenuModule,
                     MatTooltipModule,
@@ -22272,7 +22352,8 @@ RaiseCommonLibModule.decorators = [
                     RsCommentaryComponent,
                     RSNavCardGroupComponent,
                     RSToolbarComponent,
-                    TruncatedTextToggleComponent
+                    TruncatedTextToggleComponent,
+                    CommonDialogComponent,
                 ],
                 entryComponents: [
                     NewActionNotificationComponent,
@@ -22295,5 +22376,5 @@ RaiseCommonLibModule.decorators = [
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-export { CheckboxGroupComponent, CommonFunctionService, CommonGridComponent, DefaultDrawerConfig, DialogService, DrawerComponent, DrawerFormComponent, DrawerService, EmailPattern, EncryptedInputComponent, FloatBoxComponent, GridActionComponent, GridActionItemComponent, GridBoxComponent, IconLoaderService, KeepAliveService, MainContainerComponent, MessageType, MultiTabComponent, RSAsideComponent, RSFooterComponent, RSHeaderComponent, RSNavCardGroupComponent, RSToolbarComponent, RadioGroupComponent, RaiseCommonLibModule, RsCommentaryComponent, RsPageListComponent, RsPageTabComponent, SwitchInputComponent, TagInputComponent, ToolbarItemComponent, TranslationService, TruncatedTextToggleComponent, filterShowSection, Debounce as ɵa, NewActionNotificationComponent as ɵb, CommonDialogComponent as ɵc, CommonDeleteComponent as ɵd };
+export { CheckboxGroupComponent, CommonDialogComponent, CommonFunctionService, CommonGridComponent, DefaultDrawerConfig, DialogService, DrawerComponent, DrawerFormComponent, DrawerService, EmailPattern, EncryptedInputComponent, FloatBoxComponent, GridActionComponent, GridActionItemComponent, GridBoxComponent, IconLoaderService, KeepAliveService, MainContainerComponent, MessageType, MultiTabComponent, RSAsideComponent, RSFooterComponent, RSHeaderComponent, RSNavCardGroupComponent, RSToolbarComponent, RadioGroupComponent, RaiseCommonLibModule, RsCommentaryComponent, RsPageListComponent, RsPageTabComponent, SwitchInputComponent, TagInputComponent, ToolbarItemComponent, TranslationService, TruncatedTextToggleComponent, filterShowSection, Debounce as ɵa, NewActionNotificationComponent as ɵb, CommonDeleteComponent as ɵc };
 //# sourceMappingURL=raise-common-lib.js.map