zhdt-miniapp/pages/quick-task/result.vue

<template>
	<view class="result">
		<cu-custom class="home-custom" bgColor=".bg-sancolor"
		           bgImage="https://ahwgh.oss-cn-hangzhou.aliyuncs.com/enterprise/6525f808df760.png" :isBack="true">
		    <block slot="content">胶体金检测</block>
		</cu-custom>
		<image :src="tempImage" mode="aspectFit"></image>
		<view class="result-icon">
			<view class="success-icon" v-if="[1, 2].includes(status)">
				<image class="icon" src="../../static/icons/result-icon.svg" mode="aspectFit"></image>
				<text>阴性</text>
			</view>
			<view class="fail-icon" v-else-if="[3, 4].includes(status)">
				<image class="icon" src="../../static/icons/fail-icon.svg" mode="aspectFit"></image>
				<text>阳性</text>
			</view>
			<view class="cancel-icon" v-else-if="-1 === status">
				<image class="icon" src="../../static/icons/cancel-icon.svg" mode="aspectFit"></image>
				<text>无效</text>
			</view>
		</view>
		
		<view class="padding flex flex-direction padding-bottom-xl fixedFootBtn padding-top-xs">
		    <button class="cu-btn bg-green lg margin-top-sm shadow-blur" type="" @tap="nextSetp">
		        完成
		    </button>
		</view>
	</view>
</template>

<script>
	import { _sampleDetail } from "../sample-detail/sample-detail-model.js";
	export default {
		data() {
			return {
				tempImage: '',
				status: null,
			}
		},
		onLoad(option) {
			if (option.pic) {
				uni.showLoading({
					title: '识别中'
				});
				this.tempImage = option.pic
				_sampleDetail.submitJTJImage(option.pic, (res) => {
					const { data, message, code } = JSON.parse(res);
					console.log('code:', data, code)
					if (code === 200) {
						const { image, jcjg } = data;
						this.status = jcjg;
						uni.hideLoading()
						// 如果检测成功了，需要保存结果，暂时没有接口
						// if ([1,2,3,4].includes(jcjg)) {
							this.saveResult({
								image,
								jcjg
							})
						// }
					}
				})
			}
		},
		methods: {
			saveResult({ jcjg, image }) {
				const { unitId: jczbh, name: jczmc } = uni.getStorageSync("userInfo");
				const { enterprisesName, qydm } = uni.getStorageSync("enterprisesInfo");
				const { batchId, productName, productType } = uni.getStorageSync("sampleInfo");
				const { name: jcxm } = uni.getStorageSync("JTJInfo");
				_sampleDetail.saveResult({
					  batchId,
					  enterprisesName,
					  image,
					  "jcbh": "",
					  jcjg,
					  jcxm,
					  jczbh,
					  jczmc,
					  productName,
					  productType,
					  qydm
				}, res => {
					
				})
			},
			nextSetp() {
				uni.redirectTo({
					url: '/pages/index/index'
				});
			}
		}
	}
</script>

<style>
.result-icon{
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 100;
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
}
.result-icon .icon{
	width: 200px;
	height: 200px;
}
.result image{
	width: 100vw;
	height: 89vh;
}
.fail-icon,
.success-icon,
.cancel-icon{
	display: flex;
	justify-content: center;
	align-items: center;
}
.success-icon text{
	color: #80d185;
	font-size: 30px;
	font-weight: bold;
	position: absolute;
	transform: rotate(-35deg);
}
.fail-icon text{
	color: #d81e06;
	font-size: 30px;
	font-weight: bold;
	position: absolute;
	transform: rotate(-35deg);
}

.cancel-icon text{
	color: #515151;
	font-size: 30px;
	font-weight: bold;
	position: absolute;
	transform: rotate(-35deg);
}
.fixedFootBtn{
	border: none;
	z-index: 1000;
}
</style>