<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 
 | 
                            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"> 
 | 
                    <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="btns"> 
 | 
            <div class="btns_item"> 
 | 
                <el-button type="primary" @click="seleUser">选取员工</el-button> 
 | 
                <el-button type="danger" @click="deleItem">删除</el-button> 
 | 
            </div> 
 | 
            <div class="btns_item"> 
 | 
                <el-button type="primary" @click="sele">选取派遣单位</el-button> 
 | 
            </div> 
 | 
        </div> 
 | 
        <el-table 
 | 
                :data="form.factory" 
 | 
                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="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 
 | 
                    prop="workTypeName" 
 | 
                    label="变更后所属工种"> 
 | 
            </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" /> 
 | 
    </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 { all } from '@/api/business/solutions' 
 | 
    import { getDetail, findList } from '@/api/business/insuranceApply' 
 | 
    import { create, update, applyChagneDetailList } from '@/api/business/applyChange' 
 | 
    export default { 
 | 
        name: 'editFactoryChange', 
 | 
        extends: BaseOpera, 
 | 
        components: { GlobalWindow, selectEmployees, addEmployee, importEmployees, confirmJobType }, 
 | 
        data () { 
 | 
            return { 
 | 
                form: { 
 | 
                    id: null, 
 | 
                    applyChangId: '', 
 | 
                    solutionId: '', 
 | 
                    solutionsName: '', 
 | 
                    applyStartTime: '', 
 | 
                    applyEndTime: '', 
 | 
                    factory: [] 
 | 
                }, 
 | 
                pickerOptions: {}, 
 | 
                price: '', 
 | 
                endTime: '',    //     实际保险生效止期 
 | 
                company: [], 
 | 
                seleData: [], 
 | 
                item: null, 
 | 
                // 验证规则 
 | 
                rules: { 
 | 
                    applyStartTime: [ 
 | 
                        { required: true, message: '请选择批单生效起期' } 
 | 
                    ] 
 | 
                }, 
 | 
                list: [] 
 | 
            } 
 | 
        }, 
 | 
        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.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.form.applyChangId = target.applyChangId 
 | 
                        this.getDetails() 
 | 
                        this.getapplyChagneDetailList() 
 | 
                    }) 
 | 
                } else { 
 | 
                    this.$nextTick(() => { 
 | 
                        this.$refs.form.resetFields() 
 | 
                        this.form[this.configData['field.id']] = null 
 | 
                    }) 
 | 
                } 
 | 
                this.getCompany() 
 | 
                this.visible = true 
 | 
                // this.updatePickerOptions() 
 | 
            }, 
 | 
            // 获取换厂人员 
 | 
            getapplyChagneDetailList() { 
 | 
                applyChagneDetailList({ 
 | 
                    applyChangId: this.form.applyChangId, 
 | 
                    types: [2] 
 | 
                }).then(res => { 
 | 
                    res.forEach(item => { 
 | 
                        item.idCard = item.memberIdcardNo 
 | 
                        item.oldDuId = item.duId 
 | 
                        item.oldDuName = item.duName 
 | 
                        item.oldWorkTypeName = item.workTypeName 
 | 
                        item.oldWorktypeId = item.worktypeId 
 | 
                        item.workTypeName = '' 
 | 
                        item.worktypeId = '' 
 | 
                        item.duId = '' 
 | 
                        item.duName = '' 
 | 
                    }) 
 | 
                    this.form.factory = res 
 | 
                }) 
 | 
            }, 
 | 
            // 获取投保详情 
 | 
            getDetails() { 
 | 
                findList({ applyId: this.form.id }) 
 | 
                    .then(res => { 
 | 
                        res.forEach(item => { 
 | 
                            item.idCard = item.idcardNo 
 | 
                            item.fee = '' 
 | 
                        }) 
 | 
                        res.forEach(item => { 
 | 
                            item.oldDuId = item.duId 
 | 
                            item.oldDuName = item.duName 
 | 
                            item.oldWorkTypeName = item.workTypeName 
 | 
                            item.oldWorktypeId = item.worktypeId 
 | 
                            item.workTypeName = '' 
 | 
                            item.worktypeId = '' 
 | 
                            item.duId = '' 
 | 
                            item.duName = '' 
 | 
                        }) 
 | 
                        // this.form.factory = res 
 | 
                    }) 
 | 
                getDetail(this.form.id) 
 | 
                    .then(res => { 
 | 
                        this.list.push(res) 
 | 
                        this.endTime = res.endTime 
 | 
                        this.form.solutionId = res.solutionId 
 | 
                        this.form.solutionsName = res.solutionsName 
 | 
                        this.pickerOptions = { 
 | 
                            disabledDate(time) { 
 | 
                                // - 8.64e7 
 | 
                                return time.getTime() > new Date(res.endTime).getTime() || time.getTime() < new Date().getTime() 
 | 
                            } 
 | 
                        }; 
 | 
                        this.changeSolution1(res.solutionId) 
 | 
                    }) 
 | 
            }, 
 | 
            deleItem() { 
 | 
                if (this.seleData.length === 0) { 
 | 
                    this.$message.warning('至少选择一项内容') 
 | 
                    return 
 | 
                } 
 | 
                this.seleData.forEach(item => { 
 | 
                    this.form.factory.forEach((row, index) => { 
 | 
                        if (item === row.memberName) { 
 | 
                            this.form.factory.splice(index, 1) 
 | 
                        } 
 | 
                    }) 
 | 
                }) 
 | 
            }, 
 | 
            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.factory.length; i++) { 
 | 
                            if (!this.form.factory[i].worktypeId || !this.form.factory[i].duId) { 
 | 
                                this.$message.warning('请完善派遣单位和工种信息') 
 | 
                                return 
 | 
                            } 
 | 
                        } 
 | 
                        this.form.factory.forEach(item => { 
 | 
                            item.idcardNo = item.idCard 
 | 
                        }) 
 | 
                        // let arr = JSON.parse(JSON.stringify(this.form.factory)) 
 | 
                        // arr.forEach(item => { 
 | 
                        //     item.idcardNo = item.idCard 
 | 
                        // }) 
 | 
                        this.isWorking = true 
 | 
                        update({ 
 | 
                            id: this.form.applyChangId, 
 | 
                            applyId: this.form.id, 
 | 
                            changeDetailList: this.form.factory, 
 | 
                            validTime: this.form.applyStartTime, 
 | 
                            type: 1 
 | 
                        }).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 
 | 
                } 
 | 
                this.$refs.selectEmployees.open('选取员工', { arr: this.form.delDetailList, price: this.price, insuranceApplyId: this.form.id }) 
 | 
            }, 
 | 
            addUser() { 
 | 
                if (!this.form.solutionId) { 
 | 
                    this.$message.warning('请先选择保险方案') 
 | 
                    return 
 | 
                } 
 | 
                this.$refs.addEmployee.open('添加员工', { arr: this.form.factory, price: this.price }) 
 | 
            }, 
 | 
            uploadUser() { 
 | 
                if (!this.form.solutionId) { 
 | 
                    this.$message.warning('请先选择保险方案') 
 | 
                    return 
 | 
                } 
 | 
                this.$refs.importEmployees.open('上传名单', { arr: this.form.factory, price: this.price }) 
 | 
            }, 
 | 
            // 切换方案 
 | 
            changeSolution1(e) { 
 | 
                this.company.forEach(item => { 
 | 
                    if (item.id === e) { 
 | 
                        this.item = item 
 | 
                    } 
 | 
                }) 
 | 
                // this.tableData.forEach(item => { 
 | 
                //     item.fee = this.price 
 | 
                // }) 
 | 
            }, 
 | 
            dele(index) { 
 | 
                this.form.factory.splice(index, 1) 
 | 
            }, 
 | 
            getUser(obj) { 
 | 
                console.log(obj) 
 | 
                this.seleData.forEach(item => { 
 | 
                    this.form.factory.forEach(row => { 
 | 
                        if (item === row.memberName) { 
 | 
                            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.form.solutionId }) 
 | 
            }, 
 | 
            // 查询全部方案 
 | 
            getCompany() { 
 | 
                all({}) 
 | 
                    .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.memberName) 
 | 
            }, 
 | 
            getValue(list) { 
 | 
                let arr = JSON.parse(JSON.stringify(list)) 
 | 
  
 | 
                arr.forEach(item => { 
 | 
                    item.oldDuId = item.duId 
 | 
                    item.oldDuName = item.duName 
 | 
                    item.oldWorkTypeName = item.workTypeName 
 | 
                    item.oldWorktypeId = item.worktypeId 
 | 
  
 | 
                    item.duId = '' 
 | 
                    item.duName = '' 
 | 
                    item.workTypeName = '' 
 | 
                    item.worktypeId = '' 
 | 
                }) 
 | 
                this.form.factory.push(...arr) 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</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> 
 |