ZhuRui
65 lines
1.5 KiB
TypeScript
65 lines
1.5 KiB
TypeScript
import { h, type VNode } from 'vue';
|
|
import type { IconType } from 'vue-icons-plus/lib';
|
|
import {
|
|
AiOutlineAudit,
|
|
AiOutlineBarChart,
|
|
AiOutlineHistory,
|
|
AiOutlineMoneyCollect,
|
|
AiOutlinePayCircle,
|
|
AiOutlinePicture,
|
|
AiOutlineSafetyCertificate,
|
|
AiOutlineSetting,
|
|
AiOutlineShoppingCart,
|
|
AiOutlineTeam,
|
|
AiOutlineTransaction,
|
|
AiOutlineTrophy,
|
|
AiOutlineUnorderedList,
|
|
AiOutlineUser,
|
|
AiOutlineWallet,
|
|
} from 'vue-icons-plus/ai';
|
|
|
|
/** 路由 / 菜单 / 标签页使用的图标名 → vue-icons-plus 组件 */
|
|
const ROUTE_ICON_MAP: Record<string, IconType> = {
|
|
AiOutlineTrophy,
|
|
AiOutlineUnorderedList,
|
|
AiOutlineShoppingCart,
|
|
AiOutlineTeam,
|
|
AiOutlinePicture,
|
|
AiOutlineHistory,
|
|
AiOutlineTransaction,
|
|
AiOutlineMoneyCollect,
|
|
AiOutlineWallet,
|
|
AiOutlinePayCircle,
|
|
AiOutlineBarChart,
|
|
AiOutlineSetting,
|
|
AiOutlineUser,
|
|
AiOutlineSafetyCertificate,
|
|
AiOutlineAudit,
|
|
};
|
|
|
|
export type RouteIconName = keyof typeof ROUTE_ICON_MAP;
|
|
|
|
export interface RouteIconOptions {
|
|
size?: number | string;
|
|
class?: string;
|
|
color?: string;
|
|
}
|
|
|
|
/** 将路由 meta.icon 字符串渲染为图标 VNode */
|
|
export function renderRouteIcon(iconName?: string, options: RouteIconOptions = {}): VNode | null {
|
|
if (!iconName) return null;
|
|
|
|
const Icon = ROUTE_ICON_MAP[iconName];
|
|
if (!Icon) {
|
|
console.warn(`[RouteIcon] 未注册的图标: ${iconName}`);
|
|
return null;
|
|
}
|
|
|
|
const { size = 14, class: className, color } = options;
|
|
return h(Icon, {
|
|
size,
|
|
class: className,
|
|
...(color ? { color } : {}),
|
|
});
|
|
}
|