复杂数据传输

发布时间 2023-07-17 11:15:50作者: 一封未寄出的信
<el-form ref="form" :model="form" label-width="90px" :rules="rules"  class="demo-ruleForm">
                <el-form-item label="公海回收规则:" prop="authocherk">
                    <el-radio-group v-model="form.authocherk" @change="handleAutho">
                        <el-radio v-for="item in option1" :label="item.label" :key="item.value">{{ item.value }}</el-radio>
                    </el-radio-group>
                </el-form-item>
                <div v-if="changeFlag">      
                <el-form-item label="天数维护:" prop="dateNum">
                    <el-input placeholder="" v-model.number="form.dateNum" style="width: 60px;"
                        oninput="value=value.replace(/[^\d]/g,'')"></el-input> 天没有新的成交,自动回收到客户公海
                </el-form-item>
                <el-form-item label="通知对象:">
                    <el-checkbox-group v-model="form.salseType" @change="handleSales">
                        <el-checkbox name="type" v-for="item in option2" :label="item.label" :key="item.key">{{ item.label
                        }}</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item label="通知方式:">
                    <el-checkbox-group v-model="form.emailType" @change="handleType">
                        <el-checkbox name="type" v-for="item in option3" :label="item.label" :key="item.key">{{ item.label
                        }}</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item label="提前通知:">
                    <el-checkbox-group v-model="form.advanceNotice" @change="handleNotice">
                        <el-checkbox :label="item.key" name="type" :key="item.key" v-for="item in option4"
                            :disabled="callDisabled">
                            <el-input v-model="item.param" :disabled="item.paramDisabled"
                                oninput="value=value.replace(/[^\d]/g,'')" style="width: 60px;"></el-input> 天
                        </el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item label="分配领取:">
                    <el-radio-group v-model="form.resource" @change="handleResource">
                        <el-radio v-for="item in option6" :label="item.label" :key="item.value">{{ item.value }}</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="领取规则:">
                    <el-checkbox-group v-model="form.drawLsit" @change="handleDrawList">
                        <el-checkbox name="type" v-for="item in option5" :label="item.label" :key="item.key"
                            :disabled="drawDisabled">{{ item.label }}</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>

                <el-form-item label="领取个数:">
                    每个成员每天最多领取 <el-input placeholder="" style="width: 60px;" v-model="form.receiveCount"
                        oninput="value=value.replace(/[^\d]/g,'')"></el-input> 个公海客户
                </el-form-item>
                <el-form-item label="不回收:" v-if="this.customerType==1">
                    <el-select v-model="form.customer" placeholder="请选择">
                        <el-option key="0" label="请选择不回收的客户级别" value="0"></el-option>
                        <el-option v-for="item in customerList" :key="item.crmCustomerGradeId" :label="item.customerGrade"
                            :value="item.crmCustomerGradeId">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item class="submit">
                    <el-button @click="handleReset">重 置</el-button>
                    <el-button type="primary" @click="onSubmit">保 存</el-button>
                </el-form-item>
            </div>
            </el-form>
 
form 表单默认数据:
 form: {
                authocherk: "1",
                dateNum: '',
                salseType: ["业务员"],
                emailType: ["邮件"],
                advanceNotice: ["select2", "select1"],
                resource: "1",
                drawLsit: [""],
                receiveCount: "",
                customer: "请选择回收数据",
                date: "",
            },
 option1: [
                { label: "1", value: "主动回收" },
                { label: "2", value: "不主动回收" }
            ],
            option2: [
                { key:"sales",value:true,label:"业务员"},
                { key:"salesSuperior",value:false,label:"业务员上级"}
            ],
            option3: [
                { label: "邮件", value: 1 },
            ],
            option4: [
                { param: 7, key: "select1", label: "天", value: true },
                { param: 4, key: "select2", label: "天", value: true },
            ],
            option5: [
                { key:"repeatReceive",value:false,label:"业务员可重复领取自己被回收的客户"},
            ],
            option6: [
                { label: "1", value: "管理员分配" },
                { label: "2", value: "管理员分配,成员可领取" }
            ],
 
 // 判断规则数据是否进行更改
        formRuleData(){
            this.submitList = [];
            let params = deepClone(this.copyGetList);
            params.forEach((val,index) => {
                let index1 = this.copyGetList.findIndex((item)=>item.configKey == val.configKey);
                if (val.name == '回收类型') {
                    this.packaging(val.configValue,this.form.authocherk,index1);
                } else if (val.name == '天数维护') {
                    this.packaging(val.configValue,this.form.dateNum,index1);
                } else if (val.name == '通知对象') {
                    this.packaging(val.configValue,JSON.stringify(this.option2),index1);
                } else if (val.name == '通知方式') {
                    this.packaging(val.configValue,JSON.stringify(this.option3),index1);
                } else if (val.name == '提前通知') {
                    this.packaging(val.configValue,JSON.stringify(this.option4),index1);
                } else if (val.name == '领取规则') {
                    this.packaging(val.configValue,JSON.stringify(this.option5),index1);
                } else if (val.name == '分配领取') {
                    this.packaging(val.configValue,this.form.resource,index1);
                } else if (val.name == '领取个数') {
                    if(this.form.receiveCount==''){
                        this.form.receiveCount=0;
                    }
                    this.packaging(val.configValue,this.form.receiveCount,index1);
                } else if (val.name == '不回收') {
                    if (this.form.customer == "请选择不回收的客户级别") {
                        this.form.customer = 0;
                    }
                    this.packaging(val.configValue,this.form.customer.toString(),index1);
                }
            })
        },
 // 提升数据(封装)
        packaging(val,data,index1){
            if(val !=data){
                this.submitList.push({
                    ...this.copyGetList[index1],
                    configValue: data
                });
            }
        },
 // 更新规则
        updateRule(data){
            updateRulesList(data).then((res) => {
                this.$message.success("客户公海更新成功!");
                this.getRulesListInfo();
                if (this.form.customer == "0") {
                    this.$set(this.form, "customer", "请选择不回收的客户级别")
                }
                if(this.form.receiveCount==0){
                    this.form.receiveCount="";
                }

            })
        },
 
//   监听通知对象
        handleSales(val) {
            this.judgeValue(val, this.option2);
            if(val[0] == '业务员上级'){
                this.form.salseType=['业务员','业务员上级']
                this.option2.forEach((item)=>{
                    item.value = true;
                })
            }
        },
        //   监听回收规则
        handleAutho(val) {
            if(this.form.authocherk==2){
                this.changeFlag=false;
                this.passiveRecycle(this.form.authocherk);
            }else{
                this.passiveRecycle(this.form.authocherk);
                this.changeFlag=true;
            }

        },
        // 当为不主动回收
        passiveRecycle(val){
            this.copyGetList.forEach((item)=>{
                if(item.name =='回收类型'){
                    this.recycle = item;
                }
            })
          this.recycle.configValue = val;
          var  params=[];
               params.push(this.recycle);
          this.updateRule(params);
        },
 
 //判断值是否相等(封装函数)
        judgeValue(value1, value2) {
            if (value1.length > 0) {
                if (value1.length == value2.length) {
                    value2.forEach((item) => {
                        item.value = true;
                    })
                } else {
                    for (var i = 0; i < value1.length; i++) {
                        for (var j = 0; j < value2.length; j++) {
                            if (value1[i] == value2[j].label || value1[i] == value2[j].key) {
                                value2[j].value = true;
                            } else {
                                value2[j].value = false;
                            }
                        }
                    }
                }
            } else {
                value2.forEach((item) => {
                    item.value = false;
                })
            }
        },
        //监听通知方式
        handleType(val) {
            this.judgeValue(val, this.option3);
            console.log(this.option3[0])
            if (this.option3[0].value) {
                this.callDisabled = false;
                this.form.advanceNotice = ["select2", "select1"]
                // this.paramDisabled = false;
                this.option4.forEach((item)=>{
                    item.paramDisabled = false;
                    item.value=true;
                })

            } else {
                // this.paramDisabled = true;
                this.option4.forEach((item)=>{
                    item.paramDisabled = true;
                })
                this.callDisabled = true;
                this.form.advanceNotice = []
                this.option4.forEach((item) => {
                    item.param = ""
                    item.value = false
                })
            }
        },
        //   监听领取规则
        handleDrawList(val) {
            this.judgeValue(val, this.option5);
        },
        //   监听提前通知
        handleNotice(val) {
            this.judgeValue(val, this.option4);
            this.option4.forEach((item) => {
                if (!val.includes(item.key)) {
                    item.param = ''
                    this.$set(item,"paramDisabled",true)
                }else{
                    this.$set(item,"paramDisabled",false)
                }
            })
        },
        //   监听分配领取
        handleResource(val) {
            if (val == 2) {
                this.drawDisabled = false
            } else {
                this.drawDisabled = true
                this.option5.forEach((item)=>{
                    item.value =false;
                })
                this.form.drawLsit = [];
            }
        },
 
 
//获取数据进行转化:
 getRulesListInfo() {
            if (this.customerType == 1) {
                this.tranferType = "officialCustomer"
            } else {
                this.tranferType = "potentialCustomers"
            }
            getRulesList({ category: this.tranferType }).then((res) => {
                this.copyGetList = res.data;
                res.data.forEach((item) => {
                    if (item.name == '回收类型') {
                        this.$set(this.form, "authocherk", item.configValue.toString());
                        if(this.form.authocherk==2){
                            this.changeFlag=false;
                        }else{
                            this.changeFlag=true;
                        }
                    } else if (item.name == '天数维护') {
                        this.$set(this.form, "dateNum", item.configValue.toString());
                    } else if (item.name == '通知对象') {
                        this.form.salseType = []
                        this.option2 = JSON.parse(item.configValue)
                        this.option2.forEach((item) => {
                            if (item.value) {
                                this.form.salseType.push(item.label)
                            }
                        })
                    } else if (item.name == '通知方式') {
                        this.form.emailType = [];
                        this.option3 = JSON.parse(item.configValue)
                        this.option3.forEach((item) => {
                            if (item.value) {
                                this.form.emailType.push(item.label)
                            }
                            if (this.form.emailType.length == 0) {
                                this.callDisabled = true;
                                // this.paramDisabled = true;
                                this.option4.forEach((item)=>{
                                    item.paramDisabled = true;
                                })
                            }
                        })
                    } else if (item.name == '提前通知') {
                        this.form.advanceNotice = [];
                        this.option4 = JSON.parse(item.configValue)
                        this.option4.forEach((item) => {
                            if (item.value) {
                                this.form.advanceNotice.push(item.key);
                            }
                        })
                    } else if (item.name == '领取规则') {
                        this.form.drawLsit = [];
                        this.option5 = JSON.parse(item.configValue)
                        this.option5.forEach((item) => {
                            if (item.value) {
                                this.form.drawLsit.push(item.label);
                            }
                        })
                    } else if (item.name == '分配领取') {
                        this.$set(this.form, "resource", item.configValue.toString());
                        if (this.form.resource == 2) {
                            this.drawDisabled = false
                        }

                    } else if (item.name == '领取个数') {
                        if(item.configValue == 0){
                            this.$set(this.form, "receiveCount", "");
                        }else{
                            this.$set(this.form, "receiveCount", item.configValue.toString());
                        }
                    } else if (item.name == '不回收') {
                        if (item.configValue == "0") {
                            this.$set(this.form, "customer", "请选择不回收的客户级别")
                        } else {
                            this.$set(this.form, "customer", parseInt(item.configValue))
                        }

                    }

                });
            })
        },