feat 首页第一个专题默认全选

ruoyi-ui/src/views/JiHeExpressway/components/InputSearch/index.vue

@@ -54,7 +54,11 @@ export default {
   data() {
     return {
       width: null,
-      popperOptions: {}
+      popperOptions: {
+        popHideCallBack: () => {
+          // console.log("---")
+        }
+      }
     }
   },
   emit: [

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/AMapContainer/index.vue

@@ -30,7 +30,7 @@ export default {
   },
   async mounted() {
     // console.log(this.$refs.mapContainerRef);
-    this.AMap = await loadAMap();
+    this.AMap = await loadAMap();//高德map load
 
     if (!this.AMap) return;
 
@@ -53,9 +53,9 @@ export default {
 
     Vue.prototype.mapIns = this.aMapIns;
 
-    this.aMapIns.on("complete", () => {
+    this.aMapIns.on("complete", () => { //map渲染完成
       this.loading = false;
-
+      this.$emit("update:isGisCompleted", true);
       // var polyline1 = new this.AMap.Polyline({
       //   path: [],
       //   strokeColor: "#67EBF7",

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/index.vue

@@ -129,6 +129,22 @@ export default {
       }
     }
   },
+  props: {
+    isGisCompleted: {
+      type: Boolean,
+      default: () => false
+    }
+  },
+  watch: {
+    isGisCompleted: {
+      handler(bool) {
+        if (!bool) return;
+        this.tabContentData.forEach(item => {
+          this.handleDeviceImmediate(item, true);
+        });
+      }
+    }
+  },
   inject: ['getMap'],
   created() {
     const defaultActive = 0;
@@ -169,7 +185,7 @@ export default {
       this.active = item.title;
       this.tabContentData = item.children;
     },
-    handleDeviceImmediate(item) {
+    handleDeviceImmediate(item, isDefault) {
       const key = getHandleDeviceType(item) || `${this.active}/${item.title}`;
 
       const status = item.status;
@@ -180,7 +196,7 @@ export default {
 
       if (!eventMap[`${key}${status ? "_close" : ""}`]) return this.$emit("onClickItem", item);
 
-      eventMap[`${key}${status ? "_close" : ""}`]?.call(this, item, this.filterData);
+      eventMap[`${key}${status ? "_close" : ""}`]?.call(this, item, this.filterData, isDefault);
     },
     handleDevice: debounce(function (item) {
       this.handleDeviceImmediate(item);

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js

@@ -84,11 +84,11 @@ let debounceNoneLngLatMessage = debounce(() => {
   Message.warning("部分设备经纬度为空");
 });
 
-function resolveDataOptions(data, config, component) {
+function resolveDataOptions(data, config, component, isDefault) {
   let lnglat =
     data.longitude && data.latitude ? [data.longitude, data.latitude] : null;
 
-  if (!lnglat) debounceNoneLngLatMessage();
+  if (!lnglat && !isDefault) debounceNoneLngLatMessage();
 
   return {
     weight: 1,
@@ -113,15 +113,17 @@ function resolveDataOptions(data, config, component) {
 
 export const eventMap = {
   // 设备 需要在地图显示的
-  async "地图路测设备/map"(item, filterData) {
+  async "地图路测设备/map"(item, filterData, isDefault) {
     const config = DeviceForMap[item.title];
-
-    const loadingMessage = Message.info({
+    let loadingMessage;
+    if (!isDefault) {
+      loadingMessage = Message.info({
         message: `${item.title}设备加载中...`,
         duration: 0,
         customClass: "loading-message",
         iconClass: "el-icon-loading",
       });
+    }
 
     const data = await getDeviceList(config.deviceType, filterData)
       .then(async (data) => {
@@ -130,10 +132,11 @@ export const eventMap = {
       })
       .catch(() => {});
 
-    loadingMessage.close();
+    loadingMessage?.close();
 
     if (!data) return;
-    if (!data.length) return Message.warning(`没有${item.title}事件数据!`);
+    if (!data.length && !isDefault)
+      return Message.warning(`没有${item.title}事件数据!`);
 
     eventMap[`地图路测设备/map_close`](item);
 
@@ -143,7 +146,7 @@ export const eventMap = {
     };
 
     let removeData = data.map((item) =>
-      resolveDataOptions.call(this, item, options, config.dialog)
+      resolveDataOptions.call(this, item, options, config.dialog, isDefault)
     );
     console.log(
       "%c [ removeData ]-112-「buttonEvent.js」",
@@ -161,14 +164,16 @@ export const eventMap = {
   },
 
   // 事件 需要在地图显示的
-  async "地图事件专题/map"(item) {
-    const loadingMessage = Message.info({
+  async "地图事件专题/map"(item, filterData, isDefault) {
+    let loadingMessage;
+    if (!isDefault) {
+      loadingMessage = Message.info({
         message: `${item.title}事件位置加载中...`,
         duration: 0,
         customClass: "loading-message",
         iconClass: "el-icon-loading",
       });
-
+    }
     const data = await getEventTopicList(EventTopics[item.title])
       .then(async (data) => {
         await delay(600);
@@ -176,11 +181,12 @@ export const eventMap = {
       })
       .catch(() => {});
 
-    loadingMessage.close();
+    loadingMessage?.close();
 
     if (!data) return;
 
-    if (!data.length) return Message.warning(`没有${item.title}事件数据!`);
+    if (!data.length && !isDefault)
+      return Message.warning(`没有${item.title}事件数据!`);
 
     eventMap[`地图事件专题/map_close`](item);
 
@@ -190,7 +196,13 @@ export const eventMap = {
     };
 
     let removeData = data.map((item) =>
-      resolveDataOptions.call(this, item, options, "TrafficIncidents")
+      resolveDataOptions.call(
+        this,
+        item,
+        options,
+        "TrafficIncidents",
+        isDefault
+      )
     );
 
     markerClusterIns.addData(removeData);
@@ -203,14 +215,16 @@ export const eventMap = {
   },
 
   // 感知事件
-  async "事件专题/感知事件"(item) {
-    const loadingMessage = Message.info({
+  async "事件专题/感知事件"(item, filterData, isDefault) {
+    let loadingMessage;
+    if (!isDefault) {
+      loadingMessage = Message.info({
         message: `${item.title}位置加载中...`,
         duration: 0,
         customClass: "loading-message",
         iconClass: "el-icon-loading",
       });
-
+    }
     const data = await getPerceiveEventList()
       .then(async (data) => {
         await delay(600);
@@ -218,11 +232,12 @@ export const eventMap = {
       })
       .catch(() => {});
 
-    loadingMessage.close();
+    loadingMessage?.close();
 
     if (!data) return;
 
-    if (!data?.length) return Message.warning(`没有${item.title}数据!`);
+    if (!data?.length && !isDefault)
+      return Message.warning(`没有${item.title}数据!`);
 
     eventMap[`事件专题/感知事件_close`](item);
 
@@ -232,12 +247,12 @@ export const eventMap = {
     };
 
     let removeData = data.map((item) =>
-      resolveDataOptions.call(this, item, options, "PerceiveEvent")
+      resolveDataOptions.call(this, item, options, "PerceiveEvent", isDefault)
     );
 
     markerClusterIns.addData(removeData);
 
-    loadingMessage.close();
+    loadingMessage?.close();
 
     cacheRemoveFunc[`事件专题/${item.title}`] = () =>
       markerClusterIns.removeData(removeData);

ruoyi-ui/src/views/JiHeExpressway/pages/Home/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class='Home'>
-    <AMapContainer ref="AMapContainerRef" />
+    <AMapContainer ref="AMapContainerRef" @update:isGisCompleted="(data) => { this.isGisCompleted = data; }" />
     <section class="content">
       <!-- 左侧 -->
       <div class="content-l">
@@ -8,7 +8,7 @@
         <FocusedMonitoring class="card-menu" />
 
         <!-- 下 -->
-        <RoadAndEvents ref="RoadAndEventsRef" class="content-l-b card-menu" />
+        <RoadAndEvents ref="RoadAndEventsRef" :isGisCompleted="isGisCompleted" class="content-l-b card-menu" />
       </div>
 
       <!-- 右侧 -->
@@ -57,7 +57,7 @@ export default {
     return {
       isShowInfoBoard: false,
       selectedDevice: null,
-
+      isGisCompleted: false,
     }
   },
   provide() {