gdy_qywx_pc/src/views/setting/set_role.vue

<template>
  <div class="set_role_box">
    <el-alert v-show="tips_show" class="diy-tip" title="温馨提示：" type="warning" @close="tips_close" description show-icon>
      <p>功道云积分系统共有5种角色，不同角色拥有不同的权限</p>
    </el-alert>
    <el-row :gutter="0" class="set_role_div">
      <el-tabs v-model="activeName" type="card" style="width:100%;padding:10px 0 0 10px">
        <el-tab-pane label="角色" name="first">
          <el-row :gutter="0" class="set_role_div" v-loading="role_loading">
            <el-col :span="5">
              <el-menu default-active="0" class="el-menu-vertical-demo" style="border: none">
                <el-menu-item :index="index.toString()" v-for="(item, index) in role_list" :key="index" @click="open_right(item)">
                  <i class="el-icon-s-custom"></i>
                  <span slot="title">{{ item.name }}</span>
                </el-menu-item>
              </el-menu>
            </el-col>
            <el-col :span="19" class="role_list">
              <div style="padding-left: 30px;padding-right: 30px;" v-loading="table_loading">
                <el-row style="margin:43px auto 10px;">
                  <el-col :span="18">
                    <span class="roleNameClass">{{ item_info.name }}</span>
                  </el-col>
                  <el-col :span="6" style="text-align: right;">
                    <el-button type="text" style=" padding: 0; line-height: initial;" v-show="item_info.code !== 'creator'" @click="dataAccessPopup">数据查看权限></el-button>
                  </el-col>
                </el-row>
                <el-row :gutter="60" style="margin-bottom: 20px;">
                  <el-col v-if="item_info.code == 'creator'" :span="24"><span class="roleTipClass">创始人为默认角色，拥有所有功能权限，该角色不可改</span></el-col>
                  <el-col v-if="item_info.code == 'admin'" :span="24"><span class="roleTipClass">公司管理员一般为合伙人、股东等高级管理人员，可管理多个部门和人员</span></el-col>
                  <el-col v-if="item_info.code == 'point_manager'" :span="24">
                    <span class="roleTipClass">积分专员一般为人事、行政等管理督办人员，可管理多个部门和人员</span>
                  </el-col>
                  <el-col v-if="item_info.code == 'dept_manager'" :span="24"><span class="roleTipClass">部门管理员一般为部门/团队经理、主管、组长，可管理一部分人员</span></el-col>
                  <el-col v-if="item_info.code == 'employee'" :span="24"><span class="roleTipClass">员工为默认角色，每个人都拥有员工角色的功能权限，该角色不可修改</span></el-col>
                </el-row>
                <el-row :gutter="60" style="margin-bottom: 22px;" v-show="item_info.code !== 'employee'">
                  <el-col :span="24">
                    <template v-if="isStart && item_info.code == 'creator'">
                      <el-button type="danger" @click="del_creator" v-show="table_list.length > 0">删除</el-button>
                      <el-button type="primary" @click="dialogFormVisible = true">添加</el-button>
                    </template>
                    <template v-if="item_info.code != 'creator' && item_info.code != 'employee'">
                      <el-button type="danger" @click="del_btn" v-show="table_list.length > 0">删除</el-button>
                      <el-button type="primary" @click="add_employee_show = true">添加</el-button>
                    </template>

                    <div class="gap-right-8 fr" style="display:inline-block; width:180px;" v-if="item_info.code == 'dept_manager'">
                      <el-input maxlength="20" placeholder="搜索员工姓名" ref="search-bar" v-model="keyword" class="input-with-select" @keyup.enter.native="onFilterChanged">
                        <el-button slot="append" icon="el-icon-search" @click="onFilterChanged"></el-button>
                      </el-input>
                    </div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <!-- 创始人 -->
                    <el-table :data="table_list" v-show="item_info.code == 'creator'">
                      <el-table-column width="55" fixed v-if="table_list.length > 0 && isStart">
                        <template slot-scope="scope">
                          <el-radio class="el-radios" v-model="radio" :label="scope.row.id"></el-radio>
                        </template>
                      </el-table-column>
                      <el-table-column prop="name" label="姓名" min-width="200">
                        <template slot-scope="scope">
                          <userImage class="fl" width="50px" height="50px" :id="scope.row.id" :user_name="scope.row.name" :img_url="scope.row.img_url"></userImage>
                          <span style="margin-left: 10px; line-height: 50px;"><WWOpenData type="userName" :openid="scope.row.name"></WWOpenData></span>
                        </template>
                      </el-table-column>
                    </el-table>
                    <!-- 管理者 -->
                    <el-table
                      :data="table_list"
                      class="tableListClass"
                      fit
                      v-show="item_info.code !== 'creator' && item_info.code !== 'employee' && table_list.length !== 0"
                      @selection-change="handleSelectionChange"
                    >
                      <el-table-column width="55" fixed>
                        <template slot-scope="scope">
                          <el-radio v-model="radio" :label="scope.row.id"></el-radio>
                        </template>
                      </el-table-column>
                      <el-table-column prop="name" label="姓名" width="170" fixed>
                        <template slot-scope="scope">
                          <userImage class="fl" width="50px" height="50px" :id="scope.row.id" :user_name="scope.row.name" :img_url="scope.row.img_url"></userImage>
                          <span style="margin-left: 10px; line-height: 50px;"><WWOpenData type="userName" :openid="scope.row.name"></WWOpenData></span>
                        </template>
                      </el-table-column>
                      <el-table-column v-if="item_info.code == 'dept_manager'" prop="dept" label="部门"></el-table-column>
                      <el-table-column width="130px" v-if="item_info.code == 'dept_manager'" prop="jurisdiction_dept" label="管辖部门"></el-table-column>
                      <el-table-column v-else prop="dept" label="部门"></el-table-column>
                      <el-table-column width="100px">
                        <template slot="header" slot-scope="scope">
                          <span>管理范围</span>
                          <el-tooltip placement="top">
                            <div slot="content">
                              可自由分配每个管理者的管辖范围，设置后对管辖范围内的人员有分配任务，发绩效，奖扣积分、查看积分排名和统计、审核其提交上来的申请等权限
                            </div>
                            <span class="tips">?</span>
                          </el-tooltip>
                        </template>
                        <template slot-scope="scope">
                          <div @click="add_management_scope(scope.row)" v-show="scope.row.manage_scope_count == 0" class="cursor_pointer" style="text-decoration:underline">
                            去设置
                          </div>
                          <div @click="add_management_scope(scope.row)" v-show="scope.row.manage_scope_count != 0" class="cursor_pointer">{{ scope.row.manage_scope_count }}人</div>
                        </template>
                      </el-table-column>
                      <el-table-column>
                        <template slot="header" slot-scope="scope">
                          <span>积分权限</span>
                          <el-tooltip placement="top">
                            <div slot="content">
                              针对不同的管理岗位，可赋予每个管理者不同的奖扣积分权限
                              <br />
                              积分权限不足的须递交给其上级审核
                            </div>
                            <span class="tips">?</span>
                          </el-tooltip>
                        </template>
                        <el-table-column width="100px">
                          <template slot="header" slot-scope="scope">
                            <span>A分权限</span>
                            <i class="el-icon-edit" @click="setPower('aAll')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_integral_limit(scope.row)" v-show="scope.row.point_limit_obj.AF == 0" class="cursor_pointer">0</div>
                            <div @click="open_integral_limit(scope.row)" v-show="scope.row.point_limit_obj.AF != 0" class="cursor_pointer">{{ scope.row.point_limit_obj.AF }}</div>
                          </template>
                        </el-table-column>
                        <el-table-column width="100px">
                          <template slot="header" slot-scope="scope">
                            <span>B分权限</span>
                            <i class="el-icon-edit" @click="setPower('bAll')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_integral_limit(scope.row)" v-show="scope.row.point_limit_obj.BF == 0" class="cursor_pointer">0</div>
                            <div @click="open_integral_limit(scope.row)" v-show="scope.row.point_limit_obj.BF != 0" class="cursor_pointer">{{ scope.row.point_limit_obj.BF }}</div>
                          </template>
                        </el-table-column>
                        <el-table-column width="100px">
                          <template slot="header" slot-scope="scope">
                            <span>奖分上限</span>
                            <i class="el-icon-edit" @click="setPower('bonuAll')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_integral_limit(scope.row)" v-show="scope.row.entry_limit > 0" class="cursor_pointer">{{ scope.row.entry_limit }}</div>
                            <div @click="open_integral_limit(scope.row)" v-show="scope.row.entry_limit === '' || scope.row.entry_limit === 0">不限制</div>
                          </template>
                        </el-table-column>
                      </el-table-column>
                      <el-table-column>
                        <template slot="header" slot-scope="scope">
                          <span>奖扣目标</span>
                          <el-tooltip placement="top">
                            <div slot="content">
                              积分是否能落地，奖扣分的执行最为关键。赋予一定的人员奖扣分任务，比如经理，主管，积分专员，行政人事等，更利于整个积分制管理的落地和实施。
                            </div>
                            <span class="tips">?</span>
                          </el-tooltip>
                        </template>
                        <el-table-column width="100">
                          <template slot="header" slot-scope="scope">
                            <span>奖分目标</span>
                            <i class="el-icon-edit" @click="setPower('reward_task_monthly')"></i>
                          </template>
                          <template slot-scope="scope">
                            <span @click="open_bonus_deducted(scope.row)">
                              <div v-for="(item, index) in scope.row.reward_task_monthly" :key="index" v-show="item.name == 'B分' && item.point != 0" class="cursor_pointer">
                                {{ item.point }}
                              </div>
                              <div
                                v-for="(item, index) in scope.row.reward_task_monthly"
                                :key="index + ':'"
                                v-show="item.name == 'B分' && item.point == 0"
                                class="cursor_pointer"
                                style="text-decoration:underline"
                              >
                                未设置
                              </div>
                            </span>
                          </template>
                        </el-table-column>
                        <el-table-column width="100">
                          <template slot="header" slot-scope="scope">
                            <span>扣分目标</span>
                            <i class="el-icon-edit" @click="setPower('deduct_task_monthly')"></i>
                          </template>
                          <template slot-scope="scope">
                            <span @click="open_bonus_deducted(scope.row)">
                              <div v-for="(item, index) in scope.row.deduct_task_monthly" :key="index" v-show="item.name == 'B分' && item.point != 0" class="cursor_pointer">
                                {{ item.point }}
                              </div>
                              <div
                                v-for="(item, index) in scope.row.deduct_task_monthly"
                                :key="index + '::'"
                                v-show="item.name == 'B分' && item.point == 0"
                                class="cursor_pointer"
                                style="text-decoration:underline"
                              >
                                未设置
                              </div>
                            </span>
                          </template>
                        </el-table-column>
                        <el-table-column width="100">
                          <template slot="header" slot-scope="scope">
                            <span>奖扣次数</span>
                            <i class="el-icon-edit" @click="setPower('exec_count')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.exec_count == 0" class="cursor_pointer" style="text-decoration:underline">未设置</div>
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.exec_count != 0" class="cursor_pointer">{{ scope.row.exec_count }}</div>
                          </template>
                        </el-table-column>
                        <el-table-column width="110">
                          <template slot="header" slot-scope="scope">
                            <span>每少一次扣</span>
                            <i class="el-icon-edit" @click="setPower('exec_count_point')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.exec_count_point == 0" class="cursor_pointer" style="text-decoration:underline">
                              未设置
                            </div>
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.exec_count_point != 0">{{ scope.row.exec_count_point }}</div>
                          </template>
                        </el-table-column>
                        <el-table-column width="100">
                          <template slot="header" slot-scope="scope">
                            <span>奖扣比例</span>
                            <i class="el-icon-edit" @click="setPower('reward_ratio')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.reward_ratio == 0" class="cursor_pointer" style="text-decoration:underline">未设置</div>
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.reward_ratio != 0" class="cursor_pointer">{{ scope.row.reward_ratio }}</div>
                          </template>
                        </el-table-column>
                        <el-table-column width="100">
                          <template slot="header" slot-scope="scope">
                            <span>不达标扣</span>
                            <i class="el-icon-edit" @click="setPower('reward_ratio_point')"></i>
                          </template>
                          <template slot-scope="scope">
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.reward_ratio_point == 0" class="cursor_pointer" style="text-decoration:underline">
                              未设置
                            </div>
                            <div @click="open_bonus_deducted(scope.row)" v-show="scope.row.reward_ratio_point != 0" class="cursor_pointer">{{ scope.row.reward_ratio_point }}</div>
                          </template>
                        </el-table-column>
                      </el-table-column>
                    </el-table>
                    <!-- 提示 -->
                    <el-row :gutter="30" justify="center" v-show="table_list.length == 0 && item_info.code !== 'creator' && item_info.code !== 'employee'">
                      <el-col :span="24" style="text-align: center;">
                        <p><img src="static/images/nodata_default.png" width="200px" /></p>
                        还没有{{ item_info.name }},
                        <span style="color:#26A2FF;" @click="add_employee_show = true">去添加>></span>
                      </el-col>
                    </el-row>
                    <!-- 员工 -->
                    <center v-show="item_info.code == 'employee'" style="padding: 100px 0px;">未设置管理角色的人员，都是普通员工</center>
                  </el-col>
                </el-row>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
      </el-tabs>
    </el-row>
    <!-- 添加人员 -->
    <EmployeeSelector title="添加创始人" :isChecKedAll="false" :multi="false" :include_self="false" :visible.sync="dialogFormVisible" @confirm="add_creator" />

    <!-- 添加人员 -->
    <EmployeeSelector title="添加管理人员" :isChecKedAll="true" :visible.sync="add_employee_show" @confirm="add_employee_confirm" />
    <el-dialog title="数据查看权限" :visible.sync="dataAccessShow" width="700px">
      <div v-loading="dataAccessLoading">
        <el-form label-width="120px">
          <el-form-item v-for="(item, index) in jurisdiction" :key="index" :label="item.title">
            <el-radio-group v-model="item.code">
              <el-col :span="24" v-for="(d, index) in item.list" :key="index" style="padding: 10px 0">
                <el-radio :label="d.id">{{ d.name }}</el-radio>
              </el-col>
            </el-radio-group>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer">
        <el-button :disabled="setDataAccessBtn" @click="dataAccessShow = false">取消</el-button>
        <el-button :disabled="setDataAccessBtn" type="primary" @click="setDataAccess">确定</el-button>
      </span>
    </el-dialog>

    <!-- 设置管理范围 -->
    <EmployeeSelector
      title="设置管理范围"
      :isChecKedAll="true"
      :max="add_employee_max"
      :selected="management_scope_arr"
      :visible.sync="management_scope_show"
      :employee_not_select="control_limit"
      @confirm="management_scope_confirm"
    />

    <el-dialog title="设置积分权限" :visible.sync="integral_limit_show" :close-on-click-modal="false" width="700px">
      <el-form label-width="150px" :model="integral_limit_form" ref="integral_limit_form" v-loading="integral_limit_loading">
        <span v-for="(item, index) in integral_limit_form.point_limit" :key="index" v-show="item.pt_id !== 1">
          <el-form-item :label="item.name + '权限(单次奖扣)'" :rules="[{ required: true, message: '请输入', trigger: 'blur' }]">
            <el-input v-model="item.point" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
          </el-form-item>
        </span>
        <el-form-item label="每月B分奖分上限">
          <el-input v-model="integral_limit_form.entry_limit" oninput="value=value.replace(/[^\d]/g,'')" placeholder="奖分上限不限制"></el-input>
        </el-form-item>
        <el-form-item style="text-align: right; margin-bottom: 0">
          <el-button @click="integral_limit_show = false">取消</el-button>
          <el-button type="primary" @click="sub_employee_limit">确定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog :title="setPowerTitle" :visible.sync="setPowerShow" :close-on-click-modal="false" :before-close="powerClose" width="700px">
      <el-form label-width="100px">
        <el-row class="red_tips">
          <el-col :span="24" v-show="setPowerType == 'aAll'">将统一修改全部{{ item_info.remark }}的A分权限</el-col>
          <el-col :span="24" v-show="setPowerType == 'bAll'">将统一修改全部{{ item_info.remark }}的B分权限</el-col>
          <el-col :span="24" v-show="setPowerType == 'bonuAll'">将统一修改全部{{ item_info.remark }}的奖分上限(不填写为不限制)</el-col>
        </el-row>

        <el-form-item v-if="setPowerType == 'aAll'" label="A分权限">
          <el-input
            v-model.number="batchSet.a_all"
            oninput="value=value.replace(/[^\d]/g,'')"
            :rules="[{ required: true, message: '请输入A分权限', trigger: 'blur' }]"
            type="Number"
            placeholder="请输入数值"
          ></el-input>
        </el-form-item>
        <el-form-item v-if="setPowerType == 'bAll'" label="B分权限">
          <el-input
            v-model.number="batchSet.b_all"
            oninput="value=value.replace(/[^\d]/g,'')"
            :rules="[{ required: true, message: '请输入B分权限', trigger: 'blur' }]"
            type="Number"
            placeholder="请输入数值"
          ></el-input>
        </el-form-item>
        <el-form-item v-if="setPowerType == 'bonuAll'" label="奖分上限">
          <el-input v-model="batchSet.bonu_all" oninput="value=value.replace(/[^\d]/g,'')" placeholder="奖分上限不限制"></el-input>
        </el-form-item>

        <el-form-item v-if="setPowerType == 'deduct_task_monthly'">
          <template slot="label">
            <span>月扣分任务</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                对扣分分值作任务要求。未达分值任务的按差额扣分
                <br />
                举例说明：扣分任务100，实际扣分80（差额20分），则该执行人员将被扣20分。反之，如实际扣分达到或超出100分，不对执行人员实行扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="batchSet.deduct_task_monthly.point" oninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入扣分目标"></el-input>
        </el-form-item>
        <el-form-item v-if="setPowerType == 'reward_task_monthly'">
          <template slot="label">
            <span>月奖分任务</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                对奖分分值作任务要求。未达分值任务的按差额扣分
                <br />
                举例说明：奖分任务1000，实际奖分980（差额20分），则该执行人员将被扣20分。反之，如实际奖分达到或超出1000分，不对执行人员实行扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="batchSet.reward_task_monthly.point" oninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入奖分目标"></el-input>
        </el-form-item>

        <el-form-item v-if="setPowerType == 'reward_ratio_point'">
          <template slot="label">
            <span>比例未达标</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                扣x分（x为输入框）
                <br />
                未完成奖扣比例任务的，按对应分值扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="batchSet.reward_ratio_point" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>

        <el-form-item v-if="setPowerType == 'exec_count_point'">
          <template slot="label">
            <span>少一次奖扣</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                扣x分（x为输入框）
                <br />
                奖扣次数未达任务要求的，每少一次扣对应分值
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="batchSet.exec_count_point" oninput="value=value.replace(/[^\d]/g,'')" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>

        <el-form-item v-if="setPowerType == 'exec_count'">
          <template slot="label">
            <span>月奖扣次数</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                对奖分和扣分的执行次数作任务要求
                <br />
                举例说明：奖扣次数任务100，实际执行次数95（差5次），假如每少一次扣5分，则该执行人员将被扣5*5=25分。反之，如果任务达标，不对执行人员实行扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="batchSet.exec_count" oninput="value=value.replace(/[^\d]/g,'')" placeholder="奖分上限不限制"></el-input>
        </el-form-item>

        <el-form-item v-if="setPowerType == 'reward_ratio'">
          <template slot="label">
            <span>月奖扣比例</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                对奖分和扣分的比例作任务要求
                <br />
                举例说明：奖扣比例任务10:1，实际执行奖扣比例11:1（管理者当老好人，不敢执行扣分，导致扣分占比过低），则视为未完成，该执行人员将被扣对应分值。反之比例小于10:1，任务为达标，不对执行人员实行扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input style="width: 100px;" type="Number" oninput="value=value.replace(/[^\d]/g,'')" disabled placeholder="1"></el-input>
          :
          <el-input v-model="batchSet.reward_ratio" style="width: 100px;" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>

        <el-form-item style="text-align: right; margin-bottom: 0">
          <el-button @click="setPowerShow = false">取消</el-button>
          <el-button type="primary" @click="setPowerBtn" v-loading="setPowerBtnLoad">确定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog title="B分奖扣任务" :visible.sync="bonus_deducted_show" width="600px">
      <el-form :model="integral_limit_form" ref="integral_limit_form" :rules="integral_limit_rules" label-width="130px" v-loading="bonus_deducted_loading">
        <span v-for="(item, index) in integral_limit_form.reward_task_monthly" :key="index" v-show="item.name == 'B分'">
          <el-form-item>
            <template slot="label">
              <span>月奖分任务</span>
              <el-tooltip placement="top">
                <div slot="content" style="width: 300px;">
                  对奖分分值作任务要求。未达分值任务的按差额扣分
                  <br />
                  举例说明：奖分任务1000，实际奖分980（差额20分），则该执行人员将被扣20分。反之，如实际奖分达到或超出1000分，不对执行人员实行扣分
                </div>
                <span class="tips">?</span>
              </el-tooltip>
            </template>
            <el-input v-model="item.point" type="Number" placeholder="请输入数值"></el-input>
          </el-form-item>
        </span>
        <span v-for="(item, index) in integral_limit_form.deduct_task_monthly" :key="item.name" v-show="item.name == 'B分'">
          <el-form-item style="margin-bottom: 0;">
            <template slot="label">
              <span>月扣分任务</span>
              <el-tooltip placement="top">
                <div slot="content" style="width: 300px;">
                  对扣分分值作任务要求。未达分值任务的按差额扣分
                  <br />
                  举例说明：扣分任务100，实际扣分80（差额20分），则该执行人员将被扣20分。反之，如实际扣分达到或超出100分，不对执行人员实行扣分
                </div>
                <span class="tips">?</span>
              </el-tooltip>
            </template>
            <el-input v-model="item.point" type="Number" placeholder="请输入数值"></el-input>
            <el-checkbox v-model="checked">自动按差额扣分</el-checkbox>
          </el-form-item>
        </span>
        <el-form-item>
          <div style="font-size: 12px; color: #909399; line-height: 20px;">
            设置后，奖分与扣分目标其中有一项未达标，系统将自动扣除差额分值；
            <br />
            例如，A设置了月奖分目标100和月扣分目标100，到了月底，奖了80和扣了30，那该管理者将被扣90B分。
          </div>
        </el-form-item>

        <el-form-item prop="exec_count">
          <template slot="label">
            <span>月奖扣次数</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                对奖分和扣分的执行次数作任务要求
                <br />
                举例说明：奖扣次数任务100，实际执行次数95（差5次），假如每少一次扣5分，则该执行人员将被扣5*5=25分。反之，如果任务达标，不对执行人员实行扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>

          <el-input v-model="integral_limit_form.exec_count" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>
        <el-form-item prop="exec_count_point">
          <template slot="label">
            <span>每少一次奖扣</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                扣x分（x为输入框）
                <br />
                奖扣次数未达任务要求的，每少一次扣对应分值
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="integral_limit_form.exec_count_point" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>
        <el-form-item prop="reward_ratio">
          <template slot="label">
            <span>月奖扣比例</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                对奖分和扣分的比例作任务要求
                <br />
                举例说明：奖扣比例任务10:1，实际执行奖扣比例11:1（管理者当老好人，不敢执行扣分，导致扣分占比过低），则视为未完成，该执行人员将被扣对应分值。反之比例小于10:1，任务为达标，不对执行人员实行扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input style="width: 100px;" type="Number" disabled placeholder="1"></el-input>
          :
          <el-input v-model="integral_limit_form.reward_ratio" style="width: 100px;" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>
        <el-form-item prop="reward_ratio_point">
          <template slot="label">
            <span>比例未达标</span>
            <el-tooltip placement="top">
              <div slot="content" style="width: 300px;">
                扣x分（x为输入框）
                <br />
                未完成奖扣比例任务的，按对应分值扣分
              </div>
              <span class="tips">?</span>
            </el-tooltip>
          </template>
          <el-input v-model="integral_limit_form.reward_ratio_point" type="Number" placeholder="请输入数值"></el-input>
        </el-form-item>
        <el-form-item style=" text-align: right; margin-bottom: 0;">
          <el-button @click="bonus_deducted_colse('integral_limit_form')">取消</el-button>
          <el-button type="primary" @click="sub_bonus_deducted('integral_limit_form')">确定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 导出员工 -->
    <el-dialog title="导出/修改部门管理员信息" width="600px" :visible.sync="exportEmploye" :close-on-click-modal="false" :before-close="close_export">
      <div style="float: left;width:49%">
        <div style="margin-left: 20%;">
          <p>1.导出部门管理员信息</p>
          <el-button type="primary" plain @click="downloadSheet">导出</el-button>
        </div>
      </div>
      <div style="border-left: 1px solid #D8D8D8;width: 1px;height: 255px;float: left;"></div>

      <div style="float: left;width:49%;">
        <div style="margin-left: 20%;">
          <p>2.修改部门管理员信息</p>
          <p>导出部门管理员信息表进行修改</p>
          <p>上传修改好的部门管理员信息表</p>
          <el-upload :limit="1" :headers="ATOKEN" ref="upload2" :data="datas" :action="integralUpload" :on-success="handlePictureCardPreview" :before-upload="beforeFilesUpload">
            <p><el-button type="primary" plain>选择文件</el-button></p>
          </el-upload>
          <p>先选择文件后再完成上传</p>
          <el-button type="primary" @click="uploadFile('prize_buckle')" :loading="update_btn" plain>上传</el-button>
        </div>
      </div>
      <div class="align-center" style="margin-bottom:20px; float:left; margin-left:10px;"></div>
      <div class="align-center" style="margin-bottom:20px; float:left; margin-left:10px;"></div>
      <div style="clear:both;"></div>
    </el-dialog>
  </div>
</template>
<script>
import EmployeeSelector from '@/views/common/EmployeeSelector';
import { getToken } from '@/utils/auth';
import ApproverSet from './approver_set';
var bool = true;
const minimum = (rule, value, callback) => {
  if (value < 0) {
    callback(new Error('请输入正确的数值'));
  } else {
    callback();
  }
};
export default {
  data() {
    return {
      // 创始人相关操作
      isStart: false, //是否是创始人
      dialogFormVisible: false,
      bossObj: '',
      radio: '',

      checked: true,
      integralUpload: process.env.BASE_API + '/api/upload/excel',
      publicBASE_API: process.env.BASE_API,
      datas: { type: 'prize_buckle' },
      update_btn: false,
      ATOKEN: { 'A-TOKEN': getToken() },
      exportEmploye: false, // 导出员工信息

      syncScopeId: [],

      activeName: 'first', //选项卡，默认选中

      control_limit: [],
      role_loading: false,
      table_loading: false,
      permissions_loading: false,
      role_list: [],
      item_info: { code: '' },
      keyword: '', //搜索的关键词
      table_list: [],
      del_arr: [],
      employee_show: false,
      add_employee_max: 0,
      add_employee_show: false,
      employee_map: this.$store.getters.employee_map,
      add_employee_form: {
        employee_ids: []
      },
      employee_arr: [],
      management_arr: [],
      management_scope_show: false,
      list_info: null,
      management_scope_arr: { employee: [], dept: [] },
      rules_employee_arr: { employee: [], dept: [] },
      integral_limit_show: false,
      integral_limit_loading: false,
      integral_limit_form: {},
      integral_limit_rules: {
        exec_count: [{ required: true, validator: minimum, trigger: 'blur' }],
        exec_count_point: [{ required: true, validator: minimum, trigger: 'blur' }],
        reward_ratio: [{ required: true, validator: minimum, trigger: 'blur' }],
        reward_ratio_point: [{ required: true, validator: minimum, trigger: 'blur' }]
      },
      set_mployee_limit_id: '',
      bonus_deducted_show: false,
      bonus_deducted_loading: false,
      radio: '',
      tips_show: false,
      employee_not_select: [],
      add_employee_not_select: [],
      setPowerShow: false,
      setPowerBtnLoad: false,
      setPowerType: 'aAll',
      setPowerTitle: '设置A分上限',
      batchSet: {
        a_all: '',
        b_all: '',
        bonu_all: '',
        service_point: '',
        reward_ratio_point: '',
        exec_count_point: '',
        exec_count: '',
        reward_ratio: '',
        deduct_task_monthly: {
          pt_id: '3',
          point: ''
        },
        reward_task_monthly: {
          pt_id: '3',
          point: ''
        }
      },
      dataAccessShow: false,
      setDataAccessBtn: false,
      dataAccessLoading: false,
      jurisdiction: [],
      // 除员工外权限范围数据
      dataAccessList: [
        {
          title: '积分事件',
          name: 'event_range',
          code: 0,
          list: [{ name: '仅查看自己的数据', id: 1 }, { name: '查看自己以及管理范围内用户的数据', id: 2 }, { name: '查看全员数据', id: 3 }]
        },
        {
          title: '管理者奖扣',
          name: 'prize_range',
          code: 0,
          list: [{ name: '查看自己以及管理范围内管理者的数据', id: 1 }, { name: '查看全部管理者的数据', id: 2 }]
        },
        // {
        //   title: '团队绩效',
        //   name: 'performance_range',
        //   code: 0,
        //   list: [
        //     {name: '查看自己以及管理范围内用户的数据', id: 1},
        //     {name: '查看全员数据', id: 2},
        //   ]
        // },
        {
          title: '团队数据',
          name: 'statistics_range',
          code: 0,
          list: [{ name: '查看自己以及管理范围内用户的数据', id: 1 }, { name: '查看全员数据', id: 2 }]
        }
      ],
      // 员工权限范围数据
      dataAccessListEmployee: [
        {
          title: '积分事件',
          name: 'event_range',
          code: 0,
          list: [{ name: '仅查看自己的数据', id: 1 }, { name: '查看全员数据', id: 3 }]
        }
        // {
        //   title: '团队绩效',
        //   name: 'performance_range',
        //   code: 0,
        //   list: [
        //     {name: '仅查看自己的数据', id: 1},
        //     {name: '查看全员数据', id: 2},
        //   ]
        // }
      ]
    };
  },
  components: {EmployeeSelector, ApproverSet },
  watch: {
    checked(val) {},
    setPowerType(val) {
      switch (val) {
        case 'aAll':
          this.setPowerTitle = '设置A分上限';
          break;
        case 'bAll':
          this.setPowerTitle = '设置B分上限';
          break;
        case 'bonuAll':
          this.setPowerTitle = '设置奖分上限';
          break;
        case 'deduct_task_monthly':
          this.setPowerTitle = '设置月扣分任务';
          break;
        case 'reward_task_monthly':
          this.setPowerTitle = '设置月奖分任务';
          break;
        case 'reward_ratio_point':
          this.setPowerTitle = '设置比例未达标';
          break;
        case 'exec_count_point':
          this.setPowerTitle = '设置每少一次奖扣';
          break;
        case 'exec_count':
          this.setPowerTitle = '设置月奖扣次数';
          break;
        case 'reward_ratio':
          this.setPowerTitle = '设置月奖扣比例';
          break;
        default:
          this.setPowerTitle = '';
      }
    }
  },
  methods: {
    //删除创始人
    del_creator() {
      var userData = this.$store.getters.user_info;
      if (!this.radio) {
        this.$message.error('请选择要删除的创始人');
        return false;
      }
      if (this.radio == userData.id) {
        this.$message.error('不能删除自己');
        return false;
      }
      this.$confirm('确定要删除该创始人?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$http('post', '/api/role/creator/delete', { employee_id: this.radio })
          .then(res => {
            if (res.data.code == 1) {
              this.$message.success(res.data.msg);
              this.page = 1;
              this.get_table_list();
            }
          })
          .finally(() => {
            this.radio = '';
          });
      });
    },
    //添加老板
    add_creator(val) {
      if (val.employee.length > 0) {
        this.bossObj = val.employee[0].id;
      }
      if (this.bossObj) {
        this.$http('post', '/api/role/creator/add', { employee_id: this.bossObj })
          .then(res => {
            self.$message.success('已经添加成功，请稍后刷新查看');
            this.open_right(this.role_list[0]);
          })
          .finally(() => {
            this.bossObj = '';
            this.dialogFormVisible = false;
          });
      } else {
        this.$message.error('请选择人员');
      }
    },
    // 关闭导出
    close_export() {
      this.exportEmploye = false;
      this.$refs.upload2.clearFiles();
    },
    //  导入 新增
    uploadFile: function(type) {
      let params = {};
      params.file = this.file;
      this.update_btn = true;
      this.$http('post', '/api/employee/prize_import', params)
        .then(res => {
          if (res.data.code == 1) {
            this.close_export();
            this.$message.success({
              type: '上传成功',
              message: res.data.msg
            });
            this.get_table_list();
          }
        })
        .catch(() => {
          if (res.data.msg == '') {
            return;
          }
          this.$message({
            type: 'error',
            message: res.data.msg
          });
        })
        .finally(() => {
          setTimeout(() => {
            this.update_btn = false;
          }, 3000);
        });
    },
    // 导出员工信息
    downloadSheet: function() {
      let role_id;
      for (let i in this.role_list) {
        if (this.role_list[i].code == 'dept_manager') {
          role_id = this.role_list[i].id;
        }
      }
      let params = {
        role_id: role_id
      };
      this.$http('get', '/api/employee/prize_export', params).then(res => {
        if (res.data.code == 1) {
          let path = res.data.data.path;
          window.open(this.publicBASE_API + '/api/employee/download?path=' + path + '&type=' + 2);
        }
      });
    },

    handlePictureCardPreview(response) {
      if (response.code == 1) {
        this.file = response.data;
      }
    },
    beforeFilesUpload(file) {
      const $ext_list = ['xlsx', 'xls'];
      let len = file.name.split('.').length - 1;
      const $ext_name = file.name.split('.')[len];
      if ($ext_list.indexOf($ext_name) != -1) {
      } else {
        this.$message.warning('文件格式上传错误,仅支持上传xlsx,xls）');
        return false;
      }
    },

    //同步管理范围
    syncScope() {
      let data = {
        superior_id: this.syncScopeId
      };
      this.$http('post', '/api/employee/syn_scope', data)
        .then(res => {
          if (res.data.code == 1) {
            this.$message({
              message: res.data.msg,
              type: 'success'
            });
            this.get_table_list();
          }
        })
        .catch(() => {});
    },
    // 数据查看权限弹窗
    dataAccessPopup() {
      this.dataAccessShow = true;
      this.getDataAccess();
    },
    // 获取数据范围权限
    getDataAccess() {
      let self = this;
      self.dataAccessLoading = true;
      self
        .$http('get', '/api/role/range', { role_id: self.item_info.id })
        .then(res => {
          if (res.data.code == 1) {
            const resData = res.data.data;
            if (this.item_info.code != 'employee') {
              self.dataAccessList.forEach(element => {
                element.name == 'event_range' ? (element.code = resData.event_range) : '';
                element.name == 'prize_range' ? (element.code = resData.prize_range) : '';
                element.name == 'statistics_range' ? (element.code = resData.statistics_range) : '';
              });
            } else {
              self.dataAccessListEmployee.forEach(element => {
                element.name == 'event_range' ? (element.code = resData.event_range) : '';
              });
            }
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .catch(e => {
          self.$message.error(e.data.msg);
        })
        .finally(() => {
          self.dataAccessLoading = false;
        });
    },
    // 设置数据范围权限
    setDataAccess() {
      let self = this;
      let data = {
        role_id: self.item_info.id
      };
      self.setDataAccessBtn = true;
      self.jurisdiction.forEach(element => {
        data[element.name] = element.code;
      });
      if (self.item_info.code == 'employee') {
        (data.prize_range = '1'), (data.statistics_range = '1');
        data.performance_range = '1';
      } else {
        data.performance_range = '1';
      }
      self
        .$http('post', '/api/role/range', data)
        .then(res => {
          if (res.data.code == 1) {
            self.dataAccessShow = false;
            self.$message.success(res.data.msg);
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .catch(e => {
          self.$message.error(e.data.msg);
        })
        .finally(() => {
          self.setDataAccessBtn = false;
        });
    },
    setPower(type) {
      this.setPowerShow = true;
      this.setPowerType = type;
    },
    powerClose() {
      this.setPowerShow = false;
      this.batchSet.a_all = '';
      this.batchSet.b_all = '';
      this.batchSet.bonu_all = '';
    },
    setPowerBtn() {
      let self = this;
      let data = { employees: [] };
      switch (self.setPowerType) {
        case 'aAll':
          data.a = self.batchSet.a_all;
          break;
        case 'bAll':
          data.b = self.batchSet.b_all;
          break;
        case 'bonuAll':
          data.entry_limit = self.batchSet.bonu_all || '-1';
          break;
        case 'deduct_task_monthly':
          data.deduct_task_monthly = [{ ...self.batchSet.deduct_task_monthly }];
          break;
        case 'reward_task_monthly':
          data.reward_task_monthly = [{ ...self.batchSet.reward_task_monthly }];
          break;
        case 'reward_ratio_point':
          data.reward_ratio_point = self.batchSet.reward_ratio_point;
          break;
        case 'exec_count_point':
          data.exec_count_point = self.batchSet.exec_count_point;
          break;
        case 'exec_count':
          data.exec_count = self.batchSet.exec_count;
          break;
        case 'reward_ratio':
          data.reward_ratio = self.batchSet.reward_ratio;
          break;
        default:
          data = {};
      }
      self.table_list.forEach(element => {
        data.employees.push(element.id);
      });
      self.setPowerBtnLoad = true;
      self
        .$http('post', '/api/integral/employee/limit/batch', data)
        .then(res => {
          if (res.data.code == 1) {
            self.$message.success(res.data.msg);
            self.table_list.forEach(element => {
              switch (self.setPowerType) {
                case 'aAll':
                  element.point_limit_obj.AF = data.a;
                  break;
                case 'bAll':
                  element.point_limit_obj.BF = data.b;
                  break;
                case 'bonuAll':
                  if (data.entry_limit == '-1') {
                    element.entry_limit = '';
                  } else {
                    element.entry_limit = data.entry_limit;
                  }
                  break;
                case 'deduct_task_monthly':
                  element.deduct_task_monthly[0].point = data.deduct_task_monthly[0].point;
                  break;
                case 'reward_task_monthly':
                  element.reward_task_monthly[0].point = data.reward_task_monthly[0].point;
                  break;
                case 'reward_ratio_point':
                  element.reward_ratio_point = data.reward_ratio_point;
                  break;
                case 'exec_count_point':
                  element.exec_count_point = data.exec_count_point;
                  break;
                case 'exec_count':
                  element.exec_count = data.exec_count;
                  break;
                case 'reward_ratio':
                  element.reward_ratio = data.reward_ratio;
                  break;
                default:
                  element.reward_ratio = '0';
              }
            });
            self.powerClose();
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .catch(e => {
          self.$message.error(e.data.msg);
        })
        .finally(() => {
          self.setPowerBtnLoad = false;
        });
    },
    // 关闭提示语
    tips_close() {
      localStorage.setItem('role_tips', 'true');
      this.tips_show = false;
    },
    open_integral_limit(item) {
      this.integral_limit_show = true;
      this.set_mployee_limit_id = item.id;
      this.get_employee_limit(item.id);
    },
    // 补全A、B分
    completionABArr(arr) {
      let resultArr = [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }];
      if (arr !== null && arr.length == 0) {
        arr = resultArr;
      } else if (arr.length == 1 && arr[0].pt_id == 3) {
        arr.push({ name: 'A分', point: 0, pt_id: 2 });
      }
      if (arr.length == 1 && arr.pt_id == 2) {
        arr.push({ name: 'B分', point: 0, pt_id: 3 });
      }

      return arr;
    },
    get_employee_limit(id) {
      let self = this;
      self.integral_limit_loading = true;
      self.bonus_deducted_loading = true;
      self
        .$http('get', '/api/integral/employee/limit', { employee_id: id })
        .then(res => {
          if (res.data.code == 1) {
            const resultData = res.data.data;
            self.integral_limit_form = resultData;
            self.integral_limit_form.point_limit = this.completionABArr(resultData.point_limit);
            self.integral_limit_form.deduct_task_monthly = this.completionABArr(resultData.deduct_task_monthly);
            this.checked = resultData.task_enable == 0 ? false : true;
            self.integral_limit_form.reward_task_monthly = this.completionABArr(resultData.reward_task_monthly);
            if (self.integral_limit_form.entry_limit === -1) {
              self.integral_limit_form.entry_limit = '';
            }
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .finally(() => {
          self.integral_limit_loading = false;
          self.bonus_deducted_loading = false;
        });
    },
    sub_employee_limit() {
      let self = this;
      self.integral_limit_form.employee_id = self.set_mployee_limit_id;
      let data = JSON.parse(JSON.stringify(self.integral_limit_form));
      if (data.entry_limit == '') {
        data.entry_limit = '-1';
      }
      self
        .$http('post', '/api/integral/employee/limit', data)
        .then(res => {
          if (res.data.code == 1) {
            self.$message.success(res.data.msg);
            self.get_table_list();
            self.integral_limit_show = false;
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .catch(e => {
          self.$message.error(e.data.msg);
        });
    },
    open_bonus_deducted(item) {
      this.bonus_deducted_show = true;
      this.set_mployee_limit_id = item.id;
      this.get_employee_limit(item.id);
    },
    sub_bonus_deducted(fromName) {
      let self = this;
      self.integral_limit_form.employee_id = self.set_mployee_limit_id;
      self.integral_limit_form.task_enable = self.checked ? '1' : '0';
      self.$refs[fromName].validate(valid => {
        if (valid) {
          self
            .$http('post', '/api/integral/employee/limit', self.integral_limit_form)
            .then(res => {
              if (res.data.code == 1) {
                self.$message.success(res.data.msg);
                setTimeout(() => {
                  self.get_table_list();
                }, 1000);
                self.bonus_deducted_show = false;
              } else {
                self.$message.error(res.data.msg);
              }
            })
            .catch(e => {
              self.$message.error(e.data.msg);
            });
        }
      });
    },
    bonus_deducted_colse(fromName) {
      this.bonus_deducted_show = false;
      this.$refs[fromName].resetFields();
    },
    add_management_scope(item) {
      let self = this;
      self.list_info = item;
      (this.control_limit = [item.id]), //设置选人员时排除设置的人
        (self.employee_not_select = [item.id]);
      let employeeList = JSON.parse(localStorage.getItem('SET_EMPLOYEE_MAP')); //获取员工信息
      self.management_scope_arr.employee = [];
      self
        .$http('get', '/api/employee/info', { id: self.list_info.id })
        .then(res => {
          if (res.data.code == 1) {
            let employee_detail = res.data.data.employee_detail.manage_scope || []; //获取当前数据的管理范围
            employee_detail.map(item => {
              //依次将缓存的头像添加到数据中
              if (employeeList[item.id]) {
                item.img_url = employeeList[item.id].img_url;
              }
            });
            self.management_scope_arr.employee = employee_detail;
            self.management_scope_show = true;
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .finally(() => {
          self.role_loading = false;
        });
    },
    //添加编辑管理范围
    management_scope_confirm(val) {
      let self = this;
      self.management_arr = [];
      val.employee.forEach(element => {
        self.management_arr.push(element.id);
      });
      self.$http('POST', '/api/employee/scope', { employee_id: self.list_info.id, id: self.management_arr }).then(res => {
        if (res.data.code == 1) {
          self.$message.success('设置成功！');
          self.table_list.forEach(element => {
            if (element.id == self.list_info.id) {
              element.manage_scope_count = self.management_arr.length;
            }
          });
          self.management_scope_show = false;
          this.$nextTick(() => {
            this.$store.dispatch('get_employee_map').then(res => {});
          });
        } else {
          self.$message.error(res.data.msg);
        }
      });
    },
    edit_permissions() {
      let self = this;
      let data = { role_id: self.item_info.id, permissions: [] };
      this.permissions_list.forEach(element => {
        if (element.selected == true) {
          data.permissions.push(element.id);
        }
      });
      self
        .$http('post', '/api/role/permissions', data)
        .then(res => {
          if (res.data.code == 1) {
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .catch(e => {
          self.$message.error(e.data.msg);
        })
        .finally(() => {});
    },
    get_role_list() {
      let self = this;
      self.role_loading = true;
      self
        .$http('get', '/api/role/list')
        .then(res => {
          if (res.data.code == 1) {
            this.role_list = res.data.data.list;
            this.open_right(this.role_list[0]);
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .finally(() => {
          self.role_loading = false;
        });
    },
    open_right(data) {
      // 根据选择人员权限来显示不同的权限数据范围
      this.jurisdiction = data.code == 'employee' ? this.dataAccessListEmployee : this.dataAccessList;
      this.item_info = data;
      this.table_list = [];
      if (data.code != 'employee') {
        this.get_table_list();
      }
    },
    get_table_list() {
      let self = this;
      self.table_loading = true;
      self.$http('get', '/api/role/user', { role_id: self.item_info.id, keyword: self.keyword }).then(res => {
          if (res.data.code == 1) {
            if (this.item_info.code == 'dept_manager') {
              //获取到部门管理列表中人的id
              let syncScopeIds = [];
              for (let i in res.data.data.list) {
                syncScopeIds.push(res.data.data.list[i].id);
              }
              this.syncScopeId = syncScopeIds;
            }

            let point_types = JSON.parse(localStorage.getItem('SET_POINT_TYPES'))
            let point_type_map = {};
            for (let i in point_types) {
              point_type_map[point_types[i].id] = point_types[i];
            }
            let data = res.data.data.list;
            // 处理添加人员的组件选中问题
            this.rules_employee_arr.employee = [];
            this.add_employee_not_select = [];
            for (let i in data) {
              this.rules_employee_arr.employee.push({ id: data[i].id, img_url: data[i].img_url, name: data[i].name });
              if (data[i].entry_limit == '-1') {
                data[i].entry_limit = '';
              }
              if (data[i].point_limit !== null && data[i].point_limit.length == 0) {
                data[i].point_limit = [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }];
              }
              if (data[i].deduct_task_monthly !== null && data[i].deduct_task_monthly.length == 0) {
                data[i].deduct_task_monthly = [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }];
              }
              if (data[i].reward_task_monthly !== null && data[i].reward_task_monthly.length == 0) {
                data[i].reward_task_monthly = [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }];
              }
              if (!data[i]['point_limit_obj']) {
                data[i]['point_limit_obj'] = {};
              }
              if (self.item_info.code != 'creator') {
                for (let k in data[i].point_limit) {
                  data[i]['point_limit_obj'][point_type_map[data[i].point_limit[k].pt_id].code] = data[i].point_limit[k].point;
                }
              }
              this.add_employee_not_select.push(data[i].id);
            }
            this.table_list = data;
            this.removeAdmin();
          } else {
            self.$message.error(res.data.msg);
          }
        })
        .finally(() => {
          self.table_loading = false;
        });
    },

    handleSelectionChange(val) {
      this.del_arr = [];
      val.forEach(element => {
        this.del_arr.push(element.id);
      });
    },
    del_btn() {
      let self = this;
      if (!self.radio) {
        if (bool) {
          this.$message({message: '请选择要删除的人员',type: 'warning'});
          bool = false;
          setTimeout(() => {
            bool = true;
          }, 5000);
        } else {
        }
        return false;
      }
      self
        .$confirm('确定要删除该人员?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        .then(() => {
          if (self.radio == self.$store.getters.user_info.id) {
            this.$message({ message: '不可删除自己', type: 'warning' });
            return;
          }
          self
            .$http('DELETE', '/api/role/user', { role_id: self.item_info.id, employee_id: self.radio })
            .then(res => {
              if (res.data.code == 1) {
                self.radio = '';
                self.$message.success(res.data.msg);
              } else {
                self.$message.error(res.data.msg);
              }
            })
            .catch(e => {
              self.$message.error(e.data.msg);
            })
            .finally(() => {
              this.get_table_list();
            });
        });
    },
    add_employee() {},
    add_employee_confirm(val) {
      let self = this;
      self.employee_arr = [];
      val.employee.forEach(element => {
        self.employee_arr.push(element.id);
      });
      this.postData();
    },
    //公共弹窗关闭
    publicClose() {
      this.add_employee_show = false;
      this.management_scope_show = false;
    },
    sub_add_employee(form) {
      let self = this;
      this.$nextTick(() => {
        this.$refs.Employee.confirm();
      });
    },
    // 批量添加管理者
    postData() {
      let self = this;
      let data = { target: [] };
      self.employee_arr.forEach(element => {
        data.target.push({ role_id: self.item_info.id, employee_id: element });
      });
      if (data.target.length != 0) {
        self.add_employee_show = false;
        this.$nextTick(() => {
          self
            .$http('POST', '/api/role/user/many', data)
            .then(res => {
              if (res.data.code == 1) {
                self.$message.success('已经添加成功，请稍后刷新查看');
              } else {
                self.$message.error(res.data.msg);
              }
            })
            .catch(e => {
              self.$message.error(e.data.msg);
            });
        });
      } else {
        if (bool) {
          this.$message({
            message: '请选择人员',
            type: 'warning'
          });
          bool = false;
          setTimeout(() => {
            bool = true;
          }, 5000);
        } else {
          // console.log('不执行')
        }
      }
    },
    getPointType(id) {
      let pointMap = window.plus ? JSON.parse(plus.storage.getItem('SET_POINT_TYPES')) : JSON.parse(localStorage.getItem('SET_POINT_TYPES'));
      let name = null;
      pointMap.forEach(element => {
        if (element.id == id) {
          name = element.name;
        }
      });
      return name;
    },
    removeAdmin() {
      for (const key in this.employee_map) {
        this.employee_map[key].role_list.forEach(element => {
          if (element.name == 'creator') {
            this.add_employee_not_select.push(this.employee_map[key].id);
          }
        });
      }
    },
    //点击搜索
    onFilterChanged: function() {
      this.get_table_list();
    }
  },
  mounted() {
    this.isStart = this.$authoritys('creator');
    this.$store.dispatch('GetUserInfo');
    this.get_role_list();
    if (localStorage.getItem('role_tips')) {
      this.tips_show = false;
    } else {
      this.tips_show = true;
    }
  },
  beforeDestroy() {
    this.$store.dispatch('GetUserInfo');
  }
};
</script>
<style scoped lang="scss">
.el-radios /deep/ .el-radio__label {
  display: none;
}
/deep/ .radioBox .el-radio__label {
  display: inline-block;
}
/deep/ .el-menu-item {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.tips_alert {
  margin-bottom: 20px;
  background: #fdf6ec;
  padding: 2px 10px;
  font-size: 13px;
  position: relative;
  color: #606266;
}

.tips_alert i {
  font-size: 12px;
  opacity: 1;
  position: absolute;
  top: 12px;
  right: 15px;
  cursor: pointer;
  color: #c0c4cc;
}

.tips_alert span {
  color: #e6a23c;
}
.text-center {
  text-align: center;
}
.set_role_box {
  .person_role_box {
    display: block;
    padding: 14px 0;
  }
  .person_role_box:hover {
    background: #ebf5ff;
  }

  .person_role_box:hover .pic {
    background: #26a2ff;
  }

  .pic {
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    background: #d8d8d8;
    margin-right: 6px;
  }

  .name {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    color: #303133;
  }

  .role_list {
    position: relative;
    display: table-cell;
    margin: 0 !important;
    padding: 0;
  }

  .role_list:after {
    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 1px;
    background: #ebeef5;
  }

  .role_list /deep/ .el-input__suffix i {
    width: 58px;
    color: #909399;
    margin-right: -5px;
    background: #dcdfe6;
    border-radius: 0 4px 4px 0;
  }
}
.tips {
  background: #dcdfe6;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
}

.tableListClass {
  .el-radio {
    /deep/ .el-radio__label {
      display: none;
    }
  }
}

.set_role_div {
  // margin:12px auto;
  background: #fff;
  min-height: calc(100vh - 160px);
  display: flex;
}
.diy-tip {
  margin-bottom: 15px;
  background: #f0f9eb !important;
  color: #67c23a !important;
  border: 1px solid #67c23a;
  padding: 20px 16px;
  p {
    color: #67c23a !important;
    font-size: 14px;
    margin: 0 !important;
    padding: 4px 0;
  }
}
.cursor_pointer {
  cursor: pointer;
}
.red_tips {
  margin-bottom: 15px;
  color: #f56c6c;
}
.roleTipClass {
  font-size: 12px;
  color: #909399;
  margin-bottom: 20px;
}
.roleNameClass {
  // display:block;
  font-size: 20px;
  color: #303133;
}
</style>