fix: 果园档案联动地图，切换分区

src/api/modules/farm.js

@@ -97,4 +97,8 @@ module.exports = {
         url: config.base_url + "farm/getFarmFiles",
         type: "get",
     },
+    fetchLegendList: {
+        url: config.base_url + "lz_sample/legendList",
+        type: "get",
+    },
 }

src/components/navigation.vue

@@ -6,7 +6,7 @@
         <div class="tabs" v-for="(ele, idx) in list" :key="idx">
             <div
                 class="tab-item"
-                @click="handleTab(item)"
+                @click="handleHomeTab(item)"
                 :class="{ active: active === item.name }"
                 v-for="(item, index) in ele"
                 :key="index"
@@ -77,6 +77,7 @@ const changeSelect = (e) =>{
     eventBus.emit('area:id',{areaId:areaId.value,farmId:organId.value})
     sessionStorage.setItem('regionId',e)
     eventBus.emit('handleTab',)
+    active.value = "果园总览"
 }
 
 onMounted(()=>{
@@ -115,7 +116,7 @@ function handleActive({name,key}){
 }
 
 const active = ref("果园总览");
-const handleTab = ({ id, name }) => {
+const handleHomeTab = ({ id, name }) => {
     active.value = name;
     childrenData.value = []
     const menuItem = mainMenuArr.value.find(item =>item.name===name)

src/views/home/album_compoents/albumCarousel.vue

@@ -138,9 +138,9 @@ eventBus.on("click:point",function({farmId,sampleId, data}){
   })
   showTag.value = data.nonghu == 1 ? true : false
   photoBaseData.value[0].value = data.pz;
-  photoBaseData.value[1].value = data?.sgbmj + "平方米";
+  photoBaseData.value[1].value = data?.sgbmj ? data?.sgbmj + "平方米" : "--";
   photoBaseData.value[2].value = data?.zzts ? data.zzts + "" : "--";
-  photoBaseData.value[3].value = data?.sl + "年";
+  photoBaseData.value[3].value = data?.sl ? data?.sl + "年" : "--";
   outputBox.value[0].value = data?.cl ? (data.cl + "斤") : "--";
   outputBox.value[1].value = data?.spgl? (data.spgl + "%") : "--";
   qualityBox.value[0].value = data?.tfl? (data.tfl + "%") : "--";

src/views/home/album_compoents/albumDrawBox.vue

@@ -5,10 +5,10 @@
   >
     <img v-if="Math.abs(current - index) < 3" crossorigin="anonymous" @load="drawWatermark($event, name)" loading="lazy" :src="watermark || (base_img_url2 + (photo.resFilename && !name ? photo.resFilename : photo.filename) + resize)" style="width: 100%;" />
     <canvas  ref="canvasRef" style="position: absolute;"></canvas>
-    <div class="tag-text" v-if="showTagBox" >
+    <!-- <div class="tag-text" v-if="showTagBox" >
       <span v-html="photo.growText"></span>
       <button class="close-button" @click="hideTagBox">✖</button>
-    </div>
+    </div> -->
     <div class="tag-box right" :class="{'leftTop': 'leftTop'}">{{ index+1 }}/{{ length }}</div>
 <!--    <div class="center-mark">mark</div>-->
   </photo-consumer>

src/views/home/album_compoents/compareDialog.vue

@@ -193,7 +193,7 @@ const outputBox = ref([
     { id: 1, name: "花穗率", value: "" },
     { id: 2, name: "总枝条数", value: "" },
     { id: 3, name: "开花率", value: "" },
-    { id: 4, name: "雄花比例", value: "" },
+    { id: 4, name: "雌花比例", value: "" },
 ]);
 
 const qualityBox = ref([
@@ -205,7 +205,7 @@ const outputBox2 = ref([
     { id: 1, name: "花穗率", value: "" },
     { id: 2, name: "总枝条数", value: "" },
     { id: 3, name: "开花率", value: "" },
-    { id: 4, name: "雄花比例", value: "" },
+    { id: 4, name: "雌花比例", value: "" },
 ]);
 
 const qualityBox2 = ref([

src/views/home/components/homeFile.vue

@@ -9,7 +9,7 @@
             <div class="overview-file">
                 <div class="box-title">总体档案</div>
                 <div class="base-data">
-                    <div class="base-item" v-for="(item, index) in photoBaseData" :key="item.label">
+                    <div class="base-item" v-for="(item, index) in photoBaseData" :key="item.label" @click.stop="toggleFileItem(item.label, index)">
                         <span class="label">{{ item.label }}</span>
                         <div v-if="index === 0" class="value">
                             <el-select
@@ -48,7 +48,7 @@
                             class="box-item"
                             v-for="(item, index) in outputBox"
                             :key="index"
-                            @click="toggleAcitve(item.name)"
+                            @click="toggleAcitve(item.name, item.field)"
                             :class="{ active: activeOuput === item.name }"
                         >
                             <div class="item-name">{{ item.name }}</div>
@@ -64,7 +64,7 @@
                             class="box-item"
                             v-for="(item, index) in qualityBox"
                             :key="index"
-                            @click="toggleQualityAcitve(item.name)"
+                            @click="toggleAcitve(item.name, item.field)"
                             :class="{ active: activeOuput === item.name }"
                         >
                             <div class="item-name">{{ item.name }}</div>
@@ -81,14 +81,14 @@
 import eventBus from "@/api/eventBus";
 import { onMounted, ref, } from "vue";
 const outputBox = ref([
-    { id: 1, name: "产量估计", value: "--", unit: "斤/亩" },
-    { id: 2, name: "高质果率", value: "--", unit: "%" },
-    { id: 3, name: "雄花比例", value: "--", unit: "%" },
+    { id: 1, name: "产量估计", field: "cl", value: "--", unit: "斤/亩" },
+    { id: 2, name: "高质果率", field: "spgl", value: "--", unit: "%" },
+    { id: 3, name: "雌花比例", value: "--", unit: "%" },
 ]);
 
 const qualityBox = ref([
-    { id: 5, name: "通风率", value: "--", unit: "%" },
-    { id: 6, name: "透光率", value: "--", unit: "%" },
+    { id: 5, name: "通风率", field: "tfl", value: "--", unit: "%" },
+    { id: 6, name: "透光率", field: "tgl", value: "--", unit: "%" },
     { id: 7, name: "病虫等级", value: "--", unit: "" },
 ]);
 
@@ -138,45 +138,66 @@ const getSpeciesItemList = (farmId,regionId) =>{
     })
 }
 
-function changeSelect() {}
+function changeSelect(e) {
+    console.log('eee', e);
+    setFileData(e)
+}
+
+function toggleFileItem(name, index) {
+    if (index !== 0) {
+        toggleAcitve(name)
+    }
+}
 
 
 // 产量详情
-function toggleAcitve(name) {
+function toggleAcitve(name, field) {
     activeOuput.value = name;
-    eventBus.emit("change:mapPoint", name)
+    console.log('产量详情产量详情产量详情', name);
+    // eventBus.emit("change:mapPoint", name)
+    if (name === "透光率" || name === "通风率") {
+        eventBus.emit('handleActive',{name,key:"生态指标",index: 1})
+        // eventBus.emit('handleTab',"透光率")
+    } else {
+        eventBus.emit("change:mapPoint", field)
+    }
 }
 
 const regionId = ref(null)
 function toggleAreaId({ areaId, farmId }) {
-    console.log('22222aaaaareid',  areaId, farmId);
     regionId.value = areaId
     getSpeciesItemList(farmId, areaId)
     getFileData(farmId, areaId)
 }
 
+const allTypeData = ref([])
 function getFileData(farmId,regionId) {
     VE_API.farm.getFarmFiles({farmId,regionId: regionId ? regionId: undefined}).then(({data}) =>{
-        const res = data.find(item => item.type_id == photoBaseData.value[0].speciesItemId)
-        photoBaseData.value[1].value = res.meta_info.avg_crown + "平方米"
-        photoBaseData.value[2].value = res.meta_info.avg_branch_num
-        photoBaseData.value[3].value = res.meta_info.avg_age + "年"
-        photoList.value[0].key = res.meta_info.phenology_info.key
-        photoList.value[0].statement = res.meta_info.phenology_info.statement
-        photoList.value[1].key = res.meta_info.dp_alert_info.key
-        photoList.value[1].statement = res.meta_info.dp_alert_info.statement
-        photoList.value[2].key = res.meta_info.grow_alert_info.key
-        photoList.value[2].statement = res.meta_info.grow_alert_info.statement
-        photoList.value[3].key = res.meta_info.prescription_info.key
-        photoList.value[3].statement = res.meta_info.prescription_info.statement
-        outputBox.value[0].value = res.production_info.production
-        outputBox.value[1].value = res.production_info.quality.toFixed(0)
-        outputBox.value[2].value = res.production_info.xionghua_ratio.toFixed(0)
-        qualityBox.value[0].value = res.ecology_info.ventilation
-        qualityBox.value[1].value = res.ecology_info.transmittance
-        qualityBox.value[2].value = res.ecology_info.dp_situation
+        allTypeData.value = data
+        setFileData(photoBaseData.value[0].speciesItemId)
     })
 }
+
+function setFileData(type_id) {
+    const res = allTypeData.value.find(item => item.type_id == type_id)
+    photoBaseData.value[1].value = res.meta_info.avg_crown + "平方米"
+    photoBaseData.value[2].value = res.meta_info.avg_branch_num
+    photoBaseData.value[3].value = res.meta_info.avg_age + "年"
+    photoList.value[0].key = res.meta_info.phenology_info.key
+    photoList.value[0].statement = res.meta_info.phenology_info.statement
+    photoList.value[1].key = res.meta_info.dp_alert_info.key
+    photoList.value[1].statement = res.meta_info.dp_alert_info.statement
+    photoList.value[2].key = res.meta_info.grow_alert_info.key
+    photoList.value[2].statement = res.meta_info.grow_alert_info.statement
+    photoList.value[3].key = res.meta_info.prescription_info.key
+    photoList.value[3].statement = res.meta_info.prescription_info.statement
+    outputBox.value[0].value = res.production_info.production
+    outputBox.value[1].value = res.production_info.quality.toFixed(0)
+    outputBox.value[2].value = res.production_info.cihua_ratio.toFixed(0)
+    qualityBox.value[0].value = res.ecology_info.ventilation
+    qualityBox.value[1].value = res.ecology_info.transmittance
+    qualityBox.value[2].value = res.ecology_info.dp_situation
+}
 </script>
 
 <style lang="scss" scoped>

src/views/home/components/homePage.vue

@@ -82,19 +82,20 @@
                         :xData="growObj.xData"
                         :yData="growObj.yData"
                     ></bar-chart>
-                    <div class="box-bg text" v-html="growObj.content"></div>
+                    <div class="box-bg text" v-for="(item, index) in growObj.text" :key="index">
+                        <div class="txt">
+                            {{ item.key }}：<span>{{ item.val }}</span>
+                        </div>
+                    </div>
                 </div>
-                <div class="text-list box-bg">
+                <!-- <div class="text-list box-bg">
                     <div class="text-item" v-for="(item, index) in growObj.text" :key="index">
                         <div class="circle"></div>
                         <div class="txt">
                             {{ item.key }}：<span>{{ item.val }}</span>
                         </div>
                     </div>
-                    <!-- <div class="text" v-for="(item,index) in growObj.text" :key="index">
-            {{item[0]}}：<span>{{item[1]}}{{item[2]}}，占比{{item[3]}}％</span>
-          </div> -->
-                </div>
+                </div> -->
             </chart-box>
         </div>
         <div class="chart-item phenology">
@@ -217,6 +218,7 @@ function handleData(name, isChange = true) {
 }
 
 function areaId({ areaId, farmId }) {
+    menuList.value = []
     getReoprt(areaId, farmId);
     getBaseData();
 }
@@ -229,6 +231,7 @@ const getReoprt = (areaId, farmId) => {
         growObj.value = handleData("生长指标", false);
         ecologyObj.value = handleData("生态指标", false);
         store.commit("home/SET_MAIN_MENU", menuList.value);
+        console.log('commitcommitcommit', menuList.value);
     });
 };
 
@@ -404,13 +407,14 @@ const gybg = () => {
             }
         }
         &.evaluate {
+            height: 220px;
             .content {
                 width: 100%;
-                height: calc(100% - 10px - 33px);
+                height: calc(100% - 10px);
                 display: flex;
                 align-items: center;
                 justify-content: space-between;
-                margin-bottom: 10px;
+                margin-top: 10px;
                 .text {
                     font-weight: 400;
                     padding: 8px 0 4px 5px;

src/views/home/index.vue

@@ -97,8 +97,16 @@
             </div>
             <div v-else class="map-bg map-legend yes-events">
                 <div class="item">
+                    <img src="@/assets/images/map/status/status-bh.png" alt="" />
+                    病害异常
+                </div>
+                <div class="item">
+                    <img src="@/assets/images/map/status/status-ch.png" alt="" />
+                    虫害异常
+                </div>
+                <div class="item">
                     <img src="@/assets/images/map/status/status-zc.png" alt="" />
-                    有照片
+                    正常
                 </div>
                 <div class="item">
                     <img src="@/assets/images/map/status/defalut-icon.png" alt="" />

src/views/home/map/samplePointLayer.js

@@ -81,23 +81,35 @@ class SamplePointLayer {
     })
 
     // 果园档案
+    that.fileLegend = []
     eventBus.off("change:mapPoint")
-    eventBus.on("change:mapPoint", (name) => {
-      console.log('name', name);
+    eventBus.on("change:mapPoint", async (field) => {
+      if (!this.fileLegend.length) {
+       await VE_API.farm.fetchLegendList().then(({data}) => {
+          this.fileLegend = data
+        })
+      }
+      const colorObj = that.fileLegend.find(item => item.code === field)
+      that.togglePointType(null, colorObj, true)
+      colorObj.list = colorObj.items
+      eventBus.emit("changePointLegend", {colorObj})
     })
     that.blueRegionLayer = null
     that.pointType = ""
     that.pointArr = []
 
+
     // 切换点位图标
     eventBus.off("changePointType")
     eventBus.on("changePointType", ({ legend, colorObj }) => {
       console.log('legend, colorObj', legend, colorObj);
       that.togglePointType(legend, colorObj)
     })
+
   }
   getIconStyle(feature) {
     const color = feature.get("color")
+    const noImg = feature.get("noImg")
     const activeCompare = feature.get('activeCompare')
     let style = new Style({
       image: new Icon({
@@ -111,7 +123,7 @@ class SamplePointLayer {
       image: new Circle({
         radius: 6,                             // 半径
         stroke: new Stroke({           // 边界样式
-          color: '#fff',                    // 边界颜色
+          color: noImg ? 'transparent' : '#fff',                    // 边界颜色
           width: 2                            // 边界宽度
         }),
         fill: new Fill({               // 填充样式
@@ -165,8 +177,8 @@ class SamplePointLayer {
     })
   }
 
-  togglePointType(sampleData, colorObj) {
-    console.log('togglePointType------------', sampleData);
+  togglePointType(sampleData, colorObj, isFile) {
+    console.log('toggle3PointType------------', sampleData, colorObj);
     let that = this
     that.clearCluster()
     if (!sampleData) {
@@ -174,7 +186,16 @@ class SamplePointLayer {
       for (let item of this.pointArr) {
         item.iconName = 'defalut'
         that.getIcon(item)
-        item.color = null
+        if (isFile && colorObj) {
+          const fieldVal = Number(item[colorObj.code])
+          const legendItem = colorObj.items.find((colorItem) => {
+            return fieldVal >= colorItem.range[0] && fieldVal <= colorItem.range[1];
+          })
+          const color = legendItem ? legendItem.color : null;
+          item.color = color
+        } else {
+          item.color = null
+        }
         let point = newPoint(item);
         features.push(point)
         // console.log('item.dyImg',item.dyImg);
@@ -221,7 +242,6 @@ class SamplePointLayer {
     });
   }
 
-
   toggleFilePoint(arr) {
     let that = this
     // 清除旧的 blueRegionLayer 图层
@@ -277,6 +297,7 @@ class SamplePointLayer {
           if (that.isUpdatePoint) {
             fs.set("iconName", "active");
           }
+          console.log('fs.getProperties()', fs.getProperties());
           if (!that.isCompare) {
             const noImg = fs.get("noImg")
             if (noImg === 1) {
@@ -327,7 +348,6 @@ class SamplePointLayer {
               document.getElementById('tag-nh').style.display = fs.get("nonghu") == 1 ? "inline-block" : 'none'
               that.popup.setPosition(evt.coordinate)
             } else {
-              console.log('fs.getProperties()', fs.getProperties());
               eventBus.emit("click:point", { farmId: fs.get("farmId"), sampleId: fs.get("sampleId"), data: fs.getProperties() })
             }
           } else {
@@ -417,11 +437,11 @@ class SamplePointLayer {
       imgSrc = require('@/assets/images/map/status/wns.png')
     }
 
-    if (item.farmId === 90263) {
-      if (item.noImg === 1) {
-        imgSrc = require('@/assets/images/map/status/defalut-icon.png')
-        scale = 0.3
-      }
+    // if (item.farmId === 90263) {
+    // }
+    if (item.noImg === 1) {
+      imgSrc = require('@/assets/images/map/status/defalut-icon.png')
+      scale = 0.3
     }
 
     item["icon"] = imgSrc