<template>
    <div class="global-setting-class">
        <Layout>
            <Content>
                <Row>
                    <Col span="12">
                        <div>
                            <h2>公共配置属性</h2>
                        </div>
                    </Col>
                    <Col span="12">
                        <div>
                            <h2>当前表单属性(移出的属性，表单生成页面里面也得删除，否则会出现匹配不上的情况)</h2>
                        </div>
                    </Col>
                </Row>
                <Row class="marginB">
                    <Col span="12" style="border: 1px solid #efefef;padding: 10px;">
                        <Form ref="formInline" :model="formInline" :rules="ruleInline" :label-width="170">
                            <div style="border-bottom: 1px dashed lightgray">
                                <template v-for="item,index in getCommonConfigData">
                                    <template v-if="item.type==='label'">
                                        <FormItem :prop="item.prop" :label="item.label">
                                            <Label>
                                                {{formInline[item.prop]}}
                                            </Label>
                                        </FormItem>
                                    </template>
                                    <template v-if="item.type==='input'">
                                        <FormItem :prop="item.prop" :label="item.label">
                                            <Input type="text" @on-blur="changeValue(formInline[item.prop],item.prop)"
                                                   clearable v-model="formInline[item.prop]">
                                            </Input>
                                        </FormItem>
                                    </template>
                                    <template v-else-if="item.type==='input-number'">
                                        <FormItem :prop="item.prop" :label="item.label">
                                            <InputNumber v-model="formInline[item.prop]"
                                                         :min=1
                                                         :max="999999999">
                                            </InputNumber>
                                        </FormItem>
                                    </template>
                                    <template v-else-if="item.type==='select'">
                                        <FormItem :prop="item.prop" :label="item.label">
                                            <Select v-model="formInline[item.prop]" style="width:150px" size="small"
                                                    @on-change='change_status(formInline[item.prop])'>
                                                <Option v-for="itemOption in formInline[item.itemsProp]"
                                                        :value="itemOption.label||''" :key="itemOption.label">{{
                                                    itemOption.value }}
                                                </Option>
                                            </Select>
                                        </FormItem>
                                    </template>
                                </template>
                            </div>
                            <div class="public-box">
                                <Button type="success" @click="addTableProp()">添加表格属性</Button>
                                <div class="propertiesForm">
                                    <template v-for="item,index in getTableProp">
                                        <FormItem :prop="item.prop" :label="item.label"
                                                  :rules="{validator: validateTable, trigger: 'blur'}" class="propertiesItem">
                                            <Input type="text" @on-blur="changeValue(formInline[item.prop],item.prop)"
                                                   clearable v-model="formInline[item.prop]">
                                            </Input>
                                            <Button type="error" @click="deleteCommonData('table',index)">删除</Button>
                                        </FormItem>
                                    </template>
                                </div>
                            </div>
                            <div class="public-box">
                                <Button type="success" @click="addSelectProp()">添加下拉框联动属性</Button>
                                <div class="propertiesForm">
                                    <template v-for="item,index in getSelectProp">
                                        <FormItem :prop="item.prop" :label="item.label"
                                                  :rules="{validator: validateTable, trigger: 'blur'}" class="propertiesItem">
                                            <Input type="text" @on-blur="changeValue(formInline[item.prop],item.prop)"
                                                   clearable v-model="formInline[item.prop]">
                                            </Input>
                                            <Button type="error" @click="deleteCommonData('select',index)">删除</Button>
                                        </FormItem>
                                    </template>
                                </div>
                            </div>
                            <div class="public-box">
                                <Button type="success" @click="addBirthProp()">添加身份证联动出身日期属性</Button>
                                <div class="propertiesForm">
                                    <template v-for="item,index in getBirthProp">
                                        <FormItem :prop="item.prop" :label="item.label"
                                                  :rules="{validator: validateTable, trigger: 'blur'}" class="propertiesItem">
                                            <Input type="text" @on-blur="changeValue(formInline[item.prop],item.prop)"
                                                   clearable v-model="formInline[item.prop]">
                                            </Input>
                                            <Button type="error" @click="deleteCommonData('id',index)">删除</Button>
                                        </FormItem>
                                    </template>
                                </div>
                            </div>
                            <div class="public-box">
                                <Button type="success" @click="addIdentityCheckProp()">添加身份证校验社保卡</Button>
                                <div class="propertiesForm">
                                    <template v-for="item,index in getIdentityCheckProp">
                                        <FormItem :prop="item.prop" :label="item.label"
                                                  :rules="{validator: validateTable, trigger: 'blur'}" class="propertiesItem">
                                            <Input type="text" @on-blur="changeValue(formInline[item.prop],item.prop)"
                                                   clearable v-model="formInline[item.prop]">
                                            </Input>
                                            <Button type="error" @click="deleteCommonData('id-shebao',index)">删除</Button>
                                        </FormItem>
                                    </template>
                                </div>
                            </div>
                            <div class="public-box">
                                <Button type="success" @click="addCheckProp()">添加多选框关联属性</Button>
                                <template v-for="item,index in getCheckProp">
                                    <FormItem :prop="item.prop" :label="item.label"
                                              :rules="{validator: validateTable, trigger: 'blur'}" class="propertiesItem">
                                        <Input type="text" @on-blur="changeValue(formInline[item.prop],item.prop)"
                                               clearable v-model="formInline[item.prop]">
                                        </Input>
                                        <Button type="error" @click="deleteCommonData('select-more',index)">删除</Button>
                                    </FormItem>
                                </template>
                            </div>
                        </Form>
                    </Col>
                    <Col span="12" style="border: 1px solid #efefef;padding: 10px;">
                        <Transfer
                                :titles="transArr"
                                :data="getAllData"
                                :list-style="listStyle"
                                :target-keys="getTargetData"
                                filterable
                                :filter-method="filterMethod"
                                @on-change="handleChange2">
                        </Transfer>
                    </Col>
                </Row>
                <Row class="marginB3">
                    <Col span="24">
                        <div>
                            <label class="labelInfo">配置模板缓存数据(templateCache)</label>
                        </div>
                    </Col>
                </Row>
                <Row>
                    <Col span="12">
                        <div>
                            <Button type="success">默认设置的下拉框</Button>
                            <CheckboxGroup v-model="allSelect">
                                <template v-for="el in localSelectArr">
                                    <Checkbox :label="el.selectName">
                                        <span>{{el.selectName}}</span>
                                    </Checkbox>
                                </template>
                            </CheckboxGroup>
                        </div>
                    </Col>
                    <Col span="12">
                        <div>
                            <Button type="warning" @click="addSelectArr()">新建下拉框</Button>

                            <Button type="warning" @click="addSelectLinkArr()">新建下拉框联动</Button>

                            <Button type="warning" @click="addCheckLinkArr()">新建二维多选框联动</Button>
                        </div>
                    </Col>
                </Row>
                <Row class="marginB">
                    <Col span="12" style="border: 1px solid #efefef;">
                        <div v-for="el,key in selectArr" class="selectForm">
                            <Row class="selectTitle" span="24">
                                <Col span="12" class="marginB3" style="width: 43%">
                                    <Input placeholder="请输入下拉框名称"
                                           @on-blur="changeValue(formInline[item.prop],item.prop)" clearable
                                           v-model="el.selectName" style="width:150px;"/>
                                </Col>
                                <Col span="12" class="marginB3" style="width: 55%">
                                    <Button type="info" @click="addOldOptionArr(el.id)">增加一项</Button>
                                    <Button type="error" @click="delOldSelectArr(key)">删除当前下拉框</Button>
                                </Col>
                            </Row>
                            <Form class="ty-content-element-form fixHeight">
                                <div v-for="item,index in el.option" :key="index" class="selectItem">
                                    <Row :gutter="24">
                                        <Col span="8">
                                            <Label class="tdWidth">
                                                项名
                                            </Label>
                                            <Input v-model="item.label" clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="8">
                                            <Label class="tdWidth">
                                                值
                                            </Label>
                                            <Input v-model="item.value " clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="4" class="deleteBtnStyle">
                                            <Button type="error" @click="deleteOldCurrentOption(el.id,index)">删除当前项
                                            </Button>
                                        </Col>
                                    </Row>
                                </div>
                            </Form>
                        </div>
                    </Col>
                    <Col span="12" style="border: 1px solid #efefef;">
                        <div v-for="el,key in newSelectArr" class="selectForm">
                            <Row class="selectTitle" :gutter="24">
                                <Col span="8" class="marginB3" style="width: 43%">
                                    <Input placeholder="请输入下拉框名称"
                                           @on-blur="changeValue(formInline[item.prop],item.prop)" clearable
                                           v-model="el.selectName" style="width:150px;"/>
                                </Col>
                                <Col span="8" class="marginB3" style="width: 55%">
                                    <Button type="info" @click="addOptionArr(el.id)">增加一项</Button>
                                    <Button type="error" @click="delSelectArr(key)">删除当前下拉框</Button>
                                </Col>
                            </Row>
                            <Form class="ty-content-element-form fixHeight">
                                <div v-for="item,index in el.option" :key="index" class="selectItem">
                                    <Row :gutter="24">
                                        <Col span="8">
                                            <Label class="tdWidth">
                                                项名
                                            </Label>
                                            <Input v-model="item.label" clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="8">
                                            <Label class="tdWidth">
                                                值
                                            </Label>
                                            <Input v-model="item.value" clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="4">
                                            <Button type="error" class="deleteBtnStyle"
                                                    @click="deleteCurrentOption(el.id,index)">删除当前项
                                            </Button>
                                        </Col>
                                    </Row>
                                </div>
                            </Form>
                        </div>
                        <div v-for="(el,key) in getNewSelectLinkArr" class="selectForm">
                            <Row class="selectTitle">
                                <Col span="6" class="marginB3" style="width: 43%">
                                    <Input placeholder="请输入下拉框名称"
                                           @on-blur="changeValue(formInline[item.prop],item.prop)" clearable
                                           v-model="el.selectName" style="width:150px;"/>
                                </Col>
                                <Col span="6" class="marginB3" style="width: 55%">
                                    <Button type="info" @click="addOptionLink(el.id)">增加一项</Button>
                                    <Button type="error" @click="delSelectLinkArr(key)">删除当前下拉框</Button>
                                </Col>
                            </Row>
                            <Form class="ty-content-element-form fixHeight">
                                <div v-for="(item,index) in el.option" class="selectItem">
                                    <Row :gutter="24">
                                        <Col span="10">
                                            <Label class="tdWidth">
                                                项名
                                            </Label>
                                            <Input v-model="item.label" clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="14">
                                            <Button type="info" @click="addOptionLinkArr(el.id,index)">增加子项</Button>
                                            <Button type="error" class="deleteBtnStyle"
                                                    @click="deleteCurrentOptionLink(el.id,index)">删除当前子项
                                            </Button>
                                        </Col>
                                    </Row>
                                    <Row :gutter="24">
                                        <Col span="24">
                                            <div v-for="(item2,index2) in item.arr" class="selectItem">

                                                <Row :gutter="24">
                                                    <Col span="8">
                                                        <Label class="tdWidth">
                                                            项名
                                                        </Label>
                                                        <Input v-model="item2.label" clearable style="width:150px;"/>
                                                    </Col>
                                                    <Col span="8">
                                                        <Label class="tdWidth">
                                                            值
                                                        </Label>
                                                        <Input v-model="item2.value" clearable style="width:150px;"/>
                                                    </Col>
                                                    <Col span="4">
                                                        <Button type="error" class="deleteBtnStyle"
                                                                @click="deleteCurrentOptionLinkArr(el.id,index,index2)">
                                                            删除当前子项
                                                        </Button>
                                                    </Col>
                                                </Row>
                                            </div>
                                        </Col>

                                    </Row>
                                </div>
                            </Form>
                        </div>

                        <div v-for="(el,key) in getCheckLinkLinkArr" class="selectForm">
                            <Row class="selectTitle">
                                <Col span="6" class="marginB3" style="width: 43%">
                                    <Input placeholder="请输入二维多选框名称"
                                           @on-blur="changeValue(formInline[item.prop],item.prop)" clearable
                                           v-model="el.selectName" style="width:150px;"/>
                                </Col>
                                <Col span="6" class="marginB3" style="width: 55%">
                                    <Button type="info" @click="addCheckOptionLink(el.id)">增加一项</Button>
                                    <Button type="error" @click="delCheckLinkArr(key)">删除当前下拉框</Button>
                                </Col>
                            </Row>
                            <Form class="ty-content-element-form fixHeight">
                                <div v-for="(item,index) in el.option" class="selectItem">
                                    <Row :gutter="24">
                                        <Col span="6">
                                            <Label class="tdWidth">
                                                标签
                                            </Label>
                                            <Input v-model="item.label" clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="6">
                                            <Label class="tdWidth">
                                                值
                                            </Label>
                                            <Input v-model="item.value" clearable style="width:150px;"/>
                                        </Col>
                                        <Col span="4">
                                            <Label class="tdWidth">
                                                是否显示文本框
                                            </Label>
                                            <i-switch class="main-li-item-switch" v-model="item.show"></i-switch>
                                        </Col>
                                        <Col span="6">
                                            <Button type="info" @click="addCheckOptionLinkArr(el.id,index)">增加子项
                                            </Button>
                                            <Button type="error" class="deleteBtnStyle"
                                                    @click="deleteCurrentCheckOptionLink(el.id,index)">删除当前子项
                                            </Button>
                                        </Col>
                                    </Row>
                                    <Row :gutter="24">
                                        <Col span="24">
                                            <div v-for="(item2,index2) in item.radioList" class="selectItem">
                                                <Row :gutter="24">
                                                    <Col span="6">
                                                        <Label class="tdWidth">
                                                            项名
                                                        </Label>
                                                        <Input v-model="item2.name" clearable style="width:150px;"/>
                                                    </Col>
                                                    <Col span="6">
                                                        <Label class="tdWidth">
                                                            值
                                                        </Label>
                                                        <Input v-model="item2.value " clearable style="width:150px;"/>
                                                    </Col>
                                                    <Col span="4">
                                                        <Label class="tdWidth">
                                                            是否被选中
                                                        </Label>
                                                        <i-switch class="main-li-item-switch"
                                                                  v-model="item2.isSelected"></i-switch>
                                                    </Col>
                                                    <Col span="3">
                                                        <Button type="error" class="deleteBtnStyle"
                                                                @click="deleteCurrentCheckOptionLinkArr(el.id,index,index2)">
                                                            删除当前子项
                                                        </Button>
                                                    </Col>
                                                </Row>
                                            </div>
                                        </Col>

                                    </Row>
                                </div>
                            </Form>
                        </div>

                    </Col>
                </Row>
            </Content>
            <Footer>
                <Button @click="closeModal()">关闭</Button>
                <Button type="primary" @click="saveConfigData(1)">保存</Button>
            </Footer>
        </Layout>
    </div>
</template>

<script>
    /**
     *@author       叶章浩
     *@date         2018/11/26 19:22
     *@Copyright    天源迪科信息技术股份有限公司
     *@Description
     */
    import Service from '../../service/pageIde/tool-service';
    import commonConfig from './commonConfig';

    export default {
        name: 'globalSetting',
        data () {
            return {
                transArr: ['表单最终字段', '表单移除字段列表'],
                allSelect: [],
                listStyle: {
                    width: '275px',
                    height: '475px'
                },
                //note 存储数组字段
                arrProp: [],
                //note 存储缓存中的表格、下拉框、文本框中的属性名称
                cacheNameArr: [],
                //note 存储公共属性
                formInline: {
                    applyName: '',
                    'timeLineData': [
                        {
                            'color': 'green',
                            'dealTimeStr': '2018-05-05 14:22:10',
                            'workerName': '张三',
                            'operateType': '同意',
                            'content': '发布1.0版本'
                        },
                        {
                            'color': 'green',
                            'dealTimeStr': '2018-05-05 14:22:10',
                            'workerName': '张三',
                            'operateType': '流转',
                            'content': '发布1.0版本'
                        },
                        {
                            'color': 'red',
                            'dealTimeStr': '2018-05-05 14:22:10',
                            'workerName': '张三',
                            'operateType': '处理',
                            'content': '发布1.0版本'
                        },
                        {
                            'color': 'blue',
                            'dealTimeStr': '2018-05-05 14:22:10',
                            'workerName': '张三',
                            'operateType': '派发',
                            'content': '发布1.0版本'
                        }
                    ],
                    'infoAttachment': [
                        {
                            'name': '企业营业执照',
                            'fileUrl': '1'
                        },
                        {
                            'name': '房屋租赁合同',
                            'fileUrl': '2'
                        },
                        {
                            'name': '消防意见书',
                            'fileUrl': '3'
                        },
                        {
                            'name': '广告未设置前整体原景彩图',
                            'fileUrl': '4'
                        },
                        {
                            'name': '广告未设置后整体彩图',
                            'fileUrl': '5'
                        }
                    ],
                    state: '',
                    isOut: 0,
                    datetime: [],
                    address: '',
                    remark: '',
                    accessoryGroupId: '',
                    legalMan: '',
                    legalManTelPhone: '',
                    contactMan: '',
                    telPhone: '',
                    setAddress: '',
                    setContent: '',
                    material: '',
                    title: localStorage.title,
                    maxSteps: localStorage.maxStep || 0,
                    TITLE: localStorage.title || '',
                    MAXSTEPS: localStorage.maxStep || 0
                },
                ruleInline: {},
                status: '',
                //note 存储缓存下拉框
                newSelectArr: [],
                //note 下拉框联动
                newSelectLinkArr: [],
                //note 二维多选框的值
                checkLinkArr: [],
                selectArr: [],
                localSelectArr: [{
                    selectName: 'XB',
                    option: [
                        {
                            'label': '男',
                            'value': '1'
                        },
                        {
                            'label': '女',
                            'value': '2'
                        }
                    ]
                }, {
                    selectName: 'MZ',
                    option: [
                        {
                            'label': '汉族',
                            'value': '01'
                        },
                        {
                            'value': '02',
                            'label': '蒙古族'
                        },
                        {
                            'value': '03',
                            'label': '回族'
                        },
                        {
                            'value': '04',
                            'label': '藏族'
                        },
                        {
                            'value': '05',
                            'label': '维吾尔族'
                        },
                        {
                            'value': '06',
                            'label': '苗族'
                        },
                        {
                            'value': '07',
                            'label': '彝族'
                        },
                        {
                            'value': '08',
                            'label': '壮族'
                        },
                        {
                            'value': '09',
                            'label': '布依族'
                        },
                        {
                            'value': '10',
                            'label': '朝鲜族'
                        },
                        {
                            'value': '11',
                            'label': '满族'
                        },
                        {
                            'value': '12',
                            'label': '侗族'
                        },
                        {
                            'value': '13',
                            'label': '瑶族'
                        },
                        {
                            'value': '14',
                            'label': '白族'
                        },
                        {
                            'value': '15',
                            'label': '土家族'
                        },
                        {
                            'value': '16',
                            'label': '哈尼族'
                        },
                        {
                            'value': '17',
                            'label': '哈萨克族'
                        },
                        {
                            'value': '18',
                            'label': '傣族'
                        },
                        {
                            'value': '19',
                            'label': '黎族'
                        },
                        {
                            'value': '20',
                            'label': '傈僳族'
                        },
                        {
                            'value': '21',
                            'label': '佤族'
                        },
                        {
                            'value': '22',
                            'label': '畲族'
                        },
                        {
                            'value': '23',
                            'label': '高山族'
                        },
                        {
                            'value': '24',
                            'label': '拉祜族'
                        },
                        {
                            'value': '25',
                            'label': '水族'
                        },
                        {
                            'value': '26',
                            'label': '东乡族'
                        },
                        {
                            'value': '27',
                            'label': '纳西族'
                        },
                        {
                            'value': '28',
                            'label': '景颇族'
                        },
                        {
                            'value': '29',
                            'label': '柯尔克孜族'
                        },
                        {
                            'value': '30',
                            'label': '土族'
                        },
                        {
                            'value': '31',
                            'label': '达斡尔族'
                        },
                        {
                            'value': '32',
                            'label': '仫佬族'
                        },
                        {
                            'value': '33',
                            'label': '羌族'
                        },
                        {
                            'value': '34',
                            'label': '布朗族'
                        },
                        {
                            'value': '35',
                            'label': '撒拉族'
                        },
                        {
                            'value': '36',
                            'label': '毛难族'
                        },
                        {
                            'value': '37',
                            'label': '仡佬族'
                        },
                        {
                            'value': '38',
                            'label': '锡伯族'
                        },
                        {
                            'value': '39',
                            'label': '阿昌族'
                        },
                        {
                            'value': '40',
                            'label': '普米族'
                        },
                        {
                            'value': '41',
                            'label': '塔吉克族'
                        },
                        {
                            'value': '42',
                            'label': '怒族'
                        },
                        {
                            'value': '43',
                            'label': '乌孜别克族'
                        },
                        {
                            'value': '44',
                            'label': '俄罗斯族'
                        },
                        {
                            'value': '45',
                            'label': '鄂温克族'
                        },
                        {
                            'value': '46',
                            'label': '崩龙族'
                        },
                        {
                            'value': '47',
                            'label': '保安族'
                        },
                        {
                            'value': '48',
                            'label': '裕固族'
                        },
                        {
                            'value': '49',
                            'label': '京族'
                        },
                        {
                            'value': '50',
                            'label': '塔塔尔族'
                        },
                        {
                            'value': '51',
                            'label': '独龙族'
                        },
                        {
                            'value': '52',
                            'label': '鄂伦春族'
                        },
                        {
                            'value': '53',
                            'label': '赫哲族'
                        },
                        {
                            'value': '54',
                            'label': '门巴族'
                        },
                        {
                            'value': '55',
                            'label': '珞巴族'
                        },
                        {
                            'value': '56',
                            'label': '基诺族'
                        },
                        {
                            'value': '97',
                            'label': '其他'
                        },
                        {
                            'value': '98',
                            'label': '外国血统'
                        }
                    ]
                }, {
                    selectName: 'SFZ_LX',
                    option: [
                        {
                            'label': '中华人民共和国居民身份证',
                            'value': '1'
                        },
                        {
                            'label': '港澳台有效身份证件',
                            'value': '2'
                        },
                        {
                            'label': '外国（地区）护照',
                            'value': '3'
                        },
                        {
                            'label': '其他有效身份证件',
                            'value': '4'
                        }
                    ]
                }, {
                    selectName: 'ZW',
                    option: [
                        {
                            'label': '董事长兼总经理',
                            'value': '1'
                        },
                        {
                            'label': '董事兼总经理',
                            'value': '2'
                        },
                        {
                            'label': '执行董事兼总经理',
                            'value': '3'
                        },
                        {
                            'label': '董事长',
                            'value': '4'
                        },
                        {
                            'label': '副董事长',
                            'value': '5'
                        },
                        {
                            'label': '董事',
                            'value': '6'
                        },
                        {
                            'label': '执行董事',
                            'value': '7'
                        },
                        {
                            'label': '总经理',
                            'value': '8'
                        },
                        {
                            'label': '副总经理',
                            'value': '9'
                        },
                        {
                            'label': '经理',
                            'value': '10'
                        },
                        {
                            'label': '负责人',
                            'value': '11'
                        },
                        {
                            'label': '总务主任',
                            'value': '12'
                        },
                        {
                            'label': '专职管理员',
                            'value': '13'
                        },
                        {
                            'label': '其他人员',
                            'value': '14'
                        }
                    ]
                }],
                val: '',
                allData: [],
                //note 存储表单属性
                targetData: [],
                //note 存储缓存表格
                tableArr: [],
                commonBirthProp: [],
                commonCheckProp: [],
                commonConfigData: [],
                commonIdentityCheckProp: [],
                commonTableProp: [],
                commonSelectProp: [],
                saveBirthProp: [],
                saveIdentityCheckProp: [],
                saveCheckProp: [],
                saveTableProp: [],
                saveSelectProp: []
            };
        },//
        watch: {
            allSelect (newData, oldData) {
                debugger;
                this.selectArr = [];
                newData.forEach((el, index) => {
                    this.localSelectArr.forEach((li, index2) => {
                        if (el == li.selectName) {
                            this.selectArr.push(li);
                        }
                    });
                });
                console.log(this.selectArr);

            }
        },
        computed: {
            getCheckLinkLinkArr () {
                return this.checkLinkArr;
            },

            getNewSelectLinkArr () {
                debugger;
                return this.newSelectLinkArr;
            },
            getTableArr () {
                return this.tableArr;
            },
            getSelectArr () {
                return this.selectArr;
            },
            getItems () {
                return [];
            },
            getAllData () {
                return this.allData;
            },
            getTargetData () {
                return this.targetData;
            },
            getCommonConfigData () {
                return this.commonConfigData;
            },
            getTableProp () {
                return this.commonTableProp;
            },
            getBirthProp () {
                return this.commonBirthProp;
            },
            getCheckProp () {
                return this.commonCheckProp;
            },
            getIdentityCheckProp () {
                return this.commonIdentityCheckProp;
            },
            getSelectProp () {
                return this.commonSelectProp;
            }
        },
        methods: {
            // note 校验规则方法
            validateTable (rule, value, callback) {
                let str = '表格';
                let arr = this.commonTableProp;
                if (rule.field.indexOf('select') !== -1) {
                    str = '下拉框联动';
                    arr = this.commonSelectProp;
                } else if (rule.field.indexOf('birth') !== -1) {
                    str = '身份证联动日期';
                    arr = this.commonBirthProp;
                } else if (rule.field.indexOf('identity') !== -1) {
                    str = '身份证校验社保卡';
                    arr = this.commonIdentityCheckProp;
                } else if (rule.field.indexOf('check') !== -1) {
                    str = '多选框关联';
                    arr = this.commonCheckProp;
                }
                if (!value) {
                    callback(new Error(str + '属性不能为空'));
                } else {
                    let count = 1;
                    for (let i = 0; i < arr.length; i++) {
                        if (this.formInline[arr[i].prop] === value) {
                            count++;
                            if (count > 2) {
                                callback(new Error(str + '属性不能重复'));
                                return;
                            }
                        }
                    }
                    callback();
                }
            },
            deleteCommonData (type, index) {
                switch (type) {
                    case 'table':
                        this.commonTableProp.splice(index, 1);
                        break;
                    case 'select':
                        this.commonSelectProp.splice(index, 1);
                        break;
                    case 'id':
                        this.commonBirthProp.splice(index, 1);
                        break;
                    case 'id-shebao':
                        this.commonIdentityCheckProp.splice(index, 1);
                        break;
                    case 'select-more':
                        this.commonCheckProp.splice(index, 1);
                        break;
                }
            },
            //note 修改文本框的值
            changeValue (val, item) {
                debugger;
                val = val.replace(/[^a-zA-Z]/g, '');
                this.formInline[item] = val;
            },
            //note 增加身份证检擦社保卡
            addIdentityCheckProp () {
                let myTableProp = 'identityCheck' + this.commonIdentityCheckProp.length;
                this.saveIdentityCheckProp.push(myTableProp);
                let obj = {
                    'type': 'input',
                    'label': '请输入校验社保卡属性',
                    'prop': myTableProp,
                    'extend': {
                        'placeholder': '请输入校验社保卡属性',
                        'itemWidth': 320
                    }
                };
                this.commonIdentityCheckProp.push(obj);
            },
            addBirthProp () {
                let myTableProp = 'birthProp' + this.commonBirthProp.length;
                this.saveBirthProp.push(myTableProp);
                let obj = {
                    'type': 'input',
                    'label': '请输入出生日期属性名称',
                    'prop': myTableProp,
                    'extend': {
                        'placeholder': '请输入出生日期属性名称',
                        'itemWidth': 320
                    }
                };
                this.commonBirthProp.push(obj);
            },
            addCheckProp () {
                let myTableProp = 'checkProp' + this.commonCheckProp.length;
                this.saveCheckProp.push(myTableProp);
                let obj = {
                    'type': 'input',
                    'label': '请输入多选框属性名称',
                    'prop': myTableProp,
                    'extend': {
                        'placeholder': '请输入多选框属性名称',
                        'itemWidth': 320
                    }
                };
                this.commonCheckProp.push(obj);
            },
            //note 添加表格属性
            addSelectProp () {
                let myTableProp = 'selectProp' + this.commonSelectProp.length;
                this.saveSelectProp.push(myTableProp);
                let obj = {
                    'type': 'input',
                    'label': '请输入下拉框属性名称',
                    'prop': myTableProp,
                    'extend': {
                        'placeholder': '请输入下拉框属性名称',
                        'itemWidth': 320
                    }
                };
                this.commonSelectProp.push(obj);
            },
            //note 添加表格属性
            addTableProp () {
                let myTableProp = 'tableProp' + this.commonTableProp.length;
                this.saveTableProp.push(myTableProp);
                let obj = {
                    'type': 'input',
                    'label': '请输入表格属性名称',
                    'prop': myTableProp,
                    'extend': {
                        'placeholder': '请输入表格属性名称',
                        'itemWidth': 320
                    }
                };
                this.commonTableProp.push(obj);
            },
            myTableProp () {
                let test = JSON.stringify(this.commonTableProp);
                console.log(test);
                console.log(this.formInline);
                debugger;
                let myObj = {};
                let nameArr = [];
                for (let el in this.formInline) {
                    console.log(this.formInline[el]);
                    for (let i = 0; i < this.saveTableProp.length; i++) {
                        if (el == this.saveTableProp[i]) {
                            //this.formInline
                            let tableObj = {
                                name: this.formInline[el]
                            };
                            nameArr.push(tableObj);
                            myObj[this.formInline[el]] = [];
                        }
                    }
                }
                localStorage.tableProp = JSON.stringify(nameArr);
                console.log(myObj);
                Object.assign(this.formInline, myObj);
                /*for(let el in this.formInline){
                    console.log(this.formInline[el]);
                    for(let i=0;i<this.saveTableProp.length;i++){
                        if(el==this.saveTableProp[i]){
                            //this.formInline
                         //   delete this.formInline[el];
                        }
                    }
                }*/
                console.log(this.formInline);
            },
            mySelectProp () {
                let test = JSON.stringify(this.commonSelectProp);
                console.log(test);
                console.log(this.formInline);
                debugger;
                let myObj = {};
                let nameArr = [];
                for (let el in this.formInline) {
                    console.log(this.formInline[el]);
                    for (let i = 0; i < this.saveSelectProp.length; i++) {
                        if (el == this.saveSelectProp[i]) {
                            //this.formInline
                            let tableObj = {
                                name: this.formInline[el],
                                busiName: this.formInline[el],
                                busiDesc: this.formInline[el]
                            };
                            nameArr.push(tableObj);
                            myObj[this.formInline[el]] = '';
                        }
                    }
                }
                localStorage.selectProp = JSON.stringify(nameArr);
                console.log(myObj);
                Object.assign(this.formInline, myObj);
                /*for(let el in this.formInline){
                    console.log(this.formInline[el]);
                    for(let i=0;i<this.saveTableProp.length;i++){
                        if(el==this.saveTableProp[i]){
                            //this.formInline
                         //   delete this.formInline[el];
                        }
                    }
                }*/
                console.log(this.formInline);
            },
            myBirthProp () {
                let test = JSON.stringify(this.commonBirthProp);
                console.log(test);
                console.log(this.formInline);
                debugger;
                let myObj = {};
                let nameArr = [];
                for (let el in this.formInline) {
                    console.log(this.formInline[el]);
                    for (let i = 0; i < this.saveBirthProp.length; i++) {
                        if (el == this.saveBirthProp[i]) {
                            //this.formInline
                            let tableObj = {
                                name: this.formInline[el],
                                busiName: this.formInline[el],
                                busiDesc: this.formInline[el]
                            };
                            nameArr.push(tableObj);
                            myObj[this.formInline[el]] = '';
                        }
                    }
                }
                localStorage.birthProp = JSON.stringify(nameArr);
                console.log(myObj);
                Object.assign(this.formInline, myObj);
                /*for(let el in this.formInline){
                    console.log(this.formInline[el]);
                    for(let i=0;i<this.saveTableProp.length;i++){
                        if(el==this.saveTableProp[i]){
                            //this.formInline
                         //   delete this.formInline[el];
                        }
                    }
                }*/
                console.log(this.formInline);
            },
            myIdentityCheckProp () {
                let test = JSON.stringify(this.commonIdentityCheckProp);
                console.log(test);
                console.log(this.formInline);
                debugger;
                let myObj = {};
                let nameArr = [];
                for (let el in this.formInline) {
                    console.log(this.formInline[el]);
                    for (let i = 0; i < this.saveIdentityCheckProp.length; i++) {
                        if (el == this.saveIdentityCheckProp[i]) {
                            //this.formInline
                            let tableObj = {
                                name: this.formInline[el],
                                busiName: this.formInline[el],
                                busiDesc: this.formInline[el]
                            };
                            nameArr.push(tableObj);
                            myObj[this.formInline[el]] = '';
                        }
                    }
                }
                localStorage.identityCheckProp = JSON.stringify(nameArr);
                console.log(myObj);
                Object.assign(this.formInline, myObj);
                /*for(let el in this.formInline){
                    console.log(this.formInline[el]);
                    for(let i=0;i<this.saveTableProp.length;i++){
                        if(el==this.saveTableProp[i]){
                            //this.formInline
                         //   delete this.formInline[el];
                        }
                    }
                }*/
                console.log(this.formInline);
            },
            myCheckProp () {
                let test = JSON.stringify(this.commonCheckProp);
                console.log(test);
                console.log(this.formInline);
                debugger;
                let myObj = {};
                let nameArr = [];
                for (let el in this.formInline) {
                    console.log(this.formInline[el]);
                    for (let i = 0; i < this.saveCheckProp.length; i++) {
                        if (el == this.saveCheckProp[i]) {
                            //this.formInline
                            let tableObj = {
                                name: this.formInline[el],
                                busiName: this.formInline[el],
                                busiDesc: this.formInline[el]
                            };
                            nameArr.push(tableObj);
                            myObj[this.formInline[el]] = '';
                        }
                    }
                }
                localStorage.checkProp = JSON.stringify(nameArr);
                console.log(myObj);
                Object.assign(this.formInline, myObj);
                /*for(let el in this.formInline){
                    console.log(this.formInline[el]);
                    for(let i=0;i<this.saveTableProp.length;i++){
                        if(el==this.saveTableProp[i]){
                            //this.formInline
                         //   delete this.formInline[el];
                        }
                    }
                }*/
                console.log(this.formInline);
            },
            //關閉對話框
            closeModal () {
                debugger;
                Bus.$emit('closeConfig');
            },
            //note 回到主页
            gotoHome () {
                this.$router.push({
                    name: 'default',
                });
            },
            //note 下拉框改变事件
            change_status (val) {  // 筛选状态

                console.log(val);
            },
            //note 获取唯一ID
            getUnitId () {
                let len = 10;
                let $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
                /****默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1****/
                var maxPos = $chars.length;
                var pwd = '';
                for (let i = 0; i < len; i++) {
                    pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
                }
                return pwd;
            },
            //note 添加表格，删除表格
            delTableArr (index) {
                this.tableArr.splice(index, 1);
            },
            //note删除一列
            deleteCurrentCulum (tableId, index) {

                this.tableArr.map(function (item, key, ary) {
                    if (item.id == tableId) {
                        item.column.splice(index, 1);
                    }
                });
                console.log(this.tableArr);
            },
            //note 创建一列
            addColumnArr (id) {
                let columnObj = {
                    title: '',
                    key: ''
                };
                this.tableArr.map(function (item, key, ary) {
                    if (item.id == id) {
                        item.column.push(columnObj);
                    }
                });
                console.log(this.tableArr);
            },
            //note 创建一个表格
            addTableArr () {
                let obj = {
                    id: this.getUnitId(),
                    tableName: '',
                    column: []
                };
                this.tableArr.push(obj);
            },
            addCheckLinkArr () {
                let obj = {
                    id: this.getUnitId(),
                    selectName: '',
                    option: []
                };
                this.checkLinkArr.push(obj);
            },
            //note 新建联动下拉框
            addSelectLinkArr () {
                let obj = {
                    id: this.getUnitId(),
                    selectName: '',
                    option: []
                };
                this.newSelectLinkArr.push(obj);
            },
            //note 创建一个下拉框
            addSelectArr () {

                let obj = {
                    id: this.getUnitId(),
                    selectName: '',
                    option: []
                };
                this.newSelectArr.push(obj);
            },

            //note 创建下拉框一个选项
            addOldOptionArr (id) {

                let columnObj = {
                    label: '',
                    value: ''
                };
                this.selectArr.map(function (item, key, ary) {
                    if (item.id == id) {
                        item.option.push(columnObj);
                    }
                });
                console.log(this.newSelectArr);
            },
            //note 添加表格，删除表格
            delOldSelectArr (index) {
                this.selectArr.splice(index, 1);
            },
            //note删除一列
            deleteOldCurrentOption (selectId, index) {

                this.selectArr.map(function (item, key, ary) {
                    if (item.id == selectId) {
                        item.option.splice(index, 1);
                    }
                });
                console.log(this.tableArr);
            },

            addCheckOptionLinkArr (id, index) {
                let columnObj = {
                    name: '',
                    value: '',
                    isSelected: false
                };
                debugger;
                this.checkLinkArr.map(function (el, myIndex, ary) {
                    if (el.id == id) {
                        el.option.map(function (item, key, ary) {
                            if (key == index) {
                                if (!item.radioList) {
                                    item.radioList = [];
                                }
                                item.radioList.push(columnObj);
                            }
                        });
                    }
                });
                this.checkLinkArr = [...this.checkLinkArr];
            },
            addOptionLinkArr (id, index) {
                let columnObj = {
                    label: '',
                    value: ''
                };
                debugger;
                this.newSelectLinkArr.map(function (el, myIndex, ary) {
                    if (el.id == id) {
                        el.option.map(function (item, key, ary) {
                            if (key == index) {
                                if (!item.arr) {
                                    item.arr = [];
                                }
                                item.arr.push(columnObj);
                            }
                        });
                    }
                });
                this.newSelectLinkArr = [...this.newSelectLinkArr];
            },

            //note 创建二维下拉框
            addCheckOptionLink (id) {
                debugger;
                let columnObj = {
                    label: '',
                    value: '',
                    show: false
                };
                this.checkLinkArr.map(function (item, key, ary) {
                    if (item.id == id) {
                        item.option.push(columnObj);
                    }
                });
            },

            //note 创建子项联动下拉框
            addOptionLink (id) {
                debugger;
                let columnObj = {
                    label: '',
                    value: ''
                };
                this.newSelectLinkArr.map(function (item, key, ary) {
                    if (item.id == id) {
                        item.option.push(columnObj);
                    }
                });
            },
            //note 创建下拉框一个选项
            addOptionArr (id) {
                let columnObj = {
                    label: '',
                    value: ''
                };
                this.newSelectArr.map(function (item, key, ary) {
                    if (item.id == id) {
                        item.option.push(columnObj);
                    }
                });
                console.log(this.newSelectArr);
            },
            //note 删除二维多选框
            delCheckLinkArr (index) {
                this.checkLinkArr.splice(index, 1);
            },
            //note 添加表格，删除表格
            delSelectLinkArr (index) {
                this.newSelectLinkArr.splice(index, 1);
            },
            deleteCurrentCheckOptionLinkArr (selectId, index, shenduId) {
                debugger;
                this.checkLinkArr.map(function (item, key, ary) {
                    if (item.id == selectId) {
                        item.option.map(function (item2, key2, ary2) {
                            if (index == key2) {
                                item2.arr.splice(shenduId, 1);
                            }
                        });
                    }
                });
                this.checkLinkArr = [...this.checkLinkArr];
            },
            //note 删除深度一列
            deleteCurrentOptionLinkArr (selectId, index, shenduId) {
                debugger;
                this.newSelectLinkArr.map(function (item, key, ary) {
                    if (item.id == selectId) {
                        item.option.map(function (item2, key2, ary2) {
                            if (index == key2) {
                                item2.arr.splice(shenduId, 1);
                            }
                        });
                    }
                });
                this.newSelectLinkArr = [...this.newSelectLinkArr];
            },
            deleteCurrentCheckOptionLink (selectId, index) {

                this.checkLinkArr.map(function (item, key, ary) {
                    if (item.id == selectId) {
                        item.option.splice(index, 1);
                    }
                });
                console.log(this.checkLinkArr);
            },
            //note删除一列
            deleteCurrentOptionLink (selectId, index) {

                this.newSelectLinkArr.map(function (item, key, ary) {
                    if (item.id == selectId) {
                        item.option.splice(index, 1);
                    }
                });
                console.log(this.tableArr);
            },

            //note 添加表格，删除表格
            delSelectArr (index) {
                this.newSelectArr.splice(index, 1);
            },
            //note删除一列
            deleteCurrentOption (selectId, index) {

                this.newSelectArr.map(function (item, key, ary) {
                    if (item.id == selectId) {
                        item.option.splice(index, 1);
                    }
                });
                console.log(this.tableArr);
            },
            //note 设置table select form target目标缓存
            setLocalCache () {
                let tableArr = JSON.stringify(this.tableArr);
                localStorage.setItem('tableArr', tableArr);
                let selectArr = JSON.stringify(this.selectArr);
                localStorage.setItem('selectArr', selectArr);
                /*let targetData=JSON.stringify(this.targetData);
                localStorage.setItem("targetData",targetData);
                let formInline=JSON.stringify(this.formInline);
                localStorage.setItem("formInline",formInline);*/
            },
            //note 从缓存中初始化数据
            initLocalCache () {
                debugger;
                if (localStorage.getItem('tableArr') && localStorage.getItem('tableArr') != 'undefined') {
                    this.tableArr = JSON.parse(localStorage.getItem('tableArr'));
                }
                if (localStorage.status == '1') {
                    if (localStorage.getItem('selectArr') && localStorage.getItem('selectArr') != 'undefined') {
                        this.selectArr = JSON.parse(localStorage.getItem('selectArr') || []);
                        let checkArr = [];
                        this.selectArr.forEach((el, index) => {
                            checkArr.push(el.selectName);
                        });
                        this.allSelect = checkArr;
                    }
                }
                if (localStorage.getItem('formInline') && localStorage.getItem('formInline') != 'undefined') {
                    this.formInline = JSON.parse(localStorage.getItem('formInline'));
                }
            },
            //note 获取templateCache的值
            saveTemplateCache () {
                debugger;
                this.cacheNameArr = [];  //cacheNameArr
                let selectLinkArr = [];
                this.newSelectLinkArr.forEach((el, index) => {
                    let selectLinkObj = {};
                    el.option.forEach((ele, key) => {
                        ele[ele.label] = ele.arr;
                        selectLinkObj[ele.label] = ele.arr;
                    });
                    selectLinkArr.push({selectName: el.selectName, option: selectLinkObj});
                });

                /*  let checkLinkArr=[];
                  this.checkLinkArr.forEach((el,index)=>{
                      let selectLinkObj={};
                      el.option.forEach((ele,key)=>{
                          ele[ele.label]=ele.arr;
                          selectLinkObj[ele.label]=ele.arr;
                      })

                      checkLinkArr.push({selectName:el.selectName,option:selectLinkObj})
                  })*/
                let isCheckArr = [...this.newSelectArr, ...selectLinkArr, ...this.checkLinkArr];

                this.localSelectArr = [...this.localSelectArr, ...this.newSelectArr, ...selectLinkArr, ...this.checkLinkArr];
                this.selectArr = [...this.selectArr, ...this.newSelectArr, ...selectLinkArr, ...this.checkLinkArr];
                isCheckArr.forEach((el, index) => {
                    this.allSelect.push(el.selectName);
                });
                let templateCache = {
                    'validators': [],
                    'tableArr': this.tableArr,
                    'selectArr': this.selectArr,
                    'selectLinkArr': this.newSelectLinkArr,
                    'targetData': this.targetData
                };//创建templateCache 模板
                let _this = this;
                /*   this.tableArr.map(function(item,key,ary) {
                       templateCache[item.tableName]=item.column;
                       _this.cacheNameArr.push({key:"templateCache."+item.tableName,value:item.tableName})
                   });*/
                /* selectLinkArr.map(function(item,key,ary) {
                     templateCache[item.name]=item.option;
                     _this.cacheNameArr.push({key:"templateCache."+item.name,value:item.data})
                 });*/
                this.selectArr.map(function (item, key, ary) {
                    templateCache[item.selectName] = item.option;
                    _this.cacheNameArr.push({key: 'templateCache.' + item.selectName, value: item.selectName});
                });
                localStorage.setItem('cacheListener', JSON.stringify(this.cacheNameArr));
                this.newSelectArr = [];
                this.newSelectLinkArr = [];
                this.checkLinkArr = [];
                //Bus.$emit("cacheListener", this.cacheNameArr);
                console.log(templateCache);
                return templateCache;
            },
            // note 组装事项中的page数据
            saveConfigData (type) {
                this.$refs['formInline'].validate((valid) => {
                    if (valid) {
                        this.myTableProp();// note 设置表格属性
                        this.mySelectProp();// note 设置下拉框联动属性
                        this.myCheckProp();// note 设置多选框联动属性
                        this.myIdentityCheckProp();// note 设置多选框联动属性
                        this.myBirthProp();// note 设置出身日期联动属性
                        let templateCache = this.saveTemplateCache();
                        console.log(this.targetData);
                        let page = {
                            fullModel: {
                                templateCache: templateCache
                            }
                        };
                        this.targetData.map((item, key, ary) => {
                            let isHave = true;
                            this.arrProp.forEach((el, index) => {
                                if (item == el) {
                                    isHave = false;
                                    return false;
                                } else {

                                }
                            });
                            if (!isHave) {
                                page.fullModel[item] = [];
                            } else {
                                page.fullModel[item] = '';
                            }
                        });
                        console.log(page);
                        // Note 从commonConfigData中取出fullmode 和title、maxSteps
                        debugger;
                        console.log(this.commonConfigData);
                        let fullModel = this.formInline;
                        page.title = localStorage.title;
                        localStorage.title = this.formInline.title;
                        page.maxSteps = parseInt(localStorage.maxStep);
                        // 删除标题和最大步数
                        page.fullModel = {...page.fullModel, ...fullModel};
                        debugger;
                        // note 把formTable 中的key加入到fullModel
                        if (localStorage.formTableKey && localStorage.formTableKey != null) {
                            let formTableKeyArr = eval('(' + localStorage.formTableKey + ')');
                            formTableKeyArr.forEach(function (v, k) {
                                console.log(v); // 这样就会分别将name遍历出来
                                page.fullModel[v] = [];
                            });
                        }
                        delete page.fullModel.TITLE;
                        delete page.fullModel.MAXSTEPS;
                        delete page.fullModel.title;
                        delete page.fullModel.maxSteps;
                        console.log(page);
                        let pageStr = JSON.stringify(page);
                        localStorage.setItem('page', pageStr);
                        let targetKeyObj = JSON.parse(localStorage.getItem('page'));
                        console.log(targetKeyObj);

                        // note 保存编辑数据，下次进来，直接修改
                        this.setLocalCache();
                        let _this = this;
                        this.$Modal.success({
                            title: '友情提示',
                            content: '保存成功',
                            onOk () {
                                _this.closeModal();
                            }
                        });
                    } else {
                        this.$Message.error('页面有错误,请检查后重试');
                    }
                });
            },
            //note 获取服务器端当前事项表中的数据
            getServiceData () {
                let _this = this;
                let mockData = [];
                debugger;
                // Service.selectFormProp(params).then((res) => {
                if (localStorage.propInfo && localStorage.propInfo != 'undefined') {
                    let res = JSON.parse(localStorage.propInfo);
                    let propArr = [];
                    let targetArr = [];
                    for (let propObj in res.prop) {
                        propArr = [...propArr, ...res.prop[propObj]];
                    }
                    let mockData = [];

                    this.propList = propArr;
                    //});
                    propArr.map((item, key, ary) => {
                        if (item.busiType == 'checkboxMultiple') {
                            this.arrProp.push(item.busiName);
                        }
                        targetArr.push(item.busiName);
                        mockData.push({
                            key: item.busiName,
                            label: item.busiDesc
                        });
                    });
                    console.log(mockData);
                    _this.allData = mockData;
                    _this.targetData = [];
                }
                //  });
            },
            //Note 加载本地公共事项中的配置   要往谢辉公共渲染组件中展示
            getCommonConfig () {
                let _this = this;
                debugger;
                _this.commonConfigData = commonConfig;
                let str = JSON.stringify(_this.commonConfigData);
                console.log('---->' + str);
            },
            handleChange2 (newTargetKeys) {

                this.targetData = newTargetKeys;
            },
            filterMethod (data, query) {
                return data.label.indexOf(query) > -1;
            }
        },
        created () {
            this.initLocalCache();
            this.getServiceData();
            this.getCommonConfig();
            /* Bus.$off("saveAllInfo",{});
             Bus.$on("saveAllInfo",()=>{
                 debugger;
                 this.saveConfigData(2);
             });*/
        }
    };
</script>

<style scoped>
    button {
        border-radius: 4px;
        margin: 8px 0;
    }

    .propertiesForm {
        border-bottom: 1px dashed lightgray;
        margin-bottom: 15px;
    }

    .propertiesItem {
        margin: 10px 0;
    }

    .selectForm {
        border: 1px solid #ccc;
        margin: 10px;
    }

    .selectTitle {
        line-height: 50px;
        margin-left: 20px;
        margin-right: 20px;
        border-bottom: 1px dashed lightgray;
    }

    .selectItem {
        line-height: 35px;
        margin-right: calc(220% - 100vw);
    }

    .fixHeight {
        height: auto;
        overflow-y: auto;
        overflow-x: hidden;
        /* line-height: 170px; */
        max-height: 300px;
        margin-left: 20px;
    }

    .deleteColumn {
        margin-top: 30px;
    }

    .deleteBtnStyle {
        margin-top: 26px;
    }

    .tdWidth {
        width: 200px;
        display: block;
    }

    .ivu-layout-header {
        background: #F5F5F5;
        color: black;
        text-align: center;
    }

    .ivu-layout-content {
        background: white;
    }

    .ivu-layout-footer {
        text-align: center;
    }

    .ivu-transfer-list {
        /*height: 100% !important;*/
        width: 290px !important;
        min-height: 500px;
    }

    .ivu-transfer-list-body {
        min-height: 400px;
    }

    .ivu-input-wrapper {
        width: 65%;
    }

    .marginT {
        margin-top: 30px;
    }

    .marginB {
        margin-bottom: 30px;
    }

    .marginB3 {
        margin-bottom: 3px;
        border-radius: 4px;
    }

    .labelInfo {
        display: block;
        background: #efefef;
        font-size: 20px;
        padding-left: 20px;
    }

</style>
<style lang="less">
    .global-setting-class {
        .ivu-form-item-error-tip {
            left: 365px;
            top: 10px;
            right: auto;
            width: 110px;
            padding-left: 10px;
        }
        .public-box{
            .ivu-form-item-label{
                line-height: 28px;
            }
        }
    }
</style>
