feat：对接果园列表和创建农场接口，修改农事详情UI

src/api/modules/farm.js

@@ -13,8 +13,8 @@ module.exports = {
         url: config.base_dev_url + "v2/farm/createFarm",
         type: "post",
     },
-    fetchFarmList: {
-        url: config.base_dev_url + "farm/listByUser",
+    userFarmSelectOption: {
+        url: config.base_dev_url + "v2/farm/userFarmSelectOption",
         type: "get",
     }
 }

src/api/modules/monitor.js

@@ -0,0 +1,8 @@
+const config = require("../config")
+
+module.exports = {
+    getCountByStatusAndFarmId: {
+        url: config.base_dev_url + "z_farm_work_record/getCountByStatusAndFarmId",
+        type: "get",
+    }
+}

src/components/detailDialog.vue

@@ -65,7 +65,7 @@
             </div>
 
             <div class="bottom-btn">
-                <div class="btn-item secondary-btn" @click="toPage">咨询专家</div>
+                <div class="btn-item secondary-btn" @click="toPage">转发</div>
                 <div class="btn-item primary-btn" @click="triggerClick">触发农事</div>
             </div>
         </div>

src/components/farmSteps.vue

@@ -28,7 +28,7 @@ const props = defineProps({
 
 const steps = ref([
     { label: "触发农事" },
-    { label: "专家确认" },
+    { label: "农事确认" },
     { label: "农事执行" },
     { label: "农事复核" },
 ]);

src/components/popup/activeUploadPopup.vue

@@ -12,14 +12,7 @@
                 {{ problemTitle }}
             </div>
             <div class="date-input">
-                <el-time-select
-                    size="large"
-                    v-model="uploadDate"
-                    start="08:30"
-                    step="00:15"
-                    end="18:30"
-                    placeholder="请选择时间"
-                />
+                <el-date-picker v-model="uploadDate" size="large" style="width: 100%" type="date" placeholder="请选择日期" />
             </div>
         </div>
         <div class="tips-text">上传照片，专家诊断更准确哦~</div>

src/components/weatherInfo.vue

@@ -9,24 +9,24 @@
                 <div class="address-select flex-center" v-else>
                     <el-dropdown class="select-garden" trigger="click" popper-class="select-garden-popper">
                         <div class="el-dropdown-link flex-center">
-                            <span :class="farmName === '从化荔博园' ? 'ellipsis-l1' : ''">广州市番禺区</span>
+                            <span :class="farmName === '从化荔博园' ? 'ellipsis-l1' : ''">{{ farmName }}</span>
                             <div class="default-text" v-show="farmName === '从化荔博园'">默认</div>
                             <el-icon class="el-icon--right"><arrow-down /></el-icon>
                         </div>
                         <template #dropdown>
                             <el-dropdown-menu>
                                 <el-dropdown-item
-                                    @click="handleCommand(item.name)"
+                                    @click="handleCommand(item.id, item.name)"
                                     v-for="item in farmList"
-                                    :key="item.organId"
-                                    :class="{ 'selected-active-garden': farmName === item.name }"
+                                    :key="item.id"
+                                    :class="{ 'selected-active-garden': farmId === item.id }"
                                 >
                                     {{ item.name }}
                                 </el-dropdown-item>
                             </el-dropdown-menu>
                         </template>
                     </el-dropdown>
-                    <div class="add-garden">新增农场</div>
+                    <div class="add-garden" @click="handleAddGarden">新增农场</div>
                 </div>
                 <div class="temperature flex-center">
                     <div class="temperature-number">26</div>
@@ -56,8 +56,7 @@
 <script setup>
 import { onMounted, ref } from "vue";
 import weatherChart from "./weatherChart.vue";
-import { useStore } from "vuex";
-const store = useStore();
+import { useRouter } from "vue-router";
 const props = defineProps({
     isGarden: {
         type: Boolean,
@@ -65,10 +64,12 @@ const props = defineProps({
     }
 });
 // 定义emit事件
-const emit = defineEmits(['weatherExpanded']);
-
-const handleCommand = (command) => {
-    farmName.value = command;
+const emit = defineEmits(['weatherExpanded','changeGarden']);
+const router = useRouter();
+const handleCommand = (id, name) => {
+    farmName.value = name;
+    farmId.value = id;
+    emit('changeGarden',id);
 };
 
 const isExpanded = ref(false);
@@ -81,25 +82,26 @@ const toggleExpand = () => {
     emit('weatherExpanded',isExpanded.value);
 };
 
-const miniUserId = store.state.home.miniUserId;
-
 onMounted(() => {
-    // getFarmList()
+    getFarmList()
 });
 
 const farmId = ref(null);
-const containerId = ref(null);
 const farmName = ref("");
 const farmList = ref([]);
 // 获取农场列表
 function getFarmList() {
-    VE_API.farm.fetchFarmList({userId: miniUserId, show3dFarm: false}).then(({data}) => {
+    VE_API.farm.userFarmSelectOption().then(({data}) => {
         farmList.value = data || []
         farmName.value = data[0].name
-        farmId.value = data[0].organId
-        containerId.value = data[0].containerId
+        farmId.value = data[0].id
+        emit('changeGarden',farmId.value);
     })
 }
+
+const handleAddGarden = () => {
+    router.push("/create_farm?type=add")
+}
 </script>
 
 <style lang="scss" scoped>

src/router/globalRoutes.js

@@ -254,4 +254,10 @@ export default [
         name: "AgriculturalPlan",
         component: () => import("@/views/old_mini/plan/index.vue"),
     },
+    // 农事管理
+    {
+        path: "/agri_services_manage",
+        name: "AgriServicesManage",
+        component: () => import("@/views/old_mini/agri_services/index.vue"),
+    },
 ];

src/views/old_mini/agri_services/index.vue

@@ -1,6 +1,7 @@
 <template>
-    <div class="agri-services" :style="{ height: `calc(100vh - ${tabBarHeight}px - 50px)` }">
-        <tabs v-model:active="active" class="tabs">
+    <div class="agri-services" :style="{ height: type !== 'manage' ? `calc(100vh - ${tabBarHeight}px - 50px)` : '100vh' }">
+        <custom-header name="农事管理" v-if="type === 'manage'"></custom-header>
+        <tabs v-model:active="active" class="tabs" v-if="type !== 'manage'">
             <tab title="农事管理">
                 <farm-dynamics />
             </tab>
@@ -8,24 +9,40 @@
                 <services-hall />
             </tab>
         </tabs>
+        <div v-else class="farm-dynamics-container">
+            <farm-dynamics  />
+        </div>
     </div>
 </template>
 
 <script setup>
-import { ref, computed } from "vue";
+import { ref, computed, onMounted } from "vue";
+import { useRoute } from "vue-router";
 import { useStore } from "vuex";
 import { Tab, Tabs } from "vant";
 import servicesHall from "./components/servicesHall.vue";
 import farmDynamics from "./components/farmDynamics.vue";
+import customHeader from "@/components/customHeader.vue";
 
+const route = useRoute();
 const store = useStore();
 const tabBarHeight = computed(() => store.state.home.tabBarHeight);
 const active = ref(0);
+
+const type = ref(route.query.type);
+
 </script>
 <style lang="scss" scoped>
 .agri-services {
     width: 100%;
     height: 100vh;
+    .farm-dynamics-container {
+        ::v-deep{
+            .task-content{
+                height: calc(100% - 80px);
+            }
+        }
+    }
     .tabs {
         ::v-deep {
             .van-tabs__wrap {

src/views/old_mini/create_farm/index.vue

@@ -85,31 +85,31 @@
                                             </el-select>
                                         </div>
                                     </el-form-item>
-                                    <el-form-item label="联系人" prop="userName">
+                                    <el-form-item label="联系人" prop="fzr">
                                         <div class="area-box">
                                             <el-input
                                                 placeholder="请输入联系人姓名"
-                                                v-model="ruleForm.userName"
+                                                v-model="ruleForm.fzr"
                                                 autocomplete="off"
                                                 style="width: fit-content"
                                             />
                                         </div>
                                     </el-form-item>
-                                    <el-form-item label="联系电话" prop="phone">
+                                    <el-form-item label="联系电话" prop="tel">
                                         <div class="area-box">
                                             <el-input
                                                 placeholder="请输入联系人电话"
-                                                v-model="ruleForm.phone"
+                                                v-model="ruleForm.tel"
                                                 autocomplete="off"
                                                 style="width: fit-content"
                                             />
                                         </div>
                                     </el-form-item>
-                                    <el-form-item label="农场面积" prop="mianji">
+                                    <el-form-item label="农场面积" prop="mu">
                                         <div class="area-box">
                                             <el-input
                                                 :placeholder="isFromEditMap ? '勾选地块获得农场面积' : '请输入亩数'"
-                                                v-model="ruleForm.mianji"
+                                                v-model="ruleForm.mu"
                                                 :readonly="isFromEditMap"
                                                 type="text"
                                                 autocomplete="off"
@@ -266,7 +266,7 @@ onMounted(() => {
     // 不再初始化时绘制默认地块，等待用户点击"新增地块"按钮
     // 清空地块和面积数据
     polygonArr.value = null;
-    ruleForm.mianji = '';
+    ruleForm.mu = '';
 
     getSpecieList();
 });
@@ -292,7 +292,7 @@ onActivated(() => {
         
         // 不再自动生成默认地块，等待用户点击"新增地块"
         polygonArr.value = null;
-        ruleForm.mianji = '';
+        ruleForm.mu = '';
         
         return; // 直接返回，不执行下面的逻辑
     }
@@ -312,7 +312,7 @@ onActivated(() => {
             if (polygonData.isConfirmed) {
                 // 用户点击了"确认"按钮，锁定输入框并显示精确面积
                 isFromEditMap.value = true;
-                ruleForm.mianji = polygonData.mianji;
+                ruleForm.mu = polygonData.mianji;
             } else {
                 // 用户点击了"取消"，不锁定输入框，面积保持原样
                 isFromEditMap.value = false;
@@ -326,7 +326,7 @@ onActivated(() => {
             // 用户在编辑页面删除了所有地块
             // 重置所有状态
             polygonArr.value = null;
-            ruleForm.mianji = '';
+            ruleForm.mu = '';
             isFromEditMap.value = false;
             hasDefaultPolygon.value = false;
         }
@@ -391,12 +391,12 @@ const handleSearchRes = (v) => {
 const ruleFormRef = ref(null);
 const ruleForm = reactive({
     address: "",
-    mianji: "",
+    mu: "",
     speciesItem: null,
     phenologyId: "",
     name: "",
-    userName: "",
-    phone: "",
+    fzr: "",
+    tel: "",
 });
 // 自定义验证规则：验证面积必须是大于0的数字
 const validateMianji = (rule, value, callback) => {
@@ -416,44 +416,50 @@ const validateMianji = (rule, value, callback) => {
 
 const rules = reactive({
     address: [{ required: true, message: "请选择农场位置", trigger: "blur" }],
-    mianji: [
+    mu: [
         { required: true, message: "请输入农场面积", trigger: "blur" },
         { validator: validateMianji, trigger: ["blur", "change"] }
     ],
     speciesItem: [{ required: true, message: "请选择品类", trigger: "blur" }],
     phenologyId: [{ required: true, message: "请选择物候期", trigger: "blur" }],
     name: [{ required: true, message: "请输入您的农场名称", trigger: "blur" }],
-    userName: [{ required: true, message: "请输入联系人姓名", trigger: "blur" }],
-    phone: [{ required: true, message: "请输入联系人电话", trigger: "blur" }],
+    fzr: [{ required: true, message: "请输入联系人姓名", trigger: "blur" }],
+    tel: [
+        { required: true, message: "请输入联系人电话", trigger: "blur" },
+        { 
+            pattern: /^1[3-9]\d{9}$/, 
+            message: "请输入正确的手机号码", 
+            trigger: "blur" 
+        }
+    ],
 });
 
 const submitForm = (formEl) => {
-    router.replace("/home?reload=true&showSuccess=true");
-    // if (!formEl) return;
-    // formEl.validate((valid) => {
-    //     if (valid) {
-    //         const params = {
-    //             ...ruleForm,
-    //             wkt: centerPoint.value,
-    //             speciesId: ruleForm.speciesItem?.id,
-    //             containerId: ruleForm.speciesItem?.defaultContainerId,
-    //             geom: polygonArr.value,
-    //         };
-    //         VE_API.farm.saveFarm(params).then((res) => {
-    //             ElMessage.success("创建成功");
-    //             // 重置表单和地块数据
-    //             ruleFormRef.value.resetFields();
-    //             store.commit("home/SET_FARM_POLYGON", null);
-    //             polygonArr.value = null;
-    //             isFromEditMap.value = false;
-    //             // 返回首页并显示成功弹窗
-    //             router.replace("/home?reload=true&showSuccess=true");
-    //         });
-    //         console.log("submit!", params);
-    //     } else {
-    //         console.log("error submit!");
-    //     }
-    // });
+    if (!formEl) return;
+    formEl.validate((valid) => {
+        if (valid) {
+            const params = {
+                ...ruleForm,
+                wkt: centerPoint.value,
+                speciesId: ruleForm.speciesItem?.id,
+                containerId: ruleForm.speciesItem?.defaultContainerId,
+                geom: polygonArr.value,
+            };
+            VE_API.farm.saveFarm(params).then((res) => {
+                ElMessage.success("创建成功");
+                // 重置表单和地块数据
+                ruleFormRef.value.resetFields();
+                store.commit("home/SET_FARM_POLYGON", null);
+                polygonArr.value = null;
+                isFromEditMap.value = false;
+                // 返回首页并显示成功弹窗
+                router.replace("/home?reload=true&showSuccess=true");
+            });
+            console.log("submit!", params);
+        } else {
+            console.log("error submit!");
+        }
+    });
 };
 
 const resetForm = (formEl) => {
@@ -464,7 +470,11 @@ const resetForm = (formEl) => {
     polygonArr.value = null;
     isFromEditMap.value = false;
     hasDefaultPolygon.value = false; // 重置默认地块状态
-    router.replace("/home?reload=true");
+    if(route.query.isFromHome) {
+        router.replace("/home?reload=true");
+        return;
+    }
+    router.go(-1)
 };
 
 const centerPoint = ref(null);
@@ -499,7 +509,7 @@ function toSubPage() {
     if (polygonArr.value) {
         const polygonData = {
             geometryArr: polygonArr.value,
-            mianji: ruleForm.mianji || '',  // 保存用户输入的面积，如果没有输入则为空
+            mianji: ruleForm.mu || '',  // 保存用户输入的面积，如果没有输入则为空
             isConfirmed: false,  // 标记：还未从编辑页面确认返回
         };
         store.commit("home/SET_FARM_POLYGON", polygonData);
@@ -555,7 +565,12 @@ function getPhenology(containerId) {
 }
 
 function backgToHome() {
-    router.replace("/home")
+    ruleFormRef.value?.resetFields();
+    if(route.query.isFromHome) {
+        router.replace("/home?reload=true");
+        return;
+    }
+    router.go(-1)
 }
 
 // 处理面积按键输入 - 只允许数字和小数点
@@ -576,7 +591,7 @@ function handleMianjiKeypress(event) {
     }
     
     // 如果已经有小数点，不允许再输入小数点
-    const currentValue = ruleForm.mianji || '';
+    const currentValue = ruleForm.mu || '';
     if (char === '.' && currentValue.includes('.')) {
         event.preventDefault();
         return;
@@ -613,7 +628,7 @@ function handleMianjiInput(value) {
     
     // 更新输入框的值（如果被过滤了）
     if (filteredValue !== value) {
-        ruleForm.mianji = filteredValue;
+        ruleForm.mu = filteredValue;
         return;
     }
     
@@ -656,6 +671,11 @@ function handleMianjiInput(value) {
 </script>
 
 <style lang="scss" scoped>
+::v-deep{
+    .el-form-item--default{
+        margin-bottom: 20px;
+    }
+}
 .create-farm {
     position: relative;
     width: 100%;

src/views/old_mini/mine/index.vue

@@ -121,10 +121,10 @@ const cellItems = ref([
         title: "我的农场",
         path: "/my_farm",
     },
-    // {
-    //     title: "认证农资/专家",
-    //     path: "/authentication",
-    // },
+    {
+        title: "认证农资",
+        path: "/register?identity=NZ&role=2",
+    },
     // {
     //     title: "联系客服",
     //     path: "/customer-service",

src/views/old_mini/mine/pages/register.vue

@@ -248,7 +248,7 @@ const pageName = ref("");
 const pageType = ref("");
 const identityTyepe = {
     EXPERT: "专家",
-    NZ: "农资农服",
+    NZ: "农资",
 };
 // NF: "农服",
 

src/views/old_mini/modify_work/completedWork.vue

@@ -1,14 +1,20 @@
 <template>
     <div class="completed-work">
         <custom-header name="农事详情"></custom-header>
-        <div class="work-content" :class="{'hasBottom': curRole == 0}">
+        <div class="work-content" :class="{ hasBottom: curRole == 0 }">
             <div class="step-wrap" v-show="query.status !== 'warning'">
                 <farm-steps :currentStep="currentStep" />
             </div>
-            <div class="content-status" :class="{'warning': query.status === 'warning'}" v-if="currentStep !== 0 || query.status === 'warning'">
+            <div
+                class="content-status"
+                :class="{ warning: query.status === 'warning' }"
+                v-if="currentStep !== 0 || query.status === 'warning'"
+            >
                 <div class="status-l" v-if="status === 0">
-                    <div class="stauts-text">{{ query.status === 'warning' ? '已过期' : '待执行' }}</div>
-                    <div class="stauts-sub-text" v-if="query.status !== 'warning'">距离预计执行时间还差 <span class="time-text">3</span> 天</div>
+                    <div class="stauts-text">{{ query.status === "warning" ? "已过期" : "待执行" }}</div>
+                    <div class="stauts-sub-text" v-if="query.status !== 'warning'">
+                        距离预计执行时间还差 <span class="time-text">3</span> 天
+                    </div>
                     <div class="stauts-sub-text" v-else>该农事触发但未执行</div>
                 </div>
                 <div class="status-l" v-if="status === 1">
@@ -23,25 +29,58 @@
                 </template>
             </div>
             <div class="work-wrap">
-                <div class="box-wrap executor-info">
+                <div class="box-wrap executor-info" v-if="query.status === 'warning' || curRole == 1">
                     <div class="executor-title">执行人</div>
                     <div class="executor-content">
-                        <div class="executor-avatar">
-                            <img src="https://birdseye-img-ali-cdn.sysuimars.com/16926861-1e20-4cbd-8bf2-90208db5a2d0/806080da-1a30-4b5b-b64b-b22e722c6cb6/DJI_202509010800_001_806080da-1a30-4b5b-b64b-b22e722c6cb6/DJI_20250901080536_0045_V_code-ws0fsmge97gh.jpeg" alt="执行人" />
-                        </div>
-                        <div class="executor-details">
-                            <div class="org-name">
-                                <span class="name">河南农资农服组织</span>
-                                <span class="rating">5.0分</span>
+                        <div class="executor-info">
+                            <div class="executor-avatar">
+                                <img
+                                    src="https://birdseye-img-ali-cdn.sysuimars.com/16926861-1e20-4cbd-8bf2-90208db5a2d0/806080da-1a30-4b5b-b64b-b22e722c6cb6/DJI_202509010800_001_806080da-1a30-4b5b-b64b-b22e722c6cb6/DJI_20250901080536_0045_V_code-ws0fsmge97gh.jpeg"
+                                    alt="执行人"
+                                />
                             </div>
-                            <div class="service-info">
-                                <div class="service-item">服务品种: <span>荔枝、龙眼</span></div>
-                                <div class="service-item">服务设备: <span>无人机、水肥一体机、水肥一体机水肥</span></div>
+                            <div class="executor-details">
+                                <div class="org-name">
+                                    <span class="name">河南农资农服组织</span>
+                                    <span class="rating">5.0分</span>
+                                </div>
+                                <div class="service-info">
+                                    <div class="service-item">服务品种: <span>荔枝、龙眼</span></div>
+                                    <div class="service-item">
+                                        服务设备: <span>无人机、水肥一体机、水肥一体机水肥</span>
+                                    </div>
+                                </div>
                             </div>
-                            <div class="contact-buttons">
-                                <button class="contact-btn">电话联系</button>
-                                <button class="contact-btn">在线联系</button>
+                        </div>
+                        <div class="farm-info">
+                            <div class="info-title-wrap">
+                                <div class="sub-title">肥药费用</div>
+                                <div class="info-more">1582<span class="unit-text">元</span></div>
                             </div>
+                            <div class="info-content-wrap">
+                                <price-table>
+                                    <template #bottomContent>
+                                        <div class="price-bottom">
+                                            <div class="info-title-wrap">
+                                                <div class="sub-title">服务费用</div>
+                                                <div class="info-more">1582<span class="unit-text">元</span></div>
+                                            </div>
+                                            <div class="price-info">
+                                                <div class="info-l">执行方式<span class="main-text">无人机</span></div>
+                                                <div class="info-c">亩单价<span class="main-text">500元/亩</span></div>
+                                                <div class="info-r">亩数<span class="main-text">10亩</span></div>
+                                            </div>
+                                            <div class="price-total">
+                                                报价合计：<span class="main-val">1258</span>元
+                                            </div>
+                                        </div>
+                                    </template>
+                                </price-table>
+                            </div>
+                        </div>
+                        <div class="contact-buttons">
+                            <button class="contact-btn">电话联系</button>
+                            <button class="contact-btn">在线联系</button>
                         </div>
                     </div>
                 </div>
@@ -173,15 +212,20 @@
                     </div>
                 </div>
             </div>
-            <div class="fixed-btn-wrap" :class="{'center': currentStep == 0}" v-if="curRole === 0 && query.status !== 'warning'">
-                <div class="fixed-btn expert" v-if="currentStep == 0">提醒专家确认</div>
-                <div class="fixed-btn orange" v-if="currentStep == 1" @click="handleDemand">发起需求</div>
-                <div class="fixed-btn" v-if="currentStep == 1" @click="handleOk">{{ status === 0 ? "我已完成" : "立即复核" }}</div>
+            <div
+                class="fixed-btn-wrap"
+                :class="{ center: currentStep == 0 || (currentStep == 1 && curRole == 1) }"
+                v-if="query.status !== 'warning'"
+            >
+                <div class="fixed-btn expert" v-if="currentStep == 0">提醒农事确认</div>
+                <div class="fixed-btn expert" v-if="currentStep == 1 && curRole == 1">确认对方完成</div>
+                <div class="fixed-btn orange" v-if="currentStep == 1 && curRole == 0" @click="handleDemand">发起需求</div>
+                <div class="fixed-btn" v-if="currentStep == 1 && curRole == 0" @click="handleOk">我已完成</div>
             </div>
         </div>
     </div>
     <!-- 报价弹窗 -->
-     <offer-popup :showPopup="showPopup" :executionData="executionData"></offer-popup>
+    <offer-popup :showPopup="showPopup" :executionData="executionData"></offer-popup>
 </template>
 
 <script setup>
@@ -192,14 +236,15 @@ import { useStore } from "vuex";
 import offerPopup from "@/components/popup/offerPopup.vue";
 import { useRouter, useRoute } from "vue-router";
 import farmSteps from "@/components/farmSteps.vue";
+import priceTable from "../agri_work/components/priceTable.vue";
 
 const router = useRouter();
 const store = useStore();
 const query = useRoute().query;
 // 角色
 // const curRole = store.state.app.curRole
-const currentStep = ref(0);
-const curRole = 0
+const currentStep = ref(1);
+const curRole = 0;
 
 // 0：执行， 1： 复核
 const status = ref(0);
@@ -207,17 +252,17 @@ const showPopup = ref(false);
 const executionData = ref({});
 
 // 我已完成
-const handleOk = () =>{
-    if(status.value === 0){
+const handleOk = () => {
+    if (status.value === 0) {
         showPopup.value = !showPopup.value;
-    }else{
+    } else {
         console.log("立即复核");
     }
-}
+};
 
 const handleDemand = () => {
     router.push("/share_page");
-}
+};
 
 const prescriptioData = ref({
     prescriptionList: [
@@ -249,10 +294,10 @@ onMounted(() => {
     newFarmMap.initMap(point, areaRef.value, false);
 
     getAreaList(() => {
-        console.log('areaList.value', areaList.value);
+        console.log("areaList.value", areaList.value);
         newFarmMap.initArea(areaList.value);
     });
-})
+});
 
 // 农场分区列表
 const areaList = ref([]);
@@ -260,105 +305,105 @@ const regionId = ref(null);
 const getAreaList = (callback) => {
     const data = [
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 2,
-            "isGenerateReport": 1,
-            "name": "分区2",
-            "pointCount": 131,
-            "pointWkt": "POINT (113.6142086995688 23.585836479509055)",
-            "regionCode": "LBY-MR-2",
-            "wkt": "MULTIPOLYGON (((113.61348988377155 23.58617369800422, 113.61395837633405 23.58622555407246, 113.61414076654707 23.58622555407246, 113.61436964832843 23.5862774101407, 113.61478628474084 23.586468741036786, 113.61491681896747 23.58652417337007, 113.61512424307672 23.586449071517652, 113.61491503077356 23.585742756367924, 113.61479880177082 23.585596129050916, 113.61473800497858 23.585451289764112, 113.61438931780664 23.585286780835393, 113.61410858003889 23.585299297865365, 113.61385645239149 23.585249229909184, 113.61378135053907 23.585288569029306, 113.61357571446003 23.585283204611276, 113.61347200232355 23.585342213209604, 113.61338080721704 23.585506721974614, 113.61335934954492 23.585665866485304, 113.61342193444922 23.58616296916816, 113.61348988377155 23.58617369800422)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 2,
+            isGenerateReport: 1,
+            name: "分区2",
+            pointCount: 131,
+            pointWkt: "POINT (113.6142086995688 23.585836479509055)",
+            regionCode: "LBY-MR-2",
+            wkt: "MULTIPOLYGON (((113.61348988377155 23.58617369800422, 113.61395837633405 23.58622555407246, 113.61414076654707 23.58622555407246, 113.61436964832843 23.5862774101407, 113.61478628474084 23.586468741036786, 113.61491681896747 23.58652417337007, 113.61512424307672 23.586449071517652, 113.61491503077356 23.585742756367924, 113.61479880177082 23.585596129050916, 113.61473800497858 23.585451289764112, 113.61438931780664 23.585286780835393, 113.61410858003889 23.585299297865365, 113.61385645239149 23.585249229909184, 113.61378135053907 23.585288569029306, 113.61357571446003 23.585283204611276, 113.61347200232355 23.585342213209604, 113.61338080721704 23.585506721974614, 113.61335934954492 23.585665866485304, 113.61342193444922 23.58616296916816, 113.61348988377155 23.58617369800422)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 9,
-            "isGenerateReport": 1,
-            "name": "分区9",
-            "pointCount": 63,
-            "pointWkt": "POINT (113.61725048541882 23.585262743588892)",
-            "regionCode": "LBY-MR-9",
-            "wkt": "MULTIPOLYGON (((113.61697301904715 23.585749021838886, 113.617320420354 23.585742359348075, 113.61752600578478 23.585708095109652, 113.61772112158744 23.5856785897931, 113.61789720170187 23.58559102562808, 113.61787340709186 23.585330236701996, 113.61793812843106 23.58526932250014, 113.61795526055036 23.585167481569073, 113.61793146594025 23.585022810339957, 113.61790671954574 23.58491525870246, 113.61779345720193 23.58473346788171, 113.61779821612386 23.584601169849783, 113.61771921801855 23.584509798547092, 113.61763260563801 23.584517412822354, 113.61755741467023 23.584640193010298, 113.61736515422085 23.584823887399946, 113.61726902399624 23.58487623554194, 113.61709484745067 23.584864814129187, 113.61707105284067 23.584962847922696, 113.61699586187265 23.585023762124397, 113.61689877986377 23.585071351344393, 113.61675981934107 23.58515796372515, 113.61663132844662 23.585192227963518, 113.61646000725422 23.58524076896813, 113.61634484134152 23.585320718857897, 113.61628392713976 23.585360693802862, 113.6162163504473 23.585397813394497, 113.61601552393823 23.585480618637533, 113.61596127222741 23.585499654325552, 113.61597174185577 23.585538677485918, 113.61598125969975 23.585561520311693, 113.61608690776846 23.585591025628073, 113.61610689524092 23.585611013100582, 113.61619350762157 23.58557960421532, 113.6162886860618 23.58552820785755, 113.61632104673151 23.585492040050294, 113.61638196093314 23.585453968674216, 113.61646095903859 23.585480618637543, 113.6164771393734 23.585505365031985, 113.61649617506146 23.585564375664962, 113.61648760900198 23.58561006131614, 113.61645048941011 23.58567192730245, 113.61649807863034 23.585676686224392, 113.61662466595578 23.585595784550236, 113.61671698904298 23.585495847187836, 113.61676553004737 23.585587218490588, 113.61681787818966 23.585559616742817, 113.61689211737293 23.5854558722431, 113.61695588692798 23.585499654325556, 113.61697301904715 23.585749021838886)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 9,
+            isGenerateReport: 1,
+            name: "分区9",
+            pointCount: 63,
+            pointWkt: "POINT (113.61725048541882 23.585262743588892)",
+            regionCode: "LBY-MR-9",
+            wkt: "MULTIPOLYGON (((113.61697301904715 23.585749021838886, 113.617320420354 23.585742359348075, 113.61752600578478 23.585708095109652, 113.61772112158744 23.5856785897931, 113.61789720170187 23.58559102562808, 113.61787340709186 23.585330236701996, 113.61793812843106 23.58526932250014, 113.61795526055036 23.585167481569073, 113.61793146594025 23.585022810339957, 113.61790671954574 23.58491525870246, 113.61779345720193 23.58473346788171, 113.61779821612386 23.584601169849783, 113.61771921801855 23.584509798547092, 113.61763260563801 23.584517412822354, 113.61755741467023 23.584640193010298, 113.61736515422085 23.584823887399946, 113.61726902399624 23.58487623554194, 113.61709484745067 23.584864814129187, 113.61707105284067 23.584962847922696, 113.61699586187265 23.585023762124397, 113.61689877986377 23.585071351344393, 113.61675981934107 23.58515796372515, 113.61663132844662 23.585192227963518, 113.61646000725422 23.58524076896813, 113.61634484134152 23.585320718857897, 113.61628392713976 23.585360693802862, 113.6162163504473 23.585397813394497, 113.61601552393823 23.585480618637533, 113.61596127222741 23.585499654325552, 113.61597174185577 23.585538677485918, 113.61598125969975 23.585561520311693, 113.61608690776846 23.585591025628073, 113.61610689524092 23.585611013100582, 113.61619350762157 23.58557960421532, 113.6162886860618 23.58552820785755, 113.61632104673151 23.585492040050294, 113.61638196093314 23.585453968674216, 113.61646095903859 23.585480618637543, 113.6164771393734 23.585505365031985, 113.61649617506146 23.585564375664962, 113.61648760900198 23.58561006131614, 113.61645048941011 23.58567192730245, 113.61649807863034 23.585676686224392, 113.61662466595578 23.585595784550236, 113.61671698904298 23.585495847187836, 113.61676553004737 23.585587218490588, 113.61681787818966 23.585559616742817, 113.61689211737293 23.5854558722431, 113.61695588692798 23.585499654325556, 113.61697301904715 23.585749021838886)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 29,
-            "isGenerateReport": 1,
-            "name": "分区8",
-            "pointCount": 40,
-            "pointWkt": "POINT (113.61587084394066 23.58618878122994)",
-            "regionCode": "LBY-MR-8",
-            "wkt": "MULTIPOLYGON (((113.61516876894466 23.58617727723074, 113.6153952936325 23.58616014511155, 113.61551426668275 23.586215348606817, 113.61564275757719 23.586290539574595, 113.61565798612749 23.58640951262483, 113.61577695917796 23.58637905552401, 113.61584168051715 23.586392380505654, 113.615912112563 23.58637048946448, 113.61613483011318 23.586200120056528, 113.6162547549478 23.586365730542376, 113.61623762282863 23.586448535785365, 113.61615196223237 23.586476137533136, 113.61634435485792 23.586946782901485, 113.61654695275945 23.586932042261843, 113.61651364030526 23.58667220511998, 113.61648127963554 23.586552280285296, 113.61640894402115 23.58641903046899, 113.61636135480092 23.586292443143435, 113.6163308977001 23.586121121951034, 113.61631471736528 23.58605735239606, 113.61618622647107 23.586071629162152, 113.61612911940675 23.58603260600161, 113.61610342122786 23.58595265611185, 113.61601109814079 23.585864140162432, 113.61585310193013 23.585803225960632, 113.61557898802205 23.585730890346124, 113.6153714990225 23.585723276070855, 113.61520493675204 23.585882224066058, 113.61516591359151 23.586056400611785, 113.61516876894466 23.58617727723074)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 29,
+            isGenerateReport: 1,
+            name: "分区8",
+            pointCount: 40,
+            pointWkt: "POINT (113.61587084394066 23.58618878122994)",
+            regionCode: "LBY-MR-8",
+            wkt: "MULTIPOLYGON (((113.61516876894466 23.58617727723074, 113.6153952936325 23.58616014511155, 113.61551426668275 23.586215348606817, 113.61564275757719 23.586290539574595, 113.61565798612749 23.58640951262483, 113.61577695917796 23.58637905552401, 113.61584168051715 23.586392380505654, 113.615912112563 23.58637048946448, 113.61613483011318 23.586200120056528, 113.6162547549478 23.586365730542376, 113.61623762282863 23.586448535785365, 113.61615196223237 23.586476137533136, 113.61634435485792 23.586946782901485, 113.61654695275945 23.586932042261843, 113.61651364030526 23.58667220511998, 113.61648127963554 23.586552280285296, 113.61640894402115 23.58641903046899, 113.61636135480092 23.586292443143435, 113.6163308977001 23.586121121951034, 113.61631471736528 23.58605735239606, 113.61618622647107 23.586071629162152, 113.61612911940675 23.58603260600161, 113.61610342122786 23.58595265611185, 113.61601109814079 23.585864140162432, 113.61585310193013 23.585803225960632, 113.61557898802205 23.585730890346124, 113.6153714990225 23.585723276070855, 113.61520493675204 23.585882224066058, 113.61516591359151 23.586056400611785, 113.61516876894466 23.58617727723074)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 12828,
-            "isGenerateReport": 1,
-            "name": "分区5",
-            "pointCount": 45,
-            "pointWkt": "POINT (113.61692837797158 23.58435388968608)",
-            "regionCode": "LBY-MR-5",
-            "wkt": "MULTIPOLYGON (((113.61726902399624 23.584875938109313, 113.61732981922493 23.584649032707855, 113.61741785928217 23.58458954618279, 113.6176284415812 23.584287354634938, 113.61761892373723 23.584146966435544, 113.61762249292879 23.584041080420736, 113.61758442155264 23.584010147427676, 113.61752374529698 23.583939953328095, 113.6174499820059 23.583857861923292, 113.61723702024568 23.5839113997961, 113.61706331959229 23.583947091711153, 113.61689794705232 23.583967317129648, 113.61673019505157 23.58399468093132, 113.61659218631306 23.584025613924393, 113.61641848565968 23.584054167456387, 113.61624716446725 23.584093428562902, 113.61621623147425 23.584286164904498, 113.61622218012678 23.584531249388036, 113.6162186109351 23.58466211974327, 113.61629713314835 23.584684724622857, 113.6166052733487 23.58470970896351, 113.61669926205845 23.584731124112597, 113.61678016373266 23.584778713332653, 113.61680276861217 23.584819164169826, 113.61683846052725 23.58481916416982, 113.61689080866942 23.584775144141148, 113.61697884872665 23.58482035390024, 113.61709484745067 23.584864516696555, 113.61726902399624 23.584875938109313)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 12828,
+            isGenerateReport: 1,
+            name: "分区5",
+            pointCount: 45,
+            pointWkt: "POINT (113.61692837797158 23.58435388968608)",
+            regionCode: "LBY-MR-5",
+            wkt: "MULTIPOLYGON (((113.61726902399624 23.584875938109313, 113.61732981922493 23.584649032707855, 113.61741785928217 23.58458954618279, 113.6176284415812 23.584287354634938, 113.61761892373723 23.584146966435544, 113.61762249292879 23.584041080420736, 113.61758442155264 23.584010147427676, 113.61752374529698 23.583939953328095, 113.6174499820059 23.583857861923292, 113.61723702024568 23.5839113997961, 113.61706331959229 23.583947091711153, 113.61689794705232 23.583967317129648, 113.61673019505157 23.58399468093132, 113.61659218631306 23.584025613924393, 113.61641848565968 23.584054167456387, 113.61624716446725 23.584093428562902, 113.61621623147425 23.584286164904498, 113.61622218012678 23.584531249388036, 113.6162186109351 23.58466211974327, 113.61629713314835 23.584684724622857, 113.6166052733487 23.58470970896351, 113.61669926205845 23.584731124112597, 113.61678016373266 23.584778713332653, 113.61680276861217 23.584819164169826, 113.61683846052725 23.58481916416982, 113.61689080866942 23.584775144141148, 113.61697884872665 23.58482035390024, 113.61709484745067 23.584864516696555, 113.61726902399624 23.584875938109313)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 126202,
-            "isGenerateReport": 1,
-            "name": "LBY-MR-SG1",
-            "pointCount": null,
-            "pointWkt": "POINT (113.67786773078139 23.512815571668426)",
-            "regionCode": "LBY-MR-SG1",
-            "wkt": "POLYGON ((113.67643632076339 23.512862037149922, 113.67909107058698 23.51321600379307, 113.67909107058698 23.512673254940246, 113.67661330408497 23.512472673842463, 113.67643632076339 23.512862037149922))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 126202,
+            isGenerateReport: 1,
+            name: "LBY-MR-SG1",
+            pointCount: null,
+            pointWkt: "POINT (113.67786773078139 23.512815571668426)",
+            regionCode: "LBY-MR-SG1",
+            wkt: "POLYGON ((113.67643632076339 23.512862037149922, 113.67909107058698 23.51321600379307, 113.67909107058698 23.512673254940246, 113.67661330408497 23.512472673842463, 113.67643632076339 23.512862037149922))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 172047,
-            "isGenerateReport": 1,
-            "name": "认养分区",
-            "pointCount": null,
-            "pointWkt": "POINT (113.61573550741103 23.586606696698798)",
-            "regionCode": "LBY认养分区",
-            "wkt": "MULTIPOLYGON (((113.61553138381385 23.586555391814727, 113.61578836560238 23.586770495089638, 113.61593018147823 23.586692924660838, 113.61571507820327 23.5864349910878, 113.61553138381385 23.586555391814727)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 172047,
+            isGenerateReport: 1,
+            name: "认养分区",
+            pointCount: null,
+            pointWkt: "POINT (113.61573550741103 23.586606696698798)",
+            regionCode: "LBY认养分区",
+            wkt: "MULTIPOLYGON (((113.61553138381385 23.586555391814727, 113.61578836560238 23.586770495089638, 113.61593018147823 23.586692924660838, 113.61571507820327 23.5864349910878, 113.61553138381385 23.586555391814727)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 175094,
-            "isGenerateReport": 1,
-            "name": "12",
-            "pointCount": null,
-            "pointWkt": "POINT (113.61860504330416 23.583859757151316)",
-            "regionCode": "LBY-MR-12",
-            "wkt": "MULTIPOLYGON (((113.61790764544605 23.58437349638575, 113.61810434755591 23.58448136528483, 113.61834039008784 23.58457781277093, 113.61887973458238 23.58461715319288, 113.61901298439875 23.584476289101246, 113.61925029597637 23.584407760624345, 113.61937973865497 23.58437349638575, 113.61932390063691 23.584164103817216, 113.61923506742585 23.5838836446801, 113.61920587937084 23.583660292607078, 113.61927060071025 23.58345216908441, 113.61940004338908 23.5832846550295, 113.6191449651692 23.58325927411221, 113.61896095351813 23.583223740827805, 113.61884166320624 23.58314759807564, 113.61873379430745 23.58305115058954, 113.6185180565094 23.583087952919755, 113.61840257333529 23.58318947658927, 113.61825028783096 23.583260543158076, 113.61815510939073 23.583216126552543, 113.61807262140928 23.583183131360045, 113.61779216227194 23.583299883580025, 113.61792541208831 23.58360953077215, 113.61817668317042 23.583615876001545, 113.61831374012445 23.583843035212283, 113.61829216634476 23.583925523193727, 113.61821348550086 23.5839014113223, 113.6179825191524 23.583770699597665, 113.6178530764738 23.583793542423393, 113.61783784792328 23.583905218459847, 113.617946985868 23.58400166594589, 113.61795713823494 23.584085422973374, 113.61786703597829 23.58419963710162, 113.61785815265716 23.58428847031246, 113.61790764544605 23.58437349638575)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 175094,
+            isGenerateReport: 1,
+            name: "12",
+            pointCount: null,
+            pointWkt: "POINT (113.61860504330416 23.583859757151316)",
+            regionCode: "LBY-MR-12",
+            wkt: "MULTIPOLYGON (((113.61790764544605 23.58437349638575, 113.61810434755591 23.58448136528483, 113.61834039008784 23.58457781277093, 113.61887973458238 23.58461715319288, 113.61901298439875 23.584476289101246, 113.61925029597637 23.584407760624345, 113.61937973865497 23.58437349638575, 113.61932390063691 23.584164103817216, 113.61923506742585 23.5838836446801, 113.61920587937084 23.583660292607078, 113.61927060071025 23.58345216908441, 113.61940004338908 23.5832846550295, 113.6191449651692 23.58325927411221, 113.61896095351813 23.583223740827805, 113.61884166320624 23.58314759807564, 113.61873379430745 23.58305115058954, 113.6185180565094 23.583087952919755, 113.61840257333529 23.58318947658927, 113.61825028783096 23.583260543158076, 113.61815510939073 23.583216126552543, 113.61807262140928 23.583183131360045, 113.61779216227194 23.583299883580025, 113.61792541208831 23.58360953077215, 113.61817668317042 23.583615876001545, 113.61831374012445 23.583843035212283, 113.61829216634476 23.583925523193727, 113.61821348550086 23.5839014113223, 113.6179825191524 23.583770699597665, 113.6178530764738 23.583793542423393, 113.61783784792328 23.583905218459847, 113.617946985868 23.58400166594589, 113.61795713823494 23.584085422973374, 113.61786703597829 23.58419963710162, 113.61785815265716 23.58428847031246, 113.61790764544605 23.58437349638575)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 175095,
-            "isGenerateReport": 1,
-            "name": "13",
-            "pointCount": null,
-            "pointWkt": "POINT (113.61907779775447 23.582774628335315)",
-            "regionCode": "LBY-MR-13",
-            "wkt": "MULTIPOLYGON (((113.6185180565094 23.583087952919755, 113.61873379430756 23.58305115058954, 113.61884166320624 23.58314759807564, 113.61896095351813 23.583223740827805, 113.6191449651692 23.58325927411221, 113.61940004338908 23.5832846550295, 113.61952853428329 23.58303148037845, 113.61974554112703 23.582682175502953, 113.61942574156774 23.58233191884284, 113.61909737594897 23.58227005285653, 113.61872713181651 23.58242614549863, 113.61843207865172 23.58267265765886, 113.61843112686734 23.583051467850964, 113.6185180565094 23.583087952919755)))"
+            farmCode: "LBY",
+            farmId: "766",
+            id: 175095,
+            isGenerateReport: 1,
+            name: "13",
+            pointCount: null,
+            pointWkt: "POINT (113.61907779775447 23.582774628335315)",
+            regionCode: "LBY-MR-13",
+            wkt: "MULTIPOLYGON (((113.6185180565094 23.583087952919755, 113.61873379430756 23.58305115058954, 113.61884166320624 23.58314759807564, 113.61896095351813 23.583223740827805, 113.6191449651692 23.58325927411221, 113.61940004338908 23.5832846550295, 113.61952853428329 23.58303148037845, 113.61974554112703 23.582682175502953, 113.61942574156774 23.58233191884284, 113.61909737594897 23.58227005285653, 113.61872713181651 23.58242614549863, 113.61843207865172 23.58267265765886, 113.61843112686734 23.583051467850964, 113.6185180565094 23.583087952919755)))",
         },
         {
-            "farmCode": "LBY",
-            "farmId": "766",
-            "id": 175096,
-            "isGenerateReport": 1,
-            "name": "15",
-            "pointCount": null,
-            "pointWkt": "POINT (113.61729343325402 23.581078231145653)",
-            "regionCode": "LBY-MR-15",
-            "wkt": "MULTIPOLYGON (((113.61579634969576 23.580895993441118, 113.61623258421344 23.58139885286704, 113.61657522659812 23.581547965756727, 113.61743341886756 23.5818731587608, 113.61737155288142 23.58216345300349, 113.61798704012836 23.582252286214498, 113.61852479831566 23.58088806190449, 113.61799973058703 23.58035347633188, 113.61769991850042 23.580115530231183, 113.61644039047451 23.580399479244647, 113.61574558786083 23.580797642386187, 113.61579634969576 23.580895993441118)))"
-        }
-    ]
+            farmCode: "LBY",
+            farmId: "766",
+            id: 175096,
+            isGenerateReport: 1,
+            name: "15",
+            pointCount: null,
+            pointWkt: "POINT (113.61729343325402 23.581078231145653)",
+            regionCode: "LBY-MR-15",
+            wkt: "MULTIPOLYGON (((113.61579634969576 23.580895993441118, 113.61623258421344 23.58139885286704, 113.61657522659812 23.581547965756727, 113.61743341886756 23.5818731587608, 113.61737155288142 23.58216345300349, 113.61798704012836 23.582252286214498, 113.61852479831566 23.58088806190449, 113.61799973058703 23.58035347633188, 113.61769991850042 23.580115530231183, 113.61644039047451 23.580399479244647, 113.61574558786083 23.580797642386187, 113.61579634969576 23.580895993441118)))",
+        },
+    ];
     areaList.value = data;
     regionId.value = (data && data.length && data[0].id) || "";
     changeRegion(regionId.value);
@@ -375,7 +420,6 @@ const changeRegion = (e) => {
         // serveArea.value = "3.72亩"
     });
 };
-
 </script>
 
 <style lang="scss" scoped>
@@ -398,7 +442,7 @@ const changeRegion = (e) => {
             padding: 0 12px;
             top: -16px;
         }
-        .fixed-btn-wrap{
+        .fixed-btn-wrap {
             position: fixed;
             z-index: 10;
             bottom: 0;
@@ -410,7 +454,7 @@ const changeRegion = (e) => {
             align-items: center;
             justify-content: space-between;
             background: #fff;
-            &.center{
+            &.center {
                 justify-content: center;
             }
             .fixed-btn {
@@ -418,17 +462,17 @@ const changeRegion = (e) => {
                 text-align: center;
                 height: 40px;
                 line-height: 40px;
-                background: linear-gradient(180deg, #70BFFE, #2199F8);
+                background: linear-gradient(180deg, #70bffe, #2199f8);
                 border-radius: 25px;
                 color: #fff;
                 font-size: 14px;
                 box-sizing: border-box;
-                &.expert{
+                &.expert {
                     width: 180px;
                 }
-                &.orange{
-                    color: #FF953D;
-                    border: 1px solid #FF953D;
+                &.orange {
+                    color: #ff953d;
+                    border: 1px solid #ff953d;
                     background: #fff;
                 }
             }
@@ -502,7 +546,7 @@ const changeRegion = (e) => {
                     .status-icon {
                         width: 24px;
                         height: 24px;
-                        background: #FFFFFF;
+                        background: #ffffff;
                         border-radius: 50%;
                         margin-right: 8px;
                     }
@@ -517,7 +561,7 @@ const changeRegion = (e) => {
             }
             &.warning {
                 &::after {
-                    background: #FF953D;
+                    background: #ff953d;
                 }
                 .stauts-sub-text {
                     color: #fff;
@@ -538,6 +582,54 @@ const changeRegion = (e) => {
             padding: 10px 0;
             position: relative;
         }
+        .info-title-wrap{
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            color: #000;
+            .info-more{
+                font-size: 18px;
+            }
+            .unit-text{
+                font-size: 12px;
+            }
+        }
+        .info-content-wrap {
+            .price-bottom {
+                padding-top: 8px;
+                .price-info {
+                    padding: 8px 0;
+                    display: flex;
+                    align-items: center;
+                    justify-content: space-between;
+                    color: rgba(0, 0, 0, 0.2);
+                    .main-text {
+                        padding-left: 6px;
+                        color: rgba(0, 0, 0, 0.8);
+                    }
+                    .info-c {
+                        flex: 1;
+                        text-align: center;
+                    }
+                }
+                .price-total {
+                    height: 38px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    border: 1px solid rgba(33, 153, 248, 0.5);
+                    background: rgba(33, 153, 248, 0.1);
+                    color: #000000;
+                    border-radius: 4px;
+                    .main-val {
+                        font-size: 20px;
+                        font-weight: bold;
+                        color: #2199f8;
+                        padding-right: 2px;
+                    }
+                }
+            }
+        }
         .executor-info {
             margin-top: 14px;
             .executor-title {
@@ -547,9 +639,11 @@ const changeRegion = (e) => {
                 margin-bottom: 12px;
             }
             .executor-content {
-                display: flex;
-                align-items: flex-start;
-                gap: 12px;
+                .executor-info {
+                    display: flex;
+                    align-items: flex-start;
+                    gap: 12px;
+                }
                 .executor-avatar {
                     flex-shrink: 0;
                     img {
@@ -573,35 +667,35 @@ const changeRegion = (e) => {
                         }
                         .rating {
                             font-size: 16px;
-                            color: #FF953D;
+                            color: #ff953d;
                             font-weight: bold;
                         }
                     }
                     .service-info {
-                        margin-bottom: 12px;
                         .service-item {
                             font-size: 12px;
-                            color: #B6B6B6;
+                            color: #b6b6b6;
                             line-height: 1.3;
                             margin-bottom: 2px;
-                            span{
+                            span {
                                 color: #666666;
                             }
                         }
                     }
-                    .contact-buttons {
-                        display: flex;
-                        justify-content: flex-end;
-                        gap: 8px;
-                        .contact-btn {
-                            width: 88px;
-                            height: 32px;
-                            border-radius: 20px;
-                            color: rgba(0, 0, 0, 0.5);
-                            background: #fff;
-                            border: 1px solid rgba(0, 0, 0, 0.1);
-                        }
-                    }
+                }
+            }
+            .contact-buttons {
+                display: flex;
+                justify-content: flex-end;
+                gap: 8px;
+                margin-top: 16px;
+                .contact-btn {
+                    width: 88px;
+                    height: 32px;
+                    border-radius: 20px;
+                    color: rgba(0, 0, 0, 0.5);
+                    background: #fff;
+                    border: 1px solid rgba(0, 0, 0, 0.1);
                 }
             }
         }

src/views/old_mini/monitor/index.vue

@@ -3,8 +3,7 @@
         <!-- 天气遮罩 -->
         <div class="weather-mask" v-show="isExpanded"></div>
         <!-- 天气 -->
-        <weather-info class="weather-info" @weatherExpanded="weatherExpanded" :isGarden="true"></weather-info>
-        <!-- 操作按钮 -->
+        <weather-info class="weather-info" @weatherExpanded="weatherExpanded" @changeGarden="changeGarden" :isGarden="true"></weather-info>        <!-- 操作按钮 -->
         <div class="operation-button">
             <div class="button-group">
                 <div class="button-item" @click="toFarmInfo">
@@ -33,7 +32,7 @@
             >
                 <div class="card-title">{{ card.title }}</div>
                 <img :src="require(`@/assets/img/monitor/grid-${index + 1}.png`)" :alt="card.title" />
-                <div class="card-status">
+                <div class="card-status" :class="card.className" v-if="card.status">
                     {{ card.status }}
                 </div>
             </div>
@@ -107,26 +106,39 @@ function toFarmInfo() {
 const functionCards = ref([
     {
         title: "农事规划",
-        status: "2 待执行",
         route: "/plan",
     },
     {
         title: "农场报告",
         status: "最新",
         route: "/farm-report",
+        className: "blue",
     },
     {
         title: "农事方案",
-        status: "2 待执行",
         route: "/agricultural_plan",
     },
     {
         title: "复核成效",
         status: "最新",
         route: "/review-results",
+        className: "yellow",
     },
 ]);
 
+const getStayCount = () => {
+    VE_API.monitor.getCountByStatusAndFarmId({
+        farmId: gardenId.value,
+        startStatus:1,
+        endStatus:3,
+    }).then(res => {
+        functionCards.value[0].status = null;
+        if(res.data && res.data != 0){
+            functionCards.value[0].status = res.data + ' 待执行';
+        }
+    });
+}
+
 // 实时播报数据
 const broadcastList = ref([
     {
@@ -172,15 +184,19 @@ const handleBroadcastItem = (item) => {
     // TODO: 处理播报项点击事件
 };
 
-onMounted(() => {});
+onMounted(() => {
+    
+});
 
 const isExpanded = ref(false);
 const weatherExpanded = (isExpandedValue) => {
     isExpanded.value = isExpandedValue;
 };
 
-function toSubPage() {
-    router.push("/create_farm?isFromHome=true");
+const gardenId = ref(null);
+const changeGarden = (id) => {
+    gardenId.value = id;
+    getStayCount();
 }
 
 function handlePage(url) {
@@ -297,6 +313,12 @@ function handlePage(url) {
                 font-size: 11px;
                 background: #2199f8;
                 color: #fff;
+                &.yellow {
+                    background: #FDCF4C;
+                }
+                &.blue {
+                    background: #8A87FF;
+                }
             }
         }
     }

src/views/old_mini/monitor/subPages/plan.vue

@@ -60,9 +60,12 @@
             <div class="control-section">
                 <div class="toggle-group">
                     <el-switch v-model="isDefaultEnabled" />
-                    <span class="toggle-label">默认发起农情需求</span>
+                    <span class="toggle-label">{{ isDefaultEnabled ? '默认' : '' }}发起农情需求</span>
+                </div>
+                <div class="add-button-group">
+                    <div class="add-button button" @click="addNewTask">新增农事</div>
+                    <div class="button" @click="manageTask">农事管理</div>
                 </div>
-                <div class="add-button" @click="addNewTask">新增农事</div>
             </div>
         </div>
     </div>
@@ -182,13 +185,21 @@ const toggleDefault = () => {
 
 // 新增农事
 const addNewTask = () => {
-    console.log("新增农事");
     router.push({
         path: "/modify_work",
         query: { data: JSON.stringify(['生长异常']), gardenId: 766, isAdd: true },
     });
 };
 
+const manageTask = () => {
+    router.push({
+        path: "/agri_services_manage",
+        query: {
+            type: "manage",
+        },
+    });
+};
+
 const detailDialogRef = ref(null);
 
 const handleRowClick = (item) => {
@@ -199,7 +210,7 @@ const handleRowClick = (item) => {
                 id: item.id,
             },
         });
-    }else if(item.type !== "term"){
+    }else if(item.type !== "term" && item.status === "default"){
         detailDialogRef.value.showDialog();
     }else if (item.status === "warning" || item.status === "normal"){
         router.push({
@@ -209,6 +220,13 @@ const handleRowClick = (item) => {
                 status: item.status,
             },
         });
+        // router.push({
+        //     path: "/services_agri",
+        //     query: {
+        //         id: item.id,
+        //         status: item.status,
+        //     },
+        // });
     }
 };
 </script>
@@ -471,16 +489,26 @@ const handleRowClick = (item) => {
                 gap: 8px;
 
                 .toggle-label {
-                    font-size: 14px;
+                    font-size: 13px;
                     color: #141414;
                 }
             }
 
-            .add-button {
-                background: linear-gradient(120deg, #76c3ff 0%, #2199f8 100%);
-                color: white;
-                border-radius: 25px;
-                padding: 10px 20px;
+            .add-button-group{
+                display: flex;
+                align-items: center;
+                gap: 8px;
+                .button {
+                    color: #2199F8;
+                    border-radius: 25px;
+                    padding: 9px 15px;
+                    border: 1px solid #2199F8;
+                }
+                .add-button {
+                    background: linear-gradient(120deg, #76c3ff 0%, #2199f8 100%);
+                    color: white;
+                    border: 1px solid transparent;
+                }
             }
         }
     }