dd_pc/src/views/set/jurisdiction.vue

<template>
	<div  class="all-box">
		<el-alert v-if="tips_show" class="diy-tip" title="温馨提示：" type="warning" @close="tips_close" description show-icon>
			<p>功道云积分系统共有5种角色，不同角色拥有不同的权限</p>
		</el-alert>
		<div class="all">
			<div class="flex-box" v-loading="role_loading">
				<div class="terr-left">
					<el-menu default-active="0" class="el-menu-vertical-demo" style="border: none">
						<el-menu-item
							style="height: 47px;line-height: 47px;"
							: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>
				</div>
				<div class="terr-right border-right flex-1">
					<div class="margin-bottom">
						<div class="flex-box flex-v-ce">
							<div class="name">{{ item_info.name }}</div>
							<div class="flex-1"></div>
							<el-button type="text" size="medium" style=" padding: 0; line-height: initial;" v-show="item_info.code !== 'creator'" @click="dataAccessPopup">数据查看权限</el-button>
							<el-button type="text" size="medium" plain v-if="item_info.code != 'employee'" @click="open_right(item_info)">刷新</el-button>
						</div>
						<div class="user_text fontColorF" v-if="item_info.code == 'creator'">创始人默认为开通【功道云积分制】的人，拥有所有的功能及管理权限</div>
						<div class="user_text fontColorF" v-if="item_info.code == 'admin'">公司管理员一般为合伙人、股东等高级管理人员，可管理多个部门和人员</div>
						<div class="user_text fontColorF" v-if="item_info.code == 'point_manager'">积分专员一般为人事、行政等管理督办人员，可管理多个部门和人员</div>
						<div class="user_text fontColorF" v-if="item_info.code == 'dept_manager'">部门管理员一般为部门/团队经理、主管、组长，可管理一部分人员</div>
						<div class="user_text fontColorF" v-if="item_info.code == 'employee'">员工为默认角色，每个人都拥有员工角色的功能权限，该角色不可修改</div>
					</div>
					<div class="flex-box btns flex-v-ce margin-bottom" v-if="item_info.code != 'employee'">
							<el-button size="small" v-show="item_info.code == 'creator' && table_list.length > 1 && isStart" @click="del_creator" type="danger">删除</el-button>
							<el-button size="small" v-show="item_info.code == 'creator' && isStart" @click="dialogFormVisible=true" type="primary">添加</el-button>
							<el-button size="small" v-show="item_info.code != 'creator' && table_list.length > 0" @click="del_item" type="danger">删除</el-button>
							<el-button size="small" v-show="item_info.code != 'creator'" @click="add_item" type="primary">添加</el-button>
					</div>
					<div v-if="item_info.code == 'creator'">
						<el-table :data="table_list"  v-loading="table_loading">
							<el-table-column width="40" fixed  v-if="item_info.code == 'creator' && table_list.length > 1 && isStart">
								<template slot-scope="scope">
									<el-radio v-model="radioVal" :label="scope.row.id"></el-radio>
								</template>
							</el-table-column>
							<el-table-column prop="name" label="姓名">
								<template slot-scope="scope">
									<div class="flex-box flex-v-ce">
										<userImage  width="50px" height="50px" :img_url="scope.row.img_url" :user_name="scope.row.name"></userImage>
										<span style="margin-left: 10px; line-height: 50px;">{{ scope.row.name }}</span>
									</div>
								</template>
							</el-table-column>
							<el-table-column prop="dept" label="部门" v-if="item_info.code != 'creator'"></el-table-column>
							<template slot="empty">
								<noData :isSolt="true">
									<template v-slot:default>
										<div style="position: inherit;">
											还没有{{ item_info.name }},
											<span style="color:#26A2FF;cursor:pointer;" @click="dialogFormVisible=true">去添加>></span>
										</div>
									</template>
								</noData>
							</template>
						</el-table>
<!-- 						<div v-else style="text-align: center;">
							<template>
								<div style="margin-top: 10%;margin-bottom: 10px;">
									创始人即钉钉的主管理员，请确认应用的使用范围中是否选择了主管理员设置步骤：
								</div>
								<div>
									进入【<span class="blue">钉钉管理后台</span>】→【<span class="blue">工作台</span>】→【<span class="blue">功道云积分制</span>】→【<span class="blue">设置</span>】，修改可见范围为全部员工或从部分员工中选上主管理员
								</div>
							</template>
						</div> -->
					</div>
					<div v-else-if="item_info.code == 'employee'" style="text-align:center;margin-top:200px;">
						未设置管理角色的人员，都是普通员工
					</div>

					<el-table :data="table_list" fit v-else   v-loading="table_loading">
						<el-table-column width="40" fixed>
							<template slot-scope="scope">
								<el-radio v-model="radioVal" :label="scope.row.id"></el-radio>
							</template>
						</el-table-column>
						<el-table-column prop="name" label="姓名" width="150" fixed>
							<template slot-scope="scope">
								<div class="flex-box flex-v-ce">
									<userImage width="50px" height="50px" :img_url="scope.row.img_url" :user_name="scope.row.name"></userImage>
									<span style="margin-left: 10px; line-height: 50px;">{{ scope.row.name }}</span>
								</div>
							</template>
						</el-table-column>
						<el-table-column 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 label="A分权限">
								<template slot-scope="scope">
									<div @click="open_integral_limit(scope.row)" class="cursor_pointer">
										<div v-for="(item, index) in scope.row.point_limit" :key="index" v-show="item.name == 'A分'" class="cursor_pointer">
											<span v-if="item.point != 0">{{item.point}}</span>
											<span v-else style="text-decoration:underline">未设置</span>
										</div>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="B分权限">
								<template slot-scope="scope">
									<div @click="open_integral_limit(scope.row)" class="cursor_pointer">
										<div v-for="(item, index) in scope.row.point_limit" :key="index" v-show="item.name == 'B分'" class="cursor_pointer">
											<span v-if="item.point != 0">{{ item.point}}</span>
											<span v-else style="text-decoration:underline">未设置</span>
										</div>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="每月B分奖分上限">
								<template slot-scope="scope">
									<div @click="open_integral_limit(scope.row)" v-show="scope.row.entry_limit == 0" class="cursor_pointer" style="text-decoration:underline">
										未设置
									</div>
									<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 < 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 label="奖分目标">
								<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 label="扣分目标">
								<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 label="奖扣次数">
								<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 label="每少一次扣">
								<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 label="奖扣比例">
								<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 label="不达标扣">
								<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>
						<template slot="empty">
							<noData :isSolt="true">
								<template v-slot:default>
									<div>还没有{{ item_info.name }},<span style="color:#26A2FF;cursor:pointer;" @click="add_item">去添加>></span></div>
								</template>
							</noData>
						</template>
					</el-table>
				</div>
			</div>
		</div>
		<el-dialog title="添加人员" :visible.sync="add_employee_show" :before-close="publicClose" width="700px" top="5vh">
			<EmployeeSelector
				v-if="add_employee_show"
				ref="Employee"
				:user_no_select="false"
				:can_select_dept="true"
				@confirm="add_employee_confirm"
			></EmployeeSelector>
			<span slot="footer">
				<el-button @click="publicClose()">取消</el-button>
				<!-- 积分负责人调用单次的添加接口 -->
				<!-- <el-button type="primary" :loading="setUser_loading" v-if="item_info.code == 'ding_admin'"  @click="sub_add_employee2">完成</el-button> -->
				<!-- 其他可批量 -->
				<el-button type="primary" :loading="setUser_loading" :disabled="setUser_loading"  @click="sub_add_employee">完成</el-button>
			</span>
		</el-dialog>
		
		<el-dialog
		  title="设置积分权限"
		  :visible.sync="integral_limit_show"
		  :close-on-click-modal="false"
		  width="700px">
		  <el-form label-width="160px" :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: '分值不能为空'},{ type: 'number', message: '分值必须为数字值'}]">
		        <el-input v-model.number="item.point" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
		      </el-form-item>
		    </span>
		    <el-form-item label="每月B分奖分上限" prop="entry_limit" >
		      <el-input v-model.number="integral_limit_form.entry_limit" oninput="value=value.replace(/[^\d]/g,'')"></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" :loading="integral_loading"  :disabled="integral_loading"  @click="sub_employee_limit('integral_limit_form')">确定</el-button>
		    </el-form-item>
		  </el-form>
		</el-dialog>
		
		<el-dialog title="设置管理范围" :visible.sync="management_scope_show"  :before-close="publicClose2"  top="5vh"  width="700px">
		  <EmployeeSelector 
		  v-if="management_scope_show" 
		  ref="Employee2" 
		  :my_no_select="my_no_select"
		  :user_no_select="false" 
		  :selected="management_scope_arr" 
		  :can_select_dept="true" 
		  @confirm="management_scope_confirm">
		  </EmployeeSelector>
		  <span slot="footer">
		    <el-button @click="publicClose2()">取消</el-button>
		    <el-button type="primary" :loading="scope_loading" :disabled="scope_loading" @click="sub_management_scope">完成</el-button>
		  </span>
		</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.number="item.point"  type="number" oninput="value=value.replace(/[^\d]/g,'')"  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;" prop="point">
		        <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.number="item.point" type="number" oninput="value=value.replace(/[^\d]/g,'')"  placeholder="请输入数值"></el-input>
		      </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.number="integral_limit_form.exec_count" oninput="value=value.replace(/[^\d]/g,'')" 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.number="integral_limit_form.exec_count_point"  oninput="value=value.replace(/[^\d]/g,'')" 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;"   disabled placeholder="1" ></el-input>:<el-input v-model.number="integral_limit_form.reward_ratio" style="width: 100px;" oninput="value=value.replace(/[^\d]/g,'')"  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.number="integral_limit_form.reward_ratio_point" 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="bonus_deducted_colse('integral_limit_form')">取消</el-button>
		      <el-button type="primary" :loading="bonus_loading" :disabled="bonus_loading"  @click="sub_bonus_deducted('integral_limit_form')">确定</el-button>
		    </el-form-item>
		  
		  </el-form>
		</el-dialog>
		<!-- 添加老板 -->
		<el-dialog title="添加创始人" :visible.sync="dialogFormVisible"  top="5vh"  width="700px">
		   <EmployeeSelector
			v-if="dialogFormVisible" 
			ref="boss" 
			:multi="false"
			:user_no_select="false" 
			:can_select_dept="true" 
			@confirm="selectBoss">
			</EmployeeSelector>
		  <div style="text-align: center;" class="fontColorT">创始人至少有一位，创始人不能删除自己</div>
		  <div slot="footer" class="dialog-footer">
		    <el-button @click="dialogFormVisible=false" :disabled="isShowBoss">取 消</el-button>
		    <el-button type="primary" :loading="isShowBoss" :disabled="isShowBoss" @click="add_creator()">确 定</el-button>
		  </div>
		</el-dialog>
		<!-- 查看管理范围 -->
		<el-dialog
		  title="数据查看权限"
		  :visible.sync="dataAccessShow"
		  width="600px">
		  <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" class="radioBox" >{{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>
	</div>
</template>

<script>
import EmployeeSelector from '@/components/EmployeeSelector.vue';
import noData from '@/components/noData';
  const minimum = (rule, value,callback)=>{
    if (value < 0){
      callback(new Error('数值不能为负数'))
    }else {
      callback()
    }
  }
export default {
	data() {
		return {
			role_list:[],
			table_list: [],
			tips_show: false,
			role_loading: false,
			table_loading: false,
			setUser_loading:false,
			item_info: {
				// code: 'creator'
			},
			rules_employee_arr: { employee: [], dept: [] },

			//添加人员相关
			add_employee_show: false,
			add_employee_form: { employee_ids: [] },
			employee_arr:[],

			radioVal: '',
			// 设置积分相关
			integral_limit_show:false,
			management_scope_show:false,
			integral_limit_loading:false,
			integral_limit_form:{},
			management_scope_arr: {employee: [], dept: []},
			scope_loading:false,
			integral_loading:false,
			
			
			// 设置奖扣任务相关
			bonus_deducted_show:false,
			bonus_deducted_loading:false,
			bonus_loading:false,
			integral_limit_rules:{
			  exec_count:[
			    { required: true, validator: minimum, trigger: 'blur' },
				{ type: 'number', message: '分值必须为数字值'}
			  ],
			  exec_count_point:[
			    { required: true, validator: minimum, trigger: 'blur' },
				{ type: 'number', message: '分值必须为数字值'}
			  ],
			  reward_ratio:[
			    { required: true, validator: minimum, trigger: 'blur' },
				{ type: 'number', message: '分值必须为数字值'}
				
			  ],
			  reward_ratio_point:[
			    { required: true, validator: minimum, trigger: 'blur' },
				{ type: 'number', message: '分值必须为数字值'}
			  ],
			},
			my_no_select:'',//设置人的ID
			isStart:false,//是否是创始人或者积分负责人
			// BOSS操作
			dialogFormVisible:false,//控制添加老板弹窗
			bossObj:'',
			isShowBoss:false,
			
			// 控制管理范围
			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: 2},
			      {name: '查看全员数据', id: 3}
			    ]
			  },
			//   {
			//     title: '团队绩效',
			//     name: 'performance_range',
			//     code: 0,
			//     list: [
			//       {name: '仅查看自己的数据', id: 1},
			//       {name: '查看全员数据', id: 2},
			//     ]
			//   }
			],
		};
	},
	components: { EmployeeSelector, noData },
	created() {
		this.get_role_list();
		// 判断是否是创始人或者积分负责人
		this.isStart = this.$getIsCreator("creator");
	},
	mounted() {
		if (localStorage.getItem('framework')) {
			this.tips_show = false;
		} else {
			this.tips_show = true;
		}
	},
	methods: {
		// 数据查看权限弹窗
		dataAccessPopup(){
		  this.dataAccessShow = true
		  this.getDataAccess()
		},
		// 获取数据范围权限
		getDataAccess(){
		  let self = this
		  self.dataAccessLoading = true
		  self.$axios('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 == 'performance_range'?element.code = resData.performance_range:''
		        //   element.name == 'statistics_range'?element.code = resData.statistics_range:''
		        });
		      }else{
		        self.dataAccessListEmployee.forEach(element => {
		          element.name == 'event_range'?element.code = resData.event_range:''
		        //   element.name == 'performance_range'?element.code = resData.performance_range:''
				});
		      }
		    } else {
		      self.$message.error(res.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.performance_range="1";
		  data.statistics_range="1";
		  self.$axios('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)
		    }
		  }).finally(()=>{
		    self.setDataAccessBtn = false
		  })
		},
		
		
		selectBoss(val){
			if(val.employee.length>0){
				this.bossObj=val.employee[0].id
			}
		},
		//添加老板
		add_creator(){
			this.isShowBoss=true;
			this.$refs.boss.confirm();//调用组件的confirm（）；
			if(this.bossObj){
				this.$axios('post','/api/role/creator/add',{employee_id: this.bossObj}).then((res) => {
					this.$message.success('设置成功')
					this.open_right(this.role_list[0]);
				}).finally(() => { 
					this.isShowBoss=false;
					this.dialogFormVisible=false;
				})
			}else{
				  this.$message.error('请选择人员');
			}
		},
		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){
		  this.bonus_loading=true;	
		  this.integral_limit_form.employee_id = this.set_mployee_limit_id
		  var data=this.integral_limit_form;
		  data.reward_task_monthly[1].point=Number(data.reward_task_monthly[1].point);
		  data.deduct_task_monthly[1].point=Number(data.deduct_task_monthly[1].point);
		  if(!this.isNumber(data.reward_task_monthly[1].point)||data.reward_task_monthly[1].point<0){
		  	  this.$message.error('月奖分任务必须为整数且不能为负分');	 
		  		return;			  
		  }
		  if(!this.isNumber(data.deduct_task_monthly[1].point)||data.deduct_task_monthly[1].point<0){
				this.$message.error('月扣分任务必须为整数且不能为负分');
		  		return;
		  }
		  // return;
		  this.$refs[fromName].validate((valid) => {
		    if (valid) {
		      this.$axios('post','/api/integral/employee/limit',data).then((res) => {
		        if (res.data.code == 1) {
		          this.$message.success(res.data.msg)
		          setTimeout(() => {
		            this.get_table_list()
		          }, 1000);
		          this.bonus_deducted_show = false
		        }
		      }).finally(() => { this.bonus_loading=false;})
		    }else{
				this.bonus_loading=false;	
			}
		  });
		},
		bonus_deducted_colse(fromName){
		  this.bonus_deducted_show = false
		  this.$refs[fromName].resetFields()
		},
		//设置管理范围
		sub_management_scope(){
		  this.scope_loading=true;
		  this.$refs.Employee2.confirm();//调用组件的confirm（）；
		  this.$axios('post','/api/employee/scope',{employee_id: this.list_info.id,id: this.management_arr}).then((res) => {
		    if (res.data.code == 1) {
		      this.$message.success("设置成功");
		      this.table_list.forEach(element => {
		        if (element.id == this.list_info.id) {
		          element.manage_scope_count = this.management_arr.length
		        }
		      });
		      this.management_scope_show = false
		    }
		  }).finally(() => { this.scope_loading=false;})
		},
		//添加编辑管理范围
		management_scope_confirm(val){
		  this.management_arr = []
		  val.employee.forEach(element => {
		    this.management_arr.push(element.id)
		  });
		},
		add_management_scope(item){
		  this.list_info = item;
		  this.my_no_select=item.id;
		  this.management_scope_arr.employee=[];
		  this.$axios('get','/api/employee/info',{id: this.list_info.id}).then((res) => {
		    if (res.data.code == 1) {
		      this.management_scope_arr.employee = res.data.data.employee_detail.manage_scope||[];//获取当前数据的管理范围
		      this.management_scope_show = true
		    }
		  }).finally(() => {
		    this.role_loading = false
		  })
		},
		
		isNumber(obj) {
		    return obj === +obj
		},
		sub_employee_limit(fromName){
			this.$refs[fromName].validate((valid) => {
			  if(!this.isNumber(this.integral_limit_form.point_limit[0].point)||this.integral_limit_form.point_limit[0].point<0){
			  	  this.$message.error('权限分必须为整数且不能为负分');	 
				return;			  
			  }
			  if(!this.isNumber(this.integral_limit_form.point_limit[1].point)||this.integral_limit_form.point_limit[1].point<0){
				  this.$message.error('权限分必须为整数且不能为负分');
				  return;
			  }
			  if(valid)	{
				 this.integral_loading=true;
				 this.integral_limit_form.employee_id = this.set_mployee_limit_id
				 this.$axios('post','/api/integral/employee/limit',this.integral_limit_form).then((res) => {
				 				if (res.data.code == 1) {
				 				  this.$message.success(res.data.msg)
				 				  this.get_table_list()
				 				  this.integral_limit_show = false
				 				}
				 }).finally(() => {this.integral_loading = false;}); 
			  }
			});
		},
		open_integral_limit(item){
		  this.integral_limit_show = true
		  this.set_mployee_limit_id = item.id
		  this.get_employee_limit(item.id);
		},
		get_employee_limit(id){
		  this.integral_limit_loading = true
		  this.$axios('get','/api/integral/employee/limit',{employee_id: id}).then((res) => {
		    if (res.data.code == 1) {
		       var item = res.data.data;
				if (item.point_limit == null || item.point_limit == undefined||item.point_limit.length==0) {
					item.point_limit = [{ name: 'A分', point: '0', pt_id: this.$getTyps('AF').id }, { name: 'B分', point: '0', pt_id: this.$getTyps('BF').id }];
				}
				if (item.deduct_task_monthly == null || item.deduct_task_monthly == undefined||item.deduct_task_monthly.length==0) {
					item.deduct_task_monthly = [{ name: 'A分', point: '0', pt_id: this.$getTyps('AF').id }, { name: 'B分', point: '0', pt_id: this.$getTyps('BF').id }];
				}
				if (item.reward_task_monthly == null || item.reward_task_monthly == undefined||item.reward_task_monthly.length==0) {
					item.reward_task_monthly = [{ name: 'A分', point: '0', pt_id: this.$getTyps('AF').id }, { name: 'B分', point: '0', pt_id: this.$getTyps('BF').id }];
				}
				if(item.point_limit[0].point||item.point_limit[1].point){
					item.point_limit[0].point=Number(item.point_limit[0].point)
					item.point_limit[1].point=Number(item.point_limit[1].point)
				}
				
				this.integral_limit_form=item
		    }
		  }).finally(() => {
		    this.integral_limit_loading = false
		  })
		},
		// 添加积分负责人专属
		sub_add_employee2(form) {
			  var that=this;
			   this.$refs.Employee.confirm();//调用组件的confirm（）；
			   let data ={};
			   if(that.employee_arr.length>0){
				   data.role_id=this.item_info.id;
				   data.employee_id=that.employee_arr[0]
			   }else{
				    this.$message.error('未选择人员');
					return;
				}	
			 this.setUser_loading=true;
			 this.$nextTick(()=>{
				 this.$axios('post','/api/role/user/add',data).then((res) => {
				   if (res.data.code == 1) {
					 this.$message.success('已经添加成功，请稍后重新进来查看')
					 this.add_employee_show= false
					 this.open_right(this.item_info);
				   }
				 }).finally(() => {
					this.setUser_loading = false;
				 })
			 }) 
		},
		// 其他角色添加人员
		sub_add_employee(form) {
			  var that=this;
			   this.$refs.Employee.confirm();//调用组件的confirm（）；
			   let data = {target:[]}
			   if(that.employee_arr.length>0){
				   that.employee_arr.forEach(element => {
				     data.target.push({role_id: this.item_info.id,employee_id: element})
				   });
			   }else{
				    this.$message.error('未选择人员');
					return;
				}	
			 this.setUser_loading=true;
			 this.$nextTick(()=>{
				 this.$axios('post','/api/role/user/many',data).then((res) => {
				   if (res.data.code == 1) {
					 this.$message.success('已经添加成功，请稍后重新进来查看')
					 this.add_employee_show= false
					 this.open_right(this.item_info);
				   }
				 }).finally(() => {
					this.setUser_loading = false;
				 })
			 }) 
		},
		
		add_employee_confirm(val) {
			this.employee_arr = []
			val.employee.forEach(element => {
			   this.employee_arr.push(element.id)
			});
		},
	
		//关闭弹窗
		publicClose() {
			this.$refs.Employee.close()
			this.add_employee_show = false;
		},
		publicClose2() {
			this.$refs.Employee2.close()
			this.management_scope_show = false;
			this.dialogFormVisible=false;
		},
		//删除创始人
		del_creator(){
			var userData=this.$getUserData();
			if (!this.radioVal) {
				this.$message.error('请选择要删除的创始人');
				return false;
			}
			if(this.radioVal==userData.id){
				this.$message.error('不能删除自己');
				return false;
			}
			this.$confirm('确定要删除该创始人?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.$axios('post','/api/role/creator/delete',{employee_id: this.radioVal}).then(res => {
					if (res.data.code == 1) {
						this.$message.success(res.data.msg);
						this.get_table_list();
					}
				}).finally(()=>{
					this.radioVal="";
				})
			});
		},
		del_item() {
			var userData=this.$getUserData();
			if (!this.radioVal) {
				this.$message.error('请选择要删除的人员');
				return false;
			}
			if(this.radioVal==userData.id){
				this.$message.error('不能删除自己');
				return false;
			}
			this.$confirm('确定要删除该人员?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.$axios('post','/api/role/user/del',{role_id: this.item_info.id,employee_id: this.radioVal}).then(res => {
					if (res.data.code == 1) {
						this.$message.success(res.data.msg);
						this.get_table_list();
					}
				}).finally(()=>{
					this.radioVal="";
				})
			});
		},
		add_item() {
			this.add_employee_show = true;
		},
		get_role_list() {
			this.role_loading = true;
			this.$axios('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]);
					}
				})
				.finally(() => {
					this.role_loading = false;
				});
		},
		open_right(data) {
			this.jurisdiction=data.code=='employee'? this.dataAccessListEmployee:this.dataAccessList;
			this.item_info = data;
			if(data.code!='employee'){
				this.get_table_list();
			}
		},
		get_table_list() {
			this.table_loading = true;
			var that = this;
			this.table_list=[];
			this.$axios('get','/api/role/user',{role_id: this.item_info.id}).then(res => {
					if (res.data.code == 1) {
						var list = res.data.data.list;
						list.forEach(item => {
							if (item.point_limit == null || item.point_limit == undefined||item.point_limit.length==0) {
								item.point_limit = [{ name: 'A分', point: '0', pt_id: that.$getTyps('AF').id }, { name: 'B分', point: '0', pt_id: that.$getTyps('BF').id }];
							}
							if (item.deduct_task_monthly == null || item.deduct_task_monthly == undefined||item.deduct_task_monthly.length==0) {
								item.deduct_task_monthly = [{ name: 'A分', point: '0', pt_id: that.$getTyps('AF').id }, { name: 'B分', point: '0', pt_id: that.$getTyps('BF').id }];
							}
							if (item.reward_task_monthly == null || item.reward_task_monthly == undefined||item.reward_task_monthly.length==0) {
								item.reward_task_monthly = [{ name: 'A分', point: '0', pt_id: that.$getTyps('AF').id }, { name: 'B分', point: '0', pt_id: that.$getTyps('BF').id }];
							}
						});
						this.table_list = list||[];
					}
			}).finally(() => {
				this.table_loading = false;
			});
		},
		// 关闭提示语
		tips_close() {
			localStorage.setItem('framework', 'true');
			this.tips_show = false;
		}
	}
};
</script>

<style scoped="scoped">
::v-deep .el-radio .el-radio__label {
	display: none;
}
::v-deep .radioBox .el-radio__label {
	display: inline-block;
}
.tips {
	background: #dcdfe6;
	border-radius: 50%;
	width: 14px;
	height: 14px;
	color: #fff;
	display: inline-block;
	font-size: 12px;
	line-height: 14px;
	text-align: center;
}
.name {
	font-size: 18px;
	margin-bottom: 5px;
}
.user_text {
	font-size: 12px;
}
.cursor_pointer {
	cursor: pointer;
}
</style>