瀏覽代碼

Merge branch 'Malaysia' of http://www.sysuimars.cn:3000/feiniao/agriculture-one-map into Malaysia

lxf 1 周之前
父節點
當前提交
97ffdf5708

+ 3 - 3
src/api/modules/warning.js

@@ -19,9 +19,9 @@ export default {
         url: config.one_map_url + "land_canal/list",
         type: "get",
     },
-    //统计指定物种在下级区划中的面积占比
-    fetchStatRegionAreaRatio: {
-        url: config.one_map_url + "agri_land_crop/stat_region_area_ratio",
+    //查询所有水渠图片数据
+    fetchImgList: {
+        url: config.one_map_url + "land_canal_image/list",
         type: "get",
     },
     //返回去年的年度+季度,以及今年从第一季度到当前季度的集合

+ 36 - 10
src/components/static_map_change/pointLayer.js

@@ -3,6 +3,7 @@ import Style from "ol/style/Style";
 import Icon from "ol/style/Icon";
 import { newPoint } from "@/utils/map.js";
 import flyPointIcon from "@/assets/images/warningHome/chat/fly-point.png";
+import activePointIcon from "@/assets/images/map/active-icon-small.png";
 
 /**
  *
@@ -12,19 +13,33 @@ class pointLayer {
     this.kmap = kmap
     // 位置图标
     this.pointLayer = new KMap.VectorLayer("pointLayer", 1000, {
-        visible: false,
-        style: () => {
-            return new Style({
-            image: new Icon({
-                // 使用打包器可识别的静态资源路径
-                src: flyPointIcon,
-                scale: 0.6,
-            }),
-            });
-        },
+      visible: false,
+      style: () => {
+        return new Style({
+          image: new Icon({
+            // 使用打包器可识别的静态资源路径
+            src: flyPointIcon,
+            scale: 0.6,
+          }),
         });
+      },
+    });
     this.kmap.addLayer(this.pointLayer.layer);
 
+    this.imgLayer = new KMap.VectorLayer("imgLayer", 1000, {
+      visible: false,
+      style: () => {
+        return new Style({
+          image: new Icon({
+            // 使用打包器可识别的静态资源路径
+            src: activePointIcon,
+            scale: 0.7,
+          }),
+        });
+      },
+    });
+    this.kmap.addLayer(this.imgLayer.layer);
+
     this.setMapPoint()
   }
 
@@ -107,6 +122,7 @@ class pointLayer {
       this.pointLayer.addFeature(point)
     })
     this.pointLayer.layer.setVisible(false);
+    this.imgLayer.layer.setVisible(false);
   }
 
   showPoint() {
@@ -120,8 +136,18 @@ class pointLayer {
     // }
   }
 
+  showImg(arr) {
+    arr.map((item) => {
+      let point = newPoint(item, 'centerPoint');
+      this.imgLayer.addFeature(point)
+    })
+    this.imgLayer.layer.setVisible(true);
+    this.pointLayer.layer.setVisible(false);
+  }
+
   hidePoint() {
     this.pointLayer.layer.setVisible(false);
+    this.imgLayer.layer.setVisible(false);
   }
 
 }

+ 1 - 1
src/utils/map.js

@@ -93,7 +93,7 @@ export const newRegionFeature = (data)=>{
 
 
 export const newPoint = (data)=>{
-    let point = new WKT().readGeometry(data["wkt"] || data["point"])
+    let point = new WKT().readGeometry(data["wkt"] || data["point"] || data["centerPoint"])
     let feature = new Feature({
         geometry: point
     });

+ 6 - 4
src/views/warningHome/components/trackDialog.vue

@@ -17,11 +17,11 @@
             <template #header>
                 <div class="track-title">
                     <!-- <img class="track-icon" src="@/assets/images/warningHome/chat/track.png" alt="" /> -->
-                    视频
+                    灌渠图片
                 </div>
             </template>
             <div class="track">
-                <video class="track-img" src="https://birdseye-img-ali-cdn.sysuimars.com/bbs_post/video/1768189223030.mp4" controls></video>
+                <img class="track-img" :src="imgUrl" alt="" />
             </div>
         </el-dialog>
     </div>
@@ -49,7 +49,7 @@ const centerDialogVisible = ref(false);
 onMounted(() => {
     // ai与地图交互
     eventBus.on("chat:showTrackDialog", showTrackDialog)
-    eventBus.on("chat:showVideoDialog", showVideoDialogFn)
+    eventBus.on("chat:showImgDialog", showImgDialog)
 })
 
 const showVideoDialog = ref(null)
@@ -60,7 +60,9 @@ const showTrackDialog = (url) => {
     centerDialogVisible.value = true
 }
 
-const showVideoDialogFn = () => {
+const imgUrl = ref('')
+const showImgDialog = (url) => {
+    imgUrl.value = url
     showVideoDialog.value = false
     centerDialogVisible.value = true
 }

+ 8 - 36
src/views/warningHome/index.vue

@@ -19,7 +19,6 @@
             <!-- <map-legend></map-legend> -->
             <!-- <land-use-legend @change="handleLegendChange"></land-use-legend> -->
             <landUseLegend ref="legendRef"></landUseLegend>
-            <div class="show-point yes-events" v-show="showPoint" @click="handleShowPointClick"></div>
         </div>
     </div>
     <div ref="mapRef" class="bottom-map"></div>
@@ -36,7 +35,6 @@ import fnHeader from "@/components/fnHeader.vue";
 import landUseLegend from "./components/legend.vue";
 import WarningMap from "./warningMap";
 import trackDialog from "./components/trackDialog.vue";
-import AlarmLayer from "./map/alarmLayer";
 import DistributionLayer from "./map/distributionLayer";
 import BoundaryLayer from "./map/boundaryLayer";
 import WaterLayer from "./map/waterLayer";
@@ -48,7 +46,6 @@ let store = useStore();
 const router = useRouter();
 const route = useRoute();
 let warningMap = new WarningMap();
-let alarmLayer = null;
 let staticMapLayers = null;
 let distributionLayer = null;
 let staticMapPointLayers = null;
@@ -68,8 +65,6 @@ const activePhenologySecondId = ref(null);
 const currentYear = ref(2025);
 const currentQuarter = ref(1);
 
-const isLandRecognition = ref(false);
-
 // 顶部基础 tabs
 const baseTabs = ["Phenological Stage", "Crop Condition", "Hydrology", "Canals", "Resources", "Export Report"];
 const activeBaseTab = ref("Phenological Stage");
@@ -82,7 +77,6 @@ const legendKeys = {
 }
 
 const warningLayers = ref({});
-const showPoint = ref(false)
 const handleBaseTabClick = (tab) => {
     const legendKey = legendKeys[tab];
     if (legendKey) {
@@ -91,7 +85,6 @@ const handleBaseTabClick = (tab) => {
         });
     }
     activeBaseTab.value = tab;
-    showPoint.value = false
     staticMapPointLayers.hidePoint()
     staticMapLayers.hideAll()
     // 水利图层隐藏
@@ -100,7 +93,7 @@ const handleBaseTabClick = (tab) => {
     if (tab === "Resources") {
         staticMapPointLayers.showPoint()
     }else if (tab === "Canals") {
-        showPoint.value = true
+        staticMapPointLayers.showImg(imgData.value)
         waterLayer && waterLayer.toggleCanalLayer(true)
     }else if (tab === "Crop Condition") {
         staticMapLayers.showSingle("Dongguan长势", false);
@@ -115,10 +108,6 @@ const handleSmartFarmClick = () => {
     window.open("https://feiniao-pc-gly.feiniaotech.com/#/login");
 };
 
-const handleShowPointClick = () => {
-    eventBus.emit("chat:showVideoDialog")
-}
-
 const legendRef = ref(null);
 const getLegendData = async (code) => {
     const { data } = await VE_API.layer.legendList({ code });
@@ -154,7 +143,6 @@ onMounted(async () => {
         }, 0);
     }
 
-    alarmLayer = new AlarmLayer(warningMap.kmap);
     staticMapLayers = new StaticMapLayers(warningMap.kmap);
     staticMapPointLayers = new StaticMapPointLayers(warningMap.kmap);
     distributionLayer = new DistributionLayer(warningMap.kmap);
@@ -164,6 +152,7 @@ onMounted(async () => {
 
     getWaterData();
     getWaterCanalData();
+    getImgData();
 
     getDistributionData();
 
@@ -280,6 +269,12 @@ const getWaterCanalData = async () => {
     waterLayer.initCanal(data);
 };
 
+const imgData = ref([]);
+const getImgData = async () => {
+    const { data } = await VE_API.warning.fetchImgList();
+    imgData.value = data;
+};
+
 sessionStorage.removeItem("farmId");
 
 onUnmounted(() => {
@@ -459,19 +454,6 @@ const getTreeChecks = async (nodeData, data) => {
 
     distributionLayer.initData(finalMapData);
 };
-
-// 处理图例变化
-const handleLegendChange = (data) => {
-    console.log("图例变化:", data);
-    // 通过 eventBus 将选中的类别信息传递给饼图组件
-    if (data.checked) {
-        eventBus.emit("landUseLegend:change", {
-            category: data.category,
-            nonGrain: data.nonGrain,
-            children: data.children,
-        });
-    }
-};
 </script>
 
 <style lang="scss" scoped>
@@ -493,16 +475,6 @@ const handleLegendChange = (data) => {
         box-sizing: border-box;
         position: relative;
 
-        .show-point{
-            position: absolute;
-            top: calc(50% - 50px);
-            left: calc(50% - 50px);
-            width: 100px;
-            height: 100px;
-            // background: red;
-            z-index: 2;
-        }
-
         .left,
         .right {
             width: calc(376px + 54px);

+ 4 - 1
src/views/warningHome/warningMap.js

@@ -66,9 +66,12 @@ class HomeMap {
         }
         if (layer instanceof VectorLayer && layer.get("name") === "pointLayer") {
           hasFeature = true
-          console.log('feature', feature)
           eventBus.emit("chat:showTrackDialog", feature.get("url"))
         }
+        if (layer instanceof VectorLayer && layer.get("name") === "imgLayer") {
+          hasFeature = true
+          eventBus.emit("chat:showImgDialog", feature.get("imageUrl"))
+        }
         return feature;
       });
       if (!hasFeature) {