chore: 新增营销资料子菜单

src/components/icon/IconAudio.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="16" height="16">
+    <g>
+      <path
+        d="M6.667 9.333h2.667v13.333h-2.667v-13.333zM1.333 13.333h2.667v5.333h-2.667v-5.333zM12 2.667h2.667v24h-2.667v-24zM17.333 5.333h2.667v24h-2.667v-24zM22.667 9.333h2.667v13.333h-2.667v-13.333zM28 13.333h2.667v5.333h-2.667v-5.333z"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconCard.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="64 64 896 896" width="16" height="16">
+    <g>
+      <path
+        d="M928 160H96c-17.7 0-32 14.3-32 32v160h896V192c0-17.7-14.3-32-32-32zM64 832c0 17.7 14.3 32 32 32h832c17.7 0 32-14.3 32-32V440H64v392zm579-184c0-4.4 3.6-8 8-8h165c4.4 0 8 3.6 8 8v72c0 4.4-3.6 8-8 8H651c-4.4 0-8-3.6-8-8v-72z"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconH5.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" width="16" height="16">
+    <g>
+      <path
+        d="M0 32l34.9 395.8L191.5 480l157.6-52.2L384 32H0zm308.2 127.9H124.4l4.1 49.4h175.6l-13.6 148.4-97.9 27v.3h-1.1l-98.7-27.3-6-75.8h47.7L138 320l53.5 14.5 53.7-14.5 6-62.2H84.3L71.5 112.2h241.1l-4.4 47.7z"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconImage.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16">
+    <g>
+      <path
+        d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconMiniProgram.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="16" height="16">
+    <g>
+      <rect width="48" height="48" fill="white" fill-opacity="0.01"></rect>
+      <circle
+        cx="24"
+        cy="24"
+        r="20"
+        fill="none"
+        stroke="#333"
+        stroke-width="4"
+        stroke-linecap="round"
+        stroke-linejoin="round"></circle>
+      <path
+        d="M29 24C29.9889 24 30.9556 23.7068 31.7779 23.1574C32.6001 22.6079 33.241 21.827 33.6194 20.9134C33.9978 19.9998 34.0969 18.9945 33.9039 18.0246C33.711 17.0546 33.2348 16.1637 32.5355 15.4645C31.8363 14.7652 30.9454 14.289 29.9755 14.0961C29.0055 13.9031 28.0002 14.0022 27.0866 14.3806C26.173 14.759 25.3921 15.3999 24.8427 16.2222C24.2932 17.0444 24 18.0111 24 19V29C24 29.9889 23.7068 30.9556 23.1574 31.7779C22.6079 32.6001 21.8271 33.241 20.9134 33.6194C19.9998 33.9978 18.9945 34.0969 18.0246 33.9039C17.0546 33.711 16.1637 33.2348 15.4645 32.5355C14.7652 31.8363 14.289 30.9454 14.0961 29.9755C13.9031 29.0055 14.0022 28.0002 14.3806 27.0866C14.759 26.173 15.3999 25.3921 16.2222 24.8427C17.0444 24.2932 18.0111 24 19 24"
+        stroke="#333"
+        stroke-width="4"
+        stroke-linecap="round"
+        stroke-linejoin="round"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconQrcode.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="64 64 896 896" width="16" height="16">
+    <g>
+      <path
+        d="M468 128H160c-17.7 0-32 14.3-32 32v308c0 4.4 3.6 8 8 8h332c4.4 0 8-3.6 8-8V136c0-4.4-3.6-8-8-8zm-56 284H192V192h220v220zm-138-74h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm194 210H136c-4.4 0-8 3.6-8 8v308c0 17.7 14.3 32 32 32h308c4.4 0 8-3.6 8-8V556c0-4.4-3.6-8-8-8zm-56 284H192V612h220v220zm-138-74h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm590-630H556c-4.4 0-8 3.6-8 8v332c0 4.4 3.6 8 8 8h332c4.4 0 8-3.6 8-8V160c0-17.7-14.3-32-32-32zm-32 284H612V192h220v220zm-138-74h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm194 210h-48c-4.4 0-8 3.6-8 8v134h-78V556c0-4.4-3.6-8-8-8H556c-4.4 0-8 3.6-8 8v332c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V644h78v102c0 4.4 3.6 8 8 8h190c4.4 0 8-3.6 8-8V556c0-4.4-3.6-8-8-8zM746 832h-48c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8zm142 0h-48c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconText.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16">
+    <g>
+      <path
+        d="M9.93 13.5h4.14L12 7.98zM20 2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-4.05 16.5l-1.14-3H9.17l-1.12 3H5.96l5.11-13h1.86l5.11 13h-2.09z"></path>
+    </g>
+  </svg>
+</template>

src/components/icon/IconVideo.vue

+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="16" height="16">
+    <g>
+      <path
+        d="M22.667 12.267l6.951-4.867c0.107-0.076 0.239-0.121 0.383-0.121 0.368 0 0.667 0.298 0.667 0.667 0 0 0 0.001 0 0.001v-0 16.107c0 0 0 0 0 0.001 0 0.368-0.298 0.667-0.667 0.667-0.143 0-0.276-0.045-0.385-0.122l0.002 0.001-6.951-4.867v5.6c0 0.736-0.597 1.333-1.333 1.333v0h-18.667c-0.736 0-1.333-0.597-1.333-1.333v0-18.667c0-0.736 0.597-1.333 1.333-1.333v0h18.667c0.736 0 1.333 0.597 1.333 1.333v0 5.6zM6.667 10.667v2.667h2.667v-2.667h-2.667z"></path>
+    </g>
+  </svg>
+</template>

src/components/layout/Aside.vue

@@ -54,7 +54,10 @@ function findMenu(path: string, menus: IMenuItem[]) {
           v-for="item in currentMenu.children"
           :key="item.path"
           :class="{ 'is-active': item.path === currentSubmenu?.path }">
-          <RouterLink :to="item.path">{{ item.name }}</RouterLink>
+          <RouterLink :to="item.path">
+            <component :is="item.icon" class="submenu-icon" v-if="item.icon"></component>
+            {{ item.name }}
+          </RouterLink>
         </li>
       </ul>
     </nav>
@@ -106,13 +109,24 @@ function findMenu(path: string, menus: IMenuItem[]) {
       margin: 8px 0;
       font-size: 12px;
       line-height: 30px;
+      a {
+        height: 30px;
+        display: flex;
+        align-items: center;
+        padding: 0 20px;
+      }
+      svg {
+        fill: #9a9a9a;
+      }
+      .submenu-icon {
+        margin-right: 10px;
+      }
       &.is-active {
         color: #fff;
         background-color: var(--main-color);
-      }
-      a {
-        display: block;
-        padding: 0 20px;
+        svg {
+          fill: #fff;
+        }
       }
     }
   }

src/modules/material/index.ts → src/modules/material/image/index.ts

@@ -3,7 +3,7 @@ import Layout from '@/components/layout/Index.vue'
 
 const routes: RouteRecordRaw[] = [
   {
-    path: '/material',
+    path: '/material/image',
     component: Layout,
     children: [{ path: '', component: () => import('./views/Index.vue') }]
   }

src/modules/material/text/index.ts

+import type { RouteRecordRaw } from 'vue-router'
+import Layout from '@/components/layout/Index.vue'
+
+const routes: RouteRecordRaw[] = [
+  {
+    path: '/material',
+    redirect: '/material/text'
+  },
+  {
+    path: '/material/text',
+    component: Layout,
+    children: [{ path: '', component: () => import('./views/Index.vue') }]
+  }
+]
+
+export { routes }

src/modules/material/text/views/Index.vue

+<template>
+  <AppCard></AppCard>
+</template>

src/stores/menu.ts

@@ -8,6 +8,14 @@ import IconGroup from '@/components/icon/IconGroup.vue'
 import IconMaterial from '@/components/icon/IconMaterial.vue'
 import IconTrip from '@/components/icon/IconTrip.vue'
 import IconAnalyze from '@/components/icon/IconAnalyze.vue'
+import IconText from '@/components/icon/IconText.vue'
+import IconImage from '@/components/icon/IconImage.vue'
+import IconAudio from '@/components/icon/IconAudio.vue'
+import IconVideo from '@/components/icon/IconVideo.vue'
+import IconH5 from '@/components/icon/IconH5.vue'
+import IconQrcode from '@/components/icon/IconQrcode.vue'
+import IconMiniProgram from '@/components/icon/IconMiniProgram.vue'
+import IconCard from '@/components/icon/IconCard.vue'
 
 interface State {
   menus: IMenuItem[]
@@ -47,7 +55,17 @@ const menus: IMenuItem[] = [
   {
     name: '营销资料管理',
     path: '/material',
-    icon: markRaw(IconMaterial)
+    icon: markRaw(IconMaterial),
+    children: [
+      { name: '文本资料管理', path: '/material/text', icon: markRaw(IconText) },
+      { name: '图片资料管理', path: '/material/image', icon: markRaw(IconImage) },
+      { name: '语音资料管理', path: '/material/audio', icon: markRaw(IconAudio) },
+      { name: '视频资料管理', path: '/material/video', icon: markRaw(IconVideo) },
+      { name: 'H5资料管理', path: '/material/h5', icon: markRaw(IconH5) },
+      { name: '二维码资料管理', path: '/material/qrcode', icon: markRaw(IconQrcode) },
+      { name: '小程序资料管理', path: '/material/mini', icon: markRaw(IconMiniProgram) },
+      { name: '卡券资料管理', path: '/material/card', icon: markRaw(IconCard) }
+    ]
   },
   {
     name: '用户旅程',