Files
ctms/docs/plans/2026-06-02-material-equipment-detail.md
T
2026-06-23 09:21:57 +08:00

37 lines
1.4 KiB
Markdown

# Material Equipment Detail Implementation Plan
> **For Claude:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.
**Goal:** Add a read-only detail page for material equipment records in the material management module.
**Architecture:** Reuse the existing material equipment API detail endpoint and the project detail-page layout conventions. Add one route, one detail view, and one list-page navigation entry without changing create/update/delete behavior.
**Tech Stack:** Vue 3, Vue Router, Element Plus, Vitest static source tests.
---
### Task 1: Route And Navigation Tests
**Files:**
- Modify: `frontend/src/router.test.ts`
**Steps:**
1. Add the future equipment detail view to detail-navigation expectations.
2. Add breadcrumb expectations for equipment detail page title.
3. Add a list-page expectation for detail navigation.
4. Run the focused tests and confirm they fail because the route/view/link do not exist yet.
### Task 2: Detail Page Implementation
**Files:**
- Create: `frontend/src/views/materials/MaterialEquipmentDetail.vue`
- Modify: `frontend/src/router/index.ts`
- Modify: `frontend/src/views/ia/MaterialEquipment.vue`
**Steps:**
1. Build a read-only detail view using `getMaterialEquipment`.
2. Set breadcrumb context using the equipment name.
3. Register `/materials/equipment/:equipmentId`.
4. Add the list table detail link.
5. Run focused frontend tests and type/build verification where feasible.