Uighur-Recognition-Web/src/utils/FixMenuItemIcon.tsx

/**
 * @FixMenuItemIcon 菜单图标手动导入
 * 
 * 
 */
import React from 'react';
import { MenuDataItem } from '@ant-design/pro-layout';
import {CarOutlined, UserOutlined, TableOutlined,
  DollarCircleOutlined, ShopOutlined, UserSwitchOutlined,
  HomeOutlined, SettingOutlined, TeamOutlined, DotChartOutlined,
  BlockOutlined, DesktopOutlined, DatabaseOutlined,
  WarningOutlined, CalendarOutlined, ExperimentOutlined,
  ThunderboltOutlined, BugOutlined, AreaChartOutlined,ContactsOutlined, GatewayOutlined, BellOutlined,
  PictureOutlined,
  OrderedListOutlined,
  BranchesOutlined
} from '@ant-design/icons';

const iconMap:any = {
  'CarOutlined': <CarOutlined/>,
  'UserOutlined': <UserOutlined/>,
  'TableOutlined': <TableOutlined/>,
  'DollarCircleOutlined': <DollarCircleOutlined/>,
  'ShopOutlined': <ShopOutlined/>,
  'UserSwitchOutlined': <UserSwitchOutlined/>,
  'HomeOutlined': <HomeOutlined/>,
  'SettingOutlined': <SettingOutlined/>,
  'TeamOutlined': <TeamOutlined/>,
  'DotChartOutlined': <DotChartOutlined/>,
  'BlockOutlined': <BlockOutlined/>,
  'DesktopOutlined': <DesktopOutlined/>,
  'DatabaseOutlined': <DatabaseOutlined/>,
  'WarningOutlined': <WarningOutlined/>,
  'CalendarOutlined': <CalendarOutlined/>,
  'ExperimentOutlined': <ExperimentOutlined/>,
  'ThunderboltOutlined': <ThunderboltOutlined/>,
  'BugOutlined': <BugOutlined/>,
  'AreaChartOutlined': <AreaChartOutlined/>,
  'ContactsOutlined': <ContactsOutlined/>,
  'GatewayOutlined': <GatewayOutlined/>,
  'BellOutlined': <BellOutlined/>,
  'PictureOutlined': <PictureOutlined/>,
  'OrderedListOutlined':<OrderedListOutlined />,
  'BranchesOutlined': <BranchesOutlined />
}
// FIX从接口获取菜单时icon为string类型
const fixMenuItemIcon = (menus: MenuDataItem[], iconType = 'Outlined'): MenuDataItem[] => {
  menus.forEach((item) => {
    const { icon, children } = item;
    if (typeof icon === 'string') {
      console.log(22, icon)
      if (icon in iconMap) {
        item.icon = iconMap[icon];
      } else {
        item.icon = iconMap['TableOutlined'];
      }
      // let fixIconName = icon.slice(0, 1).toLocaleUpperCase() + icon.slice(1) + iconType;
      // // @ts-ignore
      // item.icon = React.createElement(allIcons[fixIconName] || allIcons[icon]);
    }
    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
    children && children.length > 0 ? (item.children = fixMenuItemIcon(children)) : null;
  });
  return menus;
};

export default fixMenuItemIcon;