import DSJBase from "../DSJBase/DSJBase";
interface DSJFormItem {
    prop: string;   //属性名称
    label: string;  //标签
    component: string;  //组件名称
    opt: Object;    //组件配置
    hidden: boolean;    //隐藏状态
    disabled: boolean;  //禁用状态
}

export default class DSJForm extends DSJBase {
    formItemArray: Array<DSJFormItem> = []; //表单项数组
   //表单项数组
    //表单项数组
    resetEvent!: Function; //表单重置事件
   //表单重置事件
    rules!: object; //表单验证规则
  //表单验证规则
    validateVaild!: Function; //表单校验成功事件
 //表单校验成功事件
    inline: boolean = false; //行内表单模式
    //行内表单模式
    //行内表单模式
    labelPosition!: string; //表单域标签的位置，如果值为 left 或者 right 时，则需要设置 label-width
  //表单域标签的位置，如果值为 left 或者 right 时，则需要设置 label-width
    labelWidth!: string | number; //表单域标签的宽度，例如 '50px'。作为 Form 直接子元素的 form-item 会继承该值。支持 auto
  //表单域标签的宽度，例如 '50px'。作为 Form 直接子元素的 form-item 会继承该值。支持 auto
    labelSuffix!: string; //表单域标签的后缀
    //表单域标签的后缀
    hideRequiredAsterisk: boolean = false; //是否显示必填字段的标签旁边的红色星号
  //是否显示必填字段的标签旁边的红色星号
    showMessage: boolean = false; //是否显示校验错误信息
   //是否显示校验错误信息
    inlineMessage: boolean = false; //是否以行内形式展示校验信息
 //是否以行内形式展示校验信息
    statusIcon: boolean = false; //是否在输入框中显示校验结果反馈图标
    //是否在输入框中显示校验结果反馈图标
    validateOnRuleChange: boolean = false; //是否在 rules 属性改变后立即触发一次验证
  //是否在 rules 属性改变后立即触发一次验证
    //是否在 rules 属性改变后立即触发一次验证
    size!: string; //用于控制该表单内组件的尺寸
   //用于控制该表单内组件的尺寸
    disabled: boolean = false; //是否禁用该表单内的所有组件。若设置为 true，则表单内组件上的 disabled 属性不再生效
  //是否禁用该表单内的所有组件。若设置为 true，则表单内组件上的 disabled 属性不再生效
    //是否禁用该表单内的所有组件。若设置为 true，则表单内组件上的 disabled 属性不再生效
    updateFormItems!: Function;

    constructor(opt: any) {
        super(opt);
        Object.assign(this, {
            formItemArray: [],
            resetEvent: function() {},
            model: {},
            rules: {},
            inline: false,
            labelPosition: 'right',
            labelWidth: 'auto',
            labelSuffix: '',
            hideRequiredAsterisk: false,
            showMessage: true,
            inlineMessage: false,
            statusIcon: false,
            validateOnRuleChange: true,
            size: '',
            disabled: false,
            updateFormItems: () => {},
        },opt,{})
    }
}