tcm-cloud-uin-app/pages/ypczk/zkTask/zkTask.vue

<template>
	<view class="qualitycontrolTask">
		<!-- 飞行质控任务 -->
		<view class="flightTask">
			<uni-card>
				<uni-section :title="pageData.taskList.name" type="line">
					<!-- <template v-slot:right>
						<image style="width: 50rpx; height: 50rpx;" :src="showIcon.nowIcon" @click="changeState()">
						</image>
					</template> -->
				</uni-section>
				<view class="flightTask_list">
					<view class="flightTask_title">
						<view class="flightTask_text">被质控代煎企业</view>
						<view class="flightTask_righttext">{{pageData.taskList.bzkOrgName}}</view>
					</view>
					<view class="flightTask_title">
						<view class="flightTask_text">组长</view>
						<view class="flightTask_righttext">{{pageData.taskList.zzName}}</view>
					</view>
					<view class="flightTask_title">
						<view class="flightTask_text">组员</view>
						<view class="flightTask_righttext">{{pageData.taskList.zyNames}}</view>
					</view>
					<view class="flightTask_title">
						<view class="flightTask_text">地址</view>
						<view class="flightTask_righttext">{{pageData.taskList.address}}</view>
					</view>
					<view class="flightTask_title">
						<view class="flightTask_text">总数量:</view>
						<view class="flightTask_righttext">
							{{pageData.taskList.totalWcCount+'/'+pageData.taskList.totalCyCount}}</view>
					</view>
					<view class="flightTask_title">
						<view class="flightTask_text">代煎完成数量:</view>
						<view class="flightTask_righttext">
							{{pageData.taskList.djWcCount+'/'+pageData.taskList.djCyCount}}</view>
					</view>
					<view class="flightTask_title">
						<view class="flightTask_text">代配完成数量:</view>
						<view class="flightTask_righttext">
							{{pageData.taskList.dpWcCount+'/'+pageData.taskList.dpCyCount}}</view>
					</view>
				</view>
			</uni-card>
		</view>
		<!-- 代配作业质控 -->
		<view class="dp_or_dj_Task">
			<uni-card>
				<uni-section title="代配作业质控" type="line">
					<template v-slot:right>
						<view class="sub_title">不合格数<view class="sub_title_text">{{pageData.detailList.dpbhg}}</view>
						</view>
					</template>
				</uni-section>
				<view>
					<button class="button" @click="addTask('dp')"> + 新增</button>
				</view>
				<uni-table class="dp_table">
					<!-- 表头行 -->
					<uni-tr>
						<uni-th align="center" width="150rpx">处方编号</uni-th>
						<uni-th align="center" width="150rpx">贴数(贴)</uni-th>
						<uni-th align="center" width="150rpx">平均误差(%)</uni-th>
						<uni-th align="center" width="150rpx">操作人</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr v-for="(item, index) in pageData.dpList" :key="index">
						<uni-td align="center">{{item.yncfbh}}</uni-td>
						<uni-td align="center">{{item.ts}}</uni-td>
						<uni-td align="center">{{item.wc}}</uni-td>
						<uni-td align="center">{{item.creatorName}}</uni-td>
					</uni-tr>
				</uni-table>
				<view class="see_more" @click="seeMore('dp')">
					<text>查看更多</text>
					<uni-icons type="right"></uni-icons>
				</view>
			</uni-card>
		</view>
		<!-- 代煎作业质控 -->
		<view class="dp_or_dj_Task">
			<uni-card>
				<uni-section title="代煎作业质控" type="line">
					<!-- <template v-slot:right>
						<view class="sub_title">不合格数<view class="sub_title_text">{{pageData.detailList.djbhg}}</view></view>
					</template> -->
				</uni-section>
				<view>
					<button class="button" @click="addTask('dj')"> + 新增</button>
				</view>
				<uni-table class="dp_table">
					<!-- 表头行 -->
					<uni-tr>
						<uni-th align="center" width="150rpx">处方编号</uni-th>
						<uni-th align="center" width="150rpx">贴数(贴)</uni-th>
						<uni-th align="center" width="150rpx">不合格项</uni-th>
						<uni-th align="center" width="150rpx">待检项</uni-th>
						<uni-th align="center" width="150rpx">操作人</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr v-for="(item, index) in pageData.djList" :key="index">
						<uni-td align="center">{{item.yncfbh}}</uni-td>
						<uni-td align="center">{{item.ts}}</uni-td>
						<uni-td align="center" :style="changeColor(item.bhgx,'red')">{{item.bhgx}}</uni-td>
						<uni-td align="center" :style="changeColor(item.djCount,'blue')">{{item.djCount}}</uni-td>
						<uni-td align="center">{{item.creatorName}}</uni-td>
					</uni-tr>
				</uni-table>
				<view class="see_more" @click="seeMore('dj')">
					<text>查看更多</text>
					<uni-icons type="right"></uni-icons>
				</view>
			</uni-card>
		</view>
		<!-- 代煎企业作业环境质控 -->
		<view class="djqyhj_Task">
			<uni-card>
				<uni-section title="代煎企业作业环境质控" type="line">
					<template v-slot:right>
						<view class="sub_title">不合格数<view class="sub_title_text">{{pageData.detailList.hjzkbhg}}</view>
						</view>
					</template>
				</uni-section>
				<view class="image_upload">
					<uni-file-picker readonly :modelValue="pageData.imageList" file-mediatype="image">
					</uni-file-picker>
				</view>
				<view class="see_more" @click="seeMore('djqyhj')">
					<text>新增</text>
					<uni-icons type="right"></uni-icons>
				</view>
			</uni-card>
		</view>
		<!-- 完成质控 -->
		<view class="finish_button" v-if="pageData.finishStatus">
			<button class="button" @click="finishTask()">完成质控</button>
		</view>
		<!-- 完成质控弹出框 -->
		<uni-popup ref="operatorDialog" type="dialog">
			<uni-popup-dialog type="info" confirmText="确定" cancelText="取消" :title="pageData.popupMessage.title" :content="pageData.popupMessage.showMessage" @confirm="operatorDialogConfirm" @close="operatorDialogClose"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script setup>
	import {reactive,ref} from "vue";
	import {onLoad,onShow,onUnload,onPullDownRefresh} from "@dcloudio/uni-app";
	import http from '@/utils/request';
	import {uploadImageModelValue} from '@/pages/controls/image/OssService';
	import { UrlPath } from "@/utils/commonuni"

	const pageData = reactive({
		detailList: {},
		// 质控任务
		taskList: {},
		// 代配
		dpList: {},
		// 代煎
		djList: {},
		// 图片列表
		imageList: [],
		// 质控状态
		taskStatus: '',
		// 质控完成状态
		finishStatus: true,
		// 环境质控完成状态
		hjzkFinishStatus: '',
		// 对话框
		popupMessage:{
			// 标题
			title:'完成质控',
			// 提示内容
			showMessage:'是否确认完成质控任务'
		}
	})

	// 显示与隐藏突变
	const showIcon = reactive({
		nowIcon: '',
		showIcon: '/static/blackDisplay.png',
		hideIcon: '/static/blackHide.png'
	})

	// 查询质控作业--根据Id 和 完成质控 入参
	const zkzyData = reactive({
		id: ''
	})

	// 切换显示状态
	const changeState = () => {
		if (showIcon.nowIcon == showIcon.showIcon) {
			showIcon.nowIcon = showIcon.hideIcon
		} else {
			showIcon.nowIcon = showIcon.showIcon
		}
	}

	// 新增代配/代煎质控
	const addTask = (type) => {
		if (type == 'dp') {
			// 新增代配
			pageData.taskStatus = 'dp'
		} else if (type == 'dj') {
			// 新增代煎
			pageData.taskStatus = 'dj'
		}
		uni.navigateTo({
			url: '/pages/ypczk/zkTask/choosePrescription?taskStatus=' + pageData.taskStatus
		})
	}

	// 查看更多
	const seeMore = (type) => {
		let jumpUrl = ''
		// console.log(JSON.stringify(pageData));
		if (type == 'dp') {
			// 代配跳转
			jumpUrl = '/pages/ypczk/zkTask/zkTaskDetail/detailsList?taskInfo=' + encodeURIComponent(JSON.stringify(pageData.taskList))
		} else if (type == 'dj') {
			// 代煎跳转
			jumpUrl = '/pages/ypczk/zkTask/zkTaskDetail/detailsList?taskInfo=' + encodeURIComponent(JSON.stringify(pageData.taskList))
		} else if (type == 'djqyhj') {
			// 环境质控跳转
			jumpUrl = '/pages/ypczk/zkTask/djhjTask'
		}
		uni.navigateTo({
			url: jumpUrl
		})
	}

	const operatorDialog=ref(null)
	
	const operatorDialogConfirm=()=>{
		uni.showLoading({
			title: '',
			mask: true
		});
		http.get("app-api/zkzy/finish", zkzyData).then(res => {
			uni.hideLoading()
			if (res != null) {
				operatorDialog.value.close()
				uni.navigateBack({
					delta: 1,
					success: () => {
						uni.$emit("finishTask")
					}
				});
			}
		})
	}
	
	const operatorDialogClose=()=>{
		operatorDialog.value.close()
	}

	// 完成质控
	const finishTask = () => {
		operatorDialog.value.open()
		
	}

	// 查询质控作业--根据Id
	const getZkData = () => {
		uni.showLoading({
			title: '',
			mask: true
		});
		http.get("app-api/zkzy/findZkzyById", zkzyData).then(res => {
			uni.hideLoading()
			pageData.detailList = res
			pageData.taskList = res.task
			pageData.djList = res.djCfDetail.slice(0, 3)
			pageData.dpList = res.dpCfDetail.slice(0, 3)
			pageData.hjzkFinishStatus = res.hjzkStatus
			pageData.detailList.dpbhg = dpbhgNumber(res.dpCfDetail)
			// 获取图片
			if (pageData.detailList.hjzkImgUrl != null && pageData.detailList.hjzkImgUrl != '') {
				pageData.imageList = showImage(pageData.detailList.hjzkImgUrl)
			}
			isfinishAllTask(res.task)
		})
	}

	// 代配不合格数
	const dpbhgNumber = (data) => {
		let number = 0
		data.forEach(item => {
			if (item.cfbhg == 1 || item.mxbhg > 0) {
				number++;
			}
		})
		return number
	}

	// 显示图片
	const showImage = (urlStr) => {
		const filesArray = urlStr.split(',');
		const rawPrefix = UrlPath.getBaseUrl()
		const prefix = rawPrefix.replace(/\/+$/, '');
		const result = filesArray.map(url => {
			return prefix + url;
		});
		return result;
	}

	// 判断当前用户是否为组员(组员为true)
	const isZy = () => {
		try {
			const value = uni.getStorageSync("userInfo")
			if (pageData.taskList.zyIds.indexOf(value.id) != -1) {
				return true
			} else {
				return false
			}
		} catch (e) {
			//TODO handle the exception
		}
	}

	// 是否可以完成质控
	const isfinishAllTask = (e) => {
		// 总数量、代煎完成数量、代配完成数量不达标
		// 是否组员
		if (e.djWcCount >= e.djCyCount && e.dpWcCount >= e.dpCyCount && e.totalWcCount >= e.totalCyCount && 
		pageData.hjzkFinishStatus == '2' && pageData.imageList.length != 0 && pageData.imageList!=null && !isZy()) {
			pageData.finishStatus = true
		} else {
			pageData.finishStatus = false
		}
	}

	// 存入taskData(taskId)
	const setTaskId = () => {
		uni.setStorageSync("saveTaskId", {
			taskId: zkzyData.id
		})
	}
	
	const changeColor = (name,color) => {
		// 根据状态值返回不同的样式对象
		return {
			color: name > 0 ? color : 'black'
		};
	}
	
	onLoad((data) => {
		if (data != null) {
			zkzyData.id = data.taskId
		}
		setTaskId()
	})
	
	onShow(() => {
		showIcon.nowIcon = showIcon.hideIcon
		getZkData()
	})
</script>

<style lang="scss" scoped>
	@import './index.scss'
</style>