<template>
|
<el-dialog :title="title"
|
:visible.sync="dialogVisible"
|
width="1250px"
|
:before-close="handleClose">
|
<el-form ref="inputForm"
|
:model="form"
|
:inline="true"
|
label-width="120px">
|
<el-form-item label="跟进投诉来源"
|
prop="trackComplainSource"
|
:rules="rules.required">
|
<el-select filterable
|
:disabled="isReadonly"
|
v-model="form.trackComplainSource"
|
placeholder="请选择投诉来源">
|
<el-option v-for="item in trackComplainSourceList"
|
:key="item.itemno"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="投诉判断"
|
prop="trackComplainJudge"
|
:rules="rules.required">
|
<el-select filterable
|
:disabled="isReadonly"
|
v-model="form.trackComplainJudge"
|
placeholder="请选择投诉判断">
|
<el-option v-for="(item, idx) in trackComplainJudgeList"
|
:key="idx"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="案例级别"
|
prop="caseLevel"
|
:rules="rules.required">
|
<el-select filterable
|
:disabled="isReadonly"
|
v-model="form.caseLevel"
|
placeholder="请选择案例级别">
|
<el-option v-for="(item, idx) in caseLevelList"
|
:key="idx"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="跟进阶段"
|
prop="trackStage"
|
:rules="rules.required">
|
<el-select filterable
|
v-model="form.trackStage"
|
placeholder="请选择跟进阶段"
|
:disabled="!$parent.records.length || trackInfo.sequenceMark == 1 || isReadonly">
|
<el-option v-for="(item, idx) in trackStageList"
|
:key="idx"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="投诉类型(一级)"
|
prop="trackComplainTypeFirst"
|
:rules="rules.required">
|
<el-select filterable
|
:disabled="isReadonly"
|
v-model="form.trackComplainTypeFirst"
|
placeholder="请选择投诉类型(一级)"
|
@change="value => changeType(value, 1)">
|
<el-option v-for="item in typeList1"
|
:key="item.itemno"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="投诉类型(二级)"
|
prop="trackComplainTypeSecond"
|
:rules="rules.required">
|
<el-select filterable
|
:disabled="isReadonly"
|
v-model="form.trackComplainTypeSecond"
|
placeholder="请选择投诉类型(二级)">
|
<el-option v-for="(item, idx) in typeList2"
|
:key="idx"
|
:label="item.itemname"
|
:value="item.itemno"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary"
|
size="mini"
|
@click="getGradingDetailsView">分组详情</el-button>
|
</el-form-item>
|
<el-col :span="24">
|
<el-form-item label="跟进详情"
|
class="content-input"
|
style="width: 100%;">
|
<el-input :rows="6"
|
:disabled="isReadonly"
|
type="textarea"
|
v-model="form.trackDetail"
|
style="width: 100%;"></el-input>
|
</el-form-item>
|
</el-col>
|
|
</el-form>
|
<div slot="footer"
|
class="dialog-footer">
|
<el-button size="mini"
|
@click="handleClose">取 消</el-button>
|
<el-button size="mini"
|
type="primary"
|
v-if="!isReadonly"
|
@click="submitForm('inputForm')">确 定</el-button>
|
</div>
|
<GradingDetails ref="GradingDetails" tyoe="2" />
|
</el-dialog>
|
</template>
|
<script>
|
import {
|
selectCustomerSubCodeList,
|
addComplainTrack,
|
updateComplainTrack,
|
selectCustomerCodeList,
|
} from '@comprehensive/serve/public';
|
import GradingDetails from './GradingDetails'
|
export default {
|
props: {
|
dialogVisible: {
|
type: Boolean,
|
default: false,
|
},
|
// 申请编号
|
serialNo: {
|
type: String,
|
required: false,
|
},
|
trackInfo: {
|
type: Object,
|
default: ()=> {},
|
},
|
type: {
|
default: '1', // 1新增 2编辑 3 详情
|
},
|
},
|
components: {
|
GradingDetails
|
},
|
data() {
|
return {
|
form: {trackComplainTypeSecond: ''},
|
rules: {
|
required: [
|
{ required: true, message: '请输入', trigger: 'change' },
|
],
|
},
|
typeList1: [],
|
typeList2: [],
|
typeList3: [],
|
trackComplainSourceList: [],
|
trackComplainJudgeList: [],
|
caseLevelList: [],
|
trackStageList: [],
|
initTrackStageList: []
|
};
|
},
|
computed: {
|
title() {
|
const {type} = this;
|
return type== '1'? '新增跟进事件' : type == '2' ? '编辑跟进事件' : '跟进事件'
|
},
|
isReadonly() {
|
const {type} = this;
|
return type == '3'
|
},
|
},
|
watch: {
|
dialogVisible(newV) {
|
if(newV) {
|
const {trackInfo, isReadonly} = this
|
if(trackInfo.trackComplainTypeFirst) {
|
this.selectCustomerSubCodeList(trackInfo.trackComplainTypeFirst, (list) => {
|
this.typeList2 = list;
|
});
|
}
|
if(this.$parent.records.length == 0 && !isReadonly) {
|
// 首次跟进时需设置为默认选项
|
this.trackInfo.trackStage = 'Return_Visit'
|
}
|
let arr = []
|
if(this.$parent.records.length < 2 && !isReadonly) {
|
// 本条投诉事件下至少有两条跟进记录时才可选择(Ending_WatingCustomerRecall等待客户回拨，完结 Ending_CustomerUnaccept客户不接受，完结)
|
this.initTrackStageList.map(item => {
|
console.log(item)
|
if(item.itemno !== 'Ending_WatingCustomerRecall' && item.itemno !== 'Ending_CustomerUnaccept') {
|
arr.push(item)
|
}
|
})
|
} else {
|
arr = this.initTrackStageList
|
}
|
this.trackStageList = arr
|
this.form = this.trackInfo
|
}
|
}
|
},
|
mounted() {
|
console.log('parent', this.$parent.records)
|
this.selectCustomerSubCodeList('', (list) => {
|
this.typeList1 = list;
|
});
|
// 投诉来源
|
this.selectCustomerCodeList('ComplainSource', 'trackComplainSourceList');
|
// 投诉判断
|
this.selectCustomerCodeList('ComplainJudge', 'trackComplainJudgeList');
|
// 案例级别
|
this.selectCustomerCodeList('CaseLevel', 'caseLevelList');
|
// 跟进阶段
|
this.selectCustomerCodeList('TrackStage', 'trackStageList');
|
},
|
methods: {
|
// 字典下拉列表
|
async selectCustomerCodeList(codeNo = '', index) {
|
const res = await selectCustomerCodeList({
|
codeNo,
|
});
|
if (res.code == '00') {
|
if(codeNo == 'TrackStage') {
|
this.initTrackStageList = [...res.result]
|
}
|
this.$set(this, index, res.result);
|
}
|
},
|
// 投诉类型
|
async selectCustomerSubCodeList(bankNo = '', func) {
|
const res = await selectCustomerSubCodeList({
|
codeNo: 'TrackComplainType',
|
bankNo,
|
});
|
if (res.code == '00') {
|
typeof func === 'function' && func(res.result);
|
}
|
},
|
changeType(itemno, step) {
|
switch (step) {
|
case 1:
|
this.selectCustomerSubCodeList(itemno, (list) => {
|
this.typeList2 = list;
|
});
|
this.$set(this.form, 'trackComplainTypeSecond', '')
|
break;
|
}
|
},
|
submitForm(formName) {
|
this.$refs[formName].validate(async (valid) => {
|
if (valid) {
|
let { form, type } = this;
|
let res = null;
|
if (type == '1') {
|
delete form.id
|
res = await addComplainTrack({
|
...form,
|
ceId: this.serialNo,
|
})
|
} else {
|
res = await updateComplainTrack({
|
...form,
|
ceId: this.serialNo,
|
})
|
}
|
if (res.code == '00') {
|
this.resetForm('inputForm');
|
this.$emit('succ');
|
}
|
} else {
|
console.log('error submit!!');
|
return false;
|
}
|
});
|
},
|
resetForm(formName) {
|
this.$refs[formName].resetFields();
|
},
|
handleClose(done) {
|
this.resetForm('inputForm');
|
this.$emit('close');
|
},
|
getGradingDetailsView() {
|
this.$refs.GradingDetails.open()
|
}
|
},
|
};
|
</script>
|
<style lang="stylus" scoped>
|
.content-input /deep/ .el-form-item__content
|
width calc(100% - 260px);
|
.dialog-footer
|
margin-top 60px;
|
display block;
|
width 100%;
|
text-align center;
|
</style>
|
