import { Component } from '@angular/core';
import { FormLayout } from 'ng-devui';
import { FormCodeEditorComponent } from '../form-code-editor/form-code-editor.component';
import { ControlType } from '../model/boxInfo';
import * as i0 from "@angular/core";
import * as i1 from "../service/common.service";
import * as i2 from "ng-devui";
import * as i3 from "@angular/common";
import * as i4 from "@angular/forms";
export class FormAttributeComponent {
    constructor(commonService, modalService) {
        this.commonService = commonService;
        this.modalService = modalService;
        this.controlType = ControlType;
        this.tab1acticeID = 'tab2';
        this.isDisable = true;
        this.layoutDirection = FormLayout.Vertical;
        this.alerttype = ["success", "danger", "warning", "info"];
        this.direction = ["row", "column"];
        this.datetype = ["date", "range"];
        this.dateFormat = ["y/MM/dd", 'y/MM/dd HH:mm:ss', 'y-MM-dd HH:mm:ss', 'yy.MM.dd HH:mm', 'MM/dd/y HH:mm:ss', 'MM/dd/yy HH:mm'];
        this.timeFormat = ['hh:mm:ss', 'mm:HH:SS', 'hh:mm', 'MM:ss'];
        this.alignFormat = [{ label: "居中", value: "is-center" }, { label: "居左", value: "is-left" }, { label: "居右", value: "is-right" }];
        this.responseType = ["arraybuffer", "blob", "json", "text"];
        this.validatorType = ["请选择", "required", "minlength", "maxlength", "min", "max", "email", "pattern", "whitespace"];
        this.validators = [];
        this.msgs = [];
        this.layoutOptions = [
            {
                value: "horizontal",
                name: "水平布局"
            },
            {
                value: "vertical",
                name: "垂直布局"
            },
            {
                value: "columns",
                name: "纵列布局"
            },
        ];
        this.labelSizeOptions = [
            {
                value: "sm",
                name: "小号"
            },
            {
                value: "",
                name: "中等"
            },
            {
                value: "lg",
                name: "大号"
            },
        ];
        this.labelAlignOptions = [
            {
                value: "start",
                name: "左对齐"
            },
            {
                value: "center",
                name: "居中"
            },
            {
                value: "end",
                name: "右对齐"
            },
        ];
        this.methodtype = ["GET", "POST", "PUT", "DELETE"];
        this.canvasInfo = {
            layout: this.layoutOptions[1],
            labelSize: this.labelSizeOptions[1],
            labelAlign: this.labelAlignOptions[0]
        };
    }
    ngOnInit() {
        this.commonService.attiEvent.subscribe(o => {
            this.formData = o;
            this.validators = [];
            if (o && o.itemselected && o.controltype != ControlType.Row) {
                this.tab1acticeID = "tab1";
                this.isDisable = false;
                this.activeLayout = o.controltype;
                const rules = o.rules;
                if (rules && rules.validators && rules.validators.length > 0) {
                    for (let index = 0; index < rules.validators.length; index++) {
                        const key = Object.keys(rules.validators[index])[0];
                        const value = Object.values(rules.validators[index])[0];
                        this.validators.push({
                            validatortype: { label: key, disabled: false },
                            oldvalidatortype: "请选择",
                            value: value,
                            validatorOptions: this.validatorType.filter(x => this.showOptions(x)).map(x => {
                                return { label: x, disabled: false };
                            })
                        });
                    }
                }
                else {
                    this.validators.push({
                        validatortype: { label: "请选择", disabled: false }, oldvalidatortype: "请选择", validatorOptions: this.validatorType.filter(x => this.showOptions(x)).map(o => {
                            return { label: o, disabled: false };
                        })
                    });
                }
            }
            else {
                this.tab1acticeID = "tab2";
                this.activeLayout = null;
                this.isDisable = true;
            }
        });
        this.commonService.removeItemClickObservable.subscribe(() => {
            this.activeLayout = null;
            this.tab1acticeID = "tab2";
            this.isDisable = true;
        });
    }
    onchange() {
        this.commonService.changeFormLayout.emit({
            layout: this.canvasInfo.layout.value,
            labelSize: this.canvasInfo.labelSize.value,
            labelAlign: this.canvasInfo.labelAlign.value
        });
    }
    showCodeEditor(setValue, type) {
        const results = this.modalService.open({
            id: 'dialog-service',
            width: '650px',
            component: FormCodeEditorComponent,
            backdropCloseable: true,
            data: {
                code: JSON.stringify(setValue),
                onClose: (event) => {
                    results.modalInstance.hide();
                },
                showerror: (o) => { this.msgs = o; },
                change: (o) => {
                    switch (type) {
                        case "options":
                            this.formData.options = JSON.parse(o);
                            break;
                        case "postdata.data":
                            this.formData.postdata.data = JSON.parse(o);
                            break;
                        case "postdata.head":
                            this.formData.postdata.head = JSON.parse(o);
                            break;
                        case "uploadOptions.additionalParameter":
                            this.formData.uploadOptions.additionalParameter = JSON.parse(o);
                            break;
                        case "uploadOptions.headers":
                            this.formData.uploadOptions.headers = JSON.parse(o);
                            break;
                        default:
                            break;
                    }
                }
            }
        });
    }
    onTestData(e) {
        this.commonService.testEvent.emit(e);
    }
    onChangeDateTypeOrFormat() {
        if (this.formData.datetype == "date") {
            this.formData.placeholder = this.formData.dateFormat;
        }
        else {
            this.formData.placeholder = this.formData.dateFormat + " - " + this.formData.dateFormat;
        }
        this.formData.defaultvalue = "";
    }
    onChangeTimeFormat() {
        this.formData.placeholder = this.formData.format;
    }
    onChangeAlignFormat(e) {
        this.formData.align = e.value;
    }
    onAddValidationRule() {
        var options = this.validatorType.filter(x => this.showOptions(x)).map(o => {
            var isDisabled = false;
            for (let index = 0; index < this.validators.length; index++) {
                const element = this.validators[index].validatortype;
                if (element.label == o && element.label != "请选择") {
                    isDisabled = true;
                    break;
                }
            }
            return { label: o, disabled: isDisabled };
        });
        this.validators.push({ validatortype: { label: "请选择", disabled: false }, oldvalidatortype: "请选择", validatorOptions: options });
    }
    onRemoveRule(value) {
        const rule = this.validators.splice(value, 1);
        if (rule[0].validatortype.label != "请选择") {
            this.changeOption(o => {
                var returnValue = false;
                if (o.label == rule[0].validatortype.label) {
                    o.disabled = false;
                    returnValue = true;
                }
                return returnValue;
            });
        }
    }
    onChangeItem(value, item) {
        switch (value.label) {
            case "required":
            case "email":
            case "whitespace":
                item["value"] = true;
                break;
            case "minlength":
            case "maxlength":
            case "min":
            case "max":
                item["value"] = 0;
                break;
            default:
                item["value"] = "";
                break;
        }
        this.changeTheValidateRules(item, value.label);
        this.changeOption(o => {
            if (o.label == value.label && o.label != "请选择") {
                o.disabled = true;
            }
            if (o.label == item["oldvalidatortype"]) {
                o.disabled = false;
            }
            return false;
        });
        item["oldvalidatortype"] = value.label;
    }
    onChangeValidateValue(item) {
        this.changeTheValidateRules(item, item.validatortype.label);
    }
    changeOption(fn) {
        for (let i = 0; i < this.validators.length; i++) {
            const options = this.validators[i].validatorOptions;
            for (let j = 0; j < options.length; j++) {
                const element = options[j];
                if (fn(element)) {
                    break;
                }
            }
        }
    }
    changeTheValidateRules(item, value) {
        const rules = this.formData.rules.validators;
        if (item["oldvalidatortype"] != "请选择" && value != "请选择") {
            const rule = this.findRule(item);
            delete rule[item["oldvalidatortype"]];
            if (value == "pattern") {
                rule[value] = new RegExp(item["value"]);
            }
            else {
                rule[value] = item["value"];
            }
        }
        else if (value != "请选择" && item["oldvalidatortype"] == "请选择") {
            var obj = Object.create(null);
            if (value == "pattern") {
                obj[value] = new RegExp(item["value"]);
            }
            else {
                obj[value] = item["value"];
            }
            rules.push(obj);
        }
        else {
            var index = 0;
            this.findRule(item, o => {
                index = o;
            });
            if (index == 0) {
                rules.splice(-1, 1);
            }
            else {
                rules.splice(index, 1);
            }
        }
    }
    showOptions(option) {
        switch (this.activeLayout) {
            case ControlType.Input:
                return true;
            case ControlType.Select:
                return option == "required" || option == "min" || option == "max" || option == "请选择";
            default:
                return option == "required" || option == "请选择";
        }
    }
    findRule(item, fn = null) {
        const rules = this.formData.rules.validators;
        var rule = {};
        for (let index = 0; index < rules.length; index++) {
            const element = rules[index];
            if (Object.hasOwnProperty.bind(element)(item["oldvalidatortype"])) {
                rule = element;
                if (fn != null) {
                    fn(index);
                }
                break;
            }
        }
        return rule;
    }
}
FormAttributeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: FormAttributeComponent, deps: [{ token: i1.CommonService }, { token: i2.ModalService }], target: i0.ɵɵFactoryTarget.Component });
FormAttributeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: FormAttributeComponent, selector: " form-attribute", ngImport: i0, template: "<section class=\"space\">\r\n    <d-toast [value]=\"msgs\"></d-toast>\r\n    <d-tabs [(activeTab)]=\"tab1acticeID\"  class=\"tabcenter\">\r\n        <d-tab id=\"tab1\" title=\"\u63A7\u4EF6\u5C5E\u6027\" tabId=\"tab1\" [disabled]=\"isDisable\">\r\n          <ng-template dTabContent>\r\n            <ng-container [ngSwitch]=\"activeLayout\">\r\n              <ng-container *ngSwitchCase=\"controlType.Input\" [ngTemplateOutlet]=\"input\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.RichIput\" [ngTemplateOutlet]=\"richinput\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Counter\" [ngTemplateOutlet]=\"counter\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Toggle\" [ngTemplateOutlet]=\"toggle\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Select\" [ngTemplateOutlet]=\"select\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Alert\" [ngTemplateOutlet]=\"alert\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Check\" [ngTemplateOutlet]=\"check\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Radio\" [ngTemplateOutlet]=\"radio\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Date\" [ngTemplateOutlet]=\"date\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Time\" [ngTemplateOutlet]=\"time\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Rate\" [ngTemplateOutlet]=\"rate\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Space\" [ngTemplateOutlet]=\"space\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Divider\" [ngTemplateOutlet]=\"divider\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Upload\" [ngTemplateOutlet]=\"upload\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Slide\" [ngTemplateOutlet]=\"slide\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Transfer\" [ngTemplateOutlet]=\"transfer\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Tree\" [ngTemplateOutlet]=\"tree\"></ng-container>\r\n              <ng-container *ngSwitchDefault></ng-container>\r\n            </ng-container>\r\n          </ng-template>\r\n        </d-tab>\r\n    \r\n        <d-tab id=\"tab2\" title=\"\u8868\u5355\u5C5E\u6027\" tabId=\"tab2\">\r\n          <ng-template dTabContent>\r\n            <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n              <d-form-item>\r\n                <d-form-label>\u8868\u5355\u5E03\u5C40</d-form-label>\r\n                <d-form-control>\r\n                  <d-select [options]=\"layoutOptions\" name=\"layout\" [filterKey]=\"'name'\" [(ngModel)]=\"canvasInfo.layout\" (valueChange)=\"onchange()\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>label\u5360\u5BBD</d-form-label>\r\n                <d-form-control>\r\n                  <d-select [options]=\"labelSizeOptions\" name=\"labelSize\" [filterKey]=\"'name'\" [(ngModel)]=\"canvasInfo.labelSize\" (valueChange)=\"onchange()\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>label\u5BF9\u9F50</d-form-label>\r\n                <d-form-control>\r\n                  <d-select [options]=\"labelAlignOptions\" name=\"labelAlign\" [filterKey]=\"'name'\" [(ngModel)]=\"canvasInfo.labelAlign\" (valueChange)=\"onchange()\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n            </form>\r\n          </ng-template>\r\n        </d-tab>\r\n    </d-tabs>\r\n</section>\r\n<ng-template #common>\r\n  <d-form-item>\r\n    <d-form-label>\u6807\u7B7E\u540D</d-form-label>\r\n    <d-form-control>\r\n      <input dTextInput name=\"labelName\" [(ngModel)]=\"formData.label\"/>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-form-label>\u63A7\u4EF6\u540D\u79F0</d-form-label>\r\n    <d-form-control>\r\n      <input dTextInput name=\"controlName\" [(ngModel)]=\"formData.controlname\"/>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-row>\r\n      <d-col [dSpan]=\"12\">\r\n        <d-form-label>\u662F\u5426\u7981\u7528</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"disabled\" [(ngModel)]=\"formData.disabled\"></d-toggle>\r\n      </d-form-control>\r\n      </d-col>\r\n      <d-col [dSpan]=\"12\">\r\n        <d-form-label>\u662F\u5426\u5FC5\u586B</d-form-label>\r\n        <d-form-control>\r\n          <d-toggle name=\"required\" [(ngModel)]=\"formData.required\"></d-toggle>\r\n        </d-form-control>\r\n      </d-col>\r\n    </d-row>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-form-label>\u662F\u5426\u5E2E\u52A9</d-form-label>\r\n    <d-form-control>\r\n      <d-toggle name=\"help\" [(ngModel)]=\"formData.help\"></d-toggle>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item *ngIf=\"formData.help\">\r\n    <d-form-label>\u5E2E\u52A9\u6587\u672C</d-form-label>\r\n    <d-form-control>\r\n      <input dTextInput name=\"helptip\" [(ngModel)]=\"formData.helptip\" />\r\n    </d-form-control>\r\n  </d-form-item>\r\n</ng-template>\r\n\r\n<ng-template #input>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u5360\u4F4D\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"placeholder\" [(ngModel)]=\"formData.placeholder\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #transfer>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u6E90\u5934\u6807\u9898</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"source\" [(ngModel)]=\"formData.source\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u76EE\u6807\u6807\u9898</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"target\" [(ngModel)]=\"formData.target\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #tree>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u5360\u4F4D\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"placeholder\" [(ngModel)]=\"formData.placeholder\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #richinput>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #counter>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"defaultName\" [step]=\"1\" [(ngModel)]=\"formData.defaultvalue\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-row>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5C0F\u503C</d-form-label>\r\n          <d-form-control>\r\n            <d-input-number name=\"min\" [step]=\"1\" [(ngModel)]=\"formData.min\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5927\u503C</d-form-label>\r\n            <d-form-control>\r\n            <d-input-number name=\"max\" [step]=\"1\" [(ngModel)]=\"formData.max\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n      </d-row>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-row>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6B65\u957F</d-form-label>\r\n          <d-form-control>\r\n            <d-input-number name=\"step\" [step]=\"1\" [(ngModel)]=\"formData.step\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u5355\u4F4D</d-form-label>\r\n          <d-form-control>\r\n            <input dTextInput name=\"unit\" [(ngModel)]=\"formData.unit\"/>\r\n          </d-form-control>\r\n        </d-col>\r\n      </d-row>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #toggle>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #select>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <!-- <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\" />\r\n      </d-form-control>\r\n    </d-form-item> -->\r\n    <d-form-item>\r\n      <d-form-label>\u5360\u4F4D\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"placeholder\" [(ngModel)]=\"formData.placeholder\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u5B57\u6BB5</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"filter\" [(ngModel)]=\"formData.filter\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u591A\u9009</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"multiple\" [(ngModel)]=\"formData.multiple\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #data>\r\n  <d-form-item>\r\n    <d-form-label>\u6570\u636E\u9009\u9879</d-form-label>\r\n    <d-form-control>\r\n      <d-tabs [(activeTab)]=\"formData.dataType\" type=\"options\" customWidth=\"100px\">\r\n        <d-tab [id]=\"'static'\" title=\"\u9759\u6001\u6570\u636E\">\r\n          <ng-template dTabContent>\r\n            <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.options,'options')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n          </ng-template>\r\n        </d-tab>\r\n        <d-tab [id]=\"'interface'\" title=\"\u63A5\u53E3\u6570\u636E\">\r\n          <ng-template dTabContent>\r\n            <div class=\"tabshow\">\r\n              <d-form-item>\r\n                <d-form-label>\u63A5\u53E3</d-form-label>\r\n                <d-form-control>\r\n                  <input dTextInput name=\"url\" [(ngModel)]=\"formData.postdata.url\" />\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>\u8BF7\u6C42\u65B9\u5F0F</d-form-label>\r\n                <d-form-control>\r\n                  <d-select name=\"method\" [placeholder]=\"'\u8BF7\u9009\u62E9'\" [options]=\"methodtype\" [(ngModel)]=\"formData.postdata.method\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>\u9644\u5E26\u6570\u636E</d-form-label>\r\n                <d-form-control>\r\n                  <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.postdata.data,'postdata.data')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>\u5934\u90E8\u4FE1\u606F</d-form-label>\r\n                <d-form-control>\r\n                  <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.postdata.head,'postdata.head')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item *ngIf=\"formData.controltype != controlType.Tree\">\r\n                <d-form-label>\u89E3\u6790\u51FD\u6570</d-form-label>\r\n                <d-form-control>\r\n                  <textarea dTextarea placeholder=\"\u8BF7\u8F93\u5165\" name=\"function\" [(ngModel)]=\"formData.postdata.function\"></textarea>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-control>\r\n                  <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"onTestData(formData.name)\">\u8F7D\u5165\u6570\u636E</d-button>\r\n                </d-form-control>\r\n              </d-form-item>\r\n            </div>\r\n          </ng-template>\r\n        </d-tab>\r\n      </d-tabs>\r\n    </d-form-control>\r\n  </d-form-item>\r\n</ng-template>\r\n\r\n<ng-template #alert>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"label\" [(ngModel)]=\"formData.label\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u8B66\u544A\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"alerttype\" name=\"alerttype\" [(ngModel)]=\"formData.alerttype\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u5173\u95ED</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"closeable\" [(ngModel)]=\"formData.closeable\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #check>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u65B9\u5411</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"direction\" name=\"direction\" [(ngModel)]=\"formData.direction\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u6807\u9898</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"isshowtitle\" [(ngModel)]=\"formData.isshowtitle\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u5B57\u6BB5</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"filter\" [(ngModel)]=\"formData.filter\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #radio>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u65B9\u5411</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"direction\" name=\"direction\" [(ngModel)]=\"formData.direction\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #date>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u65E5\u671F\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"datetype\" name=\"datetype\" [(ngModel)]=\"formData.datetype\" (valueChange)=\"onChangeDateTypeOrFormat()\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u65E5\u671F\u683C\u5F0F</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"dateFormat\" name=\"dateFormat\" [(ngModel)]=\"formData.dateFormat\" (valueChange)=\"onChangeDateTypeOrFormat()\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u663E\u793A\u65F6\u95F4</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"showtime\" [(ngModel)]=\"formData.showtime\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #time>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u65E5\u671F\u683C\u5F0F</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"timeFormat\" name=\"format\" [(ngModel)]=\"formData.format\" (valueChange)=\"onChangeTimeFormat()\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #rate>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"defaultName\" [step]=\"1\" [(ngModel)]=\"formData.defaultvalue\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u534A\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"allowhalf\" [(ngModel)]=\"formData.allowhalf\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #space>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9AD8\u5EA6</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"height\" [step]=\"1\" [(ngModel)]=\"formData.height\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #divider>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"label\" [(ngModel)]=\"formData.label\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6587\u672C\u4F4D\u7F6E</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"alignFormat\"[(ngModel)]=\"formData.alignvalue\" name=\"align\" [filterKey]=\"'label'\" (valueChange)=\"onChangeAlignFormat($event)\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #upload>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u63A5\u53E3</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"url\" [(ngModel)]=\"formData.uploadOptions.uri\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u8BF7\u6C42\u65B9\u5F0F</d-form-label>\r\n      <d-form-control>\r\n        <d-select name=\"method\" [placeholder]=\"'\u8BF7\u9009\u62E9'\" [options]=\"methodtype\" [(ngModel)]=\"formData.uploadOptions.method\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u9644\u5E26\u6570\u636E</d-form-label>\r\n      <d-form-control>\r\n        <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.uploadOptions.additionalParameter,'uploadOptions.additionalParameter')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u5934\u90E8\u4FE1\u606F</d-form-label>\r\n      <d-form-control>\r\n        <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.uploadOptions.headers,'uploadOptions.headers')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u4E0A\u4F20\u6587\u4EF6\u5927\u5C0F\u9650\u5236</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"maximumSize\" [step]=\"1\" [(ngModel)]=\"formData.uploadOptions.maximumSize\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6587\u4EF6\u540D\u79F0</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"fileFieldName\" [(ngModel)]=\"formData.uploadOptions.fileFieldName\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u8FD4\u56DE\u6570\u636E\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"responseType\" name=\"responseType\" [(ngModel)]=\"formData.uploadOptions.responseType\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6587\u4EF6\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"accept\" [(ngModel)]=\"formData.fileOptions.accept\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u53EF\u9009\u62E9\u591A\u4E2A\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"multiple\" [(ngModel)]=\"formData.fileOptions.multiple\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #validator>\r\n  <d-form-item style=\"margin: 0px;\">\r\n    <d-form-control>\r\n      <div class=\"form-divider form-divider-horizontal\">\r\n          <div class=\"form-divider__text is-center\">\u63A7\u4EF6\u9A8C\u8BC1</div>\r\n      </div>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-row *ngFor=\"let validator of validators;index as i;\">\r\n      <d-col [dSpan]=\"8\" style=\"padding-right: 3px;\">\r\n        <d-form-label>\u9A8C\u8BC1\u7C7B\u578B</d-form-label>\r\n        <d-form-control>\r\n          <d-select name=\"validatortype\" \r\n          (valueChange)=\"onChangeItem($event,validator)\" \r\n          [placeholder]=\"'\u8BF7\u9009\u62E9'\" \r\n          [filterKey]=\"'label'\" \r\n          [optionDisabledKey]=\"'disabled'\" \r\n          [options]=\"validator.validatorOptions\" \r\n          [(ngModel)]=\"validator.validatortype\"></d-select>\r\n        </d-form-control>\r\n      </d-col>\r\n      <d-col [dSpan]=\"12\">\r\n        <d-form-label>\u503C</d-form-label>\r\n        <d-form-control>\r\n          <ng-container [ngSwitch]=\"validator.validatortype.label\">\r\n            <ng-container *ngSwitchCase=\"'required'\" [ngTemplateOutlet]=\"required\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'email'\" [ngTemplateOutlet]=\"required\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'whitespace'\" [ngTemplateOutlet]=\"required\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'pattern'\" [ngTemplateOutlet]=\"pattern\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'minlength'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:5,max:128};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'maxlength'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:5,max:128};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'min'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:0,max:100};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'max'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:0,max:100};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchDefault></ng-container>\r\n          </ng-container>\r\n          <ng-template #pattern>\r\n            <input dTextInput name=\"value\" [(ngModel)]=\"validator.value\" (change)=\"onChangeValidateValue(validator)\"/>\r\n          </ng-template>\r\n          <ng-template #required>\r\n            <div style=\"padding-top: 3px;\">\r\n              <d-toggle [color]=\"'#50D4AB'\" [disabled]=\"true\"  [(ngModel)]=\"validator.value\" [checkedContent]=\"iconCheckedContent\" [uncheckedContent]=\"iconUncheckedContent\"></d-toggle>\r\n              <ng-template #iconCheckedContent>\r\n                <div class=\"toggle-inner\">\r\n                  <i class=\"icon-right\"></i>\r\n                </div>\r\n              </ng-template>\r\n              <ng-template #iconUncheckedContent>\r\n                <div class=\"toggle-inner\">\r\n                  <i class=\"icon-error\"></i>\r\n                </div>\r\n              </ng-template>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template #num let-min let-max =\"max\">\r\n            <d-input-number name=\"height\" [min]=\"min\" [max]=\"max\" [step]=\"1\" style=\"width: 100%;\" [(ngModel)]=\"validator.value\" (ngModelChange)=\"onChangeValidateValue(validator)\"></d-input-number>\r\n          </ng-template>\r\n        </d-form-control>\r\n      </d-col>\r\n      <d-col [dSpan]=\"4\">\r\n        <div class=\"btn-group\">\r\n          <d-button icon=\"fc-icon icon-add icon-font\" bsStyle=\"text-dark\" title=\"\u6DFB\u52A0\" width=\"21px\" (btnClick)=\"onAddValidationRule()\"></d-button>\r\n          <d-button icon=\"fc-icon icon-delete icon-font\" bsStyle=\"text-dark\" [disabled]=\"validators.length==1\" title=\"\u5220\u9664\" width=\"22px\" (btnClick)=\"onRemoveRule(i)\"></d-button>\r\n        </div>\r\n      </d-col>\r\n    </d-row>\r\n  </d-form-item>\r\n</ng-template>\r\n\r\n<ng-template #slide>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"defaultName\" [step]=\"1\" [(ngModel)]=\"formData.defaultvalue\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-row>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5C0F\u503C</d-form-label>\r\n          <d-form-control>\r\n            <d-input-number name=\"min\" [step]=\"1\" [(ngModel)]=\"formData.min\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5927\u503C</d-form-label>\r\n            <d-form-control>\r\n            <d-input-number name=\"max\" [step]=\"1\" [(ngModel)]=\"formData.max\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n      </d-row>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6B65\u957F</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"step\" [step]=\"1\" [(ngModel)]=\"formData.step\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>", styles: [".space{width:100%;padding:0 10px 10px}:host form{width:330px;padding:0 10px}.tabshow{border:2px solid var(--devui-brand, #5e7ce0);padding:5px}:host ::ng-deep section>d-tabs>ul{position:sticky;padding-top:10px;background:#fff!important;top:0;z-index:16}:host ::ng-deep .btn-group d-button .icon-font{font-size:16px}.btn-group{margin-top:18px}.form-divider{background-color:#dcdfe6;position:relative}.form-divider-horizontal{display:block;height:1px;width:100%;margin:24px 0}.form-divider__text{position:absolute;background-color:#fff;padding:0 20px;color:#303133}.form-divider__text.is-center{left:50%;transform:translate(-50%) translateY(-50%)}\n"], components: [{ type: i2.ToastComponent, selector: "d-toast", inputs: ["sticky", "life", "style", "styleClass", "lifeMode", "value"], outputs: ["closeEvent", "valueChange"] }, { type: i2.TabsComponent, selector: "d-tabs", inputs: ["type", "showContent", "activeTab", "vertical", "cssClass", "customWidth", "beforeChange", "reactivable"], outputs: ["activeTabChange"], exportAs: ["tabs"] }, { type: i2.TabComponent, selector: "d-tab", inputs: ["tabId", "id", "title", "disabled"] }, { type: i2.FormItemComponent, selector: "d-form-item", inputs: ["dFeedbackType", "dHasFeedback"] }, { type: i2.FormLabelComponent, selector: "d-form-label", inputs: ["required", "hasHelp", "helpTips"] }, { type: i2.FormControlComponent, selector: "d-form-control", inputs: ["extraInfo", "feedbackStatus", "suffixTemplate"] }, { type: i2.SelectComponent, selector: "d-select", inputs: ["options", "isSearch", "toggleOnFocus", "scrollHight", "highlightItemClass", "filterKey", "multiple", "isSelectAll", "readonly", "size", "appendToBody", "appendToBodyDirections", "width", "templateItemSize", "disabled", "placeholder", "searchPlaceholder", "searchFn", "valueParser", "formatter", "direction", "overview", "allowClear", "color", "enableLazyLoad", "virtualScroll", "inputItemTemplate", "extraConfig", "optionDisabledKey", "optionImmutableKey", "noResultItemTemplate", "keepMultipleOrder", "customViewTemplate", "customViewDirection", "autoFocus", "notAutoScroll", "loadingTemplateRef", "showAnimation"], outputs: ["valueChange", "toggleChange", "loadMore"], exportAs: ["select"] }, { type: i2.DRowComponent, selector: "d-row", inputs: ["dCols"] }, { type: i2.DColComponent, selector: "d-col", inputs: ["dSpan", "dOffset", "dPush", "dPull"] }, { type: i2.ToggleComponent, selector: "d-toggle", inputs: ["size", "color", "beforeChange", "checkedContent", "uncheckedContent", "checked", "disabled"], outputs: ["change"], exportAs: ["toggle"] }, { type: i2.InputNumberComponent, selector: "d-input-number", inputs: ["step", "disabled", "size", "decimalLimit", "autoFocus", "allowEmpty", "placeholder", "maxLength", "reg", "min", "max"], outputs: ["afterValueChanged", "whileValueChanging"] }, { type: i2.ButtonComponent, selector: "d-button", inputs: ["id", "type", "bsStyle", "bsSize", "bsPosition", "bordered", "icon", "disabled", "showLoading", "width", "autofocus", "loadingTemplateRef"], outputs: ["btnClick"] }], directives: [{ type: i2.TabContentDirective, selector: "[dTabContent]" }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.FormDirective, selector: "[dForm]", inputs: ["layout", "labelSize", "labelAlign", "dFeedbackType", "dHasFeedback"], outputs: ["dSubmit"], exportAs: ["dForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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]" }, { type: i2.TextDirective, selector: "[dTextInput]", inputs: ["error", "size"], exportAs: ["dTextInput"] }, { type: i2.DFlexDirective, selector: "[dFlex], d-row, d-col", inputs: ["dFlex", "dFlexContainer", "dOrder", "dAlign", "dAlignSelf", "dJustify", "dFlexWrap"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.TextareaDirective, selector: "[dTextarea]", inputs: ["resize", "error"], exportAs: ["dTextarea"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: FormAttributeComponent, decorators: [{
            type: Component,
            args: [{ selector: ' form-attribute', template: "<section class=\"space\">\r\n    <d-toast [value]=\"msgs\"></d-toast>\r\n    <d-tabs [(activeTab)]=\"tab1acticeID\"  class=\"tabcenter\">\r\n        <d-tab id=\"tab1\" title=\"\u63A7\u4EF6\u5C5E\u6027\" tabId=\"tab1\" [disabled]=\"isDisable\">\r\n          <ng-template dTabContent>\r\n            <ng-container [ngSwitch]=\"activeLayout\">\r\n              <ng-container *ngSwitchCase=\"controlType.Input\" [ngTemplateOutlet]=\"input\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.RichIput\" [ngTemplateOutlet]=\"richinput\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Counter\" [ngTemplateOutlet]=\"counter\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Toggle\" [ngTemplateOutlet]=\"toggle\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Select\" [ngTemplateOutlet]=\"select\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Alert\" [ngTemplateOutlet]=\"alert\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Check\" [ngTemplateOutlet]=\"check\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Radio\" [ngTemplateOutlet]=\"radio\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Date\" [ngTemplateOutlet]=\"date\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Time\" [ngTemplateOutlet]=\"time\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Rate\" [ngTemplateOutlet]=\"rate\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Space\" [ngTemplateOutlet]=\"space\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Divider\" [ngTemplateOutlet]=\"divider\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Upload\" [ngTemplateOutlet]=\"upload\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Slide\" [ngTemplateOutlet]=\"slide\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Transfer\" [ngTemplateOutlet]=\"transfer\"></ng-container>\r\n              <ng-container *ngSwitchCase=\"controlType.Tree\" [ngTemplateOutlet]=\"tree\"></ng-container>\r\n              <ng-container *ngSwitchDefault></ng-container>\r\n            </ng-container>\r\n          </ng-template>\r\n        </d-tab>\r\n    \r\n        <d-tab id=\"tab2\" title=\"\u8868\u5355\u5C5E\u6027\" tabId=\"tab2\">\r\n          <ng-template dTabContent>\r\n            <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n              <d-form-item>\r\n                <d-form-label>\u8868\u5355\u5E03\u5C40</d-form-label>\r\n                <d-form-control>\r\n                  <d-select [options]=\"layoutOptions\" name=\"layout\" [filterKey]=\"'name'\" [(ngModel)]=\"canvasInfo.layout\" (valueChange)=\"onchange()\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>label\u5360\u5BBD</d-form-label>\r\n                <d-form-control>\r\n                  <d-select [options]=\"labelSizeOptions\" name=\"labelSize\" [filterKey]=\"'name'\" [(ngModel)]=\"canvasInfo.labelSize\" (valueChange)=\"onchange()\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>label\u5BF9\u9F50</d-form-label>\r\n                <d-form-control>\r\n                  <d-select [options]=\"labelAlignOptions\" name=\"labelAlign\" [filterKey]=\"'name'\" [(ngModel)]=\"canvasInfo.labelAlign\" (valueChange)=\"onchange()\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n            </form>\r\n          </ng-template>\r\n        </d-tab>\r\n    </d-tabs>\r\n</section>\r\n<ng-template #common>\r\n  <d-form-item>\r\n    <d-form-label>\u6807\u7B7E\u540D</d-form-label>\r\n    <d-form-control>\r\n      <input dTextInput name=\"labelName\" [(ngModel)]=\"formData.label\"/>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-form-label>\u63A7\u4EF6\u540D\u79F0</d-form-label>\r\n    <d-form-control>\r\n      <input dTextInput name=\"controlName\" [(ngModel)]=\"formData.controlname\"/>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-row>\r\n      <d-col [dSpan]=\"12\">\r\n        <d-form-label>\u662F\u5426\u7981\u7528</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"disabled\" [(ngModel)]=\"formData.disabled\"></d-toggle>\r\n      </d-form-control>\r\n      </d-col>\r\n      <d-col [dSpan]=\"12\">\r\n        <d-form-label>\u662F\u5426\u5FC5\u586B</d-form-label>\r\n        <d-form-control>\r\n          <d-toggle name=\"required\" [(ngModel)]=\"formData.required\"></d-toggle>\r\n        </d-form-control>\r\n      </d-col>\r\n    </d-row>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-form-label>\u662F\u5426\u5E2E\u52A9</d-form-label>\r\n    <d-form-control>\r\n      <d-toggle name=\"help\" [(ngModel)]=\"formData.help\"></d-toggle>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item *ngIf=\"formData.help\">\r\n    <d-form-label>\u5E2E\u52A9\u6587\u672C</d-form-label>\r\n    <d-form-control>\r\n      <input dTextInput name=\"helptip\" [(ngModel)]=\"formData.helptip\" />\r\n    </d-form-control>\r\n  </d-form-item>\r\n</ng-template>\r\n\r\n<ng-template #input>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u5360\u4F4D\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"placeholder\" [(ngModel)]=\"formData.placeholder\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #transfer>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u6E90\u5934\u6807\u9898</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"source\" [(ngModel)]=\"formData.source\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u76EE\u6807\u6807\u9898</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"target\" [(ngModel)]=\"formData.target\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #tree>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u5360\u4F4D\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"placeholder\" [(ngModel)]=\"formData.placeholder\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #richinput>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #counter>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"defaultName\" [step]=\"1\" [(ngModel)]=\"formData.defaultvalue\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-row>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5C0F\u503C</d-form-label>\r\n          <d-form-control>\r\n            <d-input-number name=\"min\" [step]=\"1\" [(ngModel)]=\"formData.min\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5927\u503C</d-form-label>\r\n            <d-form-control>\r\n            <d-input-number name=\"max\" [step]=\"1\" [(ngModel)]=\"formData.max\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n      </d-row>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-row>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6B65\u957F</d-form-label>\r\n          <d-form-control>\r\n            <d-input-number name=\"step\" [step]=\"1\" [(ngModel)]=\"formData.step\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u5355\u4F4D</d-form-label>\r\n          <d-form-control>\r\n            <input dTextInput name=\"unit\" [(ngModel)]=\"formData.unit\"/>\r\n          </d-form-control>\r\n        </d-col>\r\n      </d-row>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #toggle>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #select>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <!-- <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"defaultName\" [(ngModel)]=\"formData.defaultvalue\" />\r\n      </d-form-control>\r\n    </d-form-item> -->\r\n    <d-form-item>\r\n      <d-form-label>\u5360\u4F4D\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"placeholder\" [(ngModel)]=\"formData.placeholder\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u5B57\u6BB5</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"filter\" [(ngModel)]=\"formData.filter\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u591A\u9009</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"multiple\" [(ngModel)]=\"formData.multiple\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #data>\r\n  <d-form-item>\r\n    <d-form-label>\u6570\u636E\u9009\u9879</d-form-label>\r\n    <d-form-control>\r\n      <d-tabs [(activeTab)]=\"formData.dataType\" type=\"options\" customWidth=\"100px\">\r\n        <d-tab [id]=\"'static'\" title=\"\u9759\u6001\u6570\u636E\">\r\n          <ng-template dTabContent>\r\n            <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.options,'options')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n          </ng-template>\r\n        </d-tab>\r\n        <d-tab [id]=\"'interface'\" title=\"\u63A5\u53E3\u6570\u636E\">\r\n          <ng-template dTabContent>\r\n            <div class=\"tabshow\">\r\n              <d-form-item>\r\n                <d-form-label>\u63A5\u53E3</d-form-label>\r\n                <d-form-control>\r\n                  <input dTextInput name=\"url\" [(ngModel)]=\"formData.postdata.url\" />\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>\u8BF7\u6C42\u65B9\u5F0F</d-form-label>\r\n                <d-form-control>\r\n                  <d-select name=\"method\" [placeholder]=\"'\u8BF7\u9009\u62E9'\" [options]=\"methodtype\" [(ngModel)]=\"formData.postdata.method\"></d-select>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>\u9644\u5E26\u6570\u636E</d-form-label>\r\n                <d-form-control>\r\n                  <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.postdata.data,'postdata.data')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-label>\u5934\u90E8\u4FE1\u606F</d-form-label>\r\n                <d-form-control>\r\n                  <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.postdata.head,'postdata.head')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item *ngIf=\"formData.controltype != controlType.Tree\">\r\n                <d-form-label>\u89E3\u6790\u51FD\u6570</d-form-label>\r\n                <d-form-control>\r\n                  <textarea dTextarea placeholder=\"\u8BF7\u8F93\u5165\" name=\"function\" [(ngModel)]=\"formData.postdata.function\"></textarea>\r\n                </d-form-control>\r\n              </d-form-item>\r\n              <d-form-item>\r\n                <d-form-control>\r\n                  <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"onTestData(formData.name)\">\u8F7D\u5165\u6570\u636E</d-button>\r\n                </d-form-control>\r\n              </d-form-item>\r\n            </div>\r\n          </ng-template>\r\n        </d-tab>\r\n      </d-tabs>\r\n    </d-form-control>\r\n  </d-form-item>\r\n</ng-template>\r\n\r\n<ng-template #alert>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u503C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"label\" [(ngModel)]=\"formData.label\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u8B66\u544A\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"alerttype\" name=\"alerttype\" [(ngModel)]=\"formData.alerttype\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u5173\u95ED</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"closeable\" [(ngModel)]=\"formData.closeable\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #check>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u65B9\u5411</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"direction\" name=\"direction\" [(ngModel)]=\"formData.direction\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u6807\u9898</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"isshowtitle\" [(ngModel)]=\"formData.isshowtitle\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u5B57\u6BB5</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"filter\" [(ngModel)]=\"formData.filter\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #radio>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u65B9\u5411</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"direction\" name=\"direction\" [(ngModel)]=\"formData.direction\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"data\">\r\n    </ng-container>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #date>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u65E5\u671F\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"datetype\" name=\"datetype\" [(ngModel)]=\"formData.datetype\" (valueChange)=\"onChangeDateTypeOrFormat()\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u65E5\u671F\u683C\u5F0F</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"dateFormat\" name=\"dateFormat\" [(ngModel)]=\"formData.dateFormat\" (valueChange)=\"onChangeDateTypeOrFormat()\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u663E\u793A\u65F6\u95F4</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"showtime\" [(ngModel)]=\"formData.showtime\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #time>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u65E5\u671F\u683C\u5F0F</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"timeFormat\" name=\"format\" [(ngModel)]=\"formData.format\" (valueChange)=\"onChangeTimeFormat()\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #rate>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"defaultName\" [step]=\"1\" [(ngModel)]=\"formData.defaultvalue\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u662F\u5426\u534A\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"allowhalf\" [(ngModel)]=\"formData.allowhalf\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #space>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9AD8\u5EA6</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"height\" [step]=\"1\" [(ngModel)]=\"formData.height\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #divider>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u663E\u793A\u6587\u672C</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"label\" [(ngModel)]=\"formData.label\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6587\u672C\u4F4D\u7F6E</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"alignFormat\"[(ngModel)]=\"formData.alignvalue\" name=\"align\" [filterKey]=\"'label'\" (valueChange)=\"onChangeAlignFormat($event)\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #upload>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-form-label>\u63A5\u53E3</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"url\" [(ngModel)]=\"formData.uploadOptions.uri\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u8BF7\u6C42\u65B9\u5F0F</d-form-label>\r\n      <d-form-control>\r\n        <d-select name=\"method\" [placeholder]=\"'\u8BF7\u9009\u62E9'\" [options]=\"methodtype\" [(ngModel)]=\"formData.uploadOptions.method\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u9644\u5E26\u6570\u636E</d-form-label>\r\n      <d-form-control>\r\n        <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.uploadOptions.additionalParameter,'uploadOptions.additionalParameter')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u5934\u90E8\u4FE1\u606F</d-form-label>\r\n      <d-form-control>\r\n        <d-button bsStyle=\"common\" style=\"margin-right: 8px;width: 100%;\" width=\"100%\" (btnClick)=\"showCodeEditor(formData.uploadOptions.headers,'uploadOptions.headers')\" >\u7F16\u8F91\u6570\u636E</d-button>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u4E0A\u4F20\u6587\u4EF6\u5927\u5C0F\u9650\u5236</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"maximumSize\" [step]=\"1\" [(ngModel)]=\"formData.uploadOptions.maximumSize\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6587\u4EF6\u540D\u79F0</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"fileFieldName\" [(ngModel)]=\"formData.uploadOptions.fileFieldName\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u8FD4\u56DE\u6570\u636E\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <d-select [options]=\"responseType\" name=\"responseType\" [(ngModel)]=\"formData.uploadOptions.responseType\"></d-select>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6587\u4EF6\u7C7B\u578B</d-form-label>\r\n      <d-form-control>\r\n        <input dTextInput name=\"accept\" [(ngModel)]=\"formData.fileOptions.accept\" />\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u53EF\u9009\u62E9\u591A\u4E2A\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-toggle name=\"multiple\" [(ngModel)]=\"formData.fileOptions.multiple\"></d-toggle>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>\r\n\r\n<ng-template #validator>\r\n  <d-form-item style=\"margin: 0px;\">\r\n    <d-form-control>\r\n      <div class=\"form-divider form-divider-horizontal\">\r\n          <div class=\"form-divider__text is-center\">\u63A7\u4EF6\u9A8C\u8BC1</div>\r\n      </div>\r\n    </d-form-control>\r\n  </d-form-item>\r\n  <d-form-item>\r\n    <d-row *ngFor=\"let validator of validators;index as i;\">\r\n      <d-col [dSpan]=\"8\" style=\"padding-right: 3px;\">\r\n        <d-form-label>\u9A8C\u8BC1\u7C7B\u578B</d-form-label>\r\n        <d-form-control>\r\n          <d-select name=\"validatortype\" \r\n          (valueChange)=\"onChangeItem($event,validator)\" \r\n          [placeholder]=\"'\u8BF7\u9009\u62E9'\" \r\n          [filterKey]=\"'label'\" \r\n          [optionDisabledKey]=\"'disabled'\" \r\n          [options]=\"validator.validatorOptions\" \r\n          [(ngModel)]=\"validator.validatortype\"></d-select>\r\n        </d-form-control>\r\n      </d-col>\r\n      <d-col [dSpan]=\"12\">\r\n        <d-form-label>\u503C</d-form-label>\r\n        <d-form-control>\r\n          <ng-container [ngSwitch]=\"validator.validatortype.label\">\r\n            <ng-container *ngSwitchCase=\"'required'\" [ngTemplateOutlet]=\"required\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'email'\" [ngTemplateOutlet]=\"required\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'whitespace'\" [ngTemplateOutlet]=\"required\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'pattern'\" [ngTemplateOutlet]=\"pattern\"></ng-container>\r\n            <ng-container *ngSwitchCase=\"'minlength'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:5,max:128};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'maxlength'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:5,max:128};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'min'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:0,max:100};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'max'\">\r\n              <ng-container *ngTemplateOutlet=\"num; context:{$implicit:0,max:100};\">\r\n              </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchDefault></ng-container>\r\n          </ng-container>\r\n          <ng-template #pattern>\r\n            <input dTextInput name=\"value\" [(ngModel)]=\"validator.value\" (change)=\"onChangeValidateValue(validator)\"/>\r\n          </ng-template>\r\n          <ng-template #required>\r\n            <div style=\"padding-top: 3px;\">\r\n              <d-toggle [color]=\"'#50D4AB'\" [disabled]=\"true\"  [(ngModel)]=\"validator.value\" [checkedContent]=\"iconCheckedContent\" [uncheckedContent]=\"iconUncheckedContent\"></d-toggle>\r\n              <ng-template #iconCheckedContent>\r\n                <div class=\"toggle-inner\">\r\n                  <i class=\"icon-right\"></i>\r\n                </div>\r\n              </ng-template>\r\n              <ng-template #iconUncheckedContent>\r\n                <div class=\"toggle-inner\">\r\n                  <i class=\"icon-error\"></i>\r\n                </div>\r\n              </ng-template>\r\n            </div>\r\n          </ng-template>\r\n          <ng-template #num let-min let-max =\"max\">\r\n            <d-input-number name=\"height\" [min]=\"min\" [max]=\"max\" [step]=\"1\" style=\"width: 100%;\" [(ngModel)]=\"validator.value\" (ngModelChange)=\"onChangeValidateValue(validator)\"></d-input-number>\r\n          </ng-template>\r\n        </d-form-control>\r\n      </d-col>\r\n      <d-col [dSpan]=\"4\">\r\n        <div class=\"btn-group\">\r\n          <d-button icon=\"fc-icon icon-add icon-font\" bsStyle=\"text-dark\" title=\"\u6DFB\u52A0\" width=\"21px\" (btnClick)=\"onAddValidationRule()\"></d-button>\r\n          <d-button icon=\"fc-icon icon-delete icon-font\" bsStyle=\"text-dark\" [disabled]=\"validators.length==1\" title=\"\u5220\u9664\" width=\"22px\" (btnClick)=\"onRemoveRule(i)\"></d-button>\r\n        </div>\r\n      </d-col>\r\n    </d-row>\r\n  </d-form-item>\r\n</ng-template>\r\n\r\n<ng-template #slide>\r\n  <form dForm [layout]=\"layoutDirection\" [labelSize]=\"'sm'\">\r\n    <d-form-item>\r\n      <d-form-label>\u9ED8\u8BA4\u503C</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"defaultName\" [step]=\"1\" [(ngModel)]=\"formData.defaultvalue\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"common\">\r\n    </ng-container>\r\n    <d-form-item>\r\n      <d-row>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5C0F\u503C</d-form-label>\r\n          <d-form-control>\r\n            <d-input-number name=\"min\" [step]=\"1\" [(ngModel)]=\"formData.min\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n        <d-col [dSpan]=\"12\">\r\n          <d-form-label>\u6700\u5927\u503C</d-form-label>\r\n            <d-form-control>\r\n            <d-input-number name=\"max\" [step]=\"1\" [(ngModel)]=\"formData.max\"></d-input-number>\r\n          </d-form-control>\r\n        </d-col>\r\n      </d-row>\r\n    </d-form-item>\r\n    <d-form-item>\r\n      <d-form-label>\u6B65\u957F</d-form-label>\r\n      <d-form-control>\r\n        <d-input-number name=\"step\" [step]=\"1\" [(ngModel)]=\"formData.step\"></d-input-number>\r\n      </d-form-control>\r\n    </d-form-item>\r\n    <ng-container [ngTemplateOutlet]=\"validator\">\r\n    </ng-container>\r\n  </form>\r\n</ng-template>", styles: [".space{width:100%;padding:0 10px 10px}:host form{width:330px;padding:0 10px}.tabshow{border:2px solid var(--devui-brand, #5e7ce0);padding:5px}:host ::ng-deep section>d-tabs>ul{position:sticky;padding-top:10px;background:#fff!important;top:0;z-index:16}:host ::ng-deep .btn-group d-button .icon-font{font-size:16px}.btn-group{margin-top:18px}.form-divider{background-color:#dcdfe6;position:relative}.form-divider-horizontal{display:block;height:1px;width:100%;margin:24px 0}.form-divider__text{position:absolute;background-color:#fff;padding:0 20px;color:#303133}.form-divider__text.is-center{left:50%;transform:translate(-50%) translateY(-50%)}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.CommonService }, { type: i2.ModalService }]; } });
//# sourceMappingURL=data:application/json;base64, 