// Token → 视觉资源(SVG + PNG)显式映射 // // 替代旧机制 (require.context 自动收集 SVG + 手写 IMAGE_MAP 加载 PNG)。 // 加新 token 时必须在 phaseIconTokens.js 加 POS_MAP + 这里加 ASSETS, 否则 webpack 编译报错。 // // 资源约定: // svg: PhaseDiagram CSS mask-image 用 (必填, 16 个 token 都有) // png: SignalTimingChart ECharts image 用 (可选, 当前 12 个 token 有, 4 个右转无 PNG fallback 到 svg) // ─── 北方向 (LT) ─── import straightDown_svg from '@/assets/images/svg/icon_straight_down.svg'; import straightDown_png from '@/assets/images/icon_straight_down.png'; import turnDownLeft_svg from '@/assets/images/svg/icon_turn_down_left.svg'; import turnDownLeft_png from '@/assets/images/icon_turn_down_left.png'; import turnDownLeftU_svg from '@/assets/images/svg/icon_turn_down_left_uturn.svg'; import turnDownLeftU_png from '@/assets/images/icon_turn_down_left_uturn.png'; import turnDownRight_svg from '@/assets/images/svg/icon_turn_down_right.svg'; // 北右转无 png (镜像生成) // ─── 南方向 (RB) ─── import straightUp_svg from '@/assets/images/svg/icon_straight_up.svg'; import straightUp_png from '@/assets/images/icon_straight_up.png'; import turnUpLeft_svg from '@/assets/images/svg/icon_turn_up_left.svg'; import turnUpLeft_png from '@/assets/images/icon_turn_up_left.png'; import turnUpLeftU_svg from '@/assets/images/svg/icon_turn_up_left_uturn.svg'; import turnUpLeftU_png from '@/assets/images/icon_turn_up_left_uturn.png'; import turnUpRight_svg from '@/assets/images/svg/icon_turn_up_right.svg'; // 南右转无 png // ─── 东方向 (RT) ─── import straightLeft_svg from '@/assets/images/svg/icon_straight_left.svg'; import straightLeft_png from '@/assets/images/icon_straight_left.png'; import turnLeftDown_svg from '@/assets/images/svg/icon_turn_left_down.svg'; import turnLeftDown_png from '@/assets/images/icon_turn_left_down.png'; import turnLeftDownU_svg from '@/assets/images/svg/icon_turn_left_down_uturn.svg'; import turnLeftDownU_png from '@/assets/images/icon_turn_left_down_uturn.png'; import turnLeftUp_svg from '@/assets/images/svg/icon_turn_left_up.svg'; // 东右转无 png // ─── 西方向 (LB) ─── import straightRight_svg from '@/assets/images/svg/icon_straight_right.svg'; import straightRight_png from '@/assets/images/icon_straight_right.png'; import turnRightUp_svg from '@/assets/images/svg/icon_turn_right_up.svg'; import turnRightUp_png from '@/assets/images/icon_turn_right_up.png'; import turnRightUpU_svg from '@/assets/images/svg/icon_turn_right_up_uturn.svg'; import turnRightUpU_png from '@/assets/images/icon_turn_right_up_uturn.png'; import turnRightDown_svg from '@/assets/images/svg/icon_turn_right_down.svg'; // 西右转无 png export const TOKEN_ASSETS = { // 北方向 (LT) 'STRAIGHT_DOWN': { svg: straightDown_svg, png: straightDown_png }, 'TURN_DOWN_LEFT': { svg: turnDownLeft_svg, png: turnDownLeft_png }, 'TURN_DOWN_LEFT_UTURN': { svg: turnDownLeftU_svg, png: turnDownLeftU_png }, 'TURN_DOWN_RIGHT': { svg: turnDownRight_svg }, // 南方向 (RB) 'STRAIGHT_UP': { svg: straightUp_svg, png: straightUp_png }, 'TURN_UP_LEFT': { svg: turnUpLeft_svg, png: turnUpLeft_png }, 'TURN_UP_LEFT_UTURN': { svg: turnUpLeftU_svg, png: turnUpLeftU_png }, 'TURN_UP_RIGHT': { svg: turnUpRight_svg }, // 东方向 (RT) 'STRAIGHT_LEFT': { svg: straightLeft_svg, png: straightLeft_png }, 'TURN_LEFT_DOWN': { svg: turnLeftDown_svg, png: turnLeftDown_png }, 'TURN_LEFT_DOWN_UTURN': { svg: turnLeftDownU_svg, png: turnLeftDownU_png }, 'TURN_LEFT_UP': { svg: turnLeftUp_svg }, // 西方向 (LB) 'STRAIGHT_RIGHT': { svg: straightRight_svg, png: straightRight_png }, 'TURN_RIGHT_UP': { svg: turnRightUp_svg, png: turnRightUp_png }, 'TURN_RIGHT_UP_UTURN': { svg: turnRightUpU_svg, png: turnRightUpU_png }, 'TURN_RIGHT_DOWN': { svg: turnRightDown_svg }, }; // ─── 工具函数 ─── /** 取 token 的 SVG URL (PhaseDiagram CSS mask 用) */ export function getTokenSvg(token) { const a = TOKEN_ASSETS[token]; return a ? (a.svg || null) : null; } /** * 取 token 的图像 URL, 优先 prefer, fallback 另一种 * @param {string} token * @param {'png'|'svg'} prefer */ export function getTokenImage(token, prefer = 'png') { const a = TOKEN_ASSETS[token]; if (!a) return null; return prefer === 'png' ? (a.png || a.svg) : (a.svg || a.png); }