fix: 农事详情操作弹窗

src/views/old_mini/work_detail/components/executePopup.vue

@@ -1,66 +1,66 @@
 <template>
     <popup v-model:show="showValue" class="execute-popup" closeable>
         <div class="popup-content">
-            <div class="time-wrap">
+            <div class="time-wrap" v-if="popupType === 'wc'">
                 <div class="name pb-10">
                     请选择实际执行时间
                 </div>
                 <div class="time-input">
                     <el-date-picker format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-model="executeTime"
-                        :disabled-date="disabledDate" size="large" style="width: 100%" type="date" :placeholder="t('请选择日期')"
+                        :disabled-date="disabledDate" size="large" style="width: 100%" type="date" placeholder="请选择日期"
                         :editable="false" />
                 </div>
             </div>
-            <div class="upload-wrap" :class="{ 'upload-cont': fileList.length }">
-                <div class="name">{{ t('农事凭证') }}</div>
-                <div class="sub-name">{{ t('请上传农事执行现场照片及所用药肥凭证照片') }}</div>
-                
-                <uploader class="uploader" v-model="fileList" multiple :max-count="5" :after-read="afterRead" @delete="handleDelete"
+            <div v-else class="upload-wrap" :class="{ 'upload-cont': fileList.length }">
+                <div class="select-info" v-if="popupType === 'sy'">
+                    <div class="ecological-row">
+                        <span class="ecological-label">是否采用生态种植</span>
+                        <el-radio-group v-model="useEcologicalPlanting" class="ecological-radio-group">
+                            <el-radio :label="1" :value="1">是</el-radio>
+                            <el-radio :label="0" :value="0">否</el-radio>
+                        </el-radio-group>
+                    </div>
+                    <div v-if="useEcologicalPlanting === 1" class="ecological-method">
+                        <div class="ecological-method-label">请选择生态种植的方式</div>
+                        <el-select v-model="ecologicalPlantingMethod" placeholder="生态种植方式" size="large"
+                            style="width: 100%">
+                            <el-option v-for="item in ecologicalMethodOptions" :key="item.value" :label="item.label"
+                                :value="item.value" />
+                        </el-select>
+                    </div>
+                </div>
+                <div class="name">农事凭证</div>
+                <div class="sub-name">肥料使用照片或者农资收据或发票</div>
+                <uploader class="uploader" v-model="fileList" multiple :max-count="5" :after-read="afterRead"
                     @click="handleClick('rg')">
-                    <!-- <img class="img" v-show="!fileList.length" src="@/assets/img/home/example-4.png" alt="" /> -->
                     <img class="plus" src="@/assets/img/home/plus.png" alt="" />
                 </uploader>
                 <div class="service-input">
-                    <el-input v-model="serviceInput" :placeholder="t('请输入农资机构名称')" />
+                    <el-input v-model="serviceInput" placeholder="请输入农资机构名称" />
                 </div>
             </div>
-            <div class="button-wrap">
-                <div @click="closeTask" class="button primary">{{ t('确认上传') }}</div>
-            </div>
-        </div>
-    </popup>
-
-    <popup v-model:show="showRemindValue" class="execute-popup" closeable>
-        <div class="popup-content">
-            <div class="name">
-                <span class="required">*</span>请选择下次提醒时间
+            <div v-if="popupType === 'wc'" class="button-wrap">
+                <div @click="closeTask" class="button primary">确认信息</div>
             </div>
-            <div class="time-number-input">
-                <el-input-number v-model="remindTime" :min="1" :max="30" :step="1" size="large" style="width: 100%" />
-                <span class="time-unit">{{ t('天后') }}</span>
-            </div>
-            <div class="button-wrap">
-                <div @click="handleRemind" class="button primary">{{ t('确认') }}</div>
+            <div v-else class="button-wrap">
+                <div @click="closeTask" class="button normal">上一步</div>
+                <div @click="closeTask" class="button primary">确认上传</div>
             </div>
+            <div v-if="popupType !== 'wc'" class="skip-btn">跳过</div>
         </div>
     </popup>
-
 </template>
 
 <script setup>
-import { useI18n } from "@/i18n";
-const { t } = useI18n();
 import { Popup, Uploader } from "vant";
-import { ref } from "vue";
+import { ref, watch } from "vue";
 import { ElMessage } from "element-plus";
 import { getFileExt } from "@/utils/util";
 import UploadFile from "@/utils/upliadFile";
 import { useStore } from "vuex";
-import { useRouter } from "vue-router";
 
 const store = useStore();
 const miniUserId = store.state.home.miniUserId;
-const router = useRouter();
 
 const props = defineProps({
     executionData: {
@@ -70,15 +70,28 @@ const props = defineProps({
 });
 
 const showValue = ref(false);
+
 const fileList = ref([]);
 const fileArr = ref([]);
-const sourceEvidenceList = ref([]);
-const sourceAuditStatusList = ref([]);
 const executeTime = ref("");
 const serviceInput = ref("");
-const uploadFileObj = new UploadFile();
+/** 是否采用生态种植：1-是，0-否 */
+const useEcologicalPlanting = ref(1);
+const ecologicalPlantingMethod = ref("");
+const ecologicalMethodOptions = [
+    { label: "有机种植", value: "organic" },
+    { label: "绿色种植", value: "green" },
+    { label: "无公害种植", value: "pollution_free" },
+    { label: "生态循环种植", value: "ecological_cycle" },
+];
+
+watch(useEcologicalPlanting, (val) => {
+    if (val !== 1) {
+        ecologicalPlantingMethod.value = "";
+    }
+});
 
-const emit = defineEmits(['executeSuccess']);
+const uploadFileObj = new UploadFile();
 
 const afterRead = (file) => {
     // 处理多张照片的情况：file 可能是数组
@@ -100,47 +113,32 @@ const afterRead = (file) => {
         }).catch(() => {
             item.status = 'failed';
             item.message = '上传失败';
-            ElMessage.error({ message: t('图片上传失败，请稍后再试！'), type: 'error' });
+            ElMessage.error('图片上传失败，请稍后再试！')
         });
     });
 };
 
-function handleDelete(file) {
-    // fileList.value = fileList.value.filter(item => item.filePath !== file.filePath);
-    // fileArr.value = fileArr.value.filter(item => item !== file.filePath);
-    
-    console.log("fileList", fileList.value);
-    if (isEdit.value) {
-        fileArr.value = fileList.value.map(item => item.filePath);
-    }
-}
+const emit = defineEmits(['executeSuccess']);
 
 function closeTask() {
     // stepIndex.value = 2
-    if (!fileArr.value.length) return ElMessage.warning({ message: t('请上传农事凭证'), type: 'warning' });
-    if (!executeTime.value) return ElMessage.warning({ message: t('请选择实际执行时间'), type: 'warning' });
-    if (!serviceInput.value) return ElMessage.warning({ message: t('请输入农资机构名称'), type: 'warning' });
-
+    if (!fileArr.value.length) return ElMessage.warning('请上传至少两张图片')
+    if (!executeTime.value) return ElMessage.warning('请选择实际执行时间')
+    console.log(fileArr.value, executeTime.value)
     const params = {
-        recordId: recordId.value,
-        executorOrganizationName: serviceInput.value,
+        // recordId: executionData.value.id,
         executeDate: executeTime.value,
         executeEvidence: fileArr.value,
     }
-    console.log("params", params);
-    VE_API.report.addExecuteImgAndComplete(params).then((res) => {
-        if (res.code === 0) {
-            ElMessage.success({ message: t('上传成功'), type: 'success' });
-            showValue.value = false;
-            setTimeout(() => {
-                emit('executeSuccess');
-            }, 800)
-        } else {
-            ElMessage.error(res.msg)
-        }
-    }).catch((err) => {
-        ElMessage.error({ message: t('操作失败'), type: 'error' });
-    })
+    setTimeout(() => {
+        emit('executeSuccess');
+    }, 800)
+    // VE_API.z_farm_work_record.addExecuteImgAndComplete(params).then((res) => {
+    //     if (res.code === 0) {
+    //         ElMessage.success('上传成功')
+    //         showValue.value = false
+    //     }
+    // })
 }
 
 const handleClick = () => {
@@ -152,36 +150,14 @@ const disabledDate = (time) => {
     return time.getTime() > Date.now();
 };
 
-const showRemindValue = ref(false);
-const remindTime = ref(1);
-
-function showRemindPopup() {
-    showRemindValue.value = true;
-}
-
-function handleRemind() {
-    if (!remindTime.value) return ElMessage.warning({ message: t('请选择下次提醒时间'), type: 'warning' });
-    showRemindValue.value = false;
-}
-
-const recordId = ref(null);
-const isEdit = ref(false);
-function openPopup(id, extraData = {}) {
+const popupType = ref(null);
+function openPopup(popupTypeVal) {
+    popupType.value = popupTypeVal;
     showValue.value = true;
-    recordId.value = id;
-    fileArr.value = extraData.evidenceList.map(item => item.filePath);
-    fileList.value = extraData.evidenceList
-    isEdit.value = extraData.isEdit
-    executeTime.value = extraData.executeDate
-    serviceInput.value = extraData.executorOrganizationName
-    // sourceEvidenceList.value = Array.isArray(extraData.evidenceList) ? extraData.evidenceList : [];
-
-    // sourceAuditStatusList.value = Array.isArray(extraData.auditStatusList) ? extraData.auditStatusList : [];
 }
 
 defineExpose({
     openPopup,
-    showRemindPopup,
 });
 </script>
 
@@ -189,6 +165,13 @@ defineExpose({
 .execute-popup {
     width: 90%;
     border-radius: 8px;
+    ::v-deep {
+        .van-popup__close-icon--top-right {
+            top: 8px;
+            right: 10px;
+            color: #333333;
+        }
+    }
 
     .popup-content {
         padding: 24px 16px 20px 16px;
@@ -219,25 +202,48 @@ defineExpose({
     padding-bottom: 12px;
 }
 
-.tips-text {
-    color: #FA7406;
-    padding: 5px 10px;
-    border: 1px solid #FA7406;
-    border-radius: 5px;
-    margin-bottom: 10px;
-    background: #fff;
-}
-
 .service-input {
     padding-top: 12px;
 }
 
+.select-info {
+    margin-bottom: 12px;
+    padding-top: 6px;
+
+    .ecological-row {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: 12px;
+
+        .ecological-label {
+            font-size: 16px;
+            font-weight: 500;
+            color: #000;
+            flex-shrink: 0;
+        }
+
+        .ecological-radio-group {
+            flex-shrink: 0;
+        }
+    }
+
+    .ecological-method {
+        .ecological-method-label {
+            font-size: 16px;
+            font-weight: 500;
+            color: #000;
+            margin-bottom: 8px;
+        }
+    }
+}
+
 .upload-wrap {
 
     &.upload-cont {
         ::v-deep {
             .van-uploader__wrapper {
-                // flex-wrap: nowrap;
+                flex-wrap: nowrap;
             }
         }
     }
@@ -269,9 +275,10 @@ defineExpose({
             position: relative;
             overflow: hidden;
         }
-        // .van-uploader__input-wrapper
+
         .van-uploader,
-        .van-uploader__wrapper {
+        .van-uploader__wrapper,
+        .van-uploader__input-wrapper {
             width: 100%;
         }
 
@@ -286,14 +293,23 @@ defineExpose({
     }
 }
 
+.skip-btn {
+    margin-top: 12px;
+    color: rgba(45, 42, 42, 0.4);
+    font-size: 16px;
+    text-align: center;
+    cursor: pointer;
+}
+
 .button-wrap {
     display: flex;
     justify-content: center;
+    gap: 12px;
     margin: 24px 4px 0 4px;
 
     .button {
         border-radius: 20px;
-        color: #fff;
+        color: #999999;
         padding: 7px 0;
         text-align: center;
         font-size: 16px;
@@ -303,6 +319,10 @@ defineExpose({
             background: #2199f8;
             color: #fff;
         }
+        &.normal {
+            width: 142px;
+            border: 0.5px solid rgba(153, 153, 153, 0.5);
+        }
     }
 }
 

src/views/old_mini/work_detail/index.vue

@@ -49,7 +49,7 @@
                                     <span class="area-tag" :style="backgroundFarmWorkStatus(farmData.work_status)">{{
                                         workStatusObj[farmData.work_status] }}</span>
                                 </div>
-                                <div class="area-r" :style="{background:farmData?.work_status === 6 ? '#37C11B' : '#2199F8'}">{{ farmData?.work_status === 6 ? '溯源认证' : '我已完成' }}</div>
+                                <div class="area-r" @click="handleExecute(farmData?.work_status, farmData?.farm_work_type)" :style="{background:farmData?.work_status === 6 ? '#37C11B' : '#2199F8'}">{{ farmData?.work_status === 6 ? '溯源认证' : '我已完成' }}</div>
                             </div>
                         </div>
                         <!-- <div class="ecological-plant-card">
@@ -299,39 +299,9 @@ const getDetail = () => {
     })
 };
 
-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,
-            filePath: item,
-            status: auditStatusList[index] === 2 ? 'failed' : 'success',
-            message: auditStatusList[index] === 2 ? '审核失败' : '审核成功',
-        });
-    });
-    console.log("evideimgsnceList", imgs);
-    const isEdit = evidenceList?.length > 0 ? true : false;
-    executePopupRef.value.openPopup(miniJson.value.recordId, {
-        evidenceList: imgs,
-        isEdit: isEdit,
-        executeDate: detail.value.executeDate,
-        executorOrganizationName: detail.value.executorOrganizationName,
-    });
+const handleExecute = (status, type) => {
+    const popupType = type === 5 ? 'bc' : (status === 6 ? 'sy' : 'wc')
+    executePopupRef.value.openPopup(popupType);
 };
 
 watch(locale, () => {