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

<template>
	<view class="djhjTaskDetail">
		<!-- 任务进度 -->
		<view class="djhjTaskDetail_progress">
			<text class="djhjTaskDetail_progress_title">任务进度：<text class="djhjTaskDetail_progress_text">{{hjTaskList.length+'/'+hjTaskList.length}}</text></text>
			<text class="djhjTaskDetail_progress_title">不合格数<text class="djhjTaskDetail_progress_text">{{hjbhg}}</text></text>
		</view>
		<view v-if="props.hjTaskList.length!=0">
			<!-- 创建人 -->
			<view class="creator">
				<text class="creator_title">创建人<text class="creator_text">{{props.creatorName}}</text></text>
			</view>
			<!-- 检查结果 -->
			<uni-card padding="0" spacing="0" v-for="(item,index) in props.hjTaskList" class="djhjList">
				<view class="djhjList_title">
					<view class="djhjList_text">检查项目</view>
					<view class="djhjList_righttext">{{item.item}}</view>
				</view>
				<view class="djhjList_title">
					<view class="djhjList_text">检查方式</view>
					<view class="djhjList_righttext">{{item.assessmentCriteria}}</view>
				</view>
				<view class="djhjList_title">
					<view class="djhjList_text">检查内容</view>
					<view class="djhjList_righttext">{{item.assessmentContent}}</view>
				</view>
				<view class="djhjList_title">
					<view class="djhjList_text">检查结果</view>
					<view class="djhjList_righttext" :class="item.assessmentResult=='不合格'? 'djhjList_redtext' : 'djhjList_righttext'">{{item.assessmentResult}}</view>
				</view>
				<view class="djhjList_title" v-if="item.assessmentResult=='不合格'">
					<view class="djhjList_text">原因</view>
					<view class="djhjList_righttext">{{item.resultContent}}</view>
				</view>
			</uni-card>
			<!-- 图片 -->
			<view class="image_upload" v-if="props.imageUrl.length!=0">
				<uni-card>
					<uni-section title="图片" type="line"></uni-section>
					<view class="img_upload">
						<uni-file-picker :readonly="true" limit="4" :modelValue="showImage(props.imageUrl)"></uni-file-picker>
					</view>
				</uni-card>
			</view>
		</view>
		<view v-else>
			<dataEmpty></dataEmpty>
		</view>
		<!-- 开始质控 -->
		<view class="finish_button" v-if="props.taskStatus!='7004'">
			<button class="button" @click="startTask()">开始质控</button>
		</view>
	</view>
</template>

<script setup>
import { reactive } from "vue";
import {onLoad,onShow,onUnload,onPullDownRefresh} from "@dcloudio/uni-app";
import http from '@/utils/request';
import dataEmpty from "@/pages/ypczk/zkTask/zkTaskDetail/noStartTaskDetail.vue";
import {uploadImageModelValue} from '@/pages/controls/image/OssService'

const props = defineProps({
	// 环境质控详情列表
	hjTaskList:  Array,	
	// 图片url
	imageUrl:Array,
	// 环境质控不合格数
	hjbhg:String,
	// 创建人
	creatorName:String,
	// 任务状态
	taskStatus:String
});

// 开始质控
const startTask=()=>{
	uni.$emit("startTaskInfo")
}

// 显示图片
const showImage=(id)=>{
	return uploadImageModelValue(id)
}
</script>

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