<template>
|
<div class="apply-info">
|
<CommForm
|
:inline="true"
|
:list="computedFormList"
|
@updateValue="updateValue"
|
ref="applyForm"
|
:formValues="formValues"
|
:formRules="formRules"
|
title="退款申请信息"
|
:conf="conf"
|
formType="info"
|
></CommForm>
|
<Dialog
|
v-model="isShowDialog"
|
icon="succ"
|
iconText="提交成功"
|
:buttons="[{ text: '确定', type: 'primary' }]"
|
@handleClick="commitSuccess"
|
></Dialog>
|
<div class="tab-form-buttons">
|
<p>
|
<el-button class="comm-button" @click="goBack">返回</el-button>
|
</p>
|
<p>
|
<el-button
|
class="comm-button"
|
type="primary"
|
@click="submit"
|
:loading="submitLoading"
|
>提交</el-button
|
>
|
</p>
|
</div>
|
</div>
|
</template>
|
<script>
|
// 退款申请信息
|
import { mapMutations } from "vuex";
|
import CommForm from "../CommForm.vue";
|
// import Dialog from '@/components/Dialog'
|
import Dialog from "../../components/Dialog.vue";
|
|
import queryCodeValueList from "@comprehensive/model/queryCodeValueList";
|
import claimRefundApply from "@comprehensive/model/claimRefundApply";
|
import queryCodeObject from "@comprehensive/model/queryCodeObject";
|
import claimRefundEditCommit from "@comprehensive/model/claimRefundEditCommit";
|
import getAllCityAreaList from "@comprehensive/model/getAllCityAreaList";
|
|
import claimRefundApplyInfo from "@comprehensive/model/claimRefundApplyInfo";
|
import claimRefundInfo from "@comprehensive/model/claimRefundInfo";
|
import { qryTrxnbrRelative, qryProjectAllInfo } from "@/api/product";
|
import {
|
refundDepositApply, //保证金退还提交
|
malGetAllCityAreaList,
|
} from "@comprehensive/serve/public";
|
|
export default {
|
props: {
|
// 申请编号
|
serialNo: {
|
type: String,
|
required: true,
|
},
|
objectType: {
|
type: String,
|
default: "",
|
},
|
customerID: {
|
type: String,
|
default: "",
|
},
|
flowno: {
|
type: String,
|
|
// 默认为案场
|
default: "CreditFlowCase",
|
},
|
conf: {
|
type: Object,
|
default: () => ({}),
|
},
|
},
|
components: {
|
CommForm,
|
Dialog,
|
},
|
data() {
|
return {
|
info: {},
|
transCode: "",
|
rpyNam: "",
|
stageNum: "",
|
query: {},
|
coreBalance: "",
|
formList: [],
|
codeObjectList: [],
|
bankCodeObjectList: [],
|
detailModel: null,
|
model: null,
|
selectModel: null,
|
codeModel: null,
|
updateModel: null,
|
areaModel: null,
|
isInitCity: false,
|
isShowDialog: false,
|
visible: false,
|
claimFlowData: [],
|
|
submitLoading: false,
|
};
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
init() {
|
const { query } = this.$route;
|
const { transCode, isUpdate, stageNum } = query;
|
this.query = query;
|
this.transCode = transCode;
|
this.stageNum = parseInt(stageNum);
|
this.selectModel = queryCodeValueList();
|
this.codeModel = queryCodeObject("PutOutAccountType");
|
|
this.detailModel = claimRefundApplyInfo();
|
this.model = claimRefundApply();
|
this.updateModel = isUpdate === "1" ? claimRefundEditCommit() : null;
|
this.areaModel = getAllCityAreaList();
|
this.requestQryTrxnbrRelative(() => {
|
this.getBankDetail();
|
});
|
},
|
async requestQryTrxnbrRelative(callBack) {
|
const { query } = this;
|
const resp = await qryTrxnbrRelative({
|
projectSerialNo: query.serialno,
|
});
|
if (resp.code == "00") {
|
this.claimFlowData = resp.result.records;
|
callBack ? callBack() : "";
|
}
|
},
|
async getDetail(flg) {
|
// isApply: '01', // 是否申请 01 是 02 否
|
const { query, detailModel } = this;
|
const { isApply = "02", objecttype, transSerialNo, serialno } = query; // transSerialNo,listObjectType和是从列表传过来的,没有通过continueModel接口
|
const info = await detailModel.request({
|
isApply,
|
trxnBr: this.claimFlowData[0].trxnBr,
|
refundLogId: transSerialNo,
|
objectType: objecttype,
|
});
|
const resp = await qryProjectAllInfo({ projectSerialNo: serialno });
|
|
this.coreBalance = resp.result.projectDepositQueryRsp.remainAmount;
|
this.info = {
|
...info,
|
bankCode: info.orgId,
|
actualwaiveAmt: resp.result.projectDepositQueryRsp.remainAmount,
|
};
|
this.setRefundApplicationInfo(this.info);
|
if (!flg) {
|
this.setForm();
|
}
|
},
|
async getBankDetail() {
|
const model = claimRefundInfo();
|
const { rpyNam, coreBalance } = await model.request({
|
trxnBr: this.claimFlowData[0].trxnBr,
|
});
|
// this.coreBalance = coreBalance;
|
this.rpyNam = rpyNam;
|
this.getDetail();
|
},
|
setForm() {
|
const { model, info, stageNum } = this;
|
const formList = model.getFormList(info);
|
this.formList =
|
stageNum === 3
|
? formList.map((item) =>
|
["refundType", "accountingChannel"].includes(item.name)
|
? { ...item, attrs: [], rules: [] }
|
: { ...item, attrs: ["readonly"], rules: [] }
|
)
|
: formList;
|
formList.map((res) => {
|
if (res.name == "accountType") {
|
res.value = "02";
|
}
|
if (res.name == "refundType") {
|
res.value = "01";
|
}
|
return res;
|
});
|
if (this.query.isApply == "02") {
|
formList.splice(0, 1);
|
}
|
this.setSelectOptions();
|
},
|
|
// 更新表单数据
|
updateValue(index, info, flg = true) {
|
const { formList, codeObjectList } = this;
|
if (info.name == "isNeedback" && info.value == 0) {
|
const nameIndex = formList.findIndex((res) => res.name === "name");
|
const accountNoIndex = formList.findIndex(
|
(res) => res.name === "accountNo"
|
);
|
this.$set(formList, nameIndex, {
|
...formList[nameIndex],
|
attrs: [],
|
value: "",
|
});
|
this.$set(formList, accountNoIndex, {
|
...formList[accountNoIndex],
|
attrs: [],
|
value: "",
|
});
|
}
|
|
if (info.name == "isNeedback" && info.value == 1) {
|
this.setForm();
|
}
|
if (isNaN(index)) {
|
// index is name
|
index = formList.findIndex(({ name }) => name === index);
|
}
|
|
if (!isNaN(index) && index > -1) {
|
const preInfo = formList[index];
|
const { name } = preInfo;
|
this.$set(formList, index, { ...preInfo, ...info });
|
if (info.name == "bankCode" && info.value) {
|
const bankName = info.options.filter(
|
(res) => res.value == info.value
|
);
|
const bankNameIndex = formList.findIndex(
|
(res) => res.name === "bankName"
|
);
|
this.$set(formList, bankNameIndex, {
|
...formList[bankNameIndex],
|
attrs: [],
|
value: bankName[0].label,
|
});
|
}
|
if (
|
info.name == "actualwaiveAmt" &&
|
Number(info.value) > Number(this.coreBalance)
|
) {
|
this.$message.error("退款金额不能大于剩余保证金金额!");
|
this.$set(formList, index, {
|
...formList[index],
|
attrs: [],
|
value: this.coreBalance,
|
});
|
}
|
if (name === "province") {
|
this.getArea("city", "02", info.value);
|
}
|
if (name === "refundType" && info.value === "02") {
|
const channel = formList.find(
|
({ name }) => name === "accountingChannel"
|
);
|
if (
|
channel &&
|
Array.isArray(channel.options) &&
|
channel.options.length === 0
|
) {
|
this.getCodeObject("accountingChannel", "PutOutAccountType");
|
}
|
}
|
if (name === "accountingChannel" && info.value) {
|
const curr = codeObjectList.find(
|
({ itemno }) => itemno === info.value
|
);
|
const settleAccountsIndex = formList.findIndex(
|
({ name }) => name === "settleAccounts"
|
);
|
const settleAccountsNameIndex = formList.findIndex(
|
({ name }) => name === "settleAccountsName"
|
);
|
// 线下退款账户类型 联动效果
|
if (curr) {
|
const { attribute1, attribute3 } = curr;
|
this.$set(formList, settleAccountsIndex, {
|
...formList[settleAccountsIndex],
|
value: attribute1,
|
});
|
this.$set(formList, settleAccountsNameIndex, {
|
...formList[settleAccountsNameIndex],
|
value: attribute3,
|
});
|
}
|
}
|
this.$nextTick(() => this.setRefundInfo());
|
}
|
},
|
|
setRefundInfo() {
|
const { formValues } = this;
|
this.setRefundApplicationInfo(formValues);
|
},
|
|
async getCodeObject(name, codeno) {
|
const { codeModel } = this;
|
const { list } = await codeModel.request({
|
codeno,
|
});
|
// 线下退款账户类型
|
if (name === "accountingChannel") {
|
this.codeObjectList = list;
|
this.updateValue(
|
name,
|
{
|
options: list.map(({ itemname, itemno }) => ({
|
label: itemname,
|
value: itemno,
|
text: itemno,
|
})),
|
},
|
false
|
);
|
}
|
// 退款收款账户开户银行简称
|
if (name === "bankName") {
|
this.bankCodeObjectList = list;
|
this.updateValue(
|
name,
|
{
|
options: list.map(({ itemname, attribute1, itemno }) => ({
|
label: itemname,
|
value: itemno,
|
text: itemno,
|
})),
|
},
|
false
|
);
|
}
|
},
|
|
// 表单按钮事件处理
|
async submit() {
|
const {
|
model,
|
query,
|
info,
|
conf,
|
updateModel,
|
stageNum,
|
formList,
|
bankCodeObjectList,
|
} = this;
|
const { objectNo, objecttype, serialno } = query;
|
const { edit } = conf;
|
// if (edit !== "Y" || stageNum === 3) {
|
// return false;
|
// }
|
|
const values = this.$refs.applyForm.validate();
|
if (values) {
|
const matchedItem = bankCodeObjectList.find(
|
(item) => values.bankName === item.itemno
|
);
|
try {
|
const resp = await refundDepositApply({
|
...values,
|
bankCode: matchedItem.attribute1,
|
objectType: objecttype,
|
object: serialno,
|
objectNo: serialno,
|
});
|
if (resp.code == "00") {
|
this.getDetail("norefresh");
|
this.isShowDialog = true;
|
}
|
} catch (e) {
|
// loading.close()
|
}
|
} else {
|
this.$message.warning(
|
"当前页面存在必填项未录入或数据录入错误,请检查!"
|
);
|
}
|
},
|
|
// 设置表单下拉菜单
|
setSelectOptions() {
|
const { formList, query, conf } = this;
|
const { isApply } = query;
|
const { edit } = conf;
|
if (
|
this.query.isApply == "02" &&
|
formList &&
|
formList[0].name === "isNeedback"
|
) {
|
formList.splice(0, 1);
|
}
|
// if (edit !== "Y") {
|
// console.log('edit',edit)
|
// return false;
|
// }
|
formList.forEach(({ name, attrs = [] }) => {
|
if (
|
attrs.some(
|
(item) =>
|
(typeof item === "object" && item.readonly) || item === "readonly"
|
)
|
) {
|
return false;
|
}
|
// 是否
|
if (name === "isNeedback") {
|
this.updateValue(
|
name,
|
{
|
options: [
|
{ value: "1", label: "是" },
|
{ value: "0", label: "否" },
|
],
|
},
|
false
|
);
|
}
|
// 退款收款账户类型
|
if (name === "accountType") {
|
this.queryCodeValueList(name, "RefundAccountType");
|
}
|
// 退款方式
|
if (name === "refundType") {
|
this.queryCodeValueList(name, "RefundType");
|
}
|
// 退款收款账户开户银行简称
|
if (name === "bankName") {
|
this.getCodeObject(name, "BankCode");
|
}
|
// 退款收款账户开户行所在省
|
if (name === "province") {
|
this.getArea(name);
|
}
|
if (isApply === "02") {
|
this.getCodeObject("accountingChannel", "PutOutAccountType");
|
}
|
// 退款收款账户开户行所在市
|
// if (name === 'city') {
|
// // this.getArea(name, '02')
|
// }
|
});
|
},
|
|
// 贷后交易名称下拉列表
|
async getBank(name) {
|
const { bankModel } = this;
|
const { list } = await bankModel.request({ status: 3 });
|
this.updateValue(name, { options: list }, false);
|
},
|
|
// 退款方式下拉列表
|
async queryCodeValueList(name, codeNo) {
|
const { selectModel, rpyNam } = this;
|
let { list } = await selectModel.request({ codeNo });
|
if (name === "refundType" && rpyNam === "深圳鹏友惠普商业保理有限公司") {
|
list = list.filter(({ value }) => value !== "01");
|
}
|
this.updateValue(name, { options: list }, false);
|
},
|
// 贷后交易名称下拉列表
|
async getArea(name, queryFlag = "01", areaCode = "") {
|
const { areaModel, isInitCity, info } = this;
|
const { city = "", province = "" } = info;
|
if (!isInitCity && name === "city") {
|
areaCode = areaCode || province;
|
}
|
if (name === "city" && !areaCode) {
|
return false;
|
}
|
const { list } = await areaModel.request({ queryFlag, areaCode });
|
// malGetAllCityAreaList
|
const value = isInitCity ? "" : city;
|
if (name === "city") {
|
const resp = await malGetAllCityAreaList({ queryFlag, areaCode });
|
let cityList = resp.result.reduce((pre, curr) => {
|
const { itemname, itemno } = curr;
|
pre.push({
|
...curr,
|
label: itemname,
|
value: itemno,
|
});
|
return pre;
|
}, []);
|
this.isInitCity = true;
|
this.updateValue(name, { options: cityList, value }, false);
|
} else {
|
this.updateValue(name, { options: list }, false);
|
}
|
},
|
|
// 提交成功后返回原列表页
|
commitSuccess() {
|
this.isShowDialog = false;
|
this.$router.go(-1);
|
},
|
goBack() {
|
this.isShowDialog = false;
|
this.$router.go(-1);
|
},
|
...mapMutations(["setRefundApplicationInfo"]),
|
},
|
computed: {
|
// 表单值信息
|
formValues() {
|
const { model, formList } = this;
|
return model ? model.getFormValues(formList) : {};
|
},
|
computedFormList() {
|
const { formList, formValues, conf } = this;
|
const { refundType } = formValues;
|
const { edit } = conf;
|
let tempList = [...formList];
|
|
if (refundType !== "02" && edit === "Y") {
|
// 01 自动退款, 02 人工转账退款
|
tempList = tempList.filter(
|
({ name }) =>
|
![
|
"accountingChannel",
|
"settleAccounts",
|
"settleAccountsName",
|
].includes(name)
|
);
|
}
|
|
return tempList;
|
},
|
formRules() {
|
// const { model, computedFormList } = this;
|
// if (model) {
|
// console.log('formRules',model.getFormRules(computedFormList))
|
// return model.getFormRules(computedFormList);
|
// }
|
const rules = {
|
name: [
|
{
|
required: true,
|
message: "请输入退款收款账户户名",
|
trigger: "blur",
|
},
|
],
|
accountNo: [
|
{
|
required: true,
|
message: "请输入退款收款账户账号",
|
trigger: "blur",
|
},
|
],
|
bankName: [
|
{
|
required: true,
|
message: "请选择退款收款账户开户银行",
|
trigger: "blur",
|
},
|
],
|
paymentAccountNo: [
|
{
|
required: true,
|
message: "请输入退款收款账户开户分支行",
|
trigger: "blur",
|
},
|
],
|
actualwaiveAmt: [
|
{ required: true, message: "请输入退款金额", trigger: "blur" },
|
{
|
pattern: /^[1-9]\d*(\.\d{1,2})?$/,
|
message: "请输入数字值",
|
trigger: "blur",
|
},
|
],
|
};
|
return rules;
|
},
|
},
|
watch: {
|
$route() {
|
if (this.claimFlowData[0].trxnBr) {
|
this.init();
|
}
|
},
|
},
|
};
|
</script>
|
<style lang="postcss" scoped>
|
.apply-info {
|
}
|
.apply-top-button {
|
& >>> .el-button {
|
margin-left: 20px;
|
}
|
}
|
|
.qrcode-content {
|
text-align: center;
|
& .qrode-close {
|
margin: 0;
|
padding: 0;
|
margin-bottom: 10px;
|
& i {
|
cursor: pointer;
|
font-size: 18px;
|
}
|
/* text-align: right; */
|
}
|
}
|
.tab-form-buttons {
|
display: flex;
|
justify-content: center;
|
padding: 60px 0 30px 0;
|
& p {
|
margin: 0 40px 0 0;
|
}
|
& p:last-child {
|
margin-right: 0;
|
}
|
}
|
</style>
|