@ebuilding/biz-design 2.8.2 → 2.8.5

package/default/src/components/field.setting/setting.service.d.ts

@@ -2,6 +2,7 @@ import * as i0 from "@angular/core";
 export declare class SettingService {
     tableField: any;
     isEditor: boolean;
+    listDateField: any[];
     static ɵfac: i0.ɵɵFactoryDeclaration<SettingService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<SettingService>;
 }

package/default/src/components/field.setting/setting.teplate.d.ts

@@ -11,6 +11,9 @@ export declare class DeonDesignSettingTemplate implements OnInit, OnChanges {
     component: ComponentRef<any> | undefined;
     componentHost: ViewContainerRef | undefined;
     questionField: any;
+    _listField: any[];
+    set listField(arr: any[]);
+    get listField(): any[];
     dialogPageData: any;
     dialogFormData: any[];
     sourceType: any;
@@ -24,6 +27,7 @@ export declare class DeonDesignSettingTemplate implements OnInit, OnChanges {
     constructor(componentFactoryResolver: ComponentFactoryResolver, changeDetectorRef: ChangeDetectorRef, settingSrv: SettingService);
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
+    initListFieldDate(arr: FormlyFieldConfig[]): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DeonDesignSettingTemplate, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DeonDesignSettingTemplate, "deon-setting-template", never, { "dialogPageData": { "alias": "dialogPageData"; "required": false; }; "dialogFormData": { "alias": "dialogFormData"; "required": false; }; "sourceType": { "alias": "sourceType"; "required": false; }; "tableField": { "alias": "tableField"; "required": false; }; "isEditor": { "alias": "isEditor"; "required": false; }; "field": { "alias": "field"; "required": false; }; }, { "fieldChange": "fieldChange"; "fieldTypeChange": "fieldTypeChange"; "repeatChange": "repeatChange"; "delGridCell": "delGridCell"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DeonDesignSettingTemplate, "deon-setting-template", never, { "listField": { "alias": "listField"; "required": false; }; "dialogPageData": { "alias": "dialogPageData"; "required": false; }; "dialogFormData": { "alias": "dialogFormData"; "required": false; }; "sourceType": { "alias": "sourceType"; "required": false; }; "tableField": { "alias": "tableField"; "required": false; }; "isEditor": { "alias": "isEditor"; "required": false; }; "field": { "alias": "field"; "required": false; }; }, { "fieldChange": "fieldChange"; "fieldTypeChange": "fieldTypeChange"; "repeatChange": "repeatChange"; "delGridCell": "delGridCell"; }, never, never, true, never>;
 }

package/default/src/services/field-type.service.d.ts

@@ -8,6 +8,7 @@ export declare class FieldTypeService {
     fieldBasicType(type: any): any;
     private datetimeString;
     private label;
+    private text;
     private desc;
     private line;
     private grid;

package/fesm2022/default.mjs

@@ -221,6 +221,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
 class SettingService {
     tableField = null;
     isEditor = true;
+    listDateField = [];
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SettingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SettingService });
 }
@@ -446,6 +447,32 @@ class DeonDesignSettingCommon extends DeonDesignSettingBasic {
           <nz-option nzValue="HHMMSS" nzLabel="时分秒"></nz-option>
         </nz-select>
       </div>
+      <div class="paragraph"> 
+      </div>
+      <div class="paragraph">
+        <label>最小日期</label>
+        <nz-select
+          [nzDisabled]="settingSrv?.isEditor == false"
+          [(ngModel)]="sourceField.props.minDate"
+          (ngModelChange)="valueChange()"
+        >  
+         <ng-container *ngFor="let op of settingSrv.listDateField">
+         <nz-option [nzValue]="op.key" [nzLabel]="op.props.label"></nz-option>
+         </ng-container>
+        </nz-select>
+      </div>
+      <div class="paragraph">
+        <label>最大日期</label>
+        <nz-select
+          [nzDisabled]="settingSrv?.isEditor == false"
+          [(ngModel)]="sourceField.props.maxDate"
+          (ngModelChange)="valueChange()"
+        > 
+         <ng-container *ngFor="let op of settingSrv.listDateField">
+         <nz-option [nzValue]="op.key" [nzLabel]="op.props.label"></nz-option>
+         </ng-container>
+        </nz-select>
+      </div>
       <div class="paragraph">
         <label
           nz-checkbox
@@ -478,7 +505,7 @@ class DeonDesignSettingCommon extends DeonDesignSettingBasic {
         (blur)="valueChange()"
       ></textarea>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "ngmodule", type: NzInputModule }, { kind: "directive", type: i5.NzInputDirective, selector: "input[nz-input],textarea[nz-input]", inputs: ["nzBorderless", "nzSize", "nzStepperless", "nzStatus", "disabled"], exportAs: ["nzInput"] }, { kind: "ngmodule", type: NzInputNumberModule }, { kind: "component", type: i6.NzInputNumberComponent, selector: "nz-input-number", inputs: ["nzId", "nzSize", "nzPlaceHolder", "nzStatus", "nzStep", "nzMin", "nzMax", "nzPrecision", "nzParser", "nzFormatter", "nzDisabled", "nzReadOnly", "nzAutoFocus", "nzBordered", "nzKeyboard", "nzControls"], outputs: ["nzBlur", "nzFocus", "nzOnStep"], exportAs: ["nzInputNumber"] }, { kind: "ngmodule", type: NzCheckboxModule }, { kind: "component", type: i7.NzCheckboxComponent, selector: "[nz-checkbox]", inputs: ["nzValue", "nzAutoFocus", "nzDisabled", "nzIndeterminate", "nzChecked", "nzId", "nzName"], outputs: ["nzCheckedChange"], exportAs: ["nzCheckbox"] }, { kind: "ngmodule", type: NzRadioModule }, { kind: "component", type: i7$1.NzRadioComponent, selector: "[nz-radio],[nz-radio-button]", inputs: ["nzValue", "nzDisabled", "nzAutoFocus", "nz-radio-button"], exportAs: ["nzRadio"] }, { kind: "component", type: i7$1.NzRadioGroupComponent, selector: "nz-radio-group", inputs: ["nzDisabled", "nzButtonStyle", "nzSize", "nzName"], exportAs: ["nzRadioGroup"] }, { kind: "ngmodule", type: NzSelectModule }, { kind: "component", type: i6$1.NzOptionComponent, selector: "nz-option", inputs: ["nzTitle", "nzLabel", "nzValue", "nzKey", "nzDisabled", "nzHide", "nzCustomContent"], exportAs: ["nzOption"] }, { kind: "component", type: i6$1.NzSelectComponent, selector: "nz-select", inputs: ["nzId", "nzSize", "nzStatus", "nzOptionHeightPx", "nzOptionOverflowSize", "nzDropdownClassName", "nzDropdownMatchSelectWidth", "nzDropdownStyle", "nzNotFoundContent", "nzPlaceHolder", "nzPlacement", "nzMaxTagCount", "nzDropdownRender", "nzCustomTemplate", "nzSuffixIcon", "nzClearIcon", "nzRemoveIcon", "nzMenuItemSelectedIcon", "nzTokenSeparators", "nzMaxTagPlaceholder", "nzMaxMultipleCount", "nzMode", "nzFilterOption", "compareWith", "nzAllowClear", "nzBorderless", "nzShowSearch", "nzLoading", "nzAutoFocus", "nzAutoClearSearchValue", "nzServerSearch", "nzDisabled", "nzOpen", "nzSelectOnTab", "nzBackdrop", "nzOptions", "nzShowArrow"], outputs: ["nzOnSearch", "nzScrollToBottom", "nzOpenChange", "nzBlur", "nzFocus"], exportAs: ["nzSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "ngmodule", type: NzInputModule }, { kind: "directive", type: i5.NzInputDirective, selector: "input[nz-input],textarea[nz-input]", inputs: ["nzBorderless", "nzSize", "nzStepperless", "nzStatus", "disabled"], exportAs: ["nzInput"] }, { kind: "ngmodule", type: NzInputNumberModule }, { kind: "component", type: i6.NzInputNumberComponent, selector: "nz-input-number", inputs: ["nzId", "nzSize", "nzPlaceHolder", "nzStatus", "nzStep", "nzMin", "nzMax", "nzPrecision", "nzParser", "nzFormatter", "nzDisabled", "nzReadOnly", "nzAutoFocus", "nzBordered", "nzKeyboard", "nzControls"], outputs: ["nzBlur", "nzFocus", "nzOnStep"], exportAs: ["nzInputNumber"] }, { kind: "ngmodule", type: NzCheckboxModule }, { kind: "component", type: i7.NzCheckboxComponent, selector: "[nz-checkbox]", inputs: ["nzValue", "nzAutoFocus", "nzDisabled", "nzIndeterminate", "nzChecked", "nzId", "nzName"], outputs: ["nzCheckedChange"], exportAs: ["nzCheckbox"] }, { kind: "ngmodule", type: NzRadioModule }, { kind: "component", type: i7$1.NzRadioComponent, selector: "[nz-radio],[nz-radio-button]", inputs: ["nzValue", "nzDisabled", "nzAutoFocus", "nz-radio-button"], exportAs: ["nzRadio"] }, { kind: "component", type: i7$1.NzRadioGroupComponent, selector: "nz-radio-group", inputs: ["nzDisabled", "nzButtonStyle", "nzSize", "nzName"], exportAs: ["nzRadioGroup"] }, { kind: "ngmodule", type: NzSelectModule }, { kind: "component", type: i6$1.NzOptionComponent, selector: "nz-option", inputs: ["nzTitle", "nzLabel", "nzValue", "nzKey", "nzDisabled", "nzHide", "nzCustomContent"], exportAs: ["nzOption"] }, { kind: "component", type: i6$1.NzSelectComponent, selector: "nz-select", inputs: ["nzId", "nzSize", "nzStatus", "nzOptionHeightPx", "nzOptionOverflowSize", "nzDropdownClassName", "nzDropdownMatchSelectWidth", "nzDropdownStyle", "nzNotFoundContent", "nzPlaceHolder", "nzPlacement", "nzMaxTagCount", "nzDropdownRender", "nzCustomTemplate", "nzSuffixIcon", "nzClearIcon", "nzRemoveIcon", "nzMenuItemSelectedIcon", "nzTokenSeparators", "nzMaxTagPlaceholder", "nzMaxMultipleCount", "nzMode", "nzFilterOption", "compareWith", "nzAllowClear", "nzBorderless", "nzShowSearch", "nzLoading", "nzAutoFocus", "nzAutoClearSearchValue", "nzServerSearch", "nzDisabled", "nzOpen", "nzSelectOnTab", "nzBackdrop", "nzOptions", "nzShowArrow"], outputs: ["nzOnSearch", "nzScrollToBottom", "nzOpenChange", "nzBlur", "nzFocus"], exportAs: ["nzSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DeonDesignSettingCommon, decorators: [{
             type: Component,
@@ -674,6 +701,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
           <nz-option nzValue="HHMMSS" nzLabel="时分秒"></nz-option>
         </nz-select>
       </div>
+      <div class="paragraph"> 
+      </div>
+      <div class="paragraph">
+        <label>最小日期</label>
+        <nz-select
+          [nzDisabled]="settingSrv?.isEditor == false"
+          [(ngModel)]="sourceField.props.minDate"
+          (ngModelChange)="valueChange()"
+        >  
+         <ng-container *ngFor="let op of settingSrv.listDateField">
+         <nz-option [nzValue]="op.key" [nzLabel]="op.props.label"></nz-option>
+         </ng-container>
+        </nz-select>
+      </div>
+      <div class="paragraph">
+        <label>最大日期</label>
+        <nz-select
+          [nzDisabled]="settingSrv?.isEditor == false"
+          [(ngModel)]="sourceField.props.maxDate"
+          (ngModelChange)="valueChange()"
+        > 
+         <ng-container *ngFor="let op of settingSrv.listDateField">
+         <nz-option [nzValue]="op.key" [nzLabel]="op.props.label"></nz-option>
+         </ng-container>
+        </nz-select>
+      </div>
       <div class="paragraph">
         <label
           nz-checkbox
@@ -3999,6 +4052,17 @@ class DeonDesignSettingTemplate {
             hideJson: null,
         },
     };
+    _listField = [];
+    set listField(arr) {
+        this._listField = arr;
+        this.settingSrv.listDateField = [];
+        if (arr && Array.isArray(arr)) {
+            this.initListFieldDate(arr);
+        }
+    }
+    get listField() {
+        return this.listField;
+    }
     dialogPageData = null;
     dialogFormData = [];
     sourceType = {};
@@ -4060,8 +4124,20 @@ class DeonDesignSettingTemplate {
     }
     ngOnInit() { }
     ngOnChanges(changes) { }
+    initListFieldDate(arr) {
+        if (arr && Array.isArray(arr)) {
+            arr.forEach((item) => {
+                if (item && item?.type == "datetime") {
+                    this.settingSrv.listDateField.push(item);
+                }
+                if (item && item?.fieldGroup && Array.isArray(item.fieldGroup)) {
+                    this.initListFieldDate(item.fieldGroup);
+                }
+            });
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DeonDesignSettingTemplate, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ChangeDetectorRef }, { token: SettingService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DeonDesignSettingTemplate, isStandalone: true, selector: "deon-setting-template", inputs: { dialogPageData: "dialogPageData", dialogFormData: "dialogFormData", sourceType: "sourceType", tableField: "tableField", isEditor: "isEditor", field: "field" }, outputs: { fieldChange: "fieldChange", fieldTypeChange: "fieldTypeChange", repeatChange: "repeatChange", delGridCell: "delGridCell" }, providers: [SettingService], viewQueries: [{ propertyName: "componentHost", first: true, predicate: ["componentHost"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: ` <ng-container #componentHost></ng-container> `, isInline: true });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DeonDesignSettingTemplate, isStandalone: true, selector: "deon-setting-template", inputs: { listField: "listField", dialogPageData: "dialogPageData", dialogFormData: "dialogFormData", sourceType: "sourceType", tableField: "tableField", isEditor: "isEditor", field: "field" }, outputs: { fieldChange: "fieldChange", fieldTypeChange: "fieldTypeChange", repeatChange: "repeatChange", delGridCell: "delGridCell" }, providers: [SettingService], viewQueries: [{ propertyName: "componentHost", first: true, predicate: ["componentHost"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: ` <ng-container #componentHost></ng-container> `, isInline: true });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DeonDesignSettingTemplate, decorators: [{
             type: Component,
@@ -4073,6 +4149,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
         }], ctorParameters: () => [{ type: i0.ComponentFactoryResolver }, { type: i0.ChangeDetectorRef }, { type: SettingService }], propDecorators: { componentHost: [{
                 type: ViewChild,
                 args: ['componentHost', { read: ViewContainerRef, static: true }]
+            }], listField: [{
+                type: Input
             }], dialogPageData: [{
                 type: Input
             }], dialogFormData: [{
@@ -4101,10 +4179,10 @@ class DeonDesignFieldTypeBasic {
             type: 'label',
             label: '标签',
         },
-        // {
-        //   type: 'desc',
-        //   label: '文本描述',
-        // },
+        {
+            type: 'text',
+            label: '单行文本',
+        },
         {
             type: 'grid',
             label: '栅栏布局',
@@ -4131,10 +4209,10 @@ class DeonDesignFieldTypeBasic {
             type: 'label',
             label: '标签',
         },
-        // {
-        //   type: 'desc',
-        //   label: '文本描述',
-        // },
+        {
+            type: 'text',
+            label: '单行文本',
+        },
     ];
     otherList = [
         {
@@ -4185,10 +4263,10 @@ class DeonDesignFieldTypeBasic2 {
             type: 'label',
             label: '标签',
         },
-        // {
-        //   type: 'desc',
-        //   label: '文本描述',
-        // },
+        {
+            type: 'text',
+            label: '单行文本',
+        },
         {
             type: 'grid',
             label: '栅栏布局',
@@ -4203,10 +4281,10 @@ class DeonDesignFieldTypeBasic2 {
             type: 'label',
             label: '标签',
         },
-        // {
-        //   type: 'desc',
-        //   label: '文本描述',
-        // },
+        {
+            type: 'text',
+            label: '单行文本',
+        },
     ];
     otherList = [
         {
@@ -4346,6 +4424,9 @@ class FieldTypeService {
             case 'label':
                 field = this.label();
                 break;
+            case 'text':
+                field = this.text();
+                break;
             case 'desc':
                 field = this.desc();
                 break;
@@ -4388,6 +4469,18 @@ class FieldTypeService {
         };
         return config;
     }
+    text() {
+        let config = {
+            type: 'text',
+            key: this.datetimeString('text'),
+            defaultValue: null,
+            props: {
+                label: '文本',
+                layout: "upDown"
+            },
+        };
+        return config;
+    }
     desc() {
         let config = {
             type: 'desc',
@@ -5768,7 +5861,7 @@ class DeonDesignSimpleComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DeonDesignSimpleComponent, deps: [{ token: i1$3.NzModalService }, { token: i2$2.FormlyFormBuilder }, { token: FieldService }, { token: i4$2.DeonFormUtilService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DeonDesignSimpleComponent, isStandalone: true, selector: "deon-design-simple", inputs: { dialogPageData: "dialogPageData", dialogFormData: "dialogFormData", tableInfo: "tableInfo", fieldList: "fieldList", state: "state", formProp: "formProp" }, outputs: { actionEvent: "actionEvent" }, viewQueries: [{ propertyName: "dlq", predicate: CdkDropList, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"design-simple\" cdkDropListGroup>\n  <div class=\"box-west\" *ngIf=\"state == 'edit'\">\n    <nz-tabset>\n      <nz-tab nzTitle=\"\u9ED8\u8BA4\u5B57\u6BB5\">\n        <deon-field-type-basic [dls]=\"dls\" [isDefault]=\"formProp\"></deon-field-type-basic>\n      </nz-tab>\n      <nz-tab nzTitle=\"\u8868\u5355\u5BF9\u8C61\">\n        <deon-field-type-source [tableInfo]=\"tableInfo\" [dls]=\"dls\"></deon-field-type-source>\n      </nz-tab>\n    </nz-tabset>\n  </div>\n  <div class=\"box-content\">\n    <div class=\"box-center\">\n      <ng-content select=\"[name=content-info]\"></ng-content>\n      <div cdkDropList [cdkDropListData]=\"fields\" class=\"field-list\" (cdkDropListDropped)=\"drop($event)\"\n        [cdkDropListConnectedTo]=\"dls\">\n        <ng-container *ngFor=\"let field of fields; let index = index\">\n          <div class=\"field-box\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag>\n            <ng-container [ngSwitch]=\"field.type\">\n              <ng-container *ngSwitchCase=\"'grid'\">\n                <div class=\"grid-box\" [ngClass]=\"{ 'grid-active': field?.active == true }\"\n                  (click)=\"fieldActive(field, $event)\">\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n\n                  <div nz-row>\n                    <ng-container *ngFor=\"let grid of field.fieldGroup\">\n                      <div nz-col [nzSpan]=\"grid.props.cols\" cdkDropList [cdkDropListData]=\"grid.fieldGroup\"\n                        class=\"field-list\" (cdkDropListDropped)=\"drop($event)\" [cdkDropListConnectedTo]=\"dls\">\n                        <div *ngFor=\"let innerItem of grid.fieldGroup\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag\n                          class=\"field-box\">\n                          <content [field]=\"innerItem\" [state]=\"state\" (click)=\"fieldActive(innerItem, $event)\"\n                            (fieldDelEvent)=\"deleteField(innerItem, $event)\">\n                            <deon-field-default [field]=\"innerItem\"></deon-field-default>\n                          </content>\n                        </div>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </ng-container>\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'repeat'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'children'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5F15\u7528\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'reform'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u5DF2\u7ECF\u5F15\u7528</div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u9875\u7B7E -->\n              <ng-container *ngSwitchCase=\"'tabs'\">\n                <div class=\"tabs-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">\u591A\u9875\u7B7E\u63A7\u4EF6</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box\">\n                      <nz-tabset>\n                        <ng-container *ngFor=\"let tab of field.fieldGroup\">\n                          <nz-tab [nzTitle]=\"tab?.props?.label\" nzDisabled> </nz-tab>\n                        </ng-container>\n                      </nz-tabset>\n                    </div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u914D\u7F6E</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <ng-container *ngSwitchDefault>\n                <content [field]=\"field\" [state]=\"state\" (click)=\"fieldActive(field, $event)\"\n                  (fieldDelEvent)=\"deleteFieldIndex(index, $event)\">\n                  <deon-field-default [field]=\"field\"></deon-field-default>\n                </content>\n              </ng-container>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"field-box test\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag></div>\n      </div>\n    </div>\n    <div class=\"box-east\" *ngIf=\"state == 'edit'\">\n      <nz-tabset>\n        <nz-tab nzTitle=\"\u5B57\u6BB5\u5C5E\u6027\">\n          <ng-container *ngIf=\"activeField!!; else tmpSetting\">\n            <deon-setting-template [dialogPageData]=\"dialogPageData\" [dialogFormData]=\"dialogFormData\"\n              [sourceType]=\"sourceType\" [field]=\"activeField\" [tableField]=\"sourceField\"\n              (fieldChange)=\"activeFieldChange($event)\" (fieldTypeChange)=\"activeFieldTypeChange($event)\"\n              (repeatChange)=\"activeRepeatChange($event)\" (delGridCell)=\"deleteFieldByGrid($event)\">\n            </deon-setting-template>\n          </ng-container>\n          <ng-template #tmpSetting>\n            <empty-setting></empty-setting>\n          </ng-template>\n        </nz-tab>\n        <nz-tab nzTitle=\"\u8868\u5355\u5C5E\u6027\" *ngIf=\"formProp\">\n          <ng-content></ng-content>\n        </nz-tab>\n      </nz-tabset>\n    </div>\n  </div>\n</div>", styles: [".example-container{display:inline-block;width:400px;max-width:100%;margin:0 25px 25px 0;vertical-align:top}.example-list{display:block;min-height:60px;overflow:hidden;background:#fff;border:solid 1px #ccc;border-radius:4px}.example-box{display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;padding:20px 10px;color:#000000de;font-size:14px;background:#fff;border-bottom:solid 1px #ccc;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.field-list.cdk-drop-list-dragging .field-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep{flex:1}:host ::ng-deep .field-list{padding:15px 12px 0}:host ::ng-deep .field-box{width:100%;margin:0 0 15px}:host ::ng-deep .field-box .required:before{color:red;content:\"*\"}:host ::ng-deep .field-box .layout-default deon-field-default{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .field-box .layout-default deon-field-default deon-design-simple-label{width:120px;max-width:120px;padding:0 15px 0 0;text-align:right}:host ::ng-deep .field-box .layout-default deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box .layout-upDown deon-field-default{display:flex;flex-direction:column}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-design-simple-label{margin:0 0 6px}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box deon-field-textarea,:host ::ng-deep .field-box nz-select,:host ::ng-deep .field-box nz-date-picker,:host ::ng-deep .field-box nz-input-number{width:100%}:host ::ng-deep .grid-box{width:100%;min-height:50px}:host ::ng-deep .grid-box .ant-row{min-height:50px}:host ::ng-deep .grid-box .ant-col{border:1px dashed #ccc}:host ::ng-deep .grid-box .ant-col+.ant-col{border-left:0}:host ::ng-deep .grid-box .grid-list{height:100%;min-height:50px;padding:8px}:host ::ng-deep .grid-box .grid-list .list-box+.list-box .el-item{margin-top:8px}:host ::ng-deep .grid-active,:host ::ng-deep .repeat-active{position:relative;border:1px solid #e6a23c;outline:2px solid #e6a23c}:host ::ng-deep .grid-active .grid-drag,:host ::ng-deep .repeat-active .grid-drag{position:absolute;top:-2px;bottom:-18px;left:-2px;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:move}:host ::ng-deep .grid-active .grid-delete,:host ::ng-deep .repeat-active .grid-delete{position:absolute;right:0;bottom:0;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:pointer}:host ::ng-deep .repeat-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .repeat-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .field-box{margin:0;padding:0 15px}:host ::ng-deep .ant-tabs-tabpane{overflow:auto;overflow-x:overlay;overflow-y:overlay}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar{width:8px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-thumb{background-color:#94949475;border-radius:7px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-track{background-color:#fff}:host ::ng-deep .field-empty{height:300px;text-align:center}:host ::ng-deep .repeat-empty{padding:30px 0 0;text-align:center}:host ::ng-deep empty-field{display:inline-block;width:150px;margin:150px 80px;text-align:center}:host ::ng-deep empty-field img{width:100%;margin:auto;text-align:center}:host ::ng-deep empty-setting{display:inline-block;width:auto;margin:100px 80px;text-align:center}:host ::ng-deep empty-setting img{width:100%;margin:auto;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: NzTabsModule }, { kind: "component", type: i7$2.NzTabSetComponent, selector: "nz-tabset", inputs: ["nzSelectedIndex", "nzTabPosition", "nzTabBarExtraContent", "nzCanDeactivate", "nzAddIcon", "nzTabBarStyle", "nzType", "nzSize", "nzAnimated", "nzTabBarGutter", "nzHideAdd", "nzCentered", "nzHideAll", "nzLinkRouter", "nzLinkExact", "nzDestroyInactiveTabPane"], outputs: ["nzSelectChange", "nzSelectedIndexChange", "nzTabListScroll", "nzClose", "nzAdd"], exportAs: ["nzTabset"] }, { kind: "component", type: i7$2.NzTabComponent, selector: "nz-tab", inputs: ["nzTitle", "nzClosable", "nzCloseIcon", "nzDisabled", "nzForceRender"], outputs: ["nzSelect", "nzDeselect", "nzClick", "nzContextmenu"], exportAs: ["nzTab"] }, { kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i3$1.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "ngmodule", type: NzGridModule }, { kind: "directive", type: i9.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i9.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "ngmodule", type: NzTableModule }, { kind: "component", type: i10.NzTableComponent, selector: "nz-table", inputs: ["nzTableLayout", "nzShowTotal", "nzItemRender", "nzTitle", "nzFooter", "nzNoResult", "nzPageSizeOptions", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualForTrackBy", "nzLoadingDelay", "nzPageIndex", "nzPageSize", "nzTotal", "nzWidthConfig", "nzData", "nzCustomColumn", "nzPaginationPosition", "nzScroll", "noDataVirtualHeight", "nzPaginationType", "nzFrontPagination", "nzTemplateMode", "nzShowPagination", "nzLoading", "nzOuterBordered", "nzLoadingIndicator", "nzBordered", "nzSize", "nzShowSizeChanger", "nzHideOnSinglePage", "nzShowQuickJumper", "nzSimple"], outputs: ["nzPageSizeChange", "nzPageIndexChange", "nzQueryParams", "nzCurrentPageDataChange", "nzCustomColumnChange"], exportAs: ["nzTable"] }, { kind: "directive", type: i10.NzTableCellDirective, selector: "th:not(.nz-disable-th):not([mat-cell]), td:not(.nz-disable-td):not([mat-cell])" }, { kind: "directive", type: i10.NzThMeasureDirective, selector: "th", inputs: ["nzWidth", "colspan", "colSpan", "rowspan", "rowSpan"] }, { kind: "component", type: i10.NzTheadComponent, selector: "thead:not(.ant-table-thead)", outputs: ["nzSortOrderChange"] }, { kind: "component", type: i10.NzTbodyComponent, selector: "tbody" }, { kind: "directive", type: i10.NzTrDirective, selector: "tr:not([mat-row]):not([mat-header-row]):not([nz-table-measure-row]):not([nzExpand]):not([nz-table-fixed-row])" }, { kind: "directive", type: i10.NzCellFixedDirective, selector: "td[nzRight],th[nzRight],td[nzLeft],th[nzLeft]", inputs: ["nzRight", "nzLeft", "colspan", "colSpan"] }, { kind: "ngmodule", type: NzPopoverModule }, { kind: "component", type: EmptySettingComponent, selector: "empty-setting" }, { kind: "component", type: DeonDesignFieldTypeBasic, selector: "deon-field-type-basic", inputs: ["dls", "isDefault"] }, { kind: "component", type: DeonDesignFieldTypeSource, selector: "deon-field-type-source", inputs: ["dls", "tableInfo"] }, { kind: "component", type: DeonDesignFieldDefault, selector: "deon-field-default", inputs: ["field"] }, { kind: "component", type: DeonDesignFieldTemplate, selector: "deon-field-template", inputs: ["field"], outputs: ["fieldChange"] }, { kind: "component", type: DeonDesignSettingTemplate, selector: "deon-setting-template", inputs: ["dialogPageData", "dialogFormData", "sourceType", "tableField", "isEditor", "field"], outputs: ["fieldChange", "fieldTypeChange", "repeatChange", "delGridCell"] }, { kind: "component", type: ContentComponent, selector: "content", inputs: ["state", "field", "isOperation"], outputs: ["fieldDelEvent"] }, { kind: "component", type: ContentTableComponent, selector: "content-table", inputs: ["field"], outputs: ["fieldDelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DeonDesignSimpleComponent, isStandalone: true, selector: "deon-design-simple", inputs: { dialogPageData: "dialogPageData", dialogFormData: "dialogFormData", tableInfo: "tableInfo", fieldList: "fieldList", state: "state", formProp: "formProp" }, outputs: { actionEvent: "actionEvent" }, viewQueries: [{ propertyName: "dlq", predicate: CdkDropList, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"design-simple\" cdkDropListGroup>\n  <div class=\"box-west\" *ngIf=\"state == 'edit'\">\n    <nz-tabset>\n      <nz-tab nzTitle=\"\u9ED8\u8BA4\u5B57\u6BB5\">\n        <deon-field-type-basic [dls]=\"dls\" [isDefault]=\"formProp\"></deon-field-type-basic>\n      </nz-tab>\n      <nz-tab nzTitle=\"\u8868\u5355\u5BF9\u8C61\">\n        <deon-field-type-source [tableInfo]=\"tableInfo\" [dls]=\"dls\"></deon-field-type-source>\n      </nz-tab>\n    </nz-tabset>\n  </div>\n  <div class=\"box-content\">\n    <div class=\"box-center\">\n      <ng-content select=\"[name=content-info]\"></ng-content>\n      <div cdkDropList [cdkDropListData]=\"fields\" class=\"field-list\" (cdkDropListDropped)=\"drop($event)\"\n        [cdkDropListConnectedTo]=\"dls\">\n        <ng-container *ngFor=\"let field of fields; let index = index\">\n          <div class=\"field-box\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag>\n            <ng-container [ngSwitch]=\"field.type\">\n              <ng-container *ngSwitchCase=\"'grid'\">\n                <div class=\"grid-box\" [ngClass]=\"{ 'grid-active': field?.active == true }\"\n                  (click)=\"fieldActive(field, $event)\">\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n\n                  <div nz-row>\n                    <ng-container *ngFor=\"let grid of field.fieldGroup\">\n                      <div nz-col [nzSpan]=\"grid.props.cols\" cdkDropList [cdkDropListData]=\"grid.fieldGroup\"\n                        class=\"field-list\" (cdkDropListDropped)=\"drop($event)\" [cdkDropListConnectedTo]=\"dls\">\n                        <div *ngFor=\"let innerItem of grid.fieldGroup\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag\n                          class=\"field-box\">\n                          <content [field]=\"innerItem\" [state]=\"state\" (click)=\"fieldActive(innerItem, $event)\"\n                            (fieldDelEvent)=\"deleteField(innerItem, $event)\">\n                            <deon-field-default [field]=\"innerItem\"></deon-field-default>\n                          </content>\n                        </div>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </ng-container>\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'repeat'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'children'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5F15\u7528\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'reform'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u5DF2\u7ECF\u5F15\u7528</div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u9875\u7B7E -->\n              <ng-container *ngSwitchCase=\"'tabs'\">\n                <div class=\"tabs-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">\u591A\u9875\u7B7E\u63A7\u4EF6</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box\">\n                      <nz-tabset>\n                        <ng-container *ngFor=\"let tab of field.fieldGroup\">\n                          <nz-tab [nzTitle]=\"tab?.props?.label\" nzDisabled> </nz-tab>\n                        </ng-container>\n                      </nz-tabset>\n                    </div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u914D\u7F6E</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <ng-container *ngSwitchDefault>\n                <content [field]=\"field\" [state]=\"state\" (click)=\"fieldActive(field, $event)\"\n                  (fieldDelEvent)=\"deleteFieldIndex(index, $event)\">\n                  <deon-field-default [field]=\"field\"></deon-field-default>\n                </content>\n              </ng-container>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"field-box test\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag></div>\n      </div>\n    </div>\n    <div class=\"box-east\" *ngIf=\"state == 'edit'\">\n      <nz-tabset>\n        <nz-tab nzTitle=\"\u5B57\u6BB5\u5C5E\u6027\">\n          <ng-container *ngIf=\"activeField!!; else tmpSetting\">\n            <deon-setting-template [listField]=\"fields\" [dialogPageData]=\"dialogPageData\"\n              [dialogFormData]=\"dialogFormData\" [sourceType]=\"sourceType\" [field]=\"activeField\"\n              [tableField]=\"sourceField\" (fieldChange)=\"activeFieldChange($event)\"\n              (fieldTypeChange)=\"activeFieldTypeChange($event)\" (repeatChange)=\"activeRepeatChange($event)\"\n              (delGridCell)=\"deleteFieldByGrid($event)\">\n            </deon-setting-template>\n          </ng-container>\n          <ng-template #tmpSetting>\n            <empty-setting></empty-setting>\n          </ng-template>\n        </nz-tab>\n        <nz-tab nzTitle=\"\u8868\u5355\u5C5E\u6027\" *ngIf=\"formProp\">\n          <ng-content></ng-content>\n        </nz-tab>\n      </nz-tabset>\n    </div>\n  </div>\n</div>", styles: [".example-container{display:inline-block;width:400px;max-width:100%;margin:0 25px 25px 0;vertical-align:top}.example-list{display:block;min-height:60px;overflow:hidden;background:#fff;border:solid 1px #ccc;border-radius:4px}.example-box{display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;padding:20px 10px;color:#000000de;font-size:14px;background:#fff;border-bottom:solid 1px #ccc;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.field-list.cdk-drop-list-dragging .field-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep{flex:1}:host ::ng-deep .field-list{padding:15px 12px 0}:host ::ng-deep .field-box{width:100%;margin:0 0 15px}:host ::ng-deep .field-box .required:before{color:red;content:\"*\"}:host ::ng-deep .field-box .layout-default deon-field-default{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .field-box .layout-default deon-field-default deon-design-simple-label{width:120px;max-width:120px;padding:0 15px 0 0;text-align:right}:host ::ng-deep .field-box .layout-default deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box .layout-upDown deon-field-default{display:flex;flex-direction:column}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-design-simple-label{margin:0 0 6px}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box deon-field-textarea,:host ::ng-deep .field-box nz-select,:host ::ng-deep .field-box nz-date-picker,:host ::ng-deep .field-box nz-input-number{width:100%}:host ::ng-deep .grid-box{width:100%;min-height:50px}:host ::ng-deep .grid-box .ant-row{min-height:50px}:host ::ng-deep .grid-box .ant-col{border:1px dashed #ccc}:host ::ng-deep .grid-box .ant-col+.ant-col{border-left:0}:host ::ng-deep .grid-box .grid-list{height:100%;min-height:50px;padding:8px}:host ::ng-deep .grid-box .grid-list .list-box+.list-box .el-item{margin-top:8px}:host ::ng-deep .grid-active,:host ::ng-deep .repeat-active{position:relative;border:1px solid #e6a23c;outline:2px solid #e6a23c}:host ::ng-deep .grid-active .grid-drag,:host ::ng-deep .repeat-active .grid-drag{position:absolute;top:-2px;bottom:-18px;left:-2px;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:move}:host ::ng-deep .grid-active .grid-delete,:host ::ng-deep .repeat-active .grid-delete{position:absolute;right:0;bottom:0;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:pointer}:host ::ng-deep .repeat-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .repeat-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .field-box{margin:0;padding:0 15px}:host ::ng-deep .ant-tabs-tabpane{overflow:auto;overflow-x:overlay;overflow-y:overlay}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar{width:8px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-thumb{background-color:#94949475;border-radius:7px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-track{background-color:#fff}:host ::ng-deep .field-empty{height:300px;text-align:center}:host ::ng-deep .repeat-empty{padding:30px 0 0;text-align:center}:host ::ng-deep empty-field{display:inline-block;width:150px;margin:150px 80px;text-align:center}:host ::ng-deep empty-field img{width:100%;margin:auto;text-align:center}:host ::ng-deep empty-setting{display:inline-block;width:auto;margin:100px 80px;text-align:center}:host ::ng-deep empty-setting img{width:100%;margin:auto;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: NzTabsModule }, { kind: "component", type: i7$2.NzTabSetComponent, selector: "nz-tabset", inputs: ["nzSelectedIndex", "nzTabPosition", "nzTabBarExtraContent", "nzCanDeactivate", "nzAddIcon", "nzTabBarStyle", "nzType", "nzSize", "nzAnimated", "nzTabBarGutter", "nzHideAdd", "nzCentered", "nzHideAll", "nzLinkRouter", "nzLinkExact", "nzDestroyInactiveTabPane"], outputs: ["nzSelectChange", "nzSelectedIndexChange", "nzTabListScroll", "nzClose", "nzAdd"], exportAs: ["nzTabset"] }, { kind: "component", type: i7$2.NzTabComponent, selector: "nz-tab", inputs: ["nzTitle", "nzClosable", "nzCloseIcon", "nzDisabled", "nzForceRender"], outputs: ["nzSelect", "nzDeselect", "nzClick", "nzContextmenu"], exportAs: ["nzTab"] }, { kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i3$1.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "ngmodule", type: NzGridModule }, { kind: "directive", type: i9.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i9.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "ngmodule", type: NzTableModule }, { kind: "component", type: i10.NzTableComponent, selector: "nz-table", inputs: ["nzTableLayout", "nzShowTotal", "nzItemRender", "nzTitle", "nzFooter", "nzNoResult", "nzPageSizeOptions", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualForTrackBy", "nzLoadingDelay", "nzPageIndex", "nzPageSize", "nzTotal", "nzWidthConfig", "nzData", "nzCustomColumn", "nzPaginationPosition", "nzScroll", "noDataVirtualHeight", "nzPaginationType", "nzFrontPagination", "nzTemplateMode", "nzShowPagination", "nzLoading", "nzOuterBordered", "nzLoadingIndicator", "nzBordered", "nzSize", "nzShowSizeChanger", "nzHideOnSinglePage", "nzShowQuickJumper", "nzSimple"], outputs: ["nzPageSizeChange", "nzPageIndexChange", "nzQueryParams", "nzCurrentPageDataChange", "nzCustomColumnChange"], exportAs: ["nzTable"] }, { kind: "directive", type: i10.NzTableCellDirective, selector: "th:not(.nz-disable-th):not([mat-cell]), td:not(.nz-disable-td):not([mat-cell])" }, { kind: "directive", type: i10.NzThMeasureDirective, selector: "th", inputs: ["nzWidth", "colspan", "colSpan", "rowspan", "rowSpan"] }, { kind: "component", type: i10.NzTheadComponent, selector: "thead:not(.ant-table-thead)", outputs: ["nzSortOrderChange"] }, { kind: "component", type: i10.NzTbodyComponent, selector: "tbody" }, { kind: "directive", type: i10.NzTrDirective, selector: "tr:not([mat-row]):not([mat-header-row]):not([nz-table-measure-row]):not([nzExpand]):not([nz-table-fixed-row])" }, { kind: "directive", type: i10.NzCellFixedDirective, selector: "td[nzRight],th[nzRight],td[nzLeft],th[nzLeft]", inputs: ["nzRight", "nzLeft", "colspan", "colSpan"] }, { kind: "ngmodule", type: NzPopoverModule }, { kind: "component", type: EmptySettingComponent, selector: "empty-setting" }, { kind: "component", type: DeonDesignFieldTypeBasic, selector: "deon-field-type-basic", inputs: ["dls", "isDefault"] }, { kind: "component", type: DeonDesignFieldTypeSource, selector: "deon-field-type-source", inputs: ["dls", "tableInfo"] }, { kind: "component", type: DeonDesignFieldDefault, selector: "deon-field-default", inputs: ["field"] }, { kind: "component", type: DeonDesignFieldTemplate, selector: "deon-field-template", inputs: ["field"], outputs: ["fieldChange"] }, { kind: "component", type: DeonDesignSettingTemplate, selector: "deon-setting-template", inputs: ["listField", "dialogPageData", "dialogFormData", "sourceType", "tableField", "isEditor", "field"], outputs: ["fieldChange", "fieldTypeChange", "repeatChange", "delGridCell"] }, { kind: "component", type: ContentComponent, selector: "content", inputs: ["state", "field", "isOperation"], outputs: ["fieldDelEvent"] }, { kind: "component", type: ContentTableComponent, selector: "content-table", inputs: ["field"], outputs: ["fieldDelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DeonDesignSimpleComponent, decorators: [{
             type: Component,
@@ -5788,7 +5881,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
                         DeonDesignSettingTemplate,
                         ContentComponent,
                         ContentTableComponent
-                    ], template: "<div class=\"design-simple\" cdkDropListGroup>\n  <div class=\"box-west\" *ngIf=\"state == 'edit'\">\n    <nz-tabset>\n      <nz-tab nzTitle=\"\u9ED8\u8BA4\u5B57\u6BB5\">\n        <deon-field-type-basic [dls]=\"dls\" [isDefault]=\"formProp\"></deon-field-type-basic>\n      </nz-tab>\n      <nz-tab nzTitle=\"\u8868\u5355\u5BF9\u8C61\">\n        <deon-field-type-source [tableInfo]=\"tableInfo\" [dls]=\"dls\"></deon-field-type-source>\n      </nz-tab>\n    </nz-tabset>\n  </div>\n  <div class=\"box-content\">\n    <div class=\"box-center\">\n      <ng-content select=\"[name=content-info]\"></ng-content>\n      <div cdkDropList [cdkDropListData]=\"fields\" class=\"field-list\" (cdkDropListDropped)=\"drop($event)\"\n        [cdkDropListConnectedTo]=\"dls\">\n        <ng-container *ngFor=\"let field of fields; let index = index\">\n          <div class=\"field-box\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag>\n            <ng-container [ngSwitch]=\"field.type\">\n              <ng-container *ngSwitchCase=\"'grid'\">\n                <div class=\"grid-box\" [ngClass]=\"{ 'grid-active': field?.active == true }\"\n                  (click)=\"fieldActive(field, $event)\">\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n\n                  <div nz-row>\n                    <ng-container *ngFor=\"let grid of field.fieldGroup\">\n                      <div nz-col [nzSpan]=\"grid.props.cols\" cdkDropList [cdkDropListData]=\"grid.fieldGroup\"\n                        class=\"field-list\" (cdkDropListDropped)=\"drop($event)\" [cdkDropListConnectedTo]=\"dls\">\n                        <div *ngFor=\"let innerItem of grid.fieldGroup\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag\n                          class=\"field-box\">\n                          <content [field]=\"innerItem\" [state]=\"state\" (click)=\"fieldActive(innerItem, $event)\"\n                            (fieldDelEvent)=\"deleteField(innerItem, $event)\">\n                            <deon-field-default [field]=\"innerItem\"></deon-field-default>\n                          </content>\n                        </div>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </ng-container>\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'repeat'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'children'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5F15\u7528\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'reform'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u5DF2\u7ECF\u5F15\u7528</div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u9875\u7B7E -->\n              <ng-container *ngSwitchCase=\"'tabs'\">\n                <div class=\"tabs-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">\u591A\u9875\u7B7E\u63A7\u4EF6</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box\">\n                      <nz-tabset>\n                        <ng-container *ngFor=\"let tab of field.fieldGroup\">\n                          <nz-tab [nzTitle]=\"tab?.props?.label\" nzDisabled> </nz-tab>\n                        </ng-container>\n                      </nz-tabset>\n                    </div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u914D\u7F6E</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <ng-container *ngSwitchDefault>\n                <content [field]=\"field\" [state]=\"state\" (click)=\"fieldActive(field, $event)\"\n                  (fieldDelEvent)=\"deleteFieldIndex(index, $event)\">\n                  <deon-field-default [field]=\"field\"></deon-field-default>\n                </content>\n              </ng-container>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"field-box test\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag></div>\n      </div>\n    </div>\n    <div class=\"box-east\" *ngIf=\"state == 'edit'\">\n      <nz-tabset>\n        <nz-tab nzTitle=\"\u5B57\u6BB5\u5C5E\u6027\">\n          <ng-container *ngIf=\"activeField!!; else tmpSetting\">\n            <deon-setting-template [dialogPageData]=\"dialogPageData\" [dialogFormData]=\"dialogFormData\"\n              [sourceType]=\"sourceType\" [field]=\"activeField\" [tableField]=\"sourceField\"\n              (fieldChange)=\"activeFieldChange($event)\" (fieldTypeChange)=\"activeFieldTypeChange($event)\"\n              (repeatChange)=\"activeRepeatChange($event)\" (delGridCell)=\"deleteFieldByGrid($event)\">\n            </deon-setting-template>\n          </ng-container>\n          <ng-template #tmpSetting>\n            <empty-setting></empty-setting>\n          </ng-template>\n        </nz-tab>\n        <nz-tab nzTitle=\"\u8868\u5355\u5C5E\u6027\" *ngIf=\"formProp\">\n          <ng-content></ng-content>\n        </nz-tab>\n      </nz-tabset>\n    </div>\n  </div>\n</div>", styles: [".example-container{display:inline-block;width:400px;max-width:100%;margin:0 25px 25px 0;vertical-align:top}.example-list{display:block;min-height:60px;overflow:hidden;background:#fff;border:solid 1px #ccc;border-radius:4px}.example-box{display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;padding:20px 10px;color:#000000de;font-size:14px;background:#fff;border-bottom:solid 1px #ccc;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.field-list.cdk-drop-list-dragging .field-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep{flex:1}:host ::ng-deep .field-list{padding:15px 12px 0}:host ::ng-deep .field-box{width:100%;margin:0 0 15px}:host ::ng-deep .field-box .required:before{color:red;content:\"*\"}:host ::ng-deep .field-box .layout-default deon-field-default{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .field-box .layout-default deon-field-default deon-design-simple-label{width:120px;max-width:120px;padding:0 15px 0 0;text-align:right}:host ::ng-deep .field-box .layout-default deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box .layout-upDown deon-field-default{display:flex;flex-direction:column}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-design-simple-label{margin:0 0 6px}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box deon-field-textarea,:host ::ng-deep .field-box nz-select,:host ::ng-deep .field-box nz-date-picker,:host ::ng-deep .field-box nz-input-number{width:100%}:host ::ng-deep .grid-box{width:100%;min-height:50px}:host ::ng-deep .grid-box .ant-row{min-height:50px}:host ::ng-deep .grid-box .ant-col{border:1px dashed #ccc}:host ::ng-deep .grid-box .ant-col+.ant-col{border-left:0}:host ::ng-deep .grid-box .grid-list{height:100%;min-height:50px;padding:8px}:host ::ng-deep .grid-box .grid-list .list-box+.list-box .el-item{margin-top:8px}:host ::ng-deep .grid-active,:host ::ng-deep .repeat-active{position:relative;border:1px solid #e6a23c;outline:2px solid #e6a23c}:host ::ng-deep .grid-active .grid-drag,:host ::ng-deep .repeat-active .grid-drag{position:absolute;top:-2px;bottom:-18px;left:-2px;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:move}:host ::ng-deep .grid-active .grid-delete,:host ::ng-deep .repeat-active .grid-delete{position:absolute;right:0;bottom:0;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:pointer}:host ::ng-deep .repeat-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .repeat-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .field-box{margin:0;padding:0 15px}:host ::ng-deep .ant-tabs-tabpane{overflow:auto;overflow-x:overlay;overflow-y:overlay}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar{width:8px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-thumb{background-color:#94949475;border-radius:7px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-track{background-color:#fff}:host ::ng-deep .field-empty{height:300px;text-align:center}:host ::ng-deep .repeat-empty{padding:30px 0 0;text-align:center}:host ::ng-deep empty-field{display:inline-block;width:150px;margin:150px 80px;text-align:center}:host ::ng-deep empty-field img{width:100%;margin:auto;text-align:center}:host ::ng-deep empty-setting{display:inline-block;width:auto;margin:100px 80px;text-align:center}:host ::ng-deep empty-setting img{width:100%;margin:auto;text-align:center}\n"] }]
+                    ], template: "<div class=\"design-simple\" cdkDropListGroup>\n  <div class=\"box-west\" *ngIf=\"state == 'edit'\">\n    <nz-tabset>\n      <nz-tab nzTitle=\"\u9ED8\u8BA4\u5B57\u6BB5\">\n        <deon-field-type-basic [dls]=\"dls\" [isDefault]=\"formProp\"></deon-field-type-basic>\n      </nz-tab>\n      <nz-tab nzTitle=\"\u8868\u5355\u5BF9\u8C61\">\n        <deon-field-type-source [tableInfo]=\"tableInfo\" [dls]=\"dls\"></deon-field-type-source>\n      </nz-tab>\n    </nz-tabset>\n  </div>\n  <div class=\"box-content\">\n    <div class=\"box-center\">\n      <ng-content select=\"[name=content-info]\"></ng-content>\n      <div cdkDropList [cdkDropListData]=\"fields\" class=\"field-list\" (cdkDropListDropped)=\"drop($event)\"\n        [cdkDropListConnectedTo]=\"dls\">\n        <ng-container *ngFor=\"let field of fields; let index = index\">\n          <div class=\"field-box\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag>\n            <ng-container [ngSwitch]=\"field.type\">\n              <ng-container *ngSwitchCase=\"'grid'\">\n                <div class=\"grid-box\" [ngClass]=\"{ 'grid-active': field?.active == true }\"\n                  (click)=\"fieldActive(field, $event)\">\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n\n                  <div nz-row>\n                    <ng-container *ngFor=\"let grid of field.fieldGroup\">\n                      <div nz-col [nzSpan]=\"grid.props.cols\" cdkDropList [cdkDropListData]=\"grid.fieldGroup\"\n                        class=\"field-list\" (cdkDropListDropped)=\"drop($event)\" [cdkDropListConnectedTo]=\"dls\">\n                        <div *ngFor=\"let innerItem of grid.fieldGroup\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag\n                          class=\"field-box\">\n                          <content [field]=\"innerItem\" [state]=\"state\" (click)=\"fieldActive(innerItem, $event)\"\n                            (fieldDelEvent)=\"deleteField(innerItem, $event)\">\n                            <deon-field-default [field]=\"innerItem\"></deon-field-default>\n                          </content>\n                        </div>\n                      </div>\n                    </ng-container>\n                  </div>\n                </div>\n              </ng-container>\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'repeat'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5B50\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'children'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container\n                    *ngIf=\"field.fieldArray.fieldGroup!! && field.fieldArray.fieldGroup.length > 0; else tmpPanel\">\n                    <nz-table #basicTable nzShowPagination=\"false\" nzSize=\"small\" nzShowPagination=\"false\"\n                      [nzData]=\"field.fieldArray.fieldGroup\">\n                      <thead>\n                        <tr>\n                          <th nzWidth=\"50px\" class=\"select-box td\" nzLeft=\"0px\">\u5E8F\u53F7</th>\n                          <th *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            {{ innerItem.props.label }}\n                          </th>\n                          <th>\n                            <span class=\"\"> </span>\n                          </th>\n                        </tr>\n                      </thead>\n                      <tbody>\n                        <tr>\n                          <td nzLeft=\"0px\">\n                            <span>1</span>\n                          </td>\n                          <td *ngFor=\"let innerItem of field.fieldArray.fieldGroup\">\n                            <content-table [field]=\"innerItem\" (click)=\"fieldActive(innerItem, $event, 'repeat')\">\n                              <deon-field-template [field]=\"innerItem\"> </deon-field-template>\n                            </content-table>\n                          </td>\n                          <td nzRight=\"0px\"></td>\n                        </tr>\n                      </tbody>\n                    </nz-table>\n                  </ng-container>\n                  <ng-template #tmpPanel>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u5F15\u7528\u8868\u5355 -->\n              <ng-container *ngSwitchCase=\"'reform'\">\n                <div class=\"repeat-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">{{ field.props.label }}</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u5DF2\u7ECF\u5F15\u7528</div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u5B57\u6BB5</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <!-- \u9875\u7B7E -->\n              <ng-container *ngSwitchCase=\"'tabs'\">\n                <div class=\"tabs-box\" (click)=\"fieldActive(field, $event)\" cdkDrag\n                  [ngClass]=\"{ 'repeat-active': field?.active == true }\">\n                  <div class=\"title\">\u591A\u9875\u7B7E\u63A7\u4EF6</div>\n                  <ng-container *ngIf=\"field?.active == true\">\n                    <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\n                    <div class=\"grid-delete\"><span nz-icon nzType=\"delete\"\n                        (click)=\"deleteFieldIndex(index, $event)\"></span></div>\n                  </ng-container>\n                  <div cdkDragHandle style=\"display: none\"></div>\n                  <ng-container *ngIf=\"field.fieldGroup!! && field.fieldGroup.length > 0; else tmpPanel2\">\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box\">\n                      <nz-tabset>\n                        <ng-container *ngFor=\"let tab of field.fieldGroup\">\n                          <nz-tab [nzTitle]=\"tab?.props?.label\" nzDisabled> </nz-tab>\n                        </ng-container>\n                      </nz-tabset>\n                    </div>\n                  </ng-container>\n                  <ng-template #tmpPanel2>\n                    <div nz-col [nzSpan]=\"24\" class=\"field-box repeat-empty\">\u6682\u65E0\u914D\u7F6E</div>\n                  </ng-template>\n                </div>\n              </ng-container>\n\n              <ng-container *ngSwitchDefault>\n                <content [field]=\"field\" [state]=\"state\" (click)=\"fieldActive(field, $event)\"\n                  (fieldDelEvent)=\"deleteFieldIndex(index, $event)\">\n                  <deon-field-default [field]=\"field\"></deon-field-default>\n                </content>\n              </ng-container>\n            </ng-container>\n          </div>\n        </ng-container>\n        <div class=\"field-box test\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag></div>\n      </div>\n    </div>\n    <div class=\"box-east\" *ngIf=\"state == 'edit'\">\n      <nz-tabset>\n        <nz-tab nzTitle=\"\u5B57\u6BB5\u5C5E\u6027\">\n          <ng-container *ngIf=\"activeField!!; else tmpSetting\">\n            <deon-setting-template [listField]=\"fields\" [dialogPageData]=\"dialogPageData\"\n              [dialogFormData]=\"dialogFormData\" [sourceType]=\"sourceType\" [field]=\"activeField\"\n              [tableField]=\"sourceField\" (fieldChange)=\"activeFieldChange($event)\"\n              (fieldTypeChange)=\"activeFieldTypeChange($event)\" (repeatChange)=\"activeRepeatChange($event)\"\n              (delGridCell)=\"deleteFieldByGrid($event)\">\n            </deon-setting-template>\n          </ng-container>\n          <ng-template #tmpSetting>\n            <empty-setting></empty-setting>\n          </ng-template>\n        </nz-tab>\n        <nz-tab nzTitle=\"\u8868\u5355\u5C5E\u6027\" *ngIf=\"formProp\">\n          <ng-content></ng-content>\n        </nz-tab>\n      </nz-tabset>\n    </div>\n  </div>\n</div>", styles: [".example-container{display:inline-block;width:400px;max-width:100%;margin:0 25px 25px 0;vertical-align:top}.example-list{display:block;min-height:60px;overflow:hidden;background:#fff;border:solid 1px #ccc;border-radius:4px}.example-box{display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;padding:20px 10px;color:#000000de;font-size:14px;background:#fff;border-bottom:solid 1px #ccc;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.field-list.cdk-drop-list-dragging .field-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep{flex:1}:host ::ng-deep .field-list{padding:15px 12px 0}:host ::ng-deep .field-box{width:100%;margin:0 0 15px}:host ::ng-deep .field-box .required:before{color:red;content:\"*\"}:host ::ng-deep .field-box .layout-default deon-field-default{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .field-box .layout-default deon-field-default deon-design-simple-label{width:120px;max-width:120px;padding:0 15px 0 0;text-align:right}:host ::ng-deep .field-box .layout-default deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box .layout-upDown deon-field-default{display:flex;flex-direction:column}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-design-simple-label{margin:0 0 6px}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box deon-field-textarea,:host ::ng-deep .field-box nz-select,:host ::ng-deep .field-box nz-date-picker,:host ::ng-deep .field-box nz-input-number{width:100%}:host ::ng-deep .grid-box{width:100%;min-height:50px}:host ::ng-deep .grid-box .ant-row{min-height:50px}:host ::ng-deep .grid-box .ant-col{border:1px dashed #ccc}:host ::ng-deep .grid-box .ant-col+.ant-col{border-left:0}:host ::ng-deep .grid-box .grid-list{height:100%;min-height:50px;padding:8px}:host ::ng-deep .grid-box .grid-list .list-box+.list-box .el-item{margin-top:8px}:host ::ng-deep .grid-active,:host ::ng-deep .repeat-active{position:relative;border:1px solid #e6a23c;outline:2px solid #e6a23c}:host ::ng-deep .grid-active .grid-drag,:host ::ng-deep .repeat-active .grid-drag{position:absolute;top:-2px;bottom:-18px;left:-2px;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:move}:host ::ng-deep .grid-active .grid-delete,:host ::ng-deep .repeat-active .grid-delete{position:absolute;right:0;bottom:0;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:pointer}:host ::ng-deep .repeat-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .repeat-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .title{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .tabs-box .field-box{margin:0;padding:0 15px}:host ::ng-deep .ant-tabs-tabpane{overflow:auto;overflow-x:overlay;overflow-y:overlay}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar{width:8px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-thumb{background-color:#94949475;border-radius:7px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-track{background-color:#fff}:host ::ng-deep .field-empty{height:300px;text-align:center}:host ::ng-deep .repeat-empty{padding:30px 0 0;text-align:center}:host ::ng-deep empty-field{display:inline-block;width:150px;margin:150px 80px;text-align:center}:host ::ng-deep empty-field img{width:100%;margin:auto;text-align:center}:host ::ng-deep empty-setting{display:inline-block;width:auto;margin:100px 80px;text-align:center}:host ::ng-deep empty-setting img{width:100%;margin:auto;text-align:center}\n"] }]
         }], ctorParameters: () => [{ type: i1$3.NzModalService }, { type: i2$2.FormlyFormBuilder }, { type: FieldService }, { type: i4$2.DeonFormUtilService }], propDecorators: { dlq: [{
                 type: ViewChildren,
                 args: [CdkDropList]
@@ -6105,7 +6198,7 @@ class KPIDesignSimpleComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: KPIDesignSimpleComponent, deps: [{ token: i1$3.NzModalService }, { token: i2$2.FormlyFormBuilder }, { token: FieldService }, { token: i4$2.DeonFormUtilService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: KPIDesignSimpleComponent, isStandalone: true, selector: "kpi-design-simple", inputs: { dialogPageData: "dialogPageData", dialogFormData: "dialogFormData", indicatorList: "indicatorList", fieldList: "fieldList", tableInfo: "tableInfo", showDim: "showDim", isEditor: "isEditor", state: "state", formProp: "formProp", pageConfig: "pageConfig" }, outputs: { actionEvent: "actionEvent" }, viewQueries: [{ propertyName: "dlq", predicate: CdkDropList, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"design-simple\" cdkDropListGroup>\r\n  <div class=\"box-west\">\r\n    <nz-tabset>\r\n      <nz-tab nzTitle=\"\u8BC4\u4F30\u7EF4\u5EA6\" *ngIf=\"showDim\">\r\n        <ng-content></ng-content>\r\n      </nz-tab>\r\n      <nz-tab nzTitle=\"\u7CFB\u7EDF\u9ED8\u8BA4+\u6307\u6807\u5E93\">\r\n        <div class=\"indbox\">\r\n          <deon-field-type-basic2 [dls]=\"dls\" [isDefault]=\"formProp\"></deon-field-type-basic2>\r\n          <deon-field-type-source2 [indicatorList]=\"indicatorList\" [dls]=\"dls\"></deon-field-type-source2>\r\n        </div>\r\n      </nz-tab>\r\n    </nz-tabset>\r\n  </div>\r\n  <div class=\"box-content\">\r\n    <ng-container *ngIf=\"state == 'default'; else tmpEmpty\">\r\n      <div class=\"box-center\">\r\n        <ng-content select=\"[name=content-info]\"></ng-content>\r\n        <div cdkDropList [cdkDropListData]=\"fieldList\" class=\"field-list\"\r\n          [ngClass]=\"{ 'field-list-empty': fieldList == null || fieldList.length == 0 }\"\r\n          (cdkDropListDropped)=\"drop($event)\" [cdkDropListConnectedTo]=\"dls\">\r\n          <ng-container *ngFor=\"let field of fieldList; let index = index\">\r\n            <div class=\"field-box\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag>\r\n              <ng-container [ngSwitch]=\"field.type\">\r\n                <ng-container *ngSwitchCase=\"'grid'\">\r\n                  <div class=\"grid-box\" [ngClass]=\"{ 'grid-active': field?.active == true }\"\r\n                    (click)=\"fieldActive(field, $event)\">\r\n                    <ng-container *ngIf=\"field?.active == true\">\r\n                      <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\r\n                      <div class=\"grid-delete\" *ngIf=\"isEditor != false\">\r\n                        <span nz-icon nzType=\"delete\" (click)=\"deleteFieldIndex(index, $event)\"></span>\r\n                      </div>\r\n                    </ng-container>\r\n                    <div cdkDragHandle style=\"display: none\"></div>\r\n\r\n                    <div nz-row>\r\n                      <ng-container *ngFor=\"let grid of field.fieldGroup\">\r\n                        <div nz-col [nzSpan]=\"grid.props.cols\" cdkDropList [cdkDropListData]=\"grid.fieldGroup\"\r\n                          class=\"field-list\" (cdkDropListDropped)=\"drop($event)\" [cdkDropListConnectedTo]=\"dls\">\r\n                          <div *ngFor=\"let innerItem of grid.fieldGroup\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag\r\n                            class=\"field-box\">\r\n                            <content [field]=\"innerItem\" [state]=\"state\" (click)=\"fieldActive(innerItem, $event)\"\r\n                              (fieldDelEvent)=\"deleteField(innerItem, $event)\">\r\n                              <deon-field-default [field]=\"innerItem\"></deon-field-default>\r\n                            </content>\r\n                          </div>\r\n                        </div>\r\n                      </ng-container>\r\n                    </div>\r\n                  </div>\r\n                </ng-container>\r\n                <ng-container *ngSwitchCase=\"'indicator'\">\r\n                  <div class=\"grid-box indicator-box\" [ngClass]=\"{ 'grid-active': field?.active == true }\"\r\n                    (click)=\"fieldActive(field, $event)\">\r\n                    <ng-container *ngIf=\"field?.active == true\">\r\n                      <div class=\"grid-drag\" cdkDragHandle><span nz-icon nzType=\"drag\"></span></div>\r\n                      <div class=\"grid-delete\" *ngIf=\"isEditor != false\">\r\n                        <span nz-icon nzType=\"delete\" (click)=\"deleteFieldIndex(index, $event)\"></span>\r\n                      </div>\r\n                    </ng-container>\r\n                    <div cdkDragHandle style=\"display: none\"></div>\r\n\r\n                    <div class=\"indicator-info\">\r\n                      <div class=\"indicator-header\">\r\n                        <label nz-checkbox [nzDisabled]=\"!isEditor\" [(ngModel)]=\"field.props.indConfig.izAllowDel\"\r\n                          (click)=\"$event.stopPropagation()\">\u53EF\u5220\u9664\u6B64\u6307\u6807</label>\r\n                        <label nz-checkbox [nzDisabled]=\"!isEditor\" [(ngModel)]=\"field.props.indConfig.izEditName\"\r\n                          (click)=\"$event.stopPropagation()\">\u53EF\u4FEE\u6539\u6307\u6807\u540D\u79F0</label>\r\n                        <label nz-checkbox [nzDisabled]=\"!isEditor\" [(ngModel)]=\"field.props.indConfig.izEditDesc\"\r\n                          (click)=\"$event.stopPropagation()\">\u53EF\u4FEE\u6539\u6307\u6807\u63CF\u8FF0</label>\r\n                        <ng-container *ngIf=\"field.props.indConfig.indType == 'KPI'\">\r\n                          <label nz-checkbox [nzDisabled]=\"!isEditor\" [(ngModel)]=\"field.props.indConfig.izEditWeight\"\r\n                            (click)=\"$event.stopPropagation()\">\u53EF\u4FEE\u6539\u6307\u6807\u6743\u91CD</label>\r\n                        </ng-container>\r\n                      </div>\r\n                      <div class=\"indicator-body\">\r\n                        <ng-container *ngFor=\"let item of field.fieldGroup\">\r\n                          <div class=\"field-box\">\r\n                            <content [field]=\"item\" [state]=\"state\" [isOperation]=\"false\"\r\n                              (click)=\"fieldActive(item, $event)\">\r\n                              <deon-field-default [field]=\"item\"></deon-field-default>\r\n                            </content>\r\n                          </div>\r\n                        </ng-container>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </ng-container>\r\n\r\n                <ng-container *ngSwitchDefault>\r\n                  <content [field]=\"field\" [state]=\"state\" (click)=\"fieldActive(field, $event)\"\r\n                    (fieldDelEvent)=\"deleteFieldIndex(index, $event)\">\r\n                    <deon-field-default [field]=\"field\"></deon-field-default>\r\n                  </content>\r\n                </ng-container>\r\n              </ng-container>\r\n            </div>\r\n          </ng-container>\r\n          <div class=\"field-box test\" [cdkDragDisabled]=\"state == 'view'\" cdkDrag></div>\r\n        </div>\r\n      </div>\r\n      <div class=\"box-east\">\r\n        <nz-tabset>\r\n          <nz-tab nzTitle=\"\u5B57\u6BB5\u5C5E\u6027\">\r\n            <ng-container *ngIf=\"activeField!!; else tmpSetting\">\r\n              <deon-setting-template [dialogPageData]=\"dialogPageData\" [dialogFormData]=\"dialogFormData\"\r\n                [sourceType]=\"sourceType\" [field]=\"activeField\" [tableField]=\"sourceField\" [isEditor]=\"isEditor\"\r\n                (fieldChange)=\"activeFieldChange($event)\" (fieldTypeChange)=\"activeFieldTypeChange($event)\"\r\n                (repeatChange)=\"activeRepeatChange($event)\" (delGridCell)=\"deleteFieldByGrid($event)\">\r\n              </deon-setting-template>\r\n            </ng-container>\r\n            <ng-template #tmpSetting>\r\n              <empty-setting></empty-setting>\r\n            </ng-template>\r\n          </nz-tab>\r\n          <nz-tab nzTitle=\"\u5176\u4ED6\u5C5E\u6027\">\r\n            <ng-content select=\"[name=content-prop]\"></ng-content>\r\n          </nz-tab>\r\n        </nz-tabset>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-template #tmpEmpty>\r\n      <div class=\"default-empty\">\r\n        <div class=\"image\"><img src=\"assets/images/default/empty4.png\" /></div>\r\n        <div class=\"desc\"><span>\u8BF7\u9009\u4E2D\u6307\u6807\u7EF4\u5EA6\u540E\uFF0C\u518D\u914D\u7F6E\u6307\u6807</span></div>\r\n      </div>\r\n    </ng-template>\r\n  </div>\r\n</div>", styles: [".example-container{display:inline-block;width:400px;max-width:100%;margin:0 25px 25px 0;vertical-align:top}.example-list{display:block;min-height:60px;overflow:hidden;background:#fff;border:solid 1px #ccc;border-radius:4px}.example-box{display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;padding:20px 10px;color:#000000de;font-size:14px;background:#fff;border-bottom:solid 1px #ccc;cursor:move}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.field-list.cdk-drop-list-dragging .field-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep{flex:1}:host ::ng-deep .field-list{padding:15px 12px 0}:host ::ng-deep .field-list-empty{height:100%}:host ::ng-deep .field-box{width:100%;margin:0 0 15px}:host ::ng-deep .field-box .required:before{color:red;content:\"*\"}:host ::ng-deep .field-box .layout-default deon-field-default{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .field-box .layout-default deon-field-default deon-design-simple-label{width:120px;max-width:120px;padding:0 15px 0 0;text-align:right}:host ::ng-deep .field-box .layout-default deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box .layout-upDown deon-field-default{display:flex;flex-direction:column}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-design-simple-label{margin:0 0 6px}:host ::ng-deep .field-box .layout-upDown deon-field-default deon-field-template{flex:1}:host ::ng-deep .field-box deon-field-textarea,:host ::ng-deep .field-box nz-select,:host ::ng-deep .field-box nz-date-picker,:host ::ng-deep .field-box nz-input-number{width:100%}:host ::ng-deep .grid-box{width:100%;min-height:50px}:host ::ng-deep .grid-box .ant-row{min-height:50px}:host ::ng-deep .grid-box .ant-col{border:1px dashed #ccc}:host ::ng-deep .grid-box .ant-col+.ant-col{border-left:0}:host ::ng-deep .grid-box .grid-list{height:100%;min-height:50px;padding:8px}:host ::ng-deep .grid-box .grid-list .list-box+.list-box .el-item{margin-top:8px}:host ::ng-deep .grid-active,:host ::ng-deep .repeat-active{position:relative;border:1px solid #e6a23c;outline:2px solid #e6a23c}:host ::ng-deep .grid-active .grid-drag,:host ::ng-deep .repeat-active .grid-drag{position:absolute;top:-2px;bottom:-18px;left:-2px;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:move}:host ::ng-deep .grid-active .grid-delete,:host ::ng-deep .repeat-active .grid-delete{position:absolute;right:0;bottom:0;z-index:9;width:26px;height:28px;color:#fff;line-height:28px;text-align:center;background:#e6a23c;cursor:pointer}:host ::ng-deep .indicator-box{position:relative;display:inline-block;width:100%;padding:0 0 15px;border:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .indicator-box .indicator-header{padding:12px 10px;border-bottom:1px dashed hsla(0,0%,67%,.7)}:host ::ng-deep .indicator-box .indicator-body{padding:15px}:host ::ng-deep .ant-tabs-tabpane{overflow:auto;overflow-x:overlay;overflow-y:overlay}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar{width:8px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-thumb{background-color:#94949475;border-radius:7px}:host ::ng-deep .ant-tabs-tabpane::-webkit-scrollbar-track{background-color:#fff}:host ::ng-deep .field-empty{height:300px;text-align:center}:host ::ng-deep .repeat-empty{padding:30px 0 0;text-align:center}:host ::ng-deep empty-field{display:inline-block;width:150px;margin:150px 80px;text-align:center}:host ::ng-deep empty-field img{width:100%;margin:auto;text-align:center}:host ::ng-deep empty-setting{display:inline-block;width:auto;margin:100px 80px;text-align:center}:host ::ng-deep empty-setting img{width:100%;margin:auto;text-align:center}:host ::ng-deep .box-west{width:248px}:host ::ng-deep .box-west .indbox{flex:1;display:flex;flex-direction:column}:host ::ng-deep .default-empty{margin:auto;text-align:center}:host ::ng-deep .default-empty img{width:150px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: NzTabsModule }, { kind: "component", type: i7$2.NzTabSetComponent, selector: "nz-tabset", inputs: ["nzSelectedIndex", "nzTabPosition", "nzTabBarExtraContent", "nzCanDeactivate", "nzAddIcon", "nzTabBarStyle", "nzType", "nzSize", "nzAnimated", "nzTabBarGutter", "nzHideAdd", "nzCentered", "nzHideAll", "nzLinkRouter", "nzLinkExact", "nzDestroyInactiveTabPane"], outputs: ["nzSelectChange", "nzSelectedIndexChange", "nzTabListScroll", "nzClose", "nzAdd"], exportAs: ["nzTabset"] }, { kind: "component", type: i7$2.NzTabComponent, selector: "nz-tab", inputs: ["nzTitle", "nzClosable", "nzCloseIcon", "nzDisabled", "nzForceRender"], outputs: ["nzSelect", "nzDeselect", "nzClick", "nzContextmenu"], exportAs: ["nzTab"] }, { kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i3$1.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "ngmodule", type: NzGridModule }, { kind: "directive", type: i9.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i9.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "ngmodule", type: NzTableModule }, { kind: "ngmodule", type: NzPopoverModule }, { kind: "ngmodule", type: NzCheckboxModule }, { kind: "component", type: i7.NzCheckboxComponent, selector: "[nz-checkbox]", inputs: ["nzValue", "nzAutoFocus", "nzDisabled", "nzIndeterminate", "nzChecked", "nzId", "nzName"], outputs: ["nzCheckedChange"], exportAs: ["nzCheckbox"] }, { kind: "component", type: EmptySettingComponent, selector: "empty-setting" }, { kind: "component", type: DeonDesignFieldTypeBasic2, selector: "deon-field-type-basic2", inputs: ["dls", "isDefault"] }, { kind: "component", type: DeonDesignFieldTypeSource2, selector: "deon-field-type-source2", inputs: ["dls", "indicatorList"] }, { kind: "component", type: DeonDesignFieldDefault, selector: "deon-field-default", inputs: ["field"] }, { kind: "component", type: 
                 //DeonDesignFieldTemplate,
-                DeonDesignSettingTemplate, selector: "deon-setting-template", inputs: ["dialogPageData", "dialogFormData", "sourceType", "tableField", "isEditor", "field"], outputs: ["fieldChange", "fieldTypeChange", "repeatChange", "delGridCell"] }, { kind: "component", type: ContentComponent, selector: "content", inputs: ["state", "field", "isOperation"], outputs: ["fieldDelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+                DeonDesignSettingTemplate, selector: "deon-setting-template", inputs: ["listField", "dialogPageData", "dialogFormData", "sourceType", "tableField", "isEditor", "field"], outputs: ["fieldChange", "fieldTypeChange", "repeatChange", "delGridCell"] }, { kind: "component", type: ContentComponent, selector: "content", inputs: ["state", "field", "isOperation"], outputs: ["fieldDelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: KPIDesignSimpleComponent, decorators: [{
             type: Component,