<template>
|
<div>
|
<FormList
|
:info="formInfo"
|
:isShowDetail="isShowDetail"
|
@handleClick="isShowDetail = !isShowDetail"
|
@updateValue="updateValue"
|
@onSubmit="onSubmit"
|
@setValueInfo="setValueInfo"
|
:isChangeArray="false"
|
@resetValue="resetValue"
|
></FormList>
|
<div class="header-block">
|
<p class="section-title">催收事件</p>
|
<div v-if="canEdit" style="display: flex; flex-direction: row">
|
<el-button
|
v-if="serialNo"
|
type="primary"
|
size="mini"
|
@click="showAddServiceView"
|
>新增催收事件</el-button
|
>
|
<el-upload
|
v-if="!serialNo"
|
style="margin: 0 0 0 10px"
|
action=""
|
:multiple="false"
|
:headers="uploadHeader"
|
:http-request="uploadDebtCollection"
|
:before-upload="beforeAvatarUpload"
|
:file-list="fileList"
|
:show-file-list="false"
|
>
|
<el-button type="primary" size="mini">上传催记</el-button>
|
</el-upload>
|
</div>
|
</div>
|
<TableList
|
:isShowPages="true"
|
:loading="loading"
|
:pageInfo="pageInfo"
|
:header="tableHeader"
|
:list="records"
|
@doAction="doAction"
|
@handleCurrentChange="handleCurrentChange"
|
@handleSizeChange="handleSizeChange"
|
></TableList>
|
<!-- 新增催收事件 -->
|
<OverdueDebtCollectionAddRecord
|
:dialogVisible="dialogVisible"
|
:serialNo="serialNo"
|
@succ="addCustomerService"
|
@close="showAddServiceView"
|
/>
|
<!-- 上传/预览影像资料 -->
|
<OverdueDebtCollectionUpload
|
:dialogComplainVisible="dialogComplainVisible"
|
:serialNo="serialNo"
|
:selectDebtColItem="selectDebtColItem"
|
:isPreview="isPreview"
|
@succ="uploadSuccess"
|
@close="showAddComplainView"
|
/>
|
</div>
|
</template>
|
<script>
|
// 客服事件
|
import TableList from "../TableList";
|
import FormList from "../FormList";
|
import {
|
selectComplainAndEventList,
|
selectCaseEventList,
|
queryTabTree,
|
qryCustomerBasicInfo,
|
queryAcctLoan,
|
overdueImportCollectionExcel,
|
} from "@comprehensive/serve/public";
|
import { debtCollectionHeader } from "@comprehensive/utils/tableHeaders";
|
import { overdueDebtCollectionSearch } from "@comprehensive/utils/formItems";
|
import OverdueDebtCollectionAddRecord from "./OverdueDebtCollectionAddRecord";
|
import OverdueDebtCollectionUpload from "./OverdueDebtCollectionUpload";
|
import CustomerComplainUpdate from "./CustomerComplainUpdate";
|
|
export default {
|
props: {
|
// 申请编号
|
serialNo: {
|
type: String,
|
// required: true,
|
},
|
//借据信息
|
promissNoteNo: {
|
type: String,
|
},
|
canEdit: {
|
type: Boolean,
|
},
|
objectType: {
|
type: String,
|
default: "",
|
},
|
customerID: {
|
type: String,
|
default: "",
|
},
|
},
|
components: {
|
TableList,
|
FormList,
|
CustomerComplainUpdate,
|
OverdueDebtCollectionUpload,
|
OverdueDebtCollectionAddRecord,
|
},
|
data() {
|
return {
|
records: [],
|
flowModel: [],
|
valueInfo: {},
|
loading: false,
|
dialogVisible: false, //新增催收事件
|
dialogComplainVisible: false, //上传影像资料
|
isPreview: false, //是否是预览
|
// 是否显示所有表单项
|
isShowDetail: true,
|
pageInfo: {
|
currentPage: 1,
|
pageSize: 10,
|
total: 0,
|
},
|
tableHeader: "",
|
// 搜索表单字段及描述
|
formInfo: [...overdueDebtCollectionSearch],
|
// 查询过滤字段
|
formInfoFilter: [],
|
customerInfo: { customerName: "", idCard: "" },
|
selectDebtColItem: {},
|
uploadHeader: {
|
"Content-Type": "multipart/form-data; boundary=ReaquestHeader",
|
},
|
fileList: [],
|
};
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
// 新增催收事件
|
showAddServiceView() {
|
this.dialogVisible = !this.dialogVisible;
|
},
|
// 上传/预览影像资料
|
showAddComplainView() {
|
this.dialogComplainVisible = !this.dialogComplainVisible;
|
},
|
//上传催记之前
|
beforeAvatarUpload() {},
|
//上传催记
|
async uploadDebtCollection(file) {
|
const formData = new FormData();
|
formData.append("file", file.file);
|
this.loading = true;
|
const resp = await overdueImportCollectionExcel(formData);
|
this.loading = false;
|
if (resp.code === "00") {
|
this.$message.success(resp.msg);
|
this.requestSelectCaseEventList();
|
}
|
},
|
//新增催收事件成功
|
addCustomerService() {
|
this.dialogVisible = false;
|
this.requestSelectCaseEventList();
|
},
|
//上传影像资料成功
|
uploadSuccess() {
|
this.dialogComplainVisible = false;
|
this.requestSelectCaseEventList();
|
},
|
|
init() {
|
this.tableHeader = [...debtCollectionHeader];
|
this.requestSelectCaseEventList();
|
},
|
|
async requestSelectCaseEventList() {
|
this.loading = true;
|
const { serialNo, pageInfo, valueInfo } = this;
|
|
console.log("requestSelectCaseEventList", valueInfo);
|
|
const res = await selectCaseEventList({
|
loanId: this.promissNoteNo ? this.promissNoteNo : "",
|
applySerialNo: this.serialNo ? this.serialNo : "",
|
...valueInfo,
|
...pageInfo,
|
eventBeginTime: valueInfo.eventBeginTime
|
? valueInfo.eventBeginTime + " 00:00:00"
|
: "",
|
eventEndTime: valueInfo.eventEndTime
|
? valueInfo.eventEndTime + " 23:59:59"
|
: "",
|
eventTime: [
|
valueInfo.eventBeginTime
|
? valueInfo.eventBeginTime + " 00:00:00"
|
: "",
|
valueInfo.eventEndTime ? valueInfo.eventEndTime + " 23:59:59" : "",
|
],
|
});
|
this.loading = false;
|
const { result } = res;
|
// this.records = result.records;
|
|
this.records = result.records.reduce((pre, curr) => {
|
const { actionTypeName } = curr;
|
let sortButtons = [
|
{
|
label: "上传影像资料",
|
disabled:
|
actionTypeName == "催记记录" || !this.canEdit ? true : false,
|
isUpload: true,
|
}, //disabled: true
|
{
|
label: "预览影像资料",
|
disabled:
|
actionTypeName == "催记记录" || !this.canEdit ? true : false,
|
},
|
];
|
pre.push({
|
...curr,
|
buttons: [...sortButtons],
|
});
|
return pre;
|
}, []);
|
this.pageInfo.total = result.total;
|
this.$emit("countHeight", true);
|
},
|
|
// 表单事件回调
|
doAction(name, item, { label }) {
|
const { objectType, customerID } = this;
|
|
// 点击申请编号的处理
|
if (name === "serialno") {
|
// 接口需加flowno字段
|
let { serialno, flowno, objecttype, customerid, occurtype } = item;
|
objecttype = objecttype || objectType;
|
customerid = customerid || customerID;
|
this.toDetail(serialno, occurtype, flowno, objecttype, customerid);
|
}
|
|
if (label == "上传影像资料") {
|
this.selectDebtColItem = item;
|
this.isPreview = false;
|
this.dialogComplainVisible = true;
|
}
|
if (label == "预览影像资料") {
|
this.selectDebtColItem = item;
|
this.isPreview = true;
|
this.dialogComplainVisible = true;
|
}
|
},
|
// 更新表单数据或查找某项数据
|
setOrGetFormInfo(nameKey, newInfo) {
|
let { formInfo } = this;
|
let index = formInfo.findIndex(({ name }) => name === nameKey);
|
let result = {};
|
if (!isNaN(index)) {
|
this.$set(this.formInfo, index, { ...formInfo[index], ...newInfo });
|
result = this.formInfo[index];
|
}
|
if (typeof newInfo === "undefined") {
|
return result;
|
}
|
},
|
//搜索栏值改变
|
updateValue(value, item) {
|
let { name } = item;
|
this.setOrGetFormInfo(name, { value });
|
},
|
//搜索提交
|
onSubmit(val) {
|
this.pageInfo.currentPage = 1;
|
if (val == "reset") {
|
this.formInfo = overdueDebtCollectionSearch.filter(
|
({ name }) => !this.formInfoFilter.includes(name)
|
);
|
this.valueInfo = {};
|
}
|
this.requestSelectCaseEventList();
|
},
|
// 设置表单结果数据
|
setValueInfo(info = {}) {
|
this.valueInfo = info;
|
},
|
|
// 修改翻页条数
|
handleSizeChange(val) {
|
this.pageInfo.pageSize = val;
|
this.init();
|
},
|
|
// 修改翻页数
|
handleCurrentChange(val) {
|
this.pageInfo.currentPage = val;
|
this.init();
|
},
|
// 重置表单
|
resetValue() {
|
this.pageInfo.currentPage = 1;
|
// this.loanList();
|
},
|
|
async toDetail(serialno, occurtype, flowno, objecttype, customerid) {
|
// 接口出错则不跳转
|
await queryTabTree({
|
objectno: serialno,
|
objecttype,
|
});
|
|
let params = `${serialno}?from=newCts&occurType=${occurtype}&flowno=${flowno}&objectType=${objecttype}&customerID=${customerid}`;
|
if (parent.g_menu_id) {
|
params = `${params}&menuId=${parent.g_menu_id}`;
|
}
|
const url = `${location.origin}/cts-web/#/comprehensiveTransaction/loanDetail/${params}`;
|
|
window.open(
|
url,
|
"newDetailWindow",
|
"height=600px, width=1200px, top=100px,left=300px"
|
);
|
},
|
},
|
watch: {
|
serialNo() {
|
this.init();
|
},
|
promissNoteNo: {
|
handler(newVal) {
|
console.log("watch催收事件", newVal);
|
this.requestSelectCaseEventList();
|
},
|
},
|
},
|
};
|
</script>
|
|
<style lang="postcss" scoped>
|
.form-section {
|
display: flex;
|
align-items: baseline;
|
& .search {
|
margin: 10px 0 0 50px;
|
padding: 0;
|
}
|
}
|
.header-block {
|
margin-bottom: 25px;
|
& .section-title {
|
margin: 30px 0 20px 0;
|
padding: 0 0 0 10px;
|
border-left: solid 2px #0081f0;
|
line-height: 16px;
|
font-size: 14px;
|
color: #222222;
|
}
|
}
|
</style>
|
