<template>
	<div>
		<div v-if="$getRole(1)&&userInfo.is_only_try_order" @click="dialogVisible = true" :style="{ backgroundImage: 'url(' + loginBg + ')' }" style="position: relative;margin-bottom: 10px;height: 77px;" class="headerImg">
			<div style="position: absolute;width: 440px;font-size: 26px;color: #fff;font-weight: 600;top: 20px;text-align: center;left: 50%;margin-left: -220px;">
				免费预约演示 获取行业绩效管理方案
			</div>
		</div>
		<div class="all boxMinHeight">
			<div class="flex-box ts flex-center-center" v-if="isSubject">
				<img src="@/assets/image/tz.png" />
				<div class="flex-1">你正在使用个人体验版，如需正式使用，请联系管理员</div>
				<div class="btn" type="primary" @click="openGly">联系管理员</div>
			</div>
			<div>
				<div class="left-main" v-if="$getRole(1)">
					<div class="flex-box-ce" v-if="entranceList.length > 0">
						<div class="entrance flex-box-ce" v-for="(item, index) in entranceList" :key="index" @click="openUrl(item)">
							<img :src="item.image" />
							<span>{{ item.name }}</span>
						</div>
					</div>
					<div v-else><div style="text-align: center;margin: 020px;" class="fontColorC">暂无相关权限</div></div>
				</div>
				<!-- 待办 -->
				<div class="flex-box">
					<div class="flex-1 dispose-left">
						<div class="more2" v-if="agencyList.length > 0">
							<span @click="$router.push({ name: 'backlog', query: { activeName: activeName } })">
								查看更多
								<i class="el-icon-d-arrow-right"></i>
							</span>
						</div>
						<el-tabs v-model="activeName" class="tabs">
							<el-tab-pane :title="tab.title" :name="tab.name" :key="tab.name" v-for="(tab, index) in editableTabs" v-loading="loading">
								<span slot="label" v-if="tab.num > 0">
									<el-badge :value="tab.num" :max="999">
										<span>{{ tab.title }}</span>
									</el-badge>
								</span>
								<span slot="label" v-else>
									<div style="position: relative;vertical-align: middle;display: inline-block;">
										<span>{{ tab.title }}</span>
									</div>
								</span>
								<template v-if="agencyList.length > 0">
									<div class="flex-box-ce item" v-for="(item, index) in agencyList" :key="index" @click="openDetail(1, item)">
										<template v-if="item.userInfo">
											<userImage :img_url="item.userInfo.img_url" :user_name="item.userInfo.name" fontSize="14" width="40px" height="40px"></userImage>
										</template>
										<div class="flex-1 font-flex-word content">
											<div style="max-width: 700px;" class="font-flex-word">{{ item.content }}</div>
										</div>
										<div class="fontColorB">{{ $moment(item.update_time).format('YYYY-MM-DD HH:mm') }}</div>
									</div>
								</template>
								<NoData v-else content="暂无内容" :isSolt="true">
									<div class="fontColorC" style="text-align: center;">
										暂无内容,
										<span class="blue" style="cursor: pointer;" @click="$router.push({ name: 'backlog', query: { selectIndex: 1 } })">去查看已处理的</span>
									</div>
								</NoData>
							</el-tab-pane>
						</el-tabs>
					</div>
					<div style="width: 300px;margin-left: 10px;padding: 20px 10px;" class="dispose-left">
						<div class="more2">
							<span @click="$router.push({ name: 'unread' })">
								查看更多
								<i class="el-icon-d-arrow-right"></i>
							</span>
						</div>
						<div style="border-bottom: 1px solid #f1f1f1;margin-bottom: 15px;">
							<el-badge :value="messageNum" :max="999" v-if="messageNum > 0">
								<div class="message-title">
									<svg-icon icon-class="unread"></svg-icon>
									未读消息
								</div>
							</el-badge>
							<div class="message-title" v-else>
								<svg-icon icon-class="unread"></svg-icon>
								未读消息
							</div>
						</div>
						<template v-if="messageList.length > 0">
							<div class="item" v-for="(item, index) in messageList" :key="index" @click="openDetail(2, item)">
								<div class="flex-box" v-if="item.type == 4">
									<div style="width: 25px;padding-top: 6px;"><svg-icon icon-class="message-download"></svg-icon></div>
									<span class="message-content flex-1">{{ item.content }}</span>
								</div>
								<div class="flex-box" v-else>
									<div style="width: 25px;padding-top: 6px;"><svg-icon icon-class="inform"></svg-icon></div>
									<span class="message-content flex-1">{{ item.content }}</span>
								</div>
							</div>
						</template>
						<NoData v-else content="暂无内容" :isSolt="true">
							<div class="fontColorC" style="text-align: center;">
								暂无内容,
								<span class="blue" style="cursor: pointer;" @click="$router.push({ name: 'unread', query: { selectIndex: 1 } })">去查看已读的</span>
							</div>
						</NoData>
					</div>
				</div>
				<!-- 管理 -->
				<div class="gl-all" v-loading="staffLoad">
					<div class="flex-box" style="margin-bottom: 20px;">
						<el-cascader
							v-model="headValue"
							:options="options"
							:show-all-levels="false"
							:props="{ expandTrigger: 'hover', label: 'name', value: 'id', children: 'list' }"
						></el-cascader>
						<div style="margin-left:10px;width:200px;"><JxSearch :screen="2" title="请输入姓名搜索" @confirm="searchList"></JxSearch></div>
					</div>
					<el-tabs v-model="glIndex">
						<el-tab-pane :label="item.title" :name="item.name" v-for="(item, index) in glIist" :key="index">
							<el-table stripe :data="glDataList" v-loading="glLoading" :header-cell-style="{ background: '#EDF4FF' }">
								<el-table-column prop="name" label="被考核人">
									<template slot-scope="scope">
										<div class="flex-box-ce">
											<userImage
												:id="scope.row.userInfo.id"
												:user_name="scope.row.userInfo.name"
												:img_url="scope.row.userInfo.img_url"
												width="35px"
												height="35px"
												fontSize="12px"
											></userImage>
											<span style="margin-left: 10px; line-height: 50px;">{{ scope.row.userInfo.name }}</span>
											<span style="margin-left: 10px; line-height: 50px;" class="yellow" v-if="scope.row.has_finish">已归档</span>
										</div>
									</template>
								</el-table-column>
								<el-table-column prop="name" label="部门">
									<template slot-scope="scope">
										<div v-if="scope.row.dept_list.length > 0">
											<span v-for="(item, index) in scope.row.dept_list" :key="index">
												{{ item.name }}
												<span v-if="scope.row.dept_list.length - index > 1">,</span>
											</span>
										</div>
										<span v-else>--</span>
									</template>
								</el-table-column>
								<el-table-column prop="package_name" label="考核时段"></el-table-column>
								<el-table-column prop="name" label="管理记录" v-if="glIndex == '1'">
									<template slot-scope="scope">
										<span v-if="scope.row.count_record == 0" class="fontColorB">无管理记录</span>
										<span v-else class="blue" style="cursor: pointer;" @click="openTx(scope.row)">{{ scope.row.count_record }}条管理记录</span>
									</template>
								</el-table-column>
								<el-table-column prop="name" label="执行计划" v-if="glIndex == '1'">
									<template slot-scope="scope">
										<template v-if="scope.row.action_update">
											<div v-if="returnStr(scope.row.action_update).indexOf('今天') >= 0" class="actionText yellow">
												{{ returnStr(scope.row.action_update) }}
											</div>
											<div v-else-if="returnStr(scope.row.action_update).indexOf('昨天') >= 0" class="actionText green">
												{{ returnStr(scope.row.action_update) }}
											</div>
											<div v-else class="actionText">{{ returnStr(scope.row.action_update) }}</div>
										</template>
										<div></div>
									</template>
								</el-table-column>
								<el-table-column prop="status" label="评分进度" v-else>
									<template slot-scope="scope">
										<span v-if="scope.row.status == 0" class="yellow">未到评分节点</span>
										<span v-if="scope.row.status == 1" class="blue">待我评分</span>
										<span v-if="scope.row.status == 2" class="green">我已评分</span>
										<span v-if="scope.row.status == 3" class="green">已被其他管理评分</span>
									</template>
								</el-table-column>
								<el-table-column prop="score_info" label="评分" v-if="glIndex == '2'">
									<template slot-scope="scope">
										<div v-if="scope.row.score_info.length > 0">
											<div v-for="(item, index) in returnPoint(scope.row)" :key="index">
												<div style="margin-top: 5px;" v-if="item.pointList.length > 0">
													{{ item.name }}:
													<span class="blue">{{ item.pointList.toString() }}</span>
												</div>
												<div v-else>--</div>
											</div>
										</div>
										<div v-else>--</div>
									</template>
								</el-table-column>
								<el-table-column label="操作">
									<template slot-scope="scope">
										<el-button @click="openTx(scope.row)" type="text" v-if="glIndex == '1' && !scope.row.has_finish">填写管理记录</el-button>
										<el-button @click="openDetail2(scope.row)" type="text">查看详情</el-button>
										<el-button @click="openDetail2(scope.row)" type="text" v-if="glIndex == '2' && scope.row.status == 1">去评分</el-button>
									</template>
								</el-table-column>
							</el-table>
							<div class="more">
								<span @click="$router.push({ name: glIndex == 1 ? 'management' : 'score', query: { headValue: JSON.stringify(headValue) } })">
									查看更多
									<i class="el-icon-d-arrow-right"></i>
								</span>
							</div>
						</el-tab-pane>
					</el-tabs>
				</div>
			</div>
			<!-- 跟踪管理 -->
			<TrackManagement
				:showDrawer.sync="isTrack"
				:isCz="has_finish ? true : false"
				:id="employeeID"
				:apList="apList"
				:recordMemberIds="recordMemberIds"
				:assessId="employee_id"
				@confirm="getManagement"
			></TrackManagement>

			<el-dialog class="dialog" :show-close="false" :visible.sync="dialogVisible" width="400px" >
				<div style="height: 80px;background-image: linear-gradient(180deg, #01A2FE 0%, #0067FF 100%);
				border-top-left-radius: 25px;border-top-right-radius: 25px;padding-top: 20px;">
					<div style="font-weight: 600;font-size: 24px;color: #fff;text-align: center;">预约演示功道云绩效</div>
					<div style="font-weight: 600;font-size: 24px;color: #fff;text-align: center;">绩效专家一对一服务</div>
				</div>
				<div style="position: absolute;right: 16px;top: 16px;cursor: pointer;" @click="dialogVisible = false"><i class="el-icon-close" style="font-size:20px;color: #fff;"></i></div>
				<div>
					<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="60px" style="width: 260px;margin: 20px auto;position: relative;right: 20px;">
					  <el-form-item label="公司">
						  <el-input v-model="userInfo.site.name" disabled></el-input>
					  </el-form-item>
					  <el-form-item label="姓名" prop="name">
					    <el-input v-model="ruleForm.name"></el-input>
					  </el-form-item>
					  <el-form-item label="手机" prop="mobile">
					    <el-input v-model="ruleForm.mobile" @input="ruleForm.mobile=ruleForm.mobile.replace(/[^\d]/g,'')" ></el-input>
					  </el-form-item>
					</el-form>
				</div>
				<div class="fa">预约赠送绩效考核方案</div>
				<div  style="text-align: center;padding: 20px 0;">
					<el-button style="border-radius: 25px;font-size: 16px;padding:7px 20px;" size="mini" type="primary" @click="submitForm('ruleForm')">立即申请</el-button>
				</div>
			</el-dialog>
		</div>
	</div>
</template>

<script>
import ECharts from 'echarts';
import TrackManagement from '@/components/public/TrackManagement';
import JxSearch from '@/components/public/JxSearch';
import { contactAdminToUseApp } from 'dingtalk-design-libs';
export default {
	name: 'home',
	components: { JxSearch, TrackManagement },
	data() {
		return {
			userInfo: this.$getUserData(),
			ruleForm: {
			  name: '',
			  mobile: '',
			},
			rules: {
			  name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
			  mobile: [{ required: true, trigger: 'blur', message: '请输入手机号' }],
			},  
			loginBg: require('@/assets/image/bj.jpg'),
			dialogVisible: false,
			isSubject: false, //判断是否是个人版进入
			mainCorpId: '', //如果是个人版，这个企业ID是登录者所在的企业ID，不是钉钉那边提供的隐藏企业ID
			day: this.$moment().format('YYYY-MM-DD'),
			editableTabs: [
				{ title: '全部待办', name: '0', num: 0 },
				{ title: '目标制定', name: '1', num: 0 },
				{ title: '目标确认', name: '2', num: 0 },
				{ title: '结果录入', name: '4', num: 0 },
				{ title: '评分', name: '5', num: 0 },
				{ title: '审批', name: '9', num: 0 }
			],
			entranceList: [],
			agencyList: [], //待办列表
			agencyNum: 0,
			messageList: [], //消息列表
			messageNum: 0,
			activeName: '0',
			loading: false,

			// 管理相关
			options: [], //
			headValue: [],
			glIndex: '1',
			glIist: [{ name: '1', title: '我参与管理' }, { name: '2', title: '我参与评分' }],
			glLoading: false,
			glDataList: [],
			package_id: '', //考核包ID
			name: '', //搜索Name
			pendingList: [], //提供给考核详情上下切换人员列表
			issueList: [
				{
					title: '新绩效可以解决什么问题？',
					content:
						'1、告别低效绩效考核，让绩效管理流程化；2、进度轻松管控，每个节点进度清晰可见；3、考核目标批量派发，评分流程自定义；4、员工按目标执行计划，上级跟踪管理做好过程管控记录；5、绩效统计图表分析，告别繁杂数据工作'
				},
				{
					title: '如何快速上手并使用新绩效？',
					content:
						'1、建立考核表（把考核目标相同的人员分组，定考核模板，设计考核流程）；2、根据考核周期，发起考核；3、针对每个员工进行考核管理、跟踪及评分；4、查看报表并进行结果分析'
				},
				{
					title: '新绩效和原有的绩效有何关联和区别吗？',
					content:
						'原有绩效以任务为主，重点关注任务是否完成，仅支持月度考核；新绩效支持任意周期的考核，以目标结果为导向，以员工执行计划和跟踪管理记录来关注过程，拥有完善的目标制定、在线评分和审批流程，绩效目标清单一目了然。'
				}
			],
			isTrack: false,
			apList: [], //管理记录源数据
			employee_id: 0, //被考核人ID
			employeeID: 0,
			staffLoad: false,
			recordMemberIds: [],
			has_finish: 0 //是否归档
		};
	},
	activated() {
		this.getAgencyNum();
		this.getAgency();
		this.getMessage();
		this.glIndex == '1' ? this.getManagement() : this.getScorerRecord();
	},
	created() {
		this.setMenu();
		this.getAgencyNum();
	},
	mounted() {
		this.getAgency();
		this.getMessage();
		this.assessTree();
		// 个人版处理
		if (this.$getUserData().is_personal == 1) {
			this.isSubject = true;
			this.mainCorpId = this.$getUserData().main_corp_id;
		}
	},
	watch: {
		activeName() {
			this.getAgencyNum();
			this.getAgency();
		},
		dialogVisible(val) {
			if(!val){
				this.ruleForm={
				  name: '',
				  mobile: '',
				};
			}
		},
		glIndex(val) {
			this.glDataList = [];
			if (this.headValue.length != 0) {
				val == '1' ? this.getManagement() : this.getScorerRecord();
			}
		},
		headValue(val) {
			this.package_id = val[val.length - 1];
			this.glIndex == '1' ? this.getManagement() : this.getScorerRecord();
		}
	},
	methods: {
		submitForm(formName) {
			this.$refs[formName].validate((valid) => {
			  if (valid) {
				  
				  
				  if (!/^1[0123456789]\d{9}$/.test( this.ruleForm.mobile)) {
				    this.$message.error('手机格式有误');
					return false;
				  }
				  
				  
				this.$axios('post', '/api/employee/appointment', this.ruleForm).then(res => {
					this.$message.success('提交成功，我们的绩效老师将在24小时内与您联系');
				}).finally(() => {
					this.dialogVisible = false;
				});
			  } else {
				console.log('error submit!!');
				return false;
			  }
			});
		},
		openGly() {
			contactAdminToUseApp({ id: '109758', corpId: this.mainCorpId }).catch(err => {
				// 入参不正确，或者遇到技术异常时才会进入这个链路
				console.error(err);
			});
		},
		GetRequest(urlStr) {
			if (typeof urlStr == 'undefined') {
				var url = decodeURI(location.search); //获取url中"?"符后的字符串
			} else {
				var url = '?' + urlStr.split('?')[1];
			}
			var theRequest = new Object();
			var strs;
			if (url.indexOf('?') != -1) {
				var str = url.substr(1);
				strs = str.split('&');
				for (var i = 0; i < strs.length; i++) {
					theRequest[strs[i].split('=')[0]] = decodeURI(strs[i].split('=')[1]);
				}
			}
			return theRequest;
		},
		returnStr(time) {
			let date = `${time}000`;
			let res = this.$moment(Number(date)).format('YYYY/MM/DD HH:mm');
			return this.fnTime(res);
		},
		fnTime(time) {
			let staer = time.slice(0, 11);
			let ptime = new Date(time).getTime();
			const twentyFourHours = 24 * 60 * 60 * 1000;
			const fortyEightHours = 24 * 60 * 60 * 1000 * 2;
			
			const today=moment().format('YYYY/MM/DD');
			const todayTime = new Date(today).getTime();
			const yesterdayTime = new Date(todayTime - twentyFourHours).getTime();
			const lastYesterdayTime = new Date(todayTime - fortyEightHours).getTime();

			if (ptime >= todayTime) {
				return '今天 ' + time.split(' ')[1] + ' 更新了执行计划';
			} else if (ptime < todayTime && yesterdayTime <= ptime) {
				return '昨天 ' + time.split(' ')[1] + ' 更新了执行计划';
			} else if (ptime < yesterdayTime && lastYesterdayTime <= ptime) {
				return '前天 ' + time.split(' ')[1] + ' 更新了执行计划';
			} else if (this.dateSum(this.day, staer) > 30) {
				return '近30天无计划更新';
			} else {
				return time + ' 更新了执行计划';
			}
		},
		dateSum(sDate1, sDate2) {
			//sDate1和sDate2是2008-12-13格式
			var aDate, oDate1, oDate2, iDays;
			aDate = sDate1.split('-');
			oDate1 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]); //转换为12-13-2008格式
			aDate = sDate2.split('-');
			oDate2 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]);
			iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 / 24); //把相差的毫秒数转换为天数
			return iDays;
		},
		returnPoint(item) {
			let id = item.node_info.id;
			let stats = item.status;
			let arr = [{ name: '上级评分', pointList: [] }, { name: '特定指标评分', pointList: [] }];
			item.score_info.forEach(e => {
				if (stats == 0) {
					if (e.node_id < id) {
						if (e.node_code == 'score_supervisor') {
							//上级评分
							if (e.node_id == id && stats == 1) {
								arr[0].pointList.push(e.point + '(暂存)');
							} else {
								arr[0].pointList.push(e.point);
							}
						} else {
							//指定评分呢
							if (e.node_id == id && stats == 1) {
								arr[1].pointList.push(e.point + '(暂存)');
							} else {
								arr[1].pointList.push(e.point);
							}
						}
					}
				} else {
					if (e.node_id <= id) {
						if (e.node_code == 'score_supervisor') {
							//上级评分
							if (e.node_id == id && stats == 1) {
								arr[0].pointList.push(e.point + '(暂存)');
							} else {
								arr[0].pointList.push(e.point);
							}
						} else {
							//指定评分呢
							if (e.node_id == id && stats == 1) {
								arr[1].pointList.push(e.point + '(暂存)');
							} else {
								arr[1].pointList.push(e.point);
							}
						}
					}
				}
			});
			return arr;
		},
		openTx(item) {
			this.employee_id = item.employee_id;
			this.employeeID = item.record_id;
			this.has_finish = item.record_id;
			this.employeeDet(item.record_id, () => {
				this.isTrack = true;
			});
		},
		employeeDet(id, callBack) {
			this.staffLoad = true;
			this.$axios('get', '/api/per/package/employee/info', { id: id })
				.then(res => {
					let data = res.data.data;
					this.apList = data.dimension;
					this.recordMemberIds = data.record_member_ids;
					callBack && callBack();
				})
				.finally(() => {
					this.staffLoad = false;
				});
		},
		openDetail2(item) {
			this.$router.push({
				path: '/staffAssDet',
				query: {
					assID: this.package_id,
					employeeID: item.record_id,
					employeeIDs: item.employee_id
				}
			});
		},
		//我管理记录
		getManagement() {
			if (this.headValue.length == 0) {
				return false;
			}
			this.glLoading = true;
			this.$axios('get', '/api/per/package/management_record', { package_id: this.package_id || 0, name: this.name, page: 1, page_size: 5 })
				.then(res => {
					let list = res.data.data.list;
					list.forEach(item => {
						if (item.employee_id) {
							//当是导入导出时，显示登录者
							item.userInfo = this.$getEmployeeList()[item.employee_id];
							if (this.$getEmployeeList()[item.employee_id]) {
								item.dept_list = this.$getEmployeeList()[item.employee_id].dept_list;
							}
						}
					});
					this.glDataList = list;
				})
				.finally(() => {
					this.glLoading = false;
				});
		},
		//我评分的
		getScorerRecord() {
			if (this.headValue.length == 0) {
				return false;
			}
			this.glLoading = true;
			this.$axios('get', '/api/per/package/score_record', { package_id: this.package_id || 0, name: this.name, page: 1, page_size: 5 })
				.then(res => {
					let list = res.data.data.list;
					list.forEach(item => {
						if (item.employee_id) {
							//当是导入导出时，显示登录者
							item.userInfo = this.$getEmployeeList()[item.employee_id];
							if (this.$getEmployeeList()[item.employee_id]) {
								item.dept_list = this.$getEmployeeList()[item.employee_id].dept_list;
							}
						}
					});
					this.glDataList = list;
				})
				.finally(() => {
					this.glLoading = false;
				});
		},
		//搜索
		searchList(data) {
			this.name = data;
			this.glIndex == '1' ? this.getManagement() : this.getScorerRecord();
		},
		//请求绩效树
		assessTree() {
			this.$axios('get', '/api/per/package/tree').then(res => {
				if (res.data.code == 1) {
					this.options = res.data.data;
					let headValue = [];
					this.options.some(item => {
						if (item.list.length > 0) {
							headValue.push(item.id);
							headValue.push(item.list[0].id);
							return true;
						}
					});
					if (headValue.length > 0) {
						this.headValue = headValue;
					}
				}
			});
		},
		openDetail(index, item) {
			if (index == 1) {
				if (item.type == 1) {
					this.$router.push({
						path: '/staffAssDet',
						query: {
							assID: item.remark.package_id,
							employeeID: item.remark.packageEmployee_id,
							employeeIDs: item.remark.employee_id,
							pendingList: JSON.stringify(this.pendingList),
							activeName: this.activeName
						}
					});
				} else {
					this.$router.push({ name: 'resultSet', query: { id: item.remark.packageEmployee_id, packageName: item.remark.package_name } });
				}
			} else {
				this.disposeMessage(item);
			}
		},
		// 处理未读信息
		disposeMessage(item) {
			if (item.type == 1 || item.type == 2) {
				this.$router.push({
					path: '/staffAssDet',
					query: {
						assID: item.remark.package_id,
						employeeID: item.remark.packageEmployee_id,
						employeeIDs: item.remark.employee_id
					}
				});
			} else if (item.type == 3) {
				//导入
			} else {
				//导出
				window.open(this.$serverdomain + item.remark.file_path);
			}
			this.$axios('post', '/api/per/package/msg/cc', { id: item.id, type: item.type, employee_id_code: this.$returnCode(item.employee_id) }).then(res => {});
		},
		//待办数量
		getAgencyNum() {
			this.$axios('get', '/api/per/package/msg/agency_num', { status: 0 }).then(res => {
				let data = res.data.data;
				this.editableTabs = [
					// { title: '全部待办', name: '0', num: data.all_total },
					{ title: '全部待办', name: '0', num: 0 },
					{ title: '目标制定', name: '1', num: data.target },
					{ title: '目标确认', name: '2', num: data.confirm },
					{ title: '结果录入', name: '4', num: data.result_value },
					{ title: '评分', name: '5', num: data.score },
					{ title: '审批', name: '9', num: data.review }
				];
			});
		},
		//待办
		getAgency() {
			this.loading = true;
			this.$axios('get', '/api/per/package/msg/agency', { node_type: this.activeName, status: 0, page: 1, page_size: 10 })
				.then(res => {
					let list = res.data.data.list;
					let pendingList = [];
					list.forEach(item => {
						if (item.remark.employee_id) {
							//被考核人
							let userInfo = this.$getEmployeeList()[item.remark.employee_id];
							item.userInfo = userInfo;
							pendingList.push({
								name: userInfo.name,
								img_url: userInfo.img_url,
								employeeID: item.remark.packageEmployee_id,
								package_name: item.remark.package_name
							});
						}
						if (item.employee_id) {
							//当是导入导出时，显示登录者
							item.userInfo2 = this.$getEmployeeList()[item.employee_id];
						}
					});
					this.pendingList = pendingList;
					this.agencyList = list.slice(0, 5);
					this.agencyNum = res.data.data.total;
				})
				.finally(() => {
					this.loading = false;
				});
		},
		//消息列表
		getMessage() {
			this.$axios('get', '/api/per/package/msg/cc', { status: 0, page: 1, page_size: 5 }).then(res => {
				let list = res.data.data.list;
				list.forEach(item => {
					if (item.remark.employee_id) {
						//被考核人
						item.userInfo = this.$getEmployeeList()[item.remark.employee_id];
					}
					if (item.employee_id) {
						//当是导入导出时，显示登录者
						item.userInfo2 = this.$getEmployeeList()[item.employee_id];
					}
				});
				this.messageList = list;
				this.messageNum = res.data.data.total;
			});
		},
		openUrl(item) {
			// let leg = this.$getCache('routers').length;
			if (item.name == '考核表') {
				// this.$setCache('activeIndex', leg - 1);
				this.$setCache('setUrlName', null);
			}
			if (item.name == '指标库') {
				// this.$setCache('activeIndex', leg - 1);
				this.$setCache('setUrlName', 'indexSet');
			}
			this.$router.push({ path: item.url });
		},
		setMenu() {
			let entranceList = [];
			if (this.$isAuthoritys([this.$7, this.$8, this.$9, this.$10, this.$11, this.$17, this.$18])) {
				entranceList.push({ name: '考核管理', image: require('@/assets/image/1.png'), url: '/assessManagement' });
			}
			if (this.$isAuthoritys([this.$13, this.$14])) {
				entranceList.push({ name: '考核表', image: require('@/assets/image/2.png'), url: '/set' });
			}
			if (this.$isAuthoritys(this.$7)) {
				entranceList.push({ name: '发起考核', image: require('@/assets/image/3.png'), url: '/sponsorAssess' });
			}
			if (this.$isAuthoritys(this.$12)) {
				entranceList.push({ name: '指标库', image: require('@/assets/image/4.png'), url: '/set' });
			}
			this.entranceList = entranceList;
		}
	}
};
</script>

<style scoped="scoped">
.fa{
  background-color: #f0a020;
  color: #fff;
  width: 200px;
  font-size: 14px;
  margin-left: auto;
  padding: 0.1rem 0.32rem;
  border-bottom-left-radius: 25px;
  border-top-left-radius:25px;
  padding-left: 1.4rem;
  box-sizing: border-box;
}	
.headerImg {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
}
.ts {
	height: 64px;
	padding: 8px 16px;
	font-size: 14px;
	color: #089fff;
	background: #e6f3ff;
	font-weight: 500;
	box-sizing: border-box;
	margin-bottom: 10px;
}
.ts img {
	width: 24px;
	height: 24px;
}
.ts .flex-1 {
	padding: 0 8px;
}
.ts .btn {
	width: 94px;
	height: 28px;
	background-color: #089fff;
	line-height: 28px;
	font-size: 14px;
	color: #fff;
	border-radius: 3px;
	cursor: pointer;
	text-align: center;
}
.dialog ::v-deep .el-dialog {
	border-radius: 25px;
}
.dialog ::v-deep .el-dialog__header,.dialog ::v-deep .el-dialog__body {
	padding: 0;
	border-radius: 25px;
}
.zmBox {
	width: 18px;
	height: 18px;
	background-color: #f26c69;
	color: #fff;
	text-align: center;
	line-height: 18px;
	font-size: 12px;
	border-radius: 50%;
	margin-right: 10px;
}
.more {
	text-align: right;
	color: #909399;
	font-size: 14px;
	padding: 16px 0px 0 0px;
}
.more span {
	cursor: pointer;
}
.more span:hover {
	color: #26a2ff;
}
.more2 {
	text-align: right;
	color: #909399;
	font-size: 14px;
	padding: 16px 0px 0 0px;
	position: absolute;
	top: 14px;
	right: 20px;
	z-index: 999;
}
.more2 span {
	cursor: pointer;
}
.more2 span:hover {
	color: #26a2ff;
}
.dispose-left {
	position: relative;
}
.dispose-left ::v-deep.el-badge__content.is-fixed {
	position: absolute;
	top: 20px;
	right: -2px;
}
.tabs ::v-deep.el-badge__content.is-fixed {
	position: absolute;
	top: 50%;
	right: -2px;
}

.all {
	font-size: 14px;
	border-radius: 4px;
}
.item {
	font-size: 14px;
	cursor: pointer;
	padding: 5px;
}
.item:hover {
	background-color: #f5f7fa;
}
.content {
	padding: 0 10px;
}
.message-content {
	overflow: hidden;
	text-overflow: ellipsis;
	word-break: break-all;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-height: 22px;
}
.message-title {
	height: 40px;
	line-height: 40px;
	font-size: 16px;
	font-weight: normal;
	position: relative;
	padding: 0 5px;
}

.open-detail {
	cursor: pointer;
}
.dispose-left,
.gl-all {
	background-color: #fff;
	padding: 20px;
	border-radius: 5px;
}
.left-main {
	background-color: #fff;
	padding: 20px;
	border-radius: 5px;
}
.title {
	font-size: 14px;
	margin-bottom: 15px;
	border-bottom: 1px solid #ebebeb;
	padding-bottom: 16px;
}
.wt {
	padding: 15px;
	border-radius: 4px;
	border-radius: 5px;
	background-color: #fff;
}
.wt-title {
	font-size: 14px;
}
.wts {
	margin-top: 20px;
	line-height: 25px;
	font-size: 14px;
}
.tabss {
	position: absolute;
	right: 0px;
	top: 146px;
	cursor: pointer;
	z-index: 999;
}
.entrance {
	padding: 15px;
	border-radius: 4px;
	border: 1px solid #ebebeb;
	font-size: 14px;
	width: 200px;
	color: #222;
	margin: 0 12px;
	cursor: pointer;
}
.entrance:hover {
	background-color: #f5f7fa;
}
.entrance img {
	width: 30px;
	height: 30px;
	border-radius: 2px;
	margin-right: 10px;
}
.flex-5 {
	position: relative;
}
::v-deep .el-tabs__nav-wrap::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px !important;
	background-color: #e4e7ed;
	z-index: 1;
}
/* 右边 */
.gg-img {
	width: 100%;
	height: 100px;
	border-radius: 5px;
	margin-top: 20px;
}
.echarts {
	border-radius: 4px;
	padding: 10px;
}
.echarts-header {
	margin: 10px 0;
}
#eChart {
	height: 300px;
	width: 100%;
}
</style>
