<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="baseSolutionId">
|
<div style="display: flex; flex-direction: column;">
|
<el-select v-model="form.baseSolutionId" @change="selectSolutions" placeholder="请选择">
|
<el-option
|
v-for="item in solutions"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
<span style="color: orange; font-size: 14px;"><i class="el-icon-warning"></i>1. 请先选择方案查看申请记录</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="保险生效起止期：" prop="startDate" style="margin-left: 40px">
|
<div style="display: flex; flex-direction: column;">
|
<el-date-picker
|
@change="changeTime"
|
v-model="time"
|
type="daterange"
|
format="yyyy 年 MM 月 dd 日"
|
value-format="yyyy-MM-dd"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期" />
|
<span style="color: orange; font-size: 14px;"><i class="el-icon-warning"></i>2. 次日生效投保请于17:30前提交，超时提交以保险单为准</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="费用" v-if="item">
|
<span>{{item.price}} 元</span>
|
<span v-if="item.timeUnit === 0">/天</span>
|
<span v-if="item.timeUnit === 1">/半月</span>
|
<span v-if="item.timeUnit === 2">/月</span>
|
<span v-if="item.timeUnit === 3">/年</span>
|
<span>/人</span>
|
</el-form-item>
|
<el-form-item label="投保年龄" v-if="item">
|
<span>{{item.minAge}} 至 {{item.maxAge}}</span>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div class="btns">
|
<div class="btns_item">
|
<!-- <el-button type="primary" @click="selectAll">权限</el-button>-->
|
<!-- <el-button type="primary" @click="$refs.employeeList.open('投保员工名单')">查看名单</el-button>-->
|
</div>
|
</div>
|
<el-table
|
:data="list"
|
border
|
ref="multipleTable"
|
@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="applyEndTime"
|
label="期望保险生效止期">
|
</el-table-column>
|
<el-table-column
|
prop="insureNum"
|
label="投保人数">
|
</el-table-column>
|
<el-table-column
|
prop="guaranteeNum"
|
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="$refs.InsuranceDetails.open('投保人员名单',row,2)">查看名单</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>3. 请先选择至少一条申请后提交投保申请</div>
|
<div class="info" v-if="item">
|
<span v-if="item.specialAgreement" v-html="item.specialAgreement"></span>
|
<span v-if="item.specialInfo" v-html="item.specialInfo"></span>
|
<span v-if="item.ortherInfo" v-html="item.ortherInfo"></span>
|
</div>
|
<!-- 选择申请单 -->
|
<selectApplicationForm ref="selectApplicationForm" @success="getValue" />
|
<!-- 投保员工名单 -->
|
<employeeList ref="employeeList" />
|
<InsuranceDetails ref="InsuranceDetails" @success="getValue" />
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import selectApplicationForm from '@/components/business/selectApplicationForm'
|
import employeeList from '@/components/business/employeeList'
|
import { all } from '@/api/business/solutions'
|
import { findAllApply } from '@/api/business/insuranceApply'
|
import InsuranceDetails from '@/components/business/InsuranceDetails'
|
import { merge } from '@/api/business/unionApply'
|
export default {
|
name: 'OpearaUnionApply',
|
extends: BaseOpera,
|
components: { GlobalWindow, InsuranceDetails,selectApplicationForm, employeeList },
|
data () {
|
return {
|
form: {
|
baseSolutionId: null,
|
applyIds: [],
|
startDate: null,
|
endDate: null
|
},
|
solutions: [],
|
list: [],
|
endTime: '',
|
item: null,
|
time: [],
|
// 验证规则
|
rules: {
|
baseSolutionId: [
|
{ required: true, message: '请选择保险方案' }
|
],
|
startDate: [
|
{ required: true, message: '请选择保险生效起期' }
|
]
|
}
|
}
|
},
|
created () {
|
this.config({
|
api: '/business/insuranceApply',
|
'field.id': 'id'
|
})
|
},
|
methods: {
|
handleSelectionChange (val) {
|
// this.multipleSelection = val;
|
this.form.applyIds = []
|
// 假设取出 id 字段
|
val.forEach(item => {
|
const id = item.id
|
if ( this.form.applyIds.indexOf(id) === -1) {
|
this.form.applyIds.push(id)
|
}
|
})
|
},
|
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: '取消'
|
})
|
})
|
})
|
},
|
getValue (e) {
|
console.log(e)
|
},
|
selectApplicationForm () {
|
if (!this.form.solutionsId) return this.$message.warning('请先选择保险方案')
|
this.$refs.selectApplicationForm.open('选择申请单', this.form.solutionsId)
|
},
|
changeTime (e) {
|
if (e.length > 0) {
|
this.form.startDate = e[0]+ ' 00:00:00'
|
this.form.endDate = e[1] + ' 23:59:59'
|
} else {
|
this.form.startDate = ''
|
this.form.endDate = ''
|
}
|
},
|
open (title, target) {
|
this.getSolutions()
|
this.title = title
|
this.solutions= []
|
this.list= []
|
this.item= null
|
this.time= []
|
if (target) {
|
this.$nextTick(() => {
|
this.$refs.form.resetFields()
|
})
|
} else {
|
this.$nextTick(() => {
|
this.$refs.form.resetFields()
|
this.form[this.configData['field.id']] = null
|
})
|
}
|
this.visible = true
|
},
|
// 查询全部方案
|
getSolutions () {
|
all({ dataType: 0, type: 1 })
|
.then(res => {
|
this.solutions = res
|
})
|
},
|
search () {
|
this.currentPage = 1
|
this.getList()
|
},
|
getList () {
|
findAllApply({
|
baseSolutionId: this.form.baseSolutionId,
|
status: 23
|
}).then(res => {
|
this.list = res
|
this.total=this.list ?this.list.length:0
|
this.$nextTick(() => {
|
if (this.$refs.table && this.$refs.table.doLayout) {
|
this.$refs.table.doLayout()
|
}
|
})
|
})
|
},
|
// 选择保险单
|
selectSolutions (id) {
|
this.search()
|
this.solutions.forEach(item => {
|
if (item.id === id) {
|
this.item = item
|
}
|
})
|
}
|
}
|
}
|
</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;
|
}
|
}
|
.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>
|
