diff --git a/design-qa.md b/design-qa.md new file mode 100644 index 0000000..dbbf2bb --- /dev/null +++ b/design-qa.md @@ -0,0 +1,47 @@ +# Energy Hydrogen Board Design QA + +- Source of truth: `/tmp/energy-h2-bi-board-prototype-0818/index.html` +- Prototype archive: `/Users/kkfluous/Library/Containers/com.tencent.xinWeChat/Data/Documents/xwechat_files/wxid_1704407055112_3af8/msg/file/2026-08/energy-h2-bi-board-html.zip` +- Implementation: `http://localhost:3000/energy#hydrogen/overview` +- Desktop viewport: 1280 x 720 CSS px +- Mobile viewport checked for the daily flow: 390 x 844 CSS px + +## Compared States + +| State | Prototype | Implementation | Combined comparison | +| --- | --- | --- | --- | +| Global overview | `/var/tmp/proto-global-overview.png` | `/var/tmp/impl-global-overview-final.png` | `/var/tmp/compare-global-overview-final.png` | +| Global daily | `/var/tmp/proto-global-daily.png` | `/var/tmp/impl-global-daily-final.png` | `/var/tmp/compare-global-daily-final.png` | +| All stations | `/var/tmp/proto-station.png` | `/var/tmp/impl-station-final.png` | `/var/tmp/compare-station-final.png` | +| Station detail | `/var/tmp/proto-station-detail.png` | `/var/tmp/impl-station-detail-final.png` | `/var/tmp/compare-station-detail-final.png` | + +All desktop comparisons use the same viewport, pixel dimensions, navigation state, and side-by-side source/implementation input. + +## Interaction Evidence + +- Global overview KPI, month, region, station, customer, and insight entries open real ledger drill-down data. +- Global daily supports date presets, custom dates, all/Lingniu/external vehicle scopes, chart-to-date focus, and date -> station -> customer -> vehicle/source drill-down. +- Daily and station evidence tables provide Excel export where the prototype exposes an export command. +- All-station mode supports all/single station display, station selection, clickable daily KPI dialogs, and zero-activity stations. +- Station detail includes a continuous 10-day series with zero-filled late days, recent 7-day table, range trend, and 12-month customer quantity/fee matrices. +- Entering and leaving a station detail resets the page scroll position so the header and notice remain visible. +- A clean browser tab loaded the final overview with no console warnings or errors. +- Daily mobile flow has no body-level horizontal overflow; wide analytical tables retain intentional internal horizontal scrolling. + +## Iteration History + +1. P1: Station detail inherited the long station-list scroll position. Added deterministic scroll reset on enter and return. +2. P1: Daily drill stopped at station level. Implemented the prototype's full four-level drill and real ledger rows. +3. P1: Station KPI cards were static. Added the three prototype daily detail dialogs using continuous server-side daily summaries. +4. P2: Prototype state matrix was incomplete. Added global overview, global daily, all-station, single-station selector, and station detail states. +5. P2: Icons differed from the prototype. Replaced approximate icons with matching Lucide Fuel, Zap, Wallet, Calendar, Truck, Refresh, Download, and navigation icons. +6. P2: Recharts could measure a transitioning container at a negative size. Added minimum and initial dimensions and verified a clean reload. +7. P2: Station detail omitted dates without records. Zero-filled the requested range so delayed or absent reporting is visible rather than silently skipped. + +## Residual P3 + +- Prototype screenshots contain fixed mock dates and values; implementation screenshots use the current read-only database values. +- The prototype warning says opening balances are still calibrating. The implementation uses a truthful traceability notice because the live ledger does not expose that calibration state. +- Native date-picker popovers vary by operating system; the closed controls match the prototype hierarchy and icon roles. + +final result: passed diff --git a/docker-compose.yml b/docker-compose.yml index 6f235dc..b080be3 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -10,11 +10,6 @@ services: DB_USER: "oneos_db_prod" DB_PASSWORD: "adASHJcviqwjkbn23ngt1" DB_NAME: "ln_asset_management" - HYDROGEN_DB_HOST: "47.99.185.173" - HYDROGEN_DB_PORT: "3306" - HYDROGEN_DB_USER: "root" - HYDROGEN_DB_PASSWORD: "lnMysql." - HYDROGEN_DB_NAME: "ln_asset_management" MILEAGE_DB_HOST: "101.133.130.65" MILEAGE_DB_PORT: "3306" MILEAGE_DB_USER: "bi_reader_02" diff --git a/src/app/modules.ts b/src/app/modules.ts index 143c9d3..f5031e4 100644 --- a/src/app/modules.ts +++ b/src/app/modules.ts @@ -1,12 +1,12 @@ import { lazy } from 'react'; import { Activity, - BatteryCharging, Fuel, MapPinned, - Receipt, Route, Truck, + Wallet, + Zap, } from 'lucide-react'; import type { ModuleConfig } from '../components/Shell'; import { canAccessEnergy, canAccessScheduling } from '../shared/auth/roles'; @@ -49,8 +49,8 @@ const SCHEDULING_MODULE: ModuleConfig = { const ENERGY_MODULES: ModuleConfig[] = [ { id: 'hydrogen', label: '氢能', icon: Fuel, component: HydrogenModule }, - { id: 'electric', label: '电能', icon: BatteryCharging, component: ElectricModule }, - { id: 'etc', label: 'ETC', icon: Receipt, component: EtcModule }, + { id: 'electric', label: '电能', icon: Zap, component: ElectricModule }, + { id: 'etc', label: 'ETC', icon: Wallet, component: EtcModule }, ]; /** 根据主路径和角色生成导航；返回新数组，避免调用方修改静态注册表。 */ diff --git a/src/components/Shell.tsx b/src/components/Shell.tsx index fde3a0c..1fa6cc7 100644 --- a/src/components/Shell.tsx +++ b/src/components/Shell.tsx @@ -83,6 +83,9 @@ export function Shell({ modules }: { modules: ModuleConfig[] }) { const { user } = useAuth(); const activeLabel = flatModules.find((module) => module.id === activeModule)?.label ?? '业务看板'; + // 氢能经营看板已在模块内提供原型一致的标题与导航，避免桌面端重复显示全局面包屑。 + const showDesktopBreadcrumb = activeModule !== 'hydrogen'; + const isHydrogenPrototype = activeModule === 'hydrogen'; const watermarkText = useMemo(() => { const name = user?.userName || '未登录'; const time = new Date().toLocaleString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false }).replace(/\//g, '-'); @@ -92,14 +95,16 @@ export function Shell({ modules }: { modules: ModuleConfig[] }) { return (
- {/* 全局水印 */} -
-
${watermarkText}`)}")`, - backgroundRepeat: 'repeat', - }} /> -
- {/* Web 侧边栏 (md 及以上) */} + {/* 氢费看板按原型交付；其他模块继续保留全局水印。 */} + {!isHydrogenPrototype ? ( +
+
${watermarkText}`)}")`, + backgroundRepeat: 'repeat', + }} /> +
+ ) : null} + {/* Web 侧边栏 (md 及以上)：能源各模块使用同一套规格，以电能为基准。 */}