Pine
84b3f12146
- 新增 ScreenLayout 布局路由：注入共享 PageHeader + 全局左右键循环导航 - PageHeader 无 props，按路由自动识别状态（数据实时/3D 实时/媒体播放） - DataScreen / DigitalTwin / MediaScreen 移除各自页眉，避免重复 - 页脚按页面按需保留（数据大屏 + 媒体轮播，数字孪生无） - 管理后台不参与导航循环；旧 /screen2 路由移除 - 补齐 MediaScreen 音量/播放/翻页图标与浅色主题样式
109 lines
3.2 KiB
React
109 lines
3.2 KiB
React
/* =========================================================
|
||
图标库：Appica Icons（@appica/icons-react）
|
||
禁止使用表情图标，统一从这里引用 SVG 图标
|
||
========================================================= */
|
||
import {
|
||
Bolt, Wrench, BuildingSkyscraper, Users, UsersGroup, Coin, Radio, Trophy,
|
||
Flask, BuildingFactory, Diamond, GraduationCap, ChartLine, ChartArea,
|
||
Clock, Robot, Broadcast, Message, Briefcase, Flame, Leaf, Star,
|
||
Check, Gauge, Cpu, Server, Database, Sparkles, Bulb, Settings,
|
||
Heart, Pill, Dna, Microscope, Atom, MapPin, Flag, Award, Medal,
|
||
History, Drone, Plane, Rocket, Satellite, Wallet, UserPlus, Activity,
|
||
Volume, VolumeOff, ChevronLeft, ChevronRight, PlayerPlay, PlayerPause,
|
||
} from '@appica/icons-react';
|
||
|
||
/* 名称 → 图标组件映射（推荐的调用方式：icon="bolt"） */
|
||
const NAME_MAP = {
|
||
bolt: Bolt,
|
||
wrench: Wrench,
|
||
building: BuildingSkyscraper,
|
||
'building-skyscraper': BuildingSkyscraper,
|
||
'building-community': UsersGroup,
|
||
users: Users,
|
||
'users-group': UsersGroup,
|
||
coin: Coin,
|
||
radio: Radio,
|
||
trophy: Trophy,
|
||
flask: Flask,
|
||
factory: BuildingFactory,
|
||
'building-factory': BuildingFactory,
|
||
diamond: Diamond,
|
||
graduation: GraduationCap,
|
||
'graduation-cap': GraduationCap,
|
||
'chart-line': ChartLine,
|
||
'chart-area': ChartArea,
|
||
clock: Clock,
|
||
robot: Robot,
|
||
broadcast: Broadcast,
|
||
message: Message,
|
||
briefcase: Briefcase,
|
||
flame: Flame,
|
||
leaf: Leaf,
|
||
star: Star,
|
||
check: Check,
|
||
gauge: Gauge,
|
||
cpu: Cpu,
|
||
server: Server,
|
||
database: Database,
|
||
sparkles: Sparkles,
|
||
bulb: Bulb,
|
||
settings: Settings,
|
||
heart: Heart,
|
||
pill: Pill,
|
||
dna: Dna,
|
||
microscope: Microscope,
|
||
atom: Atom,
|
||
'map-pin': MapPin,
|
||
flag: Flag,
|
||
award: Award,
|
||
medal: Medal,
|
||
history: History,
|
||
drone: Drone,
|
||
plane: Plane,
|
||
rocket: Rocket,
|
||
satellite: Satellite,
|
||
wallet: Wallet,
|
||
'user-plus': UserPlus,
|
||
activity: Activity,
|
||
volume: Volume,
|
||
'volume-off': VolumeOff,
|
||
'chevron-left': ChevronLeft,
|
||
'chevron-right': ChevronRight,
|
||
'player-play': PlayerPlay,
|
||
'player-pause': PlayerPause,
|
||
play: PlayerPlay,
|
||
pause: PlayerPause,
|
||
};
|
||
|
||
/**
|
||
* Icon —— 统一图标组件
|
||
* @param {string} name 图标标识（emoji 兼容 或 名称，如 "bolt" / "chart-line"）
|
||
* @param {number|string} size
|
||
* @param {number} strokeWidth
|
||
* @param {string} className
|
||
*/
|
||
export default function Icon({ name, size = 18, strokeWidth = 1.6, className = '', ...rest }) {
|
||
const Comp = NAME_MAP[name] || null;
|
||
if (!Comp) return null;
|
||
return (
|
||
<Comp
|
||
size={size}
|
||
strokeWidth={strokeWidth}
|
||
className={`appica-ico${className ? ` ${className}` : ''}`}
|
||
aria-hidden="true"
|
||
{...rest}
|
||
/>
|
||
);
|
||
}
|
||
|
||
/* 独立导出的常用图标（组件内直接引用） */
|
||
export {
|
||
Bolt, Wrench, BuildingSkyscraper, Users, Coin, Radio, Trophy,
|
||
Flask, BuildingFactory, Diamond, GraduationCap, ChartLine, ChartArea,
|
||
Clock, Robot, Broadcast, Message, Briefcase, Flame, Leaf, Star,
|
||
Check, Gauge, Cpu, Server, Database, Sparkles, Bulb, Settings,
|
||
Heart, Pill, Dna, Microscope, Atom, MapPin, Flag, Award, Medal,
|
||
History, Drone, Plane, Rocket, Satellite, Wallet, UserPlus, Activity,
|
||
Volume, VolumeOff, ChevronLeft, ChevronRight, PlayerPlay, PlayerPause,
|
||
};
|