merege

index.html

@@ -150,7 +150,6 @@
       </style>
       <div class="app-loading">
         <div class="app-loading-wrap">
-          <img src="<%= VITE_GLOB_APP_LOGO %>" class="app-loading-logo" alt="Logo" />
           <div class="app-loading-dots">
             <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
           </div>

src/components/MapboxMaps/MapComponent.vue

@@ -37,7 +37,7 @@
         </div>
       </div>
 
-      <!--  -->
+      <!-- 坐标输入框 -->
       <div class="to-location-input" v-if="LocationShow">
         <div class="location-operation">
           <a-button type="default" size="small" @click="handlerPushLocationItem"><PlusOutlined />添加</a-button>
@@ -87,6 +87,7 @@
 
     import U from 'mapbox-gl-utils';
     import 'mapbox-gl/dist/mapbox-gl.css';
+
     import './src/index.less';
     import { MapboxConfig, MapboxDefaultStyle, MapControlConfig } from './src/config';
     import { MP } from './src/MP';
@@ -182,11 +183,12 @@
     onMounted(() => {
       mapboxgl.accessToken = MapboxConfig.ACCESS_TOKEN;
       map = initMap();
+
       map.on('load', () => {
 
         // 根据地图配置信息加载地形数据
         if(props.mapConfig.mode == "3D"){
-          handlerLoadTerrain();
+          // handlerLoadTerrain();
         }
 
         // 初始化绘图空间
@@ -200,6 +202,7 @@
         map.on('draw.selectionchange', (e) => {
           // handlerCopyToTargetLayer(e);
         });
+
         emit('mapOnLoad', map);
   
         // 设置绘图监听事件
@@ -274,6 +277,8 @@
           }
           baseLayers.push(layers)
         })
+
+        // 图层管理工具
         map.addControl(new SwitchLayerControl({
               name:"图层管理" ,       
               position:"top-left",     
@@ -296,8 +301,7 @@
                       layers:baseLayers
                   },
               }
-          }),"top-left");
-
+        }),"top-left");
 
         // 应用图层绑定点击事件
         applicationLayers.forEach((item,index)=>{
@@ -398,8 +402,6 @@
         zoom: props.mapConfig.zoom ? props.mapConfig.zoom:10,
         pitch:props.mapConfig.angle ? props.mapConfig.angle:0,
         center: props.mapConfig.center?.split(",") ? props.mapConfig.center?.split(",") : [117.984425,35.270654],
-
-
       });
     };
   

src/components/MapboxMaps/src/config.ts

@@ -1,6 +1,6 @@
 export enum MapboxConfig {
-  // ACCESS_TOKEN = 'pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ',
-  ACCESS_TOKEN = "1234",
+  ACCESS_TOKEN = 'pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ',
+  // ACCESS_TOKEN = "1234",
   TDT_TOKEN = 'b6585bc41ee16251dbe6b1af64f375d9',
   // add more config options here
 }

src/components/Upload/src/components/Base64Image.vue

@@ -0,0 +1,54 @@
+<template>
+    <div class="image-container">
+        <img :src="base64Url" alt="">
+    </div>
+</template>
+
+<script lang="ts" setup>
+
+import {ref,defineProps} from 'vue';
+
+const props = defineProps({
+    url:String
+})
+
+const base64Url = ref<String>("")
+
+
+function ImageToBase64(url){
+    return new Promise(function(resolve,reject){
+    let img = new Image();
+    img.crossOrigin = 'Anonymous';
+    img.src=url;
+    try{
+        img.onload = function(){
+        let canvas = document.createElement('canvas');
+        canvas.width = img.width;
+        canvas.height = img.height;
+        let ctx = canvas.getContext('2d');
+        ctx?.drawImage(img, 0, 0);
+        let dataURL = canvas.toDataURL('image/jpeg'); // 或者使用 'image/jpeg' 来获得 JPEG 格式的 base64 字符串
+        resolve(dataURL);
+        }
+    }catch(e){
+        reject("NO");
+    }
+    })
+}
+
+ImageToBase64(props.url).then(res=>{
+    base64Url.value = res.toString();
+})
+
+</script>
+
+<style type="less" scoped>
+.image-container{
+    width:100%;
+    height:100%;
+    img {
+        width:100%;
+        height:100%;
+    }
+}
+</style>

src/views/demo/bootstraps/curbspotcity/MapList/index.vue

@@ -133,7 +133,7 @@
     <div class="data-list-div">
       <div v-for="(item, index) in props.infoDataList" :key="index" class="data-list-item">
         <div class="select-mark"></div>
-        <Icon style="font-size: 30px; color: #bf0000" icon="gis:poi-alt" />
+        <Icon style="font-size: 30px; color: #bf0000" icon="gis:poi-alt" @click="locationFun(item)" />
         <div class="data-list-item-content">
           <div class="item-info-div">
             
@@ -188,7 +188,8 @@ const emits = defineEmits([
   "closeShowInfo",
   "mapListScreenChange",
   "changeInfoPage",
-  "getInfoList"
+  "getInfoList",
+  "changeTask"
 ])
 const props = defineProps([
   "infoScreenData",
@@ -200,9 +201,16 @@ const props = defineProps([
   "total",
   "infoDataList"
 ])
+
 onMounted(() => {
   console.log('onMounted')
 })
+
+async function locationFun(record) {
+  console.log(record);
+  emits('changeTask', record.geomid);
+}
+
 const changePage = (page, pageSize) => {
   console.log(page,pageSize)
   emits('changeInfoPage',page,pageSize)

src/views/demo/bootstraps/curbspotcity/index.vue

@@ -24,14 +24,22 @@
         @changeInfoPage="changeInfoPage"
         @getInfoList="getInfoList"
         @mapListScreenChange="mapListScreenChange"
-        @closeShowInfo="changeShowInfo"/>
+        @closeShowInfo="changeShowInfo"
+        @changeTask="changeTask"
+        />
     </div>
-    <div id="showMap" class="map"></div>
+    <!-- <div id="showMap" class="map"></div> -->
+    <MapboxMap
+      :mapConfig="mapConfig"
+      @handlerDrawComplete="handlerDrawComplete"
+      @mapOnLoad="onMapboxLoad"
+      ref="MapboxComponent"
+    />
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, watch } from "vue"
+import { ref, onMounted, onUnmounted, watch,defineAsyncComponent } from "vue"
 import mapboxgl, { Map } from 'mapbox-gl';
 import { MapboxConfig, MapboxDefaultStyle } from '@/components/MapboxMaps/src/config.ts'
 import AuditProgress from './AuditProgress/index.vue'
@@ -39,6 +47,11 @@ import MapList from './MapList/index.vue'
 import { getLoadDroneCaseInfoCount, getLoadDroneCaseInfoDetail } from '@/api/bootstraps/index.ts'
 import { batchOptions, yearOptions} from '@/views/demo/bootstraps/curbspotcity/util.ts'
 import { getChildrenTree } from '@/api/demo/system.ts'
+import { getGeom } from '@/api/sys/layerManagement';
+
+const MapboxMap = defineAsyncComponent(() => import('@/components/MapboxMaps/MapComponent.vue'));
+const MapboxComponent = ref();
+const mapConfig = ref({ isShowMap: false });
 
 const showInfo = ref(false)
 const year = ref<number>()
@@ -178,7 +191,7 @@ watch(() => batch.value, (newVal) => {
 let map: Map;
 onMounted(() => {
   mapboxgl.accessToken = MapboxConfig.ACCESS_TOKEN;
-  map = initMap();
+  // map = initMap();
   getLoadDroneCaseInfoCount().then(res => {
     dataList.value = res
   }).catch(err => {
@@ -212,6 +225,41 @@ const changeInfoPage = (page, limit) => {
   pageSize.value = limit
   getInfoList()
 }
+
+function changeTask(val) {
+    console.log(val);
+    let getGeomPrams = {
+      TableName: 'drone_shp_data ',
+      FieldName: 'gid',
+      FieldValue: val,
+      page: 1,
+      limit: 999,
+      key: null,
+    };
+    if (val) {
+      getGeom(getGeomPrams).then((res) => {
+        let geoms = [];
+        if (res) {
+          if (res.items?.length > 0) {
+            res.items.forEach((item, index) => {
+              let geom = {
+                key: item.gid,
+                mapgeom: item.geometry,
+              };
+              geoms.push(geom);
+            });
+          }
+          // MapboxComponent.value.handlerDraw(status,mapgemoList.value, false);
+          MapboxComponent.value.handlerDraw('Details', geoms, false);
+        } else {
+          createMessage.error('当前数据没有图斑！');
+        }
+      });
+    } else {
+      createMessage.error('当前数据没有图斑！');
+    }
+  }
+
 </script>
 
 <style lang="scss" scoped>

src/views/demo/onlineform/formModule/config/maps.vue

@@ -240,6 +240,7 @@
           },
           layout: {
             visibility: "visible",
+            "z-index":1,
           },
         }
       },{
@@ -258,6 +259,7 @@
           },
           layout: {
             visibility: "visible",
+            "z-index":0,
           },
           paint: {},
         }

src/views/demo/workflow/task/process/look.vue

@@ -514,7 +514,7 @@
   }
 
     // 图片预览
-    const isShowImagePreview = ref<Boolean>(false);
+  const isShowImagePreview = ref<Boolean>(false);
   const closeImagePreview = ()=>{
     isShowImagePreview.value = false;
   }