<template> 
 | 
    <GlobalWindow 
 | 
        :title="title" 
 | 
        width="100%" 
 | 
        :visible.sync="visible" 
 | 
        :confirm-working="isWorking" 
 | 
        @confirm="confirm" 
 | 
    > 
 | 
        <el-form :inline="true" class="demo-form-inline"> 
 | 
            <div v-for="(item, index) in list" :key="index"> 
 | 
                <el-form-item label="姓名" required> 
 | 
                    <el-input v-model="item.memberName" placeholder="请输入"></el-input> 
 | 
                </el-form-item> 
 | 
                <el-form-item label="身份证号" required> 
 | 
                    <el-input v-model="item.idCard" maxlength="18" placeholder="请输入"></el-input> 
 | 
                </el-form-item> 
 | 
                <el-form-item> 
 | 
                    <el-button type="primary" v-if="index === 0" @click="add">添加</el-button> 
 | 
                    <el-button type="danger" v-else @click="dele(index)">删除</el-button> 
 | 
                </el-form-item> 
 | 
            </div> 
 | 
        </el-form> 
 | 
    </GlobalWindow> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
    import BaseOpera from '@/components/base/BaseOpera' 
 | 
    import GlobalWindow from '@/components/common/GlobalWindow' 
 | 
    export default { 
 | 
        name: 'addEmployee', 
 | 
        extends: BaseOpera, 
 | 
        components: { GlobalWindow }, 
 | 
        data () { 
 | 
            return { 
 | 
                tempIndex : -1, 
 | 
                list: [ 
 | 
                    { 
 | 
                        memberName: '', 
 | 
                        idCard: '', 
 | 
                        workTypeName: '', 
 | 
                        worktypeId: '', 
 | 
                        duName: '', 
 | 
                        duId: '', 
 | 
                        fee: '' 
 | 
                    } 
 | 
                ], 
 | 
                price: 0, 
 | 
                arr: [] 
 | 
            } 
 | 
        }, 
 | 
        methods: { 
 | 
            open (title, obj,tempIndex) { 
 | 
                this.title = title 
 | 
                this.visible = true 
 | 
                this.tempIndex = tempIndex 
 | 
                this.list = [ 
 | 
                    { 
 | 
                        memberName: '', 
 | 
                        idCard: '', 
 | 
                        workTypeName: '', 
 | 
                        worktypeId: '', 
 | 
                        duName: '', 
 | 
                        duId: '', 
 | 
                        fee: '' 
 | 
                    } 
 | 
                ] 
 | 
                this.arr = obj.arr 
 | 
                this.price = obj.price 
 | 
            }, 
 | 
            add() { 
 | 
                this.list.push({ 
 | 
                    memberName: '', 
 | 
                    idCard: '', 
 | 
                    workTypeName: '', 
 | 
                    worktypeId: '', 
 | 
                    duName: '', 
 | 
                    duId: '', 
 | 
                    fee: '', 
 | 
                     id:this.tempIndex - 1 
 | 
                }) 
 | 
            }, 
 | 
            dele(index) { 
 | 
                this.list.splice(index, 1) 
 | 
            }, 
 | 
            hasDuplicates(arr) { 
 | 
                return arr.some((value, index) => arr.indexOf(value) !== index); 
 | 
            }, 
 | 
            confirm() { 
 | 
                // 判断列表否是有空值 
 | 
                // for (let i = 0; this.list.length; i++) { 
 | 
                //     if (!this.list[i].memberName || !this.list[i].idCard) { 
 | 
                //         this.$message.warning('请先完善信息后再提交') 
 | 
                //         return 
 | 
                //     } 
 | 
                // } 
 | 
                // 判断新录入数据身份证是否有重复 
 | 
                let idcardList = this.list.map(item => item.idCard) 
 | 
                if (this.hasDuplicates(idcardList)) { 
 | 
                    this.$message.warning('身份证有重复') 
 | 
                    return 
 | 
                } 
 | 
                // 判断身份证是否有效 
 | 
                for (let i = 0; i < this.list.length; i++) { 
 | 
                    const regExp = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/; 
 | 
                    if (!regExp.test(this.list[i].idCard)) { 
 | 
                        this.$message.warning(`第${i + 1}项员工身份证不合法`) 
 | 
                        return 
 | 
                    } 
 | 
                } 
 | 
                // 判断详情列表数据身份证是否有重复 
 | 
                let next = true 
 | 
                this.list.forEach(item => { 
 | 
                    this.arr.forEach(child => { 
 | 
                        if (item.idCard === child.idCard) { 
 | 
                            next = false 
 | 
                        } 
 | 
                    }) 
 | 
                }) 
 | 
                if (next) { 
 | 
                    this.list.forEach(item => { 
 | 
                        item.fee = this.price 
 | 
                    }) 
 | 
                    this.$emit('result', this.list) 
 | 
                    this.visible = false 
 | 
                } else { 
 | 
                    this.$message.warning('身份证号不能重复!') 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
  
 | 
</style> 
 |