manHourHousekeeper/fhKeeper/formulahousekeeper/timesheet/src/views/team/index.vue

<template>
    <section>
        <el-col :span="4" class="left" :style="'height:'+ (tableHeight + 113) + 'px;'">
            <div class="department">
                <span><i class="iconfont firerock-iconzuzhijiegou" style="font-size:10px;" ></i>&nbsp;部门</span>
                <div v-on:click="createDepartment(-1)">
                    <i class="fa fa-plus-circle"></i>
                    创建
                </div>
            </div>
            <el-divider style="margin: 0px 0px !important;height:0.5px;"></el-divider>
            <div class="tree" :style="'height:'+ (tableHeight + 83) + 'px'">
                <!-- <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" accordion></el-tree> -->
                <el-tree :data="data" :props="defaultProps" node-key="id" :expand-on-click-node="false" accordion @node-click="handleNodeClick" :default-expanded-keys="jDarr" @node-expand="jieDian" @node-collapse="shutDown" @current-change="chufa">
                    <span class="custom-tree-node" style="position: relative;box-sizing: border-box;width: 10%" slot-scope="{ node }" @mouseleave= mouseleave(data,$event) @mouseover= mouseover(data,$event)>

                        <span style="padding-right: 50px;box-sizing: border-box;overflow:hidden;text-overflow:ellipsis;line-height: 36px; display: inline-block;">{{ node.label }}</span>

                        <!-- <span v-if="node.label != '全部人员'" class="node none"> -->
                        <span v-if="node.label != '全部人员'" class="node none poAub">
                            <el-button type="text" size="mini" @click="createDepartment(-2)" >
                                <i class="el-icon-circle-plus-outline"></i> <!-- 新增 -->
                            </el-button>
                            <el-button type="text" size="mini" @click="deleteDep(null)">
                                <i class="el-icon-delete"></i> <!-- 删除 -->
                            </el-button>
                        </span>
                    </span> 
                </el-tree>
            </div>
        </el-col>

        <el-col :span="20" class="right">
            <!--工具条-->
            <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
                <el-form :inline="true">
                    <!-- <div style="width: 300px;display: inline-block;">
                        <el-input v-model="keyword" class="input-with-select" placeholder="请输入人员名字搜索" clearable="true">
                            <el-button slot="append" @click="searchList" icon="el-icon-search"></el-button>
                        </el-input>
                    </div> -->
                    <el-form-item>
                        <div v-if="depData == null || depData.id == -1" class="nowTime" style="cursor:unset">
                            <i class="fa fa-home"></i>全部人员
                        </div>
                        <div v-else-if="depData.id == 0" class="nowTime" style="cursor:unset">
                            <i class="fa fa-home"></i>未分配
                        </div>
                        <div v-else-if="depData != null && depData.id != -1 && depData.id != 0" class="nowTime" @click="createDepartment(0)">
                            <i class="fa fa-pencil-square-o"></i>
                            {{depData!=null?depData.label:''}}
                        </div>
                    </el-form-item>
                    <el-form-item>
                        <div style="color:#999;font-size:13px;">共{{total}}人</div>
                    </el-form-item>
                    <el-form-item style="float:right;" v-if="permissions.structureCustomConfig">
                        <el-link type="primary" :underline="false" @click="customConfigShow">自定义配置</el-link>
                    </el-form-item>
                    <el-form-item style="float:right;" v-if="permissions.structureExport">
                        <el-link type="primary" :underline="false" @click="showExportDialog">导出人员</el-link>
                    </el-form-item>
                    <el-form-item style="float:right;" v-if="user.dingdingUserid == null && permissions.structureAdd">
                        <el-link type="primary" :underline="false" @click="openInsertDialog(null)">添加人员</el-link>
                    </el-form-item>
                    
                    <el-form-item style="float:right;" v-if="user.dingdingUserid == null && permissions.structureImport">
                        <el-link type="primary" :underline="false" @click="importUserC">批量导入</el-link>
                    </el-form-item>
                    <el-form-item style="float:right;" v-if="user.corpwxUserid != null && permissions.structureImport">
                        <el-link type="primary" :underline="false" @click="syncWithCorpWx">同步企微通讯录</el-link>
                    </el-form-item>

                    <!-- <el-form-item style="float:right;" v-if="user.dingdingUserid == null && permissions.structureImport">
                        <el-link type="primary" :underline="false" href="./upload/人员导入模板.xlsx" download="人员导入模板.xlsx">模板下载</el-link>
                    </el-form-item> -->
                    <!-- <el-form-item  v-if="depData != null && depData.id != -1 && depData.id != 0" style="float:right;border: 0.5px solid #20a0ff;height: 27px;margin-top: 6px;">
                    </el-form-item> -->
                    <!-- <el-form-item style="float:right;">
                        <el-link type="danger" v-if="depData != null && depData.id != -1 && depData.id != 0" :underline="false" @click="deleteDep(null)">删除部门</el-link>
                    </el-form-item>
                    <el-form-item style="float:right;">
                        <el-link type="primary" v-if="depData != null && depData.id != -1 && depData.id != 0" :underline="false" @click="createDepartment(-2)">新增子部门</el-link>
                    </el-form-item> -->
                    <el-form-item style="float:right;">
                        <span style="color: #666666">角色</span>
                        <el-select v-model="roleId" placeholder="请选择" @change="getUser()" style="width: 120px" clearable>
                            <!-- <el-option
                            v-for="item in rolesa"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option> -->
                            <el-option v-for="item in acquireRoleList" :key="item.id" :label="item.rolename" :value="item.id"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item style="float:right;">
                        <span style="color: #666666">状态</span>
                        <el-select v-model="status" placeholder="请选择" @change="getUser()" style="width: 120px">
                            <el-option
                            v-for="item in states"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item style="float:right;">
                        <div style="width: 250px;display: inline-block;">
                            <el-input v-model="keyword" class="input-with-select" placeholder="请输入人员名字搜索" clearable="true">
                                <el-button slot="append" @click="searchList" icon="el-icon-search"></el-button>
                            </el-input>
                        </div>
                    </el-form-item>
                </el-form>
            </el-col>

            <!--列表-->
            <el-table ref="handleSelectTable" :data="list" highlight-current-row v-loading="listLoading" :height="tableHeight" style="width: 100%;" @selection-change="handleSelectionZzjg">
                <el-table-column type="selection" width="50"></el-table-column>
                <el-table-column type="index" width="50">
                    <template slot-scope="scope" >
                        {{scope.$index+1+(page-1)*size}}
                    </template>
                </el-table-column>
                <el-table-column prop="name" label="姓名" ></el-table-column>
                <el-table-column prop="phone" label="手机" width="120"></el-table-column>
                <el-table-column prop="departmentName" label="部门" ></el-table-column>
                <el-table-column label="角色" width="100">
                    <template slot-scope="scope">{{scope.row.roleName}}</template>
                </el-table-column>
                <el-table-column prop="monthCost" label="月成本"  v-if="permissions.structurePersonnel">
                    <template slot-scope="scope">{{user.timeType.isSecretSalary==0?(scope.row.monthCost==null?0:scope.row.monthCost):'*'}} 元</template>
                </el-table-column>
                <el-table-column prop="cost" label="时薪"  v-if="permissions.structurePersonnel">
                    <template slot-scope="scope">{{user.timeType.isSecretSalary==0?(scope.row.cost==null?0:scope.row.cost):'*'}} 元
                        <el-link v-if="user.timeType.isSecretSalary==0" @click.native="showSalaryList(scope.row)"><i class="iconfont firerock-iconrecord"></i></el-link>
                    </template>
                </el-table-column>
                <el-table-column label="状态" width="160">
                    <template slot-scope="scope">
                        <span>{{scope.row.isActive==0 ? '离职(' + scope.row.inactiveDate + ')' : '在职'}}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" width="300">
                    <template slot-scope="scope">
                        <el-button size="mini" type="default" v-if="scope.row.roleName == '超级管理员' && user.id == scope.row.id" @click="transferRole(scope.row)">转让</el-button>
                        <el-button size="mini" type="default" v-if="scope.row.roleName != '超级管理员'" @click="resetPwd(scope.row)">重置</el-button>
                        <el-button size="mini" type="primary" v-if="scope.row.roleName != '超级管理员'" @click="openInsertDialog(scope.row)">编辑</el-button>
                        <el-button size="mini" type="primary" v-if="scope.row.roleName == '超级管理员'" @click="openInsertDialog1(scope.row)">编辑</el-button>
                        <!-- <el-button size="mini" type="danger"  v-if="scope.row.roleName != '超级管理员'" @click="deleteUser(scope.row)">删除</el-button> -->
                        <el-button size="mini" type="default" v-if="scope.row.roleName != '超级管理员' && scope.row.isActive==1" @click="showDeactiveDialog(scope.row)">停用</el-button>
                        <el-button size="mini" type="success" v-if="scope.row.roleName != '超级管理员' && scope.row.isActive==0" @click="setActive(scope.row, 1)">启用</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <!--工具条-->
            <el-col :span="24" class="toolbar">
                <!-- 123 -->
                <el-button size="small" @click="handleSelectionZzjgbtn1">取消</el-button>
                <!-- <el-cascader v-model="handleSelectionZzjgwillchange" size="small" placeholder="请选择部门" style="width: 13%;margin-left: 1%;margin-right: 1%;font-size:12px"
                    :options="option" :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader>
                <el-button size="small" type="primary" @click="handleSelectionZzjgbtn2">修改</el-button> -->
                    
                <el-button size="small" type="primary" @click="handleSelectionZzjgbtn3">批量修改部门</el-button>
                <el-button size="small" type="primary" @click="handJue">批量修改角色</el-button>
               
                
                
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :page-sizes="[20 , 50 , 80 , 100]"
                    :page-size="size"
                    layout="total, sizes, prev, pager, next"
                    :total="total"
                    style="float:right;"
                ></el-pagination>
            </el-col>
        </el-col>

        <!-- 批量修改弹出框 -->
        <el-dialog title="批量修改" :visible.sync="handleSelectionZzjgshow" v-if="handleSelectionZzjgshow" width="30%">
            <el-form model="" label-width="20%">
                <el-form-item label="设置部门">
                    <!-- <el-cascader v-model="handleSelectionZzjgwillchange" placeholder="请选择部门" style="width: 60%;"
                    :options="option" :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader> -->
                    <el-cascader v-model="handleSelectionZzjgwillchange" placeholder="请选择部门" style="width: 100%;"
                    :options="option" :props="{ checkStrictly: true,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="handleSelectionZzjgshow = false">取消</el-button>
                <el-button type="primary" @click="handleSelectionZzjgbtn2">确定</el-button>
            </div>
        </el-dialog>

        <!-- 批量修改角色弹出框 -->
        <el-dialog title="批量修改" :visible.sync="handljues" v-if="handljues" width="30%">
            <el-form model="" label-width="20%">
                <el-form-item label="设置角色">
                    <el-select v-model="xiuRoleId" placeholder="请选择" style="width: 100%">
                        <el-option v-for="(item, index) in acquireRoleLists" :key="index" :label="item.rolename" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="handljues = false">取消</el-button>
                <el-button type="primary" @click="handTrue">确定</el-button>
            </div>
        </el-dialog>

        <!-- 新增部门 -->
        <el-dialog :title="depTitle" :visible.sync="departmentVisible" width="400px" >
            <el-form ref="depForm" :model="depForm" :rules="depRules" label-width="80px">
                <el-form-item label="部门名称" prop="name">
                    <el-input v-model="depForm.name" placeholder="请输入部门名称" clearable></el-input>
                </el-form-item>

                <el-form-item label="负责人" prop="managerId">
                    <el-select v-model="depForm.managerId" filterable  clearable  placeholder="请选择部门负责人" >
                        <el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <!-- 直属领导 -->
                <el-form-item label="直属领导" prop="reportAuditUserid">
                    <el-select v-model="depForm.reportAuditUserid" filterable  clearable  placeholder="请选择直属领导" >
                        <el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="departmentVisible = false">取消</el-button>
                <el-button type="primary" @click="submitDepartment" >提交</el-button>
            </span>
        </el-dialog>

        <!-- 新增/编辑人员的Dialog -->
        <el-dialog :title="title" :visible.sync="dialogVisible" width="550px" >
            <el-form ref="form12" :model="insertForm" :rules="rules" label-width="80px">
                <el-form-item label="名字" prop="name">
                    <el-input v-model="insertForm.name" placeholder="请输入姓名" clearable></el-input>
                </el-form-item>
                <el-form-item label="电话" prop="phone">
                    <el-input v-model="insertForm.phone" placeholder="请输入电话号码" clearable></el-input>
                </el-form-item>
                <el-form-item label="薪酬方式" prop="salaryType" v-if="permissions.structurePersonnel&&user.timeType.isSecretSalary==0">
                    <el-radio-group v-model="insertForm.salaryType" @change="onSalaryTypeChange">
                    <el-radio  :label="0" >固定月成本</el-radio>
                    <el-radio  :label="1">计时工资</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="月成本" prop="monthCost" v-if="insertForm.salaryType == 0 && permissions.structurePersonnel&&user.timeType.isSecretSalary==0">
                    <el-input v-model="insertForm.monthCost" id="mc" @input="oninput" placeholder="请输入月成本,单位:元" clearable @keyup.native="restrictNumber('mc')"></el-input>
                    <span style="color:orange;font-size:12px;">按照每个月工作{{timeType.monthDays}}天，每天{{timeType.allday}}小时预估时薪</span>
                    <el-link :underline="false" style="color:blue;font-size:12px;margin-left:7px;" href="#/timetype">修改工作时长</el-link>
                </el-form-item>
                <el-form-item label="时薪" prop="cost" v-if="permissions.structurePersonnel&&user.timeType.isSecretSalary==0">
                    <el-input v-model="insertForm.cost" :disabled="insertForm.salaryType == 0" id="cc" style="width:120px;" @keyup.native="restrictNumber('cc')"
                     placeholder="请输入成本 单位：元/小时" clearable></el-input>
                    <span style="margin-left:25px;">生效日期</span>
                    <el-date-picker v-model="insertForm.costApplyDate" value-format="yyyy-MM-dd"></el-date-picker>
                </el-form-item>
                <el-form-item label="部门" prop="departmentId">
                    <!-- <el-cascader v-model="insertForm.departmentId" placeholder="请选择部门" style="width: 100%"
                    :options="option" :props="{ checkStrictly: false,expandTrigger: 'hover' }" :show-all-levels="false" clearable></el-cascader> -->
                    <el-cascader v-model="insertForm.departmentId" placeholder="请选择部门" style="width: 100%"
                    :options="option" :props="{ checkStrictly: true,expandTrigger: 'hover' }" :show-all-levels="false"  clearable></el-cascader>
                </el-form-item>
                <el-form-item label="直属上级">
                    <el-select v-model="insertForm.superiorId" placeholder="请选择" style="width: 100%" filterable clearable>
                        <el-option v-for="item in users" :label="item.name" :value="item.id" :key="item.id" :disabled="item.id == insertForm.id">
                            <span style="float: left">{{item.name}}</span>
                            <span style="float: right; color: #8492a6; font-size: 13px">{{item.departmentName}}</span>
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="角色" prop="roleId">
                    <el-select v-model="insertForm.roleId" placeholder="请选择角色" style="width: 100%">
                        <el-option v-for="item in acquireRoleList" :label="item.rolename" :value="item.id" :key="item.name">
                            <span style="float: left">{{item.rolename}}</span>
                            <span style="float: right; color: #8492a6; font-size: 13px">{{item.roleDescribe}}</span>
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item :label="item.name" v-for="item,index in userCustomConfig" :key="item.id">
                    <el-select v-if="item.type == 0" v-model="insertForm[suoying[index]]" placeholder="请选择" clearable style="width: 100%">
                        <el-option v-for="option in item.itemList" :label="option.name" :value="option.name" :key="option.id">
                        </el-option>
                    </el-select>
                    <el-input v-else v-model="insertForm[suoying[index]]" placeholder="请输入" clearable></el-input>
                </el-form-item>
                <el-form-item label="入职时间" prop="phone">
                    <el-date-picker v-model="insertForm.inductionDate" value-format="yyyy-MM-dd"></el-date-picker>
                </el-form-item>
                <el-form-item label="岗位职级" prop="phone">
                    <el-input v-model="insertForm.position" placeholder="请输入岗位职级别" clearable></el-input>
                </el-form-item>

                <div class="zhaunye"><p>专业证书</p><p><el-link type="primary" @click="addCertificateList()">添加更多证书</el-link><el-link v-if="permissions.structureCertificate" type="primary" @click="managementDiolog = true" style="margin-left: 20px">管理专业证书</el-link></p></div>
                <div class="certificateList">
                    <div class="moreList">
                        <div class="moreLiList" v-for="(item,index) in insertForm.certJson" :key="index">
                            <div style="margin-right: 10px;width: 160px;">
                                <el-select v-model="item.certId" placeholder="请选择专业证书" size="mini" @change="changeManagement(index)">
                                    <el-option v-for="item in managementTableData" :key="item.id" :label="item.name" :value="item.id"> </el-option>
                                </el-select>
                            </div>
                            <div><span>证书日期</span><el-date-picker size="mini" v-model="item.certDate" type="date" value-format="yyyy-MM-dd" placeholder="选择证书日期" style="width: 180px"></el-date-picker></div>
                            <div style="color: red;margin-left: 15px;cursor:pointer;" @click="deteFrames(index)"><i class="el-icon-delete"></i></div>
                        </div>
                    </div>
                </div>

            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="danger" @click="deleteUser(insertForm)" style="float:left;">删除</el-button>
                <el-button @click="dialogVisible=false">取消</el-button>
                <el-button type="primary" @click="submitInsert('insertForm')" :loading="submitLoading">提交</el-button>
            </span>
        </el-dialog>
        <!-- 编辑超级管理员的Dialog -->
        <el-dialog title="编辑人员" :visible.sync="dialogVisible1" width="550px" >
            <el-form ref="form1" :model="insertForm" :rules="rules" label-width="80px">
                <el-form-item label="名字" prop="name">
                    <el-input v-model="insertForm.name" placeholder="请输入姓名" clearable></el-input>
                </el-form-item>

                <el-form-item label="薪酬方式" prop="salaryType" v-if="permissions.structurePersonnel">
                    <el-radio-group v-model="insertForm.salaryType" @change="onSalaryTypeChange">
                    <el-radio  :label="0" >固定月成本</el-radio>
                    <el-radio  :label="1">计时工资</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="月成本" prop="monthCost" v-if="insertForm.salaryType == 0 && permissions.structurePersonnel" >
                    <el-input v-model="insertForm.monthCost" id="monthCost" @input="oninput" @keyup.native="restrictNumber('monthCost')" placeholder="请输入月成本,单位:元" clearable></el-input>
                    <span style="color:orange;font-size:12px;">按照每个月工作{{timeType.monthDays}}天，每天{{timeType.allday}}小时预估时薪</span>
                    <el-link :underline="false" style="color:blue;font-size:12px;margin-left:7px;" href="#/timetype">修改工作时长</el-link>
                </el-form-item>
                <el-form-item label="时薪" prop="cost" v-if="permissions.structurePersonnel">
                    <el-input v-model="insertForm.cost" id="cost" :disabled="insertForm.salaryType == 0" @keyup.native="restrictNumber('cost')" style="width:120px;"
                     placeholder="请输入成本 单位：元/小时" clearable></el-input>
                    <span style="margin-left:25px;">生效日期</span>
                    <el-date-picker v-model="insertForm.costApplyDate"  value-format="yyyy-MM-dd"></el-date-picker>
                </el-form-item>
                <el-form-item label="部门" prop="departmentId">
                    <el-cascader v-model="insertForm.departmentId" 
                    placeholder="请选择部门" 
                    style="width: 100%"
                    :options="option" 
                    :props="{ checkStrictly: true,expandTrigger: 'hover' }" :show-all-levels="false" 
                    clearable></el-cascader>
                </el-form-item>
                <el-form-item label="直属上级">
                    <el-select v-model="insertForm.superiorId" placeholder="请选择" style="width: 100%" filterable clearable>
                        <el-option v-for="item in users" :label="item.name" :value="item.id" :key="item.id" :disabled="item.id == insertForm.id">
                            <span style="float: left">{{item.name}}</span>
                            <span style="float: right; color: #8492a6; font-size: 13px">{{item.departmentName}}</span>
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible1=false">取消</el-button>
                <el-button type="primary" @click="submitInsert1" :loading="submitLoading">提交</el-button>
            </span>
        </el-dialog>

        <el-dialog title="人员历史成本" :visible.sync="userSalaryListDialog" width="550px" >
            <el-table :data="userSalaryList" highlight-current-row v-loading="listLoading" height="300px" style="width: 100%;">
                <el-table-column prop="userName" label="姓名" ></el-table-column>
                <el-table-column prop="indate" label="更新时间" width="150px">
                </el-table-column>
                <el-table-column prop="salaryType" label="薪酬方式" >
                    <template slot-scope="scope" >
                        {{scope.row.salaryType==0?"固定月薪":"计时工资"}}
                    </template>
                </el-table-column>
                <el-table-column prop="monthCost" label="月薪" >
                    <template slot-scope="scope" >
                        {{scope.row.monthCost}}元
                    </template>
                </el-table-column>
                <el-table-column prop="cost" label="时薪" >
                    <template slot-scope="scope" >
                        {{scope.row.cost}}元
                    </template>
                </el-table-column>
                
            </el-table>
        </el-dialog>
        <!--导出人员 -->
        <el-dialog title="导出人员列表" :visible.sync="exportDialogVisible" width="550px" >
            <el-form  label-width="100px">
                <el-form-item label="导出" >
                    <el-radio-group v-model="containInvalid" >
                    <el-radio  :label="1" >全部人员</el-radio>
                    <el-radio  :label="0" >仅活跃人员</el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="exportUsers">导出</el-button>
            </span>
        </el-dialog>
        <!-- 转让超级管理员权限 -->
        <el-dialog title="权限转让" :visible.sync="transferDialog" width="550px" >
            <el-form  label-width="200px">
                <el-form-item label="转让超级管理员角色至" >
                    <el-select v-model="toUserId" style="width:300px" filterable clearable>
                        <el-option v-for="item in allActiveUsers" :key="item.id" :value="item.id" :label="item.name">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="转让后自己的角色" >
                    <el-select v-model="myRoleId" style="width:300px">
                        <el-option v-for="item in acquireRoleList" :label="item.rolename" :value="item.id" :key="item.name">
                            <span style="float: left">{{item.rolename}}</span>
                            <span style="float: right; color: #8492a6; font-size: 13px">{{item.roleDescribe}}</span>
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="default" @click="transferDialog = false">取消</el-button>
                <el-button type="primary" @click="showConfirmDialog">确定</el-button>
            </span>
        </el-dialog>

        <!--停用时选择日期 -->
        <el-dialog title="离职停用员工" :visible.sync="deactiveDialog" width="550px" >
            <el-form  label-width="200px">
                <el-form-item label="员工离职日期" >
                    <el-date-picker type="date" v-model="deactiveDate" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择" />
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="default" @click="deactiveDialog = false">取消</el-button>
                <el-button type="primary" @click="confirmDeactive">确定</el-button>
            </span>
        </el-dialog>
        <!-- 管理专业证书 -->
        <el-dialog title="管理专业证书" :visible.sync="managementDiolog" width="500px" :before-close="handleClose">
            <div>
                <el-table :data="managementTableData" style="width: 100%" height="400">
                    <el-table-column prop="name" label="名称" width="280"></el-table-column>
                    <el-table-column label="操作" width="180">
                        <template slot-scope="scope">
                            <div>
                                <el-button type="primary" size="small" @click="editorManagementForm(scope.row)">编辑</el-button>
                                <el-button type="danger" size="small" @click="deteManagementForm(scope.row)">删除</el-button>
                            </div>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="managementDiolog = false">关 闭</el-button>
                <el-button type="primary" @click="addManagementDiologs()">新 增</el-button>
            </span>
        </el-dialog>
        <!-- 新增项目管理专业 -->
        <el-dialog title="新增/编辑管理专业证书" :visible.sync="addManagementDiolog" width="500px" :before-close="handleClose">
            <div>
                <el-form :model="managementForm" :rules="managementFormRou" ref="managementForm" label-width="150px" class="demo-ruleForm">
                    <el-form-item label="专业证书名称" prop="name">
                        <el-input v-model="managementForm.name" placeholder="请输入专业证书名称"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="addManagementDiolog = false">取 消</el-button>
                <el-button type="primary" @click="addManagementForm('managementForm')">提 交</el-button>
            </span>
        </el-dialog>
        <!-- 自定义配置项 -->
        <el-dialog title="自定义配置项管理" show-header="false" v-if="customConfigDialog" :visible.sync="customConfigDialog" :close-on-click-modal="false" customClass="customWidth" width="650px" top="20px">
            <div style="margin-left:30px;">
            <p v-for="item,index in customConfigList" :key="index">
                <el-input size="medium" v-model="item.name" placeholder="请输入自定义配置项名称" style="width:200px;margin-right:20px" maxlength="8"></el-input>
                    <el-radio size="medium" :disabled="!item.name" v-model="item.type" :label="0" style="margin-right:10px;margin-left:10px">下拉</el-radio>
                    <el-radio size="medium" :disabled="!item.name" v-model="item.type" :label="1">输入</el-radio>
                <span style="display:inline-block;">
                    <el-button v-if="cusItemTypes[index] == 0" type="primary" size="small" @click="getConfigItemBtn(item)">配置选项</el-button>
                    <span v-if="!item.id && item.name && item.type == 0" style="color:#999;font-size:13px">保存后可配置选项</span>
                </span>
                <el-button style="margin-left:20px" type="danger" size="small" v-if="item.id" @click="customConfigDelete(item,index)">删除</el-button>
            </p>
            
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="customConfigDialog = false" >关闭</el-button>
                <!-- <el-button type="primary" @click="customConfigListAdd" :disabled="customConfigList.length >= 5">新增</el-button> -->
                <el-button type="primary" @click="customConfigListSave" :loading="saveBtnLoading">保存</el-button>
                
            </div>


            <!-- 为下拉时的选项配置 -->
            <el-dialog title="配置选项" v-if="configItemDialog" :visible.sync="configItemDialog" :close-on-click-modal="false" customClass="customWidth" width="500px" append-to-body>
                <el-table :data="configItemList" height="400px" style="width:100%" key="configItemTable">
                    <el-table-column prop="id" width="60" label="序号">
                        <template slot-scope="scope" >
                            {{scope.$index + 1}}
                        </template>
                    </el-table-column>
                    <el-table-column prop="name" label="名称" ></el-table-column>
                    <el-table-column label="操作" width="150">
                        <template slot-scope="scope" >
                            <el-button size="small" type="primary" @click="configItemAorM(scope.row)">编辑</el-button>
                            <el-button size="small" type="danger" @click="configItemDelete(scope.row)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="configItemDialog = false" >关闭</el-button>
                    <el-button type="primary" @click="configItemAorM" >新增配置选项</el-button>
                </div>

                <el-dialog title="新增/编辑配置选项" v-if="configItemAorMDialog" :visible.sync="configItemAorMDialog" :close-on-click-modal="false" customClass="customWidth" width="500px" append-to-body>
                    <span>名称</span>
                    <el-input size="medium" v-model="AorMitem.name" placeholder="请输入自定义配置项名称" style="width:200px;margin-right:20px" maxlength="8"></el-input>

                    <div slot="footer" class="dialog-footer">
                        <el-button type="primary" @click="configItemAorMDialog = false" >取消</el-button>
                        <el-button type="primary" @click="configItemAorMSure" >提交</el-button>
                    </div>
                </el-dialog>
            </el-dialog>
        </el-dialog>


        <!-- 批量导入 -->
        <el-dialog title="人员批量导入" v-if="importDialog" :visible.sync="importDialog" customClass="customWidth" width="500px">
            <p>1. 下载
            <el-link type="primary" style="margin-left:5px;" :underline="false" href="./upload/人员导入模板.xlsx" download="人员导入模板.xlsx">人员导入模板.xlsx</el-link>
            </p>
            <p>2. 填写excel模板,并上传。</p>
            <p style="display: flex;justify-content: center;padding-bottom:1em;">
                <el-upload ref="upload"  action="#" :limit="1" :http-request="importUser" :show-file-list="false">
                <el-button type="primary" :underline="false" :loading="importingData">开始导入</el-button>
            </el-upload>
            </p>
        </el-dialog>
        <el-dialog title="同步企业微信通讯录" v-if="showSyncCWDialog" :visible.sync="showSyncCWDialog" customClass="customWidth" width="500px">
            <p>填写企业微信通讯录Secret 
                <el-popover placement="top" width="1200" trigger="hover">
                    <div class="imgFlex">
                        <div><img src="../../assets/image/Step1.jpg" style="width: 380px"/> <p><b>第一步:进入管理后台</b></p> </div>
                        <div class="imgBor"> <p></p> <img src="../../assets/image/Step2.jpg" style="width: 380px"/> <p><b>第二步:进入通讯录同步</b></p></div>
                        <div><img src="../../assets/image/Step3.jpg" style="width: 380px"/> <p><b>第三步:查看Secret</b></p></div>
                    </div>
                    <i class="el-icon-question" slot="reference" />
                </el-popover>
            </p>
            <p>
            <el-input v-model="contactSecret" style="width:380px;" :disabled="!editSecret"/><el-button @click="editSecret?saveContactSecret():editSecret=true;" >{{editSecret?'保存':'修改'}}</el-button>
            </p>
            <p style="display: flex;justify-content: center;padding-bottom:1em;">
                <el-button type="primary" :underline="false" :loading="importingData" :disabled="!canSync" @click="startCorpWxImport">开始同步</el-button>
            </p>
        </el-dialog>
    </section>
</template>

<script>
    import util from "../../common/js/util";
    let that
    export default {
        data() {
            return {
                editSecret: false,
                canSync: false,
                corpid:null,
                contactSecret:null,
                showSyncCWDialog: false,
                permissions: JSON.parse(sessionStorage.getItem("permissions")),
                handleSelectionZzjgshow: false,
                handljues: false,
                submitLoading:false,
                deactiveUser:null,
                deactiveDate:null,
                deactiveDialog:false,
                toUserId:null,
                myRoleId: null,
                allActiveUsers:[],
                transferDialog: false,
                containInvalid:1,
                exportDialogVisible: false,
                roleArray:["普通员工","超级管理员", "系统管理员", "公司高层","财务管理员", "项目管理员","公司领导"],
                roleDescArray:[{label:"普通员工",value:0, desc:"填报日报，参与项目协作"},
                {label:"系统管理员",value:2, desc:"具有除了创建系统管理员之外的全部功能"},
                // {label:"公司高层",value:3, desc:"查阅项目信息，人员工时情况"},
                {label:"财务管理员",value:4, desc:"财务核算成本，费用报销审核，负责组织架构管理"},
                {label:"项目管理员",value:5, desc:"创建和管理项目"},
                {label:"公司领导",value:6, desc:"查看日报、工时成本统计、财务核算、项目和报表"},
                ],
                userSalaryList:[],
                userSalaryListDialog: false,
                value:{},
                user: JSON.parse(sessionStorage.getItem("user")),
                users:[],
                tableHeight: 0,
                listLoading: false,
                total: 0,
                page: 1,
                size: 20,
                list: [],
                data: [
                    {
                        id: -1,
                        label: '全部人员',
                    },
                    {
                        id: 0,
                        label: '未分配',
                    }
                ],
                option: [],
                depData: {
                    id: -1,
                    label: '全部人员',
                },
                defaultProps: {
                    children: 'children',
                    label: 'label'
                },
                
                dialogVisible: false,
                title: "",
                insertForm: {
                    id: null,
                    name: null,
                    phone: null,
                    // role: null,
                    roleId: null,
                    monthCost:null,
                    cost: null,
                    departmentId: null,
                    salaryType:0,
                    costApplyDate: util.formatDate.format(new Date(), 'yyyy-MM-dd'),
                    inductionDate: util.formatDate.format(new Date(), 'yyyy-MM-dd'),
                    position: '',
                    certJson: [],
                    plateMap:{}
                },
                rules: {
                    name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
                    // phone: [{ required: true, message: "请输入电话", trigger: "blur" }],
                    // role: [{ required: true, message: "请选择角色", trigger: "blur" }],
                    roleId: [{ required: true, message: "请选择角色", trigger: "blur" }],
                    cost: [{ required: true, message: "请输入成本", trigger: "blur" }],
                    monthCost:[{ required: true, message: "请输入月成本", trigger: "blur" }]
                },
                managementFormRou: {
                    name: [{ required: true, message: "请输入专业证书", trigger: "blur" }],
                },
                dialogVisible1: false,

                departmentVisible: false,
                depTitle: '',
                depForm: {
                    id: null,
                    name: null,
                    parentId: null,
                    managerId: null,
                },
                depRules: {
                    name: [{ required: true, message: "请输入部门名称", trigger: "blur" }],
                },
                timeType:{},
                keyword: '',
                rolesa: [{
                    value: '',
                    label: '全部'
                }, {
                    value: '6',
                    label: '公司领导'
                }, {
                    value: '2',
                    label: '系统管理员'
                }, {
                    value: '4',
                    label: '财务管理员'
                }, {
                    value: '5',
                    label: '项目管理员'
                }, {
                    value: '0',
                    label: '普通员工'
                }],
                states: [{
                    value: '',
                    label: '全部'
                }, {
                    value: '1',
                    label: '活跃'
                }, {
                    value: '0',
                    label: '停用'
                }],
                status: '',
                role: '',
                jDarr: [],
                handleSelectionZzjgDate:[],
                handleSelectionZzjgwillchange : null,
                acquireRoleList: [], // 角色列表
                acquireRoleLists: [], // 没有超级管理员
                roleId: '',
                xiuRoleId: '',
                managementDiolog: false,
                addManagementDiolog: false,
                managementForm: {
                    name: ''
                },
                managementTableData: [],
                certificate: '',
                addUserId: '',
                userCustomConfig: [],

                customConfigDialog: false,
                importDialog: false,
                importingData: false,
                customConfigList: [],
                cusItemTypes: [],
                configItemList: [],
                configItemId: null,
                configItemDialog: false,

                configItemAorMDialog: false,
                AorMitem: {
                    name: null,
                    userCustomId: null,
                    id: null
                },
                tableLoading: false,

                suoying: ['plate1','plate2','plate3','plate4','plate5'],
                insertFormPlates: [],
                saveBtnLoading: false
            };
        },
        filters: {
            acquireRoleName(value) {
                for(var i in that.acquireRoleList) {
                    if(that.acquireRoleList[i].id == value) {
                        return that.acquireRoleList[i].rolename
                    }
                }
            }
        },
        beforeCreate: function () {
            that = this;
        },
        methods: {
            saveContactSecret() {
                if (!this.contactSecret) {
                    this.$message({
                            message: '请输入通讯录secret',
                            type: 'error'
                        })
                    return;
                }
                this.http.post('/wx-corp-info/saveContactSecret',{
                    corpid: this.corpid,
                    contactSecret:this.contactSecret
                },res => {
                    if(res.code == 'ok'){
                        this.$message({
                            message: '保存成功',
                            type: 'success'
                        })
                        this.canSync = true;
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.tableLoading = false
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            startCorpWxImport() {
                this.importingData = true;
                this.http.post('/wxcorp/getCorpMembs',{
                    corpId: this.corpid
                },res => {
                    this.importingData = false;
                    if(res.code == 'ok'){
                        this.showSyncCWDialog = false;
                        this.$message({
                                message: '同步完成',
                                type: "success"
                            });
                        this.getDepartment();
                        this.getUser();
                        this.getUsers();
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.tableLoading = false
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            //从企业微信同步通讯录
            syncWithCorpWx() {
                this.showSyncCWDialog = true;
                this.editSecret = false;
                this.http.post('/wx-corp-info/get',{
                    companyId: this.user.companyId
                },res => {
                    if(res.code == 'ok'){
                        this.contactSecret = res.data.contactSecret;
                        if (this.contactSecret) {
                            this.canSync = true;
                        } else {
                            this.editSecret = true;
                        }
                        this.corpid = res.data.corpid;
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.tableLoading = false
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            test(){
                this.getCustomConfigList()
            },
            // 自定义配置项
            customConfigShow(){
                this.getCustomConfigList()
                this.customConfigDialog = true
            },
            getConfigItemBtn(item){
                this.configItemDialog = true
                this.AorMitem.userCustomId = item.id
                this.getConfigItem()
            },
            getConfigItem(){ // 获取配置下拉数据
                this.http.post('/sub-user-custom/list',{
                    userCustomId: this.AorMitem.userCustomId
                },res => {
                    if(res.code == 'ok'){
                        this.configItemList = res.data
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.tableLoading = false
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            getCustomConfigList(){ // 获取自定义配置
                this.http.post('/user-custom/list',{},
                res => {
                    if(res.code == 'ok'){
                        let lists = JSON.parse(JSON.stringify(res.data))
                        this.userCustomConfig = JSON.parse(JSON.stringify(res.data))
                        // let lists = res.data
                        // this.customConfigList = res.data
                        this.customConfigList = [
                            { name: '', id: null, type: 1, companyId: null },
                            { name: '', id: null, type: 1, companyId: null },
                            { name: '', id: null, type: 1, companyId: null },
                            { name: '', id: null, type: 1, companyId: null },
                            { name: '', id: null, type: 1, companyId: null },
                        ]
                        for(let i in lists){
                            this.$set(this.customConfigList[i],'name',lists[i].name)
                            this.$set(this.customConfigList[i],'id',lists[i].id)
                            this.$set(this.customConfigList[i],'type',lists[i].type)
                            this.$set(this.customConfigList[i],'companyId',lists[i].companyId)
                        }
                        // console.log('customConfigList',this.customConfigList);
                        this.cusItemTypes = []
                        for(let j in this.customConfigList){
                            if(this.customConfigList[j].type == null || this.customConfigList[j].type == 0){
                                this.customConfigList[j].type = 0
                                this.cusItemTypes[j] = 0
                            }else{
                                this.cusItemTypes[j] = 1
                            }
                        }
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            customConfigListSave(){ // 保存/修改自定义配置
                // let jsonStr = ''
                // for(let i in this.customConfigList){
                //     if(this.customConfigList[i].name){
                //         jsonStr += JSON.stringify(this.customConfigList[i]) + ','
                //     }
                // }
                // jsonStr = jsonStr.substring(0,jsonStr.length - 1)
                // let jsonStr = []
                this.saveBtnLoading = true
                let parameter = this.customConfigList.filter(item => item.name.trim() != '')
                
                this.http.post('/user-custom/addOrMod',{
                    json: JSON.stringify(parameter)
                },res => {
                    if(res.code == 'ok'){
                        this.getCustomConfigList()
                        this.saveBtnLoading = false
                        this.$message({
                            message: '保存成功',
                            type: 'success'
                        })
                    }else {
                        this.saveBtnLoading = false
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.saveBtnLoading = false
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            customConfigDelete(item,index){
                if(item.id){
                this.http.post('/user-custom/delete',{
                    id: item.id
                },res => {
                    if(res.code == 'ok'){
                        this.getCustomConfigList()
                        this.$message({
                            message: '删除成功',
                            type: 'success'
                        })
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
                }else{
                    this.customConfigList.splice(index,1)
                }
            },

            configItemAorM(item){
                this.configItemAorMDialog = true
                if(item){
                    this.AorMitem.name = item.name
                    this.AorMitem.id = item.id
                }else{
                    this.AorMitem.name = null
                    this.AorMitem.id = null
                }
            },
            configItemAorMSure(){ // 新增/修改配置下拉选项
                if(!this.AorMitem.name){
                    this.$message({
                        message: '名称不能为空',
                        type: 'error'
                    })
                    return
                }
                this.http.post('/sub-user-custom/addOrMod',this.AorMitem,res => {
                    if(res.code == 'ok'){
                        this.configItemAorMDialog = false
                        this.getConfigItem()
                        this.$message({
                            message: '提交成功',
                            type: 'success'
                        })
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            configItemDelete(item){ // 删除配置下拉选项
                this.http.post('/sub-user-custom/delete',{
                    id: item.id
                },res => {
                    if(res.code == 'ok'){
                        this.getConfigItem()
                        this.$message({
                            message: '删除成功',
                            type: 'success'
                        })
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },


            // 获取添加人员时的自定义配置信息
            getUserCustomConfig(e){
                this.http.post('/user-custom/list',{},
                res => {
                    if(res.code == 'ok'){
                        this.userCustomConfig = JSON.parse(JSON.stringify(res.data))
                        for(let i in this.userCustomConfig){
                            if(this.userCustomConfig[i].type == 0){
                                
                                this.http.post('/sub-user-custom/list',{
                                    userCustomId: this.userCustomConfig[i].id
                                },res => {
                                    if(res.code == 'ok'){
                                        // this.userCustomConfig[i].itemList = res.data
                                        this.$set(this.userCustomConfig[i],'itemList',res.data)
                                    }else { 
                                        this.$message({
                                            message: res.msg,
                                            type: 'error'
                                        })
                                    }
                                },err => {
                                    this.$message({
                                        message: err,
                                        type: 'error'
                                    })
                                })
                            }
                        }
                        this.$nextTick(()=>{
                            // let opt = this.users[0].plateMap[this.userCustomConfig[0].name]
                            // console.log('userCustomConfig',this.userCustomConfig);
                            // console.log('insertForm',this.insertForm);
                        })
                    }else {
                        this.$message({
                            message: res.msg,
                            type: 'error'
                        })
                    }
                },err => {
                    this.$message({
                        message: err,
                        type: 'error'
                    })
                })
            },
            // customConfigListAdd(){
            //     this.customConfigList.push({
            //         name: '',
            //         type: 1
            //     })
            // },
            // 批量修改部门
            handleSelectionZzjg(e){
                // if (e.length == 0) {
                //     this.handleSelectionZzjgshow = false
                // }else{
                //     this.handleSelectionZzjgshow = true
                // }
                this.handleSelectionZzjgDate = e
            },
            handleSelectionZzjgbtn1(){
                this.handleSelectionZzjgshow = false
                this.$refs.handleSelectTable.clearSelection()
                this.handleSelectionZzjgwillchange = null
            },
            handleSelectionZzjgbtn2(){
                if (this.handleSelectionZzjgwillchange == null) {
                    this.$message('请选择部门');
                    return
                }
                //接口调用样例代码如下
                var ids = [];
                for (let index = 0; index < this.handleSelectionZzjgDate.length; index++) {
                    ids.push(this.handleSelectionZzjgDate[index].id)
                }
                var changeId = this.handleSelectionZzjgwillchange[this.handleSelectionZzjgwillchange.length - 1]
                this.http.post('/user/batchUpdateDept', {
                        userIds: JSON.stringify(ids),
                        deptId: changeId
                    },
                    res => {
                        if (res.code == "ok") {
                            this.$message({
                                message: '修改成功',
                                type: "success"
                            });
                            this.getUser()
                        } else {
                            this.$message({
                            message: res.msg,
                            type: "error"
                            });
                        }
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                
                // for (let index = 0; index < this.handleSelectionZzjgDate.length; index++) {
                //     this.handleSelectionZzjgDate[index].departmentId = this.handleSelectionZzjgwillchange[this.handleSelectionZzjgwillchange.length - 1]
                //     if (this.handleSelectionZzjgDate[index].role == 1) {
                //         this.submitInsert1(this.handleSelectionZzjgDate[index],1)
                //     }else{
                //         this.submitInsert(this.handleSelectionZzjgDate[index],1)
                //     }
                // }
                // this.handleSelectionZzjgwillchange = null
                this.handleSelectionZzjgshow = false
            },
            handleSelectionZzjgbtn3(){
                if(this.handleSelectionZzjgDate.length == 0){
                    this.$message('请选择人员');
                    return
                }
                this.handleSelectionZzjgshow = true
            },
            handJue() {
                if(this.handleSelectionZzjgDate.length == 0){
                    this.$message('请选择人员');
                    return
                }
                for(var i in this.acquireRoleList) {
                    if(this.acquireRoleList[i].isDefault == 1) {
                        this.xiuRoleId = this.acquireRoleList[i].id
                    }
                }
                this.handljues = true
                // console.log('触发了')
            },
            handTrue() {
                var arr = []
                for(var i in this.handleSelectionZzjgDate) {
                    arr.push(this.handleSelectionZzjgDate[i].id)
                }
                this.http.post('/user/batchUpdateRole', {
                    userIds: JSON.stringify(arr),
                    roleId: this.xiuRoleId
                },
                res => {
                    if (res.code == "ok") {
                        this.$message({
                            message: '操作成功',
                            type: "success"
                        });
                        this.handljues = false
                        this.getUser()
                    } else {
                        this.$message({
                        message: res.msg,
                        type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            deleteUser(targetUser) {
                this.$confirm("确定要删除该员工吗?", "提示", {
                    //type: 'warning'
                }).then(() => {
                    this.http.post('/user/deleteUser', {
                        userId: targetUser.id,
                    },
                    res => {
                        if (res.code == "ok") {
                            this.$message({
                                message: '删除成功',
                                type: "success"
                            });
                            this.getUser()
                        } else {
                            this.$message({
                            message: res.msg,
                            type: "error"
                            });
                        }
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                })
            },
            chufa(data, b, c, e) {
                if(this.depData == null || data.id != this.depData.id) {
                    // this.depData = data.id
                    this.depData = data;
                    this.page = 1;
                    this.getUser();
                }
            },
            jieDian(a, b, c) {
                var ids = a.id
                var arrs = this.jDarr
                arrs.push(ids)
                this.jDarr = arrs
            },
            shutDown(a, b, c) {
                var ids = a.id
                var arrs = []
                for (var i in this.jDarr) {
                    if(this.jDarr[i] != ids) {
                        arrs.push(this.jDarr[i])
                    }
                }
                this.jDarr = arrs
            },
            mouseleave(data,$event){
                $event.currentTarget.firstElementChild.nextElementSibling.setAttribute('class','node none poAub')
            },
            mouseover(data,$event){
                $event.currentTarget.lastChild.setAttribute('class','node block poAub');
            },
            confirmDeactive() {
                this.http.post('/user/deactiveUser', {
                        id: this.deactiveUser.id,
                        inactiveDate: this.deactiveDate
                    },
                    res => {
                        if (res.code == "ok") {
                            this.deactiveDialog = false;
                            this.$message({
                                message: '停用成功',
                                type: "success"
                            });
                            // this.getUsers();
                            this.getUser()
                        } else {
                            this.$message({
                            message: res.msg,
                            type: "error"
                            });
                        }
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
            },
            showDeactiveDialog(item) {
                this.deactiveDialog = true;
                this.deactiveUser = item;
            },
            restrictNumber(targetId) {
                let inpu = document.getElementById(targetId);
                inpu.value = inpu.value.replace(/[^\d.]/g, "");  //仅保留数字和"."
                inpu.value = inpu.value.replace(/\.{2,}/g, "."); //两个连续的"."仅保留第一个"."
                inpu.value = inpu.value.replace(".", "$#*").replace(/\./g,'').replace('$#*','.');//去除其他"."
                inpu.value = inpu.value.replace(/^(\d+)\.(\d\d).*$/, '$1.$2');;//限制只能输入两个小数
                if (inpu.value.indexOf(".") < 0 && inpu.value != "") { //首位是0的话去掉
                    inpu.value = parseFloat(inpu.value);
                }
            },
            showConfirmDialog() {
                if (this.toUserId == null || this.toUserId == '') {
                    this.$message({
                            message: '请选择要转让的人员',
                            type: "error"
                        });
                    return;
                }
                if (!this.myRoleId) {
                    this.$message({
                            message: '请选择转让后您自己的角色',
                            type: "error"
                        });
                    return;
                }
                this.$confirm("您将失去超级管理员角色，需要重新登录。确定要转让吗？", "提示", {
                    //type: 'warning'
                }).then(() => {
                    this.http.post('/user/changeSysManager', {
                        toUserId: this.toUserId,
                        myRoleId: this.myRoleId
                    },
                    res => {
                        if (res.code == "ok") {
                            sessionStorage.removeItem("user");
                            this.$router.push("/login");
                        } else {
                            this.$message({
                            message: res.msg,
                            type: "error"
                            });
                        }
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                    
                    
                });
            },
            transferRole() {
                this.transferDialog = true;
                this.http.post(this.port.manage.list, {
                    departmentId: -1,
                    pageIndex: 1,
                    pageSize: 99999
                },
                res => {
                    if (res.code == "ok") {
                        this.allActiveUsers = res.data.records.filter(u=>u.isActive == 1 && u.id != this.user.id);
                    } else {
                        this.$message({
                        message: res.msg,
                        type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            showExportDialog() {
                this.exportDialogVisible = true;
            },
            exportUsers() {
                this.http.post('/user/exportUsers', {
                    containInvalid: this.containInvalid
                },
                res => {
                    if (res.code == "ok") {
                        this.exportDialogVisible = false;
                        var aTag = document.createElement('a');
                        aTag.download = "全部员工列表.xls";
                        aTag.href = res.data;
                        aTag.click();
                    } else {
                        this.$message({
                        message: res.msg,
                        type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            showSalaryList(item) {
                this.userSalaryListDialog = true;
                this.userSalaryList = [];
                this.http.post('/user/getUserSalaryList', {
                    id: item.id
                },
                res => {
                    if (res.code == "ok") {
                        this.userSalaryList = res.data;
                    } else {
                        this.$message({
                        message: res.msg,
                        type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            getUsers() {
                this.http.post(this.port.manage.list, {
                    departmentId: -1,
                    pageIndex: 1,
                    pageSize: 99999,
                    keyword: this.keyword
                },
                res => {
                    if (res.code == "ok") {
                        this.users = res.data.records;
                    } else {
                        this.$message({
                        message: res.msg,
                        type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            onSalaryTypeChange(value) {
                if (value == 1) {
                    this.insertForm.monthCost = null;
                }
            },
            //选中部门
            choseDept(value) {
                // console.log(value);
            },
            //月成本输入变化
            oninput(e) {
                this.insertForm.cost = (this.insertForm.monthCost/this.timeType.monthDays/this.timeType.allday).toFixed(2);
            },
            // 获取本公司的工作时间设置
            getCompanyTimeSetting() {
                this.http.post('/time-type/getCompanyTimeSetting',{ 
                        companyId: this.user.companyId 
                    },
                    res => {
                        if (res.code == "ok") {
                            this.timeType = res.data;
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            
            importUserC(){
                this.importDialog = true
            },
            // 批量导入人员
            importUser(item) {
                //首先判断文件类型
                let str = item.file.name.split(".");
                let format = str[str.length - 1];
                if (format != "xls" && format != "xlsx") {
                    this.$message({
                        message: "请选择.xls或.xlsx文件",
                        type: "error"
                    });
                } else {
                    this.listLoading = true;
                    let formData = new FormData();
                    formData.append("file", item.file);
                    this.importingData = true
                    this.http.uploadFile( this.port.manage.import, formData,
                    res => {
                        this.importingData = false
                        this.$refs.upload.clearFiles();
                        this.listLoading = false;
                        if (res.code == "ok") {
                            this.$message({
                                message: "导入成功",
                                type: "success"
                            });
                            //重新读取列表
                            this.getUser();
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.importingData = false
                        this.$refs.upload.clearFiles();
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                }
            },

            //分页
            handleCurrentChange(val) {
                this.page = val;
                this.getUser();
            },

            handleSizeChange(val) {
                this.size = val;
                this.getUser();
            },

            //获取所有员工的列表
            getUser() {
                // console.log(12345)
                this.listLoading = true;
                this.http.post( this.port.manage.list, {
                    departmentId: this.depData.id,
                    pageIndex: this.page,
                    pageSize: this.size,
                    keyword: this.keyword,
                    status: this.status,
                    // role: this.role
                    roleId: this.roleId
                },
                res => {
                    this.listLoading = false;
                    if (res.code == "ok") {
                        this.list = res.data.records;
                        this.total = res.data.total;
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.listLoading = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            resetPwd(user) {
                this.$confirm( "确定要为" + user.name + "重置密码吗?", "重置密码", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                .then(() => {
                    this.http.post('/user/resetPwd', { userId: user.id },
                    res => {
                        if (res.code == "ok") {
                            this.$message({
                                message: "密码已重置为000000，请通知员工及时修改",
                                type: "success"
                            });
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                })
                .catch(() => {});
            },

            // 新增、编辑人员
            openInsertDialog(row) {
                if (row != null) {
                    var list = JSON.parse(JSON.stringify(row)) , arr = [] , array = [];
                    if(list.departmentCascade!='0' && list.departmentCascade!=null) {
                        if(list.departmentCascade.indexOf(",")>-1) {
                            arr = list.departmentCascade.split(",");
                        } else {
                            arr = [].concat(list.departmentCascade)
                        }
                    }
                        
                    for(var i in arr) {
                        array.push(parseInt(arr[i]))
                    }
                    // console.log(list, '数据')
                    // this.insertForm = {
                    //     id: list.id,
                    //     name: list.name,
                    //     phone: list.phone,
                    //     // role: list.role,
                    //     roleId: list.roleId,
                    //     monthCost:list.monthCost,
                    //     cost: list.cost,
                    //     departmentId: array.reverse(),
                    //     salaryType: list.salaryType,
                    //     costApplyDate: list.costApplyDate,
                    //     position: list.position
                    // };
                    this.addUserId = list.id
                    this.http.post('/user/getUserInfo', {
                        userId: list.id
                    },
                    res => {
                        if (res.code == "ok") {
                            this.insertForm = {
                                id: res.data.id,
                                name: res.data.name,
                                phone: res.data.phone,
                                roleId: res.data.roleId,
                                monthCost:res.data.monthCost,
                                cost: res.data.cost,
                                departmentId: array.reverse(),
                                salaryType: res.data.salaryType,
                                costApplyDate: res.data.costApplyDate,
                                inductionDate: res.data.inductionDate,
                                position: res.data.position,
                                certJson: res.data.certList,
                                plateMap: {},
                                superiorId: res.data.superiorId,
                                plate1: res.data.plate1,
                                plate2: res.data.plate2,
                                plate3: res.data.plate3,
                                plate4: res.data.plate4,
                                plate5: res.data.plate5,
                            };
                            this.getUserCustomConfig(1)
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                    this.title = "编辑人员"
                } else {
                    this.addUserId = ''
                    this.insertForm = {
                        id: null,
                        name: null,
                        phone: null,
                        // role: null,
                        roleId: null,
                        monthCost:null,
                        cost: null,
                        departmentId: null,
                        salaryType:0,
                        costApplyDate: util.formatDate.format(new Date(), 'yyyy-MM-dd'),
                        inductionDate: util.formatDate.format(new Date(), 'yyyy-MM-dd'),
                        position: '',
                        certJson: [],
                        plateMap: {},
                        plate1: null,
                        plate2: null,
                        plate3: null,
                        plate4: null,
                        plate5: null,
                    };
                    this.title = "新增人员"
                    this.getUserCustomConfig()
                    // this.insertForm.plateMap['定义测试文本'] = '测试文本'
                    // console.log('insertForm',this.insertForm);
                }
                this.dialogVisible = true;
                console.log(this.insertForm);
            },

            submitInsert() {
                var form = {}
                var ssR = this.upRepeat(this.insertForm.certJson)
                var trs = true
                this.$refs.form12.validate(valid => {
                    if (valid) {
                        this.submitLoading = true;
                        if(ssR) {
                            this.$message({
                                message: '重复证书',
                                type: 'error'
                            });
                            this.submitLoading = false;
                            return false
                        }
                        for(var s in this.insertForm.certJson) {
                            if(!this.insertForm.certJson[s].certDate || !this.insertForm.certJson[s].certId) {
                                trs = false
                            }
                        }
                        if(!trs) {
                            this.$message({
                                message: '证书未填写完整',
                                type: 'error'
                            });
                            this.submitLoading = false;
                            return false
                        }
                        form = {
                            name: this.insertForm.name,
                            phone: this.insertForm.phone,
                            // role: this.insertForm.role,
                            roleId: this.insertForm.roleId,
                            monthCost: this.insertForm.monthCost,
                            cost: this.insertForm.cost,
                            salaryType: this.insertForm.salaryType,
                            position: this.insertForm.position,
                            certJson: JSON.stringify(this.insertForm.certJson),
                            // certJson: this.insertForm.certJson
                            inductionDate: this.insertForm.inductionDate,
                            plate1: this.insertForm.plate1,
                            plate2: this.insertForm.plate2,
                            plate3: this.insertForm.plate3,
                            plate4: this.insertForm.plate4,
                            plate5: this.insertForm.plate5,
                        };

                        
                        // for(let i=0;i<5;i++) {
                        //     if(this.insertFormPlates[i]){
                        //         form[this.suoying[i]] = this.insertFormPlates[i]
                        //     }
                        // }

                        // console.log(form, 'form')
                        
                        if (this.insertForm.id != null) {
                            form.id = this.insertForm.id;
                        }
                        if (this.insertForm.superiorId){
                            form.superiorId = this.insertForm.superiorId
                        }
                        if (this.insertForm.costApplyDate != null) {
                            form.costApplyDate = this.insertForm.costApplyDate;
                        }
                        if (this.insertForm.departmentId != null) {
                            form.departmentId = this.insertForm.departmentId[this.insertForm.departmentId.length-1];
                        }

                        if(!ssR && trs) {
                            this.http.post( this.port.manage.insert, form,
                            res => {
                                this.submitLoading = false;
                                if (res.code == "ok") {
                                    this.$message({
                                        message: this.insertForm.id != null ? "修改" : "创建" + "成功",
                                        type: "success"
                                    });
                                    this.dialogVisible = false;
                                    this.getUser();
                                    this.getUsers()
                                } else {
                                    this.$message({
                                        message: res.msg,
                                        type: "error"
                                    });
                                }
                            },
                            error => {
                                this.listLoading = false;
                                this.$message({
                                    message: error,
                                    type: "error"
                                });
                            });
                        }
                    }
                });
                // console.log(form, '提交的数据')
                // return
                // console.log(ssR, trs)
                
                
            },

            // 切换角色
            switchRole(index) {
                this.listLoading = true;
                this.http.post( this.port.manage.permission, { id: this.list[index].id },
                res => {
                    this.listLoading = false;
                    if (res.code == "ok") {
                        this.$message({
                        message: "切换角色成功",
                        type: "success"
                        });
                        //重新读取列表
                        this.getUser();
                    } else {
                        this.$message({
                        message: res.msg,
                        type: "error"
                        });
                    }
                },
                error => {
                    this.listLoading = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            // 删除用户
            setActive(item, isActive) {
                var txt = isActive==1?"启用":"停用";
                this.$confirm( "确定要"+txt +" " + item.name + " 吗?", "账号"+txt, {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                .then(() => {
                    this.listLoading = true;
                    this.http.post('/user/setActive', { id: item.id, isActive: isActive},
                    res => {
                        this.listLoading = false;
                        if (res.code == "ok") {
                            this.$message({
                                message: txt+"成功",
                                type: "success"
                            });
                            //重新读取列表
                            this.getUser();
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                })
                .catch(() => {});
            },

            // 修改老板的成本
            openInsertDialog1(row) {
                var list1 = JSON.parse(JSON.stringify(row)) , arr1 = [] , array1 = [];
                if(list1.departmentCascade!='0' && list1.departmentCascade!=null) {
                    if(list1.departmentCascade.indexOf(",")>-1) {
                        arr1 = list1.departmentCascade.split(",");
                    } else {
                        arr1 = [].concat(list1.departmentCascade)
                    }
                }
                    
                for(var i in arr1) {
                    array1.push(parseInt(arr1[i]))
                }
                this.http.post('/user/getUserInfo', {
                        userId: list1.id
                    },
                    res => {
                        if (res.code == "ok") {
                            this.insertForm = {
                                id: res.data.id,
                                name: res.data.name,
                                phone: res.data.phone,
                                roleId: res.data.roleId,
                                monthCost:res.data.monthCost,
                                cost: res.data.cost,
                                departmentId: array1.reverse(),
                                salaryType: res.data.salaryType,
                                costApplyDate: res.data.costApplyDate,
                                inductionDate: res.data.inductionDate,
                                position: res.data.position,
                                certJson: res.data.certList,
                                plateMap: {},
                                superiorId: res.data.superiorId,
                            }
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }},
                        error => {
                                this.listLoading = false;
                                this.$message({
                                    message: error,
                                    type: "error"
                                });
                            });
                // console.log(list1)
                // this.insertForm = {
                //     id: list1.id,
                //     name: list1.name,
                //     phone: list1.phone,
                //     roleId: list1.roleId,
                //     monthCost:list1.monthCost,
                //     cost: list1.cost,
                //     departmentId: array1.reverse(),
                //     salaryType: list1.salaryType,
                //     name: list1.name,
                //     position: list1.position,
                //     certJson: list1.certJson
                // };
                this.dialogVisible1 = true;
            },

            submitInsert1() {
                var form = {}
                    this.$refs.form1.validate(valid => {
                    if (valid) {
                        this.submitLoading = true;
                        form = {
                            id: this.insertForm.id,
                            name: this.insertForm.name,
                            phone: this.insertForm.phone,
                            roleId: this.insertForm.roleId,
                            monthCost: this.insertForm.monthCost,
                            cost: this.insertForm.cost,
                            position: this.insertForm.position,
                            certJson: this.insertForm.certJson,
                            inductionDate: this.insertForm.inductionDate
                        };
                        if (this.insertForm.departmentId != null) {
                            form.departmentId = this.insertForm.departmentId[this.insertForm.departmentId.length-1];
                        }
                        if (this.insertForm.costApplyDate != null) {
                            form.costApplyDate = this.insertForm.costApplyDate;
                        }
                        if (this.insertForm.superiorId){
                            form.superiorId = this.insertForm.superiorId
                        }

                        this.http.post( this.port.manage.insert, form,
                        res => {
                            this.submitLoading = false;
                            if (res.code == "ok") {
                                this.$message({
                                    message: "修改成功",
                                    type: "success"
                                });
                                this.dialogVisible1 = false;
                                //重新读取列表
                                this.getUser();
                                this.getUsers()
                            } else {
                                this.$message({
                                    message: res.msg,
                                    type: "error"
                                });
                            }
                        },
                        error => {
                            this.listLoading = false;
                            this.$message({
                                message: error,
                                type: "error"
                            });
                        });
                    }
                });

                
            },

            // 获取部门列表
            getDepartment() {
                this.http.post( this.port.manage.depList, {},
                res => {
                    if (res.code == "ok") {
                        var list = res.data , list1 = JSON.parse(JSON.stringify(res.data));
                        list.splice(0,0,{
                            id: -1,
                            label: '全部人员',
                        })
                        list.push({
                            id: 0,
                            label: '未分配',
                        })
                        this.data = list;
                        // console.log(list, "部门数据")
                        this.option = this.changeArr(list1);
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            // 修改数组
            changeArr(arr) {
                for (var i = 0; i < arr.length; i++) {
                    if(arr[i].id != -1 && arr[i].id != 0) {
                        if (arr[i].children != null && arr[i].children.length>0) {
                            arr[i].children = this.changeArr(arr[i].children);
                        }
                        arr[i].id && (arr[i].value = arr[i].id);
                        delete arr[i].id;
                    }
                }
                for(var i in arr) {
                    if(arr[i].id == -1 || arr[i].id == 0) {
                        arr.splice(i,1)
                    }    
                }
                return arr;
            },

            // 部门列表点击
            handleNodeClick(data) {
                // console.log(data, 999)
                if(this.depData == null || data.id != this.depData.id) {
                    this.depData = data;
                    this.page = 1;
                    this.getUser();
                }
            },

            // 新增、修改部门
            createDepartment(i) {
                setTimeout(() => {
                    var that = this
                    if(i == -2) {//创建子部门
                        that.depForm = {
                            id: null,
                            name: null,
                            parentId: null,
                            managerId: null,
                        }
                        if(that.depData.id != -1 && that.depData.id != 0) {
                            that.depForm.parentId = that.depData.id;
                        }
                        that.depTitle = "新增子部门";
                    } else if(i == -1) {//创建一级部门
                        that.depForm = {
                            id: null,
                            name: null,
                            parentId: null,
                            managerId: null,
                        }
                        that.depTitle = "新增部门";
                    } else {
                        if(that.depData.managerId == "null") {
                            that.depData.managerId = ''
                        }
                        if(that.depData.reportAuditUserid == "null") {
                            that.depData.reportAuditUserid = ''
                        }
                        that.depForm = {
                            id: that.depData.id,
                            name: that.depData.label,
                            parentId: that.depData.parentId,
                            managerId: that.depData.managerId,
                            reportAuditUserid: that.depData.reportAuditUserid
                        }
                        // if(that.depData.reportAuditUserid != null && that.depData.reportAuditUserid != "null" && that.depData.reportAuditUserid.length > 0) {
                        //     that.depForm.reportAuditUserid = that.depData.reportAuditUserid
                        // }
                        that.depTitle = "编辑部门";
                    }
                    that.departmentVisible = true;
                })
                // if(i == -2) {//创建子部门
                //     this.depForm = {
                //         id: null,
                //         name: null,
                //         parentId: null,
                //         managerId: null,
                //     }
                //     if(this.depData.id != -1 && this.depData.id != 0) {
                //         this.depForm.parentId = this.depData.id;
                //     }
                //     this.depTitle = "新增子部门";
                // } else if(i == -1) {//创建一级部门
                //     this.depForm = {
                //         id: null,
                //         name: null,
                //         parentId: null,
                //         managerId: null,
                //     }
                //     this.depTitle = "新增部门";
                // } else {
                //     if(this.depData.managerId == "null") {
                //         this.depData.managerId = ''
                //     }
                //     if(this.depData.reportAuditUserid == "null") {
                //         this.depData.reportAuditUserid = ''
                //     }
                //     this.depForm = {
                //         id: this.depData.id,
                //         name: this.depData.label,
                //         parentId: this.depData.parentId,
                //         managerId: this.depData.managerId,
                //         reportAuditUserid: this.depData.reportAuditUserid
                //     }
                //     // if(this.depData.reportAuditUserid != null && this.depData.reportAuditUserid != "null" && this.depData.reportAuditUserid.length > 0) {
                //     //     this.depForm.reportAuditUserid = this.depData.reportAuditUserid
                //     // }
                //     this.depTitle = "编辑部门";
                // }
                // this.departmentVisible = true;
            },
            
            submitDepartment() {
                this.$refs.depForm.validate(valid => {
                    if (valid) {
                        var form = {
                            name: this.depForm.name,
                        };
                        if(this.depForm.id != null) {
                            form.id = this.depForm.id
                        }
                        if(this.depForm.parentId != null) {
                            form.parentId = this.depForm.parentId
                        }
                        if (this.depForm.managerId) {
                            form.managerId = this.depForm.managerId
                        } 
                        // console.log(this.depForm)
                        if (this.depForm.reportAuditUserid) {
                            form.reportAuditUserid = this.depForm.reportAuditUserid
                        } 
                        this.http.post( this.depForm.id==null?this.port.manage.add:this.port.manage.edit, form,
                        res => {
                            if (res.code == "ok") {
                                this.$message({
                                    message: this.depForm.id==null?"新增成功":"修改成功",
                                    type: "success"
                                });
                                this.departmentVisible = false;
                                if (this.depForm.id !=null) {
                                    this.depData.label = form.name;
                                    this.depData.managerId = form.managerId;
                                }

                                this.getDepartment();
                            } else {
                                this.$message({
                                    message: res.msg,
                                    type: "error"
                                });
                            }
                        },
                        error => {
                            this.listLoading = false;
                            this.$message({
                                message: error,
                                type: "error"
                            });
                        });
                    }
                });
            },

            // 删除部门
            deleteDep() {
                var that = this
                setTimeout(() =>{
                    that.$confirm( "确定要删除部门" + that.depData.label + "吗?", "删除部门", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                    })
                    .then(() => {
                        that.listLoading = true;
                        that.http.post( that.port.manage.del, { id: that.depData.id },
                        res => {
                            that.listLoading = false;
                            if (res.code == "ok") {
                                that.$message({
                                    message: "删除成功",
                                    type: "success"
                                });
                                that.depData = {
                                    id: -1,
                                    label: '全部人员',
                                }
                                that.getDepartment();
                                that.getUser();
                            } else {
                                that.$message({
                                    message: res.msg,
                                    type: "error"
                                });
                            }
                        },
                        error => {
                            that.listLoading = false;
                            that.$message({
                                message: error,
                                type: "error"
                            });
                        });
                    })
                    .catch(() => {});
                },100);
                // this.$confirm( "确定要删除部门" + this.depData.label + "吗?", "删除部门", {
                //     confirmButtonText: "确定",
                //     cancelButtonText: "取消",
                //     type: "warning"
                // })
                // .then(() => {
                //     this.listLoading = true;
                //     this.http.post( this.port.manage.del, { id: this.depData.id },
                //     res => {
                //         this.listLoading = false;
                //         if (res.code == "ok") {
                //             this.$message({
                //                 message: "删除成功",
                //                 type: "success"
                //             });
                //             this.depData = {
                //                 id: -1,
                //                 label: '全部人员',
                //             }
                //             this.getDepartment();
                //             this.getUser();
                //         } else {
                //             this.$message({
                //                 message: res.msg,
                //                 type: "error"
                //             });
                //         }
                //     },
                //     error => {
                //         this.listLoading = false;
                //         this.$message({
                //             message: error,
                //             type: "error"
                //         });
                //     });
                // })
                // .catch(() => {});
            },

            // 关键搜索
            searchList() {
                // console.log(this.keyword)
                this.listLoading = true;
                this.http.post( this.port.manage.list, {
                    departmentId: this.depData.id,
                    pageIndex: this.page,
                    pageSize: this.size,
                    keyword: this.keyword
                },
                res => {
                    this.listLoading = false;
                    if (res.code == "ok") {
                        this.list = res.data.records;
                        this.total = res.data.total;
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.listLoading = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            // 获取角色
            acquireRole() {
                // this.http.post('/permission/getFrontRoleList', {
                this.http.post('/permission/getFrontRoleList', {
                    companyId: this.user.companyId
                },
                res => {
                    if (res.code == "ok") {
                        // console.log(res.data, '获取角色')
                        this.acquireRoleList = res.data
                        var arr = []
                        for(var i in res.data) {
                            if(res.data[i].rolename != '系统管理员') {
                                arr.push(res.data[i])
                            }
                        }
                        this.acquireRoleLists = arr
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            // 获取专业分类
            getProfessional() {
                this.http.post('/company-cert/list', {},
                res => {
                    if (res.code == "ok") {
                        this.managementTableData = res.data
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            addManagementDiologs() {
                this.managementForm = {name: ''}
                this.addManagementDiolog = true
            },
            // 新增/编辑人员专业费雷
            addManagementForm(formName) {
                this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.http.post('/company-cert/addOrMod', this.managementForm,
                    res => {
                        if (res.code == "ok") {
                            this.$message({
                                message: '操作成功',
                                type: "success"
                            });
                            this.getProfessional()
                            this.addManagementDiolog = false
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                } else {
                    // console.log('error submit!!');
                    return false;
                }
                });
            },
            // 编辑
            editorManagementForm(item) {
                this.managementForm = item
                this.addManagementDiolog = true
            },
            // 删除专业
            deteManagementForm(item) {
                this.$confirm('该操作可能造成已有数据丢失，确定要删除吗?', '删除专业证书', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.http.post('/company-cert/delete', {
                        id: item.id
                    },
                    res => {
                        if (res.code == "ok") {
                            this.$message({
                                message: '操作成功',
                                type: "success"
                            });
                            this.getProfessional()
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
                });
            },
            // 点击添加更多帧数
            addCertificateList() {
                var obj = {}
                obj.certId = ''
                obj.certName = ''
                obj.certDate = ''
                obj.id = ''
                obj.userId = this.addUserId
                this.insertForm.certJson.push(obj)
            },
            // 选择专业帧数
            changeManagement(is) {
                var id = this.insertForm.certJson[is].certId
                for(var i in this.managementTableData) {
                    if(this.managementTableData[i].id == id) {
                        this.insertForm.certJson[is].certName = this.managementTableData[i].name
                    }
                }
            },
            // 查重复
            upRepeat(arr) {
                var obj = {};
                for(var i in arr) {
                    if(obj[arr[i].certName]) {
                        return true;
                    }
                    obj[arr[i].certName] = true;
                }
                return false;
            },
            // 删除帧数
            deteFrames(i) {
                this.insertForm.certJson.splice(i, 1)
            }
        },

        created() {
            let height = window.innerHeight;
            this.tableHeight = height - 195;
            const that = this;
            window.onresize = function temp() {
                that.tableHeight = window.innerHeight - 195;
            };
        },
        mounted() {
            this.deactiveDate = util.formatDate.format(new Date(), 'yyyy-MM-dd');
            this.getDepartment();
            this.getUser();
            this.getCompanyTimeSetting();
            this.getUsers();
            this.acquireRole();
            this.getProfessional()
        }
    };
</script>

<style lang="scss" scoped>
.imgFlex {
    display: flex;
    align-items: center;
}
.imgFlex p {
    width: 100%;
    text-align: center;
}
.imgFlex div {
    padding: 10px;
    display: flex;
    align-content: space-between;
    flex-wrap: wrap;
    height: 600px;
}
.imgBor {
    border-right: 1px solid #666;
    border-left: 1px solid #666;
}
    .custom-tree-node {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 14px;
        padding-right: 8px;
    }
    .left {
        
        border-right: 1px solid #f2f2f2;
        overflow: hidden;
        .department {
            background:#f2f2f2;
            line-height: 60px;
            color:#666;
            padding:0 10px;
            height:60px;
            font-size: 15px;
            div {
                float: right;
                color: #20a0ff;
                font-size: 14px;
                cursor: pointer;
            }
        }
        .tree {
            overflow: auto;
        }
    }

    .nowTime {
        height: 40px;
        line-height: 40px;
        font-size: 16px;
        color: #20a0ff;
        margin-left: 10px;
        cursor: pointer;
        i {
            margin-right: 10px;
        }
    }
    .none {
        display: none;
    }
    .block {
        display: block;
    }
</style>

<style lang="scss">
    .tree {
        .el-tree-node__label {
            overflow-x: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            
        }
    }
    .el-divider--horizontal {
        margin: 0px;
        background:#f3f3f3;
    }
    //全局的作用范围
    .el-tree-node__content {
        height:36px;
    }
    .zhaunye {
        display: flex;
        justify-content: space-between;
        padding: 0 5px 0 10px;
    }
    .certificateList {
        width: 98%;
        box-sizing: border-box;
        margin: 0 10px 0 10px;
        border: 1px solid rgb(194, 194, 194);
        min-height: 200px;
        max-height: 200px;
        overflow: auto;
        padding: 10px;
    }
    .moreAl {
        display: flex;
        width: 100%;
        justify-content: center;
    }
    .moreLiList {
        display: flex;
        margin-bottom: 10px;
    }
    .moreLiList div {
        line-height: 30px;
    }
    .moreLiList span {
        display: inline-block;
        margin-right: 15px;
    } 
    .poAub {
        position: absolute;
        right: 10px;
    }
</style>