feat: group list

scene/src/components/info/index.vue

@@ -18,6 +18,20 @@
       </div>
       <!-- <img v-show="isShowHotIcon" @click="() => { isOpenHot = !isOpenHot; isShow = false }"
         src="@/assets/images/icon/hot-icon.png" alt=""> -->
+
+      <el-dropdown v-if="curGroup" trigger="click" placement="bottom"
+        @command="handleLocation"
+      >
+        <img src="@/assets/img/list.png" />
+
+        <template #dropdown>
+          <el-dropdown-menu class="info-box-dropdown">
+            <el-dropdown-item v-for="item in curGroup" :key="item.m" :command="item.m">
+              {{ item.label }}
+            </el-dropdown-item>
+          </el-dropdown-menu>
+        </template>
+      </el-dropdown>
     </div>
     <transition name="fade">
       <div class="disc-box" v-if="isShow" v-html="disc"></div>
@@ -41,6 +55,19 @@
 </template>
 
 <script>
+const GROUP = [
+  [
+    {
+      label: '乾务糖厂码头桁架',
+      m: 'KJ-0r8j5EQjXCH'
+    },
+    {
+      label: '乾务糖厂除尘塔',
+      m: 'KJ-sF36qa2CucM'
+    },
+  ]
+]
+
 export default {
   components: {},
   data() {
@@ -51,7 +78,8 @@ export default {
       isShowHotIcon: false,
       isOpenHot: false,
       data: [],
-      hotInd: null
+      hotInd: null,
+      curGroup: null
     };
   },
   computed: {},
@@ -69,6 +97,9 @@ export default {
       if (window.parent) {
         window.parent.window.backFu()
       }
+    },
+    handleLocation(m) {
+      window.location.href = `${location.origin}${location.pathname}?m=${m}`
     }
   },
   created() { },
@@ -107,6 +138,13 @@ export default {
         this.isShow = false
       }
     }, 5000)
+
+    const i = GROUP.findIndex(item => {
+      return item.findIndex(subItem => subItem.m === window.number) > -1
+    })
+    if (i > -1) {
+      this.curGroup = GROUP[i]
+    }
   },
   beforeCreate() { }, //生命周期 - 创建之前
   beforeMount() { }, //生命周期 - 挂载之前
@@ -128,9 +166,26 @@ export default {
   /* transform: translateX(-50%); */
   color: #fff;
 
+  &-dropdown {
+    border: none;
+    background-color: rgba(94, 26, 19, 0.60);
+
+    /deep/ .popper__arrow {
+      display: none;
+    }
+    .el-dropdown-menu__item {
+      color: white;
+
+      &:hover {
+        color: #ECC439;
+        background: none;
+      }
+    }
+  }
   .top {
     height: 100%;
     display: flex;
+    align-items: center;
     transition: all 1s ease;
 
     img {