Ver Fonte

feat:修改创建农场逻辑和对接农情互动接口列表

wangsisi há 2 dias atrás
pai
commit
1d104b86be

+ 5 - 0
src/api/modules/farm.js

@@ -76,4 +76,9 @@ module.exports = {
         url: config.base_dev_url + "container_reproductive/listByPhenologyId",
         type: "get",
     },
+    // 基地类别列表
+    fetchBaseTypeList: {
+        url: config.base_dev_url + "v2/farm/farmBaseTypeOptions",
+        type: "get",
+    },
 }

+ 5 - 0
src/api/modules/home.js

@@ -123,4 +123,9 @@ module.exports = {
         url: config.base_dev_url + "container_phenology_interaction/hasUnrepliedTriggeredInteraction",
         type: "get",
     },
+    //农户上传/更新互动数据(图片、指标答案、范围、回复文字等)
+    uploadAnswerData: {
+        url: config.base_dev_url + "container_phenology_interaction/uploadAnswerData",
+        type: "post",
+    },
 }

+ 94 - 102
src/views/old_mini/create_farm/index.vue

@@ -1,32 +1,17 @@
 <template>
     <div class="create-farm">
-        <custom-header
-            :name="paramsType === 'client' ? '新增用户' : paramsType === 'edit' ? '编辑农场' : '创建农场'"
-            :isGoBack="true"
-            @goback="backgToHome"
-        ></custom-header>
+        <custom-header :name="paramsType === 'client' ? '新增用户' : paramsType === 'edit' ? '编辑农场' : '创建农场'"
+            :isGoBack="true" @goback="backgToHome"></custom-header>
         <!-- 地图 -->
         <div class="map-container" ref="mapContainer"></div>
         <div class="farm-content">
             <div class="top-mask"></div>
             <div class="farm-filter">
-                <el-select
-                    v-model="locationVal"
-                    filterable
-                    remote
-                    reserve-keyword
-                    placeholder="搜索位置"
-                    :remote-method="remoteMethod"
-                    :loading="loading"
-                    @change="handleSearchRes"
-                    popper-class="location-search-popper"
-                >
-                    <el-option
-                        v-for="(item, index) in locationOptions.list"
-                        :key="index"
-                        :label="item.title"
-                        :value="{ value: item.point, item }"
-                    >
+                <el-select v-model="locationVal" filterable remote reserve-keyword placeholder="搜索位置"
+                    :remote-method="remoteMethod" :loading="loading" @change="handleSearchRes"
+                    popper-class="location-search-popper">
+                    <el-option v-for="(item, index) in locationOptions.list" :key="index" :label="item.title"
+                        :value="{ value: item.point, item }">
                         <span>{{ item.title }}</span>
                         <span class="sub-title">{{ item.province }}{{ item.city }}{{ item.district }}</span>
                     </el-option>
@@ -46,12 +31,8 @@
                                 <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="demo-ruleForm">
                                     <el-form-item label="农场位置" prop="address">
                                         <div class="position-wrap">
-                                            <el-input
-                                                placeholder="农场位置"
-                                                readonly
-                                                v-model="ruleForm.address"
-                                                autocomplete="off"
-                                            />
+                                            <el-input placeholder="农场位置" readonly v-model="ruleForm.address"
+                                                autocomplete="off" />
                                             <div class="draw-btn" @click="toSubPage">
                                                 {{ hasDefaultPolygon ? "点击勾选地块" : "新增地块" }}
                                             </div>
@@ -59,78 +40,41 @@
                                     </el-form-item>
                                     <el-form-item label="种植作物" prop="speciesItem">
                                         <div class="select-wrap">
-                                            <el-select
-                                                @change="changeSpecie"
-                                                class="select-item"
-                                                v-model="ruleForm.speciesItem"
-                                                placeholder="品类"
-                                            >
-                                                <el-option
-                                                    v-for="(item, index) in specieList"
-                                                    :key="index"
-                                                    :label="item.name"
-                                                    :value="{ value: item.id, ...item }"
-                                                />
+                                            <el-select @change="changeSpecie" class="select-item"
+                                                v-model="ruleForm.speciesItem" placeholder="品类">
+                                                <el-option v-for="(item, index) in specieList" :key="index"
+                                                    :label="item.name" :value="{ value: item.id, ...item }" />
                                             </el-select>
-                                            <el-select
-                                                v-model="ruleForm.typeIds"
-                                                multiple
-                                                collapse-tags
-                                                placeholder="品种"
-                                                class="period-select select-item"
-                                            >
-                                                <el-option
-                                                    v-for="(item, index) in fruitsList"
-                                                    :key="index"
-                                                    :label="item.name"
-                                                    :value="item.id"
-                                                />
+                                            <el-select v-model="ruleForm.typeIds" multiple collapse-tags
+                                                placeholder="品种" class="period-select select-item">
+                                                <el-option v-for="(item, index) in fruitsList" :key="index"
+                                                    :label="item.name" :value="item.id" />
                                             </el-select>
                                         </div>
                                     </el-form-item>
                                     <el-form-item label="联系人" prop="fzr">
                                         <div class="area-box">
-                                            <el-input
-                                                placeholder="请输入联系人姓名"
-                                                v-model="ruleForm.fzr"
-                                                autocomplete="off"
-                                                style="width: fit-content"
-                                            />
+                                            <el-input placeholder="请输入联系人姓名" v-model="ruleForm.fzr" autocomplete="off"
+                                                style="width: fit-content" />
                                         </div>
                                     </el-form-item>
                                     <el-form-item label="联系电话" prop="tel">
                                         <div class="area-box">
-                                            <el-input
-                                                placeholder="请输入联系人电话"
-                                                v-model="ruleForm.tel"
-                                                autocomplete="off"
-                                                style="width: fit-content"
-                                            />
+                                            <el-input placeholder="请输入联系人电话" v-model="ruleForm.tel" autocomplete="off"
+                                                style="width: fit-content" />
                                         </div>
                                     </el-form-item>
                                     <el-form-item label="农场面积" prop="mu">
                                         <div class="area-box">
-                                            <el-input
-                                                :placeholder="
-                                                    isFromEditMap ? '勾选地块获得农场面积' : '请输入农场的真实面积'
-                                                "
-                                                v-model="ruleForm.mu"
-                                                :readonly="isFromEditMap"
-                                                type="text"
-                                                autocomplete="off"
-                                                style="width: fit-content"
-                                                @input="handleMianjiInput"
-                                                @keypress="handleMianjiKeypress"
-                                            />
+                                            <el-input :placeholder="isFromEditMap ? '勾选地块获得农场面积' : '请输入农场的真实面积'
+                                                " v-model="ruleForm.mu" :readonly="isFromEditMap" type="text"
+                                                autocomplete="off" style="width: fit-content" @input="handleMianjiInput"
+                                                @keypress="handleMianjiKeypress" />
                                             <div class="unit">亩</div>
                                         </div>
                                     </el-form-item>
-                                    <el-form-item
-                                        v-if="paramsType !== 'farmer'"
-                                        label="客户类型"
-                                        prop="userType"
-                                        class="select-wrap client-wrap"
-                                    >
+                                    <el-form-item v-if="paramsType !== 'farmer'" label="客户类型" prop="userType"
+                                        class="select-wrap client-wrap">
                                         <el-select class="select-item" v-model="ruleForm.userType" placeholder="请选择">
                                             <el-option label="普通用户" :value="1" />
                                             <el-option label="托管用户" :value="2" />
@@ -138,12 +82,15 @@
                                         </el-select>
                                     </el-form-item>
                                     <el-form-item label="农场名称" prop="name">
-                                        <el-input
-                                            placeholder="请输入您的农场名称"
-                                            v-model="ruleForm.name"
-                                            autocomplete="off"
-                                            @input="handleFarmNameInput"
-                                        />
+                                        <el-input placeholder="请输入您的农场名称" v-model="ruleForm.name" autocomplete="off"
+                                            @input="handleFarmNameInput" />
+                                    </el-form-item>
+                                    <el-form-item v-if="paramsType === 'farmer'" label="基地类别" prop="baseType"
+                                        class="select-wrap client-wrap">
+                                        <el-select placeholder="请选择" v-model="ruleForm.baseType" autocomplete="off">
+                                            <el-option v-for="(item, index) in baseTypeList" :key="index"
+                                                :label="item.name" :value="item.id" />
+                                        </el-select>
                                     </el-form-item>
                                     <!-- <Checkbox
                                         v-if="paramsType !== 'client' && curRole == 0"
@@ -162,8 +109,8 @@
                                         paramsType === "client"
                                             ? "添加"
                                             : paramsType === "edit"
-                                            ? "确认修改"
-                                            : "立即创建"
+                                                ? "确认修改"
+                                                : "立即创建"
                                     }}
                                 </div>
                             </div>
@@ -174,13 +121,8 @@
         </div>
     </div>
     <!-- 农情采集成功弹窗 -->
-    <tip-popup
-        v-model:show="showSuccessPopup"
-        type="success"
-        text="农情采集成功"
-        @confirm="handlePopupConfirm"
-        @handleClickOverlay="handlePopupConfirm"
-    />
+    <tip-popup v-model:show="showSuccessPopup" type="success" text="农情采集成功" @confirm="handlePopupConfirm"
+        @handleClickOverlay="handlePopupConfirm" />
 </template>
 
 <script setup>
@@ -327,6 +269,7 @@ onMounted(() => {
     } else {
         getSpecieList();
     }
+    getBaseTypeList();
 });
 
 const polygonArr = ref(null);
@@ -749,7 +692,6 @@ watch(
 );
 
 const specieList = ref([]);
-
 function getSpecieList() {
     return VE_API.farm.fetchSpecieList({ point: centerPoint.value }).then(({ data }) => {
         specieList.value = data || [];
@@ -757,6 +699,14 @@ function getSpecieList() {
     });
 }
 
+const baseTypeList = ref([]);
+function getBaseTypeList() {
+    return VE_API.farm.fetchBaseTypeList().then(({ data }) => {
+        baseTypeList.value = data || [];
+        return data;
+    });
+}
+
 async function changeSpecie(v) {
     // const data = await checkExistsEnabledScheme(v.defaultContainerId);
     // if (!data) {
@@ -777,7 +727,7 @@ async function changeSpecie(v) {
 
 //判断是否存在可用方案
 async function checkExistsEnabledScheme(containerId) {
-    const { data } = await VE_API.home.existsEnabledScheme({containerId});
+    const { data } = await VE_API.home.existsEnabledScheme({ containerId });
     return data;
 }
 
@@ -822,7 +772,7 @@ function backgToHome() {
         }
     } else {
         if (fromPage && fromPage !== "details") {
-            if(route.query.type === "farmer") {
+            if (route.query.type === "farmer") {
                 router.go(-1);
             } else {
                 router.replace(`/${fromPage}`);
@@ -1016,19 +966,23 @@ function handleMianjiInput(value) {
         margin-bottom: 20px;
     }
 }
+
 .create-farm {
     position: relative;
     width: 100%;
     height: 100vh;
     overflow: hidden;
+
     .map-container {
         width: 100%;
         height: calc(100% - 320px);
     }
+
     .checkbox {
         padding: 0 12px 6px;
         font-size: 15px;
     }
+
     .farm-content {
         position: absolute;
         top: 40px;
@@ -1037,6 +991,7 @@ function handleMianjiInput(value) {
         height: calc(100% - 40px);
         pointer-events: none;
         z-index: 2;
+
         .top-mask {
             height: 100px;
             position: absolute;
@@ -1047,6 +1002,7 @@ function handleMianjiInput(value) {
             background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
         }
     }
+
     .farm-filter {
         pointer-events: all;
         margin: 12px;
@@ -1055,6 +1011,7 @@ function handleMianjiInput(value) {
         background: rgba(0, 0, 0, 0.3);
         border-radius: 20px;
         border: 1px solid rgba(255, 255, 255, 0.4);
+
         &::before {
             content: "";
             position: absolute;
@@ -1071,31 +1028,38 @@ function handleMianjiInput(value) {
                 box-shadow: none;
                 padding-left: 34px;
                 font-size: 12px;
+
                 .el-select__selected-item,
                 .el-select__placeholder,
                 .el-select__input {
                     color: rgba(255, 255, 255, 0.6);
+
                     &.is-transparent {
                         color: #ccc;
                         font-size: 12px;
                     }
                 }
             }
+
             .el-select {
                 transition: all 0.3s;
+
                 .el-input.is-focus .el-input__wrapper {
                     box-shadow: none !important;
                 }
             }
+
             .el-input {
                 .el-input__wrapper {
                     background: none;
                     box-shadow: none;
                     padding-left: 18px;
                     font-size: 11px;
+
                     .el-input__inner {
                         color: rgba(255, 255, 255, 0.6);
                     }
+
                     &.is-focus {
                         .el-input__inner {
                             color: #ccc;
@@ -1121,8 +1085,10 @@ function handleMianjiInput(value) {
         width: calc(100% - 24px);
         background: #e0f1fe;
         border-radius: 14px;
+
         .box-content {
             position: relative;
+
             &::after {
                 position: absolute;
                 right: 10px;
@@ -1133,6 +1099,7 @@ function handleMianjiInput(value) {
                 background: url("@/assets/img/home/creat-bg.png") no-repeat center / 100% 100%;
             }
         }
+
         .create-title {
             display: flex;
             align-items: center;
@@ -1140,11 +1107,13 @@ function handleMianjiInput(value) {
             color: #0089f5;
             font-size: 18px;
             font-weight: bold;
+
             .title-icon {
                 width: 18px;
                 padding-right: 10px;
             }
         }
+
         .create-content {
             background: #fff;
             border-radius: 14px;
@@ -1155,16 +1124,19 @@ function handleMianjiInput(value) {
             .create-from {
                 .select-wrap {
                     display: flex;
+
                     // width: 86%;
                     ::v-deep {
                         .el-input__wrapper {
                             background: none;
                             box-shadow: none;
                         }
+
                         .el-input__inner {
                             font-size: 14px;
                             color: rgba(0, 0, 0, 0.5);
                         }
+
                         .el-select__wrapper {
                             background: none;
                             box-shadow: none;
@@ -1172,10 +1144,12 @@ function handleMianjiInput(value) {
                             padding: 4px 2px;
                             justify-content: center;
                         }
+
                         .el-select__selection {
                             flex: none;
                             width: fit-content;
                         }
+
                         .el-select__placeholder {
                             color: #000;
                             position: static;
@@ -1183,6 +1157,7 @@ function handleMianjiInput(value) {
                             width: fit-content;
                         }
                     }
+
                     &.client-wrap {
                         ::v-deep {
                             .el-select__wrapper {
@@ -1190,25 +1165,31 @@ function handleMianjiInput(value) {
                             }
                         }
                     }
+
                     // .select-item {
                     //     width: fit-content;
                     // }
                     .period-select {
                         margin-left: 6px;
                     }
+
                     .select-item {
                         min-width: 76px;
                     }
                 }
+
                 ::v-deep {
                     .el-form-item__label {
                         color: #000;
                     }
+
                     .el-form-item__error {
                         top: 117%;
                     }
+
                     .el-form-item {
                         position: relative;
+
                         &::after {
                             content: "";
                             position: absolute;
@@ -1219,23 +1200,28 @@ function handleMianjiInput(value) {
                             background: rgba(0, 0, 0, 0.08);
                         }
                     }
+
                     .el-input__wrapper {
                         box-shadow: none;
                         padding: 1px 6px;
                     }
                 }
+
                 .area-box {
                     display: flex;
                     align-items: center;
                     width: 100%;
+
                     .unit {
                         padding-right: 10px;
                     }
                 }
+
                 .position-wrap {
                     display: flex;
                     justify-content: space-between;
                     align-items: center;
+
                     .draw-btn {
                         flex: none;
                         padding: 0 12px;
@@ -1250,11 +1236,13 @@ function handleMianjiInput(value) {
                     }
                 }
             }
+
             .create-btn {
                 display: flex;
                 align-items: center;
                 width: 100%;
                 padding-top: 10px;
+
                 .btn-item {
                     flex: 1;
                     text-align: center;
@@ -1264,16 +1252,19 @@ function handleMianjiInput(value) {
                     border-radius: 34px;
                     font-size: 16px;
                     box-sizing: border-box;
+
                     &.sencond-btn {
                         border: 1px solid rgba(153, 153, 153, 0.5);
                         color: #666666;
                     }
+
                     &.primary-btn {
                         background: linear-gradient(180deg, #76c3ff, #2199f8);
                         color: #fff;
                     }
                 }
-                .btn-item + .btn-item {
+
+                .btn-item+.btn-item {
                     margin-left: 5px;
                 }
             }
@@ -1288,6 +1279,7 @@ function handleMianjiInput(value) {
         max-width: 96vw;
         overflow-x: auto;
     }
+
     .sub-title {
         padding-left: 6px;
         font-size: 12px;

+ 138 - 63
src/views/old_mini/interactionList/index.vue

@@ -20,7 +20,8 @@
             <!-- 未上传状态内容 -->
             <div class="uploaded-content" v-show="item.isConfirmed == null || item.expanded">
                 <div class="content-wrapper">
-                    <div class="item-desc">{{ item.reason }}</div>
+                    <text-ellipsis class="item-desc" rows="2" :content="item.reason" expand-text="展开"
+                        collapse-text="收起" />
                     <div class="tip-box">如果不确定是否发生,直接上传照片即可</div>
                     <div class="example-wrapper">
                         <div class="example-header">
@@ -34,11 +35,15 @@
                             </div>
                         </div>
                     </div>
+                    <text-ellipsis class="patrol-suggestion" rows="2" :content="'巡园建议:' + item.patrolSuggestion">
+                        <template #action="{ expanded }"><span class="action-text">{{ expanded ? '收起' : '展开'
+                                }}</span></template>
+                    </text-ellipsis>
                 </div>
 
                 <!-- 展开状态内容 -->
                 <div class="expanded-content"
-                    v-show="item.isConfirmed != null && item.expanded && item.imagePaths.length > 0">
+                    v-show="item.imagePaths.length > 0">
                     <!-- 原因说明 -->
                     <div class="reason-text">上传照片({{ item.exampleImagesJson.length }}张)</div>
                     <!-- 图片展示 -->
@@ -46,10 +51,6 @@
                         <img class="uploaded-img" v-for="image in item.imagePaths" :key="image"
                             :src="base_img_url2 + image" alt="" />
                     </div>
-                    <!-- <div class="continue-upload-btn">
-                        <el-icon><Plus /></el-icon>
-                        <span>继续上传照片</span>
-                    </div> -->
                     <uploader class="upload-wrap continue-upload-btn" multiple :max-count="10"
                         :after-read="afterReadUpload">
                         <div class="upload-btn">
@@ -62,8 +63,8 @@
                 </div>
 
                 <!-- 上传按钮 -->
-                <uploader class="upload-wrap" multiple :max-count="10" :after-read="afterReadUpload"
-                    v-show="item.isConfirmed == null">
+                <uploader v-if="item.imagePaths.length === 0" @click="handleUploadClick(item)" class="upload-wrap" multiple :max-count="10"
+                    :after-read="afterReadUpload" v-show="item.isConfirmed == null">
                     <div class="upload-btn">
                         <el-icon>
                             <Plus />
@@ -72,24 +73,27 @@
                     </div>
                 </uploader>
 
-                <div class="question-wrapper" v-show="item.isConfirmed != null">
+                <div class="question-wrapper">
                     <div class="question-text">
-                        <span class="text-title">{{ item.phenologyName }}占比</span>
-                        <el-input v-model="item.replyText" type="number" style="width: 80px" />
-                        <span class="text-unit">%</span>
+                        <span class="text-title">{{ item.question }}</span>
+                        <el-input v-model="item.triggerValue" type="number" style="width: 80px">
+                            <template #suffix>
+                                <span class="text-unit">%</span>
+                            </template>
+                        </el-input>
                     </div>
-                    <div class="draw-region-btn" @click="handleDrawRegion(item)">查看发生区域</div>
+                    <!-- <div class="draw-region-btn" @click="handleDrawRegion(item)">查看发生区域</div> -->
                 </div>
 
                 <!-- 输入框 -->
                 <div class="input-wrapper">
-                    <el-input v-model="item.remark" placeholder="请输入您咨询的问题" clearable />
+                    <el-input v-model="item.replyText" placeholder="请输入您咨询的问题" clearable />
                 </div>
 
                 <!-- 按钮区域 -->
                 <div class="button-group" v-show="item.isConfirmed == null">
                     <div class="btn-not-reached" @click="handleNotReached(item)">{{ item.cancelButtonName }}</div>
-                    <div class="btn-confirm" @click="handleConfirm(item)">确认提交</div>
+                    <div class="btn-default" :class="{ 'btn-confirm': item.imagePaths.length > 0 }" @click="handleConfirm(item)">确认提交</div>
                 </div>
             </div>
 
@@ -113,11 +117,11 @@
         <div class="empty-data" v-if="!loading && listData.length === 0">暂无数据</div>
     </div>
 
-    <div class="custom-bottom-fixed-btns" :class="{ 'center-btn': false }">
+    <!-- <div class="custom-bottom-fixed-btns" :class="{ 'center-btn': false }">
         <div class="bottom-btn secondary-btn" @click="handleShowDroneConsultPopup">获取自动飞行航线</div>
         <div class="bottom-btn secondary-btn">邀请农情互动</div>
-        <!-- <div class="bottom-btn primary-btn" @click="handleSubmitAll">一键提交</div> -->
-    </div>
+        <div class="bottom-btn primary-btn" @click="handleSubmitAll">一键提交</div>
+    </div> -->
 
     <!-- 农场信息完善弹窗 -->
     <farm-info-popup :oldUser="oldUser" :expertMiniUserId="query.expertMiniUserId" v-model:show="showFarmInfoPopup" />
@@ -129,10 +133,15 @@
         title="蒂蛀虫示例图" />
     <!-- 照片上传进度 -->
     <popup v-model:show="showUploadProgressPopup" round class="upload-progress-popup">
-        <div class="upload-progress-title">
-            <span>照片上传进度</span>
-            <el-progress class="upload-progress" :percentage="50" :stroke-width="10" :format="format" />
-        </div>
+                <div class="upload-progress-title">
+                    <span>照片上传进度</span>
+                    <el-progress
+                        class="upload-progress"
+                        :percentage="uploadPercentage"
+                        :stroke-width="10"
+                        :format="format"
+                    />
+                </div>
         <div class="upload-box">
             <!-- 把已经上传成功的图片传给 upload 组件做回显,同时保持原有上传事件不变 -->
             <upload :maxCount="10" :initImgArr="initImgArr" @handleUpload="handleUploadSuccess">
@@ -140,14 +149,14 @@
         </div>
         <div class="input-box">
             <div class="input-item">
-                <span class="label-text">长势异常的果园占比</span>
-                <el-input v-model="uploadFormData.num" placeholder="请输入" type="number">
+                <span class="label-text">{{ currentItem.question }}</span>
+                <el-input class="label-input" v-model="answerValue" placeholder="请输入" type="number">
                     <template #suffix>
                         <span class="unit">%</span>
                     </template>
                 </el-input>
             </div>
-            <el-input class="input-item" v-model="uploadFormData.text" placeholder="请输入您咨询的问题" clearable />
+            <el-input class="input-item" v-model="currentItem.replyText" placeholder="请输入您咨询的问题" clearable />
         </div>
         <div class="region-tips">勾画新发生区域,精准匹配专属农事方案</div>
         <div class="region-map" ref="mapContainer" @click="handleDrawRegion">
@@ -160,12 +169,12 @@
     <more-popup ref="morePopupRef" />
 
     <tip-popup v-model:show="showTipPopup" type="success" text="2025.02.05农情报告已生成
-请点击查看" buttonText="查看报告" @confirm="handleBtn" :zIndex="9999" />
+        请点击查看" buttonText="查看报告" @confirm="handleBtn" :zIndex="9999" />
 </template>
 <script setup>
-import { ref, onMounted, onActivated } from "vue";
+import { ref, onMounted, onActivated, computed } from "vue";
 import { ElMessage } from "element-plus";
-import { Uploader, Popup } from "vant";
+import { Uploader, Popup, TextEllipsis } from "vant";
 import customHeader from "@/components/customHeader.vue";
 import upload from "@/components/upload.vue";
 import FarmInfoPopup from "@/components/popup/farmInfoPopup.vue";
@@ -202,11 +211,18 @@ const query = ref(useRoute().query);
 const morePopupRef = ref(null);
 //照片上传进度
 const showUploadProgressPopup = ref(false);
-const uploadFormData = ref({
-    num: '',
-    text: ''
+const answerValue = ref('');
+// 上传进度统计
+const totalUploadCount = ref(0); // 本次选择的总文件数(固定不随上传成功变化)
+const uploadedSuccessCount = ref(0); // 已上传成功的文件数
+const uploadPercentage = computed(() => {
+    if (!totalUploadCount.value) return 0;
+    return Math.round((uploadedSuccessCount.value / totalUploadCount.value) * 100);
 });
-const format = (percentage) => (percentage === 100 ? '上传完成' : `5/10`)
+const format = () => {
+    if (!totalUploadCount.value) return '0/0';
+    return `${uploadedSuccessCount.value}/${totalUploadCount.value}`;
+};
 
 const drawRegionMap = new DrawRegionMap();
 const mapContainer = ref(null);
@@ -231,13 +247,19 @@ const renderRegionFromSession = () => {
 const uploadFileObj = new UploadFile();
 const initImgArr = ref([]);
 const miniUserId = localStorage.getItem("MINI_USER_ID");
+//弹窗问题
 const afterReadUpload = async (data) => {
     initImgArr.value = [];
-    drawRegionMap.clearLayer && drawRegionMap.clearLayer();
-    sessionStorage.removeItem("drawRegionPolygonData");
+    // 本次上传的总数 = 选择的文件数量(固定,用于做进度的“总数”)
     if (!Array.isArray(data)) {
         data = [data];
     }
+    totalUploadCount.value = data.length;
+    uploadedSuccessCount.value = 0;
+    drawRegionMap.clearLayer && drawRegionMap.clearLayer();
+    sessionStorage.removeItem("drawRegionPolygonData");
+    answerValue.value = '';
+
     for (let file of data) {
         // 将文件上传至服务器
         let fileVal = file.file;
@@ -246,9 +268,12 @@ const afterReadUpload = async (data) => {
         let ext = getFileExt(fileVal.name);
         let key = `birdseye-look-mini/${miniUserId}/${new Date().getTime()}.${ext}`;
         let resFilename = await uploadFileObj.put(key, fileVal)
-        file.status = "done";
-        file.message = "";
         if (resFilename) {
+            file.status = "done";
+            file.message = "";
+            // 记录成功数量,用于进度条“当前成功数”
+            uploadedSuccessCount.value += 1;
+            // 记录已上传成功的图片路径,用于回显
             initImgArr.value.push(resFilename)
         } else {
             file.status = 'failed';
@@ -275,6 +300,11 @@ const afterReadUpload = async (data) => {
         }, 100);
     }
 };
+
+const currentItem = ref(null);
+const handleUploadClick = (item) => {
+    currentItem.value = item;
+};
 // 示例照片轮播
 const showExamplePopup = ref(false);
 const exampleList = ref([]);
@@ -289,7 +319,7 @@ const showExample = (list, index) => {
 const loadData = async () => {
     loading.value = true;
     try {
-        const { data } = await VE_API.home.listTriggeredByFarm({ farmId: 766 })
+        const { data } = await VE_API.home.listTriggeredByFarm({ farmId: localStorage.getItem("selectedFarmId") })
         listData.value = data.map(item => {
             // 将 exampleImagesJson 转换为数组
             if (item.exampleImagesJson) {
@@ -308,8 +338,7 @@ const loadData = async () => {
                 item.exampleImagesJson = [];
             }
             return {
-                ...item,
-                isConfirmed: false
+                ...item
             };
         });
     } catch (error) {
@@ -350,41 +379,71 @@ const handleNotReached = async (item) => {
 
 // 确认上传
 const handleConfirm = async (item) => {
-    if (!item.phenologyName) {
+    if (item.triggerValue.length === 0) {
         ElMessage.warning("请输入当前果园比例");
         return;
     }
-    if (uploadData.value.length === 0) {
+    if (item.imagePaths.length === 0 && uploadData.value.length === 0) {
         ElMessage.warning("请上传图片");
         return;
     }
     const parmas = {
         isConfirmed: true,
         farmId: localStorage.getItem("selectedFarmId"),
-        imagePaths: uploadData.value,
-        isUploadPhoto: uploadData.value.length > 0 ? true : false,
+        imagePaths: item.imagePaths.concat(uploadData.value),
+        isUploadPhoto: item.imagePaths.concat(uploadData.value).length > 0 ? true : false,
         rangeWkt: sessionStorage.getItem("drawRegionPolygonData"),
         interactionId: item.id,
-        replyText: item.replyText
+        replyText: item.replyText,
+        answerValues: [item.triggerValue]
     }
-    const { code, msg } = await VE_API.home.uploadAnswer(parmas);
+    console.log("上传数据", parmas);
+    // const { code, msg } = await VE_API.home.uploadAnswer(parmas);
+    // if (code === 0) {
+    //     ElMessage.success("上传成功");
+    //     // 清空上传数据
+    //     uploadData.value = [];
+    //     // 刷新列表
+    //     await refreshList();
+    // } else {
+    //     ElMessage.error(msg || '上传失败');
+    // }
+};
+
+const handleConfirmUpload = async () => {
+    // 校验是否有上传图片
+    if (!uploadData.value || uploadData.value.length === 0) {
+        ElMessage.warning("请先上传照片");
+        return;
+    }
+    // 校验是否填写了输入框内容(百分比)
+    if (answerValue.value === '' || answerValue.value === null || answerValue.value === undefined) {
+        ElMessage.warning("请输入占比数值");
+        return;
+    }
+    console.log("上传数据", sessionStorage.getItem("drawRegionPolygonData"));
+    const parmas = {
+        interactionId: currentItem.value.id,
+        farmId: localStorage.getItem("selectedFarmId"),
+        imagePaths: uploadData.value,
+        rangeWkt: sessionStorage.getItem("drawRegionPolygonData") || '',
+        replyText: currentItem.value.replyText,
+        answerValues: [answerValue.value],
+    }
+    const { code, msg } = await VE_API.home.uploadAnswerData(parmas);
     if (code === 0) {
-        ElMessage.success("上传成功");
+        ElMessage.success("确认成功");
         // 清空上传数据
         uploadData.value = [];
+        sessionStorage.removeItem("drawRegionPolygonData");
+        showUploadProgressPopup.value = false;
         // 刷新列表
         await refreshList();
     } else {
-        ElMessage.error(msg || '上传失败');
+        ElMessage.error(msg || '确认失败');
     }
 };
 
-const handleConfirmUpload = () => {
-    console.log("确认上传", uploadFormData.value);
-    showUploadProgressPopup.value = false;
-    sessionStorage.removeItem("drawRegionPolygonData");
-};
-
 // 切换展开/收起
 const toggleExpand = (item) => {
     item.expanded = !item.expanded;
@@ -554,7 +613,8 @@ const handleSubmitAll = () => {
                     color: #3C3C3C;
                     margin-bottom: 10px;
                 }
-                .tip-box{
+
+                .tip-box {
                     font-size: 12px;
                     color: #2199F8;
                     padding: 3px 5px;
@@ -606,6 +666,15 @@ const handleSubmitAll = () => {
                         }
                     }
                 }
+
+                .patrol-suggestion {
+                    color: rgba(60, 60, 60, 0.4);
+                    margin-top: 10px;
+
+                    .action-text {
+                        color: #727272;
+                    }
+                }
             }
 
             .upload-wrap {
@@ -642,7 +711,7 @@ const handleSubmitAll = () => {
             gap: 12px;
 
             .btn-not-reached,
-            .btn-confirm {
+            .btn-default {
                 flex: 1;
                 text-align: center;
                 border-radius: 4px;
@@ -656,17 +725,17 @@ const handleSubmitAll = () => {
                 border: 1px solid rgba(88, 88, 88, 0.2);
             }
 
-            .btn-confirm {
+            .btn-default {
                 background: #F1F1F1;
                 color: #999999;
                 border: 1px solid #F1F1F1;
             }
 
-            // .btn-confirm {
-            //     background: #2199f8;
-            //     color: #ffffff;
-            //     border: 1px solid #2199f8;
-            // }
+            .btn-confirm {
+                background: #2199f8;
+                color: #ffffff;
+                border: 1px solid #2199f8;
+            }
         }
 
         .proportion-info {
@@ -765,6 +834,11 @@ const handleSubmitAll = () => {
 
         .upload-progress {
             width: 55%;
+            ::v-deep{
+                .el-progress__text{
+                    min-width: fit-content;
+                }
+            }
         }
     }
 
@@ -776,10 +850,11 @@ const handleSubmitAll = () => {
         .input-item {
             display: flex;
             align-items: center;
+            justify-content: space-between;
             gap: 6px;
 
-            .label-text {
-                width: 220px;
+            .label-input {
+                width: 140px;
             }
         }