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

<template>
	<view class="djTask">
		<!-- 任务进度 -->
		<view class="progress_title">
			<view class="progress">
				<image src="../../../static/progress_icon.png" class="progress_image"></image>
				<text class="progress_text">任务进度</text>
			</view>
			<view class="dj_num">
				<text class="dj_num_title">代煎7贴：<text class="dj_num_text">3/5</text></text>
				<text class="dj_num_title">代煎14贴：<text class="dj_num_text">3/5</text></text>
			</view>
		</view>
		<!-- 处方编号 -->
		<view class="sub_title">
			<view class="cfbh">
				<text class="cfbh_title">处方编号<text class="cfbh_text">{{pageData.cfbh}}</text></text>
			</view>
			<view class="bhgs">
				<text class="bhgs_title">不合格数<text class="bhgs_text">1</text></text>
			</view>
		</view>
		<!-- 检查结果 -->
		<uni-card padding="0" spacing="0" v-for="(item,index) in pageData.djList" class="djList">
			<view class="djList_title">
				<view class="djList_text">检查项目</view>
				<view class="djList_righttext">{{item.bhgx}}</view>
			</view>
			<view class="djList_title">
				<view class="djList_text">检查内容</view>
				<view class="djList_righttext">{{item.content}}</view>
			</view>
			<view class="djList_title">
				<view class="djList_text">检查结果</view>
				<view class="djList_righttext">{{item.result}}</view>
			</view>
			<view class="djList_title" v-if="item.result=='不合格'">
				<view class="djList_text">原因</view>
				<view class="djList_righttext">{{item.reason}}</view>
			</view>
			<view class="button_group">
				<view class="bhg_button" @click="bhgCheck()">不合格</view>
				<view class="hg_button" @click="hgCheck()">合格</view>
			</view>
		</uni-card>
		<!-- 图片上传 -->
		<view class="image_upload">
			<uni-card>
				<uni-section title="图片上传" type="line"></uni-section>
				<view class="img_upload">
					<uni-file-picker :v-model="pageData.imageList" @select="selectImg" @delete="deleteImg"></uni-file-picker>
				</view>
			</uni-card>
		</view>
		<!-- 按钮 -->
		<view class="operator_button" v-if="pageData.operatorStatus=='add'">
			<button class="pass_button" @click="pass">一键通过</button>
			<!-- 如果还有数据按钮显示为“下一个”，数据全部加载完毕显示为“完成” -->
			<view class="finish_button_grop">
				<button class="next_or_finish_button" v-if="pageData.djList!=0" @click="next">下一个</button>
				<button class="next_or_finish_button" @click="finish" v-else>完成</button>
			</view>	
		</view>
		<!-- 不合格弹出框 -->
		<uni-popup ref="bhgDialog" type="dialog">
			<uni-popup-dialog type="info" mode="input" confirmText="提交" cancelText="取消" title="不合格原因" value="" placeholder="请填写不合格原因" @confirm="bhgDialogConfirm"
				@close="bhgDialogClose"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script setup>
import { ref,reactive } from "vue";
import {onLoad,onShow,onUnload,onPullDownRefresh} from "@dcloudio/uni-app";
import http from "../../../utils/request";
	
const pageData=reactive({
	// 处方编号
	cfbh:'',
	// 操作状态，是编辑/查看
	operatorStatus:'',
	djList:[
		{
			item:'检查项目1',
			content:'检查内容1',
			result:'检查结果1'
		},
		{
			item:'检查项目2',
			content:'检查内容2',
			result:'检查结果2'
		},
		{
			item:'检查项目3',
			content:'检查内容3',
			result:'不合格',
			reason:'还是的撒'
		},
	],
	// 图片列表
	imageList:[]
})

const formData=reactive({
	id:''
})

const createData=reactive({
	taskId:'',
	pId:'',
	providerType:''
})

// 定义不合格弹出输入框
const bhgDialog=ref()

// 提交不合格原因
const bhgDialogConfirm=(val)=>{
	// 获取输入的不合格原因
	console.log(val)
}

// 取消不合格弹出输入框
const bhgDialogClose=()=>{
	// 关闭不合格弹出框
	bhgDialog._value.close()
}

// 选中图片，将选中的图片添加列表
const selectImg=(e)=>{
	console.log(e)
	e.tempFiles.forEach(item=>{
		pageData.imageList.push(item)
	})
}

// 删除图片，并将其从列表中删除
const deleteImg=(e)=>{
	console.log(e)
	let index=0
	index = pageData.imageList.indexOf(e.tempFilePaths)
	pageData.imageList.splice(index, 1)
}

// 不合格
const bhgCheck=()=>{
	// 打开不合格弹出输入框
	bhgDialog._value.open()
}

// 合格
const hgCheck=()=>{
	console.log("合格")
}

// 一键通过
const pass=()=>{
	console.log("一键通过")
}

// 下一个
const next=()=>{
	console.log("下一个")
}

// 完成
const finish=()=>{
	console.log("完成")
}

// 临时创建代煎代配企业评估任务内容
const createTask=()=>{
	getTaskId()
	http.get("app-api/zkzy/create",createData).then(res=>{
		console.log(res)
		getDjTask(res)
	})
}

// 获取代煎质控作业
const getDjTask=(data)=>{
	formData.id=data
	http.get("app-api/taskDetail/getTaskDjDetailById",formData).then(res=>{
		console.log(res)
		pageData.djList = res.djCfDetail
	})
}

// 获取taskId
const getTaskId=()=>{
	uni.getStorage({
		key:'taskId',
		success: (res) => {
			console.log(res)
			createData.taskId = res.data.taskId
		}
	})
}

onShow(()=>{
	createTask()
})

onLoad((type)=>{
	console.log(type)
	if(type.status!=null){
		pageData.operatorStatus=type.status
	}
	if(type.cfbh!=null){
		pageData.cfbh=type.cfbh
	}
	if(type.ptwybh!=null){
		createData.pId=type.ptwybh
	}
	if(type.fyfslx!=null){
		createData.providerType=type.fyfslx
	}
})
</script>

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