# 预算中心列表化改造 TODO

## 调研

- [x] 阅读预算中心现有页面结构和脚本。证据：`BudgetCenterView.vue`、`BudgetCenterView.js`。
- [x] 阅读单据中心列表结构。证据：`DocumentsCenterView.vue`、`document-list-shared.css`。
- [x] 确认预算中心 UI 规范。证据：`x-financial-enterprise-ui-style` 技能。

## 契约与数据

- [x] 定义预算中心三个页签：全部预算、预算审核、归档预算。证据：`CONCEPT.md` 功能能力。
- [x] 定义前端 demo 阶段的预算列表字段。证据：`CONCEPT.md` 功能能力。
- [x] 抽出预算列表数据模型与格式化逻辑到独立脚本。证据：`budgetCenterListModel.js`。`[CONCEPT: 方案设计]`

## 前端实现

- [x] 将预算中心主界面改成单据中心式列表结构。证据：`BudgetCenterView.vue` 使用 `status-tabs`、`table-wrap`、`list-foot`。`[CONCEPT: 前端]`
- [x] 增加全部预算、预算审核、归档预算三个 switch/tab。证据：Playwright 验证 `全部预算6 / 预算审核6 / 归档预算6`。`[CONCEPT: 功能能力]`
- [x] 增加关键词、年度、季度、状态筛选。证据：`BudgetCenterView.vue` 工具栏筛选控件。`[CONCEPT: 全部预算]`
- [x] 增加分页和空状态。证据：`BudgetCenterView.vue` 分页脚与 `TableEmptyState`。`[CONCEPT: 测试方案]`
- [x] 增加预算通用详情页，展示年度、季度、月度预算。证据：Playwright 验证详情含年度预算、季度预算、月度预算。`[CONCEPT: 全部预算]`
- [x] 增加预算审核入口，带上下文进入预算助手。证据：预算审核列表操作列显示“进入审核”。`[CONCEPT: 预算审核]`
- [x] 按权限限制预算监控员和高级财务人员可见范围。证据：Playwright 验证预算监控员仅 1 条技术部记录，审核操作为“查看进度”。`[CONCEPT: 权限]`
- [x] 将预算工作区纳入单据中心同一外层触底布局。证据：`app.css` 增加 `budget-main` 与 `budget-workarea` 高度规则。`[CONCEPT: 前端]`

## 验证

- [x] 运行 `node --check web/src/views/scripts/BudgetCenterView.js`。证据：命令通过。`[CONCEPT: 测试方案]`
- [x] 运行 `node --check web/src/views/scripts/budgetCenterListModel.js`。证据：命令通过。`[CONCEPT: 测试方案]`
- [x] 运行 `npm.cmd --prefix web run build`。证据：构建通过，仅剩既有 VueUse 注释和 chunk 体积 warning。`[CONCEPT: 验收]`
- [x] 做预算页基础渲染验证，确认三个页签、通用详情页、审核入口可用。证据：浏览器验证预算列表 1366×768 视口下触底，详情页无 `ElDrawer`，详情四类费用和图表渲染，console 无新增错误。`[CONCEPT: 验收]`

## 后续阶段

- [ ] 设计后端预算草案表、预算审核表和发布接口。`[CONCEPT: 后端]`
- [ ] 将审核通过后的预算发布到正式预算池。`[CONCEPT: 后端]`
- [ ] 将报销预算占用、费用控制和预算发布版本打通。`[CONCEPT: 风险与开放问题]`