feat: 优化菜单名称右侧的额外图标，使其支持更多图标渲染模式

src/layout/components/sidebar/mixNav.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import extraIcon from "./extraIcon.vue";
 import Search from "../search/index.vue";
 import Notice from "../notice/index.vue";
 import { useNav } from "@/layout/hooks/useNav";
@@ -26,6 +27,7 @@ const {
   menuSelect,
   resolvePath,
   username,
+  getDivStyle,
   avatarsStyle,
   getDropdownItemStyle,
   getDropdownItemClass
@@ -85,15 +87,12 @@ watch(
               :is="useRenderIcon(route.meta && toRaw(route.meta.icon))"
             />
           </div>
-          <span class="select-none">{{ transformI18n(route.meta.title) }}</span>
-          <FontIcon
-            v-if="route.meta.extraIcon"
-            width="30px"
-            height="30px"
-            style="position: absolute; right: 10px"
-            :icon="route.meta.extraIcon.name"
-            :svg="route.meta.extraIcon.svg ? true : false"
-          />
+          <div :style="getDivStyle">
+            <span class="select-none">
+              {{ transformI18n(route.meta.title) }}
+            </span>
+            <extraIcon :extraIcon="route.meta.extraIcon" />
+          </div>
         </template>
       </el-menu-item>
     </el-menu>