| <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="保险方案"> | 
|                     <span>{{form.solutionsName}}</span> | 
|                 </el-form-item> | 
|                 <el-form-item label="批单生效起期" prop="applyStartTime"> | 
|                     <div style="display: flex; flex-direction: column;"> | 
|                         <el-date-picker | 
|                             @change="changeApplyStartTime" | 
|                             v-model="form.applyStartTime" | 
|                             type="date" | 
|                             :picker-options="pickerOptions" | 
|                             value-format="yyyy-MM-dd HH:mm:ss" | 
|                             format="yyyy-MM-dd HH:mm:ss" | 
|                             placeholder="选择日期"> | 
|                         </el-date-picker> | 
|                         <span style="color: #F95601; font-size: 14px;">(次日生效投保请于17:30前提交,超时提交以保险单为准)</span> | 
|                     </div> | 
|                 </el-form-item> | 
|                 <el-form-item label="投保年龄" v-if="item"> | 
|                     <span>{{item.minAge}} 至 {{item.maxAge}}</span> | 
|                 </el-form-item> | 
|                 <el-form-item label="费用" v-if="item && item.solutionType==0"> | 
|                     <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> | 
|         </div> | 
|         <div class="desc_item_from"> | 
|             <el-table | 
|                 :data="list" | 
|                 border | 
|                 style="width: 100%"> | 
|                 <el-table-column | 
|                     prop="code" | 
|                     align="center" | 
|                     label="关联保单号"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="solutionsName" | 
|                     label="保险方案" | 
|                     align="center" | 
|                     width="180"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="startTime" | 
|                     align="center" | 
|                     label="保险生效起期"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="endTime" | 
|                     align="center" | 
|                     label="保险生效止期"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="insureNum" | 
|                     align="center" | 
|                     label="投保人数"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="serviceDays" | 
|                     align="center" | 
|                     label="在保时长(天)"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="currentFee" | 
|                     align="center" | 
|                     label="已产生费用(元)"> | 
|                 </el-table-column> | 
|                 <el-table-column | 
|                     prop="fee" | 
|                     align="center" | 
|                     label="总费用(元)"> | 
|                 </el-table-column> | 
|             </el-table> | 
|         </div> | 
|         <div class="desc_item_cate"> | 
|             <el-tabs v-model="activeName" @tab-click="handleClick"> | 
|                 <el-tab-pane label="加保员工" name="0"></el-tab-pane> | 
|                 <el-tab-pane label="减保员工" name="1"></el-tab-pane> | 
|             </el-tabs> | 
|         </div> | 
|         <div class="btns"> | 
|             <div class="btns_item"> | 
|                 <el-button type="primary" @click="seleUser">选取员工</el-button> | 
|                 <el-button type="primary" @click="uploadUser" v-if="activeName !== '1'">导入员工</el-button> | 
|                 <el-button type="primary" @click="addUser" v-if="activeName !== '1'">添加员工</el-button> | 
|                 <el-button type="danger" @click="deleItem">删除</el-button> | 
|             </div> | 
|             <div class="btns_item" v-if="activeName !== '1'"> | 
|                 <el-button type="primary" @click="sele">选取派遣单位</el-button> | 
|             </div> | 
|         </div> | 
|         <el-table | 
|             :data="activeName === '0' ? form.addDetailList : form.delDetailList" | 
|             border | 
|             show-summary | 
|             :summary-method="getSummaries" | 
|             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="memberName" | 
|                 label="姓名"> | 
|             </el-table-column> | 
|             <el-table-column | 
|                 prop="idCard" | 
|                 label="身份证号"> | 
|             </el-table-column> | 
|             <el-table-column | 
|                 label="年龄"> | 
|                 <template slot-scope="{row}"> | 
|                     <span style="color: red;" v-if="(getAgeByIdCard(row.idCard) < item.minAge) || (getAgeByIdCard(row.idCard) > item.maxAge)">{{getAgeByIdCard(row.idCard)}}</span> | 
|                     <span v-else>{{ getAgeByIdCard(row.idCard) }}</span> | 
|                 </template> | 
|             </el-table-column> | 
|             <el-table-column | 
|                 prop="duName" | 
|                 label="派遣单位"> | 
|             </el-table-column> | 
|             <el-table-column | 
|                 prop="workTypeName" | 
|                 label="所属工种"> | 
|             </el-table-column> | 
|             <el-table-column | 
|                 label="费用"> | 
|                 <template slot-scope="{row}"> | 
|                     <span v-if="activeName === '0'">{{row.fee}}</span> | 
|                     <span v-else>{{row.fee ? '-' + row.fee : ''}}</span> | 
|                 </template> | 
|             </el-table-column> | 
|             <el-table-column | 
|                 label="操作"> | 
|                 <template slot-scope="scope"> | 
|                     <el-button type="text" style="color: red;" @click="dele(scope.$index)">删除</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> | 
|         <!--    选择员工    --> | 
|         <selectEmployees ref="selectEmployees" @result="getValue" /> | 
|         <!--    添加员工    --> | 
|         <addEmployee ref="addEmployee" @result="getValue" /> | 
|         <!--    导入名单    --> | 
|         <importEmployees ref="importEmployees" @result="getValue" /> | 
|         <!--    确认工种    --> | 
|         <confirmJobType ref="confirmJobType" @result="getUser" /> | 
|         <!--    详情    --> | 
|         <ApplyChangeDetails1 ref="ApplyChangeDetails1" @success="success" /> | 
|     </GlobalWindow> | 
| </template> | 
|   | 
| <script> | 
| import BaseOpera from '@/components/base/BaseOpera' | 
| import GlobalWindow from '@/components/common/GlobalWindow' | 
| import selectEmployees from '@/components/enterprise/selectEmployees' | 
| import addEmployee from '@/components/enterprise/addEmployee' | 
| import importEmployees from '@/components/enterprise/importEmployees' | 
| import confirmJobType from '@/components/enterprise/confirmJobType' | 
| import ApplyChangeDetails1 from '@/components/business/ApplyChangeDetails1' | 
| import { all } from '@/api/business/solutions' | 
| import { getDetail } from '@/api/business/insuranceApply' | 
| import { create, getChangeCountCyclePriceVO } from '@/api/business/applyChange' | 
| import { getDate, compareDates, getTomorrow } from '@/utils/util' | 
| import { mapState } from 'vuex' | 
| export default { | 
|   name: 'additionSubtractionApplication', | 
|   extends: BaseOpera, | 
|   components: { GlobalWindow, selectEmployees, addEmployee, importEmployees, confirmJobType, ApplyChangeDetails1 }, | 
|   data () { | 
|     return { | 
|       form: { | 
|         id: null, | 
|         solutionId: '', | 
|         solutionsName: '', | 
|         applyStartTime: '', | 
|         applyEndTime: '', | 
|         addDetailList: [], | 
|         delDetailList: [] | 
|       }, | 
|       tempMemberIndex: -1, | 
|       activeName: '0', | 
|       pickerOptions: {}, | 
|       price: '', | 
|       endTime: '', //     实际保险生效止期 | 
|       company: [], | 
|       seleData: [], | 
|       item: null, | 
|       // 验证规则 | 
|       rules: { | 
|         applyStartTime: [ | 
|           { required: true, message: '请选择批单生效起期' } | 
|         ] | 
|       }, | 
|       list: [] | 
|     } | 
|   }, | 
|   computed: { | 
|     ...mapState(['userInfo']) | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       api: '/business/insuranceApply', | 
|       'field.id': 'id' | 
|     }) | 
|   }, | 
|   methods: { | 
|     open (title, target) { | 
|       this.title = title | 
|       this.form.addDetailList = [] | 
|       this.form.delDetailList = [] | 
|       this.list = [] | 
|       this.form.id = null | 
|       this.item = null | 
|       this.tempMemberIndex = -1 | 
|       this.form.solutionId = '' | 
|       this.form.solutionsName = '' | 
|       this.form.applyStartTime = '' | 
|       this.form.applyEndTime = '' | 
|       if (target && target.id) { | 
|         this.$nextTick(() => { | 
|           this.$refs.form.resetFields() | 
|           this.form.id = target.id | 
|           this.getDetails() | 
|         }) | 
|       } else { | 
|         this.$nextTick(() => { | 
|           this.$refs.form.resetFields() | 
|           this.form[this.configData['field.id']] = null | 
|         }) | 
|       } | 
|       this.getCompany() | 
|       this.visible = true | 
|       // this.updatePickerOptions() | 
|     }, | 
|     changeApplyStartTime (e) { | 
|       getChangeCountCyclePriceVO({ | 
|         applyId: this.form.id, | 
|         validTime: e | 
|       }).then(res => { | 
|         this.price = res.cyclePrice | 
|         this.form.addDetailList.forEach(item => { | 
|           item.fee = res.cyclePrice | 
|         }) | 
|         this.form.delDetailList.forEach(item => { | 
|           item.fee = res.cyclePrice | 
|         }) | 
|       }) | 
|     }, | 
|     handleClick (e) { | 
|       this.activeName = e.index | 
|     }, | 
|     // 获取投保详情 | 
|     getDetails () { | 
|       // findList({ applyId: this.form.id }) | 
|       //     .then(res => { | 
|       //         res.forEach(item => { | 
|       //             item.idCard = item.idcardNo | 
|       //             item.fee = '' | 
|       //         }) | 
|       //         this.tableData = res | 
|       //     }) | 
|       getDetail(this.form.id) | 
|         .then(res => { | 
|           this.list.push(res) | 
|           this.item = res | 
|           this.endTime = res.endTime | 
|           this.form.solutionId = res.solutionId | 
|           this.form.solutionsName = res.solutionsName | 
|           this.pickerOptions = { | 
|             disabledDate (time) { | 
|               // 当前日期大于等于生效日期并且最后一次操作时间等于空 | 
|               if ([1, 3].includes(compareDates(getDate(), res.startTime)) && !res.lastChangeDate) { | 
|                 return time.getTime() > new Date(res.endTime).getTime() || time.getTime() < new Date(getTomorrow()).getTime() | 
|                 // 当前日期小于生效日期并且最后一次操作时间等于空 | 
|               } else if (compareDates(getDate(), res.startTime) === 2 && !res.lastChangeDate) { | 
|                 return time.getTime() > new Date(res.endTime).getTime() || time.getTime() < new Date(res.startTime).getTime() | 
|                 // 最后一次操作时间有值 | 
|               } else if (res.lastChangeDate) { | 
|                 // 当前日期大于最后一次操作时间 | 
|                 if ([1, 3].includes(compareDates(getDate(), res.lastChangeDate))) { | 
|                   return time.getTime() > new Date(res.endTime).getTime() || time.getTime() < new Date(getTomorrow()).getTime() | 
|                   // 当前时间小于最后一次操作时间 | 
|                 } else if (compareDates(getDate(), res.lastChangeDate) === 2) { | 
|                   return time.getTime() > new Date(res.endTime).getTime() || time.getTime() < new Date(res.lastChangeDate).getTime() | 
|                 } | 
|               } | 
|             } | 
|           } | 
|           // this.changeSolution1(res.solutionId) | 
|         }) | 
|     }, | 
|     getSummaries (param) { | 
|       const { columns, data } = param | 
|       const sums = [] | 
|       columns.forEach((column, index) => { | 
|         if (index === 0) { | 
|           sums[index] = '总价' | 
|         } else if (index === 7) { | 
|           let total = 0 | 
|           if (this.activeName === '0') { | 
|             this.form.addDetailList.forEach(item => { | 
|               total += item.fee | 
|             }) | 
|             sums[index] = total.toFixed(2) | 
|           } else { | 
|             this.form.delDetailList.forEach(item => { | 
|               total += item.fee | 
|             }) | 
|             sums[index] = '-' + total.toFixed(2) | 
|           } | 
|         } | 
|       }) | 
|       return sums | 
|     }, | 
|     deleItem () { | 
|       if (this.seleData.length === 0) { | 
|         this.$message.warning('至少选择一项内容') | 
|         return | 
|       } | 
|       if (this.activeName === '0') { | 
|         this.seleData.forEach(item => { | 
|           this.form.addDetailList.forEach((row, index) => { | 
|             if (item === row.idCard) { | 
|               this.form.addDetailList.splice(index, 1) | 
|             } | 
|           }) | 
|         }) | 
|       } else { | 
|         this.seleData.forEach(item => { | 
|           this.form.delDetailList.forEach((row, index) => { | 
|             if (item === row.idCard) { | 
|               this.form.delDetailList.splice(index, 1) | 
|             } | 
|           }) | 
|         }) | 
|       } | 
|     }, | 
|     success () { | 
|       this.form.addDetailList.forEach(item => { | 
|         item.idcardNo = item.idCard | 
|       }) | 
|       this.form.delDetailList.forEach(item => { | 
|         item.idcardNo = item.idCard | 
|       }) | 
|       // let arr = JSON.parse(JSON.stringify(this.form.addDetailList)) | 
|       // arr.forEach(item => { | 
|       //     item.idcardNo = item.idCard | 
|       // }) | 
|       this.isWorking = true | 
|       create({ | 
|         applyId: this.form.id, | 
|         addDetailList: this.form.addDetailList, | 
|         delDetailList: this.form.delDetailList, | 
|         validTime: this.form.applyStartTime, | 
|         type: 0 | 
|       }).then(() => { | 
|         this.visible = false | 
|         this.$tip.apiSuccess('操作成功') | 
|         this.$emit('success') | 
|       }).catch(e => { | 
|         this.$tip.apiFailed(e) | 
|       }).finally(() => { | 
|         this.isWorking = false | 
|       }) | 
|     }, | 
|     confirm () { | 
|       this.$refs.form.validate((valid) => { | 
|         if (valid) { | 
|           // if (this.form.addDetailList.length === 0) { | 
|           //     this.$message.warning('至少添加一项员工') | 
|           //     return | 
|           // } | 
|           for (let i = 0; i < this.form.addDetailList.length; i++) { | 
|             if (!this.form.addDetailList[i].worktypeId || !this.form.addDetailList[i].duId) { | 
|               this.$message.warning('请完善加保派遣单位和工种信息') | 
|               return | 
|             } | 
|           } | 
|           for (let i = 0; i < this.form.delDetailList.length; i++) { | 
|             if (!this.form.delDetailList[i].worktypeId || !this.form.delDetailList[i].duId) { | 
|               this.$message.warning('请完善减保派遣单位和工种信息') | 
|               return | 
|             } | 
|           } | 
|   | 
|           this.$refs.ApplyChangeDetails1.open('加减保详单', this.form.addDetailList, this.form.delDetailList, { | 
|             companyName: this.userInfo.company.name, | 
|             solutionsName: this.form.solutionsName, | 
|             code: this.list[0].code, | 
|             startTime: this.list[0].startTime, | 
|             endTime: this.list[0].endTime, | 
|             applyStartTime: this.form.applyStartTime | 
|           }) | 
|   | 
|           // return | 
|   | 
|           // this.form.addDetailList.forEach(item => { | 
|           //     item.idcardNo = item.idCard | 
|           // }) | 
|           // this.form.delDetailList.forEach(item => { | 
|           //     item.idcardNo = item.idCard | 
|           // }) | 
|           // // let arr = JSON.parse(JSON.stringify(this.form.addDetailList)) | 
|           // // arr.forEach(item => { | 
|           // //     item.idcardNo = item.idCard | 
|           // // }) | 
|           // this.isWorking = true | 
|           // create({ | 
|           //     applyId: this.form.id, | 
|           //     addDetailList: this.form.addDetailList, | 
|           //     delDetailList: this.form.delDetailList, | 
|           //     validTime: this.form.applyStartTime, | 
|           //     type: 0 | 
|           // }).then(() => { | 
|           //     this.visible = false | 
|           //     this.$tip.apiSuccess('操作成功') | 
|           //     this.$emit('success') | 
|           // }).catch(e => { | 
|           //     this.$tip.apiFailed(e) | 
|           // }).finally(() => { | 
|           //     this.isWorking = false | 
|           // }) | 
|         } | 
|       }) | 
|     }, | 
|     seleUser () { | 
|       if (!this.form.solutionId) { | 
|         this.$message.warning('请先选择保险方案') | 
|         return | 
|       } | 
|       if (!this.form.applyStartTime) { | 
|         this.$message.warning('请先选择批单生效起期') | 
|         return | 
|       } | 
|       if (this.activeName === '0') { | 
|         this.$refs.selectEmployees.open('选取员工', { arr: this.form.addDetailList, price: this.price, notInInsuranceApplyId: this.form.id, validTime: this.form.applyStartTime }) | 
|       } else { | 
|         this.$refs.selectEmployees.open('选取员工', { arr: this.form.delDetailList, price: this.price, insuranceApplyId: this.form.id, validTime: this.form.applyStartTime }) | 
|       } | 
|     }, | 
|     addUser () { | 
|       if (!this.form.solutionId) { | 
|         this.$message.warning('请先选择保险方案') | 
|         return | 
|       } | 
|       if (this.activeName === '0') { | 
|         this.$refs.addEmployee.open('添加员工', { arr: this.form.addDetailList, price: this.price }) | 
|       } else { | 
|         this.$refs.addEmployee.open('添加员工', { arr: this.form.delDetailList, price: this.price }) | 
|       } | 
|     }, | 
|     uploadUser () { | 
|       if (!this.form.solutionId) { | 
|         this.$message.warning('请先选择保险方案') | 
|         return | 
|       } | 
|       if (this.activeName === '0') { | 
|         this.$refs.importEmployees.open('上传名单', { arr: this.form.addDetailList, price: this.price, solutionId: this.form.solutionId }) | 
|       } else { | 
|         this.$refs.importEmployees.open('上传名单', { arr: this.form.delDetailList, price: this.price, solutionId: this.form.solutionId }) | 
|       } | 
|     }, | 
|     // 切换方案 | 
|     changeSolution1 (e) { | 
|       this.company.forEach(item => { | 
|         console.log(item.id + '-----' + e) | 
|         if (item.id === e) { | 
|           console.log(item) | 
|           this.item = item | 
|         } | 
|       }) | 
|       // this.tableData.forEach(item => { | 
|       //     item.fee = this.price | 
|       // }) | 
|     }, | 
|     dele (index) { | 
|       if (this.activeName === '0') { | 
|         this.form.addDetailList.splice(index, 1) | 
|       } else { | 
|         this.form.delDetailList.splice(index, 1) | 
|       } | 
|     }, | 
|     getUser (obj) { | 
|       console.log(this.seleData) | 
|       this.seleData.forEach(item => { | 
|         if (this.activeName === '0') { | 
|           this.form.addDetailList.forEach(row => { | 
|             if (item === row.idCard) { | 
|               row.workTypeName = obj.workTypeName | 
|               row.worktypeId = obj.worktypeId | 
|               row.duName = obj.duName | 
|               row.duId = obj.duId | 
|             } | 
|           }) | 
|         } else { | 
|           this.form.delDetailList.forEach(row => { | 
|             if (item === row.idCard) { | 
|               row.workTypeName = obj.workTypeName | 
|               row.worktypeId = obj.worktypeId | 
|               row.duName = obj.duName | 
|               row.duId = obj.duId | 
|             } | 
|           }) | 
|         } | 
|       }) | 
|       this.seleData = [] | 
|       this.$refs.multipleTable.clearSelection() | 
|     }, | 
|     // 选择员工 | 
|     sele () { | 
|       if (!this.form.solutionId) { | 
|         this.$message.warning('请选择保险方案') | 
|         return | 
|       } | 
|       if (this.seleData.length === 0) { | 
|         this.$message.warning('请选择员工') | 
|         return | 
|       } | 
|       this.$refs.confirmJobType.open('确认工种', { solutionId: this.item.newVersionSolutionId }) | 
|     }, | 
|     // 查询全部方案 | 
|     getCompany () { | 
|       all({ dataType: 2 }) | 
|         .then(res => { | 
|           this.company = res | 
|         }) | 
|     }, | 
|     getAgeByIdCard (idCard) { | 
|       const sexAndAge = {} | 
|       // 获取用户身份证号码 | 
|       const userCard = idCard | 
|       // 如果用户身份证号码为undefined则返回空 | 
|       if (!userCard) { | 
|         return sexAndAge | 
|       } | 
|       // 获取出生日期 | 
|       const yearBirth = userCard.substring(6, 10) | 
|       const monthBirth = userCard.substring(10, 12) | 
|       const dayBirth = userCard.substring(12, 14) | 
|       // 获取当前年月日并计算年龄 | 
|       const myDate = new Date() | 
|       const monthNow = myDate.getMonth() + 1 | 
|       const dayNow = myDate.getDate() | 
|       let age = myDate.getFullYear() - yearBirth | 
|       if (monthNow < monthBirth || (monthNow == monthBirth && dayNow < dayBirth)) { | 
|         age-- | 
|       } | 
|       // 得到年龄 | 
|       sexAndAge.age = age | 
|       return sexAndAge.age | 
|     }, | 
|     handleSelectionChange (e) { | 
|       this.seleData = e.map(item => item.idCard) | 
|     }, | 
|     getValue (list) { | 
|       list.forEach(item => { | 
|         const temIndex = this.tempMemberIndex | 
|         item.id = temIndex | 
|         item.name = item.memberName | 
|         this.tempMemberIndex = this.tempMemberIndex - 1 | 
|       }) | 
|       if (this.activeName === '0') { | 
|         this.form.addDetailList.push(...list) | 
|       } else { | 
|         this.form.delDetailList.push(...list) | 
|       } | 
|     } | 
|   } | 
| } | 
| </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_from { | 
|         width: 100%; | 
|         margin-bottom: 10px; | 
|         .desc_item_from_page { | 
|             width: 100%; | 
|             display: flex; | 
|             align-items: center; | 
|             justify-content: end; | 
|             margin-top: 10px; | 
|         } | 
|     } | 
|     .desc_item_cate { | 
|         width: 100%; | 
|         margin-bottom: 10px; | 
|     } | 
|     .info { | 
|         width: 100%; | 
|         font-size: 14px; | 
|         color: black; | 
|     } | 
| </style> |