e
3 years ago
parent
5f64757dab
commit
3258ccaf6d
30 changed files with 3308 additions and 932 deletions
@ -0,0 +1,738 @@ |
||||
@charset "UTF-8"; |
||||
/* 公共样式文件 */ |
||||
.bgw { |
||||
background: #fff; |
||||
} |
||||
|
||||
.bg-yellow { |
||||
background: #FFA56A; |
||||
} |
||||
|
||||
.bg-refuse { |
||||
background: #FF9784; |
||||
} |
||||
|
||||
.bg-green { |
||||
background: #46C435; |
||||
} |
||||
|
||||
.c-white { |
||||
color: #fff; |
||||
} |
||||
|
||||
.c-black { |
||||
color: #666666; |
||||
} |
||||
|
||||
.c-gray { |
||||
color: #cccccc; |
||||
} |
||||
|
||||
.c-blue { |
||||
color: #52b1ff !important; |
||||
} |
||||
|
||||
.c-red { |
||||
color: #ff8738; |
||||
} |
||||
|
||||
.c-yellow { |
||||
color: #FFC76E; |
||||
} |
||||
|
||||
.c-green { |
||||
color: #46C435; |
||||
} |
||||
|
||||
.c-refuse { |
||||
color: #FF9784; |
||||
} |
||||
|
||||
.font-blue { |
||||
color: #00b9ff; |
||||
} |
||||
|
||||
.bgred { |
||||
background: #ff8738; |
||||
} |
||||
|
||||
.container_bg { |
||||
width: 86%; |
||||
margin: auto; |
||||
} |
||||
|
||||
.text-color { |
||||
color: #9b9b9b; |
||||
} |
||||
|
||||
.cursor { |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.wd100 { |
||||
width: 100% !important; |
||||
} |
||||
|
||||
.wd95 { |
||||
width: 95%; |
||||
} |
||||
|
||||
.wd90 { |
||||
width: 90%; |
||||
} |
||||
|
||||
.wd80 { |
||||
width: 80%; |
||||
} |
||||
|
||||
.wd85 { |
||||
width: 85%; |
||||
} |
||||
|
||||
.wd70 { |
||||
width: 70% !important; |
||||
} |
||||
|
||||
.wd60 { |
||||
width: 60%; |
||||
} |
||||
|
||||
.wd50 { |
||||
width: 50%; |
||||
} |
||||
|
||||
.wd48 { |
||||
width: 48%; |
||||
} |
||||
|
||||
.wd45 { |
||||
width: 45%; |
||||
} |
||||
|
||||
.wd40 { |
||||
width: 40%; |
||||
} |
||||
|
||||
.wd30 { |
||||
width: 30%; |
||||
} |
||||
|
||||
.wd35 { |
||||
width: 35%; |
||||
} |
||||
|
||||
.wd23 { |
||||
width: 23%; |
||||
} |
||||
|
||||
.wd25 { |
||||
width: 25%; |
||||
} |
||||
|
||||
.wd20 { |
||||
width: 20%; |
||||
} |
||||
|
||||
.wd15 { |
||||
width: 15%; |
||||
} |
||||
|
||||
.wd10 { |
||||
width: 10%; |
||||
} |
||||
|
||||
.wd5 { |
||||
width: 5%; |
||||
} |
||||
|
||||
.wd0 { |
||||
width: 0; |
||||
} |
||||
|
||||
.ht100 { |
||||
height: 100%; |
||||
} |
||||
|
||||
.ht40 { |
||||
height: 35px !important; |
||||
} |
||||
|
||||
.ht50 { |
||||
height: 50px; |
||||
} |
||||
|
||||
.pd0 { |
||||
padding: 0 !important; |
||||
} |
||||
|
||||
.pdlr20 { |
||||
padding-left: 10px; |
||||
padding-right: 10px; |
||||
} |
||||
|
||||
.pdl0 { |
||||
padding-left: 0; |
||||
} |
||||
|
||||
.pdl10 { |
||||
padding-left: 10px !important; |
||||
} |
||||
|
||||
.pdl15 { |
||||
padding-left: 15px !important; |
||||
} |
||||
|
||||
.pdl20 { |
||||
padding-left: 20px !important; |
||||
} |
||||
|
||||
.pdl30 { |
||||
padding-left: 30px !important; |
||||
} |
||||
|
||||
.pdr0 { |
||||
padding-right: 0; |
||||
} |
||||
|
||||
.pdr10 { |
||||
padding-right: 10px !important; |
||||
} |
||||
|
||||
.pdr15 { |
||||
padding-right: 15px !important; |
||||
} |
||||
|
||||
.pdr20 { |
||||
padding-right: 20px !important; |
||||
} |
||||
|
||||
.pdr30 { |
||||
padding-right: 30px !important; |
||||
} |
||||
|
||||
.pdt20 { |
||||
padding-top: 20px; |
||||
} |
||||
|
||||
.pdt30 { |
||||
padding-top: 30px; |
||||
} |
||||
|
||||
.pdt40 { |
||||
padding-top: 40px; |
||||
} |
||||
|
||||
.pdt50 { |
||||
padding-top: 50px; |
||||
} |
||||
|
||||
.pdt60 { |
||||
padding-top: 60px; |
||||
} |
||||
|
||||
.pdb30 { |
||||
padding-bottom: 30px; |
||||
} |
||||
|
||||
.pdb40 { |
||||
padding-bottom: 40px; |
||||
} |
||||
|
||||
.pdb20 { |
||||
padding-bottom: 20px; |
||||
} |
||||
|
||||
.pdb10 { |
||||
padding-bottom: 10px; |
||||
} |
||||
|
||||
.pdt10 { |
||||
padding-top: 10px !important; |
||||
} |
||||
|
||||
.pdtb10 { |
||||
padding-top: 10px; |
||||
padding-bottom: 10px; |
||||
} |
||||
|
||||
.pdtb20 { |
||||
padding-top: 20px; |
||||
padding-bottom: 20px; |
||||
} |
||||
|
||||
.pdtb30 { |
||||
padding-top: 30px; |
||||
padding-bottom: 30px; |
||||
} |
||||
|
||||
.pdtb40 { |
||||
padding-top: 40px; |
||||
padding-bottom: 40px; |
||||
} |
||||
|
||||
.pdtb50 { |
||||
padding-top: 50px; |
||||
padding-bottom: 50px; |
||||
} |
||||
|
||||
.border-b { |
||||
border-bottom: 2px solid #f2f2f2; |
||||
} |
||||
|
||||
.border-t { |
||||
border-top: 2px solid #f2f2f2; |
||||
} |
||||
|
||||
.mga { |
||||
margin: auto; |
||||
} |
||||
|
||||
.mg20 { |
||||
margin: 20px; |
||||
} |
||||
|
||||
.mgtb0 { |
||||
margin-top: 0; |
||||
margin-bottom: 0; |
||||
} |
||||
|
||||
.mgtb10 { |
||||
margin: 10px 0; |
||||
} |
||||
|
||||
.mgtb20 { |
||||
margin: 20px 0; |
||||
} |
||||
|
||||
.mgtb30 { |
||||
margin: 30px 0; |
||||
} |
||||
|
||||
.mgtb40 { |
||||
margin: 40px 0; |
||||
} |
||||
|
||||
.mgtb50 { |
||||
margin: 50px 0; |
||||
} |
||||
|
||||
.mglr0 { |
||||
margin-left: 0; |
||||
margin-right: 0; |
||||
} |
||||
|
||||
.mglr10 { |
||||
margin-left: 10px; |
||||
margin-right: 10px; |
||||
} |
||||
|
||||
.mglr20 { |
||||
margin-left: 20px; |
||||
margin-right: 20px; |
||||
} |
||||
|
||||
.mglr30 { |
||||
margin-left: 30px; |
||||
margin-right: 30px; |
||||
} |
||||
|
||||
.mglr40 { |
||||
margin-left: 40px; |
||||
margin-right: 40px; |
||||
} |
||||
|
||||
.mglr50 { |
||||
margin-left: 50px; |
||||
margin-right: 50px; |
||||
} |
||||
|
||||
.mgl0 { |
||||
margin-left: 0 !important; |
||||
} |
||||
|
||||
.mgl10 { |
||||
margin-left: 10px; |
||||
} |
||||
|
||||
.mgl20 { |
||||
margin-left: 20px; |
||||
} |
||||
|
||||
.mgl25 { |
||||
margin-left: 25px; |
||||
} |
||||
|
||||
.mgl30 { |
||||
margin-left: 30px; |
||||
} |
||||
|
||||
.mgl35 { |
||||
margin-left: 35px; |
||||
} |
||||
|
||||
.mgl40 { |
||||
margin-left: 40px; |
||||
} |
||||
|
||||
.mgl50 { |
||||
margin-left: 50px; |
||||
} |
||||
|
||||
.mgl80 { |
||||
margin-left: 80px; |
||||
} |
||||
|
||||
.mgl90 { |
||||
margin-left: 90px; |
||||
} |
||||
|
||||
.mgl100 { |
||||
margin-left: 100px; |
||||
} |
||||
|
||||
.mgr10 { |
||||
margin-right: 10px; |
||||
} |
||||
|
||||
.mgr20 { |
||||
margin-right: 20px; |
||||
} |
||||
|
||||
.mgr30 { |
||||
margin-right: 30px; |
||||
} |
||||
|
||||
.mgr33 { |
||||
margin-right: 33px; |
||||
} |
||||
|
||||
.mgr35 { |
||||
margin-right: 35px; |
||||
} |
||||
|
||||
.mgt34 { |
||||
margin-top: 34px; |
||||
} |
||||
|
||||
.mgr40 { |
||||
margin-right: 40px; |
||||
} |
||||
|
||||
.mgr50 { |
||||
margin-right: 50px; |
||||
} |
||||
|
||||
.mgr60 { |
||||
margin-right: 60px; |
||||
} |
||||
|
||||
.mgr70 { |
||||
margin-right: 70px; |
||||
} |
||||
|
||||
.mgr80 { |
||||
margin-right: 80px; |
||||
} |
||||
|
||||
.mgr90 { |
||||
margin-right: 90px; |
||||
} |
||||
|
||||
.mgr100 { |
||||
margin-right: 100px; |
||||
} |
||||
|
||||
.mgt10 { |
||||
margin-top: 10px; |
||||
} |
||||
|
||||
.mgt15 { |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
.mgt20 { |
||||
margin-top: 20px !important; |
||||
} |
||||
|
||||
.mgt30 { |
||||
margin-top: 30px !important; |
||||
} |
||||
|
||||
.mgt40 { |
||||
margin-top: 40px !important; |
||||
} |
||||
|
||||
.mgt50 { |
||||
margin-top: 50px !important; |
||||
} |
||||
|
||||
.mgt60 { |
||||
margin-top: 60px !important; |
||||
} |
||||
|
||||
.mgt70 { |
||||
margin-top: 70px !important; |
||||
} |
||||
|
||||
.mgt80 { |
||||
margin-top: 80px !important; |
||||
} |
||||
|
||||
.mgt90 { |
||||
margin-top: 90px !important; |
||||
} |
||||
|
||||
.mgt100 { |
||||
margin-top: 100px; |
||||
} |
||||
|
||||
.mrb30 { |
||||
margin-bottom: 30px; |
||||
} |
||||
|
||||
.mg0 { |
||||
margin: 0; |
||||
} |
||||
|
||||
.mgb0 { |
||||
margin-bottom: 0; |
||||
} |
||||
|
||||
.mgb10 { |
||||
margin-bottom: 10px; |
||||
} |
||||
|
||||
.mgb20 { |
||||
margin-bottom: 20px; |
||||
} |
||||
|
||||
.mgb30 { |
||||
margin-bottom: 30px; |
||||
} |
||||
|
||||
.mgb40 { |
||||
margin-bottom: 40px !important; |
||||
} |
||||
|
||||
.mgb50 { |
||||
margin-bottom: 50px !important; |
||||
} |
||||
|
||||
.mgb60 { |
||||
margin-bottom: 60px !important; |
||||
} |
||||
|
||||
.mgb70 { |
||||
margin-bottom: 70px !important; |
||||
} |
||||
|
||||
.mgb80 { |
||||
margin-bottom: 80px !important; |
||||
} |
||||
|
||||
.bd0 { |
||||
border: 0; |
||||
} |
||||
|
||||
.tx-center { |
||||
text-align: center; |
||||
} |
||||
|
||||
.fz-14 { |
||||
font-size: 14px !important; |
||||
} |
||||
|
||||
.fz-16 { |
||||
font-size: 16px !important; |
||||
} |
||||
|
||||
.fz-18 { |
||||
font-size: 18px !important; |
||||
} |
||||
|
||||
.fz-20 { |
||||
font-size: 20px !important; |
||||
} |
||||
|
||||
.df { |
||||
display: flex; |
||||
} |
||||
|
||||
.df-ac { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
|
||||
.dn { |
||||
display: none !important; |
||||
} |
||||
|
||||
.flex-align-center { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
|
||||
.flex-wrap { |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.fj-center { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.fj-end { |
||||
justify-content: flex-end; |
||||
} |
||||
|
||||
.flex1 { |
||||
flex: 1; |
||||
} |
||||
|
||||
.df-between { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
} |
||||
|
||||
.df-jc { |
||||
justify-content: center; |
||||
} |
||||
|
||||
.not-zoom { |
||||
display: flex; |
||||
flex-shrink: 0; |
||||
} |
||||
|
||||
.btns { |
||||
position: absolute; |
||||
bottom: 20px; |
||||
left: 50%; |
||||
transform: translate(-50%, 0); |
||||
} |
||||
|
||||
.self { |
||||
position: relative; |
||||
} |
||||
|
||||
.position-a { |
||||
position: absolute; |
||||
} |
||||
|
||||
.dib { |
||||
display: inline-block; |
||||
font-size: 16px; |
||||
} |
||||
|
||||
.df-column { |
||||
display: flex; |
||||
flex-direction: column; |
||||
} |
||||
|
||||
.icon-size { |
||||
width: 20px; |
||||
} |
||||
|
||||
.manpower-icon { |
||||
width: 35px; |
||||
height: 35px; |
||||
} |
||||
|
||||
.radius10 { |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.radius-round { |
||||
border-radius: 50%; |
||||
} |
||||
|
||||
.shadow { |
||||
border: 1px solid #EBEEF5; |
||||
transition: .3s; |
||||
} |
||||
|
||||
.shadow:hover { |
||||
box-shadow: 0 0.125rem 0.75rem 0 rgba(0, 0, 0, 0.1); |
||||
} |
||||
|
||||
.head-icon { |
||||
width: 100px; |
||||
height: 100px; |
||||
border-radius: 50%; |
||||
} |
||||
|
||||
.black-all { |
||||
background: black; |
||||
opacity: 0.5; |
||||
width: 100%; |
||||
height: 100%; |
||||
position: absolute; |
||||
top: 0; |
||||
left: 0; |
||||
} |
||||
|
||||
.display-none { |
||||
display: none; |
||||
} |
||||
|
||||
.left-border { |
||||
border-left: 10px solid #00b9ff; |
||||
line-height: 27px; |
||||
} |
||||
|
||||
.icon { |
||||
width: 1.5em; |
||||
height: 1.5em; |
||||
vertical-align: -0.15em; |
||||
fill: currentColor; |
||||
overflow: hidden; |
||||
} |
||||
|
||||
.text-icon { |
||||
width: 16px; |
||||
height: 16px; |
||||
vertical-align: -0.15em; |
||||
fill: currentColor; |
||||
overflow: hidden; |
||||
} |
||||
|
||||
.box-sizing { |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.white-btn { |
||||
border: 1px solid #00b9ff; |
||||
} |
||||
|
||||
.btn-wh { |
||||
width: 120px; |
||||
height: 35px; |
||||
} |
||||
|
||||
.top-module-icon { |
||||
width: 26px; |
||||
height: 26px; |
||||
} |
||||
|
||||
.btn-pdt { |
||||
padding-top: 0 !important; |
||||
padding-bottom: 0 !important; |
||||
} |
||||
|
||||
.search-box { |
||||
height: 60px; |
||||
} |
||||
|
||||
.delete { |
||||
text-align: center; |
||||
} |
||||
|
||||
.delete img { |
||||
width: 140px; |
||||
height: 188px; |
||||
} |
||||
|
||||
.nowrap { |
||||
white-space: nowrap; |
||||
} |
||||
File diff suppressed because one or more lines are too long
@ -1,736 +0,0 @@ |
||||
<template> |
||||
<div> |
||||
<div v-show="loanStatus == 1"> |
||||
<div class="mgt20 left-border fz-16"><p class="c-black mgl10">保后管理</p></div> |
||||
<div class="mgt20 pdb20"> |
||||
<div class="flex-between mgtb20"> |
||||
<div class="flex-center"> |
||||
<p class="fz-16 mgr10 font-blue mgl20">状态</p> |
||||
<el-select v-model="paymentStatus" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in logTypeList" :key="item.id" :label="item.label" :value="item.id"></el-option> |
||||
</el-select> |
||||
</div> |
||||
|
||||
<div class="flex-center"> |
||||
<el-input |
||||
placeholder="搜索业务编号/客户名称" |
||||
class="mgr20" |
||||
v-model="keyword" |
||||
clearable |
||||
></el-input> |
||||
<el-button v-preventReClick type="primary" size="small" round @click="search">查询</el-button> |
||||
<el-button v-preventReClick type="primary" plain size="small" round icon="el-icon-upload2" @click="insExport">导出</el-button> |
||||
</div> |
||||
</div> |
||||
<div class="shadow radius10 pdt20"> |
||||
<div class="flex-between mab20 mgl10"> |
||||
<div class="flex-center"> |
||||
<p class="hr_tag"></p> |
||||
<span class="hr_text">担保列表</span> |
||||
</div> |
||||
</div> |
||||
|
||||
<el-table :data="insuranceData" stripe header-align="center" class="mat20" @selection-change="insSelectionChange" :row-key="getRowKeys" :key="1"> |
||||
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
||||
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column> |
||||
<el-table-column prop="businessCode" label="业务编号" align="center"></el-table-column> |
||||
<el-table-column prop="customerName" label="客户名称" align="center"></el-table-column> |
||||
<el-table-column prop="phone" label="联系电话" align="center"></el-table-column> |
||||
<el-table-column prop="businessType" label="业务类型" align="center"></el-table-column> |
||||
<el-table-column prop="guaranteeAmount" label="担保额度(元)" align="center"></el-table-column> |
||||
<el-table-column prop="guaranteeTime" label="担保期限" align="center"></el-table-column> |
||||
<el-table-column prop="applyTime" label="申请日期" align="center"></el-table-column> |
||||
<el-table-column prop="repaymentAmount" label="还款额度(元)" align="center"></el-table-column> |
||||
<el-table-column prop="remainAmount" label="剩余额度(元)" align="center"></el-table-column> |
||||
<el-table-column prop="repaymentTime" label="还款期数" align="center"></el-table-column> |
||||
<el-table-column prop="department" label="所属部门" align="center"></el-table-column> |
||||
<el-table-column prop="paymentStatus" label="还款状态" align="center"></el-table-column> |
||||
<el-table-column label="操作" width="200" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('办理结项') && scope.row.paymentStatus == '已还清'" type="text" @click="conclusion(scope.row)">办理结项</el-button> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('还款录入') && scope.row.paymentStatus != '已结项'" type="text" @click="edit(scope.row)">还款录入</el-button> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('保后还款记录')" type="text" @click="history(scope.row)">还款记录</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
|
||||
<div class="pagination"> |
||||
<el-pagination background @current-change="currentChange" layout="total, prev, pager, next" :current-page="pageNo" :total="totals"> |
||||
</el-pagination> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<!-- 还款表单提交 --> |
||||
<div v-show="loanStatus == 2"> |
||||
<el-row :gutter="10"> |
||||
<el-col :span="24"> |
||||
<el-card shadow="hover" class="mgb20 mat20"> |
||||
<div> |
||||
<div class="mgb20 left-border fz-16"><p class="c-black mgl10">担保信息</p></div> |
||||
<div> |
||||
<el-form label-width="100px" class="flex-start-around"> |
||||
<el-col :span="12" style="margin-right: 120px;"> |
||||
<el-form-item label="业务编号:"> |
||||
<span>{{guaranteeForm.businessCode}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="业务类别:"> |
||||
<span>{{guaranteeForm.businessType}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="担保额度(元):"> |
||||
<span>{{guaranteeForm.guaranteeAmount}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="贷款银行:"> |
||||
<span>{{guaranteeForm.bank}}</span> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="12" style="margin-left: 120px;"> |
||||
<el-form-item label="客户名称:"> |
||||
<span>{{guaranteeForm.customerName}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="担保期限:"> |
||||
<span>{{guaranteeForm.guaranteeTime}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="贷款用途:"> |
||||
<span>{{guaranteeForm.amountWide}}</span> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-form> |
||||
</div> |
||||
</div> |
||||
</el-card> |
||||
</el-col> |
||||
|
||||
<el-col :span="24"> |
||||
<el-card shadow="hover" class="mgb20 mat20"> |
||||
<div> |
||||
<div class="mgb20 left-border fz-16"><p class="c-black mgl10">还款信息</p></div> |
||||
<div> |
||||
<el-form :model="repaymentForm" :rules="rules" ref="repaymentForm" label-width="120px" class="flex-start-around" :disabled="this.loanbackStatus == '查看'"> |
||||
<el-col :span="12" style="margin-right: 120px;"> |
||||
<el-form-item label="应还款日" prop="repaymentDate" class="date"> |
||||
<el-date-picker v-model="repaymentForm.repaymentDate" placeholder="请选择应还款日" |
||||
type="date" style="width: 100%;" value-format="yyyy-MM-dd" @change="overdueChange"></el-date-picker> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="逾期天数"> |
||||
<el-input disabled v-model="overdueDays" placeholder="请输入逾期天数"></el-input> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="本次还款(元)" prop="currentRepayment"> |
||||
<el-input v-model="repaymentForm.currentRepayment" placeholder="请输入本次还款金额" |
||||
type="text" oninput="value=value.replace(/[^\d.]/g,'')"></el-input> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="其他费用(元)"> |
||||
<el-input v-model="repaymentForm.otherExpenses" placeholder="请输入其他费用" |
||||
type="text" oninput="value=value.replace(/[^\d.]/g,'')"></el-input> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="还款备注"> |
||||
<el-input v-model="repaymentForm.repaymentNotes" type="textarea" :autosize="{ minRows: 4 }" placeholder="请输入还款备注"></el-input> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="12" style="margin-left: 120px;"> |
||||
<el-form-item label="实际还款日" class="date"> |
||||
<!-- <el-date-picker v-model="repaymentForm.actualRepaymentDate" placeholder="请选择实际还款日" |
||||
type="date" style="width: 100%;" value-format="yyyy-MM-dd"></el-date-picker> --> |
||||
<el-date-picker v-model="repaymentForm.actualRepaymentDate" type="date" style="width: 100%;" placeholder="请选择实际还款日" |
||||
:picker-options="endTimeOptions" @focus="clickEndTime" format="yyyy-MM-dd" value-format="yyyy-MM-dd"></el-date-picker> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="还款总额(元)"> |
||||
<el-input disabled v-model="totalRepayment" placeholder="还款总额" maxlength="10"></el-input> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="利息(元)" prop="interest"> |
||||
<el-input v-model="repaymentForm.interest" placeholder="请输入利息" |
||||
type="text" oninput="value=value.replace(/[^\d.]/g,'')"></el-input> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="减免金额(元)"> |
||||
<el-input v-model="repaymentForm.deductionAmount" placeholder="请输入减免金额"></el-input> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-form> |
||||
</div> |
||||
</div> |
||||
</el-card> |
||||
</el-col> |
||||
</el-row> |
||||
<div class="mab20 flex-start-around" v-if="this.loanbackStatus != '查看'"> |
||||
<el-button v-preventReClick type="primary" round class="mag" @click="saveAdd('repaymentForm')">提交</el-button> |
||||
<el-button type="primary" plain round class="mag" @click="cancel">取消</el-button> |
||||
</div> |
||||
</div> |
||||
<!-- 还款记录 --> |
||||
<div v-show="loanStatus == 3"> |
||||
<el-row :gutter="10"> |
||||
<el-col :span="24"> |
||||
<el-card shadow="hover" class="mgb20 mat20"> |
||||
<div> |
||||
<div class="mgb20 left-border fz-16"><p class="c-black mgl10">还款信息</p></div> |
||||
<div> |
||||
<el-form label-width="100px" class="flex-start-around"> |
||||
<el-col :span="8"> |
||||
<el-form-item label="还款期数:"> |
||||
<span>{{StatisticsData.repaymentSum}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="逾期额度(元):"> |
||||
<span>{{StatisticsData.currentSum}}</span> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="8"> |
||||
<el-form-item label="逾期期数:"> |
||||
<span>{{StatisticsData.overdueSum}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="还款额度(元):"> |
||||
<span>{{StatisticsData.alreadyPaymentSum}}</span> |
||||
</el-form-item> |
||||
</el-col> |
||||
|
||||
<el-col :span="8"> |
||||
<el-form-item label="逾期利息(元):"> |
||||
<span>{{StatisticsData.overdueInterest}}</span> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="剩余额度(元):"> |
||||
<span>{{StatisticsData.remainSum}}</span> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-form> |
||||
</div> |
||||
</div> |
||||
</el-card> |
||||
</el-col> |
||||
</el-row> |
||||
|
||||
<div class="mgt20 pdb20"> |
||||
<div class="flex-between search-box"> |
||||
<div class="flex-center"> |
||||
<div class="df-ac"> |
||||
<p class="fz-16 mgr10 font-blue mgl20">应还款日</p> |
||||
<div class="date"> |
||||
<el-date-picker v-model="hisSearchForm.actualRepaymentDate" |
||||
placeholder="请选择日期" |
||||
unlink-panels align="right" type="date" value-format="yyyy-MM-dd" clearable></el-date-picker> |
||||
</div> |
||||
</div> |
||||
<div class="flex-center"> |
||||
<p class="fz-16 mgr10 font-blue mgl20">状态</p> |
||||
<el-select v-model="hisSearchForm.hisType" placeholder="请选择" clearable> |
||||
<el-option v-for="item in TypeList" :key="item.id" :label="item.label" :value="item.id"></el-option> |
||||
</el-select> |
||||
</div> |
||||
<el-button v-preventReClick class="ht40 btn-pdt mgl10" type="primary" round @click="statisticsSearch">查询</el-button> |
||||
</div> |
||||
|
||||
<div class="mgr10 df" v-if="hispaymentStatus != '已结项'"> |
||||
<!-- <el-button class="ht40 btn-pdt mgl10" type="primary" round>查询</el-button> --> |
||||
<el-button v-preventReClick class="ht40 btn-pdt mgl10 font-blue" round @click="hisExport">导出</el-button> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('保后新增')" class="ht40 btn-pdt mgl10" type="primary" round @click="addRepayment">新增</el-button> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('保后批量删除')" class="ht40 btn-pdt mgl10" type="danger" round @click="delAllHis">批量删除</el-button> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="shadow radius10 pdt20"> |
||||
<div class="flex-between mab20 mgl10"> |
||||
<div class="flex-center"> |
||||
<p class="hr_tag"></p> |
||||
<span class="hr_text">还款记录列表</span> |
||||
</div> |
||||
</div> |
||||
|
||||
<el-table :data="repaymentData" stripe header-align="center" class="mat20" @selection-change="hisSelectionChange" :row-key="getRowKeys" :key="1"> |
||||
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
||||
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column> |
||||
<el-table-column prop="repaymentDate" label="应还款日" align="center"></el-table-column> |
||||
<el-table-column prop="actualRepaymentDate" label="实际还款日" align="center"></el-table-column> |
||||
<el-table-column prop="guaranteeAmount" label="担保额度(元)" align="center"></el-table-column> |
||||
<el-table-column prop="currentRepayment" label="本次还款(元)" align="center"></el-table-column> |
||||
<el-table-column prop="interest" label="本次利息(元)" align="center"></el-table-column> |
||||
<el-table-column prop="otherExpenses" label="其他费用(元)" align="center"></el-table-column> |
||||
<el-table-column prop="totalRepayment" label="还款总额(元)" align="center"></el-table-column> |
||||
<el-table-column prop="deductionAmount" label="减免金额(元)" align="center"></el-table-column> |
||||
<el-table-column prop="overdueDays" label="逾期天数" align="center"></el-table-column> |
||||
<el-table-column prop="repaymentStatus" label="状态" align="center"></el-table-column> |
||||
<el-table-column prop="submitterName" label="提交人" align="center"></el-table-column> |
||||
<el-table-column prop="createTime" label="提交时间" align="center"></el-table-column> |
||||
<el-table-column prop="repaymentNotes" label="还款备注" align="center"></el-table-column> |
||||
<el-table-column label="操作" width="200" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('保后查看')" type="text" @click="goRepaymentDetail(scope.row,'查看')">查看</el-button> |
||||
<el-button v-if="$router.currentRoute.meta.btn.includes('保后编辑') && hispaymentStatus != '已结项'" type="text" @click="goRepaymentDetail(scope.row,'编辑')">编辑</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
|
||||
<div class="pagination"> |
||||
<el-pagination background @current-change="hiscurrentChange" layout="total, prev, pager, next" :current-page="hisPage" :total="histotals"> |
||||
</el-pagination> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { insuranceList, insuranceDetail, repaymentEntry, repaymentList, repaymentStatistics, excelHis, delRepayment, repaymentDetail, excelInsurance, updateInsurance, updateRepayment } from '../../utils/api'; |
||||
|
||||
export default { |
||||
data() { |
||||
return { |
||||
keyword: '', |
||||
paymentStatus: '', |
||||
pageNo: 1, |
||||
pageNumber: 10, |
||||
totals: 1, |
||||
insuranceData: [], |
||||
insMultipleSelection: [], |
||||
loanStatus: 1, |
||||
id: '', |
||||
guaranteeForm: {}, |
||||
repaymentForm: { |
||||
currentRepayment: '', |
||||
interest: '', |
||||
otherExpenses: '', |
||||
overdueDays: 0 |
||||
}, |
||||
rules: { |
||||
repaymentDate: [ |
||||
{ required: true, message: '请选择应还款日', trigger: 'blur' } |
||||
], |
||||
currentRepayment: [ |
||||
{ required: true, message: '请输入本次还款金额', trigger: 'blur' }, |
||||
{ pattern: /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/, message: '请输入正确金额格式,可保留两位小数' } |
||||
], |
||||
interest: [ |
||||
{ required: true, message: '请输入利息', trigger: 'blur' }, |
||||
{ pattern: /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/, message: '请输入正确金额格式,可保留两位小数' } |
||||
] |
||||
}, |
||||
logTypeList: [{ |
||||
label: '还款中', |
||||
id: 1 |
||||
}, |
||||
{ |
||||
label: '已逾期', |
||||
id: 2 |
||||
}, |
||||
{ |
||||
label: '已还清', |
||||
id: 3 |
||||
}, |
||||
{ |
||||
label: '已结项', |
||||
id: 4 |
||||
}], |
||||
//还款记录数据 |
||||
hisidId: '', |
||||
guaranteeAmount: '', |
||||
hisPage: 1, |
||||
histotals: 1, |
||||
repaymentData: [], |
||||
StatisticsData: {}, |
||||
TypeList: [{ |
||||
label: '待还款', |
||||
id: 1 |
||||
}, |
||||
{ |
||||
label: '已还款', |
||||
id: 2 |
||||
}, |
||||
{ |
||||
label: '已逾期', |
||||
id: 3 |
||||
}, |
||||
{ |
||||
label: '未到期', |
||||
id: 4 |
||||
}], |
||||
hisSearchForm: { |
||||
actualRepaymentDate: '', |
||||
hisType: '' |
||||
}, |
||||
hisMultipleSelection: [], |
||||
repaymentDetailForm: {}, |
||||
RepaymentId: '', |
||||
loanbackStatus: '', |
||||
endTimeOptions: {}, |
||||
hispaymentStatus: '' |
||||
}; |
||||
}, |
||||
computed:{ |
||||
totalRepayment(){ |
||||
if(isNaN(parseFloat(this.repaymentForm.otherExpenses)) || this.repaymentForm.otherExpenses == ''){ |
||||
if (isNaN(parseFloat(this.repaymentForm.currentRepayment) + parseFloat(this.repaymentForm.interest))) { |
||||
return '' |
||||
} else { |
||||
return (parseFloat(this.repaymentForm.currentRepayment)*100 + parseFloat(this.repaymentForm.interest)*100)/100 |
||||
} |
||||
}else{ |
||||
if (isNaN(parseFloat(this.repaymentForm.currentRepayment) + parseFloat(this.repaymentForm.interest) + parseFloat(this.repaymentForm.otherExpenses))) { |
||||
return '' |
||||
} else { |
||||
return (parseFloat(this.repaymentForm.currentRepayment)*100 + parseFloat(this.repaymentForm.interest)*100 + parseFloat(this.repaymentForm.otherExpenses)*100)/100 |
||||
} |
||||
} |
||||
}, |
||||
overdueDays(){ |
||||
if(this.repaymentForm.repaymentDate && !this.repaymentForm.actualRepaymentDate){ |
||||
//date1结束时间 |
||||
let date1 = new Date(this.repaymentForm.repaymentDate); |
||||
//date2当前时间 |
||||
let date2 = new Date(); |
||||
if(date1.getTime() < date2.getTime()){ |
||||
date1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()); |
||||
date2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate()); |
||||
const diff = date2.getTime() - date1.getTime(); //目标时间减去当前时间 |
||||
const diffDate = diff / (24 * 60 * 60 * 1000); //计算当前时间与结束时间之间相差天数 |
||||
return diffDate |
||||
}else{ |
||||
return 0 |
||||
} |
||||
}else{ |
||||
if(this.repaymentForm.repaymentDate && this.repaymentForm.actualRepaymentDate){ |
||||
//date1结束时间 |
||||
let date1 = new Date(this.repaymentForm.repaymentDate); |
||||
//date2当前时间 |
||||
let date2 = new Date(this.repaymentForm.actualRepaymentDate); |
||||
if(date1.getTime() < date2.getTime()){ |
||||
date1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()); |
||||
date2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate()); |
||||
const diff = date2.getTime() - date1.getTime(); //目标时间减去当前时间 |
||||
const diffDate = diff / (24 * 60 * 60 * 1000); //计算当前时间与结束时间之间相差天数 |
||||
return diffDate |
||||
}else{ |
||||
return 0 |
||||
} |
||||
}else{ |
||||
return 0 |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
watch: { |
||||
"$store.state.loan.loanStatus":function(val){ |
||||
this.loanStatus = val |
||||
if(val == 1){ |
||||
this.insuranceData = [] |
||||
this.getData() |
||||
} |
||||
if(val == 2){ |
||||
this.id = this.$store.state.loan.id |
||||
this.RepaymentId = this.$store.state.loan.RepaymentId |
||||
this.loanbackStatus = this.$store.state.loan.loanbackStatus |
||||
this.guaranteeForm = {} |
||||
this.repaymentForm = { |
||||
currentRepayment: '', |
||||
interest: '', |
||||
otherExpenses: '', |
||||
overdueDays: 0 |
||||
} |
||||
this.getDetail() |
||||
if(this.loanbackStatus == '查看' || this.loanbackStatus == '编辑'){ |
||||
this.getRepaymentDetail() |
||||
} |
||||
} |
||||
if(val == 3){ |
||||
this.hisidId = this.$store.state.loan.hisidId |
||||
this.guaranteeAmount = this.$store.state.loan.guaranteeAmount |
||||
this.statistics() |
||||
this.repaymentList() |
||||
} |
||||
this.$store.commit("loanStatusData", { loanStatus: this.loanStatus }); |
||||
} |
||||
}, |
||||
created(){ |
||||
this.loanStatus = this.$store.state.loan.loanStatus |
||||
if(this.loanStatus == 1){ |
||||
this.getData() |
||||
} |
||||
if(this.loanStatus == 2){ |
||||
this.id = this.$store.state.loan.id |
||||
this.RepaymentId = this.$store.state.loan.RepaymentId |
||||
this.loanbackStatus = this.$store.state.loan.loanbackStatus |
||||
this.guaranteeForm = {} |
||||
this.repaymentForm = { |
||||
currentRepayment: '', |
||||
interest: '', |
||||
otherExpenses: '', |
||||
overdueDays: 0 |
||||
} |
||||
this.getDetail() |
||||
if(this.loanbackStatus == '查看' || this.loanbackStatus == '编辑'){ |
||||
this.getRepaymentDetail() |
||||
} |
||||
} |
||||
if(this.loanStatus == 3){ |
||||
this.hisidId = this.$store.state.loan.hisidId |
||||
this.guaranteeAmount = this.$store.state.loan.guaranteeAmount |
||||
this.statistics() |
||||
this.repaymentList() |
||||
} |
||||
}, |
||||
methods:{ |
||||
// 查询担保列表 |
||||
async getData() { |
||||
let res = await insuranceList({ |
||||
page: this.pageNo, |
||||
size: this.pageNumber, |
||||
CustomerNumberOrName: this.keyword, |
||||
paymentStatus: this.paymentStatus |
||||
}); |
||||
res.data.list.map(e =>{ |
||||
e.paymentStatus = this.core.paymentStatus(e.paymentStatus) |
||||
}) |
||||
this.insuranceData = res.data.list; |
||||
|
||||
this.totals = res.data.totalCount; |
||||
|
||||
}, |
||||
search() { |
||||
this.pageNo = 1; |
||||
this.getData(); |
||||
}, |
||||
currentChange(val) { |
||||
this.pageNo = val; |
||||
this.getData(); |
||||
}, |
||||
getSize(val){ |
||||
this.pageNo = 1 |
||||
this.pageNumber = val |
||||
this.getData() |
||||
}, |
||||
insSelectionChange(val){ |
||||
this.insMultipleSelection = val; |
||||
}, |
||||
// 导出还款列表 |
||||
insExport(){ |
||||
// if(this.insMultipleSelection.length != ''){ |
||||
let exportIds = this.insMultipleSelection.map(e => e.id).join() |
||||
let url = `${excelInsurance}?ids=${exportIds}` |
||||
window.location.href = url |
||||
// }else{ |
||||
// this.$message.error('请先选择担保列表数据 ！'); |
||||
// } |
||||
}, |
||||
//录入 |
||||
edit(row){ |
||||
this.loanStatus = 2 |
||||
this.$store.commit("loanStatusData", { loanStatus: 2 }); |
||||
this.id = row.id |
||||
this.$store.commit("idData", { id: row.id }); |
||||
this.RepaymentId = '' |
||||
this.$store.commit("RepaymentIdData", { RepaymentId: '' }); |
||||
this.loanbackStatus = '录入' |
||||
this.$store.commit("loanbackStatusData", { loanbackStatus: '录入' }); |
||||
}, |
||||
//记录 |
||||
history(row){ |
||||
this.loanStatus = 3 |
||||
this.$store.commit("loanStatusData", { loanStatus: 3 }); |
||||
this.hisId = row.id |
||||
this.$store.commit("hisidIdData", { hisidId: row.id, guaranteeAmount: row.guaranteeAmount }); |
||||
this.hispaymentStatus = row.paymentStatus |
||||
this.$store.commit("hispaymentStatusData", { hispaymentStatus: row.paymentStatus }); |
||||
}, |
||||
//办理结项 |
||||
conclusion(row){ |
||||
this.$confirm('此还款确定要办理结项吗？', '提示', { |
||||
type: 'warning' |
||||
}) |
||||
.then(() => { |
||||
updateInsurance({id: row.id}).then(res=>{ |
||||
this.$message.success('结项成功'); |
||||
this.getData() |
||||
}).catch(err=>{ |
||||
}) |
||||
}).catch(() => {}); |
||||
}, |
||||
|
||||
//录入部分******* |
||||
//查询详情 |
||||
async getDetail(){ |
||||
let res = await insuranceDetail({ |
||||
id: this.id |
||||
}); |
||||
this.guaranteeForm = res.data |
||||
}, |
||||
//计算逾期天数 |
||||
overdueChange(val){ |
||||
if(val){ |
||||
//date1结束时间 |
||||
let date1 = new Date(val); |
||||
//date2当前时间 |
||||
let date2 = new Date(); |
||||
if(date1.getTime() < date2.getTime()){ |
||||
date1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()); |
||||
date2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate()); |
||||
const diff = date2.getTime() - date1.getTime(); //目标时间减去当前时间 |
||||
const diffDate = diff / (24 * 60 * 60 * 1000); //计算当前时间与结束时间之间相差天数 |
||||
this.repaymentForm.overdueDays = diffDate |
||||
}else{ |
||||
this.repaymentForm.overdueDays = 0 |
||||
} |
||||
}else{ |
||||
this.repaymentForm.overdueDays = 0 |
||||
} |
||||
}, |
||||
//录入提交 |
||||
saveAdd(repaymentForm){ |
||||
this.$refs[repaymentForm].validate((valid) => { |
||||
if (valid) { |
||||
if(this.RepaymentId == ''){ |
||||
this.repaymentForm.insuranceId = this.id |
||||
this.repaymentForm.totalRepayment = this.totalRepayment |
||||
this.repaymentForm.overdueDays = this.overdueDays |
||||
repaymentEntry(this.repaymentForm).then(res=>{ |
||||
this.$message.success("录入成功！"); |
||||
this.loanStatus = 1 |
||||
this.$store.commit("loanStatusData", { loanStatus: 1 }); |
||||
}).catch(err=>{ |
||||
}) |
||||
}else{ |
||||
this.repaymentForm.totalRepayment = this.totalRepayment |
||||
this.repaymentForm.overdueDays = this.overdueDays |
||||
updateRepayment(this.repaymentForm).then(res=>{ |
||||
this.$message.success("编辑成功！"); |
||||
this.loanStatus = 3 |
||||
this.$store.commit("loanStatusData", { loanStatus: 3 }); |
||||
}).catch(err=>{ |
||||
}) |
||||
} |
||||
} |
||||
}) |
||||
}, |
||||
//取消录入 |
||||
cancel(){ |
||||
this.loanStatus = 1 |
||||
this.$store.commit("loanStatusData", { loanStatus: 1 }); |
||||
}, |
||||
//选择实际还款日日期 |
||||
clickEndTime(){ |
||||
this.endTimeOptions.disabledDate = time => { |
||||
if (new Date()) { |
||||
if (time.getTime() > new Date().getTime()) { |
||||
return true |
||||
} |
||||
} else { |
||||
if (time.getTime() < Date.now() - 8.64e7) { |
||||
return true |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
//还款记录部分******* |
||||
// 记录详情统计 |
||||
async statistics(){ |
||||
let res = await repaymentStatistics({ |
||||
insuranceId: this.hisidId, |
||||
guaranteeAmount: this.guaranteeAmount |
||||
}); |
||||
this.StatisticsData = res.data |
||||
}, |
||||
// 还款记录列表 |
||||
async repaymentList(){ |
||||
let res = await repaymentList({ |
||||
page: this.hisPage, |
||||
size: this.pageNumber, |
||||
insuranceId: this.hisidId, |
||||
CustomerNumberOrName: this.hisSearchForm.actualRepaymentDate, |
||||
status: this.hisSearchForm.hisType |
||||
}); |
||||
res.data.list.map(e =>{ |
||||
e.repaymentStatus = this.core.stcStatus(e.repaymentStatus) |
||||
}) |
||||
this.repaymentData = res.data.list |
||||
this.histotals = res.data.totalCount |
||||
}, |
||||
// 还款记录列表搜索 |
||||
statisticsSearch(){ |
||||
this.hisPage = 1; |
||||
this.repaymentList() |
||||
}, |
||||
hiscurrentChange(val){ |
||||
this.hisPage = val; |
||||
this.repaymentList() |
||||
}, |
||||
getRowKeys(row) { |
||||
return row.id; |
||||
}, |
||||
hisSelectionChange(val) { |
||||
this.hisMultipleSelection = val; |
||||
}, |
||||
// 导出还款记录列表 |
||||
hisExport(){ |
||||
this.hisId |
||||
// if(this.hisMultipleSelection.length != ''){ |
||||
let exportIds = this.hisMultipleSelection.map(e => e.id).join() |
||||
let url = `${excelHis}?ids=${exportIds}&insuranceId=`+this.hisId |
||||
window.location.href = url |
||||
// }else{ |
||||
// this.$message.error('请先选择还款记录列表数据 ！'); |
||||
// } |
||||
}, |
||||
// 批量删除还款记录列表 |
||||
delAllHis(){ |
||||
if(this.hisMultipleSelection.length != ''){ |
||||
let delIds = this.hisMultipleSelection.map(e => e.id) |
||||
this.$confirm('确定要删除选中数据吗？', '提示', { |
||||
type: 'warning' |
||||
}) |
||||
.then(() => { |
||||
delRepayment(delIds).then(res=>{ |
||||
this.hisMultipleSelection = []; |
||||
this.$message.success('删除成功'); |
||||
this.statisticsSearch() |
||||
}).catch(err=>{ |
||||
}) |
||||
}).catch(() => {}); |
||||
}else{ |
||||
this.$message.error('请先选择还款记录列表数据 ！'); |
||||
} |
||||
}, |
||||
//查询还款记录列表详情 |
||||
addRepayment(){ |
||||
this.loanStatus = 2 |
||||
this.$store.commit("loanStatusData", { loanStatus: 2 }); |
||||
this.RepaymentId = '' |
||||
this.$store.commit("RepaymentIdData", { RepaymentId: '' }); |
||||
this.loanbackStatus = '新增' |
||||
this.$store.commit("loanbackStatusData", { loanbackStatus: '新增' }); |
||||
}, |
||||
goRepaymentDetail(row,type){ |
||||
this.loanStatus = 2 |
||||
this.$store.commit("loanStatusData", { loanStatus: 2 }); |
||||
this.RepaymentId = row.id |
||||
this.$store.commit("RepaymentIdData", { RepaymentId: row.id }); |
||||
this.id = row.insuranceId |
||||
this.$store.commit("idData", { id: row.insuranceId }); |
||||
this.loanbackStatus = type |
||||
this.$store.commit("loanbackStatusData", { loanbackStatus: type }); |
||||
}, |
||||
async getRepaymentDetail(){ |
||||
let res = await repaymentDetail({ |
||||
id: this.RepaymentId |
||||
}); |
||||
// this.totalRepayment = res.data.totalRepayment |
||||
// this.overdueDays = res.data.overdueDays |
||||
this.repaymentForm = res.data |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,450 @@ |
||||
// 清收完成统计 |
||||
<template> |
||||
<div> |
||||
<!-- 清收工作完成统计 --> |
||||
<div v-if="liquidate === '1'"> |
||||
<div class="mgt20 left-border fz-16"><p class="c-black mgl10">清收工作完成情况统计</p></div> |
||||
<div class="mgt20 pdb20"> |
||||
<div class="mgtb20"> |
||||
<div class="flex-center"> |
||||
<el-button v-preventReClick type="primary" round @click="createList('new')">生成年度统计表</el-button> |
||||
</div> |
||||
</div> |
||||
<div class="shadow radius10 pdt20"> |
||||
<el-table :data="data" stripe header-align="center" class="mat20"> |
||||
<el-table-column type="index" width="200" label="序号" align="center"></el-table-column> |
||||
<el-table-column prop="businessCode" label="年度" align="center"></el-table-column> |
||||
<el-table-column label="操作" width="300" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="createList(scope.row)">人员选择</el-button> |
||||
<el-button type="text" @click="[(liquidate = '2'), edit(scope.row, 'watch')]">查看</el-button> |
||||
<el-button type="text" @click="edit(scope.row)">编辑</el-button> |
||||
<el-button type="text" @click="del(scope.row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div class="pagination"> |
||||
<el-pagination |
||||
background |
||||
@current-change="currentChange" |
||||
layout="total, prev, pager, next" |
||||
:current-page="pageNo" |
||||
:total="totals" |
||||
> |
||||
</el-pagination> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<!-- 查看详细数据 --> |
||||
<div v-if="liquidate === '2'"> |
||||
<div class="mgt20 left-border fz-16"><p class="c-black mgl10">条件筛选</p></div> |
||||
<div class="mgt20 pdb20"> |
||||
<div class="flex-between mgtb20"> |
||||
<div class="flex-center"> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">清收组</p> |
||||
<el-select v-model="searchStr.liquidate" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in liquidateSelectArr" :key="item.id" :label="item.label" :value="item.id"></el-option> |
||||
</el-select> |
||||
|
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">完成比例</p> |
||||
<el-select v-model="searchStr.paymentStatus" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in proportion" :key="item.id" :label="item.label" :value="item.id"></el-option> |
||||
</el-select> |
||||
<el-input |
||||
placeholder="请输入整数" |
||||
class="wd20 mglr10" |
||||
style="min-width: 200px" |
||||
v-model="keyword" |
||||
clearable |
||||
></el-input> |
||||
<p>%</p> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">已清收总额</p> |
||||
<el-input placeholder="搜索业务编号/客户名称" style="min-width: 200px" v-model="keyword" clearable></el-input> |
||||
</div> |
||||
|
||||
<div class="flex-center"> |
||||
<!-- <el-input |
||||
placeholder="搜索业务编号/客户名称" |
||||
class="mgr20" |
||||
v-model="keyword" |
||||
clearable |
||||
></el-input> --> |
||||
<el-button v-preventReClick type="primary" size="small" round @click="clearOption">清空选项</el-button> |
||||
<!-- <el-button v-preventReClick type="primary" size="small" round @click="edit()">新建</el-button> --> |
||||
</div> |
||||
</div> |
||||
<div class="shadow radius10 pdt20"> |
||||
<div class="flex-between mab20 mgl10"> |
||||
<div class="flex-center"> |
||||
<p class="hr_tag"></p> |
||||
<span class="hr_text">2021年度清收工作完成情况统计表</span> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="flex-between"> |
||||
<div class="flex-center"> |
||||
<el-button class="mgl20" v-preventReClick type="primary" size="small" round @click="search">导出列表</el-button> |
||||
<el-radio-group v-model="radio" class="mgl30" @change="radioChange"> |
||||
<el-radio-button class="ht40" label="依据公司排名"></el-radio-button> |
||||
<el-radio-button class="ht40" label="依据小组排名"></el-radio-button> |
||||
</el-radio-group> |
||||
</div> |
||||
<div class="df"> |
||||
<el-input |
||||
style="min-width: 250px" |
||||
class="ht40 mgl10 mgr10" |
||||
@keyup.enter.native="getBusinessApply('search')" |
||||
v-model="searchStr.jobNum" |
||||
placeholder="工号/清收负责人/清收企业" |
||||
clearable |
||||
></el-input> |
||||
</div> |
||||
</div> |
||||
|
||||
<el-table |
||||
:data="statisticsData" |
||||
stripe |
||||
header-align="center" |
||||
class="mat20" |
||||
@selection-change="statisticsSelection" |
||||
:row-key="getRowKeys" |
||||
:key="1" |
||||
> |
||||
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
||||
<el-table-column prop="companyRanks" label="公司排名" align="center" width="150px"></el-table-column> |
||||
<el-table-column prop="TeamRanks" label="小组排名" align="center" width="150px"></el-table-column> |
||||
<el-table-column prop="liquidate" label="清收组" align="center"></el-table-column> |
||||
<el-table-column prop="principal" label="清收负责人" align="center" width="150px"></el-table-column> |
||||
<el-table-column prop="jobNumber" label="工号" align="center"></el-table-column> |
||||
<el-table-column prop="enterprise" label="清收企业" align="center" width="150px"> |
||||
<template slot-scope="scope"> |
||||
<div class="multi-box" v-for="(item, index) in scope.row.enterprise" :key="index"> |
||||
{{ item }} |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="cash" label="清收现金（万元）" align="center" width="150px"> |
||||
<template slot-scope="scope"> |
||||
<div class="multi-box" v-for="(item, index) in scope.row.cash" :key="index"> |
||||
{{ item }} |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="asset" label="清收资产（万元）" align="center" width="150px"> |
||||
<template slot-scope="scope"> |
||||
<div class="multi-box" v-for="(item, index) in scope.row.asset" :key="index"> |
||||
{{ item }} |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="backTime" label="回款时间" align="center" width="200px"> |
||||
<template slot-scope="scope"> |
||||
<div class="backTime" v-for="(item, index) in scope.row.backTime" :key="index"> |
||||
<el-date-picker |
||||
style="width:180px" |
||||
v-model="item.time" |
||||
type="date" |
||||
value-format="yyyy-MM-dd" |
||||
:disabled="!scope.row.edit" |
||||
> |
||||
</el-date-picker> |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="repaymentTime" label="已清收总额（元）" align="center" width="150px"> |
||||
<template slot-scope="scope" > |
||||
<div class="multi-box" > |
||||
{{ scope.row.repaymentTime }} |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="ratio" label="完成比例" align="center" width="150px"> |
||||
<template slot-scope="scope"> |
||||
<div class="ratio"> |
||||
<div class="top">{{scope.row.repaymentTime}}</div> |
||||
<el-input :disabled="!scope.row.edit" v-model="scope.row.ratio"></el-input> |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="remark" label="备注" align="center" width="200px"> |
||||
<template slot-scope="scope"> |
||||
<div class="backTime" v-for="(item, index) in scope.row.remark" :key="index"> |
||||
<el-input :disabled="!scope.row.edit" v-model="item.remark"></el-input> |
||||
</div> |
||||
</template> |
||||
</el-table-column> |
||||
<!-- 判断是否为查看或者编辑 --> |
||||
<el-table-column label="操作" width="300" align="center"> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="yearEdit(scope.row)">{{scope.row.editStr}}</el-button> |
||||
<el-button type="text" @click="history(scope.row)">查看</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
|
||||
<div class="pagination"> |
||||
<el-pagination |
||||
background |
||||
@current-change="currentChange" |
||||
layout="total, prev, pager, next" |
||||
:current-page="pageNo" |
||||
:total="totals" |
||||
> |
||||
</el-pagination> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 弹框--生成年度统计表 --> |
||||
<el-dialog title="请选择" width="40%" :visible.sync="showRank" center> |
||||
<div class="ranking"> |
||||
<div class="top"> |
||||
<div class="left-border fz-16"><p class="c-black mgl10">年份</p></div> |
||||
<el-date-picker |
||||
class="mgt10 mgl80" |
||||
v-model="chooisYear" |
||||
:picker-options="pickerOptions" |
||||
type="year" |
||||
placeholder="选择年" |
||||
> |
||||
</el-date-picker> |
||||
</div> |
||||
<div class="tree"> |
||||
<div class="left-border fz-16 mgt20"><p class="c-black mgl10">参与本年度清收排名的人员</p></div> |
||||
<div class="mgl80 mgt20 mgr80" style="border: 1px solid #e6e6e6; border-radius: 15px; overflow: auto; padding: 15px"> |
||||
<el-tree |
||||
:data="tree" |
||||
show-checkbox |
||||
default-expand-all |
||||
node-key="id" |
||||
ref="tree" |
||||
highlight-current |
||||
:props="defaultProps" |
||||
> |
||||
</el-tree> |
||||
</div> |
||||
</div> |
||||
<div class="flex-center fj-center mgt20"> |
||||
<el-button type="primary" round class="mgr20">确定</el-button> |
||||
<el-button type="primary" round class="mgl20">取消</el-button> |
||||
</div> |
||||
</div> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
export default { |
||||
name: '', |
||||
props: {}, |
||||
data() { |
||||
return { |
||||
showRank: false, // 弹框 |
||||
defaultProps: { |
||||
children: 'children', |
||||
label: 'label' |
||||
}, |
||||
data: [{}], |
||||
tree: [ |
||||
{ |
||||
id: 1, |
||||
label: '一级 1', |
||||
children: [ |
||||
{ |
||||
id: 4, |
||||
label: '二级 1-1', |
||||
children: [ |
||||
{ |
||||
id: 9, |
||||
label: '三级 1-1-1' |
||||
}, |
||||
{ |
||||
id: 10, |
||||
label: '三级 1-1-2' |
||||
} |
||||
] |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
id: 2, |
||||
label: '一级 2', |
||||
children: [ |
||||
{ |
||||
id: 5, |
||||
label: '二级 2-1' |
||||
}, |
||||
{ |
||||
id: 6, |
||||
label: '二级 2-2' |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
id: 3, |
||||
label: '一级 3', |
||||
children: [ |
||||
{ |
||||
id: 7, |
||||
label: '二级 3-1' |
||||
}, |
||||
{ |
||||
id: 8, |
||||
label: '二级 3-2' |
||||
} |
||||
] |
||||
} |
||||
], |
||||
chooisYear: '', |
||||
pageNo: 0, |
||||
totals: 0, |
||||
liquidateSelectArr: [{ label: '不限', id: '' }], |
||||
proportion: [ |
||||
// 选择完成比例符号 |
||||
{ label: '不限', id: '0' }, |
||||
{ label: '>', id: '1' }, |
||||
{ label: '<', id: '2' }, |
||||
{ label: '>=', id: '3' }, |
||||
{ label: '<=', id: '4' }, |
||||
{ label: '=', id: '5' } |
||||
], |
||||
searchStr: { |
||||
// 筛选条件 |
||||
liquidate: '', // 清收组 |
||||
ratio: '', // 比例 |
||||
percent: '', // 比例整数百分比 |
||||
paymentStatus: '' // 选择比例符号 |
||||
}, |
||||
radio: '依据公司排名', |
||||
|
||||
liquidateSelect: '0', // 选择筛选框 |
||||
statisticsData: [// 统计表的数据 |
||||
{ |
||||
selection: '1', |
||||
companyRanks: '1', |
||||
TeamRanks: '1', |
||||
liquidate: '1', |
||||
principal: '1', |
||||
jobNumber: '1', |
||||
enterprise: [//清收企业 |
||||
'蒙牛', |
||||
'腾讯', |
||||
'腾讯', |
||||
], |
||||
cash: [123456, 2345678,96354], |
||||
asset: [123, 456, 23], |
||||
backTime: [ |
||||
{ time: '2021-12-11' }, |
||||
{ time: '2021-12-12' }, |
||||
{ time: '2021-12-12' }, |
||||
], |
||||
repaymentTime:12321342315621789, |
||||
ratio: '25525225', |
||||
remark: [ |
||||
{ remark: '我是备注1' }, |
||||
{ remark: '我是备注2' }, |
||||
{ remark: '我是备注2' } |
||||
], |
||||
edit:false, |
||||
editStr:'编辑' |
||||
} |
||||
], |
||||
keyword: '', // 搜索绑定变量占位 |
||||
pickerOptions: { |
||||
disabledDate(time) { |
||||
// 限制时间 |
||||
let date = new Date(); |
||||
let year = date.getFullYear(); |
||||
return time.getFullYear() > year; |
||||
} |
||||
} |
||||
}; |
||||
}, |
||||
computed: { |
||||
liquidate:{ |
||||
get(){ |
||||
return this.$store.state.loan.liquidate |
||||
},set(){} |
||||
}, |
||||
}, |
||||
methods: { |
||||
createList(val) { |
||||
// 处理 |
||||
this.showRank = true; |
||||
if (val === 'new') { |
||||
// 新建生成统计表 |
||||
} else { |
||||
// 编辑统计表 |
||||
// 取得当前业务的id，再取得人员的id |
||||
} |
||||
}, |
||||
currentChange(val) { |
||||
// 列表变更 |
||||
}, |
||||
radioChange(val) { |
||||
// 选择排名排序 |
||||
console.log(val, 'val'); |
||||
}, |
||||
clearOption() { |
||||
// 清空筛选条件 |
||||
this.searchStr = {}; |
||||
}, |
||||
search() { |
||||
// 暂时占位 |
||||
}, |
||||
getRowKeys(row) { |
||||
// 列表的Key |
||||
return row.Id; |
||||
}, |
||||
statisticsSelection(val) { |
||||
// 统计勾选的 |
||||
console.log(val,'勾选') |
||||
}, |
||||
edit(row, val) { |
||||
// 编辑 |
||||
this.liquidate ='2'; |
||||
this.$store.commit('liquidate','2') |
||||
}, |
||||
yearEdit(row, val){// 编辑功能 |
||||
if(row.edit != false){ |
||||
row.edit = false |
||||
row.editStr = '编辑' |
||||
}else{ |
||||
row.editStr = '保存' |
||||
row.edit = true |
||||
// 调接口，存数据，重新请求列表 |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
<style lang='scss' scoped> |
||||
/deep/ .el-radio-button__inner { |
||||
padding-top: 9px; |
||||
padding-bottom: 9px; |
||||
} |
||||
.multi-box { |
||||
border: 1px solid #e6e6e6; |
||||
min-height: 50px; |
||||
text-align: center; |
||||
line-height: 50px; |
||||
&:nth-child(2n) { |
||||
background: #e6e6e6; |
||||
} |
||||
} |
||||
.backTime{ |
||||
min-height: 50px; |
||||
line-height: 50px; |
||||
|
||||
|
||||
} |
||||
.ratio{ |
||||
.top{ |
||||
border-bottom: 1px solid; |
||||
height: 40px; |
||||
line-height: 40px; |
||||
margin-bottom: 15px; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,206 @@ |
||||
// 保后管理-清收进度查询 |
||||
<template> |
||||
<div> |
||||
<div class="mgt20 left-border fz-16"><p class="c-black mgl10">条件筛选</p></div> |
||||
<div class="mgt20 pdb20"> |
||||
<div class="flex-between mgtb20"> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">所在区域</p> |
||||
<el-select v-model="searchStr.liquidate" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in area" :key="item.id" :label="item.name" :value="item.id"></el-option> |
||||
</el-select> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">经营情况</p> |
||||
<el-select v-model="searchStr.liquidate" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in circumstance" :key="item.id" :label="item.name" :value="item.id"></el-option> |
||||
</el-select> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">贷款银行</p> |
||||
<el-select v-model="searchStr.liquidate" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="(item,index) in bankData" :key="item.index" :label="item.value" :value="item.value"></el-option> |
||||
</el-select> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">代偿金额</p> |
||||
<el-select v-model="searchStr.paymentStatus" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in proportion" :key="item.id" :label="item.label" :value="item.id"></el-option> |
||||
</el-select> |
||||
<el-input |
||||
placeholder="请输入金额（万）" |
||||
class="wd20 mglr10" |
||||
style="max-width: 200px" |
||||
v-model="keyword" |
||||
clearable |
||||
></el-input> |
||||
</div> |
||||
<div class="flex-between mgtb20"> |
||||
<div class="flex-center"> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">代偿余额</p> |
||||
<el-select v-model="searchStr.paymentStatus" placeholder="请选择" clearable @change="search"> |
||||
<el-option v-for="item in proportion" :key="item.id" :label="item.label" :value="item.id"></el-option> |
||||
</el-select> |
||||
<el-input |
||||
placeholder="请输入整数" |
||||
class="wd20 mglr10" |
||||
style="min-width: 200px" |
||||
v-model="keyword" |
||||
clearable |
||||
></el-input> |
||||
<p class="fz-16 mgr10 font-blue mgl20 nowrap">代偿时间</p> |
||||
<!-- <el-date-picker |
||||
style="width:180px" |
||||
v-model="searchStr.time" |
||||
type="date" |
||||
value-format="yyyy-MM-dd" |
||||
> |
||||
</el-date-picker> --> |
||||
<el-date-picker |
||||
class="ht40 mgl10" |
||||
v-model="searchStr.time" |
||||
@change="getDates($event,parameter.startTime,parameter.endTime,'flowTeam')" |
||||
type="daterange" |
||||
range-separator="至" |
||||
start-placeholder="开始日期" |
||||
end-placeholder="结束日期" |
||||
format="yyyy-MM-dd" |
||||
value-format="timestamp" |
||||
> |
||||
</el-date-picker> |
||||
</div> |
||||
|
||||
<div class="flex-center mgr10"> |
||||
<el-button v-preventReClick type="primary" round @click="clearOption">清空选项</el-button> |
||||
</div> |
||||
</div> |
||||
<div class="shadow radius10 pdt20"> |
||||
<div class="flex-between mab20 mgl10"> |
||||
<div class="flex-center"> |
||||
<p class="hr_tag"></p> |
||||
<span class="hr_text">清收工作进度表</span> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="flex-between"> |
||||
<div class="flex-center"> |
||||
<el-button class="mgl20" v-preventReClick type="primary" size="small" round @click="search">导出列表</el-button> |
||||
</div> |
||||
<div class="df"> |
||||
<el-input |
||||
style="min-width: 250px" |
||||
class="ht40 mgl10 mgr10" |
||||
@keyup.enter.native="getBusinessApply('search')" |
||||
v-model="searchStr.jobNum" |
||||
placeholder="企业名称/清收负责人/业务编号" |
||||
clearable |
||||
></el-input> |
||||
</div> |
||||
</div> |
||||
|
||||
<el-table |
||||
:data="statisticsData" |
||||
v-loading="loading" |
||||
stripe |
||||
header-align="center" |
||||
class="mat20" |
||||
@selection-change="statisticsSelection" |
||||
:row-key="getRowKeys" |
||||
:key="1" |
||||
> |
||||
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
||||
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column> |
||||
<el-table-column prop="companyRanks" label="业务编号" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="TeamRanks" label="企业名称" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="liquidate" label="法定代表人" align="center"></el-table-column> |
||||
<el-table-column prop="principal" label="联系电话" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="jobNumber" label="贷款银行" align="center"></el-table-column> |
||||
<el-table-column prop="enterprise" label="贷款金额(元)" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="贷款期限" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="代偿时间" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="代偿金额(元)" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="代偿余额(元)" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="抵押情况" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="诉讼情况" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="经营情况" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="所在区域" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="清偿方式" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="清收负责人" align="center" min-width="100px"></el-table-column> |
||||
<el-table-column prop="enterprise" label="备注" align="center" min-width="100px"></el-table-column> |
||||
</el-table> |
||||
|
||||
<div class="pagination"> |
||||
<el-pagination |
||||
background |
||||
@current-change="currentChange" |
||||
layout="total, prev, pager, next" |
||||
:current-page="pageNo" |
||||
:total="totals" |
||||
> |
||||
</el-pagination> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
export default{ |
||||
name:'', |
||||
props:{}, |
||||
data(){ |
||||
return{ |
||||
loading:false, |
||||
statisticsData:[], |
||||
searchStr:{}, |
||||
pageNo:1, |
||||
totals:0, |
||||
proportion: [ |
||||
// 选择完成比例符号 |
||||
{ label: '不限', id: '0' }, |
||||
{ label: '>', id: '1' }, |
||||
{ label: '<', id: '2' }, |
||||
{ label: '>=', id: '3' }, |
||||
{ label: '<=', id: '4' }, |
||||
{ label: '=', id: '5' } |
||||
], |
||||
area:[// 区域 |
||||
{name:'萨尔图区',id:0}, |
||||
{name:'高新区',id:1}, |
||||
{name:'龙凤区',id:2}, |
||||
{name:'让胡同路区',id:3}, |
||||
{name:'大同区',id:4}, |
||||
{name:'肇县区',id:5}, |
||||
], |
||||
circumstance:[// 经营情况 |
||||
{name:'停产',id:'停产'}, |
||||
{name:'已破产',id:'已破产'}, |
||||
{name:'经营中',id:'经营中'}, |
||||
{name:'未正常经营',id:'未正常经营'}, |
||||
], |
||||
|
||||
|
||||
} |
||||
}, |
||||
created() { |
||||
console.clear() |
||||
console.log('初始化') |
||||
console.log(this.bankData) |
||||
}, |
||||
computed: { |
||||
bankData(){ |
||||
return this.$store.state.guarantee.bankData |
||||
} |
||||
}, |
||||
methods:{ |
||||
search(){ |
||||
|
||||
}, |
||||
clearOption(){ |
||||
this.searchStr = {} |
||||
}, |
||||
currentChange(val){ |
||||
this.pageNo = val |
||||
}, |
||||
|
||||
|
||||
}, |
||||
} |
||||
</script> |
||||
<style lang='scss' scoped> |
||||
/deep/ .el-date-editor .el-range-separator{ |
||||
min-width: 30px; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue