复杂数据传输
<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))
}
}
});
})
},
