2.5 KiB
2.5 KiB
ADDED Requirements
Requirement: Asset Information Responsive Layout
The asset information page SHALL provide responsive layouts from the asset search area through the bottom operation audit log area so the page remains readable and operable on desktop, tablet, and mobile-width screens.
The responsive layout MUST NOT change existing API calls, permission checks, emitted events, business calculations, or displayed data semantics.
Scenario: Search area fits small screens
- GIVEN 用户在小屏幕设备上打开资产信息页
- WHEN 页面渲染资产查询区域
- THEN 搜索输入框 MUST NOT use a fixed width that exceeds the viewport
- AND 查询、同步、返回上次搜索等按钮 MUST wrap or stack without causing page-level horizontal overflow
- AND ICCID 放大提示 MUST fit within the viewport width
Scenario: Information cards reduce columns on narrow screens
- GIVEN 用户在平板或手机宽度打开资产信息页
- WHEN 页面渲染基础信息、设备实时信息或当前生效套餐详情
- THEN 描述项列数 MUST reduce according to available width
- AND long identifiers or status text MUST wrap or truncate within their container instead of pushing the page wider
Scenario: Flow usage sections remain readable
- GIVEN 用户在小屏幕设备上查看当前生效套餐
- WHEN 页面渲染真流量或虚流量使用区域
- THEN flow statistic sections MUST stack vertically when horizontal space is insufficient
- AND progress bars and percentages MUST remain visible and aligned within the card
Scenario: Tables scroll within their card on small screens
- GIVEN 用户在小屏幕设备上查看套餐列表、钱包流水或操作审计日志
- WHEN table columns exceed the available content width
- THEN the table container MUST provide horizontal scrolling
- AND the overall page MUST NOT be widened by the table
Scenario: Filters and pagination adapt to narrow screens
- GIVEN 用户在小屏幕设备上查看钱包流水或操作审计日志
- WHEN 页面渲染筛选器或分页器
- THEN filter controls MUST wrap or stack within the card
- AND pagination MUST remain reachable without overlapping adjacent content
Scenario: Desktop layout remains unchanged in behavior
- GIVEN 用户在桌面宽度打开资产信息页
- WHEN 页面渲染资产信息内容
- THEN existing business actions, permissions, table operations, and data displays MUST continue to behave as before