ngx-rs-ant 2.2.2 → 2.2.4

package/fesm2020/ngx-rs-ant.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { Component, Input, HostBinding, EventEmitter, Output, HostListener, ViewContainerRef, ViewChild, Directive, ViewChildren, NgModule, Injectable, ContentChild, Pipe } from '@angular/core';
-import { PluginFactory } from 'coast-plugin-register';
+import { PluginFactory, MarkItemFactory } from 'coast-plugin-register';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { Subject, ReplaySubject, Subscription, map, shareReplay, firstValueFrom, of, lastValueFrom, debounceTime, interval } from 'rxjs';
@@ -29,6 +29,8 @@ import * as i5$2 from 'devextreme-angular/ui/tooltip';
 import * as i4 from 'devextreme-angular/ui/popover';
 import * as i2$3 from 'ng2-pdfjs-viewer';
 import { PdfJsViewerComponent, PdfJsViewerModule } from 'ng2-pdfjs-viewer';
+import * as i2$4 from 'devextreme-angular/ui/select-box';
+import * as i7$1 from 'devextreme-angular/ui/validation-group';
 
 class DividerLineComponent {
     get _style() {
@@ -1801,13 +1803,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
 
-function notify_error(message) {
+function notifyError(message) {
     _notify(message, 12000, 'warning');
 }
-function notify_warning(message) {
+function notifyWarning(message) {
     _notify(message, 8000, 'warning');
 }
-function notify_success(message) {
+function notifySuccess(message) {
     _notify(message, 4000, 'success');
 }
 function _notify(message, time, type) {
@@ -1827,7 +1829,7 @@ function _notify(message, time, type) {
 function localeSortMethod(value1, value2) {
     return value1.localeCompare(value2);
 }
-function file_type_icon(name) {
+function fileTypeIcon(name) {
     const type = name.substring(name.lastIndexOf('.') + 1).toLocaleLowerCase();
     switch (type) {
         case 'doc':
@@ -1862,11 +1864,11 @@ function file_type_icon(name) {
             return 'unknown';
     }
 }
-function support_preview_ext() {
+function supportPreviewExt() {
     return ['pdf', 'png', 'jpg', 'jpeg', 'gif', 'bmp', 'doc', 'docx', 'txt', 'xml', 'json', 'js', 'xls', 'xlsx', 'csv', 'ppt', 'pptx', 'mp3', 'mp4'];
 }
-function format_file_size(size) {
-    const labels = ['b', 'Kb', 'Mb', 'Gb'];
+function formatFileSize(size) {
+    const labels = ['b', 'Kb', 'Mb', 'Gb', 'Tb', 'Pb'];
     const count = labels.length - 1;
     let i = 0;
     while (i < count && size >= 1024) {
@@ -1875,7 +1877,7 @@ function format_file_size(size) {
     }
     return Math.round(size * 100) / 100 + " " + labels[i];
 }
-function filename_from_disposition(disposition) {
+function filenameFromDisposition(disposition) {
     const filenamePair = disposition.split(';').filter(str => /^filename=/.test(str.trim())).pop();
     if (filenamePair) {
         let str = filenamePair.trim();
@@ -1887,7 +1889,7 @@ function filename_from_disposition(disposition) {
         return null;
     }
 }
-function download_file(blob, filename, callback) {
+function downloadFile(blob, filename, callback) {
     const url = window.webkitURL.createObjectURL(blob);
     const a = document.createElement('a');
     document.body.appendChild(a);
@@ -1926,20 +1928,20 @@ function validate(validator) {
         }
     });
 }
-function validate_group(validationGroupComponent) {
+function validateGroup(validationGroupComponent) {
     if (!validationGroupComponent) {
         return firstValueFrom(of(true));
     }
-    return validateGroup(validationGroupComponent.instance, validationGroupComponent.element.nativeElement);
+    return _validateGroup(validationGroupComponent.instance, validationGroupComponent.element.nativeElement);
 }
-function validate_group_by_name(name, brokenElementParent) {
+function validateGroupByName(name, brokenElementParent) {
     const validationGroup = validationEngine.getGroupConfig(name);
     if (!validationGroup) {
         return firstValueFrom(of(true));
     }
-    return validateGroup(validationGroup, brokenElementParent);
+    return _validateGroup(validationGroup, brokenElementParent);
 }
-function validateGroup(validationGroup, brokenElementParent) {
+function _validateGroup(validationGroup, brokenElementParent) {
     let sourceNode;
     const targetClassName = 'dx-field';
     const findTargetNode = (node) => {
@@ -2023,7 +2025,7 @@ function evaluateFilter(filter, model) {
         return false;
     }
     if (typeof filter[0] === 'string') {
-        return evaluateCondition(filter, model);
+        return _evaluateCondition(filter, model);
     }
     // 复合条件，约定统一为and/or
     let currentOperator = filter[1].toUpperCase();
@@ -2040,7 +2042,7 @@ function evaluateFilter(filter, model) {
     }
     return false;
 }
-function evaluateCondition(condition, model) {
+function _evaluateCondition(condition, model) {
     const [key, conditionType, value] = condition;
     let modelValue = model[key];
     switch (conditionType) {
@@ -2801,10 +2803,10 @@ class FormComponent extends UniqueId {
     validate() {
         return new Promise((resolve) => {
             const promises = Array.from(this.elementRef.nativeElement.querySelectorAll('rs-form')).map((item) => {
-                return validate_group_by_name(item.getAttribute('validator-group-name'), this.elementRef.nativeElement);
+                return validateGroupByName(item.getAttribute('validator-group-name'), this.elementRef.nativeElement);
             });
             // 添加顶级元素的验证 Promise
-            promises.push(validate_group_by_name(this.getUniqueId(), this.elementRef.nativeElement));
+            promises.push(validateGroupByName(this.getUniqueId(), this.elementRef.nativeElement));
             // 使用 Promise.all 等待所有 Promise 完成
             Promise.all(promises)
                 .then((results) => {
@@ -2869,7 +2871,7 @@ class InstanceLinkTemplateComponent {
     openNewTab($event) {
         $event.event?.stopPropagation();
         if (!window.coast.tabManager) {
-            notify_warning('此操作仅能在coast-web项目中执行，type：detail，config：tenant=' + this.tenant + ',className=' + this.className + ',oid=' + this.oid);
+            notifyWarning('此操作仅能在coast-web项目中执行，type：detail，config：tenant=' + this.tenant + ',className=' + this.className + ',oid=' + this.oid);
             return;
         }
         window.coast.tabManager.add.next({
@@ -3045,7 +3047,7 @@ class DataGridComponent {
         });
         if (this.onlyFrontEnd) {
             if (this.dataSource && !Array.isArray(this.dataSource)) {
-                notify_error('因onlyFrontEnd参数为true，需要明确指定dataSource参数为数组');
+                notifyError('因onlyFrontEnd参数为true，需要明确指定dataSource参数为数组');
             }
         }
         else {
@@ -3692,11 +3694,15 @@ class ModalComponent {
                 modals[i].querySelector('.modal-backdrop').style.backgroundColor = 'rgba(37, 43, 58, 0)';
             }
         }
+        this.elementRef.nativeElement.style.display = 'block';
     }
     hide() {
         // 在service中重写
         this.onHide.emit();
     }
+    onlyHide() {
+        this.elementRef.nativeElement.style.display = 'none';
+    }
     ngOnDestroy() {
         // 若存在多层模态框，下一层遮罩设置为不透明
         const nodeName = this.elementRef.nativeElement.nodeName;
@@ -3909,6 +3915,13 @@ class FormItemComponentBase extends ComponentBase {
     }
 }
 
+class MarkItemComponentBase extends ComponentBase {
+    constructor() {
+        super(...arguments);
+        this.readonly = false;
+    }
+}
+
 class ModalComponentBase extends ComponentBase {
 }
 
@@ -3931,6 +3944,9 @@ class CellConfigBase extends ConfigBase {
 class FormItemConfigBase extends ConfigBase {
 }
 
+class MarkItemConfigBase extends ComponentBase {
+}
+
 class ModalConfigBase extends ConfigBase {
 }
 
@@ -4116,9 +4132,1006 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
             type: Injectable
         }], ctorParameters: function () { return []; } });
 
+class PtPipe {
+    transform(value, scale = 1) {
+        if (!value) {
+            return '';
+        }
+        if (typeof value === 'string') {
+            return value;
+        }
+        return value * scale + 'pt';
+    }
+}
+PtPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PtPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+PtPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PtPipe, name: "pt" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PtPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'pt'
+                }]
+        }] });
+
+class SectionService {
+    constructor() {
+        this.scale = 1;
+        this.marks = [];
+        this.readonly = false;
+        this.activeMark = { name: '未定义书签' };
+        this.copiedMark = {};
+        this.readyPasteMarkNames = [];
+        this.lastClickToPasteMarkName = '';
+        this.valueUpdated = new EventEmitter();
+    }
+    switchMark(type) {
+        let index = this.marks.indexOf(this.activeMark);
+        if (index + type === -1) {
+            this.activeMark = this.marks[this.marks.length - 1];
+        }
+        else if (index + type === this.marks.length) {
+            this.activeMark = this.marks[0];
+        }
+        else {
+            this.activeMark = this.marks[index + type];
+        }
+        document.getElementById('mark-setting_' + this.activeMark.name)?.scrollIntoView({
+            block: 'center',
+            inline: 'center'
+        });
+    }
+    getMark(name) {
+        if (!name) {
+            return undefined;
+        }
+        return this.marks.find(m => m.name === name);
+    }
+    getMarkIndex(name) {
+        if (!name) {
+            return -1;
+        }
+        return this.marks.findIndex(m => m.name === name);
+    }
+}
+SectionService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SectionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionService, decorators: [{
+            type: Injectable
+        }] });
+
+class MarkPipe {
+    constructor(service) {
+        this.service = service;
+    }
+    transform(name) {
+        return this.service.getMark(name);
+    }
+}
+MarkPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MarkPipe, deps: [{ token: SectionService }], target: i0.ɵɵFactoryTarget.Pipe });
+MarkPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: MarkPipe, name: "mark" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MarkPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'mark'
+                }]
+        }], ctorParameters: function () { return [{ type: SectionService }]; } });
+
+class RunComponent {
+    constructor(service) {
+        this.service = service;
+        this.editMode = false;
+        this.pasteMode = false;
+    }
+    ngOnInit() {
+        if (!this.node.text) {
+            if (this.node.mark && this.editMode) {
+                this.nodeText = '&ensp;';
+            }
+            else {
+                this.nodeText = '';
+            }
+        }
+        else {
+            this.nodeText = this.node.text.replaceAll(' ', '&ensp;').replaceAll('\f', '&ensp;');
+        }
+    }
+    click($event, markName) {
+        if (this.pasteMode) {
+            if (markName === this.service.activeMark?.name) {
+                return;
+            }
+            if ($event.ctrlKey) {
+                if (this.service.readyPasteMarkNames.includes(markName)) {
+                    this.service.readyPasteMarkNames.splice(this.service.readyPasteMarkNames.indexOf(markName), 1);
+                }
+                else {
+                    this.service.lastClickToPasteMarkName = markName;
+                    this.service.readyPasteMarkNames.push(markName);
+                }
+            }
+            else if ($event.shiftKey) {
+                if (this.service.lastClickToPasteMarkName) {
+                    let startIndex = this.service.getMarkIndex(this.service.lastClickToPasteMarkName);
+                    let endIndex = this.service.getMarkIndex(markName);
+                    this.service.lastClickToPasteMarkName = markName;
+                    if (startIndex > endIndex) {
+                        let temp = startIndex;
+                        startIndex = endIndex;
+                        endIndex = temp;
+                    }
+                    for (let i = startIndex; i <= endIndex; i++) {
+                        let name = this.service.marks[i].name;
+                        if (!this.service.readyPasteMarkNames.includes(name)) {
+                            this.service.readyPasteMarkNames.push(name);
+                        }
+                    }
+                }
+                else {
+                    this.service.lastClickToPasteMarkName = markName;
+                    this.service.readyPasteMarkNames = [markName];
+                }
+            }
+            else {
+                this.service.lastClickToPasteMarkName = markName;
+                this.service.readyPasteMarkNames = [markName];
+            }
+        }
+        else {
+            this.service.activeMark = this.service.getMark(markName);
+        }
+    }
+}
+RunComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RunComponent, deps: [{ token: SectionService }], target: i0.ɵɵFactoryTarget.Component });
+RunComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: RunComponent, selector: "rs-run", inputs: { node: "node", editMode: "editMode", pasteMode: "pasteMode" }, ngImport: i0, template: "<div class=\"node\" [style.display]=\"node.type === 'image' ? 'inline-block' : ''\" [style.float]=\"node.style?.['float']\">\r\n  <i *ngIf=\"node.mark && node.setting && editMode\"\r\n     [id]=\"'mark-setting_' + node.mark\"\r\n     [style.font-size]=\"12 | pt:service.scale\"\r\n     [style.left]=\"-12 | pt:service.scale\"\r\n     class=\"mark-setting coast-icon-setting\"\r\n     [class.used]=\"(node.mark | mark)?.type\"\r\n     [class.active]=\"node.mark === service.activeMark.name\"\r\n     [class.copied]=\"node.mark === service.copiedMark.name\"\r\n     [class.ready-paste]=\"service.readyPasteMarkNames.includes(node.mark)\"\r\n     (click)=\"click($event, node.mark)\"></i>\r\n  <span *ngIf=\"node.type === 'run'\"\r\n        [style.font-family]=\"node.style['font-family']\"\r\n        [style.font-size]=\"node.style['font-size'] | pt:service.scale\"\r\n        [style.font-weight]=\"node.style['font-bold'] ? 'bold' : 'normal'\"\r\n        [style.text-decoration]=\"node.style['underline'] ? 'underline 1px' : 'none'\"\r\n        [style.float]=\"node.style['float']\"\r\n        [class.mark]=\"node.mark === service.activeMark.name && editMode\"\r\n        [innerHTML]=\"nodeText\">\r\n    </span>\r\n  <img *ngIf=\"node.type === 'image'\"\r\n       [style.width]=\"node.style['width'] | pt:service.scale\"\r\n       [style.height]=\"node.style['height'] | pt:service.scale\"\r\n       [style.position]=\"node.style['position']\"\r\n       [style.top]=\"node.style['top'] | pt:service.scale\"\r\n       [style.left]=\"node.style['left'] | pt:service.scale\"\r\n       [style.z-index]=\"node.style['z-index']\"\r\n       [class.mark]=\"node.mark === service.activeMark.name && editMode\"\r\n       [src]=\"'data:image/png;base64,' + node.data\" alt=\"\">\r\n</div>\r\n", styles: [":host .node{position:relative;display:inline;text-indent:0}:host .node .mark-setting{position:absolute;cursor:pointer;color:var(--coast-warning-color, rgb(240, 173, 78));z-index:1}:host .node .mark-setting.used{color:var(--coast-success-color, rgb(92, 184, 92))}:host .node .mark-setting.active{color:var(--coast-default-color, rgb(51, 122, 183))}:host .node .mark-setting.copied{background-color:var(--coast-success-color, rgb(92, 184, 92))}:host .node .mark-setting.ready-paste{background-color:var(--coast-danger-color, rgb(217, 83, 79))}:host .node span.mark{background-color:var(--coast-active-color, rgba(51, 122, 183, .5))}:host .node img.mark{border:1px solid var(--coast-active-color, rgba(51, 122, 183, .5))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: MarkPipe, name: "mark" }, { kind: "pipe", type: PtPipe, name: "pt" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RunComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-run', template: "<div class=\"node\" [style.display]=\"node.type === 'image' ? 'inline-block' : ''\" [style.float]=\"node.style?.['float']\">\r\n  <i *ngIf=\"node.mark && node.setting && editMode\"\r\n     [id]=\"'mark-setting_' + node.mark\"\r\n     [style.font-size]=\"12 | pt:service.scale\"\r\n     [style.left]=\"-12 | pt:service.scale\"\r\n     class=\"mark-setting coast-icon-setting\"\r\n     [class.used]=\"(node.mark | mark)?.type\"\r\n     [class.active]=\"node.mark === service.activeMark.name\"\r\n     [class.copied]=\"node.mark === service.copiedMark.name\"\r\n     [class.ready-paste]=\"service.readyPasteMarkNames.includes(node.mark)\"\r\n     (click)=\"click($event, node.mark)\"></i>\r\n  <span *ngIf=\"node.type === 'run'\"\r\n        [style.font-family]=\"node.style['font-family']\"\r\n        [style.font-size]=\"node.style['font-size'] | pt:service.scale\"\r\n        [style.font-weight]=\"node.style['font-bold'] ? 'bold' : 'normal'\"\r\n        [style.text-decoration]=\"node.style['underline'] ? 'underline 1px' : 'none'\"\r\n        [style.float]=\"node.style['float']\"\r\n        [class.mark]=\"node.mark === service.activeMark.name && editMode\"\r\n        [innerHTML]=\"nodeText\">\r\n    </span>\r\n  <img *ngIf=\"node.type === 'image'\"\r\n       [style.width]=\"node.style['width'] | pt:service.scale\"\r\n       [style.height]=\"node.style['height'] | pt:service.scale\"\r\n       [style.position]=\"node.style['position']\"\r\n       [style.top]=\"node.style['top'] | pt:service.scale\"\r\n       [style.left]=\"node.style['left'] | pt:service.scale\"\r\n       [style.z-index]=\"node.style['z-index']\"\r\n       [class.mark]=\"node.mark === service.activeMark.name && editMode\"\r\n       [src]=\"'data:image/png;base64,' + node.data\" alt=\"\">\r\n</div>\r\n", styles: [":host .node{position:relative;display:inline;text-indent:0}:host .node .mark-setting{position:absolute;cursor:pointer;color:var(--coast-warning-color, rgb(240, 173, 78));z-index:1}:host .node .mark-setting.used{color:var(--coast-success-color, rgb(92, 184, 92))}:host .node .mark-setting.active{color:var(--coast-default-color, rgb(51, 122, 183))}:host .node .mark-setting.copied{background-color:var(--coast-success-color, rgb(92, 184, 92))}:host .node .mark-setting.ready-paste{background-color:var(--coast-danger-color, rgb(217, 83, 79))}:host .node span.mark{background-color:var(--coast-active-color, rgba(51, 122, 183, .5))}:host .node img.mark{border:1px solid var(--coast-active-color, rgba(51, 122, 183, .5))}\n"] }]
+        }], ctorParameters: function () { return [{ type: SectionService }]; }, propDecorators: { node: [{
+                type: Input
+            }], editMode: [{
+                type: Input
+            }], pasteMode: [{
+                type: Input
+            }] } });
+
+class ParagraphComponent {
+    get _style() {
+        return {
+            display: 'block',
+            marginTop: this.pt.transform(this.paragraph.style['margin-top'], this.service.scale),
+            marginBottom: this.pt.transform(this.paragraph.style['margin-bottom'], this.service.scale),
+            marginLeft: this.pt.transform(this.paragraph.style['margin-left'], this.service.scale),
+            textIndent: this.pt.transform(this.paragraph.style['text-indent'], this.service.scale),
+            textAlign: this.paragraph.style['text-align'],
+            lineHeight: this.pt.transform(this.paragraph.style['line-height'], this.service.scale),
+            minHeight: this.pt.transform(this.paragraph.style['min-height'], this.service.scale),
+            fontFamily: this.paragraph.style['font-family'],
+            fontSize: this.pt.transform(this.paragraph.style['font-size'], this.service.scale)
+        };
+    }
+    constructor(service, pt) {
+        this.service = service;
+        this.pt = pt;
+        this.editMode = false;
+        this.pasteMode = false;
+    }
+}
+ParagraphComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ParagraphComponent, deps: [{ token: SectionService }, { token: PtPipe }], target: i0.ɵɵFactoryTarget.Component });
+ParagraphComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ParagraphComponent, selector: "rs-paragraph", inputs: { paragraph: "paragraph", editMode: "editMode", pasteMode: "pasteMode" }, host: { properties: { "style": "this._style" } }, ngImport: i0, template: "<ng-container *ngFor=\"let node of paragraph.content\">\r\n  <rs-run [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\"></rs-run>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: RunComponent, selector: "rs-run", inputs: ["node", "editMode", "pasteMode"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ParagraphComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-paragraph', template: "<ng-container *ngFor=\"let node of paragraph.content\">\r\n  <rs-run [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\"></rs-run>\r\n</ng-container>\r\n" }]
+        }], ctorParameters: function () { return [{ type: SectionService }, { type: PtPipe }]; }, propDecorators: { paragraph: [{
+                type: Input
+            }], editMode: [{
+                type: Input
+            }], pasteMode: [{
+                type: Input
+            }], _style: [{
+                type: HostBinding,
+                args: ['style']
+            }] } });
+
+class ItemComponent {
+    get _style() {
+        if (this.node.style?.float) {
+            return { float: this.node.style.float };
+        }
+        return {};
+    }
+    constructor(service) {
+        this.service = service;
+        this.editMode = false;
+        this.readonly = false;
+    }
+    ngOnInit() {
+        if (!this.mark.type || !this.node.setting) {
+            return;
+        }
+        let markItem = MarkItemFactory.get(this.mark.type);
+        if (!markItem) {
+            console.error('不存在组件：' + this.mark.type);
+            return;
+        }
+        setTimeout(() => {
+            let componentRef = this.itemRef.createComponent(markItem.component);
+            const componentInstance = componentRef.instance;
+            componentInstance.tenant = this.service.tenant;
+            componentInstance.templateClassName = this.service.templateClassName;
+            componentInstance.instanceClassName = this.service.instanceClassName;
+            componentInstance.instanceOid = this.service.instanceOid;
+            componentInstance.mark = this.mark;
+            componentInstance.marks = this.service.marks;
+            componentInstance.readonly = this.service.readonly || this.readonly;
+            componentInstance.valueUpdated = this.service.valueUpdated;
+            componentInstance.params = this.service.params;
+            componentInstance.tabViewContainerRef = this.service.tabViewContainerRef;
+        });
+    }
+}
+ItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ItemComponent, deps: [{ token: SectionService }], target: i0.ɵɵFactoryTarget.Component });
+ItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ItemComponent, selector: "rs-item", inputs: { node: "node", mark: "mark", editMode: "editMode", readonly: "readonly" }, host: { properties: { "style": "this._style" } }, viewQueries: [{ propertyName: "itemRef", first: true, predicate: ["itemRef"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container *ngIf=\"node.setting\" #itemRef></ng-container>\r\n<rs-run *ngIf=\"mark.config.showMarkContent\" [node]=\"node\" [editMode]=\"editMode\"></rs-run>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: RunComponent, selector: "rs-run", inputs: ["node", "editMode", "pasteMode"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-item', template: "<ng-container *ngIf=\"node.setting\" #itemRef></ng-container>\r\n<rs-run *ngIf=\"mark.config.showMarkContent\" [node]=\"node\" [editMode]=\"editMode\"></rs-run>\r\n" }]
+        }], ctorParameters: function () { return [{ type: SectionService }]; }, propDecorators: { node: [{
+                type: Input
+            }], mark: [{
+                type: Input
+            }], editMode: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], _style: [{
+                type: HostBinding,
+                args: ['style']
+            }], itemRef: [{
+                type: ViewChild,
+                args: ['itemRef', { read: ViewContainerRef }]
+            }] } });
+
+class ParagraphForInputComponent {
+    get _style() {
+        return {
+            display: 'block',
+            marginTop: this.pt.transform(this.paragraph.style['margin-top'], this.service.scale),
+            marginBottom: this.pt.transform(this.paragraph.style['margin-bottom'], this.service.scale),
+            marginLeft: this.pt.transform(this.paragraph.style['margin-left'], this.service.scale),
+            textIndent: this.pt.transform(this.paragraph.style['text-indent'], this.service.scale),
+            textAlign: this.paragraph.style['text-align'],
+            lineHeight: this.pt.transform(this.paragraph.style['line-height'], this.service.scale),
+            minHeight: this.pt.transform(this.paragraph.style['min-height'], this.service.scale),
+            fontFamily: this.paragraph.style['font-family'],
+            fontSize: this.pt.transform(this.paragraph.style['font-size'], this.service.scale)
+        };
+    }
+    constructor(service, pt) {
+        this.service = service;
+        this.pt = pt;
+        this.editMode = false;
+        this.readonly = false;
+    }
+}
+ParagraphForInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ParagraphForInputComponent, deps: [{ token: SectionService }, { token: PtPipe }], target: i0.ɵɵFactoryTarget.Component });
+ParagraphForInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ParagraphForInputComponent, selector: "rs-paragraph-for-input", inputs: { paragraph: "paragraph", editMode: "editMode", readonly: "readonly" }, host: { properties: { "style": "this._style" } }, ngImport: i0, template: "<ng-container *ngFor=\"let node of paragraph.content\">\r\n  <rs-item *ngIf=\"node.mark\" [node]=\"node\" [mark]=\"node.mark | mark\" [editMode]=\"editMode\"\r\n           [readonly]=\"readonly\"></rs-item>\r\n  <rs-run *ngIf=\"!node.mark\" [node]=\"node\"></rs-run>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: RunComponent, selector: "rs-run", inputs: ["node", "editMode", "pasteMode"] }, { kind: "component", type: ItemComponent, selector: "rs-item", inputs: ["node", "mark", "editMode", "readonly"] }, { kind: "pipe", type: MarkPipe, name: "mark" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ParagraphForInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-paragraph-for-input', template: "<ng-container *ngFor=\"let node of paragraph.content\">\r\n  <rs-item *ngIf=\"node.mark\" [node]=\"node\" [mark]=\"node.mark | mark\" [editMode]=\"editMode\"\r\n           [readonly]=\"readonly\"></rs-item>\r\n  <rs-run *ngIf=\"!node.mark\" [node]=\"node\"></rs-run>\r\n</ng-container>\r\n" }]
+        }], ctorParameters: function () { return [{ type: SectionService }, { type: PtPipe }]; }, propDecorators: { paragraph: [{
+                type: Input
+            }], editMode: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], _style: [{
+                type: HostBinding,
+                args: ['style']
+            }] } });
+
+class ColorPipe {
+    transform(value) {
+        if (value[0] === 0 && value[1] === 0 && value[2] === 0 && value[3] === 0) {
+            return '';
+        }
+        return 'rgba(' + value[0] * 255 + ',' + value[1] * 255 + ',' + value[2] * 255 + ',' + value[3] + ')';
+    }
+}
+ColorPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+ColorPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: ColorPipe, name: "color" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'color'
+                }]
+        }] });
+
+class NodeComponent {
+    constructor(service) {
+        this.service = service;
+        this.editMode = false;
+        this.pasteMode = false;
+        this.readonly = false;
+    }
+}
+NodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NodeComponent, deps: [{ token: SectionService }], target: i0.ɵɵFactoryTarget.Component });
+NodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: NodeComponent, selector: "rs-node", inputs: { node: "node", editMode: "editMode", pasteMode: "pasteMode", readonly: "readonly" }, ngImport: i0, template: "<div class=\"table\" [style.align-items]=\"node.align\" *ngIf=\"node.type === 'table'\">\r\n  <table [style.margin-left]=\"node.style?.['margin-left'] | pt:service.scale\"\r\n         [style.width]=\"(node.style?.widthType === 'percent' ? node.style?.width + '%' : node.style?.width) | pt:service.scale\"\r\n         [style.border-top-width]=\"node.style?.['border-top-width'] | pt:service.scale\"\r\n         [style.border-top-color]=\"node.style?.['border-top-color'] | color\"\r\n         [style.border-right-width]=\"node.style?.['border-right-width'] | pt:service.scale\"\r\n         [style.border-right-color]=\"node.style?.['border-right-color'] | color\"\r\n         [style.border-bottom-width]=\"node.style?.['border-bottom-width'] | pt:service.scale\"\r\n         [style.border-bottom-color]=\"node.style?.['border-bottom-color'] | color\"\r\n         [style.border-left-width]=\"node.style?.['border-left-width'] | pt:service.scale\"\r\n         [style.border-left-color]=\"node.style?.['border-left-color'] | color\">\r\n    <tr *ngFor=\"let row of node.rows\" [style.height]=\"row.style.height  | pt:service.scale\">\r\n      <ng-container *ngFor=\"let cell of row.cells\">\r\n        <ng-container *ngIf=\"!cell.ignore\">\r\n          <td [rowSpan]=\"cell.rowSpan\" [colSpan]=\"cell.colSpan\"\r\n              [style.width]=\"cell.style.width | pt:service.scale\"\r\n              [style.padding-top]=\"cell.style?.['padding-top'] | pt:service.scale\"\r\n              [style.padding-right]=\"cell.style?.['padding-right'] | pt:service.scale\"\r\n              [style.padding-bottom]=\"cell.style?.['padding-bottom'] | pt:service.scale\"\r\n              [style.padding-left]=\"cell.style?.['padding-left'] | pt:service.scale\"\r\n              [style.vertical-align]=\"cell.style?.['vertical-align']\"\r\n              [style.background-color]=\"cell.style?.['background-color'] | color\"\r\n              [style.border-top-width]=\"cell.style?.['border-top-width'] | pt:service.scale\"\r\n              [style.border-top-color]=\"cell.style?.['border-top-color'] | color\"\r\n              [style.border-right-width]=\"cell.style?.['border-right-width'] | pt:service.scale\"\r\n              [style.border-right-color]=\"cell.style?.['border-right-color'] | color\"\r\n              [style.border-bottom-width]=\"cell.style?.['border-bottom-width'] | pt:service.scale\"\r\n              [style.border-bottom-color]=\"cell.style?.['border-bottom-color'] | color\"\r\n              [style.border-left-width]=\"cell.style?.['border-left-width'] | pt:service.scale\"\r\n              [style.border-left-color]=\"cell.style?.['border-left-color'] | color\">\r\n            <ng-container *ngFor=\"let node of cell.body\">\r\n              <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n            </ng-container>\r\n          </td>\r\n        </ng-container>\r\n      </ng-container>\r\n    </tr>\r\n  </table>\r\n</div>\r\n<ng-container *ngIf=\"node.type === 'paragraph'\">\r\n  <ng-container *ngIf=\"editMode\">\r\n    <rs-paragraph [paragraph]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\"></rs-paragraph>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!editMode\">\r\n    <rs-paragraph-for-input [paragraph]=\"node\" [editMode]=\"editMode\"\r\n                            [readonly]=\"readonly\"></rs-paragraph-for-input>\r\n  </ng-container>\r\n</ng-container>\r\n", styles: [":host .table{display:flex;flex-flow:column nowrap;justify-content:center}:host .table table{border-collapse:collapse}:host .table table td{border:1px solid #000000}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NodeComponent, selector: "rs-node", inputs: ["node", "editMode", "pasteMode", "readonly"] }, { kind: "component", type: ParagraphComponent, selector: "rs-paragraph", inputs: ["paragraph", "editMode", "pasteMode"] }, { kind: "component", type: ParagraphForInputComponent, selector: "rs-paragraph-for-input", inputs: ["paragraph", "editMode", "readonly"] }, { kind: "pipe", type: ColorPipe, name: "color" }, { kind: "pipe", type: PtPipe, name: "pt" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NodeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-node', template: "<div class=\"table\" [style.align-items]=\"node.align\" *ngIf=\"node.type === 'table'\">\r\n  <table [style.margin-left]=\"node.style?.['margin-left'] | pt:service.scale\"\r\n         [style.width]=\"(node.style?.widthType === 'percent' ? node.style?.width + '%' : node.style?.width) | pt:service.scale\"\r\n         [style.border-top-width]=\"node.style?.['border-top-width'] | pt:service.scale\"\r\n         [style.border-top-color]=\"node.style?.['border-top-color'] | color\"\r\n         [style.border-right-width]=\"node.style?.['border-right-width'] | pt:service.scale\"\r\n         [style.border-right-color]=\"node.style?.['border-right-color'] | color\"\r\n         [style.border-bottom-width]=\"node.style?.['border-bottom-width'] | pt:service.scale\"\r\n         [style.border-bottom-color]=\"node.style?.['border-bottom-color'] | color\"\r\n         [style.border-left-width]=\"node.style?.['border-left-width'] | pt:service.scale\"\r\n         [style.border-left-color]=\"node.style?.['border-left-color'] | color\">\r\n    <tr *ngFor=\"let row of node.rows\" [style.height]=\"row.style.height  | pt:service.scale\">\r\n      <ng-container *ngFor=\"let cell of row.cells\">\r\n        <ng-container *ngIf=\"!cell.ignore\">\r\n          <td [rowSpan]=\"cell.rowSpan\" [colSpan]=\"cell.colSpan\"\r\n              [style.width]=\"cell.style.width | pt:service.scale\"\r\n              [style.padding-top]=\"cell.style?.['padding-top'] | pt:service.scale\"\r\n              [style.padding-right]=\"cell.style?.['padding-right'] | pt:service.scale\"\r\n              [style.padding-bottom]=\"cell.style?.['padding-bottom'] | pt:service.scale\"\r\n              [style.padding-left]=\"cell.style?.['padding-left'] | pt:service.scale\"\r\n              [style.vertical-align]=\"cell.style?.['vertical-align']\"\r\n              [style.background-color]=\"cell.style?.['background-color'] | color\"\r\n              [style.border-top-width]=\"cell.style?.['border-top-width'] | pt:service.scale\"\r\n              [style.border-top-color]=\"cell.style?.['border-top-color'] | color\"\r\n              [style.border-right-width]=\"cell.style?.['border-right-width'] | pt:service.scale\"\r\n              [style.border-right-color]=\"cell.style?.['border-right-color'] | color\"\r\n              [style.border-bottom-width]=\"cell.style?.['border-bottom-width'] | pt:service.scale\"\r\n              [style.border-bottom-color]=\"cell.style?.['border-bottom-color'] | color\"\r\n              [style.border-left-width]=\"cell.style?.['border-left-width'] | pt:service.scale\"\r\n              [style.border-left-color]=\"cell.style?.['border-left-color'] | color\">\r\n            <ng-container *ngFor=\"let node of cell.body\">\r\n              <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n            </ng-container>\r\n          </td>\r\n        </ng-container>\r\n      </ng-container>\r\n    </tr>\r\n  </table>\r\n</div>\r\n<ng-container *ngIf=\"node.type === 'paragraph'\">\r\n  <ng-container *ngIf=\"editMode\">\r\n    <rs-paragraph [paragraph]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\"></rs-paragraph>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!editMode\">\r\n    <rs-paragraph-for-input [paragraph]=\"node\" [editMode]=\"editMode\"\r\n                            [readonly]=\"readonly\"></rs-paragraph-for-input>\r\n  </ng-container>\r\n</ng-container>\r\n", styles: [":host .table{display:flex;flex-flow:column nowrap;justify-content:center}:host .table table{border-collapse:collapse}:host .table table td{border:1px solid #000000}\n"] }]
+        }], ctorParameters: function () { return [{ type: SectionService }]; }, propDecorators: { node: [{
+                type: Input
+            }], editMode: [{
+                type: Input
+            }], pasteMode: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }] } });
+
+class SectionComponent {
+    get _style() {
+        return {
+            width: this.pt.transform(this.section.style['width'], this.service.scale),
+            paddingTop: this.pt.transform(this.section.style['padding-top'], this.service.scale),
+            paddingRight: this.pt.transform(this.section.style['padding-right'], this.service.scale),
+            paddingBottom: this.pt.transform(this.section.style['padding-bottom'], this.service.scale),
+            paddingLeft: this.pt.transform(this.section.style['padding-left'], this.service.scale),
+            userSelect: this.pasteMode ? 'none' : 'auto'
+        };
+    }
+    constructor(service, pt) {
+        this.service = service;
+        this.pt = pt;
+        this.editMode = false;
+        this.pasteMode = false;
+        this.readonly = false;
+    }
+}
+SectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionComponent, deps: [{ token: SectionService }, { token: PtPipe }], target: i0.ɵɵFactoryTarget.Component });
+SectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SectionComponent, selector: "rs-section", inputs: { section: "section", editMode: "editMode", pasteMode: "pasteMode", readonly: "readonly" }, host: { properties: { "style": "this._style" } }, providers: [PtPipe], ngImport: i0, template: "<div *ngIf=\"section.header\">\r\n  <ng-container *ngFor=\"let node of section.header\">\r\n    <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n  </ng-container>\r\n</div>\r\n<ng-container *ngFor=\"let node of section.body\">\r\n  <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n</ng-container>\r\n<div *ngIf=\"section.footer\">\r\n  <ng-container *ngFor=\"let node of section.footer\">\r\n    <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n  </ng-container>\r\n</div>\r\n", styles: [":host{display:block;background-color:#fff;margin-bottom:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NodeComponent, selector: "rs-node", inputs: ["node", "editMode", "pasteMode", "readonly"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-section', providers: [PtPipe], template: "<div *ngIf=\"section.header\">\r\n  <ng-container *ngFor=\"let node of section.header\">\r\n    <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n  </ng-container>\r\n</div>\r\n<ng-container *ngFor=\"let node of section.body\">\r\n  <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n</ng-container>\r\n<div *ngIf=\"section.footer\">\r\n  <ng-container *ngFor=\"let node of section.footer\">\r\n    <rs-node [node]=\"node\" [editMode]=\"editMode\" [pasteMode]=\"pasteMode\" [readonly]=\"readonly\"></rs-node>\r\n  </ng-container>\r\n</div>\r\n", styles: [":host{display:block;background-color:#fff;margin-bottom:8px}\n"] }]
+        }], ctorParameters: function () { return [{ type: SectionService }, { type: PtPipe }]; }, propDecorators: { section: [{
+                type: Input
+            }], editMode: [{
+                type: Input
+            }], pasteMode: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], _style: [{
+                type: HostBinding,
+                args: ['style']
+            }] } });
+
+class SectionModule {
+}
+SectionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SectionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: SectionModule, declarations: [SectionComponent,
+        NodeComponent,
+        ParagraphComponent,
+        RunComponent,
+        ParagraphForInputComponent,
+        ItemComponent,
+        ColorPipe,
+        MarkPipe,
+        PtPipe], imports: [CommonModule], exports: [SectionComponent,
+        NodeComponent] });
+SectionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SectionModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SectionComponent,
+                        NodeComponent,
+                        ParagraphComponent,
+                        RunComponent,
+                        ParagraphForInputComponent,
+                        ItemComponent,
+                        ColorPipe,
+                        MarkPipe,
+                        PtPipe
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        SectionComponent,
+                        NodeComponent
+                    ]
+                }]
+        }] });
+
+class WordDesignerService {
+    constructor(http) {
+        this.http = http;
+    }
+    loadTemplate(tenant, className, oid) {
+        return this.http.get('api/data/' + className + '/' + oid, {
+            params: {
+                tenant
+            }
+        }).pipe(map(response => {
+            if (response.data?.templateConfig) {
+                return JSON.parse(response.data.templateConfig);
+            }
+            return {};
+        }));
+    }
+    uploadTemplateFile(tenant, className, oid, retainMarkConfig, file) {
+        const formData = new FormData();
+        formData.append('file', file);
+        return this.http.post('api/data/custom/upload', formData, {
+            params: {
+                executor: 'com.cs.system.word.designer.UploadTemplateFile',
+                tenant,
+                className,
+                oid,
+                retainMarkConfig,
+                filename: file.name
+            }
+        }).pipe(map(response => {
+            return response.data || {};
+        }));
+    }
+    downloadTemplateFile(tenant, className, oid, callback) {
+        return this.http.get('api/data/custom/download', {
+            params: {
+                executor: 'com.cs.system.word.designer.DownloadTemplate',
+                tenant,
+                className,
+                oid
+            },
+            observe: 'response',
+            responseType: 'blob'
+        }).subscribe(response => {
+            const disposition = response.headers.get('Content-Disposition');
+            const filename = disposition && filenameFromDisposition(disposition);
+            if (response.body) {
+                downloadFile(response.body, filename || '未命名文件', callback);
+            }
+        });
+    }
+    save(tenant, className, oid, model) {
+        return this.http.post('api/data/' + className + '/' + oid, model, {
+            params: {
+                tenant
+            }
+        });
+    }
+}
+WordDesignerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerService, deps: [{ token: i1$1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+WordDesignerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$1.HttpClient }]; } });
+
+class MarkConfigComponent {
+    constructor() {
+        this.changeMark = false;
+    }
+    get mark() {
+        return this._mark;
+    }
+    set mark(mark) {
+        if (!mark) {
+            return;
+        }
+        this._mark = mark;
+        this.changeMark = true;
+        this.loadMarkConfig();
+    }
+    ngOnInit() {
+        this.markTypes = MarkItemFactory.getMarkItems(...this.filterCategories || '');
+    }
+    loadMarkConfig() {
+        setTimeout(() => {
+            this.markItemConfigRef.clear();
+            let config = MarkItemFactory.getConfig(this.mark.type);
+            if (!config) {
+                return;
+            }
+            const componentRef = this.markItemConfigRef.createComponent(config.component);
+            const instance = componentRef.instance;
+            instance.tenant = this.tenant;
+            instance.templateClassName = this.templateClassName;
+            instance.templateOid = this.templateOid;
+            instance.instanceClassName = this.instanceClassName;
+            instance.mark = this.mark;
+            instance.marks = this.marks;
+        });
+    }
+    changeMarkType() {
+        if (this.changeMark) {
+            this.changeMark = false;
+        }
+        else {
+            this.mark.pickerCode = null;
+            this.mark.generatorCode = null;
+        }
+        this.loadMarkConfig();
+    }
+}
+MarkConfigComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MarkConfigComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MarkConfigComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MarkConfigComponent, selector: "rs-mark-config", inputs: { tenant: "tenant", templateClassName: "templateClassName", templateOid: "templateOid", instanceClassName: "instanceClassName", filterCategories: "filterCategories", mark: "mark", marks: "marks" }, viewQueries: [{ propertyName: "markItemConfigRef", first: true, predicate: ["markItemConfigRef"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>\u4E66\u7B7E\u6807\u8BC6</span>\n    <span class=\"required-mark\">&nbsp;*</span>\n  </div>\n  <div class=\"dx-field-value\">\n    <dx-text-box [(value)]=\"mark.name\" [readOnly]=\"true\">\n      <dx-validator>\n        <dxi-validation-rule type=\"required\" message=\"\u503C\u4E0D\u80FD\u4E3A\u7A7A\"></dxi-validation-rule>\n      </dx-validator>\n    </dx-text-box>\n  </div>\n</div>\n<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>\u4E66\u7B7E\u540D\u79F0</span>\n  </div>\n  <div class=\"dx-field-value\">\n    <dx-text-box [(value)]=\"mark.display\"></dx-text-box>\n  </div>\n</div>\n<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>\u7EC4\u4EF6\u7C7B\u578B</span>\n    <span class=\"required-mark\">&nbsp;*</span>\n  </div>\n  <div class=\"dx-field-value\">\n    <dx-select-box [dataSource]=\"markTypes\"\n                   valueExpr=\"name\"\n                   displayExpr=\"caption\"\n                   [(value)]=\"mark.type\"\n                   (onSelectionChanged)=\"changeMarkType()\">\n      <dx-validator>\n        <dxi-validation-rule type=\"required\" message=\"\u503C\u4E0D\u80FD\u4E3A\u7A7A\"></dxi-validation-rule>\n      </dx-validator>\n    </dx-select-box>\n  </div>\n</div>\n<ng-container #markItemConfigRef></ng-container>\n", styles: [":host .dx-field{margin-bottom:8px;display:flex;flex-flow:row nowrap}:host .dx-field .dx-field-label{flex:0 0 80px}:host .dx-field .dx-field-value{flex:1}\n"], dependencies: [{ kind: "component", type: i6.DxiValidationRuleComponent, selector: "dxi-validation-rule", inputs: ["message", "trim", "type", "ignoreEmptyValue", "max", "min", "reevaluate", "validationCallback", "comparisonTarget", "comparisonType", "pattern"] }, { kind: "component", type: i2$4.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "customItemCreateEvent", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "customItemCreateEventChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "component", type: i7.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "component", type: i8.DxValidatorComponent, selector: "dx-validator", inputs: ["adapter", "elementAttr", "height", "name", "validationGroup", "validationRules", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onValidated", "adapterChange", "elementAttrChange", "heightChange", "nameChange", "validationGroupChange", "validationRulesChange", "widthChange"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MarkConfigComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-mark-config', template: "<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>\u4E66\u7B7E\u6807\u8BC6</span>\n    <span class=\"required-mark\">&nbsp;*</span>\n  </div>\n  <div class=\"dx-field-value\">\n    <dx-text-box [(value)]=\"mark.name\" [readOnly]=\"true\">\n      <dx-validator>\n        <dxi-validation-rule type=\"required\" message=\"\u503C\u4E0D\u80FD\u4E3A\u7A7A\"></dxi-validation-rule>\n      </dx-validator>\n    </dx-text-box>\n  </div>\n</div>\n<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>\u4E66\u7B7E\u540D\u79F0</span>\n  </div>\n  <div class=\"dx-field-value\">\n    <dx-text-box [(value)]=\"mark.display\"></dx-text-box>\n  </div>\n</div>\n<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>\u7EC4\u4EF6\u7C7B\u578B</span>\n    <span class=\"required-mark\">&nbsp;*</span>\n  </div>\n  <div class=\"dx-field-value\">\n    <dx-select-box [dataSource]=\"markTypes\"\n                   valueExpr=\"name\"\n                   displayExpr=\"caption\"\n                   [(value)]=\"mark.type\"\n                   (onSelectionChanged)=\"changeMarkType()\">\n      <dx-validator>\n        <dxi-validation-rule type=\"required\" message=\"\u503C\u4E0D\u80FD\u4E3A\u7A7A\"></dxi-validation-rule>\n      </dx-validator>\n    </dx-select-box>\n  </div>\n</div>\n<ng-container #markItemConfigRef></ng-container>\n", styles: [":host .dx-field{margin-bottom:8px;display:flex;flex-flow:row nowrap}:host .dx-field .dx-field-label{flex:0 0 80px}:host .dx-field .dx-field-value{flex:1}\n"] }]
+        }], propDecorators: { tenant: [{
+                type: Input
+            }], templateClassName: [{
+                type: Input
+            }], templateOid: [{
+                type: Input
+            }], instanceClassName: [{
+                type: Input
+            }], filterCategories: [{
+                type: Input
+            }], mark: [{
+                type: Input
+            }], marks: [{
+                type: Input
+            }], markItemConfigRef: [{
+                type: ViewChild,
+                args: ['markItemConfigRef', { static: true, read: ViewContainerRef }]
+            }] } });
+
+class WordDesignerComponent {
+    handleKeyDown($event) {
+        switch ($event.code) {
+            case 'ArrowUp':
+                if ($event.altKey) {
+                    this.service.switchMark(-1);
+                }
+                break;
+            case 'ArrowDown':
+                if ($event.altKey) {
+                    this.service.switchMark(1);
+                }
+                break;
+            case 'KeyC':
+                if ($event.ctrlKey) {
+                    const selection = window.getSelection();
+                    if (selection?.toString()) {
+                        return;
+                    }
+                    this.copyMarkConfig();
+                }
+                break;
+            case 'KeyV':
+                if ($event.ctrlKey) {
+                    this.pasteMarkConfig();
+                }
+                break;
+            case 'Escape':
+                this.exitPasteMode();
+                break;
+        }
+        if (this.mouseInViewer && $event.ctrlKey && $event.key === '0') {
+            $event.preventDefault();
+            this.scale(0);
+        }
+    }
+    constructor(service, wordDesignerService, viewContainerRef, modalService) {
+        this.service = service;
+        this.wordDesignerService = wordDesignerService;
+        this.viewContainerRef = viewContainerRef;
+        this.modalService = modalService;
+        this.needUpload = false;
+        this.pasteMode = false;
+        this.mouseInViewer = false;
+        this.loading = false;
+        this.retainMarkConfig = false;
+    }
+    ngOnInit() {
+        this.service.tenant = this.tenant;
+        this.service.templateClassName = this.className;
+        this.service.templateOid = this.oid;
+        this.service.instanceClassName = this.instanceClassName;
+        this.service.params = this.params;
+        this.service.tabViewContainerRef = this.tabViewContainerRef;
+        this.loading = true;
+        this.wordDesignerService.loadTemplate(this.tenant, this.className, this.oid).subscribe(response => {
+            this.loadTemplateAndConfig(response);
+            this.loading = false;
+        });
+    }
+    loadTemplateAndConfig(response) {
+        this.sections = response.sections || [];
+        if (this.sections.length === 0) {
+            this.needUpload = true;
+            this.loading = false;
+            return;
+        }
+        this.needUpload = false;
+        this.service.marks = response.marks.map((mark) => {
+            mark.config = mark.config || {};
+            return mark;
+        });
+        if (this.service.marks.length > 0) {
+            this.service.activeMark = this.service.marks[0];
+        }
+    }
+    scaleByMouse($event) {
+        if ($event.ctrlKey) {
+            $event.preventDefault();
+            this.scale($event.deltaY < 0 ? 0.1 : -0.1);
+        }
+    }
+    scale(type) {
+        if (type === 0) {
+            this.service.scale = 1;
+        }
+        else {
+            this.service.scale += type;
+        }
+    }
+    upload() {
+        this.loading = true;
+        this.wordDesignerService.uploadTemplateFile(this.tenant, this.className, this.oid, this.retainMarkConfig, this.uploadInput.nativeElement.files[0]).subscribe(response => {
+            this.uploadInput.nativeElement.value = '';
+            this.loadTemplateAndConfig(response);
+            this.loading = false;
+        });
+    }
+    openReplaceTemplateFileModal() {
+        this.replaceFileModal = this.modalService.open(this.tabViewContainerRef, '替换文件', 'default', this.replaceFileModalTemplate, {});
+    }
+    replaceTemplateFile(retainMarkConfig) {
+        this.retainMarkConfig = retainMarkConfig;
+        this.uploadInput.nativeElement.click();
+        this.replaceFileModal?.hide();
+    }
+    downloadTemplateFile() {
+        this.loading = true;
+        this.wordDesignerService.downloadTemplateFile(this.tenant, this.className, this.oid, () => {
+            this.loading = false;
+        });
+    }
+    preview() {
+        for (let mark of this.service.marks) {
+            mark.value = undefined;
+        }
+        this.previewModal = this.modalService.open(this.tabViewContainerRef, '预览', 'full', this.previewTemplate, {}, this.previewFooterTemplate);
+    }
+    saveConfig() {
+        this.loading = true;
+        this.service.marks.map(mark => {
+            delete mark.value;
+        });
+        this.wordDesignerService.save(this.tenant, this.className, this.oid, {
+            templateConfig: JSON.stringify({
+                sections: this.sections,
+                marks: this.service.marks
+            })
+        }).subscribe(response => {
+            if (response.success) {
+                notifySuccess('保存成功');
+                this.loading = false;
+            }
+        });
+    }
+    copyMarkConfig() {
+        this.service.copiedMark = deepClone(this.service.activeMark);
+        this.pasteMode = true;
+    }
+    exitPasteMode() {
+        this.service.copiedMark = {};
+        this.service.readyPasteMarkNames = [];
+        this.service.lastClickToPasteMarkName = '';
+        this.pasteMode = false;
+    }
+    pasteMarkConfig() {
+        let readyPasteMark;
+        for (let readyPasteMarkName of this.service.readyPasteMarkNames) {
+            readyPasteMark = this.service.getMark(readyPasteMarkName);
+            const display = readyPasteMark.display;
+            Object.assign(readyPasteMark, deepClone(this.service.copiedMark));
+            readyPasteMark.name = readyPasteMarkName;
+            readyPasteMark.display = display;
+        }
+        this.service.activeMark = readyPasteMark || this.service.activeMark;
+        this.exitPasteMode();
+    }
+}
+WordDesignerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerComponent, deps: [{ token: SectionService }, { token: WordDesignerService }, { token: i0.ViewContainerRef }, { token: ModalService }], target: i0.ɵɵFactoryTarget.Component });
+WordDesignerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WordDesignerComponent, selector: "rs-word-designer", inputs: { tenant: "tenant", className: "className", oid: "oid", instanceClassName: "instanceClassName", filterCategories: "filterCategories", params: "params", tabViewContainerRef: "tabViewContainerRef" }, host: { listeners: { "window:keydown": "handleKeyDown($event)" } }, providers: [WordDesignerService], viewQueries: [{ propertyName: "uploadInput", first: true, predicate: ["uploadInput"], descendants: true, static: true }, { propertyName: "replaceFileModalTemplate", first: true, predicate: ["replaceFileModalTemplate"], descendants: true, static: true }, { propertyName: "previewTemplate", first: true, predicate: ["previewTemplate"], descendants: true, static: true }, { propertyName: "previewFooterTemplate", first: true, predicate: ["previewFooterTemplate"], descendants: true, static: true }], ngImport: i0, template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\" [visible]=\"loading\">\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\n</dx-load-panel>\n<input #uploadInput type=\"file\" name=\"file\"\n       accept=\"application/vnd.openxmlformats-officedocument.wordprocessingml.document\" (change)=\"upload()\"\n       style=\"display: none;\"/>\n<div class=\"coast-card\">\n  <div class=\"coast-card-content\">\n    <div class=\"content-main\" [class.show-upload-btn]=\"needUpload\">\n      <ng-container *ngIf=\"needUpload\">\n        <dx-button type=\"success\" text=\"\u4E0A\u4F20\u6587\u4EF6\" (onClick)=\"uploadInput.click()\"></dx-button>\n      </ng-container>\n      <div *ngIf=\"!needUpload\" class=\"left-panel\">\n        <div *ngIf=\"pasteMode\" class=\"paste-mode-bar\">\n          <span\n            class=\"message\">\u5DF2\u8FDB\u5165\u6279\u91CF\u7C98\u8D34\u914D\u7F6E\u6A21\u5F0F\uFF0C\u652F\u6301Ctrl\u3001Shift\u952E\u5FEB\u6377\u9009\u62E9\uFF0C\u6309Ctrl+V\u7EC4\u5408\u952E\u7C98\u8D34\u914D\u7F6E\uFF0C\u6309Esc\u952E\u53D6\u6D88\u64CD\u4F5C\u5E76\u9000\u51FA\u8BE5\u6A21\u5F0F</span>\n          <dx-button [width]=\"48\" text=\"\u9000\u51FA\" (onClick)=\"exitPasteMode()\"></dx-button>\n        </div>\n        <div class=\"content\"\n             (mouseenter)=\"mouseInViewer = true;\"\n             (mouseleave)=\"mouseInViewer = false;\"\n             (mousewheel)=\"scaleByMouse($event)\">\n          <div *ngIf=\"!needUpload\" class=\"viewer\">\n            <ng-container *ngFor=\"let section of sections\">\n              <rs-section [section]=\"section\" [editMode]=\"true\" [pasteMode]=\"pasteMode\"></rs-section>\n            </ng-container>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"!needUpload\" class=\"right-panel\">\n        <div class=\"header\">\n          <dx-button type=\"default\" text=\"\u66FF\u6362\u6587\u4EF6\" (onClick)=\"openReplaceTemplateFileModal()\"\n                     [disabled]=\"loading\"></dx-button>\n          <dx-button icon=\"coast-icon coast-icon-download\" hint=\"\u4E0B\u8F7D\u6587\u4EF6\"\n                     (onClick)=\"downloadTemplateFile()\" [disabled]=\"loading\"></dx-button>\n          <dx-button icon=\"coast-icon coast-icon-direction-up\" hint=\"\u4E0A\u4E00\u4E2A(Alt + \u2191)\"\n                     (onClick)=\"service.switchMark(-1)\" [disabled]=\"loading\"></dx-button>\n          <dx-button icon=\"coast-icon coast-icon-direction-down\" hint=\"\u4E0B\u4E00\u4E2A(Alt + \u2193)\"\n                     (onClick)=\"service.switchMark(1)\" [disabled]=\"loading\"></dx-button>\n          <dx-button [type]=\"pasteMode ? 'success' : 'default'\" text=\"\u590D\u5236\" hint=\"\u590D\u5236(Ctrl + c)\"\n                     (onClick)=\"copyMarkConfig()\"></dx-button>\n          <dx-button type=\"danger\" text=\"\u7C98\u8D34\" hint=\"\u7C98\u8D34(Ctrl + v)\" (onClick)=\"pasteMarkConfig()\"\n                     [disabled]=\"loading || !pasteMode\"></dx-button>\n        </div>\n        <div class=\"config\" *ngIf=\"service.activeMark\">\n          <rs-mark-config [tenant]=\"tenant\"\n                          [templateClassName]=\"className\"\n                          [templateOid]=\"oid\"\n                          [instanceClassName]=\"instanceClassName\"\n                          [filterCategories]=\"filterCategories\"\n                          [mark]=\"service.activeMark\"\n                          [marks]=\"service.marks\"></rs-mark-config>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"!needUpload\" class=\"footer\">\n    <div class=\"left\">\n      <dx-button text=\"\u653E\u5927\" (onClick)=\"scale(0.1)\"></dx-button>\n      <dx-button text=\"\u8FD8\u539F\" (onClick)=\"scale(0)\"></dx-button>\n      <dx-button text=\"\u7F29\u5C0F\" (onClick)=\"scale(-0.1)\"></dx-button>\n    </div>\n    <div class=\"right\">\n      <dx-button type=\"default\" text=\"\u9884\u89C8\" (onClick)=\"preview()\" [disabled]=\"needUpload || loading\"></dx-button>\n      <dx-button type=\"success\" text=\"\u4FDD\u5B58\" (onClick)=\"saveConfig()\" [disabled]=\"needUpload || loading\"></dx-button>\n    </div>\n  </div>\n</div>\n<ng-template #replaceFileModalTemplate>\n  <div class=\"confirm-message\">\n    <span>\u66FF\u6362\u6587\u4EF6\u53EF\u4EE5\u6309\u7167\u4E66\u7B7E\u6807\u8BC6\u7EE7\u627F\u5DF2\u4FDD\u5B58\u7684\u4E66\u7B7E\u914D\u7F6E\uFF0C\u8BF7\u9009\u62E9\u64CD\u4F5C\uFF1A</span>\n  </div>\n  <div class=\"form-buttons\">\n    <div class=\"buttons-wrapper\">\n      <dx-button type=\"default\" text=\"\u7EE7\u627F\u914D\u7F6E\" (onClick)=\"replaceTemplateFile(true)\"></dx-button>\n      <dx-button type=\"danger\" text=\"\u6E05\u9664\u914D\u7F6E\" (onClick)=\"replaceTemplateFile(false)\"></dx-button>\n      <dx-button type=\"normal\" text=\"\u53D6\u6D88\" (onClick)=\"replaceFileModal?.hide()\"></dx-button>\n    </div>\n  </div>\n</ng-template>\n<ng-template #previewTemplate>\n  <div class=\"preview-viewer\">\n    <div class=\"viewer-container\">\n      <div class=\"viewer\">\n        <ng-container *ngFor=\"let section of sections\">\n          <rs-section [section]=\"section\"></rs-section>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</ng-template>\n<ng-template #previewFooterTemplate>\n  <div class=\"form-buttons\">\n    <div class=\"buttons-wrapper\">\n      <dx-button type=\"normal\" text=\"\u5173\u95ED\" (onClick)=\"previewModal?.hide()\"></dx-button>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap}:host .coast-card{flex:1;padding:0}:host .coast-card .content-main{display:flex;flex-flow:row nowrap;padding:16px 0 0 16px;margin:0}:host .coast-card .content-main.show-upload-btn{padding:16px;background-color:var(--coast-empty-color, rgb(229, 229, 229));align-items:center;justify-content:center}:host .coast-card .content-main .left-panel{flex:auto;width:0;overflow-x:auto;background-color:var(--coast-empty-color, rgb(229, 229, 229));display:flex;flex-flow:column nowrap}:host .coast-card .content-main .left-panel .paste-mode-bar{flex:none;padding:8px;background-color:var(--coast-base-bg-color, rgb(255, 255, 255));border:1px solid var(--coast-border-color, rgb(221, 221, 221));display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center}:host .coast-card .content-main .left-panel .paste-mode-bar .message{font-weight:700}:host .coast-card .content-main .left-panel .content{flex:auto;height:0;overflow-y:auto;padding:8px 16px 0;display:flex;flex-flow:row nowrap}:host .coast-card .content-main .left-panel .content .viewer{margin:auto;display:flex;flex-flow:column nowrap;align-items:center;z-index:0}:host .coast-card .content-main .right-panel{flex:0 0 320px;display:flex;flex-flow:column nowrap;border-left:1px solid var(--coast-border-color, rgb(221, 221, 221))}:host .coast-card .content-main .right-panel .header{flex:none;border-bottom:1px solid var(--coast-border-color, rgb(221, 221, 221));padding:0 16px 16px}:host .coast-card .content-main .right-panel .header>dx-button:not(:last-child){margin-right:8px}:host .coast-card .content-main .right-panel .config{flex:auto;height:0;overflow:auto;padding:24px;display:flex;flex-flow:column nowrap}:host .coast-card .footer{flex:none;border-top:1px solid var(--coast-border-color, rgb(221, 221, 221));padding:12px 24px;display:flex;flex-flow:row nowrap;justify-content:space-between}:host .coast-card .footer dx-button{width:80px}:host .coast-card .footer dx-button:not(:last-child){margin-right:8px}.confirm-message{padding:24px;margin-bottom:12px;border-bottom:1px solid var(--coast-border-color, rgb(221, 221, 221))}.confirm-message span{font-size:14px}.preview-viewer{flex:auto;height:0;overflow-y:auto;margin:0 16px;background-color:var(--coast-empty-color, rgb(229, 229, 229));display:flex;flex-flow:column nowrap}.preview-viewer .viewer-container{flex:auto;height:0;overflow-x:auto;padding:8px 16px 0;display:flex;flex-flow:row nowrap}.preview-viewer .viewer-container .viewer{margin:auto;display:flex;flex-flow:column nowrap;align-items:center;z-index:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DxoPositionComponent, selector: "dxo-position", inputs: ["at", "boundary", "boundaryOffset", "collision", "my", "of", "offset"] }, { kind: "component", type: i3.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i6$1.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "copyRootClassesToWrapper", "deferRendering", "delay", "elementAttr", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "delayChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: SectionComponent, selector: "rs-section", inputs: ["section", "editMode", "pasteMode", "readonly"] }, { kind: "component", type: MarkConfigComponent, selector: "rs-mark-config", inputs: ["tenant", "templateClassName", "templateOid", "instanceClassName", "filterCategories", "mark", "marks"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-word-designer', providers: [WordDesignerService], template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\" [visible]=\"loading\">\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\n</dx-load-panel>\n<input #uploadInput type=\"file\" name=\"file\"\n       accept=\"application/vnd.openxmlformats-officedocument.wordprocessingml.document\" (change)=\"upload()\"\n       style=\"display: none;\"/>\n<div class=\"coast-card\">\n  <div class=\"coast-card-content\">\n    <div class=\"content-main\" [class.show-upload-btn]=\"needUpload\">\n      <ng-container *ngIf=\"needUpload\">\n        <dx-button type=\"success\" text=\"\u4E0A\u4F20\u6587\u4EF6\" (onClick)=\"uploadInput.click()\"></dx-button>\n      </ng-container>\n      <div *ngIf=\"!needUpload\" class=\"left-panel\">\n        <div *ngIf=\"pasteMode\" class=\"paste-mode-bar\">\n          <span\n            class=\"message\">\u5DF2\u8FDB\u5165\u6279\u91CF\u7C98\u8D34\u914D\u7F6E\u6A21\u5F0F\uFF0C\u652F\u6301Ctrl\u3001Shift\u952E\u5FEB\u6377\u9009\u62E9\uFF0C\u6309Ctrl+V\u7EC4\u5408\u952E\u7C98\u8D34\u914D\u7F6E\uFF0C\u6309Esc\u952E\u53D6\u6D88\u64CD\u4F5C\u5E76\u9000\u51FA\u8BE5\u6A21\u5F0F</span>\n          <dx-button [width]=\"48\" text=\"\u9000\u51FA\" (onClick)=\"exitPasteMode()\"></dx-button>\n        </div>\n        <div class=\"content\"\n             (mouseenter)=\"mouseInViewer = true;\"\n             (mouseleave)=\"mouseInViewer = false;\"\n             (mousewheel)=\"scaleByMouse($event)\">\n          <div *ngIf=\"!needUpload\" class=\"viewer\">\n            <ng-container *ngFor=\"let section of sections\">\n              <rs-section [section]=\"section\" [editMode]=\"true\" [pasteMode]=\"pasteMode\"></rs-section>\n            </ng-container>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"!needUpload\" class=\"right-panel\">\n        <div class=\"header\">\n          <dx-button type=\"default\" text=\"\u66FF\u6362\u6587\u4EF6\" (onClick)=\"openReplaceTemplateFileModal()\"\n                     [disabled]=\"loading\"></dx-button>\n          <dx-button icon=\"coast-icon coast-icon-download\" hint=\"\u4E0B\u8F7D\u6587\u4EF6\"\n                     (onClick)=\"downloadTemplateFile()\" [disabled]=\"loading\"></dx-button>\n          <dx-button icon=\"coast-icon coast-icon-direction-up\" hint=\"\u4E0A\u4E00\u4E2A(Alt + \u2191)\"\n                     (onClick)=\"service.switchMark(-1)\" [disabled]=\"loading\"></dx-button>\n          <dx-button icon=\"coast-icon coast-icon-direction-down\" hint=\"\u4E0B\u4E00\u4E2A(Alt + \u2193)\"\n                     (onClick)=\"service.switchMark(1)\" [disabled]=\"loading\"></dx-button>\n          <dx-button [type]=\"pasteMode ? 'success' : 'default'\" text=\"\u590D\u5236\" hint=\"\u590D\u5236(Ctrl + c)\"\n                     (onClick)=\"copyMarkConfig()\"></dx-button>\n          <dx-button type=\"danger\" text=\"\u7C98\u8D34\" hint=\"\u7C98\u8D34(Ctrl + v)\" (onClick)=\"pasteMarkConfig()\"\n                     [disabled]=\"loading || !pasteMode\"></dx-button>\n        </div>\n        <div class=\"config\" *ngIf=\"service.activeMark\">\n          <rs-mark-config [tenant]=\"tenant\"\n                          [templateClassName]=\"className\"\n                          [templateOid]=\"oid\"\n                          [instanceClassName]=\"instanceClassName\"\n                          [filterCategories]=\"filterCategories\"\n                          [mark]=\"service.activeMark\"\n                          [marks]=\"service.marks\"></rs-mark-config>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"!needUpload\" class=\"footer\">\n    <div class=\"left\">\n      <dx-button text=\"\u653E\u5927\" (onClick)=\"scale(0.1)\"></dx-button>\n      <dx-button text=\"\u8FD8\u539F\" (onClick)=\"scale(0)\"></dx-button>\n      <dx-button text=\"\u7F29\u5C0F\" (onClick)=\"scale(-0.1)\"></dx-button>\n    </div>\n    <div class=\"right\">\n      <dx-button type=\"default\" text=\"\u9884\u89C8\" (onClick)=\"preview()\" [disabled]=\"needUpload || loading\"></dx-button>\n      <dx-button type=\"success\" text=\"\u4FDD\u5B58\" (onClick)=\"saveConfig()\" [disabled]=\"needUpload || loading\"></dx-button>\n    </div>\n  </div>\n</div>\n<ng-template #replaceFileModalTemplate>\n  <div class=\"confirm-message\">\n    <span>\u66FF\u6362\u6587\u4EF6\u53EF\u4EE5\u6309\u7167\u4E66\u7B7E\u6807\u8BC6\u7EE7\u627F\u5DF2\u4FDD\u5B58\u7684\u4E66\u7B7E\u914D\u7F6E\uFF0C\u8BF7\u9009\u62E9\u64CD\u4F5C\uFF1A</span>\n  </div>\n  <div class=\"form-buttons\">\n    <div class=\"buttons-wrapper\">\n      <dx-button type=\"default\" text=\"\u7EE7\u627F\u914D\u7F6E\" (onClick)=\"replaceTemplateFile(true)\"></dx-button>\n      <dx-button type=\"danger\" text=\"\u6E05\u9664\u914D\u7F6E\" (onClick)=\"replaceTemplateFile(false)\"></dx-button>\n      <dx-button type=\"normal\" text=\"\u53D6\u6D88\" (onClick)=\"replaceFileModal?.hide()\"></dx-button>\n    </div>\n  </div>\n</ng-template>\n<ng-template #previewTemplate>\n  <div class=\"preview-viewer\">\n    <div class=\"viewer-container\">\n      <div class=\"viewer\">\n        <ng-container *ngFor=\"let section of sections\">\n          <rs-section [section]=\"section\"></rs-section>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</ng-template>\n<ng-template #previewFooterTemplate>\n  <div class=\"form-buttons\">\n    <div class=\"buttons-wrapper\">\n      <dx-button type=\"normal\" text=\"\u5173\u95ED\" (onClick)=\"previewModal?.hide()\"></dx-button>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap}:host .coast-card{flex:1;padding:0}:host .coast-card .content-main{display:flex;flex-flow:row nowrap;padding:16px 0 0 16px;margin:0}:host .coast-card .content-main.show-upload-btn{padding:16px;background-color:var(--coast-empty-color, rgb(229, 229, 229));align-items:center;justify-content:center}:host .coast-card .content-main .left-panel{flex:auto;width:0;overflow-x:auto;background-color:var(--coast-empty-color, rgb(229, 229, 229));display:flex;flex-flow:column nowrap}:host .coast-card .content-main .left-panel .paste-mode-bar{flex:none;padding:8px;background-color:var(--coast-base-bg-color, rgb(255, 255, 255));border:1px solid var(--coast-border-color, rgb(221, 221, 221));display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center}:host .coast-card .content-main .left-panel .paste-mode-bar .message{font-weight:700}:host .coast-card .content-main .left-panel .content{flex:auto;height:0;overflow-y:auto;padding:8px 16px 0;display:flex;flex-flow:row nowrap}:host .coast-card .content-main .left-panel .content .viewer{margin:auto;display:flex;flex-flow:column nowrap;align-items:center;z-index:0}:host .coast-card .content-main .right-panel{flex:0 0 320px;display:flex;flex-flow:column nowrap;border-left:1px solid var(--coast-border-color, rgb(221, 221, 221))}:host .coast-card .content-main .right-panel .header{flex:none;border-bottom:1px solid var(--coast-border-color, rgb(221, 221, 221));padding:0 16px 16px}:host .coast-card .content-main .right-panel .header>dx-button:not(:last-child){margin-right:8px}:host .coast-card .content-main .right-panel .config{flex:auto;height:0;overflow:auto;padding:24px;display:flex;flex-flow:column nowrap}:host .coast-card .footer{flex:none;border-top:1px solid var(--coast-border-color, rgb(221, 221, 221));padding:12px 24px;display:flex;flex-flow:row nowrap;justify-content:space-between}:host .coast-card .footer dx-button{width:80px}:host .coast-card .footer dx-button:not(:last-child){margin-right:8px}.confirm-message{padding:24px;margin-bottom:12px;border-bottom:1px solid var(--coast-border-color, rgb(221, 221, 221))}.confirm-message span{font-size:14px}.preview-viewer{flex:auto;height:0;overflow-y:auto;margin:0 16px;background-color:var(--coast-empty-color, rgb(229, 229, 229));display:flex;flex-flow:column nowrap}.preview-viewer .viewer-container{flex:auto;height:0;overflow-x:auto;padding:8px 16px 0;display:flex;flex-flow:row nowrap}.preview-viewer .viewer-container .viewer{margin:auto;display:flex;flex-flow:column nowrap;align-items:center;z-index:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: SectionService }, { type: WordDesignerService }, { type: i0.ViewContainerRef }, { type: ModalService }]; }, propDecorators: { tenant: [{
+                type: Input
+            }], className: [{
+                type: Input
+            }], oid: [{
+                type: Input
+            }], instanceClassName: [{
+                type: Input
+            }], filterCategories: [{
+                type: Input
+            }], params: [{
+                type: Input
+            }], tabViewContainerRef: [{
+                type: Input
+            }], uploadInput: [{
+                type: ViewChild,
+                args: ['uploadInput', { static: true }]
+            }], replaceFileModalTemplate: [{
+                type: ViewChild,
+                args: ['replaceFileModalTemplate', { static: true }]
+            }], previewTemplate: [{
+                type: ViewChild,
+                args: ['previewTemplate', { static: true }]
+            }], previewFooterTemplate: [{
+                type: ViewChild,
+                args: ['previewFooterTemplate', { static: true }]
+            }], handleKeyDown: [{
+                type: HostListener,
+                args: ['window:keydown', ['$event']]
+            }] } });
+
+class WordDesignerModule {
+}
+WordDesignerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+WordDesignerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerModule, declarations: [WordDesignerComponent,
+        MarkConfigComponent], imports: [CommonModule,
+        DevExtremeModule,
+        SectionModule], exports: [WordDesignerComponent] });
+WordDesignerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerModule, imports: [CommonModule,
+        DevExtremeModule,
+        SectionModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordDesignerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        WordDesignerComponent,
+                        MarkConfigComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        DevExtremeModule,
+                        SectionModule
+                    ],
+                    exports: [
+                        WordDesignerComponent
+                    ]
+                }]
+        }] });
+
+class WordEditorService {
+    constructor(http) {
+        this.http = http;
+    }
+    loadTemplate(tenant, className, oid) {
+        return this.http.get('api/data/' + className + '/' + oid, {
+            params: {
+                tenant
+            }
+        }).pipe(map(response => {
+            if (response.data?.templateConfig) {
+                return JSON.parse(response.data.templateConfig);
+            }
+            return {};
+        }));
+    }
+    save(tenant, className, oid, model) {
+        return this.http.post('api/data/' + className + '/' + oid, model, {
+            params: {
+                tenant
+            }
+        });
+    }
+    reloadTemplate(tenant, className, oid, templateClassName) {
+        return this.http.get('api/data/custom', {
+            params: {
+                executor: 'com.cs.system.word.editor.ReloadTemplate',
+                tenant,
+                className,
+                oid,
+                templateClassName
+            }
+        });
+    }
+    pullData(tenant, className, oid, marks) {
+        return this.http.post('api/data/custom', marks, {
+            params: {
+                executor: 'com.cs.system.word.editor.PullData',
+                tenant,
+                className,
+                oid
+            }
+        });
+    }
+    generateFile(tenant, className, oid, generateFileAttribute, generateFileName, model) {
+        return this.http.post('api/data/custom', model, {
+            params: {
+                executor: 'com.cs.system.word.editor.GenerateFile',
+                tenant,
+                className,
+                oid,
+                generateFileAttribute,
+                generateFileName
+            }
+        });
+    }
+}
+WordEditorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorService, deps: [{ token: i1$1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+WordEditorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$1.HttpClient }]; } });
+
+class WordEditorComponent {
+    constructor(service, wordEditorService, viewContainerRef) {
+        this.service = service;
+        this.wordEditorService = wordEditorService;
+        this.viewContainerRef = viewContainerRef;
+        this.showPullTemplateButton = true;
+        this.showPullDataButton = true;
+        this.showCalcButton = true;
+        this.showValidateButton = true;
+        this.showGenerateFileButton = true;
+        this.showCloseButton = true;
+        this.readonly = false;
+        this.onSaved = new EventEmitter();
+        this.onGenerated = new EventEmitter();
+        this.onClosed = new EventEmitter();
+        this.loading = false;
+    }
+    ngOnInit() {
+        if (!this.oid) {
+            return;
+        }
+        this.service.tenant = this.tenant;
+        this.service.templateClassName = this.templateClassName;
+        this.service.instanceClassName = this.className;
+        this.service.instanceOid = this.oid;
+        this.service.params = this.params;
+        this.service.tabViewContainerRef = this.tabViewContainerRef;
+        this.service.readonly = this.readonly;
+        this.loading = true;
+        this.wordEditorService.loadTemplate(this.tenant, this.className, this.oid).subscribe(response => {
+            this.sections = response.sections || [];
+            this.service.marks = response.marks;
+            this.loading = false;
+        });
+    }
+    pullTemplate() {
+        if (confirm('该操作会清除已录入的数据，确定重新拉取模板配置？')) {
+            this.loading = true;
+            this.wordEditorService.reloadTemplate(this.tenant, this.className, this.oid, this.templateClassName).subscribe(response => {
+                this.sections = response.data?.sections || [];
+                this.service.marks = response.data.marks;
+                this.loading = false;
+            });
+        }
+    }
+    pullData() {
+        this.loading = true;
+        this.wordEditorService.pullData(this.tenant, this.className, this.oid, {
+            marks: JSON.stringify(this.service.marks)
+        }).subscribe(response => {
+            for (let mark of this.service.marks) {
+                if (response.data.hasOwnProperty(mark.name)) {
+                    mark.value = response.data[mark.name];
+                }
+            }
+            this.service.valueUpdated.emit();
+            this.loading = false;
+            notifySuccess('拉取完成');
+        });
+    }
+    calc() {
+    }
+    validate() {
+        validateGroup(this.validator).then();
+    }
+    save() {
+        this.loading = true;
+        this.wordEditorService.save(this.tenant, this.className, this.oid, {
+            templateConfig: JSON.stringify({
+                sections: this.sections,
+                marks: this.service.marks
+            })
+        }).subscribe(response => {
+            this.loading = false;
+            if (response.success) {
+                notifySuccess('保存成功');
+                this.onSaved.emit();
+            }
+        });
+    }
+    generateFile() {
+        this.loading = true;
+        this.wordEditorService.generateFile(this.tenant, this.className, this.oid, this.generateFileAttribute || 'file', this.generateFileName || '', {
+            templateConfig: JSON.stringify({
+                sections: this.sections,
+                marks: this.service.marks
+            })
+        }).subscribe(response => {
+            this.loading = false;
+            if (response.success) {
+                notifySuccess('生成附件成功');
+                this.onGenerated.emit();
+            }
+        });
+    }
+}
+WordEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorComponent, deps: [{ token: SectionService }, { token: WordEditorService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
+WordEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WordEditorComponent, selector: "rs-word-editor", inputs: { tenant: "tenant", className: "className", oid: "oid", templateClassName: "templateClassName", params: "params", tabViewContainerRef: "tabViewContainerRef", showPullTemplateButton: "showPullTemplateButton", showPullDataButton: "showPullDataButton", showCalcButton: "showCalcButton", showValidateButton: "showValidateButton", showGenerateFileButton: "showGenerateFileButton", generateFileAttribute: "generateFileAttribute", generateFileName: "generateFileName", showCloseButton: "showCloseButton", readonly: "readonly" }, outputs: { onSaved: "onSaved", onGenerated: "onGenerated", onClosed: "onClosed" }, providers: [WordEditorService], viewQueries: [{ propertyName: "validator", first: true, predicate: ["validator"], descendants: true }], ngImport: i0, template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\" [visible]=\"loading\">\r\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\r\n</dx-load-panel>\r\n<div *ngIf=\"!readonly\" class=\"bar header\">\r\n  <dx-button *ngIf=\"showPullTemplateButton\" type=\"success\" text=\"\u66F4\u65B0\u6A21\u677F\" (onClick)=\"pullTemplate()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n  <dx-button *ngIf=\"showPullDataButton\" type=\"success\" text=\"\u586B\u5145\u6570\u636E\" (onClick)=\"pullData()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n  <!--  <dx-button *ngIf=\"showCalcButton\" type=\"default\" text=\"\u6267\u884C\u8BA1\u7B97\" (onClick)=\"calc()\"\r\n               [disabled]=\"loading\"></dx-button>-->\r\n  <dx-button *ngIf=\"showValidateButton\" type=\"default\" text=\"\u6267\u884C\u6821\u9A8C\" (onClick)=\"validate()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n</div>\r\n<dx-validation-group [class.validation-group]=\"true\" #validator>\r\n  <div class=\"viewer-container\">\r\n    <div class=\"viewer\">\r\n      <ng-container *ngFor=\"let section of sections\">\r\n        <rs-section [section]=\"section\"></rs-section>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</dx-validation-group>\r\n<div class=\"bar footer\">\r\n  <dx-button *ngIf=\"!readonly\" type=\"default\" text=\"\u4FDD\u5B58\" (onClick)=\"save()\" [disabled]=\"loading\"></dx-button>\r\n  <dx-button *ngIf=\"!readonly && showGenerateFileButton\" type=\"success\" text=\"\u751F\u6210\u9644\u4EF6\" (onClick)=\"generateFile()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n  <dx-button *ngIf=\"showCloseButton\" type=\"normal\" text=\"\u5173\u95ED\" (onClick)=\"onClosed.emit()\"></dx-button>\r\n</div>\r\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap;background-color:#f5f5f5}:host .bar{flex:none;padding:12px 24px;background-color:var(--coast-base-bg-color, rgb(255, 255, 255));z-index:1;display:flex;flex-flow:row nowrap}:host .bar>dx-button{width:80px}:host .bar>dx-button:not(:last-child){margin-right:8px}:host .header{border-bottom:1px solid var(--coast-border-color, rgb(221, 221, 221));position:sticky;top:0}:host .validation-group{flex:auto;height:0;overflow-y:auto;background-color:var(--coast-empty-color, rgb(229, 229, 229));display:flex;flex-flow:column nowrap}:host .validation-group .viewer-container{flex:auto;height:0;overflow-x:auto;padding:8px 16px 0;display:flex;flex-flow:row nowrap}:host .validation-group .viewer-container .viewer{margin:auto;display:flex;flex-flow:column nowrap;align-items:center;z-index:0}:host .footer{justify-content:flex-end;border-top:1px solid var(--coast-border-color, rgb(221, 221, 221));position:sticky;bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DxoPositionComponent, selector: "dxo-position", inputs: ["at", "boundary", "boundaryOffset", "collision", "my", "of", "offset"] }, { kind: "component", type: i3.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i6$1.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "copyRootClassesToWrapper", "deferRendering", "delay", "elementAttr", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "delayChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i7$1.DxValidationGroupComponent, selector: "dx-validation-group", inputs: ["elementAttr", "height", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "elementAttrChange", "heightChange", "widthChange"] }, { kind: "component", type: SectionComponent, selector: "rs-section", inputs: ["section", "editMode", "pasteMode", "readonly"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rs-word-editor', providers: [WordEditorService], template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\" [visible]=\"loading\">\r\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\r\n</dx-load-panel>\r\n<div *ngIf=\"!readonly\" class=\"bar header\">\r\n  <dx-button *ngIf=\"showPullTemplateButton\" type=\"success\" text=\"\u66F4\u65B0\u6A21\u677F\" (onClick)=\"pullTemplate()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n  <dx-button *ngIf=\"showPullDataButton\" type=\"success\" text=\"\u586B\u5145\u6570\u636E\" (onClick)=\"pullData()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n  <!--  <dx-button *ngIf=\"showCalcButton\" type=\"default\" text=\"\u6267\u884C\u8BA1\u7B97\" (onClick)=\"calc()\"\r\n               [disabled]=\"loading\"></dx-button>-->\r\n  <dx-button *ngIf=\"showValidateButton\" type=\"default\" text=\"\u6267\u884C\u6821\u9A8C\" (onClick)=\"validate()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n</div>\r\n<dx-validation-group [class.validation-group]=\"true\" #validator>\r\n  <div class=\"viewer-container\">\r\n    <div class=\"viewer\">\r\n      <ng-container *ngFor=\"let section of sections\">\r\n        <rs-section [section]=\"section\"></rs-section>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</dx-validation-group>\r\n<div class=\"bar footer\">\r\n  <dx-button *ngIf=\"!readonly\" type=\"default\" text=\"\u4FDD\u5B58\" (onClick)=\"save()\" [disabled]=\"loading\"></dx-button>\r\n  <dx-button *ngIf=\"!readonly && showGenerateFileButton\" type=\"success\" text=\"\u751F\u6210\u9644\u4EF6\" (onClick)=\"generateFile()\"\r\n             [disabled]=\"loading\"></dx-button>\r\n  <dx-button *ngIf=\"showCloseButton\" type=\"normal\" text=\"\u5173\u95ED\" (onClick)=\"onClosed.emit()\"></dx-button>\r\n</div>\r\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap;background-color:#f5f5f5}:host .bar{flex:none;padding:12px 24px;background-color:var(--coast-base-bg-color, rgb(255, 255, 255));z-index:1;display:flex;flex-flow:row nowrap}:host .bar>dx-button{width:80px}:host .bar>dx-button:not(:last-child){margin-right:8px}:host .header{border-bottom:1px solid var(--coast-border-color, rgb(221, 221, 221));position:sticky;top:0}:host .validation-group{flex:auto;height:0;overflow-y:auto;background-color:var(--coast-empty-color, rgb(229, 229, 229));display:flex;flex-flow:column nowrap}:host .validation-group .viewer-container{flex:auto;height:0;overflow-x:auto;padding:8px 16px 0;display:flex;flex-flow:row nowrap}:host .validation-group .viewer-container .viewer{margin:auto;display:flex;flex-flow:column nowrap;align-items:center;z-index:0}:host .footer{justify-content:flex-end;border-top:1px solid var(--coast-border-color, rgb(221, 221, 221));position:sticky;bottom:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: SectionService }, { type: WordEditorService }, { type: i0.ViewContainerRef }]; }, propDecorators: { tenant: [{
+                type: Input
+            }], className: [{
+                type: Input
+            }], oid: [{
+                type: Input
+            }], templateClassName: [{
+                type: Input
+            }], params: [{
+                type: Input
+            }], tabViewContainerRef: [{
+                type: Input
+            }], showPullTemplateButton: [{
+                type: Input
+            }], showPullDataButton: [{
+                type: Input
+            }], showCalcButton: [{
+                type: Input
+            }], showValidateButton: [{
+                type: Input
+            }], showGenerateFileButton: [{
+                type: Input
+            }], generateFileAttribute: [{
+                type: Input
+            }], generateFileName: [{
+                type: Input
+            }], showCloseButton: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], onSaved: [{
+                type: Output
+            }], onGenerated: [{
+                type: Output
+            }], onClosed: [{
+                type: Output
+            }], validator: [{
+                type: ViewChild,
+                args: ['validator']
+            }] } });
+
+class WordEditorModule {
+}
+WordEditorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+WordEditorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: WordEditorModule, declarations: [WordEditorComponent], imports: [CommonModule,
+        DevExtremeModule,
+        SectionModule], exports: [WordEditorComponent] });
+WordEditorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorModule, imports: [CommonModule,
+        DevExtremeModule,
+        SectionModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WordEditorModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        WordEditorComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        DevExtremeModule,
+                        SectionModule
+                    ],
+                    exports: [
+                        WordEditorComponent
+                    ]
+                }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { BoxContainerComponent, BoxContainerModule, CamundaBpmnEditorComponent, CamundaBpmnEditorModule, CamundaBpmnViewerComponent, CamundaBpmnViewerModule, CellComponentBase, CellConfigBase, ChangeFilter, CodeEditorComponent, CodeEditorModule, CustomTemplateDirective, DataGridComponent, DataGridFactory, DataGridModule, DataGridService, DrawerComponent, DrawerModule, DrawerService, DxNativeElementPipe, DynamicParamsComponent, DynamicParamsModule, FieldSelectorComponent, FormComponent, FormItemComponentBase, FormItemConfigBase, FormModule, FormService, FullscreenDirective, IconSelectorComponent, IconSelectorModule, ItemConfigComponent, ItemStyleComponent, ModalComponent, ModalComponentBase, ModalConfigBase, ModalModule, ModalService, PageItemComponentBase, PageItemConfigBase, PdfViewerComponent, PluginManager, RowButtonsTemplateDirective, TooltipContentTemplateDirective, WebsocketModule, WebsocketService, addWatermark, deepClone, download_file, evaluateFilter, file_type_icon, filename_from_disposition, format_file_size, localeSortMethod, notify_error, notify_success, notify_warning, openBrowserTab, support_preview_ext, validate, validate_group, validate_group_by_name };
+export { BoxContainerComponent, BoxContainerModule, CamundaBpmnEditorComponent, CamundaBpmnEditorModule, CamundaBpmnViewerComponent, CamundaBpmnViewerModule, CellComponentBase, CellConfigBase, ChangeFilter, CodeEditorComponent, CodeEditorModule, CustomTemplateDirective, DataGridComponent, DataGridFactory, DataGridModule, DataGridService, DrawerComponent, DrawerModule, DrawerService, DxNativeElementPipe, DynamicParamsComponent, DynamicParamsModule, FieldSelectorComponent, FormComponent, FormItemComponentBase, FormItemConfigBase, FormModule, FormService, FullscreenDirective, IconSelectorComponent, IconSelectorModule, ItemConfigComponent, ItemStyleComponent, MarkItemComponentBase, MarkItemConfigBase, ModalComponent, ModalComponentBase, ModalConfigBase, ModalModule, ModalService, NodeComponent, PageItemComponentBase, PageItemConfigBase, PdfViewerComponent, PluginManager, RowButtonsTemplateDirective, SectionComponent, SectionModule, SectionService, TooltipContentTemplateDirective, WebsocketModule, WebsocketService, WordDesignerComponent, WordDesignerModule, WordEditorComponent, WordEditorModule, addWatermark, deepClone, downloadFile, evaluateFilter, fileTypeIcon, filenameFromDisposition, formatFileSize, localeSortMethod, notifyError, notifySuccess, notifyWarning, openBrowserTab, supportPreviewExt, validate, validateGroup, validateGroupByName };
 //# sourceMappingURL=ngx-rs-ant.mjs.map