|
|
@@ -0,0 +1,288 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <van-nav-bar title="个贷业务下单" left-text="返回" left-arrow @click-left="onClickLeft()" />
|
|
|
+ <div class="form-style">
|
|
|
+ <van-form @submit="addPersonalOrder()">
|
|
|
+ <van-cell-group inset>
|
|
|
+ <van-field label="客户经理" v-model="personal.clientManager" name="clientManager" readonly />
|
|
|
+ <VanSinglePicker
|
|
|
+ label="评估目的"
|
|
|
+ v-model="personal.evaluateAim"
|
|
|
+ v-bind:columns="evaluateAimColumns"
|
|
|
+ name="evaluateAim"
|
|
|
+ placeholder="请选择评估目的"
|
|
|
+ clearable
|
|
|
+ :rules="[{ required: true, message: '请选择评估目的' }]"
|
|
|
+ :required="true"
|
|
|
+ />
|
|
|
+ <van-field label="房屋用途" name="purpose" :rules="[{ required: true, message: '请选择房屋用途' }]" required>
|
|
|
+ <template #input>
|
|
|
+ <van-checkbox-group v-model="personal.purpose" direction="horizontal">
|
|
|
+ <van-checkbox name="HOUSE" shape="square" style="margin: 2px" icon-size="14px">住宅</van-checkbox>
|
|
|
+ <van-checkbox name="BUSINESS" shape="square" style="margin: 2px" icon-size="14px">商业</van-checkbox>
|
|
|
+ <van-checkbox name="OFFICE" shape="square" style="margin: 2px" icon-size="14px">办公</van-checkbox>
|
|
|
+ <van-checkbox name="INDUSTRIAL" shape="square" style="margin: 2px" icon-size="14px">工业</van-checkbox>
|
|
|
+ <van-checkbox name="OTHER" shape="square" style="margin: 2px" icon-size="14px">其他</van-checkbox>
|
|
|
+ </van-checkbox-group>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <van-field label="坐落" v-model="personal.location" name="location" type="textarea" placeholder="请输入坐落" :rules="[{ required: true, message: '请输入坐落' }]" required />
|
|
|
+ <VanSinglePicker
|
|
|
+ label="客户类型"
|
|
|
+ v-model="personal.clienteleType"
|
|
|
+ v-bind:columns="clienteleTypeColumns"
|
|
|
+ name="clienteleType"
|
|
|
+ placeholder="请选择客户类型"
|
|
|
+ @change="changeCustomerType(0)"
|
|
|
+ clearable
|
|
|
+ :rules="[{ required: true, message: '请选择客户类型' }]"
|
|
|
+ :required="true"
|
|
|
+ />
|
|
|
+ <VanSinglePicker
|
|
|
+ label="客户名称"
|
|
|
+ v-model="personal.clienteleId"
|
|
|
+ v-bind:columns="customerCompanyColumns"
|
|
|
+ name="clienteleId"
|
|
|
+ placeholder="请选择客户名称"
|
|
|
+ @change="findSubCustomerCompany(0)"
|
|
|
+ clearable
|
|
|
+ :rules="[{ required: true, message: '请选择客户名称' }]"
|
|
|
+ :required="true"
|
|
|
+ v-if="personal.clienteleType === '企业'"
|
|
|
+ />
|
|
|
+ <VanSinglePicker
|
|
|
+ label="业务来源"
|
|
|
+ v-model="personal.clienteleSubId"
|
|
|
+ v-bind:columns="subCustomerCompanyColumns"
|
|
|
+ name="clienteleSubId"
|
|
|
+ placeholder="请选择业务来源"
|
|
|
+ @change="findCustomerContract()"
|
|
|
+ clearable
|
|
|
+ :rules="[{ required: true, message: '请选择业务来源' }]"
|
|
|
+ :required="true"
|
|
|
+ v-if="personal.clienteleType === '企业'"
|
|
|
+ />
|
|
|
+ <VanSinglePicker
|
|
|
+ label="客户联系人"
|
|
|
+ v-model="personal.clienteleContactId"
|
|
|
+ v-bind:columns="customerContractColumns"
|
|
|
+ name="clienteleContactId"
|
|
|
+ placeholder="请选择客户联系人"
|
|
|
+ clearable
|
|
|
+ :rules="[{ required: true, message: '请选择客户联系人' }]"
|
|
|
+ :required="true"
|
|
|
+ />
|
|
|
+ <van-field label="中介" v-model="personal.agent" name="agent" placeholder="请输入中介" />
|
|
|
+ <van-field label="贷款性质" v-model="personal.loanNature" name="loanNature" placeholder="请输入贷款性质" />
|
|
|
+ <van-field label="贷款用途" v-model="personal.loanAim" name="loanAim" placeholder="请输入贷款用途" />
|
|
|
+ <van-field label="贷款额度" v-model="personal.loanLimit" name="loanLimit" type="number" placeholder="请输入贷款额度(万元)" :rules="[{ required: true, message: '请输入贷款额度' }]" required />
|
|
|
+ <van-field label="贷款期限" v-model="personal.loanPeriod" name="loanPeriod" type="number" placeholder="请输入贷款期限(年)" />
|
|
|
+ <van-field name="loanExpire" label="贷款是否到期">
|
|
|
+ <template #input>
|
|
|
+ <van-radio-group v-model="personal.loanExpire" direction="horizontal" icon-size="14px">
|
|
|
+ <van-radio name="false">否</van-radio>
|
|
|
+ <van-radio name="true">是</van-radio>
|
|
|
+ </van-radio-group>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <van-field label="资料说明" name="credentials">
|
|
|
+ <template #input>
|
|
|
+ <van-checkbox-group v-model="personal.credentials" direction="horizontal">
|
|
|
+ <van-checkbox name="HOUSE_CERTIFICATE" shape="square" style="margin: 2px" icon-size="14px">房产证</van-checkbox>
|
|
|
+ <van-checkbox name="LAND_CERTIFICATE" shape="square" style="margin: 2px" icon-size="14px">国土证</van-checkbox>
|
|
|
+ <van-checkbox name="IMMOVABLE_CERTIFICATE" shape="square" style="margin: 2px" icon-size="14px">不动产权证</van-checkbox>
|
|
|
+ </van-checkbox-group>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <van-field label="委托人1" v-model="personal.bailorA" name="bailorA" placeholder="请输入委托人1" />
|
|
|
+ <van-field label="委托人1电话" v-model="personal.bailoraTel" name="bailoraTel" placeholder="请输入委托人1电话" />
|
|
|
+ <van-field label="委托人2" v-model="personal.bailorB" name="bailorB" placeholder="请输入委托人2" />
|
|
|
+ <van-field label="委托人2电话" v-model="personal.bailorbTel" name="bailorbTel" placeholder="请输入委托人2电话" />
|
|
|
+ <van-field label="订单备注" v-model="personal.remark" name="remark" type="textarea" />
|
|
|
+ </van-cell-group>
|
|
|
+ <div style="margin: 16px;">
|
|
|
+ <van-button round block type="primary" native-type="submit">提交</van-button>
|
|
|
+ </div>
|
|
|
+ </van-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { mapStores } from 'pinia';
|
|
|
+import { useUserStore } from '@/stores/useUserStore';
|
|
|
+import { showNotify } from 'vant';
|
|
|
+import VanSinglePicker from '@/components/VanSinglePicker/index.vue';
|
|
|
+import { customerLinkmanDrop } from '@/api/customerLinkman';
|
|
|
+import { customerCompanyDrop } from '@/api/customerCompany';
|
|
|
+import { add } from '@/api/personal';
|
|
|
+import { commit } from '@/api/workflow';
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ VanSinglePicker,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // 评估目的
|
|
|
+ evaluateAimColumns: [
|
|
|
+ { text: '按揭', value: '按揭' },
|
|
|
+ { text: '抵押', value: '抵押' },
|
|
|
+ { text: '咨询', value: '咨询' },
|
|
|
+ ],
|
|
|
+ // 客户类型
|
|
|
+ clienteleTypeColumns: [
|
|
|
+ { text: '企业', value: '企业' },
|
|
|
+ { text: '个人', value: '个人' },
|
|
|
+ ],
|
|
|
+ // 客户名称
|
|
|
+ customerCompanyColumns: [],
|
|
|
+ // 业务来源
|
|
|
+ subCustomerCompanyColumns: [],
|
|
|
+ // 客户联系人
|
|
|
+ customerContractColumns: [],
|
|
|
+ personal: {
|
|
|
+ clientManagerId: null,
|
|
|
+ clientManager: null,
|
|
|
+ evaluateAim: null,
|
|
|
+ purpose: [],
|
|
|
+ location: null,
|
|
|
+ clienteleId: null,
|
|
|
+ clienteleSubId: null,
|
|
|
+ clienteleContactId: null,
|
|
|
+ agent: null,
|
|
|
+ loanNature: null,
|
|
|
+ loanAim: null,
|
|
|
+ loanLimit: null,
|
|
|
+ loanPeriod: null,
|
|
|
+ loanExpire: 'false',
|
|
|
+ credentials: [],
|
|
|
+ bailorA: null,
|
|
|
+ bailoraTel: null,
|
|
|
+ bailorB: null,
|
|
|
+ bailorbTel: null,
|
|
|
+ remark: null,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapStores(useUserStore),
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.personal.clientManagerId = this.userStore.userInfo.id;
|
|
|
+ this.personal.clientManager = this.userStore.userInfo.name;
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onClickLeft() {
|
|
|
+ history.back();
|
|
|
+ },
|
|
|
+ // 客户类型改变的触发
|
|
|
+ changeCustomerType(val) {
|
|
|
+ // 清空客户信息
|
|
|
+ this.customerCompanyColumns = [];
|
|
|
+ this.subCustomerCompanyColumns = [];
|
|
|
+ this.customerContractColumns = [];
|
|
|
+ this.personal.clienteleId = null;
|
|
|
+ this.personal.clienteleSubId = null;
|
|
|
+ this.personal.clienteleContactId = null;
|
|
|
+
|
|
|
+ // 判断客户类型
|
|
|
+ if (this.personal.clienteleType === '个人') {
|
|
|
+ // 个人类型直接获取客户联系人
|
|
|
+ let simpleAll = new Object();
|
|
|
+ simpleAll.ccId = 1;
|
|
|
+ simpleAll.terminal = 0;
|
|
|
+ customerLinkmanDrop(simpleAll).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ // 使用 map 方法提取 id 和 name 属性
|
|
|
+ this.customerContractColumns = res.data.map((item) => ({
|
|
|
+ value: String(item.id),
|
|
|
+ text: String(item.name),
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ let simpleAll = new Object();
|
|
|
+ simpleAll.terminal = 0;
|
|
|
+ customerCompanyDrop(simpleAll).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ // 使用 map 方法提取 id 和 name 属性
|
|
|
+ this.customerCompanyColumns = res.data.map((item) => ({
|
|
|
+ value: String(item.id),
|
|
|
+ text: String(item.name),
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取业务来源
|
|
|
+ findSubCustomerCompany(val) {
|
|
|
+ // 清空业务来源和客户联系人信息
|
|
|
+ this.subCustomerCompanyColumns = [];
|
|
|
+ this.customerContractColumns = [];
|
|
|
+ this.personal.clienteleSubId = null;
|
|
|
+ this.personal.clienteleContactId = null;
|
|
|
+ // 判断客户名称id不为空
|
|
|
+ if (this.personal.clienteleId) {
|
|
|
+ let simpleAll = new Object();
|
|
|
+ simpleAll.terminal = val;
|
|
|
+ simpleAll.parentId = this.personal.clienteleId;
|
|
|
+ customerCompanyDrop(simpleAll).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ // 使用 map 方法提取 id 和 name 属性
|
|
|
+ this.subCustomerCompanyColumns = res.data.map((item) => ({
|
|
|
+ value: String(item.id),
|
|
|
+ text: String(item.name),
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取企业的客户联系人信息
|
|
|
+ findCustomerContract() {
|
|
|
+ // 清空客户联系人信息
|
|
|
+ this.customerContractColumns = [];
|
|
|
+ this.personal.clienteleContactId = null;
|
|
|
+ let simpleAll = new Object();
|
|
|
+ simpleAll.ccId = this.personal.clienteleSubId;
|
|
|
+ customerLinkmanDrop(simpleAll).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ // 使用 map 方法提取 id 和 name 属性
|
|
|
+ this.customerContractColumns = res.data.map((item) => ({
|
|
|
+ value: String(item.id),
|
|
|
+ text: String(item.name),
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 个贷下单
|
|
|
+ addPersonalOrder() {
|
|
|
+ // 将数组转换成JSON字符串后会影响表单的双向绑定,所以新建一个对象
|
|
|
+ let personalObj = new Object();
|
|
|
+ personalObj = { ...this.personal };
|
|
|
+ personalObj.purpose = JSON.stringify(personalObj.purpose);
|
|
|
+ personalObj.credentials = JSON.stringify(personalObj.credentials);
|
|
|
+ // 下单
|
|
|
+ add(personalObj).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ if (res.data && res.data.instanceNodeId && res.data.state) {
|
|
|
+ commit(res.data).then((result) => {
|
|
|
+ if (result.code === 200 && result.data) {
|
|
|
+ showNotify({ type: 'success', message: '下单并提交流程成功' });
|
|
|
+ } else {
|
|
|
+ showNotify({ type: 'success', message: '下单成功, 需要手动提交流程' });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ showNotify({ type: 'success', message: '下单成功, 需要手动提交流程' });
|
|
|
+ }
|
|
|
+ history.back();
|
|
|
+ } else {
|
|
|
+ showNotify({ type: 'success', message: '下单失败, 请稍后再试' });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+</style>
|
