客户类型字段更新
This commit is contained in:
@@ -17,10 +17,19 @@ export function getWorkflow(serialNum) {
|
||||
})
|
||||
}
|
||||
|
||||
// 新增利率定价流程
|
||||
export function createWorkflow(data) {
|
||||
// 创建个人客户利率定价流程
|
||||
export function createPersonalWorkflow(data) {
|
||||
return request({
|
||||
url: '/loanPricing/workflow/create',
|
||||
url: '/loanPricing/workflow/create/personal',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 创建企业客户利率定价流程
|
||||
export function createCorporateWorkflow(data) {
|
||||
return request({
|
||||
url: '/loanPricing/workflow/create/corporate',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
|
||||
@@ -0,0 +1,319 @@
|
||||
<template>
|
||||
<el-dialog title="新增企业利率定价流程" :visible.sync="dialogVisible" width="900px" append-to-body
|
||||
@close="handleClose">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="140px" class="workflow-create-form">
|
||||
<!-- 基本信息 -->
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户内码" prop="custIsn">
|
||||
<el-input v-model="form.custIsn" placeholder="请输入客户内码"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户名称" prop="custName">
|
||||
<el-input v-model="form.custName" placeholder="请输入客户名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="证件类型" prop="idType">
|
||||
<el-select v-model="form.idType" placeholder="请选择证件类型" style="width: 100%">
|
||||
<el-option label="统一社会信用代码" value="统一社会信用代码"/>
|
||||
<el-option label="其他" value="其他"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="证件号码" prop="idNum">
|
||||
<el-input v-model="form.idNum" placeholder="请输入证件号码"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 贷款信息 -->
|
||||
<el-divider content-position="left">贷款信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="担保方式" prop="guarType">
|
||||
<el-select v-model="form.guarType" placeholder="请选择担保方式" style="width: 100%">
|
||||
<el-option label="信用" value="信用"/>
|
||||
<el-option label="保证" value="保证"/>
|
||||
<el-option label="抵押" value="抵押"/>
|
||||
<el-option label="质押" value="质押"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="申请金额(元)" prop="applyAmt">
|
||||
<el-input v-model="form.applyAmt" placeholder="请输入申请金额"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="贷款期限(月)" prop="loanTerm">
|
||||
<el-input v-model.number="form.loanTerm" type="number" placeholder="请输入贷款期限"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 企业标识 -->
|
||||
<el-divider content-position="left">企业标识</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="省农担担保贷款" prop="isAgriGuar">
|
||||
<el-switch v-model="form.isAgriGuar"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="绿色贷款" prop="isGreenLoan">
|
||||
<el-switch v-model="form.isGreenLoan"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="科技型企业" prop="isTechEnt">
|
||||
<el-switch v-model="form.isTechEnt"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="贸易和建筑业企业" prop="isTradeConstruction">
|
||||
<el-switch v-model="form.isTradeConstruction"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 抵质押信息 -->
|
||||
<el-divider content-position="left">抵质押信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="抵质押类型" prop="collType">
|
||||
<el-select v-model="form.collType" placeholder="请选择抵质押类型" style="width: 100%">
|
||||
<el-option label="一线" value="一线"/>
|
||||
<el-option label="一类" value="一类"/>
|
||||
<el-option label="二类" value="二类"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="抵质押物三方所有" prop="collThirdParty">
|
||||
<el-switch v-model="form.collThirdParty"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" :loading="submitting" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {createCorporateWorkflow} from "@/api/loanPricing/workflow"
|
||||
|
||||
export default {
|
||||
name: "CorporateCreateDialog",
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
// 统一社会信用代码验证
|
||||
const validateIdNum = (rule, value, callback) => {
|
||||
if (!value) {
|
||||
callback(new Error('请输入证件号码'))
|
||||
} else if (this.form.idType === '统一社会信用代码') {
|
||||
const reg = /^[0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}$/
|
||||
if (!reg.test(value)) {
|
||||
callback(new Error('请输入正确的统一社会信用代码'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
// 金额验证
|
||||
const validateApplyAmt = (rule, value, callback) => {
|
||||
if (!value) {
|
||||
callback(new Error('请输入申请金额'))
|
||||
} else {
|
||||
const num = parseFloat(value)
|
||||
if (isNaN(num) || num <= 0) {
|
||||
callback(new Error('请输入有效的金额'))
|
||||
} else if (num > 999999999.99) {
|
||||
callback(new Error('金额不能超过 999999999.99'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 贷款期限验证
|
||||
const validateLoanTerm = (rule, value, callback) => {
|
||||
if (!value && value !== 0) {
|
||||
callback(new Error('请输入贷款期限'))
|
||||
} else {
|
||||
const num = parseInt(value)
|
||||
if (isNaN(num) || num <= 0) {
|
||||
callback(new Error('请输入有效的贷款期限'))
|
||||
} else if (num > 360) {
|
||||
callback(new Error('贷款期限不能超过 360 个月'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
submitting: false,
|
||||
form: {
|
||||
orgCode: '',
|
||||
runType: '1',
|
||||
custIsn: undefined,
|
||||
custName: undefined,
|
||||
idType: undefined,
|
||||
idNum: undefined,
|
||||
guarType: undefined,
|
||||
applyAmt: undefined,
|
||||
loanTerm: undefined,
|
||||
isAgriGuar: false,
|
||||
isGreenLoan: false,
|
||||
isTechEnt: false,
|
||||
isTradeConstruction: false,
|
||||
collType: undefined,
|
||||
collThirdParty: false
|
||||
},
|
||||
rules: {
|
||||
custIsn: [
|
||||
{required: true, message: "客户内码不能为空", trigger: "blur"},
|
||||
{min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur"}
|
||||
],
|
||||
custName: [
|
||||
{required: true, message: "客户名称不能为空", trigger: "blur"},
|
||||
{min: 1, max: 100, message: "长度在 1 到 100 个字符", trigger: "blur"}
|
||||
],
|
||||
idType: [
|
||||
{required: true, message: "请选择证件类型", trigger: "change"}
|
||||
],
|
||||
idNum: [
|
||||
{required: true, validator: validateIdNum, trigger: "blur"}
|
||||
],
|
||||
guarType: [
|
||||
{required: true, message: "请选择担保方式", trigger: "change"}
|
||||
],
|
||||
applyAmt: [
|
||||
{required: true, validator: validateApplyAmt, trigger: "blur"}
|
||||
],
|
||||
loanTerm: [
|
||||
{required: true, validator: validateLoanTerm, trigger: "blur"}
|
||||
],
|
||||
collType: [
|
||||
{required: true, message: "请选择抵质押类型", trigger: "change"}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
dialogVisible: {
|
||||
get() {
|
||||
return this.visible
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('update:visible', val)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(val) {
|
||||
if (val) {
|
||||
this.reset()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
orgCode: '',
|
||||
runType: '1',
|
||||
custIsn: undefined,
|
||||
custName: undefined,
|
||||
idType: undefined,
|
||||
idNum: undefined,
|
||||
guarType: undefined,
|
||||
applyAmt: undefined,
|
||||
loanTerm: undefined,
|
||||
isAgriGuar: false,
|
||||
isGreenLoan: false,
|
||||
isTechEnt: false,
|
||||
isTradeConstruction: false,
|
||||
collType: undefined,
|
||||
collThirdParty: false
|
||||
}
|
||||
this.submitting = false
|
||||
this.resetForm("form")
|
||||
},
|
||||
/** 对话框关闭处理 */
|
||||
handleClose() {
|
||||
this.cancel()
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.dialogVisible = false
|
||||
this.reset()
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.submitting = true
|
||||
// 转换开关值为字符串
|
||||
const data = {
|
||||
...this.form,
|
||||
isAgriGuar: this.form.isAgriGuar ? 'true' : 'false',
|
||||
isGreenLoan: this.form.isGreenLoan ? 'true' : 'false',
|
||||
isTechEnt: this.form.isTechEnt ? 'true' : 'false',
|
||||
isTradeConstruction: this.form.isTradeConstruction ? 'true' : 'false',
|
||||
collThirdParty: this.form.collThirdParty ? 'true' : 'false'
|
||||
}
|
||||
|
||||
createCorporateWorkflow(data).then(response => {
|
||||
this.$modal.msgSuccess("新增成功")
|
||||
this.dialogVisible = false
|
||||
this.$emit('success')
|
||||
}).catch(error => {
|
||||
// 保留表单,显示错误信息
|
||||
console.error('创建失败:', error)
|
||||
}).finally(() => {
|
||||
this.submitting = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.workflow-create-form .el-divider {
|
||||
margin: 8px 0 16px 0;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.workflow-create-form .el-col {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
flex: 0 0 100% !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,324 @@
|
||||
<template>
|
||||
<div class="corporate-workflow-detail" v-loading="loading">
|
||||
<!-- 两栏布局:左侧关键信息 + 右侧(流程详情+模型输出) -->
|
||||
<div v-if="!loading && detailData" class="detail-layout">
|
||||
<!-- 左侧关键信息卡片 -->
|
||||
<div class="left-panel">
|
||||
<el-card class="summary-card">
|
||||
<div slot="header" class="card-header">
|
||||
<span class="card-title">关键信息</span>
|
||||
</div>
|
||||
<el-descriptions :column="1" direction="vertical" border>
|
||||
<el-descriptions-item label="业务方流水号">{{ detailData.serialNum }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户名称">{{ detailData.custName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户类型">{{ detailData.custType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="申请金额">{{ detailData.applyAmt }} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="基准利率">
|
||||
<span class="rate-value">{{ getBaseLoanRate() }}</span> %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="浮动BP">
|
||||
<span class="total-bp-value">{{ getTotalBp() }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="测算利率">
|
||||
<span class="calculate-rate">{{ getCalculateRate() }}</span> %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="执行利率">
|
||||
<div class="execute-rate-input-wrapper">
|
||||
<el-input
|
||||
v-model="executeRateInput"
|
||||
class="execute-rate-input"
|
||||
placeholder="请输入执行利率"
|
||||
>
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="handleSetExecuteRate"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<!-- 右侧面板 -->
|
||||
<div class="right-panel">
|
||||
<!-- 流程详情卡片 -->
|
||||
<el-card class="detail-card">
|
||||
<div slot="header" class="card-header">
|
||||
<span class="card-title">流程详情</span>
|
||||
</div>
|
||||
|
||||
<!-- 基本信息组 -->
|
||||
<div class="info-section">
|
||||
<h4 class="section-title">基本信息</h4>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="机构编码">{{ detailData.orgCode }}</el-descriptions-item>
|
||||
<el-descriptions-item label="运行模式">{{ detailData.runType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户内码">{{ detailData.custIsn }}</el-descriptions-item>
|
||||
<el-descriptions-item label="证件类型">{{ detailData.idType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="证件号码">{{ detailData.idNum }}</el-descriptions-item>
|
||||
<el-descriptions-item label="贷款期限">{{ detailData.loanTerm || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">{{ detailData.createTime }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建者">{{ detailData.createBy }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<!-- 业务信息组 -->
|
||||
<div class="info-section">
|
||||
<h4 class="section-title">业务信息</h4>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="担保方式">{{ detailData.guarType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="申请金额">{{ detailData.applyAmt }} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="省农担担保贷款">{{
|
||||
formatBoolean(detailData.isAgriGuar)
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="绿色贷款">{{ formatBoolean(detailData.isGreenLoan) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="科技型企业">{{ formatBoolean(detailData.isTechEnt) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="抵质押类型">{{ detailData.collType || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="抵质押物是否三方所有">{{
|
||||
formatBoolean(detailData.collThirdParty)
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<!-- 模型输出卡片 -->
|
||||
<ModelOutputDisplay
|
||||
:cust-type="detailData.custType"
|
||||
:retail-output="null"
|
||||
:corp-output="corpOutput"
|
||||
/>
|
||||
|
||||
<!-- 议价池卡片 -->
|
||||
<BargainingPoolDisplay
|
||||
v-if="bargainingPool"
|
||||
:branch-pool="bargainingPool.branchPool"
|
||||
:sub-branch-pool="bargainingPool.subBranchPool"
|
||||
:private-domain-pool="bargainingPool.privateDomainPool"
|
||||
:excess-profit-share="bargainingPool.excessProfitShare"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {setExecuteRate} from "@/api/loanPricing/workflow"
|
||||
import ModelOutputDisplay from "./ModelOutputDisplay.vue"
|
||||
import BargainingPoolDisplay from "./BargainingPoolDisplay.vue"
|
||||
|
||||
export default {
|
||||
name: "CorporateWorkflowDetail",
|
||||
components: {
|
||||
ModelOutputDisplay,
|
||||
BargainingPoolDisplay
|
||||
},
|
||||
props: {
|
||||
detailData: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
corpOutput: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
bargainingPool: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
executeRateInput: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'detailData.executeRate': {
|
||||
handler(newVal) {
|
||||
this.executeRateInput = newVal || ''
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 格式化布尔值为中文 */
|
||||
formatBoolean(value) {
|
||||
if (value === 'true' || value === true) return '是'
|
||||
if (value === 'false' || value === false) return '否'
|
||||
return value || '-'
|
||||
},
|
||||
/** 获取基准利率 */
|
||||
getBaseLoanRate() {
|
||||
return this.corpOutput?.baseLoanRate || '-'
|
||||
},
|
||||
/** 获取浮动BP */
|
||||
getTotalBp() {
|
||||
return this.corpOutput?.totalBp || '-'
|
||||
},
|
||||
/** 获取测算利率 */
|
||||
getCalculateRate() {
|
||||
return this.corpOutput?.calculateRate || '-'
|
||||
},
|
||||
/** 设定执行利率 */
|
||||
handleSetExecuteRate() {
|
||||
const value = this.executeRateInput
|
||||
if (value === null || value === undefined || value === '') {
|
||||
this.$modal.msgError("请输入执行利率")
|
||||
return
|
||||
}
|
||||
|
||||
const numValue = parseFloat(value)
|
||||
if (isNaN(numValue)) {
|
||||
this.$modal.msgError("请输入有效的数字")
|
||||
return
|
||||
}
|
||||
if (numValue < 0 || numValue > 100) {
|
||||
this.$modal.msgError("执行利率必须在 0 到 100 之间")
|
||||
return
|
||||
}
|
||||
|
||||
this.loading = true
|
||||
setExecuteRate(this.detailData.serialNum, value.toString()).then(() => {
|
||||
this.$modal.msgSuccess("执行利率设定成功")
|
||||
this.$emit('refresh')
|
||||
this.loading = false
|
||||
}).catch(error => {
|
||||
this.$modal.msgError("设定失败:" + (error.msg || error.message || "未知错误"))
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.corporate-workflow-detail {
|
||||
.detail-layout {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
align-items: flex-start;
|
||||
|
||||
.left-panel {
|
||||
flex: 0 0 280px;
|
||||
max-width: 280px;
|
||||
|
||||
.summary-card {
|
||||
::v-deep .el-card__header {
|
||||
padding: 16px 20px;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.execute-rate-input-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
|
||||
.execute-rate-input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.rate-value {
|
||||
color: #67c23a;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.total-bp-value {
|
||||
color: #e6a23c;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.calculate-rate {
|
||||
color: #f56c6c;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right-panel {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
|
||||
.detail-card {
|
||||
::v-deep .el-card__header {
|
||||
padding: 16px 20px;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.info-section {
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin: 0 0 16px 0;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #606266;
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
.corporate-workflow-detail {
|
||||
.detail-layout {
|
||||
flex-direction: column;
|
||||
|
||||
.left-panel,
|
||||
.right-panel {
|
||||
flex: 1 1 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<el-dialog title="选择客户类型" :visible.sync="dialogVisible" width="500px" append-to-body
|
||||
:close-on-click-modal="false">
|
||||
<div class="customer-type-selector">
|
||||
<div class="type-card" @click="selectType('personal')">
|
||||
<div class="card-icon">
|
||||
<i class="el-icon-user"></i>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-title">个人客户</div>
|
||||
<div class="card-desc">个人客户利率定价</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type-card" @click="selectType('corporate')">
|
||||
<div class="card-icon">
|
||||
<i class="el-icon-office-building"></i>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-title">企业客户</div>
|
||||
<div class="card-desc">企业客户利率定价</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "CustomerTypeSelector",
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
dialogVisible: {
|
||||
get() {
|
||||
return this.visible
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('update:visible', val)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectType(type) {
|
||||
this.$emit('select', type)
|
||||
this.dialogVisible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.customer-type-selector {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.type-card {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 30px 20px;
|
||||
border: 2px solid #e0e0e0;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.type-card:hover {
|
||||
border-color: #409EFF;
|
||||
background-color: #f0f7ff;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 12px rgba(64, 158, 255, 0.2);
|
||||
}
|
||||
|
||||
.card-icon {
|
||||
font-size: 48px;
|
||||
color: #409EFF;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.card-desc {
|
||||
font-size: 14px;
|
||||
color: #909399;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,270 @@
|
||||
<template>
|
||||
<el-dialog title="新增个人利率定价流程" :visible.sync="dialogVisible" width="900px" append-to-body
|
||||
@close="handleClose">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="140px" class="workflow-create-form">
|
||||
<!-- 基本信息 -->
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户内码" prop="custIsn">
|
||||
<el-input v-model="form.custIsn" placeholder="请输入客户内码"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户名称" prop="custName">
|
||||
<el-input v-model="form.custName" placeholder="请输入客户名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="证件类型" prop="idType">
|
||||
<el-select v-model="form.idType" placeholder="请选择证件类型" style="width: 100%">
|
||||
<el-option label="身份证" value="身份证"/>
|
||||
<el-option label="其他证件" value="其他证件"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="证件号码" prop="idNum">
|
||||
<el-input v-model="form.idNum" placeholder="请输入证件号码"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 贷款信息 -->
|
||||
<el-divider content-position="left">贷款信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="担保方式" prop="guarType">
|
||||
<el-select v-model="form.guarType" placeholder="请选择担保方式" style="width: 100%">
|
||||
<el-option label="信用" value="信用"/>
|
||||
<el-option label="保证" value="保证"/>
|
||||
<el-option label="抵押" value="抵押"/>
|
||||
<el-option label="质押" value="质押"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="申请金额(元)" prop="applyAmt">
|
||||
<el-input v-model="form.applyAmt" placeholder="请输入申请金额"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="是否有经营佐证" prop="bizProof">
|
||||
<el-switch v-model="form.bizProof"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="循环功能" prop="loanLoop">
|
||||
<el-switch v-model="form.loanLoop"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 抵质押信息 -->
|
||||
<el-divider content-position="left">抵质押信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="抵质押类型" prop="collType">
|
||||
<el-select v-model="form.collType" placeholder="请选择抵质押类型" style="width: 100%">
|
||||
<el-option label="一线" value="一线"/>
|
||||
<el-option label="一类" value="一类"/>
|
||||
<el-option label="二类" value="二类"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="抵质押物三方所有" prop="collThirdParty">
|
||||
<el-switch v-model="form.collThirdParty"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" :loading="submitting" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {createPersonalWorkflow} from "@/api/loanPricing/workflow"
|
||||
|
||||
export default {
|
||||
name: "PersonalCreateDialog",
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
// 身份证验证
|
||||
const validateIdNum = (rule, value, callback) => {
|
||||
if (!value) {
|
||||
callback(new Error('请输入证件号码'))
|
||||
} else if (this.form.idType === '身份证') {
|
||||
const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
|
||||
if (!reg.test(value)) {
|
||||
callback(new Error('请输入正确的身份证号码'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
|
||||
// 金额验证
|
||||
const validateApplyAmt = (rule, value, callback) => {
|
||||
if (!value) {
|
||||
callback(new Error('请输入申请金额'))
|
||||
} else {
|
||||
const num = parseFloat(value)
|
||||
if (isNaN(num) || num <= 0) {
|
||||
callback(new Error('请输入有效的金额'))
|
||||
} else if (num > 999999999.99) {
|
||||
callback(new Error('金额不能超过 999999999.99'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
submitting: false,
|
||||
form: {
|
||||
orgCode: '',
|
||||
runType: '1',
|
||||
custIsn: undefined,
|
||||
custName: undefined,
|
||||
idType: undefined,
|
||||
idNum: undefined,
|
||||
guarType: undefined,
|
||||
applyAmt: undefined,
|
||||
bizProof: false,
|
||||
loanLoop: false,
|
||||
collType: undefined,
|
||||
collThirdParty: false
|
||||
},
|
||||
rules: {
|
||||
custIsn: [
|
||||
{required: true, message: "客户内码不能为空", trigger: "blur"},
|
||||
{min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur"}
|
||||
],
|
||||
custName: [
|
||||
{required: true, message: "客户名称不能为空", trigger: "blur"},
|
||||
{min: 1, max: 100, message: "长度在 1 到 100 个字符", trigger: "blur"}
|
||||
],
|
||||
idType: [
|
||||
{required: true, message: "请选择证件类型", trigger: "change"}
|
||||
],
|
||||
idNum: [
|
||||
{required: true, validator: validateIdNum, trigger: "blur"}
|
||||
],
|
||||
guarType: [
|
||||
{required: true, message: "请选择担保方式", trigger: "change"}
|
||||
],
|
||||
applyAmt: [
|
||||
{required: true, validator: validateApplyAmt, trigger: "blur"}
|
||||
],
|
||||
collType: [
|
||||
{required: true, message: "请选择抵质押类型", trigger: "change"}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
dialogVisible: {
|
||||
get() {
|
||||
return this.visible
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('update:visible', val)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(val) {
|
||||
if (val) {
|
||||
this.reset()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
orgCode: '',
|
||||
runType: '1',
|
||||
custIsn: undefined,
|
||||
custName: undefined,
|
||||
idType: undefined,
|
||||
idNum: undefined,
|
||||
guarType: undefined,
|
||||
applyAmt: undefined,
|
||||
bizProof: false,
|
||||
loanLoop: false,
|
||||
collType: undefined,
|
||||
collThirdParty: false
|
||||
}
|
||||
this.submitting = false
|
||||
this.resetForm("form")
|
||||
},
|
||||
/** 对话框关闭处理 */
|
||||
handleClose() {
|
||||
this.cancel()
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.dialogVisible = false
|
||||
this.reset()
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.submitting = true
|
||||
// 转换开关值为字符串
|
||||
const data = {
|
||||
...this.form,
|
||||
bizProof: this.form.bizProof ? 'true' : 'false',
|
||||
loanLoop: this.form.loanLoop ? 'true' : 'false',
|
||||
collThirdParty: this.form.collThirdParty ? 'true' : 'false'
|
||||
}
|
||||
|
||||
createPersonalWorkflow(data).then(response => {
|
||||
this.$modal.msgSuccess("新增成功")
|
||||
this.dialogVisible = false
|
||||
this.$emit('success')
|
||||
}).catch(error => {
|
||||
// 保留表单,显示错误信息
|
||||
console.error('创建失败:', error)
|
||||
}).finally(() => {
|
||||
this.submitting = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.workflow-create-form .el-divider {
|
||||
margin: 8px 0 16px 0;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.workflow-create-form .el-col {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
flex: 0 0 100% !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,322 @@
|
||||
<template>
|
||||
<div class="personal-workflow-detail" v-loading="loading">
|
||||
<!-- 两栏布局:左侧关键信息 + 右侧(流程详情+模型输出) -->
|
||||
<div v-if="!loading && detailData" class="detail-layout">
|
||||
<!-- 左侧关键信息卡片 -->
|
||||
<div class="left-panel">
|
||||
<el-card class="summary-card">
|
||||
<div slot="header" class="card-header">
|
||||
<span class="card-title">关键信息</span>
|
||||
</div>
|
||||
<el-descriptions :column="1" direction="vertical" border>
|
||||
<el-descriptions-item label="业务方流水号">{{ detailData.serialNum }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户名称">{{ detailData.custName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户类型">{{ detailData.custType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="申请金额">{{ detailData.applyAmt }} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="基准利率">
|
||||
<span class="rate-value">{{ getBaseLoanRate() }}</span> %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="浮动BP">
|
||||
<span class="total-bp-value">{{ getTotalBp() }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="测算利率">
|
||||
<span class="calculate-rate">{{ getCalculateRate() }}</span> %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="执行利率">
|
||||
<div class="execute-rate-input-wrapper">
|
||||
<el-input
|
||||
v-model="executeRateInput"
|
||||
class="execute-rate-input"
|
||||
placeholder="请输入执行利率"
|
||||
>
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="handleSetExecuteRate"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<!-- 右侧面板 -->
|
||||
<div class="right-panel">
|
||||
<!-- 流程详情卡片 -->
|
||||
<el-card class="detail-card">
|
||||
<div slot="header" class="card-header">
|
||||
<span class="card-title">流程详情</span>
|
||||
</div>
|
||||
|
||||
<!-- 基本信息组 -->
|
||||
<div class="info-section">
|
||||
<h4 class="section-title">基本信息</h4>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="机构编码">{{ detailData.orgCode }}</el-descriptions-item>
|
||||
<el-descriptions-item label="运行模式">{{ detailData.runType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户内码">{{ detailData.custIsn }}</el-descriptions-item>
|
||||
<el-descriptions-item label="证件类型">{{ detailData.idType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="证件号码">{{ detailData.idNum }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">{{ detailData.createTime }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建者">{{ detailData.createBy }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<!-- 业务信息组 -->
|
||||
<div class="info-section">
|
||||
<h4 class="section-title">业务信息</h4>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="担保方式">{{ detailData.guarType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="申请金额">{{ detailData.applyAmt }} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="是否有经营佐证">{{
|
||||
formatBoolean(detailData.bizProof)
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="循环功能">{{ formatBoolean(detailData.loanLoop) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="抵质押类型">{{ detailData.collType || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="抵质押物是否三方所有">{{
|
||||
formatBoolean(detailData.collThirdParty)
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<!-- 模型输出卡片 -->
|
||||
<ModelOutputDisplay
|
||||
:cust-type="detailData.custType"
|
||||
:retail-output="retailOutput"
|
||||
:corp-output="null"
|
||||
/>
|
||||
|
||||
<!-- 议价池卡片 -->
|
||||
<BargainingPoolDisplay
|
||||
v-if="bargainingPool"
|
||||
:branch-pool="bargainingPool.branchPool"
|
||||
:sub-branch-pool="bargainingPool.subBranchPool"
|
||||
:private-domain-pool="bargainingPool.privateDomainPool"
|
||||
:excess-profit-share="bargainingPool.excessProfitShare"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {setExecuteRate} from "@/api/loanPricing/workflow"
|
||||
import ModelOutputDisplay from "./ModelOutputDisplay.vue"
|
||||
import BargainingPoolDisplay from "./BargainingPoolDisplay.vue"
|
||||
|
||||
export default {
|
||||
name: "PersonalWorkflowDetail",
|
||||
components: {
|
||||
ModelOutputDisplay,
|
||||
BargainingPoolDisplay
|
||||
},
|
||||
props: {
|
||||
detailData: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
retailOutput: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
bargainingPool: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
executeRateInput: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'detailData.executeRate': {
|
||||
handler(newVal) {
|
||||
this.executeRateInput = newVal || ''
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 格式化布尔值为中文 */
|
||||
formatBoolean(value) {
|
||||
if (value === 'true' || value === true) return '是'
|
||||
if (value === 'false' || value === false) return '否'
|
||||
return value || '-'
|
||||
},
|
||||
/** 获取基准利率 */
|
||||
getBaseLoanRate() {
|
||||
return this.retailOutput?.baseLoanRate || '-'
|
||||
},
|
||||
/** 获取浮动BP */
|
||||
getTotalBp() {
|
||||
return this.retailOutput?.totalBp || '-'
|
||||
},
|
||||
/** 获取测算利率 */
|
||||
getCalculateRate() {
|
||||
return this.retailOutput?.calculateRate || '-'
|
||||
},
|
||||
/** 设定执行利率 */
|
||||
handleSetExecuteRate() {
|
||||
const value = this.executeRateInput
|
||||
if (value === null || value === undefined || value === '') {
|
||||
this.$modal.msgError("请输入执行利率")
|
||||
return
|
||||
}
|
||||
|
||||
const numValue = parseFloat(value)
|
||||
if (isNaN(numValue)) {
|
||||
this.$modal.msgError("请输入有效的数字")
|
||||
return
|
||||
}
|
||||
if (numValue < 0 || numValue > 100) {
|
||||
this.$modal.msgError("执行利率必须在 0 到 100 之间")
|
||||
return
|
||||
}
|
||||
|
||||
this.loading = true
|
||||
setExecuteRate(this.detailData.serialNum, value.toString()).then(() => {
|
||||
this.$modal.msgSuccess("执行利率设定成功")
|
||||
this.$emit('refresh')
|
||||
this.loading = false
|
||||
}).catch(error => {
|
||||
this.$modal.msgError("设定失败:" + (error.msg || error.message || "未知错误"))
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.personal-workflow-detail {
|
||||
.detail-layout {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
align-items: flex-start;
|
||||
|
||||
.left-panel {
|
||||
flex: 0 0 280px;
|
||||
max-width: 280px;
|
||||
|
||||
.summary-card {
|
||||
::v-deep .el-card__header {
|
||||
padding: 16px 20px;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.execute-rate-input-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
|
||||
.execute-rate-input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.rate-value {
|
||||
color: #67c23a;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.total-bp-value {
|
||||
color: #e6a23c;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.calculate-rate {
|
||||
color: #f56c6c;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right-panel {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
|
||||
.detail-card {
|
||||
::v-deep .el-card__header {
|
||||
padding: 16px 20px;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.info-section {
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin: 0 0 16px 0;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #606266;
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
.personal-workflow-detail {
|
||||
.detail-layout {
|
||||
flex-direction: column;
|
||||
|
||||
.left-panel,
|
||||
.right-panel {
|
||||
flex: 1 1 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,320 +0,0 @@
|
||||
<template>
|
||||
<el-dialog title="新增利率定价流程" :visible.sync="dialogVisible" width="900px" append-to-body @close="handleClose">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="140px" class="workflow-create-form">
|
||||
<!-- 基本信息 -->
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户内码" prop="custIsn">
|
||||
<el-input v-model="form.custIsn" placeholder="请输入客户内码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户名称" prop="custName">
|
||||
<el-input v-model="form.custName" placeholder="请输入客户名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户类型" prop="custType">
|
||||
<el-select v-model="form.custType" placeholder="请选择客户类型" style="width: 100%">
|
||||
<el-option label="个人" value="个人" />
|
||||
<el-option label="企业" value="企业" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="证件类型" prop="idType">
|
||||
<el-select v-model="form.idType" placeholder="请选择证件类型" style="width: 100%">
|
||||
<el-option label="身份证" value="身份证" />
|
||||
<el-option label="统一社会信用代码" value="统一社会信用代码" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 贷款信息 -->
|
||||
<el-divider content-position="left">贷款信息</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="申请金额(元)" prop="applyAmt">
|
||||
<el-input v-model="form.applyAmt" placeholder="请输入申请金额" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="贷款利率(%)" prop="loanRate">
|
||||
<el-input v-model="form.loanRate" placeholder="请输入贷款利率" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="担保方式" prop="guarType">
|
||||
<el-select v-model="form.guarType" placeholder="请选择担保方式" style="width: 100%">
|
||||
<el-option label="信用" value="信用" />
|
||||
<el-option label="保证" value="保证" />
|
||||
<el-option label="抵押" value="抵押" />
|
||||
<el-option label="质押" value="质押" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="贷款用途" prop="loanPurpose">
|
||||
<el-select v-model="form.loanPurpose" placeholder="请选择贷款用途" style="width: 100%">
|
||||
<el-option label="消费贷款" value="consumer" />
|
||||
<el-option label="经营贷款" value="business" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="抵质押类型" prop="collType">
|
||||
<el-select v-model="form.collType" placeholder="请选择抵质押类型" style="width: 100%">
|
||||
<el-option label="一线" value="一线" />
|
||||
<el-option label="一类" value="一类" />
|
||||
<el-option label="二类" value="二类" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="是否有经营佐证">
|
||||
<el-switch v-model="form.bizProofActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="抵质押物三方所有">
|
||||
<el-switch v-model="form.collThirdPartyActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 中间业务标识 -->
|
||||
<el-divider content-position="left">中间业务标识</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="个人快捷支付">
|
||||
<el-switch v-model="form.midPerQuickPayActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="个人电费代扣">
|
||||
<el-switch v-model="form.midPerEleDdcActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="企业电费代扣">
|
||||
<el-switch v-model="form.midEntEleDdcActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="企业水费代扣">
|
||||
<el-switch v-model="form.midEntWaterDdcActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 企业标识 -->
|
||||
<el-divider content-position="left">企业标识</el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="净身企业">
|
||||
<el-switch v-model="form.isCleanEntActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="开立基本结算账户">
|
||||
<el-switch v-model="form.hasSettleAcctActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="制造业企业">
|
||||
<el-switch v-model="form.isManufacturingActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="省农担担保贷款">
|
||||
<el-switch v-model="form.isAgriGuarActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="纳税信用等级A级">
|
||||
<el-switch v-model="form.isTaxAActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="县级及以上农业龙头企业">
|
||||
<el-switch v-model="form.isAgriLeadingActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="普惠小微借款人">
|
||||
<el-switch v-model="form.isInclusiveFinanceActive" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createWorkflow } from "@/api/loanPricing/workflow"
|
||||
|
||||
export default {
|
||||
name: "WorkflowCreateDialog",
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
rules: {
|
||||
custIsn: [
|
||||
{ required: true, message: "客户内码不能为空", trigger: "blur" }
|
||||
],
|
||||
custType: [
|
||||
{ required: true, message: "请选择客户类型", trigger: "change" }
|
||||
],
|
||||
guarType: [
|
||||
{ required: true, message: "请选择担保方式", trigger: "change" }
|
||||
],
|
||||
applyAmt: [
|
||||
{ required: true, message: "申请金额不能为空", trigger: "blur" }
|
||||
],
|
||||
loanRate: [
|
||||
{ required: true, message: "贷款利率不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
dialogVisible: {
|
||||
get() {
|
||||
return this.visible
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('update:visible', val)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(val) {
|
||||
if (val) {
|
||||
this.reset()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
orgCode: '',
|
||||
runType: '1',
|
||||
custIsn: undefined,
|
||||
custName: undefined,
|
||||
custType: undefined,
|
||||
idType: undefined,
|
||||
applyAmt: undefined,
|
||||
loanRate: undefined,
|
||||
guarType: undefined,
|
||||
loanPurpose: undefined,
|
||||
collType: undefined,
|
||||
// 开关状态
|
||||
bizProofActive: false,
|
||||
collThirdPartyActive: false,
|
||||
midPerQuickPayActive: false,
|
||||
midPerEleDdcActive: false,
|
||||
midEntEleDdcActive: false,
|
||||
midEntWaterDdcActive: false,
|
||||
isCleanEntActive: false,
|
||||
hasSettleAcctActive: false,
|
||||
isManufacturingActive: false,
|
||||
isAgriGuarActive: false,
|
||||
isTaxAActive: false,
|
||||
isAgriLeadingActive: false,
|
||||
isInclusiveFinanceActive: false
|
||||
}
|
||||
this.resetForm("form")
|
||||
},
|
||||
/** 对话框关闭处理 */
|
||||
handleClose() {
|
||||
this.reset()
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.dialogVisible = false
|
||||
this.reset()
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
// 转换开关值为字符串
|
||||
const data = {
|
||||
...this.form,
|
||||
bizProof: this.form.bizProofActive ? 'true' : 'false',
|
||||
collThirdParty: this.form.collThirdPartyActive ? 'true' : 'false',
|
||||
midPerQuickPay: this.form.midPerQuickPayActive ? 'true' : 'false',
|
||||
midPerEleDdc: this.form.midPerEleDdcActive ? 'true' : 'false',
|
||||
midEntEleDdc: this.form.midEntEleDdcActive ? 'true' : 'false',
|
||||
midEntWaterDdc: this.form.midEntWaterDdcActive ? 'true' : 'false',
|
||||
isCleanEnt: this.form.isCleanEntActive ? 'true' : 'false',
|
||||
hasSettleAcct: this.form.hasSettleAcctActive ? 'true' : 'false',
|
||||
isManufacturing: this.form.isManufacturingActive ? 'true' : 'false',
|
||||
isAgriGuar: this.form.isAgriGuarActive ? 'true' : 'false',
|
||||
isTaxA: this.form.isTaxAActive ? 'true' : 'false',
|
||||
isAgriLeading: this.form.isAgriLeadingActive ? 'true' : 'false',
|
||||
isInclusiveFinance: this.form.isInclusiveFinanceActive ? 'true' : 'false'
|
||||
}
|
||||
// 删除开关状态字段
|
||||
delete data.bizProofActive
|
||||
delete data.collThirdPartyActive
|
||||
delete data.midPerQuickPayActive
|
||||
delete data.midPerEleDdcActive
|
||||
delete data.midEntEleDdcActive
|
||||
delete data.midEntWaterDdcActive
|
||||
delete data.isCleanEntActive
|
||||
delete data.hasSettleAcctActive
|
||||
delete data.isManufacturingActive
|
||||
delete data.isAgriGuarActive
|
||||
delete data.isTaxAActive
|
||||
delete data.isAgriLeadingActive
|
||||
delete data.isInclusiveFinanceActive
|
||||
|
||||
createWorkflow(data).then(response => {
|
||||
this.$modal.msgSuccess("新增成功")
|
||||
this.dialogVisible = false
|
||||
this.$emit('success')
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.workflow-create-form .el-divider {
|
||||
margin: 8px 0 16px 0;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
@@ -6,143 +6,35 @@
|
||||
<el-button icon="el-icon-back" size="small" @click="goBack">返回</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 两栏布局:左侧关键信息 + 右侧(流程详情+模型输出) -->
|
||||
<div v-if="!loading && workflowDetail" class="detail-layout">
|
||||
<!-- 左侧关键信息卡片 -->
|
||||
<div class="left-panel">
|
||||
<el-card class="summary-card">
|
||||
<div slot="header" class="card-header">
|
||||
<span class="card-title">关键信息</span>
|
||||
</div>
|
||||
<el-descriptions :column="1" direction="vertical" border>
|
||||
<el-descriptions-item label="业务方流水号">{{ workflowDetail.serialNum }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户名称">{{ workflowDetail.custName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户类型">{{ workflowDetail.custType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="申请金额">{{ workflowDetail.applyAmt }} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="基准利率">
|
||||
<span class="rate-value">{{ getBaseLoanRate() }}</span> %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="浮动BP">
|
||||
<span class="total-bp-value">{{ getTotalBp() }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="测算利率">
|
||||
<span class="calculate-rate">{{ getCalculateRate() }}</span> %
|
||||
</el-descriptions-item>
|
||||
<!-- 执行利率输入区域 -->
|
||||
<el-descriptions-item label="执行利率" :class="'execute-rate-item'">
|
||||
<div class="execute-rate-input-wrapper">
|
||||
<el-input
|
||||
v-model="executeRateInput"
|
||||
class="execute-rate-input"
|
||||
placeholder="请输入执行利率"
|
||||
>
|
||||
<template slot="append">%</template>
|
||||
</el-input>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="handleSetExecuteRate"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</div>
|
||||
<!-- 根据客户类型渲染对应的详情组件 -->
|
||||
<personal-workflow-detail
|
||||
v-if="!loading && workflowDetail && workflowDetail.custType === '个人'"
|
||||
:detail-data="workflowDetail"
|
||||
:retail-output="retailOutput"
|
||||
:bargaining-pool="bargainingPool"
|
||||
@refresh="getDetail"
|
||||
/>
|
||||
|
||||
<!-- 右侧面板:包含流程详情和模型输出 -->
|
||||
<div class="right-panel">
|
||||
<!-- 流程详情卡片 -->
|
||||
<el-card class="detail-card">
|
||||
<div slot="header" class="card-header">
|
||||
<span class="card-title">流程详情</span>
|
||||
</div>
|
||||
<el-tabs v-model="activeTab">
|
||||
<!-- 基本信息 -->
|
||||
<el-tab-pane label="基本信息" name="basic">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="机构编码">{{ workflowDetail.orgCode }}</el-descriptions-item>
|
||||
<el-descriptions-item label="运行模式">{{ workflowDetail.runType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="客户内码">{{ workflowDetail.custIsn }}</el-descriptions-item>
|
||||
<el-descriptions-item label="证件类型">{{ workflowDetail.idType }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- 业务信息 -->
|
||||
<el-tab-pane label="业务信息" name="business">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="贷款用途">{{ formatLoanPurpose(workflowDetail.loanPurpose) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="是否有经营佐证">{{ formatBoolean(workflowDetail.bizProof) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="抵质押类型">{{ workflowDetail.collType }}</el-descriptions-item>
|
||||
<el-descriptions-item label="抵质押物三方所有">{{ formatBoolean(workflowDetail.collThirdParty) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- 中间业务标识 -->
|
||||
<el-tab-pane label="中间业务标识" name="mid">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="个人快捷支付">{{ formatBoolean(workflowDetail.midPerQuickPay) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="个人电费代扣">{{ formatBoolean(workflowDetail.midPerEleDdc) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="企业电费代扣">{{ formatBoolean(workflowDetail.midEntEleDdc) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="企业水费代扣">{{ formatBoolean(workflowDetail.midEntWaterDdc) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- 企业标识 -->
|
||||
<el-tab-pane label="企业标识" name="ent">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="净身企业">{{ formatBoolean(workflowDetail.isCleanEnt) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="开立基本结算账户">{{ formatBoolean(workflowDetail.hasSettleAcct) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="制造业企业">{{ formatBoolean(workflowDetail.isManufacturing) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="省农担担保贷款">{{ formatBoolean(workflowDetail.isAgriGuar) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="纳税信用等级A级">{{ formatBoolean(workflowDetail.isTaxA) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="县级及以上农业龙头企业">{{ formatBoolean(workflowDetail.isAgriLeading) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="普惠小微借款人">{{ formatBoolean(workflowDetail.isInclusiveFinance) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- 其他信息 -->
|
||||
<el-tab-pane label="其他信息" name="other">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="创建时间">{{ workflowDetail.createTime }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建者">{{ workflowDetail.createBy }}</el-descriptions-item>
|
||||
<el-descriptions-item label="更新时间">{{ workflowDetail.updateTime }}</el-descriptions-item>
|
||||
<el-descriptions-item label="更新者">{{ workflowDetail.updateBy }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
|
||||
<!-- 模型输出卡片 -->
|
||||
<ModelOutputDisplay
|
||||
:cust-type="workflowDetail.custType"
|
||||
:retail-output="retailOutput"
|
||||
:corp-output="corpOutput"
|
||||
/>
|
||||
|
||||
<!-- 议价池卡片 -->
|
||||
<BargainingPoolDisplay
|
||||
:branch-pool="bargainingPool && bargainingPool.branchPool"
|
||||
:sub-branch-pool="bargainingPool && bargainingPool.subBranchPool"
|
||||
:private-domain-pool="bargainingPool && bargainingPool.privateDomainPool"
|
||||
:excess-profit-share="bargainingPool && bargainingPool.excessProfitShare"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<corporate-workflow-detail
|
||||
v-if="!loading && workflowDetail && workflowDetail.custType === '企业'"
|
||||
:detail-data="workflowDetail"
|
||||
:corp-output="corpOutput"
|
||||
:bargaining-pool="bargainingPool"
|
||||
@refresh="getDetail"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getWorkflow, setExecuteRate } from "@/api/loanPricing/workflow"
|
||||
import ModelOutputDisplay from "./components/ModelOutputDisplay.vue"
|
||||
import BargainingPoolDisplay from "./components/BargainingPoolDisplay.vue"
|
||||
import {getWorkflow} from "@/api/loanPricing/workflow"
|
||||
import PersonalWorkflowDetail from "./components/PersonalWorkflowDetail.vue"
|
||||
import CorporateWorkflowDetail from "./components/CorporateWorkflowDetail.vue"
|
||||
|
||||
export default {
|
||||
name: "LoanPricingWorkflowDetail",
|
||||
components: {
|
||||
ModelOutputDisplay,
|
||||
BargainingPoolDisplay
|
||||
PersonalWorkflowDetail,
|
||||
CorporateWorkflowDetail
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -150,17 +42,7 @@ export default {
|
||||
workflowDetail: null,
|
||||
retailOutput: null,
|
||||
corpOutput: null,
|
||||
bargainingPool: null,
|
||||
activeTab: 'basic',
|
||||
executeRateInput: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'workflowDetail.executeRate': {
|
||||
handler(newVal) {
|
||||
this.executeRateInput = newVal || ''
|
||||
},
|
||||
immediate: true
|
||||
bargainingPool: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@@ -177,7 +59,6 @@ export default {
|
||||
}
|
||||
|
||||
getWorkflow(serialNum).then(response => {
|
||||
// 适配新的 API 响应结构 LoanPricingWorkflowVO
|
||||
this.workflowDetail = response.data.loanPricingWorkflow
|
||||
this.retailOutput = response.data.modelRetailOutputFields
|
||||
this.corpOutput = response.data.modelCorpOutputFields
|
||||
@@ -191,74 +72,6 @@ export default {
|
||||
/** 返回上一页 */
|
||||
goBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
/** 格式化布尔值为中文 */
|
||||
formatBoolean(value) {
|
||||
if (value === 'true' || value === true) return '是'
|
||||
if (value === 'false' || value === false) return '否'
|
||||
return value || '-'
|
||||
},
|
||||
/** 格式化贷款用途 */
|
||||
formatLoanPurpose(value) {
|
||||
if (value === 'consumer') return '消费贷款'
|
||||
if (value === 'business') return '经营贷款'
|
||||
return value || '-'
|
||||
},
|
||||
/** 获取基准利率 */
|
||||
getBaseLoanRate() {
|
||||
if (this.workflowDetail.custType === '个人' && this.retailOutput) {
|
||||
return this.retailOutput.baseLoanRate || '-'
|
||||
} else if (this.workflowDetail.custType === '企业' && this.corpOutput) {
|
||||
return this.corpOutput.baseLoanRate || '-'
|
||||
}
|
||||
return '-'
|
||||
},
|
||||
/** 获取浮动BP */
|
||||
getTotalBp() {
|
||||
if (this.workflowDetail.custType === '个人' && this.retailOutput) {
|
||||
return this.retailOutput.totalBp || '-'
|
||||
} else if (this.workflowDetail.custType === '企业' && this.corpOutput) {
|
||||
return this.corpOutput.totalBp || '-'
|
||||
}
|
||||
return '-'
|
||||
},
|
||||
/** 获取测算利率 */
|
||||
getCalculateRate() {
|
||||
if (this.workflowDetail.custType === '个人' && this.retailOutput) {
|
||||
return this.retailOutput.calculateRate || '-'
|
||||
} else if (this.workflowDetail.custType === '企业' && this.corpOutput) {
|
||||
return this.corpOutput.calculateRate || '-'
|
||||
}
|
||||
return '-'
|
||||
},
|
||||
/** 设定执行利率 */
|
||||
handleSetExecuteRate() {
|
||||
// 验证输入
|
||||
const value = this.executeRateInput
|
||||
if (value === null || value === undefined || value === '') {
|
||||
this.$modal.msgError("请输入执行利率")
|
||||
return
|
||||
}
|
||||
|
||||
// 验证是否为有效数字
|
||||
const numValue = parseFloat(value)
|
||||
if (isNaN(numValue)) {
|
||||
this.$modal.msgError("请输入有效的数字")
|
||||
return
|
||||
}
|
||||
if (numValue < 0 || numValue > 100) {
|
||||
this.$modal.msgError("执行利率必须在 0 到 100 之间")
|
||||
return
|
||||
}
|
||||
|
||||
// 调用 API
|
||||
setExecuteRate(this.workflowDetail.serialNum, value.toString()).then(() => {
|
||||
this.$modal.msgSuccess("执行利率设定成功")
|
||||
// 重新获取详情数据
|
||||
this.getDetail()
|
||||
}).catch(error => {
|
||||
this.$modal.msgError("设定失败:" + (error.msg || error.message || "未知错误"))
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -280,124 +93,5 @@ export default {
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
// 两栏布局
|
||||
.detail-layout {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
align-items: flex-start;
|
||||
|
||||
// 左侧关键信息卡片 (固定宽度)
|
||||
.left-panel {
|
||||
flex: 0 0 280px;
|
||||
max-width: 280px;
|
||||
|
||||
.summary-card {
|
||||
::v-deep .el-card__header {
|
||||
padding: 16px 20px;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
// 执行利率输入区域
|
||||
.execute-rate-input-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
|
||||
.execute-rate-input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// 利率值样式
|
||||
.rate-value {
|
||||
color: #67c23a;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
// TOTAL_BP 样式
|
||||
.total-bp-value {
|
||||
color: #e6a23c;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
// 测算利率高亮样式
|
||||
.calculate-rate {
|
||||
color: #f56c6c;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 右侧面板:包含流程详情和模型输出
|
||||
.right-panel {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
|
||||
.detail-card {
|
||||
::v-deep .el-card__header {
|
||||
padding: 16px 20px;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.card-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-card__body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
::v-deep .el-tabs__header {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 响应式布局
|
||||
@media screen and (max-width: 992px) {
|
||||
.workflow-detail-container {
|
||||
.detail-layout {
|
||||
// 切换为单列垂直布局
|
||||
flex-direction: column;
|
||||
|
||||
.left-panel,
|
||||
.right-panel {
|
||||
flex: 1 1 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -77,19 +77,29 @@
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 创建流程对话框 -->
|
||||
<workflow-create-dialog :visible.sync="showCreateDialog" @success="handleCreateSuccess" />
|
||||
<!-- 客户类型选择对话框 -->
|
||||
<customer-type-selector :visible.sync="showTypeSelector" @select="handleSelectType"/>
|
||||
|
||||
<!-- 个人客户创建对话框 -->
|
||||
<personal-create-dialog :visible.sync="showPersonalDialog" @success="handleCreateSuccess"/>
|
||||
|
||||
<!-- 企业客户创建对话框 -->
|
||||
<corporate-create-dialog :visible.sync="showCorporateDialog" @success="handleCreateSuccess"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {listWorkflow} from "@/api/loanPricing/workflow"
|
||||
import WorkflowCreateDialog from "./components/WorkflowCreateDialog"
|
||||
import CustomerTypeSelector from "./components/CustomerTypeSelector"
|
||||
import PersonalCreateDialog from "./components/PersonalCreateDialog"
|
||||
import CorporateCreateDialog from "./components/CorporateCreateDialog"
|
||||
|
||||
export default {
|
||||
name: "LoanPricingWorkflow",
|
||||
components: {
|
||||
WorkflowCreateDialog
|
||||
CustomerTypeSelector,
|
||||
PersonalCreateDialog,
|
||||
CorporateCreateDialog
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -101,8 +111,12 @@ export default {
|
||||
total: 0,
|
||||
// 利率定价流程表格数据
|
||||
workflowList: [],
|
||||
// 是否显示创建弹出层
|
||||
showCreateDialog: false,
|
||||
// 是否显示客户类型选择弹出层
|
||||
showTypeSelector: false,
|
||||
// 是否显示个人客户创建弹出层
|
||||
showPersonalDialog: false,
|
||||
// 是否显示企业客户创建弹出层
|
||||
showCorporateDialog: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
@@ -145,7 +159,15 @@ export default {
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.showCreateDialog = true
|
||||
this.showTypeSelector = true
|
||||
},
|
||||
/** 选择客户类型回调 */
|
||||
handleSelectType(type) {
|
||||
if (type === 'personal') {
|
||||
this.showPersonalDialog = true
|
||||
} else if (type === 'corporate') {
|
||||
this.showCorporateDialog = true
|
||||
}
|
||||
},
|
||||
/** 创建成功回调 */
|
||||
handleCreateSuccess() {
|
||||
|
||||
Reference in New Issue
Block a user