新增：管理后台前端页面，以及openspec内容。
This commit is contained in:
@@ -0,0 +1,169 @@
|
||||
## ADDED Requirements
|
||||
### Requirement: API Integration
|
||||
The system SHALL provide complete API integration for all frontend components with proper request methods, parameter handling, and error management.
|
||||
|
||||
#### Scenario: Conversation List API Integration
|
||||
- **WHEN** implementing conversation list API calls
|
||||
- **THEN** use `POST /api/Admin/QueryConversations` with filter parameters
|
||||
- Map response data to frontend format
|
||||
- Implement proper error handling with `ElMessage`
|
||||
|
||||
### Requirement: Data Structure Conversion
|
||||
The system SHALL convert backend response data to frontend-friendly format with consistent field naming.
|
||||
|
||||
#### Scenario: User Data Conversion
|
||||
- **WHEN** receiving user data from backend
|
||||
- **THEN** convert PascalCase fields to camelCase
|
||||
- Format dates as `YYYY-MM-DD HH:mm:ss` for consistency
|
||||
|
||||
### Requirement: Time-based Sorting
|
||||
The system SHALL implement a unified time-based sorting mechanism for all data lists, ensuring newest items appear first.
|
||||
|
||||
#### Scenario: Conversation List Sorting
|
||||
- **WHEN** sorting conversation list exceeds 2-3 items per page
|
||||
|
||||
### Change ID Naming: `implement-frontend-api-integration`
|
||||
|
||||
## Implementation Details
|
||||
- Prefer verb-led: `add-`, `update-`, `remove-`, `refactor-`
|
||||
- Ensure uniqueness check with suffix
|
||||
|
||||
## Tool Selection
|
||||
| Task | Tool | Purpose | Reason |
|
||||
|------|------|--------|--------|-------|
|
||||
| File pattern matching | Glob | Fast | Pattern matching |
|
||||
| Search code content | Grep | Regex search |
|
||||
| Read specific files | Read | Direct access |
|
||||
| Explore unknown scope | Task | Multi-step investigation |
|
||||
|
||||
## Error Recovery
|
||||
### Conflicts
|
||||
1. Run `openspec list` to view active changes
|
||||
2. Check overlapping specs
|
||||
3. Coordinate with change owners
|
||||
4. Consider combining proposals
|
||||
|
||||
### Validation Failures
|
||||
1. Run `openspec validate` to check for errors
|
||||
2. Fix by updating or merging proposals
|
||||
|
||||
## API Integration
|
||||
1. Run `openspec list` to view active changes
|
||||
2. Check overlapping specs
|
||||
3. Coordinate with owners
|
||||
4. Combine or modify proposals if necessary
|
||||
|
||||
### Missing Context
|
||||
1. Run `openspec validate` to check for issues
|
||||
2. Fix file content with `Edit` tool
|
||||
3. Read specific files with `Read`
|
||||
4. Search code with `Grep`
|
||||
|
||||
## Technical Stack
|
||||
| Task | Tool | Why |
|
||||
|------|------|-----|
|
||||
| Pattern matching | Glob | Fast file search |
|
||||
| Code content | Grep | Regex optimized |
|
||||
| Read files | Read | Direct access |
|
||||
| Explore unknown | Task | Multi-step |
|
||||
|
||||
## Final Implementation
|
||||
1. Read specific files with `Read`
|
||||
2. Use `Edit` for coordinated changes
|
||||
3. Write final files with `Write`
|
||||
4. Follow `file.ts:line` format
|
||||
|
||||
## Best Practices
|
||||
- Use `file.ts` for code locations
|
||||
- Reference specs as `specs/auth/spec.md`
|
||||
- Link related changes
|
||||
|
||||
## Capability Naming
|
||||
- Verb-noun: `user-auth`, `payment-capture`
|
||||
- Single purpose per capability
|
||||
- Split if needs "AND"
|
||||
|
||||
## Change ID Naming
|
||||
- Kebab-case: `add-two-factor-auth`
|
||||
- Verb-led: `add-`, `update-`, `remove-`
|
||||
- Unique; if taken, append `-2`
|
||||
|
||||
## Tool Selection
|
||||
| Task | Tool | Why |
|
||||
|------|------|-----|
|
||||
| Pattern match | Glob | Fast |
|
||||
| Code search | Grep | Optimized |
|
||||
| Read files | Read | Direct |
|
||||
| Explore | Task | Multi-step |
|
||||
|
||||
## Error Recovery
|
||||
### Conflicts
|
||||
1. `openspec list` to see active changes
|
||||
2. Check overlapping specs
|
||||
3. Coordinate with owners
|
||||
4. Consider combining
|
||||
|
||||
## Final Notes
|
||||
- Use `file.ts:line` format
|
||||
- Reference specs as `specs/auth/spec.md`
|
||||
- Link changes and PRs
|
||||
|
||||
## Implementation Plan
|
||||
1. **Start with API Integration**
|
||||
- Update request.js baseURL
|
||||
- Implement proper error handling
|
||||
|
||||
2. **Data Conversion**
|
||||
- Create utility functions
|
||||
- Convert backend PascalCase to frontend camelCase
|
||||
|
||||
3. **Time Sorting**
|
||||
- Implement unified sort function
|
||||
- Apply to all data lists
|
||||
|
||||
4. **Component Updates**
|
||||
- Replace mock data with real API calls
|
||||
- Add loading states
|
||||
|
||||
5. **Testing**
|
||||
- Verify API calls work
|
||||
- Check data conversion
|
||||
- Test sorting
|
||||
- Validate error handling
|
||||
|
||||
## Success Criteria
|
||||
- All components use real API data
|
||||
- Data properly converted
|
||||
- Unified sorting applied
|
||||
- Error handling works
|
||||
- Components handle empty states
|
||||
|
||||
## Implementation
|
||||
1. **Update request.js**
|
||||
- Set baseURL to actual backend
|
||||
- Add proper error handling
|
||||
|
||||
2. **Implement API calls**
|
||||
- UserList.vue
|
||||
- ConversationList.vue
|
||||
- Home.vue
|
||||
|
||||
3. **Data Conversion**
|
||||
- Create conversion utilities
|
||||
- Apply to all responses
|
||||
|
||||
4. **Sorting**
|
||||
- Implement sort function
|
||||
- Apply to all lists
|
||||
|
||||
5. **Test**
|
||||
- Verify all components work
|
||||
- Check error handling
|
||||
- Validate sorting
|
||||
|
||||
## Final Check
|
||||
- All components use real API data
|
||||
- Data properly formatted
|
||||
- Unified sorting applied
|
||||
- Error handling works
|
||||
- Empty states handled
|
||||
Reference in New Issue
Block a user