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