parent
3034fabaa7
commit
a9c89fcdd1
13 changed files with 384 additions and 370 deletions
After Width: | Height: | Size: 2.6 KiB |
@ -0,0 +1,131 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-tabs v-model="curTab" |
||||||
|
@tab-click="tabChange"> |
||||||
|
<el-tab-pane label="产品审批" |
||||||
|
name="tab1"> |
||||||
|
<info /> |
||||||
|
<el-form ref="formRef" |
||||||
|
:model="form" |
||||||
|
:rules="rules" |
||||||
|
label-width="100px" |
||||||
|
label-suffix=":" |
||||||
|
class="form pt-5 mt-5 border-t border-t-solid border-t-[#EDF1F5]" |
||||||
|
status-icon> |
||||||
|
<el-form-item label="审批意见" |
||||||
|
prop="status"> |
||||||
|
<el-select v-model="form.status" |
||||||
|
placeholder="请选择"> |
||||||
|
<el-option v-for="(item, i) in config[0]?.subject?.itemList.slice(2)" |
||||||
|
:key="i" |
||||||
|
:label="item.options" |
||||||
|
:value="item.itemId" /> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="意见描述" |
||||||
|
prop="opinionDescription"> |
||||||
|
<el-input type="textarea" |
||||||
|
placeholder="审批意见500字以内。" |
||||||
|
maxlength="500" |
||||||
|
v-model="form.opinionDescription"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<div class="flex justify-end"> |
||||||
|
<div class="submit" |
||||||
|
@click="submit(formRef)">审批</div> |
||||||
|
</div> |
||||||
|
</el-form> |
||||||
|
</el-tab-pane> |
||||||
|
</el-tabs> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup lang="ts"> |
||||||
|
import { ref, computed, reactive, watch, onMounted } from 'vue'; |
||||||
|
import { ElMessage } from 'element-plus'; |
||||||
|
import type { TabsPaneContext, FormInstance, FormRules } from 'element-plus'; |
||||||
|
import { useRouter, useRoute } from 'vue-router'; |
||||||
|
import Info from './Info.vue'; |
||||||
|
import { findById, examineAndApprove } from '@/api/bank'; |
||||||
|
import { getProcessInformationBasedOnRoles, addOperation } from '@/api/judgment'; |
||||||
|
import dayjs from 'dayjs'; |
||||||
|
|
||||||
|
const emit = defineEmits(['getList']); |
||||||
|
interface RuleForm { |
||||||
|
id: any; |
||||||
|
status: any; |
||||||
|
opinionDescription?: string; |
||||||
|
} |
||||||
|
const router = useRouter(); |
||||||
|
const route = useRoute(); |
||||||
|
const curTab = ref<string>('tab1'); |
||||||
|
const info = ref<any>({}); |
||||||
|
const config = ref<any[]>([]); |
||||||
|
const formRef = ref<FormInstance>(); |
||||||
|
const form = reactive<RuleForm>({ |
||||||
|
id: computed(() => +route.query.id), |
||||||
|
status: '', |
||||||
|
opinionDescription: '', |
||||||
|
}); |
||||||
|
const rules = reactive<FormRules<RuleForm>>({ |
||||||
|
status: [{ required: true, message: '请选择审批意见', trigger: 'change' }], |
||||||
|
opinionDescription: [{ required: true, message: '请输入意见描述', trigger: 'blur' }], |
||||||
|
}); |
||||||
|
|
||||||
|
// tab切换回调 |
||||||
|
const tabChange = (tab: TabsPaneContext, event: Event) => { |
||||||
|
console.log(tab, event); |
||||||
|
}; |
||||||
|
// 配置项 |
||||||
|
const getConfig = async () => { |
||||||
|
const { process } = await getProcessInformationBasedOnRoles(43); // 专家委员会43 |
||||||
|
config.value = process; |
||||||
|
}; |
||||||
|
watch( |
||||||
|
() => route.query, |
||||||
|
() => { |
||||||
|
// getDetail(); |
||||||
|
}, |
||||||
|
{ |
||||||
|
immediate: true, |
||||||
|
}, |
||||||
|
); |
||||||
|
// 提交 |
||||||
|
const submit = async (formEl: FormInstance | undefined) => { |
||||||
|
if (!formEl) return; |
||||||
|
await formEl.validate(async (valid, fields) => { |
||||||
|
if (valid) { |
||||||
|
try { |
||||||
|
const param = JSON.parse(JSON.stringify(form)); |
||||||
|
param.approvalTime = dayjs(new Date()).format('YYYY年-MM月-DD日'); |
||||||
|
|
||||||
|
// const { message } = await examineAndApprove(param); |
||||||
|
const { message } = await examineAndApprove(param.id, param.opinionDescription, param.status, param.approvalTime); |
||||||
|
// addRecord(param, message); |
||||||
|
ElMessage.success('提交成功!'); |
||||||
|
emit('getList', 1); |
||||||
|
} finally { |
||||||
|
} |
||||||
|
} else { |
||||||
|
console.log('error submit!', fields); |
||||||
|
} |
||||||
|
}); |
||||||
|
}; |
||||||
|
// 新增判分记录 |
||||||
|
const addRecord = async (data: Record<string, any>, newId: number) => { |
||||||
|
const preIds = `1,2,43,${data.productType ? 45 : 44},${newId}`; // 1,关卡id,角色(这个页面是专家委员会审批),个人/企业(44/45) |
||||||
|
const lcRule = <Record<string, any>[]>[handleId(145, 69, data.status, preIds + ',145', 1), handleId(146, 70, data.opinionDescription, preIds + ',146', 3)]; |
||||||
|
|
||||||
|
await addOperation({ |
||||||
|
parentId: preIds, |
||||||
|
lcJudgmentRuleReq: lcRule, |
||||||
|
projectId: 1, |
||||||
|
}); |
||||||
|
}; |
||||||
|
onMounted(() => { |
||||||
|
getConfig(); |
||||||
|
}); |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
@import url(../../styles/form.scss); |
||||||
|
</style> |
@ -0,0 +1,130 @@ |
|||||||
|
<template> |
||||||
|
<div v-if="info.approvalTime" |
||||||
|
class="audit"> |
||||||
|
<div class="line"> |
||||||
|
<span class="field">审批意见:</span> |
||||||
|
<span class="status">{{ getStatus(+info?.status) }}</span> |
||||||
|
</div> |
||||||
|
<div class="line"> |
||||||
|
<span class="field">意见描述:</span> |
||||||
|
{{ info.opinionDescription }} |
||||||
|
</div> |
||||||
|
<p class="mb-2 text-sm text-[#333] text-right">审查日期:{{ info.approvalTime }}</p> |
||||||
|
<p class="mb-2 text-sm text-[#333] text-right">审查员:公瑾</p> |
||||||
|
</div> |
||||||
|
<div class="info mt-2"> |
||||||
|
<h6 class="step-name">一、产品定义</h6> |
||||||
|
<p class="text">{{ info.productDefinition }}</p> |
||||||
|
<h6 class="step-name mt-5">二、产品要素</h6> |
||||||
|
<p class="text">产品名称:{{ info.productName }}</p> |
||||||
|
<p class="text">贷款币种:人民币</p> |
||||||
|
<p v-if="info.loanPurpose" |
||||||
|
class="text"> |
||||||
|
贷款用途:{{ |
||||||
|
info.loanPurpose === '购房' |
||||||
|
? '可用于住房按揭贷款、二手房住房按揭贷款。' |
||||||
|
: info.loanPurpose === '消费' |
||||||
|
? '贷款用途可用于除购房之外的合法个人消费支出,不得用于投资经营,不得用于无指定用途的个人支出。' |
||||||
|
: info.loanPurpose === '经营' && !info.productType |
||||||
|
? '可用于个人或其企业生产和经营活动中临时性、季节性等流动资金周转以及购置、安装或修理小型设备和装潢经营性场所所需的人民币贷款业务。' |
||||||
|
: info.loanPurpose === '创业' |
||||||
|
? '用于创业或再创业过程中的资金需求。' |
||||||
|
: info.loanPurpose === '经营' && info.productType |
||||||
|
? '用于短期生产经营周转的可循环的人民币信用贷款业务。' |
||||||
|
: info.otherPurposesOfLoan |
||||||
|
}} |
||||||
|
</p> |
||||||
|
<p class="text">担保方式:{{ info.guarantyStyle }}</p> |
||||||
|
<p class="text">贷款期限:{{ info.minimumTermOfLoan }}月 - {{ info.maximumTermOfLoan }}月</p> |
||||||
|
<p class="text">贷款限额:{{ info.minimumLoan }}万元 - {{ info.loanCeiling }}万元</p> |
||||||
|
<p class="text">贷款利率:{{ info.minimumAprOnLoan }}% - {{ info.maximumAnnualInterestRate }}%</p> |
||||||
|
<p class="text">还款方式:{{ info.modeRepayment }}</p> |
||||||
|
<div class="text"> |
||||||
|
贷款对象: |
||||||
|
<p v-if="info.minimumAge">年龄{{ info.minimumAge }} - {{ info.maximumAge }}周岁;</p> |
||||||
|
<p v-if="info.educationalRequirements">取得{{ info.educationalRequirements }}以上学历;</p> |
||||||
|
<p v-if="info.currentWorkingLife">{{ info.currentWorkingLife }};</p> |
||||||
|
<p v-if="info.providentFundAndSocialSecurity">连续缴纳本市社保或者公积金6个月;</p> |
||||||
|
<p>持有中国银行I类账户,且已关联至手机银行,且在我行及其他金融同业无不良信用记录。</p> |
||||||
|
</div> |
||||||
|
<template v-if="role == 43"> |
||||||
|
<h6 class="step-name mt-5">三、材料要求</h6> |
||||||
|
<h6 class="step-name mt-5">四、业务流程</h6> |
||||||
|
<p class="text">1、贷款人APP向智信银行公司业务部门提交借款申请,同时提交贷款用途证明文件以及有关资料;</p> |
||||||
|
<p class="text">2、智信银行对贷款人的贷款申请进行审查,同时根据实际情况要求借款人提供补充资料;</p> |
||||||
|
<p class="text">3、智信银行内部审批通过后,与贷款人签订借款合同;</p> |
||||||
|
<p class="text">4、贷款人落实有关提款前提条件,根据贷款合同提款。</p> |
||||||
|
<h6 class="step-name mt-5">五、注意要点</h6> |
||||||
|
<p class="text"> |
||||||
|
贷款人在使用款额度时,必须明确说明贷款用途。贷款人必须在获得循环贷款额度后,方可在额度与用途范围内申请贷款,受理机构仅限在原经办行,同时逐笔上报中心核批。单笔贷款金额不得超过贷款人单笔消费(或投资)总金额的80%。 |
||||||
|
</p> |
||||||
|
</template> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup lang="ts"> |
||||||
|
import { ref, computed, watch, onMounted } from 'vue'; |
||||||
|
import { findById } from '@/api/bank'; |
||||||
|
import { useRouter, useRoute } from 'vue-router'; |
||||||
|
import { getStatus } from '@/store/useProduct'; |
||||||
|
|
||||||
|
const router = useRouter(); |
||||||
|
const route = useRoute(); |
||||||
|
const role = computed(() => route.query.role || 41); // 1产品经理,2风控经理,3专家委员会 |
||||||
|
const id = computed(() => +route.query.id); |
||||||
|
const info = ref<Record<string, any>>({}); |
||||||
|
const riskInfo = ref<Record<string, any>>(null); |
||||||
|
|
||||||
|
// 详情 |
||||||
|
const getDetail = async () => { |
||||||
|
if (id.value) { |
||||||
|
try { |
||||||
|
const { data } = await findById(id.value); |
||||||
|
info.value = data; |
||||||
|
if (info.value.riskControlDetails) riskInfo.value = info.value.riskControlDetails; |
||||||
|
} finally { |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
watch( |
||||||
|
() => route.query, |
||||||
|
() => { |
||||||
|
getDetail(); |
||||||
|
}, |
||||||
|
{ |
||||||
|
immediate: true, |
||||||
|
}, |
||||||
|
); |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.info { |
||||||
|
.step-name { |
||||||
|
@apply mb-3 text-sm font-semibold text-[#006bff]; |
||||||
|
} |
||||||
|
.line { |
||||||
|
@apply flex mb-2; |
||||||
|
} |
||||||
|
.label { |
||||||
|
@apply mr-1 text-sm font-semibold text-[#333] leading-[32px]; |
||||||
|
} |
||||||
|
.text { |
||||||
|
@apply text-sm text-[#333] leading-[32px]; |
||||||
|
} |
||||||
|
} |
||||||
|
.audit { |
||||||
|
padding: 20px 16px; |
||||||
|
margin-bottom: 30px; |
||||||
|
background: #f9fafc; |
||||||
|
border-radius: 10px; |
||||||
|
.line { |
||||||
|
margin-bottom: 18px; |
||||||
|
font-size: 14px; |
||||||
|
line-height: 1.6; |
||||||
|
} |
||||||
|
.field { |
||||||
|
font-size: 14px; |
||||||
|
font-weight: 600; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
Loading…
Reference in new issue