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>
<template>
<h-view id="financing-apply-list">
<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>
<div class="tab-style has-header">
<div :class="{ 'done': num === 1, 'undone': num !== 1 }" @click="num = 1; isRadio = false">
<img :src="num === 1 ? check1 : uncheck1" >
<span>待审批</span>
</div>
<div :class="{ 'done': num === 2, 'undone': num !== 2 }" @click="num = 2; isRadio = false">
<img :src="num === 2 ? check2 : uncheck2" >
<span>已审批</span>
</div>
</div>
<!-- 搜索 -->
<div class="search">
<input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称" >
</div>
<scroll ref="scroll" :updateData="[showLists]" :pullUp="true" @pullingUp="loadMore">
<div class="wrap">
<div v-for="(item,index) in showLists" :key="index" class="contract-lists">
<div class="pro-code" @click="goDetails(item)">
<img src="@/assets/distributorSign/fileIcon.png" alt class="file-icon" >
<p>
<span>合同号</span>
<span>{{ item.project_number }}</span>
</p>
<img v-if="item.read_check === 'N'" src="@/assets/constractSigning/unread.png" alt class="unread" >
<img v-if="item.read_check === 'Y'" src="@/assets/constractSigning/read.png" alt class="unread" >
<img src="@/assets/constractSigning/righticon.png" alt class="arrow" >
</div>
<div class="box">
<div
v-show="isRadio"
style=" flex: 0 1 50px"
class="check-box"
@click.stop="clickRadio(item)"
>
<div v-show="!item.checked"/>
<img v-show="item.checked" src="@/assets/contractCreate/selected.png" alt="已选择" >
</div>
<div
:style="{ marginLeft: !isRadio ? '50px' : '0' }"
class="text"
style="flex: 0 1 calc(100vw - 55px)"
>
<div>
<p>承租人</p>
<p>{{ item.bp_name }}</p>
</div>
<div>
<p>合同名称</p>
<p>{{ item.project_name }}</p>
</div>
<div>
<p>合同租金</p>
<p class="money">{{ item.total_price | currency }}</p>
</div>
<div>
<p>产品名称</p>
<p>{{ item.division_n }}</p>
</div>
<div>
<p>申请时间</p>
<p>{{ dateConverse(item.confirm_start_date) }}</p>
</div>
</div>
</div>
</div>
</div>
</scroll>
<div class="check-bottom">
<div v-show="isRadio" class="choose">
<div class="radio" @click="allChoose(!chooseAll)">
<img v-show="chooseAll" src="@/assets/login/radio.png" alt="radio" >
<div v-show="!chooseAll" class="no-check"/>
<span :style="{ color: chooseAll ? '#1d3fff' : 'rgb(212,214,212)' }">全选</span>
</div>
<button class="cancel" @click="cancelRadio">× 取消批量</button>
<button class="sign" @click="signContract">签订征信授权书</button>
</div>
<div v-show="num == 1 && !isRadio" class="button-box">
<div class="go-radio" @click="isRadio = true">
<img src="@/assets/login/write.png" alt="icon" >
<span>批量签署</span>
</div>
</div>
</div>
<div v-if="showLists.length === 0">
<div class="display">
<img src="@/assets/messageCenter/noMsg.png" alt >
</div>
</div>
</h-view>
</template>
<script>
import Check1 from '@/assets/constractSigning/no-done.png'
import Check2 from '@/assets/constractSigning/yes-done.png'
import unCheck1 from '@/assets/constractSigning/no-undone.png'
import unCheck2 from '@/assets/constractSigning/yes-undone.png'
export default {
data () {
return {
num: 1,
pagenum: 1,
submitPagenum: 1,
approvedPagenum: 1,
searchInput: '',
check1: Check1,
check2: Check2,
uncheck1: unCheck1,
uncheck2: unCheck2,
user_bp_type: '', // 客户类型
submitLists: [], // 待签约
approvedLists: [], // 已签约
showLists: [],
lists: [],
approvedFlag: false,
chooseAll: false,
isRadio: false,
}
},
watch: {
'num': {
handler (newVal, oldVal) {
// this.$refs.scroll.update(false)
if (newVal === 2) {
if (!this.approvedFlag) {
this.contractList()
}
this.$refs.scroll.scrollToTop()
this.showLists = this.approvedLists
} else if (newVal === 1) {
this.showLists = this.submitLists
this.$refs.scroll.scrollToTop()
}
},
},
searchInput () {
let vm = this
if (vm.timeout) {
clearTimeout(vm.timeout)
}
vm.timeout = setTimeout(() => {
vm.search()
}, 1000)
},
},
activated () {
},
created () {
},
beforeRouteEnter (to, from, next) {
next(vm => {
if (from.name === 'MyInfo' || from.name === 'MyContract') {
vm.num = 1
vm.pagenum = 1
vm.submitPagenum = 1
vm.approvedPagenum = 1
vm.searchInput = ''
vm.approvedFlag = false
vm.submitLists = []
vm.approvedLists = []
vm.user_bp_type = vm.$route.params.user_bp_type
vm.$refs.scroll.update(false)
vm.$refs.scroll.scrollToTop()
} else if (from.name === 'ContractDetail') {
if (window.localStorage.backFlag === 'true') {
vm.searchInput = ''
vm.submitPagenum = 1
vm.approvedPagenum = 1
vm.approvedFlag = false
}
}
vm.contractList()
})
},
methods: {
signContract () {
let list = this.showLists.filter(item => item.checked)
if (!list.length) return hlsPopup.showLongCenter('请选择合同')
if (list.findIndex(item => item.read_check === 'N') > -1) return hlsPopup.showLongCenter('您有授权书未阅读,请阅读后再签署')
list = list.map(item => { item.checked = false; return item })
window.localStorage.setItem('handleContact', JSON.stringify(list))
this.$router.push({ path: '/batchSign', query: { name: 'contract' } })
},
clickRadio (item) {
item.checked = !item.checked
this.chooseAll = this.showLists.every(item => item.checked)
this.$forceUpdate()
},
allChoose (status) {
this.chooseAll = status
this.showLists = this.showLists.map(item => {
item.checked = status
return item
})
},
cancelRadio () {
this.isRadio = false // 关闭多选菜单
this.allChoose(false) // 关闭全选按钮
},
dateConverse (date) {
return date.replace(/\//g, '-')
},
// 合同查询
contractList () {
let vm = this
if (vm.num === 1) {
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
// user_phone: window.localStorage.user_phone,
bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
pagesize: 10,
pagenum: vm.submitPagenum,
confirm_status: 'SUBMIT',
searchInput: vm.searchInput,
}
vm.hlsPopup.showLoading('数据加载中')
vm.hlsHttp.post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
vm.submitLists = res.lists.map(item => {
item.checked = false
return item
})
vm.showLists = vm.submitLists
if (res.lists.length > 0 && res.lists.length < 10) {
vm.$refs.scroll.update(true)
} else if (res.lists.length === 10) {
vm.$refs.scroll.update(false)
}
} else {
hlsPopup.showLongCenter(res.message)
}
})
} else if (vm.num === 2) {
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
pagesize: 10,
pagenum: vm.approvedPagenum,
searchInput: vm.searchInput,
confirm_status: 'APPROVED',
// user_phone: window.localStorage.user_phone,
bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
}
vm.hlsPopup.showLoading('数据加载中')
vm.hlsHttp.post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
console.log(res.lists)
vm.approvedLists = res.lists.map(item => {
item.checked = false
return item
})
vm.approvedFlag = true
vm.showLists = vm.approvedLists
if (res.lists.length > 0 && res.lists.length < 10) {
vm.$refs.scroll.update(true)
} else if (res.lists.length === 10) {
vm.$refs.scroll.update(false)
}
} else {
hlsPopup.showLongCenter(res.message)
}
})
}
},
loadMore () {
let vm = this
if (vm.num === 1) {
vm.submitPagenum++
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
// user_phone: window.localStorage.user_phone,
bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
pagesize: 10,
pagenum: vm.submitPagenum,
confirm_status: 'SUBMIT',
searchInput: vm.searchInput,
}
vm.hlsPopup.showLoading('请稍候')
vm.hlsHttp.post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
let returnData = []
if (res.result === 'S') {
returnData = res.lists
if (returnData.length === 0) {
vm.$refs.scroll.update(true)
} else if (returnData.length > 0 && returnData.length < 10) {
returnData.forEach((data, index, array) => {
vm.submitLists.push(array[index])
})
vm.$refs.scroll.update(true)
} else if (returnData.length === 10) {
returnData.forEach((data, index, array) => {
vm.submitLists.push(array[index])
})
vm.$refs.scroll.update(false)
}
vm.showLists = vm.submitLists
vm.allChoose(false)
} else {
hlsPopup.showLongCenter(res.message)
}
})
} else if (vm.num === 2) {
vm.approvedPagenum++
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
// user_phone: window.localStorage.user_phone,
bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
pagesize: 10,
pagenum: vm.approvedPagenum,
confirm_status: 'APPROVED',
searchInput: vm.searchInput,
}
vm.hlsPopup.showLoading('请稍候')
vm.hlsHttp.post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
let returnData = []
if (res.result === 'S') {
returnData = res.lists
if (returnData.length === 0) {
vm.$refs.scroll.update(true)
} else if (returnData.length > 0 && returnData.length < 10) {
returnData.forEach((data, index, array) => {
vm.approvedLists.push(array[index])
})
vm.$refs.scroll.update(true)
} else if (returnData.length === 10) {
returnData.forEach((data, index, array) => {
vm.approvedLists.push(array[index])
})
vm.$refs.scroll.update(false)
}
vm.showLists = vm.approvedLists
} else {
hlsPopup.showLongCenter(res.message)
}
})
}
},
async submitSearch () {
let vm = this
vm.submitPagenum = 1
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
// user_phone: window.localStorage.user_phone,
bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
pagesize: 10,
pagenum: vm.submitPagenum,
confirm_status: 'SUBMIT',
searchInput: vm.searchInput,
}
vm.hlsPopup.showLoading('请稍候')
let res = await vm.$post(url, param)
if (res.result === 'S') {
vm.hlsPopup.hideLoading()
vm.submitLists = res.lists.map(item => {
item.checked = false
return item
})
if (vm.num === 1) {
vm.showLists = vm.submitLists
}
// vm.showLists = vm.submitLists
if (res.lists.length >= 0 && res.lists.length < 10) {
vm.$refs.scroll.update(true)
} else if (res.lists.length === 10) {
vm.$refs.scroll.update(false)
}
return true
} else {
hlsPopup.showLongCenter(res.message)
return false
}
},
approvedearch () {
let vm = this
let url = $config.basePath + 'prj_confirm_list_query'
vm.approvedPagenum = 1
let param = {
// user_phone: window.localStorage.user_phone,
bp_id: JSON.parse(window.localStorage.now_user_bp_bind_id).bp_id,
pagesize: 10,
pagenum: vm.approvedPagenum,
confirm_status: 'APPROVED',
searchInput: vm.searchInput,
}
vm.hlsHttp.post(url, param).then(function (res) {
vm.approvedLists = res.lists.map(item => {
item.checked = false
return item
})
if (vm.num === 2) {
vm.showLists = vm.approvedLists
}
// vm.showLists = vm.approvedLists
if (res.lists.length >= 0 && res.lists.length < 10) {
vm.$refs.scroll.update(true)
} else if (res.lists.length === 10) {
vm.$refs.scroll.update(false)
}
})
},
async search () {
let res = await this.submitSearch()
if (res) {
this.approvedearch()
}
},
goDetails (item) {
this.$router.push({
name: 'financingApplyDetail',
params: {
item: item,
user_bp_type: this.user_bp_type,
num: this.num,
check_id: item.check_id,
},
})
},
},
}
</script>
<style lang="less" type="text/less">
#financing-apply-list {
.unread {
width: 34px;
height: 20px;
margin: 0 20px;
}
.display {
width: 100%;
height: 100%;
position: fixed;
// top: 0;
img {
width: 100%;
height: 100%;
// margin-top: -70px;
}
}
.tab-style {
display: flex;
width: 100%;
justify-content: center;
padding-top: 12px;
padding-bottom: 8px;
align-items: center;
background-color: #fff;
box-shadow: 0 2px 3px 0 rgba(220, 220, 221, 0.5);
position: absolute;
z-index: 999;
div {
position: relative;
height: 32px;
width: 172px;
border-radius: 16px;
border-radius: 16px;
font-family: PingFangSC-Semibold;
font-size: 14px;
letter-spacing: 0.43px;
margin: 0 4px;
line-height: 32px;
}
.undone {
background: rgba(220, 220, 221, 0.26);
color: #383f45;
}
.done {
background: rgba(0, 70, 156, 0.1);
color: #00469c;
}
img {
height: 20px;
display: block;
float: left;
margin: 6px 0 0 43px;
}
span {
position: absolute;
left: 70px;
}
}
.check-bottom {
width: 100%;
height: 1.2rem;
// background-color: #fff;
position: absolute;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
.button-box {
width: 100%;
height: 100%;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.go-radio {
width: 90%;
color: #fff;
background-color: #1d3fff;
padding: 8px 10px;
border-radius: 5px;
display: flex;
justify-content: center;
align-items: center;
font-size: 0.32rem;
img {
width: 16px;
margin-right: 4px;
}
}
.choose {
width: 100%;
display: flex;
background-color: #fff;
justify-content: space-evenly;
align-items: center;
height: 100%;
font-size: 0.3rem;
}
.radio {
display: flex;
align-items: center;
color: #1d3fff;
img {
width: 24px;
}
.no-check {
width: 17px;
height: 17px;
border-radius: 8.5px;
border: 1px solid #edeef1;
background-color: #fff;
margin-right: 7.1px;
}
}
.cancel {
background-color: #ffcece;
color: red;
padding: 7px 15px;
border-radius: 3px;
}
.sign {
color: #fff;
background-color: #1d3fff;
padding: 7px 30px;
border-radius: 3px;
}
}
.search {
background-color: #fff;
padding: 8px 12px;
position: absolute;
width: 100%;
z-index: 100;
margin-bottom: 8px;
margin-top: 52px;
input {
padding-left: 12px;
border-radius: 4px;
height: 36px;
width: 100%;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888c8f;
line-height: 36px;
background: url("../../assets/contractStart/search1.png") 320px no-repeat;
background-size: 16px 16px;
background-color: rgba(239, 239, 239, 0.55);
}
input::placeholder {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888c8f;
letter-spacing: 0;
}
input:focus {
background: url("../../assets/contractStart/search2.png") 320px no-repeat;
background-size: 16px 16px;
background-color: rgba(239, 239, 239, 0.55);
border: 2px solid #bcc6ff;
}
}
.wrap {
width: 100%;
padding: 8px;
.contract-lists {
width: 100%;
background: #fff;
margin-bottom: 8px;
border-radius: 2px;
.pro-code {
height: 44px;
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
.file-icon {
width: 30px;
height: 30px;
margin-left: 10px;
}
p {
height: 44px;
line-height: 44px;
margin-left: 10px;
flex: 1;
font-family: PingFangSC-Semibold;
font-size: 15px;
color: #4b4a4b;
letter-spacing: 0;
border-bottom: 1px solid #f3f3f7;
}
.arrow {
height: 16px;
width: 16px;
margin-right: 10px;
margin-left: -8px;
}
}
.box {
// margin-left: 50px;
// margin-right: 19px;
display: flex;
.check-box {
height: 100px;
display: flex;
justify-content: center;
align-items: center;
div {
width: 0.32rem;
height: 0.32rem;
border: 0.02rem solid #1d3fff;
border-radius: 0.06rem;
}
img {
width: 0.32rem;
}
}
.text {
margin-right: 19px;
div {
padding: 8px 0;
line-height: 18px;
display: flex;
justify-content: space-between;
position: relative;
.money {
font-family: Verdana-Bold;
font-size: 14px;
color: #4b4a4b;
letter-spacing: 0;
font-weight: 600;
}
p {
word-break: break-all;
word-wrap: break-word;
white-space: normal;
font-family: PingFangSC-Regular;
font-size: 14px;
letter-spacing: 0;
}
p:nth-of-type(1) {
width: 32%;
left: 0;
color: rgba(75, 74, 75, 0.6);
}
p:nth-of-type(2) {
right: 0;
color: #4b4a4b;
}
}
}
}
}
}
.content {
position: absolute;
top: 0;
}
.scrollContent {
padding-top: 3rem;
padding-bottom: 20px;
}
}
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.4rem;
padding-bottom: 1.2rem;
}
}
}
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.8rem;
padding-bottom: 1.2rem;
}
.check-bottom {
bottom: 32px;
}
}
}
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.8rem;
padding-bottom: 1.2rem;
}
.search {
input {
background: url("../../assets/contractStart/search1.png") 320px
no-repeat;
background-size: 16px 16px;
background-color: rgba(239, 239, 239, 0.55);
padding: 8px 12px;
border-radius: 4px;
width: 100%;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888c8f;
}
}
.check-bottom {
bottom: 32px;
}
}
}
}
</style>
......@@ -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;
......
<template>
<h-view id="toDoList" class="public-style" title="待办审批">
<h-header :proportion="[5, 1, 1]" class="bar-custom">
<div slot="left" class="h-header-btn" @click="$routeGo()" >
<div slot="left" class="h-header-btn" @click="$routeGo()">
<img src="@/assets/userBind/arrow.png">
<span>待办审批</span>
</div>
......@@ -9,131 +9,64 @@
<div class="wrap has-header">
<div class="tab">
<p>
<span
:class="{ selected: selected === 'todo' }"
@click="isSelected('todo')"
><img
v-if="selected === 'todo'"
src="@/assets/functionCenter/todo-check.png"
><img
v-if="selected === 'done'"
src="@/assets/functionCenter/todo.png"
>待办</span
>
<span :class="{ selected: selected === 'todo' }" @click="isSelected('todo')"><img v-if="selected === 'todo'"
src="@/assets/functionCenter/todo-check.png"><img v-if="selected === 'done'"
src="@/assets/functionCenter/todo.png">待办</span>
</p>
<p>
<span
:class="{ selected: selected === 'done' }"
@click="isSelected('done')"
><img
v-if="selected === 'done'"
src="@/assets/functionCenter/done-check.png"
><img
v-if="selected === 'todo'"
src="@/assets/functionCenter/done.png"
>已办</span
>
<span :class="{ selected: selected === 'done' }" @click="isSelected('done')"><img v-if="selected === 'done'"
src="@/assets/functionCenter/done-check.png"><img v-if="selected === 'todo'"
src="@/assets/functionCenter/done.png">已办</span>
</p>
</div>
<div class="search">
<input
v-model="searchInput"
type="text"
placeholder="请输入用户名称"
@input="searchList()"
>
<input v-model="searchInput" type="text" placeholder="请输入用户名称" @input="searchList()">
</div>
</div>
<div
v-if="
<div v-if="
(todoList.length === 0 && selected === 'todo') ||
(doneList.length === 0 && selected === 'done')
"
>
">
<div class="display">
<img src="@/assets/messageCenter/noMsg.png" alt="" >
<img src="@/assets/messageCenter/noMsg.png" alt="">
</div>
</div>
<scroll
v-if="selected === 'todo' && todoList.length > 0"
ref="scroll"
:updateData="todoList"
:pullUp="true"
:autoUpdate="true"
:listenScroll="true"
class="scroll-content"
@pullingUp="loadMore()"
>
<scroll v-if="selected === 'todo' && todoList.length > 0" ref="scroll" :updateData="todoList" :pullUp="true"
:autoUpdate="true" :listenScroll="true" class="scroll-content" @pullingUp="loadMore()">
<div class="pay-content">
<div
v-for="(item, index) in todoList"
:key="index"
class="contract-item"
>
<div v-for="(item, index) in todoList" :key="index" class="contract-item">
<div class="header">
<img src="@/assets/contractRepayment/contract.png" alt="" >
<h2>客户准入审批</h2>
<img src="@/assets/contractRepayment/contract.png" alt="">
<h2>{{ item.workflow_desc }}</h2>
<p>
<img
src="@/assets/functionCenter/in@2x.png"
alt=""
@click="
approvalInfo(
item.document_id,
item.document_name,
item.record_id,
'todo',
item.bp_class
)
"
>
<img src="@/assets/functionCenter/in@2x.png" alt="" @click="approvalInfo(item, 'todo')
">
</p>
</div>
<div class="center">
<h2>客户名称</h2>
<p>{{ item.document_name }}</p>
<p><span class="flow-title">详情:</span>{{ item.document_info }}</p>
<p><span class="flow-title">创建日期:</span>{{ item.creation_date_format }}</p>
</div>
</div>
</div>
</scroll>
<scroll
v-if="selected === 'done' && doneList.length > 0"
ref="scroll"
:updateData="doneList"
:pullUp="true"
:autoUpdate="true"
:listenScroll="true"
@pullingUp="loadMore()"
>
<scroll v-if="selected === 'done' && doneList.length > 0" ref="scroll" :updateData="doneList" :pullUp="true"
:autoUpdate="true" :listenScroll="true" @pullingUp="loadMore()">
<div class="pay-content">
<div
v-for="(item, index) in doneList"
:key="index"
class="contract-item"
>
<div v-for="(item, index) in doneList" :key="index" class="contract-item">
<div class="header">
<img src="@/assets/contractRepayment/contract.png" alt="" >
<h2>客户准入审批</h2>
<img src="@/assets/contractRepayment/contract.png" alt="">
<h2>{{ item.workflow_desc }}</h2>
<p>
<img
src="@/assets/functionCenter/in@2x.png"
alt=""
@click="
approvalInfo(
item.document_id,
item.document_name,
item.record_id,
'done',
item.bp_class
)
"
>
<img src="@/assets/functionCenter/in@2x.png" alt="" @click="approvalInfo(item, 'done')
">
</p>
</div>
<div class="center">
<h2>客户名称</h2>
<p>{{ item.document_name }}</p>
<p><span class="flow-title">详情:</span>{{ item.document_info }}</p>
<p><span class="flow-title">创建日期:</span>{{ item.creation_date_format }}</p>
</div>
</div>
</div>
......@@ -145,7 +78,7 @@ import noImg from '../../assets/productQuery/none.png'
export default {
name: 'ToDoList',
data () {
data() {
return {
selected: 'todo',
searchInput: '',
......@@ -161,16 +94,16 @@ export default {
// this.getTodoList()
// this.getDoneList()
// },
activated () {
activated() {
this.getTodoList()
this.getDoneList()
},
methods: {
// tab切换
isSelected (name) {
isSelected(name) {
this.selected = name
},
searchList () {
searchList() {
if (this.mysetTimeout !== null) {
clearTimeout(this.mysetTimeout)
this.mysetTimeout = setTimeout(() => {
......@@ -182,7 +115,7 @@ export default {
}, 1000)
}
},
getTodoList () {
getTodoList() {
this.pageNum = 1
this.todoList = []
let param = {
......@@ -207,7 +140,7 @@ export default {
}
})
},
getDoneList () {
getDoneList() {
this.pageNum_1 = 1
this.doneList = []
let param = {
......@@ -232,7 +165,7 @@ export default {
}
})
},
loadMore () {
loadMore() {
let url
let param
if (this.selected === 'todo') {
......@@ -267,7 +200,7 @@ export default {
} else if (returnData.length > 0 && returnData.length < 10) {
this.$refs.scroll.update(true)
} else if (returnData.length === 10) {
this.$refs.scroll.update(true)
// this.$refs.scroll.update(true)
}
this.showLists = returnData
if (this.selected === 'todo') {
......@@ -284,44 +217,53 @@ export default {
}
})
},
approvalInfo (document_id, document_name, record_id, type, bpclass) {
approvalInfo(flow, type) {
let handler = {
"PRJ_CREATE_REQ_WFL": 'financingApplyDetail' //融租申请工作流
}
let routerName = handler[flow.workflow_code]
if (routerName) {
this.$router.push({
name: 'approvalInfo',
params: {
document_id: document_id,
document_name: document_name,
record_id: record_id,
type: type,
bpclass: bpclass,
},
name: routerName, params: { type: type, ...flow }
})
} else {
hlsPopup.showLongCenter('当前app不支持审批工作流')
}
},
},
}
</script>
<style lang='less' scoped>
@import "../../styles/vue-1px";
.display {
position: fixed;
top: 0;
img {
width: 100%;
height: 100%;
}
}
#toDoList {
.scroll-content {
top: 100px;
}
.wrap {
width: 100%;
position: absolute;
z-index: 100;
}
.tab {
display: flex;
background-color: #fff;
padding: 6px 8px 4px 6px;
img {
vertical-align: middle;
width: 15px;
......@@ -330,6 +272,7 @@ export default {
position: relative;
top: -2px;
}
p {
text-align: center;
flex: auto;
......@@ -352,10 +295,12 @@ export default {
}
}
}
.search {
background-color: #fff;
padding: 8px 12px;
position: relative;
input {
background: url("../../assets/contractStart/search1.png") 320px no-repeat;
background-size: 16px 16px;
......@@ -384,19 +329,26 @@ export default {
border: 2px solid #bcc6ff;
}
}
.pay-content {
padding: 8px 8px;
.contract-item+.contract-item {
margin-top: .5rem;
}
.contract-item {
background-color: #fff;
margin-bottom: 8px;
.header {
position: relative;
height: 44px;
p img{
p img {
width: 22px;
height: 22px;
}
img {
position: absolute;
width: 30px;
......@@ -404,6 +356,7 @@ export default {
left: 10px;
top: 8px;
}
h2 {
position: absolute;
top: 14px;
......@@ -414,12 +367,14 @@ export default {
letter-spacing: 0;
margin: 0px;
}
p {
img {
position: relative;
top: 0;
left: 0;
}
position: absolute;
right: 10px;
top: 8px;
......@@ -436,37 +391,29 @@ export default {
.center {
position: relative;
height: 44px;
background: rgba(239, 239, 239, 0.55);
h2 {
position: absolute;
top: 13px;
left: 15px;
font-size: 14px;
color: #4b4a4b;
letter-spacing: 0;
margin: 0px;
}
background: #fff;
p {
position: absolute;
right: 20px;
top: 13px;
// width: 57px;
padding: 2px 4px;
// height: 21px;
// line-height: 19px;
text-align: center;
display: flex;
justify-content: space-between;
padding: .3rem;
border-radius: 2px;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #4b4a4b;
.flow-title {
min-width: 50px;
}
}
}
}
}
.content {
background-color: #efefef;
}
.top-wrap {
width: 100%;
height: 100px;
......@@ -518,9 +465,11 @@ export default {
flex-direction: column;
justify-content: space-around;
align-items: center;
img {
margin: 0;
}
div {
margin-bottom: 14px;
ont-family: PingFangSC-Regular;
......@@ -542,18 +491,22 @@ export default {
.hls-swipe {
width: 100vw;
img {
width: 100vw;
// height: 100%;
}
.hls-swipe-indicators {
left: 54%;
bottom: 20px;
.hls-swipe-indicators-item {
width: 10px;
height: 2px;
border-radius: 0;
}
.hls-swipe-indicators-item--active {
background-color: #fff;
}
......@@ -566,6 +519,7 @@ export default {
display: flex;
flex-direction: row;
padding: 0 1% 0 1%;
.left-pic {
width: 41.6%;
margin-left: 4px;
......@@ -604,35 +558,43 @@ export default {
letter-spacing: 0.57px;
height: 40px;
padding-left: 2%;
span {
padding-top: 2px;
margin-left: 4px;
}
img {
width: 14px;
height: 14px;
}
}
.guessing-wrap {
position: relative;
width: 96%;
margin: 0 auto;
.hls-list-item {
border-radius: 10px;
.contents {
padding: 8px 6px 8px 0;
.add-content {
justify-content: flex-start;
}
}
}
}
.item-pic {
width: 110px;
height: 110px;
display: flex;
justify-content: center;
align-items: center;
img {
width: 100%;
// height: 100%;
......@@ -648,15 +610,18 @@ export default {
margin-top: 10px;
font-weight: 600;
}
.hot {
position: absolute;
top: 0;
right: 0;
width: 45px;
}
.center {
margin-top: 6px;
display: flex;
.firsts {
width: 76px;
font-family: PingFangSC-Regular;
......@@ -678,3 +643,9 @@ export default {
}
}
</style>
<style>
#toDoList .scrollContent {
padding-top: 61px !important;
}
</style>
......@@ -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