<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="solutionsId">
|
<el-select v-model="form.solutionsId" @change="selectSolutions" placeholder="请选择">
|
<el-option
|
v-for="item in solutions"
|
:key="item.baseId"
|
:label="item.name"
|
:value="item.baseId">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="保险生效起止期" prop="applyStartTime">
|
<div style="display: flex; flex-direction: column;">
|
<el-date-picker
|
@change="changeTime"
|
v-model="time"
|
type="daterange"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
format="yyyy-MM-dd HH:mm:ss"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期" />
|
<span style="color: #F95601; font-size: 14px;">（次日生效投保请于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="selectApplicationForm">选择申请单</el-button>
|
<el-button type="primary" @click="$refs.employeeList.open('投保员工名单')">查看名单</el-button>
|
</div>
|
</div>
|
<el-table
|
:data="list"
|
border
|
ref="multipleTable"
|
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="memberName"
|
label="被保险人">
|
</el-table-column>
|
<el-table-column
|
prop="idCard"
|
label="期望保险生效起期">
|
</el-table-column>
|
<el-table-column
|
prop="oldDuName"
|
label="期望保险生效止期">
|
</el-table-column>
|
<el-table-column
|
prop="oldWorkTypeName"
|
label="投保人数">
|
</el-table-column>
|
<el-table-column
|
prop="duName"
|
label="总费用">
|
</el-table-column>
|
<el-table-column
|
label="操作">
|
<template slot-scope="scope">
|
<el-button type="text" @click="$refs.employeeList.open('投保员工名单')">查看名单</el-button>
|
<el-button type="text" style="color: #ff0000;">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="info" v-if="item">
|
<span v-if="item.specialAgreement">{{item.specialAgreement}}</span>
|
<span v-if="item.specialInfo">{{item.specialInfo}}</span>
|
<span v-if="item.ortherInfo">{{item.ortherInfo}}</span>
|
</div>
|
<!-- 选择申请单 -->
|
<selectApplicationForm ref="selectApplicationForm" @success="getValue" />
|
<!-- 投保员工名单 -->
|
<employeeList ref="employeeList" />
|
</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'
|
export default {
|
name: 'factoryChange',
|
extends: BaseOpera,
|
components: { GlobalWindow, selectApplicationForm, employeeList },
|
data () {
|
return {
|
form: {
|
id: null,
|
solutionsId: '',
|
applyStartTime: '',
|
applyEndTime: ''
|
},
|
solutions: [],
|
list: [],
|
endTime: '',
|
item: null,
|
time: [],
|
// 验证规则
|
rules: {
|
applyStartTime: [
|
{ required: true, message: '请选择保险生效起期' }
|
],
|
solutionsName: [
|
{ required: true, message: '请选择保险方案' }
|
]
|
}
|
}
|
},
|
created () {
|
this.config({
|
api: '/business/insuranceApply',
|
'field.id': 'id'
|
})
|
},
|
methods: {
|
confirm() {
|
this.$confirm('确认提交，请仔细核对信息。', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
center: true
|
}).then(() => {
|
this.$message({
|
type: 'success',
|
message: '确定!'
|
});
|
}).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.applyStartTime = e[0]
|
this.form.applyEndTime = e[1]
|
} else {
|
this.form.applyStartTime = ''
|
this.form.applyEndTime = ''
|
}
|
},
|
open (title, target) {
|
this.getSolutions()
|
this.title = title
|
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({})
|
.then(res => {
|
this.solutions = res
|
})
|
},
|
// 选择保险单
|
selectSolutions(id) {
|
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 {
|
width: 100%;
|
font-size: 14px;
|
color: black;
|
}
|
</style>
|
