ソースを参照

feat(records): change

gemercheung 1 年間 前
コミット
54099f5e78
1 ファイル変更38 行追加5 行削除
  1. 38 5
      src/app/map/App.vue

+ 38 - 5
src/app/map/App.vue

@@ -8,8 +8,8 @@
       </el-button-group>
     </div>
     <el-form-item label="所属架构:" class="filter">
-        <com-company v-model="state.deptId" />
-      </el-form-item>
+      <com-company v-model="state.deptId" />
+    </el-form-item>
   </div>
   <div ref="mapEl" class="map-container" v-show="currentType(0)"></div>
   <div class="card-container" v-show="currentType(1)">
@@ -17,7 +17,7 @@
     <div class="card-list">
       <template v-for="item of list">
         <el-card style="width: 480px" shadow="hover" @click="handCardClick(item.caseId)">
-          <!-- {{ item }} -->
+          <img class="cover" src="https://test-mix3d.4dkankan.com/code/assets/pic.d5781b0c.jpg" style="width: 100%" />
           <div class="card">
             <span> 项目: {{ item.projectName }}</span>
             <span> 地址: {{ item.projectAddress }}</span>
@@ -38,6 +38,7 @@ import axios from 'axios';
 import { getFuseCodeLink } from "../../view/case/help";
 import comCompany from "./company-select/index.vue";
 import { reactive } from "vue";
+import { watch } from "vue";
 
 const current = ref(0);
 const list = ref<any>([])
@@ -75,7 +76,8 @@ const getDataQuest = () => {
 
     const res = await request.post('https://xj-mix3d.4dkankan.com/fusion-xj/web/fireProject/queryProject', {
       pageNum: 1,
-      pageSize: 10000
+      pageSize: 10000,
+      deptId: state.deptId
     })
     console.log('res.data', res)
     if (res.status === 200 && res.data.code === 0) {
@@ -84,11 +86,23 @@ const getDataQuest = () => {
       reslove([])
     }
   })
+}
 
 
 
+const refresh = async () => {
+  const data = await getDataQuest() as any as any[];
+  console.log('data', data)
+  list.value = data as any[]
 }
 
+watch(() => state.deptId, () => {
+
+  refresh();
+}, {
+  immediate: true,
+  deep: true
+})
 const loadMap = async () => {
 
   const AMap = await AMapLoader.load({
@@ -117,6 +131,7 @@ const loadMap = async () => {
   const initMakers = async () => {
     const data = await getDataQuest() as any as any[];
     console.log('data', data)
+    const positions: any[] = []
     list.value = data as any[]
     Array.from(data).forEach((item: any) => {
       // console.log(item)
@@ -133,9 +148,11 @@ const loadMap = async () => {
         imageSize: new AMap.Size(22, 28) //图标大小
       });
 
+      const pos = coord.reverse()
+      positions.push(pos)
       const marker = new AMap.Marker({
         icon: icon,
-        position: coord.reverse(),
+        position: pos,
         title: item.title,
         label: item.title,
         extData: { url: url, id: item.caseId }
@@ -143,12 +160,24 @@ const loadMap = async () => {
       });
 
       marker.setMap(map);
+
       marker.on('click', () => {
         const data = marker.getExtData()
         window.open(data.url)
         console.log('click', data)
       })
     })
+
+    var polygon = new AMap.Polygon({
+      path: positions,
+      map: map,
+      strokeOpacity: 0,//透明
+      fillOpacity: 0,//透明
+      bubble: true//事件穿透到地图
+    });
+    var overlaysList = map.getAllOverlays('polygon');//获取多边形图层
+    map.setFitView();//自适应显示
+
   }
   initMakers();
 
@@ -211,6 +240,10 @@ body {
   flex-wrap: wrap;
 }
 
+.cover {
+  cursor: pointer;
+}
+
 .card {
   display: flex;
   flex-direction: column;