ludc
2023-05-26 850dedca3754c8d29ce74bb4a850f9fc0e58d410
Source/UBCS-WEB/src/components/code-dialog-page/referConfigFormDialog.vue
@@ -10,7 +10,7 @@
      style="height: 115vh; margin-top: -14vh; overflow-y: hidden">
        <div style="width: 100%; overflow-y: auto; height: 70vh">
            <el-row>
                <avue-form ref="form" :option="formOption" v-model="form" class="referTypeForm">
                <avue-form :ref="formRefs[0]" :option="formOption" v-model="form" class="referTypeForm">
                    <template #referTypeName="{disabled,size}">
                        <el-input :disabled="disabled"
                            :size="size"
@@ -37,76 +37,101 @@
                    </template>
                </avue-form>
            </el-row>
            <el-row v-show="form.type=='default' || form.type=='grid'">
                <avue-crud
                    ref="crudAttr"
                    class="crud-attr"
                    :option="attrOption"
                    @cell-click="clickAttrEdit"
                    :data="attrData">
                    <!-- 表格内操作按钮 -->
                    <template slot="menu" slot-scope="scope">
                        <el-button type="text"
                            size="small"
                            icon="el-icon-search"
                            plain
                            @click="scope.row.isquery=!scope.row.isquery">
                            {{scope.row.isquery ? "取消快速查询":"快速查询"}}
                        </el-button>
                        <el-button type="text"
                            size="small"
                            icon="el-icon-minus"
                            plain
                            @click="removeCurrentRow(scope.row,'removeAttr')">移除
                        </el-button>
                    </template>
                    <!-- 表格左上方按钮区域 -->
                    <template slot="menuLeft" slot-scope="scope">
                        <el-button type="primary"
                            size="small"
                            icon="el-icon-plus"
                            @click="openSelectionTable('selectAttr')">选择属性
                        </el-button>
                        <div class="tag-group" style="display: inline">
                            <el-tag
                                v-for="item in attrData"
                                v-show="item.isquery && item.title!=''"
                                style="margin-left: 3px"
                                :key="item.title"
                                type="info"
                                size="small"
                                effect="dark">
                                {{ item.title }}
                            </el-tag>
                        </div>
                    </template>
                </avue-crud>
            </el-row>
            <el-row style="margin-top: 10px">
                <avue-crud
                    ref="crudAddCondition"
                    :option="addSearchCondtionOption"
                    @cell-click="clickAddSearchCondtionEdit"
                    :data="addSearchCondtionData">
                    <!-- 表格内操作按钮 -->
                    <template slot="menu" slot-scope="scope">
                        <el-button type="text"
                            size="small"
                            icon="el-icon-minus"
                            plain
                            @click="removeCurrentRow(scope.row,'removeaddSearchCondtion')">移除
                        </el-button>
                    </template>
                    <!-- 表格左上方按钮区域 -->
                    <template slot="menuLeft" slot-scope="scope">
                        <el-button type="primary"
                            size="small"
                            icon="el-icon-plus"
                            @click="openSelectionTable('addSearchCondition')">
                            添加查询条件
                        </el-button>
                    </template>
                </avue-crud>
            <el-row>
                <el-tabs type="border-card" v-model="activeName">
                    <el-tab-pane name="first" :disabled="isDisabledTabs">
                        <span slot="label"><i class="el-icon-monitor"></i>显示的属性与其他配置</span>
                        <el-row>
                            <avue-form :ref="formRefs[1]" :option="formOtherOption" v-model="form" class="referTypeForm">
                                <template #sortField="{disabled,size}">
                                    <el-input :disabled="disabled"
                                        :size="size"
                                        v-model="form.sortField"
                                        ref="sortField"
                                        placeholder="请选择 排序字段"
                                        prefix-icon="el-icon-search"
                                        readonly="true"
                                        @focus="openSelectionTable('sortField')">
                                        <i slot="suffix" class="el-icon-circle-close" @click="clearSelectionTable('sortField')" style="margin-right: 5px;cursor: pointer;"></i>
                                    </el-input>
                                </template>
                            </avue-form>
                        </el-row>
                        <el-row v-show="form.type=='default' || form.type=='grid'">
                            <el-divider content-position="left" style="margin-bottom: -40px;">配置显示的属性</el-divider>
                            <avue-crud
                                ref="crudAttr"
                                class="crud-attr"
                                :option="attrOption"
                                @cell-click="clickAttrEdit"
                                :data="attrData">
                                <!-- 表格内操作按钮 -->
                                <template slot="menu" slot-scope="scope">
                                    <el-button type="text"
                                        size="small"
                                        icon="el-icon-search"
                                        plain
                                        @click="scope.row.isquery=!scope.row.isquery">
                                        {{scope.row.isquery ? "取消快速查询":"快速查询"}}
                                    </el-button>
                                    <el-button type="text"
                                        size="small"
                                        icon="el-icon-minus"
                                        plain
                                        @click="removeCurrentRow(scope.row,'removeAttr')">移除
                                    </el-button>
                                </template>
                                <!-- 表格左上方按钮区域 -->
                                <template slot="menuLeft" slot-scope="scope">
                                    <el-button type="primary"
                                        size="small"
                                        icon="el-icon-plus"
                                        @click="openSelectionTable('selectAttr')">选择属性
                                    </el-button>
                                    <div class="tag-group" style="display: inline">
                                        <el-tag
                                            v-for="item in attrData"
                                            v-show="item.isquery && item.title!=''"
                                            style="margin-left: 3px"
                                            :key="item.title"
                                            type="info"
                                            size="small"
                                            effect="dark">
                                            {{ item.title }}
                                        </el-tag>
                                    </div>
                                </template>
                            </avue-crud>
                        </el-row>
                    </el-tab-pane>
                    <el-tab-pane name="second">
                        <span slot="label"><i class="el-icon-search"></i>查询条件添加</span>
                        <avue-crud
                            ref="crudAddCondition"
                            :option="addSearchCondtionOption"
                            @cell-click="clickAddSearchCondtionEdit"
                            :data="addSearchCondtionData">
                            <!-- 表格内操作按钮 -->
                            <template slot="menu" slot-scope="scope">
                                <el-button type="text"
                                    size="small"
                                    icon="el-icon-minus"
                                    plain
                                    @click="removeCurrentRow(scope.row,'removeaddSearchCondtion')">移除
                                </el-button>
                            </template>
                            <!-- 表格左上方按钮区域 -->
                            <template slot="menuLeft" slot-scope="scope">
                                <el-button type="primary"
                                    size="small"
                                    icon="el-icon-plus"
                                    @click="openSelectionTable('addSearchCondition')">
                                    添加查询条件
                                </el-button>
                            </template>
                        </avue-crud>
                    </el-tab-pane>
                </el-tabs>
            </el-row>
        </div>
@@ -233,7 +258,6 @@
            let element = '';
            return {
                activeName: 'first', //当前活动的tabs
                labelWidth: '150',   // 标题宽度
                isShowReferConfigForm: false,  // 第一层对话框显示隐藏控制
                referTypeIsReadOnly: false,
@@ -282,6 +306,8 @@
                    columnBtn: false,
                    dialogClickModal: false,
                    highlightCurrentRow: true,
                    indexFixed: false,
                    menuFixed: false,
                    column: [
                        {
                            label: "列字段(*)",
@@ -408,6 +434,12 @@
                        }
                    ]
                },
                formRefs: ['form','otherForm'],
                // tabs控制
                isDisabledTabs: false,
                activeName: 'first', //当前活动的tabs
                //为【参照的业务类型】选取值对话框
                selectionReferBtmTypeOption: {
@@ -638,205 +670,256 @@
                    submitBtn: false,
                    emptyBtn: false,
                    labelWidth: '145', //默认标签宽度
                    // 基础表单信息展示区域
                    column: [
                        {
                            label: '参照的业务类型',
                            prop: 'referTypeName',
                            span: 7,
                            disabled: this.referTypeIsReadOnly,
                            clearable: !this.referTypeIsReadOnly,
                            tip: '参照数据查询的业务类型。',
                            tipPlacement: 'right',
                            rules: [{
                                required: true,
                                message: "(参照的业务类型)必填项不能为空",
                                trigger: ["blur","change"],
                            }],
                        },{
                            label: '显示的属性',
                            prop: 'textField',
                            tip: '选择数据后,显示到字段上的信息所属的属性,一般都是name,如果是多个属性使用逗号分割,如id,name。',
                            tipPlacement: 'right',
                            span: 7,
                            value: 'name',
                            rules: [{
                                required: true,
                                message: "(显示的属性)必填项不能为空",
                                trigger: "blur",
                            }],
                        },{
                            label: '存储值的属性',
                            prop: 'valueField',
                            tip: '选择数据后,保存到数据库里的属性,一般都是oid或者id,如果是多个属性使用逗号分割,如oid ,id',
                            value: 'oid',
                            tipPlacement: 'right',
                            span: 7,
                            rules: [{
                                required: true,
                                message: "(存储值的属性)必填项不能为空",
                                trigger: "blur",
                            }],
                        },{
                            label: '参照窗口类型',
                            prop: 'type',
                            tip: 'default:默认的参照窗口样式; stand:UI上下文配置的方式; classify:分类+档案的显示; 自定义的参照直接写js的组件路径;tree:树形展示;grid:列表展示',
                            tipPlacement: 'right',
                            span: 7,
                            value: 'default',
                            type: 'select',
                            dicData: [{
                                label: '默认样式',
                                value: 'default'
                            }, {
                                label: '平台配置',
                                value: 'stand'
                            }, {
                                label: '树形',
                                value: 'tree'
                            }, {
                                label: '列表',
                                value: 'grid'
                            }, {
                                label: '部门树',
                                value: 'refer/OrgDepartmentRefer'
                            }, {
                                label: '部门列表',
                                value: 'refer/OrgDepartmentGridRefers'
                            }, {
                                label: '用户',
                                value: 'refer/SmUserRefer'
                            }, {
                                label: '用户列表',
                                value: 'refer/SmUserGridRefer'
                            }, {
                                label: '角色列表',
                                value: 'refer/SmRoleRefer'
                            }, {
                                label: '职务',
                                value: 'refer/OrgDutyRefer'
                            }, {
                                label: '工种',
                                value: 'refer/SmWorkTypeRefer'
                            }, {
                                label: '流程模板',
                                value: 'refer/WfProcessTemplateRefer'
                            }],
                            rules: [{
                                required: true,
                                message: "(参照窗口类型)必填项不能为空",
                                trigger: "blur",
                            }],
                            change: ({ value, column }) => {
                                // 复原表单,因为其他分组中如果存在值,在切换时,会保留输入的字段值所以需要还原
                                let oldForm = this.form;
                                this.form = {};  // 表单对象赋空
                                this.form.referType = oldForm.referType
                                this.form.textField = oldForm.textField
                                this.form.valueField = oldForm.valueField
                                this.form.type = oldForm.type //参照窗口类型
                                this.form.url =  oldForm.url
                                this.form.backPath =  oldForm.backPath
                                this.form.method =  oldForm.method
                                this.form.height =  oldForm.height
                                this.form.useFormKey =  oldForm.useFormKey
                                this.form.paramForFormKey =  oldForm.paramForFormKey
                                this.form.isMuti =  oldForm.isMuti
                                this.form.mapFields =  oldForm.mapFields
                                let addFrom = {};  //根据类型需要添加的不同属性
                                if(value == 'stand'){
                                    addFrom = {
                                        referContent: '',
                                        displayTable: '',
                                    }
                                } else if(value == 'default' || value == 'grid'){
                                    addFrom = {
                                        limit: '15',
                                        sortField: '',
                                        sortType: 'asc',
                                    }
                                } else if(value == 'tree'){
                                    addFrom = {
                                        parentFieldName: '',
                                        parentUsedField: 'oid',
                                        parentValue: '',
                                        loadType: 'all',
                                        onlyLeaf: false,
                                        sortField: '',
                                        sortType: 'asc',
                                    }
                    group: [
                        {
                            // 基础表单信息展示区域
                            //display: this.form.type=='default'||this.form.type=='grid',
                            icon: 'el-icon-info',
                            label: '必填的参照配置',
                            collapse: true,
                            labelWidth: '110',
                            prop: 'groupDdefaultOrGrid',
                            column: [
                                {
                                    label: '参照的业务类型',
                                    prop: 'referTypeName',
                                    span: 6,
                                    labelWidth: '130',
                                    disabled: this.referTypeIsReadOnly,
                                    clearable: !this.referTypeIsReadOnly,
                                    tip: '参照数据查询的业务类型。',
                                    tipPlacement: 'bottom',
                                    rules: [{
                                        required: true,
                                        message: "(参照的业务类型)必填项不能为空",
                                        trigger: ["blur","change"],
                                    }],
                                },{
                                    label: '显示的属性',
                                    prop: 'textField',
                                    tip: '选择数据后,显示到字段上的信息所属的属性,一般都是name,如果是多个属性使用逗号分割,如id,name。',
                                    tipPlacement: 'bottom',
                                    span: 6,
                                    value: 'name',
                                    rules: [{
                                        required: true,
                                        message: "(显示的属性)必填项不能为空",
                                        trigger: "blur",
                                    }],
                                },{
                                    label: '存储值的属性',
                                    prop: 'valueField',
                                    tip: '选择数据后,保存到数据库里的属性,一般都是oid或者id,如果是多个属性使用逗号分割,如oid ,id',
                                    value: 'oid',
                                    tipPlacement: 'bottom',
                                    span: 6,
                                    rules: [{
                                        required: true,
                                        message: "(存储值的属性)必填项不能为空",
                                        trigger: "blur",
                                    }],
                                },{
                                    label: '参照窗口类型',
                                    prop: 'type',
                                    tip: 'default:默认的参照窗口样式; stand:UI上下文配置的方式; classify:分类+档案的显示; 自定义的参照直接写js的组件路径;tree:树形展示;grid:列表展示',
                                    tipPlacement: 'bottom',
                                    span: 6,
                                    value: 'default',
                                    type: 'select',
                                    dicData: [{
                                        label: '默认样式',
                                        value: 'default'
                                    }, {
                                        label: '平台配置',
                                        value: 'stand'
                                    }, {
                                        label: '树形',
                                        value: 'tree'
                                    }, {
                                        label: '列表',
                                        value: 'grid'
                                    }, {
                                        label: '部门树',
                                        value: 'refer/OrgDepartmentRefer'
                                    }, {
                                        label: '部门列表',
                                        value: 'refer/OrgDepartmentGridRefers'
                                    }, {
                                        label: '用户',
                                        value: 'refer/SmUserRefer'
                                    }, {
                                        label: '用户列表',
                                        value: 'refer/SmUserGridRefer'
                                    }, {
                                        label: '角色列表',
                                        value: 'refer/SmRoleRefer'
                                    }, {
                                        label: '职务',
                                        value: 'refer/OrgDutyRefer'
                                    }, {
                                        label: '工种',
                                        value: 'refer/SmWorkTypeRefer'
                                    }, {
                                        label: '流程模板',
                                        value: 'refer/WfProcessTemplateRefer'
                                    }],
                                    rules: [{
                                        required: true,
                                        message: "(参照窗口类型)必填项不能为空",
                                        trigger: "blur",
                                    }],
                                    change: ({ value, column }) => {
                                        // 复原表单,因为其他分组中如果存在值,在切换时,会保留输入的字段值所以需要还原
                                        let oldForm = this.form;
                                        this.form = {};  // 表单对象赋空
                                        this.form.referType = oldForm.referType
                                        this.form.textField = oldForm.textField
                                        this.form.valueField = oldForm.valueField
                                        this.form.type = oldForm.type //参照窗口类型
                                        this.form.url =  oldForm.url
                                        this.form.backPath =  oldForm.backPath
                                        this.form.method =  oldForm.method
                                        this.form.height =  oldForm.height
                                        this.form.useFormKey =  oldForm.useFormKey
                                        this.form.paramForFormKey =  oldForm.paramForFormKey
                                        this.form.isMuti =  oldForm.isMuti
                                        this.form.mapFields =  oldForm.mapFields
                                        let addFrom = {};  //根据类型需要添加的不同属性
                                        this.activeName = 'first';
                                        if(value == 'stand'){
                                            addFrom = {
                                                referContent: '',
                                                displayTable: '',
                                            };
                                            this.isDisabledTabs = false;
                                        } else if(value == 'default' || value == 'grid'){
                                            addFrom = {
                                                limit: '15',
                                                sortField: '',
                                                sortType: 'asc',
                                            };
                                            this.isDisabledTabs = false;
                                        } else if(value == 'tree'){
                                            addFrom = {
                                                parentFieldName: '',
                                                parentUsedField: 'oid',
                                                parentValue: '',
                                                loadType: 'all',
                                                onlyLeaf: false,
                                                sortField: '',
                                                sortType: 'asc',
                                            };
                                            console.log('tree');
                                            this.isDisabledTabs = false;
                                        }else {
                                            this.isDisabledTabs = true;
                                            this.activeName = 'second';
                                        }
                                        // 合并两个表单
                                        this.form = Object.assign(addFrom,this.form);
                                        //console.log(this.form);
                                    },
                                }
                                // 合并两个表单
                                this.form = Object.assign(addFrom,this.form);
                                //console.log(this.form);
                            },
                        },{
                            label: '自定义的后台路径',
                            prop: 'url',
                            tip: '通常为空;如果是列表,后台必须返回DataGrid,如果是树,后台必须返回List<Tree>',
                            tipPlacement: 'right',
                            span: 7,
                        },{
                            label: '服务的地址',
                            prop: 'backPath',
                            tip: '通常为空,在支持微服务或者分布式部署的时候才配置',
                            tipPlacement: 'right',
                            span: 7,
                        },{
                            label: '请求后台的协议方式',
                            prop: 'method',
                            tip: 'HTTP的协议方式,支持POST,PUT,GET,一般都是GET',
                            tipPlacement: 'right',
                            span: 7,
                            value: 'GET',
                            type: 'select',
                            dicData: [{
                                label:'GET',value: "GET"
                            ]
                        },
                        {
                            //display: this.form.type=='default'||this.form.type=='grid',
                            icon: 'el-icon-info',
                            label: '页面参数配置',
                            collapse: false,
                            prop: 'webConfig',
                            column: [{
                                label: '窗口显示的高度',
                                prop: 'height',
                                tip: '默认空着,设置后表示强制显示这样的高度',
                                tipPlacement: 'right',
                                span: 7,
                                rules:[{
                                    validator: validateNumber,
                                    message: "窗口显示的高度必须为数值类型",
                                    trigger: "blur",
                                }]
                            },{
                                label:'PUT',value: "PUT"
                            },
                            {
                                label:'POST',value: "POST"
                            }],
                        },{
                            label: '窗口显示的高度',
                            prop: 'height',
                            tip: '默认空着,设置后表示强制显示这样的高度',
                            tipPlacement: 'right',
                            span: 7,
                            rules:[{
                                validator: validateNumber,
                                message: "窗口显示的高度必须为数值类型",
                                trigger: "blur",
                                label: '过滤(级联)属性',
                                prop: 'useFormKey',
                                tip: '获取表单上的其他属性的属性的值来过滤,或者使用某个属性来级联选择',
                                tipPlacement: 'right',
                                span: 7,
                            },{
                                label: '过滤属性请求参数',
                                prop: 'paramForFormKey',
                                tip: '使用过滤属性时,发送给后台的请求参数',
                                tipPlacement: 'right',
                                span: 7,
                            },{
                                label: '映射其他属性',
                                prop: 'mapFields',
                                tip: '选择数据后,将选择的数据拷贝到表单里的其他属性,书写格式为{当前表单上的属性:选择数据里的属性,XXXXx:yyyy}',
                                tipPlacement: 'right',
                                span: 7,
                            },{
                                label: '是否开启全局',
                                prop: 'isOpenGlobal',
                                tip: '开启全局之后对全部参照配置数据进行查询,默认根据租户进行查询。',
                                tipPlacement: 'right',
                                type: 'switch',
                                span: 7,
                            },{
                                label: '是否多选',
                                type: 'switch',
                                prop: 'isMuti',
                                value: false,
                                span: 7,
                                row: true,
                            }]
                        },{
                            label: '过滤(级联)属性',
                            prop: 'useFormKey',
                            tip: '获取表单上的其他属性的属性的值来过滤,或者使用某个属性来级联选择',
                            tipPlacement: 'right',
                            span: 7,
                        },{
                            label: '过滤属性请求参数',
                            prop: 'paramForFormKey',
                            tip: '使用过滤属性时,发送给后台的请求参数',
                            tipPlacement: 'right',
                            span: 7,
                        },{
                            label: '是否多选',
                            type: 'switch',
                            prop: 'isMuti',
                            value: false,
                            span: 7,
                            row: true,
                        },{
                            label: '映射其他属性',
                            prop: 'mapFields',
                            tip: '选择数据后,将选择的数据拷贝到表单里的其他属性,书写格式为{当前表单上的属性:选择数据里的属性,XXXXx:yyyy}',
                            tipPlacement: 'right',
                            span: 18,
                        }
                    ],
                        },
                        {
                            //display: this.form.type=='default'||this.form.type=='grid',
                            icon: 'el-icon-info',
                            label: '后台参数配置',
                            collapse: false,
                            prop: 'backstageConfig',
                            column: [
                                {
                                label: '自定义的后台路径',
                                prop: 'url',
                                tip: '通常为空;如果是列表,后台必须返回DataGrid,如果是树,后台必须返回List<Tree>',
                                tipPlacement: 'right',
                                span: 7,
                            },{
                                label: '服务的地址',
                                prop: 'backPath',
                                tip: '通常为空,在支持微服务或者分布式部署的时候才配置',
                                tipPlacement: 'right',
                                span: 7,
                            },{
                                label: '请求后台的协议方式',
                                prop: 'method',
                                tip: 'HTTP的协议方式,支持POST,PUT,GET,一般都是GET',
                                tipPlacement: 'right',
                                span: 7,
                                value: 'GET',
                                type: 'select',
                                dicData: [{
                                    label:'GET',value: "GET"
                                },{
                                    label:'PUT',value: "PUT"
                                },
                                {
                                    label:'POST',value: "POST"
                                }],
                            },
                            ]
                        },
                    ]
                }
            },
            formOtherOption(){
                return {
                    // 变动的表单区域
                    submitBtn: false,
                    emptyBtn: false,
                    labelWidth: '145', //默认标签宽度
                    group: [
                        {   
                            display: this.form.type=='default'||this.form.type=='grid',
@@ -942,12 +1025,6 @@
                                    }],
                                    type: 'select',
                                },{
                                    label: '是否只能选择叶子节点',
                                    prop: 'onlyLeaf',
                                    span: 7,
                                    value: false,
                                    type: 'switch',
                                },{
                                    label: '排序字段',
                                    prop: 'sortField',
                                    span: 7,
@@ -965,10 +1042,16 @@
                                    }, {
                                        label: '降序', value: 'desc'
                                    }],
                                },
                                },{
                                    label: '是否只能选择叶子节点',
                                    prop: 'onlyLeaf',
                                    span: 7,
                                    value: false,
                                    type: 'switch',
                                }
                            ]
                        },
                    ]
                    ],
                }
            },
        },
@@ -1025,7 +1108,7 @@
            },
            //上一个页面已经选中参照应用的业务类型的情况,和上一次已经配置过参照配置的情况下进行页面初始化渲染
            initPageData(val){
                //console.log(val);
                console.log(val);
                if(func.notEmpty(val.referConfig)){
                    this.form = JSON.parse(val.referConfig);
                    //console.log(val);
@@ -1041,25 +1124,33 @@
                //console.log(localStorage.getItem("userId"));
            },
            // 选择完参照配置之后点击保存按钮触发
            selectedListReferConfig(){
                //表单验证
                this.$refs.form.validate((valid, done, msg) => {
                    if (valid) {
                        // 根据类型对form表单中的参数进行过滤,只保留非空且需要的属性
                        let submitForm = this.filterForm();
                        //console.log(submitForm);
                        this.$emit('echoReferConfig', submitForm) // 触发update:data将子组件值传递给父组件
                        this.isShowReferConfigForm = false;
                        done()
                    } else {
                        for(let attr in msg) {
                            //console.log(msg[attr][0].message);
                            this.$message.warning(msg[attr][0].message);
                            break;
                        }
                        return false;
                    }
            async selectedListReferConfig(){
                // 标记所有表单是否通过校验的变量
                let isValid = true;
                // 遍历表单数组,依次对每个表单进行校验
                await this.formRefs.forEach(ref => {
                    this.$refs[ref].validate((valid, done, msg) => {
                        if (!valid) {
                            for(let attr in msg) {
                                this.$message.warning(msg[attr][0].message);
                                break;
                            }
                            isValid = false;
                            //console.log(valid);
                        }
                        done();
                    })
                })
                // 如果所有表单都校验通过,执行提交操作
                if (isValid) {
                    // 根据类型对form表单中的参数进行过滤,只保留非空且需要的属性
                    let submitForm = this.filterForm();
                    //console.log(submitForm);
                    this.$emit('echoReferConfig', submitForm) // 触发update:data将子组件值传递给父组件
                    this.isShowReferConfigForm = false;
                }
            },
            /** 其实选取属性表格的默认数据不需要加载,
             但是弹窗打开会有表格错行问题所以需要在这调用doLayout方法*/