64 lines
2.4 KiB
Markdown
64 lines
2.4 KiB
Markdown
# Task: Multi-level workflow editor UI
|
|
|
|
## Feature
|
|
|
|
`docs/FEATURES/approval-workflow.md`
|
|
|
|
## Goal
|
|
|
|
Add a workspace settings workflow editor that lets managers/admins configure multi-level approval steps.
|
|
|
|
## Context
|
|
|
|
The workspace settings screen currently saves the approval mode and simple options, but `Multi-level` has no step editor. Users can select the mode without any way to define who approves each step.
|
|
|
|
## Scope
|
|
|
|
- Add a feature-owned workflow editor component under `frontend/src/features/workspaces/components/`.
|
|
- Show the editor only when approval mode is `Multi-level`.
|
|
- Allow users to add, remove, reorder, and edit approval steps.
|
|
- For each step, support:
|
|
- display name
|
|
- target type: role, membership, or member
|
|
- target value selector appropriate to the selected type
|
|
- required approver count
|
|
- Load available workspace members from the existing workspace members API.
|
|
- Use existing workspace store/API patterns to save the full workflow configuration.
|
|
- Show inline validation before save for missing names, missing targets, and invalid required approver count.
|
|
- Keep the existing simple approval options in the same workflow settings tab.
|
|
- Update English and French locale strings.
|
|
|
|
## Constraints
|
|
|
|
- Do not implement the backend in this task; depend on the API contract from task 005.
|
|
- Do not implement approval execution, recalculation, reminders, comments, reopening, or magic links in this task.
|
|
- Keep feature-owned code under `frontend/src/features/workspaces`.
|
|
- Use `frontend/src/config.js` for runtime config if any runtime config is needed.
|
|
- Preserve the shared Axios client in `frontend/src/plugins/api.js`.
|
|
- Do not create a marketing or explanatory page; this is an app settings editor.
|
|
|
|
## Likely Files
|
|
|
|
- `frontend/src/features/workspaces/views/WorkspaceSettingsView.vue`
|
|
- `frontend/src/features/workspaces/components/ApprovalWorkflowEditor.vue`
|
|
- `frontend/src/features/workspaces/stores/workspaceStore.js`
|
|
- `frontend/src/locales/en.json`
|
|
- `frontend/src/locales/fr.json`
|
|
- `frontend/src/api/schema.d.ts`
|
|
|
|
## Done When
|
|
|
|
- [ ] Selecting `Multi-level` reveals an approval step editor.
|
|
- [ ] Users can add, remove, reorder, and edit steps.
|
|
- [ ] Role, membership, and member target selectors are available.
|
|
- [ ] The editor saves and reloads persisted workflow configuration.
|
|
- [ ] UI prevents saving invalid multi-level configurations.
|
|
- [ ] Frontend build passes.
|
|
|
|
## Validation Commands
|
|
|
|
```bash
|
|
cd frontend
|
|
npm run build
|
|
```
|