<template>
|
<GlobalWindow
|
:title="title"
|
width="100%"
|
text="加减保申请"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<div class="list">
|
<el-form :inline="true" ref="form" :model="form" :rules="rules" class="demo-form-inline">
|
<el-form-item label=" " prop="unionApplyId" >
|
<div style=" display: flex; flex-direction: column;">
|
<el-button type="primary" size="small" @click="selectBaoxiandan"> 选择保险单</el-button>
|
<span style="color: orange; font-size: 14px;"><i class="el-icon-warning"></i>1. 请选择保险单后进行操作</span>
|
</div>
|
</el-form-item>
|
<!-- <el-form-item label="申请日期：" prop="applyDate" style="margin-left: 40px">
|
<div style="display: flex; flex-direction: column;">
|
<el-date-picker
|
v-model="form.applyDate"
|
type="date"
|
:picker-options="pickerOptions"
|
format="yyyy-MM-dd"
|
placeholder="请选择日期"
|
value-format="yyyy-MM-dd" />
|
<span style="color: #F95601; font-size: 14px;">（2. 次日生效投保请于17:30前提交，超时提交以保险单为准）</span>
|
</div>
|
</el-form-item>-->
|
<el-form-item label="费用" v-if="model">
|
<span>{{model.price}} 元</span>
|
<span v-if="model.timeUnit === 0">/天</span>
|
<span v-if="model.timeUnit === 1">/半月</span>
|
<span v-if="model.timeUnit === 2">/月</span>
|
<span v-if="model.timeUnit === 3">/年</span>
|
<span>/人</span>
|
</el-form-item>
|
<el-form-item label="投保年龄" v-if="item">
|
<span>{{model.minAge}} 至 {{model.maxAge}}</span>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div style="display: block;margin:0 0 30px 30px " v-if="model">
|
<div style="display: inline-block;width: 300px">保险方案：{{model.solutionName}}</div>
|
<div style="display: inline-block">保单号：{{model.code}}</div>
|
</div>
|
<el-table
|
:data="list"
|
border
|
ref="multipleTable"
|
@row-click="rowselect"
|
@selection-change="handleSelectionChange"
|
style="width: 100%;margin-bottom: 15px;">
|
<el-table-column
|
type="selection"
|
width="55">
|
</el-table-column>
|
<el-table-column label="序号" width="80px">
|
<template slot-scope="scope">
|
<span>{{scope.$index + 1}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="companyName"
|
label="被保险人">
|
</el-table-column>
|
<el-table-column
|
prop="applyStartTime"
|
label="批增生效日期">
|
</el-table-column>
|
<el-table-column
|
prop="delValidTime"
|
label="批减生效日期">
|
</el-table-column>
|
<el-table-column
|
prop="addNum"
|
label="加保人数">
|
</el-table-column>
|
<el-table-column
|
prop="delNum"
|
label="减保人数">
|
</el-table-column>
|
<el-table-column
|
prop="fee"
|
label="费用变更">
|
</el-table-column>
|
<el-table-column label="操作">
|
<template slot-scope="{row}">
|
<el-button type="text" @click="checkDetial(row)">查看名单</el-button>
|
<!-- <el-button type="text" style="color: #ff0000;">删除</el-button>-->
|
</template>
|
</el-table-column>
|
</el-table>
|
<div style="color: orange; font-size: 14px;width: 100%;text-align: left"><i class="el-icon-warning"></i>2. 请先选择至少一条申请后提交投保申请</div>
|
<div class="info" v-if="model">
|
<span v-if="model.specialAgreement" v-html="model.specialAgreement"></span>
|
<span v-if="model.specialInfo" v-html="model.specialInfo"> </span>
|
<span v-if="model.ortherInfo" v-html="model.ortherInfo"> </span>
|
</div>
|
<!-- 选择申请单 -->
|
<ApplyChangeDetails ref="ApplyChangeDetails" @success="getValue" />
|
<el-dialog
|
title="选择保险单"
|
:visible.sync="visibleSelect"
|
width="80%"
|
:modal="true"
|
:show-close="false"
|
append-to-body
|
center>
|
<div class="desc_item_from" id="selectTable">
|
<div style="width: 100%; text-align: right; align-items: center;margin-bottom: 10px">
|
<span class="tip-warn" style="color: orange; font-size: 14px; margin-right: 20px ;text-align: left">
|
<i class="el-icon-warning"></i>注：只能选择申请单数大于0的申请记录进行操作
|
</span>
|
<el-checkbox :true-label="1" :false-label="0" v-model="hasApplying" style="font-size: 12px;" @change="handleCurrentChange(1)">只显示有申请单记录</el-checkbox>
|
</div>
|
<el-table
|
border
|
ref="multipleTable1"
|
v-loading="isWorking.search"
|
:data="tableData"
|
stripe
|
>
|
<el-table-column label="序号" width="80px">
|
<template slot-scope="scope">
|
<span>{{scope.$index + 1}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="statusInfo" label="状态" min-width="100px">
|
<template slot-scope="{row}">
|
<span :class="'union-apply-status'+row.status" >{{ row.statusInfo}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="code" label="保单号" min-width="100px"></el-table-column>
|
<el-table-column prop="solutionName" label="保险方案" min-width="100px"></el-table-column>
|
<el-table-column prop="insureNum" label="投保人数" min-width="90px"></el-table-column>
|
<el-table-column prop="guaranteeNum" label="在保人数" min-width="90px"></el-table-column>
|
<el-table-column prop="addApplyNum" label="申请单数" min-width="80px"></el-table-column>
|
<el-table-column prop="fee" label="总费用（元）" min-width="100px"></el-table-column>
|
<el-table-column prop="createDate" label="提交时间" min-width="180px"></el-table-column>
|
<el-table-column
|
label="操作"
|
min-width="100"
|
fixed="right"
|
align="center"
|
>
|
<template slot-scope="{row}">
|
<el-button v-if="row.addApplyNum >0" type="primary" @click="selectDo(row)">选择</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="desc_item_from_page">
|
<el-pagination
|
@current-change="handleCurrentChange"
|
:current-page="currentPage1"
|
:page-size="10"
|
layout="total, prev, pager, next, jumper"
|
:total="tableTotal">
|
</el-pagination>
|
</div>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<!-- <el-button type="primary" @click="selectDo()">确 定</el-button>-->
|
<el-button @click="model=null;visibleSelect=false">取 消</el-button>
|
</span>
|
</el-dialog>
|
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import selectApplicationForm from '@/components/business/selectApplicationForm'
|
import { listAll } from '@/api/business/applyChange'
|
import { merge } from '@/api/business/unionChange'
|
import ApplyChangeDetails from '@/components/business/ApplyChangeDetails'
|
import { fetchList as pageUnionList } from '@/api/business/unionApply'
|
import {getDetail} from "@/api/business/insuranceApply";
|
import {compareDates, getDate, getTomorrow} from "@/utils/util";
|
export default {
|
name: 'add_subtract_entrust',
|
extends: BaseOpera,
|
components: { GlobalWindow, ApplyChangeDetails,selectApplicationForm },
|
data () {
|
return {
|
form: {
|
unionApplyId: null,
|
applyIds: [],
|
applyDate: null,
|
businessType: 0
|
},
|
hasApplying:0,
|
pickerOptions: {},
|
visibleSelect: true,
|
solutions: [],
|
currentPage1:1,
|
list: [],
|
tableData:null,
|
tableTotal:0,
|
endTime: '',
|
item: null,
|
model: null,
|
time: [],
|
// 验证规则
|
rules: {
|
unionApplyId: [
|
{ required: true, message: '请选择保险单' }
|
],
|
// applyDate: [
|
// { required: true, message: '请选择保险生效起期' }
|
// ]
|
}
|
}
|
},
|
created () {
|
this.config({
|
api: '/business/insuranceApply',
|
'field.id': 'id'
|
})
|
/* var now = new Date()
|
var start = now.setDate(now.getDate()+1)
|
var end = now.setDate(now.getDate()+10)
|
this.pickerOptions = {
|
disabledDate (time) {
|
console.log(( time.getTime() < start.getTime() || time.getTime()>end.getTime()))
|
return ( time.getTime() < start.getTime() || time.getTime()>end.getTime())
|
}
|
}*/
|
},
|
methods: {
|
rowselect(row){
|
this.$refs.multipleTable.toggleRowSelection(row,true);
|
},
|
rowselect1(row){
|
this.$refs.multipleTable1.toggleRowSelection(row,true);
|
},
|
checkDetial(row){
|
getDetail(row.applyId).then(res => {
|
// this.apply = res
|
this.$refs.ApplyChangeDetails.open('加减保人员名单',res, row,2)
|
}).catch(err => {
|
})
|
},
|
handleSelectionChange(rows){
|
this.form.applyIds = []
|
// 假设取出 id 字段
|
rows.forEach(item => {
|
const id = item.id
|
if ( this.form.applyIds.indexOf(id) === -1) {
|
this.form.applyIds.push(id)
|
}
|
})
|
},
|
handleSelectionChange1 (rows) {
|
console.log(rows)
|
if (rows.length > 1) {
|
// clearSelection 用于多选表格，清空用户的选择
|
this.$refs.multipleTable1.clearSelection();
|
this.$refs.multipleTable1.toggleRowSelection(rows[rows.length-1]);
|
}
|
if (rows.length >= 1) {
|
// 选中的行对像放进数组，方便后续对数据进行操作
|
this.model =rows[rows.length-1]
|
} else if (rows.length === 0) {
|
this.model = null
|
}
|
},
|
convertToDate(dateString) {
|
try {
|
const parts = dateString.split(/[- : \/]/);
|
const monthIndex = parts[1] - 1
|
const convertedDate = new Date( parts[0], monthIndex, parts[2], parts[3], parts[5], parts[6] )
|
return convertedDate
|
}catch (e) {
|
return new Date()
|
}
|
},
|
selectDo(row){
|
this.model =row
|
if(!this.model){
|
this.$tip.apiFailed({
|
type: 'error',
|
message: '请选择至少一条申请记录进行操作'
|
})
|
return
|
}
|
this.form.applyDate=null
|
this.visibleSelect=false
|
this.form.unionApplyId = this.model.id
|
var that =this
|
this.pickerOptions = {
|
disabledDate (time) {
|
var start = new Date(that.model.startTime)
|
start.setDate(start.getDate() + 1)
|
var end = new Date(that.model.endTime)
|
// console.log(end )
|
// console.log(time )
|
return ( time.getTime() < start.getTime() || time.getTime()>end.getTime())
|
}
|
}
|
|
this.getList();
|
},
|
selectDoOld(){
|
if(!this.model){
|
this.$tip.apiFailed({
|
type: 'error',
|
message: '请选择至少一条申请记录进行操作'
|
})
|
return
|
}
|
this.form.applyDate=null
|
this.visibleSelect=false
|
this.form.unionApplyId = this.model.id
|
var that =this
|
this.pickerOptions = {
|
disabledDate (time) {
|
var start = new Date(that.model.startTime)
|
start.setDate(start.getDate() + 1);
|
var end = new Date(that.model.endTime)
|
// console.log(end )
|
// console.log(time )
|
return ( time.getTime() < start.getTime() || time.getTime()>end.getTime())
|
}
|
}
|
|
this.getList();
|
},
|
confirm () {
|
this.$refs.form.validate((valid) => {
|
// debugger
|
if (!valid) {
|
return
|
}
|
if(this.form.applyIds == null || this.form.applyIds.length ===0){
|
this.$tip.apiFailed({
|
type: 'error',
|
message: '请选择至少一条申请记录进行投保申请！!'
|
})
|
return;
|
}
|
this.$confirm('确认提交，请仔细核对信息。', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
center: true
|
}).then(() => {
|
merge(this.form)
|
.then(response => {
|
this.$message({
|
type: 'success',
|
message: '提交成功!'
|
})
|
this.visible = false
|
this.$emit('success')
|
}).catch(err => {
|
this.$tip.apiFailed(err)
|
})
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '取消'
|
})
|
})
|
})
|
},
|
open (title, target) {
|
this.title = title
|
this.model= null
|
this.list= []
|
this.visibleSelect=false
|
this.tableData=[]
|
this.tableTotal=0
|
this.item= null
|
if (target) {
|
this.$nextTick(() => {
|
this.$refs.form.resetFields()
|
})
|
} else {
|
this.$nextTick(() => {
|
this.$refs.form.resetFields()
|
this.form[this.configData['field.id']] = null
|
})
|
}
|
// this.getUnionApplyList()
|
this.visible = true
|
},
|
getValue(){
|
|
},
|
selectBaoxiandan(){
|
this.currentPage1 = 1
|
this.visibleSelect=true
|
this.getUnionApplyList()
|
},
|
getUnionApplyList() {
|
pageUnionList({
|
capacity: 10,
|
page: this.currentPage1,
|
model: {
|
queryFlag: 1,
|
hasApplying: this.hasApplying,
|
status: 3
|
}
|
}).then(res => {
|
this.$nextTick(() => {
|
this.tableData = res.records
|
this.tableTotal = res.total
|
if (this.$refs.multipleTable1 && this.$refs.multipleTable1.doLayout) {
|
this.$refs.multipleTable1.doLayout()
|
}
|
})
|
})
|
},
|
getList () {
|
listAll({
|
solutionType: 1,
|
type: 0,
|
unionApplyId: this.model.id,
|
status: 7
|
}).then(res => {
|
this.list = res
|
this.$nextTick(() => {
|
if (this.$refs.multipleTable && this.$refs.multipleTable.doLayout) {
|
this.$refs.multipleTable.doLayout()
|
}
|
})
|
})
|
},
|
handleCurrentChange (val) {
|
this.currentPage1 = val
|
this.getUnionApplyList()
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.list {
|
width: 100%;
|
}
|
.btns {
|
width: 100%;
|
margin-bottom: 15px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.btns_item {
|
display: flex;
|
align-items: center;
|
}
|
}
|
::v-deep .desc_item_from .el-table__header .el-checkbox{
|
display:none!important;
|
}
|
::v-deep .el-checkbox__label{
|
font-size: 12px;
|
}
|
.submit {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-bottom: 15px;
|
}
|
.desc_item_cate {
|
width: 100%;
|
margin-bottom: 10px;
|
}
|
.info {
|
margin-top: 30px;
|
width: 100%;
|
font-size: 14px;
|
color: black;
|
}
|
</style>
|
