dd_jx_pc/src/views/job/home.vue

<template>
	<div class="all boxMinHeight">
		<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="fontColorF">暂无相关权限</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="fontColorF" 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="fontColorF" 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 class="wt">
				<div class="flex-box-ce"><div class="wt-title flex-1">常见问题</div></div>
				<div class="wts" v-for="(item, index) in issueList" :key="index">
					<div class="flex-box-ce wt-item">
						<span class="fontColorF flex-box-ce">
							<span class="zmBox">Q</span>
							问题：
						</span>
						<span class="flex-1">{{ item.title }}</span>
					</div>
					<div class="flex-box wt-item">
						<span class="fontColorF flex-box">
							<span class="zmBox" style="background-color: #8E9296;">A</span>
							回答：
						</span>
						<span class="flex-1">{{ item.content }}</span>
					</div>
				</div>
			</div> -->
		</div>
		<!-- 跟踪管理 -->
		<TrackManagement
			:showDrawer.sync="isTrack"
			:isCz="has_finish ? true : false"
			:id="employeeID"
			:apList="apList"
			:recordMemberIds="recordMemberIds"
			:assessId="employee_id"
			@confirm="getManagement"
		></TrackManagement>
	</div>
</template>

<script>
import ECharts from 'echarts';
import TrackManagement from '@/components/public/TrackManagement';
import JxSearch from '@/components/public/JxSearch';
export default {
	name: 'home',
	components: { JxSearch, TrackManagement },
	data() {
		return {
			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 }
			],
			userInfo: this.$getUserData(),
			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();
		// var url = window.location.href;
		// var rUrl = this.GetRequest(url).url || '';
		// this.$nextTick(function() {
		// 	if (rUrl) {
		// 		setTimeout(() => {
		// 			this.$router.push({ path: '/' + decodeURIComponent(rUrl) });
		// 		}, 200);
		// 	}
		// });
	},
	created() {
		this.setMenu();
		this.getAgencyNum();
	},
	mounted() {
		this.getAgency();
		this.getMessage();
		this.assessTree();
		// var url = window.location.href;
		// var rUrl = this.GetRequest(url).url || '';
		// this.$nextTick(function() {
		// 	if (rUrl) {
		// 		setTimeout(() => {
		// 			this.$router.push({ path: '/' + decodeURIComponent(rUrl) });
		// 		}, 200);
		// 	}
		// });
	},
	watch: {
		activeName() {
			this.getAgencyNum();
			this.getAgency();
		},
		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: {
		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 date = new Date();
			const year = date.getFullYear();
			const month = date.getMonth() + 1;
			const day = date.getDate();
			const today = `${year}-${month}-${day}`;
			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">
.actionText {
}
.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>