@dignite-ng/expand.file-explorer 0.0.22 → 0.0.28

package/fesm2022/dignite-ng-expand.file-explorer.mjs

@@ -75,8 +75,8 @@ class FileApiService {
         }
         return result;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileApiService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileApiService, providedIn: 'root' });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileApiService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileApiService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileApiService, decorators: [{
             type: Injectable,
@@ -161,27 +161,30 @@ let ImageTypeOption = [{
 ];
 
 class FilePreviewComponent {
-    modalService;
-    /**文件宽度 */
-    width = '100px';
-    /*文件链接 */
-    src = '';
-    /**是否支持大图预览 */
-    preview = true;
-    /**文件类型 */
-    type = '';
-    /**文件名称 */
-    name = '';
-    /**是否是文件 */
-    isImage = true;
-    /**是否是视频 */
-    isAudio = false;
-    /**是否是音频 */
-    isVideo = false;
-    /**文件类型及图标 */
-    _ImageTypeOption = ImageTypeOption;
     constructor(modalService) {
         this.modalService = modalService;
+        /**文件宽度 */
+        this.width = '100px';
+        /*文件链接 */
+        this.src = '';
+        /**是否支持大图预览 */
+        this.preview = true;
+        /**文件类型 */
+        this.type = '';
+        /**文件名称 */
+        this.name = '';
+        /**是否是文件 */
+        this.isImage = true;
+        /**是否是视频 */
+        this.isAudio = false;
+        /**是否是音频 */
+        this.isVideo = false;
+        /**文件类型及图标 */
+        this._ImageTypeOption = ImageTypeOption;
+        /**放大倍数 */
+        this.zoom = 10;
+        /**旋转 */
+        this.rotate = 0;
     }
     ngAfterContentInit() {
         //Called after ngOnInit when the component's or directive's content has been initialized.
@@ -196,12 +199,6 @@ class FilePreviewComponent {
     /**预览图片 */
     previewImage() {
     }
-    /**模态框实例 */
-    modalRef;
-    /**放大倍数 */
-    zoom = 10;
-    /**旋转 */
-    rotate = 0;
     /**打开预览弹窗 */
     OpenPreviewImage(content) {
         this.modalRef = this.modalService.open(content, {
@@ -235,8 +232,8 @@ class FilePreviewComponent {
             return this.rotate = 0;
         this.rotate += 90;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FilePreviewComponent, deps: [{ token: i8.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FilePreviewComponent, selector: "fe-file-preview", inputs: { width: "width", src: "src", preview: "preview", type: "type", name: "name" }, ngImport: i0, template: "<div class=\"image_box\" [style]=\"{width:width}\">\n    <div class=\"img_box\" *ngIf=\"isImage\">\n        <img [src]=\"src\"  />\n        <div class=\"option_box\" *ngIf=\"preview\">\n            <i class=\"fa fa-eye \" (click.stop)=\"OpenPreviewImage(content)\"></i>\n        </div>\n    </div>\n    <a [href]=\"src\" [download]=\"name\" target>\n        <i class=\"fa fa-file-audio-o fs-1\" *ngIf=\"isAudio\"></i>\n        <i class=\"fa fa-file-video-o fs-1\" *ngIf=\"isVideo\"></i>\n        <ng-container *ngIf=\"!(isImage||isAudio||isVideo)\">\n            <ng-container *ngFor=\"let item of _ImageTypeOption; let i=index\">\n                <i class=\"fs-1\" [ngClass]=\"item.icon\" *ngIf=\"item.type===type\"></i>\n            </ng-container>\n        </ng-container>\n    </a>\n</div>\n\n<ng-template #content let-modal>\n    <div class=\"modal-header\">\n        <div class=\"d-flex justify-content-end w-100 fs-3\">\n            <i class=\"mx-2 fa  fa fa-repeat\" aria-hidden=\"true\" title=\"\u53F3\u65CB\u8F6C\" role=\"button\" (click)=\"RotateRight()\"></i>\n            <i class=\"mx-2 fa  fa-search-minus\" aria-hidden=\"true\" title=\"\u7F29\u5C0F\" role=\"button\" (click)=\"zoomOut()\"></i>\n            <i class=\"mx-2 fa  fa-search-plus\" aria-hidden=\"true\" title=\"\u653E\u5927\" role=\"button\" (click)=\"zoomIn()\"></i>\n            <i class=\"mx-2 fa  fa-times\" aria-hidden=\"true\" role=\"button\" (click)=\"modal.dismiss('Cross click')\"></i>\n        </div>\n    </div> \n    <div class=\"modal-body d-flex justify-content-center align-items-center \">\n        <img width=\"400\" class=\"modal-body-preview\"  [src]=\"src\" [style.transform]=\"'scale('+zoom/10+') rotate('+rotate+'deg)'\"   >\n    </div>\n</ng-template>", styles: [".image_box{text-align:center;position:relative}.image_box img{width:100%}.image_box .img_box:hover .option_box{display:flex}.image_box .option_box{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000040;align-items:center;justify-content:center;display:none;transition:all .2s linear}.image_box .option_box i{cursor:pointer;font-size:18px;color:#fff}.modal-body-preview{transition:all .2s}::ng-deep .dignite-preview .modal-content{background-color:transparent;color:#fff}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FilePreviewComponent, deps: [{ token: i8.NgbModal }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FilePreviewComponent, selector: "fe-file-preview", inputs: { width: "width", src: "src", preview: "preview", type: "type", name: "name" }, ngImport: i0, template: "<div class=\"image_box\" [style]=\"{width:width}\">\n    <div class=\"img_box\" *ngIf=\"isImage\">\n        <img [src]=\"src\"  />\n        <div class=\"option_box\" *ngIf=\"preview\">\n            <i class=\"fa fa-eye \" (click.stop)=\"OpenPreviewImage(content)\"></i>\n        </div>\n    </div>\n    <a [href]=\"src\" [download]=\"name\" target>\n        <i class=\"fa fa-file-audio-o fs-1\" *ngIf=\"isAudio\"></i>\n        <i class=\"fa fa-file-video-o fs-1\" *ngIf=\"isVideo\"></i>\n        <ng-container *ngIf=\"!(isImage||isAudio||isVideo)\">\n            <ng-container *ngFor=\"let item of _ImageTypeOption; let i=index\">\n                <i class=\"fs-1\" [ngClass]=\"item.icon\" *ngIf=\"item.type===type\"></i>\n            </ng-container>\n        </ng-container>\n    </a>\n</div>\n\n<ng-template #content let-modal>\n    <div class=\"modal-header\">\n        <div class=\"d-flex justify-content-end w-100 fs-3\">\n            <i class=\"mx-2 fa  fa fa-repeat\" aria-hidden=\"true\" title=\"\u53F3\u65CB\u8F6C\" role=\"button\" (click)=\"RotateRight()\"></i>\n            <i class=\"mx-2 fa  fa-search-minus\" aria-hidden=\"true\" title=\"\u7F29\u5C0F\" role=\"button\" (click)=\"zoomOut()\"></i>\n            <i class=\"mx-2 fa  fa-search-plus\" aria-hidden=\"true\" title=\"\u653E\u5927\" role=\"button\" (click)=\"zoomIn()\"></i>\n            <i class=\"mx-2 fa  fa-times\" aria-hidden=\"true\" role=\"button\" (click)=\"modal.dismiss('Cross click')\"></i>\n        </div>\n    </div> \n    <div class=\"modal-body d-flex justify-content-center align-items-center \">\n        <img width=\"400\" class=\"modal-body-preview\"  [src]=\"src\" [style.transform]=\"'scale('+zoom/10+') rotate('+rotate+'deg)'\"   >\n    </div>\n</ng-template>", styles: [".image_box{text-align:center;position:relative}.image_box img{width:100%}.image_box .img_box:hover .option_box{display:flex}.image_box .option_box{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000040;align-items:center;justify-content:center;display:none;transition:all .2s linear}.image_box .option_box i{cursor:pointer;font-size:18px;color:#fff}.modal-body-preview{transition:all .2s}::ng-deep .dignite-preview .modal-content{background-color:transparent;color:#fff}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FilePreviewComponent, decorators: [{
             type: Component,
@@ -254,39 +251,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
             }] } });
 
 class FileEditComponent {
-    _FileApiService;
     constructor(_FileApiService) {
         this._FileApiService = _FileApiService;
+        /**是否多选 */
+        this._multiple = true;
+        /**文件数据--已上传的数据 */
+        this._fileData = [];
+        /** 跟随表单提交--已提交的数据，或选择的数据源--回调*/
+        this.fileDataChange = new EventEmitter();
+        /**文件大小限制
+         * @param 1mb
+        */
+        this.sizeLimit = 1048576;
+        /**文件表格数据 */
+        this.filesTableData = [];
+        /** 待删除已上传的文件们*/
+        this.deleteTheUploadedFiles = [];
     }
-    /**是否多选 */
-    _multiple = true;
     set multiple(v) {
         this._multiple = v;
         if (v) { }
     }
-    /**文件数据--已上传的数据 */
-    _fileData = [];
     set fileData(v) {
         this._fileData = v;
         if (v.length > 0) {
             this.getFileChange({ target: { files: v } });
         }
     }
-    /** 跟随表单提交--已提交的数据，或选择的数据源--回调*/
-    fileDataChange = new EventEmitter();
-    /**文件大小限制
-     * @param 1mb
-    */
-    sizeLimit = 1048576;
     set limit(v) {
         this.sizeLimit = v;
     }
-    /**文件表格数据 */
-    filesTableData = [];
-    /** 待删除已上传的文件们*/
-    deleteTheUploadedFiles = [];
-    /**获取文件选择框的元素 */
-    fileEdit;
     /**获取文件信息改变 */
     async getFileChange(event) {
         let files = new Array(...event.target.files);
@@ -330,8 +324,8 @@ class FileEditComponent {
             resolve(files);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileEditComponent, deps: [{ token: FileApiService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileEditComponent, selector: "fe-file-edit", inputs: { multiple: "multiple", fileData: "fileData", limit: "limit" }, outputs: { fileDataChange: "fileDataChange" }, viewQueries: [{ propertyName: "fileEdit", first: true, predicate: ["fileEdit"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"input-group mb-2\">\n    <input type=\"file\" class=\"form-control\" #fileEdit [multiple]=\"_multiple\" (change)=\"getFileChange($event)\">\n</div>\n\n<table class=\"table\" *ngIf=\"filesTableData.length>0\">\n    <thead>\n        <tr>\n            <th scope=\"col\"></th>\n            <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n            <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n            <th scope=\"col\"></th>\n        </tr>\n    </thead>\n    <tbody>\n        <ng-container *ngFor=\"let item of filesTableData;let i =index\">\n            <tr>\n                <td>\n                    <fe-file-preview [width]=\"'80px'\" [src]=\"item.src\" [name]=\"item.name\" [type]=\"item.type\" [preview]=\"true\"></fe-file-preview>\n                </td>\n                <th scope=\"row\">\n                    <div>{{item.name}}</div>\n                    <div class=\"form-text text-danger\" *ngIf=\"item.size > sizeLimit\">\n                        {{'FileExplorer::ExceedsMaximumSize' |\n                        abpLocalization:_FileApiService.formatFileSize(sizeLimit)}}</div>\n                </th>\n                <td>{{item.fileSize}}</td>\n                <td>\n                    <button class=\"btn btn-sm p-0 btn-light \" (click.stop)=\"deleteFileTableItem(i,item)\">\n                        <i class=\"fas fa-trash p-2\"></i>\n                    </button>\n                </td>\n            </tr>\n        </ng-container>\n    </tbody>\n</table>", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "component", type: FilePreviewComponent, selector: "fe-file-preview", inputs: ["width", "src", "preview", "type", "name"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileEditComponent, deps: [{ token: FileApiService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileEditComponent, selector: "fe-file-edit", inputs: { multiple: "multiple", fileData: "fileData", limit: "limit" }, outputs: { fileDataChange: "fileDataChange" }, viewQueries: [{ propertyName: "fileEdit", first: true, predicate: ["fileEdit"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"input-group mb-2\">\n    <input type=\"file\" class=\"form-control\" #fileEdit [multiple]=\"_multiple\" (change)=\"getFileChange($event)\">\n</div>\n\n<table class=\"table\" *ngIf=\"filesTableData.length>0\">\n    <thead>\n        <tr>\n            <th scope=\"col\"></th>\n            <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n            <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n            <th scope=\"col\"></th>\n        </tr>\n    </thead>\n    <tbody>\n        <ng-container *ngFor=\"let item of filesTableData;let i =index\">\n            <tr>\n                <td>\n                    <fe-file-preview [width]=\"'80px'\" [src]=\"item.src\" [name]=\"item.name\" [type]=\"item.type\" [preview]=\"true\"></fe-file-preview>\n                </td>\n                <th scope=\"row\">\n                    <div>{{item.name}}</div>\n                    <div class=\"form-text text-danger\" *ngIf=\"item.size > sizeLimit\">\n                        {{'FileExplorer::ExceedsMaximumSize' |\n                        abpLocalization:_FileApiService.formatFileSize(sizeLimit)}}</div>\n                </th>\n                <td>{{item.fileSize}}</td>\n                <td>\n                    <button class=\"btn btn-sm p-0 btn-light \" (click.stop)=\"deleteFileTableItem(i,item)\">\n                        <i class=\"fas fa-trash p-2\"></i>\n                    </button>\n                </td>\n            </tr>\n        </ng-container>\n    </tbody>\n</table>", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "component", type: FilePreviewComponent, selector: "fe-file-preview", inputs: ["width", "src", "preview", "type", "name"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileEditComponent, decorators: [{
             type: Component,
@@ -350,53 +344,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
             }] } });
 
 let FileDescriptorService$1 = class FileDescriptorService {
-    restService;
-    apiName = 'FileExplorer';
-    create = (input, config) => this.restService.request({
-        method: 'POST',
-        url: '/api/file-explorer/files',
-        params: { containerName: input.containerName, cellName: input.cellName, directoryId: input.directoryId, entityId: input.entityId },
-        body: input.file,
-    }, { apiName: this.apiName, ...config });
-    delete = (id, config) => this.restService.request({
-        method: 'DELETE',
-        url: `/api/file-explorer/files/${id}`,
-    }, { apiName: this.apiName, ...config });
-    download = (containerName, blobName, fileName, config) => this.restService.request({
-        method: 'GET',
-        url: `/api/file-explorer/files/download/${containerName}/${blobName}`,
-        params: { fileName },
-    }, { apiName: this.apiName, ...config });
-    get = (id, config) => this.restService.request({
-        method: 'GET',
-        url: `/api/file-explorer/files/${id}`,
-    }, { apiName: this.apiName, ...config });
-    getFileContainerConfiguration = (containerName, config) => this.restService.request({
-        method: 'GET',
-        url: '/api/file-explorer/files/configuration',
-        params: { containerName },
-    }, { apiName: this.apiName, ...config });
-    getList = (input, config) => this.restService.request({
-        method: 'GET',
-        url: '/api/file-explorer/files',
-        params: { containerName: input.containerName, directoryId: input.directoryId, creatorId: input.creatorId, filter: input.filter, entityId: input.entityId, sorting: input.sorting, skipCount: input.skipCount, maxResultCount: input.maxResultCount },
-    }, { apiName: this.apiName, ...config });
-    getStream = (containerName, blobName, imageResize, config) => this.restService.request({
-        method: 'GET',
-        responseType: 'blob',
-        url: `/api/file-explorer/files/${containerName}/${blobName}`,
-        params: { width: imageResize.width, height: imageResize.height },
-    }, { apiName: this.apiName, ...config });
-    update = (id, input, config) => this.restService.request({
-        method: 'PUT',
-        url: `/api/file-explorer/files/${id}`,
-        body: input,
-    }, { apiName: this.apiName, ...config });
     constructor(restService) {
         this.restService = restService;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, deps: [{ token: i3.RestService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, providedIn: 'root' });
+        this.apiName = 'FileExplorer';
+        this.create = (input, config) => this.restService.request({
+            method: 'POST',
+            url: '/api/file-explorer/files',
+            params: { containerName: input.containerName, cellName: input.cellName, directoryId: input.directoryId, entityId: input.entityId },
+            body: input.file,
+        }, { apiName: this.apiName, ...config });
+        this.delete = (id, config) => this.restService.request({
+            method: 'DELETE',
+            url: `/api/file-explorer/files/${id}`,
+        }, { apiName: this.apiName, ...config });
+        this.download = (containerName, blobName, fileName, config) => this.restService.request({
+            method: 'GET',
+            url: `/api/file-explorer/files/download/${containerName}/${blobName}`,
+            params: { fileName },
+        }, { apiName: this.apiName, ...config });
+        this.get = (id, config) => this.restService.request({
+            method: 'GET',
+            url: `/api/file-explorer/files/${id}`,
+        }, { apiName: this.apiName, ...config });
+        this.getFileContainerConfiguration = (containerName, config) => this.restService.request({
+            method: 'GET',
+            url: '/api/file-explorer/files/configuration',
+            params: { containerName },
+        }, { apiName: this.apiName, ...config });
+        this.getList = (input, config) => this.restService.request({
+            method: 'GET',
+            url: '/api/file-explorer/files',
+            params: { containerName: input.containerName, directoryId: input.directoryId, creatorId: input.creatorId, filter: input.filter, entityId: input.entityId, sorting: input.sorting, skipCount: input.skipCount, maxResultCount: input.maxResultCount },
+        }, { apiName: this.apiName, ...config });
+        this.getStream = (containerName, blobName, imageResize, config) => this.restService.request({
+            method: 'GET',
+            responseType: 'blob',
+            url: `/api/file-explorer/files/${containerName}/${blobName}`,
+            params: { width: imageResize.width, height: imageResize.height },
+        }, { apiName: this.apiName, ...config });
+        this.update = (id, input, config) => this.restService.request({
+            method: 'PUT',
+            url: `/api/file-explorer/files/${id}`,
+            body: input,
+        }, { apiName: this.apiName, ...config });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, deps: [{ token: i3.RestService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, providedIn: 'root' }); }
 };
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService$1, decorators: [{
             type: Injectable,
@@ -411,41 +404,40 @@ var index$e = /*#__PURE__*/Object.freeze({
 });
 
 class FileDescriptorService {
-    restService;
-    apiName = 'FileExplorer';
-    create = (input, config) => this.restService.request({
-        method: 'POST',
-        url: '/api/file-explorer/directories',
-        body: input,
-    }, { apiName: this.apiName, ...config });
-    delete = (id, config) => this.restService.request({
-        method: 'DELETE',
-        url: `/api/file-explorer/directories/${id}`,
-    }, { apiName: this.apiName, ...config });
-    get = (id, config) => this.restService.request({
-        method: 'GET',
-        url: `/api/file-explorer/directories/${id}`,
-    }, { apiName: this.apiName, ...config });
-    getList = (input, config) => this.restService.request({
-        method: 'GET',
-        url: '/api/file-explorer/directories',
-        params: { containerName: input.containerName },
-    }, { apiName: this.apiName, ...config });
-    move = (id, input, config) => this.restService.request({
-        method: 'PUT',
-        url: `/api/file-explorer/directories/${id}/move`,
-        body: input,
-    }, { apiName: this.apiName, ...config });
-    update = (id, input, config) => this.restService.request({
-        method: 'PUT',
-        url: `/api/file-explorer/directories/${id}`,
-        body: input,
-    }, { apiName: this.apiName, ...config });
     constructor(restService) {
         this.restService = restService;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, deps: [{ token: i3.RestService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, providedIn: 'root' });
+        this.apiName = 'FileExplorer';
+        this.create = (input, config) => this.restService.request({
+            method: 'POST',
+            url: '/api/file-explorer/directories',
+            body: input,
+        }, { apiName: this.apiName, ...config });
+        this.delete = (id, config) => this.restService.request({
+            method: 'DELETE',
+            url: `/api/file-explorer/directories/${id}`,
+        }, { apiName: this.apiName, ...config });
+        this.get = (id, config) => this.restService.request({
+            method: 'GET',
+            url: `/api/file-explorer/directories/${id}`,
+        }, { apiName: this.apiName, ...config });
+        this.getList = (input, config) => this.restService.request({
+            method: 'GET',
+            url: '/api/file-explorer/directories',
+            params: { containerName: input.containerName },
+        }, { apiName: this.apiName, ...config });
+        this.move = (id, input, config) => this.restService.request({
+            method: 'PUT',
+            url: `/api/file-explorer/directories/${id}/move`,
+            body: input,
+        }, { apiName: this.apiName, ...config });
+        this.update = (id, input, config) => this.restService.request({
+            method: 'PUT',
+            url: `/api/file-explorer/directories/${id}`,
+            body: input,
+        }, { apiName: this.apiName, ...config });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, deps: [{ token: i3.RestService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDescriptorService, decorators: [{
             type: Injectable,
@@ -459,46 +451,47 @@ var index$d = /*#__PURE__*/Object.freeze({
     FileDescriptorService: FileDescriptorService
 });
 
+/* eslint-disable @angular-eslint/component-selector */
 var that$1;
 class FileModalTreeComponent {
-    _DescriptorService;
-    fb;
-    toaster;
-    _FileApiService;
-    _LocalizationService;
     constructor(_DescriptorService, fb, toaster, _FileApiService, _LocalizationService) {
         this._DescriptorService = _DescriptorService;
         this.fb = fb;
         this.toaster = toaster;
         this._FileApiService = _FileApiService;
         this._LocalizationService = _LocalizationService;
+        /**文件分组列表 */
+        this.fileGroupList = [];
+        /**选择的tree节点 */
+        this._theSelectedTreeNode = '';
+        /**正在编辑的节点 */
+        this.theNodeBeingEdited = '';
+        /**已展开的节点 */
+        this.anExpandedNode = [];
+        /**tree节点选择回调 */
+        this.nodeClick = new EventEmitter();
+        this.handleClick = (event) => event.stopPropagation();
+        /**判断节点是否选中 */
+        this.isNodeSelected = (el) => el.key === this._theSelectedTreeNode?.key;
+        /**分组 */
+        /**模态框-状态-是否打开 */
+        this.ModalDescriptorOpen = false;
+        /**模态框-descriptor-繁忙状态-用于确定模态的繁忙状态是否为真 */
+        this.ModalDescriptorBusy = false;
         that$1 = this;
     }
-    /**文件分组列表 */
-    fileGroupList = [];
-    /**选择的tree节点 */
-    _theSelectedTreeNode = '';
     set theSelectedTreeNode(v) {
         this._theSelectedTreeNode = v;
         if (v.length > 0) {
             this.loadData();
         }
     }
-    /**正在编辑的节点 */
-    theNodeBeingEdited = '';
-    /**已展开的节点 */
-    anExpandedNode = [];
-    /**图片容器 */
-    _fileContainerName;
-    /**tree节点选择回调 */
-    nodeClick = new EventEmitter();
     set fileContainerName(v) {
         if (v) {
             this._fileContainerName = v;
             this.loadData();
         }
     }
-    handleClick = (event) => event.stopPropagation();
     loadData() {
         if (this._fileContainerName) {
             this.getFileGroupList();
@@ -549,8 +542,6 @@ class FileModalTreeComponent {
         this._theSelectedTreeNode = event.node;
         this.nodeClick.emit(event.node);
     }
-    /**判断节点是否选中 */
-    isNodeSelected = (el) => el.key === this._theSelectedTreeNode?.key;
     /**点击展开树节点图标触发 */
     nzExpandChange(event) {
         let anExpandedNode = this.anExpandedNode;
@@ -587,15 +578,6 @@ class FileModalTreeComponent {
             this.getFileGroupList();
         });
     }
-    /**分组 */
-    /**模态框-状态-是否打开 */
-    ModalDescriptorOpen = false;
-    /**模态框-descriptor-繁忙状态-用于确定模态的繁忙状态是否为真 */
-    ModalDescriptorBusy = false;
-    /**模态框-descriptor-表单 */
-    ModalDescriptorForm;
-    /**模态框-descriptor-表单--控件模板-动态赋值表单控件 */
-    ModalFormDescriptorSubmit;
     /**模态框-descriptor-状态改变回调 */
     ModalDescriptorVisibleChange(event) {
         if (!event) {
@@ -619,12 +601,12 @@ class FileModalTreeComponent {
             this.getFileGroupList();
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileModalTreeComponent, deps: [{ token: FileDescriptorService }, { token: i1.FormBuilder }, { token: i2$1.ToasterService }, { token: FileApiService }, { token: i3.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileModalTreeComponent, selector: "fe-file-modal-tree", inputs: { theSelectedTreeNode: "theSelectedTreeNode", fileContainerName: "fileContainerName" }, outputs: { nodeClick: "nodeClick" }, viewQueries: [{ propertyName: "ModalFormDescriptorSubmit", first: true, predicate: ["ModalFormDescriptorSubmit"], descendants: true }], ngImport: i0, template: "<div class=\"card-header  p-0 mb-1 d-flex justify-content-between align-items-center\">\n    <h6 class=\"h6 mb-0\">{{'FileExplorer::MyDirectories' | abpLocalization}}</h6>\n    <button type=\"button\" class=\"btn btn-light btn-sm ms-2\" (click.stop)=\"addDescriptorBtn()\"><i\n            class=\"fas fa-plus-circle\" aria-hidden=\"true\"></i></button>\n</div>\n<nz-tree [nzData]=\"fileGroupList\" class=\"ng-zorro-antd-tree\" nzDraggable nzBlockNode nzShowIcon\n    [nzExpandedIcon]=\"multiExpandedIconTpl\" (nzOnDrop)=\"nzEvent($event)\" [nzBeforeDrop]=\"beforeDrop\"\n    (nzClick)=\"activeNode($event)\" (nzExpandChange)=\"nzExpandChange($event)\" [nzTreeTemplate]=\"nzTreeTemplate\">\n    <ng-template #nzTreeTemplate let-node let-origin=\"origin\">\n        <div class=\"custom-node d-inline-block   ng-star-inserted dropdown\" [title]=\"node.title\">\n            <div #dropdown=\"ngbDropdown\" class=\"d-inline-block\" ngbDropdown placement=\"bottom\" container=\"body\">\n                <div class=\"btn-group\" [class.selected]=\"isNodeSelected(node)\">\n                    <button class=\"btn btn-sm  p-0 px-1\">{{ node.title }}</button>\n                    <button class=\"btn btn-sm  p-0\" (click)=\"handleClick($event)\" ngbDropdownToggle\n                        [class.dropdown-toggle]=\"false\" aria-hidden=\"true\">\n                        <i class=\"fas fa-caret-down text-muted p-1\"></i>\n                    </button>\n                </div>\n                <div ngbDropdownMenu>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node)\">{{'FileExplorer::NewDirectory' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node,true)\">{{'AbpUi::Edit' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"deleteDescriptorBtn(node)\">{{'AbpUi::Delete' | abpLocalization}}</button>\n                </div>\n            </div>\n        </div>\n    </ng-template>\n    <ng-template #multiExpandedIconTpl let-node let-origin=\"origin\">\n        <ng-container *ngIf=\"node.children.length > 0\">\n            <i [class]=\"node.isExpanded ? 'fas fa-caret-down' : 'fas fa-caret-right'\"></i>\n        </ng-container>\n    </ng-template>\n</nz-tree>\n\n\n<abp-modal [(visible)]=\"ModalDescriptorOpen\" [busy]=\"ModalDescriptorBusy\"\n    (visibleChange)=\"ModalDescriptorVisibleChange($event)\">\n    <ng-template #abpHeader>\n        <h3>{{theNodeBeingEdited?('AbpUi::Edit' | abpLocalization):('FileExplorer::NewDirectory' | abpLocalization)}}</h3>\n    </ng-template>\n    <ng-template #abpBody>\n        <ng-template #loaderRef>\n            <div class=\"text-center\"><i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i></div>\n        </ng-template>\n        <ng-container *ngIf=\"ModalDescriptorForm; else loaderRef\">\n            <form class=\"sites-modal-form\" #myForm=\"ngForm\" [formGroup]=\"ModalDescriptorForm\"\n                (ngSubmit)=\"createOrEditSave()\">\n                <button type=\"submit\" #ModalFormDescriptorSubmit style=\"display: none\"></button>\n                <div class=\"mb-3\">\n                    <label class=\"form-label\">{{'FileExplorer::DirectoryName' | abpLocalization}}</label>\n                    <input type=\"email\" class=\"form-control\" formControlName=\"name\">\n                </div>\n            </form>\n        </ng-container>\n    </ng-template>\n    <ng-template #abpFooter>\n        <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n        <abp-button iconClass=\"fa fa-check\"\n            (click)=\"ModalFormDescriptorSubmit.nativeElement.click()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n    </ng-template>\n</abp-modal>", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.FormSubmitDirective, selector: "form[ngSubmit][formGroup]", inputs: ["debounce", "notValidateOnSubmit", "markAsDirtyWhenSubmit"], outputs: ["ngSubmit"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "directive", type: i3$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "directive", type: i3$1.ValidationDirective, selector: "[formControl],[formControlName]", exportAs: ["validationDirective"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "abp-button", inputs: ["buttonId", "buttonClass", "buttonType", "formName", "iconClass", "loading", "disabled", "attributes"], outputs: ["click", "focus", "blur", "abpClick", "abpFocus", "abpBlur"] }, { kind: "component", type: i2$1.ModalComponent, selector: "abp-modal", inputs: ["visible", "busy", "options", "suppressUnsavedChangesWarning"], outputs: ["visibleChange", "init", "appear", "disappear"] }, { kind: "directive", type: i2$1.ModalCloseDirective, selector: "[abpClose]" }, { kind: "directive", type: i8.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i8.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i8.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i8.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["tabindex", "disabled"] }, { kind: "directive", type: i8.NgbDropdownButtonItem, selector: "button[ngbDropdownItem]" }, { kind: "component", type: i9.NzTreeComponent, selector: "nz-tree", inputs: ["nzShowIcon", "nzHideUnMatched", "nzBlockNode", "nzExpandAll", "nzSelectMode", "nzCheckStrictly", "nzShowExpand", "nzShowLine", "nzCheckable", "nzAsyncData", "nzDraggable", "nzMultiple", "nzExpandedIcon", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualHeight", "nzTreeTemplate", "nzBeforeDrop", "nzData", "nzExpandedKeys", "nzSelectedKeys", "nzCheckedKeys", "nzSearchValue", "nzSearchFunc"], outputs: ["nzExpandedKeysChange", "nzSelectedKeysChange", "nzCheckedKeysChange", "nzSearchValueChange", "nzClick", "nzDblClick", "nzContextMenu", "nzCheckBoxChange", "nzExpandChange", "nzOnDragStart", "nzOnDragEnter", "nzOnDragOver", "nzOnDragLeave", "nzOnDrop", "nzOnDragEnd"], exportAs: ["nzTree"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileModalTreeComponent, deps: [{ token: FileDescriptorService }, { token: i1.FormBuilder }, { token: i2$1.ToasterService }, { token: FileApiService }, { token: i3.LocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileModalTreeComponent, selector: "fe-file-modal-tree", inputs: { theSelectedTreeNode: "theSelectedTreeNode", fileContainerName: "fileContainerName" }, outputs: { nodeClick: "nodeClick" }, viewQueries: [{ propertyName: "ModalFormDescriptorSubmit", first: true, predicate: ["ModalFormDescriptorSubmit"], descendants: true }], ngImport: i0, template: "<div class=\"card-header  p-0 mb-1 d-flex justify-content-between align-items-center\">\n    <h6 class=\"h6 mb-0\">{{'FileExplorer::MyDirectories' | abpLocalization}}</h6>\n    <button type=\"button\" class=\"btn btn-light btn-sm ms-2\" (click.stop)=\"addDescriptorBtn()\"><i\n            class=\"fas fa-plus-circle\" aria-hidden=\"true\"></i></button>\n</div>\n<nz-tree [nzData]=\"fileGroupList\" class=\"ng-zorro-antd-tree\" nzDraggable nzBlockNode nzShowIcon\n    [nzExpandedIcon]=\"multiExpandedIconTpl\" (nzOnDrop)=\"nzEvent($event)\" [nzBeforeDrop]=\"beforeDrop\"\n    (nzClick)=\"activeNode($event)\" (nzExpandChange)=\"nzExpandChange($event)\" [nzTreeTemplate]=\"nzTreeTemplate\">\n    <ng-template #nzTreeTemplate let-node let-origin=\"origin\">\n        <div class=\"custom-node d-inline-block   ng-star-inserted dropdown\" [title]=\"node.title\">\n            <div #dropdown=\"ngbDropdown\" class=\"d-inline-block\" ngbDropdown placement=\"bottom\" container=\"body\">\n                <div class=\"btn-group\" [class.selected]=\"isNodeSelected(node)\">\n                    <button class=\"btn btn-sm  p-0 px-1\">{{ node.title }}</button>\n                    <button class=\"btn btn-sm  p-0\" (click)=\"handleClick($event)\" ngbDropdownToggle\n                        [class.dropdown-toggle]=\"false\" aria-hidden=\"true\">\n                        <i class=\"fas fa-caret-down text-muted p-1\"></i>\n                    </button>\n                </div>\n                <div ngbDropdownMenu>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node)\">{{'FileExplorer::NewDirectory' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node,true)\">{{'AbpUi::Edit' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"deleteDescriptorBtn(node)\">{{'AbpUi::Delete' | abpLocalization}}</button>\n                </div>\n            </div>\n        </div>\n    </ng-template>\n    <ng-template #multiExpandedIconTpl let-node let-origin=\"origin\">\n        <ng-container *ngIf=\"node.children.length > 0\">\n            <i [class]=\"node.isExpanded ? 'fas fa-caret-down' : 'fas fa-caret-right'\"></i>\n        </ng-container>\n    </ng-template>\n</nz-tree>\n\n\n<abp-modal [(visible)]=\"ModalDescriptorOpen\" [busy]=\"ModalDescriptorBusy\"\n    (visibleChange)=\"ModalDescriptorVisibleChange($event)\">\n    <ng-template #abpHeader>\n        <h3>{{theNodeBeingEdited?('AbpUi::Edit' | abpLocalization):('FileExplorer::NewDirectory' | abpLocalization)}}</h3>\n    </ng-template>\n    <ng-template #abpBody>\n        <ng-template #loaderRef>\n            <div class=\"text-center\"><i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i></div>\n        </ng-template>\n        <ng-container *ngIf=\"ModalDescriptorForm; else loaderRef\">\n            <form class=\"sites-modal-form\" #myForm=\"ngForm\" [formGroup]=\"ModalDescriptorForm\"\n                (keydown.enter)=\"$event.preventDefault()\" (submit)=\"createOrEditSave()\">\n                <button type=\"submit\" #ModalFormDescriptorSubmit style=\"display: none\"></button>\n                <div class=\"mb-3\">\n                    <label class=\"form-label\">{{'FileExplorer::DirectoryName' | abpLocalization}}</label>\n                    <input type=\"email\" class=\"form-control\" formControlName=\"name\">\n                </div>\n            </form>\n        </ng-container>\n    </ng-template>\n    <ng-template #abpFooter>\n        <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n        <abp-button iconClass=\"fa fa-check\"\n            (click)=\"ModalFormDescriptorSubmit.nativeElement.click()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n    </ng-template>\n</abp-modal>", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "directive", type: i3$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "directive", type: i3$1.ValidationDirective, selector: "[formControl],[formControlName]", exportAs: ["validationDirective"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "abp-button", inputs: ["buttonId", "buttonClass", "buttonType", "formName", "iconClass", "loading", "disabled", "attributes"], outputs: ["click", "focus", "blur", "abpClick", "abpFocus", "abpBlur"] }, { kind: "component", type: i2$1.ModalComponent, selector: "abp-modal", inputs: ["visible", "busy", "options", "suppressUnsavedChangesWarning"], outputs: ["visibleChange", "init", "appear", "disappear"] }, { kind: "directive", type: i2$1.ModalCloseDirective, selector: "[abpClose]" }, { kind: "directive", type: i8.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i8.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i8.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i8.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["tabindex", "disabled"] }, { kind: "directive", type: i8.NgbDropdownButtonItem, selector: "button[ngbDropdownItem]" }, { kind: "component", type: i9.NzTreeComponent, selector: "nz-tree", inputs: ["nzShowIcon", "nzHideUnMatched", "nzBlockNode", "nzExpandAll", "nzSelectMode", "nzCheckStrictly", "nzShowExpand", "nzShowLine", "nzCheckable", "nzAsyncData", "nzDraggable", "nzMultiple", "nzExpandedIcon", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualHeight", "nzTreeTemplate", "nzBeforeDrop", "nzData", "nzExpandedKeys", "nzSelectedKeys", "nzCheckedKeys", "nzSearchValue", "nzSearchFunc"], outputs: ["nzExpandedKeysChange", "nzSelectedKeysChange", "nzCheckedKeysChange", "nzSearchValueChange", "nzClick", "nzDblClick", "nzContextMenu", "nzCheckBoxChange", "nzExpandChange", "nzOnDragStart", "nzOnDragEnter", "nzOnDragOver", "nzOnDragLeave", "nzOnDrop", "nzOnDragEnd"], exportAs: ["nzTree"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileModalTreeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fe-file-modal-tree', template: "<div class=\"card-header  p-0 mb-1 d-flex justify-content-between align-items-center\">\n    <h6 class=\"h6 mb-0\">{{'FileExplorer::MyDirectories' | abpLocalization}}</h6>\n    <button type=\"button\" class=\"btn btn-light btn-sm ms-2\" (click.stop)=\"addDescriptorBtn()\"><i\n            class=\"fas fa-plus-circle\" aria-hidden=\"true\"></i></button>\n</div>\n<nz-tree [nzData]=\"fileGroupList\" class=\"ng-zorro-antd-tree\" nzDraggable nzBlockNode nzShowIcon\n    [nzExpandedIcon]=\"multiExpandedIconTpl\" (nzOnDrop)=\"nzEvent($event)\" [nzBeforeDrop]=\"beforeDrop\"\n    (nzClick)=\"activeNode($event)\" (nzExpandChange)=\"nzExpandChange($event)\" [nzTreeTemplate]=\"nzTreeTemplate\">\n    <ng-template #nzTreeTemplate let-node let-origin=\"origin\">\n        <div class=\"custom-node d-inline-block   ng-star-inserted dropdown\" [title]=\"node.title\">\n            <div #dropdown=\"ngbDropdown\" class=\"d-inline-block\" ngbDropdown placement=\"bottom\" container=\"body\">\n                <div class=\"btn-group\" [class.selected]=\"isNodeSelected(node)\">\n                    <button class=\"btn btn-sm  p-0 px-1\">{{ node.title }}</button>\n                    <button class=\"btn btn-sm  p-0\" (click)=\"handleClick($event)\" ngbDropdownToggle\n                        [class.dropdown-toggle]=\"false\" aria-hidden=\"true\">\n                        <i class=\"fas fa-caret-down text-muted p-1\"></i>\n                    </button>\n                </div>\n                <div ngbDropdownMenu>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node)\">{{'FileExplorer::NewDirectory' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node,true)\">{{'AbpUi::Edit' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"deleteDescriptorBtn(node)\">{{'AbpUi::Delete' | abpLocalization}}</button>\n                </div>\n            </div>\n        </div>\n    </ng-template>\n    <ng-template #multiExpandedIconTpl let-node let-origin=\"origin\">\n        <ng-container *ngIf=\"node.children.length > 0\">\n            <i [class]=\"node.isExpanded ? 'fas fa-caret-down' : 'fas fa-caret-right'\"></i>\n        </ng-container>\n    </ng-template>\n</nz-tree>\n\n\n<abp-modal [(visible)]=\"ModalDescriptorOpen\" [busy]=\"ModalDescriptorBusy\"\n    (visibleChange)=\"ModalDescriptorVisibleChange($event)\">\n    <ng-template #abpHeader>\n        <h3>{{theNodeBeingEdited?('AbpUi::Edit' | abpLocalization):('FileExplorer::NewDirectory' | abpLocalization)}}</h3>\n    </ng-template>\n    <ng-template #abpBody>\n        <ng-template #loaderRef>\n            <div class=\"text-center\"><i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i></div>\n        </ng-template>\n        <ng-container *ngIf=\"ModalDescriptorForm; else loaderRef\">\n            <form class=\"sites-modal-form\" #myForm=\"ngForm\" [formGroup]=\"ModalDescriptorForm\"\n                (ngSubmit)=\"createOrEditSave()\">\n                <button type=\"submit\" #ModalFormDescriptorSubmit style=\"display: none\"></button>\n                <div class=\"mb-3\">\n                    <label class=\"form-label\">{{'FileExplorer::DirectoryName' | abpLocalization}}</label>\n                    <input type=\"email\" class=\"form-control\" formControlName=\"name\">\n                </div>\n            </form>\n        </ng-container>\n    </ng-template>\n    <ng-template #abpFooter>\n        <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n        <abp-button iconClass=\"fa fa-check\"\n            (click)=\"ModalFormDescriptorSubmit.nativeElement.click()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n    </ng-template>\n</abp-modal>" }]
+            args: [{ selector: 'fe-file-modal-tree', template: "<div class=\"card-header  p-0 mb-1 d-flex justify-content-between align-items-center\">\n    <h6 class=\"h6 mb-0\">{{'FileExplorer::MyDirectories' | abpLocalization}}</h6>\n    <button type=\"button\" class=\"btn btn-light btn-sm ms-2\" (click.stop)=\"addDescriptorBtn()\"><i\n            class=\"fas fa-plus-circle\" aria-hidden=\"true\"></i></button>\n</div>\n<nz-tree [nzData]=\"fileGroupList\" class=\"ng-zorro-antd-tree\" nzDraggable nzBlockNode nzShowIcon\n    [nzExpandedIcon]=\"multiExpandedIconTpl\" (nzOnDrop)=\"nzEvent($event)\" [nzBeforeDrop]=\"beforeDrop\"\n    (nzClick)=\"activeNode($event)\" (nzExpandChange)=\"nzExpandChange($event)\" [nzTreeTemplate]=\"nzTreeTemplate\">\n    <ng-template #nzTreeTemplate let-node let-origin=\"origin\">\n        <div class=\"custom-node d-inline-block   ng-star-inserted dropdown\" [title]=\"node.title\">\n            <div #dropdown=\"ngbDropdown\" class=\"d-inline-block\" ngbDropdown placement=\"bottom\" container=\"body\">\n                <div class=\"btn-group\" [class.selected]=\"isNodeSelected(node)\">\n                    <button class=\"btn btn-sm  p-0 px-1\">{{ node.title }}</button>\n                    <button class=\"btn btn-sm  p-0\" (click)=\"handleClick($event)\" ngbDropdownToggle\n                        [class.dropdown-toggle]=\"false\" aria-hidden=\"true\">\n                        <i class=\"fas fa-caret-down text-muted p-1\"></i>\n                    </button>\n                </div>\n                <div ngbDropdownMenu>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node)\">{{'FileExplorer::NewDirectory' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"addDescriptorBtn(node,true)\">{{'AbpUi::Edit' | abpLocalization}}</button>\n                    <button ngbDropdownItem\n                        (click.stop)=\"deleteDescriptorBtn(node)\">{{'AbpUi::Delete' | abpLocalization}}</button>\n                </div>\n            </div>\n        </div>\n    </ng-template>\n    <ng-template #multiExpandedIconTpl let-node let-origin=\"origin\">\n        <ng-container *ngIf=\"node.children.length > 0\">\n            <i [class]=\"node.isExpanded ? 'fas fa-caret-down' : 'fas fa-caret-right'\"></i>\n        </ng-container>\n    </ng-template>\n</nz-tree>\n\n\n<abp-modal [(visible)]=\"ModalDescriptorOpen\" [busy]=\"ModalDescriptorBusy\"\n    (visibleChange)=\"ModalDescriptorVisibleChange($event)\">\n    <ng-template #abpHeader>\n        <h3>{{theNodeBeingEdited?('AbpUi::Edit' | abpLocalization):('FileExplorer::NewDirectory' | abpLocalization)}}</h3>\n    </ng-template>\n    <ng-template #abpBody>\n        <ng-template #loaderRef>\n            <div class=\"text-center\"><i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i></div>\n        </ng-template>\n        <ng-container *ngIf=\"ModalDescriptorForm; else loaderRef\">\n            <form class=\"sites-modal-form\" #myForm=\"ngForm\" [formGroup]=\"ModalDescriptorForm\"\n                (keydown.enter)=\"$event.preventDefault()\" (submit)=\"createOrEditSave()\">\n                <button type=\"submit\" #ModalFormDescriptorSubmit style=\"display: none\"></button>\n                <div class=\"mb-3\">\n                    <label class=\"form-label\">{{'FileExplorer::DirectoryName' | abpLocalization}}</label>\n                    <input type=\"email\" class=\"form-control\" formControlName=\"name\">\n                </div>\n            </form>\n        </ng-container>\n    </ng-template>\n    <ng-template #abpFooter>\n        <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n        <abp-button iconClass=\"fa fa-check\"\n            (click)=\"ModalFormDescriptorSubmit.nativeElement.click()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n    </ng-template>\n</abp-modal>" }]
         }], ctorParameters: () => [{ type: FileDescriptorService }, { type: i1.FormBuilder }, { type: i2$1.ToasterService }, { type: FileApiService }, { type: i3.LocalizationService }], propDecorators: { theSelectedTreeNode: [{
                 type: Input
             }], nodeClick: [{
@@ -638,13 +620,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
 
 var that;
 class FileModalComponent {
-    _FileService;
-    toaster;
-    list;
-    _FileApiService;
-    restService;
-    confirmation;
-    _LocalizationService;
     constructor(_FileService, toaster, list, _FileApiService, restService, confirmation, _LocalizationService) {
         this._FileService = _FileService;
         this.toaster = toaster;
@@ -653,35 +628,75 @@ class FileModalComponent {
         this.restService = restService;
         this.confirmation = confirmation;
         this._LocalizationService = _LocalizationService;
+        this._FileDescriptorService = inject(FileDescriptorService$1);
+        /**目录的权限名称 */
+        this.createDirectoryPermissionName = null;
+        /**是否多选 */
+        this._multiple = false;
+        /**文件大小限制
+      * @param 1mb
+      */
+        this.sizeLimit = 1048576;
+        /**模态框状态回调 */
+        this.visibleChange = new EventEmitter();
+        /**模态框-状态-是否打开 */
+        this.ModalOpen = false;
+        /**模态框-繁忙状态-用于确定模态的繁忙状态是否为真 */
+        this.ModalBusy = false;
+        /**dignite-file-modal-tree */
+        /**选择的tree节点 */
+        this._theSelectedTreeNode = '';
+        /**图片上传-要上传图片的状态文件列表 */
+        this.uploadPictureStatusList = [];
+        /**文件表格-数据*/
+        this.data = {
+            items: [],
+            totalCount: 0,
+        };
+        /**文件表格-条件*/
+        this.filters = {};
+        /**文件表格-表格自带选择类型 */
+        this.SelectionType = SelectionType;
+        /**文件表格-选择的表格数据项 */
+        this.selectedTable = [];
+        /**当前选择的table项 id */
+        this.nowSelectId = '';
+        /**选择文件回调 */
+        this.selectFilefn = new EventEmitter();
+        /**一个布尔or函数，可用于检查是否要根据条件选择特定行。 */
+        this.selectCheck = (row, column, value) => {
+            this.nowSelectId = row.id;
+            return true;
+        };
+        /**判断row是否选中 */
+        this.selectedcheckbox = (id) => {
+            return this.selectedTable.some(el => el.id == id);
+        };
+        /**创建图片的接口，代理中的file类型不匹配，切换为any类型 */
+        this.createFile = (input, config) => this.restService.request({
+            method: 'POST',
+            url: '/api/file-explorer/files',
+            params: { containerName: input.containerName, cellName: input.cellName, directoryId: input.directoryId, entityId: input.entityId },
+            body: input.file,
+        }, { apiName: 'FileExplorer', ...config });
         that = this;
     }
-    _FileDescriptorService = inject(FileDescriptorService$1);
     /**获取目录配置 */
     getFilesConfiguration() {
         this._FileDescriptorService.getFileContainerConfiguration(this._fileContainerName).subscribe(res => {
-            this.createDirectoryPermissionName = res.createDirectoryPermissionName;
+            this.createDirectoryPermissionName = res?.createDirectoryPermissionName;
         });
     }
-    /**目录的权限名称 */
-    createDirectoryPermissionName = null;
-    /**图片容器 */
-    _fileContainerName;
     set fileContainerName(v) {
         if (v) {
             this._fileContainerName = v;
             this.loadData();
         }
     }
-    /**是否多选 */
-    _multiple = false;
     set multiple(v) {
         this._multiple = v;
         if (v) { }
     }
-    /**文件大小限制
-  * @param 1mb
-  */
-    sizeLimit = 1048576;
     set limit(v) {
         this.sizeLimit = v;
     }
@@ -692,12 +707,6 @@ class FileModalComponent {
             this.loadData();
         }
     }
-    /**模态框状态回调 */
-    visibleChange = new EventEmitter();
-    /**模态框-状态-是否打开 */
-    ModalOpen = false;
-    /**模态框-繁忙状态-用于确定模态的繁忙状态是否为真 */
-    ModalBusy = false;
     /**模态框-状态改变回调 */
     ModalVisibleChange(event) {
         if (!event) {
@@ -711,9 +720,6 @@ class FileModalComponent {
         this.selectFilefn.emit(selectedTablearr);
         this.ModalVisibleChange(false);
     }
-    /**dignite-file-modal-tree */
-    /**选择的tree节点 */
-    _theSelectedTreeNode = '';
     /**初始化数据 */
     loadData() {
         if (this.ModalOpen && this._fileContainerName) {
@@ -726,8 +732,6 @@ class FileModalComponent {
         this._theSelectedTreeNode = event;
         this.list.get();
     }
-    /**图片上传-要上传图片的状态文件列表 */
-    uploadPictureStatusList = [];
     /**图片上传-获取文件信息改变 */
     async getFileChange(event) {
         let files = new Array(...event.target.files);
@@ -777,28 +781,11 @@ class FileModalComponent {
             });
         });
     }
-    /**文件表格-数据*/
-    data = {
-        items: [],
-        totalCount: 0,
-    };
-    /**文件表格-条件*/
-    filters = {};
-    /**文件表格-表格自带选择类型 */
-    SelectionType = SelectionType;
-    /**文件表格-选择的表格数据项 */
-    selectedTable = [];
-    /**已选定的文件 */
-    selectPickerFile;
     ngOnChanges(changes) {
         //Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
         //Add '${implements OnChanges}' to the class.
         this.selectedTable = this._FileApiService.deepClone(this.selectPickerFile);
     }
-    /**当前选择的table项 id */
-    nowSelectId = '';
-    /**选择文件回调 */
-    selectFilefn = new EventEmitter();
     /**文件表格-获取表格数据 */
     hookToQuery() {
         const getData = (query) => this._FileService.getList({
@@ -835,15 +822,6 @@ class FileModalComponent {
             return false;
         });
     }
-    /**一个布尔or函数，可用于检查是否要根据条件选择特定行。 */
-    selectCheck = (row, column, value) => {
-        this.nowSelectId = row.id;
-        return true;
-    };
-    /**判断row是否选中 */
-    selectedcheckbox = (id) => {
-        return this.selectedTable.some(el => el.id == id);
-    };
     /**删除图片 */
     deleteFile(file) {
         this.confirmation
@@ -861,22 +839,15 @@ class FileModalComponent {
     closeFileStatusModal() {
         this.uploadPictureStatusList = [];
     }
-    /**创建图片的接口，代理中的file类型不匹配，切换为any类型 */
-    createFile = (input, config) => this.restService.request({
-        method: 'POST',
-        url: '/api/file-explorer/files',
-        params: { containerName: input.containerName, cellName: input.cellName, directoryId: input.directoryId, entityId: input.entityId },
-        body: input.file,
-    }, { apiName: 'FileExplorer', ...config });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileModalComponent, deps: [{ token: FileDescriptorService$1 }, { token: i2$1.ToasterService }, { token: i3.ListService }, { token: FileApiService }, { token: i3.RestService }, { token: i2$1.ConfirmationService }, { token: i3.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileModalComponent, selector: "fe-file-modal", inputs: { fileContainerName: "fileContainerName", multiple: "multiple", limit: "limit", visible: "visible", selectPickerFile: "selectPickerFile" }, outputs: { visibleChange: "visibleChange", selectFilefn: "selectFilefn" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileModalComponent, deps: [{ token: FileDescriptorService$1 }, { token: i2$1.ToasterService }, { token: i3.ListService }, { token: FileApiService }, { token: i3.RestService }, { token: i2$1.ConfirmationService }, { token: i3.LocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileModalComponent, selector: "fe-file-modal", inputs: { fileContainerName: "fileContainerName", multiple: "multiple", limit: "limit", visible: "visible", selectPickerFile: "selectPickerFile" }, outputs: { visibleChange: "visibleChange", selectFilefn: "selectFilefn" }, providers: [
             // [Required]
             ListService,
             // [Optional]
             // Provide this token if you want a different debounce time.
             // Default is 300. Cannot be 0. Any value below 100 is not recommended.
             { provide: LIST_QUERY_DEBOUNCE_TIME, useValue: 500 },
-        ], usesOnChanges: true, ngImport: i0, template: "<abp-modal [(visible)]=\"ModalOpen\" (visibleChange)=\"ModalVisibleChange($event)\"\n  [options]=\"{ size: 'xl', scrollable: false }\">\n  <ng-template #abpHeader>\n    <h3>{{'FileExplorer::FileExplorer' | abpLocalization}}</h3>\n  </ng-template>\n  <ng-template #abpBody>\n    <div class=\"row file-explorer-modal-body file-modal\">\n      <div class=\"col-3\" *ngIf=\"createDirectoryPermissionName\"  style=\"overflow: auto; height: calc(100vh - 240px)\">\n        <fe-file-modal-tree [theSelectedTreeNode]=\"_theSelectedTreeNode\" (nodeClick)=\"_nodeClick($event)\"\n          [fileContainerName]=\"_fileContainerName\"></fe-file-modal-tree>\n      </div>\n      <div [class]=\"createDirectoryPermissionName?'col-9':'col-12'\" style=\"height: calc(100vh - 240px)\">\n        <div class=\"mb-2 d-flex justify-content-between align-items-center\">\n          <div class=\"btn-link\" role=button style=\"flex: 2\" (click)=\"lookAllFile()\">{{'FileExplorer::AllFiles' | abpLocalization}}</div>\n          <div class=\"input-group form-file\" style=\"flex: 2\">\n            <input type=\"file\" class=\"form-control\" #fileEdit [multiple]=\"_multiple\" \n              (change)=\"getFileChange($event)\" />\n              <!-- accept=\".jpg,.jpeg,.png,.gif,.webp\" -->\n          </div>\n        </div>\n        <div>\n          <ngx-datatable class=\"material container-height\" [rows]=\"data.items\" [list]=\"list\" columnMode=\"flex\"\n            [columns]=\"columns\" [headerHeight]=\"50\" [footerHeight]=\"50\" rowHeight=\"auto\" [scrollbarV]=\"true\"\n            [virtualization]=\"false\" [externalPaging]=\"true\" [count]=\"data.totalCount\" [selected]=\"selectedTable\"\n            [selectCheck]=\"selectCheck\" [selectionType]=\"_multiple?SelectionType.multiClick:SelectionType.single\" (select)=\"onSelectTableItem($event)\">\n            <ngx-datatable-column [width]=\"50\" prop=\"id\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\"\n              [resizeable]=\"false\">\n              <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\n                let-selectFn=\"selectFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"allRowsSelected\"\n                  (change)=\"selectFn(!allRowsSelected)\" />\n              </ng-template>\n              <ng-template ngx-datatable-cell-template let-row=\"row\" let-value=\"value\" let-isSelected=\"isSelected\"\n                let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"selectedcheckbox(value)\"\n                  (change)=\"onCheckboxChangeFn($event)\" />\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column   [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <fe-file-preview [width]=\"'80px'\" [src]=\"row.url\" [name]=\"row.name\" [type]=\"row.mimeType\" [preview]=\"true\"></fe-file-preview>\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::FileName' | abpLocalization\" prop=\"name\" [flexGrow]=\"4\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::FileSize' | abpLocalization\" prop=\"size\" [flexGrow]=\"1.5\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ _FileApiService.formatFileSize(value) }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::Directory' | abpLocalization\" prop=\"cellName\" [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::CreationTime' | abpLocalization\" prop=\"creationTime\" [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value | date : 'YYYY/MM/dd HH:mm:s' }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <button class=\"btn btn-sm btn-light p-0\" (click.stop)=\"deleteFile(row)\">\n                  <i class=\"fas fa-trash text-primary p-2\"></i>\n                </button>\n              </ng-template>\n            </ngx-datatable-column>\n          </ngx-datatable>\n        </div>\n        <div *ngIf=\"uploadPictureStatusList.length > 0\"\n          class=\"position-fixed bottom-0 end-0 shadow-lg file-status-modal   m-5\"\n          style=\"border-radius: 10px\">\n          <div class=\"card p-1\">\n            <div class=\"card-header d-flex align-items-center justify-content-between p-0 py-1 border-bottom\">\n              <div>{{'FileExplorer::UploadFiles' | abpLocalization}}</div>\n              <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click.stop)=\"closeFileStatusModal()\"></button>\n            </div>\n            <div class=\"card-body\">\n              <table class=\"table\">\n                <thead>\n                  <tr>\n                    <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n                    <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n                    <th scope=\"col\"></th>\n                  </tr>\n                </thead>\n                <tbody>\n                  <ng-container *ngFor=\"let item of uploadPictureStatusList; let i = index\">\n                    <tr>\n                      <th scope=\"row\">\n                        <div>{{ item.name }}</div>\n                        <div class=\"form-text text-danger\" *ngIf=\"item.size > sizeLimit\">\n                          {{'FileExplorer::ExceedsMaximumSize' | abpLocalization:_FileApiService.formatFileSize(sizeLimit)}}\n                        </div>\n                      </th>\n                      <td>{{ item.fileSize }}</td>\n                      <td>\n                        <i *ngIf=\"item.status === 1\" class=\"fas fa-check text-primary\"></i>\n                        <i *ngIf=\"item.status === 2\" class=\"fas fa-times-circle text-danger\"></i>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </tbody>\n              </table>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </ng-template>\n  <ng-template #abpFooter>\n    <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n    <abp-button iconClass=\"fa fa-check\" (click)=\"modalSave()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n  </ng-template>\n</abp-modal>", styles: ["::ng-deep .file-modal .container-height{height:calc(100vh - 284px)}::ng-deep .file-modal .file-status-modal{background:#fff}::ng-deep .file-modal .file-status-modal .card-body{max-height:300px;overflow-y:auto}::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active .datatable-row-group{background-color:transparent!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper{padding:0}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .custom-node{width:100%}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected{background-color:var(--lpx-brand)!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected .btn{color:var(--lpx-navbar-color)}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}::ng-deep .file-modal .ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell,::ng-deep .file-modal .ngx-datatable.material .datatable-body .datatable-body-row .datatable-body-cell{overflow:initial;line-break:anywhere}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i2$1.NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: ["list"], exportAs: ["ngxDatatableList"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "abp-button", inputs: ["buttonId", "buttonClass", "buttonType", "formName", "iconClass", "loading", "disabled", "attributes"], outputs: ["click", "focus", "blur", "abpClick", "abpFocus", "abpBlur"] }, { kind: "component", type: i2$1.ModalComponent, selector: "abp-modal", inputs: ["visible", "busy", "options", "suppressUnsavedChangesWarning"], outputs: ["visibleChange", "init", "appear", "disappear"] }, { kind: "directive", type: i2$1.ModalCloseDirective, selector: "[abpClose]" }, { kind: "component", type: FileModalTreeComponent, selector: "fe-file-modal-tree", inputs: ["theSelectedTreeNode", "fileContainerName"], outputs: ["nodeClick"] }, { kind: "component", type: FilePreviewComponent, selector: "fe-file-preview", inputs: ["width", "src", "preview", "type", "name"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] });
+        ], usesOnChanges: true, ngImport: i0, template: "<abp-modal [(visible)]=\"ModalOpen\" (visibleChange)=\"ModalVisibleChange($event)\"\n  [options]=\"{ size: 'xl', scrollable: false }\">\n  <ng-template #abpHeader>\n    <h3>{{'FileExplorer::FileExplorer' | abpLocalization}}</h3>\n  </ng-template>\n  <ng-template #abpBody>\n    <div class=\"row file-explorer-modal-body file-modal\">\n      <div class=\"col-3\" *ngIf=\"createDirectoryPermissionName\"  style=\"overflow: auto; height: calc(100vh - 240px)\">\n        <fe-file-modal-tree [theSelectedTreeNode]=\"_theSelectedTreeNode\" (nodeClick)=\"_nodeClick($event)\"\n          [fileContainerName]=\"_fileContainerName\"></fe-file-modal-tree>\n      </div>\n      <div [class]=\"createDirectoryPermissionName?'col-9':'col-12'\" style=\"height: calc(100vh - 240px)\">\n        <div class=\"mb-2 d-flex justify-content-between align-items-center\">\n          <div class=\"btn-link\" role=button style=\"flex: 2\" (click)=\"lookAllFile()\">{{'FileExplorer::AllFiles' | abpLocalization}}</div>\n          <div class=\"input-group form-file\" style=\"flex: 2\">\n            <input type=\"file\" class=\"form-control\" #fileEdit [multiple]=\"_multiple\" \n              (change)=\"getFileChange($event)\" />\n          </div>\n        </div>\n        <div>\n          <ngx-datatable class=\"material container-height\" [rows]=\"data.items\" [list]=\"list\" columnMode=\"flex\"\n            [columns]=\"columns\" [headerHeight]=\"50\" [footerHeight]=\"50\" rowHeight=\"auto\" [scrollbarV]=\"true\"\n            [virtualization]=\"false\" [externalPaging]=\"true\" [count]=\"data.totalCount\" [selected]=\"selectedTable\"\n            [selectCheck]=\"selectCheck\" [selectionType]=\"_multiple?SelectionType.multiClick:SelectionType.single\" (select)=\"onSelectTableItem($event)\">\n            <ngx-datatable-column [width]=\"50\" prop=\"id\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\"\n              [resizeable]=\"false\">\n              <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\n                let-selectFn=\"selectFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"allRowsSelected\"\n                  (change)=\"selectFn(!allRowsSelected)\" />\n              </ng-template>\n              <ng-template ngx-datatable-cell-template let-row=\"row\" let-value=\"value\" let-isSelected=\"isSelected\"\n                let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"selectedcheckbox(value)\"\n                  (change)=\"onCheckboxChangeFn($event)\" />\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column   [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <fe-file-preview [width]=\"'80px'\" [src]=\"row.url\" [name]=\"row.name\" [type]=\"row.mimeType\" [preview]=\"true\"></fe-file-preview>\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::FileName' | abpLocalization\" prop=\"name\" [flexGrow]=\"4\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::FileSize' | abpLocalization\" prop=\"size\" [flexGrow]=\"1.5\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ _FileApiService.formatFileSize(value) }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::Directory' | abpLocalization\" prop=\"cellName\" [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::CreationTime' | abpLocalization\" prop=\"creationTime\" [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value | date : 'YYYY/MM/dd HH:mm:s' }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <button class=\"btn btn-sm btn-light p-0\" (click.stop)=\"deleteFile(row)\">\n                  <i class=\"fas fa-trash text-primary p-2\"></i>\n                </button>\n              </ng-template>\n            </ngx-datatable-column>\n          </ngx-datatable>\n        </div>\n        <div *ngIf=\"uploadPictureStatusList.length > 0\"\n          class=\"position-fixed bottom-0 end-0 shadow-lg file-status-modal   m-5\"\n          style=\"border-radius: 10px\">\n          <div class=\"card p-1\">\n            <div class=\"card-header d-flex align-items-center justify-content-between p-0 py-1 border-bottom\">\n              <div>{{'FileExplorer::UploadFiles' | abpLocalization}}</div>\n              <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click.stop)=\"closeFileStatusModal()\"></button>\n            </div>\n            <div class=\"card-body\">\n              <table class=\"table\">\n                <thead>\n                  <tr>\n                    <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n                    <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n                    <th scope=\"col\"></th>\n                  </tr>\n                </thead>\n                <tbody>\n                  <ng-container *ngFor=\"let item of uploadPictureStatusList; let i = index\">\n                    <tr>\n                      <th scope=\"row\">\n                        <div>{{ item.name }}</div>\n                        <div class=\"form-text text-danger\" *ngIf=\"item.size > sizeLimit\">\n                          {{'FileExplorer::ExceedsMaximumSize' | abpLocalization:_FileApiService.formatFileSize(sizeLimit)}}\n                        </div>\n                      </th>\n                      <td>{{ item.fileSize }}</td>\n                      <td>\n                        <i *ngIf=\"item.status === 1\" class=\"fas fa-check text-primary\"></i>\n                        <i *ngIf=\"item.status === 2\" class=\"fas fa-times-circle text-danger\"></i>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </tbody>\n              </table>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </ng-template>\n  <ng-template #abpFooter>\n    <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n    <abp-button iconClass=\"fa fa-check\" (click)=\"modalSave()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n  </ng-template>\n</abp-modal>", styles: ["::ng-deep .file-modal .container-height{height:calc(100vh - 284px)}::ng-deep .file-modal .file-status-modal{background:#fff}::ng-deep .file-modal .file-status-modal .card-body{max-height:300px;overflow-y:auto}::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active .datatable-row-group{background-color:transparent!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper{padding:0}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .custom-node{width:100%}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected{background-color:var(--lpx-brand)!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected .btn{color:var(--lpx-navbar-color)}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}::ng-deep .file-modal .ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell,::ng-deep .file-modal .ngx-datatable.material .datatable-body .datatable-body-row .datatable-body-cell{overflow:initial;line-break:anywhere}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i2$1.NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: ["list"], exportAs: ["ngxDatatableList"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "abp-button", inputs: ["buttonId", "buttonClass", "buttonType", "formName", "iconClass", "loading", "disabled", "attributes"], outputs: ["click", "focus", "blur", "abpClick", "abpFocus", "abpBlur"] }, { kind: "component", type: i2$1.ModalComponent, selector: "abp-modal", inputs: ["visible", "busy", "options", "suppressUnsavedChangesWarning"], outputs: ["visibleChange", "init", "appear", "disappear"] }, { kind: "directive", type: i2$1.ModalCloseDirective, selector: "[abpClose]" }, { kind: "component", type: FileModalTreeComponent, selector: "fe-file-modal-tree", inputs: ["theSelectedTreeNode", "fileContainerName"], outputs: ["nodeClick"] }, { kind: "component", type: FilePreviewComponent, selector: "fe-file-preview", inputs: ["width", "src", "preview", "type", "name"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileModalComponent, decorators: [{
             type: Component,
@@ -887,7 +858,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
                         // Provide this token if you want a different debounce time.
                         // Default is 300. Cannot be 0. Any value below 100 is not recommended.
                         { provide: LIST_QUERY_DEBOUNCE_TIME, useValue: 500 },
-                    ], template: "<abp-modal [(visible)]=\"ModalOpen\" (visibleChange)=\"ModalVisibleChange($event)\"\n  [options]=\"{ size: 'xl', scrollable: false }\">\n  <ng-template #abpHeader>\n    <h3>{{'FileExplorer::FileExplorer' | abpLocalization}}</h3>\n  </ng-template>\n  <ng-template #abpBody>\n    <div class=\"row file-explorer-modal-body file-modal\">\n      <div class=\"col-3\" *ngIf=\"createDirectoryPermissionName\"  style=\"overflow: auto; height: calc(100vh - 240px)\">\n        <fe-file-modal-tree [theSelectedTreeNode]=\"_theSelectedTreeNode\" (nodeClick)=\"_nodeClick($event)\"\n          [fileContainerName]=\"_fileContainerName\"></fe-file-modal-tree>\n      </div>\n      <div [class]=\"createDirectoryPermissionName?'col-9':'col-12'\" style=\"height: calc(100vh - 240px)\">\n        <div class=\"mb-2 d-flex justify-content-between align-items-center\">\n          <div class=\"btn-link\" role=button style=\"flex: 2\" (click)=\"lookAllFile()\">{{'FileExplorer::AllFiles' | abpLocalization}}</div>\n          <div class=\"input-group form-file\" style=\"flex: 2\">\n            <input type=\"file\" class=\"form-control\" #fileEdit [multiple]=\"_multiple\" \n              (change)=\"getFileChange($event)\" />\n              <!-- accept=\".jpg,.jpeg,.png,.gif,.webp\" -->\n          </div>\n        </div>\n        <div>\n          <ngx-datatable class=\"material container-height\" [rows]=\"data.items\" [list]=\"list\" columnMode=\"flex\"\n            [columns]=\"columns\" [headerHeight]=\"50\" [footerHeight]=\"50\" rowHeight=\"auto\" [scrollbarV]=\"true\"\n            [virtualization]=\"false\" [externalPaging]=\"true\" [count]=\"data.totalCount\" [selected]=\"selectedTable\"\n            [selectCheck]=\"selectCheck\" [selectionType]=\"_multiple?SelectionType.multiClick:SelectionType.single\" (select)=\"onSelectTableItem($event)\">\n            <ngx-datatable-column [width]=\"50\" prop=\"id\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\"\n              [resizeable]=\"false\">\n              <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\n                let-selectFn=\"selectFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"allRowsSelected\"\n                  (change)=\"selectFn(!allRowsSelected)\" />\n              </ng-template>\n              <ng-template ngx-datatable-cell-template let-row=\"row\" let-value=\"value\" let-isSelected=\"isSelected\"\n                let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"selectedcheckbox(value)\"\n                  (change)=\"onCheckboxChangeFn($event)\" />\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column   [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <fe-file-preview [width]=\"'80px'\" [src]=\"row.url\" [name]=\"row.name\" [type]=\"row.mimeType\" [preview]=\"true\"></fe-file-preview>\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::FileName' | abpLocalization\" prop=\"name\" [flexGrow]=\"4\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::FileSize' | abpLocalization\" prop=\"size\" [flexGrow]=\"1.5\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ _FileApiService.formatFileSize(value) }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::Directory' | abpLocalization\" prop=\"cellName\" [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::CreationTime' | abpLocalization\" prop=\"creationTime\" [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value | date : 'YYYY/MM/dd HH:mm:s' }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <button class=\"btn btn-sm btn-light p-0\" (click.stop)=\"deleteFile(row)\">\n                  <i class=\"fas fa-trash text-primary p-2\"></i>\n                </button>\n              </ng-template>\n            </ngx-datatable-column>\n          </ngx-datatable>\n        </div>\n        <div *ngIf=\"uploadPictureStatusList.length > 0\"\n          class=\"position-fixed bottom-0 end-0 shadow-lg file-status-modal   m-5\"\n          style=\"border-radius: 10px\">\n          <div class=\"card p-1\">\n            <div class=\"card-header d-flex align-items-center justify-content-between p-0 py-1 border-bottom\">\n              <div>{{'FileExplorer::UploadFiles' | abpLocalization}}</div>\n              <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click.stop)=\"closeFileStatusModal()\"></button>\n            </div>\n            <div class=\"card-body\">\n              <table class=\"table\">\n                <thead>\n                  <tr>\n                    <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n                    <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n                    <th scope=\"col\"></th>\n                  </tr>\n                </thead>\n                <tbody>\n                  <ng-container *ngFor=\"let item of uploadPictureStatusList; let i = index\">\n                    <tr>\n                      <th scope=\"row\">\n                        <div>{{ item.name }}</div>\n                        <div class=\"form-text text-danger\" *ngIf=\"item.size > sizeLimit\">\n                          {{'FileExplorer::ExceedsMaximumSize' | abpLocalization:_FileApiService.formatFileSize(sizeLimit)}}\n                        </div>\n                      </th>\n                      <td>{{ item.fileSize }}</td>\n                      <td>\n                        <i *ngIf=\"item.status === 1\" class=\"fas fa-check text-primary\"></i>\n                        <i *ngIf=\"item.status === 2\" class=\"fas fa-times-circle text-danger\"></i>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </tbody>\n              </table>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </ng-template>\n  <ng-template #abpFooter>\n    <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n    <abp-button iconClass=\"fa fa-check\" (click)=\"modalSave()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n  </ng-template>\n</abp-modal>", styles: ["::ng-deep .file-modal .container-height{height:calc(100vh - 284px)}::ng-deep .file-modal .file-status-modal{background:#fff}::ng-deep .file-modal .file-status-modal .card-body{max-height:300px;overflow-y:auto}::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active .datatable-row-group{background-color:transparent!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper{padding:0}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .custom-node{width:100%}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected{background-color:var(--lpx-brand)!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected .btn{color:var(--lpx-navbar-color)}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}::ng-deep .file-modal .ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell,::ng-deep .file-modal .ngx-datatable.material .datatable-body .datatable-body-row .datatable-body-cell{overflow:initial;line-break:anywhere}\n"] }]
+                    ], template: "<abp-modal [(visible)]=\"ModalOpen\" (visibleChange)=\"ModalVisibleChange($event)\"\n  [options]=\"{ size: 'xl', scrollable: false }\">\n  <ng-template #abpHeader>\n    <h3>{{'FileExplorer::FileExplorer' | abpLocalization}}</h3>\n  </ng-template>\n  <ng-template #abpBody>\n    <div class=\"row file-explorer-modal-body file-modal\">\n      <div class=\"col-3\" *ngIf=\"createDirectoryPermissionName\"  style=\"overflow: auto; height: calc(100vh - 240px)\">\n        <fe-file-modal-tree [theSelectedTreeNode]=\"_theSelectedTreeNode\" (nodeClick)=\"_nodeClick($event)\"\n          [fileContainerName]=\"_fileContainerName\"></fe-file-modal-tree>\n      </div>\n      <div [class]=\"createDirectoryPermissionName?'col-9':'col-12'\" style=\"height: calc(100vh - 240px)\">\n        <div class=\"mb-2 d-flex justify-content-between align-items-center\">\n          <div class=\"btn-link\" role=button style=\"flex: 2\" (click)=\"lookAllFile()\">{{'FileExplorer::AllFiles' | abpLocalization}}</div>\n          <div class=\"input-group form-file\" style=\"flex: 2\">\n            <input type=\"file\" class=\"form-control\" #fileEdit [multiple]=\"_multiple\" \n              (change)=\"getFileChange($event)\" />\n          </div>\n        </div>\n        <div>\n          <ngx-datatable class=\"material container-height\" [rows]=\"data.items\" [list]=\"list\" columnMode=\"flex\"\n            [columns]=\"columns\" [headerHeight]=\"50\" [footerHeight]=\"50\" rowHeight=\"auto\" [scrollbarV]=\"true\"\n            [virtualization]=\"false\" [externalPaging]=\"true\" [count]=\"data.totalCount\" [selected]=\"selectedTable\"\n            [selectCheck]=\"selectCheck\" [selectionType]=\"_multiple?SelectionType.multiClick:SelectionType.single\" (select)=\"onSelectTableItem($event)\">\n            <ngx-datatable-column [width]=\"50\" prop=\"id\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\"\n              [resizeable]=\"false\">\n              <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\n                let-selectFn=\"selectFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"allRowsSelected\"\n                  (change)=\"selectFn(!allRowsSelected)\" />\n              </ng-template>\n              <ng-template ngx-datatable-cell-template let-row=\"row\" let-value=\"value\" let-isSelected=\"isSelected\"\n                let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\n                <input type=\"checkbox\" class=\"form-check-input\" [checked]=\"selectedcheckbox(value)\"\n                  (change)=\"onCheckboxChangeFn($event)\" />\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column   [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <fe-file-preview [width]=\"'80px'\" [src]=\"row.url\" [name]=\"row.name\" [type]=\"row.mimeType\" [preview]=\"true\"></fe-file-preview>\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::FileName' | abpLocalization\" prop=\"name\" [flexGrow]=\"4\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::FileSize' | abpLocalization\" prop=\"size\" [flexGrow]=\"1.5\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ _FileApiService.formatFileSize(value) }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column  [name]=\"'FileExplorer::Directory' | abpLocalization\" prop=\"cellName\" [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [name]=\"'FileExplorer::CreationTime' | abpLocalization\" prop=\"creationTime\" [flexGrow]=\"2\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                {{ value | date : 'YYYY/MM/dd HH:mm:s' }}\n              </ng-template>\n            </ngx-datatable-column>\n            <ngx-datatable-column [flexGrow]=\"1\">\n              <ng-template let-row=\"row\" let-value=\"value\" ngx-datatable-cell-template>\n                <button class=\"btn btn-sm btn-light p-0\" (click.stop)=\"deleteFile(row)\">\n                  <i class=\"fas fa-trash text-primary p-2\"></i>\n                </button>\n              </ng-template>\n            </ngx-datatable-column>\n          </ngx-datatable>\n        </div>\n        <div *ngIf=\"uploadPictureStatusList.length > 0\"\n          class=\"position-fixed bottom-0 end-0 shadow-lg file-status-modal   m-5\"\n          style=\"border-radius: 10px\">\n          <div class=\"card p-1\">\n            <div class=\"card-header d-flex align-items-center justify-content-between p-0 py-1 border-bottom\">\n              <div>{{'FileExplorer::UploadFiles' | abpLocalization}}</div>\n              <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click.stop)=\"closeFileStatusModal()\"></button>\n            </div>\n            <div class=\"card-body\">\n              <table class=\"table\">\n                <thead>\n                  <tr>\n                    <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n                    <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n                    <th scope=\"col\"></th>\n                  </tr>\n                </thead>\n                <tbody>\n                  <ng-container *ngFor=\"let item of uploadPictureStatusList; let i = index\">\n                    <tr>\n                      <th scope=\"row\">\n                        <div>{{ item.name }}</div>\n                        <div class=\"form-text text-danger\" *ngIf=\"item.size > sizeLimit\">\n                          {{'FileExplorer::ExceedsMaximumSize' | abpLocalization:_FileApiService.formatFileSize(sizeLimit)}}\n                        </div>\n                      </th>\n                      <td>{{ item.fileSize }}</td>\n                      <td>\n                        <i *ngIf=\"item.status === 1\" class=\"fas fa-check text-primary\"></i>\n                        <i *ngIf=\"item.status === 2\" class=\"fas fa-times-circle text-danger\"></i>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </tbody>\n              </table>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </ng-template>\n  <ng-template #abpFooter>\n    <button type=\"button\" class=\"btn btn-secondary\" abpClose>{{'AbpUi::Close' | abpLocalization}}</button>\n    <abp-button iconClass=\"fa fa-check\" (click)=\"modalSave()\">{{'AbpUi::Save' | abpLocalization}}</abp-button>\n  </ng-template>\n</abp-modal>", styles: ["::ng-deep .file-modal .container-height{height:calc(100vh - 284px)}::ng-deep .file-modal .file-status-modal{background:#fff}::ng-deep .file-modal .file-status-modal .card-body{max-height:300px;overflow-y:auto}::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.single-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-selection .datatable-body-row.active .datatable-row-group,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active,::ng-deep .file-modal .ngx-datatable.material.multi-click-selection .datatable-body-row.active .datatable-row-group{background-color:transparent!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper{padding:0}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .custom-node{width:100%}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected{background-color:var(--lpx-brand)!important}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper .selected .btn{color:var(--lpx-navbar-color)}::ng-deep .file-modal .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}::ng-deep .file-modal .ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell,::ng-deep .file-modal .ngx-datatable.material .datatable-body .datatable-body-row .datatable-body-cell{overflow:initial;line-break:anywhere}\n"] }]
         }], ctorParameters: () => [{ type: FileDescriptorService$1 }, { type: i2$1.ToasterService }, { type: i3.ListService }, { type: FileApiService }, { type: i3.RestService }, { type: i2$1.ConfirmationService }, { type: i3.LocalizationService }], propDecorators: { fileContainerName: [{
                 type: Input
             }], multiple: [{
@@ -904,31 +875,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
                 type: Output
             }] } });
 
+/* eslint-disable @angular-eslint/component-selector */
 class FilePickerComponent {
-    _FileApiService;
     constructor(_FileApiService) {
         this._FileApiService = _FileApiService;
+        /**是否多选 */
+        this._multiple = false;
+        /**图片容器 */
+        this._fileContainerName = 'Images';
+        this.selectedFileChange = new EventEmitter();
+        this._fileShowTable = [];
+        /**模态框-状态-是否打开 */
+        this.ModalOpen = false;
     }
-    /**是否多选 */
-    _multiple = false;
     set multiple(v) {
         this._multiple = v;
     }
-    /**图片容器 */
-    _fileContainerName = 'images';
     set fileContainerName(v) {
         this._fileContainerName = v;
     }
-    /**已选定的文件 */
-    selectFormFile;
     ngOnChanges(changes) {
         let selectFormFilengOnChanges = changes.selectFormFile['currentValue'];
         if (selectFormFilengOnChanges.length > 0) {
             this._fileShowTable = selectFormFilengOnChanges;
         }
     }
-    selectedFileChange = new EventEmitter();
-    _fileShowTable = [];
     /**表格选择的文件回调 */
     _selectFilefn(event) {
         let _fileShowTable = this._FileApiService.deepClone(event);
@@ -936,8 +907,6 @@ class FilePickerComponent {
         this.selectFormFile = _fileShowTable;
         this.selectedFileChange.emit(_fileShowTable);
     }
-    /**模态框-状态-是否打开 */
-    ModalOpen = false;
     /**删除文件表格项 */
     deleteFileTableItem(i, file) {
         this._fileShowTable.splice(i, 1);
@@ -945,8 +914,8 @@ class FilePickerComponent {
         this.selectedFileChange.emit([]);
         this.selectedFileChange.emit(this.selectFormFile);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FilePickerComponent, deps: [{ token: FileApiService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FilePickerComponent, selector: "fe-file-picker", inputs: { multiple: "multiple", fileContainerName: "fileContainerName", selectFormFile: "selectFormFile" }, outputs: { selectedFileChange: "selectedFileChange" }, usesOnChanges: true, ngImport: i0, template: "<button class=\"btn btn-sm btn-primary ms-2 float-end\" type=\"button\" (click.stop)=\"ModalOpen = true\">{{'FileExplorer::SelectFile' | abpLocalization}}</button>\n<fe-file-modal [(visible)]=\"ModalOpen\" [selectPickerFile]=\"selectFormFile\" [multiple]=\"_multiple\"  (selectFilefn)=\"_selectFilefn($event)\" [fileContainerName]=\"_fileContainerName\"></fe-file-modal>\n<table class=\"table\" *ngIf=\"_fileShowTable.length>0\">\n    <thead>\n        <tr>\n            <th scope=\"col\"></th>\n            <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n            <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n            <th scope=\"col\"></th>\n        </tr>\n    </thead>\n    <tbody>\n        <ng-container *ngFor=\"let item of _fileShowTable;let i =index\">\n            <tr>\n                <td>\n                    <fe-file-preview [width]=\"'80px'\" [src]=\"item.url||item.Url\" [name]=\"item.name||item.Name\" [type]=\"item.mimeType||item.MimeType\" [preview]=\"true\"></fe-file-preview>\n                </td>\n                <th scope=\"row\">\n                    <div>{{item.name||item.Name}}</div>\n                </th>\n                <td >{{_FileApiService.formatFileSize(item.Size||item.size)}}</td>\n                <td>\n                    <button class=\"btn btn-sm p-0 btn-light \" (click.stop)=\"deleteFileTableItem(i,item)\">\n                        <i class=\"fas fa-trash p-2\"></i>\n                    </button>\n                </td>\n            </tr>\n        </ng-container>\n    </tbody>\n</table>\n\n\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "component", type: FileModalComponent, selector: "fe-file-modal", inputs: ["fileContainerName", "multiple", "limit", "visible", "selectPickerFile"], outputs: ["visibleChange", "selectFilefn"] }, { kind: "component", type: FilePreviewComponent, selector: "fe-file-preview", inputs: ["width", "src", "preview", "type", "name"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FilePickerComponent, deps: [{ token: FileApiService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FilePickerComponent, selector: "fe-file-picker", inputs: { multiple: "multiple", fileContainerName: "fileContainerName", selectFormFile: "selectFormFile" }, outputs: { selectedFileChange: "selectedFileChange" }, usesOnChanges: true, ngImport: i0, template: "<button class=\"btn btn-sm btn-primary ms-2 float-end\" type=\"button\" (click.stop)=\"ModalOpen = true\">{{'FileExplorer::SelectFile' | abpLocalization}}</button>\n<fe-file-modal [(visible)]=\"ModalOpen\" [selectPickerFile]=\"selectFormFile\" [multiple]=\"_multiple\"  (selectFilefn)=\"_selectFilefn($event)\" [fileContainerName]=\"_fileContainerName\"></fe-file-modal>\n<table class=\"table\" *ngIf=\"_fileShowTable.length>0\">\n    <thead>\n        <tr>\n            <th scope=\"col\"></th>\n            <th scope=\"col\">{{'FileExplorer::FileName' | abpLocalization}}</th>\n            <th scope=\"col\">{{'FileExplorer::FileSize' | abpLocalization}}</th>\n            <th scope=\"col\"></th>\n        </tr>\n    </thead>\n    <tbody>\n        <ng-container *ngFor=\"let item of _fileShowTable;let i =index\">\n            <tr>\n                <td>\n                    <fe-file-preview [width]=\"'80px'\" [src]=\"item.url||item.Url\" [name]=\"item.name||item.Name\" [type]=\"item.mimeType||item.MimeType\" [preview]=\"true\"></fe-file-preview>\n                </td>\n                <th scope=\"row\">\n                    <div>{{item.name||item.Name}}</div>\n                </th>\n                <td >{{_FileApiService.formatFileSize(item.Size||item.size)}}</td>\n                <td>\n                    <button class=\"btn btn-sm p-0 btn-light \" (click.stop)=\"deleteFileTableItem(i,item)\">\n                        <i class=\"fas fa-trash p-2\"></i>\n                    </button>\n                </td>\n            </tr>\n        </ng-container>\n    </tbody>\n</table>\n\n\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }, { kind: "component", type: FileModalComponent, selector: "fe-file-modal", inputs: ["fileContainerName", "multiple", "limit", "visible", "selectPickerFile"], outputs: ["visibleChange", "selectFilefn"] }, { kind: "component", type: FilePreviewComponent, selector: "fe-file-preview", inputs: ["width", "src", "preview", "type", "name"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FilePickerComponent, decorators: [{
             type: Component,
@@ -962,28 +931,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
             }] } });
 
 class FileDomeComponent {
-    /**跟随表单提交--已提交的数据，或选择的数据源 */
-    fileSubmittedData = [];
-    /**跟随表单提交--待提交的数据
-     *
-     * @param 待上传的文件们
-     * @param 待删除已上传的文件们
-     */
-    fileDataToBeSubmitted;
-    FileApiService = inject(FileApiService);
+    constructor() {
+        /**跟随表单提交--已提交的数据，或选择的数据源 */
+        this.fileSubmittedData = [];
+        this.FileApiService = inject(FileApiService);
+        /**选择文件-弹窗的-已选定的文件 */
+        this.selectedFileGroup = [];
+    }
     /**跟随表单提交--数据发生改变回调 */
     fileDataChange(event) {
-        console.log(event, '跟随表单提交--数据发生改变回调', this.FileApiService.deepClone(event));
         this.fileDataToBeSubmitted = event;
     }
-    /**选择文件-弹窗的-已选定的文件 */
-    selectedFileGroup = [];
     /**_selectedFile改变回调 */
     _selectedFileChange(event) {
         this.selectedFileGroup = event;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileDomeComponent, selector: "fe-file-dome", ngImport: i0, template: "<div class=\"row\">\r\n    <div class=\"col\">\r\n        <div class=\"card\">\r\n            <div class=\"card-header py-2 border-bottom\">Send file stream with form</div>\r\n            <div class=\"card-body\">\r\n                <fe-file-edit  [(fileData)]=\"fileSubmittedData\"   (fileDataChange)=\"fileDataChange($event)\"></fe-file-edit>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"col\">\r\n        <div class=\"card\">\r\n            <div class=\"card-header py-2 border-bottom\">Send file stream with form</div>\r\n            <div class=\"card-body\">\r\n                <fe-file-picker  [selectFormFile]=\"selectedFileGroup\" fileContainerName=\"SampleContainer\" (selectedFileChange)=\"_selectedFileChange($event)\" ></fe-file-picker>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [""], dependencies: [{ kind: "component", type: FileEditComponent, selector: "fe-file-edit", inputs: ["multiple", "fileData", "limit"], outputs: ["fileDataChange"] }, { kind: "component", type: FilePickerComponent, selector: "fe-file-picker", inputs: ["multiple", "fileContainerName", "selectFormFile"], outputs: ["selectedFileChange"] }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileDomeComponent, selector: "fe-file-dome", ngImport: i0, template: "<div class=\"row\">\r\n    <div class=\"col\">\r\n        <div class=\"card\">\r\n            <div class=\"card-header py-2 border-bottom\">Send file stream with form</div>\r\n            <div class=\"card-body\">\r\n                <fe-file-edit  [(fileData)]=\"fileSubmittedData\"   (fileDataChange)=\"fileDataChange($event)\"></fe-file-edit>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"col\">\r\n        <div class=\"card\">\r\n            <div class=\"card-header py-2 border-bottom\">Send file stream with form</div>\r\n            <div class=\"card-body\">\r\n                <fe-file-picker  [selectFormFile]=\"selectedFileGroup\" fileContainerName=\"SampleContainer\" (selectedFileChange)=\"_selectedFileChange($event)\" ></fe-file-picker>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [""], dependencies: [{ kind: "component", type: FileEditComponent, selector: "fe-file-edit", inputs: ["multiple", "fileData", "limit"], outputs: ["fileDataChange"] }, { kind: "component", type: FilePickerComponent, selector: "fe-file-picker", inputs: ["multiple", "fileContainerName", "selectFormFile"], outputs: ["selectedFileChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileDomeComponent, decorators: [{
             type: Component,
@@ -997,9 +961,9 @@ const routes = [
     },
 ];
 class FileExplorerRoutingModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, imports: [i1$1.RouterModule], exports: [RouterModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, imports: [i1$1.RouterModule], exports: [RouterModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerRoutingModule, decorators: [{
             type: NgModule,
@@ -1010,11 +974,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
         }] });
 
 class FileExplorerConfig {
-    /**文件容器名称 */
-    'FileExplorer.FileContainerName' = ['', [Validators.required]];
-    /**多选 */
-    'FileExplorer.UploadFileMultiple' = [false, []];
     constructor(data) {
+        /**文件容器名称 */
+        this['FileExplorer.FileContainerName'] = ['', [Validators.required]];
+        /**多选 */
+        this['FileExplorer.UploadFileMultiple'] = [false, []];
         if (data) {
             for (const key in data) {
                 if (data.hasOwnProperty(key)) {
@@ -1026,24 +990,17 @@ class FileExplorerConfig {
 }
 
 class FileExplorerConfigComponent {
-    fb;
     constructor(fb) {
         this.fb = fb;
     }
-    /**表单控件类型 */
-    _type;
     set type(v) {
         this._type = v;
         this.dataLoaded();
     }
-    /**表单实体 */
-    _Entity;
     set Entity(v) {
         this._Entity = v;
         this.dataLoaded();
     }
-    /**选择的表单信息 */
-    _selected;
     set selected(v) {
         this._selected = v;
         this.dataLoaded();
@@ -1051,7 +1008,6 @@ class FileExplorerConfigComponent {
     get formConfiguration() {
         return this._Entity.get('formConfiguration');
     }
-    submitclick;
     async dataLoaded() {
         if (this._Entity && this._type) {
             await this.AfterInit();
@@ -1069,8 +1025,8 @@ class FileExplorerConfigComponent {
             resolve(true);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerConfigComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileExplorerConfigComponent, selector: "fe-file-explorer-config", inputs: { type: "type", Entity: "Entity", selected: "selected" }, viewQueries: [{ propertyName: "submitclick", first: true, predicate: ["submitclick"], descendants: true, static: true }], ngImport: i0, template: "<form [formGroup]=\"_Entity\">\n    <div formGroupName=\"formConfiguration\">\n        <div class=\"mb-2\">\n            <label class=\"form-label\">{{'DigniteAbpDynamicFormsFileExplorer::FileContainerName' | abpLocalization}}</label>\n            <input type=\"text\" class=\"form-control\" formControlName=\"FileExplorer.FileContainerName\">\n        </div>\n        <div class=\"mb-2\">\n            <div class=\"form-check form-check-inline\">\n                <input class=\"form-check-input\" type=\"checkbox\" formControlName=\"FileExplorer.UploadFileMultiple\" id=\"flexRadioDefault1\">\n                <label class=\"form-check-label\" for=\"flexRadioDefault1\">\n                    {{'DigniteAbpDynamicFormsFileExplorer::UploadFileMultiple' | abpLocalization}}\n                </label>\n            </div>\n        </div>\n        <button type=\"submit\" (abpInit)=\"submitclick?.nativeElement?.click()\" style=\"display: none;\"\n            #submitclick></button>\n    </div>\n</form>", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.InitDirective, selector: "[abpInit]", outputs: ["abpInit"] }, { kind: "directive", type: i3$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "directive", type: i3$1.ValidationDirective, selector: "[formControl],[formControlName]", exportAs: ["validationDirective"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerConfigComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileExplorerConfigComponent, selector: "fe-file-explorer-config", inputs: { type: "type", Entity: "Entity", selected: "selected" }, viewQueries: [{ propertyName: "submitclick", first: true, predicate: ["submitclick"], descendants: true, static: true }], ngImport: i0, template: "<form [formGroup]=\"_Entity\">\n    <div formGroupName=\"formConfiguration\">\n        <div class=\"mb-2\">\n            <label class=\"form-label\">{{'DigniteAbpDynamicFormsFileExplorer::FileContainerName' | abpLocalization}}</label>\n            <input type=\"text\" class=\"form-control\" formControlName=\"FileExplorer.FileContainerName\">\n        </div>\n        <div class=\"mb-2\">\n            <div class=\"form-check form-check-inline\">\n                <input class=\"form-check-input\" type=\"checkbox\" formControlName=\"FileExplorer.UploadFileMultiple\" id=\"flexRadioDefault1\">\n                <label class=\"form-check-label\" for=\"flexRadioDefault1\">\n                    {{'DigniteAbpDynamicFormsFileExplorer::UploadFileMultiple' | abpLocalization}}\n                </label>\n            </div>\n        </div>\n        <button type=\"submit\" (abpInit)=\"submitclick?.nativeElement?.click()\" style=\"display: none;\"\n            #submitclick></button>\n    </div>\n</form>", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.InitDirective, selector: "[abpInit]", outputs: ["abpInit"] }, { kind: "directive", type: i3$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "directive", type: i3$1.ValidationDirective, selector: "[formControl],[formControlName]", exportAs: ["validationDirective"] }, { kind: "pipe", type: i3.LocalizationPipe, name: "abpLocalization" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerConfigComponent, decorators: [{
             type: Component,
@@ -1087,39 +1043,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
             }] } });
 
 class FileExplorerControlComponent {
-    fb;
     constructor(fb) {
         this.fb = fb;
+        /**字段配置列表 */
+        this._fields = '';
+        /**字段配置 */
+        this.formConfiguration = '';
+        /**文件容器名称 */
+        this.FileContainerName = '';
+        /**选择文件-弹窗的-已选定的文件 */
+        this.selectedFileGroup = [];
     }
-    /**表单实体 */
-    _entity;
     set entity(v) {
         this._entity = v;
         if (v)
             this.dataLoaded();
     }
-    /**字段配置列表 */
-    _fields = '';
     set fields(v) {
         this._fields = v;
         if (v)
             this.dataLoaded();
     }
-    /**父级字段名称，用于为表单设置控件赋值 */
-    _parentFiledName;
     set parentFiledName(v) {
         this._parentFiledName = v;
         if (v)
             this.dataLoaded();
     }
-    /**父级字段名称，用于为表单设置控件赋值 */
-    _selected;
     set selected(v) {
         this._selected = v;
         if (v && v.length > 0)
             this.dataLoaded();
     }
-    submitclick;
     get extraProperties() {
         return this._entity.get('extraProperties');
     }
@@ -1130,10 +1084,6 @@ class FileExplorerControlComponent {
             this.submitclick.nativeElement.click();
         }
     }
-    /**字段配置 */
-    formConfiguration = '';
-    /**文件容器名称 */
-    FileContainerName = '';
     AfterInit() {
         return new Promise((resolve, rejects) => {
             let ValidatorsArray = [];
@@ -1150,8 +1100,6 @@ class FileExplorerControlComponent {
             resolve(true);
         });
     }
-    /**选择文件-弹窗的-已选定的文件 */
-    selectedFileGroup = [];
     /**_selectedFile改变回调 */
     _selectedFileChange(event) {
         this.selectedFileGroup = event;
@@ -1160,8 +1108,8 @@ class FileExplorerControlComponent {
         obj[fieldName] = event;
         this.extraProperties.patchValue(obj);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerControlComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileExplorerControlComponent, selector: "fe-file-explorer-control", inputs: { entity: "entity", fields: "fields", parentFiledName: "parentFiledName", selected: "selected" }, viewQueries: [{ propertyName: "submitclick", first: true, predicate: ["submitclick"], descendants: true, static: true }], ngImport: i0, template: "<form [formGroup]=\"_entity\">\n    <div formGroupName=\"extraProperties\">\n        <div class=\"mb-2\">\n            <label class=\"form-label\" *ngIf=\"_fields.displayName\">{{ _fields.displayName }}</label>\n            <fe-file-picker [selectFormFile]=\"selectedFileGroup\" [multiple]=\"formConfiguration['FileExplorer.UploadFileMultiple']\"\n                (selectedFileChange)=\"_selectedFileChange($event)\" [fileContainerName]=\"FileContainerName\"></fe-file-picker>\n            <div class=\"form-text\" *ngIf=\"_fields.field.description\">{{_fields.field.description}}</div>\n        </div>\n    </div>\n    <button type=\"submit\" style=\"display: none;\" #submitclick></button>\n</form>", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "component", type: FilePickerComponent, selector: "fe-file-picker", inputs: ["multiple", "fileContainerName", "selectFormFile"], outputs: ["selectedFileChange"] }] });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerControlComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.5", type: FileExplorerControlComponent, selector: "fe-file-explorer-control", inputs: { entity: "entity", fields: "fields", parentFiledName: "parentFiledName", selected: "selected" }, viewQueries: [{ propertyName: "submitclick", first: true, predicate: ["submitclick"], descendants: true, static: true }], ngImport: i0, template: "<form [formGroup]=\"_entity\">\n    <div formGroupName=\"extraProperties\">\n        <div class=\"mb-2\">\n            <label class=\"form-label\" *ngIf=\"_fields.displayName\">{{ _fields.displayName }}</label>\n            <fe-file-picker [selectFormFile]=\"selectedFileGroup\" [multiple]=\"formConfiguration['FileExplorer.UploadFileMultiple']\"\n                (selectedFileChange)=\"_selectedFileChange($event)\" [fileContainerName]=\"FileContainerName\"></fe-file-picker>\n            <div class=\"form-text\" *ngIf=\"_fields.field.description\">{{_fields.field.description}}</div>\n        </div>\n    </div>\n    <button type=\"submit\" style=\"display: none;\" #submitclick></button>\n</form>", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "component", type: FilePickerComponent, selector: "fe-file-picker", inputs: ["multiple", "fileContainerName", "selectFormFile"], outputs: ["selectedFileChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerControlComponent, decorators: [{
             type: Component,
@@ -1200,8 +1148,8 @@ function AddFieldControlGroup(array = []) {
 }
 
 class FileExplorerModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, declarations: [FileEditComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, declarations: [FileEditComponent,
             FilePickerComponent,
             FileModalComponent,
             FileModalTreeComponent,
@@ -1220,15 +1168,15 @@ class FileExplorerModule {
             FileModalComponent,
             FileModalTreeComponent,
             FileDomeComponent,
-            FilePreviewComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, imports: [FormsModule,
+            FilePreviewComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, imports: [FormsModule,
             CoreModule,
             ThemeSharedModule,
             ReactiveFormsModule,
             NgbDropdownModule,
             NzTreeModule,
             NgxValidateCoreModule,
-            FileExplorerRoutingModule] });
+            FileExplorerRoutingModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: FileExplorerModule, decorators: [{
             type: NgModule,