FE-lab-xcx/pages_safetyCheck/views/inspectManage/inspectList.vue

<!-- 检查和自查列表 -->
<template>
	<view class="snapshotList">
		<scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
			<view class="title" @click="planClick()">
				<view class="title-l">
					<view class="title-l-t">{{optionData.planTitle}}</view>
					<view class="title-l-b">
						<view v-if="optionData.checkCategory">
							{{optionData.checkCategory==1?'校院巡查':(optionData.checkCategory==2?'学院自查':'')}}
						</view>
						<view v-if="optionData.checkTypeName">{{optionData.checkTypeName}}</view>
						<view v-if="optionData.crossCheck==1">交叉互检</view>
					</view>
				</view>
				<img class="title-r" :src="imagesUrl('commonality/icon_wd_gd@1x.png')">
			</view>
			<view class="tabTitleTow">
				<view :class="tabIndexTow==index?'tab-C':'tab-D'" v-for="(item,index) in tabListTow"
					@click="tabClickTow(index)">{{item}}</view>
			</view>
			<view>
				<view class="dept-max-bix-box">
					<div class="dept-check-box">
						<picker class="dept-picker" @change="deptChange" :value="deptData.index" :range="deptData.list" range-key="deptName">
							<view>
								<view class="dept-check-min-box" :class="deptData.name?'check-dept':'no-check-dept'">
								{{deptData.name?deptData.name:'选择二级单位'}}
								</view>
							</view>
						</picker>
						<view class="triangle"></view>
					</div>
					<view class="level-r" v-if="tabIndexTow == 0">
						<view :class="manageStatus == 0 ?'level-r-B':'level-r-A'" @click="checkFlagChange(0)">未检查</view>
						<view :class="manageStatus == 1 ?'level-r-B':'level-r-A'" @click="checkFlagChange(1)">检查中</view>
						<view :class="manageStatus == 2 ?'level-r-B':'level-r-A'" @click="checkFlagChange(2)">已检查</view>
					</view>
				</view>
				<view class="level">
					<view class="level-li"
						:style="levelId==item.levelId?'border:1rpx solid '+item.levelColor+';background:'+item.levelColorTow+';':'levelColor-B'"
						@click="levelClick(item.levelId)" v-for="(item,index) in levelList">{{item.levelName}}</view>
				</view>
				<!-- 搜索 -->
				<view class="header">
					<view class="search">
						<view class="search-r">
							<img :src="imagesUrl('commonality/icon_aqjc_ss.png')" @click="searchBtn">
							<input type="text" v-model="searchValue" placeholder="实验室名称或房间号" name="search"
								@confirm='searchBtn' confirm-type='search' maxlength="50"
								placeholder-style="color: #333333;font-size:24rpx;">
							<!-- <view v-if="searchValue" class="left-icons" @click="delSearchValue()">
								<uni-icons color="#0183FA" type="clear" size="20"></uni-icons>
							</view> -->
						</view>
						<view class="cancel" @click="cancelBtn()">重置</view>
					</view>
				</view>
				<!-- <view class="srearch">
					<view class="srearch-n" @click="srearchClick()">
						<view class="srearch-l">
							<img :src="imagesUrl('commonality/icon_aqjc_ss.png')">
						</view>
						<input class="srearch-c" type="text" v-model="searchValue" placeholder="实验室名称或房间号"/>
					</view>
				</view> -->

			</view>
			<view class="list">
				<view class="list-li" @click="listClick(item)" v-for="(item,index) in dataList">
					<view class="list-li-t">
						<img class="list-li-t-l" :src="imagesUrl('commonality/icon_aqjc_shiyanshi.png')">
						<view class="list-li-t-c">{{item.subName}}</view>
						<view class="list-li-t-r"
							:style="'border:1rpx solid '+item.classLevelColor+';background:'+item.classLevelColorTow+';'">
							<text
								:style="'border-right:1rpx solid '+item.classLevelColor+';color:'+item.classLevelColor+';'">{{item.classLevelName?item.classLevelName:''}}</text>
							<text
								:style="'color:'+item.classLevelColor+';'">{{item.classTypeNames?item.classTypeNames:''}}</text>
						</view>
					</view>
					<view class="list-li-b">
						<view class="list-li-b-t">
							<img :src="imagesUrl('commonality/icon_sy_zc@1x.png')">
							{{tabIndexTow==0?(item.roomNum?item.roomNum:'-'):(item.subRoom?item.subRoom:'-')}}房间＆{{item.buildName?item.buildName:''}}
						</view>
						<view class="list-li-b-b">
							<view class="list-li-b-b-l">
								<img :src="imagesUrl('commonality/icon_sy_zc@1x.png')">
								{{item.deptName}}
							</view>
							<view :class="item.manageStatus==0?'notFinished':(item.manageStatus==1?'finished-b':(item.manageStatus==2?'finished':''))" v-if="tabIndexTow==0">
								{{item.manageStatus==0?'未检查':(item.manageStatus==1?'检查中':(item.manageStatus==2?'已检查':''))}}
							</view>
						</view>
					</view>

				</view>
				<view class="get-data-null-p" v-if="getDataType">- 没有更多数据 -</view>
			</view>
			<img v-if="tabIndexTow==0" class="saoCode" @click="saoCode()"
				:src="imagesUrl('safetyCheck/icon_aqjc_saoma.png')">
		</scroll-view>
	</view>
</template>

<script>
	import {
		config
	} from '@/api/request/config.js'
	import {
		systemDeptDropList,
	} from '@/pages/api/index.js'
	import {
		laboratorySubRelInfoGetRelList,
		laboratoryLevelConfigGetWebLevelTitleList,
		securityAppCheckManageList,
		securityAppCheckDangerGetCheckDangerSubList,
		securityAppCheckDangerReviewSubList,
		securityAppCheckSetOptionList,
	} from '@/pages_safetyCheck/api/index.js'
	export default {
		name: "snapshotList",
		components: {

		},
		data() {
			return {
				baseUrl: config.base_url,
				pageType: 0,
				userType: 1,
				tabListTow: ['检查任务', '复查验证', '隐患整改'],
				tabIndexTow: 0,
				//学院选择
				deptData: {
					index: null,
					list: [],
					id: null,
					name: null
				},
				deptIndex: null,
				deptList: [],
				//弹层实验室数据
				popupType: false,
				roomList: [],
				//级别
				levelList: [],
				levelId: null,
				optionData: null,
				//实验室/房间号
				searchValue: '',
				subId: '',
				planSetId: null,
				// 查询参数
				queryParams: {
					page: 1,
					pageSize: 20,
				},
				dataList: [],
				total: 0,
				getDataType: false,
				manageStatus: null,
			}
		},
		onLoad(option) {
			let optionData = JSON.parse(decodeURIComponent(option.infoData))
			uni.setNavigationBarTitle({
				title: optionData.checkPlanSetVoList.checkName
			})
			this.$set(this, 'tabListTow',
				optionData.checkCategory == 1 ? ['检查任务', '复查验证', '隐患整改'] :
				(optionData.checkCategory == 2 ? ['自查任务', '复查验证', '隐患整改'] : [])
			)
			this.$set(this, 'optionData', optionData);
			this.$set(this, 'planSetId', optionData.checkPlanSetVoList.planSetId);
		},
		created() {
			this.systemDeptDropList();
			this.laboratoryLevelConfigGetWebLevelTitleList();
		},
		mounted() {
			let self = this;
			setTimeout(() => {
				self.getList();
			}, 100);
		},
		methods: {
			//实验室搜索
			searchBtn() {
				this.$set(this.queryParams, 'page', 1);
				this.$set(this, 'dataList', []);
				this.$set(this, 'total', 0);
				this.$nextTick(() => {
					this.getList();
				})
			},
			//滚动事件
			scrollGet() {
				let self = this;
				if (self.total / self.queryParams.pageSize <= self.queryParams.page) {
					this.$set(this, 'getDataType', true);
				} else {
					this.queryParams.page += 1;
					this.$nextTick(() => {
						this.getList();
					})
				}
			},
			//级别切换
			levelClick(id) {
				if (this.levelId == id) {
					this.$set(this, 'levelId', null);
				} else {
					this.$set(this, 'levelId', id);
				}
				this.$set(this, 'getDataType', false);
				this.$set(this.queryParams, 'page', 1);
				this.getList();
			},
			//符合/不符合
			checkFlagChange(type) {
				if (this.manageStatus == type) {
					this.$set(this, 'manageStatus', null);
				} else {
					this.$set(this, 'manageStatus', type);
				}
				this.$set(this.queryParams, 'page', 1);
				this.getList()
			},
			//查询类型切换
			tabClickTow(index) {
				this.$set(this.queryParams, 'page', 1);
				this.$set(this, 'deptData', {
					index: null,
					list: this.deptData.list,
					id: null,
					name: null
				});
				this.$set(this, 'searchValue', '');
				this.$set(this, 'levelId', null);
				this.$set(this, 'getDataType', false);
				this.$set(this, 'dataList', []);
				this.$set(this, 'total', 0);
				this.$set(this, 'tabIndexTow', index);
				this.$nextTick(() => {
					this.getList();
				})
			},
			//重置按钮
			cancelBtn(){
				this.$set(this.queryParams, 'page', 1);
				this.$set(this, 'deptData', {
					index: null,
					list: this.deptData.list,
					id: null,
					name: null
				});
				this.$set(this, 'searchValue', '');
				this.$set(this, 'levelId', null);
				this.$set(this, 'getDataType', false);
				this.$set(this, 'dataList', []);
				this.$set(this, 'total', 0);
				this.$nextTick(() => {
					this.getList();
				})
			},
			//实验室搜索框跳转
			srearchClick() {
				let infoData = this.optionData;
				infoData.pageType = this.tabIndexTow;
				infoData.laboratoryStatus = this.tabIndexTow;
				infoData.tabIndexTow = this.tabIndexTow;
				uni.navigateTo({
					url: '/pages_safetyCheck/views/snapshotManage/laboratorySearch?form=' + encodeURIComponent(
						JSON.stringify(infoData))
				});
			},
			//计划详情
			planClick() {
				let infoData = {
					planId: this.optionData.planId
				};
				uni.navigateTo({
					url: '/pages_safetyCheck/views/planDetail?infoData=' + encodeURIComponent(JSON.stringify(
						infoData))
				});
			},
			//实验室列表数据选择
			listClick(row) {
				let infoData = row;
				infoData.pageType = this.tabIndexTow;
				infoData.planTitle = this.optionData.planTitle;
				infoData.checkCategory = this.optionData.checkCategory;
				infoData.checkTypeName = this.optionData.checkTypeName;
				infoData.crossCheck = this.optionData.crossCheck;
				infoData.checkPlanSetVoList = this.optionData.checkPlanSetVoList;
				uni.navigateTo({
					url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' + encodeURIComponent(
						JSON.stringify(infoData))
				});
			},
			//搜索房间接口
			async buildBySub() {
				let self = this;
				const {
					data
				} = await laboratorySubRelInfoGetRelList({
					'searchValue': this.form.searchValue,
				});
				if (data.code == 200) {
					if (data.data[0]) {
						this.roomList = data.data;
					} else {
						uni.showToast({
							title: '未找到相关实验室',
							icon: "none",
							mask: true,
							duration: 2000
						});
					}
				}
			},

			//查询检查项
			async securityAppCheckSetOptionList(item) {
				let self = this;
				let upData = item;
				let obj = {
					page: 1,
					pageSize: 20,
					checkStatus: '0',
					manageId: upData.manageId,
				}
				const {
					data
				} = await securityAppCheckSetOptionList(obj);
				if (data.code == 200) {
					if (data.data.records[0]) {
						let infoData = self.optionData;
						infoData.pageType = self.tabIndexTow;;
						infoData.itemsStatus = 0;
						infoData.subName = upData.subName;
						infoData.roomNum = upData.roomNum;
						infoData.subId = data.data.records[0].subId;
						infoData.manageId = data.data.records[0].manageId;
						infoData.setOptionId = data.data.records[0].setOptionId;
						infoData.hazardCheckPro = data.data.records[0].hazardCheckPro;
						uni.navigateTo({
							url: '/pages_safetyCheck/views/inspectManage/conductInspections?infoData=' +
								encodeURIComponent(
									JSON
									.stringify(infoData))
						});
					} else {
						self.dialogStatus = 0;
						self.dialogVisible = false;
						uni.showToast({
							title: '该实验室暂无检查项!',
							icon: "none",
							mask: true,
							duration: 2000
						});
						return
					}
				}
			},
			/******调用摄像头******/
			saoCode() {
				let self = this;
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						let list = res.result.split("?")[1].split("&");
						let codeData = {};
						list.forEach((item) => {
							codeData[item.split("=")[0]] = item.split("=")[1];
						})
						if (codeData.code) {
							self.saoList(codeData.subId);
						} else {
							uni.showToast({
								title: '请扫描正确的二维码',
								icon: "none",
								mask: true,
								duration: 2000
							});
						}
					}
				});
			},
			//扫一扫查询数据
			async saoList(subId) {
				let obj = {
					planSetId: this.planSetId,
					subId: subId,
				}
				if (this.tabIndexTow == 0) {
					//检查计划
					const {
						data
					} = await securityAppCheckManageList(obj);
					if (data.code == 200) {
						if (data.data.records[0]) {
							this.securityAppCheckSetOptionListTow(data.data.records[0], 0)
							//跳转检查项列表页面
							/* let infoData = data.data.records[0];
							infoData.pageType = this.tabIndexTow;
							infoData.checkPlanSetVoList = this.optionData.checkPlanSetVoList;
							uni.navigateTo({
								url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' +
									encodeURIComponent(
										JSON.stringify(infoData))
							}); */
						} else {
							//未找到数据提示
							uni.showToast({
								title: '未找到该实验室与本计划批次关联的数据',
								icon: "none",
								mask: true,
								duration: 2000
							});
						}
					}
				} else if (this.tabIndexTow == 1) {
					//复查计划
					obj.planId = this.optionData.planId;
					const {
						data
					} = await securityAppCheckDangerReviewSubList(obj);
					if (data.code == 200) {
						if (data.data[0] && data.data[0].stayExamineCheckNum != 0) {
							//跳转检查项列表页面
							let infoData = data.data[0];
							infoData.pageType = this.tabIndexTow;
							infoData.checkPlanSetVoList = this.optionData.checkPlanSetVoList;
							uni.navigateTo({
								url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' +
									encodeURIComponent(
										JSON.stringify(infoData))
							});
						} else {
							//未找到数据提示
							uni.showToast({
								title: '未找到该实验室与本计划批次关联的数据',
								icon: "none",
								mask: true,
								duration: 2000
							});
						}
					}
				} else if (this.tabIndexTow == 2) {
					//整改计划
					obj.planId = this.optionData.planId;
					obj.userId = uni.getStorageSync('userId');
					const {
						data
					} = await securityAppCheckDangerGetCheckDangerSubList(obj);
					if (data.code == 200) {
						if (data.data[0]) {
							//跳转检查项列表页面
							let infoData = data.data[0];
							infoData.pageType = this.tabIndexTow;
							infoData.checkPlanSetVoList = this.optionData.checkPlanSetVoList;
							uni.navigateTo({
								url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' +
									encodeURIComponent(
										JSON.stringify(infoData))
							});
						} else {
							//未找到数据提示
							uni.showToast({
								title: '未找到该实验室与本计划批次关联的数据',
								icon: "none",
								mask: true,
								duration: 2000
							});
						}
					}
				}
			},
			async securityAppCheckSetOptionListTow(item, checkStatus) {
				let self = this;
				let upData = item;
				let obj = {
					page: 1,
					pageSize: 20,
					checkStatus: checkStatus,
					manageId: upData.manageId,
				}
				this.inspectRemporaryList = [];
				const {
					data
				} = await securityAppCheckSetOptionList(obj);
				if (data.code == 200 && checkStatus == 0) { //先查询待检查数据
					if (data.data.records[0]) {
						let infoData = self.optionData;
						infoData.pageType = 0;
						infoData.subName = upData.subName;
						infoData.roomNum = upData.roomNum;
						infoData.subId = data.data.records[0].subId;
						infoData.manageId = data.data.records[0].manageId;
						infoData.setOptionId = data.data.records[0].setOptionId;
						infoData.hazardCheckPro = data.data.records[0].hazardCheckPro;
						infoData.checkCategory = data.data.records[0].checkCategory;
						uni.navigateTo({
							url: '/pages_safetyCheck/views/inspectManage/conductInspections?infoData=' +
								encodeURIComponent(
									JSON
									.stringify(infoData))
						});
					} else {
						uni.showToast({
							title: '该实验室暂无检查工作!',
							icon: "none",
							mask: true,
							duration: 2000
						});
					}
				}
			},
			//学院选择
			deptChange(e) {
				let self = this;
				self.deptData.list.forEach(function(item, index) {
					if (index == e.detail.value) {
						if (!item.deptId) {
							self.$set(self.deptData, 'id', null)
							self.$set(self.deptData, 'name', null)
						} else {
							self.$set(self.deptData, 'id', item.deptId)
							self.$set(self.deptData, 'name', item.deptName)
						}
					}
				})
				this.$set(this, 'getDataType', false);
				this.$set(this.queryParams, 'page', 1);
				this.getList();
			},
			//获取院系
			async systemDeptDropList() {
				const {
					data
				} = await systemDeptDropList({
					deptName: '',
					level: 2,
					deptType: 1
				});
				if (data.code == 200) {
					data.data.unshift({
						deptid: null,
						deptName: '全部'
					})
					this.$set(this.deptData, 'list', data.data);
				}
			},
			//获取分级
			async laboratoryLevelConfigGetWebLevelTitleList() {
				let self = this;
				const {
					data
				} = await laboratoryLevelConfigGetWebLevelTitleList({});
				if (data.code == 200) {
					data.data.forEach(function(item) {
						item.levelName = item.levelName.split('/')[0]
						if (item.levelColor) {
							item.levelColorTow = self.hexToRgb(item.levelColor, 0.2)
						}
					})
					this.$set(this, 'levelList', data.data);
				}
			},
			//回车触发
			carriageReturnRequest() {
				this.$set(this, 'getDataType', false);
				this.$set(this.queryParams, 'page', 1);
				this.getList();
			},
			//清除输入框内容
			delSearchValue() {
				if (this.searchValue) {
					this.$set(this, 'searchValue', '');
					this.$set(this, 'dataList', []);
					this.$nextTick(() => {
						this.getList();
					})
				}
			},
			//检查任务
			async getList() {
				let self = this;

				let obj = JSON.parse(JSON.stringify(this.queryParams));
				obj.planSetId = this.planSetId;
				obj.deptId = this.deptData.id ? this.deptData.id : '';
				obj.searchValue = this.searchValue ? this.searchValue : '';
				obj.levelId = this.levelId ? this.levelId : '';
				if (this.manageStatus == 0 || this.manageStatus == 2) {
					obj.manageStatus = this.manageStatus;
				} else {
					obj.manageStatus = '';
				}
				if (this.tabIndexTow == 0) {
					//检查计划
					const {
						data
					} = await securityAppCheckManageList(obj);
					if (data.code == 200) {

						data.data.records.forEach(function(item) {
							if (item.classLevelColor) {
								item.classLevelColorTow = self.hexToRgb(item.classLevelColor, 0.2)
							}

						})
						if (self.queryParams.page == 1) {
							this.dataList = data.data.records;
							this.total = data.data.total;
							if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
								this.$set(this, 'getDataType', true);
							}
						} else {
							this.dataList = [...this.dataList, ...data.data.records]
							this.total = data.data.total;
							if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
								this.$set(this, 'getDataType', true);
							}
						}

					}
				} else if (this.tabIndexTow == 1) {
					//复查计划
					obj.planId = this.optionData.planId;
					const {
						data
					} = await securityAppCheckDangerReviewSubList(obj);
					if (data.code == 200) {
						this.dataList = data.data;
						this.$set(this, 'getDataType', true);
						// 后台接口暂时不支持分页
						// if (self.queryParams.page == 1) {
						// 	this.dataList = data.data.records;
						// 	this.total = data.data.total;
						// 	if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
						// 		this.$set(this, 'getDataType', true);
						// 	}
						// } else {
						// 	this.dataList = [...this.dataList, ...data.data.records]
						// 	this.total = data.data.total;
						// 	if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
						// 		this.$set(this, 'getDataType', true);
						// 	}
						// }
					}

				} else if (this.tabIndexTow == 2) {
					//整改计划
					obj.planId = this.optionData.planId;
					obj.userId = uni.getStorageSync('userId');
					const {
						data
					} = await securityAppCheckDangerGetCheckDangerSubList(obj);
					if (data.code == 200) {
						this.dataList = data.data;
						this.$set(this, 'getDataType', true);
						// 后台接口暂时不支持分页
						// if (self.queryParams.page == 1) {
						// 	this.dataList = data.data.records;
						// 	this.total = data.data.total;
						// 	if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
						// 		this.$set(this, 'getDataType', true);
						// 	}
						// } else {
						// 	this.dataList = [...this.dataList, ...data.data.records]
						// 	this.total = data.data.total;
						// 	if (data.data.total / self.queryParams.pageSize <= self.queryParams.page) {
						// 		this.$set(this, 'getDataType', true);
						// 	}
						// }
					}

				}
			},
			//十六进制颜色值和RGB格式转换
			hexToRgb(hex, opacity = 1) {
				// 去除#号
				var color = hex.replace("#", "");
				// 分割成红、绿、蓝三部分的16进制字符串
				var red = parseInt(color.substring(0, 2), 16);
				var green = parseInt(color.substring(2, 4), 16);
				var blue = parseInt(color.substring(4, 6), 16);
				return `RGB(${red}, ${green}, ${blue},${opacity})`;
			},
		}
	}
</script>

<style lang="stylus" scoped>
	.snapshotList {
		height: 100%;
		display flex;
		overflow: hidden;

		.info-max-box {
			padding-top: 20rpx;
		}

		.title {
			width: 690rpx;
			margin: 0 30rpx 20rpx;
			height: 150rpx;
			background: #FFFFFF;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0 30rpx;
			box-sizing: border-box;

			.title-l {
				width: 594rpx;

				.title-l-t {
					font-size: 30rpx;
					color: #333333;
					line-height: 42rpx;
					text-align: left;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}

				.title-l-b {
					display: flex;
					justify-content: flex-start;
					margin-top: 16rpx;

					>view {
						width: 130rpx;
						height: 50rpx;
						background: rgba(1, 131, 250, 0.2);
						border-radius: 6rpx 6rpx 6rpx 6rpx;
						font-size: 24rpx;
						color: #0183FA;
						line-height: 50rpx;
						text-align: center;
						margin-right: 14rpx;
					}
				}
			}

			.title-r {
				width: 24rpx;
				height: 24rpx;
			}
		}

		.tabTitleTow {
			width: 690rpx;
			height: 80rpx;
			display: flex;
			justify-content: center;
			margin: 20rpx 0 0 30rpx;

			>view:nth-of-type(1) {
				width: 230rpx;
				height: 80rpx;
				border-radius: 50rpx 0rpx 0rpx 50rpx;
			}

			>view:nth-of-type(2) {
				width: 230rpx;
				height: 80rpx;
				border-radius: 0rpx 0rpx 0rpx 0rpx;
			}

			>view:nth-of-type(3) {
				width: 230rpx;
				height: 80rpx;
				border-radius: 0rpx 50rpx 50rpx 0rpx;
			}

			.tab-C {
				font-size: 30rpx;
				color: #FFFFFF;
				line-height: 80rpx;
				text-align: center;
				background: #0183FA;
			}

			.tab-D {
				font-size: 30rpx;
				color: #333333;
				line-height: 80rpx;
				text-align: center;
				background: #FFFFFF;
			}
		}

		.header {
			width: 100%;
			z-index: 100;
			background: #fff;

			.search {
				width: 750rpx;
				height: 100rpx;
				background: #FFFFFF;
				border-radius: 0rpx 0rpx 0rpx 0rpx;
				display: flex;
				align-items: center;

				.search-r {
					margin-left:30rpx;
					width: 560rpx;
					height: 60rpx;
					background: #FFFFFF;
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					border: 1rpx solid #E0E0E0;
					font-size: 24rpx;
					color: #999999;
					line-height: 60rpx;
					text-align: left;
					display: flex;
					justify-content: flex-start;
					align-items: center;
					padding: 0 20rpx;
					box-sizing: border-box;

					>img {
						width: 30rpx;
						height: 30rpx;
						margin-right: 20rpx;
					}

					>input {
						width: 500rpx;
					}
				}
			}

			.cancel {
				width:110rpx;
				height:60rpx;
				line-height:60rpx;
				font-size: 28rpx;
				color: #0183FA;
				text-align: center;
				margin-left: 18rpx;
			}
		}
		// .srearch {
		// 	width: 750rpx;
		// 	height: 100rpx;
		// 	background: #FFFFFF;
		// 	border-radius: 0rpx 0rpx 0rpx 0rpx;
		// 	overflow: hidden;
		// 	display: flex;
		// 	display: flex;
		// 	justify-content: space-between;
		// 	align-items: center;
		// 	padding: 0 30rpx;
		// 	box-sizing: border-box;

		// 	.college {
		// 		width: 200rpx;
		// 		height: 60rpx;
		// 		border-radius: 50rpx 50rpx 50rpx 50rpx;
		// 		border: 2rpx solid #E0E0E0;
		// 		font-size: 24rpx;
		// 		color: #333333;
		// 		line-height: 60rpx;
		// 		text-align: left;
		// 		display: flex;
		// 		justify-content: space-between;
		// 		align-items: center;
		// 		padding: 0 26rpx;
		// 		box-sizing: border-box;
		// 		overflow: hidden;
		// 		text-overflow: ellipsis;
		// 		white-space: nowrap;

		// 		>view {
		// 			width: 124rpx;
		// 			display: block;
		// 			overflow: hidden;
		// 			text-overflow: ellipsis;
		// 			white-space: nowrap;
		// 		}

		// 		>img {
		// 			display: block;
		// 			width: 24rpx;
		// 			height: 12rpx;
		// 		}
		// 	}

		// 	.srearch-n {
		// 		width: 690rpx;
		// 		height: 60rpx;
		// 		border-radius: 50rpx 50rpx 50rpx 50rpx;
		// 		border: 2rpx solid #E0E0E0;
		// 		display: flex;
		// 		justify-content: flex-start;
		// 		align-items: center;

		// 		.srearch-l {
		// 			width: 60rpx;
		// 			height: 60rpx;

		// 			>img {
		// 				width: 20rpx;
		// 				height: 20rpx;
		// 				margin: 20rpx 0 0 26rpx;
		// 			}
		// 		}

		// 		.srearch-c {
		// 			flex: 1;
		// 			height: 58rpx;
		// 			font-size: 24rpx;
		// 			color: #999999;
		// 			line-height: 30rpx;
		// 			text-align: left;
		// 		}

		// 		.srearch-r {
		// 			width: 90rpx;
		// 			height: 60rpx;

		// 			>img {
		// 				width: 30rpx;
		// 				height: 30rpx;
		// 				margin: 14rpx 22rpx 0 30rpx;
		// 			}


		// 		}
		// 	}
		// }
		.dept-max-bix-box{
			margin-top: 20rpx;
			width: 750rpx;
			height: 90rpx;
			background: #FFFFFF;
			display: flex;
			.dept-check-box{
				flex:1;
				line-height:60rpx;
				height:60rpx;
				margin:20rpx 20rpx 0 30rpx;
				border:1rpx solid #E0E0E0;
				border-radius: 50rpx;
				display: flex;
				.dept-picker{
					flex:1;
					.dept-check-min-box{
						font-size:24rpx;
						padding:0 30rpx;
						overflow: hidden;
					}
					.check-dept{
						color:#333;
					}
					.no-check-dept{
						color:#999;
					}	
				}
				.triangle {
					margin:25rpx 20rpx 0 20rpx;
				  width: 0;
				  height: 0;
				  border-left: 10rpx solid transparent;
				  border-right: 10rpx solid transparent;
				  border-top: 15rpx solid #999; /* 可以根据需要调整颜色 */
				}
			}
			.level-r {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				margin: 18rpx 20rpx 0 0;
			
				.level-r-A {
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					border: 1rpx solid #E0E0E0;
					width: 100rpx;
					height: 60rpx;
					background: #E0E0E0;
					font-weight: normal;
					font-size: 24rpx;
					color: #333333;
					line-height: 60rpx;
					text-align: center;
					margin-right: 10rpx;
				}
			
				.level-r-B {
					border-radius: 50rpx 50rpx 50rpx 50rpx;
					border: 1rpx solid #0183FA;
					width: 100rpx;
					height: 60rpx;
					background: #0183FA;
					font-weight: normal;
					font-size: 24rpx;
					color: #FFFFFF;
					line-height: 60rpx;
					text-align: center;
					margin-right: 10rpx;
				}
			}
			
			#levelColor-A {
				background: rgba(255, 0, 0, 0.2);
				color: #FF0000;
				border: 1rpx solid #FF0000;
			}
			
			#levelColor-B {
				background: #F5F5F5;
				color: #333333;
				border: 2rpx solid #E0E0E0;
			}
		}
		.level {
			width: 750rpx;
			height: 70rpx;
			background: #FFFFFF;
			display: flex;
			justify-content: flex-start;
			padding: 15rpx 30rpx 0;
			box-sizing: border-box;

			.level-li {
				width: 100rpx;
				height: 50rpx;
				background: #F5F5F5;
				border-radius: 50rpx 50rpx 50rpx 50rpx;
				border: 2rpx solid #E0E0E0;
				margin-right: 10rpx;
				font-size: 24rpx;
				color: #333333;
				line-height: 50rpx;
				text-align: center;
			}

		}

		.list {
			width: 750rpx;
			padding: 0 30rpx;
			box-sizing: border-box;

			.list-li {
				width: 690rpx;
				min-height: 240rpx;
				background: #FFFFFF;
				border-radius: 10rpx 10rpx 10rpx 10rpx;
				padding: 0 30rpx;
				box-sizing: border-box;
				margin-top: 20rpx;

				.list-li-t {
					display: flex;
					justify-content: flex-start;
					align-items: center;
					height: 90rpx;
					border-bottom: 2rpx dashed #D8D8D8;

					.list-li-t-l {
						width: 40rpx;
						height: 40rpx;
						margin-right: 16rpx;
					}

					.list-li-t-c {
						width: 264rpx;
						font-size: 30rpx;
						color: #333333;
						line-height: 30rpx;
						text-align: left;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						margin-right: 24rpx;
					}

					.list-li-t-r {
						display: flex;
						justify-content: flex-start;
						border-radius: 10rpx 10rpx 10rpx 10rpx;
						width: 200rpx;
						height: 40rpx;
						margin-left: 10rpx;

						>text {
							display: inline-block;
							flex: 1;
							text-align: center;
							font-size: 24rpx;
							line-height: 40rpx;
							text-align: center;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
						}
					}
				}

				.list-li-b {
					overflow: hidden;

					.list-li-b-t {
						display: flex;
						justify-content: flex-start;
						align-items: center;

						>img {
							width: 28rpx;
							height: 26rpx;
							margin-right: 16rpx;
						}

						font-size: 28rpx;
						color: #666666;
						line-height: 30rpx;
						text-align: left;
						margin-top: 32rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;

					}

					.list-li-b-b {
						display: flex;
						justify-content: space-between;
						align-items: center;
						margin-top: 20rpx;

						.list-li-b-b-l {
							display: flex;
							justify-content: flex-start;
							align-items: center;

							>img {
								width: 28rpx;
								height: 26rpx;
								margin-right: 16rpx;
							}

							font-size: 28rpx;
							color: #666666;
							line-height: 30rpx;
							text-align: left;
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
						}

						.finished {
							width: 110rpx;
							height: 40rpx;
							background: rgba(1, 131, 250, 0.2);
							border-radius: 20rpx 20rpx 20rpx 20rpx;
							font-size: 24rpx;
							color: #0183FA;
							line-height: 40rpx;
							text-align: center;
						}
						.finished-b {
							width: 110rpx;
							height: 40rpx;
							background: rgba(255, 182, 0, 0.2);
							border-radius: 20rpx 20rpx 20rpx 20rpx;
							font-size: 24rpx;
							color: #ffb600;
							line-height: 40rpx;
							text-align: center;
						}

						.notFinished {
							width: 110rpx;
							height: 40rpx;
							background: #E0E0E0;
							border-radius: 20rpx 20rpx 20rpx 20rpx;
							font-size: 24rpx;
							color: #666666;
							line-height: 40rpx;
							text-align: center;
						}
					}
				}
			}
		}

		.get-data-null-p {
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
		}

		#color-A {
			color: #0183FA;
		}

		#color-B {
			color: #FF8C00;
		}

		#color-C {
			color: #16B531;
		}

		.saoCode {
			position: fixed;
			left: 288rpx;
			bottom: 20rpx;
			width: 160rpx;
			height: 160rpx;
		}
	}
</style>