| <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: #F95601; font-size: 14px;">(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: #F95601; font-size: 14px;">(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="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: #F95601; font-size: 14px;width: 100%;text-align: left">(3. 请先选择至少一条申请后提交投保申请)</div> | 
|         <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" /> | 
|       <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] | 
|         this.form.endDate = e[1] | 
|       } 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> |