<template>
|
<div class="apply-info">
|
<CommForm
|
:inline="true"
|
:list="formList"
|
:formValues="formValues"
|
:formRules="formRules"
|
@updateValue="updateValue"
|
formType="info"
|
ref="settlementForm"
|
title="待结算贴息信息"
|
></CommForm>
|
|
<Dialog
|
v-model="isShowDialog"
|
icon="succ"
|
iconText="提交成功"
|
:buttons="[{ text: '确定', type: 'primary' }]"
|
@handleClick="commitSuccess"
|
></Dialog>
|
</div>
|
</template>
|
<script>
|
// 待结算贴息信息
|
import { mapState, mapMutations } from "vuex";
|
import CommForm from "@/components/CommForm";
|
import Dialog from "@/components/Dialog";
|
import disCountInfo from "@/controller/disCountInfo";
|
import loanSettleCommit from "@/controller/loanSettleCommit";
|
import dayjs from 'dayjs'
|
export default {
|
components: {
|
CommForm,
|
Dialog,
|
},
|
props: {
|
conf: {
|
type: Object,
|
default: () => ({}),
|
},
|
},
|
data() {
|
return {
|
info: {},
|
query: {},
|
formList: [],
|
isShowDialog: false,
|
model: null,
|
submitModel: null,
|
payDate: dayjs().format('YYYY/MM/DD'),
|
};
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
init() {
|
const { query } = this.$route;
|
this.query = query;
|
this.getDetail();
|
},
|
async getDetail() {
|
const { query, conf, payDate } = this;
|
const { serialNo, discountWay } = query;
|
const { edit } = conf;
|
this.setPayDate(payDate);
|
const model = disCountInfo(query);
|
const info = await model.request({
|
payDate,
|
serialNo,
|
discountWay,
|
});
|
const formList = model.getFormList({ ...info, payDate });
|
|
// payDate
|
// 贴息方式为按还款计划付贴息时展示且必填，其他情况隐藏
|
// discountWay 4
|
|
if (edit === "Y") {
|
if (discountWay !== "4") {
|
this.formList = formList.filter(({ name }) => name !== "payDate");
|
} else {
|
this.formList = formList;
|
}
|
} else {
|
// this.formList = formList.map(item => ({ ...item, type: 'text' }))
|
this.formList = formList;
|
}
|
this.model = model;
|
this.submitModel = loanSettleCommit();
|
},
|
// 更新表单数据
|
updateValue(index, info, flg = true) {
|
const { formList } = this;
|
if (isNaN(index)) {
|
// index is name
|
index = formList.findIndex(({ name }) => name === index);
|
}
|
|
if (!isNaN(index) && index > -1) {
|
const preInfo = formList[index];
|
this.$set(formList, index, { ...preInfo, ...info });
|
this.updateDate();
|
}
|
},
|
|
updateDate() {
|
const { formValues } = this;
|
const { payDate = "" } = formValues;
|
if (this.payDate !== payDate) {
|
this.payDate = payDate;
|
this.getDetail();
|
this.setPayDate(payDate);
|
this.setSettlementReqs([]);
|
}
|
},
|
|
// 表单按钮事件处理
|
async submit() {
|
const { submitModel, query, conf, trxnbrArray, settlementReqs } = this;
|
const { serialNo } = query;
|
const { edit } = conf;
|
|
if (edit !== "Y") {
|
return false;
|
}
|
// eslint-disable-next-line no-debugger
|
console.log(settlementReqs, trxnbrArray);
|
if (settlementReqs.length === 0 || trxnbrArray.length === 0) {
|
this.$message("请先选择相关数据");
|
return false;
|
}
|
|
const values = this.$refs.settlementForm.validate();
|
|
if (values) {
|
const loading = this.$loading({
|
fullscreen: true
|
})
|
try {
|
await submitModel.request({
|
// ...info,
|
serialNo,
|
// ...values,
|
settlementReqs,
|
trxnbrArray
|
})
|
loading.close()
|
this.getDetail()
|
this.isShowDialog = true
|
} catch (e) {
|
loading.close()
|
}
|
} else {
|
this.$message.warning(
|
"当前页面存在必填项未录入或数据录入错误，请检查!"
|
);
|
}
|
},
|
// 提交成功后返回原列表页
|
commitSuccess() {
|
this.isShowDialog = false;
|
this.$router.go(-1);
|
},
|
...mapMutations(["setPayDate", "setSettlementReqs"]),
|
},
|
computed: {
|
// 表单值信息
|
formValues() {
|
const { model, formList } = this;
|
return model ? model.getFormValues(formList) : {};
|
},
|
formRules() {
|
const { model, computedFormList } = this;
|
if (model) {
|
return model.getFormRules(computedFormList);
|
}
|
return {};
|
},
|
...mapState({
|
trxnbrArray: (state) => state.tabsModule.trxnbrArray,
|
settlementReqs: (state) => state.tabsModule.settlementReqs,
|
}),
|
},
|
|
watch: {
|
$route() {
|
const { serialNo } = this.$route.query;
|
if (serialNo) {
|
this.init();
|
}
|
},
|
},
|
};
|
</script>
|
<style lang="postcss" scoped>
|
.apply-info {
|
}
|
</style>
|
