|
|
@@ -1,977 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="work-detail">
|
|
|
- <custom-header name="农事详情" v-if="!miniJson?.hideDraw" :showClose="false" isGoBack @goback="handleBack" />
|
|
|
-
|
|
|
- <div class="work-detail-content">
|
|
|
- <!-- 顶部状态 -->
|
|
|
- <div class="content-status" :class="['status-' + detail?.flowStatus, 'audit-' + getAuditStatusPriority(detail?.executeEvidenceAuditStatus)]">
|
|
|
- <div class="status-l">
|
|
|
- <div class="status-title">{{ handleTagType(detail?.flowStatus) }}</div>
|
|
|
- <div class="status-sub" v-if="triggerDateText && (detail?.flowStatus == -1 || detail?.flowStatus == -2)">
|
|
|
- 执行时间已经过去 {{ Math.abs(daysDiff) }} 天了
|
|
|
- </div>
|
|
|
- <div class="status-sub" v-if="detail?.flowStatus === 3 && getAuditStatusPriority(detail?.executeEvidenceAuditStatus) !== 2">
|
|
|
- <template v-if="daysDiff > 0">
|
|
|
- 距离执行时间还差 {{ Math.abs(daysDiff) }} 天
|
|
|
- </template>
|
|
|
- <template v-else-if="daysDiff === 0">
|
|
|
- 执行时间为今天
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- 执行时间已过
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- <div class="status-sub" v-if="!detail?.flowStatus || detail?.flowStatus === 0">
|
|
|
- 预计触发时间 {{ detail?.executeDate || "--" }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="work-wrap" :class="{ 'has-bottom': info?.appType === 2 || (info?.appType === 1 && detail?.flowStatus === 3) }">
|
|
|
- <!-- 农事组信息 -->
|
|
|
- <div class="box-wrap group-info group-box" v-if="(detail?.executionLimitDays || detail?.executionLimitDays === 0) && detail?.flowStatus !== 5">
|
|
|
- <div class="group-name">
|
|
|
- 该农事为 <span class="light-text">标准防治溯源农事</span> ，请在<span v-if="detail?.flowStatus !== 3">触发后</span> <span class="light-text">{{detail?.executionLimitDays}}天内</span>
|
|
|
- 完成溯源认证上传，如果逾期未认证，该农事将不可溯源认证，且不计入飞鸟有味平台
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 每一段农事 -->
|
|
|
- <div v-for="(prescription, index) in stageList" :key="index" class="box-wrap stage-card">
|
|
|
- <div class="work-info">
|
|
|
- <div class="stage-header">
|
|
|
- <div class="stage-title">{{ detail.farmWorkName }}</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="stage-info">
|
|
|
- <div class="form-item">
|
|
|
- <div class="item-name">农事目的</div>
|
|
|
- <div class="item-text">
|
|
|
- {{ prescription.purpose || prescription.purposeName || "--" }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="form-item">
|
|
|
- <div class="item-name">农事时间</div>
|
|
|
- <div class="item-text">
|
|
|
- {{ detail.executeDate || "--" }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="form-item">
|
|
|
- <div class="item-name">执行区域</div>
|
|
|
- <div class="item-text light-text area-text">
|
|
|
- {{ detail?.executionRegion?.regionName }}种植区域
|
|
|
- <div class="area-btn" v-if="detail?.executionRegion?.regionRange" @click="handleViewArea">查看区域</div>
|
|
|
- <div class="area-btn area-btn-right" @click="toDraw" v-if="!detail?.executionRegion?.regionRange && !miniJson?.hideDraw">建议勾选<el-icon><ArrowRight /></el-icon></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="form-item">
|
|
|
- <div class="item-name">注意事项</div>
|
|
|
- <div class="item-text">
|
|
|
- {{ detail.remark || "--" }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="form-item" v-if="hasAnyAvailableExecutionMethod(prescription)">
|
|
|
- <div class="item-name">药肥处方</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 执行方式 -->
|
|
|
- <div class="stage-tabs" v-if="hasAnyAvailableExecutionMethod(prescription)">
|
|
|
- <div v-for="tab in getAvailableExecutionTabs(prescription)" :key="tab.value" class="tab-pill"
|
|
|
- :class="{ active: getStageExecutionMethod(index) === tab.value }"
|
|
|
- @click="changeExecutionMethod(index, tab.value)">
|
|
|
- {{ tab.label }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 药物处方表 -->
|
|
|
- <div class="prescription-wrap"
|
|
|
- v-if="prescription.pesticideList && prescription.pesticideList.length && hasAnyAvailableExecutionMethod(prescription)">
|
|
|
- <div class="prescription-table">
|
|
|
- <div class="table-header">
|
|
|
- <div class="col col-type">使用功效</div>
|
|
|
- <div class="col col-name">药肥名称</div>
|
|
|
- <div class="col col-ratio">药肥配比</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div v-for="(item, i) in prescription.pesticideList" :key="i" class="table-row">
|
|
|
- <div class="col col-type">
|
|
|
- {{ item.typeName || "--" }}
|
|
|
- </div>
|
|
|
- <div class="col col-name">
|
|
|
- {{ item.name || item.pesticideFertilizerName || "--" }}
|
|
|
- </div>
|
|
|
- <div class="col col-ratio">
|
|
|
- {{ getPesticideParam(item, index)?.ratio || "--" }}倍
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div v-if="hasRemark(prescription, index)" class="prescription-remark">
|
|
|
- <span v-for="(item, idx) in [prescription.pesticideList[0]]" :key="idx">
|
|
|
- <template v-if="getParamRemark(item, index)">
|
|
|
- {{ getParamRemark(item, index) }}
|
|
|
- <br />
|
|
|
- </template>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
-
|
|
|
- <!-- 农事凭证 -->
|
|
|
- <div class="work-info photo-box" v-if="prescription.cropAlbum && prescription.cropAlbum.length">
|
|
|
- <div class="photo-title">农事凭证</div>
|
|
|
- <div class="tips-text" v-if="detail?.imageAuditRejectReason">{{ detail?.imageAuditRejectReason }}</div>
|
|
|
- <div class="photo-sub-title" v-if="info?.appType === 1">来自于 {{ detail?.executorOrganizationName || "--" }}</div>
|
|
|
- <div class="photo-img-wrap">
|
|
|
- <photo-provider :photo-closable="true">
|
|
|
- <photo-consumer v-for="(src, index) in prescription.cropAlbum" intro="农事凭证" :key="index"
|
|
|
- :src="base_img_url2 + src.filename">
|
|
|
- <div class="photo-img">
|
|
|
- <img :src="base_img_url2 + src.filename" />
|
|
|
- <div class="fail-icon" v-if="failIndex(index) === 2">
|
|
|
- <el-icon size="24" color="#FF953D"><WarningFilled /></el-icon>
|
|
|
- <div class="fail-icon-text">审核失败</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </photo-consumer>
|
|
|
- </photo-provider>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 底部按钮 -->
|
|
|
- <div class="fixed-btn-wrap center-btn" v-if="info?.appType === 2">
|
|
|
- <div class="fixed-btn" @click="handleConvert">
|
|
|
- 转发农事
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="fixed-btn-wrap execute-action" :class="{ 'no-share': miniJson?.hideDraw }" v-if="info?.appType === 1 && detail?.flowStatus === 3">
|
|
|
- <div class="action-item second" v-if="!miniJson?.hideDraw" @click="handleConvert">转发农事</div>
|
|
|
- <div class="action-item primary" @click="handleExecute">溯源认证</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <ExecutePopup ref="executePopupRef" @executeSuccess="getDetail" />
|
|
|
-
|
|
|
- <upload-tips v-model:show="showUploadTipsPopup" />
|
|
|
- </div>
|
|
|
- <!-- 执行区域地图弹窗 -->
|
|
|
- <popup v-model:show="showMapPopup" closeable class="map-popup">
|
|
|
- <map-info :rangeWkt="detail?.executionRegion?.regionRange" />
|
|
|
- </popup>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script setup>
|
|
|
-import { ElMessage } from "element-plus";
|
|
|
-import wx from "weixin-js-sdk";
|
|
|
-import customHeader from "@/components/customHeader.vue";
|
|
|
-import { ref, computed, onMounted, onActivated } from "vue";
|
|
|
-import { useRouter } from "vue-router";
|
|
|
-import { formatDate } from "@/common/commonFun";
|
|
|
-import ExecutePopup from "./components/executePopup.vue";
|
|
|
-import { base_img_url2 } from "@/api/config";
|
|
|
-import UploadTips from "@/components/popup/uploadTips.vue";
|
|
|
-import { Popup } from "vant";
|
|
|
-import MapInfo from "./components/mapInfo.vue";
|
|
|
-import { useRoute } from "vue-router";
|
|
|
-
|
|
|
-const route = useRoute();
|
|
|
-const showUploadTipsPopup = ref(false);
|
|
|
-
|
|
|
-const router = useRouter();
|
|
|
-// const info = JSON.parse(localStorage.getItem("localUserInfo") || "{}");
|
|
|
-const info = { appType: 1 };
|
|
|
-
|
|
|
-/** 接口根级与 detail 合并后的详情（pesticideList、prescriptionList） */
|
|
|
-const detail = ref({
|
|
|
- farmId: null,
|
|
|
- farmWorkLibId: null,
|
|
|
- farmWorkName: "",
|
|
|
- flowStatus: null,
|
|
|
- purpose: "",
|
|
|
- speciesId: null,
|
|
|
- speciesName: "",
|
|
|
- executeDate: null,
|
|
|
- intervelTime: null,
|
|
|
- remark: "",
|
|
|
- pesticideList: [],
|
|
|
- prescriptionList: [],
|
|
|
- confirmPicture: [],
|
|
|
- executeEvidence: [],
|
|
|
- expertName: "",
|
|
|
- expertPrescription: "",
|
|
|
- id: null,
|
|
|
- postId: null,
|
|
|
- post: null,
|
|
|
- expertNameFromFarmBasicInfo: "",
|
|
|
- rangeWkt: null,
|
|
|
-});
|
|
|
-
|
|
|
-/** 凭证图片统一为 { filename } */
|
|
|
-const normalizeCropAlbum = (album) => {
|
|
|
- if (!album || !Array.isArray(album)) return [];
|
|
|
- return album
|
|
|
- .map((x) => {
|
|
|
- if (!x) return null;
|
|
|
- if (typeof x === "string") return { filename: x };
|
|
|
- if (x.filename) return x;
|
|
|
- return null;
|
|
|
- })
|
|
|
- .filter(Boolean);
|
|
|
-};
|
|
|
-
|
|
|
-
|
|
|
-const maybeShowUploadTips = () => {
|
|
|
- if (detail.value?.flowStatus !== 1) return;
|
|
|
- const shown = localStorage.getItem('upload_tips');
|
|
|
- if (shown === "1") return;
|
|
|
-
|
|
|
- localStorage.setItem('upload_tips', "1");
|
|
|
- showUploadTipsPopup.value = true;
|
|
|
-};
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- maybeShowUploadTips();
|
|
|
-});
|
|
|
-
|
|
|
-const miniJson = ref(null);
|
|
|
-onActivated(() => {
|
|
|
- if (route.query?.miniJson) {
|
|
|
- const miniJsonObj = JSON.parse(route.query.miniJson);
|
|
|
- miniJson.value = JSON.parse(miniJsonObj.paramsPage);
|
|
|
- } else {
|
|
|
- miniJson.value = null;
|
|
|
- }
|
|
|
- getDetail();
|
|
|
-});
|
|
|
-
|
|
|
-const getDetail = () => {
|
|
|
- if (!miniJson.value) return;
|
|
|
- const { farmWorkLibId, farmId, recordId } = miniJson.value;
|
|
|
- VE_API.z_farm_work_record
|
|
|
- .getDetailById({ farmWorkLibId, farmId, farmWorkRecordId: recordId })
|
|
|
- .then(({ data }) => {
|
|
|
- const inner =
|
|
|
- data?.detail && typeof data.detail === "object"
|
|
|
- ? { ...data.detail }
|
|
|
- : {};
|
|
|
- detail.value = {
|
|
|
- ...inner,
|
|
|
- post: data?.post ?? null,
|
|
|
- executionRegion: data?.executionRegion ?? null,
|
|
|
- expertNameFromFarmBasicInfo:
|
|
|
- data?.expertNameFromFarmBasicInfo ?? "",
|
|
|
- rangeWkt: data?.rangeWkt ?? null,
|
|
|
- };
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-
|
|
|
-// 计算距离执行时间的天数差
|
|
|
-const daysDiff = computed(() => {
|
|
|
- if (!detail.value?.executeDate) {
|
|
|
- return '--';
|
|
|
- }
|
|
|
-
|
|
|
- const executeDate = new Date(detail.value.executeDate);
|
|
|
- const today = new Date();
|
|
|
-
|
|
|
- // 将时间设置为 00:00:00，只比较日期
|
|
|
- executeDate.setHours(0, 0, 0, 0);
|
|
|
- today.setHours(0, 0, 0, 0);
|
|
|
-
|
|
|
- // 计算天数差（毫秒转天数）
|
|
|
- const diffTime = executeDate.getTime() - today.getTime();
|
|
|
- const diffDays = Math.floor(diffTime / (1000 * 60 * 60 * 24));
|
|
|
-
|
|
|
- return diffDays;
|
|
|
-});
|
|
|
-
|
|
|
-// 执行方式 Tab 配置
|
|
|
-const executionTabs = [
|
|
|
- { label: "植保机", value: 1 },
|
|
|
- { label: "人工手持", value: 2 },
|
|
|
- { label: "地面机械", value: 3 }
|
|
|
-];
|
|
|
-// 每一段农事的当前执行方式（索引 -> 执行方式），默认 1：植保机
|
|
|
-const stageExecutionMethods = ref({});
|
|
|
-const executePopupRef = ref(null);
|
|
|
-
|
|
|
-const hasTextValue = (val) => {
|
|
|
- if (val === null || val === undefined) return false;
|
|
|
- return String(val).trim() !== "";
|
|
|
-};
|
|
|
-
|
|
|
-const hasValidParamForMethod = (item, methodValue) => {
|
|
|
- if (!item?.params || !Array.isArray(item.params)) return false;
|
|
|
- const methodParam = item.params.find(
|
|
|
- (param) => Number(param.executionMethod) === Number(methodValue)
|
|
|
- );
|
|
|
- if (!methodParam) return false;
|
|
|
- return hasTextValue(methodParam.ratio) || hasTextValue(methodParam.remark);
|
|
|
-};
|
|
|
-
|
|
|
-const getAvailableExecutionTabs = (prescription) => {
|
|
|
- const list = prescription?.pesticideList;
|
|
|
- if (!Array.isArray(list) || !list.length) return [];
|
|
|
- return executionTabs.filter((tab) =>
|
|
|
- list.some((item) => hasValidParamForMethod(item, tab.value))
|
|
|
- );
|
|
|
-};
|
|
|
-
|
|
|
-const hasAnyAvailableExecutionMethod = (prescription) => {
|
|
|
- return getAvailableExecutionTabs(prescription).length > 0;
|
|
|
-};
|
|
|
-
|
|
|
-
|
|
|
-const triggerDateText = computed(() => {
|
|
|
- if (!detail.value.executeDate) return "";
|
|
|
- const d = formatDate(detail.value.executeDate);
|
|
|
- return d.replace(/-/g, ".");
|
|
|
-});
|
|
|
-
|
|
|
-/**
|
|
|
- * 展示用「分段」列表：detail.pesticideList 或 prescriptionList 推导
|
|
|
- */
|
|
|
-const stageList = computed(() => {
|
|
|
- const d = detail.value;
|
|
|
- if (!d) return [];
|
|
|
-
|
|
|
- // if (Array.isArray(d.pesticideList) && d.pesticideList.length) {
|
|
|
- return [
|
|
|
- {
|
|
|
- ...d,
|
|
|
- pesticideList: d.pesticideList,
|
|
|
- cropAlbum: normalizeCropAlbum(
|
|
|
- d.confirmPicture?.length
|
|
|
- ? d.confirmPicture
|
|
|
- : d.executeEvidence
|
|
|
- ),
|
|
|
- },
|
|
|
- ];
|
|
|
- // }
|
|
|
-
|
|
|
- // return [];
|
|
|
-});
|
|
|
-
|
|
|
-
|
|
|
-const hasRemark = (prescription, stageIndex) => {
|
|
|
- if (!prescription?.pesticideList || !Array.isArray(prescription.pesticideList)) return false;
|
|
|
- const currentMethod = getStageExecutionMethod(stageIndex);
|
|
|
- return prescription.pesticideList.some((item) => {
|
|
|
- if (!item.params || !Array.isArray(item.params)) return false;
|
|
|
- const p = item.params.find((param) => param.executionMethod === currentMethod);
|
|
|
- return !!(p && p.remark);
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-const handleTagType = (tagType) => {
|
|
|
- if (tagType == 0) return "待触发";
|
|
|
- if (tagType == -1) return "已过期";
|
|
|
- if (tagType == -2) return "已过期";
|
|
|
- if (tagType == 3) {
|
|
|
- const status = getAuditStatusPriority(detail.value?.executeEvidenceAuditStatus);
|
|
|
- if (status === 2) {
|
|
|
- return "审核失败";
|
|
|
- }
|
|
|
- return "待认证"
|
|
|
- }
|
|
|
- if (tagType == 5) {
|
|
|
- const status = getAuditStatusPriority(detail.value?.executeEvidenceAuditStatus);
|
|
|
- if (status === 2) {
|
|
|
- return "审核失败";
|
|
|
- }
|
|
|
- if (status === 0) {
|
|
|
- return "审核中";
|
|
|
- }
|
|
|
- return "已完成";
|
|
|
- }
|
|
|
- return "待触发"
|
|
|
-}
|
|
|
-
|
|
|
-// 审核状态优先级：2 > 0 > 1
|
|
|
-const getAuditStatusPriority = (auditStatusList) => {
|
|
|
- if (!Array.isArray(auditStatusList) || !auditStatusList.length) return 1;
|
|
|
- const normalized = auditStatusList.map((x) => Number(x)).filter((x) => [0, 1, 2].includes(x));
|
|
|
- if (!normalized.length) return 1;
|
|
|
- if (normalized.includes(2)) return 2;
|
|
|
- if (normalized.includes(0)) return 0;
|
|
|
- return 1;
|
|
|
-};
|
|
|
-
|
|
|
-// 审核是否失败
|
|
|
-const failIndex = (index) => {
|
|
|
- return detail.value?.executeEvidenceAuditStatus[index]
|
|
|
-}
|
|
|
-
|
|
|
-const handleExecute = () => {
|
|
|
- // const today = new Date();
|
|
|
- // const executeDate = new Date(detail.value.executeDate);
|
|
|
- // if (executeDate.getTime() > today.getTime()) {
|
|
|
- // ElMessage.warning('未到农事执行时间，无法溯源认证');
|
|
|
- // return;
|
|
|
- // }
|
|
|
- const evidenceList = normalizeCropAlbum(
|
|
|
- detail.value?.confirmPicture?.length
|
|
|
- ? detail.value.confirmPicture
|
|
|
- : detail.value.executeEvidence
|
|
|
- ).map((item) => item.filename);
|
|
|
- const auditStatusList = Array.isArray(detail.value?.executeEvidenceAuditStatus)
|
|
|
- ? detail.value.executeEvidenceAuditStatus
|
|
|
- : [];
|
|
|
-
|
|
|
- let imgs = []
|
|
|
- evidenceList.forEach((item, index) => {
|
|
|
- imgs.push({
|
|
|
- url: base_img_url2 + item,
|
|
|
- status: auditStatusList[index] === 2 ? 'failed' : 'success',
|
|
|
- message: auditStatusList[index] === 2 ? '审核失败' : '审核成功',
|
|
|
- });
|
|
|
- });
|
|
|
- console.log("evideimgsnceList", imgs);
|
|
|
- executePopupRef.value.openPopup(miniJson.value.recordId, {
|
|
|
- evidenceList: imgs,
|
|
|
- executeDate: detail.value.executeDate,
|
|
|
- executorOrganizationName: detail.value.executorOrganizationName,
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-
|
|
|
-const showMapPopup = ref(false);
|
|
|
-
|
|
|
-const handleViewArea = () => {
|
|
|
- showMapPopup.value = true;
|
|
|
-}
|
|
|
-
|
|
|
-const toDraw = () => {
|
|
|
- router.push({
|
|
|
- path: "/draw_area",
|
|
|
- query: {
|
|
|
- subjectId: localStorage.getItem('selectedFarmId'),
|
|
|
- varietyId: miniJson.value.typeId,
|
|
|
- },
|
|
|
- });
|
|
|
-}
|
|
|
-
|
|
|
-const handleBack = () => {
|
|
|
- router.back();
|
|
|
-};
|
|
|
-
|
|
|
-const handleConvert = () => {
|
|
|
- const query = {
|
|
|
- askInfo: { title: "农事执行", content: "是否分享该农事给好友" },
|
|
|
- shareText: `${detail.value.farmWorkName}农事 已触发，请在最佳农时内执行`,
|
|
|
- targetUrl: `work_detail`,
|
|
|
- paramsPage: JSON.stringify({...miniJson.value, hideDraw: true}),
|
|
|
- imageUrl: 'https://birdseye-img.sysuimars.com/birdseye-look-mini/work_img.png',
|
|
|
- };
|
|
|
- wx.miniProgram.navigateTo({
|
|
|
- url: `/pages/subPages/share_page/index?pageParams=${JSON.stringify(query)}&type=sharePage`,
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-// 获取当前段的执行方式
|
|
|
-const getStageExecutionMethod = (stageIndex) => {
|
|
|
- const stage = stageList.value?.[stageIndex];
|
|
|
- const availableTabs = getAvailableExecutionTabs(stage);
|
|
|
- if (!availableTabs.length) return 1;
|
|
|
-
|
|
|
- const val = stageExecutionMethods.value[stageIndex];
|
|
|
- const isValidSelected = availableTabs.some(
|
|
|
- (tab) => Number(tab.value) === Number(val)
|
|
|
- );
|
|
|
- return isValidSelected ? val : availableTabs[0].value;
|
|
|
-};
|
|
|
-
|
|
|
-// 根据当前执行方式，获取对应的参数（配比、单亩用量、备注）
|
|
|
-const getPesticideParam = (item, stageIndex) => {
|
|
|
- if (!item?.params || !Array.isArray(item.params)) return null;
|
|
|
- const currentMethod = getStageExecutionMethod(stageIndex);
|
|
|
- return (
|
|
|
- item.params.find((param) => param.executionMethod === currentMethod) || null
|
|
|
- );
|
|
|
-};
|
|
|
-
|
|
|
-const getParamRemark = (item, stageIndex) => {
|
|
|
- const param = getPesticideParam(item, stageIndex);
|
|
|
- return param?.remark || item.remark || "";
|
|
|
-};
|
|
|
-
|
|
|
-const changeExecutionMethod = (stageIndex, value) => {
|
|
|
- const stage = stageList.value?.[stageIndex];
|
|
|
- const availableTabs = getAvailableExecutionTabs(stage);
|
|
|
- const isAllowed = availableTabs.some(
|
|
|
- (tab) => Number(tab.value) === Number(value)
|
|
|
- );
|
|
|
- if (!isAllowed) return;
|
|
|
-
|
|
|
- stageExecutionMethods.value = {
|
|
|
- ...stageExecutionMethods.value,
|
|
|
- [stageIndex]: value
|
|
|
- };
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped lang="scss">
|
|
|
-.work-detail {
|
|
|
- height: 100vh;
|
|
|
- background: #f2f3f5;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- .work-detail-content {
|
|
|
- flex: 1;
|
|
|
- overflow: auto;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.content-status {
|
|
|
- position: relative;
|
|
|
- padding: 16px 12px 0 12px;
|
|
|
- color: #fff;
|
|
|
- z-index: 1;
|
|
|
- height: 100px;
|
|
|
- box-sizing: border-box;
|
|
|
-
|
|
|
- &::after {
|
|
|
- content: "";
|
|
|
- z-index: -1;
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- height: 100px;
|
|
|
- background: #C7C7C7;
|
|
|
- // background: #FF953D;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- &.status-0 {
|
|
|
- &::after {
|
|
|
- background: #C7C7C7;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- &.status-5 {
|
|
|
- padding-top: 30px;
|
|
|
-
|
|
|
- &::after {
|
|
|
- background: #2199F8;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- &.status-3, &.audit-2, &.audit-0 {
|
|
|
- &::after {
|
|
|
- background: #FF953D;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- &.audit-2 {
|
|
|
- padding-top: 30px;
|
|
|
- }
|
|
|
-
|
|
|
- &.status--1 {
|
|
|
- &::after {
|
|
|
- background: #FF4F4F;
|
|
|
- }
|
|
|
- }
|
|
|
- &.status--2 {
|
|
|
- &::after {
|
|
|
- background: #C7C7C7;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .status-l {
|
|
|
- .status-title {
|
|
|
- font-size: 22px;
|
|
|
- }
|
|
|
-
|
|
|
- .status-sub {
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.work-wrap {
|
|
|
- position: relative;
|
|
|
- top: -16px;
|
|
|
- padding: 0 12px 12px;
|
|
|
- z-index: 2;
|
|
|
- &.has-bottom {
|
|
|
- margin-bottom: 76px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.box-wrap {
|
|
|
-
|
|
|
- // background: #ffffff;
|
|
|
- // border-radius: 8px;
|
|
|
- // padding: 14px 10px 10px 10px;
|
|
|
- // box-shadow: 0 2px 8px rgba(15, 35, 52, 0.06);
|
|
|
- .work-info {
|
|
|
- background: #ffffff;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 14px 10px 10px 10px;
|
|
|
- box-shadow: 0 2px 8px rgba(15, 35, 52, 0.06);
|
|
|
- }
|
|
|
-
|
|
|
- .photo-box {
|
|
|
- margin-top: 10px;
|
|
|
- padding: 11px 10px;
|
|
|
- font-size: 14px;
|
|
|
-
|
|
|
- .tips-text {
|
|
|
- color: #FA7406;
|
|
|
- padding: 5px 10px;
|
|
|
- border: 1px solid #FF953D;
|
|
|
- border-radius: 5px;
|
|
|
- margin-bottom: 10px;
|
|
|
- background: #fff;
|
|
|
- }
|
|
|
-
|
|
|
- .photo-title {
|
|
|
- color: #000;
|
|
|
- padding-bottom: 9px;
|
|
|
- }
|
|
|
-
|
|
|
- .photo-sub-title {
|
|
|
- padding-bottom: 9px;
|
|
|
- color: #767676;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-.group-info {
|
|
|
- margin-bottom: 10px;
|
|
|
- background: #ffffff;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 14px 10px 10px 10px;
|
|
|
- box-shadow: 0 2px 8px rgba(15, 35, 52, 0.06);
|
|
|
-
|
|
|
- &.group-box {
|
|
|
- padding: 10px;
|
|
|
-
|
|
|
- .group-name {
|
|
|
- font-size: 14px;
|
|
|
- color: #767676;
|
|
|
-
|
|
|
- .group-name-text {
|
|
|
- color: #000;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .group-name {
|
|
|
- font-size: 14px;
|
|
|
- color: rgba(0, 0, 0, 0.2);
|
|
|
-
|
|
|
- .group-name-text {
|
|
|
- color: #767676;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .group-sub {
|
|
|
- margin-top: 6px;
|
|
|
- font-size: 12px;
|
|
|
- color: rgba(0, 0, 0, 0.45);
|
|
|
- line-height: 1.5;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.stage-card+.stage-card {
|
|
|
- margin-top: 10px;
|
|
|
-}
|
|
|
-
|
|
|
-.stage-card {
|
|
|
-
|
|
|
- .stage-header {
|
|
|
- padding-bottom: 12px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 5px;
|
|
|
-
|
|
|
- .stage-title {
|
|
|
- font-size: 16px;
|
|
|
- color: #000;
|
|
|
- }
|
|
|
-
|
|
|
- .title-tag {
|
|
|
- width: fit-content;
|
|
|
- font-size: 12px;
|
|
|
- height: 26px;
|
|
|
- line-height: 26px;
|
|
|
- color: #2199F8;
|
|
|
- background: rgba(33, 153, 248, 0.1);
|
|
|
- border-radius: 20px;
|
|
|
- padding: 0 8px;
|
|
|
- }
|
|
|
-
|
|
|
- .tag-0 {
|
|
|
- color: #FF953D;
|
|
|
- background: rgba(255, 149, 61, 0.1);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .stage-info {
|
|
|
- padding: 8px 0 2px;
|
|
|
- border-top: 1px solid #f5f5f5;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.form-item {
|
|
|
- display: flex;
|
|
|
- font-size: 14px;
|
|
|
- color: #767676;
|
|
|
- margin-top: 4px;
|
|
|
-
|
|
|
- .area-btn {
|
|
|
- border: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
- padding: 0 10px;
|
|
|
- color: #767676;
|
|
|
- }
|
|
|
-
|
|
|
- .area-btn-right {
|
|
|
- padding-right: 4px;
|
|
|
- display: inline-flex;
|
|
|
- align-items: center;
|
|
|
- gap: 4px;
|
|
|
- }
|
|
|
-
|
|
|
- .item-name {
|
|
|
- padding-right: 26px;
|
|
|
- color: rgba(0, 0, 0, 0.2);
|
|
|
- }
|
|
|
-
|
|
|
- .item-text {
|
|
|
- flex: 1;
|
|
|
- line-height: 21px;
|
|
|
-
|
|
|
- &.light-text {
|
|
|
- color: #2199F8;
|
|
|
- }
|
|
|
- }
|
|
|
- .area-text {
|
|
|
- display: inline-flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.light-text {
|
|
|
- color: #2199F8;
|
|
|
-}
|
|
|
-
|
|
|
-.stage-tabs {
|
|
|
- display: inline-flex;
|
|
|
- gap: 8px;
|
|
|
- margin-top: 8px;
|
|
|
-
|
|
|
- .tab-pill {
|
|
|
- padding: 0 8px;
|
|
|
- font-size: 14px;
|
|
|
- text-align: center;
|
|
|
- border-radius: 2px;
|
|
|
- height: 28px;
|
|
|
- line-height: 28px;
|
|
|
- color: #767676;
|
|
|
- background: rgba(171, 171, 171, 0.1);
|
|
|
-
|
|
|
- &.active {
|
|
|
- background: rgba(33, 153, 248, 0.1);
|
|
|
- color: #2199F8;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.prescription-wrap {
|
|
|
- margin-top: 10px;
|
|
|
- overflow: hidden;
|
|
|
-
|
|
|
- .prescription-title {
|
|
|
- padding: 8px 10px;
|
|
|
- font-size: 13px;
|
|
|
- font-weight: 500;
|
|
|
- border-bottom: 1px solid rgba(225, 225, 225, 0.6);
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.prescription-table {
|
|
|
- font-size: 12px;
|
|
|
- text-align: center;
|
|
|
- border-radius: 6px;
|
|
|
- border: 1px solid rgba(225, 225, 225, 0.6);
|
|
|
-
|
|
|
- .table-header {
|
|
|
- display: flex;
|
|
|
- background: rgba(171, 171, 171, 0.1);
|
|
|
- padding: 9px 6px;
|
|
|
- color: #767676;
|
|
|
- }
|
|
|
-
|
|
|
- .table-row {
|
|
|
- display: flex;
|
|
|
- padding: 12px 6px;
|
|
|
- border-bottom: 1px solid rgba(0, 0, 0, 0.08);
|
|
|
- color: rgba(0, 0, 0, 0.76);
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- border-bottom: none;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .col {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- padding: 0 2px;
|
|
|
- }
|
|
|
-
|
|
|
- .col-type {
|
|
|
- width: 56px;
|
|
|
- }
|
|
|
-
|
|
|
- .col-name {
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
-
|
|
|
- .col-ratio {
|
|
|
- width: 64px;
|
|
|
- }
|
|
|
-
|
|
|
- .col-dose {
|
|
|
- width: 64px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.prescription-remark {
|
|
|
- margin-top: 8px;
|
|
|
- padding: 7px 10px;
|
|
|
- border-radius: 6px;
|
|
|
- color: #767676;
|
|
|
- background: rgba(171, 171, 171, 0.1);
|
|
|
- line-height: 21px;
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-.photo-img-wrap {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- gap: 10px;
|
|
|
-
|
|
|
- ::v-deep {
|
|
|
- .PhotoConsumer {
|
|
|
- width: 31%;
|
|
|
- height: 92px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .photo-img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- position: relative;
|
|
|
- box-sizing: border-box;
|
|
|
- border: 2px solid transparent;
|
|
|
- border-radius: 8px;
|
|
|
- overflow: hidden;
|
|
|
-
|
|
|
- .fail-icon {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background: rgba(0, 0, 0, 0.6);
|
|
|
- border-radius: 8px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- flex-direction: column;
|
|
|
- gap: 4px;
|
|
|
- .fail-icon-text {
|
|
|
- color: #FF943D;
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- border-radius: 8px;
|
|
|
- object-fit: cover;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.execute-action {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- // justify-content: center;
|
|
|
- justify-content: space-between;
|
|
|
- gap: 16px;
|
|
|
-
|
|
|
- .action-item {
|
|
|
- padding: 0 26px;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- border-radius: 26px;
|
|
|
- box-sizing: border-box;
|
|
|
- font-size: 14px;
|
|
|
-
|
|
|
- &.second {
|
|
|
- background: #ffffff;
|
|
|
- border: 0.5px solid rgba(153, 153, 153, 0.5);
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
-
|
|
|
- &.primary {
|
|
|
- background: linear-gradient(180deg, #8ACBFF 0%, #2199F8 100%);
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- }
|
|
|
- &.no-share {
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.fixed-btn-wrap {
|
|
|
- display: flex;
|
|
|
- // justify-content: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- &.center-btn {
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
-
|
|
|
- position: fixed;
|
|
|
- bottom: 0px;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- background: #fff;
|
|
|
- padding: 10px 12px 36px 12px;
|
|
|
- box-sizing: border-box;
|
|
|
- // box-shadow: 0 -2px 8px rgba(15, 35, 52, 0.06);
|
|
|
- box-shadow: 2px 2px 4.5px 0px #00000066;
|
|
|
-
|
|
|
- .fixed-btn {
|
|
|
- min-width: 110px;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- border-radius: 20px;
|
|
|
- background: linear-gradient(180deg, #70bffe, #2199f8);
|
|
|
- color: #ffffff;
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.map-popup {
|
|
|
- width: 92%;
|
|
|
- // max-width: 420px;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 12px;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-</style>
|
