<template>
    <div class="container">
        <el-card style="min-height:80vh;padding:15px">
            <div class="flex flex_end">
                <el-button type="primary" size="mini" @click="$router.back()">返回上一级</el-button>
            </div>
            <tab-pane :activeName="activeName" :thirdList="thirdList"></tab-pane>
            <div class="mt20">
                <div>考勤组名称</div>
                <el-input placeholder="请输入考勤组名称" v-model="setParams.groupName" style="width:220px" class="mt10"></el-input>
            </div>
            
            <div class="flex flex-align-center mt20">
                <div>考勤人员</div>
                <el-button type="text" class="ml20" @click="drawershow('drawer1')">设置</el-button>
            </div>

            <div class="flex flex-align-center mt10" style="color:#999;font-size:14px" v-if="attendArr.length < 1">
                <div>参与考勤人员</div>
                <div class="ml20">未设置</div>
            </div>

            <!-- <div class="flex flex-align-center mt10" style="color:#999;font-size:14px">
                <div>无需考勤人员</div>
                <div class="ml20">未设置</div>
            </div> -->
            
            <div style="height:20px"></div>

            <div class="flex flex-align-center mt20">
                <div>考勤组负责人</div>
                <el-button type="text" class="ml20" @click="drawershow('drawer2')">设置</el-button>
            </div>

            <div class="flex flex-align-center mt10" style="color:#999;font-size:14px" v-if="!setParams.groupResponsibleEntity.responsibleId">
                <div>主负责人</div>
                <div class="ml20">未设置</div>
            </div>
            <!-- <div class="flex flex-align-center mt10" style="color:#999;font-size:14px">
                <div>子负责人</div>
                <div class="ml20">未设置</div>
            </div> -->
            <!-- <div class="flex flex-align-center mt10" style="color:#999;font-size:14px">
                <div>子负责人权限</div>
                <div class="ml20">未设置</div>
            </div> -->

            <div style="height:20px"></div>

            <div class="flex flex-align-center mt20">
                <div>考勤时间</div>
                <el-button type="text"  class="ml20" @click="drawershow('drawer3')">设置</el-button>
            </div>
            
            <div class="flex flex-align-center mt10" v-if="setParams.type === ''" style="color:#999;font-size:14px">
                <div>考勤类型</div>
                <div class="ml20">未设置</div>
            </div>

            <div class="flex flex-align-center mt10" style="color:#999;font-size:14px"  v-if="setParams.type === ''">
                <div>工作日设置</div>
                <div class="ml20">未设置</div>
            </div>

            <div style="height:20px"></div>

            <div class="flex flex-align-center mt20">
                <div>打卡方式</div>
                <el-button type="text" class="ml20" @click="drawershow('drawer4')">设置</el-button>
            </div>
            
            <div class="flex flex-align-center mt10" style="color:#999;font-size:14px" 
            v-if="setParams.attendanceType == ''">
                <div>考勤方式</div>
                <div class="ml20">未设置</div>
            </div>
            <div class="mt20">
                <el-button type="primary" @click="saveSetform">保存设置</el-button>
                <el-button @click="allReset">全部重置</el-button>
            </div>
        </el-card>
        <!-- 设置考勤人员 -->
        <el-drawer
        title="考勤人员"
        size="70%"
        :beforeClose="closedrawer"
        :visible.sync="drawer"
        direction="rtl">
            <div style="padding:20px">
                <!-- 考勤人员 -->
                <div v-if="drawer1">
                    <div>参与考勤人员({{this.attendArr.length}})</div>
                    <el-input @focus="selectGroup(true)" type="textarea"
                    v-model="persons" style="width:80%" size="mini" placeholder="请选择">
                    </el-input>
                </div>

                <!-- 考勤组 -->
                <div class="mt10" v-if="drawer2">
                    <div>考勤组负责人：</div>
                    <el-select v-model="setParams.groupResponsibleEntity.responsibleId">
                        <el-option
                            v-for="($label, $value) in  responsiableList"
                            :key="$value"
                            :label="$label"
                            :value="$value"
                        ></el-option>
                    </el-select>
                </div>
                <!-- <div class="mt10" v-if="drawer2">
                    <div>主负责人：</div>
                    <el-select></el-select>
                </div>
                <div class="mt10" v-if="drawer2">
                    <div>子负责人：</div>
                    <el-select></el-select>
                </div>
                <div class="mt10" v-if="drawer2">
                    <div>子负责人权限：</div>
                    <el-select>
                        <el-option></el-option>
                    </el-select>
                </div> -->

                <!-- 考勤时间 -->
                <div class="mt20" v-if="drawer3">
                    <el-radio-group v-model="setParams.type" @change="changeRadio">
                        <div class="mt10" v-for="(item,index) in paibanType" :key="index">
                           <el-radio :label="item.value">{{item.label}}</el-radio>
                           <div class="tips">{{item.des}}</div>
                        </div> 
                    </el-radio-group>
                </div>
                
                <div class="mt20" v-if="drawer3">
                    
                    <!-- 固定班次设置 -->
                    <div v-if="setParams.type == 1">
                        <div>工作日设置：</div>
                        <!-- <div class="mt10">
                            <el-tag type="primary">快捷设置班次</el-tag>
                            <span class="ml20">班次名称：</span>
                            <el-button type="text" @click="changeBanci('1')">更改班次</el-button>
                        </div> -->
                        <!-- 固定班次表 -->
                        <banci-table :setParams="groupFixedworkEntity" @changebanci="changeBanci"></banci-table>
                    </div>


                    <!-- 自用工时设置 -->
                    <div v-if="setParams.type == 3">
                        <div class="mt20">工作日</div>
                        <div class="mt10">
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.monday" :true-label="1" :false-label="0">周一</el-checkbox>
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.tuesday" :true-label="1" :false-label="0">周二</el-checkbox>
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.wednesday" :true-label="1" :false-label="0">周三</el-checkbox>
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.thursday" :true-label="1" :false-label="0">周四</el-checkbox>
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.friday" :true-label="1" :false-label="0">周五</el-checkbox>
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.saturday" :true-label="1" :false-label="0">周六</el-checkbox>
                            <el-checkbox v-model="attendanceGroupFreeworkEntity.sunday" :true-label="1" :false-label="0">周日</el-checkbox>

                        </div>
                        <div class="mt20">工作时长</div>
                        <div class="mt10">
                            <el-input style="width:100px" v-model="attendanceGroupFreeworkEntity.workTime" minlength="5"></el-input>
                            <span class="ml20">小时</span>
                        </div>                        
                    </div>

                    <div v-if="setParams.type != 2">
                        <div class="mt10">
                            <el-checkbox v-model="holidays" :true-label="1" :false-label="0">法定节假日自动排休</el-checkbox>
                        </div>

                        <div class="mt10">
                            <div>特殊日期</div>
                        </div>

                        <div class="mt10">
                            <el-button @click="setMustTimes('must',attendanceGroupFixedworkSpecialList[0],0)">
                                +新增必须打卡的日期
                            </el-button>
                            
                            <div class="el-tag ml20" type="primary" size="mini" plain 
                                v-if="attendanceGroupFixedworkSpecialList[0].specialTime">
                                {{attendanceGroupFixedworkSpecialList[0].specialTime?
                                attendanceGroupFixedworkSpecialList[0].specialTime:'未设置'}}
                            </div>
                            
                        </div>
                        <div class="mt10">
                            <el-button @click="setMustTimes('noneed',attendanceGroupFixedworkSpecialList[1],1)">
                                +新增无需打卡的日期
                            </el-button>
                            <div class="el-tag ml20" type="primary" size="mini" plain v-if="attendanceGroupFixedworkSpecialList[1].specialTime">
                                {{attendanceGroupFixedworkSpecialList[1].specialTime}}
                            </div>
                            <div class="el-tag ml20" v-else-if="attendanceGroupFixedworkSpecialList[1].specialStartTime">
                                {{attendanceGroupFixedworkSpecialList[1].specialStartTime}} 至 {{attendanceGroupFixedworkSpecialList[1].specialEndTime}}</div>
                        </div>                        
                    </div>

                </div>
                <div class="mt20"  v-if="drawer4">
                    <div>考勤方式</div>
                    <el-radio-group v-model="setParams.attendanceType">
                        <div class="mt10" v-for="(item,index) in attendanceType" :key="index">
                            <el-radio :label="item.value">{{item.label}}</el-radio>   
                        </div>
                    </el-radio-group>
                </div>
            </div>
        </el-drawer>

        <!-- 选择成员 -->
        <el-dialog :visible.sync="isshowgroup" title="选择人员" width="80%" :show-close="false">
            <div>
                <el-row type="flex">
                    <!-- 左1 -->
                    <el-col :span="16">

                        <el-row type="flex">
                            <el-col :span="12">
                                <div class="titles">选择部门</div>
                                <el-scrollbar style="height: 50vh">
                                    <el-tree
                                        size="mini"
                                        ref="siteTree"
                                        :data="areaData"
                                        id="el-tree"
                                        node-key="id"
                                        :load="loadNode"
                                        highlight-current
                                        :expand-on-click-node="false"
                                        @node-click="handleNodeClickBumen"
                                    >
                                    </el-tree>
                                </el-scrollbar>                                
                            </el-col>

                            <el-col :span="12">
                                <div class="titles">人员列表</div>
                                <el-scrollbar style="height: 50vh">
                                    <div v-if="currentSelect.length>0">
                                        <el-checkbox label="0" v-model="CurrentAllchecked" @change="currentChangeAll">全部</el-checkbox>
                                    </div>

                                    <el-checkbox-group v-model="allSelectId" v-if="currentSelect.length>0">
                                        <el-checkbox :label="item.staffId" @change="changegroupId"
                                        v-for="(item,index) in currentSelect" :key="index">
                                        {{item.staffName}}</el-checkbox>
                                    </el-checkbox-group>

                                    <div v-else class="tips mt10">
                                        该部门没有可选择员工，请选择其他文件
                                    </div>
                                </el-scrollbar>
                            </el-col>

                        </el-row>

                    </el-col>
                    <!-- 右1 -->
                    <el-col :span="8">
                      <div style="border-left:1px dotted #eee;padding-left:20px">
                            <div class="titles">已选择</div>
                            <el-scrollbar style="height: 50vh">
                                <div class="el-tag ml10 mt10" :key="index"
                                 v-for="(item,index) in allSelect">
                                    <span class="tags">{{item.staffName}}</span>
                                    <i class="el-icon-close" @click="deleteOne(index)"></i>
                                </div>
                            </el-scrollbar>                          
                      </div>
                    </el-col>
                </el-row>

            </div>
            <div class="mt20">
                <el-button type="primary" size="mini" @click="saveBtnchoice">确定</el-button>
                <el-button size="mini" @click="cancelChoice">取消</el-button>
            </div>
        </el-dialog>

        <!-- 选择班次 -->
        <el-dialog :visible.sync="isshowBanci" title="选择班次" :show-close="false">
            选择班次
            <banci-select :classArr="classArr" :currentArr="currentselectBanciRow" :isshow="isshowBanci"
            @saveRowBanci="saveRowBanci" @cancelBanci="cancelBanci"></banci-select>
        </el-dialog>

        <!-- 新增必须打卡时间 -->
        <el-dialog :visible.sync="mustDaka" title="新增必须打卡日期" :show-close="false">
            <div>
                <span>选择日期</span>
                <el-date-picker type="date" placeholder="年/月/日" class="ml10"  value-format="yyyy-MM-dd"
                v-model="currentParams.specialTime"></el-date-picker>
            </div>
            <div>
                <!-- 选择日期 -->
                <banci-select :classArr="classArr" :currentArr="currentselectBanciRow" :isshow="mustDaka"
                @saveRowBanci="saveCurrentSpecial" @cancelBanci="cancelSpecial"></banci-select>
            </div>
        </el-dialog>

        
        <!-- 新增无需打卡时间 -->
        <el-dialog :visible.sync="noneedDaka" title="新增无需打卡日期" :show-close="false">
            <div>
                <span>选择添加方式</span>
                <el-radio-group class="ml20" v-model="currentParams.addWay" @change="currentParams.specialTime = ''">
                    <el-radio :label="0">单个日期</el-radio>
                    <el-radio :label="1">时间段</el-radio>
                </el-radio-group>                
            </div>
            <div>
                <div v-if="currentParams.addWay === 0" class="mt20">
                    <span>选择日期</span>
                    <!-- 单个日期 -->
                    <el-date-picker type="date" class="ml20" value-format="yyyy-MM-dd"
                    v-model="currentParams.specialTime"></el-date-picker>                    
                </div>
                <div v-else-if="currentParams.addWay === 1" class="mt20">
                    <!-- 日期段 -->
                    <el-date-picker
                    v-model="noneedRange"
                    @change="changeneedRange"
                    type="daterange"
                    value-format="yyyy-MM-dd"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
                    </el-date-picker>                    
                </div>
            </div>
            <div class="mt20">
                <el-button type="primary" size="mini" @click="saveNoneed">确定</el-button>
                <el-button size="mini" @click="cancelSpecial">取消</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
    import tabPane from '@/components/tabPane.vue'
    import banciTable from './banciTable/index'
    import banciSelect from './banciSelect/index.vue'
    import {booleanToNum} from '@/assets/utils/common.js'
    export default {
        components: {
            tabPane,
            banciTable,
            banciSelect
        },
        created(){
            this.getdata()
        },
        methods: {

            // ---- 班次选择 -------
            // 当前班次选择
            saveRowBanci(val){
                this.groupFixedworkEntity[this.currentWorkName+'ClassId'] = val.id//存储班次id
                this.groupFixedworkEntity[this.currentWorkName+'ClassName'] = val.className//存储班次名称
                this.groupFixedworkEntity[this.currentWorkName+'ClassTime'] = val
                this.cancelBanci()
            },
            // 固定班制 ---- 触发班次选择
            changeBanci(row){
                this.currentWorkName = row
                this.currentselectBanciRow = this.groupFixedworkEntity[this.currentWorkName+'ClassTime']
                this.isshowBanci = true
            },
            // 置空
            cancelBanci(){
                this.isshowBanci = false
                this.currentselectBanciRow = null
            },
            // ----end ----


            // ----- 特殊日期选择 ----

            // 新增必须打卡 --- 触发班次
            setMustTimes(from,item,index){
                this.currentParams = JSON.parse(JSON.stringify(item))
                if(from == 'must'){
                    this.mustDaka = true
                    this.currentselectBanciRow = this.currentParams.classArr
                }else{
                    this.noneedRange = [this.currentParams.specialStartTime,this.currentParams.specialEndTime]
                    this.noneedDaka = true
                }
                
            },
            // 保存必须打卡
            saveCurrentSpecial(val){
                this.currentParams.classArr = val
                this.currentParams.classId = val.id

                if(!this.currentParams.specialTime){
                    this.$message.error('请选择日期')
                    return
                }
                if(!this.currentParams.classId){
                    this.$message.error('请选择班次')
                    return
                }

                if(this.attendanceGroupFixedworkSpecialList[1].specialTime === this.currentParams.specialTime){
                    this.$message.error('该日期已设置为无需打卡日，请重新选择')
                    return
                }
                if(this.attendanceGroupFixedworkSpecialList[1]){
                    let timeStart =  Date.parse(this.attendanceGroupFixedworkSpecialList[1].specialStartTime)//无需开始时间戳
                    let timeEnd =  Date.parse(this.attendanceGroupFixedworkSpecialList[1].specialEndTime)//无需结束时间戳
                    let mustTime  =  Date.parse(this.currentParams.specialTime)//必须时间戳

                    if(mustTime >= timeStart && mustTime <= timeEnd){
                        this.$message.error('必须打卡日期不能设置在无需打卡时间段内,请重新选择')
                        return false
                    }
                }
                this.attendanceGroupFixedworkSpecialList[0] = JSON.parse(JSON.stringify(this.currentParams))
                this.cancelSpecial()                    

            },
            // 取消当前特殊日期设置
            cancelSpecial(){
                this.currentParams = {}
                this.noneedRange = []
                this.mustDaka = false
                this.noneedDaka = false
                this.currentselectBanciRow = null
            },

            // 无需时间段
            changeneedRange(){
                if(this.noneedRange){
                    this.currentParams.specialStartTime = this.noneedRange[0]
                    this.currentParams.specialEndTime = this.noneedRange[1]
                }else{
                    this.currentParams.specialStartTime = ''
                    this.currentParams.specialEndTime = ''
                }
            },
            // 保存 无需打卡
            saveNoneed(){
                if(this.currentParams.addWay === 0 && this.currentParams.specialTime == ''){
                    this.$message.error('请选择日期')
                    return 
                }
                if(this.currentParams.addWay === 1 && this.currentParams.specialStartTime == ''){
                    this.$message.error('请选择时间段')
                    return
                }

                if(this.attendanceGroupFixedworkSpecialList[0].specialTime === this.currentParams.specialTime && 
                    this.attendanceGroupFixedworkSpecialList[0].specialTime != ''){
                    this.$message.error('该日期已设置为必须打卡日，请重新选择')
                    return
                }
                if(this.attendanceGroupFixedworkSpecialList[0]){
                    let timeStart =  Date.parse(this.currentParams.specialStartTime)//无需开始时间戳
                    let timeEnd =  Date.parse(this.currentParams.specialEndTime)//无需结束时间戳
                    let mustTime  =  Date.parse(this.attendanceGroupFixedworkSpecialList[0].specialTime)//必须时间戳
                    if(mustTime >= timeStart && mustTime <= timeEnd){
                        this.$message.error('无需打卡时间段内不能含有[必须打卡日期],请重新选择')
                        return false
                    }
                }
                this.attendanceGroupFixedworkSpecialList[1] = JSON.parse(JSON.stringify(this.currentParams))
                this.cancelSpecial()
            },

            // ---- end -------


            // ---- 部门-人员选择 ------

            // 触发部门选择
            selectGroup(from){
                this.selectTyep = from
                if(this.selectTyep){
                    this.allSelect = this.attendArr 
                    this.allSelectId = this.attendArrId
                }else{
                    this.allSelect = this.noattendArr
                    this.allSelectId = this.attendArrId
                }
                this.isshowgroup = true
            },
            // 取消选择
            cancelChoice(){
                this.isshowgroup = false
                this.currentSelect = []
                this.allSelect = []
                this.allSelectId = []
                this.CurrentAllchecked = false
            },
            // 确定当前选择
            saveBtnchoice(){
                this.CurrentAllchecked = false
                if(this.selectTyep){
                    this.attendArr = this.allSelect
                    this.attendArrId = this.allSelectId
                    // 参与考勤
                }else{
                    // 不参与考勤
                    this.noattendArr = this.allSelect
                    this.attendArrId = this.allSelectId
                }
                this.cancelChoice()
            },
            // 单独选择
            changegroupId(val){
                let value 
                if(val){
                    // id
                    value = this.allSelectId.filter(item1 => !this.allSelect.some(item2 => item2.staffId === item1))
                    let obj = this.currentSelect.find(item => item.staffId === value[0])
                    this.allSelect.push(obj)
                }else{
                    // 对象
                    value = this.allSelect.filter(item1 => !this.allSelectId.some(item2 => item2 === item1.staffId))
                    let index = this.allSelect.findIndex(item => item.staffId == value[0].staffId)
                    this.allSelect.splice(index,1)
                }
                this.CurrentAllchecked  = this.currentSelect.every(val => this.allSelectId.includes(val.staffId))
                console.log(value,'当前选择值')
            },
            // 点击触发
            handleNodeClickBumen(val){
                if(this.selectTyep){
                    
                }else{

                }
                this.currentSelect = val.personList//人员信息
                // 判断当前是不是全选
                this.CurrentAllchecked  = this.currentSelect.every(val => this.allSelectId.includes(val.staffId))

            },
            // 全选操作
            currentChangeAll(){
                if(this.CurrentAllchecked){
                    // 当前全选
                    let arr1 = this.currentSelect.filter(item => !this.allSelect.some(item2 => item2 === item))

                    this.allSelect = [...this.allSelect,...arr1]//渲染列表

                    let arr2 = this.currentSelect.filter(item1 => !this.allSelectId.some(item2 => item2 === item1.staffId))

                    this.allSelectId = [...this.allSelectId,...arr2.map(item=>item.staffId)]//id信息
                }else{
                    //取消当前全选 

                    this.allSelect = this.allSelect.filter(item1 => !this.currentSelect.some(item2 => item2 === item1))

                    this.allSelectId = this.allSelectId.filter(item1 => !this.currentSelect.some(item2 => item2.staffId === item1))
                }
                
            },
            // 删除某个选择
            deleteOne(index){
                this.allSelect.splice(index,1)
                this.allSelectId.splice(index,1)
                this.CurrentAllchecked  = this.currentSelect.every(val => this.allSelectId.includes(val.staffId)) //判断全选
            },
            // ---- end -------

            // 考勤方式发生改变 -置空其他类别选项
            changeRadio(val){
                // 固定班次
                if(val == 1){
                    // 自由工时置空
                    for(let key in this.attendanceGroupFreeworkEntity){
                        this.attendanceGroupFreeworkEntity[key] = 0

                    }
                    this.attendanceGroupFreeworkEntity['workTime'] = ''
                    this.attendanceGroupFreeworkEntity['attendanceGroupFreeworkSpecialList'] = []
                }else if(val == 2){
                    // 自由工时置空
                    for(let key in this.attendanceGroupFreeworkEntity){
                        this.attendanceGroupFreeworkEntity[key] = 0

                    }
                    this.attendanceGroupFreeworkEntity['workTime'] = ''
                    this.attendanceGroupFreeworkEntity['attendanceGroupFreeworkSpecialList'] = []
                    // 固定班制置空
                    for(let key in this.groupFixedworkEntity){
                        this.groupFixedworkEntity[key] = ''
                    }
                    this.groupFixedworkEntity['monday'] = 0
                    this.groupFixedworkEntity['tuesday'] = 0
                    this.groupFixedworkEntity['wednesday'] = 0
                    this.groupFixedworkEntity['thursday'] = 0
                    this.groupFixedworkEntity['friday'] = 0
                    this.groupFixedworkEntity['saturday'] = 0
                    this.groupFixedworkEntity['sunday'] = 0

                    this.groupFixedworkEntity['mondayClassTime'] = []
                    this.groupFixedworkEntity['tuesdayClassTime'] = []
                    this.groupFixedworkEntity['wednesdayClassTime'] = []
                    this.groupFixedworkEntity['thursdayClassTime'] = []
                    this.groupFixedworkEntity['fridayClassTime'] = []
                    this.groupFixedworkEntity['saturdayClassTime'] = []
                    this.groupFixedworkEntity['sundayClassTime'] = []

                }
            },
            // 触发对应流程设置
            drawershow(from){
                switch(from){
                    case 'drawer1':
                      this.drawer = true
                      this.drawer1 = true
                      break;
                    case 'drawer2':
                      this.drawer = true
                      this.drawer2 = true
                      break;
                    case 'drawer3':
                      this.drawer = true
                      this.drawer3 = true
                      break;
                    case 'drawer4':
                      this.drawer = true
                      this.drawer4 = true
                      break;
                    default:
                      break;
                }
            },
            // 关闭流程设置
            closedrawer(){
                this.drawer = false
                this.drawer1 = false
                this.drawer2 = false
                this.drawer3 = false
                this.drawer4 = false
            },
            // 全部置空
            allReset(){
                // 置空无关项
                this.changeRadio('1')
                this.changeRadio('2')
                this.changeRadio('3')

                // 先大概处理
                for(let key in this.setParams){
                    this.setParams[key] = ''
                }
                this.setParams.attendanceGroupStaffList = []

                this.attendArr = []
                this.attendArrId = []
                this.allSelectId = []
                this.allSelect = []
                this.currentSelect = []
                
            },
            // 提交保存
            saveSetform(){
                // 校验 考勤组名称、参与考勤人员、考勤组负责人、
                // 考勤时间 固定班制 -- 校验 排班是否设置 排班id 日期是否参与考勤
                // 自由时间 -- 是否参与考勤 工作时长
                // 排班制 -- 不确定

                //  ---- 基础判断 ---
                if(this.setParams.groupName === ''){
                    this.$message.error('请输入考勤组名称')
                    return
                }
                if(this.attendArr.length<1){
                    this.$message.error('请设置参与考勤人员')
                    return
                }
                if(this.setParams.groupResponsibleEntity.responsibleId == ''){
                    this.$message.error('请设置考勤负责人')
                    return
                }
                if(this.setParams.type === ''){
                    this.$message.error('请设置考勤方式')
                    return
                }

                if(this.setParams.attendanceType === ''){
                    this.$message.error('请设置打卡方式')
                    return false
                }
                // -----end --- 

                //  ---- 根据类型判断 ---
                // 固定班制
                if(this.setParams.type == 1){
                    if(this.groupFixedworkEntity.monday && !this.groupFixedworkEntity.mondayClassId){
                        this.$message.error('周一考勤班次未设置')
                        return false
                    }
                    if(this.groupFixedworkEntity.tuesday && !this.groupFixedworkEntity.tuesdayClassId){
                        this.$message.error('周二考勤班次未设置')
                        return false
                    }
                    if(this.groupFixedworkEntity.wednesday && !this.groupFixedworkEntity.wednesdayClassId){
                        this.$message.error('周三考勤班次未设置')
                        return false
                    }
                    if(this.groupFixedworkEntity.thursday && !this.groupFixedworkEntity.thursdayClassId){
                        this.$message.error('周四考勤班次未设置')
                        return false
                    }
                    if(this.groupFixedworkEntity.friday && !this.groupFixedworkEntity.fridayClassId){
                        this.$message.error('周五考勤班次未设置')
                        return false
                    }
                    if(this.groupFixedworkEntity.saturday && !this.groupFixedworkEntity.saturdayClassId){
                        this.$message.error('周六考勤班次未设置')
                        return false
                    }
                    if(this.groupFixedworkEntity.sunday && !this.groupFixedworkEntity.sundayClassId){
                        this.$message.error('周日考勤班次未设置')
                        return false
                    }
                }
                if(this.setParams.type == 3){
                    if(this.attendanceGroupFreeworkEntity.workTime = '' ){
                        this.$message.error('请设置工作时长')
                        return false
                    }             
                }
                // ---- 处理数据 ---- 
                if(this.attendArr.length > 0){
                    this.setParams.attendanceGroupStaffList = this.attendArr.map(item => {
                        return{
                            staffId:item.staffId,
                            staffName:item.staffName
                        }
                    })                    
                }
                if(this.setParams.groupResponsibleEntity.responsibleId){
                    // 给负责人进行赋值
                    this.setParams.groupResponsibleEntity.responsibleName = this.responsiableList[this.setParams.groupResponsibleEntity.responsibleId]
                }
                
                // 删操作值
                // delete this.groupFixedworkEntity.mondayClassTime
                // delete this.groupFixedworkEntity.tuesdayClassName
                // delete this.groupFixedworkEntity.wednesdayClassTime
                // delete this.groupFixedworkEntity.thursdayClassTime
                // delete this.groupFixedworkEntity.fridayClassTime
                // delete this.groupFixedworkEntity.saturdayClassTime
                // delete this.groupFixedworkEntity.sundayClassTime
                // delete this.attendanceGroupFixedworkSpecialList[0]['classArr']
                // delete this.attendanceGroupFixedworkSpecialList[1]['classArr']

                // 固定工时
                if(this.setParams.type == 1){
                    this.groupFixedworkEntity.attendanceGroupFixedworkSpecialList = this.attendanceGroupFixedworkSpecialList
                    
                    this.setParams.groupFixedworkEntity = this.groupFixedworkEntity
                }
                // 自由工时
                if(this.setParams.type == 3){

                   this.attendanceGroupFreeworkEntity.attendanceGroupFixedworkSpecialList = this.attendanceGroupFixedworkSpecialList
                   this.setParams.attendanceGroupFreeworkEntity = this.attendanceGroupFreeworkEntity
                }

                this.$post('/attendance/group/save',this.setParams).then(res => {
                    if(res.code === 1){
                        this.$router.back()
                    }
                })
            },
            // 参数和公共字典
            getdata(){
                this.$post('/attendance/group/add').then(res => {
                    if(res.code == 1){
                        // 打卡类型
                        this.attendanceType = [] 
                        let data = res.data.dict//字典函数
                        this.classArr = data.classId
                        this.responsiableList = data.workMan
                        this.areaData = data.deptId
                        for(let key in data.attendanceType){
                            let obj = {
                                label:data.attendanceType[key],
                                value:key
                            }
                            this.attendanceType.push(obj)
                        }

                        // 类型
                        let type = []
                        for(let key in data.type){
                            let obj = {
                                label:data.type[key],
                                value:key
                            }
                            type.push(obj)
                        }

                        type.forEach((item,index) => {
                            let res = this.paibanType.filter(item1 => item1.label.indexOf(item.label) != -1)
                            if(res.length>0){
                                res[0].value = type[index].value
                            }
                        })
                        
                    }
                })
            },
        },
        computed:{
            persons(){
                let arrName = this.attendArr.map(item => item.staffName)
                return arrName.join(',')
            }
        },
        data() {
            return {
                
                activeName:'/attendance/group/view',
                thirdList:[
                    {
                        name:'新增考勤组',
                        path:'/attendance/group/view'
                    }
                ],
                paibanType:[
                    {
                        label:'固定班制（固定时间上下班）',
                        value:'1',
                        des:'考勤组中所有人按照相同的时间打卡，适用于办公室坐班，例如朝九晚五'
                    },
                    {
                        label:'排班制（按排班上下班）',
                        value:'2',
                        des:'自定义设置每人的班次，适用于工厂、门店等，例如三班倒'
                    },
                    {
                        label:'自由工时（不固定时间上下班）',
                        value:'3',
                        des:'上下班时间不固定，可随时打卡，适用于销售以及装修、家政等计时工'
                    }
                ],
                classArr:[],//公共字典 - 班次选择
                attendanceType:[],//打卡类型 - 公共字典
                areaData:[],//部门信息 - 公共字典
                responsiableList:[],//负责人选择 -公共字典

                // 当前选择员工
                currentSelect:[],
                // 员工总表
                allSelect:[],//选择的列表
                allSelectId:[],//选择的id
                CurrentAllchecked:false,
                // 存储当前参与考勤人员
                attendArr:[],
                attendArrId:[],
                // 存储当前不参与考勤人员
                noattendArr:[],
                noattendArrIc:[],

                selectTyep:'',//选择人员类型 true参与考勤人员//false不参与考勤人员
                drawer1:false,
                drawer2:false,
                drawer3:false,
                drawer4:false,
                drawer:false,
                isshowBanci:false,//班次展示
                isshowgroup:false,//人员选择
                mustDaka:false,//必须打卡设置
                noneedDaka:false,//无需打卡

                setParams:{
                    groupName:'',//考勤名称
                    // 负责人信息
                    groupResponsibleEntity:{
                        responsibleId:'',//考勤负责人
                        responsibleName:''//考勤负责人姓名
                    },
                    attendanceGroupStaffList:[],//参与考勤人员
                    type:'',//考勤方式
                    attendanceType:'',//打卡类型
                },
                
                
                type:[],
                currentselectBanciRow:'',//当前班次
                // 当前工作日名称
                currentWorkName:'',
                noneedRange:[],//时间段选择
                // 当前特殊日期
                currentParams:{},
                // 自由工时配置
                attendanceGroupFreeworkEntity:{
                    monday:0,
                    tuesday:0,
                    wednesday:0,
                    thursday:0,
                    friday:0,
                    saturday:0,
                    sunday:0,
                    holidays:0,
                    workTime:'',
                    attendanceGroupFreeworkSpecialList:[]
                },
                //固定班制
                groupFixedworkEntity:{
                    monday:0,//是否考勤(0.否,1,是)
                    mondayClassId:'',
                    mondayClassName:'',
                    mondayClassTime:[],//便于选择-传参删除

                    tuesday:0,//是否考勤(0.否,1,是)
                    tuesdayClassId:'',
                    tuesdayClassName:'',
                    tuesdayClassTime:[],//便于选择-传参删除

                    wednesday:0,//是否考勤(0.否,1,是)
                    wednesdayClassId:'',
                    wednesdayClassName:'',
                    wednesdayClassTime:[],//便于选择-传参删除

                    thursday:0,//是否考勤(0.否,1,是)
                    thursdayClassId:'',
                    thursdayClassName:'',
                    thursdayClassTime:[],

                    friday:0,//是否考勤(0.否,1,是)
                    fridayClassId:'',
                    fridayClassName:'',
                    fridayClassTime:'',//便于选择-传参删除

                    saturday:0,//是否考勤(0.否,1,是)
                    saturdayClassId:'',
                    saturdayClassName:'',
                    saturdayClassTime:[],//便于选择-传参删除

                    sunday:0,//是否考勤(0.否,1,是)
                    sundayClassId:'',
                    sundayClassName:'',
                    sundayClassTime:[],//便于选择-传参删除 
                    attendanceGroupFixedworkSpecialList:[],
                    holidays:""
                },
                
                holidays:0,// 假期排休 法定节假日自动排休(0.否,1.是)
                // 公共 - 特殊日期设置
                attendanceGroupFixedworkSpecialList:[
                    {
                        must:1,//必需打卡
                        specialStartTime:'',//时间段
                        specialEndTime:'',//
                        specialTime:'',//必须打卡日期
                        addWay:0,//日期还是时间段
                        classId:'',
                        classArr:{}
                    },
                    {
                        must:0,//无需打卡
                        specialStartTime:'',//时间段
                        specialEndTime:'',//
                        specialTime:'',//必须打卡日期
                        addWay:0,//日期还是时间段
                        classId:'',
                        classArr:{}
                    }
                ],
            }
        }
    }
</script>
<style lang="less">
.container{
    font-size: 15px;
}
.labelClass{
    width: 200px;
}
.el-descriptions__body{
    margin-left: 5px;
    margin-right: 5px;
    color: #606266;
    background-color: #FFF;
}

.contentClass{
    width: 600px;
}
.titles{
  color: #409EFF;
  font-size: 16px;
  display: flex;
  align-items: center;
}
.titles::before{
  content: '';
  width:6px;
  height: 16px;
  background-color: #409EFF;
  display: inline-block;
  margin-right: 10px;
}
.tips{
    color: #999;
    font-size: 12px;
}
</style>
