Commit c386789b authored by 胡's avatar

feat: 融租申请审批

parent 40766e55
<!-- 附件 -->
<template>
<div style="width: 100%;">
<p class="notice">tips:点击上传目录即可上传,点击文件即可下载。</p>
<div class="table-box">
<table class="att_table">
<tr>
<th>上传目录</th>
<th>附件</th>
<th>备注</th>
</tr>
<tr v-for="(item, index) of appendixData" :key="item.check_id">
<td @click="chooseFile(item.check_id)">{{ item.description }}</td>
<td>
<span v-for="(attach, ai) in item.attachArr" :key="attach.attachId" @click="previewOrDownload(attach)">
{{ attach.fileName + (ai === item.attachArr.length - 1 ? '' : ',') }}
</span>
</td>
<td>{{ item.note }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
props: ['appendixData'],
data() {
return {
licenseImg: '',
}
},
methods: {
previewOrDownload(attObj) {
let picUrl = `${process.env.filePath}attachment_id=${attObj.attachId}&access_token=${window.localStorage.access_token}`
if (/.png|.jpg$/.test(attObj.fileName)) {
this.showBigPicture(picUrl)
} else {
window.open(hlsUtil.convertImageUrl(picUrl))
}
console.log(attObj.attachId);
},
// 上传窗口
chooseFile(check_id) {
let vm = this
hlsPopup.showActionSheet({
titleText: '请选择照片',
buttonArray: ['拍照', '从相册取'],
callback: index => {
if (index === 0) {
vm.openCamera(check_id)
} else {
vm.takePicture(check_id)
}
},
})
},
openCamera(check_id) {
let vm = this
let cameraoptions = {
quality: 60,
width: 1843,
height: 1382,
}
let success = function (imgdata) {
if (!imgdata) {
hlsPopup.showLongCenter('请拍照')
} else {
vm.licenseImg = hlsUtil.convertImageUrl(imgdata)
let list = [{
pkvalue: check_id,
source_type: "PRJ_CDD_ITEM_CHECK",
picture: '',
filePath: imgdata,
attachment_id: '',
user_id: 1,
fileName: ''
}]
save_file(list)
}
}
let error = function () {
hlsPopup.showLongCenter('请拍照')
}
hlsUtil.openCamera(cameraoptions, success, error)
},
takePicture(check_id) {
let vm = this
var cameraoptions = {
quality: 70,
width: 1843,
height: 1382,
maxCount: 1,
}
let success = function (imgUrl) {
if (imgUrl.length === 0) {
hlsPopup.showLongCenter('请选择一张图片')
} else {
vm.licenseImg = hlsUtil.convertImageUrl(imgUrl[0])
let list = [{
pkvalue: check_id,
source_type: "PRJ_CDD_ITEM_CHECK",
picture: '',
filePath: imgUrl[0],
attachment_id: '',
user_id: 1,
fileName: ''
}]
save_file(list)
}
}
let error = function () {
hlsPopup.showLongCenter(error)
}
vm.hlsUtil.takePicture(cameraoptions, success, error)
},
// 图片保存
save_file(list) {
let vm = this
if (list.length) {
// hlsPopup.showLoading('图片上传请稍候')
var alreadyUploadNum = 0
var attLength = 0
var recordUploadInterval = setInterval(function () {
if (alreadyUploadNum === attLength) {
clearInterval(recordUploadInterval)
/* hlsPopup.hideLoading()
hlsPopup.showLongCenter('图片上传成功') */
}
}, 500)
for (var i = 0; i < list.length; i++) {
let uploadSuccess = function (res) {
if (res.result === 'S') {
alreadyUploadNum++
for (var j = 0; j < list.length; j++) {
if (list[j].filePath === res.response.filePath) {
list[j].attachment_id = res.response.attachment_id
vm.upload_list.push(list[j])
break
}
}
} else {
hlsPopup.hideLoading()
}
}
if (!list[i].attachment_id) {
attLength++
console.log(list[i])
hlsUtil.fileUploadSvc(list[i], uploadSuccess)
}
}
} else {
hlsPopup.hideLoading()
}
},
// 查看图片
showBigPicture(picUrl) {
let vm = this
vm.hlsPopup.showBigPicture({ imgUrl: picUrl, width: '100%', })
},
}
}
</script>
<style lang="less" scoped>
.notice {
padding: 10px 10px;
background-color: #fffbe8;
color: #ed6a0c;
font-size: 14px;
font-family: PingFangSC-Semibold;
}
.table-box {
width: 100vw;
overflow-x: auto;
}
.att_table {
min-width: 100%;
font-family: PingFangSC-Semibold;
font-size: 14px;
line-height: 32px;
color: #02459a;
td,
th {
box-sizing: border-box;
padding: 3px 5px;
border: 1px solid #ccc;
text-align: center;
height: 32px;
min-width: 100px;
}
th {
height: 25px;
line-height: 25px;
font-weight: 600;
}
}
</style>
\ No newline at end of file
<!-- 审批历史 -->
<template>
<div class="history-detail">
<div class="history-item" v-for="(item, index) in historyData" :key="index" :class="{ hidden: !isOpen && index }">
<div class="dot"></div>
<div class="info-box">
<span style="font-weight: 600; flex: 1 0 33%">{{ item.node_desc }}</span>
<span style="flex: 1 0 33%; text-align: center;">{{ item.action_type_desc }}</span>
<span style="font-size: 0.24rem;flex: 1 0 33%; text-align: right;">{{ item.create_date_fmt.split(' ')[0] }}</span>
<!-- <span style="flex: 1 0 100%">{{ item.comment_text }}</span> -->
</div>
</div>
</div>
</template>
<script>
export default {
props: [
'isOpen',
'historyData'
],
data() {
return {
// historyData: [
// {
// title: '20主机厂初审中',
// date: '2023/1/4 18:01:43',
// remark: ''
// },
// {
// title: '20主机厂初审中',
// date: '2023/1/4 18:01:43',
// remark: ''
// },
// {
// title: '20主机厂初审中',
// date: '2023/1/4 18:01:43',
// remark: ''
// },
// {
// title: '20主机厂初审中',
// date: '2023/1/4 18:01:43',
// remark: ''
// },
// ]
}
},
created() {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.history-detail {
color: white;
padding: 10px 10px 0;
font-size: 0.26rem;
.history-item {
display: flex;
justify-content: space-around;
height: 70px;
&:last-child .dot {
background-repeat: no-repeat;
}
&:nth-child(1) .dot {
background-repeat: repeat;
}
}
}
.dot {
height: 70px;
width: 2px;
z-index: 0;
background: linear-gradient(to top, #fff, #fff 0.05rem, transparent 0.05rem, transparent);
background-size: 100% 0.16rem;
&::before {
content: '';
display: block;
width: 12px;
height: 12px;
border-radius: 12px;
transform: translateX(-0.11rem);
z-index: 11;
background-color: #a8a9aa;
}
}
.hidden {
visibility: hidden;
}
.info-box {
display: flex;
flex-wrap: wrap;
flex: 1 0 60%;
max-width: 85%;
}
</style>
\ No newline at end of file
<!-- 承租人 -->
<template>
<list-item :item-height="44">
<item v-for="(ele, i) of formdata" :key="ele.title">
<div slot="name" class="font-color">{{ ele.title }}</div>
<span slot="content" v-if="ele.type === 'currency'">{{ lesseeData[ele.prop] || currency }}</span>
<span slot="content" v-else-if="ele.type === 'bool'">{{ lesseeData[ele.prop] === 'Y' ? '是' : '否' }}</span>
<span slot="content" v-else="ele.type === 'text'">{{ lesseeData[ele.prop] }}</span>
</item>
</list-item>
</template>
<script>
export default {
props: ["lesseeData"],
data() {
return {
}
},
computed: {
formdata() {
return this.createForm()
}
},
methods: {
factory(arr) {
let outArr = []
if (arr.length) {
arr.forEach(ele => {
let [title, prop, type] = ele
outArr.push({
title: title || '',
prop: prop || 'fdf',
type: type || 'text'
})
});
}
return outArr
},
createForm() {
let corporationFormArr = [
['公司名称', 'bp_id_tenant_n', 'text'],
['客户编码', 'BP_CODE', 'text'],
['企业类型', 'enterprise_type', 'text'],
['法定代表人', 'legal_person', 'text'],
['法人身份证号', 'id_card_no', 'text'],
['法人手机号', 'cell_phone', 'text'],
['注册资本(万元)', 'registered_capital', 'text'],
['法人联系地址', 'living_ad', 'text'],
['企业性质', 'enterpriese_nature_n', 'text'],
['注册地址', 'registered_place', 'text'],
['经营地址', 'business_address', 'text'],
['自有设备价值', 'equip_value_n', 'text'],
['设备保有量', 'equip_num_n', 'text'],
['工程合同', 'engineer_con_n', 'text'],
['农行代扣', 'abc_deduction_flag', 'bool'],
['是否授权', 'auth_flag', 'bool'],
['合同补充条款', 'contract_supplementary_file', 'text'],
]
let personalFormArr = [
['姓名', 'bp_id_tenant_n', 'text'],
['客户编码', 'bp_code', 'text'],
['身份证号', 'id_card_no', 'text'],
['手机号', 'cell_phone', 'text'],
['婚姻', 'marital_status_n', 'text'],
['职业情况', 'np_occupation_n', 'text'],
['自有设备价值', 'equip_value_n', 'text'],
['行业情况', 'np_industry_exp_n', 'text'],
['户籍地址', 'address_on_resident_booklit', 'text'],
['联系地址', 'living_address', 'text'],
['配偶姓名', 'bp_name_sp', 'text'],
['配偶手机号', 'spouse_phone', 'text'],
['房产类型', 'house_type', 'text'],
['配偶工作地址', 'working_place_sp', 'text'],
['配偶联系地址', 'address_sp', 'text'],
['农行代扣', 'abc_deduction_flag', 'bool'],
['是否抵押', 'mortgega_flag', 'bool'],
['合同补充条款', 'contract_supplementary_file', 'text'],
]
let nowForm = this.lesseeData.bp_class === 'NP' ? personalFormArr : corporationFormArr
return this.factory(nowForm)
}
}
}
</script>
<style lang="less" scoped></style>
\ No newline at end of file
<!-- 商业伙伴 -->
<template>
<Collapse v-model="activeNames" v-if="bplist.length">
<CollapseItem v-for="(p, pi) of bplist" :title="p.bp_name" :key="p.bp_name" :name="pi">
<list-item :item-height="44">
<item v-for="(ele, i) of formdata" :key="ele.title">
<div slot="name" class="font-color">{{ ele.title }}</div>
<span slot="content">{{ bplist[pi][ele.prop] }}</span>
</item>
</list-item>
</CollapseItem>
</Collapse>
</template>
<script>
import { Collapse, CollapseItem } from 'vant';
import 'vant/lib/collapse/style';
import 'vant/lib/collapse-item/style';
export default {
props: ['bplist'],
components: {
Collapse, CollapseItem
},
data() {
return {
activeNames: [0],
formdata: [],
}
},
created() {
this.createForm()
},
methods: {
factory(arr) {
// 接收二维数组,产生 formdata
if (arr.length) {
arr.forEach(ele => {
let [title, prop, type] = ele
this.formdata.push({
title: title || '',
prop: prop || '',
type: type || 'text'
})
});
}
},
createForm() {
let formArr = [
['商业伙伴编码', 'bp_id', 'text'],
['商业伙伴名称', 'bp_name', 'text'],
['证件号码', 'id_card_no', 'text'],
['联系电话', 'cell_phone', 'text'],
['资产', 'capital', 'text'],
['商业伙伴角色', 'bp_category_n', 'text'],
['征信授权签约状态', 'confirm_status', 'text'],
['征信签约顺序', 'sign_position', 'text'],
['合同签约状态', 'car_confirm_status', 'text'],
['合同签约顺序', 'contract_sign_position', 'text'],
]
this.factory(formArr)
}
}
}
</script>
<style lang="less" scoped></style>
\ No newline at end of file
<!-- 商务方案 -->
<template>
<Collapse v-model="activeNames" v-if="planData.length">
<CollapseItem v-for="(p, pi) of planData" :title="p.product_plan_id_n" :key="p.product_plan_id_n" :name="pi">
<list-item :item-height="44">
<item v-for="(ele, i) of formdata" :key="ele.title">
<div slot="name" class="font-color">{{ ele.title }}</div>
<span slot="content" v-if="ele.type == 'currency'">{{ currency(planData[pi][ele.prop]) }}</span>
<span slot="content" v-else-if="ele.type == 'rate'">{{ toPercent(planData[pi][ele.prop]) }}</span>
<span slot="content" v-else="ele.type == 'text'">{{ planData[pi][ele.prop] }}</span>
</item>
</list-item>
<!-- 查看还款计划 -->
<router-link :to="toPath(p.cash_lists, p)">查看还款计划</router-link>
</CollapseItem>
</Collapse>
</template>
<script>
import { Collapse, CollapseItem } from 'vant';
import 'vant/lib/collapse/style';
import 'vant/lib/collapse-item/style';
export default {
props: ['planData'],
components: {
Collapse, CollapseItem
},
data() {
return {
activeNames: [0],
formdata: [],
}
},
created() {
this.createForm()
},
methods: {
toPath(cash_lists, p) {
let headInfo = JSON.stringify({
lease_times: p.lease_times,
financing_num: p.financing_num,
lease_charge: p.lease_charge,
down_payment: p.down_payment,
deposit: p.deposit
})
return { name: 'financingApplyFinancing', params: { cash_lists: JSON.stringify(cash_lists), headInfo } }
},
factory(arr) {
// 接收二维数组,产生 formdata
if (arr.length) {
arr.forEach(ele => {
let [title, prop, type] = ele
this.formdata.push({
title: title || '',
prop: prop || '',
type: type || 'text'
})
});
}
},
createForm() {
let formArr = [
['商务政策', 'product_plan_id_n', 'text'],
['数量', 'product_num', 'text'],
['首付款比例', 'down_payment_ratio', 'rate'],
['首付款(单台)', 'down_payment', 'currency'],
['产品名称', 'division_n', 'text'],
['单价设备', 'equip_price', 'currency'],
['保证金比例(%)', 'deposit_ratio', 'rate'],
['保证金(单台)', 'deposit', 'currency'],
['设备型号', 'product_id_n', 'text'],
['合同金额', 'total_price', 'currency'],
['手续费(%)', 'lease_charge_ratio', 'rate'],
['手续费(单台)', 'lease_charge', 'currency'],
['首期租金付款日期', 'lease_start_date', 'text'],
['租赁利率', 'int_rate', 'rate'],
['管理费(单台)', 'management_money', 'currency'],
['首付款合计', 'first_pay', 'currency'],
['保证金抵扣方式', 'deposit_deduction_n', 'text'],
['还款周期', 'annual_pay_times_n', 'text'],
['名义货价(单台)', 'residual_value', 'currency'],
['每期还款', 'per_repay_num', 'currency'],
['支付方式', 'pay_type_n', 'text'],
['报价方式', 'price_list_n', 'text'],
['GPS费金额', 'gps_fee', 'currency'],
['融资金额', 'financing_num', 'currency'],
['手续费政策', 'handling_policy_n', 'text'],
['租赁期数', 'lease_times', 'text'],
['保险押金', 'insurance_fee', 'currency'],
['利息总额', 'total_interest', 'currency'],
['逾期日利率', 'penalty_rate', 'rate'],
['首x期-起始期', 'lease_times_x_f', 'text'],
['首x期-截至期', 'lease_times_x', 'text'],
['租金总额', 'total_rental_sum', 'currency'],
['冬歇/雨歇起始月份', 'fallow_date_f', 'text'],
['冬歇/雨歇结束月份', 'fallow_date_t', 'text'],
]
this.factory(formArr)
},
currency(num, dotNum = 2) {
if (num === null || num === undefined || isNaN(+num)) return num;
return (+num).toLocaleString("en-US", { style: "decimal", minimumFractionDigits: dotNum, maximumFractionDigits: dotNum });
},
toPercent(val, needSign = true, dotNum = 2) {
if (!val || isNaN(+val)) return '0.00%';
let res = (+val).toLocaleString("zh-CN", { style: "percent", minimumFractionDigits: dotNum });
return needSign ? res : res.replace('%', '');
}
}
}
</script>
<style lang="less" scoped></style>
\ No newline at end of file
<!-- 销售 -->
<template>
<list-item :item-height="44">
<item v-for="(ele, i) of formdata" :key="ele.title">
<div slot="name" class="font-color">{{ ele.title }}</div>
<span slot="content" v-if="ele.type == 'currency'">{{ lesseeData[ele.prop] || currency }}</span>
<span slot="content" v-else="ele.type == 'text'">{{ lesseeData[ele.prop] }}</span>
</item>
</list-item>
</template>
<script>
export default {
props: ["lesseeData"],
data() {
return {
formdata: []
}
},
created() {
this.createForm()
},
methods: {
factory(arr) {
// 接收二维数组,产生 formdata
if (arr.length) {
arr.forEach(ele => {
let [title, prop, type] = ele
this.formdata.push({
title: title || '',
prop: prop || 'fdf',
type: type || 'text'
})
});
}
},
createForm() {
let formArr = [
['办事处', 'office_id_n', 'text'],
['主机厂', 'factory_n', 'text'],
['经销商', 'bp_id_agent_n', 'text'],
['业务类别', 'business_type_n', 'text'],
['申请编号', 'project_number', 'text'],
['项目名称', 'project_name', 'text'],
['签约日期', 'sale_date', 'text'],
['主机厂业务员', 'manu_manager', 'text'],
['业务经理', 'employee_id_n', 'text'],
['销售人员', 'bp_user_id_n', 'text'],
['销售人员手机', 'bp_user_id_phone', 'text'],
]
this.factory(formArr)
}
}
}
</script>
<style lang="less" scoped></style>
\ No newline at end of file
<template>
<h-view id="contract-details" class="public-style">
<h-header :proportion="[5, 1, 1]" class="bar-custom">
<div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>融租申请审批明细</span>
</div>
</h-header>
<h-content style="overflow-y: auto;">
<!-- 审批历史 -->
<div class="history" :class="[history_Coll ? 'history_active' : '']" @click="triggerHistory">
<History :isOpen="history_Coll" :historyData="historyData"></History>
</div>
<!-- 销售信息折叠 -->
<Collapse v-model="collActiveTab">
<CollapseItem title="销售信息" name="1">
<Sale :lesseeData="lesseeData"></Sale>
</CollapseItem>
</Collapse>
<!-- tab 页 -->
<div class="tab-style z100">
<div :class="{ 'done': tabNum === 1, 'undone': tabNum !== 1 }" @click="tabNum = 1;">
承租人
</div>
<div :class="{ 'done': tabNum === 2, 'undone': tabNum !== 2 }" @click="tabNum = 2;">
商务方案
</div>
<div :class="{ 'done': tabNum === 3, 'undone': tabNum !== 3 }" @click="tabNum = 3;">
商业伙伴
</div>
<div :class="{ 'done': tabNum === 4, 'undone': tabNum !== 4 }" @click="tabNum = 4;">
附件
</div>
</div>
<div v-if="tabNum === 1" class="z100">
<Lessee :lesseeData="lesseeData"></Lessee>
</div>
<div v-if="tabNum === 2" class="z100">
<Plan :planData="planData"></Plan>
</div>
<div v-if="tabNum === 3" class="z100">
<Partner :bplist="bplist"></Partner>
</div>
<div v-if="tabNum === 4" class="z100">
<Appendix :appendixData="appendixData"></Appendix>
<div class="approveBottom">
<span> 审批意见 </span>
<textarea v-model="confirm_note" cols="8" rows="5" placeholder="请输入" />
</div>
<div class="foot-bottom" v-show="isTodo">
<button class="success" @click="approv('1')">通 过</button>
<button class="refused" @click="approv('2')">拒 绝</button>
</div>
</div>
</h-content>
</h-view>
</template>
<script>
import { Collapse, CollapseItem } from 'vant';
import 'vant/lib/collapse/style';
import 'vant/lib/collapse-item/style';
import Plan from './components/plan.vue'
import Sale from './components/Sale.vue'
import Partner from './components/Partner.vue'
import Appendix from './components/Appendix.vue'
import Lessee from './components/Lessee.vue'
import History from './components/History.vue'
import axios from 'axios'
export default {
components: {
Plan,
Collapse,
CollapseItem,
Sale,
Partner,
Appendix,
Lessee,
History
},
data() {
return {
tabNum: 1,
collActiveTab: ['2'],
history_Coll: false,
confirm_note: '',
bplist: [], //商业伙伴信息
lesseeData: {}, //承租人, 销售信息
planData: [], // 商务方案
historyData: [],
appendixData: [],
isTodo: true
}
},
beforeRouteEnter(to, from, next) {
next(vm => {
})
},
mounted() {
console.log(this.$route.params)
this.isTodo = this.$route.params.type === 'todo'
this.getHistory()
this.getData()
},
methods: {
getData() {
let project_id = this.$route.params.document_id
this.hlsPopup.showLoading('请稍候')
let url = $config.basePath + 'prj_project_info_query'
let param = { project_id }
this.hlsHttp.post(url, param).then((res) => {
this.hlsPopup.hideLoading()
if (res.result === 'S') {
this.bplist = res.bp_lists
this.lesseeData = res.info
this.planData = res.quotation_lists
this.appendixData = (res.cdd_lists || []).map(item => {
let attachArr = []
item.attach_file_name && item.attach_file_name.split(';;').forEach(ele => {
let attach = ele.split('--')
attach[0] && attachArr.push({ fileName: attach[0], attachId: attach[1] })
})
return { ...item, attachArr }
})
} else {
hlsPopup.showLongCenter('获取工作流信息失败')
setTimeout(() => {
this.$router.back()
}, 2000);
}
})
},
getHistory() {
this.historyData = this.$route.params.approve_history_lists.reverse()
},
triggerHistory() {
this.history_Coll = !this.history_Coll
},
approv(action_type) {
let params = this.$route.params
let param = {
master: {
record_id: params.record_id,
action_type: action_type,
user_id: params.user_id,
comment_text: this.confirm_note,
},
}
console.log(process.env.basePath);
let url = process.env.basePath + (action_type === '1' ? 'action_agree' : 'action_refuse')
console.log(url);
this.hlsPopup.showLoading('请稍候')
this.hlsHttp.post(url, param).then((res) => {
this.hlsPopup.hideLoading()
this.hlsPopup.showLongCenter(res.message)
if (res.result === 'S') {
setTimeout(() => {
this.$router.back()
}, 2000);
}
})
},
},
}
</script>
<style lang="less" rel="stylesheet">
#contract-details {
.bar-custom {
background-color: #02459a;
}
.history {
height: 50px;
background-color: #02459a;
position: relative;
pointer-events: none;
padding: 0 0 30px;
&::after {
background: url('../../assets/userBind/arrow-bottom.png') no-repeat;
background-size: 15px;
background-position: center;
content: " ";
display: block;
position: absolute;
height: 20px;
bottom: 3px;
width: 100%;
pointer-events: auto;
}
}
.history.history_active {
height: auto;
min-height: 100px;
&::after {
transform: rotate(180deg);
}
}
.tab-style {
display: flex;
justify-content: center;
padding-top: 12px;
text-align: center;
padding-bottom: 8px;
align-items: center;
box-shadow: 0 2px 3px 0 rgba(220, 220, 221, 0.5);
div {
display: block;
height: 32px;
width: 172px;
font-family: PingFangSC-Semibold;
font-size: 14px;
letter-spacing: 0.43px;
margin: 0 4px;
line-height: 32px;
color: #02459a;
}
.undone {}
.done {
border-bottom: 2px solid #02459a;
}
img {
width: 16px;
display: block;
float: left;
margin: 8px 5px 0 20px;
}
span:nth-of-type(2) {
margin-left: 7px;
}
}
.van-cell__title {
color: #02459a
}
.van-cell {
background-color: #f6f6f6;
}
.van-icon-arrow::before {
color: #02459a
}
.z100 {
z-index: 100;
}
.approveBottom {
width: 343px;
margin: 0 auto;
span {
display: block;
width: 100%;
font-family: PingFangSC-Semibold;
font-size: 15px;
color: #00469c;
height: 21px;
line-height: 21px;
margin: 16px 0;
img {
float: right;
}
}
textarea {
width: 343px;
border-radius: 2px;
padding: 10px;
}
span::after {
content: "";
display: block;
position: relative;
left: 70px;
top: -17px;
width: 14px;
height: 14px;
background: url("../../assets/intoApproval/approv.png");
background-size: 14px 14px;
}
}
.foot-bottom {
box-sizing: border-box;
display: flex;
justify-content: space-around;
border-radius: 20px;
background-color: #fff;
margin: 10px 15px;
padding: 10px;
button {
height: 40px;
padding: 10px 1rem;
border-radius: 10px;
}
.success {
background-color: #02459a;
border: 1px solid #02459a;
color: #fff
}
.refused {
background-color: #fff;
border: 1px solid #02459a;
color: #02459a
}
.back {
background-color: #ff5461;
border: 1px solid #ff5461;
color: #fff
}
}
}
</style>
<!-- 融资明细 -->
<template>
<h-view id="financing-apply-financing" class="public-style">
<h-header :proportion="[5, 1, 1]" class="bar-custom">
<div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>融资明细</span>
</div>
</h-header>
<h-content>
<div class="header">
<div class="header-title">
<p class="key">融资金额</p>
<p class="value">{{ currency(currencyObj.financing_num) }}</p>
<div class="times">
{{ currencyObj.lease_times }}
</div>
</div>
<div class="header-bottom">
<table>
<tr class="key">
<td>保证金</td>
<td>首付款</td>
<td>手续费</td>
</tr>
<tr class="secend_value">
<td>{{ currency(currencyObj.deposit) }}</td>
<td>{{ currency(currencyObj.down_payment) }}</td>
<td>{{ currency(currencyObj.lease_charge) }}</td>
</tr>
</table>
</div>
</div>
<div class="list">
<p>还款计划</p>
<div class="plan-list">
<div class="plan_item" v-for="ele, i in currencyObj.cashFlow">
<div class="space" style="flex: 1 0 15%">
<div class="item-times">{{ ele.times }}</div>
<div class="item-date">{{ getYear(ele.due_date) }}</div>
<div style="margin-top: 0;">{{ getDate(ele.due_date) }}</div>
</div>
<div class="space">
<div>本金 ¥ {{ currency(ele.principal) }}</div>
<div>租金 ¥ {{ currency(ele.rental) }}</div>
</div>
<div class="space">
<div>利息 ¥ {{ currency(ele.interest) }}</div>
</div>
</div>
</div>
</div>
</h-content>
</h-view>
</template>
<script>
export default {
prop: [],
data() {
return {
currencyObj: {
financing_num: '',
deposit: '',
down_payment: '',
lease_charge: '',
lease_times: 12,
cashFlow: [
{
}
]
}
}
},
mounted() {
let headInfo = JSON.parse(this.$route.params.headInfo)
this.currencyObj = { ...this.currencyObj, ...headInfo }
this.currencyObj.cashFlow = JSON.parse(this.$route.params.cash_lists)
},
methods: {
currency(num, dotNum = 2) {
if (num === null || num === undefined || isNaN(+num)) return num;
return (+num).toLocaleString("en-US", { style: "decimal", minimumFractionDigits: dotNum, maximumFractionDigits: dotNum });
},
getYear(date) {
if (!date) return
return date.split('-')[0]
},
getDate(date) {
if (!date) return
let list = date.split('-')
return list[1] + '-' + list[2]
}
}
}
</script>
<style lang="less" scoped>
@bc: #3079d8;
.header {
height: 19vh;
width: 100%;
padding-left: 10vw;
background-color: #02459a;
color: #fff
}
.list {
font-size: 14px;
display: flex;
flex-direction: column;
height: calc(100% - 25vh);
background-color: #fff;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
box-sizing: border-box;
padding: 10px 15px 0 15px;
color: black;
overflow: hidden;
p {
margin-bottom: 3px;
color: #02459a;
font-size: 16px;
}
}
.plan-list {
flex: 1 0 auto;
height: 80%;
overflow-y: auto;
}
.plan-footer {
flex: 0 1 50px;
display: flex;
justify-content: center;
}
.header-title {
position: relative;
height: 11vh;
display: flex;
flex-direction: column;
}
.key {
line-height: 4vh;
}
.value {
font-size: 23px;
font-weight: 600;
line-height: 4vh;
}
.times {
position: absolute;
right: 10vw;
top: 2vw;
height: 5vh;
width: 7vh;
background-color: #fff;
border-radius: 5px;
font-weight: 600;
color: @bc;
line-height: 5.5vh;
text-align: center;
font-size: 14px;
}
.times::after {
content: '';
display: block;
width: 20px;
height: 20px;
background-image: linear-gradient(143deg, #fff 0%, #fff 50%, transparent 50%);
transform: translateY(-10px);
}
table {
width: 100%;
}
.secend_value {
font-weight: 600;
}
.bar-custom {
background-color: #02459a;
}
.plan_item {
height: 65px;
background-color: #f6f0e8;
width: 100%;
border-radius: 5px;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
padding: 5px;
color: #7f7f7f;
div {
flex: 1 0 33%;
height: 20px;
}
.item-times {
background-color: #f9dab2;
padding-right: 5px;
width: 36px;
line-height: 18px;
}
.item-date {
flex: 0 0 auto;
padding-right: 5px;
margin: 0;
line-height: 18px;
}
}
.plan_item+.plan_item {
margin-top: 10px;
}
.space div+div {
margin-top: 15px;
}
</style>
This diff is collapsed.
......@@ -94,6 +94,15 @@
<img src="@/assets/functionCenter/in@2x.png" alt="">
</div>
</div>
<!-- <div class="info-content">
<div class="add-name">
<img src="@/assets/functionCenter/con-sign@2x.png" alt="">
<div class="name-title">融资申请审批流</div>
</div>
<div class="add-content" @click="goFinancingApply">
<img src="@/assets/functionCenter/in@2x.png" alt="">
</div>
</div> -->
</div>
<div class="fun-item-after">
<div class="userInfo"> 租后业务</div>
......@@ -383,6 +392,19 @@ export default {
hlsPopup.showLongCenter('请先进行用户绑定')
}
},
// // 融资申请审批流
// goFinancingApply () {
// let vm = this
// if (this.bp_id) {
// if (vm.user_bp_type === 'MANAGER') {
// this.$router.push({name: 'financingApplyList'})
// } else {
// hlsPopup.showLongCenter('您当前角色非业务经理,无法使用该功能!')
// }
// } else {
// hlsPopup.showLongCenter('请先进行用户绑定')
// }
// },
goInvoice () {
let vm = this
if (this.bp_id) {
......@@ -502,13 +524,13 @@ export default {
},
todoList () {
if (this.bp_id) {
if (this.user_bp_type !== 'OFFICE' && this.user_bp_type !== 'AGENT') {
hlsPopup.showLongCenter('仅经销商/办事处业务员角色可使用该功能!')
} else {
// if (this.user_bp_type !== 'OFFICE' && this.user_bp_type !== 'AGENT') {
// hlsPopup.showLongCenter('仅经销商/办事处业务员角色可使用该功能!')
// } else {
this.$router.push({
name: 'ToDoList',
})
}
// }
} else {
hlsPopup.showLongCenter('请先进行用户绑定')
}
......@@ -723,6 +745,7 @@ export default {
border-radius: 0.4rem;
width: 80%;
margin-left: 10%;
// margin-top: 10.8rem;
margin-top: 9.8rem;
margin-bottom: 1.5rem;
// position: absolute;
......
This diff is collapsed.
......@@ -106,6 +106,9 @@ const RepayPlan = resolve => require.ensure([], () => { resolve(require('@/pages
// 融资合同创建
const StartList = resolve => require.ensure([], () => { resolve(require('@/pages/contractStart/start-list')) }, 'contractStart')
const AddCar = resolve => require.ensure([], () => { resolve(require('@/pages/contractStart/add-car')) }, 'contractStart')
const financingApplyList = resolve => require.ensure([], () => { resolve(require('@/pages/financingApply/financingApply-list')) }, 'financingApply-list')
const financingApplyDetail = resolve => require.ensure([], () => { resolve(require('@/pages/financingApply/financingApply-detail')) }, 'financingApply-list')
const financingApplyFinancing = resolve => require.ensure([], () => { resolve(require('@/pages/financingApply/financingApply-financing')) }, 'financingApply-list')
// 合同签订
const ConfirmDetail = resolve => require.ensure([], () => { resolve(require('@/pages/carConfirm/confirm-detail')) }, 'carConfirm')
......@@ -304,6 +307,9 @@ export default new Router({
// 融租合同创建
{path: '/start-List', component: StartList, name: 'StartList', meta: {keepAlive: false}},
{path: '/add-car', component: AddCar, name: 'AddCar', meta: {keepAlive: false}},
{path: '/financing-apply-list', component: financingApplyList, name: 'financingApplyList', meta: {keepAlive: false}},
{path: '/financing-apply-detail', component: financingApplyDetail, name: 'financingApplyDetail', meta: {keepAlive: false}},
{path: '/financing-apply-financing', component: financingApplyFinancing, name: 'financingApplyFinancing', meta: {keepAlive: false}},
// 合同签订
{path: '/confirm-detail', component: ConfirmDetail, name: 'ConfirmDetail', meta: {keepAlive: false}},
{path: '/confirm-list', component: ConfirmList, name: 'ConfirmList', meta: {keepAlive: false}},
......
......@@ -100,6 +100,13 @@
esutils "^2.0.2"
js-tokens "^3.0.0"
"@babel/runtime@7.x":
version "7.20.13"
resolved "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.20.13.tgz#7055ab8a7cff2b8f6058bf6ae45ff84ad2aded4b"
integrity sha512-gt3PKXs0DBoL9xCvOIIZ2NEqAGZqHjAnmVbfQtB620V0uReIQutpel14KcneZuer7UioY8ALKZ7iocavvzTNFA==
dependencies:
regenerator-runtime "^0.13.11"
"@babel/runtime@^7.7.7":
version "7.14.0"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.0.tgz#46794bc20b612c5f75e62dd071e24dfd95f1cbe6"
......@@ -162,6 +169,21 @@
resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.4.tgz#15925414e0ad2cd765bfef58842f7e26a7accb24"
integrity sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug==
"@vant/icons@^1.7.1":
version "1.8.0"
resolved "https://registry.npmmirror.com/@vant/icons/-/icons-1.8.0.tgz#36b13f2e628b533f6523a93a168cf02f07056674"
integrity sha512-sKfEUo2/CkQFuERxvkuF6mGQZDKu3IQdj5rV9Fm0weJXtchDSSQ+zt8qPCNUEhh9Y8shy5PzxbvAfOOkCwlCXg==
"@vant/popperjs@^1.1.0":
version "1.3.0"
resolved "https://registry.npmmirror.com/@vant/popperjs/-/popperjs-1.3.0.tgz#e0eff017124b5b2352ef3b36a6df06277f4400f2"
integrity sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw==
"@vue/babel-helper-vue-jsx-merge-props@^1.0.0":
version "1.4.0"
resolved "https://registry.npmmirror.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz#8d53a1e21347db8edbe54d339902583176de09f2"
integrity sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA==
abbrev@1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
......@@ -7044,6 +7066,11 @@ regenerator-runtime@^0.11.0:
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==
regenerator-runtime@^0.13.11:
version "0.13.11"
resolved "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9"
integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
regenerator-runtime@^0.13.4:
version "0.13.7"
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz#cac2dacc8a1ea675feaabaeb8ae833898ae46f55"
......@@ -8450,6 +8477,17 @@ vanilla-masker@^1.2.0:
resolved "https://registry.yarnpkg.com/vanilla-masker/-/vanilla-masker-1.2.0.tgz#c2830e9d994a5fecd2261506477c2707fe589756"
integrity sha1-woMOnZlKX+zSJhUGR3wnB/5Yl1Y=
vant@^2.12.54:
version "2.12.54"
resolved "https://registry.npmmirror.com/vant/-/vant-2.12.54.tgz#0bc52d80414422987cdb9b7e7c101a66d3647d8d"
integrity sha512-t7DCiLxNosDrg0Jm5EY9p0A5cAMo5OadmizbYtPEc0ru+OJKEa3kcfxtKIK5on7ZPqoOkyYJt8e6BQ1VDMPsrg==
dependencies:
"@babel/runtime" "7.x"
"@vant/icons" "^1.7.1"
"@vant/popperjs" "^1.1.0"
"@vue/babel-helper-vue-jsx-merge-props" "^1.0.0"
vue-lazyload "1.2.3"
vary@~1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment