This commit is contained in:
sexygoat
@@ -0,0 +1,34 @@
|
||||
# Change: Update agent asset list and detail display
|
||||
|
||||
## Why
|
||||
|
||||
The current agent-side asset experience exposes too much low-value information, hides some high-value state, and requires unnecessary search-type switching. The latest requests also require shop-based filtering, clearer detail presentation, explicit pagination, and a fixed top control area so search and filters remain available while the user browses long lists.
|
||||
|
||||
## What Changes
|
||||
|
||||
- Add IoT card device-binding status to the agent asset list
|
||||
- Add cascaded shop filtering for the agent IoT card and device lists
|
||||
- Remove the manual search-type selector and fix search semantics by active tab
|
||||
- Keep the search input and filter controls fixed at the top while the asset list scrolls underneath
|
||||
- Replace bottom-reached auto pagination with an explicit load-more button for both asset tabs
|
||||
- Simplify asset detail basic fields and strengthen bound-card status presentation
|
||||
- Remove `保护状态`
|
||||
- Remove `切卡模式`
|
||||
- Move the bound-card real-name status badge into the slot-title row
|
||||
- Remove low-value device realtime traffic items and move "last online" into the realtime block as `最后上线时间`
|
||||
- Make package effective-period text more prominent in asset detail package lists
|
||||
- Only active packages should show the effective-period line
|
||||
- Adjust the current active package header content
|
||||
- Remove the order number line below the package name
|
||||
- Show the active period there as `生效期：开始时间 - 到期时间`
|
||||
|
||||
## Impact
|
||||
|
||||
- Affected specs:
|
||||
- `agent-asset-list`
|
||||
- `agent-asset-detail`
|
||||
- Affected code:
|
||||
- `src/pages/agent-system/assets/index.vue`
|
||||
- `src/pages/agent-system/asset-search/index.vue`
|
||||
- `src/pages/agent-system/asset-detail/index.vue`
|
||||
- `src/api/assets.ts`
|
||||
@@ -0,0 +1,108 @@
|
||||
## ADDED Requirements
|
||||
|
||||
### Requirement: Agent Asset Detail SHALL Remove Redundant Basic Fields
|
||||
|
||||
The agent asset detail experience SHALL remove fields that are no longer required from the basic information area.
|
||||
|
||||
#### Scenario: Viewing an IoT card detail
|
||||
|
||||
- **WHEN** the current asset is an IoT card
|
||||
- **THEN** the basic information section SHALL NOT show `批次号`
|
||||
|
||||
#### Scenario: Viewing a device detail
|
||||
|
||||
- **WHEN** the current asset is a device
|
||||
- **THEN** the basic information section SHALL NOT show `制造商`
|
||||
- **AND** the basic information section SHALL NOT show `批次号`
|
||||
- **AND** the basic information section SHALL NOT show `保护状态`
|
||||
- **AND** the basic information section SHALL NOT show `切卡模式`
|
||||
|
||||
### Requirement: Agent Asset Detail SHALL Emphasize Bound IoT Card Identity And Status
|
||||
|
||||
The agent device detail view SHALL make bound IoT card identity and real-name status easier to scan.
|
||||
|
||||
#### Scenario: Rendering a bound IoT card item
|
||||
|
||||
- **WHEN** a device detail contains a bound IoT card entry
|
||||
- **THEN** the label `电话` SHALL be renamed to `MSISDN`
|
||||
- **AND** the item SHALL display `carrier_name` as `运营商`
|
||||
- **AND** missing `msisdn` or `carrier_name` values SHALL render as `-`
|
||||
|
||||
#### Scenario: Rendering real-name status
|
||||
|
||||
- **WHEN** a bound IoT card has a `real_name_status`
|
||||
- **THEN** the UI SHALL render that status with stronger visual emphasis than ordinary low-contrast metadata text
|
||||
- **AND** the meaning of existing status values SHALL remain unchanged
|
||||
|
||||
#### Scenario: Rendering the bound-card header row
|
||||
|
||||
- **WHEN** a bound IoT card item is rendered in the device detail page
|
||||
- **THEN** the real-name status badge SHALL be placed in the same row as the slot title
|
||||
- **AND** the badge SHALL appear after the slot title text
|
||||
- **AND** the lower metadata area SHALL NOT render a second standalone real-name field for the same card
|
||||
|
||||
### Requirement: Agent Device Realtime Status SHALL Prioritize High-Value Realtime Information
|
||||
|
||||
The agent device detail realtime block SHALL remove low-value traffic rows and absorb the "last online" field as a realtime-oriented field.
|
||||
|
||||
#### Scenario: Rendering device realtime traffic statistics
|
||||
|
||||
- **WHEN** the device realtime block is shown
|
||||
- **THEN** it SHALL continue to show `今日用量`
|
||||
- **AND** it SHALL continue to show `限速`
|
||||
- **AND** it SHALL NOT show `下载流量`
|
||||
- **AND** it SHALL NOT show `上传流量`
|
||||
|
||||
#### Scenario: Rendering last online time
|
||||
|
||||
- **WHEN** a device detail page has a realtime section
|
||||
- **THEN** the page SHALL show `最后上线时间` inside the realtime section
|
||||
- **AND** it SHALL prefer `realtimeStatus.device_realtime.last_online_time`
|
||||
- **AND** it SHALL fall back to `deviceInfo.last_online_time` when the realtime value is absent
|
||||
|
||||
#### Scenario: Rendering the legacy time-information block
|
||||
|
||||
- **WHEN** the device detail page previously showed `创建时间`, `最后在线`, or `网关同步` in a separate time-information block
|
||||
- **THEN** that block SHALL no longer show `创建时间`
|
||||
- **AND** that block SHALL no longer show `最后在线`
|
||||
- **AND** that block SHALL no longer show `网关同步`
|
||||
|
||||
### Requirement: Agent Asset Detail Package List SHALL Emphasize Effective Period
|
||||
|
||||
The package list in agent asset detail SHALL make the effective period line visually prominent.
|
||||
|
||||
#### Scenario: Package has both start and end time
|
||||
|
||||
- **WHEN** a package list item has both `activated_at` and `expires_at`
|
||||
- **AND** the package is in active status
|
||||
- **THEN** the page SHALL render a dedicated effective-period line with the meaning `生效期：开始时间 至 结束时间`
|
||||
- **AND** that line SHALL have stronger visual prominence than the current weak auxiliary timestamp style
|
||||
|
||||
#### Scenario: Package is missing part of the effective period
|
||||
|
||||
- **WHEN** either `activated_at` or `expires_at` is missing
|
||||
- **AND** the package is in active status
|
||||
- **THEN** the effective-period line SHALL still be rendered
|
||||
- **AND** the missing value SHALL display as `-`
|
||||
|
||||
#### Scenario: Package is not in active status
|
||||
|
||||
- **WHEN** a package list item is not in active status
|
||||
- **THEN** the page SHALL NOT render the dedicated `生效期` line for that package
|
||||
|
||||
### Requirement: Agent Asset Detail Current Package SHALL Prioritize Effective Period Over Order Number
|
||||
|
||||
The current active package card in agent asset detail SHALL remove the order number from the package header area and use that space to surface the package active period.
|
||||
|
||||
#### Scenario: Rendering the current active package card
|
||||
|
||||
- **WHEN** the current active package card is rendered
|
||||
- **THEN** the package name SHALL remain visible
|
||||
- **AND** the order number line below the package name SHALL NOT be shown
|
||||
- **AND** the card SHALL show a labeled `生效期：开始时间 - 到期时间` line in that position instead
|
||||
|
||||
#### Scenario: Current package is missing part of the active period
|
||||
|
||||
- **WHEN** either the current package `activated_at` or `expires_at` is missing
|
||||
- **THEN** the labeled `生效期：开始时间 - 到期时间` line SHALL still be rendered
|
||||
- **AND** the missing value SHALL display as `-`
|
||||
@@ -0,0 +1,123 @@
|
||||
## ADDED Requirements
|
||||
|
||||
### Requirement: Agent IoT Card List SHALL Surface Device Binding Status
|
||||
|
||||
The agent-side IoT card list SHALL derive a device-binding status from the `device_virtual_no` field returned by `GET /api/admin/iot-cards/standalone` and show that status in each IoT card list item.
|
||||
|
||||
#### Scenario: Card is not bound to a device
|
||||
|
||||
- **WHEN** an IoT card item has `device_virtual_no` equal to `null`, `undefined`, an empty string, or a whitespace-only string
|
||||
- **THEN** the list item SHALL show a status tag with `未绑定设备`
|
||||
- **AND** the UI SHALL NOT display a fabricated device identifier
|
||||
- **AND** the UI SHALL NOT prepend an extra `设备绑定` label before the tag
|
||||
|
||||
#### Scenario: Card is bound to a device
|
||||
|
||||
- **WHEN** an IoT card item has a non-empty `device_virtual_no`
|
||||
- **THEN** the list item SHALL show a status tag with `已绑定设备`
|
||||
- **AND** the UI MAY keep the raw `device_virtual_no` hidden
|
||||
|
||||
### Requirement: Agent Asset Lists SHALL Support Cascaded Shop Filtering
|
||||
|
||||
The agent-side asset lists SHALL provide a cascaded shop filter that is backed by `GET /api/admin/shops/cascade` and applies the selected shop ID to the active list request.
|
||||
|
||||
#### Scenario: User chooses a shop node under the IoT card tab
|
||||
|
||||
- **WHEN** the user opens the shop filter under the `IoT卡` tab and confirms a shop node
|
||||
- **THEN** the selected node `id` SHALL be sent as `shop_id` in the subsequent IoT card list request
|
||||
- **AND** the list SHALL refresh using that shop filter
|
||||
|
||||
#### Scenario: User chooses a shop node under the device tab
|
||||
|
||||
- **WHEN** the user opens the shop filter under the `设备` tab and confirms a shop node
|
||||
- **THEN** the selected node `id` SHALL be sent as `shop_id` in the subsequent device list request
|
||||
- **AND** the device list SHALL refresh using that shop filter
|
||||
- **AND** the device list request SHALL keep its existing search semantics and append `shop_id` in addition to them
|
||||
|
||||
#### Scenario: Selected shop has children
|
||||
|
||||
- **WHEN** a shop node returned from `GET /api/admin/shops/cascade` has `has_children = true`
|
||||
- **THEN** the UI SHALL allow the user to continue drilling down to child shops
|
||||
- **AND** the UI SHALL use `parent_id` to load the next level
|
||||
|
||||
#### Scenario: User clears the shop filter
|
||||
|
||||
- **WHEN** the user clears the shop filter
|
||||
- **THEN** subsequent IoT card list requests SHALL omit `shop_id`
|
||||
- **AND** subsequent device list requests SHALL omit `shop_id`
|
||||
|
||||
#### Scenario: Device tab is active
|
||||
|
||||
- **WHEN** the active asset tab is `设备`
|
||||
- **THEN** the shop filter SHALL still be shown
|
||||
- **AND** device list requests SHALL support `shop_id`
|
||||
|
||||
### Requirement: Agent Asset Search Input SHALL Be Fixed By Active Tab
|
||||
|
||||
The agent asset list SHALL remove the manual search-type selector and bind search semantics directly to the active tab.
|
||||
|
||||
#### Scenario: IoT card tab search
|
||||
|
||||
- **WHEN** the active tab is `IoT卡`
|
||||
- **THEN** the search field SHALL target `iccid`
|
||||
- **AND** the search placeholder SHALL be `搜索ICCID`
|
||||
- **AND** the UI SHALL NOT show a search-type switcher
|
||||
|
||||
#### Scenario: Device tab search
|
||||
|
||||
- **WHEN** the active tab is `设备`
|
||||
- **THEN** the search field SHALL target `virtual_no`
|
||||
- **AND** the user-facing search label SHALL be `设备号`
|
||||
- **AND** the search placeholder SHALL be `搜索设备号`
|
||||
- **AND** the UI SHALL NOT show a search-type switcher
|
||||
|
||||
### Requirement: Agent Asset List Controls SHALL Stay Fixed At The Top
|
||||
|
||||
The agent-side asset list page SHALL keep the search input and the filter/tab control area fixed at the top of the page while the list content scrolls independently underneath.
|
||||
|
||||
#### Scenario: User scrolls a long IoT card list
|
||||
|
||||
- **WHEN** the active tab is `IoT卡` and the user scrolls the list
|
||||
- **THEN** the search input SHALL remain visible at the top
|
||||
- **AND** the filter and tab controls directly below it SHALL remain visible at the top
|
||||
- **AND** only the list content area SHALL scroll
|
||||
|
||||
#### Scenario: User scrolls a long device list
|
||||
|
||||
- **WHEN** the active tab is `设备` and the user scrolls the list
|
||||
- **THEN** the search input SHALL remain visible at the top
|
||||
- **AND** the filter and tab controls directly below it SHALL remain visible at the top
|
||||
- **AND** only the list content area SHALL scroll
|
||||
|
||||
#### Scenario: Fixed controls do not cover list content
|
||||
|
||||
- **WHEN** the fixed top control area is rendered
|
||||
- **THEN** the list content SHALL start below that area
|
||||
- **AND** the first list item SHALL remain fully visible and operable
|
||||
|
||||
### Requirement: Agent Asset Lists SHALL Use Explicit Load-More Pagination
|
||||
|
||||
The agent-side IoT card list and device list SHALL stop automatic pagination triggered by scrolling to the bottom and SHALL use an explicit footer button to load the next page.
|
||||
|
||||
#### Scenario: IoT card tab still has more pages
|
||||
|
||||
- **WHEN** the active tab is `IoT卡` and the current IoT card result set has more pages available
|
||||
- **THEN** the footer SHALL show a button labeled `加载更多`
|
||||
- **AND** the next page SHALL NOT be requested until the user clicks that button
|
||||
|
||||
#### Scenario: Device tab still has more pages
|
||||
|
||||
- **WHEN** the active tab is `设备` and the current device result set has more pages available
|
||||
- **THEN** the footer SHALL show a button labeled `加载更多`
|
||||
- **AND** the next page SHALL NOT be requested until the user clicks that button
|
||||
|
||||
#### Scenario: User clicks the load-more button
|
||||
|
||||
- **WHEN** the user clicks the `加载更多` button for the active tab
|
||||
- **THEN** the UI SHALL request the next page for that tab using the existing active filters and search parameters
|
||||
- **AND** the returned items SHALL append to the existing list instead of replacing it
|
||||
|
||||
#### Scenario: No more pages remain
|
||||
|
||||
- **WHEN** the active list has no more pages available
|
||||
- **THEN** the `加载更多` button SHALL NOT be shown
|
||||
@@ -0,0 +1,20 @@
|
||||
## 1. Spec
|
||||
|
||||
- [x] 1.1 Initialize OpenSpec in the repository
|
||||
- [x] 1.2 Capture project context in `openspec/project.md`
|
||||
- [x] 1.3 Create change proposal and delta specs for asset list and asset detail
|
||||
- [x] 1.4 Review and approve the proposal before implementation
|
||||
|
||||
## 2. Implementation
|
||||
|
||||
- [x] 2.1 Extend asset list typing and request parameters for `device_virtual_no` and `shop_id`
|
||||
- [x] 2.2 Update agent asset list UI for binding status, shop filter, and fixed search semantics
|
||||
- [x] 2.3 Update asset detail UI for field removal, bound-card emphasis, and realtime-status changes
|
||||
- [x] 2.4 Update package-list date presentation in detail pages
|
||||
- [ ] 2.5 Verify card and device flows manually after implementation
|
||||
- [x] 2.6 Remove `保护状态` and `切卡模式`, and move bound-card real-name status next to the slot title
|
||||
- [x] 2.7 Restrict package effective-period display to packages in active status only
|
||||
- [x] 2.8 Remove the current-package order number and replace it with a `生效期：开始时间 - 到期时间` line
|
||||
- [x] 2.9 Apply the cascaded shop filter to the device list request and device tab UI
|
||||
- [x] 2.10 Replace bottom-reached auto pagination with an explicit `加载更多` button for the IoT card and device lists
|
||||
- [x] 2.11 Keep the asset-list search input and filter controls fixed at the top while the list scrolls underneath
|
||||
Reference in New Issue
Block a user