gdy_pc_8/src/performance/views/assessManagement/assessManagement.vue

<template>
  <div class="all boxMinHeight">


    <!-- 头部筛选条件，按钮组，流程节点 -->
    <header>
      <div>
        <el-row :gutter="10" type="flex" justify="space-between">
          <el-col :span="24">
            <div class="flex-box">
              <div class="flex-box-ce" style="margin-right: 10px;">
                <el-cascader v-model="headValue" :options="options" :props="props" :show-all-levels="false"
                  style="width: 300px;"></el-cascader>
              </div>
              <!-- 选择部门下拉框 -->
              <div class="dept_wdiv">
                <div class="dept_inp" @click="show_dept_selector = true">
                  <span v-if="deptVisibleName != ''">{{ deptVisibleName }}</span>
                  <span v-else style="color: #b9b9b9;">选择部门</span>
                </div>
                <i class="el-icon-arrow-down"></i>
              </div>
              <EmployeeSelector :title="'选择部门'" :isChecKedAll="false" :can_select_employee="false"
                :can_select_dept="true" :dept_children="false" :selected="dept_selected"
                :visible.sync="show_dept_selector" @confirm="dept_confirm" />
              <!-- 选择部门下拉框 -->
              <!-- 选择考核模板下拉框 -->
              <el-select v-model="groupValue" @change="groupChange" clearable class="margin-l width-300"
                placeholder="选择考核表">
                <el-option v-for="item in groupOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
              </el-select>
              <!-- 选择考核模板下拉框 -->
              <!-- 姓名搜索 -->
              <el-select v-model="employee_ids" multiple filterable clearable class="margin-l" placeholder="姓名搜索">
                <el-option v-for="item in employees" :key="item.id" :label="item.name" :value="item.id"></el-option>
              </el-select>
              <!-- 姓名搜索 -->
              <img v-if="all_finish" src="static/images/guidang.png" class="guidang" />
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="10" style="margin-top: 20px;">
          <el-col :span="24">
            <!-- 按钮组 -->
            <div class="flex-box-ce">
              <template v-if="!all_finish">
                <el-button-group>
                  <el-button type="primary" icon="el-icon-s-promotion" v-if="$getRole(1) && $isAuthoritys_jx($7)"
                    @click="amhrsponsor">发起考核</el-button>
                  <el-button type="primary" icon="el-icon-s-custom" v-if="$getRole(1) || $getRole(2)"
                    @click="isManagement = true">人员管理</el-button>
                  <!-- 主管理员、有【开始评分】权限的子管理员 -->
                  <el-button type="primary" icon="el-icon-edit-outline" v-if="$getRole(1) && $isAuthoritys_jx($8)"
                    @click="startisChecks">开始评分</el-button>
                </el-button-group>
                <!-- 主管理员、有【菜单权限】权限的子管理员 -->
                <el-dropdown v-if="$getRole(1)" style="margin-left:11px;" @command="handleCommand">
                  <el-button>更多 <i class="el-icon-arrow-down"></i></el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item v-for="(item, index) in dropdownMenu" :key="index" :command="item.key"
                      :divided="item.bordok" v-if="item.isShow">
                      {{ item.name }}
                    </el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </template>
            </div>
            <!-- 按钮组 -->
          </el-col>
        </el-row>
      </div>



      <div class="navigationL flex-box-ce flex-d-wrap">

        <div v-for="(item, index) in navigationList" :key="index" class="flex-box-ce" 
          @click="navClick(item)">
          <template v-if="item.num">
            <el-badge :value="item.num" class="item">
              <span class="flex-box-ce" :class="{ action: navcli == item.id }">
                <div>{{ index ? index : '' }} {{ item.name }}</div>
                <div v-if="item.hint">
                  &nbsp;
                  <el-tooltip class="item" effect="dark" :content="item.hint" placement="top">
                    <i class="el-icon-warning-outline navsvg1" v-if="item.hint"></i>
                  </el-tooltip>
                </div>
              </span>
            </el-badge>
          </template>
          <span class="flex-box-ce" :class="{ action: navcli == item.id }" v-else>
            <div>{{ index ? index : '' }} {{ item.name }}</div>
            <div v-if="item.hint">
              &nbsp;
              <el-tooltip class="item" effect="dark" :content="item.hint" placement="top">
                <i class="el-icon-warning-outline navsvg1" v-if="item.hint"></i>
              </el-tooltip>
            </div>
          </span>
          <div v-if="index == 0" class="navsvg2"></div>

          <i v-if="navigationList.length != index + 1 && index != 0" class="el-icon-right navsvg3"></i>
        </div>
      </div>


      <template v-if="$getRole(1)">
        <el-alert type="warning" style="margin-bottom: 15px;" v-if="navcli != 0 && navcli != 3 && navcli != 11"
          :closable="false">
          该绩效节点“<span style="font-weight: 600;">{{ getNode }}</span>”
          参与人员：<span style="font-weight: 600;">{{ total }}</span>人，
          <!-- 已完成录入<span style="font-weight: 600;">{{ asstabData.length }}</span>人，
          未完成录入<span style="font-weight: 600;">{{ total - asstabData.length }}</span>人 -->
          <span class="blue" style="cursor: pointer; margin-left: 10px" @click="isPending = true">查看名单</span>
        </el-alert>
      </template>
      <div v-if="navcli == 3 && $getRole(1) && $isAuthoritys_jx($8)" style="margin-bottom: 15px;">
        <el-button type="primary" @click="pf()">批量开始评分</el-button>
      </div>
    </header>
    <!-- 头部筛选条件，按钮组 -->



    <el-table :data="asstabData" v-loading="assDetLoad" @row-click="assDetClick" style="width: 100%; margin-top: 20px;"
      :header-cell-style="{ background: '#ECF5FF' }" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" v-if="navcli == 3"></el-table-column>
      <el-table-column label="姓名" min-width="200">
        <template slot-scope="scope">
          <userImage class="fl" :id="scope.row.employee_id" style="margin-top: 9px;" :user_name="scope.row.name"
            :img_url="scope.row.img_url" width="35px" height="35px" fontSize="12px"></userImage>
          <span style="margin-left: 10px; line-height: 50px;">{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="dept_list" label="部门" min-width="300">
        <template slot-scope="scope">
          <template v-if="scope.row.dept_list.length > 0">
            <span v-for="(item, index) in scope.row.dept_list" :key="index">
              {{ item.dept_name }}
              <span v-if="scope.row.dept_list.length - index > 1">,</span>
            </span>
          </template>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column prop="group_name" label="考核表" min-width="200">
        <template slot-scope="scope">
          <span v-if="!scope.row.relevance_group.delete_time">{{ scope.row.relevance_group.name }}</span>
          <span v-else class="red">该考核表已被删除</span>
        </template>
      </el-table-column>
      <el-table-column prop="final_point" min-width="140" label="考核结果">
        <template slot-scope="scope">
          <template v-if="scope.row.final_point">
            <span v-if="$getRole(1)">{{ scope.row.final_point }}</span>
            <span v-else-if="scope.row.publicity">{{ scope.row.final_point }}</span>
            <span v-else>-</span>
          </template>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <el-table-column prop="final_level" min-width="140" label="绩效等级">
        <template slot-scope="scope">
          <template v-if="scope.row.final_level">
            <span v-if="$getRole(1)">{{ scope.row.final_level }}</span>
            <span v-else-if="scope.row.publicity">{{ scope.row.final_level }}</span>
            <span v-else>-</span>
          </template>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <el-table-column prop="peoplenum" min-width="200" label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="medium" @click="assDetClick(scope.row)">查看</el-button>
          <template v-if="$isAuthoritys_jx($9) && !all_finish && scope.row.doing_id == 11">
            <el-button type="text" size="medium" @click.stop="theResultsOf1(scope.row, 1)">调整考核结果</el-button>
            <el-button type="text" size="medium" @click.stop="theResultsOf1(scope.row, 2)">调整绩效等级</el-button>
          </template>
          <el-button type="text" v-if="navcli == 3 && $getRole(1) && $isAuthoritys_jx($8)" size="medium"
            @click.stop="pf(scope.row)">开始评分</el-button>
        </template>
      </el-table-column>
    </el-table>
    <Pagination :page="asstabParams.page" :page_size="asstabParams.page_size" :total="total"
      @handleSizeChange="handleSizeChange" @handleCurrentChange="handleCurrentChange"></Pagination>


    <BrawerBox drawerTitle="请选择开始评分的考核模板" :showDrawer.sync="isChecks">
      <template slot="main">
        <div v-loading="isChecksLoad">
          <div style="padding-top:10px;">
            <JxSearch :screen="2" title="搜索考核模板" ref="braSearch" @confirm="braSearch"></JxSearch>
          </div>
          <template v-if="scoreGroup.length > 0">
            <div class="flex-box-ce li" style="margin-top: 20px;"><el-checkbox class="flex-box-ce"
                v-model="isAllSelectIndex" label="全选"></el-checkbox></div>
            <ul class="ul">
              <li v-for="(item, index) in scoreGroup" :key="index" class="flex-box-ce li">
                <el-checkbox class="flex-box-ce" style="padding: 0;" :disabled="item.disabled" v-model="item.check">
                  <div class="flex-box-ce">
                    <div class="flex-1">
                      <!-- <span v-if="item.all_exec_over" class="blue-box" style="padding: 5px 10px; border-radius: 3px; width: 80px;height: 24px; font-size: 12px;">已开始评分</span> -->
                      <span>{{ item.name }}</span>
                    </div>
                    <div class="blue" v-if="item.count_employee > 0">{{ item.count_employee }} 人</div>
                  </div>
                </el-checkbox>
              </li>
              <div class="fontColorC" style="text-align: center;padding: 10px 0;font-size: 12px;">没有更多了</div>
            </ul>
          </template>
          <NoData v-else></NoData>
        </div>
      </template>
      <template slot="footer">
        <div style="position: absolute;left: 20px;font-size: 14px;color: #2b7ce0">已选择：{{ getLeng }}个</div>
        <el-button plain @click="isChecks = false">取消</el-button>
        <el-button type="primary" @click="beginGrade">开始评分</el-button>
      </template>
    </BrawerBox>
    <!-- 导出执行记录 -->
    <EmployeeSelector :title="'选择人员'" :isChecKedAll="false" :max="20" :isRequired="true" :can_select_employee="true"
      :can_select_dept="false" :user_employee_list="true" :employee_list="employee_list" :visible.sync="isDerive"
      @confirm="confirmDerive" />

    <!-- 公式结果 -->
    <EmployeeSelector :title="'结果公布'" :is_filtration_creator="false" :can_select_employee="true"
      :can_select_dept="false" :user_employee_list="true" :employee_list="employee_list" :selected="selected"
      :visible.sync="isResult" @confirm="confirmResult" />

    <!-- 更多-管理 -->
    <BrawerBox drawerTitle="人员管理" :showDrawer.sync="isManagement">
      <template slot="main">
        <div class="m-content">
          <div>
            <div class="m-title">变更参与考核人员（{{ employee_list.length }}人）</div>
            <div class="flex-box-ce" style="margin-top: 20px;">
              <div style="margin-right: 20px;cursor: pointer;" @click="showSelectUser(1)">
                <i class="el-icon-circle-plus-outline blue"></i>
                添加
              </div>
              <div style="cursor: pointer;" @click="showSelectUser(2)">
                <i class="el-icon-remove-outline red"></i>
                删除
              </div>
            </div>
          </div>
        </div>
      </template>
    </BrawerBox>

    <!-- 更多-管理-人员选择添加 -->
    <EmployeeSelector title="添加被考核人员" :is_filtration_creator="false" :can_select_employee="true"
      :can_select_dept="false" :user_employee_list="true" :isRequired="true" :employee_list="add_employee_list"
      :visible.sync="isShowUser" @confirm="confirmUser">
      <template slot="footer">
        <div style="text-align: center;" class="orange flex-1">*添加成功后，别忘了帮Ta加入【绩效等级配置】喔!*</div>
      </template>
    </EmployeeSelector>

    <!-- 更多-管理-人员选择删除 -->

    <EmployeeSelector :title="packageName + '：选择被删除人员'" :is_filtration_creator="false" :can_select_employee="true"
      :can_select_dept="false" :isRequired="true" :user_employee_list="true" :include_deleted="true"
      :employee_list="employee_list" :visible.sync="isShowUser2" @confirm="confirmUser2">
      <template slot="header">
        <div style="text-align: center;" class="orange">*当所有人员都被选中删除时，该周期的绩效考核也会自动删除*</div>
      </template>
    </EmployeeSelector>

    <el-dialog :title="theResults == 1 ? '调整考核结果' : '调整绩效等级'" :visible.sync="comtheResults" width="500px"
      :close-on-click-modal="false">
      <div class="">
        <div>
          员工姓名：
          <span style="padding-left: 14px;">{{ theResultsList.name }}</span>
        </div>
        <br />
        <div v-if="theResults == 1">
          <div>原考核结果：<span>{{ theResultsList.final_point }}</span></div>
          <br />
          <div class="flex-box">
            <span style="line-height:36px;">新考核结果：</span>
            <el-input v-model="theResultInp"
              @input="theResultInp = theResultInp.match(/\d+(\.\d{0,2})?/) ? theResultInp.match(/\d+(\.\d{0,2})?/)[0] : ''"
              style="width:250px;" placeholder="请输入新考核结果"></el-input>
          </div>
        </div>
        <div v-else>
          <div>原绩效等级：<span>{{ theResultsList.final_level }}</span></div>
          <br />
          <div class="flex-box-ce">
            <span>新绩效等级：</span>
            <el-select v-model="level" placeholder="请选择" style="width: 200px;">
              <el-option v-for="(item, index) in levels" :key="index" :label="item.name" :value="item.name"></el-option>
            </el-select>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="comtheResults = false">取 消</el-button>
        <el-button type="primary" :disabled="theResultsButid" @click="savecomtheResults()">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="结果" :visible.sync="isShowData" @close="close_list" :append-to-body="true" width="700px">
      <el-table :data="showData" style="max-height: 600px;overflow: auto;">
        <el-table-column prop="name" label="名称"></el-table-column>
        <el-table-column prop="successText" label="结果">
          <template slot-scope="scope">
            <span v-if="scope.row.successText == '失败'" class="red">失败</span>
            <span v-else class="green">成功</span>
          </template>
        </el-table-column>
        <el-table-column prop="reason" label="描述"></el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer" v-if="selectUser.length == showData.length">
        <el-button type="primary" @click="isShowData = false">确 定</el-button>
      </span>
    </el-dialog>

    <!-- 待处理人员列表 -->
    <BrawerBox :drawerTitle="'“' + getNode + '” 相关负责人名单'" :showDrawer.sync="isPending">
      <template slot="main">
        <div>
          <div class="flex-box-ce" style="border-bottom: 1px solid #f1f1f1;padding: 10px 0;"
            v-for="(item, index) in pending_employee_list" :key="index" v-if="pending_employee_list.length > 0">
            <div class="flex-box-ce">
              <userImage style="margin-right: 10px;" :user_name="item.name" :img_url="item.img_url" width="38px"
                height="38px" fontSize="12px"></userImage>
              <span>{{ item.name }}</span>
            </div>
            <div style="margin-left: 10px;" class="flex-1">
              <template v-if="item.dept_list.length > 0">
                <span v-for="(e, index2) in item.dept_list" :key="index2" class="fontColorC">
                  {{ e.dept_name }}
                  <span v-if="item.dept_list.length - index > 1">,</span>
                </span>
              </template>
            </div>
          </div>
          <NoData v-if="pending_employee_list.length == 0"></NoData>
        </div>
      </template>
      <template slot="footer">
        <!-- <el-button plain  @click="isPending = false">取消</el-button> -->
        <el-button type="primary" @click="getPending">导出人员名单</el-button>
      </template>
    </BrawerBox>
  </div>
</template>
<script>
let that;
import PageHead from '@/components/PageHead'; //头部---返回
import JxSearch from '@/performance/components/public/JxSearch'; //搜索
import EmployeeSelector from '@/components/EmployeeSelector';
import BrawerBox from '@/performance/components/public/BrawerBox';
export default {
  name: 'assessDetails',
  data() {
    return {
      date_remark: "",
      isHeadShow: false,
      pending_employee_list: [], //待处理人员
      isPending: false,
      total: 0, // 当前节点考核总人数
      nowass: false, //已开始评分显示隐藏
      pushAssMan: null, //头部跳转
      assDetLoad: false, //loading
      isLoad: false,
      headValue: [], //顶部选择考核
      options: [], //顶部考核数据
      props: {},
      groupValue: [], //选择考核模板val
      groupOptions: [], //选择考核模板数据
      scoreGroup: [], //评分考核模板
      isAllSelectIndex: false,
      GroupList: [], //评分考核模板备份搜索数据
      // 流程节点
      navigationList: [
        //导航
        { id: 0, name: '考核周期: ', num: 0 },
        { id: 1, name: '目标制定', num: 0 },
        { id: 2, name: '目标确认', num: 0 },
        {
          id: 3,
          name: '执行中',
          num: 0,
          hint: '目标制定并确认完毕后，进入到【执行中】阶段，期间员工执行计划，上级跟踪过程。进入结果数据收集和评分阶段'
        },
        { id: 4, name: '结果值录入', num: 0 },
        { id: 5, name: '评分', num: 0 },
        { id: 9, name: '审批', num: 0 },
        { id: 11, name: '结束', num: 0 }
      ],
      navcli: 0, // 导航当前选中
      svaeNavcli: 0, //保存的选中
      // 头部筛选条件
      asstabParams: {
        package_id: 0, //考核包id
        dept_ids: [], //部门idx
        group_ids: [], //考核模板ID
        doing_id: 0, //状态ID
        employee_ids: [], //搜索人员ID
        page: 1,
        page_size: 10
      },
      employee_ids: [],
      asstabData: [], // 表格数据
      employees: [], //被考核人员列表
      //更多
      dropdownMenu: [
        { key: 'a', name: '等级配置', isShow: this.$isAuthoritys_jx(this.$10) },
        { key: 'b', name: '结果公布', isShow: true },
        { key: 'c', name: '导出明细', bordok: true, isShow: this.$isAuthoritys_jx(this.$11) },
        { key: 'd', name: '导出结果', isShow: this.$isAuthoritys_jx(this.$11) },
        { key: 'k', name: '导出执行计划', isShow: this.$getRole(1) || this.$getRole(2) },
        { key: 'y', name: '批量修改目标值', isShow: true },
        { key: 'j', name: '批量转交', isShow: true },
        // { key: 'e', name: '自定义导出' },
        // { key: 'f', name: '批量操作', bordok: true },
        { key: 'h', name: '归档&统计', bordok: true, isShow: false },
        // { key: 'g', name: '管理', bordok: true, isShow: true }
      ],
      // 选择部门
      deptVisibleName: '',
      dept_selected: { dept: [], employee: [] },
      show_dept_selector: false,
      deptList_id: [],
      isChecks: false, //评分开关
      isChecksLoad: false,
      allassList: [], //所有流程数据
      searchList: [], //搜索备份
      searchdet: '', //搜索值
      packageName: '', //考核包名称
      // 公式结果相关
      isResult: false,
      employee_list: [], //人员列表
      selected: { dept: [], employee: [] }, //已选择公式人员
      // 更多-管理
      isManagement: false,
      ManagementTitle: '删除被考核人员',
      add_employee_list: [], //可以被添加到绩效包的人员
      isShowUser: false, //控制添加人员
      isShowUser2: false, //控制删除人员
      selected: { dept: [], employee: [] }, //已选择公式人员
      userInfo: this.$userInfo(),
      theResults: 1, //结果点击按钮
      theResultsList: {}, //点击的结果
      comtheResults: false, //切换结果控制
      theResultInp: '', //调整考核结果值
      theResultsButid: false,
      deleteNum: 0, //记录考核包人数
      isShowData: false,
      showData: [],
      all_process_done: false, //是否所有人都完成流程了
      all_finish: false, //是否已经归档

      isDerive: false,//导出执行人员
      level: '',
      levels: [],

      selectUser: [],
      pfIndex: 0,
    };
  },
  components: { PageHead, JxSearch, EmployeeSelector, BrawerBox },
  computed: {
    /* 选择节点名称 */
    getNode() {
      let name;
      this.navigationList.some(item => {
        if (item.id == this.navcli) {
          name = item.name;
          return true;
        }
      });
      return name;
    },
    getLeng() {
      let num = 0;
      this.scoreGroup.forEach(item => {
        if (item.check) {
          num += 1;
        }
      });
      return num;
    }
  },
  watch: {
    isChecks(val) {
      if (!val) {
        this.isAllSelectIndex = false;
      }
    },
    isAllSelectIndex(val) {
      this.scoreGroup.forEach(item => {
        if (!item.disabled) {
          item.check = val;
        }
      });
    },
    headValue(val) {
      if (!(this.options && this.options.length > 0)) return
      this.options.some(item => {
        if (item.id == val[0]) {
          item.list.some(e => {
            if (e.id == val[1]) {
              this.packageName = e.name;
              return true;
            }
          });
          return true;
        }
      });
      let arr = JSON.parse(JSON.stringify(val));
      arr.push(this.pushAssMan);
      this.$setCache('assessDetails', arr); //当点击考核记录进入详情，返后时要还原到之前的考核包
      this.asstabParams.package_id = val[val.length - 1];
      this.asstabParams.group_ids = []; //置空

      if (this.svaeNavcli) {
        this.navcli = this.svaeNavcli;
        this.asstabParams.doing_id = this.svaeNavcli; //置空
        this.svaeNavcli = 0;
      } else {
        this.navcli = 0;
        this.asstabParams.doing_id = 0; //置空
      }
      this.getInitData(this.asstabParams.package_id, () => { });
      this.assDelList(); //请求绩效详情列表
      this.getDcl();
    },
    employee_ids(val) {
      this.asstabParams.employee_ids = JSON.stringify(val);
      this.asstabParams.page = 1;
      this.assDelList();
    }
  },
  activated() {
    let that = this;
    let params = {
      cycle_type: 2, //周期类型
      keywords: '', //搜索字
      page: 1, //当期页
      page_size: 10,//一页多少数据
      is_manage_scope: 1,
    }
    let amfTabL;
    that.$axiosUser('get', '/api/pro/per/package/list', params)
    .then(res => {
      if (res.data.code == 1) {
        that.tableData = res.data.data.list;
        amfTabL = that.tableData[0];
        if (amfTabL) {
          that.asstabParams.package_id = amfTabL.id;
          that.pushAssMan = amfTabL.pushs ? amfTabL.pushs : null;
          that.svaeNavcli = amfTabL.navcli ? amfTabL.navcli : 0;
          that.asstabParams.doing_id = amfTabL.navcli ? amfTabL.navcli : 0;
          that.getInitData(this.asstabParams.package_id, () => { });
          that.assDelList(); //请求绩效详情列表
          that.getDcl();
        }
      }
    })
  },

  

  created() {
    let that = this;
    let params = {
      cycle_type: 2, //周期类型
      keywords: '', //搜索字
      page: 1, //当期页
      page_size: 10,//一页多少数据
      is_manage_scope: 1,
    }
    let amfTabL;
    that.$axiosUser('get', '/api/pro/per/package/list', params)
      .then(res => {
        if (res.data.code == 1) {
          that.tableData = res.data.data.list;
          amfTabL = that.tableData[0];
          if (amfTabL) {
            let assessDetails = that.$getCache('assessDetails'); //缓存的数据
            that.pushAssMan = amfTabL.pushs ? amfTabL.pushs : null;
            that.asstabParams.package_id = amfTabL.id;
            that.assessTree(amfTabL.cycle_type, amfTabL.id); //请求绩效树
            that.svaeNavcli = amfTabL.navcli ? amfTabL.navcli : 0;
            that.asstabParams.doing_id = amfTabL.navcli ? amfTabL.navcli : 0;
            that.props = {
              lazy: true,
              label: 'name',
              value: 'id',
              children: 'list',
              lazyLoad(node, resolve) {
                const { level } = node;
                that.getAssessTree(node, resolve);
              }
            }
            //回显绩效树的选中
            that.getAddEmployee();
          }

        }
      })

  },
  methods: {
    kspf(is) {
      let userInfo = this.selectUser[this.pfIndex];
      if (userInfo) {
        let data = {
          id: userInfo.id, //绩效包ID
          single: 1 //非单人
        };
        this.$axiosUser('post', '/api/pro/per/package/start_score', data).then(res => {
          if (!is) {
            if (!res.data.data.result) {
              let list = res.data.data.list;
              list.forEach(item => {
                item.successText = '失败';
                item.name = this.$getEmployeeMapItem(userInfo.employee_id).name;
                item.reason = item.reason;
              });
              this.showData.unshift(...list)
            } else {
              let data = {
                successText: '成功',
                name: this.$getEmployeeMapItem(userInfo.employee_id).name,
                reason: '已开始评分'
              }
              this.showData.unshift(data)
            }
            this.pfIndex++;
            this.kspf();
          } else {
            this.$message.success(res.data.msg);
            this.isChecks = false;
            this.getInitData(this.asstabParams.package_id);
            this.assDelList();
          }
        });
      } else {
        this.isChecks = false;
        this.getInitData(this.asstabParams.package_id);
        this.assDelList();
      }
    },
    pf(item) {
      //开始评分按钮
      if (item) {
        this.selectUser = [item];
      }
      if (this.selectUser.length == 0) {
        this.$message.warning('请选择开始评分的人员');
        return;
      }
      this.$confirm('所选员工的绩效考核将自动进入评分流程，确认开始评分?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      }).then(() => {
        if (this.selectUser.length == 1) {
          this.kspf(true);
        } else {
          this.pfIndex = 0;
          this.isShowData = true;
          this.kspf();
        }
      }).catch(() => { });
    },
    handleSelectionChange(val) {
      this.selectUser = val
    },
    confirmDerive(obj) {
      if (obj.employee.length == 0) {
        this.$message.error('请选择人员');
        return false;
      }
      let site_id = this.$getCache('site_info').id;
      let employee = obj.employee.map(item => {
        return item.id;
      });
      let url = `${this.$serverdomain}/api/pro/download/schedule?site_id=${site_id}&employee_ids=${JSON.stringify(employee)}&package_id=${this.asstabParams.package_id}&searcher_id=${this.userInfo.id
        }`;
      window.open(url, '_blank');
    },

    getPending() {
      let site_info = this.$getCache('site_info');
      let url = `${this.$serverdomain}/api/pro/download/doing_list?site_id=${site_info.id}&searcher_id=${this.userInfo.id}&package_id=${this.asstabParams.package_id}&node_type=${this.navcli
        }`;
      window.open(url, '_blank');
    },
    getDcl() {
      if (this.navcli == 0 || !this.$getRole(1)) {
        return false;
      }
      this.$axiosUser('get', 'api/pro/per/package/msg/doing_list', { package_id: this.asstabParams.package_id, node_type: this.navcli }).then(res => {
        let list = res.data.data.list;
        list.forEach(item => {
          let user = this.$getEmployeeMapItem(item.employee_id);
          if (!user) {
            return false;
          }
          item.dept_list = user.employee_detail.dept_list;
          item.name = user.name;
          item.img_url = user.img_url;
        });
        this.pending_employee_list = list;
      });
    },
    // 关闭
    close_list() {
      this.showData = [];
    },
    // 获取可被添加人员
    getAddEmployee(fun = function () { }) {
      this.$axiosUser('get', 'api/pro/per/package/get_subtraction_employee', { package_id: this.asstabParams.package_id }).then(res => {
        this.add_employee_list = res.data.data.list;
        fun();
      });
    },
    // 添加人员
    confirmUser(val) {
      let employee_ids = val.employee.map(item => {
        return item.id;
      });
      let data = {
        package_id: this.asstabParams.package_id,
        employee_ids: JSON.stringify(employee_ids)
      };
      this.$axiosUser('post', '/api/pro/per/package/add_package_employee', data).then(res => {
        this.$message.success('添加成功');
        this.isManagement = false;
        this.getInitData(this.asstabParams.package_id, () => { });
        this.assDelList();
      });
    },
    //删除人员
    confirmUser2(val) {
      this.$confirm('被考核人删除后，本次考核相关数据将被清空，无法恢复，请确认是否删除?', '删除确认', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      })
        .then(() => {
          let employee_ids = val.employee.map(item => {
            return item.id;
          });
          let data = {
            package_id: this.asstabParams.package_id,
            employee_ids: JSON.stringify(employee_ids)
          };
          this.$axiosUser('post', '/api/pro/per/package/delete_package_employee', data).then(res => {
            if (employee_ids.length == this.deleteNum) {
              this.$alert('删除成功,考核包已无考核人员,该周期的绩效考核也会自动删除', '提示', {
                confirmButtonText: '确定',
                showClose: false,
                callback: action => {
                  this.$router.go(-1);
                }
              });
            } else {
              this.$message.success('删除成功');
              this.isManagement = false;
              this.getInitData(this.asstabParams.package_id, () => { });
              this.assDelList();
            }
          });
        })
        .catch(() => { });
    },
    savecomtheResults(dataId, db) {
      this.theResultsButid = true;
      let data = {
        id: this.theResultsList.id,
        change_type: this.theResults,
      };
      if (this.theResults == 1) {
        data.point = this.theResultInp
      } else {
        if (!this.level) {
          this.$message.error('请选择新等级')
          this.theResultsButid = false;
          return false
        }
        data.level = this.level
      }
      this.$axiosUser('post', '/api/pro/per/package/adjustment', data)
        .then(res => {
          if (res.data.code == 1) {
            this.comtheResults = false;
            this.level = '';
            this.assDelList();
          }
        })
        .finally(() => {
          setTimeout(() => {
            this.theResultsButid = false;
          }, 300);
        });
    },
    theResultsOf1(data, num) {
      this.theResultsList = data;
      this.theResults = num;
      if (num == 2) {
        this.getLevels(data);
        return false
      }
      this.comtheResults = true;
    },
    getLevels(data) {
      this.$axiosUser('get', '/api/pro/per/package/levels', { pe_id: data.id }).then(res => {
        this.levels = res.data.data.levels
        this.comtheResults = true;
      });
    },
    // 更多-选择人员
    showSelectUser(index) {
      switch (index) {
        case 1:
          // this.getAddEmployee(() => {
          this.isShowUser = true;
          // });
          break;
        case 2:
          this.isShowUser2 = true;
          break;
      }
    },
    // 添加考核人
    openManagement() {
      this.$router.push({ path: '/addPersonnel', query: { packageId: this.asstabParams.package_id } });
    },
    // 提交公式结果
    confirmResult(val) {
      let noData = val.employee.map(item => {
        return item.id;
      });
      let publicity = {
        publicity: noData, //公布人员id列表
        concealment: [] //未公布人员id列表
      };
      this.$axiosUser('post', '/api/pro/per/package/edit_publicity', { id: this.asstabParams.package_id, publicity: JSON.stringify(publicity) }).then(res => {
        this.$message.success('操作成功');
        this.assDelList();
        this.getInitData(this.asstabParams.package_id, () => { });
      });
    },
    // 更多
    handleCommand(val) {
      switch (val) {
        case 'a': //等级配置
          this.$router.push({
            path: '/classDtail',
            query: {
              packageName: this.packageName,
              packageId: this.asstabParams.package_id,
              employee_list: JSON.stringify(this.employee_list)
            }
          });
          break;
        case 'b': //公式结果
          this.isResult = true;
          break;
        case 'c': //导出明细
          this.$axiosUser('get', '/api/pro/per/package/export/detail', { package_id: this.asstabParams.package_id }).then(res => {
            this.$alert('系统正在处理中，处理完将在工作台以“消息”形式通知您，请留意消息通知', '提示', {
              confirmButtonText: '我知道了',
              callback: action => { }
            });
          });
          break;
        case 'd': //导出结果
          this.$axiosUser('get', '/api/pro/per/package/export/result', { package_id: this.asstabParams.package_id }).then(res => {
            this.$alert('系统正在处理中，处理完将在工作台以“消息”形式通知您，请留意消息通知', '提示', {
              confirmButtonText: '我知道了',
              callback: action => { }
            });
          });
          break;
        case 'g': //管理
          this.isManagement = true;
          break;
        case 'h': //归档
          this.pigeonhole();
          break;
        case 'y': //批量修改目标值
          this.$router.push({ path: '/updateTarget', query: { packageId: this.asstabParams.package_id, packageName: this.packageName, index: '2' } });
          break;
        case 'j': //批量修改目标值
          this.$router.push({ path: '/updateTarget', query: { packageId: this.asstabParams.package_id, packageName: this.packageName, index: '1' } });
          break;
        case 'k': //批量修改目标值
          this.isDerive = true;
          break;
      }
    },
    // 归档
    pigeonhole() {
      this.$confirm('为保证统计数据一致且正确，归档操作不可撤销，归档后不能再修改考核内容，请确认考核信息无误后再归档。', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.$axiosUser('post', '/api/pro/per/package/change_finish', { package_id: this.asstabParams.package_id }).then(res => {
            this.$message.success('操作成功');
            this.getInitData(this.asstabParams.package_id);
          });
        })
        .catch(() => { });
    },
    isSelectable(row, index) {
      this.nowass = row.all_exec_over ? true : false;
      if (row.all_exec_over) {
        return false;
      } else {
        return true;
      }
    },
    //发起考核
    amhrsponsor() {
      this.$router.push({ name: 'sponsorAssess' });
    },
    //开始评分
    startisChecks() {
      this.isChecks = true;
    },
    // 页面变更
    handleCurrentChange(val) {
      this.asstabParams.page = val;
      this.assDelList();
    },
    // 页面跳转
    handleSizeChange(val) {
      this.asstabParams.page_size = val;
      this.assDelList();
    },
    getInitData(id, fun = function () { }) {
      this.isLoad = true;
      this.$axiosUser('get', '/api/pro/per/package/info_v3_aid', { package_id: id }).then(res => {
        let groups = res.data.data.groups;
        this.all_finish = res.data.data.all_finish;
        this.all_process_done = res.data.data.all_process_done;
        this.dropdownMenu.forEach((item, index) => {
          if (item.key == 'h' && !this.all_finish && this.all_process_done) {
            if (this.all_finish) {
              this.$set(this.dropdownMenu[index], 'isShow', false);
            } else {
              this.$set(this.dropdownMenu[index], 'isShow', true);
            }
          }
        });
        groups.forEach(item => {
          item.check = false;
          if (item.all_exec_over) {
            item.disabled = true;
          }
        });
        this.groupOptions = groups; //考核模板下拉
        this.scoreGroup = groups; //评分考核模板
        this.GroupList = groups; //考核模板搜索
        // 公式结果数据
        let employees = res.data.data.employees;
        let employee_list = [];
        let employee = [];
        employees.forEach(item => {
          employee_list.push(this.$getEmployeeMapItem(item.id));
          if (item.publicity) {
            employee.push(this.$getEmployeeMapItem(item.id));
          }
        });
        this.employee_list = employee_list;
        this.selected.employee = employee;
        this.employees = employees;
        // 设置各节点数量
        let statistics = res.data.data.statistics;
        let navigationList = JSON.parse(JSON.stringify(this.navigationList));
        let sum = 0;
        navigationList.forEach(item => {
          if (item.id == 0) item.name = "考核周期: " + this.date_remark
          item.num = statistics[item.id]
          if (item.id != 0) {
            sum += statistics[item.id]
          }
        })
        navigationList[0].num = sum;
        this.navigationList = navigationList;
        fun();
      }).finally(() => {
        this.isLoad = false;
      });
    },
    assDelList() {
      this.assDetLoad = true;
      this.$axiosUser('get', '/api/pro/per/package/info_v3', this.asstabParams).then(res => {
        let list = res.data.data.list || [];
        list.forEach(item => {
          let user = this.$getEmployeeMapItem(item.employee_id);
          if (user.employee_detail) {
            item.dept_list = user.employee_detail.dept_list;
          } else {
            item.dept_list = [];
          }
          item.name = user.name;
          item.img_url = user.img_url;
          if (item.todo.length > 0) {
            item.todo.forEach(e => {
              e.userInfo = this.$getEmployeeMapItem(e.employee_id);
            });
          }
        });
        this.asstabData = list;
        this.total = res.data.data.total;
        this.date_remark = res.data.data.date_remark;
        this.navigationList.forEach(item => {
          if (item.id == 0) item.name = "考核周期: " + this.date_remark
        })
      }).finally(() => {
        this.assDetLoad = false;
      });
    },
    groupChange(data) {
      //考核模板选中
      this.asstabParams.page = 1;
      if (data) {
        this.asstabParams.group_ids = JSON.stringify([data]);
      } else {
        this.asstabParams.group_ids = JSON.stringify([]);
      }
      this.assDelList();
    },
    // 开始评分
    beginGrade() {
      let multipleSelection = [];
      let employeeMap = this.$getEmployeeMapAll();
      this.scoreGroup.forEach(item => {
        if (item.check && item.exec_list.length > 0) {
          item.exec_list.forEach(item2 => {
            item2.id = item2.pe_id
            multipleSelection.push(item2);
          })
        }
      });
      //开始评分按钮
      if (multipleSelection.length == 0) {
        this.$message.warning('请选择开始评分的考核模板');
        return;
      }
      this.selectUser = multipleSelection
      this.pf();
      return false

      this.$confirm('所选考核模板员工的绩效考核将自动进入评分流程，确认开始评分?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      }).then(() => {
        let data = {
          package_id: this.asstabParams.package_id, //绩效包ID
          group_ids: JSON.stringify(multipleSelection), //考核模板列表
          single: 0 //非单人
        };
        this.$axiosUser('post', '/api/pro/per/package/start_score', data).then(res => {
          if (!res.data.data.result) {
            let list = res.data.data.list;
            list.forEach(item => {
              item.successText = item.success ? '成功' : '失败';
              item.name = employeeMap[item.employee_id].name;
              item.reason = item.success ? '已开始评分' : item.reason;
            });
            this.showData = list;
            this.isShowData = true;
          } else {
            this.$message.success(res.data.msg);
          }
          this.isChecks = false;
          this.assDelList(); //请求绩效详情列表
        });
      }).catch(() => { });
    },
    getAssessTree(node, resolve) {
      if (this.options && this.options.length == 0) {
        return
      }
      this.tableDataLoad = true;
      this.$axiosUser('get', 'api/pro/per/package/list', { page: 0, is_manage_scope: 1, cycle_type: node.value }).then(res => {
        let data = res.data.data.list;
        data.forEach(item => {
          item.leaf = true;
        })

        resolve(data)
      }).finally(() => {
        this.tableDataLoad = false;
      });
    },
    //请求绩效树
    assessTree(id, id2) {
      this.assDetLoad = true;
      this.$axiosUser('get', '/api/pro/per/package/list', { page: 0, is_manage_scope: 1 }).then(res => {
        if (res.data.code == 1) {
          let data = res.data.data.list;
          data.forEach(item => {
            item.leaf = true;
          })
          let arr = [
            { name: '月度', id: 2, list: [] },
            { name: '日', id: 1, list: [] },
            { name: '季度', id: 3, list: [] },
            { name: '半年度', id: 4, list: [] },
            { name: '年度', id: 5, list: [] },
            { name: '自定义', id: 6, list: [] }
          ];
          let arr2 = [
            { name: '月度', id: 2, list: [] },
            { name: '日', id: 1, list: [] },
            { name: '季度', id: 3, list: [] },
            { name: '半年度', id: 4, list: [] },
            { name: '年度', id: 5, list: [] },
            { name: '自定义', id: 6, list: [] }
          ];
          data.forEach(item => {
            arr.forEach(item2 => {
              if (item2.id == item.cycle_type) {
                item2.list.push(item);
              }
            });
          });
          arr.some((item, index) => {
            if (item.id == id) {
              arr2[index].list = item.list;
              return true;
            }
          });
          this.options = arr2;
          this.$nextTick(() => {
            this.headValue.push(id, id2);
          })
        }
      });
    },
    navClick(item) {
      this.navcli = item.id;
      this.asstabParams.page = 1;
      this.asstabParams.doing_id = item.id;
      this.getDcl();
      this.assDelList();
    },
    dept_confirm(data) {
      //部门选择
      this.dept_selected = { dept: [], employee: [] };
      this.deptList_id = [];
      this.deptVisibleName = '';
      if (data.dept !== null && data.dept.length != 0) {
        this.dept_selected = data;
        data.dept.forEach((element, index) => {
          this.deptList_id.push(element.dept_id);
          this.deptVisibleName += element.dept_name;
          if (data.dept.length - index > 1) {
            this.deptVisibleName += ',';
          }
        });
      }
      this.asstabParams.page = 1;
      this.asstabParams.dept_ids = JSON.stringify(this.deptList_id);
      this.assDelList();
    },
    assDetClick(row) {
      //列表点击
      this.$router.push({
        path: '/staffAssDet',
        query: { assID: this.asstabParams.package_id, employeeID: row.id, employeeIDs: row.employee_id }
      });
    },
    braSearch(data) {
      //评分搜索
      this.scoreGroup = this.GroupList.filter(item => item.name.includes(data));
    }
  },
  beforeRouteLeave(to, from, next) {
    if (to.name != 'staffAssDet') {
      localStorage.removeItem('assessDetails');
    }
    next();
  }
};
</script>
<style scoped lang="scss">
/* 归档图片动画 */
.guidang {
  margin-left: auto;
  width: 70px;
  animation: example 1s;
}

@keyframes example {
  from {
    transform: scale(1.4);
  }

  to {
    transform: scale(1);
  }
}

/* 归档图片动画 */
.all {
  position: relative;
  font-size: 14px;
  background-color: #fff;
  padding: 10px 20px;
  box-sizing: border-box;
}

.navsvg1 {
  font-size: 15px;
  position: relative;
  margin-top: 2px;
}

.navsvg2 {
  width: 4px;
  height: 20px;
  background-color: #e1e1e1;
  margin: -20px 30px 0 30px;
}

.navsvg3 {
  margin: -20px 20px 0 20px;
  color: #e1e1e1;
  display: block;
  font-size: 18px;
}

header {
  margin-top: 15px;

  .dept_wdiv {
    width: 200px;
    position: relative;

    .dept_inp {
      width: 100%;
      height: 38px;
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      bottom: 0;
      z-index: 9;
      border: 1px solid #e0e0e0;
      border-radius: 3px;
      line-height: 32px;
      font-size: 12px;
      padding: 0 10px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      cursor: pointer;
      color: #676767;
    }

    i {
      position: absolute;
      top: 0;
      right: 0;
      top: 10px;
      right: 10px;
      font-size: 14px;
      color: #b5b5b5;
    }
  }

  .navigationL {
    width: 100%;
    margin: 30px 0;
    span {
      display: flex;
      cursor: pointer;
      font-size: 14px;
      width: 180px;
      height: 60px;
      position: relative;
      border-radius: 3px;
      align-items: center;
      justify-content: center;
      color: #303133;
      background-color: #ecf5ff;
      margin-bottom: 20px;
    }

    span:hover {
      color: #428eff;
      border: 1px solid #409EFF;
      background-color: #ecf5ff;
    }

    /deep/ .action {
      color: #428eff;
      border: 1px solid #409EFF;
      background-color: #ecf5ff;
    }
  }

  /deep/ .el-table tr:hover {
    cursor: pointer;
  }
}

.braTab {
  padding: 20px 0 0 20px;

  /deep/ .el-table tr:hover {
    cursor: pointer;
  }

  /deep/ .el-table__row {
    .cell {
      padding-left: 10px;
    }
  }

  /deep/ td .cell {
    padding: 10px 0;
  }
}

.margin-l {
  margin-left: 10px;
}

.width-300 {
  width: 300px;
}

.m-content {}

.m-title {
  color: #909399;
}

.ul {
  margin: 20px 0;
  margin-top: 0;
}

.li {
  border-bottom: 1px solid #ebebeb;
}

.li .flex-box-ce {
  padding: 15px 0;
}

.li:hover {
  background-color: #f5f7fa;
}


</style>