同步现场电网一张图

src/views/pqs/qualityInspeection/panorama/index.vue

@@ -4,13 +4,13 @@
             <DatePicker ref="datePickerRef" style="display: none" />
             <el-form :inline="true" :model="form" class="demo-form-inline">
                 <el-form-item>
-                    <!-- <Area
+                    <Area
                         ref="areaRef"
                         :show-all-levels="false"
                         v-model="form.orgNo"
                         style="width: 100px"
                         @changeValue="changeValue"
-                    /> -->
+                    />
                 </el-form-item>
                 <el-form-item>
                     <el-select v-model="form.isUpToGrid" style="width: 100px" @change="info">
@@ -27,13 +27,13 @@
         <!-- <Map ref="mapRef" @changeValue="changeValue" :lineInfo="lineInfo" @drop="drop" @show="infoShow" /> -->
         <div v-show="lineInfo">
             <!-- 省级 -->
-            <div v-show="control == 3">
-                <mapL ref="mapLRef" class="mapL" />
+            <div v-show="control == 1">
+                <mapL ref="mapLRef" class="mapL" @LookMap="LookMap" />
                 <mapR ref="mapRRef" class="mapR" />
             </div>
             <!-- 市级 -->
             <!-- <div v-show="control == 4"> -->
-            <div v-show="control > 3">
+            <div v-show="control == 2">
                 <cityMapL ref="cityMapLRef" class="mapL" />
                 <cityMapR ref="cityMapRRef" class="mapR" />
             </div>
@@ -46,7 +46,7 @@
 <script setup lang="ts">
 import { onMounted, nextTick, ref, provide } from 'vue'
 import Area from '@/components/form/area/index.vue'
-// import Map from './components/map1.vue'
+// import Map from './components/map.vue'
 import { useDictData } from '@/stores/dictData'
 import { mainHeight } from '@/utils/layout'
 import { Search, Refresh } from '@element-plus/icons-vue'
@@ -57,9 +57,10 @@ import cityMapR from './components/cityMapR.vue'
 
 import Info from './components/line/info.vue'
 import DatePicker from '@/components/form/datePicker/index.vue'
+import { map } from 'xe-utils'
 const dictData = useDictData()
 defineOptions({
-    name: '/panorama'
+    name: 'panorama'
 })
 const datePickerRef = ref()
 const areaRef = ref()
@@ -70,7 +71,7 @@ const InfoRef = ref()
 const mapRRef = ref()
 const cityMapLRef = ref()
 const cityMapRRef = ref()
-const list: any = [dictData.state.area[0], ...dictData.state.area[0].children]
+// const list: any = [dictData.state.area[0], ...dictData.state.area[0].children]
 const options: any = ref([
     {
         name: dictData.state.area[0].name,
@@ -81,21 +82,21 @@ const options: any = ref([
         id: 1
     }
 ])
-const control = ref(3)
+const control = ref(1)
 const form: any = ref({
     name: '',
     orgNo: dictData.state.area[0].id,
     isUpToGrid: 0
 })
 
-
 const height = mainHeight(10)
 // 获取区域名称
 const changeValue = (e: any) => {
-    form.value.orgNo = list.filter((item: any) => item.code == e.orgId)[0]?.id || dictData.state.area[0].id
-    options.value[0].name = e.name
+    mapRef.value.locatePositions(e)
+    form.value.orgNo = e.data.id //list.filter((item: any) => item.code == e.orgId)[0]?.id || dictData.state.area[0].id
+    options.value[0].name = e.data.areaName
 
-    control.value = e.type
+    control.value = e.data.level
 
     info()
 }
@@ -107,21 +108,15 @@ const drop = (id: string) => {
     })
 }
 // 关闭左右数据展示
-const infoShow = (e:boolean) => {
+const infoShow = (e: boolean) => {
     mapLRef.value.show = e
     mapRRef.value.show = e
     cityMapLRef.value.show = e
     cityMapRRef.value.show = e
 }
-
-const reset = () => {
-    form.value = {
-        name: '',
-        orgNo: dictData.state.area[0].id,
-        isUpToGrid: 0
-    }
-
-    info()
+// 地图控制图层
+const LookMap = (row: any) => {
+    mapRef.value.addMarkers({ ...row, type: 1 })
 }
 const info = () => {
     form.value.startTime = datePickerRef.value.timeValue[0]
@@ -133,7 +128,8 @@ const info = () => {
     // form.value.endTime = `2024-07-30`
     // form.value.searchEndTime = `2024-07-30`
     form.value.type = datePickerRef.value.interval
-    if (control.value == 3) {
+    mapRef.value.addMarkers()
+    if (control.value == 1) {
         mapLRef.value.info(form.value)
         mapRRef.value.info(form.value)
     } else {
@@ -142,7 +138,8 @@ const info = () => {
     }
 }
 onMounted(() => {
-    info()
+    // info()
+    changeValue({ data: dictData.state.area[0] })
     // aaa()
 })
 </script>
@@ -162,6 +159,10 @@ onMounted(() => {
             border-radius: 8px;
         }
     }
+    .el-input__wrapper {
+        height: 46px;
+        border-radius: 8px;
+    }
     .el-form-item {
         margin-right: 15px;
     }