liujiejie 1 年之前
父節點
當前提交
3a7ffc8de4
共有 3 個文件被更改,包括 63 次插入29 次删除
  1. 二進制
      src.zip
  2. 9 9
      src/router/index.js
  3. 54 20
      src/views/home/components/Menu.vue

二進制
src.zip


+ 9 - 9
src/router/index.js

@@ -28,7 +28,7 @@ const createRouter = () =>
             iconName: "gps",
             component: () =>
               import(
-                /*webpackChunkName:'home-cockpitManage'*/ "../views/admin/cockpitManage/Index.vue"
+                /*webpackChunkName:'home-cockpitManage'*/ "../views/admin/cockpitManage/electronicMap.vue"
               ),
             // children: [
             //   // 电子地图
@@ -44,14 +44,14 @@ const createRouter = () =>
             // ],
           },
           {
-             // 电子地图
-              id: 11,
-              path: "cockpitManage/electronic-map",
-              name: "electronicMap",
-              component: () =>
-                import(
-                  /*webpackChunkName:'home-cockpitManage'*/ "../views/admin/cockpitManage/electronicMap.vue"
-                ),
+            // 电子地图
+            id: 11,
+            path: "cockpitManage/electronic-map",
+            name: "electronicMap",
+            component: () =>
+              import(
+                /*webpackChunkName:'home-cockpitManage'*/ "../views/admin/cockpitManage/electronicMap.vue"
+              ),
           },
           // 电子地图
           // {

+ 54 - 20
src/views/home/components/Menu.vue

@@ -2,13 +2,23 @@
   <el-aside :width="!isCollapse ? '250px' : '100px'" class="asideBox">
     <div class="homeBox">
       <div class="logoItem" :class="{ 'flexCenter ': isCollapse }">
-        <div class="logoImg" v-show="isCollapse" @click="
-          handleChangeMenuUrl(
-            { name: '驾驶舱', id: 1, path: 'cockpitManage', iconName: 'gps' },
-            `/home/cockpitManage?name=驾驶舱`
-          )
-          ">
-          <SvgIcons name="dnao" class="dnao" width="40px" height="40px" color="#222"></SvgIcons>
+        <div
+          class="logoImg"
+          v-show="isCollapse"
+          @click="
+            handleChangeMenuUrl(
+              { name: '驾驶舱', id: 1, path: 'cockpitManage', iconName: 'gps' },
+              `/home/cockpitManage?name=驾驶舱`
+            )
+          "
+        >
+          <SvgIcons
+            name="dnao"
+            class="dnao"
+            width="40px"
+            height="40px"
+            color="#222"
+          ></SvgIcons>
         </div>
         <span
           v-if="!isCollapse"
@@ -24,24 +34,49 @@
         </span>
       </div>
     </div>
-    <el-menu collapse-transition ref="menu" class="mt-3 el-menu-vertical-demo" @open="handleOpen" @close="handleClose"
-      background-color="#eff1f3" text-color="#000" active-text-color="#0754a1" :router="true"
-      :default-active="defaultActive" :unique-opened="true" :collapse="isCollapse">
+    <el-menu
+      collapse-transition
+      ref="menu"
+      class="mt-3 el-menu-vertical-demo"
+      @open="handleOpen"
+      @close="handleClose"
+      background-color="#eff1f3"
+      text-color="#000"
+      active-text-color="#0754a1"
+      :router="true"
+      :default-active="defaultActive"
+      :unique-opened="true"
+      :collapse="isCollapse"
+    >
       <div v-for="item in routerList" :key="item.id">
-        <el-submenu :index="item.path" v-if="item.children && item.children.length > 0">
+        <el-submenu
+          :index="item.path"
+          v-if="item.children && item.children.length > 0"
+        >
           <template slot="title">
             <i class="el-icon-menu" v-if="isElPrefix(item.iconName)"></i>
-            <i v-else class="svnIcon"><svg-icon :icon-class="item.iconName" /></i>
+            <i v-else class="svnIcon"
+              ><svg-icon :icon-class="item.iconName"
+            /></i>
             <span>{{ item.name }}</span>
           </template>
-          <el-menu-item v-for="child in item.children" :key="child.id"
-            :index="`/home/${item.path}/${child.path}?id=${child.id}&name=${child.name}`">
+          <el-menu-item
+            v-for="child in item.children"
+            :key="child.id"
+            :index="`/home/${item.path}/${child.path}?id=${child.id}&name=${child.name}`"
+          >
             <i class="el-icon-menu" v-if="isElPrefix(child.iconName)"></i>
-            <i v-else class="svnIcon"><svg-icon :icon-class="child.iconName" /></i>
+            <i v-else class="svnIcon"
+              ><svg-icon :icon-class="child.iconName"
+            /></i>
             <span>{{ child.name }}</span>
           </el-menu-item>
         </el-submenu>
-        <el-menu-item :key="item.id" :index="`/home/${item.path}?id=${item.id}&name=${item.name}`" v-else>
+        <el-menu-item
+          :key="item.id"
+          :index="`/home/${item.path}?id=${item.id}&name=${item.name}`"
+          v-else
+        >
           <i class="el-icon-menu" v-if="isElPrefix(item.iconName)"></i>
           <i v-else class="svnIcon"><svg-icon :icon-class="item.iconName" /></i>
           <span>{{ item.name }}</span>
@@ -82,7 +117,7 @@ export default {
       keyObject: {},
       routerList: [
         {
-          id:1,
+          id: 1,
           path: "cockpitManage",
           name: "驾驶舱",
           iconName: "gps",
@@ -91,7 +126,7 @@ export default {
           },
           children: [
             {
-              id:11,
+              id: 11,
               iconName: "gps",
               path: "electronic-map",
               name: "电子地图",
@@ -297,8 +332,7 @@ export default {
           color: #19436d;
         }
 
-        transition: width 0.5s ease,
-        transform 0.5s ease;
+        transition: width 0.5s ease, transform 0.5s ease;
         transform-origin: left;
       }