更新 menu 图标

package.json

@@ -10,6 +10,7 @@
   "dependencies": {
     "@cloudbase/js-sdk": "^1.7.1",
     "@element-plus/icons": "^0.0.11",
+    "@element-plus/icons-vue": "^2.0.6",
     "axios": "^0.21.1",
     "element-plus": "^1.1.0-beta.24",
     "lodash": "^4.17.21",

src/components/Aside.vue

@@ -9,7 +9,9 @@
   >
     <el-sub-menu v-for="(item, index) in menu" :key="item" :index="index + ''">
       <template v-slot:title>
-        <i :class="item.icon"></i>
+        <el-icon :size="18">
+          <component :is="item.icon" />
+        </el-icon>
         <span>{{ item.title }}</span>
       </template>
       <el-menu-item
@@ -33,7 +35,7 @@ export default {
     }
     let menu = [
       {
-        icon: "el-icon-s-unfold",
+        icon: "Fold",
         title: "航次管理",
         items: [
           {
@@ -43,7 +45,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "userFilled",
         title: "货主信息",
         items: [
           {
@@ -53,7 +55,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "User",
         title: "代理信息",
         items: [
           {
@@ -63,7 +65,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "Avatar",
         title: "船东信息",
         items: [
           {
@@ -73,7 +75,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "Ship",
         title: "船舶信息",
         items: [
           {
@@ -83,7 +85,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "Place",
         title: "港口信息",
         items: [
           {
@@ -97,7 +99,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "Magnet",
         title: "航次区块链",
         items: [
           {
@@ -107,7 +109,7 @@ export default {
         ],
       },
       {
-        icon: "el-icon-s-unfold",
+        icon: "Document",
         title: "版本日志",
         items: [
           {
@@ -126,3 +128,9 @@ export default {
   },
 };
 </script>
+<style scoped>
+.el-sub-menu__title i {
+  height: 20px;
+  margin-right: 10px;
+}
+</style>

src/main.js

@@ -15,7 +15,10 @@ app.component("Certs", Certs);
 app.component("Uploader", Uploader);
 app.component("RemoteSearch", RemoteSearch);
 app.component("RemoteSelect", RemoteSelect);
-
+import * as ElementPlusIconsVue from "@element-plus/icons-vue";
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+  app.component(key, component);
+}
 router.beforeEach(async (to, from, next) => {
   let id = localStorage.id;
   if (id) {