You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1046 lines
53 KiB
1046 lines
53 KiB
<template> |
|
<div> |
|
<div v-show="logStatus == 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 type="primary" size="small" round @click="search">查询</el-button> |
|
<el-button 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 v-loading='systemDataLoading' :data="systemData" 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="code" label="业务编号" align="center"></el-table-column> |
|
<el-table-column prop="name" label="客户名称" align="center"></el-table-column> |
|
<el-table-column prop="phone" label="联系电话" align="center"></el-table-column> |
|
<el-table-column prop="type" label="业务类型" align="center"></el-table-column> |
|
<el-table-column prop="amount" label="担保额度(元)" align="center"></el-table-column> |
|
<el-table-column prop="overduePeriods" label="逾期期数" align="center"></el-table-column> |
|
<el-table-column prop="overdueAmount" label="逾期额度(元)" align="center"></el-table-column> |
|
<el-table-column prop="overdueInterest" label="逾期利息(元)" align="center"></el-table-column> |
|
<!-- <el-table-column prop="department" label="所属部门" align="center"></el-table-column> --> |
|
<el-table-column prop="numberOfCollection" label="催收次数" align="center"></el-table-column> |
|
<el-table-column prop="status" 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="history(scope.row)">还款记录</el-button> |
|
<el-button v-if="$router.currentRoute.meta.btn.includes('催收')" type="text" @click="collection(scope.row)">催收</el-button> |
|
<el-button v-if="$router.currentRoute.meta.btn.includes('催收记录')" type="text" @click="collectionHis(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="logStatus == 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.businessCode}}</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.businessCode}}</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="100px" class="flex-start-around" disabled> |
|
<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"></el-date-picker> |
|
</el-form-item> |
|
|
|
<el-form-item label="逾期天数"> |
|
<el-input v-model="repaymentForm.overdueDays" type="number" placeholder="请输入逾期天数"></el-input> |
|
</el-form-item> |
|
|
|
<el-form-item label="本次还款(元)" prop="currentRepayment"> |
|
<el-input v-model="repaymentForm.currentRepayment" placeholder="请输入本次还款金额"></el-input> |
|
</el-form-item> |
|
|
|
<el-form-item label="其他费用(元)"> |
|
<el-input v-model="repaymentForm.otherExpenses" placeholder="请输入其他费用"></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-form-item> |
|
|
|
<el-form-item label="还款总额(元)"> |
|
<el-input v-model="repaymentForm.totalRepayment" placeholder="请输入还款总额" maxlength="10"></el-input> |
|
</el-form-item> |
|
|
|
<el-form-item label="利息(元)" prop="interest"> |
|
<el-input v-model="repaymentForm.interest" placeholder="请输入利息"></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> |
|
|
|
<div v-show="logStatus == 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 class="ht40 btn-pdt mgl10" type="primary" round @click="statisticsSearch">查询</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> |
|
</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 v-show="logStatus == 4"> |
|
<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"> |
|
<el-form-item label="客户名称:"> |
|
<span>{{collectionForm.name}}</span> |
|
</el-form-item> |
|
|
|
<el-form-item label="业务编号"> |
|
<span>{{collectionForm.code}}</span> |
|
</el-form-item> |
|
|
|
<el-form-item label="逾期本金(元):"> |
|
<span>{{collectionForm.overdueAmount}}</span> |
|
</el-form-item> |
|
|
|
<el-form-item label="逾期费用(元):"> |
|
<span>{{collectionForm.otherExpenses}}</span> |
|
</el-form-item> |
|
</el-col> |
|
|
|
<el-col :span="12"> |
|
<el-form-item label="业务类别:"> |
|
<span>{{collectionForm.type}}</span> |
|
</el-form-item> |
|
|
|
<el-form-item label="已逾期期数:"> |
|
<span>{{collectionForm.overduePeriods}}</span> |
|
</el-form-item> |
|
|
|
<el-form-item label="逾期利息(元):"> |
|
<span>{{collectionForm.overdueInterest}}</span> |
|
</el-form-item> |
|
|
|
<el-form-item label="催收次数:"> |
|
<span>{{collectionForm.numberOfCollection}}</span> |
|
</el-form-item> |
|
</el-col> |
|
</el-form> |
|
</div> |
|
</div> |
|
</el-card> |
|
</el-col> |
|
</el-row> |
|
|
|
<div class="mgt20 pdb20"> |
|
<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="collectionData" stripe header-align="center" class="mat20" :key="4"> |
|
<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="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> |
|
</div> |
|
</div> |
|
|
|
<div class="mgt20 pdb20"> |
|
<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-form :model="collectionHandle" :rules="handleRules" ref="collectionHandle" label-width="140px" :disabled="logbackStatus == '查看'"> |
|
<el-form-item label="催收方式" prop="collectionMethod"> |
|
<el-radio v-model="collectionHandle.collectionMethod" label="1" border>电话催收</el-radio> |
|
<el-radio v-model="collectionHandle.collectionMethod" label="2" border>上门/外访</el-radio> |
|
<el-radio v-model="collectionHandle.collectionMethod" label="3" border>其他</el-radio> |
|
<el-input :disabled="collectionHandle.collectionMethod!=='3'" v-model="collectionHandle.other" class="radioInput" placeholder="请输入"></el-input> |
|
</el-form-item> |
|
|
|
<el-form-item label="催收时间" prop="collectionTime" class="date"> |
|
<el-date-picker v-model="collectionHandle.collectionTime" :picker-options="endTimeOptions" @focus="clickEndTime" placeholder="请选择催收时间日期" type="date" value-format="yyyy-MM-dd"></el-date-picker> |
|
</el-form-item> |
|
|
|
<el-form-item label="拜访人" prop="visitor" class="date"> |
|
<el-input v-model="collectionHandle.visitor" placeholder="拜访人名称" maxlength="10" style="width:220px"></el-input> |
|
</el-form-item> |
|
|
|
<el-form-item label="催收状况说明" prop="situationDescription" style="width:50%"> |
|
<el-input v-model="collectionHandle.situationDescription" type="textarea" :autosize="{ minRows: 4 }" placeholder="请输入2000字以内"></el-input> |
|
</el-form-item> |
|
|
|
<el-form-item label="催收反馈" prop="collectionFeedback" style="width:50%"> |
|
<el-input v-model="collectionHandle.collectionFeedback" type="textarea" :autosize="{ minRows: 4 }" placeholder="请填写借款人的应答信息，真实反馈不得违背客观事实"></el-input> |
|
</el-form-item> |
|
<el-form-item required label="上传附件"> |
|
<el-upload |
|
:on-remove="handleRemove" |
|
:on-error="uploadError" |
|
:on-preview="handlePreview" |
|
:on-success="uploadSuccess" |
|
:before-remove="beforeRemove" |
|
:on-exceed="handleExceed" |
|
:action="uploadUrl" |
|
:file-list="uploadList" |
|
ref="file" |
|
accept=".jpg,.jpeg,.png,.pdf,.svg,.bmp,.BMP,.SVG,.JPG,.JPEG,.PBG,.PDF,.docx,.DOCX,.ppt,.PPT,.doc,.DOC,.mp4,.MP4" |
|
:headers="uploadHeaders" |
|
> |
|
<el-button size="medium" type="plain">上传附件</el-button> |
|
</el-upload> |
|
</el-form-item> |
|
</el-form> |
|
|
|
<div class="mab20 flex-start-around" v-if="logbackStatus == '提交'"> |
|
<el-button type="primary" round class="mag" @click="collectionSave('collectionHandle')">提交</el-button> |
|
<el-button type="primary" plain round class="mag" @click="collectionCancel">取消</el-button> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<el-dialog :visible.sync="showPreviewImg" style="margin-top:-7vh"> |
|
<div class="tx-center"> |
|
<img :src="previewImg" class="el-image-viewer__img" style="transform: scale(1) rotate(0deg);margin-top: -1px; max-height: 100%; max-width: 100%;"> |
|
</div> |
|
</el-dialog> |
|
</div> |
|
<!-- 催收记录 --> |
|
<div v-show="logStatus == 5"> |
|
<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 |
|
class="wd100" |
|
v-model="collectionDate" |
|
align="right" |
|
unlink-panels |
|
type="daterange" |
|
start-placeholder="开始日期" |
|
end-placeholder="结束日期" |
|
format="yyyy-MM-dd" |
|
value-format="yyyy-MM-dd" |
|
@change="selectTime" |
|
clearable |
|
></el-date-picker> |
|
</div> |
|
</div> |
|
<el-button class="ht40 btn-pdt mgl10" type="primary" round @click="collectionHisSearch">查询</el-button> |
|
</div> |
|
<el-button type="primary" plain size="small" round icon="el-icon-upload2" @click="CollectionHisExport">导出</el-button> |
|
</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="collectionHisData" stripe header-align="center" class="mat20" @selection-change="collectionHisSelection" :row-key="getRowKeys" :key="5"> |
|
<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="code" label="业务编号" align="center"></el-table-column> |
|
<el-table-column prop="name" label="客户名称" align="center"></el-table-column> |
|
<el-table-column prop="overdueAmount" label="逾期本金(元)" align="center"></el-table-column> |
|
<el-table-column prop="overdueInterest" label="逾期利息(元)" align="center"></el-table-column> |
|
<el-table-column prop="otherExpenses" label="逾期费用(元)" align="center"></el-table-column> |
|
<el-table-column prop="overduePeriods" label="逾期期次" align="center"></el-table-column> |
|
<el-table-column prop="collectionTime" label="催收日期" align="center"></el-table-column> |
|
<el-table-column prop="collectionUserName" label="催收人" align="center"></el-table-column> |
|
<el-table-column prop="collectionMethod" label="催收方式" align="center"></el-table-column> |
|
<el-table-column prop="collectionFeedback" label="催收反馈" align="center"></el-table-column> |
|
<el-table-column label="操作" width="200" align="center"> |
|
<template slot-scope="scope"> |
|
<el-button type="text" v-if="$router.currentRoute.meta.btn.includes('催收记录查看')" @click="collectionHisSee(scope.row)">查看</el-button> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
|
|
<div class="pagination"> |
|
<el-pagination background @current-change="collectionHisPageChange" layout="total, prev, pager, next" :current-page="collectionHisPage" :total="collectionHisTotals"> |
|
</el-pagination> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import { collectionList, collectionListDetail, collectionHisList, excelCollectionHis, collection, collectionHisListDetail, insuranceDetail, repaymentEntry, repaymentList, repaymentStatistics, repaymentDetail, excelCollection, updateInsurance } from '../../../utils/api'; |
|
import axios from 'axios'; |
|
|
|
export default { |
|
data() { |
|
return { |
|
systemDataLoading:false,// 催收管理加载 |
|
keyword: '', |
|
paymentStatus: '', |
|
pageNo: 1, |
|
pageNumber: 10, |
|
totals: 1, |
|
systemData: [], |
|
insMultipleSelection: [], |
|
logStatus: 1, |
|
id: '', |
|
guaranteeForm: {}, |
|
repaymentForm: {}, |
|
rules: { |
|
repaymentDate: [ |
|
{ required: true, message: '请选择应还款日', trigger: 'change' } |
|
], |
|
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' } |
|
] |
|
}, |
|
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: {}, |
|
//催收 |
|
logId: '', |
|
collectionForm: {}, |
|
collectionData: [], |
|
collectionHandle: { |
|
collectionMethod: '1', |
|
collectionTime: '', |
|
collectionFeedback: '', |
|
enclosureFiles: [] |
|
}, |
|
handleRules: { |
|
collectionTime: [ |
|
{ required: true, message: '请选择催收时间日期', trigger: 'change' } |
|
], |
|
visitor: [ |
|
{ required: true, message: '请输入拜访人姓名', trigger: 'blur' } |
|
], |
|
situationDescription: [ |
|
{ required: true, message: '请输入催收状况说明', trigger: 'blur' } |
|
], |
|
collectionMethod:[ |
|
{ required: true, message: '请选择催收方式', trigger: 'change' } |
|
], |
|
collectionFeedback: [ |
|
{ required: true, message: '请输入催收反馈', trigger: 'blur' } |
|
] |
|
}, |
|
uploadUrl:axios.defaults.baseURL + '/api-guarantee/dg-apply-amount-info/uploadFile', |
|
uploadList: [], |
|
uploadHeaders:{token:sessionStorage.getItem('token')||localStorage.getItem('token')},//上传带token |
|
showPreviewImg: false, |
|
previewImg: '', |
|
//催收记录 |
|
collectionHisData: [], |
|
collectionDate: '', |
|
collectionHisPage: 1, |
|
collectionHisSize: 10, |
|
collectionHisStartTime: '', |
|
collectionHisEndTime: '', |
|
collectionHisMultiple: [], |
|
collectionHisTotals: 1, |
|
|
|
logbackStatus: '', |
|
logbackId: '', |
|
logRepaymentId: '', |
|
endTimeOptions: {} |
|
}; |
|
}, |
|
watch: { |
|
"$store.state.loan.logStatus":function(val) { |
|
this.logStatus = val |
|
if(val == 1){ |
|
this.systemData = [] |
|
this.getData() |
|
} |
|
if(val == 2){ |
|
this.id = this.$store.state.loan.insuranceId |
|
this.logRepaymentId = this.$store.state.loan.logRepaymentId |
|
this.guaranteeForm = {} |
|
this.repaymentForm = {} |
|
this.getDetail() |
|
this.getRepaymentDetail() |
|
} |
|
if(val == 3){ |
|
this.hisidId = this.$store.state.loan.hisidId |
|
this.guaranteeAmount = this.$store.state.loan.guaranteeAmount |
|
this.statistics() |
|
this.repaymentList() |
|
} |
|
if(val == 4){ |
|
this.logbackStatus = this.$store.state.loan.logbackStatus |
|
this.collectionHandle = { |
|
collectionMethod: '1', |
|
collectionTime: '', |
|
collectionFeedback: '', |
|
enclosureFiles: [] |
|
} |
|
this.uploadList = [] |
|
if(this.logbackStatus == '提交'){ |
|
this.logId = this.$store.state.loan.logId |
|
this.collectionListDetail() |
|
}else{ |
|
this.logbackId = this.$store.state.loan.logbackId |
|
this.collectionHisListDetail() |
|
} |
|
} |
|
if(val == 5){ |
|
this.logId = this.$store.state.loan.logId |
|
this.collectionHisList() |
|
} |
|
this.$store.commit("logStatusData", { logStatus: this.logStatus }); |
|
} |
|
}, |
|
created(){ |
|
this.logStatus = this.$store.state.loan.logStatus |
|
// console.log(this.logStatus,'this.logStatus') |
|
if(this.logStatus == 1){ |
|
this.getData() |
|
} |
|
if(this.logStatus == 2){ |
|
this.id = this.$store.state.loan.insuranceId |
|
this.logRepaymentId = this.$store.state.loan.logRepaymentId |
|
this.guaranteeForm = {} |
|
this.repaymentForm = {} |
|
this.getDetail() |
|
this.getRepaymentDetail() |
|
} |
|
if(this.logStatus == 3){ |
|
this.hisidId = this.$store.state.loan.hisidId |
|
this.guaranteeAmount = this.$store.state.loan.guaranteeAmount |
|
this.statistics() |
|
this.repaymentList() |
|
} |
|
if(this.logStatus == 4){ |
|
this.logbackStatus = this.$store.state.loan.logbackStatus |
|
this.collectionHandle = { |
|
collectionMethod: '1', |
|
collectionTime: '', |
|
collectionFeedback: '', |
|
enclosureFiles: [] |
|
} |
|
this.uploadList = [] |
|
if(this.logbackStatus == '提交'){ |
|
this.logId = this.$store.state.loan.logId |
|
this.collectionListDetail() |
|
}else{ |
|
this.logbackId = this.$store.state.loan.logbackId |
|
this.collectionHisListDetail() |
|
} |
|
} |
|
if(this.logStatus == 5){ |
|
this.logId = this.$store.state.loan.logId |
|
this.collectionHisList() |
|
} |
|
}, |
|
methods:{ |
|
// 查询催收列表 |
|
async getData() { |
|
this.systemDataLoading = true |
|
try { |
|
let res = await collectionList({ |
|
page: this.pageNo, |
|
size: this.pageNumber, |
|
codeOrName: this.keyword, |
|
status: this.paymentStatus |
|
}); |
|
this.systemDataLoading = false |
|
res.data.list.map(e =>{ |
|
e.status = this.core.paymentStatus(e.status) |
|
}) |
|
this.systemData = res.data.list; |
|
this.totals = res.data.totalCount; |
|
} catch (error) { |
|
this.systemDataLoading = false |
|
} |
|
}, |
|
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 = `${excelCollection}?insuranceIds=${exportIds}` |
|
window.location.href = url |
|
// }else{ |
|
// this.$message.error('请先选择催收列表数据 ！'); |
|
// } |
|
}, |
|
//记录 |
|
history(row){ |
|
this.logStatus = 3 |
|
this.$store.commit("logStatusData", { logStatus: 3 }); |
|
this.hisId = row.id |
|
this.$store.commit("hisidIdData", { hisidId: row.id, guaranteeAmount: row.amount }); |
|
}, |
|
//催收 |
|
collection(row){ |
|
this.logStatus = 4 |
|
this.$store.commit("logStatusData", { logStatus: 4 }); |
|
this.logbackStatus = '提交' |
|
this.$store.commit("logbackStatusData", { logbackStatus: '提交' }); |
|
this.logId = row.id |
|
this.$store.commit("logIdData", { logId: row.id }); |
|
}, |
|
//催收记录 |
|
collectionHis(row){ |
|
this.logStatus = 5 |
|
this.$store.commit("logStatusData", { logStatus: 5 }); |
|
this.logId = row.id |
|
this.$store.commit("logIdData", { logId: row.id }); |
|
}, |
|
//办理结项 |
|
conclusion(row){ |
|
let delIds = this.hisMultipleSelection.map(e => e.id).join() |
|
this.$confirm('此还款确定要办理结项吗？', '提示', { |
|
type: 'warning' |
|
}) |
|
.then(() => { |
|
updateInsurance(delIds).then(res=>{ |
|
this.$message.success('结项成功'); |
|
this.statisticsSearch() |
|
}).catch(err=>{ |
|
}) |
|
}).catch(() => {}); |
|
}, |
|
|
|
//录入部分******* |
|
//查询详情 |
|
async getDetail(){ |
|
let res = await insuranceDetail({ |
|
id: this.id |
|
}); |
|
// console.log(res,'res') |
|
this.guaranteeForm = res.data.insuranceList |
|
}, |
|
//还款记录部分******* |
|
// 记录详情统计 |
|
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; |
|
}, |
|
//查询还款记录列表详情 |
|
goRepaymentDetail(row){ |
|
this.logStatus = 2 |
|
this.$store.commit("logStatusData", { logStatus: 2 }); |
|
this.logRepaymentId = row.id |
|
this.$store.commit("logRepaymentIdData", { logRepaymentId: row.id }); |
|
this.id = row.insuranceId |
|
this.$store.commit("loginsuranceIdData", { insuranceId: row.insuranceId }); |
|
}, |
|
async getRepaymentDetail(){ |
|
let res = await repaymentDetail({ |
|
id: this.logRepaymentId |
|
}); |
|
this.repaymentForm = res.data |
|
}, |
|
//催收列表部分***** |
|
//点击催收时的列表 |
|
async collectionListDetail(){ |
|
let res = await collectionListDetail({ |
|
insuranceId: this.logId |
|
}); |
|
this.collectionForm = res.data |
|
res.data.alRepaymentEntryList.map(e =>{ |
|
e.repaymentStatus = this.core.stcStatus(e.repaymentStatus) |
|
}) |
|
this.collectionData = res.data.alRepaymentEntryList |
|
}, |
|
//选择催收日期 |
|
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 |
|
} |
|
} |
|
} |
|
}, |
|
// 上传文件 |
|
handleExceed(files, fileList) { |
|
this.$message.warning( |
|
`当前限制选择 1 个文件，如需更换，请删除上一个文件再重新选择！` |
|
); |
|
}, |
|
uploadSuccess(response, file, fileList) { |
|
if(response.code==99999){ |
|
fileList.splice(0,1) |
|
return this.$message.error(`上传失败，请重新上传！错误码${response.code}`) |
|
} |
|
this.uploadList.push({ name: file.name, url: response.data[0] }); |
|
// this.collectionHandle.enclosureFiles = response.data[0] |
|
}, |
|
uploadError(err, file, fileList) { |
|
this.$message({ |
|
message: "上传出错，请重试！", |
|
type: "error", |
|
center: true |
|
}); |
|
}, |
|
beforeRemove(file, fileList) { |
|
return this.$confirm(`确定移除 ${file.name}？`); |
|
}, |
|
handleRemove(file, fileList) { |
|
this.uploadList = fileList |
|
// this.uploadList = [] |
|
// this.collectionHandle.enclosureFiles = '' |
|
}, |
|
// 上传后点击预览文件钩子 |
|
handlePreview(file) { |
|
let index= file.url.lastIndexOf("."); |
|
//获取后缀 |
|
let ext = file.url.substr(index+1); |
|
if(['jpg','jpeg','png','gif','svg','psd'].includes(ext)){ |
|
this.showPreviewImg = true |
|
this.previewImg = file.url |
|
// pdf调用插件 |
|
}else if(ext == "pdf"){ |
|
window.open(file.url) |
|
}else if(ext == 'mp4'){ |
|
this.core.downMp4(file.url,this.URLsubstring(file.url)) |
|
} |
|
else{ |
|
window.open('https://view.officeapps.live.com/op/view.aspx?src='+file.url) |
|
} |
|
}, |
|
URLsubstring(url){// 剪切img-url的名称 |
|
if(url){ |
|
return url.substring(59,url.length) |
|
} |
|
}, |
|
// 催收提交 |
|
collectionSave(collectionHandle){ |
|
if(this.collectionHandle.collectionMethod!=='3') this.$set(this.collectionHandle,"other",'') |
|
this.$refs[collectionHandle].validate((valid) => { |
|
if (valid) { |
|
if(this.collectionHandle.collectionMethod=='3'&&!this.collectionHandle.other) return this.$message.error("请输入其他催收方式说明！"); |
|
if(this.uploadList.length == 0) return this.$message.error("请先上传附件文件！"); |
|
this.collectionHandle.enclosureFiles = this.uploadList.map(e => e.url) |
|
this.collectionHandle.insuranceId = this.logId |
|
collection(this.collectionHandle).then(res=>{ |
|
this.$message.success("提交成功！"); |
|
this.logStatus = 1 |
|
this.$store.commit("logStatusData", { logStatus: 1 }); |
|
}).catch(err=>{ |
|
}) |
|
} |
|
}) |
|
}, |
|
//取消 |
|
collectionCancel(){ |
|
this.logStatus = 1 |
|
this.$store.commit("logStatusData", { logStatus: 1 }); |
|
}, |
|
//催收记录列表部分***** |
|
async collectionHisList(){ |
|
let res = await collectionHisList({ |
|
page: this.collectionHisPage, |
|
size: this.collectionHisSize, |
|
insuranceId: this.logId, |
|
startTime: this.collectionHisStartTime, |
|
endTime: this.collectionHisEndTime |
|
}); |
|
res.data.list.map(e =>{ |
|
let obj ={ |
|
"1":'电话催收', |
|
"2":'上门/外访', |
|
"3":"其他" |
|
} |
|
e.collectionMethod = obj[e.collectionMethod]||'未知状态' |
|
}) |
|
this.collectionHisData = res.data.list |
|
this.collectionHisTotals = res.data.totalCount |
|
|
|
}, |
|
collectionHisSearch(){ |
|
|
|
this.collectionHisPage = 1 |
|
this.collectionHisList() |
|
}, |
|
collectionHisPageChange(val){ |
|
this.collectionHisPage = val |
|
this.collectionHisList() |
|
}, |
|
// 选择时间 |
|
selectTime(val) { |
|
if (val) { |
|
this.collectionHisStartTime = val[0]; |
|
this.collectionHisEndTime = val[1]; |
|
} else { |
|
this.collectionHisStartTime = ''; |
|
this.collectionHisEndTime = ''; |
|
} |
|
}, |
|
collectionHisSelection(val){ |
|
this.collectionHisMultiple = val; |
|
}, |
|
// 导出催收记录列表 |
|
CollectionHisExport(){ |
|
// if(this.collectionHisMultiple.length != ''){ |
|
let exportIds = this.collectionHisMultiple.map(e => e.id).join() |
|
let url = `${excelCollectionHis}?ids=${exportIds}&insuranceId=`+this.logId |
|
window.location.href = url |
|
// }else{ |
|
// this.$message.error('请先选择催收记录列表数据 ！'); |
|
// } |
|
}, |
|
collectionHisSee(row){ |
|
this.logStatus = 4 |
|
this.$store.commit("logStatusData", { logStatus: 4 }); |
|
this.logbackStatus = '查看' |
|
this.$store.commit("logbackStatusData", { logbackStatus: '查看' }); |
|
this.logbackId = row.id |
|
this.$store.commit("logbackIdData", { logbackId: row.id }); |
|
}, |
|
// 催收记录列表点击查看 |
|
async collectionHisListDetail(){ |
|
let res = await collectionHisListDetail({ |
|
id: this.logbackId |
|
}); |
|
let data = res.data |
|
this.collectionHandle = { |
|
collectionMethod: String(res.data.collectionMethod), |
|
collectionTime: res.data.collectionTime, |
|
visitor:data.visitor, |
|
situationDescription:data.situationDescription, |
|
collectionFeedback: res.data.collectionFeedback, |
|
enclosureFiles: res.data.enclosureFiles, |
|
other:res.data.other |
|
} |
|
this.uploadList = [] |
|
if(res.data.enclosureFiles.length>0&&res.data.enclosureFiles[0]){ |
|
const newArr = res.data.enclosureFiles.map(item => ({name: item,url:item})) |
|
newArr.map(item => { |
|
let str = item.name.split('/') |
|
let len = str.length |
|
item.name = str[len-1] |
|
}) |
|
this.uploadList = newArr |
|
} |
|
this.collectionForm = res.data |
|
res.data.alRepaymentEntryList.map(e =>{ |
|
e.repaymentStatus = this.core.stcStatus(e.repaymentStatus) |
|
}) |
|
this.collectionData = res.data.alRepaymentEntryList |
|
} |
|
|
|
} |
|
} |
|
</script> |
|
<style lang="scss" scoped> |
|
/deep/ .el-radio__inner{ |
|
width: 16px; |
|
height: 16px; |
|
} |
|
/deep/ .el-radio.is-bordered{ |
|
padding-top: 0.58rem; |
|
} |
|
.radioInput{ |
|
display: inline-block; |
|
border:0; |
|
outline: none; |
|
width: 20rem; |
|
} |
|
</style> |
|
|
|
|