feat: 离线图标功能

apps/web-antd/src/router/routes/local.ts

@@ -24,7 +24,7 @@ const profileRoute: RouteRecordStringComponent[] = [
       {
         component: '/_core/profile/index',
         meta: {
-          icon: 'mingcute:profile-line',
+          icon: 'mingcute:profile-line|offline',
           keepAlive: true,
           title: $t('ui.widgets.profile'),
         },
@@ -48,7 +48,7 @@ const profileRoute: RouteRecordStringComponent[] = [
         component: '/system/oss-config/index',
         meta: {
           activePath: '/system/oss',
-          icon: 'mingcute:profile-line',
+          icon: 'ant-design:setting-outlined|offline',
           keepAlive: true,
           title: 'oss配置',
         },
@@ -57,7 +57,6 @@ const profileRoute: RouteRecordStringComponent[] = [
       },
     ],
   },
-  // TODO: 图标要改
   {
     component: 'BasicLayout',
     meta: {
@@ -73,7 +72,7 @@ const profileRoute: RouteRecordStringComponent[] = [
         component: '/tool/gen/edit-gen',
         meta: {
           activePath: '/tool/gen',
-          icon: 'mingcute:profile-line',
+          icon: 'tabler:code|offline',
           keepAlive: true,
           title: '生成配置',
         },
@@ -97,7 +96,7 @@ const profileRoute: RouteRecordStringComponent[] = [
         component: '/system/role-assign/index',
         meta: {
           activePath: '/system/role',
-          icon: 'mingcute:profile-line',
+          icon: 'eos-icons:role-binding-outlined|offline',
           keepAlive: true,
           title: '分配角色',
         },
@@ -144,7 +143,7 @@ export const localMenuList: RouteRecordStringComponent[] = [
         path: '/vben-admin/document',
         component: 'IFrameView',
         meta: {
-          icon: 'lucide:book-open-text',
+          icon: 'lucide:book-open-text|offline',
           iframeSrc: 'https://dapdap.top',
           keepAlive: true,
           title: $t('demos.vben.document'),
@@ -156,7 +155,7 @@ export const localMenuList: RouteRecordStringComponent[] = [
     component: 'BasicLayout',
     meta: {
       hideChildrenInMenu: true,
-      icon: 'lucide:copyright',
+      icon: 'lucide:copyright|offline',
       order: 9999,
       title: $t('demos.vben.about'),
     },

apps/web-antd/src/router/routes/modules/vben.ts

@@ -28,7 +28,7 @@ const routes: RouteRecordRaw[] = [
         path: '/vben-admin/about',
         component: () => import('#/views/_core/about/index.vue'),
         meta: {
-          icon: 'lucide:copyright',
+          icon: 'lucide:copyright|offline',
           title: $t('demos.vben.about'),
         },
       },
@@ -37,7 +37,7 @@ const routes: RouteRecordRaw[] = [
         path: '/vben-admin/document',
         component: IFrameView,
         meta: {
-          icon: 'lucide:book-open-text',
+          icon: 'lucide:book-open-text|offline',
           link: VBEN_DOC_URL,
           title: $t('demos.vben.document'),
         },

apps/web-antd/src/views/_core/authentication/login.vue

@@ -6,6 +6,7 @@ import { computed, onMounted, ref, useTemplateRef } from 'vue';
 import { AuthenticationLogin, z } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
+import { Modal } from 'ant-design-vue';
 import { omit } from 'lodash-es';
 
 import { tenantList, type TenantResp } from '#/api';
@@ -144,6 +145,14 @@ async function handleAccountLogin(values: LoginAndRegisterParams) {
     }
   }
 }
+
+onMounted(() => {
+  Modal.info({
+    title: '提示',
+    content:
+      '离线图标分支需要导入[离线图标.sql] 目录:scripts/菜单图标替换sql/update_icon_离线图标.sql',
+  });
+});
 </script>
 
 <template>

apps/web-antd/src/views/system/menu/data.tsx

@@ -1,12 +1,15 @@
 import type { VxeGridProps } from '#/adapter/vxe-table';
 
+import { h } from 'vue';
+
 import { DictEnum } from '@vben/constants';
+import { FolderIcon, MenuIcon, OkButtonIcon, VbenIcon } from '@vben/icons';
 import { $t } from '@vben/locales';
 import { getPopupContainer } from '@vben/utils';
 
 import { type FormSchemaGetter, z } from '#/adapter/form';
 import { getDictOptions } from '#/utils/dict';
-import { renderDict, renderIcon } from '#/utils/render';
+import { renderDict } from '#/utils/render';
 
 export const querySchema: FormSchemaGetter = () => [
   {
@@ -48,11 +51,10 @@ export const yesNoOptions = [
 
 // （M目录 C菜单 F按钮）
 const menuTypes = {
-  M: { value: '目录', icon: 'fxemoji:folder' },
-  C: { value: '菜单', icon: 'fluent-emoji-flat:open-book' },
-  F: { value: '按钮', icon: 'fluent-emoji:ok-button' },
+  C: { icon: MenuIcon, value: '菜单' },
+  F: { icon: OkButtonIcon, value: '按钮' },
+  M: { icon: FolderIcon, value: '目录' },
 };
-
 export const columns: VxeGridProps['columns'] = [
   {
     title: '菜单名称',
@@ -74,7 +76,9 @@ export const columns: VxeGridProps['columns'] = [
           return '';
         }
         return (
-          <span class={'flex justify-center'}>{renderIcon(row.icon)}</span>
+          <span class={'flex justify-center'}>
+            <VbenIcon icon={row.icon} />
+          </span>
         );
       },
     },
@@ -95,9 +99,9 @@ export const columns: VxeGridProps['columns'] = [
           return '未知';
         }
         return (
-          <span class={['flex', 'items-center', 'justify-center']}>
-            {renderIcon(current.icon)}
-            <span style={{ marginLeft: '2px' }}>{current.value}</span>
+          <span class="flex items-center justify-center gap-1">
+            {h(current.icon, { class: 'size-[18px]' })}
+            <span>{current.value}</span>
           </span>
         );
       },