Compare commits
26 Commits
2026-04
...
71da2d507e
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
71da2d507e | ||
| acd41555f9 | |||
| 2367e03146 | |||
|
|
023490c012 | ||
|
|
29ef03c40f | ||
| 387eb41412 | |||
|
|
480714172e | ||
|
|
0c6ed249ee | ||
| 543d1a59a9 | |||
|
|
3ad30b4f39 | ||
|
|
14e0502d16 | ||
|
|
d43f999b96 | ||
|
|
8b34147868 | ||
| 7a4d831c10 | |||
|
|
3a064eb09f | ||
| 960fe805ec | |||
| 59b73f3dae | |||
| ddd05f8c02 | |||
| f634d21d2a | |||
| e3a456debd | |||
| 60debcda8a | |||
| 5615399a68 | |||
| 28c47b14a3 | |||
| 5947157f89 | |||
| f0ea903d59 | |||
| 824392b564 |
4
.env
4
.env
@@ -33,7 +33,7 @@ VITE_SERVICE_SUCCESS_CODE=0
|
|||||||
|
|
||||||
# 后端登出状态码;当返回这些 code 时,前端会登出并跳回登录页
|
# 后端登出状态码;当返回这些 code 时,前端会登出并跳回登录页
|
||||||
# 典型场景:token 无效、登录状态失效、账号被踢下线、后端要求强制重新登录
|
# 典型场景:token 无效、登录状态失效、账号被踢下线、后端要求强制重新登录
|
||||||
VITE_SERVICE_LOGOUT_CODES=401,1002023000
|
VITE_SERVICE_LOGOUT_CODES=401
|
||||||
|
|
||||||
# 后端弹窗登出状态码;当返回这些 code 时,前端会先弹窗再登出
|
# 后端弹窗登出状态码;当返回这些 code 时,前端会先弹窗再登出
|
||||||
# 典型场景:账号被禁用、密码已重置、登录安全策略触发、需要用户先确认后再重新登录
|
# 典型场景:账号被禁用、密码已重置、登录安全策略触发、需要用户先确认后再重新登录
|
||||||
@@ -41,7 +41,7 @@ VITE_SERVICE_MODAL_LOGOUT_CODES=7777,7778
|
|||||||
|
|
||||||
# token 过期状态码;当返回这些 code 时,前端会尝试刷新 token 并重发请求
|
# token 过期状态码;当返回这些 code 时,前端会尝试刷新 token 并重发请求
|
||||||
# 典型场景:accessToken 过期但 refreshToken 仍有效、短期登录凭证失效但允许无感续期
|
# 典型场景:accessToken 过期但 refreshToken 仍有效、短期登录凭证失效但允许无感续期
|
||||||
VITE_SERVICE_EXPIRED_TOKEN_CODES=1002023001
|
VITE_SERVICE_EXPIRED_TOKEN_CODES=1002023000
|
||||||
|
|
||||||
# 静态路由模式下定义的超级管理员角色
|
# 静态路由模式下定义的超级管理员角色
|
||||||
VITE_STATIC_SUPER_ROLE=R_SUPER
|
VITE_STATIC_SUPER_ROLE=R_SUPER
|
||||||
|
|||||||
4
.gitignore
vendored
4
.gitignore
vendored
@@ -38,5 +38,9 @@ yarn.lock
|
|||||||
/docs/*
|
/docs/*
|
||||||
!/docs/frontend-page-resource-manifest.json
|
!/docs/frontend-page-resource-manifest.json
|
||||||
|
|
||||||
|
# Claude
|
||||||
|
/.claude/*
|
||||||
|
|
||||||
# Temp
|
# Temp
|
||||||
/codeTemp/*
|
/codeTemp/*
|
||||||
|
SKILL.md
|
||||||
|
|||||||
@@ -1,367 +0,0 @@
|
|||||||
# 10-产品动态时间线 前端 API 文档
|
|
||||||
|
|
||||||
## 0. 文档定位
|
|
||||||
|
|
||||||
本文档是给前端产品首页“产品动态展示区域”单独使用的接口文档。
|
|
||||||
|
|
||||||
目标:
|
|
||||||
|
|
||||||
- 明确前端当前应该调用哪个接口
|
|
||||||
- 明确左侧筛选项如何映射到后端参数
|
|
||||||
- 明确接口返回字段、时间格式、边界规则
|
|
||||||
- 避免继续混用设置页最近动态和首页正式时间线
|
|
||||||
|
|
||||||
说明:
|
|
||||||
|
|
||||||
- 设置页原最近动态接口 `GET /project/product/{id}/activities` 继续保留
|
|
||||||
- 产品首页正式动态时间线请统一使用本文档中的新接口
|
|
||||||
- 当前首页动态时间线不包含需求池变动,需求池由独立区域承载
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 1. 接口概览
|
|
||||||
|
|
||||||
### 1.1 接口信息
|
|
||||||
|
|
||||||
- 接口名称:获取产品动态时间线分页
|
|
||||||
- 请求方法:`GET`
|
|
||||||
- 请求路径:`/project/product/{id}/activities/page`
|
|
||||||
- 权限码:`project:product:query`
|
|
||||||
- 适用页面:产品首页动态时间线区域
|
|
||||||
|
|
||||||
### 1.2 接口用途
|
|
||||||
|
|
||||||
该接口用于返回产品首页动态展示区域的正式时间线数据,支持:
|
|
||||||
|
|
||||||
- 默认最近 30 天
|
|
||||||
- 左侧类型筛选
|
|
||||||
- 动作多选筛选
|
|
||||||
- 分页查询
|
|
||||||
- 创建初始化噪音去除
|
|
||||||
|
|
||||||
### 1.3 当前纳入首页时间线的事件范围
|
|
||||||
|
|
||||||
当前只包含以下 5 类:
|
|
||||||
|
|
||||||
- 产品创建
|
|
||||||
- 产品状态变更
|
|
||||||
- 产品经理变更
|
|
||||||
- 成员加入
|
|
||||||
- 成员移出
|
|
||||||
|
|
||||||
当前明确不包含:
|
|
||||||
|
|
||||||
- 需求池变动
|
|
||||||
- `update_member`
|
|
||||||
- 普通产品主数据编辑 `update`
|
|
||||||
- 删除产品动态
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 2. 请求定义
|
|
||||||
|
|
||||||
### 2.1 路径参数
|
|
||||||
|
|
||||||
| 参数名 | 类型 | 必填 | 说明 |
|
|
||||||
| --- | --- | --- | --- |
|
|
||||||
| `id` | `integer(int64)` | 是 | 产品 ID |
|
|
||||||
|
|
||||||
### 2.2 查询参数
|
|
||||||
|
|
||||||
| 参数名 | 类型 | 必填 | 说明 |
|
|
||||||
| --- | --- | --- | --- |
|
|
||||||
| `pageNo` | `integer` | 是 | 页码,从 `1` 开始 |
|
|
||||||
| `pageSize` | `integer` | 是 | 每页条数 |
|
|
||||||
| `activityType` | `string` | 否 | 分类,可选 `status` / `product` / `member` |
|
|
||||||
| `actionTypes` | `array<string>` | 否 | 动作编码数组,支持多选 |
|
|
||||||
| `startTime` | `string` | 否 | 开始时间,格式 `yyyy-MM-dd HH:mm:ss` |
|
|
||||||
| `endTime` | `string` | 否 | 结束时间,格式 `yyyy-MM-dd HH:mm:ss` |
|
|
||||||
|
|
||||||
### 2.3 参数规则
|
|
||||||
|
|
||||||
#### 2.3.1 时间参数规则
|
|
||||||
|
|
||||||
- `startTime` 和 `endTime` 必须同时传,或者同时不传
|
|
||||||
- 都不传时,后端默认查询最近 `30` 天
|
|
||||||
- 只传一个时,后端返回参数错误
|
|
||||||
- `startTime > endTime` 时,后端返回参数错误
|
|
||||||
|
|
||||||
#### 2.3.2 筛选参数规则
|
|
||||||
|
|
||||||
- `activityType` 是分类筛选
|
|
||||||
- `actionTypes` 是动作细筛选
|
|
||||||
- 两者同时传时,按交集处理
|
|
||||||
- 如果前端未来需要做跨类型多选,可以不传 `activityType`,只传 `actionTypes`
|
|
||||||
|
|
||||||
#### 2.3.3 `actionTypes` 传参方式
|
|
||||||
|
|
||||||
GET 场景请按重复参数方式传递,例如:
|
|
||||||
|
|
||||||
```text
|
|
||||||
/project/product/1024/activities/page?pageNo=1&pageSize=10&activityType=status&actionTypes=pause&actionTypes=resume&actionTypes=archive&actionTypes=abandon
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 3. 左侧筛选映射
|
|
||||||
|
|
||||||
首页左侧当前 5 个筛选项,前端请按下表映射到请求参数:
|
|
||||||
|
|
||||||
| 前端筛选项 | `activityType` | `actionTypes` |
|
|
||||||
| --- | --- | --- |
|
|
||||||
| 产品创建 | `product` | `create` |
|
|
||||||
| 产品状态变更 | `status` | `pause` / `resume` / `archive` / `abandon` |
|
|
||||||
| 产品经理变更 | `product` | `change_manager` |
|
|
||||||
| 成员加入 | `member` | `add_member` |
|
|
||||||
| 成员移出 | `member` | `remove_member` |
|
|
||||||
|
|
||||||
补充说明:
|
|
||||||
|
|
||||||
- 首页时间线当前不展示需求池变动
|
|
||||||
- 需求池的展示由独立模块负责,不要通过本接口混查
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 4. 响应定义
|
|
||||||
|
|
||||||
### 4.1 响应包装
|
|
||||||
|
|
||||||
接口统一返回 `CommonResult<PageResult<ProductActivityTimelineRespVO>>`。
|
|
||||||
|
|
||||||
成功响应结构:
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"code": 0,
|
|
||||||
"msg": "",
|
|
||||||
"data": {
|
|
||||||
"total": 0,
|
|
||||||
"list": []
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 4.2 `data` 结构
|
|
||||||
|
|
||||||
| 字段 | 类型 | 说明 |
|
|
||||||
| --- | --- | --- |
|
|
||||||
| `total` | `integer(int64)` | 总条数 |
|
|
||||||
| `list` | `array<object>` | 当前页数据 |
|
|
||||||
|
|
||||||
### 4.3 单条动态结构
|
|
||||||
|
|
||||||
| 字段 | 类型 | 说明 |
|
|
||||||
| --- | --- | --- |
|
|
||||||
| `id` | `string` | 动态唯一标识,格式 `type:sourceId`,例如 `status:11` |
|
|
||||||
| `type` | `string` | 动态类型,取值 `status` / `product` / `member` |
|
|
||||||
| `actionType` | `string` | 动作编码 |
|
|
||||||
| `actionName` | `string` | 动作中文名称 |
|
|
||||||
| `operatorUserId` | `integer(int64)` | 操作人用户 ID,可为 `null` |
|
|
||||||
| `operatorName` | `string` | 操作人名称,可为空字符串 |
|
|
||||||
| `occurredAt` | `integer(int64)` | 动态发生时间,毫秒时间戳 |
|
|
||||||
| `summary` | `string` | 可直接展示的摘要文案 |
|
|
||||||
| `reason` | `string` | 原因说明,可为 `null` |
|
|
||||||
| `fromStatus` | `string` | 原状态编码,可为 `null` |
|
|
||||||
| `toStatus` | `string` | 目标状态编码,可为 `null` |
|
|
||||||
| `details` | `string` | 补充明细,当前为 JSON 字符串 |
|
|
||||||
|
|
||||||
### 4.4 时间格式说明
|
|
||||||
|
|
||||||
这个接口当前有两个时间口径:
|
|
||||||
|
|
||||||
- 请求里的 `startTime`、`endTime`:字符串,格式 `yyyy-MM-dd HH:mm:ss`
|
|
||||||
- 响应里的 `occurredAt`:毫秒时间戳 `number`
|
|
||||||
|
|
||||||
前端需要按这个真实口径处理,不要把 `occurredAt` 当成格式化字符串读取。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 5. 字段语义说明
|
|
||||||
|
|
||||||
### 5.1 `type` 取值说明
|
|
||||||
|
|
||||||
| 取值 | 说明 | 数据来源 |
|
|
||||||
| --- | --- | --- |
|
|
||||||
| `status` | 产品状态变更 | `rdms_product_status_log` |
|
|
||||||
| `product` | 产品对象动态 | `rdms_biz_audit_log` 中 `bizType=product` |
|
|
||||||
| `member` | 产品团队动态 | `rdms_biz_audit_log` 中 `bizType=rdms_user_object_role` |
|
|
||||||
|
|
||||||
### 5.2 `actionType` 取值范围
|
|
||||||
|
|
||||||
当前首页时间线只会出现以下动作:
|
|
||||||
|
|
||||||
| `type` | `actionType` | 说明 |
|
|
||||||
| --- | --- | --- |
|
|
||||||
| `product` | `create` | 产品创建 |
|
|
||||||
| `product` | `change_manager` | 产品经理变更 |
|
|
||||||
| `status` | `pause` | 暂停 |
|
|
||||||
| `status` | `resume` | 恢复 |
|
|
||||||
| `status` | `archive` | 归档 |
|
|
||||||
| `status` | `abandon` | 废弃 |
|
|
||||||
| `member` | `add_member` | 成员加入 |
|
|
||||||
| `member` | `remove_member` | 成员移出 |
|
|
||||||
|
|
||||||
### 5.3 `details` 当前口径
|
|
||||||
|
|
||||||
`details` 当前不做统一结构化建模,按来源原样返回字符串:
|
|
||||||
|
|
||||||
- `type=status`
|
|
||||||
- 返回状态日志补充信息
|
|
||||||
- 当前包含 `productCodeSnapshot`、`productNameSnapshot`
|
|
||||||
- `type=product`
|
|
||||||
- 返回产品审计 `fieldChanges`
|
|
||||||
- `type=member`
|
|
||||||
- 返回成员审计 `fieldChanges`
|
|
||||||
|
|
||||||
前端建议:
|
|
||||||
|
|
||||||
- 首版先不依赖 `details` 做复杂渲染
|
|
||||||
- 先以 `actionName + summary + operatorName + occurredAt` 跑通展示
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 6. 后端聚合规则
|
|
||||||
|
|
||||||
为了让前端看到的是“可直接展示的正式时间线”,后端已固定以下规则:
|
|
||||||
|
|
||||||
### 6.1 创建去噪
|
|
||||||
|
|
||||||
产品创建时通常会伴随初始化动作:
|
|
||||||
|
|
||||||
- 初始化 `change_manager`
|
|
||||||
- 初始化 `add_member`
|
|
||||||
|
|
||||||
这两类初始化动作不会单独出现在首页时间线里,最终只保留一条 `create`。
|
|
||||||
|
|
||||||
### 6.2 状态日志优先
|
|
||||||
|
|
||||||
如果同一状态动作同时存在:
|
|
||||||
|
|
||||||
- 产品审计日志
|
|
||||||
- 状态日志
|
|
||||||
|
|
||||||
则首页时间线只取状态日志,不重复展示产品审计里的同类状态动作。
|
|
||||||
|
|
||||||
### 6.3 成员调整排除
|
|
||||||
|
|
||||||
`update_member` 当前不进入首页正式时间线。
|
|
||||||
|
|
||||||
原因:
|
|
||||||
|
|
||||||
- 首页当前只需要展示“加入”和“移出”
|
|
||||||
- 角色调整、备注调整等细节先不进入首页主时间线
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 7. 请求示例
|
|
||||||
|
|
||||||
### 7.1 默认查询首页动态
|
|
||||||
|
|
||||||
```http
|
|
||||||
GET /project/product/1024/activities/page?pageNo=1&pageSize=6
|
|
||||||
```
|
|
||||||
|
|
||||||
### 7.2 查询“产品状态变更”
|
|
||||||
|
|
||||||
```http
|
|
||||||
GET /project/product/1024/activities/page?pageNo=1&pageSize=10&activityType=status&actionTypes=pause&actionTypes=resume&actionTypes=archive&actionTypes=abandon
|
|
||||||
```
|
|
||||||
|
|
||||||
### 7.3 查询“成员移出”并限制时间范围
|
|
||||||
|
|
||||||
```http
|
|
||||||
GET /project/product/1024/activities/page?pageNo=1&pageSize=10&activityType=member&actionTypes=remove_member&startTime=2026-03-24 00:00:00&endTime=2026-04-23 23:59:59
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 8. 响应示例
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"code": 0,
|
|
||||||
"msg": "",
|
|
||||||
"data": {
|
|
||||||
"total": 2,
|
|
||||||
"list": [
|
|
||||||
{
|
|
||||||
"id": "product:22",
|
|
||||||
"type": "product",
|
|
||||||
"actionType": "change_manager",
|
|
||||||
"actionName": "切换产品经理",
|
|
||||||
"operatorUserId": 10002,
|
|
||||||
"operatorName": "李四",
|
|
||||||
"occurredAt": 1776812345000,
|
|
||||||
"summary": "李四执行了【切换产品经理】",
|
|
||||||
"reason": null,
|
|
||||||
"fromStatus": null,
|
|
||||||
"toStatus": null,
|
|
||||||
"details": "{\"managerUserId\":{\"before\":10001,\"after\":10002}}"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "status:11",
|
|
||||||
"type": "status",
|
|
||||||
"actionType": "resume",
|
|
||||||
"actionName": "恢复",
|
|
||||||
"operatorUserId": 10001,
|
|
||||||
"operatorName": "张三",
|
|
||||||
"occurredAt": 1776812984000,
|
|
||||||
"summary": "张三执行了【恢复】:可以继续开展",
|
|
||||||
"reason": "可以继续开展",
|
|
||||||
"fromStatus": "paused",
|
|
||||||
"toStatus": "active",
|
|
||||||
"details": "{\"productCodeSnapshot\":\"CNPD2026001\",\"productNameSnapshot\":\"统一交付平台\"}"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 9. 错误码
|
|
||||||
|
|
||||||
| `code` | 说明 |
|
|
||||||
| --- | --- |
|
|
||||||
| `0` | 成功 |
|
|
||||||
| `400` | 请求参数错误,例如只传了一侧时间,或开始时间晚于结束时间 |
|
|
||||||
| `401` | 未登录 |
|
|
||||||
| `403` | 没有该产品查询权限 |
|
|
||||||
| `1008001000` | 产品不存在 |
|
|
||||||
|
|
||||||
参数错误示例:
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"code": 400,
|
|
||||||
"msg": "开始时间和结束时间必须同时传入",
|
|
||||||
"data": null
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 10. 前端接入建议
|
|
||||||
|
|
||||||
首页动态区域首版建议直接消费以下字段:
|
|
||||||
|
|
||||||
- `actionName`
|
|
||||||
- `summary`
|
|
||||||
- `operatorName`
|
|
||||||
- `occurredAt`
|
|
||||||
|
|
||||||
左侧筛选建议直接使用:
|
|
||||||
|
|
||||||
- `activityType`
|
|
||||||
- `actionTypes`
|
|
||||||
|
|
||||||
当前不建议首版依赖:
|
|
||||||
|
|
||||||
- `details` 的深度结构化解析
|
|
||||||
- 需求池事件混入本接口
|
|
||||||
- 自行从 `actionType` 反推新的派生事件类型
|
|
||||||
|
|
||||||
一句话结论:
|
|
||||||
|
|
||||||
- 设置页最近动态继续调 `/activities`
|
|
||||||
- 产品首页正式动态时间线统一调 `/activities/page`
|
|
||||||
52
AGENTS.md
52
AGENTS.md
@@ -11,6 +11,8 @@
|
|||||||
|
|
||||||
默认回答保持精简,优先给结论、改动点、验证方式和必要风险;如果用户只要求分析、审阅或方案,就停留在分析层,不主动扩展到实现层。
|
默认回答保持精简,优先给结论、改动点、验证方式和必要风险;如果用户只要求分析、审阅或方案,就停留在分析层,不主动扩展到实现层。
|
||||||
|
|
||||||
|
分析、解释、方案类回答优先用业务和逻辑语言把结构、差异与结论说清楚,不要大段贴源码、罗列 `file:line` 或把实现细节当解释;只有用户明确要求看代码、或某行确实是讨论焦点的关键佐证时,才贴最小必要的代码片段。
|
||||||
|
|
||||||
## 交互与执行原则
|
## 交互与执行原则
|
||||||
|
|
||||||
- 进入实施阶段前,先说明目标、涉及模块、预计改动点和验证方式。
|
- 进入实施阶段前,先说明目标、涉及模块、预计改动点和验证方式。
|
||||||
@@ -58,6 +60,7 @@
|
|||||||
- `build/plugins/router.ts`:elegant-router 配置与路由元信息生成逻辑
|
- `build/plugins/router.ts`:elegant-router 配置与路由元信息生成逻辑
|
||||||
- `src/hooks/common/table.ts`:列表页表格 hook 主入口
|
- `src/hooks/common/table.ts`:列表页表格 hook 主入口
|
||||||
- `src/hooks/common/form.ts`:表单校验与表单实例 hook
|
- `src/hooks/common/form.ts`:表单校验与表单实例 hook
|
||||||
|
- `src/constants/status-tag.ts`:业务对象状态颜色(ElTag type)集中配置
|
||||||
- `src/styles/scss/element-plus.scss`:当前项目表格、弹层、按钮、表单密度与公共壳样式标准
|
- `src/styles/scss/element-plus.scss`:当前项目表格、弹层、按钮、表单密度与公共壳样式标准
|
||||||
- `packages/*`:项目内本地共享库
|
- `packages/*`:项目内本地共享库
|
||||||
- `docs/`:当前工作上下文的一部分,做架构级、权限级、页面规范级改动前优先查阅
|
- `docs/`:当前工作上下文的一部分,做架构级、权限级、页面规范级改动前优先查阅
|
||||||
@@ -136,17 +139,18 @@
|
|||||||
- 页面组件保持“编排层薄”。页面文件主要负责搜索参数、表格 hook、列定义、弹层开关、接口调用编排,不把大量表单细节和重复交互直接堆在页面根组件里。
|
- 页面组件保持“编排层薄”。页面文件主要负责搜索参数、表格 hook、列定义、弹层开关、接口调用编排,不把大量表单细节和重复交互直接堆在页面根组件里。
|
||||||
- 列表页优先拆出同目录下的 `modules/*` 子组件,例如搜索组件、操作弹层、详情抽屉、资源面板等。
|
- 列表页优先拆出同目录下的 `modules/*` 子组件,例如搜索组件、操作弹层、详情抽屉、资源面板等。
|
||||||
- 系统管理下现有 `user`、`role`、`menu`、`dict` 页面可以作为参考实现,新增同类页面优先沿用它们的拆分方式。
|
- 系统管理下现有 `user`、`role`、`menu`、`dict` 页面可以作为参考实现,新增同类页面优先沿用它们的拆分方式。
|
||||||
- 搜索组件优先复用 `src/components/custom/table-search-panel.vue` 作为外壳。搜索模块本身应尽量只接收 `model`,只向外发出 `reset` / `search`,不直接承载列表请求逻辑。
|
- 新增或触达列表页搜索组件时,必须按 `docs/table-search-fields-usage.md` 使用 `src/components/custom/table-search-fields.vue` 的 `fields` 声明式配置,不得手写 `ElRow / ElCol / ElFormItem` 搜索区骨架;只有字段存在复杂联动、自定义插槽或 `TableSearchFields` 明确无法承载时,才允许退回 `src/components/custom/table-search-panel.vue`,并需要在实施说明中写明原因。搜索模块本身应尽量只接收 `model` 和必要选项,只向外发出 `reset` / `search`,不直接承载列表请求逻辑。
|
||||||
- 列表能力优先复用 `src/hooks/common/table.ts` 中的 `useUIPaginatedTable`、`useTableOperate`、`defaultTransform`。
|
- 列表能力优先复用 `src/hooks/common/table.ts` 中的 `useUIPaginatedTable`、`useTableOperate`、`defaultTransform`。
|
||||||
- 表单能力优先复用 `src/hooks/common/form.ts` 中的 `useForm`、`useFormRules`。
|
- 表单能力优先复用 `src/hooks/common/form.ts` 中的 `useForm`、`useFormRules`。
|
||||||
- 当前项目的真实业务口径是“内网中文优先”。新增业务页不必为了形式强行补全国际化键;但如果是在已有大量 `$t(...)` 的页面或模块内继续开发,优先保持该局部代码风格一致,不要半页中文直写、半页国际化混用。
|
- 当前项目的真实业务口径是“内网中文优先”。新增业务页不必为了形式强行补全国际化键;但如果是在已有大量 `$t(...)` 的页面或模块内继续开发,优先保持该局部代码风格一致,不要半页中文直写、半页国际化混用。
|
||||||
|
|
||||||
## 表格、搜索区与操作列约束
|
## 表格、搜索区与操作列约束
|
||||||
|
|
||||||
- 搜索区按钮组保持在最右侧;存在折叠项时,按钮顺序保持为“展开/收起 -> 重置 -> 查询”。
|
- 搜索区按钮组必须固定在第一行最后一个位置;存在折叠项时,按钮顺序保持为“展开/收起 -> 重置 -> 查询”。这是 `TableSearchFields` 的布局契约,不允许因为查询条件不足、展开/收起或响应式样式把按钮提前到中间位置或挤到后续行。
|
||||||
- 不要在每个页面重新拼一套搜索区骨架,优先延续 `TableSearchPanel` 的结构和交互。
|
- 不要在每个页面重新拼一套搜索区骨架;常规查询条件必须使用 `TableSearchFields`,通过 `columns` 控制每行格子数和折叠阈值。`columns` 表示首行总格数,其中最后 1 格永远留给按钮区;字段不足 `columns - 1` 时由公共组件补空占位,字段超过时剩余字段进入展开区。类似项目管理入口页这类 4 个查询条件的场景,必须使用 `:columns="4"`,形成“3 个条件 + 按钮区”的首行布局。
|
||||||
- 表格操作列优先复用 `src/components/custom/business-table-action-cell.tsx`。
|
- 表格操作列优先复用 `src/components/custom/business-table-action-cell.tsx`。
|
||||||
- 操作数 `<= 2` 时默认直出;操作数 `> 2` 时优先收敛为 `1 个直出主按钮 + 1 个更多按钮`。
|
- 操作数 `<= 2` 时默认直出;操作数 `> 2` 时优先收敛为 `1 个直出主按钮 + 1 个更多按钮`。
|
||||||
|
- 新增列表页如果使用 `ElCard` 承载需要撑满剩余高度的 `ElTable height="100%"`,`body-class` 优先使用公共类 `business-table-card-body`,该类由 `src/styles/scss/element-plus.scss` 统一维护;不要再为每个页面新增 `xxx-table-card-body` 私有样式。历史页面已有私有类时不强制专项回改,当前任务触达相关页面再按公共类收敛。
|
||||||
- 表格、按钮、弹层、表单的尺寸和间距标准优先由 `src/styles/scss/element-plus.scss` 和公共组件承接,不在业务页面散落写新的局部尺寸作为事实标准。
|
- 表格、按钮、弹层、表单的尺寸和间距标准优先由 `src/styles/scss/element-plus.scss` 和公共组件承接,不在业务页面散落写新的局部尺寸作为事实标准。
|
||||||
|
|
||||||
## 表单与弹层约束
|
## 表单与弹层约束
|
||||||
@@ -154,10 +158,14 @@
|
|||||||
- 新增、编辑能力优先沿用 `ElDialog / ElDrawer / ElForm / ElScrollbar / #footer` 这一套标准组合,不额外创造新的弹层交互模型。
|
- 新增、编辑能力优先沿用 `ElDialog / ElDrawer / ElForm / ElScrollbar / #footer` 这一套标准组合,不额外创造新的弹层交互模型。
|
||||||
- 轻中量表单优先复用 `src/components/custom/business-form-dialog.vue`;字段较多、需要保留列表上下文或承载重型控件时,再考虑 `src/components/custom/business-form-drawer.vue`。
|
- 轻中量表单优先复用 `src/components/custom/business-form-dialog.vue`;字段较多、需要保留列表上下文或承载重型控件时,再考虑 `src/components/custom/business-form-drawer.vue`。
|
||||||
- 表单分组优先复用 `src/components/custom/business-form-section.vue`。
|
- 表单分组优先复用 `src/components/custom/business-form-section.vue`。
|
||||||
- 现有公共壳组件已内置尺寸预设:`dialog` 的 `sm/md/lg` 对应 `520px/640px/720px`,`drawer` 的 `md/lg/xl` 对应 `480px/720px/960px`;优先使用预设值而不是页面内重复硬编码宽度。
|
- `dialog` 宽度优先按纯表单字段数分三档:`<= 6` 个字段用 `sm`,默认单列,目标宽度 `520px`;`7 ~ 14` 个字段用 `md`,默认双列,目标宽度 `720px`;`> 14` 个字段用 `lg`,仍以双列为主,目标宽度 `960px`。宽度只做响应式收缩,实际宽度不超过 `calc(100vw - 32px)`;不因为单个 `textarea` 自动升档,也不做列数响应式折叠。
|
||||||
- 常规 CRUD 表单优先使用 `label-position="top"`、`ElRow + ElCol` 双列布局、`gutter=16`;普通字段优先 `span=12`,长文本或重量级字段优先 `span=24`。
|
- 常规 CRUD 表单优先使用 `label-position="top"`、`ElRow + ElCol` 双列布局、`gutter=16`;普通字段优先 `span=12`,长文本或重量级字段优先 `span=24`。如果整体字段数 `<= 6`,默认按单列表单理解。
|
||||||
|
- 当纯表单 `dialog` 因字段数 `<= 6` 归入 `sm` 时,不能只改 `preset`;字段布局也要同步落到单列,常规 `ElCol` 应使用 `span=24`,除非该弹框已经被明确判定为复合内容特例。
|
||||||
|
- 左右分栏、表单 + 表格、表单 + 树、关系编辑器、时间线、大段说明区这类复合内容 `dialog`,不强行按字段数归类;可按内容复杂度单独评估使用 `md`、`lg` 或更宽值,但只有在无法合理归入“纯表单三档”时才允许特例。
|
||||||
|
- 禁止用页面级宽范围样式直接覆盖整页 `.business-form-dialog` 来统一放大弹框;如确实需要特殊宽度,只能精确作用于目标弹框,且不能误伤同页面其他 `dialog`。
|
||||||
- 底部按钮顺序固定为“取消 -> 确认”,并保持右对齐。
|
- 底部按钮顺序固定为“取消 -> 确认”,并保持右对齐。
|
||||||
- 单选组和开关类字段优先复用仓库既有样式钩子,例如 `business-form-radio-group`、`business-form-switch-field`。
|
- 单选组和开关类字段优先复用仓库既有样式钩子,例如 `business-form-radio-group`、`business-form-switch-field`。
|
||||||
|
- 权限控制按钮默认采用“无权限不渲染”口径,不要把纯权限不足的入口做成禁用态再展示给用户;只有业务状态暂时不可操作、但仍需让用户感知入口存在时,才允许保留禁用态。
|
||||||
|
|
||||||
## 接口、路由与权限约束
|
## 接口、路由与权限约束
|
||||||
|
|
||||||
@@ -167,6 +175,31 @@
|
|||||||
- 涉及路由、菜单、权限的改动时,同时检查 `build/plugins/router.ts`、`src/router/routes/*`、`src/store/modules/route/*` 和相关文档。
|
- 涉及路由、菜单、权限的改动时,同时检查 `build/plugins/router.ts`、`src/router/routes/*`、`src/store/modules/route/*` 和相关文档。
|
||||||
- 对于可再生的路由产物,优先修改源配置并执行 `pnpm gen-route`,不要把手工修补生成文件当成常规方案。
|
- 对于可再生的路由产物,优先修改源配置并执行 `pnpm gen-route`,不要把手工修补生成文件当成常规方案。
|
||||||
|
|
||||||
|
## 防重复提交(两层联防)
|
||||||
|
|
||||||
|
用户快速双击、键盘连按 Enter、`ElMessageBox.confirm` 的"确定"按钮内置无 loading 等场景,都可能让同一写操作发出多次。仓库采用两层防御,新增写操作功能时按顺序检查:
|
||||||
|
|
||||||
|
### 第一层:业务按钮的 loading 锁(视觉防御)
|
||||||
|
|
||||||
|
- 新增、编辑入口优先使用 `src/components/custom/business-form-dialog.vue` 或 `src/components/custom/business-form-drawer.vue`,它们在 `submit` 流程内 await 接口期间会自动将"确认"按钮置为 `loading` + `disabled`。
|
||||||
|
- 不要裸手写 `<ElButton @click="submit">` 直接调接口;若必须使用裸 `ElButton`,需要自行绑定 `:loading` 并在 await 接口期间锁住按钮。
|
||||||
|
- 删除二次确认使用 `ElMessageBox.confirm` 时,其内部"确定"按钮没有 loading 能力,必须依赖第二层兜底,不要尝试改造 confirm 的内部按钮。
|
||||||
|
|
||||||
|
### 第二层:请求层全局去重(逻辑兜底)
|
||||||
|
|
||||||
|
- 入口:`src/service/request/dedupe.ts` 提供 `withDedupe`,已在 `src/service/request/index.ts` 包住统一的 `request` 实例;`demoRequest` 未启用。
|
||||||
|
- 指纹:`method + 完整 URL + 排序后的 params + 稳定序列化的 body`;body 内对象按 key 排序,数组保序。
|
||||||
|
- 行为:写操作(`POST` / `PUT` / `DELETE` / `PATCH`)在第一次请求 pending 期内,若再次发起指纹相同的请求,自动复用第一次的 Promise,不发出第二次实际请求;调用方两次拿到完全相同的返回对象。
|
||||||
|
- 跳过条件(即不去重,按原逻辑发出):`GET` / `HEAD` / `OPTIONS`,请求体为 `FormData` 或 `Blob`(上传场景),调用方显式传 `{ dedupe: false }`。
|
||||||
|
- 业务调用方零感知:新增接口默认即享受兜底,不需要在 `src/service/api/*` 或页面层做任何改动。
|
||||||
|
- 极少数业务确实允许短时间内并发提交完全相同的写请求时,在调用处显式传 `request({ ..., dedupe: false })` 单接口关闭。
|
||||||
|
- 兜底超时 30 秒:极端情况下若某次 Promise 未 settle,pending 条目过期后下一次相同请求视为新请求,避免内存泄漏。
|
||||||
|
|
||||||
|
### 设计责任划分
|
||||||
|
|
||||||
|
- 视觉层负责"按下立刻锁住按钮"的用户感知;逻辑层负责"即使锁失败也只发一次"的实际接口保护。
|
||||||
|
- 不要因为有第二层兜底就省略第一层 loading 锁:用户没有视觉反馈会再次点击;也不要试图在业务页面再造一套请求去重逻辑。
|
||||||
|
|
||||||
## 运行时字典使用口径
|
## 运行时字典使用口径
|
||||||
|
|
||||||
- 运行时字典统一由 `src/store/modules/dict/index.ts` 管理,登录后通过 `/system/dict-data/frontend-cache` 初始化;不要在业务页面重复直调字典接口。
|
- 运行时字典统一由 `src/store/modules/dict/index.ts` 管理,登录后通过 `/system/dict-data/frontend-cache` 初始化;不要在业务页面重复直调字典接口。
|
||||||
@@ -201,6 +234,14 @@ const directionLabels = getLabels(row.directionCodes, { separator: ',' });
|
|||||||
- 当前系统已有页面或接口已经稳定使用某个字典,例如用户所属公司 `company -> system_user_company`。
|
- 当前系统已有页面或接口已经稳定使用某个字典,例如用户所属公司 `company -> system_user_company`。
|
||||||
- 如果以上两种都没有,就先让后端或业务明确 `dictType`,不要前端自己命名。
|
- 如果以上两种都没有,就先让后端或业务明确 `dictType`,不要前端自己命名。
|
||||||
|
|
||||||
|
## 业务对象状态颜色集中口径
|
||||||
|
|
||||||
|
- 各业务域(产品、项目、需求、任务、执行、工单等)的 `statusCode -> ElTag type` 集中维护在 `src/constants/status-tag.ts`,不要在各业务页面或模块内散落硬编码同一份映射。
|
||||||
|
- 通用入口是 `getStatusTagType(domain, statusCode)`,未匹配的 `statusCode` 默认回退到 `'info'`。
|
||||||
|
- 业务模块按域写薄包装暴露给页面调用,例如 `getExecutionStatusTagType(code)` 内部调用 `getStatusTagType('projectExecution', code)`,避免页面直接耦合到 domain 字符串。
|
||||||
|
- 新增对象域时同步两处:`StatusDomain` 增加枚举值;`statusTagTypeRegistry` 添加对应 `statusCode -> StatusTagType` 映射。
|
||||||
|
- 后端契约:未来若状态字典开始返回颜色字段,调用方应优先使用后端值,缺失时再回退到 `getStatusTagType` 的前端兜底映射,不要直接绕开集中配置另写一份。
|
||||||
|
|
||||||
## 页面资源与菜单目录约束
|
## 页面资源与菜单目录约束
|
||||||
|
|
||||||
- 页面组件键、页面资源、菜单目录是三层不同概念,不要把它们当成同一个值。
|
- 页面组件键、页面资源、菜单目录是三层不同概念,不要把它们当成同一个值。
|
||||||
@@ -221,6 +262,7 @@ const directionLabels = getLabels(row.directionCodes, { separator: ',' });
|
|||||||
- 如果后端当前接口暂时还返回数值型 ID,前端也必须尽可能在 `typings`、API 适配层或进入业务层前转成 `string`,不要把 ID 按 `number` 扩散到页面、store 和组件里。
|
- 如果后端当前接口暂时还返回数值型 ID,前端也必须尽可能在 `typings`、API 适配层或进入业务层前转成 `string`,不要把 ID 按 `number` 扩散到页面、store 和组件里。
|
||||||
- 但要注意:如果后端把超出 JS 安全整数范围的 Long 直接作为 JSON 数字返回,前端在业务层再 `String(number)` 只能得到“已经丢精度后的错误字符串”。这种情况必须明确记为接口契约风险,不要误判为“前端已安全处理”。
|
- 但要注意:如果后端把超出 JS 安全整数范围的 Long 直接作为 JSON 数字返回,前端在业务层再 `String(number)` 只能得到“已经丢精度后的错误字符串”。这种情况必须明确记为接口契约风险,不要误判为“前端已安全处理”。
|
||||||
- 因此,新增或改造接口时,最稳妥的契约仍然是:后端长整型 ID 直接按字符串返回;前端全链路按字符串接收和传递。若后端暂未改,前端侧也不得新增 `number` 口径 ID 用法。
|
- 因此,新增或改造接口时,最稳妥的契约仍然是:后端长整型 ID 直接按字符串返回;前端全链路按字符串接收和传递。若后端暂未改,前端侧也不得新增 `number` 口径 ID 用法。
|
||||||
|
- API 适配层兜底(实操约束):所有从后端接收的数值型 ID 字段(不论后端实际返回 `string`、`number` 或两者混合),都必须在 `src/service/api/*` 的 normalize 或 map 函数中显式调用 `String(rawId)` 归一一次;前端业务层(`views`、`store`、组件、`Map` 键、路由参数)只接收 `string` 形态,永远不需要自己 `String()`。这条与后端是否做了 Long → String 全局序列化无关——后端做了是双保险,没做且字段取值始终在 JS 安全整数内(例如 `infra_file_config.id` 永远是两位数)也是合理选择,前端 normalize 已经把口径收死,业务层无感。但这条不开按字段取值范围豁免的口子:前端 normalize 是无差别的,任何 ID 都要 `String()`,不要按某个字段当前取值大小决定要不要走 normalize,避免后续逐步污染仓库的 ID 纪律。
|
||||||
- 对仓库中的历史代码,原则是“不再新增 number 口径 ID,当前任务触达相关链路时优先顺手矫正”;不要继续复制历史写法。
|
- 对仓库中的历史代码,原则是“不再新增 number 口径 ID,当前任务触达相关链路时优先顺手矫正”;不要继续复制历史写法。
|
||||||
- 遵循仓库现有的 Vue SFC 风格:`script setup`、类型化 store、职责单一的小型 composable/helper。
|
- 遵循仓库现有的 Vue SFC 风格:`script setup`、类型化 store、职责单一的小型 composable/helper。
|
||||||
- 修改界面时优先延续 `src/layouts` 和 `src/theme` 中已有的 UI 模式,不要平行引入另一套设计体系。
|
- 修改界面时优先延续 `src/layouts` 和 `src/theme` 中已有的 UI 模式,不要平行引入另一套设计体系。
|
||||||
|
|||||||
417
CLAUDE.md
Normal file
417
CLAUDE.md
Normal file
@@ -0,0 +1,417 @@
|
|||||||
|
# CLAUDE.md
|
||||||
|
|
||||||
|
本文件是我(Claude)在 `cn-rdms-web` 项目中的个人工作笔记,沉淀团队既有规范(来源:`AGENTS.md`)与协作惯例。每次进入仓库前先读这一份,避免重复踩坑。
|
||||||
|
|
||||||
|
> 本文件仅本地保留,已加入 `.gitignore`,请勿提交。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 0. 行为基线(最重要,先记住)
|
||||||
|
|
||||||
|
- **描述现状以代码、配置、文档可直接验证的事实为准**;不引入历史实现/过渡方案/猜测。
|
||||||
|
- **默认精简回答**:先给结论 → 改动点 → 验证方式 → 必要风险。**除非用户主动要求详细,否则不要展开**——不复述清单、不列每条改动的小理由、不堆"汇总"段。用户只让分析就停在分析层,不主动跳到实现。
|
||||||
|
- **分析/解释类回答不要堆代码层面描述**:默认用业务/逻辑语言说清楚结构、差异与结论;不要大段贴源码、不要罗列 `file:line`、不要把"实现细节"当解释。只有用户明确要求看代码、或非贴不可的关键佐证(如某行就是争议焦点),才贴最少代码片段。
|
||||||
|
- **进入实施阶段前,先说目标、涉及模块、预计改动点、验证方式**。
|
||||||
|
- **最小改动原则**:只改当前任务必需的范围,不顺手重构无关代码。
|
||||||
|
- **不主动执行 git 操作**(status/diff/add/commit/restore/reset/checkout 全部不主动跑),除非用户明确要求。识别用户改动优先用 Read 直接看文件。
|
||||||
|
- 工作树脏的时候,**不要回退与当前任务无关的变更**。
|
||||||
|
- 静态校验默认只跑 `pnpm typecheck`;UI/交互/样式类任务**默认不补也不跑前端测试**,除非用户明确要求。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 1. 项目骨架(认知地图)
|
||||||
|
|
||||||
|
| 维度 | 现状 |
|
||||||
|
|---|---|
|
||||||
|
| 应用 | RDMS 系统的 Vue 3 后台前端 |
|
||||||
|
| 包管理 | `pnpm`(>=8.7.0),Node `>=20.19.0` |
|
||||||
|
| 工具链 | Vite 7、TypeScript、Pinia、Element Plus、UnoCSS |
|
||||||
|
| 工作区 | `packages/*`,通过 `@sa/*` 引用 |
|
||||||
|
| 别名 | `@` → `src`;`~` → 仓库根 |
|
||||||
|
| 端口 | dev 9527 / preview 9725 |
|
||||||
|
| 环境文件 | `.env`、`.env.dev`、`.env.prod` |
|
||||||
|
|
||||||
|
**已经形成闭环的五条主线,后续改动顺着做,不平行起新的:**
|
||||||
|
|
||||||
|
1. **路由来源统一**:页面文件 + 自定义路由 → `elegant-router` 生成 → `build/plugins/router.ts` 集中补 `meta`。
|
||||||
|
2. **权限入口统一**:常量路由 / 权限路由分流;`route store` 负责初始化、菜单生成、缓存路由、面包屑。
|
||||||
|
3. **请求入口统一**:所有业务请求走 `src/service/request/index.ts`。
|
||||||
|
4. **页面套路统一**:列表页 = 搜索区 + 表格区 + 操作弹层/抽屉 + `modules/*` 子组件。
|
||||||
|
5. **衍生资产统一**:页面资源白名单从路由结构生成,不手工维护第二份。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 2. 关键目录速查
|
||||||
|
|
||||||
|
| 路径 | 职责 |
|
||||||
|
|---|---|
|
||||||
|
| `src/views` | 业务页面(编排层薄) |
|
||||||
|
| `src/components` | 共享组件 |
|
||||||
|
| `src/layouts` | 应用壳、头部、侧栏、菜单、标签页、主题抽屉 |
|
||||||
|
| `src/store/modules` | Pinia 模块:app / auth / route / tab / theme / dict |
|
||||||
|
| `src/service/api` | 接口封装、参数归一化、查询字符串拼装、返回类型对齐 |
|
||||||
|
| `src/service/request` | 统一请求实例、鉴权、加密、错误处理、token 刷新 |
|
||||||
|
| `src/router/routes` | 自定义路由 |
|
||||||
|
| `src/router/elegant` | **生成产物,不要手改** |
|
||||||
|
| `src/theme/settings.ts` | 默认主题与布局设置 |
|
||||||
|
| `build/plugins/router.ts` | elegant-router 配置 + 路由 meta 生成 |
|
||||||
|
| `src/hooks/common/table.ts` | 列表页表格 hook 主入口 |
|
||||||
|
| `src/hooks/common/form.ts` | 表单校验与表单实例 hook |
|
||||||
|
| `src/constants/status-tag.ts` | 业务对象状态颜色(ElTag type)集中配置 |
|
||||||
|
| `src/styles/scss/element-plus.scss` | 表格/弹层/按钮/表单 密度与公共壳样式 |
|
||||||
|
| `packages/*` | 项目内本地共享库 |
|
||||||
|
| `docs/` | 架构/权限/页面规范文档,做相关改动前先查 |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 3. 生成文件(不要手改)
|
||||||
|
|
||||||
|
- `src/router/elegant/imports.ts`
|
||||||
|
- `src/router/elegant/routes.ts`
|
||||||
|
- `src/router/elegant/transform.ts`
|
||||||
|
- `src/typings/elegant-router.d.ts`
|
||||||
|
- `src/typings/components.d.ts`
|
||||||
|
- `docs/frontend-page-resource-manifest.json`
|
||||||
|
|
||||||
|
**再生命令:**
|
||||||
|
- 路由产物过期 → `pnpm gen-route`
|
||||||
|
- 页面资源清单需同步 → `pnpm gen:page-resource-manifest`
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 4. 路由与导航
|
||||||
|
|
||||||
|
- 新增业务页:通过页面文件 + `build/plugins/router.ts` 补齐,**不要在多个位置重复注册**。
|
||||||
|
- `meta.icon` = Iconify 图标;`meta.localIcon` = 本地 SVG。**不要混用字段语义。**
|
||||||
|
- `meta` 中心落点是 `build/plugins/router.ts`,新页的 `icon`/`order`/`roles`/`keepAlive` 在那里集中维护。
|
||||||
|
- `meta.constant = true` → 常量路由;其他默认权限路由。常量路由维护入口是 `build/plugins/router.ts` 和 `src/router/routes/custom-routes.ts`。
|
||||||
|
- `i18nKey` 是兼容字段,不是新页必须补齐项。
|
||||||
|
|
||||||
|
### 4.1 对象上下文业务域(重要陷阱)
|
||||||
|
|
||||||
|
- `product`、`project` 这类业务域,**入口页是设计如此**:先进业务域入口页 → 再选对象建上下文。**不要把"入口页是可点击菜单"误判成 bug。**
|
||||||
|
- 入口页(如 `product_list -> /product/list -> view.product_list`)可作为左侧一级菜单实际命中页。这 ≠ 已进入对象上下文态。
|
||||||
|
- **遇到"点入口页后布局壳消失、只剩内容页"**:先查是否动态权限路由模式 + 后端 `get-user-routes` 是否缺业务域根路由。**不要直接把入口菜单从"菜单"改成"目录"**。
|
||||||
|
- 在 `VITE_AUTH_ROUTE_MODE=dynamic` 下,若后端只返回叶子页(如缺 `product -> layout.base`,只返 `product_list`),前端必须在动态路由归一化阶段**补回本地业务域骨架**,不能让入口裸挂为顶层 `view.*`。
|
||||||
|
- 对象上下文稳定来源仍是本地路由骨架;动态路由兼容只能"补骨架 + 对齐入口",不能反推。
|
||||||
|
- 新增业务域时同步检查:本地静态骨架、`src/constants/object-context.ts` 中的 `domainKey/entryRouteKey/entryRoutePath/fallbackDefaultRouteKey`、动态路由归一化、对象上下文 store、头部菜单切换。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 5. 分层职责
|
||||||
|
|
||||||
|
| 层 | 该做 | 不该做 |
|
||||||
|
|---|---|---|
|
||||||
|
| `src/views` | 编排状态、表单行为、组合 store/service | 散落 URL 拼接、token 注入、错误提示、权限路由推导 |
|
||||||
|
| `src/components` | 可复用 UI / 局部业务部件 | 长期堆只服务单页面的复杂流程 |
|
||||||
|
| `src/service/api` | 接口封装、参数归一化、查询拼装、类型对齐 | 在 views/store/components 重复手写接口地址和序列化 |
|
||||||
|
| `src/service/request` | 统一鉴权/加密/成功码/token 刷新/错误处理 | 平行引入新的 axios/fetch 链绕开封装 |
|
||||||
|
| `src/store/modules` | 跨页面共享状态 | 把临时局部状态堆进全局 store |
|
||||||
|
| `src/router` & `build/plugins/router.ts` | 路由/菜单/权限标识/首页/路由 meta | 在页面里临时写条件分支替代正式配置 |
|
||||||
|
| `src/layouts` & `src/theme` | 全局布局壳与主题 | 在业务页面复制平行布局/主题状态 |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 6. 业务页面开发风格
|
||||||
|
|
||||||
|
- **页面组件保持"编排层薄"**:页面文件主管搜索参数、表格 hook、列定义、弹层开关、接口编排。
|
||||||
|
- 列表页拆同目录 `modules/*`:搜索组件、操作弹层、详情抽屉、资源面板等。
|
||||||
|
- **参考实现**:系统管理下 `user`/`role`/`menu`/`dict`。
|
||||||
|
- 列表 hook 优先复用:`src/hooks/common/table.ts` 的 `useUIPaginatedTable`、`useTableOperate`、`defaultTransform`。
|
||||||
|
- 表单 hook 优先复用:`src/hooks/common/form.ts` 的 `useForm`、`useFormRules`。
|
||||||
|
- **业务口径是"内网中文优先"**:新页不必强行国际化;但已有大量 `$t(...)` 的页面继续开发时,保持局部一致,不要中文/i18n 混用。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 7. 表格、搜索区、操作列
|
||||||
|
|
||||||
|
### 7.1 搜索区(强约束)
|
||||||
|
|
||||||
|
- **必须用** `src/components/custom/table-search-fields.vue` 的 `fields` 声明式配置,不得手写 `ElRow/ElCol/ElFormItem` 骨架。
|
||||||
|
- 仅当字段存在复杂联动、自定义插槽或 `TableSearchFields` 明确无法承载时,才退回 `src/components/custom/table-search-panel.vue`,并在实施说明中写明原因。
|
||||||
|
- **搜索区按钮组固定在第一行最后一格**;存在折叠时按钮顺序固定为 **展开/收起 → 重置 → 查询**。**不允许**因查询条件不足、展开收起或响应式样式把按钮提前或挤到下一行。
|
||||||
|
- `columns` 表示首行总格数,**最后 1 格永远留给按钮**;字段不足 `columns - 1` 由组件补空占位;超过则进入展开区。
|
||||||
|
- 4 个查询条件的场景必须 `:columns="4"`(3 条件 + 按钮)。
|
||||||
|
- 搜索模块只接 `model` 和必要选项,只发 `reset`/`search`,**不直接承载列表请求**。
|
||||||
|
- 详细规范见 `docs/table-search-fields-usage.md`。
|
||||||
|
|
||||||
|
### 7.2 表格
|
||||||
|
|
||||||
|
- 操作列优先复用 `src/components/custom/business-table-action-cell.tsx`。
|
||||||
|
- 操作数 ≤ 2:直出;操作数 > 2:**1 个直出主按钮 + 1 个更多按钮**。
|
||||||
|
- `ElCard` 承载 `ElTable height="100%"` 时,`body-class` 优先用公共类 **`business-table-card-body`**(由 `src/styles/scss/element-plus.scss` 维护)。**不要为每页新建 `xxx-table-card-body` 私有样式**。历史私有类不强制专项回改,触达再收敛。
|
||||||
|
- 表格/按钮/弹层/表单的尺寸与间距标准走 `element-plus.scss` 和公共组件,**不要在业务页散落写局部尺寸作为事实标准**。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 8. 表单与弹层(强约束)
|
||||||
|
|
||||||
|
### 8.1 组件选择
|
||||||
|
|
||||||
|
- 标准组合:`ElDialog / ElDrawer / ElForm / ElScrollbar / #footer`。
|
||||||
|
- 轻中量表单:`src/components/custom/business-form-dialog.vue`。
|
||||||
|
- 字段较多 / 需保留列表上下文 / 重型控件:`src/components/custom/business-form-drawer.vue`。
|
||||||
|
- 表单分组:`src/components/custom/business-form-section.vue`。
|
||||||
|
|
||||||
|
### 8.2 Dialog 宽度三档(按纯表单字段数)
|
||||||
|
|
||||||
|
| 字段数 | preset | 默认列数 | 目标宽度 |
|
||||||
|
|---|---|---|---|
|
||||||
|
| ≤ 6 | `sm` | 单列 | 520px |
|
||||||
|
| 7 ~ 14 | `md` | 双列 | 720px |
|
||||||
|
| > 14 | `lg` | 双列为主 | 960px |
|
||||||
|
|
||||||
|
- 实际宽度上限:`calc(100vw - 32px)`。
|
||||||
|
- **不因为单个 textarea 自动升档**,不做列数响应式折叠。
|
||||||
|
- 归到 `sm` 时不能只改 preset,**字段布局也要落到单列**:常规 `ElCol` 用 `span=24`,除非已判定为复合内容特例。
|
||||||
|
|
||||||
|
### 8.3 复合内容特例
|
||||||
|
|
||||||
|
左右分栏 / 表单+表格 / 表单+树 / 关系编辑器 / 时间线 / 大段说明区 → 不强按字段数归类,按内容复杂度评估 `md`/`lg` 或更宽。**只有无法合理归入"纯表单三档"时才允许特例。**
|
||||||
|
|
||||||
|
### 8.4 表单布局
|
||||||
|
|
||||||
|
- 常规 CRUD:`label-position="top"` + `ElRow + ElCol` 双列 + `gutter=16`。
|
||||||
|
- 普通字段 `span=12`;长文本/重量级字段 `span=24`。
|
||||||
|
- 字段 ≤ 6 默认按单列理解。
|
||||||
|
|
||||||
|
### 8.5 其他
|
||||||
|
|
||||||
|
- **禁止**用页面级宽范围样式覆盖整页 `.business-form-dialog` 来统一放大;如需特殊宽度,必须精确作用于目标弹框,不误伤同页其他 dialog。
|
||||||
|
- 底部按钮固定 **取消 → 确认**,右对齐。
|
||||||
|
- 单选组/开关字段优先复用既有钩子:`business-form-radio-group`、`business-form-switch-field`。
|
||||||
|
- **权限按钮默认"无权限不渲染"**;只有业务状态暂时不可操作但仍需让用户感知入口存在时,才允许保留禁用态。
|
||||||
|
|
||||||
|
### 8.6 全局反馈(Toast / Message)
|
||||||
|
|
||||||
|
- **全局反馈通道只有一个**:`window.$message`(`src/components/common/app-provider.vue` 注入的 `ElMessage`),全仓 30+ 处都用它。**不要平行引入 `ElNotification` / 自定义 toast**;要求"全局风格切换"则单独立项,不要在小改动里悄悄启动。
|
||||||
|
- **type 语义**(4 种 type → 3 类视觉语义):
|
||||||
|
- `error` → 错误(红):操作失败、明确异常
|
||||||
|
- `warning` → 告警(橙):用户即将出错、风险确认
|
||||||
|
- `success` → 通知-成功(绿):操作成功
|
||||||
|
- `info` → 通知-信息(蓝):信息告知、默认兜底说明
|
||||||
|
- **type 选错就丑**:`warning` 是"出错警告",不要拿来表达普通信息(用 `info`);`info` 是"信息告知",不要拿来报错(用 `error`)。
|
||||||
|
- **"先做 A 再做 B" 的引导性提示**:用 `ElFormItem :error="msg"` 红字内联(跟校验同款),**不要用 toast**——toast 适合事后反馈、不阻断流程,对引导性提示体验差。
|
||||||
|
- **全局视觉**(实色背景 + 白字 + 阴影 + `$radius` 圆角)由 `src/styles/scss/element-plus.scss` 末尾的 `.el-message` 块统一维护,**业务页面禁止覆盖** `.el-message-*` 样式。要调颜色就改 `element-plus.scss`,不要在业务页 scoped 散落。
|
||||||
|
|
||||||
|
```ts
|
||||||
|
window.$message?.success('保存成功');
|
||||||
|
window.$message?.error('保存失败:xxx');
|
||||||
|
window.$message?.warning('当前修改未保存,确认离开?');
|
||||||
|
window.$message?.info('未选择计划开始日期,已按今日为基准计算');
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 9. 接口、路由、权限
|
||||||
|
|
||||||
|
- 默认走 `src/service/request/index.ts`,不另造鉴权/加密/错误处理/token 刷新。
|
||||||
|
- 接口前缀、服务常量优先复用 `src/constants/service.ts`。
|
||||||
|
- 后端契约变化时同步检查 `src/service/api/*`、`src/typings/api/*`、相关页面、说明文档。
|
||||||
|
- 路由/菜单/权限改动时同步检查 `build/plugins/router.ts`、`src/router/routes/*`、`src/store/modules/route/*`、相关文档。
|
||||||
|
- 路由产物过期:改源配置 + `pnpm gen-route`,**不要把手工修补生成文件当常规方案**。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 10. 运行时字典
|
||||||
|
|
||||||
|
- 由 `src/store/modules/dict/index.ts` 管理,登录后通过 `/system/dict-data/frontend-cache` 初始化。**不要在页面重复直调字典接口。**
|
||||||
|
- 字典编码常量收敛在 `src/constants/dict.ts`。**不要散落硬编码 `dictType`。**
|
||||||
|
- **不要猜字典编码**:先从后端接口文档/字段契约/系统字典管理页确认真实 `dictType`,再写入常量。
|
||||||
|
- 常量加中文注释:对应业务字段 + 编码确认来源。
|
||||||
|
- 后端编码带历史命名痕迹(如 `rdms_product_direction`)时,前端常量名按真实业务语义命名,**不扩散历史误导**。
|
||||||
|
|
||||||
|
### 字典使用方式
|
||||||
|
|
||||||
|
| 场景 | 组件/Hook |
|
||||||
|
|---|---|
|
||||||
|
| 表单下拉 | `src/components/custom/dict-select.vue` |
|
||||||
|
| 普通文案回显 | `src/components/custom/dict-text.vue` |
|
||||||
|
| 标签态回显 | `src/components/custom/dict-tag.vue`(标签颜色业务页自决) |
|
||||||
|
| script setup / TSX 列格式化 / 复杂判断 | `src/hooks/business/dict.ts` 的 `useDict(dictCode)` |
|
||||||
|
|
||||||
|
`useDict` 常用能力:`dictOptions`、`getItem`、`getLabel`、`getLabels`、`hasValue`。
|
||||||
|
|
||||||
|
`DictSelect` 默认只展示启用项;需包含禁用项显式 `:only-enabled="false"`。
|
||||||
|
|
||||||
|
```vue
|
||||||
|
<DictSelect v-model="form.directionCode" :dict-code="RDMS_OBJECT_DIRECTION_DICT_CODE" />
|
||||||
|
<DictText :dict-code="RDMS_OBJECT_DIRECTION_DICT_CODE" :value="row.directionCode" />
|
||||||
|
<DictTag :dict-code="SYSTEM_USER_COMPANY_DICT_CODE" :value="row.companyCode" type="info" />
|
||||||
|
```
|
||||||
|
|
||||||
|
```ts
|
||||||
|
const { getLabel, getLabels } = useDict(RDMS_OBJECT_DIRECTION_DICT_CODE);
|
||||||
|
const directionLabel = getLabel(row.directionCode);
|
||||||
|
const directionLabels = getLabels(row.directionCodes, { separator: ',' });
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 11. 页面资源 & 菜单目录(三层不同概念)
|
||||||
|
|
||||||
|
- `component` = 渲染哪个页面组件
|
||||||
|
- 菜单目录 = 挂在哪个业务目录、最终 URL
|
||||||
|
- 页面资源 = 白名单中选择并回填组件信息
|
||||||
|
|
||||||
|
**不要混淆**:组件键 `view.system_dict` ≠ 必须挂 `/system/dict`,同一个组件允许在新业务目录下复用。
|
||||||
|
|
||||||
|
页面资源白名单的标准路径是**参考路径,不应反向覆盖菜单树已确定的最终 URL**。
|
||||||
|
|
||||||
|
菜单编辑器/页面资源选择逻辑改动时,保证"组件可解析、资源合法、最终 URL 由菜单树决定",**不要强绑标准路径与父目录前缀**。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 12. ID 类型铁律(强约束,必须严格执行)
|
||||||
|
|
||||||
|
> 后端主键 ID / 用户 ID / 对象 ID / 雪花 ID / Long ID **一律按 `string` 接收和传递**。
|
||||||
|
|
||||||
|
**原因**:JS `number` 无法稳定承载 Long 精度;序列化精度丢失;`number/string` 键不一致 → 回显/筛选/映射/路由参数/对象上下文异常。
|
||||||
|
|
||||||
|
### 落实范围(全部)
|
||||||
|
`typings`、API 返回类型、表单 model、组件 props/emits、`ElSelect` 的 value、路由参数、查询参数、`Map` 键、筛选条件、store 状态 → **全部 `string` / `string[]`**。
|
||||||
|
|
||||||
|
### 禁止写法
|
||||||
|
- ❌ `Number(id)` / `+id` / `parseInt(id)` / `parseFloat(id)` / `Math.floor(id)`
|
||||||
|
- ❌ 任何"为了比较/传参/回填/提交而把 ID 转 number"
|
||||||
|
|
||||||
|
### 比较与映射
|
||||||
|
- ✅ `id === targetId`
|
||||||
|
- ✅ `Map<string, T>` / `Set<string>`
|
||||||
|
- ❌ 不混用 `number/string` 双口径
|
||||||
|
|
||||||
|
### 后端契约风险(关键)
|
||||||
|
- 后端暂返数值型 ID 时,**前端在 `typings` / API 适配层 / 进业务层前转 `string`**,不要按 `number` 扩散。
|
||||||
|
- **但如果后端把超 JS 安全整数的 Long 直接作为 JSON 数字返回,前端再 `String(number)` 只能得到"已经丢精度后的错误字符串"**。这种情况必须明确记为接口契约风险,不能误判为"已安全处理"。
|
||||||
|
- 最稳妥契约:**后端 Long ID 直接按字符串返回**;前端全链路按字符串。后端未改,前端也不得新增 `number` 口径 ID。
|
||||||
|
|
||||||
|
### API 适配层兜底(操作约束)
|
||||||
|
- 所有从后端接收的数值型 ID 字段,**必须**在 `src/service/api/*` 的 normalize/map 函数里显式 `String(rawId)` 一次——**不管后端返回 string、number、还是混合**。
|
||||||
|
- 业务层(views / store / 组件 / `Map` key / 路由参数)**只接收 string**,从不需要自己 `String()`。
|
||||||
|
- 与"后端是否已经全局 Long → String"**无关**:
|
||||||
|
- 后端做了 → 双保险
|
||||||
|
- 后端没做但取值在 JS 安全整数内 → 单层防御也对(实际值不丢精度)
|
||||||
|
- 后端没做且取值超安全整数 → 不安全,必须推后端改
|
||||||
|
- **不开"按取值范围豁免"的口子**:哪怕后端说"这个字段永远是两位数"(如 `infra_file_config.id`),前端照样 `String()`。否则后续会冒出"projectStatus 是 Long 但只有 0-99,也可以保留 number"等连锁例外,铁律字面被掏空。
|
||||||
|
|
||||||
|
### 历史代码原则
|
||||||
|
不再新增 `number` 口径;当前任务触达相关链路时**顺手矫正**;不要继续复制历史写法。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 13. 代码约定
|
||||||
|
|
||||||
|
- 优先用别名导入(`@/...`、`~/...`),避免长相对路径。
|
||||||
|
- 与 TypeScript 严格模式兼容。
|
||||||
|
- 沿用 Vue SFC 风格:`script setup`、类型化 store、职责单一的小型 composable/helper。
|
||||||
|
- UI 沿用 `src/layouts` 和 `src/theme` 现有模式,不平行引入新设计体系。
|
||||||
|
- **注释克制**:只在代码本身不直观时补必要中文说明;不删原有有效注释;不写没信息量的注释。
|
||||||
|
- 中文内容用 UTF-8,自检显示;**不要用改成英文规避编码问题**。
|
||||||
|
- Node ESM 脚本:避免 `__filename`/`__dirname` 这类下划线悬挂命名。
|
||||||
|
- 批量异步并发优先 `Promise.all(...)`,不在循环里默认 `await`。
|
||||||
|
- 手写 `new Promise(...)` 用 block 写法,不要写成隐式返回的单表达式箭头函数。
|
||||||
|
- 函数若同时承担"判断 + 转换 + 组装 + 递归",拆 helper。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 14. 校验
|
||||||
|
|
||||||
|
### 14.1 校验口径
|
||||||
|
|
||||||
|
| 任务类型 | 默认校验 |
|
||||||
|
|---|---|
|
||||||
|
| 前端页面/交互/样式 | `pnpm typecheck`,不主动跑测试 |
|
||||||
|
| 需更严格静态检查 | 加 `pnpm lint` |
|
||||||
|
| 涉及路由 | 加 `pnpm gen-route` |
|
||||||
|
| 影响页面资源清单/菜单资源选择/页面白名单 | 加 `pnpm gen:page-resource-manifest` |
|
||||||
|
|
||||||
|
### 14.2 静态校验自查清单
|
||||||
|
- 调用链是否闭环?改动是否在正确分层?
|
||||||
|
- 路由/菜单/权限标识/主题状态/资源注册 是否前后一致?
|
||||||
|
- 改动范围是否控制在最小集合?
|
||||||
|
- 文档/类型/接口封装/生成产物 是否需要同步更新?
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 15. 提交规范
|
||||||
|
|
||||||
|
- **`pre-commit` 执行 `pnpm typecheck && pnpm lint && git diff --exit-code`**:能跑 ≠ 能提交。
|
||||||
|
- `pnpm lint` 会跑 `eslint . --fix`:提交失败后检查是否有被自动修复但未重新暂存的文件。
|
||||||
|
- 推荐提交方式:`pnpm commit:zh`(交互选 type/scope/description)。
|
||||||
|
- 手动提交:`git commit -m "type(scope): 描述"`,参考 `docs/前端提交规范与示例.md`。
|
||||||
|
- `commit-msg` 钩子校验 Conventional Commits。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 16. 协作记忆(与本仓库用户共事)
|
||||||
|
|
||||||
|
- 用户语言:**中文**(始终用中文回复)。
|
||||||
|
- **不主动跑 git 命令**(用户已强调)。
|
||||||
|
- 默认精简、结论先行。
|
||||||
|
- 工作树脏时不要回退无关变更。
|
||||||
|
- 改架构/权限/页面规范前先翻 `docs/`,避免与现有约定冲突。
|
||||||
|
- 改布局/主题时同时检查 `src/layouts/*` 与 `src/store/modules/theme/*`。
|
||||||
|
- 改路由/菜单时同时检查 `build/plugins/router.ts` 与 `src/router/routes/*`。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 17. 常用命令速查
|
||||||
|
|
||||||
|
```bash
|
||||||
|
pnpm typecheck # 最小静态校验
|
||||||
|
pnpm lint # eslint . --fix
|
||||||
|
pnpm gen-route # 重新生成路由产物
|
||||||
|
pnpm gen:page-resource-manifest # 同步页面资源清单
|
||||||
|
pnpm commit:zh # 交互式提交(推荐)
|
||||||
|
pnpm dev # dev server (9527)
|
||||||
|
pnpm preview # preview server (9725)
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 18. 业务对象状态颜色
|
||||||
|
|
||||||
|
- 集中文件:`src/constants/status-tag.ts`
|
||||||
|
- 各业务域 `statusCode → ElTag type` 在此统一维护,**不要在各页面散落硬编码**。
|
||||||
|
- 已支持域:`projectExecution`、`projectTask`;预留:`project`、`product`、`requirement`、`workOrder`。
|
||||||
|
- helper:`getStatusTagType(domain, statusCode)`,未匹配回退 `'info'`。
|
||||||
|
- 业务模块写薄包装,例如 `getExecutionStatusTagType(code) = getStatusTagType('projectExecution', code)`。
|
||||||
|
- 新增对象域:在 `StatusDomain` 加枚举 + `statusTagTypeRegistry` 加对应 map;调用方写一个 wrapper 即可。
|
||||||
|
- 后端契约:未来若状态字典返颜色字段,调用方优先取后端值,缺失时回退 helper(前端兜底)。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 19. 防重复提交(两层联防,强约束)
|
||||||
|
|
||||||
|
> 用户双击、键盘连按 Enter、`ElMessageBox.confirm` 的"确定"按钮无内置 loading 都会让同一写操作发多次。两层防御缺一不可。
|
||||||
|
|
||||||
|
### 两层各自的职责
|
||||||
|
|
||||||
|
| 层 | 谁负责 | 行为 |
|
||||||
|
|---|---|---|
|
||||||
|
| 视觉层 | `business-form-dialog.vue` / `business-form-drawer.vue` | submit 触发后立即把"确认"按钮置 loading + disabled,挡住二次点击 |
|
||||||
|
| 逻辑层(兜底) | `src/service/request/dedupe.ts`(已通过 `withDedupe` 包住 `request` 实例) | 写操作 pending 期内复用同一 Promise,不真正发出第二次请求 |
|
||||||
|
|
||||||
|
### 业务侧关注点
|
||||||
|
|
||||||
|
- **不要裸手写** `<ElButton @click="submit">` 调接口;用 `business-form-dialog` / `business-form-drawer` 包;非要用裸 `ElButton` 时**必须**自行绑 `:loading` 并在 await 期间锁住。
|
||||||
|
- **`ElMessageBox.confirm` 的"确定"按钮没 loading 能力**——不要尝试改它,靠第二层兜底就够。
|
||||||
|
- **新接口默认享受去重**,调用方零改动;不要在 `src/service/api/*` 或页面层再造一套去重。
|
||||||
|
|
||||||
|
### 去重生效边界
|
||||||
|
|
||||||
|
- 自动去重:`POST` / `PUT` / `DELETE` / `PATCH`。
|
||||||
|
- 不去重:`GET` / `HEAD` / `OPTIONS`(避免误伤分页 / 多 widget 并发查询);请求体为 `FormData` / `Blob`(上传场景)。
|
||||||
|
- 单接口逃生口:`request({ ..., dedupe: false })`——极少用,仅当业务真允许短时间内连发完全相同的写请求。
|
||||||
|
- 兜底超时 30s:保险丝,防止 Promise 永不 settle 时内存泄漏。
|
||||||
|
|
||||||
|
### 指纹算法
|
||||||
|
|
||||||
|
`method 大写 | URL + 排序后的 params 序列化 | 稳定序列化的 body`。body 内对象按 key 排序、数组保序——保证调用顺序不同但参数等价的两次请求拿到同一指纹。
|
||||||
|
|
||||||
|
### 何时回到本节查
|
||||||
|
|
||||||
|
- 新建写操作页面 → 视觉层用对组件、不裸 `ElButton` 调接口
|
||||||
|
- 新建写接口 → 不用管,默认兜底;只有明确"允许短时间连发"才传 `dedupe: false`
|
||||||
|
- 新建上传 / 下载流程 → FormData / Blob 天然不在去重范围,按原方式写即可
|
||||||
|
- 用户报"双击双发"复现不出来 → 检查目标按钮是否走了 `business-form-dialog`;若用的是 `ElMessageBox.confirm`,靠第二层就该挡住
|
||||||
@@ -1,6 +1,7 @@
|
|||||||
import type { ProxyOptions } from 'vite';
|
import type { ProxyOptions } from 'vite';
|
||||||
import { bgRed, bgYellow, green, lightBlue } from 'kolorist';
|
import { bgRed, bgYellow, green, lightBlue } from 'kolorist';
|
||||||
import { consola } from 'consola';
|
import { consola } from 'consola';
|
||||||
|
import { WEB_SERVICE_PREFIX } from '../../src/constants/service';
|
||||||
import { createServiceConfig } from '../../src/utils/service';
|
import { createServiceConfig } from '../../src/utils/service';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -24,6 +25,14 @@ export function createViteProxy(env: Env.ImportMeta, enable: boolean) {
|
|||||||
Object.assign(proxy, createProxyItem(item, isEnableProxyLog));
|
Object.assign(proxy, createProxyItem(item, isEnableProxyLog));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 富文本图片 <img src="/admin-api/system/file/{configId}/get/{path}"> 由浏览器直接发起,
|
||||||
|
// 不经过 axios,没有 baseURL 前缀。这里加一条原样透传,避免被 Vite SPA fallback 兜底成 index.html。
|
||||||
|
// 不带 rewrite —— 原样把 /admin-api/* 转发到后端;不影响现有 /proxy-default 链路。
|
||||||
|
proxy[WEB_SERVICE_PREFIX] = {
|
||||||
|
target: baseURL,
|
||||||
|
changeOrigin: true
|
||||||
|
};
|
||||||
|
|
||||||
return proxy;
|
return proxy;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -27,8 +27,13 @@ export function setupElegantRouter() {
|
|||||||
onRouteMetaGen(routeName) {
|
onRouteMetaGen(routeName) {
|
||||||
const key = routeName as RouteKey;
|
const key = routeName as RouteKey;
|
||||||
|
|
||||||
const constantRoutes: RouteKey[] = ['login', '403', '404', '500'];
|
const constantRoutes: RouteKey[] = ['login', '403', '404', '500', 'workbench'];
|
||||||
const routeMetaMap: Partial<Record<RouteKey, Partial<RouteMeta>>> = {
|
const routeMetaMap: Partial<Record<RouteKey, Partial<RouteMeta>>> = {
|
||||||
|
workbench: {
|
||||||
|
icon: 'mdi:view-dashboard-outline',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
product: {
|
product: {
|
||||||
icon: 'carbon:product',
|
icon: 'carbon:product',
|
||||||
order: 4
|
order: 4
|
||||||
@@ -50,6 +55,102 @@ export function setupElegantRouter() {
|
|||||||
hideInMenu: true,
|
hideInMenu: true,
|
||||||
activeMenu: 'product_list'
|
activeMenu: 'product_list'
|
||||||
},
|
},
|
||||||
|
project: {
|
||||||
|
icon: 'mdi:briefcase-outline',
|
||||||
|
order: 5
|
||||||
|
},
|
||||||
|
project_list: {
|
||||||
|
icon: 'material-symbols:view-list-outline-rounded',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
project_project: {
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
},
|
||||||
|
project_project_overview: {
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
},
|
||||||
|
project_project_requirement: {
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
},
|
||||||
|
project_project_execution: {
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
},
|
||||||
|
project_project_setting: {
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
},
|
||||||
|
ticket: {
|
||||||
|
icon: 'mdi:ticket-confirmation-outline',
|
||||||
|
order: 6
|
||||||
|
},
|
||||||
|
'ticket_my-submitted': {
|
||||||
|
icon: 'mdi:upload-outline',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'ticket_my-pending': {
|
||||||
|
icon: 'mdi:inbox-arrow-down-outline',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
metrics: {
|
||||||
|
icon: 'mdi:chart-line',
|
||||||
|
order: 7
|
||||||
|
},
|
||||||
|
'metrics_project-progress': {
|
||||||
|
icon: 'mdi:progress-clock',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'metrics_member-efficiency': {
|
||||||
|
icon: 'mdi:account-multiple-check-outline',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
metrics_worktime: {
|
||||||
|
icon: 'mdi:clock-time-five-outline',
|
||||||
|
order: 3,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'personal-center': {
|
||||||
|
icon: 'mdi:account-circle-outline',
|
||||||
|
order: 8
|
||||||
|
},
|
||||||
|
'personal-center_my-profile': {
|
||||||
|
icon: 'mdi:account-box-outline',
|
||||||
|
order: 0,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'personal-center_my-weekly': {
|
||||||
|
icon: 'mdi:calendar-week-outline',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'personal-center_my-monthly': {
|
||||||
|
icon: 'mdi:calendar-month-outline',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'personal-center_my-performance': {
|
||||||
|
icon: 'mdi:trophy-outline',
|
||||||
|
order: 3,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'personal-center_my-application': {
|
||||||
|
icon: 'mdi:file-document-outline',
|
||||||
|
order: 4,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'personal-center_pending-approval': {
|
||||||
|
icon: 'mdi:check-decagram-outline',
|
||||||
|
order: 5,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
system: {
|
system: {
|
||||||
icon: 'carbon:cloud-service-management',
|
icon: 'carbon:cloud-service-management',
|
||||||
order: 9,
|
order: 9,
|
||||||
@@ -81,6 +182,20 @@ export function setupElegantRouter() {
|
|||||||
hideInMenu: true,
|
hideInMenu: true,
|
||||||
roles: ['R_ADMIN'],
|
roles: ['R_ADMIN'],
|
||||||
activeMenu: 'system_user'
|
activeMenu: 'system_user'
|
||||||
|
},
|
||||||
|
infra: {
|
||||||
|
icon: 'ep:monitor',
|
||||||
|
order: 20
|
||||||
|
},
|
||||||
|
'infra_state-machine': {
|
||||||
|
icon: 'mdi:state-machine',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
},
|
||||||
|
'infra_rd-code': {
|
||||||
|
icon: 'mdi:identifier',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -1,13 +1,46 @@
|
|||||||
{
|
{
|
||||||
"generatedAt": "2026-04-20T11:27:02.190Z",
|
"generatedAt": "2026-05-13T10:54:08.684Z",
|
||||||
"description": "Frontend visible page resource whitelist for backend route/menu configuration.",
|
"description": "Frontend visible page resource whitelist for backend route/menu configuration.",
|
||||||
"rules": {
|
"rules": {
|
||||||
"directoryComponent": "layout.base",
|
"directoryComponent": "layout.base",
|
||||||
"pageComponentPattern": "view.<routeName>",
|
"pageComponentPattern": "view.<routeName>",
|
||||||
"singlePageComponentPattern": "layout.<layoutName>$view.<routeName>"
|
"singlePageComponentPattern": "layout.<layoutName>$view.<routeName>"
|
||||||
},
|
},
|
||||||
"total": 7,
|
"total": 21,
|
||||||
"items": [
|
"items": [
|
||||||
|
{
|
||||||
|
"name": "workbench",
|
||||||
|
"path": "/workbench",
|
||||||
|
"component": "layout.base$view.workbench",
|
||||||
|
"title": "workbench",
|
||||||
|
"routeTitle": "workbench",
|
||||||
|
"i18nKey": "route.workbench",
|
||||||
|
"icon": "mdi:view-dashboard-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "workbench",
|
||||||
|
"i18nKey": "route.workbench",
|
||||||
|
"icon": "mdi:view-dashboard-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": null,
|
||||||
|
"pageType": "single",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"name": "product_list",
|
"name": "product_list",
|
||||||
"path": "/product/list",
|
"path": "/product/list",
|
||||||
@@ -41,6 +74,369 @@
|
|||||||
"pageType": "leaf",
|
"pageType": "leaf",
|
||||||
"source": "generated"
|
"source": "generated"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"name": "project_list",
|
||||||
|
"path": "/project/list",
|
||||||
|
"component": "view.project_list",
|
||||||
|
"title": "项目列表",
|
||||||
|
"routeTitle": "project_list",
|
||||||
|
"i18nKey": "route.project_list",
|
||||||
|
"icon": "material-symbols:view-list-outline-rounded",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "项目列表",
|
||||||
|
"i18nKey": "route.project_list",
|
||||||
|
"icon": "material-symbols:view-list-outline-rounded",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "project",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "ticket_my-submitted",
|
||||||
|
"path": "/ticket/my-submitted",
|
||||||
|
"component": "view.ticket_my-submitted",
|
||||||
|
"title": "ticket_my-submitted",
|
||||||
|
"routeTitle": "ticket_my-submitted",
|
||||||
|
"i18nKey": "route.ticket_my-submitted",
|
||||||
|
"icon": "mdi:upload-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "ticket_my-submitted",
|
||||||
|
"i18nKey": "route.ticket_my-submitted",
|
||||||
|
"icon": "mdi:upload-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "ticket",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "ticket_my-pending",
|
||||||
|
"path": "/ticket/my-pending",
|
||||||
|
"component": "view.ticket_my-pending",
|
||||||
|
"title": "ticket_my-pending",
|
||||||
|
"routeTitle": "ticket_my-pending",
|
||||||
|
"i18nKey": "route.ticket_my-pending",
|
||||||
|
"icon": "mdi:inbox-arrow-down-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "ticket_my-pending",
|
||||||
|
"i18nKey": "route.ticket_my-pending",
|
||||||
|
"icon": "mdi:inbox-arrow-down-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "ticket",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "metrics_project-progress",
|
||||||
|
"path": "/metrics/project-progress",
|
||||||
|
"component": "view.metrics_project-progress",
|
||||||
|
"title": "metrics_project-progress",
|
||||||
|
"routeTitle": "metrics_project-progress",
|
||||||
|
"i18nKey": "route.metrics_project-progress",
|
||||||
|
"icon": "mdi:progress-clock",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "metrics_project-progress",
|
||||||
|
"i18nKey": "route.metrics_project-progress",
|
||||||
|
"icon": "mdi:progress-clock",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "metrics",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "metrics_member-efficiency",
|
||||||
|
"path": "/metrics/member-efficiency",
|
||||||
|
"component": "view.metrics_member-efficiency",
|
||||||
|
"title": "metrics_member-efficiency",
|
||||||
|
"routeTitle": "metrics_member-efficiency",
|
||||||
|
"i18nKey": "route.metrics_member-efficiency",
|
||||||
|
"icon": "mdi:account-multiple-check-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "metrics_member-efficiency",
|
||||||
|
"i18nKey": "route.metrics_member-efficiency",
|
||||||
|
"icon": "mdi:account-multiple-check-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "metrics",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "metrics_worktime",
|
||||||
|
"path": "/metrics/worktime",
|
||||||
|
"component": "view.metrics_worktime",
|
||||||
|
"title": "metrics_worktime",
|
||||||
|
"routeTitle": "metrics_worktime",
|
||||||
|
"i18nKey": "route.metrics_worktime",
|
||||||
|
"icon": "mdi:clock-time-five-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 3,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "metrics_worktime",
|
||||||
|
"i18nKey": "route.metrics_worktime",
|
||||||
|
"icon": "mdi:clock-time-five-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 3,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "metrics",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "personal-center_my-weekly",
|
||||||
|
"path": "/personal-center/my-weekly",
|
||||||
|
"component": "view.personal-center_my-weekly",
|
||||||
|
"title": "personal-center_my-weekly",
|
||||||
|
"routeTitle": "personal-center_my-weekly",
|
||||||
|
"i18nKey": "route.personal-center_my-weekly",
|
||||||
|
"icon": "mdi:calendar-week-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "personal-center_my-weekly",
|
||||||
|
"i18nKey": "route.personal-center_my-weekly",
|
||||||
|
"icon": "mdi:calendar-week-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "personal-center",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "personal-center_my-monthly",
|
||||||
|
"path": "/personal-center/my-monthly",
|
||||||
|
"component": "view.personal-center_my-monthly",
|
||||||
|
"title": "personal-center_my-monthly",
|
||||||
|
"routeTitle": "personal-center_my-monthly",
|
||||||
|
"i18nKey": "route.personal-center_my-monthly",
|
||||||
|
"icon": "mdi:calendar-month-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "personal-center_my-monthly",
|
||||||
|
"i18nKey": "route.personal-center_my-monthly",
|
||||||
|
"icon": "mdi:calendar-month-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "personal-center",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "personal-center_my-performance",
|
||||||
|
"path": "/personal-center/my-performance",
|
||||||
|
"component": "view.personal-center_my-performance",
|
||||||
|
"title": "personal-center_my-performance",
|
||||||
|
"routeTitle": "personal-center_my-performance",
|
||||||
|
"i18nKey": "route.personal-center_my-performance",
|
||||||
|
"icon": "mdi:trophy-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 3,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "personal-center_my-performance",
|
||||||
|
"i18nKey": "route.personal-center_my-performance",
|
||||||
|
"icon": "mdi:trophy-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 3,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "personal-center",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "personal-center_my-application",
|
||||||
|
"path": "/personal-center/my-application",
|
||||||
|
"component": "view.personal-center_my-application",
|
||||||
|
"title": "personal-center_my-application",
|
||||||
|
"routeTitle": "personal-center_my-application",
|
||||||
|
"i18nKey": "route.personal-center_my-application",
|
||||||
|
"icon": "mdi:file-document-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 4,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "personal-center_my-application",
|
||||||
|
"i18nKey": "route.personal-center_my-application",
|
||||||
|
"icon": "mdi:file-document-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 4,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "personal-center",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "personal-center_pending-approval",
|
||||||
|
"path": "/personal-center/pending-approval",
|
||||||
|
"component": "view.personal-center_pending-approval",
|
||||||
|
"title": "personal-center_pending-approval",
|
||||||
|
"routeTitle": "personal-center_pending-approval",
|
||||||
|
"i18nKey": "route.personal-center_pending-approval",
|
||||||
|
"icon": "mdi:check-decagram-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 5,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "personal-center_pending-approval",
|
||||||
|
"i18nKey": "route.personal-center_pending-approval",
|
||||||
|
"icon": "mdi:check-decagram-outline",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 5,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "personal-center",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"name": "system_user",
|
"name": "system_user",
|
||||||
"path": "/system/user",
|
"path": "/system/user",
|
||||||
@@ -238,6 +634,72 @@
|
|||||||
"parentName": "system",
|
"parentName": "system",
|
||||||
"pageType": "leaf",
|
"pageType": "leaf",
|
||||||
"source": "generated"
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "infra_state-machine",
|
||||||
|
"path": "/infra/state-machine",
|
||||||
|
"component": "view.infra_state-machine",
|
||||||
|
"title": "infra_state-machine",
|
||||||
|
"routeTitle": "infra_state-machine",
|
||||||
|
"i18nKey": "route.infra_state-machine",
|
||||||
|
"icon": "mdi:state-machine",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "infra_state-machine",
|
||||||
|
"i18nKey": "route.infra_state-machine",
|
||||||
|
"icon": "mdi:state-machine",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 1,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "infra",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "infra_rd-code",
|
||||||
|
"path": "/infra/rd-code",
|
||||||
|
"component": "view.infra_rd-code",
|
||||||
|
"title": "infra_rd-code",
|
||||||
|
"routeTitle": "infra_rd-code",
|
||||||
|
"i18nKey": "route.infra_rd-code",
|
||||||
|
"icon": "mdi:identifier",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"keepAlive": true,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null,
|
||||||
|
"redirect": null,
|
||||||
|
"props": null,
|
||||||
|
"meta": {
|
||||||
|
"title": "infra_rd-code",
|
||||||
|
"i18nKey": "route.infra_rd-code",
|
||||||
|
"icon": "mdi:identifier",
|
||||||
|
"localIcon": null,
|
||||||
|
"order": 2,
|
||||||
|
"keepAlive": true,
|
||||||
|
"hideInMenu": false,
|
||||||
|
"activeMenu": null,
|
||||||
|
"multiTab": false,
|
||||||
|
"fixedIndexInTab": null
|
||||||
|
},
|
||||||
|
"parentName": "infra",
|
||||||
|
"pageType": "leaf",
|
||||||
|
"source": "generated"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -41,6 +41,7 @@
|
|||||||
"@antv/g2": "5.4.0",
|
"@antv/g2": "5.4.0",
|
||||||
"@antv/g6": "5.0.49",
|
"@antv/g6": "5.0.49",
|
||||||
"@better-scroll/core": "2.5.1",
|
"@better-scroll/core": "2.5.1",
|
||||||
|
"@iconify-vue/mingcute": "^1.0.5",
|
||||||
"@iconify/vue": "5.0.0",
|
"@iconify/vue": "5.0.0",
|
||||||
"@sa/axios": "workspace:*",
|
"@sa/axios": "workspace:*",
|
||||||
"@sa/color": "workspace:*",
|
"@sa/color": "workspace:*",
|
||||||
@@ -54,6 +55,8 @@
|
|||||||
"@visactor/vue-vtable": "1.19.8",
|
"@visactor/vue-vtable": "1.19.8",
|
||||||
"@vueuse/components": "13.9.0",
|
"@vueuse/components": "13.9.0",
|
||||||
"@vueuse/core": "13.9.0",
|
"@vueuse/core": "13.9.0",
|
||||||
|
"@wangeditor/editor": "^5.1.23",
|
||||||
|
"@wangeditor/editor-for-vue": "^5.1.12",
|
||||||
"clipboard": "2.0.11",
|
"clipboard": "2.0.11",
|
||||||
"dayjs": "1.11.18",
|
"dayjs": "1.11.18",
|
||||||
"defu": "^6.1.4",
|
"defu": "^6.1.4",
|
||||||
@@ -77,7 +80,6 @@
|
|||||||
"vue-i18n": "11.1.11",
|
"vue-i18n": "11.1.11",
|
||||||
"vue-pdf-embed": "2.1.3",
|
"vue-pdf-embed": "2.1.3",
|
||||||
"vue-router": "4.5.1",
|
"vue-router": "4.5.1",
|
||||||
"wangeditor": "4.7.15",
|
|
||||||
"xgplayer": "3.0.23",
|
"xgplayer": "3.0.23",
|
||||||
"xlsx": "0.18.5"
|
"xlsx": "0.18.5"
|
||||||
},
|
},
|
||||||
@@ -89,7 +91,6 @@
|
|||||||
"@sa/uno-preset": "workspace:*",
|
"@sa/uno-preset": "workspace:*",
|
||||||
"@soybeanjs/eslint-config": "1.7.1",
|
"@soybeanjs/eslint-config": "1.7.1",
|
||||||
"@types/bmapgl": "0.0.7",
|
"@types/bmapgl": "0.0.7",
|
||||||
"@types/dompurify": "3.2.0",
|
|
||||||
"@types/node": "24.3.0",
|
"@types/node": "24.3.0",
|
||||||
"@types/nprogress": "0.2.3",
|
"@types/nprogress": "0.2.3",
|
||||||
"@unocss/eslint-config": "66.5.0",
|
"@unocss/eslint-config": "66.5.0",
|
||||||
|
|||||||
466
pnpm-lock.yaml
generated
466
pnpm-lock.yaml
generated
@@ -20,6 +20,9 @@ importers:
|
|||||||
'@better-scroll/core':
|
'@better-scroll/core':
|
||||||
specifier: 2.5.1
|
specifier: 2.5.1
|
||||||
version: 2.5.1
|
version: 2.5.1
|
||||||
|
'@iconify-vue/mingcute':
|
||||||
|
specifier: ^1.0.5
|
||||||
|
version: 1.0.5(vue@3.5.20(typescript@5.8.3))
|
||||||
'@iconify/vue':
|
'@iconify/vue':
|
||||||
specifier: 5.0.0
|
specifier: 5.0.0
|
||||||
version: 5.0.0(vue@3.5.20(typescript@5.8.3))
|
version: 5.0.0(vue@3.5.20(typescript@5.8.3))
|
||||||
@@ -59,6 +62,12 @@ importers:
|
|||||||
'@vueuse/core':
|
'@vueuse/core':
|
||||||
specifier: 13.9.0
|
specifier: 13.9.0
|
||||||
version: 13.9.0(vue@3.5.20(typescript@5.8.3))
|
version: 13.9.0(vue@3.5.20(typescript@5.8.3))
|
||||||
|
'@wangeditor/editor':
|
||||||
|
specifier: ^5.1.23
|
||||||
|
version: 5.1.23
|
||||||
|
'@wangeditor/editor-for-vue':
|
||||||
|
specifier: ^5.1.12
|
||||||
|
version: 5.1.12(@wangeditor/editor@5.1.23)(vue@3.5.20(typescript@5.8.3))
|
||||||
clipboard:
|
clipboard:
|
||||||
specifier: 2.0.11
|
specifier: 2.0.11
|
||||||
version: 2.0.11
|
version: 2.0.11
|
||||||
@@ -128,9 +137,6 @@ importers:
|
|||||||
vue-router:
|
vue-router:
|
||||||
specifier: 4.5.1
|
specifier: 4.5.1
|
||||||
version: 4.5.1(vue@3.5.20(typescript@5.8.3))
|
version: 4.5.1(vue@3.5.20(typescript@5.8.3))
|
||||||
wangeditor:
|
|
||||||
specifier: 4.7.15
|
|
||||||
version: 4.7.15
|
|
||||||
xgplayer:
|
xgplayer:
|
||||||
specifier: 3.0.23
|
specifier: 3.0.23
|
||||||
version: 3.0.23(core-js@3.49.0)
|
version: 3.0.23(core-js@3.49.0)
|
||||||
@@ -159,9 +165,6 @@ importers:
|
|||||||
'@types/bmapgl':
|
'@types/bmapgl':
|
||||||
specifier: 0.0.7
|
specifier: 0.0.7
|
||||||
version: 0.0.7
|
version: 0.0.7
|
||||||
'@types/dompurify':
|
|
||||||
specifier: 3.2.0
|
|
||||||
version: 3.2.0
|
|
||||||
'@types/node':
|
'@types/node':
|
||||||
specifier: 24.3.0
|
specifier: 24.3.0
|
||||||
version: 24.3.0
|
version: 24.3.0
|
||||||
@@ -560,10 +563,6 @@ packages:
|
|||||||
peerDependencies:
|
peerDependencies:
|
||||||
'@babel/core': ^7.0.0-0
|
'@babel/core': ^7.0.0-0
|
||||||
|
|
||||||
'@babel/runtime-corejs3@7.29.2':
|
|
||||||
resolution: {integrity: sha512-Lc94FOD5+0aXhdb0Tdg3RUtqT6yWbI/BbFWvlaSJ3gAb9Ks+99nHRDKADVqC37er4eCB0fHyWT+y+K3QOvJKbw==}
|
|
||||||
engines: {node: '>=6.9.0'}
|
|
||||||
|
|
||||||
'@babel/runtime@7.29.2':
|
'@babel/runtime@7.29.2':
|
||||||
resolution: {integrity: sha512-JiDShH45zKHWyGe4ZNVRrCjBz8Nh9TMmZG1kh4QTK8hCBTWBi8Da+i7s1fJw7/lYpM4ccepSNfqzZ/QvABBi5g==}
|
resolution: {integrity: sha512-JiDShH45zKHWyGe4ZNVRrCjBz8Nh9TMmZG1kh4QTK8hCBTWBi8Da+i7s1fJw7/lYpM4ccepSNfqzZ/QvABBi5g==}
|
||||||
engines: {node: '>=6.9.0'}
|
engines: {node: '>=6.9.0'}
|
||||||
@@ -858,6 +857,14 @@ packages:
|
|||||||
resolution: {integrity: sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==}
|
resolution: {integrity: sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==}
|
||||||
engines: {node: '>=18.18'}
|
engines: {node: '>=18.18'}
|
||||||
|
|
||||||
|
'@iconify-vue/mingcute@1.0.5':
|
||||||
|
resolution: {integrity: sha512-9g/iEU2XdobbfS6vKp01btfBlPiMqlqa+GujwYOc5WVJierhKt3dF0+tamomdk9vYcIsJiGcqOaKvrJF0g6prA==}
|
||||||
|
|
||||||
|
'@iconify/css-vue@1.0.2':
|
||||||
|
resolution: {integrity: sha512-KXG9zXTMmJLi1AF2ket+YWUGdSqFvIMSnCO789uOVpba6SZhqeUttu0JIaEcq2dNlt4oonwdtMyerkpRkAFYhw==}
|
||||||
|
peerDependencies:
|
||||||
|
vue: '>=3.0.0'
|
||||||
|
|
||||||
'@iconify/json@2.2.380':
|
'@iconify/json@2.2.380':
|
||||||
resolution: {integrity: sha512-+Al/Q+mMB/nLz/tawmJEOkCs6+RKKVUS/Yg9I80h2yRpu0kIzxVLQRfF0NifXz/fH92vDVXbS399wio4lMVF4Q==}
|
resolution: {integrity: sha512-+Al/Q+mMB/nLz/tawmJEOkCs6+RKKVUS/Yg9I80h2yRpu0kIzxVLQRfF0NifXz/fH92vDVXbS399wio4lMVF4Q==}
|
||||||
|
|
||||||
@@ -1399,6 +1406,9 @@ packages:
|
|||||||
'@sxzz/popperjs-es@2.11.8':
|
'@sxzz/popperjs-es@2.11.8':
|
||||||
resolution: {integrity: sha512-wOwESXvvED3S8xBmcPWHs2dUuzrE4XiZeFu7e1hROIJkm02a49N120pmOXxY33sBb6hArItm5W5tcg1cBtV+HQ==}
|
resolution: {integrity: sha512-wOwESXvvED3S8xBmcPWHs2dUuzrE4XiZeFu7e1hROIJkm02a49N120pmOXxY33sBb6hArItm5W5tcg1cBtV+HQ==}
|
||||||
|
|
||||||
|
'@transloadit/prettier-bytes@0.0.7':
|
||||||
|
resolution: {integrity: sha512-VeJbUb0wEKbcwaSlj5n+LscBl9IPgLPkHVGBkh00cztv6X4L/TJXK58LzFuBKX7/GAfiGhIwH67YTLTlzvIzBA==}
|
||||||
|
|
||||||
'@turf/boolean-clockwise@6.5.0':
|
'@turf/boolean-clockwise@6.5.0':
|
||||||
resolution: {integrity: sha512-45+C7LC5RMbRWrxh3Z0Eihsc8db1VGBO5d9BLTOAwU4jR6SgsunTfRWR16X7JUwIDYlCVEmnjcXJNi/kIU3VIw==}
|
resolution: {integrity: sha512-45+C7LC5RMbRWrxh3Z0Eihsc8db1VGBO5d9BLTOAwU4jR6SgsunTfRWR16X7JUwIDYlCVEmnjcXJNi/kIU3VIw==}
|
||||||
|
|
||||||
@@ -1489,10 +1499,6 @@ packages:
|
|||||||
'@types/d3-timer@3.0.2':
|
'@types/d3-timer@3.0.2':
|
||||||
resolution: {integrity: sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==}
|
resolution: {integrity: sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==}
|
||||||
|
|
||||||
'@types/dompurify@3.2.0':
|
|
||||||
resolution: {integrity: sha512-Fgg31wv9QbLDA0SpTOXO3MaxySc4DKGLi8sna4/Utjo4r3ZRPdCt4UQee8BWr+Q5z21yifghREPJGYaEOEIACg==}
|
|
||||||
deprecated: This is a stub types definition. dompurify provides its own type definitions, so you do not need this installed.
|
|
||||||
|
|
||||||
'@types/eslint-scope@3.7.7':
|
'@types/eslint-scope@3.7.7':
|
||||||
resolution: {integrity: sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==}
|
resolution: {integrity: sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==}
|
||||||
|
|
||||||
@@ -1502,6 +1508,9 @@ packages:
|
|||||||
'@types/estree@1.0.8':
|
'@types/estree@1.0.8':
|
||||||
resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
|
resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
|
||||||
|
|
||||||
|
'@types/event-emitter@0.3.5':
|
||||||
|
resolution: {integrity: sha512-zx2/Gg0Eg7gwEiOIIh5w9TrhKKTeQh7CPCOPNc0el4pLSwzebA8SmnHwZs2dWlLONvyulykSwGSQxQHLhjGLvQ==}
|
||||||
|
|
||||||
'@types/geojson@7946.0.16':
|
'@types/geojson@7946.0.16':
|
||||||
resolution: {integrity: sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==}
|
resolution: {integrity: sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==}
|
||||||
|
|
||||||
@@ -1791,6 +1800,23 @@ packages:
|
|||||||
cpu: [x64]
|
cpu: [x64]
|
||||||
os: [win32]
|
os: [win32]
|
||||||
|
|
||||||
|
'@uppy/companion-client@2.2.2':
|
||||||
|
resolution: {integrity: sha512-5mTp2iq97/mYSisMaBtFRry6PTgZA6SIL7LePteOV5x0/DxKfrZW3DEiQERJmYpHzy7k8johpm2gHnEKto56Og==}
|
||||||
|
|
||||||
|
'@uppy/core@2.3.4':
|
||||||
|
resolution: {integrity: sha512-iWAqppC8FD8mMVqewavCz+TNaet6HPXitmGXpGGREGrakZ4FeuWytVdrelydzTdXx6vVKkOmI2FLztGg73sENQ==}
|
||||||
|
|
||||||
|
'@uppy/store-default@2.1.1':
|
||||||
|
resolution: {integrity: sha512-xnpTxvot2SeAwGwbvmJ899ASk5tYXhmZzD/aCFsXePh/v8rNvR2pKlcQUH7cF/y4baUGq3FHO/daKCok/mpKqQ==}
|
||||||
|
|
||||||
|
'@uppy/utils@4.1.3':
|
||||||
|
resolution: {integrity: sha512-nTuMvwWYobnJcytDO3t+D6IkVq/Qs4Xv3vyoEZ+Iaf8gegZP+rEyoaFT2CK5XLRMienPyqRqNbIfRuFaOWSIFw==}
|
||||||
|
|
||||||
|
'@uppy/xhr-upload@2.1.3':
|
||||||
|
resolution: {integrity: sha512-YWOQ6myBVPs+mhNjfdWsQyMRWUlrDLMoaG7nvf/G6Y3GKZf8AyjFDjvvJ49XWQ+DaZOftGkHmF1uh/DBeGivJQ==}
|
||||||
|
peerDependencies:
|
||||||
|
'@uppy/core': ^2.3.3
|
||||||
|
|
||||||
'@visactor/vchart-theme@1.12.2':
|
'@visactor/vchart-theme@1.12.2':
|
||||||
resolution: {integrity: sha512-r298TUdK+CKbHGVYWgQnNSEB5uqpFvF2/aMNZ/2POQnd2CovAPJOx2nTE6hAcOn8rra2FwJ2xF8AyP1O5OhrTw==}
|
resolution: {integrity: sha512-r298TUdK+CKbHGVYWgQnNSEB5uqpFvF2/aMNZ/2POQnd2CovAPJOx2nTE6hAcOn8rra2FwJ2xF8AyP1O5OhrTw==}
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
@@ -2015,6 +2041,93 @@ packages:
|
|||||||
peerDependencies:
|
peerDependencies:
|
||||||
vue: ^3.5.0
|
vue: ^3.5.0
|
||||||
|
|
||||||
|
'@wangeditor/basic-modules@1.1.7':
|
||||||
|
resolution: {integrity: sha512-cY9CPkLJaqF05STqfpZKWG4LpxTMeGSIIF1fHvfm/mz+JXatCagjdkbxdikOuKYlxDdeqvOeBmsUBItufDLXZg==}
|
||||||
|
peerDependencies:
|
||||||
|
'@wangeditor/core': 1.x
|
||||||
|
dom7: ^3.0.0
|
||||||
|
lodash.throttle: ^4.1.1
|
||||||
|
nanoid: ^3.2.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
|
'@wangeditor/code-highlight@1.0.3':
|
||||||
|
resolution: {integrity: sha512-iazHwO14XpCuIWJNTQTikqUhGKyqj+dUNWJ9288Oym9M2xMVHvnsOmDU2sgUDWVy+pOLojReMPgXCsvvNlOOhw==}
|
||||||
|
peerDependencies:
|
||||||
|
'@wangeditor/core': 1.x
|
||||||
|
dom7: ^3.0.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
|
'@wangeditor/core@1.1.19':
|
||||||
|
resolution: {integrity: sha512-KevkB47+7GhVszyYF2pKGKtCSj/YzmClsD03C3zTt+9SR2XWT5T0e3yQqg8baZpcMvkjs1D8Dv4fk8ok/UaS2Q==}
|
||||||
|
peerDependencies:
|
||||||
|
'@uppy/core': ^2.1.1
|
||||||
|
'@uppy/xhr-upload': ^2.0.3
|
||||||
|
dom7: ^3.0.0
|
||||||
|
is-hotkey: ^0.2.0
|
||||||
|
lodash.camelcase: ^4.3.0
|
||||||
|
lodash.clonedeep: ^4.5.0
|
||||||
|
lodash.debounce: ^4.0.8
|
||||||
|
lodash.foreach: ^4.5.0
|
||||||
|
lodash.isequal: ^4.5.0
|
||||||
|
lodash.throttle: ^4.1.1
|
||||||
|
lodash.toarray: ^4.4.0
|
||||||
|
nanoid: ^3.2.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
|
'@wangeditor/editor-for-vue@5.1.12':
|
||||||
|
resolution: {integrity: sha512-0Ds3D8I+xnpNWezAeO7HmPRgTfUxHLMd9JKcIw+QzvSmhC5xUHbpCcLU+KLmeBKTR/zffnS5GQo6qi3GhTMJWQ==}
|
||||||
|
peerDependencies:
|
||||||
|
'@wangeditor/editor': '>=5.1.0'
|
||||||
|
vue: ^3.0.5
|
||||||
|
|
||||||
|
'@wangeditor/editor@5.1.23':
|
||||||
|
resolution: {integrity: sha512-0RxfeVTuK1tktUaPROnCoFfaHVJpRAIE2zdS0mpP+vq1axVQpLjM8+fCvKzqYIkH0Pg+C+44hJpe3VVroSkEuQ==}
|
||||||
|
|
||||||
|
'@wangeditor/list-module@1.0.5':
|
||||||
|
resolution: {integrity: sha512-uDuYTP6DVhcYf7mF1pTlmNn5jOb4QtcVhYwSSAkyg09zqxI1qBqsfUnveeDeDqIuptSJhkh81cyxi+MF8sEPOQ==}
|
||||||
|
peerDependencies:
|
||||||
|
'@wangeditor/core': 1.x
|
||||||
|
dom7: ^3.0.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
|
'@wangeditor/table-module@1.1.4':
|
||||||
|
resolution: {integrity: sha512-5saanU9xuEocxaemGdNi9t8MCDSucnykEC6jtuiT72kt+/Hhh4nERYx1J20OPsTCCdVr7hIyQenFD1iSRkIQ6w==}
|
||||||
|
peerDependencies:
|
||||||
|
'@wangeditor/core': 1.x
|
||||||
|
dom7: ^3.0.0
|
||||||
|
lodash.isequal: ^4.5.0
|
||||||
|
lodash.throttle: ^4.1.1
|
||||||
|
nanoid: ^3.2.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
|
'@wangeditor/upload-image-module@1.0.2':
|
||||||
|
resolution: {integrity: sha512-z81lk/v71OwPDYeQDxj6cVr81aDP90aFuywb8nPD6eQeECtOymrqRODjpO6VGvCVxVck8nUxBHtbxKtjgcwyiA==}
|
||||||
|
peerDependencies:
|
||||||
|
'@uppy/core': ^2.0.3
|
||||||
|
'@uppy/xhr-upload': ^2.0.3
|
||||||
|
'@wangeditor/basic-modules': 1.x
|
||||||
|
'@wangeditor/core': 1.x
|
||||||
|
dom7: ^3.0.0
|
||||||
|
lodash.foreach: ^4.5.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
|
'@wangeditor/video-module@1.1.4':
|
||||||
|
resolution: {integrity: sha512-ZdodDPqKQrgx3IwWu4ZiQmXI8EXZ3hm2/fM6E3t5dB8tCaIGWQZhmqd6P5knfkRAd3z2+YRSRbxOGfoRSp/rLg==}
|
||||||
|
peerDependencies:
|
||||||
|
'@uppy/core': ^2.1.4
|
||||||
|
'@uppy/xhr-upload': ^2.0.7
|
||||||
|
'@wangeditor/core': 1.x
|
||||||
|
dom7: ^3.0.0
|
||||||
|
nanoid: ^3.2.0
|
||||||
|
slate: ^0.72.0
|
||||||
|
snabbdom: ^3.1.0
|
||||||
|
|
||||||
'@webassemblyjs/ast@1.14.1':
|
'@webassemblyjs/ast@1.14.1':
|
||||||
resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==}
|
resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==}
|
||||||
|
|
||||||
@@ -2434,6 +2547,9 @@ packages:
|
|||||||
component-emitter@1.3.1:
|
component-emitter@1.3.1:
|
||||||
resolution: {integrity: sha512-T0+barUSQRTUQASh8bx02dl+DhF54GtIDY13Y3m9oWTklKbb3Wv974meRpeZ3lp1JpLVECWWNHC4vaG2XHXouQ==}
|
resolution: {integrity: sha512-T0+barUSQRTUQASh8bx02dl+DhF54GtIDY13Y3m9oWTklKbb3Wv974meRpeZ3lp1JpLVECWWNHC4vaG2XHXouQ==}
|
||||||
|
|
||||||
|
compute-scroll-into-view@1.0.20:
|
||||||
|
resolution: {integrity: sha512-UCB0ioiyj8CRjtrvaceBLqqhZCVP+1B8+NWQhmdsm0VXOJtobBCf1dBQmebCCo34qZmUwZfIH2MZLqNHazrfjg==}
|
||||||
|
|
||||||
concat-map@0.0.1:
|
concat-map@0.0.1:
|
||||||
resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
|
resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
|
||||||
|
|
||||||
@@ -2476,9 +2592,6 @@ packages:
|
|||||||
core-js-compat@3.49.0:
|
core-js-compat@3.49.0:
|
||||||
resolution: {integrity: sha512-VQXt1jr9cBz03b331DFDCCP90b3fanciLkgiOoy8SBHy06gNf+vQ1A3WFLqG7I8TipYIKeYK9wxd0tUrvHcOZA==}
|
resolution: {integrity: sha512-VQXt1jr9cBz03b331DFDCCP90b3fanciLkgiOoy8SBHy06gNf+vQ1A3WFLqG7I8TipYIKeYK9wxd0tUrvHcOZA==}
|
||||||
|
|
||||||
core-js-pure@3.49.0:
|
|
||||||
resolution: {integrity: sha512-XM4RFka59xATyJv/cS3O3Kml72hQXUeGRuuTmMYFxwzc9/7C8OYTaIR/Ji+Yt8DXzsFLNhat15cE/JP15HrCgw==}
|
|
||||||
|
|
||||||
core-js@3.49.0:
|
core-js@3.49.0:
|
||||||
resolution: {integrity: sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg==}
|
resolution: {integrity: sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg==}
|
||||||
|
|
||||||
@@ -2800,6 +2913,9 @@ packages:
|
|||||||
dom-serializer@1.4.1:
|
dom-serializer@1.4.1:
|
||||||
resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}
|
resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}
|
||||||
|
|
||||||
|
dom7@3.0.0:
|
||||||
|
resolution: {integrity: sha512-oNlcUdHsC4zb7Msx7JN3K0Nro1dzJ48knvBOnDPKJ2GV9wl1i5vydJZUSyOfrkKFDZEud/jBsTk92S/VGSAe/g==}
|
||||||
|
|
||||||
domelementtype@1.3.1:
|
domelementtype@1.3.1:
|
||||||
resolution: {integrity: sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==}
|
resolution: {integrity: sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==}
|
||||||
|
|
||||||
@@ -3439,6 +3555,9 @@ packages:
|
|||||||
hookable@5.5.3:
|
hookable@5.5.3:
|
||||||
resolution: {integrity: sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==}
|
resolution: {integrity: sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==}
|
||||||
|
|
||||||
|
html-void-elements@2.0.1:
|
||||||
|
resolution: {integrity: sha512-0quDb7s97CfemeJAnW9wC0hw78MtW7NU3hqtCD75g2vFlDLt36llsYD7uB7SUzojLMP24N5IatXf7ylGXiGG9A==}
|
||||||
|
|
||||||
html2canvas@1.4.1:
|
html2canvas@1.4.1:
|
||||||
resolution: {integrity: sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==}
|
resolution: {integrity: sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==}
|
||||||
engines: {node: '>=8.0.0'}
|
engines: {node: '>=8.0.0'}
|
||||||
@@ -3450,6 +3569,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-eKCa6bwnJhvxj14kZk5NCPc6Hb6BdsU9DZcOnmQKSnO1VKrfV0zCvtttPZUsBvjmNDn8rpcJfpwSYnHBjc95MQ==}
|
resolution: {integrity: sha512-eKCa6bwnJhvxj14kZk5NCPc6Hb6BdsU9DZcOnmQKSnO1VKrfV0zCvtttPZUsBvjmNDn8rpcJfpwSYnHBjc95MQ==}
|
||||||
engines: {node: '>=18.18.0'}
|
engines: {node: '>=18.18.0'}
|
||||||
|
|
||||||
|
i18next@20.6.1:
|
||||||
|
resolution: {integrity: sha512-yCMYTMEJ9ihCwEQQ3phLo7I/Pwycf8uAx+sRHwwk5U9Aui/IZYgQRyMqXafQOw5QQ7DM1Z+WyEXWIqSuJHhG2A==}
|
||||||
|
|
||||||
iconv-lite@0.4.24:
|
iconv-lite@0.4.24:
|
||||||
resolution: {integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==}
|
resolution: {integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
@@ -3486,6 +3608,9 @@ packages:
|
|||||||
immediate@3.0.6:
|
immediate@3.0.6:
|
||||||
resolution: {integrity: sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==}
|
resolution: {integrity: sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==}
|
||||||
|
|
||||||
|
immer@9.0.21:
|
||||||
|
resolution: {integrity: sha512-bc4NBHqOqSfRW7POMkHd51LvClaeMXpm8dx0e8oE2GORbq5aRK7Bxl4FyzVLdGtLmvLKL7BTDBG5ACQm4HWjTA==}
|
||||||
|
|
||||||
immutable@5.1.5:
|
immutable@5.1.5:
|
||||||
resolution: {integrity: sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==}
|
resolution: {integrity: sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==}
|
||||||
|
|
||||||
@@ -3606,6 +3731,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
|
resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
|
|
||||||
|
is-hotkey@0.2.0:
|
||||||
|
resolution: {integrity: sha512-UknnZK4RakDmTgz4PI1wIph5yxSs/mvChWs9ifnlXsKuXgWmOkY/hAE0H/k2MIqH0RlRye0i1oC07MCRSD28Mw==}
|
||||||
|
|
||||||
is-inside-container@1.0.0:
|
is-inside-container@1.0.0:
|
||||||
resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==}
|
resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==}
|
||||||
engines: {node: '>=14.16'}
|
engines: {node: '>=14.16'}
|
||||||
@@ -3643,6 +3771,10 @@ packages:
|
|||||||
resolution: {integrity: sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==}
|
resolution: {integrity: sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
|
|
||||||
|
is-plain-object@5.0.0:
|
||||||
|
resolution: {integrity: sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==}
|
||||||
|
engines: {node: '>=0.10.0'}
|
||||||
|
|
||||||
is-regex@1.2.1:
|
is-regex@1.2.1:
|
||||||
resolution: {integrity: sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==}
|
resolution: {integrity: sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==}
|
||||||
engines: {node: '>= 0.4'}
|
engines: {node: '>= 0.4'}
|
||||||
@@ -3682,6 +3814,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==}
|
resolution: {integrity: sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==}
|
||||||
engines: {node: '>=18'}
|
engines: {node: '>=18'}
|
||||||
|
|
||||||
|
is-url@1.2.4:
|
||||||
|
resolution: {integrity: sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==}
|
||||||
|
|
||||||
is-weakmap@2.0.2:
|
is-weakmap@2.0.2:
|
||||||
resolution: {integrity: sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==}
|
resolution: {integrity: sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==}
|
||||||
engines: {node: '>= 0.4'}
|
engines: {node: '>= 0.4'}
|
||||||
@@ -3874,9 +4009,31 @@ packages:
|
|||||||
lodash: '*'
|
lodash: '*'
|
||||||
lodash-es: '*'
|
lodash-es: '*'
|
||||||
|
|
||||||
|
lodash.camelcase@4.3.0:
|
||||||
|
resolution: {integrity: sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==}
|
||||||
|
|
||||||
|
lodash.clonedeep@4.5.0:
|
||||||
|
resolution: {integrity: sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==}
|
||||||
|
|
||||||
|
lodash.debounce@4.0.8:
|
||||||
|
resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==}
|
||||||
|
|
||||||
|
lodash.foreach@4.5.0:
|
||||||
|
resolution: {integrity: sha512-aEXTF4d+m05rVOAUG3z4vZZ4xVexLKZGF0lIxuHZ1Hplpk/3B6Z1+/ICICYRLm7c41Z2xiejbkCkJoTlypoXhQ==}
|
||||||
|
|
||||||
|
lodash.isequal@4.5.0:
|
||||||
|
resolution: {integrity: sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==}
|
||||||
|
deprecated: This package is deprecated. Use require('node:util').isDeepStrictEqual instead.
|
||||||
|
|
||||||
lodash.merge@4.6.2:
|
lodash.merge@4.6.2:
|
||||||
resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
|
resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
|
||||||
|
|
||||||
|
lodash.throttle@4.1.1:
|
||||||
|
resolution: {integrity: sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==}
|
||||||
|
|
||||||
|
lodash.toarray@4.4.0:
|
||||||
|
resolution: {integrity: sha512-QyffEA3i5dma5q2490+SgCvDN0pXLmRGSyAANuVi0HQ01Pkfr9fuoKQW8wm1wGBnJITs/mS7wQvS6VshUEBFCw==}
|
||||||
|
|
||||||
lodash@4.17.21:
|
lodash@4.17.21:
|
||||||
resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
|
resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
|
||||||
|
|
||||||
@@ -3953,6 +4110,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
|
resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
|
||||||
engines: {node: '>= 0.6'}
|
engines: {node: '>= 0.6'}
|
||||||
|
|
||||||
|
mime-match@1.0.2:
|
||||||
|
resolution: {integrity: sha512-VXp/ugGDVh3eCLOBCiHZMYWQaTNUHv2IJrut+yXA6+JbLPXHglHwfS/5A5L0ll+jkCY7fIzRJcH6OIunF+c6Cg==}
|
||||||
|
|
||||||
mime-types@2.1.35:
|
mime-types@2.1.35:
|
||||||
resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
|
resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
|
||||||
engines: {node: '>= 0.6'}
|
engines: {node: '>= 0.6'}
|
||||||
@@ -4021,6 +4181,9 @@ packages:
|
|||||||
muggle-string@0.4.1:
|
muggle-string@0.4.1:
|
||||||
resolution: {integrity: sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==}
|
resolution: {integrity: sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==}
|
||||||
|
|
||||||
|
namespace-emitter@2.0.1:
|
||||||
|
resolution: {integrity: sha512-N/sMKHniSDJBjfrkbS/tpkPj4RAbvW3mr8UAzvlMHyun93XEm83IAvhWtJVHo+RHn/oO8Job5YN4b+wRjSVp5g==}
|
||||||
|
|
||||||
nanoid@3.3.11:
|
nanoid@3.3.11:
|
||||||
resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
|
resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
|
||||||
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
|
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
|
||||||
@@ -4336,6 +4499,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-spBB5sgC4cv2YcW03f/IAUN1pgDJWNWD8FzkyY4mArLUMJW+KlQhlmUdKAHQuPfb00Jl5xIfImeOsf6YL8QK7Q==}
|
resolution: {integrity: sha512-spBB5sgC4cv2YcW03f/IAUN1pgDJWNWD8FzkyY4mArLUMJW+KlQhlmUdKAHQuPfb00Jl5xIfImeOsf6YL8QK7Q==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
|
|
||||||
|
preact@10.29.1:
|
||||||
|
resolution: {integrity: sha512-gQCLc/vWroE8lIpleXtdJhTFDogTdZG9AjMUpVkDf2iTCNwYNWA+u16dL41TqUDJO4gm2IgrcMv3uTpjd4Pwmg==}
|
||||||
|
|
||||||
prelude-ls@1.2.1:
|
prelude-ls@1.2.1:
|
||||||
resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
|
resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
|
||||||
engines: {node: '>= 0.8.0'}
|
engines: {node: '>= 0.8.0'}
|
||||||
@@ -4366,6 +4532,10 @@ packages:
|
|||||||
print-js@1.6.0:
|
print-js@1.6.0:
|
||||||
resolution: {integrity: sha512-BfnOIzSKbqGRtO4o0rnj/K3681BSd2QUrsIZy/+WdCIugjIswjmx3lDEZpXB2ruGf9d4b3YNINri81+J0FsBWg==}
|
resolution: {integrity: sha512-BfnOIzSKbqGRtO4o0rnj/K3681BSd2QUrsIZy/+WdCIugjIswjmx3lDEZpXB2ruGf9d4b3YNINri81+J0FsBWg==}
|
||||||
|
|
||||||
|
prismjs@1.30.0:
|
||||||
|
resolution: {integrity: sha512-DEvV2ZF2r2/63V+tK8hQvrR2ZGn10srHbXviTlcv7Kpzw8jWiNTqbVgjO3IY8RxrrOUF8VPMQQFysYYYv0YZxw==}
|
||||||
|
engines: {node: '>=6'}
|
||||||
|
|
||||||
progress@2.0.3:
|
progress@2.0.3:
|
||||||
resolution: {integrity: sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==}
|
resolution: {integrity: sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==}
|
||||||
engines: {node: '>=0.4.0'}
|
engines: {node: '>=0.4.0'}
|
||||||
@@ -4547,6 +4717,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-eflK8wEtyOE6+hsaRVPxvUKYCpRgzLqDTb8krvAsRIwOGlHoSgYLgBXoubGgLd2fT41/OUYdb48v4k4WWHQurA==}
|
resolution: {integrity: sha512-eflK8wEtyOE6+hsaRVPxvUKYCpRgzLqDTb8krvAsRIwOGlHoSgYLgBXoubGgLd2fT41/OUYdb48v4k4WWHQurA==}
|
||||||
engines: {node: '>= 10.13.0'}
|
engines: {node: '>= 10.13.0'}
|
||||||
|
|
||||||
|
scroll-into-view-if-needed@2.2.31:
|
||||||
|
resolution: {integrity: sha512-dGCXy99wZQivjmjIqihaBQNjryrz5rueJY7eHfTdyWEiR4ttYpsajb14rn9s5d4DY4EcY6+4+U/maARBXJedkA==}
|
||||||
|
|
||||||
select@1.1.2:
|
select@1.1.2:
|
||||||
resolution: {integrity: sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA==}
|
resolution: {integrity: sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA==}
|
||||||
|
|
||||||
@@ -4647,9 +4820,21 @@ packages:
|
|||||||
sisteransi@1.0.5:
|
sisteransi@1.0.5:
|
||||||
resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
|
resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
|
||||||
|
|
||||||
|
slate-history@0.66.0:
|
||||||
|
resolution: {integrity: sha512-6MWpxGQZiMvSINlCbMW43E2YBSVMCMCIwQfBzGssjWw4kb0qfvj0pIdblWNRQZD0hR6WHP+dHHgGSeVdMWzfng==}
|
||||||
|
peerDependencies:
|
||||||
|
slate: '>=0.65.3'
|
||||||
|
|
||||||
|
slate@0.72.8:
|
||||||
|
resolution: {integrity: sha512-/nJwTswQgnRurpK+bGJFH1oM7naD5qDmHd89JyiKNT2oOKD8marW0QSBtuFnwEbL5aGCS8AmrhXQgNOsn4osAw==}
|
||||||
|
|
||||||
slice-source@0.4.1:
|
slice-source@0.4.1:
|
||||||
resolution: {integrity: sha512-YiuPbxpCj4hD9Qs06hGAz/OZhQ0eDuALN0lRWJez0eD/RevzKqGdUx1IOMUnXgpr+sXZLq3g8ERwbAH0bCb8vg==}
|
resolution: {integrity: sha512-YiuPbxpCj4hD9Qs06hGAz/OZhQ0eDuALN0lRWJez0eD/RevzKqGdUx1IOMUnXgpr+sXZLq3g8ERwbAH0bCb8vg==}
|
||||||
|
|
||||||
|
snabbdom@3.6.3:
|
||||||
|
resolution: {integrity: sha512-W2lHLLw2qR2Vv0DcMmcxXqcfdBaIcoN+y/86SmHv8fn4DazEQSH6KN3TjZcWvwujW56OHiiirsbHWZb4vx/0fg==}
|
||||||
|
engines: {node: '>=12.17.0'}
|
||||||
|
|
||||||
snapdragon-node@2.1.1:
|
snapdragon-node@2.1.1:
|
||||||
resolution: {integrity: sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw==}
|
resolution: {integrity: sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
@@ -4697,6 +4882,9 @@ packages:
|
|||||||
resolution: {integrity: sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==}
|
resolution: {integrity: sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==}
|
||||||
engines: {node: '>=0.8'}
|
engines: {node: '>=0.8'}
|
||||||
|
|
||||||
|
ssr-window@3.0.0:
|
||||||
|
resolution: {integrity: sha512-q+8UfWDg9Itrg0yWK7oe5p/XRCJpJF9OBtXfOPgSJl+u3Xd5KI328RUEvUqSMVM9CiQUEf1QdBzJMkYGErj9QA==}
|
||||||
|
|
||||||
stable-hash-x@0.2.0:
|
stable-hash-x@0.2.0:
|
||||||
resolution: {integrity: sha512-o3yWv49B/o4QZk5ZcsALc6t0+eCelPc44zZsLtCQnZPDwFpDYSWcDnrv2TtMmMbQ7uKo3J0HTURCqckw23czNQ==}
|
resolution: {integrity: sha512-o3yWv49B/o4QZk5ZcsALc6t0+eCelPc44zZsLtCQnZPDwFpDYSWcDnrv2TtMmMbQ7uKo3J0HTURCqckw23czNQ==}
|
||||||
engines: {node: '>=12.0.0'}
|
engines: {node: '>=12.0.0'}
|
||||||
@@ -4859,6 +5047,9 @@ packages:
|
|||||||
tiny-invariant@1.3.3:
|
tiny-invariant@1.3.3:
|
||||||
resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
|
resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
|
||||||
|
|
||||||
|
tiny-warning@1.0.3:
|
||||||
|
resolution: {integrity: sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==}
|
||||||
|
|
||||||
tinyexec@1.0.4:
|
tinyexec@1.0.4:
|
||||||
resolution: {integrity: sha512-u9r3uZC0bdpGOXtlxUIdwf9pkmvhqJdrVCH9fapQtgy/OeTTMZ1nqH7agtvEfmGui6e1XxjcdrlxvxJvc3sMqw==}
|
resolution: {integrity: sha512-u9r3uZC0bdpGOXtlxUIdwf9pkmvhqJdrVCH9fapQtgy/OeTTMZ1nqH7agtvEfmGui6e1XxjcdrlxvxJvc3sMqw==}
|
||||||
engines: {node: '>=18'}
|
engines: {node: '>=18'}
|
||||||
@@ -5231,9 +5422,6 @@ packages:
|
|||||||
typescript:
|
typescript:
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
wangeditor@4.7.15:
|
|
||||||
resolution: {integrity: sha512-aPTdREd8BxXVyJ5MI+LU83FQ7u1EPd341iXIorRNYSOvoimNoZ4nPg+yn3FGbB93/owEa6buLw8wdhYnMCJQLg==}
|
|
||||||
|
|
||||||
watchpack@2.5.1:
|
watchpack@2.5.1:
|
||||||
resolution: {integrity: sha512-Zn5uXdcFNIA1+1Ei5McRd+iRzfhENPCe7LeABkJtNulSxjma+l7ltNx55BWZkRlwRnpOgHqxnjyaDgJnNXnqzg==}
|
resolution: {integrity: sha512-Zn5uXdcFNIA1+1Ei5McRd+iRzfhENPCe7LeABkJtNulSxjma+l7ltNx55BWZkRlwRnpOgHqxnjyaDgJnNXnqzg==}
|
||||||
engines: {node: '>=10.13.0'}
|
engines: {node: '>=10.13.0'}
|
||||||
@@ -5276,6 +5464,9 @@ packages:
|
|||||||
engines: {node: '>= 8'}
|
engines: {node: '>= 8'}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
|
wildcard@1.1.2:
|
||||||
|
resolution: {integrity: sha512-DXukZJxpHA8LuotRwL0pP1+rS6CS7FF2qStDDE1C7DDg2rLud2PXRMuEDYIPhgEezwnlHNL4c+N6MfMTjCGTng==}
|
||||||
|
|
||||||
wmf@1.0.2:
|
wmf@1.0.2:
|
||||||
resolution: {integrity: sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==}
|
resolution: {integrity: sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==}
|
||||||
engines: {node: '>=0.8'}
|
engines: {node: '>=0.8'}
|
||||||
@@ -5742,10 +5933,6 @@ snapshots:
|
|||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- supports-color
|
- supports-color
|
||||||
|
|
||||||
'@babel/runtime-corejs3@7.29.2':
|
|
||||||
dependencies:
|
|
||||||
core-js-pure: 3.49.0
|
|
||||||
|
|
||||||
'@babel/runtime@7.29.2': {}
|
'@babel/runtime@7.29.2': {}
|
||||||
|
|
||||||
'@babel/template@7.28.6':
|
'@babel/template@7.28.6':
|
||||||
@@ -5997,6 +6184,17 @@ snapshots:
|
|||||||
|
|
||||||
'@humanwhocodes/retry@0.4.3': {}
|
'@humanwhocodes/retry@0.4.3': {}
|
||||||
|
|
||||||
|
'@iconify-vue/mingcute@1.0.5(vue@3.5.20(typescript@5.8.3))':
|
||||||
|
dependencies:
|
||||||
|
'@iconify/css-vue': 1.0.2(vue@3.5.20(typescript@5.8.3))
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- vue
|
||||||
|
|
||||||
|
'@iconify/css-vue@1.0.2(vue@3.5.20(typescript@5.8.3))':
|
||||||
|
dependencies:
|
||||||
|
'@iconify/types': 2.0.0
|
||||||
|
vue: 3.5.20(typescript@5.8.3)
|
||||||
|
|
||||||
'@iconify/json@2.2.380':
|
'@iconify/json@2.2.380':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@iconify/types': 2.0.0
|
'@iconify/types': 2.0.0
|
||||||
@@ -6419,6 +6617,8 @@ snapshots:
|
|||||||
|
|
||||||
'@sxzz/popperjs-es@2.11.8': {}
|
'@sxzz/popperjs-es@2.11.8': {}
|
||||||
|
|
||||||
|
'@transloadit/prettier-bytes@0.0.7': {}
|
||||||
|
|
||||||
'@turf/boolean-clockwise@6.5.0':
|
'@turf/boolean-clockwise@6.5.0':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@turf/helpers': 6.5.0
|
'@turf/helpers': 6.5.0
|
||||||
@@ -6510,10 +6710,6 @@ snapshots:
|
|||||||
|
|
||||||
'@types/d3-timer@3.0.2': {}
|
'@types/d3-timer@3.0.2': {}
|
||||||
|
|
||||||
'@types/dompurify@3.2.0':
|
|
||||||
dependencies:
|
|
||||||
dompurify: 3.2.6
|
|
||||||
|
|
||||||
'@types/eslint-scope@3.7.7':
|
'@types/eslint-scope@3.7.7':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@types/eslint': 9.6.1
|
'@types/eslint': 9.6.1
|
||||||
@@ -6526,6 +6722,8 @@ snapshots:
|
|||||||
|
|
||||||
'@types/estree@1.0.8': {}
|
'@types/estree@1.0.8': {}
|
||||||
|
|
||||||
|
'@types/event-emitter@0.3.5': {}
|
||||||
|
|
||||||
'@types/geojson@7946.0.16': {}
|
'@types/geojson@7946.0.16': {}
|
||||||
|
|
||||||
'@types/json-schema@7.0.15': {}
|
'@types/json-schema@7.0.15': {}
|
||||||
@@ -6855,6 +7053,35 @@ snapshots:
|
|||||||
'@unrs/resolver-binding-win32-x64-msvc@1.11.1':
|
'@unrs/resolver-binding-win32-x64-msvc@1.11.1':
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
|
'@uppy/companion-client@2.2.2':
|
||||||
|
dependencies:
|
||||||
|
'@uppy/utils': 4.1.3
|
||||||
|
namespace-emitter: 2.0.1
|
||||||
|
|
||||||
|
'@uppy/core@2.3.4':
|
||||||
|
dependencies:
|
||||||
|
'@transloadit/prettier-bytes': 0.0.7
|
||||||
|
'@uppy/store-default': 2.1.1
|
||||||
|
'@uppy/utils': 4.1.3
|
||||||
|
lodash.throttle: 4.1.1
|
||||||
|
mime-match: 1.0.2
|
||||||
|
namespace-emitter: 2.0.1
|
||||||
|
nanoid: 3.3.11
|
||||||
|
preact: 10.29.1
|
||||||
|
|
||||||
|
'@uppy/store-default@2.1.1': {}
|
||||||
|
|
||||||
|
'@uppy/utils@4.1.3':
|
||||||
|
dependencies:
|
||||||
|
lodash.throttle: 4.1.1
|
||||||
|
|
||||||
|
'@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4)':
|
||||||
|
dependencies:
|
||||||
|
'@uppy/companion-client': 2.2.2
|
||||||
|
'@uppy/core': 2.3.4
|
||||||
|
'@uppy/utils': 4.1.3
|
||||||
|
nanoid: 3.3.11
|
||||||
|
|
||||||
'@visactor/vchart-theme@1.12.2(@visactor/vchart@2.0.4)':
|
'@visactor/vchart-theme@1.12.2(@visactor/vchart@2.0.4)':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@visactor/vchart': 2.0.4
|
'@visactor/vchart': 2.0.4
|
||||||
@@ -7284,6 +7511,114 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
vue: 3.5.20(typescript@5.8.3)
|
vue: 3.5.20(typescript@5.8.3)
|
||||||
|
|
||||||
|
'@wangeditor/basic-modules@1.1.7(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
is-url: 1.2.4
|
||||||
|
lodash.throttle: 4.1.1
|
||||||
|
nanoid: 3.3.11
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/code-highlight@1.0.3(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
prismjs: 1.30.0
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@types/event-emitter': 0.3.5
|
||||||
|
'@uppy/core': 2.3.4
|
||||||
|
'@uppy/xhr-upload': 2.1.3(@uppy/core@2.3.4)
|
||||||
|
dom7: 3.0.0
|
||||||
|
event-emitter: 0.3.5
|
||||||
|
html-void-elements: 2.0.1
|
||||||
|
i18next: 20.6.1
|
||||||
|
is-hotkey: 0.2.0
|
||||||
|
lodash.camelcase: 4.3.0
|
||||||
|
lodash.clonedeep: 4.5.0
|
||||||
|
lodash.debounce: 4.0.8
|
||||||
|
lodash.foreach: 4.5.0
|
||||||
|
lodash.isequal: 4.5.0
|
||||||
|
lodash.throttle: 4.1.1
|
||||||
|
lodash.toarray: 4.4.0
|
||||||
|
nanoid: 3.3.11
|
||||||
|
scroll-into-view-if-needed: 2.2.31
|
||||||
|
slate: 0.72.8
|
||||||
|
slate-history: 0.66.0(slate@0.72.8)
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/editor-for-vue@5.1.12(@wangeditor/editor@5.1.23)(vue@3.5.20(typescript@5.8.3))':
|
||||||
|
dependencies:
|
||||||
|
'@wangeditor/editor': 5.1.23
|
||||||
|
vue: 3.5.20(typescript@5.8.3)
|
||||||
|
|
||||||
|
'@wangeditor/editor@5.1.23':
|
||||||
|
dependencies:
|
||||||
|
'@uppy/core': 2.3.4
|
||||||
|
'@uppy/xhr-upload': 2.1.3(@uppy/core@2.3.4)
|
||||||
|
'@wangeditor/basic-modules': 1.1.7(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/code-highlight': 1.0.3(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/list-module': 1.0.5(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/table-module': 1.1.4(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/upload-image-module': 1.0.2(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(@wangeditor/basic-modules@1.1.7(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.foreach@4.5.0)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/video-module': 1.1.4(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
is-hotkey: 0.2.0
|
||||||
|
lodash.camelcase: 4.3.0
|
||||||
|
lodash.clonedeep: 4.5.0
|
||||||
|
lodash.debounce: 4.0.8
|
||||||
|
lodash.foreach: 4.5.0
|
||||||
|
lodash.isequal: 4.5.0
|
||||||
|
lodash.throttle: 4.1.1
|
||||||
|
lodash.toarray: 4.4.0
|
||||||
|
nanoid: 3.3.11
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/list-module@1.0.5(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/table-module@1.1.4(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
lodash.isequal: 4.5.0
|
||||||
|
lodash.throttle: 4.1.1
|
||||||
|
nanoid: 3.3.11
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/upload-image-module@1.0.2(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(@wangeditor/basic-modules@1.1.7(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.foreach@4.5.0)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@uppy/core': 2.3.4
|
||||||
|
'@uppy/xhr-upload': 2.1.3(@uppy/core@2.3.4)
|
||||||
|
'@wangeditor/basic-modules': 1.1.7(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(lodash.throttle@4.1.1)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
lodash.foreach: 4.5.0
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
|
'@wangeditor/video-module@1.1.4(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(@wangeditor/core@1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3))(dom7@3.0.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)':
|
||||||
|
dependencies:
|
||||||
|
'@uppy/core': 2.3.4
|
||||||
|
'@uppy/xhr-upload': 2.1.3(@uppy/core@2.3.4)
|
||||||
|
'@wangeditor/core': 1.1.19(@uppy/core@2.3.4)(@uppy/xhr-upload@2.1.3(@uppy/core@2.3.4))(dom7@3.0.0)(is-hotkey@0.2.0)(lodash.camelcase@4.3.0)(lodash.clonedeep@4.5.0)(lodash.debounce@4.0.8)(lodash.foreach@4.5.0)(lodash.isequal@4.5.0)(lodash.throttle@4.1.1)(lodash.toarray@4.4.0)(nanoid@3.3.11)(slate@0.72.8)(snabbdom@3.6.3)
|
||||||
|
dom7: 3.0.0
|
||||||
|
nanoid: 3.3.11
|
||||||
|
slate: 0.72.8
|
||||||
|
snabbdom: 3.6.3
|
||||||
|
|
||||||
'@webassemblyjs/ast@1.14.1':
|
'@webassemblyjs/ast@1.14.1':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@webassemblyjs/helper-numbers': 1.13.2
|
'@webassemblyjs/helper-numbers': 1.13.2
|
||||||
@@ -7741,6 +8076,8 @@ snapshots:
|
|||||||
|
|
||||||
component-emitter@1.3.1: {}
|
component-emitter@1.3.1: {}
|
||||||
|
|
||||||
|
compute-scroll-into-view@1.0.20: {}
|
||||||
|
|
||||||
concat-map@0.0.1: {}
|
concat-map@0.0.1: {}
|
||||||
|
|
||||||
concat-stream@1.4.11:
|
concat-stream@1.4.11:
|
||||||
@@ -7778,8 +8115,6 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
browserslist: 4.28.1
|
browserslist: 4.28.1
|
||||||
|
|
||||||
core-js-pure@3.49.0: {}
|
|
||||||
|
|
||||||
core-js@3.49.0: {}
|
core-js@3.49.0: {}
|
||||||
|
|
||||||
core-util-is@1.0.3: {}
|
core-util-is@1.0.3: {}
|
||||||
@@ -8093,6 +8428,10 @@ snapshots:
|
|||||||
domhandler: 4.3.1
|
domhandler: 4.3.1
|
||||||
entities: 2.2.0
|
entities: 2.2.0
|
||||||
|
|
||||||
|
dom7@3.0.0:
|
||||||
|
dependencies:
|
||||||
|
ssr-window: 3.0.0
|
||||||
|
|
||||||
domelementtype@1.3.1: {}
|
domelementtype@1.3.1: {}
|
||||||
|
|
||||||
domelementtype@2.3.0: {}
|
domelementtype@2.3.0: {}
|
||||||
@@ -8895,6 +9234,8 @@ snapshots:
|
|||||||
|
|
||||||
hookable@5.5.3: {}
|
hookable@5.5.3: {}
|
||||||
|
|
||||||
|
html-void-elements@2.0.1: {}
|
||||||
|
|
||||||
html2canvas@1.4.1:
|
html2canvas@1.4.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
css-line-break: 2.1.0
|
css-line-break: 2.1.0
|
||||||
@@ -8911,6 +9252,10 @@ snapshots:
|
|||||||
|
|
||||||
human-signals@8.0.1: {}
|
human-signals@8.0.1: {}
|
||||||
|
|
||||||
|
i18next@20.6.1:
|
||||||
|
dependencies:
|
||||||
|
'@babel/runtime': 7.29.2
|
||||||
|
|
||||||
iconv-lite@0.4.24:
|
iconv-lite@0.4.24:
|
||||||
dependencies:
|
dependencies:
|
||||||
safer-buffer: 2.1.2
|
safer-buffer: 2.1.2
|
||||||
@@ -8935,6 +9280,8 @@ snapshots:
|
|||||||
|
|
||||||
immediate@3.0.6: {}
|
immediate@3.0.6: {}
|
||||||
|
|
||||||
|
immer@9.0.21: {}
|
||||||
|
|
||||||
immutable@5.1.5: {}
|
immutable@5.1.5: {}
|
||||||
|
|
||||||
import-fresh@3.3.1:
|
import-fresh@3.3.1:
|
||||||
@@ -9052,6 +9399,8 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
is-extglob: 2.1.1
|
is-extglob: 2.1.1
|
||||||
|
|
||||||
|
is-hotkey@0.2.0: {}
|
||||||
|
|
||||||
is-inside-container@1.0.0:
|
is-inside-container@1.0.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
is-docker: 3.0.0
|
is-docker: 3.0.0
|
||||||
@@ -9079,6 +9428,8 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
isobject: 3.0.1
|
isobject: 3.0.1
|
||||||
|
|
||||||
|
is-plain-object@5.0.0: {}
|
||||||
|
|
||||||
is-regex@1.2.1:
|
is-regex@1.2.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
call-bound: 1.0.4
|
call-bound: 1.0.4
|
||||||
@@ -9115,6 +9466,8 @@ snapshots:
|
|||||||
|
|
||||||
is-unicode-supported@2.1.0: {}
|
is-unicode-supported@2.1.0: {}
|
||||||
|
|
||||||
|
is-url@1.2.4: {}
|
||||||
|
|
||||||
is-weakmap@2.0.2: {}
|
is-weakmap@2.0.2: {}
|
||||||
|
|
||||||
is-weakref@1.1.1:
|
is-weakref@1.1.1:
|
||||||
@@ -9281,8 +9634,22 @@ snapshots:
|
|||||||
lodash: 4.17.23
|
lodash: 4.17.23
|
||||||
lodash-es: 4.17.23
|
lodash-es: 4.17.23
|
||||||
|
|
||||||
|
lodash.camelcase@4.3.0: {}
|
||||||
|
|
||||||
|
lodash.clonedeep@4.5.0: {}
|
||||||
|
|
||||||
|
lodash.debounce@4.0.8: {}
|
||||||
|
|
||||||
|
lodash.foreach@4.5.0: {}
|
||||||
|
|
||||||
|
lodash.isequal@4.5.0: {}
|
||||||
|
|
||||||
lodash.merge@4.6.2: {}
|
lodash.merge@4.6.2: {}
|
||||||
|
|
||||||
|
lodash.throttle@4.1.1: {}
|
||||||
|
|
||||||
|
lodash.toarray@4.4.0: {}
|
||||||
|
|
||||||
lodash@4.17.21: {}
|
lodash@4.17.21: {}
|
||||||
|
|
||||||
lodash@4.17.23: {}
|
lodash@4.17.23: {}
|
||||||
@@ -9363,6 +9730,10 @@ snapshots:
|
|||||||
|
|
||||||
mime-db@1.52.0: {}
|
mime-db@1.52.0: {}
|
||||||
|
|
||||||
|
mime-match@1.0.2:
|
||||||
|
dependencies:
|
||||||
|
wildcard: 1.1.2
|
||||||
|
|
||||||
mime-types@2.1.35:
|
mime-types@2.1.35:
|
||||||
dependencies:
|
dependencies:
|
||||||
mime-db: 1.52.0
|
mime-db: 1.52.0
|
||||||
@@ -9430,6 +9801,8 @@ snapshots:
|
|||||||
|
|
||||||
muggle-string@0.4.1: {}
|
muggle-string@0.4.1: {}
|
||||||
|
|
||||||
|
namespace-emitter@2.0.1: {}
|
||||||
|
|
||||||
nanoid@3.3.11: {}
|
nanoid@3.3.11: {}
|
||||||
|
|
||||||
nanoid@5.1.5: {}
|
nanoid@5.1.5: {}
|
||||||
@@ -9738,6 +10111,8 @@ snapshots:
|
|||||||
posthtml-parser: 0.2.1
|
posthtml-parser: 0.2.1
|
||||||
posthtml-render: 1.4.0
|
posthtml-render: 1.4.0
|
||||||
|
|
||||||
|
preact@10.29.1: {}
|
||||||
|
|
||||||
prelude-ls@1.2.1: {}
|
prelude-ls@1.2.1: {}
|
||||||
|
|
||||||
prettier-linter-helpers@1.0.1:
|
prettier-linter-helpers@1.0.1:
|
||||||
@@ -9758,6 +10133,8 @@ snapshots:
|
|||||||
|
|
||||||
print-js@1.6.0: {}
|
print-js@1.6.0: {}
|
||||||
|
|
||||||
|
prismjs@1.30.0: {}
|
||||||
|
|
||||||
progress@2.0.3: {}
|
progress@2.0.3: {}
|
||||||
|
|
||||||
prompts@2.4.2:
|
prompts@2.4.2:
|
||||||
@@ -9973,6 +10350,10 @@ snapshots:
|
|||||||
ajv-formats: 2.1.1(ajv@8.18.0)
|
ajv-formats: 2.1.1(ajv@8.18.0)
|
||||||
ajv-keywords: 5.1.0(ajv@8.18.0)
|
ajv-keywords: 5.1.0(ajv@8.18.0)
|
||||||
|
|
||||||
|
scroll-into-view-if-needed@2.2.31:
|
||||||
|
dependencies:
|
||||||
|
compute-scroll-into-view: 1.0.20
|
||||||
|
|
||||||
select@1.1.2: {}
|
select@1.1.2: {}
|
||||||
|
|
||||||
semver@6.3.1: {}
|
semver@6.3.1: {}
|
||||||
@@ -10094,8 +10475,21 @@ snapshots:
|
|||||||
|
|
||||||
sisteransi@1.0.5: {}
|
sisteransi@1.0.5: {}
|
||||||
|
|
||||||
|
slate-history@0.66.0(slate@0.72.8):
|
||||||
|
dependencies:
|
||||||
|
is-plain-object: 5.0.0
|
||||||
|
slate: 0.72.8
|
||||||
|
|
||||||
|
slate@0.72.8:
|
||||||
|
dependencies:
|
||||||
|
immer: 9.0.21
|
||||||
|
is-plain-object: 5.0.0
|
||||||
|
tiny-warning: 1.0.3
|
||||||
|
|
||||||
slice-source@0.4.1: {}
|
slice-source@0.4.1: {}
|
||||||
|
|
||||||
|
snabbdom@3.6.3: {}
|
||||||
|
|
||||||
snapdragon-node@2.1.1:
|
snapdragon-node@2.1.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
define-property: 1.0.0
|
define-property: 1.0.0
|
||||||
@@ -10150,6 +10544,8 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
frac: 1.1.2
|
frac: 1.1.2
|
||||||
|
|
||||||
|
ssr-window@3.0.0: {}
|
||||||
|
|
||||||
stable-hash-x@0.2.0: {}
|
stable-hash-x@0.2.0: {}
|
||||||
|
|
||||||
stable@0.1.8: {}
|
stable@0.1.8: {}
|
||||||
@@ -10320,6 +10716,8 @@ snapshots:
|
|||||||
|
|
||||||
tiny-invariant@1.3.3: {}
|
tiny-invariant@1.3.3: {}
|
||||||
|
|
||||||
|
tiny-warning@1.0.3: {}
|
||||||
|
|
||||||
tinyexec@1.0.4: {}
|
tinyexec@1.0.4: {}
|
||||||
|
|
||||||
tinyglobby@0.2.15:
|
tinyglobby@0.2.15:
|
||||||
@@ -10753,12 +11151,6 @@ snapshots:
|
|||||||
optionalDependencies:
|
optionalDependencies:
|
||||||
typescript: 5.8.3
|
typescript: 5.8.3
|
||||||
|
|
||||||
wangeditor@4.7.15:
|
|
||||||
dependencies:
|
|
||||||
'@babel/runtime': 7.29.2
|
|
||||||
'@babel/runtime-corejs3': 7.29.2
|
|
||||||
tslib: 2.8.1
|
|
||||||
|
|
||||||
watchpack@2.5.1:
|
watchpack@2.5.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
glob-to-regexp: 0.4.1
|
glob-to-regexp: 0.4.1
|
||||||
@@ -10845,6 +11237,8 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
isexe: 2.0.0
|
isexe: 2.0.0
|
||||||
|
|
||||||
|
wildcard@1.1.2: {}
|
||||||
|
|
||||||
wmf@1.0.2: {}
|
wmf@1.0.2: {}
|
||||||
|
|
||||||
wolfy87-eventemitter@5.2.9: {}
|
wolfy87-eventemitter@5.2.9: {}
|
||||||
|
|||||||
718
src/components/custom/business-attachment-uploader.vue
Normal file
718
src/components/custom/business-attachment-uploader.vue
Normal file
@@ -0,0 +1,718 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, onBeforeUnmount, reactive, ref } from 'vue';
|
||||||
|
import { ArrowDown, Delete, Document, Loading, Picture, QuestionFilled, Upload } from '@element-plus/icons-vue';
|
||||||
|
import { deleteFile, downloadFile, uploadFile } from '@/service/api/file';
|
||||||
|
|
||||||
|
defineOptions({ name: 'BusinessAttachmentUploader' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
/** 上传目录,传给后端 directory 字段 */
|
||||||
|
directory?: string;
|
||||||
|
/** 数量上限,默认 20(与后端 AttachmentValidator 一致) */
|
||||||
|
max?: number;
|
||||||
|
/** 单文件大小上限 MB(前端兜底;最终由 /system/file/upload 拦截) */
|
||||||
|
maxFileSizeMB?: number;
|
||||||
|
disabled?: boolean;
|
||||||
|
/**
|
||||||
|
* 平铺模式:所有附件直接逐项渲染,不再做"首项 + 折叠浮层"。
|
||||||
|
* 用于本身已经在 popover / 详情卡片里展示,避免嵌套浮层。
|
||||||
|
*/
|
||||||
|
flat?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
directory: undefined,
|
||||||
|
max: 20,
|
||||||
|
maxFileSizeMB: 50,
|
||||||
|
disabled: false,
|
||||||
|
flat: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const model = defineModel<Api.Project.AttachmentItem[]>({ default: () => [] });
|
||||||
|
|
||||||
|
/** 给用户看的简短分类(hint 行展示) */
|
||||||
|
const ALLOWED_EXTENSIONS_HINT = '支持 PDF、Word、Excel、PPT、TXT/MD/CSV、图片、ZIP/RAR/7Z、MP3/MP4';
|
||||||
|
|
||||||
|
// 与后端 AttachmentValidator 白/黑名单保持一致(5.16)
|
||||||
|
const ALLOWED_EXTENSIONS = new Set([
|
||||||
|
'pdf',
|
||||||
|
'doc',
|
||||||
|
'docx',
|
||||||
|
'xls',
|
||||||
|
'xlsx',
|
||||||
|
'ppt',
|
||||||
|
'pptx',
|
||||||
|
'txt',
|
||||||
|
'md',
|
||||||
|
'csv',
|
||||||
|
'jpg',
|
||||||
|
'jpeg',
|
||||||
|
'png',
|
||||||
|
'gif',
|
||||||
|
'webp',
|
||||||
|
'bmp',
|
||||||
|
'zip',
|
||||||
|
'rar',
|
||||||
|
'7z',
|
||||||
|
'mp4',
|
||||||
|
'mp3'
|
||||||
|
]);
|
||||||
|
|
||||||
|
const FORBIDDEN_EXTENSIONS = new Set([
|
||||||
|
'exe',
|
||||||
|
'bat',
|
||||||
|
'cmd',
|
||||||
|
'sh',
|
||||||
|
'ps1',
|
||||||
|
'msi',
|
||||||
|
'dll',
|
||||||
|
'jar',
|
||||||
|
'war',
|
||||||
|
'php',
|
||||||
|
'jsp',
|
||||||
|
'asp',
|
||||||
|
'aspx',
|
||||||
|
'py',
|
||||||
|
'rb',
|
||||||
|
'pl',
|
||||||
|
'com',
|
||||||
|
'scr',
|
||||||
|
'vbs',
|
||||||
|
'js'
|
||||||
|
]);
|
||||||
|
|
||||||
|
interface PendingItem {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const pending = ref<PendingItem[]>([]);
|
||||||
|
const inputRef = ref<HTMLInputElement>();
|
||||||
|
const isUnmounting = ref(false);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 会话级清理账本:
|
||||||
|
* - originalIds: 弹层打开时已存在的 fileId(编辑模式下来自 rowData.attachments)。
|
||||||
|
* 当前未在 commit/rollback 中直接读取(清理逻辑靠 addedIds 自己判定);
|
||||||
|
* 保留是为了让会话模型完整、便于后续扩展(如"撤销删除""仅删原有附件"等差异行为)。
|
||||||
|
* - addedIds: 本次会话内上传成功的 fileId
|
||||||
|
* - pendingDeleteIds: 用户在 UI 上点过"删除"的 fileId(含 original 和 added 两类)
|
||||||
|
* - committed: commit() 调用后置 true,阻止后续 rollback 误删
|
||||||
|
*
|
||||||
|
* UI 显示 = model(已减去 pendingDelete 项)
|
||||||
|
* 真删时机:commit() 删 pendingDelete;rollback() 删 addedIds(除非 committed)
|
||||||
|
*/
|
||||||
|
interface UploadSession {
|
||||||
|
originalIds: Set<string>;
|
||||||
|
addedIds: Set<string>;
|
||||||
|
pendingDeleteIds: Set<string>;
|
||||||
|
committed: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const session = reactive<UploadSession>({
|
||||||
|
originalIds: new Set<string>(),
|
||||||
|
addedIds: new Set<string>(),
|
||||||
|
pendingDeleteIds: new Set<string>(),
|
||||||
|
committed: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const totalCount = computed(() => model.value.length + pending.value.length);
|
||||||
|
const isFull = computed(() => totalCount.value >= props.max);
|
||||||
|
const hasUploading = computed(() => pending.value.length > 0);
|
||||||
|
|
||||||
|
const acceptExtensionsList = computed(() => Array.from(ALLOWED_EXTENSIONS).join(', '));
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 列表区拆成"直接展示"和"折叠浮层"两组:
|
||||||
|
* - flat:全部直接展示(适合本身已在 popover 里)
|
||||||
|
* - 默认:首项直接展示,>1 时其余进入悬浮浮层
|
||||||
|
*/
|
||||||
|
const displayedAttachments = computed(() => (props.flat ? model.value : model.value.slice(0, 1)));
|
||||||
|
const popoverAttachments = computed(() => (props.flat || model.value.length <= 1 ? [] : model.value.slice(1)));
|
||||||
|
|
||||||
|
const IMAGE_EXTENSIONS = new Set(['jpg', 'jpeg', 'png', 'gif', 'webp', 'bmp', 'svg']);
|
||||||
|
|
||||||
|
function isImage(item: Api.Project.AttachmentItem) {
|
||||||
|
if (item.contentType?.startsWith('image/')) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return IMAGE_EXTENSIONS.has(getExtension(item.name));
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ImagePreviewState {
|
||||||
|
visible: boolean;
|
||||||
|
urls: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const imagePreview = reactive<ImagePreviewState>({
|
||||||
|
visible: false,
|
||||||
|
urls: []
|
||||||
|
});
|
||||||
|
|
||||||
|
function getExtension(name: string) {
|
||||||
|
const idx = name.lastIndexOf('.');
|
||||||
|
return idx > 0 ? name.slice(idx + 1).toLowerCase() : '';
|
||||||
|
}
|
||||||
|
|
||||||
|
function validateFile(file: File): string | null {
|
||||||
|
if (!file.name) {
|
||||||
|
return '文件名为空';
|
||||||
|
}
|
||||||
|
if (file.name.length > 255) {
|
||||||
|
return '文件名超过 255 字符';
|
||||||
|
}
|
||||||
|
|
||||||
|
const ext = getExtension(file.name);
|
||||||
|
if (!ext) {
|
||||||
|
return '文件缺少扩展名';
|
||||||
|
}
|
||||||
|
if (FORBIDDEN_EXTENSIONS.has(ext)) {
|
||||||
|
return `不允许上传 .${ext} 文件`;
|
||||||
|
}
|
||||||
|
if (!ALLOWED_EXTENSIONS.has(ext)) {
|
||||||
|
return `暂不支持 .${ext} 文件`;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (file.size > props.maxFileSizeMB * 1024 * 1024) {
|
||||||
|
return `单文件不能超过 ${props.maxFileSizeMB}MB`;
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function triggerSelect() {
|
||||||
|
if (props.disabled || isFull.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
inputRef.value?.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleFileChange(event: Event) {
|
||||||
|
const input = event.target as HTMLInputElement;
|
||||||
|
const files = Array.from(input.files || []);
|
||||||
|
input.value = '';
|
||||||
|
|
||||||
|
if (files.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const remaining = props.max - totalCount.value;
|
||||||
|
if (files.length > remaining) {
|
||||||
|
window.$message?.warning(`最多还能上传 ${remaining} 个附件`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const validFiles: File[] = [];
|
||||||
|
files.forEach(file => {
|
||||||
|
const err = validateFile(file);
|
||||||
|
if (err) {
|
||||||
|
window.$message?.error(`${file.name}:${err}`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
validFiles.push(file);
|
||||||
|
});
|
||||||
|
|
||||||
|
if (validFiles.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await Promise.all(validFiles.map(uploadOne));
|
||||||
|
}
|
||||||
|
|
||||||
|
async function uploadOne(file: File) {
|
||||||
|
const tempId = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
|
||||||
|
pending.value = [...pending.value, { id: tempId, name: file.name }];
|
||||||
|
|
||||||
|
try {
|
||||||
|
const result = await uploadFile(file, props.directory);
|
||||||
|
if (result.error || !result.data) {
|
||||||
|
window.$message?.error(`${file.name}:上传失败`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { id, url } = result.data;
|
||||||
|
|
||||||
|
// 组件已卸载(用户上传过程中关弹层):onBeforeUnmount 已跑过且看不到这个 id,
|
||||||
|
// 这里立刻调删除,避免孤儿文件
|
||||||
|
if (isUnmounting.value) {
|
||||||
|
deleteFile(id).catch(() => {
|
||||||
|
// 已卸载场景下 console.warn 也访问不到 component scope,这里静默吞掉
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
model.value = [
|
||||||
|
...model.value,
|
||||||
|
{
|
||||||
|
fileId: id,
|
||||||
|
url,
|
||||||
|
name: file.name,
|
||||||
|
size: file.size,
|
||||||
|
contentType: file.type || undefined
|
||||||
|
}
|
||||||
|
];
|
||||||
|
session.addedIds.add(id);
|
||||||
|
} finally {
|
||||||
|
pending.value = pending.value.filter(item => item.id !== tempId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleRemove(item: Api.Project.AttachmentItem) {
|
||||||
|
removeAttachmentByFileId(item.fileId);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function fetchAsBlobUrl(item: Api.Project.AttachmentItem) {
|
||||||
|
const { data, error } = await downloadFile(item.fileId);
|
||||||
|
if (error || !data) {
|
||||||
|
window.$message?.error(`${item.name}:加载失败`);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return URL.createObjectURL(data);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleDownload(item: Api.Project.AttachmentItem) {
|
||||||
|
const blobUrl = await fetchAsBlobUrl(item);
|
||||||
|
if (!blobUrl) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = blobUrl;
|
||||||
|
link.download = item.name;
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click();
|
||||||
|
document.body.removeChild(link);
|
||||||
|
URL.revokeObjectURL(blobUrl);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handlePreviewImage(item: Api.Project.AttachmentItem) {
|
||||||
|
const blobUrl = await fetchAsBlobUrl(item);
|
||||||
|
if (!blobUrl) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
imagePreview.urls = [blobUrl];
|
||||||
|
imagePreview.visible = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleClosePreview() {
|
||||||
|
imagePreview.urls.forEach(url => URL.revokeObjectURL(url));
|
||||||
|
imagePreview.urls = [];
|
||||||
|
imagePreview.visible = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 文件名点击的统一入口:图片走预览,其余走下载 */
|
||||||
|
function handleOpen(item: Api.Project.AttachmentItem) {
|
||||||
|
if (isImage(item)) {
|
||||||
|
handlePreviewImage(item);
|
||||||
|
} else {
|
||||||
|
handleDownload(item);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 把 model 里的某项移除(折叠浮层里也用,不依赖索引) */
|
||||||
|
function removeAttachmentByFileId(fileId: string) {
|
||||||
|
if (props.disabled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const idx = model.value.findIndex(item => item.fileId === fileId);
|
||||||
|
if (idx === -1) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
session.pendingDeleteIds.add(fileId);
|
||||||
|
model.value = model.value.filter((_, i) => i !== idx);
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatSize(size?: number) {
|
||||||
|
if (!size && size !== 0) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
if (size < 1024) {
|
||||||
|
return `${size}B`;
|
||||||
|
}
|
||||||
|
if (size < 1024 * 1024) {
|
||||||
|
return `${(size / 1024).toFixed(1)}KB`;
|
||||||
|
}
|
||||||
|
if (size < 1024 * 1024 * 1024) {
|
||||||
|
return `${(size / 1024 / 1024).toFixed(1)}MB`;
|
||||||
|
}
|
||||||
|
return `${(size / 1024 / 1024 / 1024).toFixed(2)}GB`;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除一批 fileId。fire-and-forget:
|
||||||
|
* - 不阻塞 UI;任何失败仅 console.warn
|
||||||
|
* - 后端返回 1001003001(文件不存在)视为成功
|
||||||
|
*/
|
||||||
|
async function deleteMany(ids: string[]) {
|
||||||
|
if (ids.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
await Promise.allSettled(
|
||||||
|
ids.map(async id => {
|
||||||
|
const { error } = await deleteFile(id);
|
||||||
|
if (error) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.warn('[BusinessAttachmentUploader] 删除失败(已忽略)', id, error);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 等关闭弹层时先等再清理。设上限 5s,避免极端网络下 commit/rollback 永久挂起。 */
|
||||||
|
async function waitForPending(maxWaitMs = 5000) {
|
||||||
|
const start = Date.now();
|
||||||
|
while (pending.value.length > 0) {
|
||||||
|
if (Date.now() - start >= maxWaitMs) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.warn('[BusinessAttachmentUploader] 等待 pending 上传超时,继续后续清理');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// polling: 需要在循环里 await,suppress 即可
|
||||||
|
// eslint-disable-next-line no-await-in-loop
|
||||||
|
await new Promise<void>(resolve => {
|
||||||
|
setTimeout(resolve, 50);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
/**
|
||||||
|
* 父组件在【打开弹层并填充 model 之后】调用。
|
||||||
|
* 把当前 model 视为 original,清空 added / pendingDelete,重置 committed。
|
||||||
|
*/
|
||||||
|
initSession() {
|
||||||
|
session.originalIds = new Set(model.value.map(item => item.fileId));
|
||||||
|
session.addedIds.clear();
|
||||||
|
session.pendingDeleteIds.clear();
|
||||||
|
session.committed = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 父组件在【业务保存成功后】调用。
|
||||||
|
* 真删 pendingDelete(含 original 和 added 两类);置 committed 阻止后续 rollback。
|
||||||
|
*/
|
||||||
|
async commit() {
|
||||||
|
await waitForPending();
|
||||||
|
const ids = Array.from(session.pendingDeleteIds);
|
||||||
|
session.pendingDeleteIds.clear();
|
||||||
|
session.addedIds.clear();
|
||||||
|
session.committed = true;
|
||||||
|
await deleteMany(ids);
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 父组件取消/关闭时调用;onBeforeUnmount 也会兜底调一次。
|
||||||
|
* 真删 addedIds(保留 original);committed=true 时跳过。
|
||||||
|
*/
|
||||||
|
async rollback() {
|
||||||
|
if (session.committed) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
await waitForPending();
|
||||||
|
const ids = Array.from(session.addedIds);
|
||||||
|
session.addedIds.clear();
|
||||||
|
session.pendingDeleteIds.clear();
|
||||||
|
session.committed = true;
|
||||||
|
await deleteMany(ids);
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 父组件在提交前可读此值判断是否还有 pending 上传 */
|
||||||
|
get hasUploading() {
|
||||||
|
return hasUploading.value;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
// 标记卸载中:让正在 flight 的 uploadOne 完成时知道要立刻删除自己
|
||||||
|
isUnmounting.value = true;
|
||||||
|
// 兜底:用户没显式 rollback 就直接关弹层 / 切路由 / unmount
|
||||||
|
// deleteMany 内部已 swallow 单项失败,这里不再 await,fire-and-forget
|
||||||
|
if (!session.committed) {
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||||
|
deleteMany(Array.from(session.addedIds));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="business-attachment-uploader">
|
||||||
|
<div v-if="!disabled" class="business-attachment-uploader__trigger">
|
||||||
|
<ElButton :icon="Upload" :disabled="isFull" :loading="hasUploading" @click="triggerSelect">点击上传</ElButton>
|
||||||
|
<span class="business-attachment-uploader__hint">
|
||||||
|
最多 {{ max }} 个,已选 {{ totalCount }} 个;单文件 ≤ {{ maxFileSizeMB }}MB
|
||||||
|
<ElTooltip placement="top">
|
||||||
|
<template #content>
|
||||||
|
<div class="business-attachment-uploader__hint-tooltip">
|
||||||
|
<div>{{ ALLOWED_EXTENSIONS_HINT }}</div>
|
||||||
|
<div class="business-attachment-uploader__hint-tooltip-ext">允许扩展名:{{ acceptExtensionsList }}</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<ElIcon class="business-attachment-uploader__hint-icon"><QuestionFilled /></ElIcon>
|
||||||
|
</ElTooltip>
|
||||||
|
</span>
|
||||||
|
<input
|
||||||
|
ref="inputRef"
|
||||||
|
type="file"
|
||||||
|
multiple
|
||||||
|
class="business-attachment-uploader__input"
|
||||||
|
@change="handleFileChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-else-if="totalCount === 0" class="business-attachment-uploader__empty">暂无附件</div>
|
||||||
|
|
||||||
|
<ul v-if="totalCount > 0" class="business-attachment-uploader__list">
|
||||||
|
<!-- 直接展示:默认仅首项;flat 模式全部 -->
|
||||||
|
<li v-for="item in displayedAttachments" :key="`done-${item.fileId}`" class="business-attachment-uploader__item">
|
||||||
|
<ElIcon class="business-attachment-uploader__icon">
|
||||||
|
<Picture v-if="isImage(item)" />
|
||||||
|
<Document v-else />
|
||||||
|
</ElIcon>
|
||||||
|
<ElLink
|
||||||
|
type="primary"
|
||||||
|
:underline="false"
|
||||||
|
class="business-attachment-uploader__name"
|
||||||
|
:title="item.name"
|
||||||
|
@click="handleOpen(item)"
|
||||||
|
>
|
||||||
|
{{ item.name }}
|
||||||
|
</ElLink>
|
||||||
|
<span v-if="item.size" class="business-attachment-uploader__size">{{ formatSize(item.size) }}</span>
|
||||||
|
<ElLink type="primary" :underline="false" @click="handleDownload(item)">下载</ElLink>
|
||||||
|
<ElButton v-if="!disabled" link type="danger" :icon="Delete" @click="handleRemove(item)" />
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- 折叠提示:>1 个时显示,hover 弹完整列表(flat 模式下永不出现) -->
|
||||||
|
<li v-if="popoverAttachments.length > 0" class="business-attachment-uploader__more-row">
|
||||||
|
<ElPopover
|
||||||
|
trigger="hover"
|
||||||
|
placement="bottom-start"
|
||||||
|
:width="380"
|
||||||
|
:show-after="200"
|
||||||
|
popper-class="business-attachment-uploader__popover"
|
||||||
|
>
|
||||||
|
<template #reference>
|
||||||
|
<span class="business-attachment-uploader__more">
|
||||||
|
还有 {{ popoverAttachments.length }} 个附件
|
||||||
|
<ElIcon><ArrowDown /></ElIcon>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
<ul class="business-attachment-uploader__popover-list">
|
||||||
|
<li
|
||||||
|
v-for="item in popoverAttachments"
|
||||||
|
:key="`popover-${item.fileId}`"
|
||||||
|
class="business-attachment-uploader__item"
|
||||||
|
>
|
||||||
|
<ElIcon class="business-attachment-uploader__icon">
|
||||||
|
<Picture v-if="isImage(item)" />
|
||||||
|
<Document v-else />
|
||||||
|
</ElIcon>
|
||||||
|
<ElLink
|
||||||
|
type="primary"
|
||||||
|
:underline="false"
|
||||||
|
class="business-attachment-uploader__name"
|
||||||
|
:title="item.name"
|
||||||
|
@click="handleOpen(item)"
|
||||||
|
>
|
||||||
|
{{ item.name }}
|
||||||
|
</ElLink>
|
||||||
|
<span v-if="item.size" class="business-attachment-uploader__size">{{ formatSize(item.size) }}</span>
|
||||||
|
<ElLink type="primary" :underline="false" @click="handleDownload(item)">下载</ElLink>
|
||||||
|
<ElButton v-if="!disabled" link type="danger" :icon="Delete" @click="handleRemove(item)" />
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</ElPopover>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- pending 项不折叠:让用户能持续看到上传进度 -->
|
||||||
|
<li
|
||||||
|
v-for="item in pending"
|
||||||
|
:key="`pending-${item.id}`"
|
||||||
|
class="business-attachment-uploader__item business-attachment-uploader__item--pending"
|
||||||
|
>
|
||||||
|
<ElIcon class="business-attachment-uploader__icon is-loading"><Loading /></ElIcon>
|
||||||
|
<span class="business-attachment-uploader__name" :title="item.name">{{ item.name }}</span>
|
||||||
|
<span class="business-attachment-uploader__status">上传中…</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ElImageViewer
|
||||||
|
v-if="imagePreview.visible"
|
||||||
|
:url-list="imagePreview.urls"
|
||||||
|
hide-on-click-modal
|
||||||
|
@close="handleClosePreview"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.business-attachment-uploader {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__trigger {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__hint {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__hint-icon {
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
cursor: help;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__hint-tooltip {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
max-width: 320px;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__hint-tooltip-ext {
|
||||||
|
word-break: break-all;
|
||||||
|
opacity: 0.85;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__empty {
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__input {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 6px 10px;
|
||||||
|
border: 1px solid var(--el-border-color-lighter);
|
||||||
|
border-radius: 4px;
|
||||||
|
background: var(--el-fill-color-blank);
|
||||||
|
font-size: 13px;
|
||||||
|
|
||||||
|
&--pending {
|
||||||
|
background: var(--el-fill-color-light);
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__icon {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__name {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
min-width: 0;
|
||||||
|
justify-content: flex-start;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__size {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__status {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__more-row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 2px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__more {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 2px;
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
font-size: 13px;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
// 浮层非 scoped:popper 渲染到 body
|
||||||
|
.business-attachment-uploader__popover {
|
||||||
|
padding: 8px 4px !important;
|
||||||
|
|
||||||
|
.business-attachment-uploader__popover-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
max-height: 280px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 6px 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 13px;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--el-fill-color-light);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__icon {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__name {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
min-width: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-attachment-uploader__size {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -49,8 +49,8 @@ const visible = defineModel<boolean>({
|
|||||||
|
|
||||||
const DIALOG_WIDTH_MAP: Record<DialogPreset, string> = {
|
const DIALOG_WIDTH_MAP: Record<DialogPreset, string> = {
|
||||||
sm: '520px',
|
sm: '520px',
|
||||||
md: '640px',
|
md: '720px',
|
||||||
lg: '720px'
|
lg: '960px'
|
||||||
};
|
};
|
||||||
|
|
||||||
const dialogWidth = computed(() => props.width ?? DIALOG_WIDTH_MAP[props.preset]);
|
const dialogWidth = computed(() => props.width ?? DIALOG_WIDTH_MAP[props.preset]);
|
||||||
|
|||||||
461
src/components/custom/business-rich-text-editor.vue
Normal file
461
src/components/custom/business-rich-text-editor.vue
Normal file
@@ -0,0 +1,461 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, onBeforeUnmount, reactive, ref, shallowRef, watch } from 'vue';
|
||||||
|
import '@wangeditor/editor/dist/css/style.css';
|
||||||
|
import { ElImageViewer } from 'element-plus';
|
||||||
|
import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
|
||||||
|
import type { IDomEditor, IEditorConfig, IToolbarConfig } from '@wangeditor/editor';
|
||||||
|
import { buildFileProxyUrl, deleteFile, uploadFile } from '@/service/api/file';
|
||||||
|
|
||||||
|
defineOptions({ name: 'BusinessRichTextEditor' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
placeholder?: string;
|
||||||
|
disabled?: boolean;
|
||||||
|
height?: number | string;
|
||||||
|
/** 上传目录,传给后端 directory 字段 */
|
||||||
|
uploadDirectory?: string;
|
||||||
|
/** 单张图片大小上限(MB),默认 5 */
|
||||||
|
maxImageSizeMB?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
placeholder: '请输入内容',
|
||||||
|
disabled: false,
|
||||||
|
height: 320,
|
||||||
|
uploadDirectory: undefined,
|
||||||
|
maxImageSizeMB: 5
|
||||||
|
});
|
||||||
|
|
||||||
|
const model = defineModel<string | null | undefined>({ default: '' });
|
||||||
|
|
||||||
|
const editorRef = shallowRef<IDomEditor>();
|
||||||
|
const containerRef = ref<HTMLElement>();
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 图片预览:
|
||||||
|
* - hover 富文本里的 <img> → 在图片右上角浮一个放大镜按钮
|
||||||
|
* - 点按钮 → ElImageViewer 多图模式,url-list = 当前 HTML 里所有 img src(按出现顺序去重)
|
||||||
|
* - 编辑态与 disabled 只读态共用
|
||||||
|
*/
|
||||||
|
const zoomBtnVisible = ref(false);
|
||||||
|
const zoomBtnStyle = ref<Record<string, string>>({});
|
||||||
|
const hoveredImageSrc = ref('');
|
||||||
|
|
||||||
|
const viewerVisible = ref(false);
|
||||||
|
const viewerUrlList = ref<string[]>([]);
|
||||||
|
const viewerIndex = ref(0);
|
||||||
|
|
||||||
|
let hideZoomBtnTimer: number | undefined;
|
||||||
|
|
||||||
|
function cancelHideZoomBtn() {
|
||||||
|
if (hideZoomBtnTimer !== undefined) {
|
||||||
|
window.clearTimeout(hideZoomBtnTimer);
|
||||||
|
hideZoomBtnTimer = undefined;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function scheduleHideZoomBtn() {
|
||||||
|
cancelHideZoomBtn();
|
||||||
|
hideZoomBtnTimer = window.setTimeout(() => {
|
||||||
|
zoomBtnVisible.value = false;
|
||||||
|
}, 150);
|
||||||
|
}
|
||||||
|
|
||||||
|
function positionZoomBtn(img: HTMLImageElement) {
|
||||||
|
const container = containerRef.value;
|
||||||
|
if (!container) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const containerRect = container.getBoundingClientRect();
|
||||||
|
const imgRect = img.getBoundingClientRect();
|
||||||
|
const btnSize = 28;
|
||||||
|
const gap = 8;
|
||||||
|
zoomBtnStyle.value = {
|
||||||
|
top: `${imgRect.top - containerRect.top + gap}px`,
|
||||||
|
left: `${imgRect.right - containerRect.left - btnSize - gap}px`
|
||||||
|
};
|
||||||
|
hoveredImageSrc.value = img.getAttribute('src') ?? '';
|
||||||
|
zoomBtnVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isZoomBtn(el: EventTarget | null): boolean {
|
||||||
|
return el instanceof HTMLElement && Boolean(el.closest('.business-rich-text-editor__zoom-btn'));
|
||||||
|
}
|
||||||
|
|
||||||
|
function findImageAtPoint(e: MouseEvent): HTMLImageElement | null {
|
||||||
|
const container = containerRef.value;
|
||||||
|
if (!container) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
const target = e.target as HTMLElement | null;
|
||||||
|
// 1) target 本身或祖先链上是 img
|
||||||
|
const direct =
|
||||||
|
target?.tagName === 'IMG' ? (target as HTMLImageElement) : (target?.closest('img') as HTMLImageElement | null);
|
||||||
|
if (direct && container.contains(direct)) {
|
||||||
|
return direct;
|
||||||
|
}
|
||||||
|
// 2) 兜底:wangeditor 可能在图片上层叠了 resize/selection 遮罩,target 不是 img;用坐标穿透找
|
||||||
|
if (typeof document.elementsFromPoint === 'function') {
|
||||||
|
const stack = document.elementsFromPoint(e.clientX, e.clientY);
|
||||||
|
for (const el of stack) {
|
||||||
|
if (el.tagName === 'IMG' && container.contains(el)) {
|
||||||
|
return el as HTMLImageElement;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function onContainerMouseOver(e: MouseEvent) {
|
||||||
|
if (isZoomBtn(e.target)) {
|
||||||
|
cancelHideZoomBtn();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const img = findImageAtPoint(e);
|
||||||
|
if (img) {
|
||||||
|
cancelHideZoomBtn();
|
||||||
|
positionZoomBtn(img);
|
||||||
|
} else {
|
||||||
|
scheduleHideZoomBtn();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function onContainerMouseLeave() {
|
||||||
|
scheduleHideZoomBtn();
|
||||||
|
}
|
||||||
|
|
||||||
|
function onTextScroll() {
|
||||||
|
// wangeditor 内部滚动后按钮坐标会和图片错位,直接隐藏由下次 hover 重算
|
||||||
|
zoomBtnVisible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function openImageViewer() {
|
||||||
|
if (!hoveredImageSrc.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const urls = listImageSrcs(model.value);
|
||||||
|
const idx = urls.indexOf(hoveredImageSrc.value);
|
||||||
|
viewerUrlList.value = urls.length > 0 ? urls : [hoveredImageSrc.value];
|
||||||
|
viewerIndex.value = idx >= 0 ? idx : 0;
|
||||||
|
viewerVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeImageViewer() {
|
||||||
|
viewerVisible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 会话级清理账本(富文本图片治标):
|
||||||
|
* - uploadedMap: 本次会话内通过 customUpload 上传成功的图片 url -> fileId
|
||||||
|
* - committed: commit() 调用后置 true,阻止后续 rollback / 卸载兜底重复删
|
||||||
|
*
|
||||||
|
* 真删时机:
|
||||||
|
* - commit(): 扫当前 model HTML,删 uploadedMap 里"url 已不在 HTML"的项(被用户删掉的图)
|
||||||
|
* - rollback(): 删 uploadedMap 里所有项(整个会话不要了)
|
||||||
|
* - onBeforeUnmount: 兜底走 rollback 等价逻辑
|
||||||
|
*/
|
||||||
|
interface RichTextSession {
|
||||||
|
uploadedMap: Map<string, string>;
|
||||||
|
committed: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const session = reactive<RichTextSession>({
|
||||||
|
uploadedMap: new Map(),
|
||||||
|
committed: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const toolbarConfig: Partial<IToolbarConfig> = {
|
||||||
|
excludeKeys: [
|
||||||
|
// 视频组
|
||||||
|
'group-video',
|
||||||
|
'insertVideo',
|
||||||
|
'uploadVideo',
|
||||||
|
// 更多样式分组
|
||||||
|
'group-more-style',
|
||||||
|
// 图片:只允许本地上传,不允许插入网络图片 URL
|
||||||
|
'insertImage',
|
||||||
|
// 超链接:业务暂不需要
|
||||||
|
'insertLink',
|
||||||
|
'editLink',
|
||||||
|
'unLink',
|
||||||
|
'viewLink'
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
const editorConfig: Partial<IEditorConfig> = {
|
||||||
|
placeholder: props.placeholder,
|
||||||
|
readOnly: props.disabled,
|
||||||
|
MENU_CONF: {
|
||||||
|
uploadImage: {
|
||||||
|
maxFileSize: props.maxImageSizeMB * 1024 * 1024,
|
||||||
|
allowedFileTypes: ['image/png', 'image/jpeg', 'image/gif', 'image/webp', 'image/bmp'],
|
||||||
|
async customUpload(file: File, insertFn: (url: string, alt?: string, href?: string) => void) {
|
||||||
|
const result = await uploadFile(file, props.uploadDirectory);
|
||||||
|
|
||||||
|
if (result.error || !result.data) {
|
||||||
|
const msg = result.error?.response?.data?.msg || '图片上传失败';
|
||||||
|
window.$message?.error(msg);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 用永久代理路径塞 <img src>,不要用 result.data.url(24h 签名会过期)
|
||||||
|
const { id, configId, path } = result.data;
|
||||||
|
const proxyUrl = buildFileProxyUrl(configId, path);
|
||||||
|
// 记录 url -> fileId,后续 commit/rollback 才知道删哪个
|
||||||
|
session.uploadedMap.set(proxyUrl, id);
|
||||||
|
insertFn(proxyUrl, file.name, proxyUrl);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.disabled,
|
||||||
|
value => {
|
||||||
|
const editor = editorRef.value;
|
||||||
|
if (!editor) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (value) {
|
||||||
|
editor.disable();
|
||||||
|
} else {
|
||||||
|
editor.enable();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
function handleCreated(editor: IDomEditor) {
|
||||||
|
editorRef.value = editor;
|
||||||
|
const textContainer = containerRef.value?.querySelector('.w-e-text-container');
|
||||||
|
textContainer?.addEventListener('scroll', onTextScroll, { passive: true });
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 从 HTML 字符串里抓所有 <img src="...">,返回 url 集合。
|
||||||
|
* 用 regex 而不是 DOMParser 是为了避免对 SSR / 测试环境的依赖。
|
||||||
|
*/
|
||||||
|
function extractImageUrls(html: string | null | undefined): Set<string> {
|
||||||
|
const urls = new Set<string>();
|
||||||
|
if (!html) {
|
||||||
|
return urls;
|
||||||
|
}
|
||||||
|
const re = /<img\b[^>]*\bsrc=["']([^"']+)["'][^>]*>/gi;
|
||||||
|
let match: RegExpExecArray | null = re.exec(html);
|
||||||
|
while (match !== null) {
|
||||||
|
urls.add(match[1]);
|
||||||
|
match = re.exec(html);
|
||||||
|
}
|
||||||
|
return urls;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 按出现顺序去重列出当前 HTML 内所有 img src,给 ElImageViewer 用。 */
|
||||||
|
function listImageSrcs(html: string | null | undefined): string[] {
|
||||||
|
const list: string[] = [];
|
||||||
|
if (!html) {
|
||||||
|
return list;
|
||||||
|
}
|
||||||
|
const re = /<img\b[^>]*\bsrc=["']([^"']+)["'][^>]*>/gi;
|
||||||
|
let match: RegExpExecArray | null = re.exec(html);
|
||||||
|
while (match !== null) {
|
||||||
|
if (!list.includes(match[1])) {
|
||||||
|
list.push(match[1]);
|
||||||
|
}
|
||||||
|
match = re.exec(html);
|
||||||
|
}
|
||||||
|
return list;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 删除一批 fileId。fire-and-forget;单项失败仅 console.warn。 */
|
||||||
|
async function deleteMany(ids: string[]) {
|
||||||
|
if (ids.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
await Promise.allSettled(
|
||||||
|
ids.map(async id => {
|
||||||
|
const { error } = await deleteFile(id);
|
||||||
|
if (error) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.warn('[BusinessRichTextEditor] 删除失败(已忽略)', id, error);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
/**
|
||||||
|
* 父组件在【打开弹层并填充 model 之后】调用。
|
||||||
|
* 清空 uploadedMap 并重置 committed;HTML 里已有的图(编辑模式回显的)不进 uploadedMap,
|
||||||
|
* 因此 commit/rollback 不会动它们——只动本次会话上传的图。
|
||||||
|
*/
|
||||||
|
initSession() {
|
||||||
|
session.uploadedMap.clear();
|
||||||
|
session.committed = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 父组件在【业务保存成功后】调用。
|
||||||
|
* 扫当前 model HTML:uploadedMap 里 url 不在 HTML 的图 = 用户已删除 = 真删。
|
||||||
|
*/
|
||||||
|
async commit() {
|
||||||
|
const currentUrls = extractImageUrls(model.value);
|
||||||
|
const toDelete: string[] = [];
|
||||||
|
session.uploadedMap.forEach((fileId, url) => {
|
||||||
|
if (!currentUrls.has(url)) {
|
||||||
|
toDelete.push(fileId);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
session.uploadedMap.clear();
|
||||||
|
session.committed = true;
|
||||||
|
await deleteMany(toDelete);
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 父组件取消/关闭时调用;onBeforeUnmount 也会兜底调一次。
|
||||||
|
* 删 uploadedMap 里所有项(整个会话回滚)。
|
||||||
|
*/
|
||||||
|
async rollback() {
|
||||||
|
if (session.committed) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const toDelete = Array.from(session.uploadedMap.values());
|
||||||
|
session.uploadedMap.clear();
|
||||||
|
session.committed = true;
|
||||||
|
await deleteMany(toDelete);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
cancelHideZoomBtn();
|
||||||
|
const textContainer = containerRef.value?.querySelector('.w-e-text-container');
|
||||||
|
textContainer?.removeEventListener('scroll', onTextScroll);
|
||||||
|
|
||||||
|
// 兜底:用户没显式 rollback 就直接关弹层 / 切路由 / unmount
|
||||||
|
if (!session.committed) {
|
||||||
|
const toDelete = Array.from(session.uploadedMap.values());
|
||||||
|
session.uploadedMap.clear();
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||||
|
deleteMany(toDelete);
|
||||||
|
}
|
||||||
|
editorRef.value?.destroy();
|
||||||
|
editorRef.value = undefined;
|
||||||
|
});
|
||||||
|
|
||||||
|
/** 当 height 传 '100%' 或 'auto' 时启用「撑满父容器」模式 —— 父级必须有具体高度。 */
|
||||||
|
const isAutoFill = computed(() => props.height === '100%' || props.height === 'auto');
|
||||||
|
|
||||||
|
const containerClass = computed(() => ({
|
||||||
|
'business-rich-text-editor': true,
|
||||||
|
'business-rich-text-editor--auto-fill': isAutoFill.value
|
||||||
|
}));
|
||||||
|
|
||||||
|
const editorStyle = computed(() => {
|
||||||
|
if (isAutoFill.value) {
|
||||||
|
return { flex: 1, minHeight: 0, overflowY: 'hidden' as const };
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
height: typeof props.height === 'number' ? `${props.height}px` : props.height,
|
||||||
|
overflowY: 'hidden' as const
|
||||||
|
};
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div ref="containerRef" :class="containerClass" @mouseover="onContainerMouseOver" @mouseleave="onContainerMouseLeave">
|
||||||
|
<Toolbar
|
||||||
|
class="business-rich-text-editor__toolbar"
|
||||||
|
:editor="editorRef"
|
||||||
|
:default-config="toolbarConfig"
|
||||||
|
mode="default"
|
||||||
|
/>
|
||||||
|
<Editor
|
||||||
|
v-model="model"
|
||||||
|
class="business-rich-text-editor__editor"
|
||||||
|
:style="editorStyle"
|
||||||
|
:default-config="editorConfig"
|
||||||
|
mode="default"
|
||||||
|
@on-created="handleCreated"
|
||||||
|
/>
|
||||||
|
<button
|
||||||
|
v-show="zoomBtnVisible"
|
||||||
|
type="button"
|
||||||
|
class="business-rich-text-editor__zoom-btn"
|
||||||
|
:style="zoomBtnStyle"
|
||||||
|
title="预览图片"
|
||||||
|
aria-label="预览图片"
|
||||||
|
@click.stop="openImageViewer"
|
||||||
|
>
|
||||||
|
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor" aria-hidden="true">
|
||||||
|
<path
|
||||||
|
d="M10 2a8 8 0 1 1-5.29 14.04L1.4 19.36a1 1 0 1 1-1.4-1.4l3.32-3.32A8 8 0 0 1 10 2zm0 2a6 6 0 1 0 0 12 6 6 0 0 0 0-12zm1 3v2h2v2h-2v2H9v-2H7V9h2V7h2z"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
<ElImageViewer
|
||||||
|
v-if="viewerVisible"
|
||||||
|
:url-list="viewerUrlList"
|
||||||
|
:initial-index="viewerIndex"
|
||||||
|
:z-index="3100"
|
||||||
|
teleported
|
||||||
|
hide-on-click-modal
|
||||||
|
@close="closeImageViewer"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.business-rich-text-editor {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
border: 1px solid var(--el-border-color);
|
||||||
|
border-radius: var(--el-border-radius-base);
|
||||||
|
overflow: hidden;
|
||||||
|
background: var(--el-bg-color);
|
||||||
|
|
||||||
|
&__toolbar {
|
||||||
|
border-bottom: 1px solid var(--el-border-color);
|
||||||
|
background: var(--el-fill-color-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
&__editor {
|
||||||
|
background: var(--el-bg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
&--auto-fill {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__zoom-btn {
|
||||||
|
position: absolute;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
padding: 0;
|
||||||
|
border: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: rgba(0, 0, 0, 0.55);
|
||||||
|
color: #fff;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.15s;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: rgba(0, 0, 0, 0.75);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* wangeditor 弹层(链接、图片菜单等)默认 z-index 偏低,提高一档避免被 ElDialog 遮挡 */
|
||||||
|
:deep(.w-e-modal),
|
||||||
|
:deep(.w-e-drop-panel),
|
||||||
|
:deep(.w-e-bar-divider),
|
||||||
|
:deep(.w-e-hover-bar) {
|
||||||
|
z-index: 3000 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
87
src/components/custom/business-rich-text-view.vue
Normal file
87
src/components/custom/business-rich-text-view.vue
Normal file
@@ -0,0 +1,87 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed } from 'vue';
|
||||||
|
import { sanitizeHtml } from '@/utils/sanitize';
|
||||||
|
|
||||||
|
defineOptions({ name: 'BusinessRichTextView' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
value?: string | null;
|
||||||
|
emptyText?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
value: '',
|
||||||
|
emptyText: '—'
|
||||||
|
});
|
||||||
|
|
||||||
|
const safeHtml = computed(() => sanitizeHtml(props.value));
|
||||||
|
const isEmpty = computed(() => !safeHtml.value || safeHtml.value.replace(/<[^>]+>/g, '').trim() === '');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="business-rich-text-view">
|
||||||
|
<span v-if="isEmpty" class="business-rich-text-view__empty">{{ props.emptyText }}</span>
|
||||||
|
<div v-else class="business-rich-text-view__content" v-html="safeHtml" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.business-rich-text-view {
|
||||||
|
width: 100%;
|
||||||
|
color: var(--el-text-color-primary);
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.7;
|
||||||
|
word-break: break-word;
|
||||||
|
|
||||||
|
&__empty {
|
||||||
|
color: var(--el-text-color-placeholder);
|
||||||
|
}
|
||||||
|
|
||||||
|
&__content {
|
||||||
|
:deep(p) {
|
||||||
|
margin: 0 0 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(p:last-child) {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(img) {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(ul),
|
||||||
|
:deep(ol) {
|
||||||
|
padding-left: 24px;
|
||||||
|
margin: 0 0 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(blockquote) {
|
||||||
|
padding: 6px 12px;
|
||||||
|
margin: 0 0 8px;
|
||||||
|
border-left: 3px solid var(--el-border-color);
|
||||||
|
color: var(--el-text-color-regular);
|
||||||
|
background: var(--el-fill-color-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(table) {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
margin: 0 0 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(table td),
|
||||||
|
:deep(table th) {
|
||||||
|
padding: 4px 8px;
|
||||||
|
border: 1px solid var(--el-border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(a) {
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
131
src/components/custom/business-user-select.vue
Normal file
131
src/components/custom/business-user-select.vue
Normal file
@@ -0,0 +1,131 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'BusinessUserSelect' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
options: Api.SystemManage.UserSimple[];
|
||||||
|
placeholder?: string;
|
||||||
|
disabled?: boolean;
|
||||||
|
clearable?: boolean;
|
||||||
|
disabledUserIds?: readonly string[];
|
||||||
|
excludeUserIds?: readonly string[];
|
||||||
|
disabledLabel?: string;
|
||||||
|
noDataText?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
placeholder: '请选择用户',
|
||||||
|
disabled: false,
|
||||||
|
clearable: true,
|
||||||
|
disabledUserIds: () => [],
|
||||||
|
excludeUserIds: () => [],
|
||||||
|
disabledLabel: '',
|
||||||
|
noDataText: ''
|
||||||
|
});
|
||||||
|
|
||||||
|
const model = defineModel<string | null>('modelValue', {
|
||||||
|
default: null
|
||||||
|
});
|
||||||
|
|
||||||
|
const searchKeyword = ref('');
|
||||||
|
const disabledUserIdSet = computed(() => new Set(props.disabledUserIds.map(id => String(id))));
|
||||||
|
const excludeUserIdSet = computed(() => new Set(props.excludeUserIds.map(id => String(id))));
|
||||||
|
|
||||||
|
const visibleOptions = computed(() => {
|
||||||
|
const keyword = searchKeyword.value.trim().toLocaleLowerCase();
|
||||||
|
const options = props.options.filter(item => !excludeUserIdSet.value.has(String(item.id)));
|
||||||
|
|
||||||
|
if (!keyword) {
|
||||||
|
return options;
|
||||||
|
}
|
||||||
|
|
||||||
|
return options.filter(item => {
|
||||||
|
const searchText = [item.nickname, item.username, item.deptName, item.id]
|
||||||
|
.filter(Boolean)
|
||||||
|
.join(' ')
|
||||||
|
.toLocaleLowerCase();
|
||||||
|
|
||||||
|
return searchText.includes(keyword);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleFilter(value: string) {
|
||||||
|
searchKeyword.value = value;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<ElSelect
|
||||||
|
v-model="model"
|
||||||
|
class="w-full"
|
||||||
|
filterable
|
||||||
|
:filter-method="handleFilter"
|
||||||
|
:clearable="clearable"
|
||||||
|
:disabled="disabled"
|
||||||
|
:placeholder="placeholder"
|
||||||
|
:no-data-text="noDataText || undefined"
|
||||||
|
>
|
||||||
|
<ElOption
|
||||||
|
v-for="item in visibleOptions"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.nickname"
|
||||||
|
:value="item.id"
|
||||||
|
:disabled="disabledUserIdSet.has(String(item.id))"
|
||||||
|
>
|
||||||
|
<div class="business-user-select__option">
|
||||||
|
<span class="business-user-select__name">{{ item.nickname }}</span>
|
||||||
|
<span class="business-user-select__suffix">
|
||||||
|
<ElTag
|
||||||
|
v-if="disabledLabel && disabledUserIdSet.has(String(item.id))"
|
||||||
|
size="small"
|
||||||
|
type="warning"
|
||||||
|
effect="light"
|
||||||
|
disable-transitions
|
||||||
|
>
|
||||||
|
{{ disabledLabel }}
|
||||||
|
</ElTag>
|
||||||
|
<span v-if="item.deptName || item.username" class="business-user-select__meta">
|
||||||
|
{{ [item.username, item.deptName].filter(Boolean).join(' · ') }}
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</ElOption>
|
||||||
|
</ElSelect>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.business-user-select__option {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 12px;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-user-select__name {
|
||||||
|
min-width: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
color: rgb(15 23 42 / 94%);
|
||||||
|
font-weight: 500;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-user-select__suffix {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
flex: 0 0 auto;
|
||||||
|
max-width: 58%;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.business-user-select__meta {
|
||||||
|
min-width: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
color: rgb(100 116 139 / 88%);
|
||||||
|
font-size: 12px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -2,6 +2,13 @@
|
|||||||
import { $t } from '@/locales';
|
import { $t } from '@/locales';
|
||||||
|
|
||||||
defineOptions({ name: 'LookForward' });
|
defineOptions({ name: 'LookForward' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
title?: string;
|
||||||
|
subtitle?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
defineProps<Props>();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -10,7 +17,10 @@ defineOptions({ name: 'LookForward' });
|
|||||||
<SvgIcon local-icon="expectation" />
|
<SvgIcon local-icon="expectation" />
|
||||||
</div>
|
</div>
|
||||||
<slot>
|
<slot>
|
||||||
<h3 class="text-28px text-primary font-500">{{ $t('common.lookForward') }}</h3>
|
<h3 class="text-28px text-primary font-500">{{ title ?? $t('common.lookForward') }}</h3>
|
||||||
|
</slot>
|
||||||
|
<slot name="subtitle">
|
||||||
|
<p v-if="subtitle" class="text-14px text-base-text op-65">{{ subtitle }}</p>
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
325
src/components/custom/table-search-fields.vue
Normal file
325
src/components/custom/table-search-fields.vue
Normal file
@@ -0,0 +1,325 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, ref } from 'vue';
|
||||||
|
import type { VNode } from 'vue';
|
||||||
|
import { ElButton, ElCol, ElDatePicker, ElFormItem, ElInput, ElOption, ElRow, ElSelect } from 'element-plus';
|
||||||
|
import DictSelect from './dict-select.vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'TableSearchFields' });
|
||||||
|
|
||||||
|
interface Option {
|
||||||
|
label: string;
|
||||||
|
value: string | number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SearchField {
|
||||||
|
/** 字段键名 */
|
||||||
|
key: string;
|
||||||
|
/** 字段标签 */
|
||||||
|
label: string;
|
||||||
|
/** 字段类型 */
|
||||||
|
type: 'input' | 'select' | 'date' | 'dateRange' | 'dict';
|
||||||
|
/** 占位列数,默认 1 */
|
||||||
|
span?: number;
|
||||||
|
/** select 类型的选项 */
|
||||||
|
options?: Option[];
|
||||||
|
/** dict 类型的字典编码 */
|
||||||
|
dictCode?: string;
|
||||||
|
/** 占位提示文本 */
|
||||||
|
placeholder?: string;
|
||||||
|
/** select 类型的自定义选项渲染函数 */
|
||||||
|
renderOption?: (option: Option) => VNode | VNode[] | string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
/** 绑定表单数据对象 */
|
||||||
|
modelValue: Record<string, any>;
|
||||||
|
/** 查询字段定义数组 */
|
||||||
|
fields: SearchField[];
|
||||||
|
/** 每行格子数(按钮占 1 格) */
|
||||||
|
columns: number;
|
||||||
|
/** 表单标签宽度 */
|
||||||
|
labelWidth?: string | number;
|
||||||
|
/** 格子间距 */
|
||||||
|
gutter?: number;
|
||||||
|
/** 是否禁用 */
|
||||||
|
disabled?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
labelWidth: 80,
|
||||||
|
gutter: 16,
|
||||||
|
disabled: false
|
||||||
|
});
|
||||||
|
|
||||||
|
interface Emits {
|
||||||
|
(e: 'search'): void;
|
||||||
|
(e: 'reset'): void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const emit = defineEmits<Emits>();
|
||||||
|
|
||||||
|
// 折叠/展开状态
|
||||||
|
const expanded = ref(false);
|
||||||
|
|
||||||
|
// 是否需要折叠(字段数 > columns - 1)
|
||||||
|
const needsCollapse = computed(() => props.fields.length > props.columns - 1);
|
||||||
|
|
||||||
|
// 第一行字段数(留一个位置给按钮)
|
||||||
|
const firstRowFieldCount = computed(() => props.columns - 1);
|
||||||
|
|
||||||
|
// 计算第一行字段
|
||||||
|
const firstRowFields = computed(() => {
|
||||||
|
if (expanded.value || !needsCollapse.value) {
|
||||||
|
return props.fields.slice(0, firstRowFieldCount.value);
|
||||||
|
}
|
||||||
|
return props.fields.slice(0, firstRowFieldCount.value);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 计算后续行字段(用于展开后显示)
|
||||||
|
const remainingFields = computed(() => {
|
||||||
|
if (expanded.value || !needsCollapse.value) {
|
||||||
|
return props.fields.slice(firstRowFieldCount.value);
|
||||||
|
}
|
||||||
|
return [];
|
||||||
|
});
|
||||||
|
|
||||||
|
const firstRowButtonSpan = computed(() => {
|
||||||
|
return Math.floor(24 / props.columns);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 计算第一行字段的 span(字段和按钮区保持同一列宽)
|
||||||
|
const firstRowFieldSpan = computed(() => {
|
||||||
|
return firstRowButtonSpan.value;
|
||||||
|
});
|
||||||
|
|
||||||
|
// 计算每个字段的 span(用于后续行)
|
||||||
|
const fieldSpan = computed(() => {
|
||||||
|
return Math.floor(24 / props.columns);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 字段不足时补足首行空列,确保按钮区始终落在 columns 定义的最后一格。
|
||||||
|
const firstRowPlaceholderSpan = computed(() => {
|
||||||
|
const emptySlotCount = Math.max(props.columns - 1 - firstRowFields.value.length, 0);
|
||||||
|
return emptySlotCount * fieldSpan.value;
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleToggle() {
|
||||||
|
expanded.value = !expanded.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleReset() {
|
||||||
|
emit('reset');
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSearch() {
|
||||||
|
emit('search');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- eslint-disable vue/no-mutating-props -->
|
||||||
|
<template>
|
||||||
|
<ElCard class="card-wrapper">
|
||||||
|
<ElForm :model="props.modelValue" :label-width="props.labelWidth" @submit.prevent @keyup.enter="handleSearch">
|
||||||
|
<!-- 第一行:fields + 按钮 -->
|
||||||
|
<ElRow :gutter="props.gutter">
|
||||||
|
<ElCol
|
||||||
|
v-for="field in firstRowFields"
|
||||||
|
:key="field.key"
|
||||||
|
class="table-search-fields__col"
|
||||||
|
:span="firstRowFieldSpan"
|
||||||
|
>
|
||||||
|
<ElFormItem :label="field.label">
|
||||||
|
<ElInput
|
||||||
|
v-if="field.type === 'input'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
<ElSelect
|
||||||
|
v-else-if="field.type === 'select'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
>
|
||||||
|
<ElOption v-for="opt in field.options" :key="opt.value" :label="opt.label" :value="opt.value">
|
||||||
|
<template v-if="field.renderOption" #default>
|
||||||
|
<component :is="field.renderOption(opt)" />
|
||||||
|
</template>
|
||||||
|
</ElOption>
|
||||||
|
</ElSelect>
|
||||||
|
<ElDatePicker
|
||||||
|
v-else-if="field.type === 'date'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
type="date"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
<ElDatePicker
|
||||||
|
v-else-if="field.type === 'dateRange'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
type="daterange"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
<DictSelect
|
||||||
|
v-else-if="field.type === 'dict'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
:dict-code="field.dictCode!"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
|
||||||
|
<ElCol
|
||||||
|
v-if="firstRowPlaceholderSpan > 0"
|
||||||
|
class="table-search-fields__col table-search-fields__placeholder-col"
|
||||||
|
:span="firstRowPlaceholderSpan"
|
||||||
|
aria-hidden="true"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 按钮区域 -->
|
||||||
|
<ElCol class="table-search-fields__col table-search-fields__action-col" :span="firstRowButtonSpan">
|
||||||
|
<ElFormItem class="table-search-fields__actions" label-width="0">
|
||||||
|
<ElButton
|
||||||
|
v-if="needsCollapse"
|
||||||
|
circle
|
||||||
|
:title="expanded ? '收起' : '展开'"
|
||||||
|
:aria-label="expanded ? '收起查询条件' : '展开查询条件'"
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@click="handleToggle"
|
||||||
|
>
|
||||||
|
<icon-mdi-chevron-double-up v-if="expanded" />
|
||||||
|
<icon-mdi-chevron-double-down v-else />
|
||||||
|
</ElButton>
|
||||||
|
<ElButton :disabled="props.disabled" @click="handleReset">
|
||||||
|
<template #icon>
|
||||||
|
<icon-ic-round-refresh class="text-icon" />
|
||||||
|
</template>
|
||||||
|
重置
|
||||||
|
</ElButton>
|
||||||
|
<ElButton type="primary" :disabled="props.disabled" @click="handleSearch">
|
||||||
|
<template #icon>
|
||||||
|
<icon-ic-round-search class="text-icon" />
|
||||||
|
</template>
|
||||||
|
查询
|
||||||
|
</ElButton>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
|
||||||
|
<!-- 展开后的后续行 -->
|
||||||
|
<ElRow v-if="expanded && remainingFields.length > 0" :gutter="props.gutter">
|
||||||
|
<ElCol v-for="field in remainingFields" :key="field.key" class="table-search-fields__col" :span="fieldSpan">
|
||||||
|
<ElFormItem :label="field.label">
|
||||||
|
<ElInput
|
||||||
|
v-if="field.type === 'input'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
<ElSelect
|
||||||
|
v-else-if="field.type === 'select'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
>
|
||||||
|
<ElOption v-for="opt in field.options" :key="opt.value" :label="opt.label" :value="opt.value">
|
||||||
|
<template v-if="field.renderOption" #default>
|
||||||
|
<component :is="field.renderOption(opt)" />
|
||||||
|
</template>
|
||||||
|
</ElOption>
|
||||||
|
</ElSelect>
|
||||||
|
<ElDatePicker
|
||||||
|
v-else-if="field.type === 'date'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
type="date"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
<ElDatePicker
|
||||||
|
v-else-if="field.type === 'dateRange'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
type="daterange"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
clearable
|
||||||
|
:disabled="props.disabled"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
<DictSelect
|
||||||
|
v-else-if="field.type === 'dict'"
|
||||||
|
:model-value="props.modelValue[field.key]"
|
||||||
|
:dict-code="field.dictCode!"
|
||||||
|
:placeholder="field.placeholder"
|
||||||
|
:disabled="props.disabled"
|
||||||
|
@update:model-value="val => (props.modelValue[field.key] = val)"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</ElCard>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
:deep(.el-form-item) {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-search-fields__col {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-search-fields__placeholder-col {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-search-fields__actions {
|
||||||
|
:deep(.el-form-item__content) {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 8px;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-button + .el-button) {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-form-item__content) {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-input),
|
||||||
|
:deep(.el-select),
|
||||||
|
:deep(.el-date-editor) {
|
||||||
|
width: 100%;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -89,3 +89,25 @@ export const postTypeRecord: Record<Api.SystemManage.PostType, string> = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const postTypeOptions = transformRecordToOption(postTypeRecord);
|
export const postTypeOptions = transformRecordToOption(postTypeRecord);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 产品对象域角色编码:产品经理
|
||||||
|
*
|
||||||
|
* 用途:
|
||||||
|
* 产品创建两步向导第 2 步初始化团队时,前端按本 code 在 fetchGetRoleSimpleList
|
||||||
|
* 返回的角色列表中反查产品经理角色 ID,作为默认经理成员行的 roleId 提交。
|
||||||
|
*
|
||||||
|
* 来源口径:后端约定的产品对象域内置角色稳定 code。code 变更需同步前端常量。
|
||||||
|
*/
|
||||||
|
export const PRODUCT_MANAGER_ROLE_CODE = 'product_manager';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 项目对象域角色编码:项目经理
|
||||||
|
*
|
||||||
|
* 用途:
|
||||||
|
* 项目创建两步向导第 2 步初始化团队时,前端按本 code 在 fetchGetRoleSimpleList
|
||||||
|
* 返回的角色列表中反查项目经理角色 ID,作为默认经理成员行的 roleId 提交。
|
||||||
|
*
|
||||||
|
* 来源口径:后端约定的项目对象域内置角色稳定 code。code 变更需同步前端常量。
|
||||||
|
*/
|
||||||
|
export const PROJECT_MANAGER_ROLE_CODE = 'project_manager';
|
||||||
|
|||||||
@@ -48,7 +48,7 @@ export const RDMS_REQ_SOURCE_TYPE_DICT_CODE = 'rdms_req_source_type';
|
|||||||
* 需求优先级字典编码
|
* 需求优先级字典编码
|
||||||
*
|
*
|
||||||
* 对应业务字段:需求相关接口和页面中的 priority
|
* 对应业务字段:需求相关接口和页面中的 priority
|
||||||
* 来源口径:产品需求文档中定义,标签包括紧急、高、中、低
|
* 来源口径:产品需求文档中定义,标签包括P0、P1、P2、P3
|
||||||
*/
|
*/
|
||||||
export const RDMS_REQ_PRIORITY_DICT_CODE = 'rdms_req_priority';
|
export const RDMS_REQ_PRIORITY_DICT_CODE = 'rdms_req_priority';
|
||||||
|
|
||||||
@@ -59,3 +59,35 @@ export const RDMS_REQ_PRIORITY_DICT_CODE = 'rdms_req_priority';
|
|||||||
* 来源口径:产品需求文档中定义,标签包括工程需求、用户需求、安全需求、体验优化、功能需求
|
* 来源口径:产品需求文档中定义,标签包括工程需求、用户需求、安全需求、体验优化、功能需求
|
||||||
*/
|
*/
|
||||||
export const RDMS_REQ_CATEGORY_DICT_CODE = 'rdms_req_category';
|
export const RDMS_REQ_CATEGORY_DICT_CODE = 'rdms_req_category';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 项目类型字典编码
|
||||||
|
*
|
||||||
|
* 对应业务字段:项目相关接口和页面中的 projectType
|
||||||
|
* 来源口径:后端字典 rdms_project_type
|
||||||
|
*/
|
||||||
|
export const RDMS_PROJECT_TYPE_DICT_CODE = 'rdms_project_type';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 项目执行类型字典编码
|
||||||
|
*
|
||||||
|
* 对应业务字段:项目任务管理中执行的 executionType
|
||||||
|
* 来源口径:`rdms-project-boot-执行任务接口API文档.md` 明确 executionType 来自字典 rdms_project_execution_type
|
||||||
|
*/
|
||||||
|
export const RDMS_PROJECT_EXECUTION_TYPE_DICT_CODE = 'rdms_project_execution_type';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 状态机对象类型字典编码
|
||||||
|
*
|
||||||
|
* 对应业务字段:状态机管理中的 objectType / 对象类型
|
||||||
|
* 来源口径:用户明确指定对象类型下拉来自运行时字典 object_status_model_object_type
|
||||||
|
*/
|
||||||
|
export const OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE = 'object_status_model_object_type';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 需求允许删除的状态字典编码
|
||||||
|
*
|
||||||
|
* 对应业务字段:需求删除功能中判断 statusCode 是否允许删除
|
||||||
|
* 来源口径:用户在系统字典管理页中创建的字典 rdms_req_can_delete_status
|
||||||
|
*/
|
||||||
|
export const RDMS_REQ_CAN_DELETE_STATUS_DICT_CODE = 'rdms_req_can_delete_status';
|
||||||
|
|||||||
@@ -10,11 +10,11 @@ export const objectContextDomainConfigs: App.ObjectContext.DomainConfig[] = [
|
|||||||
routePathPrefixes: ['/project'],
|
routePathPrefixes: ['/project'],
|
||||||
entryRouteKey: 'project_list',
|
entryRouteKey: 'project_list',
|
||||||
entryRoutePath: '/project/list',
|
entryRoutePath: '/project/list',
|
||||||
fallbackDefaultRouteKey: 'project_dashboard',
|
fallbackDefaultRouteKey: 'project_project_overview',
|
||||||
fallbackDefaultRoutePath: '/project/dashboard',
|
fallbackDefaultRoutePath: '/project/project/overview',
|
||||||
contextApiPath: `${WEB_SERVICE_PREFIX}/project/context`,
|
contextApiPath: `${WEB_SERVICE_PREFIX}/project/project/{id}/context`,
|
||||||
contextApiObjectIdParamKey: 'projectId',
|
contextApiObjectIdParamKey: 'id',
|
||||||
contextApiObjectIdPlacement: 'query',
|
contextApiObjectIdPlacement: 'path',
|
||||||
objectIdQueryKey: OBJECT_CONTEXT_QUERY_KEY
|
objectIdQueryKey: OBJECT_CONTEXT_QUERY_KEY
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
65
src/constants/status-tag.ts
Normal file
65
src/constants/status-tag.ts
Normal file
@@ -0,0 +1,65 @@
|
|||||||
|
/**
|
||||||
|
* 业务对象状态颜色(ElTag type)集中配置
|
||||||
|
*
|
||||||
|
* 各业务域的 statusCode → ElTag type 在此统一维护,避免散落在各业务模块。
|
||||||
|
* 未来若后端状态字典返回颜色字段,可在调用方优先取后端值,缺失时回退此映射。
|
||||||
|
*/
|
||||||
|
|
||||||
|
export type StatusTagType = 'primary' | 'success' | 'warning' | 'info' | 'danger';
|
||||||
|
|
||||||
|
export type StatusDomain =
|
||||||
|
| 'projectExecution'
|
||||||
|
| 'projectTask'
|
||||||
|
| 'executionAssignee'
|
||||||
|
| 'taskAssigneeMember'
|
||||||
|
| 'project'
|
||||||
|
| 'product'
|
||||||
|
| 'requirement'
|
||||||
|
| 'workOrder';
|
||||||
|
|
||||||
|
const statusTagTypeRegistry: Record<StatusDomain, Record<string, StatusTagType>> = {
|
||||||
|
// 项目-执行
|
||||||
|
projectExecution: {
|
||||||
|
pending: 'info',
|
||||||
|
active: 'primary',
|
||||||
|
paused: 'warning',
|
||||||
|
completed: 'success',
|
||||||
|
cancelled: 'danger'
|
||||||
|
},
|
||||||
|
// 项目-任务
|
||||||
|
projectTask: {
|
||||||
|
pending: 'info',
|
||||||
|
active: 'primary',
|
||||||
|
paused: 'warning',
|
||||||
|
completed: 'success',
|
||||||
|
cancelled: 'danger'
|
||||||
|
},
|
||||||
|
// 执行协办人变更事件
|
||||||
|
executionAssignee: {
|
||||||
|
join: 'success',
|
||||||
|
inactive: 'danger',
|
||||||
|
owner_transfer_in: 'warning',
|
||||||
|
owner_transfer_out: 'warning'
|
||||||
|
},
|
||||||
|
// 任务协办人变更事件
|
||||||
|
taskAssigneeMember: {
|
||||||
|
join: 'success',
|
||||||
|
inactive: 'danger'
|
||||||
|
},
|
||||||
|
// 项目(待补全)
|
||||||
|
project: {},
|
||||||
|
// 产品(待补全)
|
||||||
|
product: {},
|
||||||
|
// 需求(待补全)
|
||||||
|
requirement: {},
|
||||||
|
// 工单(待补全)
|
||||||
|
workOrder: {}
|
||||||
|
};
|
||||||
|
|
||||||
|
export function getStatusTagType(domain: StatusDomain, statusCode: string | null | undefined): StatusTagType {
|
||||||
|
if (!statusCode) {
|
||||||
|
return 'info';
|
||||||
|
}
|
||||||
|
|
||||||
|
return statusTagTypeRegistry[domain][statusCode] || 'info';
|
||||||
|
}
|
||||||
@@ -12,11 +12,13 @@ const authStore = useAuthStore();
|
|||||||
const { routerPushByKey, toLogin } = useRouterPush();
|
const { routerPushByKey, toLogin } = useRouterPush();
|
||||||
const { SvgIconVNode } = useSvgIcon();
|
const { SvgIconVNode } = useSvgIcon();
|
||||||
|
|
||||||
|
const displayName = computed(() => authStore.userInfo.nickname || authStore.userInfo.userName);
|
||||||
|
|
||||||
function loginOrRegister() {
|
function loginOrRegister() {
|
||||||
toLogin();
|
toLogin();
|
||||||
}
|
}
|
||||||
|
|
||||||
type DropdownKey = 'user-center' | 'logout';
|
type DropdownKey = 'personal-center_my-profile' | 'logout';
|
||||||
|
|
||||||
type DropdownOption = {
|
type DropdownOption = {
|
||||||
key: DropdownKey;
|
key: DropdownKey;
|
||||||
@@ -27,8 +29,8 @@ type DropdownOption = {
|
|||||||
const options = computed(() => {
|
const options = computed(() => {
|
||||||
const opts: DropdownOption[] = [
|
const opts: DropdownOption[] = [
|
||||||
{
|
{
|
||||||
label: $t('common.userCenter'),
|
label: $t('common.myProfile'),
|
||||||
key: 'user-center',
|
key: 'personal-center_my-profile',
|
||||||
icon: SvgIconVNode({ icon: 'ph:user-circle', fontSize: 18 })
|
icon: SvgIconVNode({ icon: 'ph:user-circle', fontSize: 18 })
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -84,7 +86,7 @@ function handleDropdown(key: DropdownKey) {
|
|||||||
</template>
|
</template>
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
<SvgIcon icon="ph:user-circle" class="mr-5px text-icon-large" />
|
<SvgIcon icon="ph:user-circle" class="mr-5px text-icon-large" />
|
||||||
<span class="text-16px font-medium">{{ authStore.userInfo.userName }}</span>
|
<span class="text-16px font-medium">{{ displayName }}</span>
|
||||||
</div>
|
</div>
|
||||||
</ElDropdown>
|
</ElDropdown>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -40,7 +40,7 @@ const local: App.I18n.Schema = {
|
|||||||
trigger: 'Trigger',
|
trigger: 'Trigger',
|
||||||
update: 'Update',
|
update: 'Update',
|
||||||
updateSuccess: 'Update Success',
|
updateSuccess: 'Update Success',
|
||||||
userCenter: 'User Center',
|
myProfile: 'My Profile',
|
||||||
yesOrNo: {
|
yesOrNo: {
|
||||||
yes: 'Yes',
|
yes: 'Yes',
|
||||||
no: 'No'
|
no: 'No'
|
||||||
@@ -158,7 +158,24 @@ const local: App.I18n.Schema = {
|
|||||||
404: 'Page Not Found',
|
404: 'Page Not Found',
|
||||||
500: 'Server Error',
|
500: 'Server Error',
|
||||||
'iframe-page': 'Iframe',
|
'iframe-page': 'Iframe',
|
||||||
'user-center': 'User Center',
|
workbench: 'Workbench',
|
||||||
|
ticket: 'Ticket',
|
||||||
|
'ticket_my-submitted': 'My Submitted',
|
||||||
|
'ticket_my-pending': 'My Pending',
|
||||||
|
metrics: 'Metrics',
|
||||||
|
'metrics_project-progress': 'Project Progress',
|
||||||
|
'metrics_member-efficiency': 'Member Efficiency',
|
||||||
|
metrics_worktime: 'Worktime',
|
||||||
|
'personal-center': 'Personal Center',
|
||||||
|
'personal-center_my-profile': 'My Profile',
|
||||||
|
'personal-center_my-weekly': 'My Weekly Report',
|
||||||
|
'personal-center_my-monthly': 'My Monthly Report',
|
||||||
|
'personal-center_my-performance': 'My Performance',
|
||||||
|
'personal-center_my-application': 'My Application',
|
||||||
|
'personal-center_pending-approval': 'Pending Approval',
|
||||||
|
infra: 'Infra',
|
||||||
|
'infra_state-machine': 'State Machine',
|
||||||
|
'infra_rd-code': 'R&D Code',
|
||||||
function: 'System Function',
|
function: 'System Function',
|
||||||
function_tab: 'Tab',
|
function_tab: 'Tab',
|
||||||
'function_multi-tab': 'Multi Tab',
|
'function_multi-tab': 'Multi Tab',
|
||||||
@@ -169,12 +186,19 @@ const local: App.I18n.Schema = {
|
|||||||
function_request: 'Request',
|
function_request: 'Request',
|
||||||
'function_toggle-auth': 'Toggle Auth',
|
'function_toggle-auth': 'Toggle Auth',
|
||||||
'function_super-page': 'Super Admin Visible',
|
'function_super-page': 'Super Admin Visible',
|
||||||
product: 'Product Management',
|
product: 'Product',
|
||||||
product_list: 'Product List',
|
product_list: 'Product List',
|
||||||
product_dashboard: 'Product Dashboard',
|
product_dashboard: 'Dashboard',
|
||||||
product_requirement: 'Requirement Pool',
|
product_requirement: 'Requirement',
|
||||||
product_setting: 'Product Settings',
|
product_setting: 'Settings',
|
||||||
system: 'System Management',
|
project: 'Project',
|
||||||
|
project_list: 'Project List',
|
||||||
|
project_project: 'Project',
|
||||||
|
project_project_overview: 'Overview',
|
||||||
|
project_project_requirement: 'Requirement',
|
||||||
|
project_project_execution: 'Task Management',
|
||||||
|
project_project_setting: 'Settings',
|
||||||
|
system: 'System',
|
||||||
system_user: 'User Management',
|
system_user: 'User Management',
|
||||||
'system_user-detail': 'User Detail',
|
'system_user-detail': 'User Detail',
|
||||||
system_role: 'Role Management',
|
system_role: 'Role Management',
|
||||||
@@ -192,9 +216,6 @@ const local: App.I18n.Schema = {
|
|||||||
plugin_charts_echarts: 'ECharts',
|
plugin_charts_echarts: 'ECharts',
|
||||||
plugin_charts_antv: 'AntV',
|
plugin_charts_antv: 'AntV',
|
||||||
plugin_charts_vchart: 'VChart',
|
plugin_charts_vchart: 'VChart',
|
||||||
plugin_editor: 'Editor',
|
|
||||||
plugin_editor_quill: 'Quill',
|
|
||||||
plugin_editor_markdown: 'Markdown',
|
|
||||||
plugin_icon: 'Icon',
|
plugin_icon: 'Icon',
|
||||||
plugin_map: 'Map',
|
plugin_map: 'Map',
|
||||||
plugin_print: 'Print',
|
plugin_print: 'Print',
|
||||||
@@ -488,6 +509,7 @@ const local: App.I18n.Schema = {
|
|||||||
orgType: {
|
orgType: {
|
||||||
company: 'Company',
|
company: 'Company',
|
||||||
dept: 'Department',
|
dept: 'Department',
|
||||||
|
function: 'Functional Department',
|
||||||
direction: 'Direction',
|
direction: 'Direction',
|
||||||
team: 'Team'
|
team: 'Team'
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -40,7 +40,7 @@ const local: App.I18n.Schema = {
|
|||||||
trigger: '触发',
|
trigger: '触发',
|
||||||
update: '更新',
|
update: '更新',
|
||||||
updateSuccess: '更新成功',
|
updateSuccess: '更新成功',
|
||||||
userCenter: '个人中心',
|
myProfile: '个人信息',
|
||||||
yesOrNo: {
|
yesOrNo: {
|
||||||
yes: '是',
|
yes: '是',
|
||||||
no: '否'
|
no: '否'
|
||||||
@@ -158,7 +158,24 @@ const local: App.I18n.Schema = {
|
|||||||
404: '页面不存在',
|
404: '页面不存在',
|
||||||
500: '服务器错误',
|
500: '服务器错误',
|
||||||
'iframe-page': '外链页面',
|
'iframe-page': '外链页面',
|
||||||
'user-center': '个人中心',
|
workbench: '工作台',
|
||||||
|
ticket: '工单',
|
||||||
|
'ticket_my-submitted': '我提交的工单',
|
||||||
|
'ticket_my-pending': '待我处理的工单',
|
||||||
|
metrics: '效能度量',
|
||||||
|
'metrics_project-progress': '项目进度',
|
||||||
|
'metrics_member-efficiency': '员工能效',
|
||||||
|
metrics_worktime: '工时统计',
|
||||||
|
'personal-center': '个人中心',
|
||||||
|
'personal-center_my-profile': '个人信息',
|
||||||
|
'personal-center_my-weekly': '我的周报',
|
||||||
|
'personal-center_my-monthly': '我的月报',
|
||||||
|
'personal-center_my-performance': '我的绩效',
|
||||||
|
'personal-center_my-application': '我的申请',
|
||||||
|
'personal-center_pending-approval': '待我审批',
|
||||||
|
infra: '基础设施',
|
||||||
|
'infra_state-machine': '状态机管理',
|
||||||
|
'infra_rd-code': '研发令号',
|
||||||
function: '系统功能',
|
function: '系统功能',
|
||||||
function_tab: '标签页',
|
function_tab: '标签页',
|
||||||
'function_multi-tab': '多标签页',
|
'function_multi-tab': '多标签页',
|
||||||
@@ -174,6 +191,13 @@ const local: App.I18n.Schema = {
|
|||||||
product_dashboard: '产品仪表盘',
|
product_dashboard: '产品仪表盘',
|
||||||
product_requirement: '需求池',
|
product_requirement: '需求池',
|
||||||
product_setting: '产品设置',
|
product_setting: '产品设置',
|
||||||
|
project: '项目管理',
|
||||||
|
project_list: '项目列表',
|
||||||
|
project_project: '项目详情',
|
||||||
|
project_project_overview: '项目概览',
|
||||||
|
project_project_requirement: '需求池',
|
||||||
|
project_project_execution: '任务管理',
|
||||||
|
project_project_setting: '项目设置',
|
||||||
system: '系统管理',
|
system: '系统管理',
|
||||||
system_user: '用户管理',
|
system_user: '用户管理',
|
||||||
'system_user-detail': '用户详情',
|
'system_user-detail': '用户详情',
|
||||||
@@ -192,9 +216,6 @@ const local: App.I18n.Schema = {
|
|||||||
plugin_charts_echarts: 'ECharts',
|
plugin_charts_echarts: 'ECharts',
|
||||||
plugin_charts_antv: 'AntV',
|
plugin_charts_antv: 'AntV',
|
||||||
plugin_charts_vchart: 'VChart',
|
plugin_charts_vchart: 'VChart',
|
||||||
plugin_editor: '编辑器',
|
|
||||||
plugin_editor_quill: '富文本编辑器',
|
|
||||||
plugin_editor_markdown: 'MD 编辑器',
|
|
||||||
plugin_icon: '图标',
|
plugin_icon: '图标',
|
||||||
plugin_map: '地图',
|
plugin_map: '地图',
|
||||||
plugin_print: '打印',
|
plugin_print: '打印',
|
||||||
@@ -484,6 +505,7 @@ const local: App.I18n.Schema = {
|
|||||||
orgType: {
|
orgType: {
|
||||||
company: '公司',
|
company: '公司',
|
||||||
dept: '部门',
|
dept: '部门',
|
||||||
|
function: '职能部门',
|
||||||
direction: '方向',
|
direction: '方向',
|
||||||
team: '团队'
|
team: '团队'
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,9 +1,11 @@
|
|||||||
import { extend } from 'dayjs';
|
import { extend } from 'dayjs';
|
||||||
|
import isoWeek from 'dayjs/plugin/isoWeek';
|
||||||
import localeData from 'dayjs/plugin/localeData';
|
import localeData from 'dayjs/plugin/localeData';
|
||||||
import { setDayjsLocale } from '../locales/dayjs';
|
import { setDayjsLocale } from '../locales/dayjs';
|
||||||
|
|
||||||
export function setupDayjs() {
|
export function setupDayjs() {
|
||||||
extend(localeData);
|
extend(localeData);
|
||||||
|
extend(isoWeek);
|
||||||
|
|
||||||
setDayjsLocale();
|
setDayjsLocale();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -28,13 +28,22 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
|
|||||||
"function_super-page": () => import("@/views/function/super-page/index.vue"),
|
"function_super-page": () => import("@/views/function/super-page/index.vue"),
|
||||||
function_tab: () => import("@/views/function/tab/index.vue"),
|
function_tab: () => import("@/views/function/tab/index.vue"),
|
||||||
"function_toggle-auth": () => import("@/views/function/toggle-auth/index.vue"),
|
"function_toggle-auth": () => import("@/views/function/toggle-auth/index.vue"),
|
||||||
|
"infra_rd-code": () => import("@/views/infra/rd-code/index.vue"),
|
||||||
|
"infra_state-machine": () => import("@/views/infra/state-machine/index.vue"),
|
||||||
|
"metrics_member-efficiency": () => import("@/views/metrics/member-efficiency/index.vue"),
|
||||||
|
"metrics_project-progress": () => import("@/views/metrics/project-progress/index.vue"),
|
||||||
|
metrics_worktime: () => import("@/views/metrics/worktime/index.vue"),
|
||||||
|
"personal-center_my-application": () => import("@/views/personal-center/my-application/index.vue"),
|
||||||
|
"personal-center_my-monthly": () => import("@/views/personal-center/my-monthly/index.vue"),
|
||||||
|
"personal-center_my-performance": () => import("@/views/personal-center/my-performance/index.vue"),
|
||||||
|
"personal-center_my-profile": () => import("@/views/personal-center/my-profile/index.vue"),
|
||||||
|
"personal-center_my-weekly": () => import("@/views/personal-center/my-weekly/index.vue"),
|
||||||
|
"personal-center_pending-approval": () => import("@/views/personal-center/pending-approval/index.vue"),
|
||||||
plugin_barcode: () => import("@/views/plugin/barcode/index.vue"),
|
plugin_barcode: () => import("@/views/plugin/barcode/index.vue"),
|
||||||
plugin_charts_antv: () => import("@/views/plugin/charts/antv/index.vue"),
|
plugin_charts_antv: () => import("@/views/plugin/charts/antv/index.vue"),
|
||||||
plugin_charts_echarts: () => import("@/views/plugin/charts/echarts/index.vue"),
|
plugin_charts_echarts: () => import("@/views/plugin/charts/echarts/index.vue"),
|
||||||
plugin_charts_vchart: () => import("@/views/plugin/charts/vchart/index.vue"),
|
plugin_charts_vchart: () => import("@/views/plugin/charts/vchart/index.vue"),
|
||||||
plugin_copy: () => import("@/views/plugin/copy/index.vue"),
|
plugin_copy: () => import("@/views/plugin/copy/index.vue"),
|
||||||
plugin_editor_markdown: () => import("@/views/plugin/editor/markdown/index.vue"),
|
|
||||||
plugin_editor_quill: () => import("@/views/plugin/editor/quill/index.vue"),
|
|
||||||
plugin_excel: () => import("@/views/plugin/excel/index.vue"),
|
plugin_excel: () => import("@/views/plugin/excel/index.vue"),
|
||||||
plugin_gantt_dhtmlx: () => import("@/views/plugin/gantt/dhtmlx/index.vue"),
|
plugin_gantt_dhtmlx: () => import("@/views/plugin/gantt/dhtmlx/index.vue"),
|
||||||
plugin_gantt_vtable: () => import("@/views/plugin/gantt/vtable/index.vue"),
|
plugin_gantt_vtable: () => import("@/views/plugin/gantt/vtable/index.vue"),
|
||||||
@@ -51,6 +60,11 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
|
|||||||
product_list: () => import("@/views/product/list/index.vue"),
|
product_list: () => import("@/views/product/list/index.vue"),
|
||||||
product_requirement: () => import("@/views/product/requirement/index.vue"),
|
product_requirement: () => import("@/views/product/requirement/index.vue"),
|
||||||
product_setting: () => import("@/views/product/setting/index.vue"),
|
product_setting: () => import("@/views/product/setting/index.vue"),
|
||||||
|
project_list: () => import("@/views/project/list/index.vue"),
|
||||||
|
project_project_execution: () => import("@/views/project/project/execution/index.vue"),
|
||||||
|
project_project_overview: () => import("@/views/project/project/overview/index.vue"),
|
||||||
|
project_project_requirement: () => import("@/views/project/project/requirement/index.vue"),
|
||||||
|
project_project_setting: () => import("@/views/project/project/setting/index.vue"),
|
||||||
system_dict: () => import("@/views/system/dict/index.vue"),
|
system_dict: () => import("@/views/system/dict/index.vue"),
|
||||||
system_menu: () => import("@/views/system/menu/index.vue"),
|
system_menu: () => import("@/views/system/menu/index.vue"),
|
||||||
system_post: () => import("@/views/system/post/index.vue"),
|
system_post: () => import("@/views/system/post/index.vue"),
|
||||||
@@ -58,5 +72,7 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
|
|||||||
"system_user-detail": () => import("@/views/system/user-detail/[id].vue"),
|
"system_user-detail": () => import("@/views/system/user-detail/[id].vue"),
|
||||||
"system_user-management-relation": () => import("@/views/system/user-management-relation/index.vue"),
|
"system_user-management-relation": () => import("@/views/system/user-management-relation/index.vue"),
|
||||||
system_user: () => import("@/views/system/user/index.vue"),
|
system_user: () => import("@/views/system/user/index.vue"),
|
||||||
"user-center": () => import("@/views/user-center/index.vue"),
|
"ticket_my-pending": () => import("@/views/ticket/my-pending/index.vue"),
|
||||||
|
"ticket_my-submitted": () => import("@/views/ticket/my-submitted/index.vue"),
|
||||||
|
workbench: () => import("@/views/workbench/index.vue"),
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -170,6 +170,43 @@ export const generatedRoutes: GeneratedRoute[] = [
|
|||||||
keepAlive: true
|
keepAlive: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'infra',
|
||||||
|
path: '/infra',
|
||||||
|
component: 'layout.base',
|
||||||
|
meta: {
|
||||||
|
title: 'infra',
|
||||||
|
i18nKey: 'route.infra',
|
||||||
|
icon: 'ep:monitor',
|
||||||
|
order: 20
|
||||||
|
},
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'infra_rd-code',
|
||||||
|
path: '/infra/rd-code',
|
||||||
|
component: 'view.infra_rd-code',
|
||||||
|
meta: {
|
||||||
|
title: 'infra_rd-code',
|
||||||
|
i18nKey: 'route.infra_rd-code',
|
||||||
|
icon: 'mdi:identifier',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'infra_state-machine',
|
||||||
|
path: '/infra/state-machine',
|
||||||
|
component: 'view.infra_state-machine',
|
||||||
|
meta: {
|
||||||
|
title: 'infra_state-machine',
|
||||||
|
i18nKey: 'route.infra_state-machine',
|
||||||
|
icon: 'mdi:state-machine',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: 'login',
|
name: 'login',
|
||||||
path: '/login/:module(pwd-login|reset-pwd)?',
|
path: '/login/:module(pwd-login|reset-pwd)?',
|
||||||
@@ -182,6 +219,140 @@ export const generatedRoutes: GeneratedRoute[] = [
|
|||||||
hideInMenu: true
|
hideInMenu: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'metrics',
|
||||||
|
path: '/metrics',
|
||||||
|
component: 'layout.base',
|
||||||
|
meta: {
|
||||||
|
title: 'metrics',
|
||||||
|
i18nKey: 'route.metrics',
|
||||||
|
icon: 'mdi:chart-line',
|
||||||
|
order: 7
|
||||||
|
},
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'metrics_member-efficiency',
|
||||||
|
path: '/metrics/member-efficiency',
|
||||||
|
component: 'view.metrics_member-efficiency',
|
||||||
|
meta: {
|
||||||
|
title: 'metrics_member-efficiency',
|
||||||
|
i18nKey: 'route.metrics_member-efficiency',
|
||||||
|
icon: 'mdi:account-multiple-check-outline',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'metrics_project-progress',
|
||||||
|
path: '/metrics/project-progress',
|
||||||
|
component: 'view.metrics_project-progress',
|
||||||
|
meta: {
|
||||||
|
title: 'metrics_project-progress',
|
||||||
|
i18nKey: 'route.metrics_project-progress',
|
||||||
|
icon: 'mdi:progress-clock',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'metrics_worktime',
|
||||||
|
path: '/metrics/worktime',
|
||||||
|
component: 'view.metrics_worktime',
|
||||||
|
meta: {
|
||||||
|
title: 'metrics_worktime',
|
||||||
|
i18nKey: 'route.metrics_worktime',
|
||||||
|
icon: 'mdi:clock-time-five-outline',
|
||||||
|
order: 3,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'personal-center',
|
||||||
|
path: '/personal-center',
|
||||||
|
component: 'layout.base',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center',
|
||||||
|
i18nKey: 'route.personal-center',
|
||||||
|
icon: 'mdi:account-circle-outline',
|
||||||
|
order: 8
|
||||||
|
},
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'personal-center_my-application',
|
||||||
|
path: '/personal-center/my-application',
|
||||||
|
component: 'view.personal-center_my-application',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center_my-application',
|
||||||
|
i18nKey: 'route.personal-center_my-application',
|
||||||
|
icon: 'mdi:file-document-outline',
|
||||||
|
order: 4,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'personal-center_my-monthly',
|
||||||
|
path: '/personal-center/my-monthly',
|
||||||
|
component: 'view.personal-center_my-monthly',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center_my-monthly',
|
||||||
|
i18nKey: 'route.personal-center_my-monthly',
|
||||||
|
icon: 'mdi:calendar-month-outline',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'personal-center_my-performance',
|
||||||
|
path: '/personal-center/my-performance',
|
||||||
|
component: 'view.personal-center_my-performance',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center_my-performance',
|
||||||
|
i18nKey: 'route.personal-center_my-performance',
|
||||||
|
icon: 'mdi:trophy-outline',
|
||||||
|
order: 3,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'personal-center_my-profile',
|
||||||
|
path: '/personal-center/my-profile',
|
||||||
|
component: 'view.personal-center_my-profile',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center_my-profile',
|
||||||
|
i18nKey: 'route.personal-center_my-profile',
|
||||||
|
icon: 'mdi:account-box-outline',
|
||||||
|
order: 0,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'personal-center_my-weekly',
|
||||||
|
path: '/personal-center/my-weekly',
|
||||||
|
component: 'view.personal-center_my-weekly',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center_my-weekly',
|
||||||
|
i18nKey: 'route.personal-center_my-weekly',
|
||||||
|
icon: 'mdi:calendar-week-outline',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'personal-center_pending-approval',
|
||||||
|
path: '/personal-center/pending-approval',
|
||||||
|
component: 'view.personal-center_pending-approval',
|
||||||
|
meta: {
|
||||||
|
title: 'personal-center_pending-approval',
|
||||||
|
i18nKey: 'route.personal-center_pending-approval',
|
||||||
|
icon: 'mdi:check-decagram-outline',
|
||||||
|
order: 5,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: 'plugin',
|
name: 'plugin',
|
||||||
path: '/plugin',
|
path: '/plugin',
|
||||||
@@ -254,37 +425,6 @@ export const generatedRoutes: GeneratedRoute[] = [
|
|||||||
icon: 'mdi:clipboard-outline'
|
icon: 'mdi:clipboard-outline'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
|
||||||
name: 'plugin_editor',
|
|
||||||
path: '/plugin/editor',
|
|
||||||
meta: {
|
|
||||||
title: 'plugin_editor',
|
|
||||||
i18nKey: 'route.plugin_editor',
|
|
||||||
icon: 'icon-park-outline:editor'
|
|
||||||
},
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: 'plugin_editor_markdown',
|
|
||||||
path: '/plugin/editor/markdown',
|
|
||||||
component: 'view.plugin_editor_markdown',
|
|
||||||
meta: {
|
|
||||||
title: 'plugin_editor_markdown',
|
|
||||||
i18nKey: 'route.plugin_editor_markdown',
|
|
||||||
icon: 'ri:markdown-line'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'plugin_editor_quill',
|
|
||||||
path: '/plugin/editor/quill',
|
|
||||||
component: 'view.plugin_editor_quill',
|
|
||||||
meta: {
|
|
||||||
title: 'plugin_editor_quill',
|
|
||||||
i18nKey: 'route.plugin_editor_quill',
|
|
||||||
icon: 'mdi:file-document-edit-outline'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: 'plugin_excel',
|
name: 'plugin_excel',
|
||||||
path: '/plugin/excel',
|
path: '/plugin/excel',
|
||||||
@@ -488,6 +628,87 @@ export const generatedRoutes: GeneratedRoute[] = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'project',
|
||||||
|
path: '/project',
|
||||||
|
component: 'layout.base',
|
||||||
|
meta: {
|
||||||
|
title: 'project',
|
||||||
|
i18nKey: 'route.project',
|
||||||
|
icon: 'mdi:briefcase-outline',
|
||||||
|
order: 5
|
||||||
|
},
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'project_list',
|
||||||
|
path: '/project/list',
|
||||||
|
component: 'view.project_list',
|
||||||
|
meta: {
|
||||||
|
title: 'project_list',
|
||||||
|
i18nKey: 'route.project_list',
|
||||||
|
icon: 'material-symbols:view-list-outline-rounded',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'project_project',
|
||||||
|
path: '/project/project',
|
||||||
|
meta: {
|
||||||
|
title: 'project_project',
|
||||||
|
i18nKey: 'route.project_project',
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
},
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'project_project_execution',
|
||||||
|
path: '/project/project/execution',
|
||||||
|
component: 'view.project_project_execution',
|
||||||
|
meta: {
|
||||||
|
title: 'project_project_execution',
|
||||||
|
i18nKey: 'route.project_project_execution',
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'project_project_overview',
|
||||||
|
path: '/project/project/overview',
|
||||||
|
component: 'view.project_project_overview',
|
||||||
|
meta: {
|
||||||
|
title: 'project_project_overview',
|
||||||
|
i18nKey: 'route.project_project_overview',
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'project_project_requirement',
|
||||||
|
path: '/project/project/requirement',
|
||||||
|
component: 'view.project_project_requirement',
|
||||||
|
meta: {
|
||||||
|
title: 'project_project_requirement',
|
||||||
|
i18nKey: 'route.project_project_requirement',
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'project_project_setting',
|
||||||
|
path: '/project/project/setting',
|
||||||
|
component: 'view.project_project_setting',
|
||||||
|
meta: {
|
||||||
|
title: 'project_project_setting',
|
||||||
|
i18nKey: 'route.project_project_setting',
|
||||||
|
hideInMenu: true,
|
||||||
|
activeMenu: 'project_list'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: 'system',
|
name: 'system',
|
||||||
path: '/system',
|
path: '/system',
|
||||||
@@ -583,13 +804,53 @@ export const generatedRoutes: GeneratedRoute[] = [
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'user-center',
|
name: 'ticket',
|
||||||
path: '/user-center',
|
path: '/ticket',
|
||||||
component: 'layout.base$view.user-center',
|
component: 'layout.base',
|
||||||
meta: {
|
meta: {
|
||||||
title: 'user-center',
|
title: 'ticket',
|
||||||
i18nKey: 'route.user-center',
|
i18nKey: 'route.ticket',
|
||||||
hideInMenu: true
|
icon: 'mdi:ticket-confirmation-outline',
|
||||||
|
order: 6
|
||||||
|
},
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'ticket_my-pending',
|
||||||
|
path: '/ticket/my-pending',
|
||||||
|
component: 'view.ticket_my-pending',
|
||||||
|
meta: {
|
||||||
|
title: 'ticket_my-pending',
|
||||||
|
i18nKey: 'route.ticket_my-pending',
|
||||||
|
icon: 'mdi:inbox-arrow-down-outline',
|
||||||
|
order: 2,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'ticket_my-submitted',
|
||||||
|
path: '/ticket/my-submitted',
|
||||||
|
component: 'view.ticket_my-submitted',
|
||||||
|
meta: {
|
||||||
|
title: 'ticket_my-submitted',
|
||||||
|
i18nKey: 'route.ticket_my-submitted',
|
||||||
|
icon: 'mdi:upload-outline',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'workbench',
|
||||||
|
path: '/workbench',
|
||||||
|
component: 'layout.base$view.workbench',
|
||||||
|
meta: {
|
||||||
|
title: 'workbench',
|
||||||
|
i18nKey: 'route.workbench',
|
||||||
|
icon: 'mdi:view-dashboard-outline',
|
||||||
|
order: 1,
|
||||||
|
keepAlive: true,
|
||||||
|
constant: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|||||||
@@ -181,7 +181,21 @@ const routeMap: RouteMap = {
|
|||||||
"function_tab": "/function/tab",
|
"function_tab": "/function/tab",
|
||||||
"function_toggle-auth": "/function/toggle-auth",
|
"function_toggle-auth": "/function/toggle-auth",
|
||||||
"iframe-page": "/iframe-page/:url",
|
"iframe-page": "/iframe-page/:url",
|
||||||
|
"infra": "/infra",
|
||||||
|
"infra_rd-code": "/infra/rd-code",
|
||||||
|
"infra_state-machine": "/infra/state-machine",
|
||||||
"login": "/login/:module(pwd-login|reset-pwd)?",
|
"login": "/login/:module(pwd-login|reset-pwd)?",
|
||||||
|
"metrics": "/metrics",
|
||||||
|
"metrics_member-efficiency": "/metrics/member-efficiency",
|
||||||
|
"metrics_project-progress": "/metrics/project-progress",
|
||||||
|
"metrics_worktime": "/metrics/worktime",
|
||||||
|
"personal-center": "/personal-center",
|
||||||
|
"personal-center_my-application": "/personal-center/my-application",
|
||||||
|
"personal-center_my-monthly": "/personal-center/my-monthly",
|
||||||
|
"personal-center_my-performance": "/personal-center/my-performance",
|
||||||
|
"personal-center_my-profile": "/personal-center/my-profile",
|
||||||
|
"personal-center_my-weekly": "/personal-center/my-weekly",
|
||||||
|
"personal-center_pending-approval": "/personal-center/pending-approval",
|
||||||
"plugin": "/plugin",
|
"plugin": "/plugin",
|
||||||
"plugin_barcode": "/plugin/barcode",
|
"plugin_barcode": "/plugin/barcode",
|
||||||
"plugin_charts": "/plugin/charts",
|
"plugin_charts": "/plugin/charts",
|
||||||
@@ -189,9 +203,6 @@ const routeMap: RouteMap = {
|
|||||||
"plugin_charts_echarts": "/plugin/charts/echarts",
|
"plugin_charts_echarts": "/plugin/charts/echarts",
|
||||||
"plugin_charts_vchart": "/plugin/charts/vchart",
|
"plugin_charts_vchart": "/plugin/charts/vchart",
|
||||||
"plugin_copy": "/plugin/copy",
|
"plugin_copy": "/plugin/copy",
|
||||||
"plugin_editor": "/plugin/editor",
|
|
||||||
"plugin_editor_markdown": "/plugin/editor/markdown",
|
|
||||||
"plugin_editor_quill": "/plugin/editor/quill",
|
|
||||||
"plugin_excel": "/plugin/excel",
|
"plugin_excel": "/plugin/excel",
|
||||||
"plugin_gantt": "/plugin/gantt",
|
"plugin_gantt": "/plugin/gantt",
|
||||||
"plugin_gantt_dhtmlx": "/plugin/gantt/dhtmlx",
|
"plugin_gantt_dhtmlx": "/plugin/gantt/dhtmlx",
|
||||||
@@ -211,6 +222,13 @@ const routeMap: RouteMap = {
|
|||||||
"product_list": "/product/list",
|
"product_list": "/product/list",
|
||||||
"product_requirement": "/product/requirement",
|
"product_requirement": "/product/requirement",
|
||||||
"product_setting": "/product/setting",
|
"product_setting": "/product/setting",
|
||||||
|
"project": "/project",
|
||||||
|
"project_list": "/project/list",
|
||||||
|
"project_project": "/project/project",
|
||||||
|
"project_project_execution": "/project/project/execution",
|
||||||
|
"project_project_overview": "/project/project/overview",
|
||||||
|
"project_project_requirement": "/project/project/requirement",
|
||||||
|
"project_project_setting": "/project/project/setting",
|
||||||
"system": "/system",
|
"system": "/system",
|
||||||
"system_dict": "/system/dict",
|
"system_dict": "/system/dict",
|
||||||
"system_menu": "/system/menu",
|
"system_menu": "/system/menu",
|
||||||
@@ -219,7 +237,10 @@ const routeMap: RouteMap = {
|
|||||||
"system_user": "/system/user",
|
"system_user": "/system/user",
|
||||||
"system_user-detail": "/system/user-detail/:id",
|
"system_user-detail": "/system/user-detail/:id",
|
||||||
"system_user-management-relation": "/system/user-management-relation",
|
"system_user-management-relation": "/system/user-management-relation",
|
||||||
"user-center": "/user-center"
|
"ticket": "/ticket",
|
||||||
|
"ticket_my-pending": "/ticket/my-pending",
|
||||||
|
"ticket_my-submitted": "/ticket/my-submitted",
|
||||||
|
"workbench": "/workbench"
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { SYSTEM_SERVICE_PREFIX } from '@/constants/service';
|
import { SYSTEM_SERVICE_PREFIX } from '@/constants/service';
|
||||||
import { request } from '../request';
|
import { request } from '../request';
|
||||||
import { clearUserRouteCache } from './route';
|
import { clearUserRouteCache } from './route';
|
||||||
import type { ServiceRequestResult } from './shared';
|
import { type ServiceRequestResult, mapServiceResult, normalizeStringId } from './shared';
|
||||||
|
|
||||||
/** 后端登录返回 */
|
/** 后端登录返回 */
|
||||||
interface BackendLoginToken {
|
interface BackendLoginToken {
|
||||||
@@ -14,10 +14,38 @@ interface BackendLoginToken {
|
|||||||
interface BackendUserInfoDTO {
|
interface BackendUserInfoDTO {
|
||||||
userId: string | number;
|
userId: string | number;
|
||||||
userName?: string | null;
|
userName?: string | null;
|
||||||
|
nickname?: string | null;
|
||||||
roles?: string[] | null;
|
roles?: string[] | null;
|
||||||
buttons?: string[] | null;
|
buttons?: string[] | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface BackendMyProfileDetailDTO {
|
||||||
|
id?: string | number | null;
|
||||||
|
userId?: string | number | null;
|
||||||
|
username?: string | null;
|
||||||
|
userName?: string | null;
|
||||||
|
nickname?: string | null;
|
||||||
|
company?: string | null;
|
||||||
|
email?: string | null;
|
||||||
|
mobile?: string | null;
|
||||||
|
sex?: Api.SystemManage.UserGender | null;
|
||||||
|
avatar?: string | null;
|
||||||
|
loginIp?: string | null;
|
||||||
|
loginDate?: string | null;
|
||||||
|
createTime?: string | null;
|
||||||
|
roles?: Api.SystemManage.RoleSimple[] | null;
|
||||||
|
dept?: Api.SystemManage.DeptSimple | null;
|
||||||
|
position?: Api.SystemManage.PostSimple | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface BackendFileDTO {
|
||||||
|
id: string | number;
|
||||||
|
configId: string | number;
|
||||||
|
name?: string | null;
|
||||||
|
path: string;
|
||||||
|
url: string;
|
||||||
|
}
|
||||||
|
|
||||||
let userInfoPromise: Promise<ServiceRequestResult<BackendUserInfoDTO>> | null = null;
|
let userInfoPromise: Promise<ServiceRequestResult<BackendUserInfoDTO>> | null = null;
|
||||||
|
|
||||||
/** 将后端 token 结构转换成前端现有结构 */
|
/** 将后端 token 结构转换成前端现有结构 */
|
||||||
@@ -32,11 +60,48 @@ function mapUserInfo(data: BackendUserInfoDTO): Api.Auth.UserInfo {
|
|||||||
return {
|
return {
|
||||||
userId: String(data.userId ?? ''),
|
userId: String(data.userId ?? ''),
|
||||||
userName: data.userName ?? '',
|
userName: data.userName ?? '',
|
||||||
|
nickname: data.nickname ?? '',
|
||||||
roles: data.roles ?? [],
|
roles: data.roles ?? [],
|
||||||
buttons: data.buttons ?? []
|
buttons: data.buttons ?? []
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function safeStringId(value: string | number | null | undefined): string | null {
|
||||||
|
return value === null || value === undefined ? null : String(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
// eslint-disable-next-line complexity
|
||||||
|
function mapMyProfileDetail(data: BackendMyProfileDetailDTO, fallbackUserId = ''): Api.Auth.MyProfileDetail {
|
||||||
|
const baseInfo = {
|
||||||
|
userId: String(data.id ?? data.userId ?? fallbackUserId ?? ''),
|
||||||
|
username: data.username ?? data.userName ?? '',
|
||||||
|
nickname: data.nickname ?? '',
|
||||||
|
deptId: safeStringId(data.dept?.id),
|
||||||
|
deptName: data.dept?.name ?? '',
|
||||||
|
positionId: safeStringId(data.position?.id),
|
||||||
|
positionName: data.position?.name ?? ''
|
||||||
|
};
|
||||||
|
|
||||||
|
const contactInfo = {
|
||||||
|
company: data.company ?? null,
|
||||||
|
email: data.email ?? '',
|
||||||
|
mobile: data.mobile ?? '',
|
||||||
|
sex: data.sex ?? 0,
|
||||||
|
avatar: data.avatar ?? ''
|
||||||
|
};
|
||||||
|
|
||||||
|
const extraInfo = {
|
||||||
|
roles: data.roles ?? [],
|
||||||
|
dept: data.dept ?? null,
|
||||||
|
position: data.position ?? null,
|
||||||
|
loginIp: data.loginIp ?? '',
|
||||||
|
loginDate: data.loginDate ?? null,
|
||||||
|
createTime: data.createTime ?? null
|
||||||
|
};
|
||||||
|
|
||||||
|
return { ...baseInfo, ...contactInfo, ...extraInfo };
|
||||||
|
}
|
||||||
|
|
||||||
export function clearUserInfoCache() {
|
export function clearUserInfoCache() {
|
||||||
userInfoPromise = null;
|
userInfoPromise = null;
|
||||||
}
|
}
|
||||||
@@ -99,19 +164,88 @@ export async function fetchGetUserInfo(force = false): Promise<ServiceRequestRes
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 获取当前登录人资料详情 */
|
||||||
|
export async function fetchGetMyProfileDetail(
|
||||||
|
options: {
|
||||||
|
userId?: string;
|
||||||
|
} = {}
|
||||||
|
): Promise<ServiceRequestResult<Api.Auth.MyProfileDetail>> {
|
||||||
|
const result = await request<BackendMyProfileDetailDTO>({
|
||||||
|
url: `${SYSTEM_SERVICE_PREFIX}/user/profile/get`,
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
|
||||||
|
if (result.error || !result.data) {
|
||||||
|
return result as ServiceRequestResult<Api.Auth.MyProfileDetail>;
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
...result,
|
||||||
|
data: mapMyProfileDetail(result.data, options.userId ?? '')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 更新当前登录人基础资料 */
|
||||||
|
export function fetchUpdateMyProfile(data: Api.Auth.UpdateMyProfileParams) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${SYSTEM_SERVICE_PREFIX}/user/profile/update`,
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 修改当前登录人密码 */
|
||||||
|
export async function fetchUpdateMyAvatar(file: File) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file);
|
||||||
|
|
||||||
|
const result = await request<BackendFileDTO>({
|
||||||
|
url: `${SYSTEM_SERVICE_PREFIX}/user/profile/update-avatar`,
|
||||||
|
method: 'put',
|
||||||
|
data: formData
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<BackendFileDTO>, data => ({
|
||||||
|
...data,
|
||||||
|
id: normalizeStringId(data.id),
|
||||||
|
configId: normalizeStringId(data.configId)
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchUpdateMyPassword(data: Api.Auth.UpdateMyPasswordParams) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${SYSTEM_SERVICE_PREFIX}/user/profile/update-password`,
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 刷新 token
|
* 刷新 token
|
||||||
*
|
*
|
||||||
* @param refreshToken 刷新 token
|
* @param refreshToken 刷新 token
|
||||||
*/
|
*/
|
||||||
export function fetchRefreshToken(refreshToken: string) {
|
export async function fetchRefreshToken(refreshToken: string): Promise<ServiceRequestResult<Api.Auth.LoginToken>> {
|
||||||
return request<Api.Auth.LoginToken>({
|
// 后端要求 refreshToken 通过 query 参数传递,且 Content-Type 为 form-urlencoded
|
||||||
|
// skipAuth: 不注入过期 access 头,否则会被网关拦下死循环(网关一律校验 Authorization,不看 PermitAll)
|
||||||
|
const result = await request<BackendLoginToken>({
|
||||||
url: `${SYSTEM_SERVICE_PREFIX}/auth/refresh-token`,
|
url: `${SYSTEM_SERVICE_PREFIX}/auth/refresh-token`,
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: {
|
params: { refreshToken },
|
||||||
refreshToken
|
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
||||||
}
|
skipAuth: true,
|
||||||
|
suppressErrorMessage: true,
|
||||||
|
skipTokenRefresh: true
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (result.error || !result.data) {
|
||||||
|
return result as ServiceRequestResult<Api.Auth.LoginToken>;
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
...result,
|
||||||
|
data: mapLoginToken(result.data)
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
88
src/service/api/file.ts
Normal file
88
src/service/api/file.ts
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
import { SYSTEM_SERVICE_PREFIX } from '@/constants/service';
|
||||||
|
import { request } from '../request';
|
||||||
|
import { type ServiceRequestResult, mapServiceResult } from './shared';
|
||||||
|
|
||||||
|
const FILE_PREFIX = `${SYSTEM_SERVICE_PREFIX}/file`;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 拼接文件永久代理路径,用于富文本 <img src>。
|
||||||
|
*
|
||||||
|
* 后端 GET 接口匿名访问、Content-Disposition: inline,私有桶下也不会过期。
|
||||||
|
* 调用方拿到上传响应里的 configId + path 后直接调用本函数得到可写入 HTML 的 url。
|
||||||
|
*/
|
||||||
|
export function buildFileProxyUrl(configId: string, path: string) {
|
||||||
|
return `${FILE_PREFIX}/${configId}/get/${encodeURI(path)}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface UploadFileResult {
|
||||||
|
/** infra_file.id 的字符串形式(避免 Long 精度丢失) */
|
||||||
|
id: string;
|
||||||
|
/** 对象存储配置编号(字符串形式),与 path 一起拼接永久代理路径 */
|
||||||
|
configId: string;
|
||||||
|
/** 文件相对路径(含日期目录、文件名),与 configId 一起拼接永久代理路径 */
|
||||||
|
path: string;
|
||||||
|
/**
|
||||||
|
* 文件访问 URL:私有桶带签名(24h 过期)、公开桶裸 URL。
|
||||||
|
* ⚠️ 仅供后端调试 / 历史兼容,禁止写进富文本 <img src> —— 会随签名过期导致回显失效。
|
||||||
|
* 富文本图片请用 buildFileProxyUrl(configId, path) 的返回值。
|
||||||
|
*/
|
||||||
|
url: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
type UploadFileResponse = {
|
||||||
|
id: string | number;
|
||||||
|
configId: string | number;
|
||||||
|
path: string;
|
||||||
|
url: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 上传文件(模式一:后端中转) */
|
||||||
|
export async function uploadFile(file: File, directory?: string) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file);
|
||||||
|
if (directory) {
|
||||||
|
formData.append('directory', directory);
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = await request<UploadFileResponse>({
|
||||||
|
url: `${FILE_PREFIX}/upload`,
|
||||||
|
method: 'post',
|
||||||
|
data: formData
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<UploadFileResponse>, data => ({
|
||||||
|
id: String(data.id),
|
||||||
|
configId: String(data.configId),
|
||||||
|
path: data.path,
|
||||||
|
url: data.url
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除文件
|
||||||
|
*
|
||||||
|
* 业务表单"取消/关闭/标记删除"场景调用本接口清理孤儿文件。
|
||||||
|
* 删除已不存在的文件(后端返回错误码 `1001003001`)应由调用方视为成功并吞掉。
|
||||||
|
*/
|
||||||
|
export function deleteFile(id: string) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${FILE_PREFIX}/delete`,
|
||||||
|
method: 'delete',
|
||||||
|
params: { id }
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 下载文件(流)
|
||||||
|
*
|
||||||
|
* 走后端代理接口 `/system/file/download?id=xxx`,由后端读取对象存储并以字节流返回。
|
||||||
|
* 私有桶下不要直接打开 `infra_file.url`,签名地址会过期。
|
||||||
|
*/
|
||||||
|
export function downloadFile(id: string) {
|
||||||
|
return request<Blob, 'blob'>({
|
||||||
|
url: `${FILE_PREFIX}/download`,
|
||||||
|
method: 'get',
|
||||||
|
params: { id },
|
||||||
|
responseType: 'blob'
|
||||||
|
});
|
||||||
|
}
|
||||||
@@ -1,6 +1,10 @@
|
|||||||
export * from './auth';
|
export * from './auth';
|
||||||
export * from './dict';
|
export * from './dict';
|
||||||
|
export * from './file';
|
||||||
|
export * from './infra';
|
||||||
export * from './object-context';
|
export * from './object-context';
|
||||||
export * from './product';
|
export * from './product';
|
||||||
|
export * from './project';
|
||||||
|
export * from './project-shared';
|
||||||
export * from './route';
|
export * from './route';
|
||||||
export * from './system-manage';
|
export * from './system-manage';
|
||||||
|
|||||||
208
src/service/api/infra.ts
Normal file
208
src/service/api/infra.ts
Normal file
@@ -0,0 +1,208 @@
|
|||||||
|
import { WEB_SERVICE_PREFIX } from '@/constants/service';
|
||||||
|
import { request } from '../request';
|
||||||
|
import { type ServiceRequestResult, mapServiceResult, normalizeStringId, safeJsonRequestConfig } from './shared';
|
||||||
|
|
||||||
|
const OBJECT_STATUS_MODEL_PREFIX = `${WEB_SERVICE_PREFIX}/project/status/model`;
|
||||||
|
const OBJECT_STATUS_TRANSITION_PREFIX = `${WEB_SERVICE_PREFIX}/project/status/transition`;
|
||||||
|
|
||||||
|
type ObjectStatusModelResponse = Omit<
|
||||||
|
Api.Infra.ObjectStatusModel,
|
||||||
|
| 'id'
|
||||||
|
| 'initialFlag'
|
||||||
|
| 'terminalFlag'
|
||||||
|
| 'allowEdit'
|
||||||
|
| 'progressExcludedFlag'
|
||||||
|
| 'allowCreateProject'
|
||||||
|
| 'allowCreateRequirement'
|
||||||
|
> & {
|
||||||
|
id: string | number;
|
||||||
|
initialFlag: boolean | number | string | null | undefined;
|
||||||
|
terminalFlag: boolean | number | string | null | undefined;
|
||||||
|
allowEdit: boolean | number | string | null | undefined;
|
||||||
|
progressExcludedFlag: boolean | number | string | null | undefined;
|
||||||
|
allowCreateProject: boolean | number | string | null | undefined;
|
||||||
|
allowCreateRequirement: boolean | number | string | null | undefined;
|
||||||
|
};
|
||||||
|
|
||||||
|
type ObjectStatusTransitionResponse = Omit<Api.Infra.ObjectStatusTransition, 'id' | 'needReason'> & {
|
||||||
|
id: string | number;
|
||||||
|
needReason: boolean | number | string | null | undefined;
|
||||||
|
};
|
||||||
|
|
||||||
|
type ObjectStatusModelPageResponse = Api.Infra.PageResult<ObjectStatusModelResponse>;
|
||||||
|
|
||||||
|
type ObjectStatusTransitionPageResponse = Api.Infra.PageResult<ObjectStatusTransitionResponse>;
|
||||||
|
|
||||||
|
function createBatchDeleteQuery(ids: string[]) {
|
||||||
|
const query = new URLSearchParams();
|
||||||
|
|
||||||
|
ids.forEach(id => {
|
||||||
|
query.append('ids', id);
|
||||||
|
});
|
||||||
|
|
||||||
|
return query.toString();
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeBooleanFlag(value: boolean | number | string | null | undefined) {
|
||||||
|
if (typeof value === 'boolean') {
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof value === 'number') {
|
||||||
|
return value === 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof value === 'string') {
|
||||||
|
const normalized = value.trim().toLowerCase();
|
||||||
|
|
||||||
|
if (!normalized || normalized === '0' || normalized === 'false' || normalized === 'n') {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeObjectStatusModel(model: ObjectStatusModelResponse): Api.Infra.ObjectStatusModel {
|
||||||
|
return {
|
||||||
|
...model,
|
||||||
|
id: normalizeStringId(model.id),
|
||||||
|
initialFlag: normalizeBooleanFlag(model.initialFlag),
|
||||||
|
terminalFlag: normalizeBooleanFlag(model.terminalFlag),
|
||||||
|
allowEdit: normalizeBooleanFlag(model.allowEdit),
|
||||||
|
progressExcludedFlag: normalizeBooleanFlag(model.progressExcludedFlag),
|
||||||
|
allowCreateProject: normalizeBooleanFlag(model.allowCreateProject),
|
||||||
|
allowCreateRequirement: normalizeBooleanFlag(model.allowCreateRequirement)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeObjectStatusTransition(transition: ObjectStatusTransitionResponse): Api.Infra.ObjectStatusTransition {
|
||||||
|
return {
|
||||||
|
...transition,
|
||||||
|
id: normalizeStringId(transition.id),
|
||||||
|
needReason: normalizeBooleanFlag(transition.needReason)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function fetchGetObjectStatusModelPage(params?: Api.Infra.ObjectStatusModelSearchParams) {
|
||||||
|
const result = await request<ObjectStatusModelPageResponse>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${OBJECT_STATUS_MODEL_PREFIX}/page`,
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<ObjectStatusModelPageResponse>, data => ({
|
||||||
|
...data,
|
||||||
|
list: data.list.map(normalizeObjectStatusModel)
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function fetchGetObjectStatusModel(id: string) {
|
||||||
|
const result = await request<ObjectStatusModelResponse>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${OBJECT_STATUS_MODEL_PREFIX}/get`,
|
||||||
|
method: 'get',
|
||||||
|
params: { id }
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<ObjectStatusModelResponse>, normalizeObjectStatusModel);
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function fetchCreateObjectStatusModel(data: Api.Infra.SaveObjectStatusModelParams) {
|
||||||
|
const result = await request<string | number>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${OBJECT_STATUS_MODEL_PREFIX}/create`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchUpdateObjectStatusModel(data: { id: string } & Api.Infra.SaveObjectStatusModelParams) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${OBJECT_STATUS_MODEL_PREFIX}/update`,
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchDeleteObjectStatusModel(id: string) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${OBJECT_STATUS_MODEL_PREFIX}/delete`,
|
||||||
|
method: 'delete',
|
||||||
|
params: { id }
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchBatchDeleteObjectStatusModel(ids: string[]) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${OBJECT_STATUS_MODEL_PREFIX}/delete-list?${createBatchDeleteQuery(ids)}`,
|
||||||
|
method: 'delete'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function fetchGetObjectStatusTransitionPage(params?: Api.Infra.ObjectStatusTransitionSearchParams) {
|
||||||
|
const result = await request<ObjectStatusTransitionPageResponse>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${OBJECT_STATUS_TRANSITION_PREFIX}/page`,
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<ObjectStatusTransitionPageResponse>, data => ({
|
||||||
|
...data,
|
||||||
|
list: data.list.map(normalizeObjectStatusTransition)
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function fetchGetObjectStatusTransition(id: string) {
|
||||||
|
const result = await request<ObjectStatusTransitionResponse>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${OBJECT_STATUS_TRANSITION_PREFIX}/get`,
|
||||||
|
method: 'get',
|
||||||
|
params: { id }
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(
|
||||||
|
result as ServiceRequestResult<ObjectStatusTransitionResponse>,
|
||||||
|
normalizeObjectStatusTransition
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function fetchCreateObjectStatusTransition(data: Api.Infra.SaveObjectStatusTransitionParams) {
|
||||||
|
const result = await request<string | number>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${OBJECT_STATUS_TRANSITION_PREFIX}/create`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchUpdateObjectStatusTransition(data: { id: string } & Api.Infra.SaveObjectStatusTransitionParams) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${OBJECT_STATUS_TRANSITION_PREFIX}/update`,
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchDeleteObjectStatusTransition(id: string) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${OBJECT_STATUS_TRANSITION_PREFIX}/delete`,
|
||||||
|
method: 'delete',
|
||||||
|
params: { id }
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fetchBatchDeleteObjectStatusTransition(ids: string[]) {
|
||||||
|
return request<boolean>({
|
||||||
|
url: `${OBJECT_STATUS_TRANSITION_PREFIX}/delete-list?${createBatchDeleteQuery(ids)}`,
|
||||||
|
method: 'delete'
|
||||||
|
});
|
||||||
|
}
|
||||||
199
src/service/api/object-context-normalize.ts
Normal file
199
src/service/api/object-context-normalize.ts
Normal file
@@ -0,0 +1,199 @@
|
|||||||
|
import { normalizeNullableStringId, normalizeStringId } from './shared';
|
||||||
|
|
||||||
|
export interface BackendObjectContextMenuDTO {
|
||||||
|
key?: string | null;
|
||||||
|
label?: string | null;
|
||||||
|
routeKey?: string | null;
|
||||||
|
routePath?: string | null;
|
||||||
|
id?: string | number | null;
|
||||||
|
name?: string | null;
|
||||||
|
path?: string | null;
|
||||||
|
icon?: string | null;
|
||||||
|
sort?: number | null;
|
||||||
|
children?: BackendObjectContextMenuDTO[] | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface BackendProductContextProductDTO {
|
||||||
|
id?: string | number | null;
|
||||||
|
code?: string | null;
|
||||||
|
directionCode?: string | null;
|
||||||
|
name?: string | null;
|
||||||
|
managerUserId?: string | number | null;
|
||||||
|
statusCode?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface BackendProjectContextProjectDTO {
|
||||||
|
id?: string | number | null;
|
||||||
|
projectCode?: string | null;
|
||||||
|
projectName?: string | null;
|
||||||
|
projectType?: string | null;
|
||||||
|
productId?: string | number | null;
|
||||||
|
managerUserId?: string | number | null;
|
||||||
|
statusCode?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface BackendObjectContextRoleDTO {
|
||||||
|
roleId?: string | number | null;
|
||||||
|
roleCode?: string | null;
|
||||||
|
roleName?: string | null;
|
||||||
|
guestFlag?: boolean | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface BackendObjectContextDTO {
|
||||||
|
domainKey?: string | null;
|
||||||
|
objectType?: string | null;
|
||||||
|
objectId?: string | number | null;
|
||||||
|
objectName?: string | null;
|
||||||
|
objectSummary?: Record<string, unknown> | null;
|
||||||
|
menus?: BackendObjectContextMenuDTO[] | null;
|
||||||
|
contextScopedMenus?: BackendObjectContextMenuDTO[] | null;
|
||||||
|
buttonCodes?: string[] | null;
|
||||||
|
currentProduct?: BackendProductContextProductDTO | null;
|
||||||
|
currentProject?: BackendProjectContextProjectDTO | null;
|
||||||
|
currentRole?: BackendObjectContextRoleDTO | null;
|
||||||
|
navs?: BackendObjectContextMenuDTO[] | null;
|
||||||
|
buttons?: string[] | null;
|
||||||
|
defaultRouteKey?: string | null;
|
||||||
|
defaultRoutePath?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeString(value: string | number | null | undefined) {
|
||||||
|
if (value === null || value === undefined) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
return String(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeRoutePath(path: string | null | undefined) {
|
||||||
|
const normalizedPath = normalizeString(path).trim();
|
||||||
|
|
||||||
|
if (!normalizedPath) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
if (normalizedPath.startsWith('/')) {
|
||||||
|
return normalizedPath;
|
||||||
|
}
|
||||||
|
|
||||||
|
return `/${normalizedPath}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeCurrentProduct(
|
||||||
|
product: BackendProductContextProductDTO
|
||||||
|
): Record<'id' | 'code' | 'directionCode' | 'name' | 'managerUserId' | 'statusCode', string> {
|
||||||
|
return {
|
||||||
|
id: normalizeStringId(product.id || ''),
|
||||||
|
code: normalizeString(product.code),
|
||||||
|
directionCode: normalizeString(product.directionCode),
|
||||||
|
name: normalizeString(product.name),
|
||||||
|
managerUserId: normalizeNullableStringId(product.managerUserId) ?? '',
|
||||||
|
statusCode: normalizeString(product.statusCode)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeCurrentProject(project: BackendProjectContextProjectDTO) {
|
||||||
|
return {
|
||||||
|
id: normalizeStringId(project.id || ''),
|
||||||
|
projectCode: normalizeString(project.projectCode),
|
||||||
|
projectName: normalizeString(project.projectName),
|
||||||
|
projectType: normalizeString(project.projectType),
|
||||||
|
productId: normalizeNullableStringId(project.productId),
|
||||||
|
managerUserId: normalizeNullableStringId(project.managerUserId) ?? '',
|
||||||
|
statusCode: normalizeString(project.statusCode)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeCurrentRole(role: BackendObjectContextRoleDTO) {
|
||||||
|
return {
|
||||||
|
roleId: normalizeStringId(role.roleId || ''),
|
||||||
|
roleCode: normalizeString(role.roleCode),
|
||||||
|
roleName: normalizeString(role.roleName),
|
||||||
|
guestFlag: Boolean(role.guestFlag)
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeMenu(menu: BackendObjectContextMenuDTO): App.ObjectContext.Menu {
|
||||||
|
const routeKey = normalizeString(menu.routeKey);
|
||||||
|
const routePath = normalizeRoutePath(menu.routePath || menu.path);
|
||||||
|
const key = normalizeString(menu.key || routeKey || routePath || menu.id);
|
||||||
|
|
||||||
|
return {
|
||||||
|
key,
|
||||||
|
label: normalizeString(menu.label || menu.name),
|
||||||
|
routeKey: routeKey || null,
|
||||||
|
routePath: routePath || null,
|
||||||
|
children: menu.children?.map(child => normalizeMenu(child)) || []
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function getFirstNonEmptyMenuSource(data: BackendObjectContextDTO) {
|
||||||
|
const menuSources = [data.contextScopedMenus, data.menus, data.navs];
|
||||||
|
|
||||||
|
return menuSources.find(source => Array.isArray(source) && source.length > 0) || [];
|
||||||
|
}
|
||||||
|
|
||||||
|
function getFirstRoutableMenu(menus: App.ObjectContext.Menu[]): App.ObjectContext.Menu | null {
|
||||||
|
for (const menu of menus) {
|
||||||
|
if (menu.routeKey || menu.routePath) {
|
||||||
|
return menu;
|
||||||
|
}
|
||||||
|
|
||||||
|
const firstChildMenu = menu.children?.length ? getFirstRoutableMenu(menu.children) : null;
|
||||||
|
|
||||||
|
if (firstChildMenu) {
|
||||||
|
return firstChildMenu;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeObjectSummary(data: BackendObjectContextDTO): App.ObjectContext.Summary | null {
|
||||||
|
if (data.objectSummary) {
|
||||||
|
return data.objectSummary;
|
||||||
|
}
|
||||||
|
|
||||||
|
const summary: App.ObjectContext.Summary = {};
|
||||||
|
|
||||||
|
if (data.currentProduct) {
|
||||||
|
summary.currentProduct = normalizeCurrentProduct(data.currentProduct);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.currentProject) {
|
||||||
|
summary.currentProject = normalizeCurrentProject(data.currentProject);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.currentRole !== undefined) {
|
||||||
|
summary.currentRole = data.currentRole ? normalizeCurrentRole(data.currentRole) : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Object.keys(summary).length ? summary : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 待重构:拆 helper 以降低复杂度,暂以 disable 注释临时放行
|
||||||
|
// eslint-disable-next-line complexity
|
||||||
|
export function normalizeObjectContext(
|
||||||
|
config: App.ObjectContext.DomainConfig,
|
||||||
|
objectId: string,
|
||||||
|
data: BackendObjectContextDTO
|
||||||
|
): Api.ObjectContext.ContextInfo {
|
||||||
|
const rawMenus = getFirstNonEmptyMenuSource(data);
|
||||||
|
const contextScopedMenus = rawMenus.map(menu => normalizeMenu(menu));
|
||||||
|
const firstRoutableMenu = getFirstRoutableMenu(contextScopedMenus);
|
||||||
|
const currentProduct = data.currentProduct ? normalizeCurrentProduct(data.currentProduct) : null;
|
||||||
|
const currentProject = data.currentProject ? normalizeCurrentProject(data.currentProject) : null;
|
||||||
|
|
||||||
|
return {
|
||||||
|
domainKey: (data.domainKey || config.domainKey) as App.ObjectContext.DomainKey,
|
||||||
|
objectType: (data.objectType || config.objectType) as App.ObjectContext.ObjectType,
|
||||||
|
objectId: normalizeString(data.objectId) || currentProduct?.id || currentProject?.id || objectId,
|
||||||
|
objectName: normalizeString(data.objectName || currentProduct?.name || currentProject?.projectName),
|
||||||
|
objectSummary: normalizeObjectSummary(data),
|
||||||
|
contextScopedMenus,
|
||||||
|
buttonCodes: data.buttonCodes ?? data.buttons ?? [],
|
||||||
|
defaultRouteKey: data.defaultRouteKey || firstRoutableMenu?.routeKey || '',
|
||||||
|
defaultRoutePath:
|
||||||
|
normalizeRoutePath(data.defaultRoutePath) || firstRoutableMenu?.routePath || config.fallbackDefaultRoutePath
|
||||||
|
};
|
||||||
|
}
|
||||||
@@ -1,145 +1,7 @@
|
|||||||
import type { LocationQueryValue } from 'vue-router';
|
import type { LocationQueryValue } from 'vue-router';
|
||||||
import { request } from '../request';
|
import { request } from '../request';
|
||||||
import {
|
import { type ServiceRequestResult, safeJsonRequestConfig } from './shared';
|
||||||
type ServiceRequestResult,
|
import { type BackendObjectContextDTO, normalizeObjectContext } from './object-context-normalize';
|
||||||
normalizeNullableStringId,
|
|
||||||
normalizeStringId,
|
|
||||||
safeJsonRequestConfig
|
|
||||||
} from './shared';
|
|
||||||
|
|
||||||
interface BackendObjectContextMenuDTO {
|
|
||||||
key?: string | null;
|
|
||||||
label?: string | null;
|
|
||||||
routeKey?: string | null;
|
|
||||||
routePath?: string | null;
|
|
||||||
id?: string | number | null;
|
|
||||||
name?: string | null;
|
|
||||||
path?: string | null;
|
|
||||||
children?: BackendObjectContextMenuDTO[] | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface BackendProductContextProductDTO {
|
|
||||||
id?: string | number | null;
|
|
||||||
code?: string | null;
|
|
||||||
directionCode?: string | null;
|
|
||||||
name?: string | null;
|
|
||||||
managerUserId?: string | number | null;
|
|
||||||
statusCode?: string | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface BackendProductContextRoleDTO {
|
|
||||||
roleId?: string | number | null;
|
|
||||||
roleCode?: string | null;
|
|
||||||
roleName?: string | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface BackendObjectContextDTO {
|
|
||||||
domainKey?: string | null;
|
|
||||||
objectType?: string | null;
|
|
||||||
objectId?: string | number | null;
|
|
||||||
objectName?: string | null;
|
|
||||||
objectSummary?: Record<string, unknown> | null;
|
|
||||||
menus?: BackendObjectContextMenuDTO[] | null;
|
|
||||||
contextScopedMenus?: BackendObjectContextMenuDTO[] | null;
|
|
||||||
buttonCodes?: string[] | null;
|
|
||||||
currentProduct?: BackendProductContextProductDTO | null;
|
|
||||||
currentRole?: BackendProductContextRoleDTO | null;
|
|
||||||
navs?: BackendObjectContextMenuDTO[] | null;
|
|
||||||
buttons?: string[] | null;
|
|
||||||
defaultRouteKey?: string | null;
|
|
||||||
defaultRoutePath?: string | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeString(value: string | number | null | undefined) {
|
|
||||||
if (value === null || value === undefined) {
|
|
||||||
return '';
|
|
||||||
}
|
|
||||||
|
|
||||||
return String(value);
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeRoutePath(path: string | null | undefined) {
|
|
||||||
const normalizedPath = normalizeString(path).trim();
|
|
||||||
|
|
||||||
if (!normalizedPath) {
|
|
||||||
return '';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (normalizedPath.startsWith('/')) {
|
|
||||||
return normalizedPath;
|
|
||||||
}
|
|
||||||
|
|
||||||
return `/${normalizedPath}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeCurrentProduct(
|
|
||||||
product: BackendProductContextProductDTO
|
|
||||||
): Record<'id' | 'code' | 'directionCode' | 'name' | 'managerUserId' | 'statusCode', string> {
|
|
||||||
return {
|
|
||||||
id: normalizeStringId(product.id || ''),
|
|
||||||
code: normalizeString(product.code),
|
|
||||||
directionCode: normalizeString(product.directionCode),
|
|
||||||
name: normalizeString(product.name),
|
|
||||||
managerUserId: normalizeNullableStringId(product.managerUserId) ?? '',
|
|
||||||
statusCode: normalizeString(product.statusCode)
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeCurrentRole(role: BackendProductContextRoleDTO) {
|
|
||||||
return {
|
|
||||||
roleId: normalizeStringId(role.roleId || ''),
|
|
||||||
roleCode: normalizeString(role.roleCode),
|
|
||||||
roleName: normalizeString(role.roleName)
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeMenu(menu: BackendObjectContextMenuDTO): App.ObjectContext.Menu {
|
|
||||||
const routeKey = normalizeString(menu.routeKey);
|
|
||||||
const routePath = normalizeRoutePath(menu.routePath || menu.path);
|
|
||||||
const key = normalizeString(menu.key || routeKey || routePath || menu.id);
|
|
||||||
|
|
||||||
return {
|
|
||||||
key,
|
|
||||||
label: normalizeString(menu.label || menu.name),
|
|
||||||
routeKey: routeKey || null,
|
|
||||||
routePath: routePath || null,
|
|
||||||
children: menu.children?.map(child => normalizeMenu(child)) || []
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function getFirstRoutableMenu(menus: App.ObjectContext.Menu[]): App.ObjectContext.Menu | null {
|
|
||||||
for (const menu of menus) {
|
|
||||||
if (menu.routeKey || menu.routePath) {
|
|
||||||
return menu;
|
|
||||||
}
|
|
||||||
|
|
||||||
const firstChildMenu = menu.children?.length ? getFirstRoutableMenu(menu.children) : null;
|
|
||||||
|
|
||||||
if (firstChildMenu) {
|
|
||||||
return firstChildMenu;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeObjectSummary(data: BackendObjectContextDTO): App.ObjectContext.Summary | null {
|
|
||||||
if (data.objectSummary) {
|
|
||||||
return data.objectSummary;
|
|
||||||
}
|
|
||||||
|
|
||||||
const summary: App.ObjectContext.Summary = {};
|
|
||||||
|
|
||||||
if (data.currentProduct) {
|
|
||||||
summary.currentProduct = normalizeCurrentProduct(data.currentProduct);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (data.currentRole !== undefined) {
|
|
||||||
summary.currentRole = data.currentRole ? normalizeCurrentRole(data.currentRole) : null;
|
|
||||||
}
|
|
||||||
|
|
||||||
return Object.keys(summary).length ? summary : null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function createContextApiUrl(config: App.ObjectContext.DomainConfig, objectId: string) {
|
function createContextApiUrl(config: App.ObjectContext.DomainConfig, objectId: string) {
|
||||||
if (config.contextApiObjectIdPlacement !== 'path') {
|
if (config.contextApiObjectIdPlacement !== 'path') {
|
||||||
@@ -151,30 +13,6 @@ function createContextApiUrl(config: App.ObjectContext.DomainConfig, objectId: s
|
|||||||
return config.contextApiPath.replace(placeholder, encodeURIComponent(objectId));
|
return config.contextApiPath.replace(placeholder, encodeURIComponent(objectId));
|
||||||
}
|
}
|
||||||
|
|
||||||
function normalizeObjectContext(
|
|
||||||
config: App.ObjectContext.DomainConfig,
|
|
||||||
objectId: string,
|
|
||||||
data: BackendObjectContextDTO
|
|
||||||
): Api.ObjectContext.ContextInfo {
|
|
||||||
const rawMenus = data.contextScopedMenus ?? data.menus ?? data.navs ?? [];
|
|
||||||
const contextScopedMenus = rawMenus.map(menu => normalizeMenu(menu));
|
|
||||||
const firstRoutableMenu = getFirstRoutableMenu(contextScopedMenus);
|
|
||||||
const currentProduct = data.currentProduct ? normalizeCurrentProduct(data.currentProduct) : null;
|
|
||||||
|
|
||||||
return {
|
|
||||||
domainKey: (data.domainKey || config.domainKey) as App.ObjectContext.DomainKey,
|
|
||||||
objectType: (data.objectType || config.objectType) as App.ObjectContext.ObjectType,
|
|
||||||
objectId: normalizeString(data.objectId) || currentProduct?.id || objectId,
|
|
||||||
objectName: normalizeString(data.objectName || currentProduct?.name),
|
|
||||||
objectSummary: normalizeObjectSummary(data),
|
|
||||||
contextScopedMenus,
|
|
||||||
buttonCodes: data.buttonCodes ?? data.buttons ?? [],
|
|
||||||
defaultRouteKey: data.defaultRouteKey || firstRoutableMenu?.routeKey || '',
|
|
||||||
defaultRoutePath:
|
|
||||||
normalizeRoutePath(data.defaultRoutePath) || firstRoutableMenu?.routePath || config.fallbackDefaultRoutePath
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
export async function fetchGetObjectContext(
|
export async function fetchGetObjectContext(
|
||||||
config: App.ObjectContext.DomainConfig,
|
config: App.ObjectContext.DomainConfig,
|
||||||
objectId: string
|
objectId: string
|
||||||
|
|||||||
@@ -91,7 +91,7 @@ function createProductActivityTimelinePageQuery(params: Api.Product.ProductActiv
|
|||||||
return query.toString();
|
return query.toString();
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 鑾峰彇浜у搧鍒嗛〉 */
|
/** 获取产品分页 */
|
||||||
export async function fetchGetProductPage(params?: Api.Product.ProductSearchParams) {
|
export async function fetchGetProductPage(params?: Api.Product.ProductSearchParams) {
|
||||||
const result = await request<ProductPageResponse>({
|
const result = await request<ProductPageResponse>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
@@ -106,7 +106,16 @@ export async function fetchGetProductPage(params?: Api.Product.ProductSearchPara
|
|||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 鑾峰彇浜у搧璇︽儏 */
|
/** 获取产品入口页概览统计 */
|
||||||
|
export function fetchGetProductOverviewSummary() {
|
||||||
|
return request<Api.Product.ProductOverviewSummary>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${PRODUCT_PREFIX}/overview-summary`,
|
||||||
|
method: 'get'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 获取产品详情 */
|
||||||
export async function fetchGetProduct(id: string) {
|
export async function fetchGetProduct(id: string) {
|
||||||
const result = await request<ProductResponse>({
|
const result = await request<ProductResponse>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
@@ -118,7 +127,7 @@ export async function fetchGetProduct(id: string) {
|
|||||||
return mapServiceResult(result as ServiceRequestResult<ProductResponse>, normalizeProduct);
|
return mapServiceResult(result as ServiceRequestResult<ProductResponse>, normalizeProduct);
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 鍒涘缓浜у搧 */
|
/** 新增产品 */
|
||||||
export async function fetchCreateProduct(data: Api.Product.SaveProductParams) {
|
export async function fetchCreateProduct(data: Api.Product.SaveProductParams) {
|
||||||
const result = await request<string | number>({
|
const result = await request<string | number>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
@@ -130,7 +139,19 @@ export async function fetchCreateProduct(data: Api.Product.SaveProductParams) {
|
|||||||
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 鏇存柊浜у搧 */
|
/** 创建产品(含初始团队,原子接口) */
|
||||||
|
export async function fetchCreateProductWithTeam(data: Api.Product.CreateProductWithTeamParams) {
|
||||||
|
const result = await request<string | number>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${PRODUCT_PREFIX}/create-with-team`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 更新产品 */
|
||||||
export function fetchUpdateProduct(data: Api.Product.UpdateProductParams) {
|
export function fetchUpdateProduct(data: Api.Product.UpdateProductParams) {
|
||||||
return request<boolean>({
|
return request<boolean>({
|
||||||
url: `${PRODUCT_PREFIX}/update`,
|
url: `${PRODUCT_PREFIX}/update`,
|
||||||
@@ -139,7 +160,7 @@ export function fetchUpdateProduct(data: Api.Product.UpdateProductParams) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 鍙樻洿浜у搧鐘舵€? */
|
/** 改变产品状态 */
|
||||||
export function fetchChangeProductStatus(data: Api.Product.ChangeProductStatusParams) {
|
export function fetchChangeProductStatus(data: Api.Product.ChangeProductStatusParams) {
|
||||||
return request<boolean>({
|
return request<boolean>({
|
||||||
url: `${PRODUCT_PREFIX}/change-status`,
|
url: `${PRODUCT_PREFIX}/change-status`,
|
||||||
@@ -148,7 +169,7 @@ export function fetchChangeProductStatus(data: Api.Product.ChangeProductStatusPa
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 鍒犻櫎浜у搧 */
|
/** 删除产品 */
|
||||||
export function fetchDeleteProduct(data: Api.Product.DeleteProductParams) {
|
export function fetchDeleteProduct(data: Api.Product.DeleteProductParams) {
|
||||||
return request<boolean>({
|
return request<boolean>({
|
||||||
url: `${PRODUCT_PREFIX}/delete`,
|
url: `${PRODUCT_PREFIX}/delete`,
|
||||||
@@ -162,7 +183,14 @@ const REQUIREMENT_PREFIX = `${WEB_SERVICE_PREFIX}/project/product/requirement`;
|
|||||||
|
|
||||||
type RequirementResponse = Omit<
|
type RequirementResponse = Omit<
|
||||||
Api.Product.Requirement,
|
Api.Product.Requirement,
|
||||||
'id' | 'parentId' | 'moduleId' | 'proposerId' | 'currentHandlerUserId' | 'implementProjectId' | 'sourceBizId'
|
| 'id'
|
||||||
|
| 'parentId'
|
||||||
|
| 'moduleId'
|
||||||
|
| 'proposerId'
|
||||||
|
| 'currentHandlerUserId'
|
||||||
|
| 'implementProjectId'
|
||||||
|
| 'sourceBizId'
|
||||||
|
| 'attachments'
|
||||||
> & {
|
> & {
|
||||||
id: string | number;
|
id: string | number;
|
||||||
parentId: string | number;
|
parentId: string | number;
|
||||||
@@ -170,12 +198,34 @@ type RequirementResponse = Omit<
|
|||||||
proposerId: string | number;
|
proposerId: string | number;
|
||||||
currentHandlerUserId?: string | number | null;
|
currentHandlerUserId?: string | number | null;
|
||||||
implementProjectId?: string | number | null;
|
implementProjectId?: string | number | null;
|
||||||
|
implementProjectName?: string | null;
|
||||||
sourceBizId?: string | number | null;
|
sourceBizId?: string | number | null;
|
||||||
|
attachments?: AttachmentItemResponse[] | null;
|
||||||
children?: RequirementResponse[];
|
children?: RequirementResponse[];
|
||||||
};
|
};
|
||||||
|
|
||||||
type RequirementPageResponse = Api.Product.PageResult<RequirementResponse>;
|
type RequirementPageResponse = Api.Product.PageResult<RequirementResponse>;
|
||||||
|
|
||||||
|
type AttachmentItemResponse = Omit<Api.Project.AttachmentItem, 'fileId'> & {
|
||||||
|
fileId?: string | number;
|
||||||
|
id?: string | number;
|
||||||
|
};
|
||||||
|
|
||||||
|
function normalizeAttachments(list?: AttachmentItemResponse[] | null): Api.Project.AttachmentItem[] | null {
|
||||||
|
if (!list) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return list.map(item => {
|
||||||
|
const rawId = item.fileId ?? item.id;
|
||||||
|
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
fileId: rawId === null || rawId === undefined ? '' : String(rawId)
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function normalizeRequirement(requirement: RequirementResponse): Api.Product.Requirement {
|
function normalizeRequirement(requirement: RequirementResponse): Api.Product.Requirement {
|
||||||
return {
|
return {
|
||||||
...requirement,
|
...requirement,
|
||||||
@@ -185,7 +235,9 @@ function normalizeRequirement(requirement: RequirementResponse): Api.Product.Req
|
|||||||
proposerId: normalizeStringId(requirement.proposerId),
|
proposerId: normalizeStringId(requirement.proposerId),
|
||||||
currentHandlerUserId: normalizeNullableStringId(requirement.currentHandlerUserId),
|
currentHandlerUserId: normalizeNullableStringId(requirement.currentHandlerUserId),
|
||||||
implementProjectId: normalizeNullableStringId(requirement.implementProjectId),
|
implementProjectId: normalizeNullableStringId(requirement.implementProjectId),
|
||||||
|
implementProjectName: requirement.implementProjectName ?? null,
|
||||||
sourceBizId: normalizeNullableStringId(requirement.sourceBizId),
|
sourceBizId: normalizeNullableStringId(requirement.sourceBizId),
|
||||||
|
attachments: normalizeAttachments(requirement.attachments),
|
||||||
children: requirement.children?.map(normalizeRequirement)
|
children: requirement.children?.map(normalizeRequirement)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -308,6 +360,25 @@ export async function fetchGetRequirementAllowedTransitions(requirementId: strin
|
|||||||
return mapServiceResult(result as ServiceRequestResult<Api.Product.RequirementLifecycleAction[]>, data => data);
|
return mapServiceResult(result as ServiceRequestResult<Api.Product.RequirementLifecycleAction[]>, data => data);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 批量获取需求可执行的状态动作列表 */
|
||||||
|
export async function fetchGetRequirementAllowedTransitionsBatch(data: Api.Product.RequirementBatchReqVO) {
|
||||||
|
const result = await request<Api.Product.RequirementAllowedTransitionBatchRespVO[]>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${REQUIREMENT_PREFIX}/allowed-transitions/batch`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(
|
||||||
|
result as ServiceRequestResult<Api.Product.RequirementAllowedTransitionBatchRespVO[]>,
|
||||||
|
data1 =>
|
||||||
|
data1.map(item => ({
|
||||||
|
requirementId: normalizeStringId(item.requirementId),
|
||||||
|
transitions: item.transitions
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
/** 获取需求生命周期信息 */
|
/** 获取需求生命周期信息 */
|
||||||
export async function fetchGetRequirementLifecycle(requirementId: string, productId: string) {
|
export async function fetchGetRequirementLifecycle(requirementId: string, productId: string) {
|
||||||
const result = await request<Api.Product.RequirementLifecycleInfo>({
|
const result = await request<Api.Product.RequirementLifecycleInfo>({
|
||||||
@@ -342,6 +413,43 @@ export async function fetchGetRequirementTerminalStatusDict() {
|
|||||||
return mapServiceResult(result as ServiceRequestResult<Api.Product.RequirementStatusDict[]>, data => data);
|
return mapServiceResult(result as ServiceRequestResult<Api.Product.RequirementStatusDict[]>, data => data);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 判断产品需求是否已分流生成项目需求 */
|
||||||
|
export async function fetchHasDispatchedProjectRequirement(requirementId: string, productId: string) {
|
||||||
|
return request<boolean>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${REQUIREMENT_PREFIX}/has-dispatched`,
|
||||||
|
method: 'get',
|
||||||
|
params: { requirementId, productId }
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 批量判断产品需求是否已分流生成项目需求 */
|
||||||
|
export async function fetchHasDispatchedProjectRequirementBatch(data: Api.Product.RequirementBatchReqVO) {
|
||||||
|
const result = await request<Api.Product.RequirementHasDispatchedBatchRespVO[]>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${REQUIREMENT_PREFIX}/has-dispatched/batch`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<Api.Product.RequirementHasDispatchedBatchRespVO[]>, data1 =>
|
||||||
|
data1.map(item => ({
|
||||||
|
requirementId: normalizeStringId(item.requirementId),
|
||||||
|
hasDispatched: Boolean(item.hasDispatched)
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 根据当前产品需求id获取对应地,所流转到项目侧的项目需求id */
|
||||||
|
export async function fetchGetDispatchedProjectLink(productRequirementId: string) {
|
||||||
|
return request<{ projectRequirementId: string; projectId: string }>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${REQUIREMENT_PREFIX}/dispatched-project-link`,
|
||||||
|
method: 'get',
|
||||||
|
params: { productRequirementId }
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// ========== 模块管理 API ==========
|
// ========== 模块管理 API ==========
|
||||||
type RequirementModuleResponse = Omit<Api.Product.RequirementModule, 'id' | 'parentId' | 'productId'> & {
|
type RequirementModuleResponse = Omit<Api.Product.RequirementModule, 'id' | 'parentId' | 'productId'> & {
|
||||||
id: string | number;
|
id: string | number;
|
||||||
@@ -466,6 +574,19 @@ export async function fetchCreateProductMember(id: string, data: Api.Product.Cre
|
|||||||
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
return mapServiceResult(result as ServiceRequestResult<string | number>, normalizeStringId);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function fetchBatchCreateProductMembers(id: string, data: Api.Product.BatchCreateProductMembersParams) {
|
||||||
|
const result = await request<Array<string | number>>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${PRODUCT_PREFIX}/${id}/members/batch`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
|
||||||
|
return mapServiceResult(result as ServiceRequestResult<Array<string | number>>, list =>
|
||||||
|
Array.isArray(list) ? list.map(normalizeStringId) : []
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
export function fetchUpdateProductMember(id: string, memberId: string, data: Api.Product.UpdateProductMemberParams) {
|
export function fetchUpdateProductMember(id: string, memberId: string, data: Api.Product.UpdateProductMemberParams) {
|
||||||
return request<boolean>({
|
return request<boolean>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
@@ -475,6 +596,15 @@ export function fetchUpdateProductMember(id: string, memberId: string, data: Api
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function fetchBatchInactiveProductMembers(id: string, data: Api.Product.BatchInactiveProductMembersParams) {
|
||||||
|
return request<boolean>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${PRODUCT_PREFIX}/${id}/members/batch/inactive`,
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
export function fetchInactiveProductMember(
|
export function fetchInactiveProductMember(
|
||||||
id: string,
|
id: string,
|
||||||
memberId: string,
|
memberId: string,
|
||||||
|
|||||||
350
src/service/api/project-shared.ts
Normal file
350
src/service/api/project-shared.ts
Normal file
@@ -0,0 +1,350 @@
|
|||||||
|
import { normalizeNullableStringId, normalizeStringId } from './shared';
|
||||||
|
|
||||||
|
type ProjectStatusCode = Api.Project.ProjectStatusCode;
|
||||||
|
type ProjectStatusActionCode = Exclude<Api.Project.ProjectStatusActionCode, 'auto_start'>;
|
||||||
|
|
||||||
|
type StringIdResponse = string | number;
|
||||||
|
|
||||||
|
export type ProjectLocalDateValue = string | number[] | null;
|
||||||
|
|
||||||
|
export type LifecycleActionResponse<ActionCode extends string> = Partial<Api.Project.LifecycleAction<ActionCode>> & {
|
||||||
|
actionCode: ActionCode;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ProjectExecutionResponse = Omit<
|
||||||
|
Api.Project.ProjectExecution,
|
||||||
|
| 'id'
|
||||||
|
| 'projectId'
|
||||||
|
| 'projectRequirementId'
|
||||||
|
| 'ownerId'
|
||||||
|
| 'availableActions'
|
||||||
|
| 'plannedStartDate'
|
||||||
|
| 'plannedEndDate'
|
||||||
|
| 'actualStartDate'
|
||||||
|
| 'actualEndDate'
|
||||||
|
| 'progressRate'
|
||||||
|
> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
projectId: StringIdResponse;
|
||||||
|
projectRequirementId?: StringIdResponse | null;
|
||||||
|
ownerId: StringIdResponse;
|
||||||
|
availableActions?: LifecycleActionResponse<Api.Project.ProjectExecutionActionCode>[] | null;
|
||||||
|
plannedStartDate?: ProjectLocalDateValue;
|
||||||
|
plannedEndDate?: ProjectLocalDateValue;
|
||||||
|
actualStartDate?: ProjectLocalDateValue;
|
||||||
|
actualEndDate?: ProjectLocalDateValue;
|
||||||
|
progressRate?: number | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ExecutionAssigneeResponse = Omit<Api.Project.ExecutionAssignee, 'id' | 'executionId' | 'userId'> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
executionId: StringIdResponse;
|
||||||
|
userId: StringIdResponse;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ExecutionAssigneeLogResponse = Omit<
|
||||||
|
Api.Project.ExecutionAssigneeLog,
|
||||||
|
'id' | 'executionId' | 'userId' | 'operatorUserId'
|
||||||
|
> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
executionId: StringIdResponse;
|
||||||
|
userId: StringIdResponse;
|
||||||
|
operatorUserId: StringIdResponse;
|
||||||
|
};
|
||||||
|
|
||||||
|
type TaskAssigneeRefResponse = Omit<Api.Project.TaskAssigneeRef, 'id' | 'userId'> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
userId: StringIdResponse;
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 后端 attachments 项的兼容形态:历史/当前响应字段名是 `id`,前端类型统一用 `fileId`。
|
||||||
|
* normalizeAttachments 负责把两者归一成 `fileId`。
|
||||||
|
*/
|
||||||
|
type AttachmentItemResponse = Omit<Api.Project.AttachmentItem, 'fileId'> & {
|
||||||
|
fileId?: StringIdResponse;
|
||||||
|
id?: StringIdResponse;
|
||||||
|
};
|
||||||
|
|
||||||
|
function normalizeAttachments(list?: AttachmentItemResponse[] | null): Api.Project.AttachmentItem[] | null {
|
||||||
|
if (!list) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return list.map(item => {
|
||||||
|
const rawId = item.fileId ?? item.id;
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
fileId: rawId === null || rawId === undefined ? '' : String(rawId)
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 5.6 单独接口返的协办人字段(与 5.3 嵌入字段命名口径不一致:返 userNickname 而非 nickname)。
|
||||||
|
* 经 normalizeTaskAssignee 归一化后对外统一为 Api.Project.TaskAssigneeRef。
|
||||||
|
*/
|
||||||
|
export type TaskAssigneeFromApiResponse = {
|
||||||
|
id: StringIdResponse;
|
||||||
|
taskId: StringIdResponse;
|
||||||
|
userId: StringIdResponse;
|
||||||
|
userNickname?: string | null;
|
||||||
|
joinedAt?: string | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type TaskAssigneeLogResponse = Omit<
|
||||||
|
Api.Project.TaskAssigneeLog,
|
||||||
|
'id' | 'taskId' | 'userId' | 'operatorUserId'
|
||||||
|
> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
taskId: StringIdResponse;
|
||||||
|
userId: StringIdResponse;
|
||||||
|
operatorUserId: StringIdResponse;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ProjectTaskResponse = Omit<
|
||||||
|
Api.Project.ProjectTask,
|
||||||
|
| 'id'
|
||||||
|
| 'projectId'
|
||||||
|
| 'executionId'
|
||||||
|
| 'parentTaskId'
|
||||||
|
| 'ownerId'
|
||||||
|
| 'availableActions'
|
||||||
|
| 'plannedStartDate'
|
||||||
|
| 'plannedEndDate'
|
||||||
|
| 'actualStartDate'
|
||||||
|
| 'actualEndDate'
|
||||||
|
| 'progressRate'
|
||||||
|
| 'assignees'
|
||||||
|
| 'attachments'
|
||||||
|
> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
projectId: StringIdResponse;
|
||||||
|
executionId: StringIdResponse;
|
||||||
|
parentTaskId?: StringIdResponse | null;
|
||||||
|
ownerId: StringIdResponse;
|
||||||
|
availableActions?: LifecycleActionResponse<Api.Project.ProjectTaskActionCode>[] | null;
|
||||||
|
plannedStartDate?: ProjectLocalDateValue;
|
||||||
|
plannedEndDate?: ProjectLocalDateValue;
|
||||||
|
actualStartDate?: ProjectLocalDateValue;
|
||||||
|
actualEndDate?: ProjectLocalDateValue;
|
||||||
|
progressRate?: number | null;
|
||||||
|
assignees?: TaskAssigneeRefResponse[] | null;
|
||||||
|
attachments?: AttachmentItemResponse[] | null;
|
||||||
|
totalSpentHours?: number | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type TaskWorklogResponse = Omit<Api.Project.TaskWorklog, 'id' | 'taskId' | 'userId' | 'attachments'> & {
|
||||||
|
id: StringIdResponse;
|
||||||
|
taskId: StringIdResponse;
|
||||||
|
userId: StringIdResponse;
|
||||||
|
attachments?: AttachmentItemResponse[] | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export interface ProjectMemberResponse {
|
||||||
|
id: string | number;
|
||||||
|
userId: string | number;
|
||||||
|
userNickname: string;
|
||||||
|
roleId: string | number;
|
||||||
|
roleName: string;
|
||||||
|
roleCode: string;
|
||||||
|
managerFlag: boolean;
|
||||||
|
status: 0 | 1;
|
||||||
|
joinedTime: string;
|
||||||
|
leftTime?: string | null;
|
||||||
|
remark?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const projectLifecycleActionNameMap: Record<ProjectStatusActionCode, string> = {
|
||||||
|
pause: '暂停项目',
|
||||||
|
resume: '恢复项目',
|
||||||
|
complete: '完成项目',
|
||||||
|
cancel: '取消项目',
|
||||||
|
reopen: '重新开启',
|
||||||
|
archive: '归档项目'
|
||||||
|
};
|
||||||
|
|
||||||
|
const projectLifecycleActionReasonRequiredMap: Record<ProjectStatusActionCode, boolean> = {
|
||||||
|
pause: true,
|
||||||
|
resume: false,
|
||||||
|
complete: true,
|
||||||
|
cancel: true,
|
||||||
|
reopen: true,
|
||||||
|
archive: false
|
||||||
|
};
|
||||||
|
|
||||||
|
const projectLifecycleActionMap: Record<ProjectStatusCode, ProjectStatusActionCode[]> = {
|
||||||
|
pending: ['cancel'],
|
||||||
|
active: ['pause', 'complete', 'cancel'],
|
||||||
|
paused: ['resume', 'cancel'],
|
||||||
|
completed: ['reopen', 'archive'],
|
||||||
|
cancelled: [],
|
||||||
|
archived: []
|
||||||
|
};
|
||||||
|
|
||||||
|
export function getProjectLifecycleActions(statusCode: ProjectStatusCode): Api.Project.ProjectLifecycleAction[] {
|
||||||
|
return projectLifecycleActionMap[statusCode].map(actionCode => ({
|
||||||
|
actionCode,
|
||||||
|
actionName: projectLifecycleActionNameMap[actionCode],
|
||||||
|
needReason: projectLifecycleActionReasonRequiredMap[actionCode]
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeProjectLocalDate(value: ProjectLocalDateValue | undefined) {
|
||||||
|
if (value === null || value === undefined || value === '') {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (Array.isArray(value)) {
|
||||||
|
const [year, month, day] = value;
|
||||||
|
|
||||||
|
if (!year || !month || !day) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return [year, month, day].map(item => String(item).padStart(2, '0')).join('-');
|
||||||
|
}
|
||||||
|
|
||||||
|
return String(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeLifecycleActions<ActionCode extends string>(
|
||||||
|
actions: LifecycleActionResponse<ActionCode>[] | null | undefined
|
||||||
|
): Api.Project.LifecycleAction<ActionCode>[] {
|
||||||
|
return (actions ?? []).map(action => ({
|
||||||
|
actionCode: action.actionCode,
|
||||||
|
actionName: action.actionName ?? '',
|
||||||
|
needReason: Boolean(action.needReason)
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeProjectMember(response: ProjectMemberResponse): Api.Project.ProjectMember {
|
||||||
|
return {
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
userId: normalizeStringId(response.userId),
|
||||||
|
userNickname: response.userNickname || '',
|
||||||
|
roleId: normalizeStringId(response.roleId),
|
||||||
|
roleName: response.roleName || '',
|
||||||
|
roleCode: response.roleCode || '',
|
||||||
|
managerFlag: Boolean(response.managerFlag),
|
||||||
|
status: response.status,
|
||||||
|
joinedTime: response.joinedTime,
|
||||||
|
leftTime: response.leftTime ?? null,
|
||||||
|
remark: response.remark ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeProjectExecution(response: ProjectExecutionResponse): Api.Project.ProjectExecution {
|
||||||
|
return {
|
||||||
|
...response,
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
projectId: normalizeStringId(response.projectId),
|
||||||
|
projectRequirementId: normalizeNullableStringId(response.projectRequirementId),
|
||||||
|
ownerId: normalizeStringId(response.ownerId),
|
||||||
|
ownerNickname: response.ownerNickname ?? null,
|
||||||
|
statusName: response.statusName ?? null,
|
||||||
|
terminal: Boolean(response.terminal),
|
||||||
|
allowEdit: Boolean(response.allowEdit),
|
||||||
|
availableActions: normalizeLifecycleActions(response.availableActions),
|
||||||
|
plannedStartDate: normalizeProjectLocalDate(response.plannedStartDate),
|
||||||
|
plannedEndDate: normalizeProjectLocalDate(response.plannedEndDate),
|
||||||
|
actualStartDate: normalizeProjectLocalDate(response.actualStartDate),
|
||||||
|
actualEndDate: normalizeProjectLocalDate(response.actualEndDate),
|
||||||
|
progressRate: typeof response.progressRate === 'number' ? response.progressRate : 0,
|
||||||
|
executionDesc: response.executionDesc ?? null,
|
||||||
|
lastStatusReason: response.lastStatusReason ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeExecutionAssignee(response: ExecutionAssigneeResponse): Api.Project.ExecutionAssignee {
|
||||||
|
return {
|
||||||
|
...response,
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
executionId: normalizeStringId(response.executionId),
|
||||||
|
userId: normalizeStringId(response.userId),
|
||||||
|
userNickname: response.userNickname ?? null,
|
||||||
|
joinedAt: response.joinedAt ?? null,
|
||||||
|
removedAt: response.removedAt ?? null,
|
||||||
|
removedReason: response.removedReason ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeExecutionAssigneeLog(
|
||||||
|
response: ExecutionAssigneeLogResponse
|
||||||
|
): Api.Project.ExecutionAssigneeLog {
|
||||||
|
return {
|
||||||
|
...response,
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
executionId: normalizeStringId(response.executionId),
|
||||||
|
userId: normalizeStringId(response.userId),
|
||||||
|
operatorUserId: normalizeStringId(response.operatorUserId),
|
||||||
|
userNicknameSnapshot: response.userNicknameSnapshot ?? null,
|
||||||
|
operatorNicknameSnapshot: response.operatorNicknameSnapshot ?? null,
|
||||||
|
reason: response.reason ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeProjectTask(response: ProjectTaskResponse): Api.Project.ProjectTask {
|
||||||
|
return {
|
||||||
|
...response,
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
projectId: normalizeStringId(response.projectId),
|
||||||
|
executionId: normalizeStringId(response.executionId),
|
||||||
|
parentTaskId: normalizeNullableStringId(response.parentTaskId),
|
||||||
|
ownerId: normalizeStringId(response.ownerId),
|
||||||
|
ownerNickname: response.ownerNickname ?? null,
|
||||||
|
statusName: response.statusName ?? null,
|
||||||
|
terminal: Boolean(response.terminal),
|
||||||
|
allowEdit: Boolean(response.allowEdit),
|
||||||
|
availableActions: normalizeLifecycleActions(response.availableActions),
|
||||||
|
progressRate: typeof response.progressRate === 'number' ? response.progressRate : 0,
|
||||||
|
plannedStartDate: normalizeProjectLocalDate(response.plannedStartDate),
|
||||||
|
plannedEndDate: normalizeProjectLocalDate(response.plannedEndDate),
|
||||||
|
actualStartDate: normalizeProjectLocalDate(response.actualStartDate),
|
||||||
|
actualEndDate: normalizeProjectLocalDate(response.actualEndDate),
|
||||||
|
taskDesc: response.taskDesc ?? null,
|
||||||
|
lastStatusReason: response.lastStatusReason ?? null,
|
||||||
|
assignees:
|
||||||
|
response.assignees?.map(item => ({
|
||||||
|
id: normalizeStringId(item.id),
|
||||||
|
userId: normalizeStringId(item.userId),
|
||||||
|
nickname: item.nickname ?? ''
|
||||||
|
})) ?? null,
|
||||||
|
attachments: normalizeAttachments(response.attachments),
|
||||||
|
totalSpentHours: response.totalSpentHours ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeTaskWorklog(response: TaskWorklogResponse): Api.Project.TaskWorklog {
|
||||||
|
return {
|
||||||
|
...response,
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
taskId: normalizeStringId(response.taskId),
|
||||||
|
userId: normalizeStringId(response.userId),
|
||||||
|
userNickname: response.userNickname ?? null,
|
||||||
|
workContent: response.workContent ?? null,
|
||||||
|
attachments: normalizeAttachments(response.attachments),
|
||||||
|
progressRate: typeof response.progressRate === 'number' ? response.progressRate : 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeTaskAssignee(response: TaskAssigneeFromApiResponse): Api.Project.TaskAssigneeRef {
|
||||||
|
return {
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
userId: normalizeStringId(response.userId),
|
||||||
|
nickname: response.userNickname ?? '',
|
||||||
|
joinedAt: response.joinedAt ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function normalizeTaskAssigneeLog(response: TaskAssigneeLogResponse): Api.Project.TaskAssigneeLog {
|
||||||
|
return {
|
||||||
|
...response,
|
||||||
|
id: normalizeStringId(response.id),
|
||||||
|
taskId: normalizeStringId(response.taskId),
|
||||||
|
userId: normalizeStringId(response.userId),
|
||||||
|
operatorUserId: normalizeStringId(response.operatorUserId),
|
||||||
|
userNicknameSnapshot: response.userNicknameSnapshot ?? null,
|
||||||
|
operatorNicknameSnapshot: response.operatorNicknameSnapshot ?? null,
|
||||||
|
reason: response.reason ?? null
|
||||||
|
};
|
||||||
|
}
|
||||||
1094
src/service/api/project.ts
Normal file
1094
src/service/api/project.ts
Normal file
File diff suppressed because it is too large
Load Diff
@@ -95,31 +95,78 @@ function replaceWithStaticObjectContextDomainRoute(routes: Api.Route.MenuRoute[]
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const wrappedDomainRoute = cloneStaticRouteAsMenuRoute(staticDomainRoute, `object-context:${config.domainKey}`);
|
// Create a map of backend routes by name for quick lookup
|
||||||
const entryRouteIndex = normalizedRoutes.findIndex(route => route.id === entryRoute.id);
|
const backendRouteMap = new Map<string, Api.Route.MenuRoute>();
|
||||||
const domainRouteIds = new Set(domainTopLevelRoutes.map(route => route.id));
|
domainTopLevelRoutes.forEach(route => {
|
||||||
|
if (route.name) {
|
||||||
|
backendRouteMap.set(String(route.name), route);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
if (entryRoute.meta) {
|
// Clone static route but preserve backend route's meta for children
|
||||||
const nextMeta: RouteMeta = {
|
// 待重构:拆 helper 以降低复杂度,暂以 disable 注释临时放行
|
||||||
title: wrappedDomainRoute.meta?.title || config.domainKey,
|
// eslint-disable-next-line complexity
|
||||||
...(wrappedDomainRoute.meta || {})
|
function cloneStaticRoutePreservingBackendMeta(route: ElegantConstRoute, idPrefix: string): Api.Route.MenuRoute {
|
||||||
|
const backendRoute = route.name ? backendRouteMap.get(String(route.name)) : undefined;
|
||||||
|
const { children: _children, ...routeWithoutChildren } = route;
|
||||||
|
const baseRoute: Api.Route.MenuRoute = {
|
||||||
|
...routeWithoutChildren,
|
||||||
|
id: `${idPrefix}:${String(route.name || route.path)}`
|
||||||
};
|
};
|
||||||
|
|
||||||
if (entryRoute.meta.icon) {
|
// If there's a backend route, preserve its meta
|
||||||
nextMeta.icon = entryRoute.meta.icon;
|
if (backendRoute?.meta) {
|
||||||
|
baseRoute.meta = {
|
||||||
|
...baseRoute.meta,
|
||||||
|
title: backendRoute.meta.title || baseRoute.meta?.title || String(route.name || route.path),
|
||||||
|
icon: backendRoute.meta.icon || baseRoute.meta?.icon,
|
||||||
|
localIcon: backendRoute.meta.localIcon || baseRoute.meta?.localIcon,
|
||||||
|
order:
|
||||||
|
backendRoute.meta.order !== undefined && backendRoute.meta.order !== null
|
||||||
|
? backendRoute.meta.order
|
||||||
|
: baseRoute.meta?.order,
|
||||||
|
keepAlive:
|
||||||
|
backendRoute.meta.keepAlive !== undefined && backendRoute.meta.keepAlive !== null
|
||||||
|
? backendRoute.meta.keepAlive
|
||||||
|
: baseRoute.meta?.keepAlive,
|
||||||
|
i18nKey: backendRoute.meta.i18nKey || baseRoute.meta?.i18nKey
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
if (entryRoute.meta.localIcon) {
|
// Recursively process children
|
||||||
nextMeta.localIcon = entryRoute.meta.localIcon;
|
if (route.children?.length) {
|
||||||
|
baseRoute.children = route.children.map(child => cloneStaticRoutePreservingBackendMeta(child, idPrefix));
|
||||||
}
|
}
|
||||||
|
|
||||||
if (entryRoute.meta.order !== undefined) {
|
return baseRoute;
|
||||||
nextMeta.order = entryRoute.meta.order;
|
|
||||||
}
|
|
||||||
|
|
||||||
wrappedDomainRoute.meta = nextMeta;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const wrappedDomainRoute = cloneStaticRoutePreservingBackendMeta(
|
||||||
|
staticDomainRoute,
|
||||||
|
`object-context:${config.domainKey}`
|
||||||
|
);
|
||||||
|
|
||||||
|
// Merge entry route's meta to domain route
|
||||||
|
if (entryRoute.meta) {
|
||||||
|
wrappedDomainRoute.meta = {
|
||||||
|
...wrappedDomainRoute.meta,
|
||||||
|
title: entryRoute.meta.title || wrappedDomainRoute.meta?.title || config.domainKey,
|
||||||
|
icon: entryRoute.meta.icon || wrappedDomainRoute.meta?.icon,
|
||||||
|
localIcon: entryRoute.meta.localIcon || wrappedDomainRoute.meta?.localIcon,
|
||||||
|
order:
|
||||||
|
entryRoute.meta.order !== undefined && entryRoute.meta.order !== null
|
||||||
|
? entryRoute.meta.order
|
||||||
|
: wrappedDomainRoute.meta?.order,
|
||||||
|
keepAlive:
|
||||||
|
entryRoute.meta.keepAlive !== undefined && entryRoute.meta.keepAlive !== null
|
||||||
|
? entryRoute.meta.keepAlive
|
||||||
|
: wrappedDomainRoute.meta?.keepAlive
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const entryRouteIndex = normalizedRoutes.findIndex(route => route.id === entryRoute.id);
|
||||||
|
const domainRouteIds = new Set(domainTopLevelRoutes.map(route => route.id));
|
||||||
|
|
||||||
normalizedRoutes = normalizedRoutes.filter(route => !domainRouteIds.has(route.id));
|
normalizedRoutes = normalizedRoutes.filter(route => !domainRouteIds.has(route.id));
|
||||||
normalizedRoutes.splice(entryRouteIndex < 0 ? normalizedRoutes.length : entryRouteIndex, 0, wrappedDomainRoute);
|
normalizedRoutes.splice(entryRouteIndex < 0 ? normalizedRoutes.length : entryRouteIndex, 0, wrappedDomainRoute);
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -74,6 +74,7 @@ function createBatchDeleteQuery(ids: Array<string | number>) {
|
|||||||
|
|
||||||
type UserSimpleResponse = Omit<Api.SystemManage.UserSimple, 'id'> & {
|
type UserSimpleResponse = Omit<Api.SystemManage.UserSimple, 'id'> & {
|
||||||
id: string | number;
|
id: string | number;
|
||||||
|
deptId?: string | number | null;
|
||||||
};
|
};
|
||||||
|
|
||||||
type RoleResponse = Omit<Api.SystemManage.Role, 'id'> & {
|
type RoleResponse = Omit<Api.SystemManage.Role, 'id'> & {
|
||||||
@@ -120,7 +121,8 @@ type UserManagementRelationTreeResponse = Omit<
|
|||||||
function normalizeUserSimple(user: UserSimpleResponse): Api.SystemManage.UserSimple {
|
function normalizeUserSimple(user: UserSimpleResponse): Api.SystemManage.UserSimple {
|
||||||
return {
|
return {
|
||||||
...user,
|
...user,
|
||||||
id: normalizeStringId(user.id)
|
id: normalizeStringId(user.id),
|
||||||
|
deptId: normalizeNullableStringId(user.deptId)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -667,7 +669,7 @@ export function fetchAssignUserRoles(data: Api.SystemManage.AssignUserRoleParams
|
|||||||
* - 中间节点:有上级也有下级
|
* - 中间节点:有上级也有下级
|
||||||
* - 叶子节点:基层员工,没有下级
|
* - 叶子节点:基层员工,没有下级
|
||||||
*/
|
*/
|
||||||
export function fetchGetUserManagementRelationTree(query: UserManagementRelationQueryReqVO) {
|
export async function fetchGetUserManagementRelationTree(query: UserManagementRelationQueryReqVO) {
|
||||||
return request<UserManagementRelationTreeResponse[]>({
|
return request<UserManagementRelationTreeResponse[]>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
url: `${USER_MANAGEMENT_RELATION_PREFIX}/tree`,
|
url: `${USER_MANAGEMENT_RELATION_PREFIX}/tree`,
|
||||||
@@ -684,7 +686,7 @@ export function fetchGetUserManagementRelationTree(query: UserManagementRelation
|
|||||||
* 通过搜索框的查询条件,获取用户管理链路树形结构
|
* 通过搜索框的查询条件,获取用户管理链路树形结构
|
||||||
* 用于树形控件展示,包含用户的上下级层级关系
|
* 用于树形控件展示,包含用户的上下级层级关系
|
||||||
*/
|
*/
|
||||||
export function fetchGetUserManagementRelationQuery(query: UserManagementRelationQueryReqVO) {
|
export async function fetchGetUserManagementRelationQuery(query: UserManagementRelationQueryReqVO) {
|
||||||
return request<UserManagementRelationTreeResponse[]>({
|
return request<UserManagementRelationTreeResponse[]>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
url: `${USER_MANAGEMENT_RELATION_PREFIX}/query`,
|
url: `${USER_MANAGEMENT_RELATION_PREFIX}/query`,
|
||||||
@@ -704,7 +706,7 @@ export function fetchGetUserManagementRelationQuery(query: UserManagementRelatio
|
|||||||
*
|
*
|
||||||
* @param id 关系记录主键 ID
|
* @param id 关系记录主键 ID
|
||||||
*/
|
*/
|
||||||
export function fetchGetUserManagementRelation(id: string) {
|
export async function fetchGetUserManagementRelation(id: string) {
|
||||||
return request<UserManagementRelationResponse>({
|
return request<UserManagementRelationResponse>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
url: `${USER_MANAGEMENT_RELATION_PREFIX}/get`,
|
url: `${USER_MANAGEMENT_RELATION_PREFIX}/get`,
|
||||||
@@ -722,7 +724,7 @@ export function fetchGetUserManagementRelation(id: string) {
|
|||||||
*
|
*
|
||||||
* @param data 创建请求参数
|
* @param data 创建请求参数
|
||||||
*/
|
*/
|
||||||
export function fetchCreateUserManagementRelation(data: Api.SystemManage.UserManagementRelationSaveReqVO) {
|
export async function fetchCreateUserManagementRelation(data: Api.SystemManage.UserManagementRelationSaveReqVO) {
|
||||||
return request<string | number>({
|
return request<string | number>({
|
||||||
...safeJsonRequestConfig,
|
...safeJsonRequestConfig,
|
||||||
url: `${USER_MANAGEMENT_RELATION_PREFIX}/create`,
|
url: `${USER_MANAGEMENT_RELATION_PREFIX}/create`,
|
||||||
@@ -776,3 +778,20 @@ export function fetchBatchDeleteUserManagementRelation(ids: string[]) {
|
|||||||
method: 'delete'
|
method: 'delete'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取未绑定直属上级的候选下级用户列表
|
||||||
|
*
|
||||||
|
* 用于获取尚未绑定直属上级的用户列表,供选择使用
|
||||||
|
*
|
||||||
|
* @returns 候选下级用户列表
|
||||||
|
*/
|
||||||
|
export async function fetchGetCandidateSubordinateUsers() {
|
||||||
|
return request<UserSimpleResponse[]>({
|
||||||
|
...safeJsonRequestConfig,
|
||||||
|
url: `${USER_MANAGEMENT_RELATION_PREFIX}/candidate-users`,
|
||||||
|
method: 'get'
|
||||||
|
}).then(result =>
|
||||||
|
mapServiceResult(result as ServiceRequestResult<UserSimpleResponse[]>, data => data.map(normalizeUserSimple))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|||||||
8
src/service/api/workbench.ts
Normal file
8
src/service/api/workbench.ts
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
// 工作台聚合接口尚未开通,当前页面使用 src/views/workbench/mock.ts 的本地假数据。
|
||||||
|
// 接口契约确认后,在此处补:
|
||||||
|
// - fetchGetWorkbenchSummary (Banner 摘要 + KPI)
|
||||||
|
// - fetchGetWorkbenchTodos (我的待办)
|
||||||
|
// - fetchGetWorkbenchActivity (最近动态)
|
||||||
|
// - fetchGetWorkbenchProjects (我参与的项目)
|
||||||
|
// 全部走 src/service/request/index.ts 的统一实例,并保持 ID 字符串口径。
|
||||||
|
export {};
|
||||||
90
src/service/request/dedupe.ts
Normal file
90
src/service/request/dedupe.ts
Normal file
@@ -0,0 +1,90 @@
|
|||||||
|
import type { InternalAxiosRequestConfig } from 'axios';
|
||||||
|
|
||||||
|
declare module 'axios' {
|
||||||
|
interface AxiosRequestConfig {
|
||||||
|
dedupe?: boolean;
|
||||||
|
/**
|
||||||
|
* 跳过 Authorization 注入。
|
||||||
|
*
|
||||||
|
* 用于公开接口(refresh-token / login / register 等 PermitAll 路径),
|
||||||
|
* 避免给它们带上过期 access 头被网关拦截。
|
||||||
|
*/
|
||||||
|
skipAuth?: boolean;
|
||||||
|
/** 请求失败时不走通用错误 toast,由调用方自行收敛提示。 */
|
||||||
|
suppressErrorMessage?: boolean;
|
||||||
|
/** 请求失败命中过期 access code 时,不再触发 refresh-token 流程。 */
|
||||||
|
skipTokenRefresh?: boolean;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const WRITE_METHODS = new Set(['POST', 'PUT', 'DELETE', 'PATCH']);
|
||||||
|
|
||||||
|
type DedupableConfig = Pick<InternalAxiosRequestConfig, 'method' | 'url' | 'data' | 'params'> & {
|
||||||
|
dedupe?: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
function isFormDataLike(value: unknown): boolean {
|
||||||
|
if (typeof FormData !== 'undefined' && value instanceof FormData) return true;
|
||||||
|
if (typeof Blob !== 'undefined' && value instanceof Blob) return true;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function stableJson(value: unknown): string {
|
||||||
|
if (value === null || value === undefined) return '';
|
||||||
|
if (typeof value !== 'object') return JSON.stringify(value);
|
||||||
|
if (Array.isArray(value)) return `[${value.map(stableJson).join(',')}]`;
|
||||||
|
const obj = value as Record<string, unknown>;
|
||||||
|
const keys = Object.keys(obj).sort();
|
||||||
|
return `{${keys.map(k => `${JSON.stringify(k)}:${stableJson(obj[k])}`).join(',')}}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function computeDedupeKey(config: DedupableConfig): string | null {
|
||||||
|
const method = (config.method ?? 'GET').toUpperCase();
|
||||||
|
if (!WRITE_METHODS.has(method)) return null;
|
||||||
|
if (config.dedupe === false) return null;
|
||||||
|
if (isFormDataLike(config.data)) return null;
|
||||||
|
|
||||||
|
const url = config.url ?? '';
|
||||||
|
const paramsPart = stableJson(config.params);
|
||||||
|
const bodyPart = stableJson(config.data);
|
||||||
|
return `${method}|${url}?${paramsPart}|${bodyPart}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
const DEFAULT_TTL_MS = 30_000;
|
||||||
|
|
||||||
|
export interface WithDedupeOptions {
|
||||||
|
ttlMs?: number;
|
||||||
|
now?: () => number;
|
||||||
|
}
|
||||||
|
|
||||||
|
type AnyRequestFn = (...args: any[]) => Promise<unknown>;
|
||||||
|
|
||||||
|
export function withDedupe<TFn extends AnyRequestFn>(request: TFn, options: WithDedupeOptions = {}): TFn {
|
||||||
|
const ttl = options.ttlMs ?? DEFAULT_TTL_MS;
|
||||||
|
const now = options.now ?? Date.now;
|
||||||
|
const pending = new Map<string, { promise: Promise<unknown>; expiresAt: number }>();
|
||||||
|
|
||||||
|
return new Proxy(request, {
|
||||||
|
apply(target, thisArg, args: Parameters<TFn>) {
|
||||||
|
const [config] = args;
|
||||||
|
const key = computeDedupeKey(config as DedupableConfig);
|
||||||
|
if (key === null) return Reflect.apply(target, thisArg, args);
|
||||||
|
|
||||||
|
const cached = pending.get(key);
|
||||||
|
if (cached && cached.expiresAt > now()) return cached.promise;
|
||||||
|
if (cached) pending.delete(key);
|
||||||
|
|
||||||
|
const promise = Promise.resolve()
|
||||||
|
.then(() => Reflect.apply(target, thisArg, args))
|
||||||
|
.finally(() => {
|
||||||
|
const current = pending.get(key);
|
||||||
|
if (current && current.promise === promise) {
|
||||||
|
pending.delete(key);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
pending.set(key, { promise, expiresAt: now() + ttl });
|
||||||
|
return promise;
|
||||||
|
}
|
||||||
|
}) as TFn;
|
||||||
|
}
|
||||||
32
src/service/request/error-message.ts
Normal file
32
src/service/request/error-message.ts
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
export const SESSION_EXPIRED_MESSAGE = '登录已失效,请重新登录';
|
||||||
|
|
||||||
|
export interface ErrorMessageSuppressOptions {
|
||||||
|
backendErrorCode: string;
|
||||||
|
suppressErrorMessage?: boolean;
|
||||||
|
logoutCodes: string[];
|
||||||
|
modalLogoutCodes: string[];
|
||||||
|
expiredTokenCodes: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface BackendFailDeferOptions {
|
||||||
|
suppressErrorMessage?: boolean;
|
||||||
|
skipTokenRefresh?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function parseServiceCodes(codes?: string) {
|
||||||
|
return codes?.split(',').filter(Boolean) || [];
|
||||||
|
}
|
||||||
|
|
||||||
|
export function shouldDeferBackendFailToCaller(options: BackendFailDeferOptions) {
|
||||||
|
return Boolean(options.suppressErrorMessage && options.skipTokenRefresh);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function shouldSuppressErrorMessage(options: ErrorMessageSuppressOptions) {
|
||||||
|
if (options.suppressErrorMessage) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
const handledCodes = [...options.logoutCodes, ...options.modalLogoutCodes, ...options.expiredTokenCodes];
|
||||||
|
|
||||||
|
return handledCodes.includes(options.backendErrorCode);
|
||||||
|
}
|
||||||
@@ -5,126 +5,153 @@ import { localStg } from '@/utils/storage';
|
|||||||
import { getServiceBaseURL } from '@/utils/service';
|
import { getServiceBaseURL } from '@/utils/service';
|
||||||
import { $t } from '@/locales';
|
import { $t } from '@/locales';
|
||||||
import { applyApiEncrypt } from './api-encrypt';
|
import { applyApiEncrypt } from './api-encrypt';
|
||||||
import { getAuthorization, handleExpiredRequest, showErrorMsg } from './shared';
|
import { parseServiceCodes, shouldDeferBackendFailToCaller, shouldSuppressErrorMessage } from './error-message';
|
||||||
|
import { getAuthorization, handleExpiredRequest, notifySessionExpired, showErrorMsg } from './shared';
|
||||||
|
import { withDedupe } from './dedupe';
|
||||||
import type { RequestInstanceState } from './type';
|
import type { RequestInstanceState } from './type';
|
||||||
|
|
||||||
const isHttpProxy = import.meta.env.DEV && import.meta.env.VITE_HTTP_PROXY === 'Y';
|
const isHttpProxy = import.meta.env.DEV && import.meta.env.VITE_HTTP_PROXY === 'Y';
|
||||||
const { baseURL, otherBaseURL } = getServiceBaseURL(import.meta.env, isHttpProxy);
|
const { baseURL, otherBaseURL } = getServiceBaseURL(import.meta.env, isHttpProxy);
|
||||||
|
|
||||||
export const request = createFlatRequest(
|
export const request = withDedupe(
|
||||||
{
|
createFlatRequest(
|
||||||
baseURL,
|
{
|
||||||
headers: {
|
baseURL,
|
||||||
apifoxToken: 'XL299LiMEDZ0H5h3A29PxwQXdMJqWyY2'
|
headers: {
|
||||||
}
|
apifoxToken: 'XL299LiMEDZ0H5h3A29PxwQXdMJqWyY2'
|
||||||
},
|
}
|
||||||
{
|
|
||||||
defaultState: {
|
|
||||||
errMsgStack: [],
|
|
||||||
refreshTokenPromise: null
|
|
||||||
} as RequestInstanceState,
|
|
||||||
transform(response: AxiosResponse<App.Service.Response<any>>) {
|
|
||||||
return response.data.data;
|
|
||||||
},
|
},
|
||||||
async onRequest(config) {
|
{
|
||||||
const Authorization = getAuthorization();
|
defaultState: {
|
||||||
Object.assign(config.headers, { Authorization });
|
errMsgStack: [],
|
||||||
applyApiEncrypt(config);
|
refreshTokenPromise: null
|
||||||
|
} as RequestInstanceState,
|
||||||
return config;
|
transform(response: AxiosResponse<App.Service.Response<any>>) {
|
||||||
},
|
return response.data.data;
|
||||||
isBackendSuccess(response) {
|
},
|
||||||
// 当后端返回码为 "0"(默认)时,表示请求成功
|
async onRequest(config) {
|
||||||
// 如需调整该逻辑,可修改 `.env` 中的 `VITE_SERVICE_SUCCESS_CODE`
|
// skipAuth 为 true 的请求不注入 Authorization——避免给公开接口(如 refresh-token)
|
||||||
return String(response.data.code) === import.meta.env.VITE_SERVICE_SUCCESS_CODE;
|
// 带上过期 access 头被网关拦截(网关只看 Authorization,不区分路由是否 PermitAll)
|
||||||
},
|
if (!config.skipAuth) {
|
||||||
async onBackendFail(response, instance) {
|
|
||||||
const authStore = useAuthStore();
|
|
||||||
const responseCode = String(response.data.code);
|
|
||||||
|
|
||||||
function handleLogout() {
|
|
||||||
authStore.resetStore();
|
|
||||||
}
|
|
||||||
|
|
||||||
function logoutAndCleanup() {
|
|
||||||
handleLogout();
|
|
||||||
window.removeEventListener('beforeunload', handleLogout);
|
|
||||||
|
|
||||||
request.state.errMsgStack = request.state.errMsgStack.filter(msg => msg !== response.data.msg);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 当后端返回码命中 `logoutCodes` 时,表示用户需要退出登录并跳转到登录页
|
|
||||||
const logoutCodes = import.meta.env.VITE_SERVICE_LOGOUT_CODES?.split(',') || [];
|
|
||||||
if (logoutCodes.includes(responseCode)) {
|
|
||||||
handleLogout();
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 当后端返回码命中 `modalLogoutCodes` 时,表示通过弹窗提示后再退出登录
|
|
||||||
const modalLogoutCodes = import.meta.env.VITE_SERVICE_MODAL_LOGOUT_CODES?.split(',') || [];
|
|
||||||
if (modalLogoutCodes.includes(responseCode) && !request.state.errMsgStack?.includes(response.data.msg)) {
|
|
||||||
request.state.errMsgStack = [...(request.state.errMsgStack || []), response.data.msg];
|
|
||||||
|
|
||||||
// 防止用户刷新页面绕过退出逻辑
|
|
||||||
window.addEventListener('beforeunload', handleLogout);
|
|
||||||
|
|
||||||
window.$messageBox
|
|
||||||
?.confirm(response.data.msg, $t('common.error'), {
|
|
||||||
confirmButtonText: $t('common.confirm'),
|
|
||||||
cancelButtonText: $t('common.cancel'),
|
|
||||||
type: 'error',
|
|
||||||
closeOnClickModal: false,
|
|
||||||
closeOnPressEscape: false
|
|
||||||
})
|
|
||||||
.then(() => {
|
|
||||||
logoutAndCleanup();
|
|
||||||
});
|
|
||||||
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 当后端返回码命中 `expiredTokenCodes` 时,表示 token 已过期,需要刷新 token
|
|
||||||
// `refreshToken` 接口不能再返回 `expiredTokenCodes` 中的错误码,否则会形成死循环,应返回 `logoutCodes` 或 `modalLogoutCodes`
|
|
||||||
const expiredTokenCodes = import.meta.env.VITE_SERVICE_EXPIRED_TOKEN_CODES?.split(',') || [];
|
|
||||||
if (expiredTokenCodes.includes(responseCode)) {
|
|
||||||
const success = await handleExpiredRequest(request.state);
|
|
||||||
if (success) {
|
|
||||||
const Authorization = getAuthorization();
|
const Authorization = getAuthorization();
|
||||||
Object.assign(response.config.headers, { Authorization });
|
Object.assign(config.headers, { Authorization });
|
||||||
|
|
||||||
return instance.request(response.config) as Promise<AxiosResponse>;
|
|
||||||
}
|
}
|
||||||
|
applyApiEncrypt(config);
|
||||||
|
|
||||||
|
return config;
|
||||||
|
},
|
||||||
|
isBackendSuccess(response) {
|
||||||
|
// 当后端返回码为 "0"(默认)时,表示请求成功
|
||||||
|
// 如需调整该逻辑,可修改 `.env` 中的 `VITE_SERVICE_SUCCESS_CODE`
|
||||||
|
return String(response.data.code) === import.meta.env.VITE_SERVICE_SUCCESS_CODE;
|
||||||
|
},
|
||||||
|
async onBackendFail(response, instance) {
|
||||||
|
const authStore = useAuthStore();
|
||||||
|
const responseCode = String(response.data.code);
|
||||||
|
|
||||||
|
if (
|
||||||
|
shouldDeferBackendFailToCaller({
|
||||||
|
suppressErrorMessage: response.config.suppressErrorMessage,
|
||||||
|
skipTokenRefresh: response.config.skipTokenRefresh
|
||||||
|
})
|
||||||
|
) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleLogout() {
|
||||||
|
authStore.resetStore();
|
||||||
|
}
|
||||||
|
|
||||||
|
function logoutAndCleanup() {
|
||||||
|
handleLogout();
|
||||||
|
window.removeEventListener('beforeunload', handleLogout);
|
||||||
|
|
||||||
|
request.state.errMsgStack = request.state.errMsgStack.filter(msg => msg !== response.data.msg);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 当后端返回码命中 `logoutCodes` 时,表示登录态已失效,需要提示后退出登录
|
||||||
|
// 走 notifySessionExpired 而不是裸 resetStore:保证并发请求只弹一次 toast、只清一次状态
|
||||||
|
const logoutCodes = parseServiceCodes(import.meta.env.VITE_SERVICE_LOGOUT_CODES);
|
||||||
|
if (logoutCodes.includes(responseCode)) {
|
||||||
|
notifySessionExpired();
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 当后端返回码命中 `modalLogoutCodes` 时,表示通过弹窗提示后再退出登录
|
||||||
|
const modalLogoutCodes = parseServiceCodes(import.meta.env.VITE_SERVICE_MODAL_LOGOUT_CODES);
|
||||||
|
if (modalLogoutCodes.includes(responseCode) && !request.state.errMsgStack?.includes(response.data.msg)) {
|
||||||
|
request.state.errMsgStack = [...(request.state.errMsgStack || []), response.data.msg];
|
||||||
|
|
||||||
|
// 防止用户刷新页面绕过退出逻辑
|
||||||
|
window.addEventListener('beforeunload', handleLogout);
|
||||||
|
|
||||||
|
window.$messageBox
|
||||||
|
?.confirm(response.data.msg, $t('common.error'), {
|
||||||
|
confirmButtonText: $t('common.confirm'),
|
||||||
|
cancelButtonText: $t('common.cancel'),
|
||||||
|
type: 'error',
|
||||||
|
closeOnClickModal: false,
|
||||||
|
closeOnPressEscape: false
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
logoutAndCleanup();
|
||||||
|
});
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 当后端返回码命中 `expiredTokenCodes` 时,表示 token 已过期,需要刷新 token
|
||||||
|
// `refreshToken` 接口不能再返回 `expiredTokenCodes` 中的错误码,否则会形成死循环,应返回 `logoutCodes` 或 `modalLogoutCodes`
|
||||||
|
const expiredTokenCodes = parseServiceCodes(import.meta.env.VITE_SERVICE_EXPIRED_TOKEN_CODES);
|
||||||
|
if (expiredTokenCodes.includes(responseCode)) {
|
||||||
|
if (response.config.skipTokenRefresh) {
|
||||||
|
notifySessionExpired();
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const success = await handleExpiredRequest(request.state);
|
||||||
|
if (success) {
|
||||||
|
const Authorization = getAuthorization();
|
||||||
|
Object.assign(response.config.headers, { Authorization });
|
||||||
|
|
||||||
|
return instance.request(response.config) as Promise<AxiosResponse>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
onError(error) {
|
||||||
|
// 请求失败时,在这里统一处理错误提示
|
||||||
|
|
||||||
|
let message = error.message;
|
||||||
|
let backendErrorCode = '';
|
||||||
|
|
||||||
|
// 获取后端错误信息和错误码
|
||||||
|
if (error.code === BACKEND_ERROR_CODE) {
|
||||||
|
message = error.response?.data?.msg || message;
|
||||||
|
backendErrorCode = String(error.response?.data?.code || '');
|
||||||
|
}
|
||||||
|
|
||||||
|
const suppressErrorMessage = Boolean(error.config?.suppressErrorMessage);
|
||||||
|
const logoutCodes = parseServiceCodes(import.meta.env.VITE_SERVICE_LOGOUT_CODES);
|
||||||
|
const modalLogoutCodes = parseServiceCodes(import.meta.env.VITE_SERVICE_MODAL_LOGOUT_CODES);
|
||||||
|
const expiredTokenCodes = parseServiceCodes(import.meta.env.VITE_SERVICE_EXPIRED_TOKEN_CODES);
|
||||||
|
if (
|
||||||
|
shouldSuppressErrorMessage({
|
||||||
|
backendErrorCode,
|
||||||
|
suppressErrorMessage,
|
||||||
|
logoutCodes,
|
||||||
|
modalLogoutCodes,
|
||||||
|
expiredTokenCodes
|
||||||
|
})
|
||||||
|
) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
showErrorMsg(request.state, message);
|
||||||
}
|
}
|
||||||
|
|
||||||
return null;
|
|
||||||
},
|
|
||||||
onError(error) {
|
|
||||||
// 请求失败时,在这里统一处理错误提示
|
|
||||||
|
|
||||||
let message = error.message;
|
|
||||||
let backendErrorCode = '';
|
|
||||||
|
|
||||||
// 获取后端错误信息和错误码
|
|
||||||
if (error.code === BACKEND_ERROR_CODE) {
|
|
||||||
message = error.response?.data?.msg || message;
|
|
||||||
backendErrorCode = String(error.response?.data?.code || '');
|
|
||||||
}
|
|
||||||
|
|
||||||
// 这类错误信息已经通过弹窗展示,不再重复提示
|
|
||||||
const modalLogoutCodes = import.meta.env.VITE_SERVICE_MODAL_LOGOUT_CODES?.split(',') || [];
|
|
||||||
if (modalLogoutCodes.includes(backendErrorCode)) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// token 过期时会自动刷新并重试请求,这里无需额外提示
|
|
||||||
const expiredTokenCodes = import.meta.env.VITE_SERVICE_EXPIRED_TOKEN_CODES?.split(',') || [];
|
|
||||||
if (expiredTokenCodes.includes(backendErrorCode)) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
showErrorMsg(request.state, message);
|
|
||||||
}
|
}
|
||||||
}
|
)
|
||||||
);
|
);
|
||||||
|
|
||||||
export const demoRequest = createRequest(
|
export const demoRequest = createRequest(
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { useAuthStore } from '@/store/modules/auth';
|
import { useAuthStore } from '@/store/modules/auth';
|
||||||
import { localStg } from '@/utils/storage';
|
import { localStg } from '@/utils/storage';
|
||||||
import { fetchRefreshToken } from '../api';
|
import { fetchRefreshToken } from '../api';
|
||||||
|
import { SESSION_EXPIRED_MESSAGE } from './error-message';
|
||||||
import type { RequestInstanceState } from './type';
|
import type { RequestInstanceState } from './type';
|
||||||
|
|
||||||
export function getAuthorization() {
|
export function getAuthorization() {
|
||||||
@@ -12,8 +13,6 @@ export function getAuthorization() {
|
|||||||
|
|
||||||
/** 刷新 token */
|
/** 刷新 token */
|
||||||
async function handleRefreshToken() {
|
async function handleRefreshToken() {
|
||||||
const { resetStore } = useAuthStore();
|
|
||||||
|
|
||||||
const rToken = localStg.get('refreshToken') || '';
|
const rToken = localStg.get('refreshToken') || '';
|
||||||
const { error, data } = await fetchRefreshToken(rToken);
|
const { error, data } = await fetchRefreshToken(rToken);
|
||||||
if (!error) {
|
if (!error) {
|
||||||
@@ -22,25 +21,48 @@ async function handleRefreshToken() {
|
|||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
resetStore();
|
notifySessionExpired();
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function handleExpiredRequest(state: RequestInstanceState) {
|
export async function handleExpiredRequest(state: RequestInstanceState) {
|
||||||
if (!state.refreshTokenFn) {
|
if (!state.refreshTokenPromise) {
|
||||||
state.refreshTokenFn = handleRefreshToken();
|
state.refreshTokenPromise = handleRefreshToken();
|
||||||
}
|
}
|
||||||
|
|
||||||
const success = await state.refreshTokenFn;
|
const success = await state.refreshTokenPromise;
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
state.refreshTokenFn = null;
|
state.refreshTokenPromise = null;
|
||||||
}, 1000);
|
}, 1000);
|
||||||
|
|
||||||
return success;
|
return success;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 会话失效一次性锁:保证 N 个并发请求只弹一次 toast、只 resetStore 一次
|
||||||
|
let sessionExpiredNotified = false;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 通知用户会话已失效,弹一次 toast 后清状态、跳登录。
|
||||||
|
*
|
||||||
|
* 多个并发请求触发时只会真正执行一次;登录成功后由 resetSessionExpiredFlag() 复位。
|
||||||
|
*/
|
||||||
|
export function notifySessionExpired() {
|
||||||
|
if (sessionExpiredNotified) return;
|
||||||
|
sessionExpiredNotified = true;
|
||||||
|
|
||||||
|
window.$message?.error(SESSION_EXPIRED_MESSAGE);
|
||||||
|
|
||||||
|
const { resetStore } = useAuthStore();
|
||||||
|
resetStore();
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 登录成功后复位一次性锁,让下一次会话失效仍能正常提示 */
|
||||||
|
export function resetSessionExpiredFlag() {
|
||||||
|
sessionExpiredNotified = false;
|
||||||
|
}
|
||||||
|
|
||||||
export function showErrorMsg(state: RequestInstanceState, message: string) {
|
export function showErrorMsg(state: RequestInstanceState, message: string) {
|
||||||
if (!state.errMsgStack?.length) {
|
if (!state.errMsgStack?.length) {
|
||||||
state.errMsgStack = [];
|
state.errMsgStack = [];
|
||||||
|
|||||||
@@ -3,5 +3,7 @@ export interface RequestInstanceState {
|
|||||||
refreshTokenPromise: Promise<boolean> | null;
|
refreshTokenPromise: Promise<boolean> | null;
|
||||||
/** 请求错误信息栈 */
|
/** 请求错误信息栈 */
|
||||||
errMsgStack: string[];
|
errMsgStack: string[];
|
||||||
|
// 索引签名是 @sa/axios 的 defaultState 类型约束(要求 Record<string, unknown>)的硬要求,不能删
|
||||||
|
// 字段名对齐已通过把 shared.ts 里的 refreshTokenFn 全部改成 refreshTokenPromise 来消除隐患
|
||||||
[key: string]: unknown;
|
[key: string]: unknown;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import { useRoute } from 'vue-router';
|
|||||||
import { defineStore } from 'pinia';
|
import { defineStore } from 'pinia';
|
||||||
import { useLoading } from '@sa/hooks';
|
import { useLoading } from '@sa/hooks';
|
||||||
import { clearAuthApiCache, fetchGetUserInfo, fetchLogin } from '@/service/api';
|
import { clearAuthApiCache, fetchGetUserInfo, fetchLogin } from '@/service/api';
|
||||||
|
import { resetSessionExpiredFlag } from '@/service/request/shared';
|
||||||
import { useRouterPush } from '@/hooks/common/router';
|
import { useRouterPush } from '@/hooks/common/router';
|
||||||
import { localStg } from '@/utils/storage';
|
import { localStg } from '@/utils/storage';
|
||||||
import { SetupStoreId } from '@/enum';
|
import { SetupStoreId } from '@/enum';
|
||||||
@@ -28,6 +29,7 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
|||||||
const userInfo: Api.Auth.UserInfo = reactive({
|
const userInfo: Api.Auth.UserInfo = reactive({
|
||||||
userId: '',
|
userId: '',
|
||||||
userName: '',
|
userName: '',
|
||||||
|
nickname: '',
|
||||||
roles: [],
|
roles: [],
|
||||||
buttons: []
|
buttons: []
|
||||||
});
|
});
|
||||||
@@ -49,16 +51,27 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
|||||||
|
|
||||||
clearAuthStorage();
|
clearAuthStorage();
|
||||||
|
|
||||||
authStore.$reset();
|
// setup store 没有内置 $reset,需要显式重置内部状态,避免 token / userInfo 残留导致 isLogin 误判。
|
||||||
dictStore.resetDictCache();
|
token.value = '';
|
||||||
objectContextStore.$reset();
|
Object.assign(userInfo, {
|
||||||
|
userId: '',
|
||||||
|
userName: '',
|
||||||
|
nickname: '',
|
||||||
|
roles: [],
|
||||||
|
buttons: []
|
||||||
|
});
|
||||||
|
|
||||||
if (!route.meta.constant) {
|
dictStore.resetDictCache();
|
||||||
|
objectContextStore.clearContext();
|
||||||
|
|
||||||
|
// 用路由名判断当前是否已在登录页,避免依赖 route.meta.constant ——
|
||||||
|
// workbench 等首页也是常量路由,原写法会让常量路由上的登出请求不跳转。
|
||||||
|
if (route.name !== 'login') {
|
||||||
await toLogin();
|
await toLogin();
|
||||||
}
|
}
|
||||||
|
|
||||||
tabStore.cacheTabs();
|
tabStore.cacheTabs();
|
||||||
routeStore.resetStore();
|
await routeStore.resetStore();
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Record the user ID of the previous login session Used to compare with the current user ID on next login */
|
/** Record the user ID of the previous login session Used to compare with the current user ID on next login */
|
||||||
@@ -148,6 +161,9 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
|||||||
|
|
||||||
token.value = loginToken.token;
|
token.value = loginToken.token;
|
||||||
|
|
||||||
|
// 复位会话失效一次性锁,让下一次会话失效仍能正常提示
|
||||||
|
resetSessionExpiredFlag();
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -167,6 +183,18 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function refreshUserInfo() {
|
||||||
|
const { data: info, error } = await fetchGetUserInfo(true);
|
||||||
|
|
||||||
|
if (!error) {
|
||||||
|
Object.assign(userInfo, info);
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
async function initUserInfo() {
|
async function initUserInfo() {
|
||||||
const hasToken = getToken();
|
const hasToken = getToken();
|
||||||
|
|
||||||
@@ -189,6 +217,7 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
|||||||
loginLoading,
|
loginLoading,
|
||||||
resetStore,
|
resetStore,
|
||||||
login,
|
login,
|
||||||
initUserInfo
|
initUserInfo,
|
||||||
|
refreshUserInfo
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -149,9 +149,16 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
|||||||
|
|
||||||
/** 重置 store */
|
/** 重置 store */
|
||||||
async function resetStore() {
|
async function resetStore() {
|
||||||
const routeStore = useRouteStore();
|
// setup store 没有内置 $reset,需要显式重置内部状态。
|
||||||
|
// 否则 isInitConstantRoute / isInitAuthRoute 一直停在 true,导致下面 initConstantRoute 早返,
|
||||||
routeStore.$reset();
|
// 路由被 resetVueRoutes 摘掉后无法重新注册,菜单和导航都会失效。
|
||||||
|
setIsInitConstantRoute(false);
|
||||||
|
setIsInitAuthRoute(false);
|
||||||
|
constantRoutes.value = [];
|
||||||
|
authRoutes.value = [];
|
||||||
|
menus.value = [];
|
||||||
|
cacheRoutes.value = [];
|
||||||
|
excludeCacheRoutes.value = [];
|
||||||
|
|
||||||
resetVueRoutes();
|
resetVueRoutes();
|
||||||
|
|
||||||
@@ -242,7 +249,10 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
|||||||
/** 统一处理常量路由和权限路由 */
|
/** 统一处理常量路由和权限路由 */
|
||||||
async function handleConstantAndAuthRoutes() {
|
async function handleConstantAndAuthRoutes() {
|
||||||
const { getAuthVueRoutes } = await loadRouteModule();
|
const { getAuthVueRoutes } = await loadRouteModule();
|
||||||
const allRoutes = [...constantRoutes.value, ...authRoutes.value];
|
// 常量路由优先:动态权限路由中与常量路由 name 重复的项剔除,避免菜单出现重复入口(如 workbench)
|
||||||
|
const constantRouteNames = new Set(constantRoutes.value.map(route => route.name));
|
||||||
|
const dedupedAuthRoutes = authRoutes.value.filter(route => !constantRouteNames.has(route.name));
|
||||||
|
const allRoutes = [...constantRoutes.value, ...dedupedAuthRoutes];
|
||||||
|
|
||||||
const sortRoutes = sortRoutesByOrder(allRoutes);
|
const sortRoutes = sortRoutesByOrder(allRoutes);
|
||||||
|
|
||||||
|
|||||||
@@ -153,7 +153,12 @@ export function getCacheRouteNames(routes: RouteRecordRaw[]) {
|
|||||||
const cacheNames: LastLevelRouteKey[] = [];
|
const cacheNames: LastLevelRouteKey[] = [];
|
||||||
|
|
||||||
routes.forEach(route => {
|
routes.forEach(route => {
|
||||||
// only get last two level route, which has component
|
// Check first-level routes (routes with component but no children)
|
||||||
|
if (route.component && route.meta?.keepAlive && !route.children?.length) {
|
||||||
|
cacheNames.push(route.name as LastLevelRouteKey);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check second-level routes
|
||||||
route.children?.forEach(child => {
|
route.children?.forEach(child => {
|
||||||
if (child.component && child.meta?.keepAlive) {
|
if (child.component && child.meta?.keepAlive) {
|
||||||
cacheNames.push(child.name as LastLevelRouteKey);
|
cacheNames.push(child.name as LastLevelRouteKey);
|
||||||
|
|||||||
@@ -428,6 +428,18 @@ html .el-collapse {
|
|||||||
margin-left: 0 !important;
|
margin-left: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.business-table-card-body {
|
||||||
|
display: flex;
|
||||||
|
height: calc(100% - 56px);
|
||||||
|
min-height: 0;
|
||||||
|
flex: 1;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
> .flex-1 {
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.el-card {
|
.el-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
@@ -484,3 +496,44 @@ html .el-collapse {
|
|||||||
border-radius: $radius;
|
border-radius: $radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.el-message {
|
||||||
|
min-width: 280px;
|
||||||
|
padding: 12px 18px;
|
||||||
|
border: none;
|
||||||
|
border-radius: $radius;
|
||||||
|
box-shadow: 0 6px 16px rgb(0 0 0 / 15%);
|
||||||
|
|
||||||
|
.el-message__content {
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-icon {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-message__closeBtn {
|
||||||
|
color: rgb(255 255 255 / 80%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-message__closeBtn:hover {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
&--success {
|
||||||
|
background-color: var(--el-color-success);
|
||||||
|
}
|
||||||
|
|
||||||
|
&--info {
|
||||||
|
background-color: var(--el-color-info);
|
||||||
|
}
|
||||||
|
|
||||||
|
&--warning {
|
||||||
|
background-color: var(--el-color-warning);
|
||||||
|
}
|
||||||
|
|
||||||
|
&--error {
|
||||||
|
background-color: var(--el-color-danger);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
35
src/typings/api/auth.d.ts
vendored
35
src/typings/api/auth.d.ts
vendored
@@ -13,8 +13,43 @@ declare namespace Api {
|
|||||||
interface UserInfo {
|
interface UserInfo {
|
||||||
userId: string;
|
userId: string;
|
||||||
userName: string;
|
userName: string;
|
||||||
|
nickname: string;
|
||||||
roles: string[];
|
roles: string[];
|
||||||
buttons: string[];
|
buttons: string[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface MyProfileDetail {
|
||||||
|
userId: string;
|
||||||
|
username: string;
|
||||||
|
nickname?: string | null;
|
||||||
|
deptId?: string | null;
|
||||||
|
deptName?: string | null;
|
||||||
|
positionId?: string | null;
|
||||||
|
positionName?: string | null;
|
||||||
|
company?: string | null;
|
||||||
|
email?: string | null;
|
||||||
|
mobile?: string | null;
|
||||||
|
sex?: Api.SystemManage.UserGender | null;
|
||||||
|
avatar?: string | null;
|
||||||
|
roles: Api.SystemManage.RoleSimple[];
|
||||||
|
dept?: Api.SystemManage.DeptSimple | null;
|
||||||
|
position?: Api.SystemManage.PostSimple | null;
|
||||||
|
loginIp?: string | null;
|
||||||
|
loginDate?: string | null;
|
||||||
|
createTime?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface UpdateMyProfileParams {
|
||||||
|
nickname?: string | null;
|
||||||
|
email?: string | null;
|
||||||
|
mobile?: string | null;
|
||||||
|
sex?: Api.SystemManage.UserGender | null;
|
||||||
|
avatar?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface UpdateMyPasswordParams {
|
||||||
|
oldPassword: string;
|
||||||
|
newPassword: string;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
6
src/typings/api/dict.d.ts
vendored
6
src/typings/api/dict.d.ts
vendored
@@ -47,6 +47,8 @@ declare namespace Api {
|
|||||||
id: number;
|
id: number;
|
||||||
/** dict label */
|
/** dict label */
|
||||||
label: string;
|
label: string;
|
||||||
|
/** sign */
|
||||||
|
sign?: string | null;
|
||||||
/** dict value */
|
/** dict value */
|
||||||
value: string;
|
value: string;
|
||||||
/** dict type code */
|
/** dict type code */
|
||||||
@@ -65,6 +67,8 @@ declare namespace Api {
|
|||||||
interface FrontendDictData {
|
interface FrontendDictData {
|
||||||
/** dict label */
|
/** dict label */
|
||||||
label: string;
|
label: string;
|
||||||
|
/** sign */
|
||||||
|
sign?: string | null;
|
||||||
/** dict value */
|
/** dict value */
|
||||||
value: string;
|
value: string;
|
||||||
/** display order */
|
/** display order */
|
||||||
@@ -82,7 +86,7 @@ declare namespace Api {
|
|||||||
type DictDataSearchParams = CommonType.RecordNullable<Pick<DictData, 'label' | 'dictType' | 'status'>> & PageParams;
|
type DictDataSearchParams = CommonType.RecordNullable<Pick<DictData, 'label' | 'dictType' | 'status'>> & PageParams;
|
||||||
|
|
||||||
/** dict data save params */
|
/** dict data save params */
|
||||||
type SaveDictDataParams = Pick<DictData, 'label' | 'value' | 'dictType' | 'sort' | 'status'> & {
|
type SaveDictDataParams = Pick<DictData, 'label' | 'sign' | 'value' | 'dictType' | 'sort' | 'status'> & {
|
||||||
remark?: string | null;
|
remark?: string | null;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|||||||
101
src/typings/api/infra.d.ts
vendored
Normal file
101
src/typings/api/infra.d.ts
vendored
Normal file
@@ -0,0 +1,101 @@
|
|||||||
|
declare namespace Api {
|
||||||
|
/**
|
||||||
|
* namespace Infra
|
||||||
|
*
|
||||||
|
* backend api module: "project/status/*"
|
||||||
|
*/
|
||||||
|
namespace Infra {
|
||||||
|
type CommonStatus = 0 | 1;
|
||||||
|
|
||||||
|
interface PageParams {
|
||||||
|
pageNo: number;
|
||||||
|
pageSize: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface PageResult<T = any> {
|
||||||
|
total: number;
|
||||||
|
list: T[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ObjectStatusModel {
|
||||||
|
id: string;
|
||||||
|
objectType: string;
|
||||||
|
statusCode: string;
|
||||||
|
statusName: string;
|
||||||
|
sort: number;
|
||||||
|
status: CommonStatus;
|
||||||
|
initialFlag: boolean;
|
||||||
|
terminalFlag: boolean;
|
||||||
|
allowEdit: boolean;
|
||||||
|
progressExcludedFlag: boolean;
|
||||||
|
allowCreateProject: boolean;
|
||||||
|
allowCreateRequirement: boolean;
|
||||||
|
remark?: string | null;
|
||||||
|
creator?: string | null;
|
||||||
|
createTime: string;
|
||||||
|
updater?: string | null;
|
||||||
|
updateTime: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
type ObjectStatusModelSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> &
|
||||||
|
Pick<ObjectStatusModel, 'objectType' | 'status' | 'initialFlag' | 'terminalFlag'> & {
|
||||||
|
keyword?: string;
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
type SaveObjectStatusModelParams = Pick<
|
||||||
|
ObjectStatusModel,
|
||||||
|
| 'objectType'
|
||||||
|
| 'statusCode'
|
||||||
|
| 'statusName'
|
||||||
|
| 'sort'
|
||||||
|
| 'status'
|
||||||
|
| 'initialFlag'
|
||||||
|
| 'terminalFlag'
|
||||||
|
| 'allowEdit'
|
||||||
|
| 'progressExcludedFlag'
|
||||||
|
| 'allowCreateProject'
|
||||||
|
| 'allowCreateRequirement'
|
||||||
|
> & {
|
||||||
|
remark?: string | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
type ObjectStatusModelList = PageResult<ObjectStatusModel>;
|
||||||
|
|
||||||
|
interface ObjectStatusTransition {
|
||||||
|
id: string;
|
||||||
|
objectType: string;
|
||||||
|
actionCode: string;
|
||||||
|
actionName: string;
|
||||||
|
fromStatusCode: string;
|
||||||
|
fromStatusName?: string | null;
|
||||||
|
toStatusCode: string;
|
||||||
|
toStatusName?: string | null;
|
||||||
|
needReason: boolean;
|
||||||
|
status: CommonStatus;
|
||||||
|
remark?: string | null;
|
||||||
|
creator?: string | null;
|
||||||
|
createTime: string;
|
||||||
|
updater?: string | null;
|
||||||
|
updateTime: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
type ObjectStatusTransitionSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> &
|
||||||
|
Pick<
|
||||||
|
ObjectStatusTransition,
|
||||||
|
'objectType' | 'fromStatusCode' | 'toStatusCode' | 'status' | 'actionCode' | 'actionName'
|
||||||
|
>
|
||||||
|
>;
|
||||||
|
|
||||||
|
type SaveObjectStatusTransitionParams = Pick<
|
||||||
|
ObjectStatusTransition,
|
||||||
|
'objectType' | 'actionCode' | 'actionName' | 'fromStatusCode' | 'toStatusCode' | 'needReason' | 'status'
|
||||||
|
> & {
|
||||||
|
remark?: string | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
type ObjectStatusTransitionList = PageResult<ObjectStatusTransition>;
|
||||||
|
}
|
||||||
|
}
|
||||||
84
src/typings/api/product.d.ts
vendored
84
src/typings/api/product.d.ts
vendored
@@ -21,6 +21,12 @@ declare namespace Api {
|
|||||||
list: T[];
|
list: T[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 产品入口页概览统计 */
|
||||||
|
interface ProductOverviewSummary {
|
||||||
|
/** 产品状态数量映射,key 为后端状态编码 */
|
||||||
|
statusCounts: Record<string, number>;
|
||||||
|
}
|
||||||
|
|
||||||
interface Product {
|
interface Product {
|
||||||
/** 产品 ID */
|
/** 产品 ID */
|
||||||
id: string;
|
id: string;
|
||||||
@@ -204,6 +210,32 @@ declare namespace Api {
|
|||||||
previousManagerRoleId?: string | null;
|
previousManagerRoleId?: string | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 批量新增产品成员参数
|
||||||
|
*
|
||||||
|
* 刻意不复用 CreateProductMemberParams:批量接口不承担「产品经理交接」语义,
|
||||||
|
* 后端兜底拒绝 roleId 为产品经理角色的项。
|
||||||
|
*/
|
||||||
|
interface BatchCreateProductMembersParams {
|
||||||
|
members: Array<{
|
||||||
|
userId: string;
|
||||||
|
roleId: string;
|
||||||
|
remark?: string | null;
|
||||||
|
}>;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 产品创建(含初始团队)原子接口参数
|
||||||
|
*
|
||||||
|
* 新增产品两步向导提交的载荷。经理成员也由前端聚合到 members 数组中。
|
||||||
|
*/
|
||||||
|
interface CreateProductWithTeamParams {
|
||||||
|
product: SaveProductParams;
|
||||||
|
members: CreateProductMemberParams[];
|
||||||
|
/** 关注人 user_id 数组(选填);后端按 (user, object, role) 三元组幂等写入 product_watcher 角色 */
|
||||||
|
watcherUserIds?: string[];
|
||||||
|
}
|
||||||
|
|
||||||
interface UpdateProductMemberParams {
|
interface UpdateProductMemberParams {
|
||||||
roleId: string;
|
roleId: string;
|
||||||
remark?: string | null;
|
remark?: string | null;
|
||||||
@@ -216,6 +248,11 @@ declare namespace Api {
|
|||||||
reason?: string | null;
|
reason?: string | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface BatchInactiveProductMembersParams {
|
||||||
|
memberIds: string[];
|
||||||
|
reason?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
// ========== 产品需求相关类型定义 ==========
|
// ========== 产品需求相关类型定义 ==========
|
||||||
/** 需求状态编码 */
|
/** 需求状态编码 */
|
||||||
type RequirementStatusCode =
|
type RequirementStatusCode =
|
||||||
@@ -250,17 +287,19 @@ declare namespace Api {
|
|||||||
moduleId: string;
|
moduleId: string;
|
||||||
/** 是否需要评审(0不需要;1需要) */
|
/** 是否需要评审(0不需要;1需要) */
|
||||||
reviewRequired: RequirementReviewRequired;
|
reviewRequired: RequirementReviewRequired;
|
||||||
/** 需求标题 */
|
/** 需求名称 */
|
||||||
title: string;
|
title: string;
|
||||||
/** 需求描述(富文本) */
|
/** 需求内容(富文本) */
|
||||||
description?: string | null;
|
description?: string | null;
|
||||||
/** 需求分类字典值 */
|
/** 附件列表 */
|
||||||
|
attachments?: Api.Project.AttachmentItem[] | null;
|
||||||
|
/** 需求类型字典值 */
|
||||||
category: string;
|
category: string;
|
||||||
/** 需求分类名称 */
|
/** 需求类型名称 */
|
||||||
categoryName?: string | null;
|
categoryName?: string | null;
|
||||||
/** 来源类型 */
|
/** 需求来源类型 */
|
||||||
sourceType: RequirementSourceType;
|
sourceType: RequirementSourceType;
|
||||||
/** 来源业务ID */
|
/** 需求来源业务ID */
|
||||||
sourceBizId?: string | null;
|
sourceBizId?: string | null;
|
||||||
/** 优先级(0低 1中 2高 3紧急) */
|
/** 优先级(0低 1中 2高 3紧急) */
|
||||||
priority: RequirementPriority;
|
priority: RequirementPriority;
|
||||||
@@ -280,12 +319,12 @@ declare namespace Api {
|
|||||||
currentHandlerUserId?: string | null;
|
currentHandlerUserId?: string | null;
|
||||||
/** 当前处理人姓名 */
|
/** 当前处理人姓名 */
|
||||||
currentHandlerUserNickname?: string | null;
|
currentHandlerUserNickname?: string | null;
|
||||||
/** 默认实现项目编号 */
|
/** 默认关联项目编号 */
|
||||||
implementProjectId?: string | null;
|
implementProjectId?: string | null;
|
||||||
/** 实现项目名称 */
|
/** 默认关联项目名称 */
|
||||||
implementProjectName?: string | null;
|
implementProjectName?: string | null;
|
||||||
/** 预期完成时间 */
|
/** 预期完成日期 */
|
||||||
completionDate: string;
|
expectedTime?: string | null;
|
||||||
/** 排序值 */
|
/** 排序值 */
|
||||||
sort: number;
|
sort: number;
|
||||||
/** 创建时间 */
|
/** 创建时间 */
|
||||||
@@ -353,6 +392,21 @@ declare namespace Api {
|
|||||||
availableActions: RequirementLifecycleAction[];
|
availableActions: RequirementLifecycleAction[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface RequirementBatchReqVO {
|
||||||
|
productId: string;
|
||||||
|
requirementIds: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface RequirementAllowedTransitionBatchRespVO {
|
||||||
|
requirementId: string;
|
||||||
|
transitions: RequirementLifecycleAction[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface RequirementHasDispatchedBatchRespVO {
|
||||||
|
requirementId: string;
|
||||||
|
hasDispatched: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
// ========== 请求参数类型 ==========
|
// ========== 请求参数类型 ==========
|
||||||
|
|
||||||
/** 需求分页查询参数 */
|
/** 需求分页查询参数 */
|
||||||
@@ -375,12 +429,15 @@ declare namespace Api {
|
|||||||
| 'reviewRequired'
|
| 'reviewRequired'
|
||||||
| 'title'
|
| 'title'
|
||||||
| 'description'
|
| 'description'
|
||||||
|
| 'attachments'
|
||||||
| 'category'
|
| 'category'
|
||||||
| 'priority'
|
| 'priority'
|
||||||
| 'proposerId'
|
| 'proposerId'
|
||||||
|
| 'proposerNickname'
|
||||||
| 'currentHandlerUserId'
|
| 'currentHandlerUserId'
|
||||||
|
| 'currentHandlerUserNickname'
|
||||||
| 'implementProjectId'
|
| 'implementProjectId'
|
||||||
| 'completionDate'
|
| 'expectedTime'
|
||||||
| 'sort'
|
| 'sort'
|
||||||
>;
|
>;
|
||||||
|
|
||||||
@@ -412,11 +469,14 @@ declare namespace Api {
|
|||||||
| 'reviewRequired'
|
| 'reviewRequired'
|
||||||
| 'title'
|
| 'title'
|
||||||
| 'description'
|
| 'description'
|
||||||
|
| 'attachments'
|
||||||
| 'category'
|
| 'category'
|
||||||
| 'priority'
|
| 'priority'
|
||||||
| 'proposerId'
|
| 'proposerId'
|
||||||
|
| 'proposerNickname'
|
||||||
| 'currentHandlerUserId'
|
| 'currentHandlerUserId'
|
||||||
| 'completionDate'
|
| 'currentHandlerUserNickname'
|
||||||
|
| 'expectedTime'
|
||||||
| 'sort'
|
| 'sort'
|
||||||
>;
|
>;
|
||||||
|
|
||||||
|
|||||||
883
src/typings/api/project.d.ts
vendored
Normal file
883
src/typings/api/project.d.ts
vendored
Normal file
@@ -0,0 +1,883 @@
|
|||||||
|
declare namespace Api {
|
||||||
|
/**
|
||||||
|
* namespace Project
|
||||||
|
*
|
||||||
|
* backend api module: "project/project"
|
||||||
|
*/
|
||||||
|
namespace Project {
|
||||||
|
/** 项目状态编码 */
|
||||||
|
type ProjectStatusCode = 'pending' | 'active' | 'paused' | 'completed' | 'cancelled' | 'archived';
|
||||||
|
|
||||||
|
/** 项目状态动作编码 */
|
||||||
|
type ProjectStatusActionCode = 'auto_start' | 'pause' | 'resume' | 'complete' | 'cancel' | 'reopen' | 'archive';
|
||||||
|
|
||||||
|
/** 项目设置基础信息 */
|
||||||
|
interface ProjectSettingBaseInfo {
|
||||||
|
/** 项目 ID */
|
||||||
|
id: string;
|
||||||
|
/** 项目编码 */
|
||||||
|
projectCode: string;
|
||||||
|
/** 项目名称 */
|
||||||
|
projectName: string;
|
||||||
|
/** 项目方向字典值 */
|
||||||
|
directionCode: string;
|
||||||
|
/** 项目类型字典值 */
|
||||||
|
projectType: string;
|
||||||
|
/** 所属产品 ID */
|
||||||
|
productId: string | null;
|
||||||
|
/** 所属产品名称 */
|
||||||
|
productName: string | null;
|
||||||
|
/** 项目负责人用户昵称 */
|
||||||
|
managerUserNickname: string | null;
|
||||||
|
/** 项目负责人用户 ID */
|
||||||
|
managerUserId: string | null;
|
||||||
|
/** 项目状态编码 */
|
||||||
|
statusCode: ProjectStatusCode;
|
||||||
|
/** 计划开始日期 */
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
/** 计划结束日期 */
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
/** 实际开始日期 */
|
||||||
|
actualStartDate: string | null;
|
||||||
|
/** 实际结束日期 */
|
||||||
|
actualEndDate: string | null;
|
||||||
|
/** 项目说明 */
|
||||||
|
projectDesc: string | null;
|
||||||
|
/** 最近一次状态动作原因 */
|
||||||
|
lastStatusReason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目生命周期动作 */
|
||||||
|
interface ProjectLifecycleAction {
|
||||||
|
actionCode: Exclude<ProjectStatusActionCode, 'auto_start'>;
|
||||||
|
actionName: string;
|
||||||
|
needReason: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目生命周期信息 */
|
||||||
|
interface ProjectLifecycleInfo {
|
||||||
|
statusCode: ProjectStatusCode;
|
||||||
|
lastStatusReason: string | null;
|
||||||
|
availableActions: ProjectLifecycleAction[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 执行状态编码 */
|
||||||
|
type ProjectExecutionStatusCode = 'pending' | 'active' | 'paused' | 'completed' | 'cancelled';
|
||||||
|
|
||||||
|
/** 执行动作编码 */
|
||||||
|
type ProjectExecutionActionCode = 'start' | 'pause' | 'resume' | 'cancel';
|
||||||
|
|
||||||
|
/** 任务状态编码 */
|
||||||
|
type ProjectTaskStatusCode = 'pending' | 'active' | 'paused' | 'completed' | 'cancelled';
|
||||||
|
|
||||||
|
/** 任务动作编码 */
|
||||||
|
type ProjectTaskActionCode = 'auto_start' | 'pause' | 'resume' | 'complete' | 'cancel';
|
||||||
|
|
||||||
|
interface LifecycleAction<ActionCode extends string = string> {
|
||||||
|
actionCode: ActionCode;
|
||||||
|
actionName: string;
|
||||||
|
needReason: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface StatusBoardItem {
|
||||||
|
statusCode: string;
|
||||||
|
statusName: string;
|
||||||
|
count: number;
|
||||||
|
sort: number;
|
||||||
|
terminal?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface StatusBoard {
|
||||||
|
total: number;
|
||||||
|
items: StatusBoardItem[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectExecution {
|
||||||
|
id: string;
|
||||||
|
projectId: string;
|
||||||
|
projectRequirementId: string | null;
|
||||||
|
executionName: string;
|
||||||
|
executionType: string | null;
|
||||||
|
ownerId: string;
|
||||||
|
ownerNickname?: string | null;
|
||||||
|
statusCode: ProjectExecutionStatusCode;
|
||||||
|
statusName: string | null;
|
||||||
|
terminal: boolean;
|
||||||
|
allowEdit: boolean;
|
||||||
|
availableActions: LifecycleAction<ProjectExecutionActionCode>[];
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
actualStartDate: string | null;
|
||||||
|
actualEndDate: string | null;
|
||||||
|
progressRate: number;
|
||||||
|
executionDesc: string | null;
|
||||||
|
lastStatusReason: string | null;
|
||||||
|
createTime: string;
|
||||||
|
updateTime: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ExecutionAssignee {
|
||||||
|
id: string;
|
||||||
|
executionId: string;
|
||||||
|
userId: string;
|
||||||
|
userNickname?: string | null;
|
||||||
|
joinedAt: string | null;
|
||||||
|
removedAt: string | null;
|
||||||
|
removedReason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 执行协办人变更事件类型 */
|
||||||
|
type ExecutionAssigneeActionType = 'join' | 'inactive' | 'owner_transfer_in' | 'owner_transfer_out';
|
||||||
|
|
||||||
|
/** 执行协办人变更历史 */
|
||||||
|
interface ExecutionAssigneeLog {
|
||||||
|
id: string;
|
||||||
|
executionId: string;
|
||||||
|
actionType: ExecutionAssigneeActionType;
|
||||||
|
userId: string;
|
||||||
|
userNicknameSnapshot: string | null;
|
||||||
|
operatorUserId: string;
|
||||||
|
operatorNicknameSnapshot: string | null;
|
||||||
|
actionTime: string;
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
type ExecutionAssigneeLogSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
actionTypes: ExecutionAssigneeActionType[];
|
||||||
|
userId: string;
|
||||||
|
startTime: string;
|
||||||
|
endTime: string;
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
/** 通用附件元数据(任务 / 工时等域共用,规则见 AttachmentValidator) */
|
||||||
|
interface AttachmentItem {
|
||||||
|
/**
|
||||||
|
* 文件 ID(infra_file.id 字符串形式)。
|
||||||
|
* 用于会话级清理时调用 DELETE /system/file/delete?id=xxx 删除孤儿文件。
|
||||||
|
*/
|
||||||
|
fileId: string;
|
||||||
|
url: string;
|
||||||
|
name: string;
|
||||||
|
size?: number;
|
||||||
|
contentType?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 任务详情 / 分页响应里嵌入的活跃协办人引用(按加入时间正序) */
|
||||||
|
interface TaskAssigneeRef {
|
||||||
|
id: string;
|
||||||
|
userId: string;
|
||||||
|
nickname: string;
|
||||||
|
/** 加入时间,5.6 路径返;5.3 嵌入路径不返,留 undefined */
|
||||||
|
joinedAt?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 协办人变更事件类型(5.9 actionType) */
|
||||||
|
type TaskAssigneeActionType = 'join' | 'inactive';
|
||||||
|
|
||||||
|
/** 协办人变更日志 */
|
||||||
|
interface TaskAssigneeLog {
|
||||||
|
id: string;
|
||||||
|
taskId: string;
|
||||||
|
actionType: TaskAssigneeActionType;
|
||||||
|
userId: string;
|
||||||
|
userNicknameSnapshot: string | null;
|
||||||
|
operatorUserId: string;
|
||||||
|
operatorNicknameSnapshot: string | null;
|
||||||
|
actionTime: string;
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
type TaskAssigneeLogSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
actionTypes: TaskAssigneeActionType[];
|
||||||
|
userId: string;
|
||||||
|
startTime: string;
|
||||||
|
endTime: string;
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
/** 5.7 加入协办人入参 */
|
||||||
|
interface CreateTaskAssigneeParams {
|
||||||
|
userId: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 5.8 退出协办人入参 */
|
||||||
|
interface InactiveTaskAssigneeParams {
|
||||||
|
reason: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectTask {
|
||||||
|
id: string;
|
||||||
|
projectId: string;
|
||||||
|
executionId: string;
|
||||||
|
parentTaskId: string | null;
|
||||||
|
taskTitle: string;
|
||||||
|
ownerId: string;
|
||||||
|
ownerNickname?: string | null;
|
||||||
|
/** 所属执行的负责人 userId(按钮可见度公式用) */
|
||||||
|
executionOwnerId: string;
|
||||||
|
/** 父任务负责人 userId(一级任务为 null) */
|
||||||
|
parentTaskOwnerId: string | null;
|
||||||
|
statusCode: ProjectTaskStatusCode;
|
||||||
|
statusName: string | null;
|
||||||
|
terminal: boolean;
|
||||||
|
allowEdit: boolean;
|
||||||
|
availableActions: LifecycleAction<ProjectTaskActionCode>[];
|
||||||
|
progressRate: number;
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
actualStartDate: string | null;
|
||||||
|
actualEndDate: string | null;
|
||||||
|
taskDesc: string | null;
|
||||||
|
lastStatusReason: string | null;
|
||||||
|
assignees?: TaskAssigneeRef[] | null;
|
||||||
|
attachments?: AttachmentItem[] | null;
|
||||||
|
/** 已填报工时合计,单位小时(0.5 颗粒,BigDecimal)。逻辑删除的工时不计入。 */
|
||||||
|
totalSpentHours?: number | null;
|
||||||
|
createTime: string;
|
||||||
|
updateTime: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
type ProjectExecutionSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
keyword: string;
|
||||||
|
executionType: string;
|
||||||
|
ownerId: string;
|
||||||
|
statusCode: string;
|
||||||
|
updateTime: string[];
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
type ProjectExecutionStatusBoardParams = CommonType.RecordNullable<{
|
||||||
|
keyword: string;
|
||||||
|
executionType: string;
|
||||||
|
ownerId: string;
|
||||||
|
updateTime: string[];
|
||||||
|
}>;
|
||||||
|
|
||||||
|
/** 创建执行入参(含 ownerId + assigneeUserIds) */
|
||||||
|
interface CreateProjectExecutionParams {
|
||||||
|
executionName: string;
|
||||||
|
executionType: string;
|
||||||
|
ownerId: string;
|
||||||
|
projectRequirementId: string | null;
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
executionDesc: string | null;
|
||||||
|
assigneeUserIds?: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 执行创建/编辑弹层 emit 的统一 payload(创建时含 ownerId + assigneeUserIds;编辑时不含) */
|
||||||
|
type SaveProjectExecutionParams = CreateProjectExecutionParams;
|
||||||
|
|
||||||
|
/** 编辑执行入参(不含 ownerId / assigneeUserIds) */
|
||||||
|
interface UpdateProjectExecutionParams {
|
||||||
|
executionName: string;
|
||||||
|
executionType: string;
|
||||||
|
projectRequirementId: string | null;
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
executionDesc: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChangeExecutionOwnerParams {
|
||||||
|
newOwnerId: string;
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChangeExecutionStatusParams {
|
||||||
|
actionCode: ProjectExecutionActionCode;
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface CreateExecutionAssigneeParams {
|
||||||
|
userId: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface InactiveExecutionAssigneeParams {
|
||||||
|
reason: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
type ProjectTaskSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
keyword: string;
|
||||||
|
parentTaskId: string;
|
||||||
|
ownerId: string;
|
||||||
|
statusCode: string;
|
||||||
|
updateTime: string[];
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
type ProjectTaskStatusBoardParams = CommonType.RecordNullable<{
|
||||||
|
keyword: string;
|
||||||
|
parentTaskId: string;
|
||||||
|
ownerId: string;
|
||||||
|
updateTime: string[];
|
||||||
|
}>;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 任务看板按状态分组的分页入参。
|
||||||
|
*
|
||||||
|
* - `statusCode` 缺省 → 返回该执行下任务状态字典中的全部状态(即使该状态下当前没有任务,也要回该列、`total=0`、`list=[]`)。
|
||||||
|
* - 传入数组 → 只返回这些状态的列。
|
||||||
|
* - `pageNo` / `pageSize` 应用到所有返回的状态(同一页码下各状态各自分页),前端不需要"每列独立 pageNo"。
|
||||||
|
*/
|
||||||
|
type ProjectTaskBoardPageParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
statusCode: string[];
|
||||||
|
keyword: string;
|
||||||
|
parentTaskId: string;
|
||||||
|
ownerId: string;
|
||||||
|
updateTime: string[];
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
interface ProjectTaskBoardColumn {
|
||||||
|
statusCode: string;
|
||||||
|
statusName: string;
|
||||||
|
sort: number;
|
||||||
|
terminal?: boolean;
|
||||||
|
list: ProjectTask[];
|
||||||
|
total: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectTaskBoardPage {
|
||||||
|
items: ProjectTaskBoardColumn[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface SaveProjectTaskParams {
|
||||||
|
parentTaskId: string | null;
|
||||||
|
taskTitle: string;
|
||||||
|
ownerId: string | null;
|
||||||
|
progressRate?: number;
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
taskDesc: string | null;
|
||||||
|
/** 仅创建任务时生效,编辑接口静默忽略;userId 必须是当前有效执行协办人且不能等于 ownerId */
|
||||||
|
assigneeUserIds?: string[];
|
||||||
|
/** 编辑语义:null 保留原值 / [] 清空 / [...] 整体替换 */
|
||||||
|
attachments?: AttachmentItem[] | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChangeTaskStatusParams {
|
||||||
|
actionCode: ProjectTaskActionCode;
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 任务工时记录 */
|
||||||
|
interface TaskWorklog {
|
||||||
|
id: string;
|
||||||
|
taskId: string;
|
||||||
|
userId: string;
|
||||||
|
userNickname: string | null;
|
||||||
|
/** 段起始日期(含),YYYY-MM-DD;单天=与 endDate 相等 */
|
||||||
|
startDate: string;
|
||||||
|
/** 段结束日期(含),YYYY-MM-DD;单天=与 startDate 相等 */
|
||||||
|
endDate: string;
|
||||||
|
/** 本次填报小时数(BigDecimal,0.5 颗粒,> 0) */
|
||||||
|
durationHours: number;
|
||||||
|
/** 本次填报进度(0~100,scale=2) */
|
||||||
|
progressRate: number;
|
||||||
|
workContent: string | null;
|
||||||
|
attachments?: AttachmentItem[] | null;
|
||||||
|
createTime: string;
|
||||||
|
updateTime: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
type TaskWorklogSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
userId: string;
|
||||||
|
startDate: string;
|
||||||
|
endDate: string;
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
interface SaveTaskWorklogParams {
|
||||||
|
/** 段起始日期(含),YYYY-MM-DD */
|
||||||
|
startDate: string;
|
||||||
|
/** 段结束日期(含),YYYY-MM-DD;不得早于 startDate */
|
||||||
|
endDate: string;
|
||||||
|
/** 本次填报小时数,> 0 且 0.5 整数倍 */
|
||||||
|
durationHours: number;
|
||||||
|
/** 本次填报进度(0~100,scale=2,必填) */
|
||||||
|
progressRate: number;
|
||||||
|
workContent?: string | null;
|
||||||
|
/** 编辑语义:null 保留原值 / [] 清空 / [...] 替换 */
|
||||||
|
attachments?: AttachmentItem[] | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目设置参数 */
|
||||||
|
interface ProjectSettings {
|
||||||
|
baseInfo: ProjectSettingBaseInfo;
|
||||||
|
lifecycle: ProjectLifecycleInfo;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目设置基础信息参数 */
|
||||||
|
interface UpdateProjectSettingBaseInfoParams {
|
||||||
|
projectName: string;
|
||||||
|
directionCode: string;
|
||||||
|
projectType: string;
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
projectDesc: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目成员状态 */
|
||||||
|
type ProjectMemberStatus = 0 | 1;
|
||||||
|
|
||||||
|
interface PageParams {
|
||||||
|
pageNo: number;
|
||||||
|
pageSize: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface PageResult<T = any> {
|
||||||
|
total: number;
|
||||||
|
list: T[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目入口页概览统计 */
|
||||||
|
interface ProjectOverviewSummary {
|
||||||
|
/** 项目状态数量映射,key 为后端状态编码 */
|
||||||
|
statusCounts: Record<string, number>;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Project {
|
||||||
|
/** 项目 ID */
|
||||||
|
id: string;
|
||||||
|
/** 项目编码 */
|
||||||
|
projectCode: string;
|
||||||
|
/** 项目名称 */
|
||||||
|
projectName: string;
|
||||||
|
/** 项目方向字典值 */
|
||||||
|
directionCode: string;
|
||||||
|
/** 项目类型字典值 */
|
||||||
|
projectType: string;
|
||||||
|
/** 所属产品 ID */
|
||||||
|
productId: string | null;
|
||||||
|
/** 所属产品名称 */
|
||||||
|
productName?: string | null;
|
||||||
|
/** 项目负责人用户 ID */
|
||||||
|
managerUserId: string;
|
||||||
|
/** 项目负责人用户昵称 */
|
||||||
|
managerUserNickname?: string | null;
|
||||||
|
/** 项目状态编码 */
|
||||||
|
statusCode: ProjectStatusCode;
|
||||||
|
/** 计划开始日期 */
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
/** 计划结束日期 */
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
/** 实际开始日期 */
|
||||||
|
actualStartDate: string | null;
|
||||||
|
/** 实际结束日期 */
|
||||||
|
actualEndDate: string | null;
|
||||||
|
/** 进度百分比 */
|
||||||
|
progressRate: number;
|
||||||
|
/** 项目说明 */
|
||||||
|
projectDesc: string | null;
|
||||||
|
/** 最近一次状态动作原因 */
|
||||||
|
lastStatusReason: string | null;
|
||||||
|
/** 创建时间 */
|
||||||
|
createTime: string;
|
||||||
|
/** 更新时间 */
|
||||||
|
updateTime: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectContext {
|
||||||
|
currentProject: {
|
||||||
|
id: string;
|
||||||
|
projectCode: string;
|
||||||
|
projectName: string;
|
||||||
|
projectType: string;
|
||||||
|
productId: string | null;
|
||||||
|
managerUserId: string;
|
||||||
|
statusCode: ProjectStatusCode;
|
||||||
|
};
|
||||||
|
currentRole: {
|
||||||
|
roleId: string | null;
|
||||||
|
roleCode: string | null;
|
||||||
|
roleName: string | null;
|
||||||
|
guestFlag: boolean;
|
||||||
|
};
|
||||||
|
navs: Array<{
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
path: string;
|
||||||
|
icon: string;
|
||||||
|
sort: number;
|
||||||
|
}>;
|
||||||
|
buttons: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectMember {
|
||||||
|
/** 成员关系 ID */
|
||||||
|
id: string;
|
||||||
|
/** 用户 ID */
|
||||||
|
userId: string;
|
||||||
|
/** 用户昵称 */
|
||||||
|
userNickname: string;
|
||||||
|
/** 角色 ID */
|
||||||
|
roleId: string;
|
||||||
|
/** 角色名称 */
|
||||||
|
roleName: string;
|
||||||
|
/** 角色编码 */
|
||||||
|
roleCode: string;
|
||||||
|
/** 是否项目负责人 */
|
||||||
|
managerFlag: boolean;
|
||||||
|
/** 成员状态 */
|
||||||
|
status: ProjectMemberStatus;
|
||||||
|
/** 加入时间 */
|
||||||
|
joinedTime: string;
|
||||||
|
/** 退出时间 */
|
||||||
|
leftTime: string | null;
|
||||||
|
/** 备注 */
|
||||||
|
remark: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目搜索参数 */
|
||||||
|
type ProjectSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> & {
|
||||||
|
keyword: string;
|
||||||
|
directionCode: string;
|
||||||
|
projectType: string;
|
||||||
|
productId: string;
|
||||||
|
managerUserId: string;
|
||||||
|
statusCode: ProjectStatusCode;
|
||||||
|
updateTime: string[];
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
/** 创建/保存项目参数 */
|
||||||
|
type SaveProjectParams = Pick<Project, 'projectName' | 'directionCode' | 'projectType' | 'projectDesc'> & {
|
||||||
|
projectCode: string | null;
|
||||||
|
productId: string | null;
|
||||||
|
managerUserId: string;
|
||||||
|
plannedStartDate: string | null;
|
||||||
|
plannedEndDate: string | null;
|
||||||
|
actualStartDate?: string | null;
|
||||||
|
actualEndDate?: string | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 更新项目参数 */
|
||||||
|
type UpdateProjectParams = { id: string } & SaveProjectParams;
|
||||||
|
|
||||||
|
/** 变更项目状态参数 */
|
||||||
|
interface ChangeProjectStatusParams {
|
||||||
|
id: string;
|
||||||
|
actionCode: ProjectStatusActionCode;
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 删除项目参数 */
|
||||||
|
interface DeleteProjectParams {
|
||||||
|
id: string;
|
||||||
|
projectName: string;
|
||||||
|
confirmText: string;
|
||||||
|
reason: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 删除执行入参 */
|
||||||
|
interface DeleteProjectExecutionParams {
|
||||||
|
/** 二次确认:必须与当前执行名称完全一致 */
|
||||||
|
executionName: string;
|
||||||
|
/** 删除确认口令:接受 "删除" 或 "DELETE" */
|
||||||
|
confirmText: string;
|
||||||
|
/** 删除原因,写入审计日志 */
|
||||||
|
reason: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 删除任务入参 */
|
||||||
|
interface DeleteProjectTaskParams {
|
||||||
|
/** 二次确认:必须与当前任务名称完全一致 */
|
||||||
|
taskName: string;
|
||||||
|
/** 删除确认口令:接受 "删除" 或 "DELETE" */
|
||||||
|
confirmText: string;
|
||||||
|
/** 删除原因,写入审计日志 */
|
||||||
|
reason: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 创建项目成员参数 */
|
||||||
|
interface CreateProjectMemberParams {
|
||||||
|
userId: string;
|
||||||
|
roleId: string;
|
||||||
|
remark: string | null;
|
||||||
|
previousManagerUserId?: string | null;
|
||||||
|
previousManagerRoleId?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 更新项目成员参数 */
|
||||||
|
interface UpdateProjectMemberParams {
|
||||||
|
roleId: string;
|
||||||
|
reason: string | null;
|
||||||
|
remark: string | null;
|
||||||
|
previousManagerUserId?: string | null;
|
||||||
|
previousManagerRoleId?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 移出项目成员参数 */
|
||||||
|
interface InactiveProjectMemberParams {
|
||||||
|
reason: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 批量新增项目成员参数
|
||||||
|
*
|
||||||
|
* 刻意不复用 CreateProjectMemberParams:批量接口不承担"项目负责人交接"语义,
|
||||||
|
* 后端兜底拒绝 roleId 为项目负责人角色的项。
|
||||||
|
*/
|
||||||
|
interface BatchCreateProjectMembersParams {
|
||||||
|
members: Array<{
|
||||||
|
userId: string;
|
||||||
|
roleId: string;
|
||||||
|
remark?: string | null;
|
||||||
|
}>;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 批量移出项目成员参数 */
|
||||||
|
interface BatchInactiveProjectMembersParams {
|
||||||
|
memberIds: string[];
|
||||||
|
reason?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 项目创建(含初始团队)原子接口参数
|
||||||
|
*
|
||||||
|
* 新增项目两步向导提交的载荷。经理成员也由前端聚合到 members 数组中。
|
||||||
|
*/
|
||||||
|
interface CreateProjectWithTeamParams {
|
||||||
|
project: SaveProjectParams;
|
||||||
|
members: CreateProjectMemberParams[];
|
||||||
|
/** 关注人 user_id 数组(选填);后端按 (user, object, role) 三元组幂等写入 project_watcher 角色 */
|
||||||
|
watcherUserIds?: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
// ========== 项目需求相关类型定义 ==========
|
||||||
|
/** 项目需求状态编码 */
|
||||||
|
type ProjectRequirementStatusCode =
|
||||||
|
| 'pending_confirm'
|
||||||
|
| 'pending_review'
|
||||||
|
| 'implementing'
|
||||||
|
| 'accepted'
|
||||||
|
| 'closed'
|
||||||
|
| 'rejected'
|
||||||
|
| 'cancelled';
|
||||||
|
|
||||||
|
/** 项目需求来源类型 */
|
||||||
|
type ProjectRequirementSourceType = 'manual' | 'work_order' | 'product_requirement';
|
||||||
|
|
||||||
|
/** 项目需求优先级 */
|
||||||
|
type ProjectRequirementPriority = 0 | 1 | 2 | 3;
|
||||||
|
|
||||||
|
/** 是否需要评审 */
|
||||||
|
type ProjectRequirementReviewRequired = 0 | 1;
|
||||||
|
|
||||||
|
interface ProjectRequirement {
|
||||||
|
/** 需求 ID */
|
||||||
|
id: string;
|
||||||
|
/** 所属项目 ID */
|
||||||
|
projectId: string;
|
||||||
|
/** 父需求 ID,0 表示顶级需求 */
|
||||||
|
parentId: string;
|
||||||
|
/** 所属模块 ID */
|
||||||
|
moduleId: string;
|
||||||
|
/** 是否需要评审 */
|
||||||
|
reviewRequired: ProjectRequirementReviewRequired;
|
||||||
|
/** 需求标题 */
|
||||||
|
title: string;
|
||||||
|
/** 需求描述 */
|
||||||
|
description?: string | null;
|
||||||
|
/** 附件列表 */
|
||||||
|
attachments?: AttachmentItem[] | null;
|
||||||
|
/** 需求分类字典值 */
|
||||||
|
category: string;
|
||||||
|
/** 需求分类名称 */
|
||||||
|
categoryName?: string | null;
|
||||||
|
/** 需求来源类型 */
|
||||||
|
sourceType: ProjectRequirementSourceType;
|
||||||
|
/** 来源业务 ID */
|
||||||
|
sourceBizId?: string | null;
|
||||||
|
/** 优先级 */
|
||||||
|
priority: ProjectRequirementPriority;
|
||||||
|
/** 优先级名称 */
|
||||||
|
priorityName?: string | null;
|
||||||
|
/** 当前状态编码 */
|
||||||
|
statusCode: ProjectRequirementStatusCode;
|
||||||
|
/** 当前状态名称 */
|
||||||
|
statusName?: string | null;
|
||||||
|
/** 最近一次状态动作原因 */
|
||||||
|
lastStatusReason?: string | null;
|
||||||
|
/** 提出人用户 ID */
|
||||||
|
proposerId: string;
|
||||||
|
/** 提出人昵称 */
|
||||||
|
proposerNickname?: string | null;
|
||||||
|
/** 当前处理人用户 ID */
|
||||||
|
currentHandlerUserId?: string | null;
|
||||||
|
/** 当前处理人昵称 */
|
||||||
|
currentHandlerUserNickname?: string | null;
|
||||||
|
/** 预期完成日期 */
|
||||||
|
expectedTime?: string | null;
|
||||||
|
/** 排序值 */
|
||||||
|
sort: number;
|
||||||
|
/** 创建时间 */
|
||||||
|
createTime: string;
|
||||||
|
/** 更新时间 */
|
||||||
|
updateTime: string;
|
||||||
|
/** 子需求列表 */
|
||||||
|
children?: ProjectRequirement[];
|
||||||
|
/** 是否终态 */
|
||||||
|
terminal?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectRequirementModule {
|
||||||
|
/** 模块 ID */
|
||||||
|
id: string;
|
||||||
|
/** 父模块 ID,0 表示顶级 */
|
||||||
|
parentId: string;
|
||||||
|
/** 所属项目 ID */
|
||||||
|
projectId: string;
|
||||||
|
/** 模块名称 */
|
||||||
|
moduleName: string;
|
||||||
|
/** 模块说明 */
|
||||||
|
remark?: string | null;
|
||||||
|
/** 图标 */
|
||||||
|
icon?: string | null;
|
||||||
|
/** 排序值 */
|
||||||
|
sort: number;
|
||||||
|
/** 子模块列表 */
|
||||||
|
children?: ProjectRequirementModule[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectRequirementStatusDict {
|
||||||
|
/** 状态编码 */
|
||||||
|
statusCode: string;
|
||||||
|
/** 状态名称 */
|
||||||
|
statusName: string;
|
||||||
|
/** 排序值 */
|
||||||
|
sort: number;
|
||||||
|
/** 是否初始状态 */
|
||||||
|
initialFlag: boolean;
|
||||||
|
/** 是否终态 */
|
||||||
|
terminalFlag: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectRequirementLifecycleAction {
|
||||||
|
actionCode: string;
|
||||||
|
actionName: string;
|
||||||
|
toStatusCode: string;
|
||||||
|
toStatusName: string;
|
||||||
|
needReason: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectRequirementLifecycleInfo {
|
||||||
|
statusCode: ProjectRequirementStatusCode;
|
||||||
|
statusName?: string | null;
|
||||||
|
lastStatusReason?: string | null;
|
||||||
|
terminal: boolean;
|
||||||
|
allowEdit: boolean;
|
||||||
|
availableActions: ProjectRequirementLifecycleAction[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectRequirementBatchReqVO {
|
||||||
|
projectId: string;
|
||||||
|
requirementIds: string[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ProjectRequirementAllowedTransitionBatchRespVO {
|
||||||
|
requirementId: string;
|
||||||
|
transitions: ProjectRequirementLifecycleAction[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 项目需求分页查询参数 */
|
||||||
|
type ProjectRequirementSearchParams = CommonType.RecordNullable<
|
||||||
|
Pick<PageParams, 'pageNo' | 'pageSize'> &
|
||||||
|
Pick<
|
||||||
|
ProjectRequirement,
|
||||||
|
'moduleId' | 'parentId' | 'category' | 'priority' | 'statusCode' | 'currentHandlerUserId' | 'sourceType'
|
||||||
|
> & {
|
||||||
|
projectId: string;
|
||||||
|
title: string;
|
||||||
|
}
|
||||||
|
>;
|
||||||
|
|
||||||
|
/** 创建项目需求参数 */
|
||||||
|
type SaveProjectRequirementParams = Pick<
|
||||||
|
ProjectRequirement,
|
||||||
|
| 'projectId'
|
||||||
|
| 'moduleId'
|
||||||
|
| 'reviewRequired'
|
||||||
|
| 'title'
|
||||||
|
| 'description'
|
||||||
|
| 'attachments'
|
||||||
|
| 'category'
|
||||||
|
| 'priority'
|
||||||
|
| 'proposerId'
|
||||||
|
| 'proposerNickname'
|
||||||
|
| 'currentHandlerUserId'
|
||||||
|
| 'currentHandlerUserNickname'
|
||||||
|
| 'expectedTime'
|
||||||
|
| 'sort'
|
||||||
|
>;
|
||||||
|
|
||||||
|
/** 更新项目需求参数 */
|
||||||
|
type UpdateProjectRequirementParams = { id: string } & SaveProjectRequirementParams;
|
||||||
|
|
||||||
|
/** 变更项目需求状态参数 */
|
||||||
|
interface ChangeProjectRequirementStatusParams {
|
||||||
|
id: string;
|
||||||
|
projectId: string;
|
||||||
|
actionCode: string;
|
||||||
|
reason?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 关闭项目需求参数 */
|
||||||
|
interface CloseProjectRequirementParams {
|
||||||
|
id: string;
|
||||||
|
projectId: string;
|
||||||
|
reason: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 拆分项目需求参数 */
|
||||||
|
type SplitProjectRequirementParams = Pick<
|
||||||
|
ProjectRequirement,
|
||||||
|
| 'parentId'
|
||||||
|
| 'projectId'
|
||||||
|
| 'moduleId'
|
||||||
|
| 'reviewRequired'
|
||||||
|
| 'title'
|
||||||
|
| 'description'
|
||||||
|
| 'attachments'
|
||||||
|
| 'category'
|
||||||
|
| 'priority'
|
||||||
|
| 'proposerId'
|
||||||
|
| 'proposerNickname'
|
||||||
|
| 'currentHandlerUserId'
|
||||||
|
| 'currentHandlerUserNickname'
|
||||||
|
| 'expectedTime'
|
||||||
|
| 'sort'
|
||||||
|
>;
|
||||||
|
|
||||||
|
/** 删除项目需求参数 */
|
||||||
|
interface DeleteProjectRequirementParams {
|
||||||
|
id: string;
|
||||||
|
projectId: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 保存项目需求模块参数 */
|
||||||
|
interface SaveProjectRequirementModuleParams {
|
||||||
|
id?: string;
|
||||||
|
projectId: string;
|
||||||
|
parentId?: string | null;
|
||||||
|
moduleName: string;
|
||||||
|
remark?: string | null;
|
||||||
|
icon?: string | null;
|
||||||
|
sort?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 删除项目需求模块参数 */
|
||||||
|
interface DeleteProjectRequirementModuleParams {
|
||||||
|
id?: string;
|
||||||
|
projectId: string;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
14
src/typings/api/system-manage.d.ts
vendored
14
src/typings/api/system-manage.d.ts
vendored
@@ -47,6 +47,8 @@ declare namespace Api {
|
|||||||
type: RoleType;
|
type: RoleType;
|
||||||
/** remark */
|
/** remark */
|
||||||
remark?: string | null;
|
remark?: string | null;
|
||||||
|
/** 是否在前端选择面板可见:0 不可见 / 1 可见,缺省视作可见 */
|
||||||
|
visible?: 0 | 1 | null;
|
||||||
/** create time */
|
/** create time */
|
||||||
createTime: number;
|
createTime: number;
|
||||||
}
|
}
|
||||||
@@ -69,7 +71,7 @@ declare namespace Api {
|
|||||||
roleCode: string;
|
roleCode: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
type DeptOrgType = 'company' | 'dept' | 'direction' | 'team';
|
type DeptOrgType = 'company' | 'dept' | 'function' | 'direction' | 'team';
|
||||||
|
|
||||||
interface Dept {
|
interface Dept {
|
||||||
id: number;
|
id: number;
|
||||||
@@ -148,6 +150,7 @@ declare namespace Api {
|
|||||||
sex?: UserGender | null;
|
sex?: UserGender | null;
|
||||||
avatar?: string | null;
|
avatar?: string | null;
|
||||||
status: CommonStatus;
|
status: CommonStatus;
|
||||||
|
sort?: number;
|
||||||
loginIp?: string | null;
|
loginIp?: string | null;
|
||||||
resignedAt?: number | null;
|
resignedAt?: number | null;
|
||||||
loginDate?: number | null;
|
loginDate?: number | null;
|
||||||
@@ -178,6 +181,7 @@ declare namespace Api {
|
|||||||
mobile?: string | null;
|
mobile?: string | null;
|
||||||
sex?: UserGender | null;
|
sex?: UserGender | null;
|
||||||
avatar?: string | null;
|
avatar?: string | null;
|
||||||
|
sort?: number;
|
||||||
password?: string;
|
password?: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -224,7 +228,7 @@ declare namespace Api {
|
|||||||
|
|
||||||
type PostList = PageResult<Post>;
|
type PostList = PageResult<Post>;
|
||||||
|
|
||||||
type RoleSimple = Pick<Role, 'id' | 'name' | 'code' | 'status' | 'sort'>;
|
type RoleSimple = Pick<Role, 'id' | 'name' | 'code' | 'status' | 'sort' | 'remark' | 'visible'>;
|
||||||
|
|
||||||
type RoleSimpleList = RoleSimple[];
|
type RoleSimpleList = RoleSimple[];
|
||||||
|
|
||||||
@@ -428,6 +432,12 @@ declare namespace Api {
|
|||||||
id: string;
|
id: string;
|
||||||
/** 用户昵称 */
|
/** 用户昵称 */
|
||||||
nickname: string;
|
nickname: string;
|
||||||
|
/** 用户账号 */
|
||||||
|
username?: string | null;
|
||||||
|
/** 部门 ID */
|
||||||
|
deptId?: string | null;
|
||||||
|
/** 部门名称 */
|
||||||
|
deptName?: string | null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
3
src/typings/app.d.ts
vendored
3
src/typings/app.d.ts
vendored
@@ -333,7 +333,7 @@ declare namespace App {
|
|||||||
trigger: string;
|
trigger: string;
|
||||||
update: string;
|
update: string;
|
||||||
updateSuccess: string;
|
updateSuccess: string;
|
||||||
userCenter: string;
|
myProfile: string;
|
||||||
yesOrNo: {
|
yesOrNo: {
|
||||||
yes: string;
|
yes: string;
|
||||||
no: string;
|
no: string;
|
||||||
@@ -684,6 +684,7 @@ declare namespace App {
|
|||||||
orgType: {
|
orgType: {
|
||||||
company: string;
|
company: string;
|
||||||
dept: string;
|
dept: string;
|
||||||
|
function: string;
|
||||||
direction: string;
|
direction: string;
|
||||||
team: string;
|
team: string;
|
||||||
};
|
};
|
||||||
|
|||||||
20
src/typings/components.d.ts
vendored
20
src/typings/components.d.ts
vendored
@@ -10,10 +10,15 @@ declare module 'vue' {
|
|||||||
export interface GlobalComponents {
|
export interface GlobalComponents {
|
||||||
AppProvider: typeof import('./../components/common/app-provider.vue')['default']
|
AppProvider: typeof import('./../components/common/app-provider.vue')['default']
|
||||||
BetterScroll: typeof import('./../components/custom/better-scroll.vue')['default']
|
BetterScroll: typeof import('./../components/custom/better-scroll.vue')['default']
|
||||||
|
BusinessAttachmentUploader: typeof import('./../components/custom/business-attachment-uploader.vue')['default']
|
||||||
BusinessDateRangePicker: typeof import('./../components/custom/business-date-range-picker.vue')['default']
|
BusinessDateRangePicker: typeof import('./../components/custom/business-date-range-picker.vue')['default']
|
||||||
BusinessFormDialog: typeof import('./../components/custom/business-form-dialog.vue')['default']
|
BusinessFormDialog: typeof import('./../components/custom/business-form-dialog.vue')['default']
|
||||||
BusinessFormDrawer: typeof import('./../components/custom/business-form-drawer.vue')['default']
|
BusinessFormDrawer: typeof import('./../components/custom/business-form-drawer.vue')['default']
|
||||||
BusinessFormSection: typeof import('./../components/custom/business-form-section.vue')['default']
|
BusinessFormSection: typeof import('./../components/custom/business-form-section.vue')['default']
|
||||||
|
BusinessFormSimpleDialog: typeof import('./../components/custom/business-form-simple-dialog.vue')['default']
|
||||||
|
BusinessRichTextEditor: typeof import('./../components/custom/business-rich-text-editor.vue')['default']
|
||||||
|
BusinessRichTextView: typeof import('./../components/custom/business-rich-text-view.vue')['default']
|
||||||
|
BusinessUserSelect: typeof import('./../components/custom/business-user-select.vue')['default']
|
||||||
ButtonIcon: typeof import('./../components/custom/button-icon.vue')['default']
|
ButtonIcon: typeof import('./../components/custom/button-icon.vue')['default']
|
||||||
CountTo: typeof import('./../components/custom/count-to.vue')['default']
|
CountTo: typeof import('./../components/custom/count-to.vue')['default']
|
||||||
CustomIconSelect: typeof import('./../components/custom/custom-icon-select.vue')['default']
|
CustomIconSelect: typeof import('./../components/custom/custom-icon-select.vue')['default']
|
||||||
@@ -50,14 +55,17 @@ declare module 'vue' {
|
|||||||
ElForm: typeof import('element-plus/es')['ElForm']
|
ElForm: typeof import('element-plus/es')['ElForm']
|
||||||
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
||||||
ElIcon: typeof import('element-plus/es')['ElIcon']
|
ElIcon: typeof import('element-plus/es')['ElIcon']
|
||||||
|
ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
|
||||||
ElInput: typeof import('element-plus/es')['ElInput']
|
ElInput: typeof import('element-plus/es')['ElInput']
|
||||||
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
|
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
|
||||||
|
ElLink: typeof import('element-plus/es')['ElLink']
|
||||||
ElMenu: typeof import('element-plus/es')['ElMenu']
|
ElMenu: typeof import('element-plus/es')['ElMenu']
|
||||||
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
|
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
|
||||||
ElOption: typeof import('element-plus/es')['ElOption']
|
ElOption: typeof import('element-plus/es')['ElOption']
|
||||||
ElPagination: typeof import('element-plus/es')['ElPagination']
|
ElPagination: typeof import('element-plus/es')['ElPagination']
|
||||||
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
|
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
|
||||||
ElPopover: typeof import('element-plus/es')['ElPopover']
|
ElPopover: typeof import('element-plus/es')['ElPopover']
|
||||||
|
ElProgress: typeof import('element-plus/es')['ElProgress']
|
||||||
ElRadio: typeof import('element-plus/es')['ElRadio']
|
ElRadio: typeof import('element-plus/es')['ElRadio']
|
||||||
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
|
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
|
||||||
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
|
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
|
||||||
@@ -65,6 +73,7 @@ declare module 'vue' {
|
|||||||
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
|
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
|
||||||
ElSegmented: typeof import('element-plus/es')['ElSegmented']
|
ElSegmented: typeof import('element-plus/es')['ElSegmented']
|
||||||
ElSelect: typeof import('element-plus/es')['ElSelect']
|
ElSelect: typeof import('element-plus/es')['ElSelect']
|
||||||
|
ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
|
||||||
ElSpace: typeof import('element-plus/es')['ElSpace']
|
ElSpace: typeof import('element-plus/es')['ElSpace']
|
||||||
ElStatistic: typeof import('element-plus/es')['ElStatistic']
|
ElStatistic: typeof import('element-plus/es')['ElStatistic']
|
||||||
ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
|
ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
|
||||||
@@ -91,10 +100,15 @@ declare module 'vue' {
|
|||||||
IconCarbonStop: typeof import('~icons/carbon/stop')['default']
|
IconCarbonStop: typeof import('~icons/carbon/stop')['default']
|
||||||
'IconCharm:download': typeof import('~icons/charm/download')['default']
|
'IconCharm:download': typeof import('~icons/charm/download')['default']
|
||||||
'IconEp:arrowDown': typeof import('~icons/ep/arrow-down')['default']
|
'IconEp:arrowDown': typeof import('~icons/ep/arrow-down')['default']
|
||||||
|
'IconEp:box': typeof import('~icons/ep/box')['default']
|
||||||
|
'IconEp:files': typeof import('~icons/ep/files')['default']
|
||||||
|
'IconEp:infoFilled': typeof import('~icons/ep/info-filled')['default']
|
||||||
|
'IconEp:plus': typeof import('~icons/ep/plus')['default']
|
||||||
IconEpRemoveFilled: typeof import('~icons/ep/remove-filled')['default']
|
IconEpRemoveFilled: typeof import('~icons/ep/remove-filled')['default']
|
||||||
IconEpSuccessFilled: typeof import('~icons/ep/success-filled')['default']
|
IconEpSuccessFilled: typeof import('~icons/ep/success-filled')['default']
|
||||||
'IconF7:circleFill': typeof import('~icons/f7/circle-fill')['default']
|
'IconF7:circleFill': typeof import('~icons/f7/circle-fill')['default']
|
||||||
'IconF7:flagCircleFill': typeof import('~icons/f7/flag-circle-fill')['default']
|
'IconF7:flagCircleFill': typeof import('~icons/f7/flag-circle-fill')['default']
|
||||||
|
'IconFe:eye': typeof import('~icons/fe/eye')['default']
|
||||||
'IconFe:question': typeof import('~icons/fe/question')['default']
|
'IconFe:question': typeof import('~icons/fe/question')['default']
|
||||||
'IconFileIcons:microsoftExcel': typeof import('~icons/file-icons/microsoft-excel')['default']
|
'IconFileIcons:microsoftExcel': typeof import('~icons/file-icons/microsoft-excel')['default']
|
||||||
'IconGg:ratio': typeof import('~icons/gg/ratio')['default']
|
'IconGg:ratio': typeof import('~icons/gg/ratio')['default']
|
||||||
@@ -102,6 +116,7 @@ declare module 'vue' {
|
|||||||
IconGridiconsFullscreenExit: typeof import('~icons/gridicons/fullscreen-exit')['default']
|
IconGridiconsFullscreenExit: typeof import('~icons/gridicons/fullscreen-exit')['default']
|
||||||
'IconIc:roundPlus': typeof import('~icons/ic/round-plus')['default']
|
'IconIc:roundPlus': typeof import('~icons/ic/round-plus')['default']
|
||||||
'IconIconParkOutline:equalRatio': typeof import('~icons/icon-park-outline/equal-ratio')['default']
|
'IconIconParkOutline:equalRatio': typeof import('~icons/icon-park-outline/equal-ratio')['default']
|
||||||
|
IconIcRoundChevronRight: typeof import('~icons/ic/round-chevron-right')['default']
|
||||||
IconIcRoundDelete: typeof import('~icons/ic/round-delete')['default']
|
IconIcRoundDelete: typeof import('~icons/ic/round-delete')['default']
|
||||||
IconIcRoundEdit: typeof import('~icons/ic/round-edit')['default']
|
IconIcRoundEdit: typeof import('~icons/ic/round-edit')['default']
|
||||||
IconIcRoundPlus: typeof import('~icons/ic/round-plus')['default']
|
IconIcRoundPlus: typeof import('~icons/ic/round-plus')['default']
|
||||||
@@ -114,6 +129,7 @@ declare module 'vue' {
|
|||||||
IconLocalLogo: typeof import('~icons/local/logo')['default']
|
IconLocalLogo: typeof import('~icons/local/logo')['default']
|
||||||
'IconMaterialSymbolsLight:rotate90DegreesCcwOutlineRounded': typeof import('~icons/material-symbols-light/rotate90-degrees-ccw-outline-rounded')['default']
|
'IconMaterialSymbolsLight:rotate90DegreesCcwOutlineRounded': typeof import('~icons/material-symbols-light/rotate90-degrees-ccw-outline-rounded')['default']
|
||||||
IconMaterialSymbolsLightCheckCircleRounded: typeof import('~icons/material-symbols-light/check-circle-rounded')['default']
|
IconMaterialSymbolsLightCheckCircleRounded: typeof import('~icons/material-symbols-light/check-circle-rounded')['default']
|
||||||
|
'IconMdi:paperclip': typeof import('~icons/mdi/paperclip')['default']
|
||||||
'IconMdi:printer': typeof import('~icons/mdi/printer')['default']
|
'IconMdi:printer': typeof import('~icons/mdi/printer')['default']
|
||||||
IconMdiAccountTieOutline: typeof import('~icons/mdi/account-tie-outline')['default']
|
IconMdiAccountTieOutline: typeof import('~icons/mdi/account-tie-outline')['default']
|
||||||
IconMdiArrowDownThin: typeof import('~icons/mdi/arrow-down-thin')['default']
|
IconMdiArrowDownThin: typeof import('~icons/mdi/arrow-down-thin')['default']
|
||||||
@@ -123,6 +139,9 @@ declare module 'vue' {
|
|||||||
IconMdiChevronDoubleUp: typeof import('~icons/mdi/chevron-double-up')['default']
|
IconMdiChevronDoubleUp: typeof import('~icons/mdi/chevron-double-up')['default']
|
||||||
IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default']
|
IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default']
|
||||||
IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default']
|
IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default']
|
||||||
|
IconMdiClose: typeof import('~icons/mdi/close')['default']
|
||||||
|
IconMdiCloseCircle: typeof import('~icons/mdi/close-circle')['default']
|
||||||
|
IconMdiCrown: typeof import('~icons/mdi/crown')['default']
|
||||||
IconMdiDeleteOutline: typeof import('~icons/mdi/delete-outline')['default']
|
IconMdiDeleteOutline: typeof import('~icons/mdi/delete-outline')['default']
|
||||||
IconMdiDotsHorizontal: typeof import('~icons/mdi/dots-horizontal')['default']
|
IconMdiDotsHorizontal: typeof import('~icons/mdi/dots-horizontal')['default']
|
||||||
IconMdiDrag: typeof import('~icons/mdi/drag')['default']
|
IconMdiDrag: typeof import('~icons/mdi/drag')['default']
|
||||||
@@ -153,6 +172,7 @@ declare module 'vue' {
|
|||||||
SystemLogo: typeof import('./../components/common/system-logo.vue')['default']
|
SystemLogo: typeof import('./../components/common/system-logo.vue')['default']
|
||||||
TableColumnSetting: typeof import('./../components/advanced/table-column-setting.vue')['default']
|
TableColumnSetting: typeof import('./../components/advanced/table-column-setting.vue')['default']
|
||||||
TableHeaderOperation: typeof import('./../components/advanced/table-header-operation.vue')['default']
|
TableHeaderOperation: typeof import('./../components/advanced/table-header-operation.vue')['default']
|
||||||
|
TableSearchFields: typeof import('./../components/custom/table-search-fields.vue')['default']
|
||||||
TableSearchPanel: typeof import('./../components/custom/table-search-panel.vue')['default']
|
TableSearchPanel: typeof import('./../components/custom/table-search-panel.vue')['default']
|
||||||
ThemeSchemaSwitch: typeof import('./../components/common/theme-schema-switch.vue')['default']
|
ThemeSchemaSwitch: typeof import('./../components/common/theme-schema-switch.vue')['default']
|
||||||
WaveBg: typeof import('./../components/custom/wave-bg.vue')['default']
|
WaveBg: typeof import('./../components/custom/wave-bg.vue')['default']
|
||||||
|
|||||||
58
src/typings/elegant-router.d.ts
vendored
58
src/typings/elegant-router.d.ts
vendored
@@ -35,7 +35,21 @@ declare module "@elegant-router/types" {
|
|||||||
"function_tab": "/function/tab";
|
"function_tab": "/function/tab";
|
||||||
"function_toggle-auth": "/function/toggle-auth";
|
"function_toggle-auth": "/function/toggle-auth";
|
||||||
"iframe-page": "/iframe-page/:url";
|
"iframe-page": "/iframe-page/:url";
|
||||||
|
"infra": "/infra";
|
||||||
|
"infra_rd-code": "/infra/rd-code";
|
||||||
|
"infra_state-machine": "/infra/state-machine";
|
||||||
"login": "/login/:module(pwd-login|reset-pwd)?";
|
"login": "/login/:module(pwd-login|reset-pwd)?";
|
||||||
|
"metrics": "/metrics";
|
||||||
|
"metrics_member-efficiency": "/metrics/member-efficiency";
|
||||||
|
"metrics_project-progress": "/metrics/project-progress";
|
||||||
|
"metrics_worktime": "/metrics/worktime";
|
||||||
|
"personal-center": "/personal-center";
|
||||||
|
"personal-center_my-application": "/personal-center/my-application";
|
||||||
|
"personal-center_my-monthly": "/personal-center/my-monthly";
|
||||||
|
"personal-center_my-performance": "/personal-center/my-performance";
|
||||||
|
"personal-center_my-profile": "/personal-center/my-profile";
|
||||||
|
"personal-center_my-weekly": "/personal-center/my-weekly";
|
||||||
|
"personal-center_pending-approval": "/personal-center/pending-approval";
|
||||||
"plugin": "/plugin";
|
"plugin": "/plugin";
|
||||||
"plugin_barcode": "/plugin/barcode";
|
"plugin_barcode": "/plugin/barcode";
|
||||||
"plugin_charts": "/plugin/charts";
|
"plugin_charts": "/plugin/charts";
|
||||||
@@ -43,9 +57,6 @@ declare module "@elegant-router/types" {
|
|||||||
"plugin_charts_echarts": "/plugin/charts/echarts";
|
"plugin_charts_echarts": "/plugin/charts/echarts";
|
||||||
"plugin_charts_vchart": "/plugin/charts/vchart";
|
"plugin_charts_vchart": "/plugin/charts/vchart";
|
||||||
"plugin_copy": "/plugin/copy";
|
"plugin_copy": "/plugin/copy";
|
||||||
"plugin_editor": "/plugin/editor";
|
|
||||||
"plugin_editor_markdown": "/plugin/editor/markdown";
|
|
||||||
"plugin_editor_quill": "/plugin/editor/quill";
|
|
||||||
"plugin_excel": "/plugin/excel";
|
"plugin_excel": "/plugin/excel";
|
||||||
"plugin_gantt": "/plugin/gantt";
|
"plugin_gantt": "/plugin/gantt";
|
||||||
"plugin_gantt_dhtmlx": "/plugin/gantt/dhtmlx";
|
"plugin_gantt_dhtmlx": "/plugin/gantt/dhtmlx";
|
||||||
@@ -65,6 +76,13 @@ declare module "@elegant-router/types" {
|
|||||||
"product_list": "/product/list";
|
"product_list": "/product/list";
|
||||||
"product_requirement": "/product/requirement";
|
"product_requirement": "/product/requirement";
|
||||||
"product_setting": "/product/setting";
|
"product_setting": "/product/setting";
|
||||||
|
"project": "/project";
|
||||||
|
"project_list": "/project/list";
|
||||||
|
"project_project": "/project/project";
|
||||||
|
"project_project_execution": "/project/project/execution";
|
||||||
|
"project_project_overview": "/project/project/overview";
|
||||||
|
"project_project_requirement": "/project/project/requirement";
|
||||||
|
"project_project_setting": "/project/project/setting";
|
||||||
"system": "/system";
|
"system": "/system";
|
||||||
"system_dict": "/system/dict";
|
"system_dict": "/system/dict";
|
||||||
"system_menu": "/system/menu";
|
"system_menu": "/system/menu";
|
||||||
@@ -73,7 +91,10 @@ declare module "@elegant-router/types" {
|
|||||||
"system_user": "/system/user";
|
"system_user": "/system/user";
|
||||||
"system_user-detail": "/system/user-detail/:id";
|
"system_user-detail": "/system/user-detail/:id";
|
||||||
"system_user-management-relation": "/system/user-management-relation";
|
"system_user-management-relation": "/system/user-management-relation";
|
||||||
"user-center": "/user-center";
|
"ticket": "/ticket";
|
||||||
|
"ticket_my-pending": "/ticket/my-pending";
|
||||||
|
"ticket_my-submitted": "/ticket/my-submitted";
|
||||||
|
"workbench": "/workbench";
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -114,11 +135,16 @@ declare module "@elegant-router/types" {
|
|||||||
| "500"
|
| "500"
|
||||||
| "function"
|
| "function"
|
||||||
| "iframe-page"
|
| "iframe-page"
|
||||||
|
| "infra"
|
||||||
| "login"
|
| "login"
|
||||||
|
| "metrics"
|
||||||
|
| "personal-center"
|
||||||
| "plugin"
|
| "plugin"
|
||||||
| "product"
|
| "product"
|
||||||
|
| "project"
|
||||||
| "system"
|
| "system"
|
||||||
| "user-center"
|
| "ticket"
|
||||||
|
| "workbench"
|
||||||
>;
|
>;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -149,13 +175,22 @@ declare module "@elegant-router/types" {
|
|||||||
| "function_super-page"
|
| "function_super-page"
|
||||||
| "function_tab"
|
| "function_tab"
|
||||||
| "function_toggle-auth"
|
| "function_toggle-auth"
|
||||||
|
| "infra_rd-code"
|
||||||
|
| "infra_state-machine"
|
||||||
|
| "metrics_member-efficiency"
|
||||||
|
| "metrics_project-progress"
|
||||||
|
| "metrics_worktime"
|
||||||
|
| "personal-center_my-application"
|
||||||
|
| "personal-center_my-monthly"
|
||||||
|
| "personal-center_my-performance"
|
||||||
|
| "personal-center_my-profile"
|
||||||
|
| "personal-center_my-weekly"
|
||||||
|
| "personal-center_pending-approval"
|
||||||
| "plugin_barcode"
|
| "plugin_barcode"
|
||||||
| "plugin_charts_antv"
|
| "plugin_charts_antv"
|
||||||
| "plugin_charts_echarts"
|
| "plugin_charts_echarts"
|
||||||
| "plugin_charts_vchart"
|
| "plugin_charts_vchart"
|
||||||
| "plugin_copy"
|
| "plugin_copy"
|
||||||
| "plugin_editor_markdown"
|
|
||||||
| "plugin_editor_quill"
|
|
||||||
| "plugin_excel"
|
| "plugin_excel"
|
||||||
| "plugin_gantt_dhtmlx"
|
| "plugin_gantt_dhtmlx"
|
||||||
| "plugin_gantt_vtable"
|
| "plugin_gantt_vtable"
|
||||||
@@ -172,6 +207,11 @@ declare module "@elegant-router/types" {
|
|||||||
| "product_list"
|
| "product_list"
|
||||||
| "product_requirement"
|
| "product_requirement"
|
||||||
| "product_setting"
|
| "product_setting"
|
||||||
|
| "project_list"
|
||||||
|
| "project_project_execution"
|
||||||
|
| "project_project_overview"
|
||||||
|
| "project_project_requirement"
|
||||||
|
| "project_project_setting"
|
||||||
| "system_dict"
|
| "system_dict"
|
||||||
| "system_menu"
|
| "system_menu"
|
||||||
| "system_post"
|
| "system_post"
|
||||||
@@ -179,7 +219,9 @@ declare module "@elegant-router/types" {
|
|||||||
| "system_user-detail"
|
| "system_user-detail"
|
||||||
| "system_user-management-relation"
|
| "system_user-management-relation"
|
||||||
| "system_user"
|
| "system_user"
|
||||||
| "user-center"
|
| "ticket_my-pending"
|
||||||
|
| "ticket_my-submitted"
|
||||||
|
| "workbench"
|
||||||
>;
|
>;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
18
src/typings/wangeditor.d.ts
vendored
Normal file
18
src/typings/wangeditor.d.ts
vendored
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
declare module '@wangeditor/editor-for-vue' {
|
||||||
|
import type { DefineComponent } from 'vue';
|
||||||
|
import type { IDomEditor, IEditorConfig, IToolbarConfig } from '@wangeditor/editor';
|
||||||
|
|
||||||
|
export const Editor: DefineComponent<{
|
||||||
|
modelValue?: string | null;
|
||||||
|
defaultConfig?: Partial<IEditorConfig>;
|
||||||
|
defaultContent?: unknown[];
|
||||||
|
defaultHtml?: string;
|
||||||
|
mode?: 'default' | 'simple';
|
||||||
|
}>;
|
||||||
|
|
||||||
|
export const Toolbar: DefineComponent<{
|
||||||
|
editor: IDomEditor | null | undefined;
|
||||||
|
defaultConfig?: Partial<IToolbarConfig>;
|
||||||
|
mode?: 'default' | 'simple';
|
||||||
|
}>;
|
||||||
|
}
|
||||||
64
src/utils/sanitize.ts
Normal file
64
src/utils/sanitize.ts
Normal file
@@ -0,0 +1,64 @@
|
|||||||
|
import DOMPurify from 'dompurify';
|
||||||
|
|
||||||
|
const ALLOWED_TAGS = [
|
||||||
|
'a',
|
||||||
|
'p',
|
||||||
|
'br',
|
||||||
|
'span',
|
||||||
|
'div',
|
||||||
|
'b',
|
||||||
|
'i',
|
||||||
|
'u',
|
||||||
|
's',
|
||||||
|
'sub',
|
||||||
|
'sup',
|
||||||
|
'strong',
|
||||||
|
'em',
|
||||||
|
'h1',
|
||||||
|
'h2',
|
||||||
|
'h3',
|
||||||
|
'h4',
|
||||||
|
'h5',
|
||||||
|
'h6',
|
||||||
|
'ul',
|
||||||
|
'ol',
|
||||||
|
'li',
|
||||||
|
'blockquote',
|
||||||
|
'pre',
|
||||||
|
'code',
|
||||||
|
'hr',
|
||||||
|
'img',
|
||||||
|
'table',
|
||||||
|
'thead',
|
||||||
|
'tbody',
|
||||||
|
'tr',
|
||||||
|
'th',
|
||||||
|
'td'
|
||||||
|
];
|
||||||
|
|
||||||
|
const ALLOWED_ATTR = [
|
||||||
|
'href',
|
||||||
|
'target',
|
||||||
|
'rel',
|
||||||
|
'src',
|
||||||
|
'alt',
|
||||||
|
'title',
|
||||||
|
'class',
|
||||||
|
'style',
|
||||||
|
'colspan',
|
||||||
|
'rowspan',
|
||||||
|
'width',
|
||||||
|
'height'
|
||||||
|
];
|
||||||
|
|
||||||
|
export function sanitizeHtml(html: string | null | undefined): string {
|
||||||
|
if (!html) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
return DOMPurify.sanitize(html, {
|
||||||
|
ALLOWED_TAGS,
|
||||||
|
ALLOWED_ATTR,
|
||||||
|
ADD_ATTR: ['target']
|
||||||
|
});
|
||||||
|
}
|
||||||
3
src/views/infra/rd-code/index.vue
Normal file
3
src/views/infra/rd-code/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="研发令号" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
389
src/views/infra/state-machine/index.vue
Normal file
389
src/views/infra/state-machine/index.vue
Normal file
@@ -0,0 +1,389 @@
|
|||||||
|
<script setup lang="tsx">
|
||||||
|
import { computed, nextTick, onActivated, reactive, ref } from 'vue';
|
||||||
|
import type { TableInstance } from 'element-plus';
|
||||||
|
import { ElTag } from 'element-plus';
|
||||||
|
import { useBoolean } from '@sa/hooks';
|
||||||
|
import { OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE } from '@/constants/dict';
|
||||||
|
import {
|
||||||
|
fetchBatchDeleteObjectStatusModel,
|
||||||
|
fetchDeleteObjectStatusModel,
|
||||||
|
fetchGetObjectStatusModelPage
|
||||||
|
} from '@/service/api';
|
||||||
|
import { useAuth } from '@/hooks/business/auth';
|
||||||
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import { useUIPaginatedTable } from '@/hooks/common/table';
|
||||||
|
import BusinessTableActionCell, { type BusinessTableAction } from '@/components/custom/business-table-action-cell';
|
||||||
|
import StateMachineOperateDialog from './modules/state-machine-operate-dialog.vue';
|
||||||
|
import StateMachineSearch from './modules/state-machine-search.vue';
|
||||||
|
import StateTransitionDialog from './modules/state-transition-dialog.vue';
|
||||||
|
import { formatDateTime, getBooleanLabel, getBooleanTagType, getStatusLabel, getStatusTagType } from './shared';
|
||||||
|
|
||||||
|
defineOptions({ name: 'StateMachineManage' });
|
||||||
|
|
||||||
|
function getInitSearchParams(): Api.Infra.ObjectStatusModelSearchParams {
|
||||||
|
return {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
keyword: undefined,
|
||||||
|
objectType: undefined,
|
||||||
|
status: undefined,
|
||||||
|
initialFlag: undefined,
|
||||||
|
terminalFlag: undefined
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function transformPageResult(
|
||||||
|
response: Awaited<ReturnType<typeof fetchGetObjectStatusModelPage>>,
|
||||||
|
pageNo: number,
|
||||||
|
pageSize: number
|
||||||
|
) {
|
||||||
|
if (!response.error) {
|
||||||
|
return {
|
||||||
|
data: response.data.list,
|
||||||
|
pageNum: pageNo,
|
||||||
|
pageSize,
|
||||||
|
total: response.data.total
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
data: [],
|
||||||
|
pageNum: pageNo,
|
||||||
|
pageSize,
|
||||||
|
total: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const searchParams = reactive(getInitSearchParams());
|
||||||
|
const stateTableRef = ref<TableInstance>();
|
||||||
|
const checkedRowKeys = ref<string[]>([]);
|
||||||
|
const { getLabel: getObjectTypeLabel } = useDict(OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE);
|
||||||
|
const { hasAuth } = useAuth();
|
||||||
|
|
||||||
|
const canDeleteStateMachine = computed(() => hasAuth('infra:state-machine:delete'));
|
||||||
|
const canUpdateStateMachine = computed(() => hasAuth('infra:state-machine:update'));
|
||||||
|
const canManageStateTransition = computed(() => hasAuth('infra:state-transition:manage'));
|
||||||
|
|
||||||
|
function getStatusModelActions(row: Api.Infra.ObjectStatusModel): BusinessTableAction[] {
|
||||||
|
const actions: BusinessTableAction[] = [];
|
||||||
|
|
||||||
|
if (canManageStateTransition.value) {
|
||||||
|
actions.push({
|
||||||
|
key: 'transition',
|
||||||
|
label: '状态流转',
|
||||||
|
buttonType: 'primary',
|
||||||
|
onClick: () => openTransitionDialog(row)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (canUpdateStateMachine.value) {
|
||||||
|
actions.push({
|
||||||
|
key: 'edit',
|
||||||
|
label: '编辑',
|
||||||
|
buttonType: 'primary',
|
||||||
|
onClick: () => openEdit(row)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (canDeleteStateMachine.value) {
|
||||||
|
actions.push({
|
||||||
|
key: 'delete',
|
||||||
|
label: '删除',
|
||||||
|
buttonType: 'danger',
|
||||||
|
onClick: () => handleDeleteAction(row)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return actions;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { columns, columnChecks, data, loading, getData, getDataByPage, mobilePagination } = useUIPaginatedTable({
|
||||||
|
paginationProps: {
|
||||||
|
currentPage: searchParams.pageNo,
|
||||||
|
pageSize: searchParams.pageSize
|
||||||
|
},
|
||||||
|
api: () => fetchGetObjectStatusModelPage(searchParams),
|
||||||
|
transform: response => transformPageResult(response, searchParams.pageNo ?? 1, searchParams.pageSize ?? 10),
|
||||||
|
onPaginationParamsChange: params => {
|
||||||
|
searchParams.pageNo = params.currentPage ?? 1;
|
||||||
|
searchParams.pageSize = params.pageSize ?? 10;
|
||||||
|
},
|
||||||
|
columns: () => [
|
||||||
|
{ prop: 'selection', type: 'selection', width: 48 },
|
||||||
|
{ prop: 'index', type: 'index', label: '序号', width: 64 },
|
||||||
|
{
|
||||||
|
prop: 'objectType',
|
||||||
|
label: '对象类型',
|
||||||
|
minWidth: 130,
|
||||||
|
formatter: row => getObjectTypeLabel(row.objectType)
|
||||||
|
},
|
||||||
|
{ prop: 'statusName', label: '状态名称', minWidth: 140, showOverflowTooltip: true },
|
||||||
|
{ prop: 'statusCode', label: '状态编码', minWidth: 160, showOverflowTooltip: true },
|
||||||
|
{
|
||||||
|
prop: 'status',
|
||||||
|
label: '配置状态',
|
||||||
|
width: 110,
|
||||||
|
align: 'center',
|
||||||
|
formatter: row => <ElTag type={getStatusTagType(row.status)}>{getStatusLabel(row.status)}</ElTag>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'initialFlag',
|
||||||
|
label: '初始状态',
|
||||||
|
width: 110,
|
||||||
|
align: 'center',
|
||||||
|
formatter: row => <ElTag type={getBooleanTagType(row.initialFlag)}>{getBooleanLabel(row.initialFlag)}</ElTag>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'terminalFlag',
|
||||||
|
label: '终态',
|
||||||
|
width: 90,
|
||||||
|
align: 'center',
|
||||||
|
formatter: row => <ElTag type={getBooleanTagType(row.terminalFlag)}>{getBooleanLabel(row.terminalFlag)}</ElTag>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'allowEdit',
|
||||||
|
label: '允许编辑主数据',
|
||||||
|
width: 140,
|
||||||
|
align: 'center',
|
||||||
|
formatter: row => <ElTag type={getBooleanTagType(row.allowEdit)}>{getBooleanLabel(row.allowEdit)}</ElTag>
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// prop: 'progressExcludedFlag',
|
||||||
|
// label: '不参与上层进度统计',
|
||||||
|
// width: 160,
|
||||||
|
// align: 'center',
|
||||||
|
// formatter: row => (
|
||||||
|
// <ElTag type={getBooleanTagType(row.progressExcludedFlag)}>{getBooleanLabel(row.progressExcludedFlag)}</ElTag>
|
||||||
|
// )
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// prop: 'allowCreateProject',
|
||||||
|
// label: '允许新建项目',
|
||||||
|
// width: 130,
|
||||||
|
// align: 'center',
|
||||||
|
// formatter: row => (
|
||||||
|
// <ElTag type={getBooleanTagType(row.allowCreateProject)}>{getBooleanLabel(row.allowCreateProject)}</ElTag>
|
||||||
|
// )
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// prop: 'allowCreateRequirement',
|
||||||
|
// label: '允许新增需求',
|
||||||
|
// width: 130,
|
||||||
|
// align: 'center',
|
||||||
|
// formatter: row => (
|
||||||
|
// <ElTag type={getBooleanTagType(row.allowCreateRequirement)}>
|
||||||
|
// {getBooleanLabel(row.allowCreateRequirement)}
|
||||||
|
// </ElTag>
|
||||||
|
// )
|
||||||
|
// },
|
||||||
|
{ prop: 'sort', label: '排序', width: 90, align: 'center' },
|
||||||
|
{
|
||||||
|
prop: 'remark',
|
||||||
|
label: '备注',
|
||||||
|
minWidth: 180,
|
||||||
|
showOverflowTooltip: true,
|
||||||
|
formatter: row => row.remark || '--'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '创建时间',
|
||||||
|
minWidth: 170,
|
||||||
|
formatter: row => formatDateTime(row.createTime)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'operate',
|
||||||
|
label: '操作',
|
||||||
|
width: 220,
|
||||||
|
align: 'center',
|
||||||
|
fixed: 'right',
|
||||||
|
formatter: row => {
|
||||||
|
const actions = getStatusModelActions(row);
|
||||||
|
|
||||||
|
if (!actions.length) {
|
||||||
|
return <span>--</span>;
|
||||||
|
}
|
||||||
|
|
||||||
|
return <BusinessTableActionCell actions={actions} />;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
const { bool: operateVisible, setTrue: openOperateModal, setFalse: closeOperateModal } = useBoolean();
|
||||||
|
const operateType = ref<UI.TableOperateType>('add');
|
||||||
|
const editingData = ref<Api.Infra.ObjectStatusModel | null>(null);
|
||||||
|
|
||||||
|
const { bool: transitionVisible, setTrue: openTransitionModal, setFalse: closeTransitionModal } = useBoolean();
|
||||||
|
const transitionRow = ref<Api.Infra.ObjectStatusModel | null>(null);
|
||||||
|
|
||||||
|
function openAdd() {
|
||||||
|
operateType.value = 'add';
|
||||||
|
editingData.value = null;
|
||||||
|
openOperateModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openEdit(item: Api.Infra.ObjectStatusModel) {
|
||||||
|
operateType.value = 'edit';
|
||||||
|
editingData.value = item;
|
||||||
|
openOperateModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openTransitionDialog(item: Api.Infra.ObjectStatusModel) {
|
||||||
|
transitionRow.value = item;
|
||||||
|
openTransitionModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleDelete(item: Api.Infra.ObjectStatusModel) {
|
||||||
|
const { error } = await fetchDeleteObjectStatusModel(item.id);
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('删除成功');
|
||||||
|
await reloadStatusTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleDeleteAction(row: Api.Infra.ObjectStatusModel) {
|
||||||
|
try {
|
||||||
|
await window.$messageBox?.confirm('确认删除当前状态模型吗?', '警告', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await handleDelete(row);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleBatchDelete() {
|
||||||
|
if (!checkedRowKeys.value.length) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { error } = await fetchBatchDeleteObjectStatusModel(checkedRowKeys.value);
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('删除成功');
|
||||||
|
await reloadStatusTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSelectionChange(rows: Api.Infra.ObjectStatusModel[]) {
|
||||||
|
checkedRowKeys.value = rows.map(item => item.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function reloadStatusTable(page = searchParams.pageNo) {
|
||||||
|
checkedRowKeys.value = [];
|
||||||
|
await getDataByPage(page);
|
||||||
|
await nextTick();
|
||||||
|
stateTableRef.value?.clearSelection();
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetSearchParams() {
|
||||||
|
Object.assign(searchParams, getInitSearchParams());
|
||||||
|
reloadStatusTable(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSearch() {
|
||||||
|
reloadStatusTable(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSubmitted() {
|
||||||
|
closeOperateModal();
|
||||||
|
reloadStatusTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
onActivated(() => {
|
||||||
|
resetSearchParams();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="flex-col-stretch gap-16px overflow-hidden">
|
||||||
|
<StateMachineSearch v-model:model="searchParams" @reset="resetSearchParams" @search="handleSearch" />
|
||||||
|
|
||||||
|
<ElCard class="flex-1-hidden card-wrapper" body-class="business-table-card-body">
|
||||||
|
<template #header>
|
||||||
|
<div class="flex items-center justify-between gap-12px">
|
||||||
|
<div class="flex items-center gap-10px">
|
||||||
|
<p>状态模型列表</p>
|
||||||
|
<ElTag effect="plain">{{ mobilePagination.total || data.length }}</ElTag>
|
||||||
|
</div>
|
||||||
|
<TableHeaderOperation
|
||||||
|
v-model:columns="columnChecks"
|
||||||
|
:disabled-delete="checkedRowKeys.length === 0"
|
||||||
|
:loading="loading"
|
||||||
|
@refresh="getData"
|
||||||
|
>
|
||||||
|
<template #default>
|
||||||
|
<ElButton v-auth="'infra:state-machine:create'" plain type="primary" @click="openAdd">
|
||||||
|
<template #icon>
|
||||||
|
<icon-ic-round-plus class="text-icon" />
|
||||||
|
</template>
|
||||||
|
新增
|
||||||
|
</ElButton>
|
||||||
|
<ElPopconfirm
|
||||||
|
v-if="canDeleteStateMachine"
|
||||||
|
title="确认删除选中的状态模型吗?"
|
||||||
|
@confirm="handleBatchDelete"
|
||||||
|
>
|
||||||
|
<template #reference>
|
||||||
|
<ElButton type="danger" plain :disabled="checkedRowKeys.length === 0">
|
||||||
|
<template #icon>
|
||||||
|
<icon-ic-round-delete class="text-icon" />
|
||||||
|
</template>
|
||||||
|
批量删除
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
</ElPopconfirm>
|
||||||
|
</template>
|
||||||
|
</TableHeaderOperation>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div class="flex-1">
|
||||||
|
<ElTable
|
||||||
|
ref="stateTableRef"
|
||||||
|
v-loading="loading"
|
||||||
|
height="100%"
|
||||||
|
border
|
||||||
|
row-key="id"
|
||||||
|
:data="data"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
>
|
||||||
|
<ElTableColumn v-for="col in columns" :key="String(col.prop)" v-bind="col" />
|
||||||
|
</ElTable>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-20px flex justify-end">
|
||||||
|
<ElPagination
|
||||||
|
v-if="mobilePagination.total"
|
||||||
|
layout="total,prev,pager,next,sizes"
|
||||||
|
v-bind="mobilePagination"
|
||||||
|
@current-change="mobilePagination['current-change']"
|
||||||
|
@size-change="mobilePagination['size-change']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ElCard>
|
||||||
|
|
||||||
|
<StateMachineOperateDialog
|
||||||
|
v-model:visible="operateVisible"
|
||||||
|
:operate-type="operateType"
|
||||||
|
:row-data="editingData"
|
||||||
|
@submitted="handleSubmitted"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<StateTransitionDialog
|
||||||
|
v-model:visible="transitionVisible"
|
||||||
|
:current-status="transitionRow"
|
||||||
|
@update:visible="value => !value && closeTransitionModal()"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
@@ -0,0 +1,269 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE } from '@/constants/dict';
|
||||||
|
import { fetchCreateObjectStatusModel, fetchGetObjectStatusModel, fetchUpdateObjectStatusModel } from '@/service/api';
|
||||||
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
import { statusOptions } from '../shared';
|
||||||
|
|
||||||
|
defineOptions({ name: 'StateMachineOperateDialog' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
operateType: UI.TableOperateType;
|
||||||
|
rowData?: Api.Infra.ObjectStatusModel | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
submitted: [statusModelId: string];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const visible = defineModel<boolean>('visible', {
|
||||||
|
default: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const { formRef, validate } = useForm();
|
||||||
|
const { createRequiredRule } = useFormRules();
|
||||||
|
const { dictOptions: objectTypeOptions } = useDict(OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE);
|
||||||
|
|
||||||
|
const detailLoading = ref(false);
|
||||||
|
const submitting = ref(false);
|
||||||
|
const isEdit = computed(() => props.operateType === 'edit');
|
||||||
|
|
||||||
|
const title = computed(() => {
|
||||||
|
const titleMap: Record<UI.TableOperateType, string> = {
|
||||||
|
add: '新增状态模型',
|
||||||
|
edit: '编辑状态模型'
|
||||||
|
};
|
||||||
|
|
||||||
|
return titleMap[props.operateType];
|
||||||
|
});
|
||||||
|
|
||||||
|
type Model = Api.Infra.SaveObjectStatusModelParams;
|
||||||
|
|
||||||
|
const model = ref(createDefaultModel());
|
||||||
|
|
||||||
|
function createDefaultModel(): Model {
|
||||||
|
return {
|
||||||
|
objectType: 'product',
|
||||||
|
statusCode: '',
|
||||||
|
statusName: '',
|
||||||
|
sort: 0,
|
||||||
|
status: 0,
|
||||||
|
initialFlag: false,
|
||||||
|
terminalFlag: false,
|
||||||
|
allowEdit: false,
|
||||||
|
progressExcludedFlag: false,
|
||||||
|
allowCreateProject: false,
|
||||||
|
allowCreateRequirement: false,
|
||||||
|
remark: ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const rules = {
|
||||||
|
objectType: createRequiredRule('请选择对象类型'),
|
||||||
|
statusCode: createRequiredRule('请输入状态编码'),
|
||||||
|
statusName: createRequiredRule('请输入状态名称'),
|
||||||
|
sort: createRequiredRule('请输入排序值'),
|
||||||
|
status: createRequiredRule('请选择配置状态')
|
||||||
|
} satisfies Record<string, App.Global.FormRule>;
|
||||||
|
|
||||||
|
function closeModal() {
|
||||||
|
visible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function initModel() {
|
||||||
|
model.value = createDefaultModel();
|
||||||
|
|
||||||
|
if (!isEdit.value || !props.rowData) {
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
detailLoading.value = true;
|
||||||
|
|
||||||
|
const { error, data } = await fetchGetObjectStatusModel(props.rowData.id);
|
||||||
|
|
||||||
|
detailLoading.value = false;
|
||||||
|
|
||||||
|
if (!error) {
|
||||||
|
model.value = {
|
||||||
|
objectType: data.objectType,
|
||||||
|
statusCode: data.statusCode,
|
||||||
|
statusName: data.statusName,
|
||||||
|
sort: data.sort ?? 0,
|
||||||
|
status: data.status,
|
||||||
|
initialFlag: data.initialFlag,
|
||||||
|
terminalFlag: data.terminalFlag,
|
||||||
|
allowEdit: data.allowEdit,
|
||||||
|
progressExcludedFlag: data.progressExcludedFlag,
|
||||||
|
allowCreateProject: data.allowCreateProject,
|
||||||
|
allowCreateRequirement: data.allowCreateRequirement,
|
||||||
|
remark: data.remark ?? ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleSubmit() {
|
||||||
|
await validate();
|
||||||
|
|
||||||
|
submitting.value = true;
|
||||||
|
|
||||||
|
const submitData: Api.Infra.SaveObjectStatusModelParams = {
|
||||||
|
...model.value,
|
||||||
|
statusCode: model.value.statusCode.trim(),
|
||||||
|
statusName: model.value.statusName.trim(),
|
||||||
|
remark: model.value.remark?.trim() || null
|
||||||
|
};
|
||||||
|
|
||||||
|
let statusModelId = props.rowData?.id ?? '';
|
||||||
|
|
||||||
|
if (isEdit.value && props.rowData) {
|
||||||
|
const { error } = await fetchUpdateObjectStatusModel({ id: props.rowData.id, ...submitData });
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
const { error, data } = await fetchCreateObjectStatusModel(submitData);
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
statusModelId = data;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success(isEdit.value ? '修改成功' : '新增成功');
|
||||||
|
|
||||||
|
closeModal();
|
||||||
|
emit('submitted', statusModelId);
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(visible, value => {
|
||||||
|
if (value) {
|
||||||
|
initModel();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BusinessFormDialog
|
||||||
|
v-model="visible"
|
||||||
|
:title="title"
|
||||||
|
preset="lg"
|
||||||
|
:loading="detailLoading"
|
||||||
|
:confirm-loading="submitting"
|
||||||
|
@confirm="handleSubmit"
|
||||||
|
>
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
||||||
|
<ElRow :gutter="16">
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="对象类型" prop="objectType">
|
||||||
|
<ElSelect
|
||||||
|
v-model="model.objectType"
|
||||||
|
class="w-full"
|
||||||
|
placeholder="请选择或输入对象类型"
|
||||||
|
filterable
|
||||||
|
allow-create
|
||||||
|
default-first-option
|
||||||
|
clearable
|
||||||
|
:reserve-keyword="false"
|
||||||
|
>
|
||||||
|
<ElOption v-for="item in objectTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</ElSelect>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="状态编码" prop="statusCode">
|
||||||
|
<ElInput v-model="model.statusCode" placeholder="请输入状态编码" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="状态名称" prop="statusName">
|
||||||
|
<ElInput v-model="model.statusName" placeholder="请输入状态名称" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="排序值" prop="sort">
|
||||||
|
<ElInputNumber v-model="model.sort" class="w-full" :min="0" placeholder="请输入排序值" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="配置状态" prop="status">
|
||||||
|
<ElRadioGroup v-model="model.status" class="business-form-radio-group">
|
||||||
|
<ElRadio v-for="{ label, value } in statusOptions" :key="value" :value="value">
|
||||||
|
{{ label }}
|
||||||
|
</ElRadio>
|
||||||
|
</ElRadioGroup>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="是否初始状态" prop="initialFlag">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.initialFlag" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.initialFlag ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="是否终态" prop="terminalFlag">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.terminalFlag" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.terminalFlag ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="允许编辑主数据" prop="allowEdit">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.allowEdit" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.allowEdit ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="不参与上层进度统计" prop="progressExcludedFlag">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.progressExcludedFlag" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.progressExcludedFlag ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="允许新建项目" prop="allowCreateProject">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.allowCreateProject" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.allowCreateProject ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="允许新增需求" prop="allowCreateRequirement">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.allowCreateRequirement" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.allowCreateRequirement ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="备注" prop="remark">
|
||||||
|
<ElInput v-model="model.remark" type="textarea" :rows="4" placeholder="请输入备注" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</BusinessFormDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
142
src/views/infra/state-machine/modules/state-machine-search.vue
Normal file
142
src/views/infra/state-machine/modules/state-machine-search.vue
Normal file
@@ -0,0 +1,142 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, reactive, watch } from 'vue';
|
||||||
|
import { OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE } from '@/constants/dict';
|
||||||
|
import TableSearchFields, { type SearchField } from '@/components/custom/table-search-fields.vue';
|
||||||
|
import { statusOptions } from '../shared';
|
||||||
|
|
||||||
|
defineOptions({ name: 'StateMachineSearch' });
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
reset: [];
|
||||||
|
search: [];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const model = defineModel<Api.Infra.ObjectStatusModelSearchParams>('model', { required: true });
|
||||||
|
|
||||||
|
const booleanOptions = [
|
||||||
|
{ label: '是', value: 1 },
|
||||||
|
{ label: '否', value: 0 }
|
||||||
|
];
|
||||||
|
|
||||||
|
const searchModel = reactive<{
|
||||||
|
keyword: string;
|
||||||
|
objectType?: string;
|
||||||
|
status?: Api.Infra.CommonStatus;
|
||||||
|
initialFlag?: number;
|
||||||
|
terminalFlag?: number;
|
||||||
|
}>({
|
||||||
|
keyword: '',
|
||||||
|
objectType: undefined,
|
||||||
|
status: undefined,
|
||||||
|
initialFlag: undefined,
|
||||||
|
terminalFlag: undefined
|
||||||
|
});
|
||||||
|
|
||||||
|
let syncingFromSource = false;
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() =>
|
||||||
|
[
|
||||||
|
model.value.keyword,
|
||||||
|
model.value.objectType,
|
||||||
|
model.value.status,
|
||||||
|
model.value.initialFlag,
|
||||||
|
model.value.terminalFlag
|
||||||
|
] as const,
|
||||||
|
([keyword, objectType, status, initialFlag, terminalFlag]) => {
|
||||||
|
syncingFromSource = true;
|
||||||
|
searchModel.keyword = keyword ?? '';
|
||||||
|
searchModel.objectType = objectType;
|
||||||
|
searchModel.status = status;
|
||||||
|
|
||||||
|
if (initialFlag === undefined) {
|
||||||
|
searchModel.initialFlag = undefined;
|
||||||
|
} else {
|
||||||
|
searchModel.initialFlag = initialFlag ? 1 : 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (terminalFlag === undefined) {
|
||||||
|
searchModel.terminalFlag = undefined;
|
||||||
|
} else {
|
||||||
|
searchModel.terminalFlag = terminalFlag ? 1 : 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
syncingFromSource = false;
|
||||||
|
},
|
||||||
|
{ immediate: true, flush: 'sync' }
|
||||||
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() =>
|
||||||
|
[
|
||||||
|
searchModel.keyword,
|
||||||
|
searchModel.objectType,
|
||||||
|
searchModel.status,
|
||||||
|
searchModel.initialFlag,
|
||||||
|
searchModel.terminalFlag
|
||||||
|
] as const,
|
||||||
|
([keywordValue, objectType, status, initialFlag, terminalFlag]) => {
|
||||||
|
if (syncingFromSource) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
model.value.keyword = keywordValue.trim() || undefined;
|
||||||
|
model.value.objectType = objectType;
|
||||||
|
model.value.status = status;
|
||||||
|
model.value.initialFlag = initialFlag === undefined ? undefined : initialFlag === 1;
|
||||||
|
model.value.terminalFlag = terminalFlag === undefined ? undefined : terminalFlag === 1;
|
||||||
|
},
|
||||||
|
{ flush: 'sync' }
|
||||||
|
);
|
||||||
|
|
||||||
|
const fields = computed<SearchField[]>(() => [
|
||||||
|
{
|
||||||
|
key: 'objectType',
|
||||||
|
label: '对象类型',
|
||||||
|
type: 'dict',
|
||||||
|
placeholder: '请选择对象类型',
|
||||||
|
dictCode: OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'keyword',
|
||||||
|
label: '关键字',
|
||||||
|
type: 'input',
|
||||||
|
placeholder: '请输入状态名称或状态编码'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'status',
|
||||||
|
label: '配置状态',
|
||||||
|
type: 'select',
|
||||||
|
placeholder: '请选择配置状态',
|
||||||
|
options: statusOptions
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'initialFlag',
|
||||||
|
label: '初始状态',
|
||||||
|
type: 'select',
|
||||||
|
placeholder: '请选择是否初始状态',
|
||||||
|
options: booleanOptions
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'terminalFlag',
|
||||||
|
label: '终态',
|
||||||
|
type: 'select',
|
||||||
|
placeholder: '请选择是否终态',
|
||||||
|
options: booleanOptions
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
|
function reset() {
|
||||||
|
emit('reset');
|
||||||
|
}
|
||||||
|
|
||||||
|
function search() {
|
||||||
|
emit('search');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<TableSearchFields v-model="searchModel" :fields="fields" :columns="4" @reset="reset" @search="search" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
@@ -0,0 +1,406 @@
|
|||||||
|
<script setup lang="tsx">
|
||||||
|
import { computed, nextTick, reactive, ref, watch } from 'vue';
|
||||||
|
import type { TableInstance } from 'element-plus';
|
||||||
|
import { ElButton, ElTag } from 'element-plus';
|
||||||
|
import { useBoolean } from '@sa/hooks';
|
||||||
|
import { OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE } from '@/constants/dict';
|
||||||
|
import {
|
||||||
|
fetchBatchDeleteObjectStatusTransition,
|
||||||
|
fetchDeleteObjectStatusTransition,
|
||||||
|
fetchGetObjectStatusModelPage,
|
||||||
|
fetchGetObjectStatusTransitionPage
|
||||||
|
} from '@/service/api';
|
||||||
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import { useUIPaginatedTable } from '@/hooks/common/table';
|
||||||
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
import BusinessTableActionCell from '@/components/custom/business-table-action-cell';
|
||||||
|
import { formatDateTime, getBooleanLabel, getBooleanTagType, getStatusLabel, getStatusTagType } from '../shared';
|
||||||
|
import StateTransitionOperateDialog from './state-transition-operate-dialog.vue';
|
||||||
|
import StateTransitionSearch from './state-transition-search.vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'StateTransitionDialog' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
currentStatus?: Api.Infra.ObjectStatusModel | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
const visible = defineModel<boolean>('visible', {
|
||||||
|
default: false
|
||||||
|
});
|
||||||
|
|
||||||
|
function getInitSearchParams(): Api.Infra.ObjectStatusTransitionSearchParams {
|
||||||
|
return {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
objectType: props.currentStatus?.objectType,
|
||||||
|
fromStatusCode: props.currentStatus?.statusCode,
|
||||||
|
actionCode: undefined,
|
||||||
|
actionName: undefined,
|
||||||
|
toStatusCode: undefined,
|
||||||
|
status: undefined
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function transformPageResult(
|
||||||
|
response: Awaited<ReturnType<typeof fetchGetObjectStatusTransitionPage>>,
|
||||||
|
pageNo: number,
|
||||||
|
pageSize: number
|
||||||
|
) {
|
||||||
|
if (!response.error) {
|
||||||
|
return {
|
||||||
|
data: response.data.list,
|
||||||
|
pageNum: pageNo,
|
||||||
|
pageSize,
|
||||||
|
total: response.data.total
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
data: [],
|
||||||
|
pageNum: pageNo,
|
||||||
|
pageSize,
|
||||||
|
total: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const searchParams = reactive(getInitSearchParams());
|
||||||
|
const transitionTableRef = ref<TableInstance>();
|
||||||
|
const checkedRowKeys = ref<string[]>([]);
|
||||||
|
const statusModelOptions = ref<Api.Infra.ObjectStatusModel[]>([]);
|
||||||
|
const loadingOptions = ref(false);
|
||||||
|
const { getLabel: getObjectTypeLabel } = useDict(OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE);
|
||||||
|
|
||||||
|
const targetStatusOptions = computed(() =>
|
||||||
|
statusModelOptions.value.map(item => ({
|
||||||
|
label: `${item.statusName} (${item.statusCode})`,
|
||||||
|
value: item.statusCode
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
|
||||||
|
const currentStatusLabel = computed(() => {
|
||||||
|
if (!props.currentStatus) {
|
||||||
|
return '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
return `${props.currentStatus.statusName} (${props.currentStatus.statusCode})`;
|
||||||
|
});
|
||||||
|
|
||||||
|
const currentObjectTypeLabel = computed(() => getObjectTypeLabel(props.currentStatus?.objectType));
|
||||||
|
|
||||||
|
const { columns, columnChecks, data, loading, getData, getDataByPage, mobilePagination } = useUIPaginatedTable({
|
||||||
|
paginationProps: {
|
||||||
|
currentPage: searchParams.pageNo,
|
||||||
|
pageSize: searchParams.pageSize
|
||||||
|
},
|
||||||
|
api: () => fetchGetObjectStatusTransitionPage(searchParams),
|
||||||
|
transform: response => transformPageResult(response, searchParams.pageNo ?? 1, searchParams.pageSize ?? 10),
|
||||||
|
onPaginationParamsChange: params => {
|
||||||
|
searchParams.pageNo = params.currentPage ?? 1;
|
||||||
|
searchParams.pageSize = params.pageSize ?? 10;
|
||||||
|
},
|
||||||
|
columns: () => [
|
||||||
|
{ prop: 'selection', type: 'selection', width: 48 },
|
||||||
|
{ prop: 'index', type: 'index', label: '序号', width: 64 },
|
||||||
|
{ prop: 'actionName', label: '动作名称', minWidth: 150, showOverflowTooltip: true },
|
||||||
|
{ prop: 'actionCode', label: '动作编码', minWidth: 150, showOverflowTooltip: true },
|
||||||
|
{
|
||||||
|
prop: 'toStatusCode',
|
||||||
|
label: '目标状态',
|
||||||
|
minWidth: 180,
|
||||||
|
formatter: row => row.toStatusName?.trim() || row.toStatusCode
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'needReason',
|
||||||
|
label: '必须填写原因',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
formatter: row => <ElTag type={getBooleanTagType(row.needReason)}>{getBooleanLabel(row.needReason)}</ElTag>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'status',
|
||||||
|
label: '配置状态',
|
||||||
|
width: 110,
|
||||||
|
align: 'center',
|
||||||
|
formatter: row => <ElTag type={getStatusTagType(row.status)}>{getStatusLabel(row.status)}</ElTag>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'remark',
|
||||||
|
label: '备注',
|
||||||
|
minWidth: 180,
|
||||||
|
showOverflowTooltip: true,
|
||||||
|
formatter: row => row.remark || '--'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '创建时间',
|
||||||
|
minWidth: 170,
|
||||||
|
formatter: row => formatDateTime(row.createTime)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'operate',
|
||||||
|
label: '操作',
|
||||||
|
width: 180,
|
||||||
|
align: 'center',
|
||||||
|
fixed: 'right',
|
||||||
|
formatter: row => (
|
||||||
|
<BusinessTableActionCell
|
||||||
|
actions={[
|
||||||
|
{
|
||||||
|
key: 'edit',
|
||||||
|
label: '编辑',
|
||||||
|
buttonType: 'primary',
|
||||||
|
onClick: () => openEdit(row)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'delete',
|
||||||
|
label: '删除',
|
||||||
|
buttonType: 'danger',
|
||||||
|
onClick: () => handleDeleteAction(row)
|
||||||
|
}
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
const { bool: operateVisible, setTrue: openOperateModal, setFalse: closeOperateModal } = useBoolean();
|
||||||
|
const operateType = ref<UI.TableOperateType>('add');
|
||||||
|
const editingData = ref<Api.Infra.ObjectStatusTransition | null>(null);
|
||||||
|
|
||||||
|
function openAdd() {
|
||||||
|
operateType.value = 'add';
|
||||||
|
editingData.value = null;
|
||||||
|
openOperateModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openEdit(item: Api.Infra.ObjectStatusTransition) {
|
||||||
|
operateType.value = 'edit';
|
||||||
|
editingData.value = item;
|
||||||
|
openOperateModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleDelete(item: Api.Infra.ObjectStatusTransition) {
|
||||||
|
const { error } = await fetchDeleteObjectStatusTransition(item.id);
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('删除成功');
|
||||||
|
await reloadTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleDeleteAction(row: Api.Infra.ObjectStatusTransition) {
|
||||||
|
try {
|
||||||
|
await window.$messageBox?.confirm('确认删除当前状态流转吗?', '警告', {
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await handleDelete(row);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleBatchDelete() {
|
||||||
|
if (!checkedRowKeys.value.length) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { error } = await fetchBatchDeleteObjectStatusTransition(checkedRowKeys.value);
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('删除成功');
|
||||||
|
await reloadTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSelectionChange(rows: Api.Infra.ObjectStatusTransition[]) {
|
||||||
|
checkedRowKeys.value = rows.map(item => item.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function reloadTable(page = searchParams.pageNo) {
|
||||||
|
checkedRowKeys.value = [];
|
||||||
|
await getDataByPage(page);
|
||||||
|
await nextTick();
|
||||||
|
transitionTableRef.value?.clearSelection();
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetSearchParams() {
|
||||||
|
Object.assign(searchParams, getInitSearchParams());
|
||||||
|
reloadTable(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSearch() {
|
||||||
|
reloadTable(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSubmitted() {
|
||||||
|
closeOperateModal();
|
||||||
|
reloadTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function loadStatusModelOptions() {
|
||||||
|
if (!props.currentStatus?.objectType) {
|
||||||
|
statusModelOptions.value = [];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
loadingOptions.value = true;
|
||||||
|
|
||||||
|
const { error, data: page } = await fetchGetObjectStatusModelPage({
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 200,
|
||||||
|
keyword: undefined,
|
||||||
|
objectType: props.currentStatus.objectType,
|
||||||
|
status: undefined,
|
||||||
|
initialFlag: undefined,
|
||||||
|
terminalFlag: undefined
|
||||||
|
});
|
||||||
|
|
||||||
|
loadingOptions.value = false;
|
||||||
|
|
||||||
|
statusModelOptions.value = error ? [] : page.list;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function initDialog() {
|
||||||
|
if (!props.currentStatus) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
Object.assign(searchParams, getInitSearchParams(), {
|
||||||
|
objectType: props.currentStatus.objectType,
|
||||||
|
fromStatusCode: props.currentStatus.statusCode
|
||||||
|
});
|
||||||
|
|
||||||
|
checkedRowKeys.value = [];
|
||||||
|
|
||||||
|
await Promise.all([loadStatusModelOptions(), reloadTable(1)]);
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => [visible.value, props.currentStatus?.id] as const,
|
||||||
|
([opened]) => {
|
||||||
|
if (opened) {
|
||||||
|
initDialog();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ immediate: true }
|
||||||
|
);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BusinessFormDialog
|
||||||
|
v-model="visible"
|
||||||
|
title="状态流转配置"
|
||||||
|
width="1200px"
|
||||||
|
:loading="loadingOptions"
|
||||||
|
:show-footer="false"
|
||||||
|
:scrollbar="false"
|
||||||
|
>
|
||||||
|
<div v-if="currentStatus" class="state-transition-dialog">
|
||||||
|
<StateTransitionSearch
|
||||||
|
v-model:model="searchParams"
|
||||||
|
:target-status-options="targetStatusOptions"
|
||||||
|
@reset="resetSearchParams"
|
||||||
|
@search="handleSearch"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<ElCard class="flex-1-hidden card-wrapper" body-class="business-table-card-body">
|
||||||
|
<template #header>
|
||||||
|
<div class="flex items-center justify-between gap-12px">
|
||||||
|
<div class="min-w-0 flex flex-wrap items-center gap-8px">
|
||||||
|
<p>状态流转列表</p>
|
||||||
|
<ElTag type="primary" effect="light">
|
||||||
|
{{ currentObjectTypeLabel }}
|
||||||
|
</ElTag>
|
||||||
|
<ElTag type="success" effect="light">
|
||||||
|
{{ currentStatusLabel }}
|
||||||
|
</ElTag>
|
||||||
|
<ElTag effect="plain">{{ mobilePagination.total || data.length }}</ElTag>
|
||||||
|
</div>
|
||||||
|
<TableHeaderOperation
|
||||||
|
v-model:columns="columnChecks"
|
||||||
|
:disabled-delete="checkedRowKeys.length === 0"
|
||||||
|
:loading="loading"
|
||||||
|
@refresh="getData"
|
||||||
|
>
|
||||||
|
<template #default>
|
||||||
|
<ElButton plain type="primary" @click="openAdd">
|
||||||
|
<template #icon>
|
||||||
|
<icon-ic-round-plus class="text-icon" />
|
||||||
|
</template>
|
||||||
|
新增
|
||||||
|
</ElButton>
|
||||||
|
<ElPopconfirm title="确认删除选中的状态流转吗?" @confirm="handleBatchDelete">
|
||||||
|
<template #reference>
|
||||||
|
<ElButton type="danger" plain :disabled="checkedRowKeys.length === 0">
|
||||||
|
<template #icon>
|
||||||
|
<icon-ic-round-delete class="text-icon" />
|
||||||
|
</template>
|
||||||
|
批量删除
|
||||||
|
</ElButton>
|
||||||
|
</template>
|
||||||
|
</ElPopconfirm>
|
||||||
|
</template>
|
||||||
|
</TableHeaderOperation>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div class="flex-1">
|
||||||
|
<ElTable
|
||||||
|
ref="transitionTableRef"
|
||||||
|
v-loading="loading"
|
||||||
|
height="100%"
|
||||||
|
border
|
||||||
|
row-key="id"
|
||||||
|
:data="data"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
|
>
|
||||||
|
<ElTableColumn v-for="col in columns" :key="String(col.prop)" v-bind="col" />
|
||||||
|
</ElTable>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-20px flex justify-end">
|
||||||
|
<ElPagination
|
||||||
|
v-if="mobilePagination.total"
|
||||||
|
layout="total,prev,pager,next,sizes"
|
||||||
|
v-bind="mobilePagination"
|
||||||
|
@current-change="mobilePagination['current-change']"
|
||||||
|
@size-change="mobilePagination['size-change']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ElCard>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-else class="h-full flex items-center justify-center">
|
||||||
|
<ElEmpty description="请选择状态模型" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<StateTransitionOperateDialog
|
||||||
|
v-model:visible="operateVisible"
|
||||||
|
:operate-type="operateType"
|
||||||
|
:row-data="editingData"
|
||||||
|
:current-status="currentStatus"
|
||||||
|
:target-status-options="targetStatusOptions"
|
||||||
|
append-to-body
|
||||||
|
@submitted="handleSubmitted"
|
||||||
|
/>
|
||||||
|
</BusinessFormDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.state-transition-dialog {
|
||||||
|
display: flex;
|
||||||
|
min-height: 560px;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,234 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE } from '@/constants/dict';
|
||||||
|
import {
|
||||||
|
fetchCreateObjectStatusTransition,
|
||||||
|
fetchGetObjectStatusTransition,
|
||||||
|
fetchUpdateObjectStatusTransition
|
||||||
|
} from '@/service/api';
|
||||||
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
import { statusOptions } from '../shared';
|
||||||
|
|
||||||
|
defineOptions({ name: 'StateTransitionOperateDialog' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
operateType: UI.TableOperateType;
|
||||||
|
rowData?: Api.Infra.ObjectStatusTransition | null;
|
||||||
|
currentStatus?: Api.Infra.ObjectStatusModel | null;
|
||||||
|
targetStatusOptions: Array<{ label: string; value: string }>;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
submitted: [transitionId: string];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const visible = defineModel<boolean>('visible', {
|
||||||
|
default: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const { formRef, validate } = useForm();
|
||||||
|
const { createRequiredRule } = useFormRules();
|
||||||
|
const { getLabel: getObjectTypeLabel } = useDict(OBJECT_STATUS_MODEL_OBJECT_TYPE_DICT_CODE);
|
||||||
|
|
||||||
|
const detailLoading = ref(false);
|
||||||
|
const submitting = ref(false);
|
||||||
|
const isEdit = computed(() => props.operateType === 'edit');
|
||||||
|
|
||||||
|
const title = computed(() => {
|
||||||
|
const titleMap: Record<UI.TableOperateType, string> = {
|
||||||
|
add: '新增状态流转',
|
||||||
|
edit: '编辑状态流转'
|
||||||
|
};
|
||||||
|
|
||||||
|
return titleMap[props.operateType];
|
||||||
|
});
|
||||||
|
|
||||||
|
type Model = Api.Infra.SaveObjectStatusTransitionParams;
|
||||||
|
|
||||||
|
const model = ref(createDefaultModel());
|
||||||
|
|
||||||
|
const currentObjectTypeLabel = computed(() => getObjectTypeLabel(model.value.objectType));
|
||||||
|
|
||||||
|
const currentFromStatusLabel = computed(() => {
|
||||||
|
if (!props.currentStatus) {
|
||||||
|
return model.value.fromStatusCode || '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
return `${props.currentStatus.statusName} (${props.currentStatus.statusCode})`;
|
||||||
|
});
|
||||||
|
|
||||||
|
function createDefaultModel(): Model {
|
||||||
|
return {
|
||||||
|
objectType: props.currentStatus?.objectType ?? 'product',
|
||||||
|
actionCode: '',
|
||||||
|
actionName: '',
|
||||||
|
fromStatusCode: props.currentStatus?.statusCode ?? '',
|
||||||
|
toStatusCode: '',
|
||||||
|
needReason: false,
|
||||||
|
status: 0,
|
||||||
|
remark: ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const rules = {
|
||||||
|
actionCode: createRequiredRule('请输入动作编码'),
|
||||||
|
actionName: createRequiredRule('请输入动作名称'),
|
||||||
|
toStatusCode: createRequiredRule('请选择目标状态'),
|
||||||
|
status: createRequiredRule('请选择配置状态')
|
||||||
|
} satisfies Record<string, App.Global.FormRule>;
|
||||||
|
|
||||||
|
function closeModal() {
|
||||||
|
visible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function initModel() {
|
||||||
|
model.value = createDefaultModel();
|
||||||
|
|
||||||
|
if (!isEdit.value || !props.rowData) {
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
detailLoading.value = true;
|
||||||
|
|
||||||
|
const { error, data } = await fetchGetObjectStatusTransition(props.rowData.id);
|
||||||
|
|
||||||
|
detailLoading.value = false;
|
||||||
|
|
||||||
|
if (!error) {
|
||||||
|
model.value = {
|
||||||
|
objectType: data.objectType,
|
||||||
|
actionCode: data.actionCode,
|
||||||
|
actionName: data.actionName,
|
||||||
|
fromStatusCode: data.fromStatusCode,
|
||||||
|
toStatusCode: data.toStatusCode,
|
||||||
|
needReason: data.needReason,
|
||||||
|
status: data.status,
|
||||||
|
remark: data.remark ?? ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleSubmit() {
|
||||||
|
await validate();
|
||||||
|
|
||||||
|
submitting.value = true;
|
||||||
|
|
||||||
|
const submitData: Api.Infra.SaveObjectStatusTransitionParams = {
|
||||||
|
...model.value,
|
||||||
|
objectType: props.currentStatus?.objectType ?? model.value.objectType,
|
||||||
|
fromStatusCode: props.currentStatus?.statusCode ?? model.value.fromStatusCode,
|
||||||
|
actionCode: model.value.actionCode.trim(),
|
||||||
|
actionName: model.value.actionName.trim(),
|
||||||
|
remark: model.value.remark?.trim() || null
|
||||||
|
};
|
||||||
|
|
||||||
|
let transitionId = props.rowData?.id ?? '';
|
||||||
|
|
||||||
|
if (isEdit.value && props.rowData) {
|
||||||
|
const { error } = await fetchUpdateObjectStatusTransition({ id: props.rowData.id, ...submitData });
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
const { error, data } = await fetchCreateObjectStatusTransition(submitData);
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
transitionId = data;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success(isEdit.value ? '修改成功' : '新增成功');
|
||||||
|
|
||||||
|
closeModal();
|
||||||
|
emit('submitted', transitionId);
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(visible, value => {
|
||||||
|
if (value) {
|
||||||
|
initModel();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BusinessFormDialog
|
||||||
|
v-model="visible"
|
||||||
|
:title="title"
|
||||||
|
preset="md"
|
||||||
|
:loading="detailLoading"
|
||||||
|
:confirm-loading="submitting"
|
||||||
|
@confirm="handleSubmit"
|
||||||
|
>
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
||||||
|
<ElRow :gutter="16">
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="对象类型">
|
||||||
|
<ElInput :model-value="currentObjectTypeLabel" readonly />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="起始状态">
|
||||||
|
<ElInput :model-value="currentFromStatusLabel" readonly />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="动作编码" prop="actionCode">
|
||||||
|
<ElInput v-model="model.actionCode" placeholder="请输入动作编码" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="动作名称" prop="actionName">
|
||||||
|
<ElInput v-model="model.actionName" placeholder="请输入动作名称" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="目标状态" prop="toStatusCode">
|
||||||
|
<ElSelect v-model="model.toStatusCode" class="w-full" placeholder="请选择目标状态">
|
||||||
|
<ElOption v-for="{ label, value } in targetStatusOptions" :key="value" :label="label" :value="value" />
|
||||||
|
</ElSelect>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="配置状态" prop="status">
|
||||||
|
<ElRadioGroup v-model="model.status" class="business-form-radio-group">
|
||||||
|
<ElRadio v-for="{ label, value } in statusOptions" :key="value" :value="value">
|
||||||
|
{{ label }}
|
||||||
|
</ElRadio>
|
||||||
|
</ElRadioGroup>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="必须填写原因" prop="needReason">
|
||||||
|
<div class="business-form-switch-field">
|
||||||
|
<ElSwitch v-model="model.needReason" />
|
||||||
|
<span class="ml-8px text-12px text-[#606266]">{{ model.needReason ? '是' : '否' }}</span>
|
||||||
|
</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="备注" prop="remark">
|
||||||
|
<ElInput v-model="model.remark" type="textarea" :rows="4" placeholder="请输入备注" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</BusinessFormDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
@@ -0,0 +1,97 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, reactive, watch } from 'vue';
|
||||||
|
import TableSearchFields, { type SearchField } from '@/components/custom/table-search-fields.vue';
|
||||||
|
import { statusOptions } from '../shared';
|
||||||
|
|
||||||
|
defineOptions({ name: 'StateTransitionSearch' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
targetStatusOptions: Array<{ label: string; value: string }>;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
reset: [];
|
||||||
|
search: [];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const model = defineModel<Api.Infra.ObjectStatusTransitionSearchParams>('model', { required: true });
|
||||||
|
|
||||||
|
const searchModel = reactive<{
|
||||||
|
keyword: string;
|
||||||
|
toStatusCode?: string;
|
||||||
|
status?: Api.Infra.CommonStatus;
|
||||||
|
}>({
|
||||||
|
keyword: '',
|
||||||
|
toStatusCode: undefined,
|
||||||
|
status: undefined
|
||||||
|
});
|
||||||
|
|
||||||
|
let syncingFromSource = false;
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => [model.value.actionName, model.value.actionCode, model.value.toStatusCode, model.value.status] as const,
|
||||||
|
([actionName, actionCode, toStatusCode, status]) => {
|
||||||
|
syncingFromSource = true;
|
||||||
|
searchModel.keyword = actionName ?? actionCode ?? '';
|
||||||
|
searchModel.toStatusCode = toStatusCode;
|
||||||
|
searchModel.status = status;
|
||||||
|
syncingFromSource = false;
|
||||||
|
},
|
||||||
|
{ immediate: true, flush: 'sync' }
|
||||||
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => [searchModel.keyword, searchModel.toStatusCode, searchModel.status] as const,
|
||||||
|
([keywordValue, toStatusCode, status]) => {
|
||||||
|
if (syncingFromSource) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const keywordText = keywordValue.trim() || undefined;
|
||||||
|
model.value.actionName = keywordText;
|
||||||
|
model.value.actionCode = keywordText;
|
||||||
|
model.value.toStatusCode = toStatusCode;
|
||||||
|
model.value.status = status;
|
||||||
|
},
|
||||||
|
{ flush: 'sync' }
|
||||||
|
);
|
||||||
|
|
||||||
|
const fields = computed<SearchField[]>(() => [
|
||||||
|
{
|
||||||
|
key: 'keyword',
|
||||||
|
label: '动作名称',
|
||||||
|
type: 'input',
|
||||||
|
placeholder: '请输入动作名称或动作编码'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'toStatusCode',
|
||||||
|
label: '目标状态',
|
||||||
|
type: 'select',
|
||||||
|
placeholder: '请选择目标状态',
|
||||||
|
options: props.targetStatusOptions
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'status',
|
||||||
|
label: '配置状态',
|
||||||
|
type: 'select',
|
||||||
|
placeholder: '请选择配置状态',
|
||||||
|
options: statusOptions
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
|
function reset() {
|
||||||
|
emit('reset');
|
||||||
|
}
|
||||||
|
|
||||||
|
function search() {
|
||||||
|
emit('search');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<TableSearchFields v-model="searchModel" :fields="fields" :columns="4" @reset="reset" @search="search" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped></style>
|
||||||
38
src/views/infra/state-machine/shared.ts
Normal file
38
src/views/infra/state-machine/shared.ts
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
import dayjs from 'dayjs';
|
||||||
|
|
||||||
|
export const statusOptions: Array<{ label: string; value: Api.Infra.CommonStatus }> = [
|
||||||
|
{ label: '启用', value: 0 },
|
||||||
|
{ label: '停用', value: 1 }
|
||||||
|
];
|
||||||
|
|
||||||
|
export function getStatusLabel(value?: Api.Infra.CommonStatus | null) {
|
||||||
|
if (value === 0) {
|
||||||
|
return '启用';
|
||||||
|
}
|
||||||
|
|
||||||
|
if (value === 1) {
|
||||||
|
return '停用';
|
||||||
|
}
|
||||||
|
|
||||||
|
return '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getStatusTagType(value?: Api.Infra.CommonStatus | null): UI.ThemeColor {
|
||||||
|
return value === 0 ? 'success' : 'warning';
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getBooleanLabel(value?: boolean | null) {
|
||||||
|
return value ? '是' : '否';
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getBooleanTagType(value?: boolean | null): UI.ThemeColor {
|
||||||
|
return value ? 'success' : 'info';
|
||||||
|
}
|
||||||
|
|
||||||
|
export function formatDateTime(value?: string | number | null) {
|
||||||
|
if (!value) {
|
||||||
|
return '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
return dayjs(value).format('YYYY-MM-DD HH:mm:ss');
|
||||||
|
}
|
||||||
3
src/views/metrics/member-efficiency/index.vue
Normal file
3
src/views/metrics/member-efficiency/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="员工能效" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
3
src/views/metrics/project-progress/index.vue
Normal file
3
src/views/metrics/project-progress/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="项目进度" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
3
src/views/metrics/worktime/index.vue
Normal file
3
src/views/metrics/worktime/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="工时统计" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
3
src/views/personal-center/my-application/index.vue
Normal file
3
src/views/personal-center/my-application/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="我的申请" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
3
src/views/personal-center/my-monthly/index.vue
Normal file
3
src/views/personal-center/my-monthly/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="我的月报" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
3
src/views/personal-center/my-performance/index.vue
Normal file
3
src/views/personal-center/my-performance/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="我的绩效" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
419
src/views/personal-center/my-profile/index.vue
Normal file
419
src/views/personal-center/my-profile/index.vue
Normal file
@@ -0,0 +1,419 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, onActivated, onMounted, ref } from 'vue';
|
||||||
|
import { userGenderRecord } from '@/constants/business';
|
||||||
|
import { fetchGetMyProfileDetail, fetchUpdateMyAvatar } from '@/service/api';
|
||||||
|
import { useAuthStore } from '@/store/modules/auth';
|
||||||
|
import { useAppStore } from '@/store/modules/app';
|
||||||
|
import { $t } from '@/locales';
|
||||||
|
import ProfileInfoDialog from './modules/profile-info-dialog.vue';
|
||||||
|
import ProfilePasswordDialog from './modules/profile-password-dialog.vue';
|
||||||
|
import { formatProfileDateTime, resolveProfileRoleLabels } from './modules/profile-model';
|
||||||
|
|
||||||
|
defineOptions({ name: 'MyProfile' });
|
||||||
|
|
||||||
|
const authStore = useAuthStore();
|
||||||
|
const appStore = useAppStore();
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
const avatarSubmitting = ref(false);
|
||||||
|
const profile = ref<Api.Auth.MyProfileDetail | null>(null);
|
||||||
|
const profileInfoVisible = ref(false);
|
||||||
|
const passwordVisible = ref(false);
|
||||||
|
const avatarInputRef = ref<HTMLInputElement | null>(null);
|
||||||
|
|
||||||
|
const MAX_AVATAR_SIZE = 5 * 1024 * 1024;
|
||||||
|
|
||||||
|
const descriptionColumns = computed(() => (appStore.isMobile ? 1 : 2));
|
||||||
|
const displayName = computed(() => profile.value?.nickname?.trim() || profile.value?.username || '--');
|
||||||
|
const displayUsername = computed(() => profile.value?.username?.trim() || '--');
|
||||||
|
const companyText = computed(() => profile.value?.company?.trim() || '--');
|
||||||
|
const deptText = computed(() => profile.value?.dept?.name?.trim() || profile.value?.deptName?.trim() || '--');
|
||||||
|
const positionText = computed(
|
||||||
|
() => profile.value?.position?.name?.trim() || profile.value?.positionName?.trim() || '--'
|
||||||
|
);
|
||||||
|
const mobileText = computed(() => profile.value?.mobile?.trim() || '--');
|
||||||
|
const emailText = computed(() => profile.value?.email?.trim() || '--');
|
||||||
|
const genderText = computed(() => {
|
||||||
|
const value = profile.value?.sex;
|
||||||
|
|
||||||
|
if (value === null || value === undefined) {
|
||||||
|
return '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
return $t(userGenderRecord[value]);
|
||||||
|
});
|
||||||
|
|
||||||
|
const roleLabels = computed(() => {
|
||||||
|
const roles = profile.value?.roles ?? [];
|
||||||
|
|
||||||
|
if (roles.length === 0) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
|
||||||
|
return resolveProfileRoleLabels(roles);
|
||||||
|
});
|
||||||
|
|
||||||
|
function getAvatarText() {
|
||||||
|
const name = displayName.value;
|
||||||
|
|
||||||
|
return name === '--' ? 'CN' : name.slice(0, 1).toUpperCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function loadProfile() {
|
||||||
|
const userId = authStore.userInfo.userId;
|
||||||
|
|
||||||
|
if (!userId) {
|
||||||
|
profile.value = null;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { data, error } = await fetchGetMyProfileDetail({ userId });
|
||||||
|
|
||||||
|
if (!error) {
|
||||||
|
profile.value = data;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function initPage() {
|
||||||
|
loading.value = true;
|
||||||
|
|
||||||
|
await authStore.initUserInfo();
|
||||||
|
await loadProfile();
|
||||||
|
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function triggerAvatarSelect() {
|
||||||
|
if (!profile.value || avatarSubmitting.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
avatarInputRef.value?.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleAvatarChange(event: Event) {
|
||||||
|
const input = event.target as HTMLInputElement;
|
||||||
|
const file = input.files?.[0];
|
||||||
|
input.value = '';
|
||||||
|
|
||||||
|
if (!file || !profile.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!file.type.startsWith('image/')) {
|
||||||
|
window.$message?.error('请上传图片文件');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (file.size > MAX_AVATAR_SIZE) {
|
||||||
|
window.$message?.error('头像图片大小不能超过 5MB');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
avatarSubmitting.value = true;
|
||||||
|
|
||||||
|
const updateResult = await fetchUpdateMyAvatar(file);
|
||||||
|
|
||||||
|
avatarSubmitting.value = false;
|
||||||
|
|
||||||
|
if (updateResult.error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('头像更新成功');
|
||||||
|
await Promise.all([loadProfile(), authStore.refreshUserInfo()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleProfileSubmitted() {
|
||||||
|
await Promise.all([loadProfile(), authStore.refreshUserInfo()]);
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
initPage();
|
||||||
|
});
|
||||||
|
|
||||||
|
onActivated(() => {
|
||||||
|
initPage();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div v-loading="loading" class="my-profile-page">
|
||||||
|
<template v-if="profile">
|
||||||
|
<ElCard class="my-profile-hero-card" shadow="never">
|
||||||
|
<div class="my-profile-hero">
|
||||||
|
<div class="my-profile-hero__identity">
|
||||||
|
<button
|
||||||
|
class="my-profile-hero__avatar-button"
|
||||||
|
type="button"
|
||||||
|
:disabled="avatarSubmitting"
|
||||||
|
@click="triggerAvatarSelect"
|
||||||
|
>
|
||||||
|
<ElAvatar v-if="profile.avatar" :src="profile.avatar" :size="88" class="my-profile-hero__avatar" />
|
||||||
|
<div v-else class="my-profile-hero__avatar-fallback">{{ getAvatarText() }}</div>
|
||||||
|
<div class="my-profile-hero__avatar-mask">
|
||||||
|
<span>{{ avatarSubmitting ? '上传中...' : '更换头像' }}</span>
|
||||||
|
</div>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<input
|
||||||
|
ref="avatarInputRef"
|
||||||
|
class="my-profile-hero__avatar-input"
|
||||||
|
type="file"
|
||||||
|
accept="image/*"
|
||||||
|
@change="handleAvatarChange"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="my-profile-hero__summary">
|
||||||
|
<div class="my-profile-hero__title-row">
|
||||||
|
<h1 class="my-profile-hero__title">{{ displayName }}</h1>
|
||||||
|
<ElTag type="info" effect="plain">个人中心</ElTag>
|
||||||
|
</div>
|
||||||
|
<p class="my-profile-hero__subtitle">@{{ displayUsername }}</p>
|
||||||
|
<div class="my-profile-hero__meta">
|
||||||
|
<ElTag effect="plain">{{ companyText }}</ElTag>
|
||||||
|
<ElTag effect="plain">{{ deptText }}</ElTag>
|
||||||
|
<ElTag effect="plain">{{ positionText }}</ElTag>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="my-profile-hero__actions">
|
||||||
|
<ElButton type="primary" @click="profileInfoVisible = true">编辑基本信息</ElButton>
|
||||||
|
<ElButton @click="passwordVisible = true">修改密码</ElButton>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ElCard>
|
||||||
|
|
||||||
|
<div class="my-profile-content">
|
||||||
|
<ElCard shadow="never">
|
||||||
|
<template #header>
|
||||||
|
<div class="my-profile-card__header">
|
||||||
|
<span class="my-profile-card__title">基本资料</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<ElDescriptions :column="descriptionColumns" border>
|
||||||
|
<ElDescriptionsItem label="用户名">{{ displayUsername }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="名称">{{ displayName }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="手机号">{{ mobileText }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="邮箱">{{ emailText }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="性别">{{ genderText }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="所属公司">{{ companyText }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="所属部门">{{ deptText }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="所属岗位">{{ positionText }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="角色" :span="descriptionColumns">
|
||||||
|
<div v-if="roleLabels.length" class="my-profile-role-list">
|
||||||
|
<ElTag v-for="roleLabel in roleLabels" :key="roleLabel" type="primary" effect="plain">
|
||||||
|
{{ roleLabel }}
|
||||||
|
</ElTag>
|
||||||
|
</div>
|
||||||
|
<span v-else>--</span>
|
||||||
|
</ElDescriptionsItem>
|
||||||
|
</ElDescriptions>
|
||||||
|
</ElCard>
|
||||||
|
|
||||||
|
<ElCard shadow="never">
|
||||||
|
<template #header>
|
||||||
|
<div class="my-profile-card__header">
|
||||||
|
<span class="my-profile-card__title">登录信息</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<ElDescriptions :column="descriptionColumns" border>
|
||||||
|
<ElDescriptionsItem label="最近登录 IP">{{ profile.loginIp?.trim() || '--' }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="最近登录时间">{{ formatProfileDateTime(profile.loginDate) }}</ElDescriptionsItem>
|
||||||
|
<ElDescriptionsItem label="账号创建时间" :span="descriptionColumns">
|
||||||
|
{{ formatProfileDateTime(profile.createTime) }}
|
||||||
|
</ElDescriptionsItem>
|
||||||
|
</ElDescriptions>
|
||||||
|
</ElCard>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<ElEmpty v-else description="未获取到个人信息" />
|
||||||
|
|
||||||
|
<ProfileInfoDialog v-model:visible="profileInfoVisible" :profile="profile" @submitted="handleProfileSubmitted" />
|
||||||
|
<ProfilePasswordDialog v-model:visible="passwordVisible" :username="profile?.username" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.my-profile-page {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero-card {
|
||||||
|
overflow: hidden;
|
||||||
|
border: 1px solid rgb(226 232 240 / 92%);
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(14 116 144 / 12%), transparent 32%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(16 185 129 / 10%), transparent 26%),
|
||||||
|
linear-gradient(135deg, rgb(255 255 255 / 99%), rgb(248 250 252 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(0, 1fr) auto;
|
||||||
|
gap: 16px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__identity {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
align-items: center;
|
||||||
|
gap: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar-button {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
width: 88px;
|
||||||
|
height: 88px;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: none;
|
||||||
|
border-radius: 999px;
|
||||||
|
padding: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
background: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar-button:disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar,
|
||||||
|
.my-profile-hero__avatar-fallback {
|
||||||
|
width: 88px;
|
||||||
|
height: 88px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar-fallback {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 999px;
|
||||||
|
background: linear-gradient(135deg, rgb(14 116 144 / 92%), rgb(15 118 110 / 84%));
|
||||||
|
color: #fff;
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar-mask {
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background-color: rgb(15 23 42 / 52%);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar-button:hover .my-profile-hero__avatar-mask,
|
||||||
|
.my-profile-hero__avatar-button:focus-visible .my-profile-hero__avatar-mask {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__avatar-input {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__summary {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__title-row {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__title {
|
||||||
|
margin: 0;
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 28px;
|
||||||
|
line-height: 1.15;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__subtitle {
|
||||||
|
margin: 0;
|
||||||
|
color: rgb(100 116 139 / 92%);
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__meta {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__actions {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-content {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-card__header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-card__title {
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-role-list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (width <= 960px) {
|
||||||
|
.my-profile-hero {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__actions {
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-content {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (width <= 640px) {
|
||||||
|
.my-profile-hero__identity {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-profile-hero__title {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,136 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { userGenderOptions } from '@/constants/business';
|
||||||
|
import { fetchUpdateMyProfile } from '@/service/api';
|
||||||
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
|
import { translateOptions } from '@/utils/common';
|
||||||
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
import { buildProfileUpdatePayload } from './profile-model';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProfileInfoDialog' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
profile?: Api.Auth.MyProfileDetail | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
interface Emits {
|
||||||
|
(e: 'submitted'): void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const emit = defineEmits<Emits>();
|
||||||
|
|
||||||
|
const visible = defineModel<boolean>('visible', {
|
||||||
|
default: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const { formRef, validate } = useForm();
|
||||||
|
const { createRequiredRule, patternRules } = useFormRules();
|
||||||
|
|
||||||
|
const submitting = ref(false);
|
||||||
|
|
||||||
|
const genderOptions = computed(() =>
|
||||||
|
translateOptions(userGenderOptions).map(item => ({
|
||||||
|
...item,
|
||||||
|
value: Number(item.value) as Api.SystemManage.UserGender
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
|
||||||
|
const model = ref<Api.Auth.UpdateMyProfileParams>({
|
||||||
|
nickname: '',
|
||||||
|
email: '',
|
||||||
|
mobile: '',
|
||||||
|
sex: 1,
|
||||||
|
avatar: ''
|
||||||
|
});
|
||||||
|
|
||||||
|
const rules = computed<Record<string, App.Global.FormRule[]>>(() => ({
|
||||||
|
nickname: [createRequiredRule('请输入昵称')],
|
||||||
|
mobile: model.value.mobile?.trim() ? [patternRules.phone] : [],
|
||||||
|
email: model.value.email?.trim() ? [patternRules.email] : []
|
||||||
|
}));
|
||||||
|
|
||||||
|
function initModel() {
|
||||||
|
model.value = {
|
||||||
|
nickname: props.profile?.nickname ?? '',
|
||||||
|
email: props.profile?.email ?? '',
|
||||||
|
mobile: props.profile?.mobile ?? '',
|
||||||
|
sex: props.profile?.sex ?? 1,
|
||||||
|
avatar: props.profile?.avatar ?? ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeDialog() {
|
||||||
|
visible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleSubmit() {
|
||||||
|
if (!props.profile) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await validate();
|
||||||
|
|
||||||
|
submitting.value = true;
|
||||||
|
|
||||||
|
const { error } = await fetchUpdateMyProfile(buildProfileUpdatePayload(model.value));
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('个人信息更新成功');
|
||||||
|
closeDialog();
|
||||||
|
emit('submitted');
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(visible, async value => {
|
||||||
|
if (!value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
initModel();
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BusinessFormDialog
|
||||||
|
v-model="visible"
|
||||||
|
title="编辑基本信息"
|
||||||
|
preset="sm"
|
||||||
|
:confirm-loading="submitting"
|
||||||
|
@confirm="handleSubmit"
|
||||||
|
>
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top" autocomplete="off">
|
||||||
|
<ElRow :gutter="16">
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="昵称" prop="nickname">
|
||||||
|
<ElInput v-model="model.nickname" maxlength="30" placeholder="请输入昵称" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="手机号" prop="mobile">
|
||||||
|
<ElInput v-model="model.mobile" maxlength="20" placeholder="请输入手机号" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="邮箱" prop="email">
|
||||||
|
<ElInput v-model="model.email" maxlength="100" placeholder="请输入邮箱" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="性别" prop="sex">
|
||||||
|
<ElSelect v-model="model.sex" placeholder="请选择性别">
|
||||||
|
<ElOption v-for="{ label, value } in genderOptions" :key="value" :label="label" :value="value" />
|
||||||
|
</ElSelect>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</BusinessFormDialog>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
import dayjs from 'dayjs';
|
||||||
|
|
||||||
|
function getNullableText(value?: string | null) {
|
||||||
|
return value?.trim() || null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function formatProfileDateTime(value?: string | number | null) {
|
||||||
|
if (!value) {
|
||||||
|
return '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
return dayjs(value).format('YYYY-MM-DD HH:mm:ss');
|
||||||
|
}
|
||||||
|
|
||||||
|
export function resolveProfileRoleLabels(roles: Api.SystemManage.RoleSimple[]) {
|
||||||
|
return roles.map(role => role.name?.trim() || role.code || role.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function buildProfileUpdatePayload(form: Api.Auth.UpdateMyProfileParams): Api.Auth.UpdateMyProfileParams {
|
||||||
|
return {
|
||||||
|
nickname: getNullableText(form.nickname),
|
||||||
|
email: getNullableText(form.email),
|
||||||
|
mobile: getNullableText(form.mobile),
|
||||||
|
sex: form.sex ?? null,
|
||||||
|
avatar: getNullableText(form.avatar)
|
||||||
|
};
|
||||||
|
}
|
||||||
@@ -0,0 +1,181 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { fetchUpdateMyPassword } from '@/service/api';
|
||||||
|
import { useAuthStore } from '@/store/modules/auth';
|
||||||
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProfilePasswordDialog' });
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
username?: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
interface Emits {
|
||||||
|
(e: 'submitted'): void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const emit = defineEmits<Emits>();
|
||||||
|
|
||||||
|
const visible = defineModel<boolean>('visible', {
|
||||||
|
default: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const authStore = useAuthStore();
|
||||||
|
const { formRef, validate } = useForm();
|
||||||
|
const { createRequiredRule, createConfirmPwdRule, patternRules } = useFormRules();
|
||||||
|
|
||||||
|
const submitting = ref(false);
|
||||||
|
|
||||||
|
const model = ref({
|
||||||
|
oldPassword: '',
|
||||||
|
newPassword: '',
|
||||||
|
confirmPassword: ''
|
||||||
|
});
|
||||||
|
|
||||||
|
const confirmDisabled = computed(() => {
|
||||||
|
return (
|
||||||
|
submitting.value ||
|
||||||
|
!model.value.oldPassword.trim() ||
|
||||||
|
!model.value.newPassword.trim() ||
|
||||||
|
!model.value.confirmPassword.trim()
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
const rules = computed<Record<string, App.Global.FormRule[]>>(() => ({
|
||||||
|
oldPassword: [createRequiredRule('请输入旧密码')],
|
||||||
|
newPassword: [
|
||||||
|
createRequiredRule('请输入新密码'),
|
||||||
|
patternRules.pwd,
|
||||||
|
{
|
||||||
|
asyncValidator: (_rule, value: string) => {
|
||||||
|
if (value.trim() !== '' && value === model.value.oldPassword) {
|
||||||
|
return Promise.reject(new Error('新密码不能与旧密码相同'));
|
||||||
|
}
|
||||||
|
|
||||||
|
return Promise.resolve();
|
||||||
|
},
|
||||||
|
trigger: 'change'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
confirmPassword: createConfirmPwdRule(model.value.newPassword)
|
||||||
|
}));
|
||||||
|
|
||||||
|
const displayUsername = computed(() => props.username?.trim() || '--');
|
||||||
|
|
||||||
|
function initModel() {
|
||||||
|
model.value.oldPassword = '';
|
||||||
|
model.value.newPassword = '';
|
||||||
|
model.value.confirmPassword = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeDialog() {
|
||||||
|
visible.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleSubmit() {
|
||||||
|
if (confirmDisabled.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await validate();
|
||||||
|
|
||||||
|
submitting.value = true;
|
||||||
|
|
||||||
|
const { error } = await fetchUpdateMyPassword({
|
||||||
|
oldPassword: model.value.oldPassword.trim(),
|
||||||
|
newPassword: model.value.newPassword.trim()
|
||||||
|
});
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('密码修改成功,请重新登录');
|
||||||
|
closeDialog();
|
||||||
|
emit('submitted');
|
||||||
|
await authStore.resetStore();
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(visible, async value => {
|
||||||
|
if (!value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
initModel();
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BusinessFormDialog
|
||||||
|
v-model="visible"
|
||||||
|
title="修改密码"
|
||||||
|
preset="sm"
|
||||||
|
:confirm-loading="submitting"
|
||||||
|
:confirm-disabled="confirmDisabled"
|
||||||
|
@confirm="handleSubmit"
|
||||||
|
>
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top" autocomplete="off">
|
||||||
|
<input class="business-form-autofill-guard" type="text" name="fake-username" autocomplete="username" />
|
||||||
|
<input class="business-form-autofill-guard" type="password" name="fake-password" autocomplete="new-password" />
|
||||||
|
|
||||||
|
<ElRow :gutter="16">
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="用户名">
|
||||||
|
<ElInput :model-value="displayUsername" disabled />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElAlert title="密码修改后会退出当前登录态,请使用新密码重新登录。" type="info" :closable="false" show-icon />
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="旧密码" prop="oldPassword">
|
||||||
|
<ElInput
|
||||||
|
v-model="model.oldPassword"
|
||||||
|
show-password
|
||||||
|
autocomplete="current-password"
|
||||||
|
placeholder="请输入旧密码"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="新密码" prop="newPassword">
|
||||||
|
<ElInput v-model="model.newPassword" show-password autocomplete="new-password" placeholder="请输入新密码" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="确认新密码" prop="confirmPassword">
|
||||||
|
<ElInput
|
||||||
|
v-model="model.confirmPassword"
|
||||||
|
show-password
|
||||||
|
autocomplete="new-password"
|
||||||
|
placeholder="请再次输入新密码"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</BusinessFormDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.business-form-autofill-guard {
|
||||||
|
position: absolute;
|
||||||
|
width: 1px;
|
||||||
|
height: 1px;
|
||||||
|
padding: 0;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
clip: rect(0, 0, 0, 0);
|
||||||
|
white-space: nowrap;
|
||||||
|
border: 0;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
3
src/views/personal-center/my-weekly/index.vue
Normal file
3
src/views/personal-center/my-weekly/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="我的周报" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
3
src/views/personal-center/pending-approval/index.vue
Normal file
3
src/views/personal-center/pending-approval/index.vue
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<LookForward title="待我审批" subtitle="功能建设中,敬请期待" />
|
||||||
|
</template>
|
||||||
@@ -1,52 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, onUnmounted, ref, watch } from 'vue';
|
|
||||||
import Vditor from 'vditor';
|
|
||||||
import 'vditor/dist/index.css';
|
|
||||||
import { useThemeStore } from '@/store/modules/theme';
|
|
||||||
|
|
||||||
defineOptions({ name: 'MarkdownPage' });
|
|
||||||
|
|
||||||
const theme = useThemeStore();
|
|
||||||
|
|
||||||
const vditor = ref<Vditor>();
|
|
||||||
const domRef = ref<HTMLElement>();
|
|
||||||
|
|
||||||
function renderVditor() {
|
|
||||||
if (!domRef.value) return;
|
|
||||||
vditor.value = new Vditor(domRef.value, {
|
|
||||||
minHeight: 400,
|
|
||||||
theme: theme.darkMode ? 'dark' : 'classic',
|
|
||||||
icon: 'material',
|
|
||||||
cache: { enable: false }
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const stopHandle = watch(
|
|
||||||
() => theme.darkMode,
|
|
||||||
newValue => {
|
|
||||||
const themeMode = newValue ? 'dark' : 'classic';
|
|
||||||
vditor.value?.setTheme(themeMode);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
renderVditor();
|
|
||||||
});
|
|
||||||
|
|
||||||
onUnmounted(() => {
|
|
||||||
stopHandle();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="h-full">
|
|
||||||
<ElCard header="markdown插件" class="card-wrapper">
|
|
||||||
<div ref="domRef"></div>
|
|
||||||
<template #footer>
|
|
||||||
<GithubLink link="https://github.com/Vanessa219/vditor" />
|
|
||||||
</template>
|
|
||||||
</ElCard>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
||||||
@@ -1,47 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, ref } from 'vue';
|
|
||||||
import WangEditor from 'wangeditor';
|
|
||||||
|
|
||||||
defineOptions({ name: 'QuillPage' });
|
|
||||||
|
|
||||||
const editor = ref<WangEditor>();
|
|
||||||
const domRef = ref<HTMLElement>();
|
|
||||||
|
|
||||||
function renderWangEditor() {
|
|
||||||
editor.value = new WangEditor(domRef.value);
|
|
||||||
setEditorConfig();
|
|
||||||
editor.value.create();
|
|
||||||
}
|
|
||||||
|
|
||||||
function setEditorConfig() {
|
|
||||||
if (editor.value?.config?.zIndex) {
|
|
||||||
editor.value.config.zIndex = 10;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
renderWangEditor();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="h-full">
|
|
||||||
<ElCard header="富文本插件" class="card-wrapper">
|
|
||||||
<div ref="domRef" class="bg-white dark:bg-dark"></div>
|
|
||||||
<template #footer>
|
|
||||||
<GithubLink link="https://github.com/wangeditor-team/wangEditor" />
|
|
||||||
</template>
|
|
||||||
</ElCard>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
:deep(.w-e-toolbar) {
|
|
||||||
background: inherit !important;
|
|
||||||
border-color: var(--el-border-color) !important;
|
|
||||||
}
|
|
||||||
:deep(.w-e-text-container) {
|
|
||||||
background: inherit;
|
|
||||||
border-color: var(--el-border-color) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
File diff suppressed because it is too large
Load Diff
767
src/views/product/dashboard/index.vue.bak
Normal file
767
src/views/product/dashboard/index.vue.bak
Normal file
@@ -0,0 +1,767 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, ref, watch } from 'vue';
|
||||||
|
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
||||||
|
import { fetchGetProduct, fetchGetProductMembers, fetchGetProductSettings } from '@/service/api';
|
||||||
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import { useCurrentProduct } from '../shared/use-current-product';
|
||||||
|
import ProductActivityTimelinePanel from './modules/product-activity-timeline-panel.vue';
|
||||||
|
import {
|
||||||
|
buildProductHomepageBanner,
|
||||||
|
buildRequirementPoolRecentChanges,
|
||||||
|
buildRequirementPoolSummary,
|
||||||
|
getProductHomepageExtensionModules
|
||||||
|
} from './homepage';
|
||||||
|
import { productHomepageExtensionMock, productRequirementPoolMock } from './mock';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProductDashboard' });
|
||||||
|
|
||||||
|
const { currentObjectId } = useCurrentProduct();
|
||||||
|
const { getLabel: getDirectionDictLabel } = useDict(RDMS_OBJECT_DIRECTION_DICT_CODE);
|
||||||
|
|
||||||
|
const pageLoading = ref(false);
|
||||||
|
const productDetail = ref<Api.Product.Product | null>(null);
|
||||||
|
const settings = ref<Api.Product.ProductSettings | null>(null);
|
||||||
|
const members = ref<Api.Product.ProductMember[]>([]);
|
||||||
|
const latestActivityTime = ref('');
|
||||||
|
|
||||||
|
const requirementPoolSummary = computed(() => buildRequirementPoolSummary(productRequirementPoolMock.summary));
|
||||||
|
const requirementPoolRecentChanges = computed(() =>
|
||||||
|
buildRequirementPoolRecentChanges(productRequirementPoolMock.recentChanges)
|
||||||
|
);
|
||||||
|
const homepageBanner = computed(() =>
|
||||||
|
buildProductHomepageBanner({
|
||||||
|
product: productDetail.value,
|
||||||
|
settings: settings.value,
|
||||||
|
members: members.value,
|
||||||
|
requirementSummary: requirementPoolSummary.value,
|
||||||
|
latestActivityTime: latestActivityTime.value
|
||||||
|
})
|
||||||
|
);
|
||||||
|
const extensionModules = computed(() => getProductHomepageExtensionModules(productHomepageExtensionMock));
|
||||||
|
const directionLabel = computed(() => getDirectionDictLabel(homepageBanner.value.identity.directionCode, '--'));
|
||||||
|
const bannerFacts = computed(() => {
|
||||||
|
const [managerFact, roleFact] = homepageBanner.value.identity.facts;
|
||||||
|
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
label: '产品方向',
|
||||||
|
value: directionLabel.value,
|
||||||
|
fullWidth: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: managerFact?.label || '产品经理',
|
||||||
|
value: managerFact?.value || '--',
|
||||||
|
fullWidth: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: roleFact?.label || '角色摘要',
|
||||||
|
value: roleFact?.value || '--',
|
||||||
|
fullWidth: true
|
||||||
|
}
|
||||||
|
];
|
||||||
|
});
|
||||||
|
const bannerStatusClass = computed(() => {
|
||||||
|
const statusCode = homepageBanner.value.identity.statusCode;
|
||||||
|
|
||||||
|
return statusCode ? `product-homepage-banner--${statusCode}` : 'product-homepage-banner--default';
|
||||||
|
});
|
||||||
|
const bannerStatusWordClass = computed(() => {
|
||||||
|
const statusCode = homepageBanner.value.identity.statusCode;
|
||||||
|
|
||||||
|
return statusCode
|
||||||
|
? `product-homepage-banner__status-word--${statusCode}`
|
||||||
|
: 'product-homepage-banner__status-word--default';
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleLatestActivityTimeChange(value: string) {
|
||||||
|
latestActivityTime.value = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function loadDashboardData(objectId: string) {
|
||||||
|
pageLoading.value = true;
|
||||||
|
|
||||||
|
try {
|
||||||
|
const [productResult, settingsResult, membersResult] = await Promise.all([
|
||||||
|
fetchGetProduct(objectId),
|
||||||
|
fetchGetProductSettings(objectId),
|
||||||
|
fetchGetProductMembers(objectId)
|
||||||
|
]);
|
||||||
|
|
||||||
|
productDetail.value = productResult.error ? null : productResult.data || null;
|
||||||
|
settings.value = settingsResult.error ? null : settingsResult.data || null;
|
||||||
|
members.value = membersResult.error ? [] : membersResult.data || [];
|
||||||
|
} finally {
|
||||||
|
pageLoading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => currentObjectId.value,
|
||||||
|
async objectId => {
|
||||||
|
if (!objectId) {
|
||||||
|
productDetail.value = null;
|
||||||
|
settings.value = null;
|
||||||
|
members.value = [];
|
||||||
|
latestActivityTime.value = '';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await loadDashboardData(objectId);
|
||||||
|
},
|
||||||
|
{ immediate: true }
|
||||||
|
);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div v-loading="pageLoading" class="product-homepage">
|
||||||
|
<section class="product-homepage-banner" :class="bannerStatusClass">
|
||||||
|
<div class="product-homepage-banner__identity">
|
||||||
|
<div class="product-homepage-banner__title-group">
|
||||||
|
<div class="product-homepage-banner__title-main min-w-0">
|
||||||
|
<div class="product-homepage-banner__title-row">
|
||||||
|
<h1 class="product-homepage-banner__title">{{ homepageBanner.identity.name }}</h1>
|
||||||
|
<span class="product-homepage-banner__status-word" :class="bannerStatusWordClass">
|
||||||
|
{{ homepageBanner.identity.statusLabel }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="product-homepage-banner__subtitle">
|
||||||
|
<span class="product-homepage-banner__code">编号 {{ homepageBanner.identity.code }}</span>
|
||||||
|
<p v-if="homepageBanner.identity.description" class="product-homepage-banner__description">
|
||||||
|
{{ homepageBanner.identity.description }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="product-homepage-banner__facts">
|
||||||
|
<div
|
||||||
|
v-for="item in bannerFacts"
|
||||||
|
:key="item.label"
|
||||||
|
class="product-homepage-banner__fact"
|
||||||
|
:class="{ 'product-homepage-banner__fact--full': item.fullWidth }"
|
||||||
|
>
|
||||||
|
<span class="product-homepage-banner__fact-label">{{ item.label }}</span>
|
||||||
|
<strong class="product-homepage-banner__fact-value">{{ item.value }}</strong>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="product-homepage-banner__metrics">
|
||||||
|
<article v-for="item in homepageBanner.metrics" :key="item.label" class="product-homepage-banner__metric">
|
||||||
|
<span class="product-homepage-banner__metric-label">{{ item.label }}</span>
|
||||||
|
<strong class="product-homepage-banner__metric-value">{{ item.value }}</strong>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="product-homepage-main">
|
||||||
|
<ProductActivityTimelinePanel
|
||||||
|
:product-id="currentObjectId || ''"
|
||||||
|
@latest-time-change="handleLatestActivityTimeChange"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="product-homepage-main__aside">
|
||||||
|
<ElCard class="product-homepage-panel card-wrapper">
|
||||||
|
<template #header>
|
||||||
|
<div>
|
||||||
|
<h3 class="product-homepage-panel__title">需求池管理概览</h3>
|
||||||
|
<p class="product-homepage-panel__desc">先看需求池现在的总体规模、状态结构和待处理压力。</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div class="product-homepage-requirement-summary">
|
||||||
|
<div class="product-homepage-requirement-summary__metrics">
|
||||||
|
<article
|
||||||
|
v-for="item in requirementPoolSummary.metrics"
|
||||||
|
:key="item.label"
|
||||||
|
class="product-homepage-requirement-summary__metric"
|
||||||
|
>
|
||||||
|
<span class="product-homepage-requirement-summary__metric-label">{{ item.label }}</span>
|
||||||
|
<strong class="product-homepage-requirement-summary__metric-value">{{ item.value }}</strong>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="product-homepage-requirement-summary__distribution">
|
||||||
|
<div
|
||||||
|
v-for="item in requirementPoolSummary.distribution"
|
||||||
|
:key="item.label"
|
||||||
|
class="product-homepage-requirement-summary__distribution-item"
|
||||||
|
>
|
||||||
|
<span>{{ item.label }}</span>
|
||||||
|
<strong>{{ item.value }}</strong>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ElCard>
|
||||||
|
|
||||||
|
<ElCard class="product-homepage-panel card-wrapper">
|
||||||
|
<template #header>
|
||||||
|
<div>
|
||||||
|
<h3 class="product-homepage-panel__title">需求池最近变化</h3>
|
||||||
|
<p class="product-homepage-panel__desc">承接需求新增、状态流转和关闭情况,和产品动态时间线分开表达。</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div v-if="requirementPoolRecentChanges.length" class="product-homepage-requirement-changes">
|
||||||
|
<article
|
||||||
|
v-for="item in requirementPoolRecentChanges"
|
||||||
|
:key="item.id"
|
||||||
|
class="product-homepage-requirement-changes__item"
|
||||||
|
>
|
||||||
|
<div class="product-homepage-requirement-changes__meta">
|
||||||
|
<ElTag type="info" effect="plain" size="small">{{ item.actionLabel }}</ElTag>
|
||||||
|
<span class="product-homepage-requirement-changes__time">{{ item.time }}</span>
|
||||||
|
</div>
|
||||||
|
<strong class="product-homepage-requirement-changes__title">{{ item.title }}</strong>
|
||||||
|
<p class="product-homepage-requirement-changes__status">当前状态:{{ item.statusLabel }}</p>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ElEmpty v-else description="当前暂无需求池最近变化" :image-size="72" />
|
||||||
|
</ElCard>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="product-homepage-extension">
|
||||||
|
<ElCard v-for="module in extensionModules" :key="module.key" class="product-homepage-panel card-wrapper">
|
||||||
|
<template #header>
|
||||||
|
<div>
|
||||||
|
<h3 class="product-homepage-panel__title">{{ module.title }}</h3>
|
||||||
|
<p class="product-homepage-panel__desc">{{ module.description }}</p>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div class="product-homepage-extension__list">
|
||||||
|
<div v-for="item in module.items" :key="item" class="product-homepage-extension__item">
|
||||||
|
<span class="product-homepage-extension__dot" />
|
||||||
|
<span>{{ item }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ElCard>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.product-homepage {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr);
|
||||||
|
gap: 16px;
|
||||||
|
padding: 24px;
|
||||||
|
border: 1px solid rgb(226 232 240 / 92%);
|
||||||
|
border-radius: 24px;
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(14 116 144 / 14%), transparent 34%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(15 118 110 / 10%), transparent 28%),
|
||||||
|
linear-gradient(135deg, rgb(255 255 255 / 99%), rgb(248 250 252 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner--default {
|
||||||
|
border-color: rgb(226 232 240 / 92%);
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(14 116 144 / 14%), transparent 34%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(15 118 110 / 10%), transparent 28%),
|
||||||
|
linear-gradient(135deg, rgb(255 255 255 / 99%), rgb(248 250 252 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner--active {
|
||||||
|
border-color: rgb(167 243 208 / 88%);
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(5 150 105 / 16%), transparent 32%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(16 185 129 / 14%), transparent 26%),
|
||||||
|
linear-gradient(135deg, rgb(236 253 245 / 99%), rgb(255 255 255 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner--paused {
|
||||||
|
border-color: rgb(253 230 138 / 90%);
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(245 158 11 / 18%), transparent 32%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(251 191 36 / 16%), transparent 24%),
|
||||||
|
linear-gradient(135deg, rgb(255 251 235 / 99%), rgb(255 255 255 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner--archived {
|
||||||
|
border-color: rgb(203 213 225 / 92%);
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(100 116 139 / 14%), transparent 34%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(148 163 184 / 10%), transparent 26%),
|
||||||
|
linear-gradient(135deg, rgb(248 250 252 / 99%), rgb(255 255 255 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner--abandoned {
|
||||||
|
border-color: rgb(254 205 211 / 92%);
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at top left, rgb(244 63 94 / 16%), transparent 32%),
|
||||||
|
radial-gradient(circle at bottom right, rgb(251 113 133 / 14%), transparent 24%),
|
||||||
|
linear-gradient(135deg, rgb(255 241 242 / 99%), rgb(255 255 255 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__identity {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__title-group {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__title-main {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
flex: 1;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__title-row {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
align-items: baseline;
|
||||||
|
gap: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__code {
|
||||||
|
margin: 0;
|
||||||
|
color: rgb(14 116 144 / 92%);
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__title {
|
||||||
|
margin: 0;
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 34px;
|
||||||
|
line-height: 1.15;
|
||||||
|
letter-spacing: -0.03em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__subtitle {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: baseline;
|
||||||
|
gap: 10px 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__description {
|
||||||
|
margin: 0;
|
||||||
|
min-width: 0;
|
||||||
|
color: rgb(71 85 105 / 94%);
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word {
|
||||||
|
flex-shrink: 0;
|
||||||
|
font-size: 26px;
|
||||||
|
font-weight: 800;
|
||||||
|
line-height: 1;
|
||||||
|
letter-spacing: 0.18em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word--default {
|
||||||
|
color: rgb(148 163 184 / 48%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word--active {
|
||||||
|
color: transparent;
|
||||||
|
background: linear-gradient(180deg, rgb(5 150 105 / 94%), rgb(16 185 129 / 70%));
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0 10px 24px rgb(5 150 105 / 16%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word--paused {
|
||||||
|
color: transparent;
|
||||||
|
background: linear-gradient(180deg, rgb(217 119 6 / 94%), rgb(245 158 11 / 70%));
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0 10px 24px rgb(245 158 11 / 16%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word--archived {
|
||||||
|
color: transparent;
|
||||||
|
background: linear-gradient(180deg, rgb(71 85 105 / 92%), rgb(148 163 184 / 64%));
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0 10px 24px rgb(100 116 139 / 14%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word--abandoned {
|
||||||
|
color: transparent;
|
||||||
|
background: linear-gradient(180deg, rgb(225 29 72 / 94%), rgb(251 113 133 / 68%));
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
text-shadow: 0 10px 24px rgb(225 29 72 / 16%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__facts {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__fact {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 10px;
|
||||||
|
min-height: 58px;
|
||||||
|
padding: 14px 16px;
|
||||||
|
border: 1px solid rgb(226 232 240 / 88%);
|
||||||
|
border-radius: 18px;
|
||||||
|
background-color: rgb(255 255 255 / 78%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__fact--full {
|
||||||
|
grid-column: 1 / -1;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__fact-label {
|
||||||
|
color: rgb(100 116 139 / 94%);
|
||||||
|
font-size: 13px;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__fact-value {
|
||||||
|
color: rgb(15 23 42 / 96%);
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 1.6;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__fact--full .product-homepage-banner__fact-value {
|
||||||
|
max-width: 72%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__metrics {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__metric {
|
||||||
|
display: flex;
|
||||||
|
min-height: 112px;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 16px;
|
||||||
|
padding: 18px;
|
||||||
|
border: 1px solid rgb(226 232 240 / 88%);
|
||||||
|
border-radius: 20px;
|
||||||
|
background: linear-gradient(180deg, rgb(255 255 255 / 99%), rgb(241 245 249 / 98%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__metric-label {
|
||||||
|
color: rgb(100 116 139 / 92%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__metric-value {
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 28px;
|
||||||
|
line-height: 1.1;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
|
word-break: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-main {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-main__aside {
|
||||||
|
display: flex;
|
||||||
|
min-width: 0;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-panel {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-panel__title {
|
||||||
|
margin: 0;
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-panel__desc {
|
||||||
|
margin: 4px 0 0;
|
||||||
|
color: rgb(100 116 139 / 92%);
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 1.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__item {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 20px minmax(0, 1fr);
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__rail {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__dot {
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
border-radius: 999px;
|
||||||
|
margin-top: 6px;
|
||||||
|
box-shadow: 0 0 0 4px rgb(255 255 255 / 96%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__dot--sky {
|
||||||
|
background-color: rgb(14 165 233 / 88%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__dot--emerald {
|
||||||
|
background-color: rgb(5 150 105 / 88%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__dot--amber {
|
||||||
|
background-color: rgb(217 119 6 / 88%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__dot--rose {
|
||||||
|
background-color: rgb(225 29 72 / 88%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__dot--slate {
|
||||||
|
background-color: rgb(100 116 139 / 88%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__line {
|
||||||
|
flex: 1;
|
||||||
|
width: 2px;
|
||||||
|
min-height: 30px;
|
||||||
|
margin-top: 4px;
|
||||||
|
background: linear-gradient(180deg, rgb(203 213 225 / 96%), rgb(226 232 240 / 28%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__item:last-child .product-homepage-timeline__line {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__content {
|
||||||
|
padding: 12px 14px;
|
||||||
|
border: 1px solid rgb(226 232 240 / 92%);
|
||||||
|
border-radius: 16px;
|
||||||
|
background-color: rgb(255 255 255 / 98%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__meta {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__time {
|
||||||
|
color: rgb(100 116 139 / 90%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__sentence {
|
||||||
|
margin: 6px 0 0;
|
||||||
|
color: rgb(71 85 105 / 94%);
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 1.65;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-timeline__headline {
|
||||||
|
margin-right: 6px;
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__metrics {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__metric {
|
||||||
|
display: flex;
|
||||||
|
min-height: 100px;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 14px;
|
||||||
|
padding: 14px 16px;
|
||||||
|
border-radius: 18px;
|
||||||
|
background: linear-gradient(180deg, rgb(248 250 252 / 98%), rgb(241 245 249 / 94%));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__metric-label {
|
||||||
|
color: rgb(100 116 139 / 92%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__metric-value {
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 1.1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__distribution {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__distribution-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 12px;
|
||||||
|
padding: 13px 14px;
|
||||||
|
border: 1px solid rgb(226 232 240 / 88%);
|
||||||
|
border-radius: 14px;
|
||||||
|
background-color: rgb(255 255 255 / 96%);
|
||||||
|
color: rgb(51 65 85 / 95%);
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-summary__distribution-item strong {
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-changes {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-changes__item {
|
||||||
|
padding: 14px 16px;
|
||||||
|
border: 1px solid rgb(226 232 240 / 90%);
|
||||||
|
border-radius: 18px;
|
||||||
|
background-color: rgb(255 255 255 / 98%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-changes__meta {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-changes__time {
|
||||||
|
color: rgb(100 116 139 / 90%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-changes__title {
|
||||||
|
display: block;
|
||||||
|
margin-top: 10px;
|
||||||
|
color: rgb(15 23 42 / 98%);
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 1.65;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-requirement-changes__status {
|
||||||
|
margin: 8px 0 0;
|
||||||
|
color: rgb(71 85 105 / 94%);
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 1.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-extension {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-extension__list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-extension__item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
padding: 13px 14px;
|
||||||
|
border-radius: 16px;
|
||||||
|
background-color: rgb(248 250 252 / 96%);
|
||||||
|
color: rgb(51 65 85 / 95%);
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-extension__dot {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 999px;
|
||||||
|
background-color: rgb(14 116 144 / 88%);
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (width <= 1280px) {
|
||||||
|
.product-homepage-banner,
|
||||||
|
.product-homepage-main,
|
||||||
|
.product-homepage-extension {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (width <= 768px) {
|
||||||
|
.product-homepage-banner {
|
||||||
|
padding: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__title-row {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__title {
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__status-word {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-homepage-banner__facts,
|
||||||
|
.product-homepage-banner__metrics,
|
||||||
|
.product-homepage-requirement-summary__metrics {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -247,7 +247,12 @@ watch([() => visible.value, () => props.productId], ([currentVisible, productId]
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="product-activity-dialog__sentence">
|
<p class="product-activity-dialog__sentence">
|
||||||
<span class="product-activity-dialog__sentence-main">{{ item.compactText }}</span>
|
<span class="product-activity-dialog__sentence-main">
|
||||||
|
<template v-for="(part, index) in item.compactTextParts" :key="`${item.id}-${index}`">
|
||||||
|
<strong v-if="part.strong" class="product-activity-dialog__subject">{{ part.text }}</strong>
|
||||||
|
<span v-else>{{ part.text }}</span>
|
||||||
|
</template>
|
||||||
|
</span>
|
||||||
<span v-if="item.statusTransition">,状态:{{ item.statusTransition }}</span>
|
<span v-if="item.statusTransition">,状态:{{ item.statusTransition }}</span>
|
||||||
<span v-if="item.reasonText">,原因:{{ item.reasonText }}</span>
|
<span v-if="item.reasonText">,原因:{{ item.reasonText }}</span>
|
||||||
</p>
|
</p>
|
||||||
@@ -497,6 +502,11 @@ watch([() => visible.value, () => props.productId], ([currentVisible, productId]
|
|||||||
color: var(--el-text-color-primary);
|
color: var(--el-text-color-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.product-activity-dialog__subject {
|
||||||
|
color: var(--el-text-color-primary);
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
.product-activity-dialog__footer-inner {
|
.product-activity-dialog__footer-inner {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, watch } from 'vue';
|
import { computed, ref, watch } from 'vue';
|
||||||
import { fetchGetProductActivityTimelinePage } from '@/service/api';
|
import { fetchGetProductActivityTimelinePage } from '@/service/api';
|
||||||
import {
|
import {
|
||||||
DEFAULT_PRODUCT_ACTIVITY_PAGE_SIZE,
|
DEFAULT_PRODUCT_ACTIVITY_PAGE_SIZE,
|
||||||
@@ -13,6 +13,7 @@ defineOptions({ name: 'ProductActivityTimelinePanel' });
|
|||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
productId: string;
|
productId: string;
|
||||||
|
maxItems?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Emits {
|
interface Emits {
|
||||||
@@ -27,6 +28,11 @@ const loading = ref(false);
|
|||||||
const loadError = ref(false);
|
const loadError = ref(false);
|
||||||
const items = ref<ReturnType<typeof buildProductActivityDisplayItems>>([]);
|
const items = ref<ReturnType<typeof buildProductActivityDisplayItems>>([]);
|
||||||
|
|
||||||
|
const displayItems = computed(() => {
|
||||||
|
if (!props.maxItems || props.maxItems <= 0) return items.value;
|
||||||
|
return items.value.slice(0, props.maxItems);
|
||||||
|
});
|
||||||
|
|
||||||
async function loadRecentActivities() {
|
async function loadRecentActivities() {
|
||||||
if (!props.productId) {
|
if (!props.productId) {
|
||||||
items.value = [];
|
items.value = [];
|
||||||
@@ -79,11 +85,17 @@ watch(
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ElCard class="product-activity-panel card-wrapper">
|
<ElCard class="product-activity-panel card-wrapper" shadow="never">
|
||||||
<template #header>
|
<template #header>
|
||||||
<div class="product-activity-panel__header">
|
<div class="product-activity-panel__header">
|
||||||
<div>
|
<div class="product-activity-panel__header-main">
|
||||||
<h3 class="product-activity-panel__title">产品动态时间线</h3>
|
<span class="product-activity-panel__header-icon">
|
||||||
|
<SvgIcon icon="mdi:timeline-clock-outline" />
|
||||||
|
</span>
|
||||||
|
<div class="product-activity-panel__header-text">
|
||||||
|
<h3 class="product-activity-panel__title">产品动态时间线</h3>
|
||||||
|
<p class="product-activity-panel__desc">对象、状态与团队的最近活动</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ElButton text type="primary" :disabled="!productId" @click="openDialog">更多</ElButton>
|
<ElButton text type="primary" :disabled="!productId" @click="openDialog">更多</ElButton>
|
||||||
@@ -96,8 +108,8 @@ watch(
|
|||||||
<ElButton type="primary" plain @click="loadRecentActivities">重新加载</ElButton>
|
<ElButton type="primary" plain @click="loadRecentActivities">重新加载</ElButton>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="items.length" class="product-activity-panel__timeline">
|
<div v-else-if="displayItems.length" class="product-activity-panel__timeline">
|
||||||
<article v-for="item in items" :key="item.id" class="product-activity-panel__item">
|
<article v-for="item in displayItems" :key="item.id" class="product-activity-panel__item">
|
||||||
<div class="product-activity-panel__rail">
|
<div class="product-activity-panel__rail">
|
||||||
<span class="product-activity-panel__dot" :class="`product-activity-panel__dot--${item.tone}`" />
|
<span class="product-activity-panel__dot" :class="`product-activity-panel__dot--${item.tone}`" />
|
||||||
<span class="product-activity-panel__line" />
|
<span class="product-activity-panel__line" />
|
||||||
@@ -112,7 +124,12 @@ watch(
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="product-activity-panel__sentence">
|
<p class="product-activity-panel__sentence">
|
||||||
<span class="product-activity-panel__sentence-main">{{ item.compactText }}</span>
|
<span class="product-activity-panel__sentence-main">
|
||||||
|
<template v-for="(part, index) in item.compactTextParts" :key="`${item.id}-${index}`">
|
||||||
|
<strong v-if="part.strong" class="product-activity-panel__subject">{{ part.text }}</strong>
|
||||||
|
<span v-else>{{ part.text }}</span>
|
||||||
|
</template>
|
||||||
|
</span>
|
||||||
<span v-if="item.statusTransition">,状态:{{ item.statusTransition }}</span>
|
<span v-if="item.statusTransition">,状态:{{ item.statusTransition }}</span>
|
||||||
<span v-if="item.reasonText">,原因:{{ item.reasonText }}</span>
|
<span v-if="item.reasonText">,原因:{{ item.reasonText }}</span>
|
||||||
</p>
|
</p>
|
||||||
@@ -134,11 +151,36 @@ watch(
|
|||||||
|
|
||||||
.product-activity-panel__header {
|
.product-activity-panel__header {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-start;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.product-activity-panel__header-main {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-activity-panel__header-icon {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 19px;
|
||||||
|
color: #fff;
|
||||||
|
flex-shrink: 0;
|
||||||
|
background: linear-gradient(135deg, #38bdf8, #0284c7);
|
||||||
|
box-shadow: 0 6px 14px -8px rgb(2 132 199 / 55%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-activity-panel__header-text {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.product-activity-panel__title {
|
.product-activity-panel__title {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
color: rgb(15 23 42 / 98%);
|
color: rgb(15 23 42 / 98%);
|
||||||
@@ -147,19 +189,19 @@ watch(
|
|||||||
}
|
}
|
||||||
|
|
||||||
.product-activity-panel__desc {
|
.product-activity-panel__desc {
|
||||||
margin: 4px 0 0;
|
margin: 3px 0 0;
|
||||||
color: rgb(100 116 139 / 92%);
|
color: rgb(100 116 139 / 92%);
|
||||||
font-size: 13px;
|
font-size: 12px;
|
||||||
line-height: 1.7;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.product-activity-panel__body {
|
.product-activity-panel__body {
|
||||||
min-height: 520px;
|
min-height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.product-activity-panel__state {
|
.product-activity-panel__state {
|
||||||
display: flex;
|
display: flex;
|
||||||
min-height: 420px;
|
min-height: 200px;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@@ -262,11 +304,12 @@ watch(
|
|||||||
color: rgb(15 23 42 / 98%);
|
color: rgb(15 23 42 / 98%);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (width <= 768px) {
|
.product-activity-panel__subject {
|
||||||
.product-activity-panel__body {
|
color: rgb(15 23 42 / 98%);
|
||||||
min-height: auto;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (width <= 768px) {
|
||||||
.product-activity-panel__header {
|
.product-activity-panel__header {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
|
|||||||
@@ -17,13 +17,20 @@ export type ProductActivityFilterType = 'all' | Api.Product.ProductActivityType;
|
|||||||
|
|
||||||
export type ProductActivityTone = 'sky' | 'emerald' | 'amber' | 'rose' | 'slate';
|
export type ProductActivityTone = 'sky' | 'emerald' | 'amber' | 'rose' | 'slate';
|
||||||
|
|
||||||
|
export interface ProductActivityTextPart {
|
||||||
|
text: string;
|
||||||
|
strong?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
export interface ProductActivityDisplayItem extends Api.Product.ProductActivityTimelineItem {
|
export interface ProductActivityDisplayItem extends Api.Product.ProductActivityTimelineItem {
|
||||||
tagLabel: string;
|
tagLabel: string;
|
||||||
timeText: string;
|
timeText: string;
|
||||||
actionText: string;
|
actionText: string;
|
||||||
displaySummary: string;
|
displaySummary: string;
|
||||||
compactText: string;
|
compactText: string;
|
||||||
|
compactTextParts: ProductActivityTextPart[];
|
||||||
operatorText: string;
|
operatorText: string;
|
||||||
|
subjectText: string;
|
||||||
reasonText: string;
|
reasonText: string;
|
||||||
statusTransition: string;
|
statusTransition: string;
|
||||||
tone: ProductActivityTone;
|
tone: ProductActivityTone;
|
||||||
@@ -250,6 +257,10 @@ function isGenericActivitySummary(summaryText: string, actionText: string) {
|
|||||||
return summaryText === actionText || summaryText === actionText.replace('执行了', '执行了');
|
return summaryText === actionText || summaryText === actionText.replace('执行了', '执行了');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function isMemberActivityAction(actionType: Api.Product.ProductActivityActionType) {
|
||||||
|
return actionType === 'add_member' || actionType === 'remove_member' || actionType === 'update_member';
|
||||||
|
}
|
||||||
|
|
||||||
function buildMemberChangeSummary(
|
function buildMemberChangeSummary(
|
||||||
item: Api.Product.ProductActivityTimelineItem,
|
item: Api.Product.ProductActivityTimelineItem,
|
||||||
detailsRecord: ActivityDetailRecord | null,
|
detailsRecord: ActivityDetailRecord | null,
|
||||||
@@ -263,9 +274,10 @@ function buildMemberChangeSummary(
|
|||||||
}
|
}
|
||||||
|
|
||||||
const memberDetail = roleName ? `${memberName}(${roleName})` : memberName;
|
const memberDetail = roleName ? `${memberName}(${roleName})` : memberName;
|
||||||
const actionLabel = item.actionType === 'add_member' ? '将成员加入产品' : '将成员移出产品';
|
|
||||||
|
|
||||||
return operatorText === '--' ? `${actionLabel}:${memberDetail}` : `${operatorText}${actionLabel}:${memberDetail}`;
|
return operatorText === '--'
|
||||||
|
? `执行了【${item.actionName}】:${memberDetail}`
|
||||||
|
: `${operatorText}执行了【${item.actionName}】:${memberDetail}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
function buildMemberUpdateSummary(
|
function buildMemberUpdateSummary(
|
||||||
@@ -279,8 +291,8 @@ function buildMemberUpdateSummary(
|
|||||||
const roleText = roleTransitionText ? `,角色:${roleTransitionText}` : '';
|
const roleText = roleTransitionText ? `,角色:${roleTransitionText}` : '';
|
||||||
|
|
||||||
return operatorText === '--'
|
return operatorText === '--'
|
||||||
? `调整成员:${memberText}${roleText}`
|
? `执行了【${item.actionName}】:${memberText}${roleText}`
|
||||||
: `${operatorText}调整成员:${memberText}${roleText}`;
|
: `${operatorText}执行了【${item.actionName}】:${memberText}${roleText}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
function buildManagerChangeSummary(detailsRecord: ActivityDetailRecord | null, operatorText: string) {
|
function buildManagerChangeSummary(detailsRecord: ActivityDetailRecord | null, operatorText: string) {
|
||||||
@@ -309,15 +321,11 @@ function buildManagerChangeSummary(detailsRecord: ActivityDetailRecord | null, o
|
|||||||
|
|
||||||
function resolveDetailedSummary(
|
function resolveDetailedSummary(
|
||||||
item: Api.Product.ProductActivityTimelineItem,
|
item: Api.Product.ProductActivityTimelineItem,
|
||||||
operatorText: string,
|
detailsRecord: ActivityDetailRecord | null,
|
||||||
actionText: string
|
texts: { operatorText: string; actionText: string }
|
||||||
) {
|
) {
|
||||||
|
const { operatorText, actionText } = texts;
|
||||||
const summaryText = item.summary?.trim() || '';
|
const summaryText = item.summary?.trim() || '';
|
||||||
const detailsRecord = parseActivityDetails(item.details);
|
|
||||||
|
|
||||||
if (!isGenericActivitySummary(summaryText, actionText)) {
|
|
||||||
return summaryText;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (item.actionType === 'add_member' || item.actionType === 'remove_member') {
|
if (item.actionType === 'add_member' || item.actionType === 'remove_member') {
|
||||||
return buildMemberChangeSummary(item, detailsRecord, operatorText) || summaryText || actionText;
|
return buildMemberChangeSummary(item, detailsRecord, operatorText) || summaryText || actionText;
|
||||||
@@ -327,6 +335,10 @@ function resolveDetailedSummary(
|
|||||||
return buildMemberUpdateSummary(item, detailsRecord, operatorText);
|
return buildMemberUpdateSummary(item, detailsRecord, operatorText);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!isGenericActivitySummary(summaryText, actionText)) {
|
||||||
|
return summaryText;
|
||||||
|
}
|
||||||
|
|
||||||
if (item.actionType === 'change_manager') {
|
if (item.actionType === 'change_manager') {
|
||||||
return buildManagerChangeSummary(detailsRecord, operatorText) || summaryText || actionText;
|
return buildManagerChangeSummary(detailsRecord, operatorText) || summaryText || actionText;
|
||||||
}
|
}
|
||||||
@@ -334,13 +346,31 @@ function resolveDetailedSummary(
|
|||||||
return summaryText || actionText;
|
return summaryText || actionText;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function buildProductActivityTextParts(text: string, subjectText: string): ProductActivityTextPart[] {
|
||||||
|
const normalizedSubject = subjectText.trim();
|
||||||
|
const subjectIndex = normalizedSubject ? text.indexOf(normalizedSubject) : -1;
|
||||||
|
|
||||||
|
if (subjectIndex < 0) {
|
||||||
|
return [{ text }];
|
||||||
|
}
|
||||||
|
|
||||||
|
return [
|
||||||
|
{ text: text.slice(0, subjectIndex) },
|
||||||
|
{ text: normalizedSubject, strong: true },
|
||||||
|
{ text: text.slice(subjectIndex + normalizedSubject.length) }
|
||||||
|
].filter(part => part.text);
|
||||||
|
}
|
||||||
|
|
||||||
export function buildProductActivityDisplayItem(
|
export function buildProductActivityDisplayItem(
|
||||||
item: Api.Product.ProductActivityTimelineItem
|
item: Api.Product.ProductActivityTimelineItem
|
||||||
): ProductActivityDisplayItem {
|
): ProductActivityDisplayItem {
|
||||||
const operatorText = item.operatorName?.trim() || '--';
|
const operatorText = item.operatorName?.trim() || '--';
|
||||||
const actionText =
|
const actionText =
|
||||||
operatorText === '--' ? `执行了【${item.actionName}】` : `${operatorText}执行了【${item.actionName}】`;
|
operatorText === '--' ? `执行了【${item.actionName}】` : `${operatorText}执行了【${item.actionName}】`;
|
||||||
const displaySummary = item.type === 'status' ? actionText : resolveDetailedSummary(item, operatorText, actionText);
|
const detailsRecord = parseActivityDetails(item.details);
|
||||||
|
const subjectText = isMemberActivityAction(item.actionType) ? getActivityTargetUserName(item, detailsRecord) : '';
|
||||||
|
const displaySummary =
|
||||||
|
item.type === 'status' ? actionText : resolveDetailedSummary(item, detailsRecord, { operatorText, actionText });
|
||||||
const compactText = displaySummary;
|
const compactText = displaySummary;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@@ -350,7 +380,9 @@ export function buildProductActivityDisplayItem(
|
|||||||
actionText,
|
actionText,
|
||||||
displaySummary,
|
displaySummary,
|
||||||
compactText,
|
compactText,
|
||||||
|
compactTextParts: buildProductActivityTextParts(compactText, subjectText),
|
||||||
operatorText,
|
operatorText,
|
||||||
|
subjectText,
|
||||||
reasonText: item.reason?.trim() || '',
|
reasonText: item.reason?.trim() || '',
|
||||||
statusTransition:
|
statusTransition:
|
||||||
item.type === 'status' && item.fromStatus && item.toStatus
|
item.type === 'status' && item.fromStatus && item.toStatus
|
||||||
|
|||||||
@@ -3,15 +3,14 @@ import { computed, onMounted, reactive, ref } from 'vue';
|
|||||||
import type { Component } from 'vue';
|
import type { Component } from 'vue';
|
||||||
import { ElButton, ElTag } from 'element-plus';
|
import { ElButton, ElTag } from 'element-plus';
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import { CircleCheckFilled, DeleteFilled, FolderOpened, VideoPause } from '@element-plus/icons-vue';
|
import { Box, DeleteFilled, VideoPause, VideoPlay } from '@element-plus/icons-vue';
|
||||||
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
||||||
import { OBJECT_CONTEXT_QUERY_KEY } from '@/constants/object-context';
|
import { OBJECT_CONTEXT_QUERY_KEY } from '@/constants/object-context';
|
||||||
import { fetchGetProductPage, fetchGetUserSimpleList } from '@/service/api';
|
import { fetchGetProductOverviewSummary, fetchGetProductPage, fetchGetUserSimpleList } from '@/service/api';
|
||||||
import { useDict } from '@/hooks/business/dict';
|
import { useDict } from '@/hooks/business/dict';
|
||||||
import { useRouterPush } from '@/hooks/common/router';
|
import { useRouterPush } from '@/hooks/common/router';
|
||||||
import { useUIPaginatedTable } from '@/hooks/common/table';
|
import { useUIPaginatedTable } from '@/hooks/common/table';
|
||||||
import BusinessTableActionCell from '@/components/custom/business-table-action-cell';
|
import { getProductStatusLabel, getProductStatusTagType } from '../shared/product-master-data';
|
||||||
import { getProductStatusLabel, getProductStatusTagType, isProductEditable } from '../shared/product-master-data';
|
|
||||||
import ProductOperateDialog from './modules/product-operate-dialog.vue';
|
import ProductOperateDialog from './modules/product-operate-dialog.vue';
|
||||||
import ProductSearch from './modules/product-search.vue';
|
import ProductSearch from './modules/product-search.vue';
|
||||||
|
|
||||||
@@ -27,7 +26,6 @@ interface StatusNavMeta {
|
|||||||
|
|
||||||
type ProductPageResponse = Awaited<ReturnType<typeof fetchGetProductPage>>;
|
type ProductPageResponse = Awaited<ReturnType<typeof fetchGetProductPage>>;
|
||||||
|
|
||||||
const PRODUCT_OPTION_PAGE_SIZE = 200;
|
|
||||||
const PRODUCT_ENTRY_ROUTE_PATH = '/product/list';
|
const PRODUCT_ENTRY_ROUTE_PATH = '/product/list';
|
||||||
|
|
||||||
function getInitSearchParams(): Api.Product.ProductSearchParams {
|
function getInitSearchParams(): Api.Product.ProductSearchParams {
|
||||||
@@ -72,73 +70,20 @@ function formatDateTime(value?: string | null) {
|
|||||||
return dayjs(value).format('YYYY-MM-DD HH:mm:ss');
|
return dayjs(value).format('YYYY-MM-DD HH:mm:ss');
|
||||||
}
|
}
|
||||||
|
|
||||||
async function fetchProductTotal(params: Api.Product.ProductSearchParams) {
|
|
||||||
const { error, data } = await fetchGetProductPage({
|
|
||||||
...params,
|
|
||||||
pageNo: 1,
|
|
||||||
pageSize: 1
|
|
||||||
});
|
|
||||||
|
|
||||||
if (error || !data) {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
return data.total;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function fetchAllProducts() {
|
|
||||||
async function collect(pageNo: number, list: Api.Product.Product[]): Promise<Api.Product.Product[] | null> {
|
|
||||||
const { error, data } = await fetchGetProductPage({
|
|
||||||
pageNo,
|
|
||||||
pageSize: PRODUCT_OPTION_PAGE_SIZE
|
|
||||||
});
|
|
||||||
|
|
||||||
if (error || !data) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const nextList = list.concat(data.list);
|
|
||||||
|
|
||||||
if (nextList.length >= data.total || data.list.length === 0) {
|
|
||||||
return nextList;
|
|
||||||
}
|
|
||||||
|
|
||||||
return collect(pageNo + 1, nextList);
|
|
||||||
}
|
|
||||||
|
|
||||||
return collect(1, []);
|
|
||||||
}
|
|
||||||
|
|
||||||
function createManagerOptions(products: Api.Product.Product[], users: Api.SystemManage.UserSimple[]) {
|
|
||||||
const managerIdSet = new Set(products.map(item => String(item.managerUserId)).filter(Boolean));
|
|
||||||
const userMap = new Map(users.map(item => [String(item.id), item]));
|
|
||||||
|
|
||||||
const options = Array.from(managerIdSet).map(managerUserId => {
|
|
||||||
return (
|
|
||||||
userMap.get(managerUserId) || {
|
|
||||||
id: managerUserId,
|
|
||||||
nickname: String(managerUserId)
|
|
||||||
}
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
return sortManagerOptions(options);
|
|
||||||
}
|
|
||||||
|
|
||||||
const statusNavMetas: StatusNavMeta[] = [
|
const statusNavMetas: StatusNavMeta[] = [
|
||||||
{
|
{
|
||||||
key: 'active',
|
key: 'active',
|
||||||
label: '启用产品',
|
label: '启用产品',
|
||||||
description: '当前正常服务中的产品',
|
description: '当前正常服务中的产品',
|
||||||
tone: 'teal',
|
tone: 'teal',
|
||||||
icon: CircleCheckFilled
|
icon: VideoPlay
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'archived',
|
key: 'archived',
|
||||||
label: '归档产品',
|
label: '归档产品',
|
||||||
description: '已完成阶段目标的产品',
|
description: '已完成阶段目标的产品',
|
||||||
tone: 'slate',
|
tone: 'slate',
|
||||||
icon: FolderOpened
|
icon: Box
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'paused',
|
key: 'paused',
|
||||||
@@ -164,17 +109,15 @@ const operateVisible = ref(false);
|
|||||||
const editingRow = ref<Api.Product.Product | null>(null);
|
const editingRow = ref<Api.Product.Product | null>(null);
|
||||||
const { routerPush } = useRouterPush();
|
const { routerPush } = useRouterPush();
|
||||||
|
|
||||||
const { dictData: directionOptions, getLabel: getDirectionDictLabel } = useDict(RDMS_OBJECT_DIRECTION_DICT_CODE);
|
const { getLabel: getDirectionDictLabel } = useDict(RDMS_OBJECT_DIRECTION_DICT_CODE);
|
||||||
|
|
||||||
const statusCounts = ref<Record<Api.Product.ProductStatusCode, number>>({
|
const statusCounts = ref<Record<string, number>>({
|
||||||
active: 0,
|
active: 0,
|
||||||
archived: 0,
|
archived: 0,
|
||||||
paused: 0,
|
paused: 0,
|
||||||
abandoned: 0
|
abandoned: 0
|
||||||
});
|
});
|
||||||
|
|
||||||
const recentUpdatedCount = ref(0);
|
|
||||||
|
|
||||||
const managerLabelMap = computed(() => {
|
const managerLabelMap = computed(() => {
|
||||||
return new Map(managerUserOptions.value.map(item => [String(item.id), item.nickname]));
|
return new Map(managerUserOptions.value.map(item => [String(item.id), item.nickname]));
|
||||||
});
|
});
|
||||||
@@ -182,33 +125,10 @@ const managerLabelMap = computed(() => {
|
|||||||
const statusItems = computed(() =>
|
const statusItems = computed(() =>
|
||||||
statusNavMetas.map(item => ({
|
statusNavMetas.map(item => ({
|
||||||
...item,
|
...item,
|
||||||
count: statusCounts.value[item.key]
|
count: statusCounts.value[item.key] ?? 0
|
||||||
}))
|
}))
|
||||||
);
|
);
|
||||||
|
|
||||||
const overviewMetrics = computed(() => [
|
|
||||||
{
|
|
||||||
label: '可见产品',
|
|
||||||
value: Object.values(statusCounts.value).reduce((sum, count) => sum + count, 0),
|
|
||||||
hint: '当前接口可查询到的产品总量'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '当前启用',
|
|
||||||
value: statusCounts.value.active,
|
|
||||||
hint: '正在持续服务和维护的产品'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '产品方向',
|
|
||||||
value: directionOptions.value.length,
|
|
||||||
hint: '已加载的方向字典项数量'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '30天内更新',
|
|
||||||
value: recentUpdatedCount.value,
|
|
||||||
hint: '最近 30 天内发生过更新的产品'
|
|
||||||
}
|
|
||||||
]);
|
|
||||||
|
|
||||||
function getDirectionLabel(directionCode?: string | null) {
|
function getDirectionLabel(directionCode?: string | null) {
|
||||||
return getDirectionDictLabel(directionCode, '--');
|
return getDirectionDictLabel(directionCode, '--');
|
||||||
}
|
}
|
||||||
@@ -291,65 +211,34 @@ const { columns, columnChecks, data, loading, getDataByPage, mobilePagination }
|
|||||||
width: 170,
|
width: 170,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
formatter: row => formatDateTime(row.updateTime)
|
formatter: row => formatDateTime(row.updateTime)
|
||||||
},
|
|
||||||
{
|
|
||||||
prop: 'operate',
|
|
||||||
label: '操作',
|
|
||||||
width: 108,
|
|
||||||
align: 'center',
|
|
||||||
fixed: 'right',
|
|
||||||
formatter: row => (
|
|
||||||
<BusinessTableActionCell
|
|
||||||
actions={[
|
|
||||||
{
|
|
||||||
key: 'edit',
|
|
||||||
label: '编辑',
|
|
||||||
buttonType: 'primary',
|
|
||||||
disabled: !isProductEditable(row.statusCode),
|
|
||||||
onClick: () => openEdit(row)
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
]
|
],
|
||||||
|
immediate: false
|
||||||
});
|
});
|
||||||
|
|
||||||
async function loadManagerOptions() {
|
async function loadManagerOptions() {
|
||||||
const [allProducts, userSimpleResult] = await Promise.all([fetchAllProducts(), fetchGetUserSimpleList()]);
|
const { error, data: userList } = await fetchGetUserSimpleList();
|
||||||
|
|
||||||
const userSimpleList =
|
if (error || !userList) {
|
||||||
userSimpleResult.error || !userSimpleResult.data ? [] : sortManagerOptions(userSimpleResult.data);
|
managerUserOptions.value = [];
|
||||||
|
|
||||||
managerUserOptions.value = userSimpleList;
|
|
||||||
|
|
||||||
if (!allProducts) {
|
|
||||||
managerFilterOptions.value = [];
|
managerFilterOptions.value = [];
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
managerFilterOptions.value = createManagerOptions(allProducts, userSimpleList);
|
const userSimpleList = sortManagerOptions(userList);
|
||||||
|
managerUserOptions.value = userSimpleList;
|
||||||
|
managerFilterOptions.value = userSimpleList;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function loadOverviewData() {
|
async function loadOverviewData() {
|
||||||
const end = dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss');
|
const { error, data: overviewSummary } = await fetchGetProductOverviewSummary();
|
||||||
const start = dayjs().subtract(30, 'day').startOf('day').format('YYYY-MM-DD HH:mm:ss');
|
|
||||||
|
|
||||||
const [activeTotal, archivedTotal, pausedTotal, abandonedTotal, recentTotal] = await Promise.all([
|
if (error || !overviewSummary) {
|
||||||
fetchProductTotal({ pageNo: 1, pageSize: 1, statusCode: 'active' }),
|
statusCounts.value = {};
|
||||||
fetchProductTotal({ pageNo: 1, pageSize: 1, statusCode: 'archived' }),
|
return;
|
||||||
fetchProductTotal({ pageNo: 1, pageSize: 1, statusCode: 'paused' }),
|
}
|
||||||
fetchProductTotal({ pageNo: 1, pageSize: 1, statusCode: 'abandoned' }),
|
|
||||||
fetchProductTotal({ pageNo: 1, pageSize: 1, updateTime: [start, end] })
|
|
||||||
]);
|
|
||||||
|
|
||||||
statusCounts.value = {
|
statusCounts.value = overviewSummary.statusCounts || {};
|
||||||
active: activeTotal,
|
|
||||||
archived: archivedTotal,
|
|
||||||
paused: pausedTotal,
|
|
||||||
abandoned: abandonedTotal
|
|
||||||
};
|
|
||||||
recentUpdatedCount.value = recentTotal;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function reloadProductTable(page = searchParams.pageNo ?? 1) {
|
async function reloadProductTable(page = searchParams.pageNo ?? 1) {
|
||||||
@@ -376,7 +265,7 @@ async function handleResetSearch() {
|
|||||||
|
|
||||||
async function handleStatusChange(status: Api.Product.ProductStatusCode) {
|
async function handleStatusChange(status: Api.Product.ProductStatusCode) {
|
||||||
selectedStatus.value = status;
|
selectedStatus.value = status;
|
||||||
await reloadProductTable(1);
|
await Promise.all([loadOverviewData(), reloadProductTable(1)]);
|
||||||
}
|
}
|
||||||
|
|
||||||
function openCreate() {
|
function openCreate() {
|
||||||
@@ -384,11 +273,6 @@ function openCreate() {
|
|||||||
operateVisible.value = true;
|
operateVisible.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
function openEdit(row: Api.Product.Product) {
|
|
||||||
editingRow.value = row;
|
|
||||||
operateVisible.value = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function enterProductContext(row: Api.Product.Product) {
|
async function enterProductContext(row: Api.Product.Product) {
|
||||||
await routerPush({
|
await routerPush({
|
||||||
path: PRODUCT_ENTRY_ROUTE_PATH,
|
path: PRODUCT_ENTRY_ROUTE_PATH,
|
||||||
@@ -419,14 +303,6 @@ onMounted(async () => {
|
|||||||
>
|
>
|
||||||
<div class="flex-col-stretch gap-16px xl:min-h-0">
|
<div class="flex-col-stretch gap-16px xl:min-h-0">
|
||||||
<ElCard class="product-overview-card card-wrapper">
|
<ElCard class="product-overview-card card-wrapper">
|
||||||
<div class="product-overview-card__stats">
|
|
||||||
<div v-for="item in overviewMetrics" :key="item.label" class="product-overview-card__stat">
|
|
||||||
<span class="product-overview-card__stat-label">{{ item.label }}</span>
|
|
||||||
<strong class="product-overview-card__stat-value">{{ item.value }}</strong>
|
|
||||||
<small class="product-overview-card__stat-hint">{{ item.hint }}</small>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="product-status-panel__list">
|
<div class="product-status-panel__list">
|
||||||
<button
|
<button
|
||||||
v-for="item in statusItems"
|
v-for="item in statusItems"
|
||||||
@@ -534,45 +410,10 @@ onMounted(async () => {
|
|||||||
linear-gradient(180deg, rgb(255 255 255 / 99%), rgb(248 250 252 / 97%));
|
linear-gradient(180deg, rgb(255 255 255 / 99%), rgb(248 250 252 / 97%));
|
||||||
}
|
}
|
||||||
|
|
||||||
.product-overview-card__stats {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
||||||
gap: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.product-overview-card__stat {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 6px;
|
|
||||||
padding: 14px 16px;
|
|
||||||
border: 1px solid rgb(226 232 240 / 88%);
|
|
||||||
border-radius: 18px;
|
|
||||||
background-color: rgb(255 255 255 / 84%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.product-overview-card__stat-label {
|
|
||||||
color: rgb(100 116 139 / 90%);
|
|
||||||
font-size: 13px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.product-overview-card__stat-value {
|
|
||||||
color: rgb(15 23 42 / 94%);
|
|
||||||
font-size: 24px;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: 1.1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.product-overview-card__stat-hint {
|
|
||||||
color: rgb(100 116 139 / 90%);
|
|
||||||
font-size: 12px;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.product-status-panel__list {
|
.product-status-panel__list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
margin-top: 16px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.product-status-item {
|
.product-status-item {
|
||||||
@@ -687,10 +528,4 @@ onMounted(async () => {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (width <= 640px) {
|
|
||||||
.product-overview-card__stats {
|
|
||||||
grid-template-columns: 1fr;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
96
src/views/product/list/modules/product-create-base-form.vue
Normal file
96
src/views/product/list/modules/product-create-base-form.vue
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed } from 'vue';
|
||||||
|
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
||||||
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
|
import BusinessUserSelect from '@/components/custom/business-user-select.vue';
|
||||||
|
import DictSelect from '@/components/custom/dict-select.vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProductCreateBaseForm' });
|
||||||
|
|
||||||
|
export interface ProductCreateBaseForm {
|
||||||
|
code: string;
|
||||||
|
name: string;
|
||||||
|
directionCode: string;
|
||||||
|
managerUserId: string | null;
|
||||||
|
description: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
managerUserOptions: Api.SystemManage.UserSimple[];
|
||||||
|
}
|
||||||
|
|
||||||
|
defineProps<Props>();
|
||||||
|
|
||||||
|
const model = defineModel<ProductCreateBaseForm>('modelValue', { required: true });
|
||||||
|
|
||||||
|
const { formRef, validate } = useForm();
|
||||||
|
const { createRequiredRule } = useFormRules();
|
||||||
|
|
||||||
|
const rules = computed(
|
||||||
|
() =>
|
||||||
|
({
|
||||||
|
name: [createRequiredRule('请输入产品名称')],
|
||||||
|
directionCode: [createRequiredRule('请选择产品方向')],
|
||||||
|
managerUserId: [createRequiredRule('请选择产品经理')]
|
||||||
|
}) satisfies Record<string, App.Global.FormRule[]>
|
||||||
|
);
|
||||||
|
|
||||||
|
async function runValidate(): Promise<boolean> {
|
||||||
|
try {
|
||||||
|
await validate();
|
||||||
|
return true;
|
||||||
|
} catch {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({ validate: runValidate });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
||||||
|
<ElRow :gutter="16">
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="产品名称" prop="name">
|
||||||
|
<ElInput v-model="model.name" clearable maxlength="128" placeholder="请输入产品名称" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="产品编码" prop="code">
|
||||||
|
<ElInput v-model="model.code" clearable placeholder="不填则由后端自动生成" />
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="产品方向" prop="directionCode">
|
||||||
|
<DictSelect
|
||||||
|
v-model="model.directionCode"
|
||||||
|
:dict-code="RDMS_OBJECT_DIRECTION_DICT_CODE"
|
||||||
|
filterable
|
||||||
|
placeholder="请选择产品方向"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="12">
|
||||||
|
<ElFormItem label="产品经理" prop="managerUserId">
|
||||||
|
<BusinessUserSelect
|
||||||
|
v-model="model.managerUserId"
|
||||||
|
:options="managerUserOptions"
|
||||||
|
placeholder="请选择产品经理"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="产品描述" prop="description">
|
||||||
|
<ElInput
|
||||||
|
v-model="model.description"
|
||||||
|
type="textarea"
|
||||||
|
:rows="4"
|
||||||
|
maxlength="500"
|
||||||
|
show-word-limit
|
||||||
|
placeholder="请输入产品描述"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,153 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, nextTick, reactive, watch } from 'vue';
|
||||||
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProductCreateTeamMemberDialog' });
|
||||||
|
|
||||||
|
interface DraftMemberInput {
|
||||||
|
userId: string;
|
||||||
|
roleId: string;
|
||||||
|
remark: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
initial: DraftMemberInput | null;
|
||||||
|
userOptions: Api.SystemManage.UserSimple[];
|
||||||
|
roleOptions: Api.SystemManage.RoleSimple[];
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Emits {
|
||||||
|
(e: 'submit', payload: DraftMemberInput): void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
const emit = defineEmits<Emits>();
|
||||||
|
|
||||||
|
const visible = defineModel<boolean>('visible', { default: false });
|
||||||
|
|
||||||
|
const { formRef, validate } = useForm();
|
||||||
|
const { createRequiredRule } = useFormRules();
|
||||||
|
|
||||||
|
const model = reactive<DraftMemberInput>({ userId: '', roleId: '', remark: '' });
|
||||||
|
|
||||||
|
const userLabelMap = computed(() => new Map(props.userOptions.map(item => [String(item.id), item.nickname])));
|
||||||
|
|
||||||
|
const selectableRoles = computed(() => props.roleOptions.filter(role => role.visible !== 0));
|
||||||
|
|
||||||
|
const rules = computed(
|
||||||
|
() =>
|
||||||
|
({
|
||||||
|
roleId: [createRequiredRule('请选择角色')]
|
||||||
|
}) satisfies Record<string, App.Global.FormRule[]>
|
||||||
|
);
|
||||||
|
|
||||||
|
async function handleConfirm() {
|
||||||
|
await validate();
|
||||||
|
emit('submit', {
|
||||||
|
userId: model.userId,
|
||||||
|
roleId: model.roleId,
|
||||||
|
remark: model.remark.trim()
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(visible, async value => {
|
||||||
|
if (!value) return;
|
||||||
|
model.userId = props.initial?.userId || '';
|
||||||
|
model.roleId = props.initial?.roleId || '';
|
||||||
|
model.remark = props.initial?.remark || '';
|
||||||
|
await nextTick();
|
||||||
|
formRef.value?.clearValidate();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BusinessFormDialog v-model="visible" title="调整成员角色" preset="sm" @confirm="handleConfirm">
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top" :validate-on-rule-change="false">
|
||||||
|
<ElRow :gutter="16">
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="成员用户">
|
||||||
|
<ElInput
|
||||||
|
:model-value="userLabelMap.get(String(model.userId)) || ''"
|
||||||
|
readonly
|
||||||
|
class="product-create-team-member-dialog__readonly-input"
|
||||||
|
placeholder="未获取到成员用户"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="目标角色" prop="roleId">
|
||||||
|
<ElSelect v-model="model.roleId" class="w-full" placeholder="请选择角色">
|
||||||
|
<ElOption v-for="role in selectableRoles" :key="role.id" :label="role.name" :value="role.id">
|
||||||
|
<div class="product-create-team-member-dialog__role-option">
|
||||||
|
<span class="product-create-team-member-dialog__role-option-name">{{ role.name }}</span>
|
||||||
|
<ElTooltip v-if="role.remark" :content="role.remark" placement="right" :show-after="120">
|
||||||
|
<icon-ep:info-filled class="product-create-team-member-dialog__role-option-info" @click.stop />
|
||||||
|
</ElTooltip>
|
||||||
|
</div>
|
||||||
|
</ElOption>
|
||||||
|
</ElSelect>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
<ElCol :span="24">
|
||||||
|
<ElFormItem label="备注">
|
||||||
|
<ElInput
|
||||||
|
v-model="model.remark"
|
||||||
|
type="textarea"
|
||||||
|
:rows="3"
|
||||||
|
maxlength="200"
|
||||||
|
show-word-limit
|
||||||
|
placeholder="请输入备注"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</ElCol>
|
||||||
|
</ElRow>
|
||||||
|
</ElForm>
|
||||||
|
</BusinessFormDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
:deep(.product-create-team-member-dialog__readonly-input .el-input__wrapper) {
|
||||||
|
background: linear-gradient(180deg, rgb(241 245 249 / 98%), rgb(226 232 240 / 94%)), rgb(241 245 249);
|
||||||
|
box-shadow: 0 0 0 1px rgb(203 213 225 / 96%) inset;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.product-create-team-member-dialog__readonly-input .el-input__wrapper:hover),
|
||||||
|
:deep(.product-create-team-member-dialog__readonly-input.is-focus .el-input__wrapper) {
|
||||||
|
box-shadow: 0 0 0 1px rgb(203 213 225 / 96%) inset;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.product-create-team-member-dialog__readonly-input .el-input__inner) {
|
||||||
|
color: rgb(51 65 85 / 96%);
|
||||||
|
-webkit-text-fill-color: rgb(51 65 85 / 96%);
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-team-member-dialog__role-option {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 8px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-team-member-dialog__role-option-name {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-team-member-dialog__role-option-info {
|
||||||
|
flex-shrink: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--el-text-color-placeholder);
|
||||||
|
cursor: help;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-team-member-dialog__role-option-info:hover {
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
331
src/views/product/list/modules/product-create-team-step.vue
Normal file
331
src/views/product/list/modules/product-create-team-step.vue
Normal file
@@ -0,0 +1,331 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, ref, watch } from 'vue';
|
||||||
|
import { PRODUCT_MANAGER_ROLE_CODE } from '@/constants/business';
|
||||||
|
import ProductTeamBatchDialog, {
|
||||||
|
type BatchMemberPayload
|
||||||
|
} from '@/views/product/shared/components/product-team-batch-dialog.vue';
|
||||||
|
import ProductCreateTeamMemberDialog from './product-create-team-member-dialog.vue';
|
||||||
|
import type { ProductCreateBaseForm } from './product-create-base-form.vue';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ProductCreateTeamStep' });
|
||||||
|
|
||||||
|
interface DraftMember {
|
||||||
|
/** 客户端临时主键,仅用于 v-for 稳定 */
|
||||||
|
key: string;
|
||||||
|
userId: string;
|
||||||
|
roleId: string;
|
||||||
|
remark: string;
|
||||||
|
/** true 表示由产品经理自动派生的锁定行 */
|
||||||
|
locked: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
baseInfo: ProductCreateBaseForm;
|
||||||
|
userOptions: Api.SystemManage.UserSimple[];
|
||||||
|
roleOptions: Api.SystemManage.RoleSimple[];
|
||||||
|
roleLoading: boolean;
|
||||||
|
managerRoleError: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
(e: 'update:members', members: Api.Product.CreateProductMemberParams[]): void;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const members = ref<DraftMember[]>([]);
|
||||||
|
|
||||||
|
const memberDialogVisible = ref(false);
|
||||||
|
const editingKey = ref<string | null>(null);
|
||||||
|
|
||||||
|
const batchDialogVisible = ref(false);
|
||||||
|
|
||||||
|
const batchDisabledUserIds = computed(() => members.value.map(item => item.userId).filter(Boolean));
|
||||||
|
|
||||||
|
const userLabelMap = computed(() => new Map(props.userOptions.map(item => [String(item.id), item.nickname])));
|
||||||
|
|
||||||
|
const managerRole = computed(() => props.roleOptions.find(item => item.code === PRODUCT_MANAGER_ROLE_CODE) ?? null);
|
||||||
|
|
||||||
|
const dialogInitial = computed(() => {
|
||||||
|
if (!editingKey.value) return null;
|
||||||
|
const target = members.value.find(item => item.key === editingKey.value);
|
||||||
|
if (!target) return null;
|
||||||
|
return { userId: target.userId, roleId: target.roleId, remark: target.remark };
|
||||||
|
});
|
||||||
|
|
||||||
|
function getUserNickname(userId: string) {
|
||||||
|
return userLabelMap.value.get(String(userId)) || userId;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getRoleName(roleId: string) {
|
||||||
|
return props.roleOptions.find(item => item.id === roleId)?.name || '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
function generateKey() {
|
||||||
|
return `${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function refreshManagerRow() {
|
||||||
|
const managerUserId = props.baseInfo.managerUserId;
|
||||||
|
|
||||||
|
if (!managerUserId || !managerRole.value) {
|
||||||
|
members.value = members.value.filter(item => !item.locked);
|
||||||
|
emitMembers();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const lockedIndex = members.value.findIndex(item => item.locked);
|
||||||
|
const lockedRow: DraftMember = {
|
||||||
|
key: lockedIndex >= 0 ? members.value[lockedIndex].key : generateKey(),
|
||||||
|
userId: managerUserId,
|
||||||
|
roleId: managerRole.value.id,
|
||||||
|
remark: lockedIndex >= 0 ? members.value[lockedIndex].remark : '',
|
||||||
|
locked: true
|
||||||
|
};
|
||||||
|
|
||||||
|
if (lockedIndex >= 0) {
|
||||||
|
members.value[lockedIndex] = lockedRow;
|
||||||
|
} else {
|
||||||
|
members.value = [lockedRow, ...members.value];
|
||||||
|
}
|
||||||
|
|
||||||
|
emitMembers();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openBatch() {
|
||||||
|
batchDialogVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleBatchSubmit(payloads: BatchMemberPayload[]) {
|
||||||
|
for (const p of payloads) {
|
||||||
|
members.value.push({
|
||||||
|
key: generateKey(),
|
||||||
|
userId: p.userId,
|
||||||
|
roleId: p.roleId,
|
||||||
|
remark: p.remark,
|
||||||
|
locked: false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
batchDialogVisible.value = false;
|
||||||
|
emitMembers();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openEdit(row: DraftMember) {
|
||||||
|
editingKey.value = row.key;
|
||||||
|
memberDialogVisible.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function removeMember(key: string) {
|
||||||
|
members.value = members.value.filter(item => item.key !== key);
|
||||||
|
emitMembers();
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleMemberEditSubmit(payload: { userId: string; roleId: string; remark: string }) {
|
||||||
|
if (!editingKey.value) return;
|
||||||
|
const idx = members.value.findIndex(item => item.key === editingKey.value);
|
||||||
|
if (idx >= 0) {
|
||||||
|
members.value[idx] = {
|
||||||
|
...members.value[idx],
|
||||||
|
roleId: payload.roleId,
|
||||||
|
remark: payload.remark
|
||||||
|
};
|
||||||
|
}
|
||||||
|
memberDialogVisible.value = false;
|
||||||
|
emitMembers();
|
||||||
|
}
|
||||||
|
|
||||||
|
function emitMembers() {
|
||||||
|
emit(
|
||||||
|
'update:members',
|
||||||
|
members.value.map(item => ({
|
||||||
|
userId: item.userId,
|
||||||
|
roleId: item.roleId,
|
||||||
|
remark: item.remark.trim() || null,
|
||||||
|
previousManagerUserId: null,
|
||||||
|
previousManagerRoleId: null
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function runValidate(): Promise<boolean> {
|
||||||
|
if (props.managerRoleError) {
|
||||||
|
window.$message?.error(props.managerRoleError);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const item of members.value) {
|
||||||
|
if (!item.userId || !item.roleId) {
|
||||||
|
window.$message?.error('请补全所有成员的用户和角色');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const userIdSet = new Set<string>();
|
||||||
|
|
||||||
|
for (const item of members.value) {
|
||||||
|
if (userIdSet.has(item.userId)) {
|
||||||
|
window.$message?.error(`成员「${getUserNickname(item.userId)}」重复,请检查`);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
userIdSet.add(item.userId);
|
||||||
|
}
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.baseInfo.managerUserId,
|
||||||
|
() => {
|
||||||
|
if (!props.managerRoleError && managerRole.value) {
|
||||||
|
refreshManagerRow();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// roleOptions 异步加载到位后,补一次 locked 行刷新
|
||||||
|
watch(managerRole, () => {
|
||||||
|
if (!props.managerRoleError && managerRole.value && props.baseInfo.managerUserId) {
|
||||||
|
refreshManagerRow();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
defineExpose({ validate: runValidate });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div v-loading="roleLoading" class="team-step">
|
||||||
|
<button type="button" class="team-step__add" :disabled="Boolean(managerRoleError)" @click="openBatch">
|
||||||
|
<icon-ep:plus class="team-step__add-icon" />
|
||||||
|
<span>新增成员</span>
|
||||||
|
<span class="team-step__add-hint">从部门 / 管理链路 / 全公司 批量选人</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<ElAlert
|
||||||
|
v-if="managerRoleError"
|
||||||
|
:title="managerRoleError"
|
||||||
|
type="error"
|
||||||
|
:closable="false"
|
||||||
|
show-icon
|
||||||
|
class="team-step__alert"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="team-step__table-wrap">
|
||||||
|
<ElTable :data="members" height="100%" border row-key="key" empty-text="点击右上角“新增成员”添加">
|
||||||
|
<ElTableColumn type="index" label="序号" width="64" align="center" />
|
||||||
|
<ElTableColumn label="成员姓名" min-width="120">
|
||||||
|
<template #default="{ row }">
|
||||||
|
{{ getUserNickname(row.userId) }}
|
||||||
|
</template>
|
||||||
|
</ElTableColumn>
|
||||||
|
<ElTableColumn label="当前角色" min-width="140">
|
||||||
|
<template #default="{ row }">
|
||||||
|
{{ getRoleName(row.roleId) }}
|
||||||
|
</template>
|
||||||
|
</ElTableColumn>
|
||||||
|
<ElTableColumn label="备注" min-width="200" show-overflow-tooltip>
|
||||||
|
<template #default="{ row }">
|
||||||
|
{{ row.remark || '--' }}
|
||||||
|
</template>
|
||||||
|
</ElTableColumn>
|
||||||
|
<ElTableColumn label="操作" width="150" fixed="right" align="center">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div class="team-step__actions">
|
||||||
|
<ElButton link type="primary" :disabled="row.locked" @click="openEdit(row)">编辑</ElButton>
|
||||||
|
<ElButton link type="danger" :disabled="row.locked" @click="removeMember(row.key)">移除</ElButton>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</ElTableColumn>
|
||||||
|
</ElTable>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ProductCreateTeamMemberDialog
|
||||||
|
v-model:visible="memberDialogVisible"
|
||||||
|
:initial="dialogInitial"
|
||||||
|
:user-options="userOptions"
|
||||||
|
:role-options="roleOptions"
|
||||||
|
@submit="handleMemberEditSubmit"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<ProductTeamBatchDialog
|
||||||
|
v-model:visible="batchDialogVisible"
|
||||||
|
:user-options="userOptions"
|
||||||
|
:role-options="roleOptions"
|
||||||
|
:disabled-user-ids="batchDisabledUserIds"
|
||||||
|
@submit="handleBatchSubmit"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.team-step {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 14px;
|
||||||
|
height: 100%;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__add {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8px;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 16px;
|
||||||
|
border: 1px dashed var(--el-border-color-darker);
|
||||||
|
border-radius: 6px;
|
||||||
|
background: transparent;
|
||||||
|
color: var(--el-text-color-regular);
|
||||||
|
font-size: 13px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition:
|
||||||
|
border-color 0.2s ease,
|
||||||
|
color 0.2s ease,
|
||||||
|
background-color 0.2s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__add:hover:not(:disabled) {
|
||||||
|
border-color: var(--el-color-primary);
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
background: var(--el-color-primary-light-9);
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__add:disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
opacity: 0.55;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__add-icon {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__add-hint {
|
||||||
|
color: var(--el-text-color-placeholder);
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__add:hover:not(:disabled) .team-step__add-hint {
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__alert {
|
||||||
|
margin: 0;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__table-wrap {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.team-step__actions {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,10 +1,15 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, nextTick, ref, watch } from 'vue';
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { PRODUCT_MANAGER_ROLE_CODE } from '@/constants/business';
|
||||||
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
||||||
import { fetchCreateProduct, fetchGetProduct, fetchUpdateProduct } from '@/service/api';
|
import { fetchCreateProductWithTeam, fetchGetProduct, fetchGetRoleSimpleList, fetchUpdateProduct } from '@/service/api';
|
||||||
import { useForm, useFormRules } from '@/hooks/common/form';
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
import DictSelect from '@/components/custom/dict-select.vue';
|
import DictSelect from '@/components/custom/dict-select.vue';
|
||||||
|
import ProductCreateBaseForm, {
|
||||||
|
type ProductCreateBaseForm as ProductCreateBaseFormModel
|
||||||
|
} from './product-create-base-form.vue';
|
||||||
|
import ProductCreateTeamStep from './product-create-team-step.vue';
|
||||||
|
|
||||||
defineOptions({ name: 'ProductOperateDialog' });
|
defineOptions({ name: 'ProductOperateDialog' });
|
||||||
|
|
||||||
@@ -21,11 +26,10 @@ interface Emits {
|
|||||||
|
|
||||||
const emit = defineEmits<Emits>();
|
const emit = defineEmits<Emits>();
|
||||||
|
|
||||||
const visible = defineModel<boolean>('visible', {
|
const visible = defineModel<boolean>('visible', { default: false });
|
||||||
default: false
|
|
||||||
});
|
|
||||||
|
|
||||||
interface Model {
|
// === 编辑模式(单步) ===
|
||||||
|
interface EditModel {
|
||||||
code: string;
|
code: string;
|
||||||
directionCode: string;
|
directionCode: string;
|
||||||
name: string;
|
name: string;
|
||||||
@@ -33,17 +37,26 @@ interface Model {
|
|||||||
description: string;
|
description: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const { formRef, validate } = useForm();
|
const { formRef: editFormRef, validate: editValidate } = useForm();
|
||||||
const { createRequiredRule } = useFormRules();
|
const { createRequiredRule } = useFormRules();
|
||||||
|
|
||||||
|
const editModel = ref<EditModel>(createEditModel());
|
||||||
|
const editLoading = ref(false);
|
||||||
|
const submitting = ref(false);
|
||||||
|
|
||||||
const isEditMode = computed(() => Boolean(props.rowData?.id));
|
const isEditMode = computed(() => Boolean(props.rowData?.id));
|
||||||
const dialogTitle = computed(() => (isEditMode.value ? '编辑产品' : '新增产品'));
|
const dialogTitle = computed(() => (isEditMode.value ? '编辑产品' : '新增产品'));
|
||||||
const submitting = ref(false);
|
|
||||||
const loading = ref(false);
|
const editRules = {
|
||||||
const model = ref<Model>(createDefaultModel());
|
directionCode: [createRequiredRule('请选择产品方向')],
|
||||||
|
name: [createRequiredRule('请输入产品名称')],
|
||||||
|
managerUserId: [createRequiredRule('请选择产品经理')]
|
||||||
|
} satisfies Record<string, App.Global.FormRule[]>;
|
||||||
|
|
||||||
const managerLabelMap = computed(() => new Map(props.managerUserOptions.map(item => [String(item.id), item.nickname])));
|
const managerLabelMap = computed(() => new Map(props.managerUserOptions.map(item => [String(item.id), item.nickname])));
|
||||||
|
|
||||||
const managerDisplayName = computed(() => {
|
const managerDisplayName = computed(() => {
|
||||||
const managerUserId = model.value.managerUserId;
|
const managerUserId = editModel.value.managerUserId;
|
||||||
|
|
||||||
if (!managerUserId) {
|
if (!managerUserId) {
|
||||||
return '';
|
return '';
|
||||||
@@ -52,20 +65,8 @@ const managerDisplayName = computed(() => {
|
|||||||
return managerLabelMap.value.get(String(managerUserId)) || String(managerUserId);
|
return managerLabelMap.value.get(String(managerUserId)) || String(managerUserId);
|
||||||
});
|
});
|
||||||
|
|
||||||
const rules = {
|
function createEditModel(): EditModel {
|
||||||
directionCode: [createRequiredRule('请选择产品方向')],
|
return { code: '', directionCode: '', name: '', managerUserId: null, description: '' };
|
||||||
name: [createRequiredRule('请输入产品名称')],
|
|
||||||
managerUserId: [createRequiredRule('请选择产品经理')]
|
|
||||||
} satisfies Record<string, App.Global.FormRule[]>;
|
|
||||||
|
|
||||||
function createDefaultModel(): Model {
|
|
||||||
return {
|
|
||||||
code: '',
|
|
||||||
directionCode: '',
|
|
||||||
name: '',
|
|
||||||
managerUserId: null,
|
|
||||||
description: ''
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function getNullableText(value?: string | null) {
|
function getNullableText(value?: string | null) {
|
||||||
@@ -76,80 +77,154 @@ function closeDialog() {
|
|||||||
visible.value = false;
|
visible.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function handleSubmit() {
|
async function handleEditSubmit() {
|
||||||
await validate();
|
await editValidate();
|
||||||
|
|
||||||
const managerUserId = model.value.managerUserId;
|
const managerUserId = editModel.value.managerUserId;
|
||||||
|
|
||||||
if (!managerUserId) {
|
if (!managerUserId || !props.rowData?.id) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const payload: Api.Product.SaveProductParams = {
|
|
||||||
code: getNullableText(model.value.code),
|
|
||||||
directionCode: model.value.directionCode,
|
|
||||||
name: model.value.name.trim(),
|
|
||||||
// Long ID 必须以 string 提交,禁止再转成 number。
|
|
||||||
managerUserId,
|
|
||||||
description: getNullableText(model.value.description)
|
|
||||||
};
|
|
||||||
|
|
||||||
submitting.value = true;
|
submitting.value = true;
|
||||||
|
|
||||||
if (isEditMode.value && props.rowData?.id) {
|
const { error } = await fetchUpdateProduct({
|
||||||
const result = await fetchUpdateProduct({
|
id: props.rowData.id,
|
||||||
id: props.rowData.id,
|
code: getNullableText(editModel.value.code),
|
||||||
...payload
|
directionCode: editModel.value.directionCode,
|
||||||
});
|
name: editModel.value.name.trim(),
|
||||||
|
managerUserId,
|
||||||
submitting.value = false;
|
description: getNullableText(editModel.value.description)
|
||||||
|
});
|
||||||
if (result.error) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
window.$message?.success('产品编辑成功');
|
|
||||||
closeDialog();
|
|
||||||
emit('submitted', props.rowData.id);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const result = await fetchCreateProduct(payload);
|
|
||||||
|
|
||||||
submitting.value = false;
|
submitting.value = false;
|
||||||
|
|
||||||
if (result.error) {
|
if (error) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.$message?.success('产品编辑成功');
|
||||||
|
closeDialog();
|
||||||
|
emit('submitted', props.rowData.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
// === 新增模式(两步向导) ===
|
||||||
|
const baseFormRef = ref<InstanceType<typeof ProductCreateBaseForm> | null>(null);
|
||||||
|
const teamStepRef = ref<InstanceType<typeof ProductCreateTeamStep> | null>(null);
|
||||||
|
const currentStep = ref<1 | 2>(1);
|
||||||
|
|
||||||
|
// === 新增模式:角色列表(父级加载,下发给 team-step 与批量弹层) ===
|
||||||
|
const roleOptions = ref<Api.SystemManage.RoleSimple[]>([]);
|
||||||
|
const roleLoading = ref(false);
|
||||||
|
const managerRoleError = ref('');
|
||||||
|
|
||||||
|
const managerRole = computed(() => roleOptions.value.find(item => item.code === PRODUCT_MANAGER_ROLE_CODE) ?? null);
|
||||||
|
|
||||||
|
async function loadRoles() {
|
||||||
|
roleLoading.value = true;
|
||||||
|
managerRoleError.value = '';
|
||||||
|
|
||||||
|
const { data } = await fetchGetRoleSimpleList({ scopeType: 'object', objectType: 'product' });
|
||||||
|
|
||||||
|
roleLoading.value = false;
|
||||||
|
roleOptions.value = data ?? [];
|
||||||
|
|
||||||
|
if (!managerRole.value) {
|
||||||
|
managerRoleError.value = '未找到产品经理角色,请联系管理员';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const createBaseModel = ref<ProductCreateBaseFormModel>(createBaseInfo());
|
||||||
|
const draftMembers = ref<Api.Product.CreateProductMemberParams[]>([]);
|
||||||
|
|
||||||
|
function createBaseInfo(): ProductCreateBaseFormModel {
|
||||||
|
return { code: '', name: '', directionCode: '', managerUserId: null, description: '' };
|
||||||
|
}
|
||||||
|
|
||||||
|
async function goNext() {
|
||||||
|
const valid = await baseFormRef.value?.validate();
|
||||||
|
|
||||||
|
if (!valid) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
currentStep.value = 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
function goPrev() {
|
||||||
|
currentStep.value = 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleCreateSubmit() {
|
||||||
|
const baseValid = await baseFormRef.value?.validate();
|
||||||
|
|
||||||
|
if (!baseValid) {
|
||||||
|
currentStep.value = 1;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const teamValid = await teamStepRef.value?.validate();
|
||||||
|
|
||||||
|
if (!teamValid) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
submitting.value = true;
|
||||||
|
|
||||||
|
const payload: Api.Product.CreateProductWithTeamParams = {
|
||||||
|
product: {
|
||||||
|
code: getNullableText(createBaseModel.value.code),
|
||||||
|
name: createBaseModel.value.name.trim(),
|
||||||
|
directionCode: createBaseModel.value.directionCode,
|
||||||
|
managerUserId: createBaseModel.value.managerUserId as string,
|
||||||
|
description: getNullableText(createBaseModel.value.description)
|
||||||
|
},
|
||||||
|
members: draftMembers.value
|
||||||
|
};
|
||||||
|
|
||||||
|
const { error, data } = await fetchCreateProductWithTeam(payload);
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
|
||||||
|
if (error) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
window.$message?.success('产品新增成功');
|
window.$message?.success('产品新增成功');
|
||||||
closeDialog();
|
closeDialog();
|
||||||
emit('submitted', result.data);
|
emit('submitted', data);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// === 公共:弹框可见性变化时重置 / 加载数据 ===
|
||||||
watch(visible, async value => {
|
watch(visible, async value => {
|
||||||
if (!value) {
|
if (!value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
submitting.value = false;
|
||||||
|
currentStep.value = 1;
|
||||||
|
|
||||||
if (!isEditMode.value || !props.rowData?.id) {
|
if (!isEditMode.value || !props.rowData?.id) {
|
||||||
model.value = createDefaultModel();
|
editModel.value = createEditModel();
|
||||||
|
createBaseModel.value = createBaseInfo();
|
||||||
|
draftMembers.value = [];
|
||||||
await nextTick();
|
await nextTick();
|
||||||
formRef.value?.clearValidate();
|
await loadRoles();
|
||||||
|
editFormRef.value?.clearValidate();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
loading.value = true;
|
editLoading.value = true;
|
||||||
|
|
||||||
const { error, data } = await fetchGetProduct(props.rowData.id);
|
const { error, data } = await fetchGetProduct(props.rowData.id);
|
||||||
|
|
||||||
loading.value = false;
|
editLoading.value = false;
|
||||||
|
|
||||||
if (error || !data) {
|
if (error || !data) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
model.value = {
|
editModel.value = {
|
||||||
code: data.code || '',
|
code: data.code || '',
|
||||||
directionCode: data.directionCode || '',
|
directionCode: data.directionCode || '',
|
||||||
name: data.name || '',
|
name: data.name || '',
|
||||||
@@ -158,51 +233,50 @@ watch(visible, async value => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
await nextTick();
|
await nextTick();
|
||||||
formRef.value?.clearValidate();
|
editFormRef.value?.clearValidate();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<!-- 编辑模式:单步表单(与改造前一致) -->
|
||||||
<BusinessFormDialog
|
<BusinessFormDialog
|
||||||
|
v-if="isEditMode"
|
||||||
v-model="visible"
|
v-model="visible"
|
||||||
:title="dialogTitle"
|
:title="dialogTitle"
|
||||||
preset="lg"
|
preset="sm"
|
||||||
:loading="loading"
|
:loading="editLoading"
|
||||||
:confirm-loading="submitting"
|
:confirm-loading="submitting"
|
||||||
@confirm="handleSubmit"
|
@confirm="handleEditSubmit"
|
||||||
>
|
>
|
||||||
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
<ElForm ref="editFormRef" :model="editModel" :rules="editRules" label-position="top">
|
||||||
<ElRow :gutter="16">
|
<ElRow :gutter="16">
|
||||||
<ElCol :span="12">
|
<ElCol :span="24">
|
||||||
<ElFormItem v-if="isEditMode" label="产品编码" prop="code">
|
<ElFormItem label="产品编码" prop="code">
|
||||||
<ElInput
|
<ElInput
|
||||||
:model-value="model.code"
|
:model-value="editModel.code"
|
||||||
readonly
|
readonly
|
||||||
class="product-operate-dialog__readonly-input"
|
class="product-operate-dialog__readonly-input"
|
||||||
placeholder="未获取到产品编码"
|
placeholder="未获取到产品编码"
|
||||||
/>
|
/>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
<ElFormItem v-else label="产品编码" prop="code">
|
|
||||||
<ElInput v-model="model.code" clearable placeholder="不填则由后端自动生成" />
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
</ElCol>
|
||||||
<ElCol :span="12">
|
<ElCol :span="24">
|
||||||
<ElFormItem label="产品名称" prop="name">
|
<ElFormItem label="产品名称" prop="name">
|
||||||
<ElInput v-model="model.name" clearable maxlength="128" placeholder="请输入产品名称" />
|
<ElInput v-model="editModel.name" clearable maxlength="128" placeholder="请输入产品名称" />
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
</ElCol>
|
</ElCol>
|
||||||
<ElCol :span="12">
|
<ElCol :span="24">
|
||||||
<ElFormItem label="产品方向" prop="directionCode">
|
<ElFormItem label="产品方向" prop="directionCode">
|
||||||
<DictSelect
|
<DictSelect
|
||||||
v-model="model.directionCode"
|
v-model="editModel.directionCode"
|
||||||
:dict-code="RDMS_OBJECT_DIRECTION_DICT_CODE"
|
:dict-code="RDMS_OBJECT_DIRECTION_DICT_CODE"
|
||||||
filterable
|
filterable
|
||||||
placeholder="请选择产品方向"
|
placeholder="请选择产品方向"
|
||||||
/>
|
/>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
</ElCol>
|
</ElCol>
|
||||||
<ElCol :span="12">
|
<ElCol :span="24">
|
||||||
<ElFormItem v-if="isEditMode">
|
<ElFormItem>
|
||||||
<template #label>
|
<template #label>
|
||||||
<span class="business-form-label-with-tip">
|
<span class="business-form-label-with-tip">
|
||||||
<ElTooltip
|
<ElTooltip
|
||||||
@@ -224,16 +298,11 @@ watch(visible, async value => {
|
|||||||
placeholder="未配置产品经理"
|
placeholder="未配置产品经理"
|
||||||
/>
|
/>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
<ElFormItem v-else label="产品经理" prop="managerUserId">
|
|
||||||
<ElSelect v-model="model.managerUserId" clearable filterable placeholder="请选择产品经理">
|
|
||||||
<ElOption v-for="item in managerUserOptions" :key="item.id" :label="item.nickname" :value="item.id" />
|
|
||||||
</ElSelect>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
</ElCol>
|
||||||
<ElCol :span="24">
|
<ElCol :span="24">
|
||||||
<ElFormItem label="产品描述" prop="description">
|
<ElFormItem label="产品描述" prop="description">
|
||||||
<ElInput
|
<ElInput
|
||||||
v-model="model.description"
|
v-model="editModel.description"
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:rows="4"
|
:rows="4"
|
||||||
maxlength="500"
|
maxlength="500"
|
||||||
@@ -245,6 +314,106 @@ watch(visible, async value => {
|
|||||||
</ElRow>
|
</ElRow>
|
||||||
</ElForm>
|
</ElForm>
|
||||||
</BusinessFormDialog>
|
</BusinessFormDialog>
|
||||||
|
|
||||||
|
<!-- 新增模式:两步向导(复合内容特例,1080px,左侧概念区 + 右侧步骤面板) -->
|
||||||
|
<ElDialog
|
||||||
|
v-else
|
||||||
|
v-model="visible"
|
||||||
|
class="product-create-dialog"
|
||||||
|
:title="dialogTitle"
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
destroy-on-close
|
||||||
|
align-center
|
||||||
|
width="1080px"
|
||||||
|
>
|
||||||
|
<div class="product-create-dialog__split">
|
||||||
|
<aside class="product-create-dialog__guide">
|
||||||
|
<div class="product-create-dialog__guide-hero">
|
||||||
|
<div class="product-create-dialog__guide-hero-icon">
|
||||||
|
<icon-ep:box />
|
||||||
|
</div>
|
||||||
|
<div class="product-create-dialog__guide-hero-text">
|
||||||
|
<div class="product-create-dialog__guide-hero-title">产品</div>
|
||||||
|
<div class="product-create-dialog__guide-hero-sub">需求 · 项目 · 迭代 的承载单元</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="product-create-dialog__guide-lead">
|
||||||
|
产品与需求池管理,提供多维度的需求规划工具,打通客户、业务团队和产研团队之间的协作。
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<section class="product-create-dialog__guide-section">
|
||||||
|
<h4>包含</h4>
|
||||||
|
<p>需求、变更、迭代、模块、文档、状态、统计报表。</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="product-create-dialog__guide-section">
|
||||||
|
<h4>参与人</h4>
|
||||||
|
<p>产品经理(必填,创建后锁定) · 团队角色(业务专员 / 游客 / 关注人)。</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="product-create-dialog__guide-section">
|
||||||
|
<h4>命名建议</h4>
|
||||||
|
<p>建议使用业务团队约定俗成的简短名称,产品创建后不再轻易调整,会影响下游引用。</p>
|
||||||
|
</section>
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
<div class="product-create-dialog__main">
|
||||||
|
<div class="product-create-dialog__stepbar">
|
||||||
|
<div
|
||||||
|
class="product-create-dialog__step"
|
||||||
|
:class="{ 'is-active': currentStep === 1, 'is-done': currentStep > 1 }"
|
||||||
|
>
|
||||||
|
<span class="product-create-dialog__step-index">1</span>
|
||||||
|
<span class="product-create-dialog__step-text">
|
||||||
|
<strong>基础资料</strong>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="product-create-dialog__step" :class="{ 'is-active': currentStep === 2 }">
|
||||||
|
<span class="product-create-dialog__step-index">2</span>
|
||||||
|
<span class="product-create-dialog__step-text">
|
||||||
|
<strong>初始化团队</strong>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="product-create-dialog__body">
|
||||||
|
<div v-show="currentStep === 1" class="product-create-dialog__panel">
|
||||||
|
<ProductCreateBaseForm
|
||||||
|
ref="baseFormRef"
|
||||||
|
v-model="createBaseModel"
|
||||||
|
:manager-user-options="managerUserOptions"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div v-show="currentStep === 2" class="product-create-dialog__panel">
|
||||||
|
<ProductCreateTeamStep
|
||||||
|
ref="teamStepRef"
|
||||||
|
:base-info="createBaseModel"
|
||||||
|
:user-options="managerUserOptions"
|
||||||
|
:role-options="roleOptions"
|
||||||
|
:role-loading="roleLoading"
|
||||||
|
:manager-role-error="managerRoleError"
|
||||||
|
@update:members="draftMembers = $event"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<div class="product-create-dialog__footer">
|
||||||
|
<span class="product-create-dialog__footer-meta">第 {{ currentStep }} 步,共 2 步</span>
|
||||||
|
<ElSpace :size="10">
|
||||||
|
<ElButton @click="closeDialog">取消</ElButton>
|
||||||
|
<ElButton v-if="currentStep === 2" @click="goPrev">上一步</ElButton>
|
||||||
|
<ElButton v-if="currentStep === 1" type="primary" @click="goNext">下一步</ElButton>
|
||||||
|
<ElButton v-if="currentStep === 2" type="primary" :loading="submitting" @click="handleCreateSubmit">
|
||||||
|
确定
|
||||||
|
</ElButton>
|
||||||
|
</ElSpace>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</ElDialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@@ -264,4 +433,174 @@ watch(visible, async value => {
|
|||||||
cursor: default;
|
cursor: default;
|
||||||
-webkit-text-fill-color: rgb(51 65 85 / 96%);
|
-webkit-text-fill-color: rgb(51 65 85 / 96%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.product-create-dialog :deep(.el-dialog__body) {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__split {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 280px 1fr;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide {
|
||||||
|
padding: 28px 24px;
|
||||||
|
background: linear-gradient(180deg, #f7f9fc 0%, #fafbfc 100%);
|
||||||
|
border-right: 1px solid rgb(229 233 242 / 96%);
|
||||||
|
overflow-y: auto;
|
||||||
|
max-height: min(720px, calc(100vh - 160px));
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-hero {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
border-bottom: 1px solid rgb(229 233 242 / 96%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-hero-icon {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background: var(--el-color-primary-light-9);
|
||||||
|
color: var(--el-color-primary);
|
||||||
|
font-size: 22px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-hero-text {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-hero-title {
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 650;
|
||||||
|
color: var(--el-text-color-primary);
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-hero-sub {
|
||||||
|
margin-top: 2px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--el-text-color-secondary);
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-lead {
|
||||||
|
margin: 0 0 24px;
|
||||||
|
font-size: 13.5px;
|
||||||
|
line-height: 1.8;
|
||||||
|
color: var(--el-text-color-regular);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-section + .product-create-dialog__guide-section {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-section h4 {
|
||||||
|
margin: 0 0 6px;
|
||||||
|
font-size: 12.5px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--el-text-color-primary);
|
||||||
|
letter-spacing: 0.4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__guide-section p {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 1.75;
|
||||||
|
color: var(--el-text-color-regular);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__main {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__stepbar {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
padding: 14px 24px;
|
||||||
|
border-bottom: 1px solid rgb(229 233 242 / 96%);
|
||||||
|
background: #fbfcfe;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__step {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__step-index {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex: 0 0 auto;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
border: 1px solid rgb(215 222 235 / 96%);
|
||||||
|
border-radius: 999px;
|
||||||
|
background: #fff;
|
||||||
|
color: rgb(119 129 150 / 96%);
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 650;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__step.is-active .product-create-dialog__step-index,
|
||||||
|
.product-create-dialog__step.is-done .product-create-dialog__step-index {
|
||||||
|
border-color: var(--el-color-primary);
|
||||||
|
background: var(--el-color-primary);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__step-text {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__step-text strong {
|
||||||
|
display: block;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 650;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__step-text small {
|
||||||
|
display: block;
|
||||||
|
margin-top: 2px;
|
||||||
|
color: rgb(119 129 150 / 96%);
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__body {
|
||||||
|
height: min(520px, calc(100vh - 240px));
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__panel {
|
||||||
|
height: 100%;
|
||||||
|
padding: 24px;
|
||||||
|
overflow: auto;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__footer {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-create-dialog__footer-meta {
|
||||||
|
color: rgb(119 129 150 / 96%);
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { computed } from 'vue';
|
||||||
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
import { RDMS_OBJECT_DIRECTION_DICT_CODE } from '@/constants/dict';
|
||||||
import DictSelect from '@/components/custom/dict-select.vue';
|
import TableSearchFields, { type SearchField } from '@/components/custom/table-search-fields.vue';
|
||||||
import TableSearchPanel from '@/components/custom/table-search-panel.vue';
|
|
||||||
|
|
||||||
defineOptions({ name: 'ProductSearch' });
|
defineOptions({ name: 'ProductSearch' });
|
||||||
|
|
||||||
@@ -9,7 +9,7 @@ interface Props {
|
|||||||
managerOptions: Api.SystemManage.UserSimple[];
|
managerOptions: Api.SystemManage.UserSimple[];
|
||||||
}
|
}
|
||||||
|
|
||||||
defineProps<Props>();
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
interface Emits {
|
interface Emits {
|
||||||
(e: 'reset'): void;
|
(e: 'reset'): void;
|
||||||
@@ -20,6 +20,32 @@ const emit = defineEmits<Emits>();
|
|||||||
|
|
||||||
const model = defineModel<Api.Product.ProductSearchParams>('model', { required: true });
|
const model = defineModel<Api.Product.ProductSearchParams>('model', { required: true });
|
||||||
|
|
||||||
|
const fields = computed<SearchField[]>(() => [
|
||||||
|
{
|
||||||
|
key: 'keyword',
|
||||||
|
label: '关键词',
|
||||||
|
type: 'input',
|
||||||
|
placeholder: '产品名称 / 编号'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'managerUserId',
|
||||||
|
label: '产品经理',
|
||||||
|
type: 'select',
|
||||||
|
options: props.managerOptions.map(item => ({
|
||||||
|
label: item.nickname,
|
||||||
|
value: item.id
|
||||||
|
})),
|
||||||
|
placeholder: '筛选产品经理'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'directionCode',
|
||||||
|
label: '产品方向',
|
||||||
|
type: 'dict',
|
||||||
|
dictCode: RDMS_OBJECT_DIRECTION_DICT_CODE,
|
||||||
|
placeholder: '筛选产品方向'
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
function reset() {
|
function reset() {
|
||||||
emit('reset');
|
emit('reset');
|
||||||
}
|
}
|
||||||
@@ -30,30 +56,7 @@ function search() {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableSearchPanel :model="model" :action-col-lg="6" @reset="reset" @search="search">
|
<TableSearchFields v-model="model" :fields="fields" :columns="3" @reset="reset" @search="search" />
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="关键词">
|
|
||||||
<ElInput v-model="model.keyword" clearable placeholder="产品名称 / 编号" />
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="产品经理">
|
|
||||||
<ElSelect v-model="model.managerUserId" clearable filterable placeholder="筛选产品经理">
|
|
||||||
<ElOption v-for="item in managerOptions" :key="item.id" :label="item.nickname" :value="item.id" />
|
|
||||||
</ElSelect>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="产品方向">
|
|
||||||
<DictSelect
|
|
||||||
v-model="model.directionCode"
|
|
||||||
:dict-code="RDMS_OBJECT_DIRECTION_DICT_CODE"
|
|
||||||
filterable
|
|
||||||
placeholder="筛选产品方向"
|
|
||||||
/>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
</TableSearchPanel>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped></style>
|
||||||
|
|||||||
@@ -1,29 +1,36 @@
|
|||||||
<script setup lang="tsx">
|
<script setup lang="tsx">
|
||||||
import { computed, onMounted, reactive, ref, watch } from 'vue';
|
import { computed, markRaw, onMounted, reactive, ref, watch } from 'vue';
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
import type { TableInstance } from 'element-plus';
|
import type { TableInstance } from 'element-plus';
|
||||||
import { ElButton, ElTag } from 'element-plus';
|
import { ElButton, ElTag, ElTooltip } from 'element-plus';
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import {
|
import {
|
||||||
|
RDMS_REQ_CAN_DELETE_STATUS_DICT_CODE,
|
||||||
RDMS_REQ_CATEGORY_DICT_CODE,
|
RDMS_REQ_CATEGORY_DICT_CODE,
|
||||||
RDMS_REQ_PRIORITY_DICT_CODE
|
RDMS_REQ_PRIORITY_DICT_CODE,
|
||||||
|
RDMS_REQ_SOURCE_TYPE_DICT_CODE
|
||||||
} from '@/constants/dict';
|
} from '@/constants/dict';
|
||||||
import {
|
import {
|
||||||
fetchChangeRequirementStatus,
|
fetchChangeRequirementStatus,
|
||||||
fetchDeleteRequirement,
|
fetchDeleteRequirement,
|
||||||
fetchGetProductMembers,
|
fetchGetProductMembers,
|
||||||
fetchGetRequirementAllowedTransitions,
|
fetchGetProjectListByProductId,
|
||||||
|
fetchGetRequirementAllowedTransitionsBatch,
|
||||||
fetchGetRequirementStatusDict,
|
fetchGetRequirementStatusDict,
|
||||||
fetchGetRequirementTerminalStatusDict,
|
fetchGetRequirementTerminalStatusDict,
|
||||||
fetchGetRequirementTree
|
fetchGetRequirementTree,
|
||||||
|
fetchHasDispatchedProjectRequirementBatch
|
||||||
} from '@/service/api';
|
} from '@/service/api';
|
||||||
import { useAuth } from '@/hooks/business/auth';
|
import { useAuth } from '@/hooks/business/auth';
|
||||||
import BusinessTableActionCell from '@/components/custom/business-table-action-cell';
|
import { useDict } from '@/hooks/business/dict';
|
||||||
import DictTag from '@/components/custom/dict-tag.vue';
|
import DictTag from '@/components/custom/dict-tag.vue';
|
||||||
|
import DictText from '@/components/custom/dict-text.vue';
|
||||||
import { useCurrentProduct } from '../shared/use-current-product';
|
import { useCurrentProduct } from '../shared/use-current-product';
|
||||||
import {
|
import {
|
||||||
|
ACTION_ICON_MAP,
|
||||||
|
ACTION_TYPE_MAP,
|
||||||
type RequirementStatusActionCode,
|
type RequirementStatusActionCode,
|
||||||
getRequirementActionDisplayName,
|
getRequirementActionDisplayName,
|
||||||
getRequirementActionTagType,
|
|
||||||
getRequirementStatusTagType,
|
getRequirementStatusTagType,
|
||||||
isRequirementActionNeedProject,
|
isRequirementActionNeedProject,
|
||||||
isRequirementActionNeedReviewChoice,
|
isRequirementActionNeedReviewChoice,
|
||||||
@@ -35,14 +42,23 @@ import RequirementCreateDialog from './modules/requirement-create-dialog.vue';
|
|||||||
import RequirementDetailDialog from './modules/requirement-detail-dialog.vue';
|
import RequirementDetailDialog from './modules/requirement-detail-dialog.vue';
|
||||||
import RequirementSplitDialog from './modules/requirement-split-dialog.vue';
|
import RequirementSplitDialog from './modules/requirement-split-dialog.vue';
|
||||||
import RequirementActionDialog from './modules/requirement-action-dialog.vue';
|
import RequirementActionDialog from './modules/requirement-action-dialog.vue';
|
||||||
|
import IconMdiSync from '~icons/mdi/sync';
|
||||||
|
|
||||||
defineOptions({ name: 'ProductRequirement' });
|
defineOptions({ name: 'ProductRequirement' });
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
const { currentObjectId } = useCurrentProduct();
|
const { currentObjectId } = useCurrentProduct();
|
||||||
const { hasObjectAuth } = useAuth();
|
const { hasObjectAuth } = useAuth();
|
||||||
|
|
||||||
const statusOptions = ref<Array<{ label: string; value: string }>>([]);
|
const statusOptions = ref<Array<{ label: string; value: string }>>([]);
|
||||||
const terminalStatusOptions = ref<string[]>([]);
|
const terminalStatusOptions = ref<string[]>([]);
|
||||||
|
const projectOptions = ref<Api.Project.Project[]>([]);
|
||||||
|
|
||||||
|
const projectNameMap = computed(() => {
|
||||||
|
return new Map(projectOptions.value.map(item => [item.id, item.projectName]));
|
||||||
|
});
|
||||||
|
|
||||||
|
const { hasValue: canDeleteStatusHasValue } = useDict(RDMS_REQ_CAN_DELETE_STATUS_DICT_CODE);
|
||||||
|
|
||||||
async function loadStatusOptions() {
|
async function loadStatusOptions() {
|
||||||
const { error, data } = await fetchGetRequirementStatusDict();
|
const { error, data } = await fetchGetRequirementStatusDict();
|
||||||
@@ -69,17 +85,34 @@ async function loadTerminalStatusOptions() {
|
|||||||
terminalStatusOptions.value = data.map(item => item.statusCode);
|
terminalStatusOptions.value = data.map(item => item.statusCode);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadProjectOptions() {
|
||||||
|
if (!currentObjectId.value) {
|
||||||
|
projectOptions.value = [];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { error, data } = await fetchGetProjectListByProductId(currentObjectId.value);
|
||||||
|
|
||||||
|
if (error || !data) {
|
||||||
|
projectOptions.value = [];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
projectOptions.value = data;
|
||||||
|
}
|
||||||
|
|
||||||
function getStatusLabel(statusCode: string) {
|
function getStatusLabel(statusCode: string) {
|
||||||
const item = statusOptions.value.find(opt => opt.value === statusCode);
|
const item = statusOptions.value.find(opt => opt.value === statusCode);
|
||||||
return item ? item.label : statusCode;
|
return item ? item.label : statusCode;
|
||||||
}
|
}
|
||||||
|
|
||||||
const priorityTagTypeMap: Record<number, UI.ThemeColor> = {
|
const priorityTagTypeMap: Record<number, UI.ThemeColor> = {
|
||||||
0: 'info',
|
0: 'danger',
|
||||||
1: 'primary',
|
1: 'warning',
|
||||||
2: 'warning',
|
2: 'primary',
|
||||||
3: 'danger'
|
3: 'info'
|
||||||
};
|
};
|
||||||
|
const hasDispatchedMap = ref<Record<string, boolean>>({});
|
||||||
|
|
||||||
function formatDateTime(value?: string | null) {
|
function formatDateTime(value?: string | null) {
|
||||||
if (!value) {
|
if (!value) {
|
||||||
@@ -89,21 +122,31 @@ function formatDateTime(value?: string | null) {
|
|||||||
return dayjs(value).format('YYYY-MM-DD HH:mm:ss');
|
return dayjs(value).format('YYYY-MM-DD HH:mm:ss');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatDate(value?: string | null) {
|
||||||
|
if (!value) {
|
||||||
|
return '--';
|
||||||
|
}
|
||||||
|
|
||||||
|
return dayjs(value).format('YYYY-MM-DD');
|
||||||
|
}
|
||||||
|
|
||||||
function isTerminalStatus(statusCode: string) {
|
function isTerminalStatus(statusCode: string) {
|
||||||
return terminalStatusOptions.value.some(option => option === statusCode);
|
return terminalStatusOptions.value.includes(statusCode);
|
||||||
}
|
}
|
||||||
|
|
||||||
function canSplitRequirement(row: Api.Product.Requirement) {
|
function canSplitRequirement(row: Api.Product.Requirement) {
|
||||||
|
if (row.implementProjectId) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
const hasDispatched = hasDispatchedMap.value[row.id];
|
||||||
|
if (hasDispatched) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
return row.statusCode === 'pending_dispatch' || row.statusCode === 'implementing';
|
return row.statusCode === 'pending_dispatch' || row.statusCode === 'implementing';
|
||||||
}
|
}
|
||||||
|
|
||||||
function canDeleteRequirement(row: Api.Product.Requirement) {
|
function canDeleteRequirement(row: Api.Product.Requirement) {
|
||||||
const allowedStatusCodes: Api.Product.RequirementStatusCode[] = [
|
const isStatusAllowed = canDeleteStatusHasValue(row.statusCode);
|
||||||
'pending_confirm',
|
|
||||||
'pending_review',
|
|
||||||
'pending_dispatch'
|
|
||||||
];
|
|
||||||
const isStatusAllowed = allowedStatusCodes.includes(row.statusCode);
|
|
||||||
const hasNoChildren = !row.children || row.children.length === 0;
|
const hasNoChildren = !row.children || row.children.length === 0;
|
||||||
return isStatusAllowed && hasNoChildren;
|
return isStatusAllowed && hasNoChildren;
|
||||||
}
|
}
|
||||||
@@ -188,12 +231,29 @@ function flattenTree(nodes: Api.Product.Requirement[]): Api.Product.Requirement[
|
|||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
|
|
||||||
function collectAllRequirementIds(nodes: Api.Product.Requirement[]): string[] {
|
function collectRequirementIdsForActions(nodes: Api.Product.Requirement[]): string[] {
|
||||||
const ids: string[] = [];
|
const ids: string[] = [];
|
||||||
for (const node of nodes) {
|
for (const node of nodes) {
|
||||||
ids.push(node.id);
|
const isTerminal = isTerminalStatus(node.statusCode);
|
||||||
|
const hasDispatched = Boolean(node.implementProjectId);
|
||||||
|
if (!isTerminal && !hasDispatched) {
|
||||||
|
ids.push(node.id);
|
||||||
|
}
|
||||||
if (node.children?.length) {
|
if (node.children?.length) {
|
||||||
ids.push(...collectAllRequirementIds(node.children));
|
ids.push(...collectRequirementIdsForActions(node.children));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return ids;
|
||||||
|
}
|
||||||
|
|
||||||
|
function collectRequirementIdsForSplitCheck(nodes: Api.Product.Requirement[]): string[] {
|
||||||
|
const ids: string[] = [];
|
||||||
|
for (const node of nodes) {
|
||||||
|
if (!node.implementProjectId) {
|
||||||
|
ids.push(node.id);
|
||||||
|
}
|
||||||
|
if (node.children?.length) {
|
||||||
|
ids.push(...collectRequirementIdsForSplitCheck(node.children));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return ids;
|
return ids;
|
||||||
@@ -205,23 +265,62 @@ async function loadAllowedTransitionsForAll() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const allIds = collectAllRequirementIds(treeData.value);
|
const idsToQuery = collectRequirementIdsForActions(treeData.value);
|
||||||
const newMap = new Map<string, Api.Product.RequirementLifecycleAction[]>();
|
const newMap = new Map<string, Api.Product.RequirementLifecycleAction[]>();
|
||||||
|
|
||||||
const results = await Promise.all(
|
if (idsToQuery.length === 0) {
|
||||||
allIds.map(async id => {
|
allowedTransitionsMap.value = newMap;
|
||||||
const { error, data } = await fetchGetRequirementAllowedTransitions(id, currentObjectId.value!);
|
return;
|
||||||
return { id, actions: error ? [] : data || [] };
|
}
|
||||||
})
|
|
||||||
);
|
|
||||||
|
|
||||||
for (const { id, actions } of results) {
|
const { error, data } = await fetchGetRequirementAllowedTransitionsBatch({
|
||||||
newMap.set(id, actions);
|
productId: currentObjectId.value,
|
||||||
|
requirementIds: idsToQuery
|
||||||
|
});
|
||||||
|
|
||||||
|
if (error || !data) {
|
||||||
|
allowedTransitionsMap.value = newMap;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const item of data) {
|
||||||
|
newMap.set(item.requirementId, item.transitions || []);
|
||||||
}
|
}
|
||||||
|
|
||||||
allowedTransitionsMap.value = newMap;
|
allowedTransitionsMap.value = newMap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadHasDispatchedForAll() {
|
||||||
|
if (!currentObjectId.value) {
|
||||||
|
hasDispatchedMap.value = {};
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const idsToQuery = collectRequirementIdsForSplitCheck(treeData.value);
|
||||||
|
const newMap: Record<string, boolean> = {};
|
||||||
|
|
||||||
|
if (idsToQuery.length === 0) {
|
||||||
|
hasDispatchedMap.value = newMap;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { error, data } = await fetchHasDispatchedProjectRequirementBatch({
|
||||||
|
productId: currentObjectId.value,
|
||||||
|
requirementIds: idsToQuery
|
||||||
|
});
|
||||||
|
|
||||||
|
if (error || !data) {
|
||||||
|
hasDispatchedMap.value = newMap;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const item of data) {
|
||||||
|
newMap[item.requirementId] = Boolean(item.hasDispatched);
|
||||||
|
}
|
||||||
|
|
||||||
|
hasDispatchedMap.value = newMap;
|
||||||
|
}
|
||||||
|
|
||||||
function getRowActions(row: Api.Product.Requirement): Api.Product.RequirementLifecycleAction[] {
|
function getRowActions(row: Api.Product.Requirement): Api.Product.RequirementLifecycleAction[] {
|
||||||
return allowedTransitionsMap.value.get(row.id) || [];
|
return allowedTransitionsMap.value.get(row.id) || [];
|
||||||
}
|
}
|
||||||
@@ -244,38 +343,22 @@ const columns = computed(() => [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'title',
|
prop: 'title',
|
||||||
label: '标题',
|
label: '需求名称',
|
||||||
minWidth: 200,
|
minWidth: 200,
|
||||||
formatter: (row: Api.Product.Requirement) => {
|
formatter: (row: Api.Product.Requirement) => {
|
||||||
const isTerminal = isTerminalStatus(row.statusCode);
|
|
||||||
const className = 'requirement-title';
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ElButton link type={isTerminal ? 'info' : 'primary'} class={className} onClick={() => openView(row)}>
|
<ElTooltip content={row.title} placement="top" show-after={300}>
|
||||||
{row.title}
|
<ElButton link type="primary" class="requirement-title" onClick={() => openView(row)}>
|
||||||
</ElButton>
|
{row.title}
|
||||||
|
</ElButton>
|
||||||
|
</ElTooltip>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
|
||||||
prop: 'category',
|
|
||||||
label: '分类',
|
|
||||||
minWidth: 120,
|
|
||||||
formatter: (row: Api.Product.Requirement) => row.category
|
|
||||||
},
|
|
||||||
// {
|
|
||||||
// prop: 'description',
|
|
||||||
// label: '描述',
|
|
||||||
// minWidth: 200,
|
|
||||||
// showOverflowTooltip: true,
|
|
||||||
// formatter: (row: Api.Product.Requirement) => {
|
|
||||||
// return row.description?.replace(/<[^>]+>/g, '').trim() || '--';
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
prop: 'priority',
|
prop: 'priority',
|
||||||
label: '优先级',
|
label: '优先级',
|
||||||
width: 100,
|
width: 75,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
formatter: (row: Api.Product.Requirement) => (
|
formatter: (row: Api.Product.Requirement) => (
|
||||||
<DictTag dictCode={RDMS_REQ_PRIORITY_DICT_CODE} value={row.priority} type={getPriorityTagType(row.priority)} />
|
<DictTag dictCode={RDMS_REQ_PRIORITY_DICT_CODE} value={row.priority} type={getPriorityTagType(row.priority)} />
|
||||||
@@ -284,18 +367,46 @@ const columns = computed(() => [
|
|||||||
{
|
{
|
||||||
prop: 'statusCode',
|
prop: 'statusCode',
|
||||||
label: '状态',
|
label: '状态',
|
||||||
width: 100,
|
width: 90,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
formatter: (row: Api.Product.Requirement) => (
|
formatter: (row: Api.Product.Requirement) => (
|
||||||
<ElTag type={getRequirementStatusTagType(row.statusCode)}>
|
<ElTag type={getRequirementStatusTagType(row.statusCode)}>{getStatusLabel(row.statusCode)}</ElTag>
|
||||||
{getStatusLabel(row.statusCode)}
|
|
||||||
</ElTag>
|
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
prop: 'category',
|
||||||
|
label: '需求类型',
|
||||||
|
minWidth: 100,
|
||||||
|
formatter: (row: Api.Product.Requirement) => row.category
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'sourceType',
|
||||||
|
label: '需求来源',
|
||||||
|
minWidth: 100,
|
||||||
|
align: 'center',
|
||||||
|
formatter: (row: Api.Product.Requirement) => (
|
||||||
|
<DictText dictCode={RDMS_REQ_SOURCE_TYPE_DICT_CODE} value={row.sourceType} />
|
||||||
|
)
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// prop: 'description',
|
||||||
|
// label: '内容',
|
||||||
|
// minWidth: 200,
|
||||||
|
// showOverflowTooltip: true,
|
||||||
|
// formatter: (row: Api.Product.Requirement) => {
|
||||||
|
// return row.description?.replace(/<[^>]+>/g, '').trim() || '--';
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
prop: 'proposerNickname',
|
||||||
|
label: '提出人',
|
||||||
|
minWidth: 85,
|
||||||
|
formatter: (row: Api.Product.Requirement) => row.proposerNickname || '--'
|
||||||
|
},
|
||||||
{
|
{
|
||||||
prop: 'currentHandlerUserId',
|
prop: 'currentHandlerUserId',
|
||||||
label: '负责人',
|
label: '负责人',
|
||||||
minWidth: 70,
|
minWidth: 85,
|
||||||
formatter: (row: Api.Product.Requirement) => getMemberLabel(row.currentHandlerUserId)
|
formatter: (row: Api.Product.Requirement) => getMemberLabel(row.currentHandlerUserId)
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -315,15 +426,25 @@ const columns = computed(() => [
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'implementProjectName',
|
prop: 'implementProjectId',
|
||||||
label: '实现项目',
|
label: '关联项目',
|
||||||
minWidth: 140,
|
minWidth: 180,
|
||||||
formatter: (row: Api.Product.Requirement) => row.implementProjectName || '--'
|
formatter: (row: Api.Product.Requirement) => {
|
||||||
|
if (!row.implementProjectId) return '--';
|
||||||
|
return projectNameMap.value.get(row.implementProjectId) || row.implementProjectName || '--';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'expectedTime',
|
||||||
|
label: '预期完成时间',
|
||||||
|
minWidth: 120,
|
||||||
|
align: 'center',
|
||||||
|
formatter: (row: Api.Product.Requirement) => formatDate(row.expectedTime)
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
label: '创建时间',
|
label: '创建时间',
|
||||||
width: 170,
|
minWidth: 120,
|
||||||
formatter: (row: Api.Product.Requirement) => formatDateTime(row.createTime)
|
formatter: (row: Api.Product.Requirement) => formatDateTime(row.createTime)
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -336,30 +457,45 @@ const columns = computed(() => [
|
|||||||
const actions: {
|
const actions: {
|
||||||
key: string;
|
key: string;
|
||||||
label: string;
|
label: string;
|
||||||
buttonType?: 'primary' | 'success' | 'warning' | 'danger' | 'info';
|
icon: object;
|
||||||
|
type: 'primary' | 'success' | 'danger';
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
onClick: () => void;
|
onClick: () => void;
|
||||||
}[] = [];
|
}[] = [];
|
||||||
|
|
||||||
if (canSplitRequirement(row) && hasObjectAuth('project:product:status')) {
|
if (hasObjectAuth('project:product:split')) {
|
||||||
actions.push({
|
actions.push({
|
||||||
key: 'split',
|
key: 'split',
|
||||||
label: '拆分',
|
label: '拆分',
|
||||||
buttonType: 'primary',
|
icon: ACTION_ICON_MAP.split,
|
||||||
|
type: ACTION_TYPE_MAP.split,
|
||||||
|
disabled: !canSplitRequirement(row),
|
||||||
onClick: () => openSplit(row)
|
onClick: () => openSplit(row)
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (hasObjectAuth('project:product:update')) {
|
if (hasObjectAuth('project:product:update')) {
|
||||||
|
const canEdit = !isTerminalStatus(row.statusCode) && row.statusCode !== 'accepted' && !row.implementProjectId;
|
||||||
actions.push({
|
actions.push({
|
||||||
key: 'edit',
|
key: 'edit',
|
||||||
label: '编辑',
|
label: '编辑',
|
||||||
buttonType: 'info',
|
icon: ACTION_ICON_MAP.edit,
|
||||||
disabled: isTerminalStatus(row.statusCode),
|
type: ACTION_TYPE_MAP.edit,
|
||||||
|
disabled: !canEdit,
|
||||||
onClick: () => openEdit(row)
|
onClick: () => openEdit(row)
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (row.implementProjectId) {
|
||||||
|
actions.push({
|
||||||
|
key: 'forward',
|
||||||
|
label: '前往项目侧',
|
||||||
|
icon: ACTION_ICON_MAP.forward,
|
||||||
|
type: 'primary',
|
||||||
|
onClick: () => handleForwardToProjectRequirement(row)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
const lifecycleActions = getRowActions(row);
|
const lifecycleActions = getRowActions(row);
|
||||||
const hasStatusAuth = hasObjectAuth('project:product:status');
|
const hasStatusAuth = hasObjectAuth('project:product:status');
|
||||||
|
|
||||||
@@ -380,26 +516,77 @@ const columns = computed(() => [
|
|||||||
actions.push({
|
actions.push({
|
||||||
key: `action-${action.actionCode}`,
|
key: `action-${action.actionCode}`,
|
||||||
label: getRequirementActionDisplayName(action),
|
label: getRequirementActionDisplayName(action),
|
||||||
buttonType: getRequirementActionTagType(action.actionCode as RequirementStatusActionCode),
|
icon: ACTION_ICON_MAP[action.actionCode] ?? markRaw(IconMdiSync),
|
||||||
|
type: ACTION_TYPE_MAP[action.actionCode] ?? 'primary',
|
||||||
onClick: () => handleActionClick(row, action)
|
onClick: () => handleActionClick(row, action)
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (hasStatusAuth && canDeleteRequirement(row)) {
|
if (canDeleteRequirement(row) && hasObjectAuth('project:product:delete')) {
|
||||||
actions.push({
|
actions.push({
|
||||||
key: 'delete',
|
key: 'delete',
|
||||||
label: '删除',
|
label: '删除',
|
||||||
buttonType: 'danger',
|
icon: ACTION_ICON_MAP.delete,
|
||||||
|
type: ACTION_TYPE_MAP.delete,
|
||||||
onClick: () => handleDelete(row)
|
onClick: () => handleDelete(row)
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
return <BusinessTableActionCell actions={actions} />;
|
return (
|
||||||
|
<div class="requirement-action-cell" onClick={event => event.stopPropagation()}>
|
||||||
|
{actions.map(action => {
|
||||||
|
const IconComponent = action.icon as any;
|
||||||
|
return (
|
||||||
|
<ElTooltip key={action.key} content={action.label} placement="top">
|
||||||
|
<ElButton
|
||||||
|
link
|
||||||
|
size="small"
|
||||||
|
class="requirement-action-icon-btn"
|
||||||
|
type={action.type}
|
||||||
|
disabled={action.disabled}
|
||||||
|
onClick={() => action.onClick()}
|
||||||
|
>
|
||||||
|
<IconComponent class="text-18px" />
|
||||||
|
</ElButton>
|
||||||
|
</ElTooltip>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
const columnChecks = ref<UI.TableColumnCheck[]>([]);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => columns.value,
|
||||||
|
cols => {
|
||||||
|
const existingMap = new Map(columnChecks.value.map(c => [c.prop, c.checked]));
|
||||||
|
columnChecks.value = cols
|
||||||
|
.filter(col => col.prop && col.prop !== 'operate')
|
||||||
|
.map(col => ({
|
||||||
|
prop: String(col.prop),
|
||||||
|
label: String(col.label || ''),
|
||||||
|
checked: existingMap.has(String(col.prop)) ? existingMap.get(String(col.prop))! : true,
|
||||||
|
visible: true
|
||||||
|
}));
|
||||||
|
},
|
||||||
|
{ immediate: true }
|
||||||
|
);
|
||||||
|
|
||||||
|
const visibleColumns = computed(() => {
|
||||||
|
if (columnChecks.value.length === 0) return columns.value;
|
||||||
|
const visibleSet = new Set(columnChecks.value.filter(c => c.checked).map(c => c.prop));
|
||||||
|
return columns.value.filter(col => {
|
||||||
|
const prop = String(col.prop || '');
|
||||||
|
if (!prop) return true;
|
||||||
|
if (prop === 'operate') return true;
|
||||||
|
return visibleSet.has(prop);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
async function loadMembers() {
|
async function loadMembers() {
|
||||||
if (!currentObjectId.value) {
|
if (!currentObjectId.value) {
|
||||||
memberOptions.value = [];
|
memberOptions.value = [];
|
||||||
@@ -423,8 +610,6 @@ async function loadTreeData() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
loading.value = true;
|
|
||||||
|
|
||||||
const { error, data } = await fetchGetRequirementTree({
|
const { error, data } = await fetchGetRequirementTree({
|
||||||
productId: currentObjectId.value,
|
productId: currentObjectId.value,
|
||||||
moduleId: selectedModuleId.value,
|
moduleId: selectedModuleId.value,
|
||||||
@@ -438,8 +623,6 @@ async function loadTreeData() {
|
|||||||
sourceType: searchParams.sourceType
|
sourceType: searchParams.sourceType
|
||||||
});
|
});
|
||||||
|
|
||||||
loading.value = false;
|
|
||||||
|
|
||||||
if (error || !data) {
|
if (error || !data) {
|
||||||
treeData.value = [];
|
treeData.value = [];
|
||||||
pagination.total = 0;
|
pagination.total = 0;
|
||||||
@@ -451,8 +634,13 @@ async function loadTreeData() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function reloadTable() {
|
async function reloadTable() {
|
||||||
await loadTreeData();
|
loading.value = true;
|
||||||
await loadAllowedTransitionsForAll();
|
try {
|
||||||
|
await loadTreeData();
|
||||||
|
await Promise.all([loadAllowedTransitionsForAll(), loadHasDispatchedForAll()]);
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleModuleSelect(moduleId: string | undefined) {
|
function handleModuleSelect(moduleId: string | undefined) {
|
||||||
@@ -510,6 +698,17 @@ function openSplit(row: Api.Product.Requirement) {
|
|||||||
splitVisible.value = true;
|
splitVisible.value = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function handleForwardToProjectRequirement(row: Api.Product.Requirement) {
|
||||||
|
if (!row.implementProjectId) return;
|
||||||
|
|
||||||
|
await router.replace({
|
||||||
|
path: '/project/project/requirement',
|
||||||
|
query: {
|
||||||
|
objectId: row.implementProjectId
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function handleActionClick(row: Api.Product.Requirement, action: Api.Product.RequirementLifecycleAction) {
|
function handleActionClick(row: Api.Product.Requirement, action: Api.Product.RequirementLifecycleAction) {
|
||||||
const actionCode = action.actionCode as RequirementStatusActionCode;
|
const actionCode = action.actionCode as RequirementStatusActionCode;
|
||||||
|
|
||||||
@@ -619,11 +818,12 @@ watch(
|
|||||||
() => currentObjectId.value,
|
() => currentObjectId.value,
|
||||||
async id => {
|
async id => {
|
||||||
if (id) {
|
if (id) {
|
||||||
await Promise.all([loadMembers(), loadTreeData()]);
|
await Promise.all([loadMembers(), loadTreeData(), loadProjectOptions()]);
|
||||||
await loadAllowedTransitionsForAll();
|
await Promise.all([loadAllowedTransitionsForAll(), loadHasDispatchedForAll()]);
|
||||||
} else {
|
} else {
|
||||||
memberOptions.value = [];
|
memberOptions.value = [];
|
||||||
treeData.value = [];
|
treeData.value = [];
|
||||||
|
projectOptions.value = [];
|
||||||
allowedTransitionsMap.value = new Map();
|
allowedTransitionsMap.value = new Map();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -660,7 +860,7 @@ onMounted(async () => {
|
|||||||
<p>需求列表</p>
|
<p>需求列表</p>
|
||||||
<ElTag effect="plain">{{ pagination.total }} 条</ElTag>
|
<ElTag effect="plain">{{ pagination.total }} 条</ElTag>
|
||||||
</div>
|
</div>
|
||||||
<TableHeaderOperation :loading="loading" @refresh="reloadTable">
|
<TableHeaderOperation v-model:columns="columnChecks" :loading="loading" @refresh="reloadTable">
|
||||||
<template #default>
|
<template #default>
|
||||||
<ElButton
|
<ElButton
|
||||||
v-auth="{ code: 'project:product:create', source: 'object' }"
|
v-auth="{ code: 'project:product:create', source: 'object' }"
|
||||||
@@ -690,7 +890,7 @@ onMounted(async () => {
|
|||||||
:data="treeData"
|
:data="treeData"
|
||||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
||||||
>
|
>
|
||||||
<ElTableColumn v-for="col in columns" :key="String(col.prop || 'index')" v-bind="col" />
|
<ElTableColumn v-for="col in visibleColumns" :key="String(col.prop || 'index')" v-bind="col" />
|
||||||
|
|
||||||
<template #empty>
|
<template #empty>
|
||||||
<ElEmpty description="当前模块下暂无需求" />
|
<ElEmpty description="当前模块下暂无需求" />
|
||||||
@@ -747,6 +947,7 @@ onMounted(async () => {
|
|||||||
v-model:visible="actionVisible"
|
v-model:visible="actionVisible"
|
||||||
:action="currentAction"
|
:action="currentAction"
|
||||||
:requirement-title="actionRequirement?.title || ''"
|
:requirement-title="actionRequirement?.title || ''"
|
||||||
|
:project-options="projectOptions"
|
||||||
@submitted="handleActionSubmitted"
|
@submitted="handleActionSubmitted"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -762,6 +963,10 @@ onMounted(async () => {
|
|||||||
:deep(.requirement-title) {
|
:deep(.requirement-title) {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
max-width: 180px;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.requirement-title--terminal) {
|
:deep(.requirement-title--terminal) {
|
||||||
@@ -777,4 +982,20 @@ onMounted(async () => {
|
|||||||
:deep(.el-table__row[class*='el-table__row--level-']:not(.el-table__row--level-0) td:first-child .cell) {
|
:deep(.el-table__row[class*='el-table__row--level-']:not(.el-table__row--level-0) td:first-child .cell) {
|
||||||
color: transparent;
|
color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:deep(.requirement-action-cell) {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.requirement-action-icon-btn) {
|
||||||
|
padding: 1px;
|
||||||
|
height: auto;
|
||||||
|
min-width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.requirement-action-icon-btn:hover) {
|
||||||
|
background-color: var(--el-fill-color-light);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed } from 'vue';
|
import { type Ref, computed, inject, ref } from 'vue';
|
||||||
|
import { useAuth } from '@/hooks/business/auth';
|
||||||
|
|
||||||
defineOptions({ name: 'ModuleTreeNode' });
|
defineOptions({ name: 'ModuleTreeNode' });
|
||||||
|
|
||||||
@@ -32,15 +33,30 @@ const emit = defineEmits([
|
|||||||
'updateNewChildModuleName'
|
'updateNewChildModuleName'
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
const { hasObjectAuth } = useAuth();
|
||||||
const isRootModule = computed(() => props.module.id === props.rootModuleId);
|
const isRootModule = computed(() => props.module.id === props.rootModuleId);
|
||||||
|
|
||||||
|
const hasAnyActionPermission = computed(() => {
|
||||||
|
if (isRootModule.value) {
|
||||||
|
return hasObjectAuth('project:product:create');
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
hasObjectAuth('project:product:create') ||
|
||||||
|
hasObjectAuth('project:product:update') ||
|
||||||
|
hasObjectAuth('project:product:delete')
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
const collapsedModuleIds = inject<Ref<Set<string>>>('collapsedModuleIds', ref(new Set()));
|
||||||
|
const toggleCollapse = inject<(id: string) => void>('toggleCollapse', () => {});
|
||||||
|
|
||||||
const isSelected = computed(() => props.selectedModuleId === props.module.id);
|
const isSelected = computed(() => props.selectedModuleId === props.module.id);
|
||||||
|
|
||||||
const isEditing = computed(() => props.editingNodeId === props.module.id);
|
const isEditing = computed(() => props.editingNodeId === props.module.id);
|
||||||
|
|
||||||
const isAddingChild = computed(() => props.addingChildParentId === props.module.id);
|
const isAddingChild = computed(() => props.addingChildParentId === props.module.id);
|
||||||
|
|
||||||
const hasChildren = computed(() => props.module.children && props.module.children.length > 0);
|
const hasChildren = computed(() => props.module.children && props.module.children.length > 0);
|
||||||
|
const isCollapsed = computed(() =>
|
||||||
|
hasChildren.value && props.module.id ? collapsedModuleIds.value.has(props.module.id) : false
|
||||||
|
);
|
||||||
|
|
||||||
const hasRequirements = computed(() => {
|
const hasRequirements = computed(() => {
|
||||||
const moduleId = props.module.id;
|
const moduleId = props.module.id;
|
||||||
@@ -91,6 +107,12 @@ function handleAddChildConfirm() {
|
|||||||
function handleAddChildCancel() {
|
function handleAddChildCancel() {
|
||||||
emit('addChildCancel');
|
emit('addChildCancel');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function handleToggle() {
|
||||||
|
if (props.module.id) {
|
||||||
|
toggleCollapse(props.module.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -105,12 +127,21 @@ function handleAddChildCancel() {
|
|||||||
:style="indentStyle"
|
:style="indentStyle"
|
||||||
@click="handleClick"
|
@click="handleClick"
|
||||||
>
|
>
|
||||||
|
<div
|
||||||
|
class="module-tree-item__toggle"
|
||||||
|
:class="{ 'is-expanded': hasChildren && !isCollapsed }"
|
||||||
|
@click.stop="handleToggle"
|
||||||
|
>
|
||||||
|
<icon-ic-round-chevron-right v-if="hasChildren" class="text-14px" />
|
||||||
|
</div>
|
||||||
<div class="module-tree-item__icon">
|
<div class="module-tree-item__icon">
|
||||||
<icon-mdi-folder-open v-if="isRootModule" class="text-16px" />
|
<icon-mdi-folder-open v-if="isRootModule" class="text-16px" />
|
||||||
<icon-mdi-folder-outline v-else class="text-16px" />
|
<icon-mdi-folder-outline v-else class="text-16px" />
|
||||||
</div>
|
</div>
|
||||||
<div class="module-tree-item__content">
|
<div class="module-tree-item__content">
|
||||||
<span v-if="!isEditing" class="module-tree-item__label">{{ module.moduleName }}</span>
|
<ElTooltip v-if="!isEditing" :content="module.moduleName" placement="top" :show-after="500">
|
||||||
|
<span class="module-tree-item__label">{{ module.moduleName }}</span>
|
||||||
|
</ElTooltip>
|
||||||
<ElInput
|
<ElInput
|
||||||
v-else
|
v-else
|
||||||
:model-value="editingName"
|
:model-value="editingName"
|
||||||
@@ -124,31 +155,27 @@ function handleAddChildCancel() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="!isRootModule && !isEditing" class="module-tree-item__actions">
|
<div v-if="!isEditing && hasAnyActionPermission" class="module-tree-item__actions" @click.stop>
|
||||||
<ElDropdown trigger="click">
|
<ElDropdown trigger="click">
|
||||||
<ElButton text size="small" class="module-tree-item__more-btn">
|
<ElButton text size="small" class="module-tree-item__more-btn">
|
||||||
<icon-mdi-dots-horizontal class="text-14px" />
|
<icon-mdi-dots-horizontal class="text-14px" />
|
||||||
</ElButton>
|
</ElButton>
|
||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<ElDropdownMenu>
|
<ElDropdownMenu>
|
||||||
<ElDropdownItem
|
<ElDropdownItem v-if="hasObjectAuth('project:product:create')" @click="handleStartAddChild">
|
||||||
v-auth="{ code: 'project:product:create', source: 'object' }"
|
|
||||||
@click="handleStartAddChild"
|
|
||||||
>
|
|
||||||
<div class="flex items-center gap-6px">
|
<div class="flex items-center gap-6px">
|
||||||
<icon-ic-round-plus class="text-14px" />
|
<icon-ic-round-plus class="text-14px" />
|
||||||
<span>新增子模块</span>
|
<span>新增子模块</span>
|
||||||
</div>
|
</div>
|
||||||
</ElDropdownItem>
|
</ElDropdownItem>
|
||||||
<ElDropdownItem v-auth="{ code: 'project:product:update', source: 'object' }" @click="handleStartEdit">
|
<ElDropdownItem v-if="!isRootModule && hasObjectAuth('project:product:update')" @click="handleStartEdit">
|
||||||
<div class="flex items-center gap-6px">
|
<div class="flex items-center gap-6px">
|
||||||
<icon-mdi-pencil-outline class="text-14px" />
|
<icon-mdi-pencil-outline class="text-14px" />
|
||||||
<span>编辑</span>
|
<span>编辑</span>
|
||||||
</div>
|
</div>
|
||||||
</ElDropdownItem>
|
</ElDropdownItem>
|
||||||
<ElDropdownItem
|
<ElDropdownItem
|
||||||
v-if="canDeleteModule"
|
v-if="!isRootModule && canDeleteModule && hasObjectAuth('project:product:delete')"
|
||||||
v-auth="{ code: 'project:product:delete', source: 'object' }"
|
|
||||||
divided
|
divided
|
||||||
@click="handleDelete"
|
@click="handleDelete"
|
||||||
>
|
>
|
||||||
@@ -163,7 +190,7 @@ function handleAddChildCancel() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template v-if="hasChildren">
|
<template v-if="hasChildren && !isCollapsed">
|
||||||
<ModuleTreeNode
|
<ModuleTreeNode
|
||||||
v-for="child in module.children"
|
v-for="child in module.children"
|
||||||
:key="child.id"
|
:key="child.id"
|
||||||
@@ -220,54 +247,110 @@ function handleAddChildCancel() {
|
|||||||
.module-tree-node {
|
.module-tree-node {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item {
|
.module-tree-item {
|
||||||
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 10px;
|
gap: 8px;
|
||||||
min-height: 42px;
|
min-height: 36px;
|
||||||
padding: 0 14px;
|
padding: 6px 12px;
|
||||||
border: 1px solid rgb(226 232 240 / 92%);
|
padding-left: 16px;
|
||||||
border-radius: 14px;
|
border-radius: 8px;
|
||||||
background-color: rgb(248 250 252 / 96%);
|
color: #475569;
|
||||||
color: rgb(71 85 105 / 94%);
|
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition:
|
transition:
|
||||||
border-color 0.2s ease,
|
background-color 0.15s ease,
|
||||||
background-color 0.2s ease,
|
color 0.15s ease;
|
||||||
color 0.2s ease,
|
}
|
||||||
transform 0.2s ease;
|
|
||||||
|
.module-tree-item::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
width: 3px;
|
||||||
|
height: 0;
|
||||||
|
border-radius: 0 2px 2px 0;
|
||||||
|
background-color: transparent;
|
||||||
|
transition:
|
||||||
|
height 0.15s ease,
|
||||||
|
background-color 0.15s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item:hover {
|
.module-tree-item:hover {
|
||||||
transform: translateY(-1px);
|
background-color: #f1f5f9;
|
||||||
border-color: rgb(148 163 184 / 56%);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item.is-active {
|
.module-tree-item.is-active {
|
||||||
border-color: rgb(13 148 136 / 42%);
|
background-color: #f0fdfa;
|
||||||
background-color: rgb(240 253 250 / 98%);
|
color: #0d9488;
|
||||||
color: rgb(15 118 110 / 96%);
|
font-weight: 500;
|
||||||
font-weight: 600;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item.is-root:not(.is-active) .module-tree-item__icon {
|
.module-tree-item.is-active::before {
|
||||||
color: rgb(13 148 136 / 80%);
|
height: 60%;
|
||||||
|
background-color: #14b8a6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item.is-root {
|
||||||
|
font-weight: 600;
|
||||||
|
color: #1e293b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item.is-root:hover {
|
||||||
|
background-color: #f8fafc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item.is-root.is-active {
|
||||||
|
background-color: #f0fdfa;
|
||||||
|
color: #0d9488;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item--new {
|
.module-tree-item--new {
|
||||||
border-style: dashed;
|
border: 1px dashed #cbd5e1;
|
||||||
border-color: rgb(148 163 184 / 56%);
|
background-color: #f8fafc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item--new:hover {
|
||||||
|
background-color: #f1f5f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item__toggle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
transition: transform 0.2s ease;
|
||||||
|
color: #94a3b8;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item__toggle:hover {
|
||||||
|
background-color: #e2e8f0;
|
||||||
|
color: #64748b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item__toggle.is-expanded svg {
|
||||||
|
transform: rotate(90deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item__icon {
|
.module-tree-item__icon {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
color: rgb(100 116 139 / 80%);
|
color: #94a3b8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item.is-active .module-tree-item__icon {
|
||||||
|
color: #14b8a6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item__content {
|
.module-tree-item__content {
|
||||||
@@ -288,7 +371,7 @@ function handleAddChildCancel() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item__input :deep(.el-input__inner) {
|
.module-tree-item__input :deep(.el-input__inner) {
|
||||||
height: 28px;
|
height: 26px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item__actions {
|
.module-tree-item__actions {
|
||||||
@@ -296,7 +379,7 @@ function handleAddChildCancel() {
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: opacity 0.2s ease;
|
transition: opacity 0.15s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item:hover .module-tree-item__actions {
|
.module-tree-item:hover .module-tree-item__actions {
|
||||||
@@ -309,5 +392,10 @@ function handleAddChildCancel() {
|
|||||||
|
|
||||||
.module-tree-item__more-btn {
|
.module-tree-item__more-btn {
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.module-tree-item__more-btn:hover {
|
||||||
|
background-color: #e2e8f0;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ defineOptions({ name: 'RequirementActionDialog' });
|
|||||||
interface Props {
|
interface Props {
|
||||||
action: Api.Product.RequirementLifecycleAction | null;
|
action: Api.Product.RequirementLifecycleAction | null;
|
||||||
requirementTitle: string;
|
requirementTitle: string;
|
||||||
|
projectOptions: Api.Project.Project[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = defineProps<Props>();
|
const props = defineProps<Props>();
|
||||||
@@ -57,8 +58,6 @@ const reviewChoiceOptions = [
|
|||||||
{ label: '不需要评审', value: 'claim_to_dispatch', description: '认领后直接进入分流' }
|
{ label: '不需要评审', value: 'claim_to_dispatch', description: '认领后直接进入分流' }
|
||||||
];
|
];
|
||||||
|
|
||||||
const projectOptions = [{ label: 'NPQS-10086', value: '202642910086' }];
|
|
||||||
|
|
||||||
const rules = computed(() => {
|
const rules = computed(() => {
|
||||||
const baseRules: Record<string, App.Global.FormRule[]> = {};
|
const baseRules: Record<string, App.Global.FormRule[]> = {};
|
||||||
|
|
||||||
@@ -67,7 +66,7 @@ const rules = computed(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (isDispatchAction.value) {
|
if (isDispatchAction.value) {
|
||||||
baseRules.implementProjectId = [createRequiredRule('请选择实现项目')];
|
baseRules.implementProjectId = [createRequiredRule('请选择关联项目')];
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isTerminalAction.value) {
|
if (isTerminalAction.value) {
|
||||||
@@ -117,11 +116,15 @@ async function handleSubmit() {
|
|||||||
:confirm-loading="submitting"
|
:confirm-loading="submitting"
|
||||||
@confirm="handleSubmit"
|
@confirm="handleSubmit"
|
||||||
>
|
>
|
||||||
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
<ElAlert
|
||||||
<ElFormItem label="需求标题">
|
v-if="requirementTitle"
|
||||||
<span class="text-14px">{{ requirementTitle }}</span>
|
:title="`需求名称:${requirementTitle}`"
|
||||||
</ElFormItem>
|
type="info"
|
||||||
|
:closable="false"
|
||||||
|
class="mb-16px"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
||||||
<ElFormItem v-if="isClaimAction" label="是否需要评审" prop="reviewChoice">
|
<ElFormItem v-if="isClaimAction" label="是否需要评审" prop="reviewChoice">
|
||||||
<ElRadioGroup v-model="model.reviewChoice" class="business-form-radio-group">
|
<ElRadioGroup v-model="model.reviewChoice" class="business-form-radio-group">
|
||||||
<ElRadio v-for="option in reviewChoiceOptions" :key="option.value" :value="option.value">
|
<ElRadio v-for="option in reviewChoiceOptions" :key="option.value" :value="option.value">
|
||||||
@@ -133,9 +136,9 @@ async function handleSubmit() {
|
|||||||
</ElRadioGroup>
|
</ElRadioGroup>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
|
|
||||||
<ElFormItem v-if="isDispatchAction" label="实现项目" prop="implementProjectId">
|
<ElFormItem v-if="isDispatchAction" label="关联项目" prop="implementProjectId">
|
||||||
<ElSelect v-model="model.implementProjectId" class="w-full" filterable placeholder="请选择实现项目(必选)">
|
<ElSelect v-model="model.implementProjectId" class="w-full" filterable placeholder="请选择关联项目(必选)">
|
||||||
<ElOption v-for="item in projectOptions" :key="item.value" :label="item.label" :value="item.value" />
|
<ElOption v-for="item in projectOptions" :key="item.id" :label="item.projectName" :value="item.id" />
|
||||||
</ElSelect>
|
</ElSelect>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
|
|
||||||
|
|||||||
@@ -1,9 +1,14 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, nextTick, ref, watch } from 'vue';
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { useResizeObserver } from '@vueuse/core';
|
||||||
|
import dayjs from 'dayjs';
|
||||||
import { fetchCreateRequirement, fetchGetRequirementModuleTree } from '@/service/api';
|
import { fetchCreateRequirement, fetchGetRequirementModuleTree } from '@/service/api';
|
||||||
import { useForm, useFormRules } from '@/hooks/common/form';
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
import { useDict } from '@/hooks/business/dict';
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import BusinessAttachmentUploader from '@/components/custom/business-attachment-uploader.vue';
|
||||||
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
|
import BusinessFormSection from '@/components/custom/business-form-section.vue';
|
||||||
|
import BusinessRichTextEditor from '@/components/custom/business-rich-text-editor.vue';
|
||||||
import DictSelect from '@/components/custom/dict-select.vue';
|
import DictSelect from '@/components/custom/dict-select.vue';
|
||||||
import MemberSelectOption from './member-select-option.vue';
|
import MemberSelectOption from './member-select-option.vue';
|
||||||
|
|
||||||
@@ -31,9 +36,11 @@ const visible = defineModel<boolean>('visible', {
|
|||||||
|
|
||||||
const { formRef, validate } = useForm();
|
const { formRef, validate } = useForm();
|
||||||
const { createRequiredRule } = useFormRules();
|
const { createRequiredRule } = useFormRules();
|
||||||
|
|
||||||
const { enabledDictData: priorityDictData } = useDict(() => props.priorityDictCode);
|
const { enabledDictData: priorityDictData } = useDict(() => props.priorityDictCode);
|
||||||
|
|
||||||
|
const attachmentUploaderRef = ref<InstanceType<typeof BusinessAttachmentUploader> | null>(null);
|
||||||
|
const richTextEditorRef = ref<InstanceType<typeof BusinessRichTextEditor> | null>(null);
|
||||||
|
|
||||||
const priorityOptions = computed(() => {
|
const priorityOptions = computed(() => {
|
||||||
return priorityDictData.value.map(item => ({
|
return priorityDictData.value.map(item => ({
|
||||||
label: item.label,
|
label: item.label,
|
||||||
@@ -41,14 +48,40 @@ const priorityOptions = computed(() => {
|
|||||||
}));
|
}));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const reviewRequiredOptions = [
|
||||||
|
{ label: '不需要', value: 0 },
|
||||||
|
{ label: '需要', value: 1 }
|
||||||
|
];
|
||||||
|
|
||||||
|
function buildExpectedTimeShortcut(text: string, mutator: (date: Date) => void) {
|
||||||
|
return {
|
||||||
|
text,
|
||||||
|
value: () => {
|
||||||
|
const date = new Date();
|
||||||
|
mutator(date);
|
||||||
|
return date;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const expectedTimeShortcuts = [
|
||||||
|
buildExpectedTimeShortcut('一星期', date => date.setDate(date.getDate() + 7)),
|
||||||
|
buildExpectedTimeShortcut('两星期', date => date.setDate(date.getDate() + 14)),
|
||||||
|
buildExpectedTimeShortcut('一个月', date => date.setMonth(date.getMonth() + 1)),
|
||||||
|
buildExpectedTimeShortcut('三个月', date => date.setMonth(date.getMonth() + 3)),
|
||||||
|
buildExpectedTimeShortcut('半年', date => date.setMonth(date.getMonth() + 6)),
|
||||||
|
buildExpectedTimeShortcut('一年', date => date.setFullYear(date.getFullYear() + 1))
|
||||||
|
];
|
||||||
|
|
||||||
interface Model {
|
interface Model {
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string | null;
|
||||||
|
attachments: Api.Project.AttachmentItem[];
|
||||||
reviewRequired: number;
|
reviewRequired: number;
|
||||||
completionDate: string;
|
|
||||||
moduleId: string;
|
moduleId: string;
|
||||||
category: string;
|
category: string;
|
||||||
priority: number | null;
|
priority: number | null;
|
||||||
|
expectedTime: string | null;
|
||||||
proposerId: string;
|
proposerId: string;
|
||||||
currentHandlerUserId: string;
|
currentHandlerUserId: string;
|
||||||
sort: number;
|
sort: number;
|
||||||
@@ -57,52 +90,89 @@ interface Model {
|
|||||||
const submitting = ref(false);
|
const submitting = ref(false);
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const moduleTree = ref<Api.Product.RequirementModule[]>([]);
|
const moduleTree = ref<Api.Product.RequirementModule[]>([]);
|
||||||
|
|
||||||
const model = ref<Model>(createDefaultModel());
|
const model = ref<Model>(createDefaultModel());
|
||||||
|
|
||||||
const memberUserOptions = computed(() => {
|
const memberUserOptions = computed(() => {
|
||||||
return props.memberOptions.filter(m => m.status === 0);
|
return props.memberOptions.filter(m => m.status === 0);
|
||||||
});
|
});
|
||||||
|
|
||||||
const moduleTreeProps = {
|
const flatModuleOptions = computed<Array<{ label: string; value: string }>>(() => {
|
||||||
label: 'moduleName',
|
const options: Array<{ label: string; value: string }> = [];
|
||||||
value: 'id',
|
|
||||||
children: 'children'
|
|
||||||
};
|
|
||||||
|
|
||||||
const reviewRequiredOptions = [
|
function walk(modules: Api.Product.RequirementModule[], parentPath: string) {
|
||||||
{ label: '不需要', value: 0 },
|
for (const module of modules) {
|
||||||
{ label: '需要', value: 1 }
|
const currentPath = `${parentPath}/${module.moduleName}`;
|
||||||
];
|
options.push({
|
||||||
|
label: currentPath,
|
||||||
|
value: module.id || ''
|
||||||
|
});
|
||||||
|
if (module.children?.length) {
|
||||||
|
walk(module.children, currentPath);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (moduleTree.value.length > 0) {
|
||||||
|
walk(moduleTree.value, '');
|
||||||
|
}
|
||||||
|
|
||||||
|
return options;
|
||||||
|
});
|
||||||
|
|
||||||
const rules = {
|
const rules = {
|
||||||
title: [createRequiredRule('请输入需求标题')],
|
title: [createRequiredRule('请输入需求名称')],
|
||||||
category: [createRequiredRule('请选择分类')],
|
category: [createRequiredRule('请选择需求类型')],
|
||||||
priority: [createRequiredRule('请选择优先级')],
|
priority: [createRequiredRule('请选择优先级')],
|
||||||
proposerId: [createRequiredRule('请选择提出人')],
|
proposerId: [createRequiredRule('请选择提出人')],
|
||||||
currentHandlerUserId: [createRequiredRule('请选择负责人')],
|
currentHandlerUserId: [createRequiredRule('请选择负责人')]
|
||||||
completionDate: [createRequiredRule('请选择预期完成时间')]
|
|
||||||
} satisfies Record<string, App.Global.FormRule[]>;
|
} satisfies Record<string, App.Global.FormRule[]>;
|
||||||
|
|
||||||
|
const leftColRef = ref<HTMLElement>();
|
||||||
|
const editorHeight = ref<string>('45vh');
|
||||||
|
|
||||||
|
const ATTACHMENT_SECTION_RESERVE_PX = 140;
|
||||||
|
|
||||||
|
useResizeObserver(leftColRef, entries => {
|
||||||
|
const height = entries[0]?.contentRect.height;
|
||||||
|
|
||||||
|
if (height && height > 120) {
|
||||||
|
editorHeight.value = `${Math.max(height - 60 - ATTACHMENT_SECTION_RESERVE_PX, 200)}px`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function isEmptyRichText(html: string | null | undefined) {
|
||||||
|
if (!html) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
const text = html
|
||||||
|
.replace(/<[^>]+>/g, '')
|
||||||
|
.replace(/ /g, '')
|
||||||
|
.trim();
|
||||||
|
|
||||||
|
if (text) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
return !/<img\b/i.test(html);
|
||||||
|
}
|
||||||
|
|
||||||
function createDefaultModel(): Model {
|
function createDefaultModel(): Model {
|
||||||
return {
|
return {
|
||||||
title: '',
|
title: '',
|
||||||
description: '',
|
description: null,
|
||||||
|
attachments: [],
|
||||||
reviewRequired: 0,
|
reviewRequired: 0,
|
||||||
completionDate: '',
|
|
||||||
moduleId: props.defaultModuleId || '0',
|
moduleId: props.defaultModuleId || '0',
|
||||||
category: '功能需求',
|
category: '功能需求',
|
||||||
priority: 1,
|
priority: 1,
|
||||||
|
expectedTime: null,
|
||||||
proposerId: '',
|
proposerId: '',
|
||||||
currentHandlerUserId: '',
|
currentHandlerUserId: '',
|
||||||
sort: 0
|
sort: 0
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function getNullableText(value?: string | null) {
|
|
||||||
return value?.trim() || null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function closeDialog() {
|
function closeDialog() {
|
||||||
visible.value = false;
|
visible.value = false;
|
||||||
}
|
}
|
||||||
@@ -114,18 +184,31 @@ async function handleSubmit() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (attachmentUploaderRef.value?.hasUploading) {
|
||||||
|
window.$message?.warning('附件正在上传中,请稍候');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const proposer = memberUserOptions.value.find(m => m.userId === model.value.proposerId);
|
||||||
|
const proposerNickname = proposer?.userNickname || '';
|
||||||
|
const handler = memberUserOptions.value.find(m => m.userId === model.value.currentHandlerUserId);
|
||||||
|
const currentHandlerUserNickname = handler?.userNickname || '';
|
||||||
|
|
||||||
const payload: Api.Product.SaveRequirementParams = {
|
const payload: Api.Product.SaveRequirementParams = {
|
||||||
productId: props.productId,
|
productId: props.productId,
|
||||||
moduleId: model.value.moduleId || '0',
|
moduleId: model.value.moduleId || '0',
|
||||||
reviewRequired: model.value.reviewRequired as Api.Product.RequirementReviewRequired,
|
reviewRequired: model.value.reviewRequired as Api.Product.RequirementReviewRequired,
|
||||||
title: model.value.title.trim(),
|
title: model.value.title.trim(),
|
||||||
description: getNullableText(model.value.description),
|
description: isEmptyRichText(model.value.description) ? null : (model.value.description ?? null),
|
||||||
|
attachments: [...model.value.attachments],
|
||||||
category: model.value.category,
|
category: model.value.category,
|
||||||
priority: Number(model.value.priority) as Api.Product.RequirementPriority,
|
priority: Number(model.value.priority) as Api.Product.RequirementPriority,
|
||||||
|
expectedTime: model.value.expectedTime,
|
||||||
proposerId: model.value.proposerId,
|
proposerId: model.value.proposerId,
|
||||||
|
proposerNickname,
|
||||||
currentHandlerUserId: model.value.currentHandlerUserId,
|
currentHandlerUserId: model.value.currentHandlerUserId,
|
||||||
|
currentHandlerUserNickname,
|
||||||
implementProjectId: null,
|
implementProjectId: null,
|
||||||
completionDate: model.value.completionDate,
|
|
||||||
sort: model.value.sort
|
sort: model.value.sort
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -139,6 +222,8 @@ async function handleSubmit() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
await Promise.all([attachmentUploaderRef.value?.commit(), richTextEditorRef.value?.commit()]);
|
||||||
|
|
||||||
window.$message?.success('需求新增成功');
|
window.$message?.success('需求新增成功');
|
||||||
closeDialog();
|
closeDialog();
|
||||||
emit('submitted');
|
emit('submitted');
|
||||||
@@ -150,8 +235,12 @@ async function loadModuleTree() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
|
||||||
const { error, data } = await fetchGetRequirementModuleTree(props.productId);
|
const { error, data } = await fetchGetRequirementModuleTree(props.productId);
|
||||||
|
|
||||||
|
loading.value = false;
|
||||||
|
|
||||||
if (error || !data) {
|
if (error || !data) {
|
||||||
moduleTree.value = [];
|
moduleTree.value = [];
|
||||||
return;
|
return;
|
||||||
@@ -171,6 +260,8 @@ watch(
|
|||||||
await loadModuleTree();
|
await loadModuleTree();
|
||||||
|
|
||||||
await nextTick();
|
await nextTick();
|
||||||
|
attachmentUploaderRef.value?.initSession();
|
||||||
|
richTextEditorRef.value?.initSession();
|
||||||
formRef.value?.clearValidate();
|
formRef.value?.clearValidate();
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
@@ -180,115 +271,157 @@ watch(
|
|||||||
<BusinessFormDialog
|
<BusinessFormDialog
|
||||||
v-model="visible"
|
v-model="visible"
|
||||||
title="新增需求"
|
title="新增需求"
|
||||||
preset="lg"
|
width="1100px"
|
||||||
|
max-body-height="78vh"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:confirm-loading="submitting"
|
:confirm-loading="submitting"
|
||||||
@confirm="handleSubmit"
|
@confirm="handleSubmit"
|
||||||
>
|
>
|
||||||
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top" :validate-on-rule-change="false">
|
||||||
<ElRow :gutter="16">
|
<div class="requirement-operate-dialog__grid">
|
||||||
<ElCol :span="12">
|
<div ref="leftColRef" class="requirement-operate-dialog__col-left">
|
||||||
<ElFormItem label="标题" prop="title">
|
<BusinessFormSection title="需求信息">
|
||||||
<ElInput v-model="model.title" clearable maxlength="256" placeholder="请输入需求标题" />
|
<ElFormItem label="需求名称" prop="title">
|
||||||
</ElFormItem>
|
<ElInput v-model="model.title" clearable maxlength="256" placeholder="请输入需求名称" />
|
||||||
</ElCol>
|
</ElFormItem>
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="预期完成时间" prop="completionDate" style="width: 100%">
|
<ElFormItem label="模块">
|
||||||
<ElDatePicker
|
<ElSelect v-model="model.moduleId" class="w-full" filterable placeholder="请选择所属模块">
|
||||||
v-model="model.completionDate"
|
<ElOption v-for="item in flatModuleOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
type="datetime"
|
</ElSelect>
|
||||||
class="w-full"
|
</ElFormItem>
|
||||||
placeholder="选择预期完成时间"
|
|
||||||
value-format="x"
|
<ElFormItem label="是否需要评审">
|
||||||
style="width: 100%"
|
<ElRadioGroup v-model="model.reviewRequired">
|
||||||
/>
|
<ElRadio
|
||||||
</ElFormItem>
|
v-for="item in reviewRequiredOptions"
|
||||||
</ElCol>
|
:key="item.value"
|
||||||
<ElCol :span="24">
|
:value="item.value"
|
||||||
<ElFormItem label="描述">
|
border
|
||||||
<ElInput
|
style="width: 165px"
|
||||||
v-model="model.description"
|
>
|
||||||
type="textarea"
|
{{ item.label }}
|
||||||
:rows="6"
|
</ElRadio>
|
||||||
maxlength="2000"
|
</ElRadioGroup>
|
||||||
show-word-limit
|
</ElFormItem>
|
||||||
placeholder="请输入需求描述"
|
|
||||||
/>
|
<ElFormItem label="优先级" prop="priority">
|
||||||
</ElFormItem>
|
<ElSelect v-model="model.priority" class="w-full" filterable placeholder="请选择优先级">
|
||||||
</ElCol>
|
<ElOption v-for="item in priorityOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
<ElCol :span="12">
|
</ElSelect>
|
||||||
<ElFormItem label="是否需要评审">
|
</ElFormItem>
|
||||||
<ElSelect v-model="model.reviewRequired" class="w-full" placeholder="请选择">
|
|
||||||
<ElOption
|
<ElFormItem label="需求类型" prop="category">
|
||||||
v-for="item in reviewRequiredOptions"
|
<DictSelect
|
||||||
:key="item.value"
|
v-model="model.category"
|
||||||
:label="item.label"
|
:dict-code="categoryDictCode"
|
||||||
:value="item.value"
|
filterable
|
||||||
|
placeholder="请选择需求类型"
|
||||||
/>
|
/>
|
||||||
</ElSelect>
|
</ElFormItem>
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
<ElFormItem label="提出人" prop="proposerId">
|
||||||
<ElCol :span="12">
|
<ElSelect v-model="model.proposerId" class="w-full" filterable placeholder="请选择提出人">
|
||||||
<ElFormItem label="模块">
|
<ElOption
|
||||||
<ElTreeSelect
|
v-for="item in memberUserOptions"
|
||||||
v-model="model.moduleId"
|
:key="item.userId"
|
||||||
:data="moduleTree"
|
:label="item.userNickname"
|
||||||
:props="moduleTreeProps"
|
:value="item.userId"
|
||||||
class="w-full"
|
>
|
||||||
check-strictly
|
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
||||||
:render-after-expand="false"
|
</ElOption>
|
||||||
placeholder="请选择所属模块"
|
</ElSelect>
|
||||||
/>
|
</ElFormItem>
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
<ElFormItem label="负责人" prop="currentHandlerUserId">
|
||||||
<ElCol :span="12">
|
<ElSelect v-model="model.currentHandlerUserId" class="w-full" filterable placeholder="请选择负责人">
|
||||||
<ElFormItem label="分类" prop="category">
|
<ElOption
|
||||||
<DictSelect v-model="model.category" :dict-code="categoryDictCode" filterable placeholder="请选择分类" />
|
v-for="item in memberUserOptions"
|
||||||
</ElFormItem>
|
:key="item.userId"
|
||||||
</ElCol>
|
:label="item.userNickname"
|
||||||
<ElCol :span="12">
|
:value="item.userId"
|
||||||
<ElFormItem label="优先级" prop="priority">
|
>
|
||||||
<ElSelect v-model="model.priority" class="w-full" filterable placeholder="请选择优先级">
|
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
||||||
<ElOption v-for="item in priorityOptions" :key="item.value" :label="item.label" :value="item.value" />
|
</ElOption>
|
||||||
</ElSelect>
|
</ElSelect>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
</ElCol>
|
|
||||||
<ElCol :span="12">
|
<ElFormItem label="预期完成时间">
|
||||||
<ElFormItem label="提出人" prop="proposerId">
|
<ElDatePicker
|
||||||
<ElSelect v-model="model.proposerId" class="w-full" filterable placeholder="请选择提出人">
|
v-model="model.expectedTime"
|
||||||
<ElOption
|
type="date"
|
||||||
v-for="item in memberUserOptions"
|
value-format="YYYY-MM-DD"
|
||||||
:key="item.userId"
|
placeholder="请选择预期完成时间"
|
||||||
:label="item.userNickname"
|
:shortcuts="expectedTimeShortcuts"
|
||||||
:value="item.userId"
|
class="requirement-operate-dialog__date-picker"
|
||||||
>
|
/>
|
||||||
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
</ElFormItem>
|
||||||
</ElOption>
|
|
||||||
</ElSelect>
|
<!-- <ElFormItem label="排序值">-->
|
||||||
</ElFormItem>
|
<!-- <ElInputNumber v-model="model.sort" class="w-full" :min="0" :max="9999" placeholder="请输入排序值" />-->
|
||||||
</ElCol>
|
<!-- </ElFormItem>-->
|
||||||
<ElCol :span="12">
|
</BusinessFormSection>
|
||||||
<ElFormItem label="负责人" prop="currentHandlerUserId">
|
</div>
|
||||||
<ElSelect v-model="model.currentHandlerUserId" class="w-full" filterable placeholder="请选择负责人">
|
|
||||||
<ElOption
|
<div class="requirement-operate-dialog__col-right">
|
||||||
v-for="item in memberUserOptions"
|
<BusinessFormSection title="需求内容">
|
||||||
:key="item.userId"
|
<ElFormItem class="requirement-operate-dialog__desc-item">
|
||||||
:label="item.userNickname"
|
<BusinessRichTextEditor
|
||||||
:value="item.userId"
|
ref="richTextEditorRef"
|
||||||
>
|
v-model="model.description"
|
||||||
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
:height="editorHeight"
|
||||||
</ElOption>
|
upload-directory="requirement"
|
||||||
</ElSelect>
|
placeholder="请输入需求内容"
|
||||||
</ElFormItem>
|
/>
|
||||||
</ElCol>
|
</ElFormItem>
|
||||||
<ElCol :span="12">
|
</BusinessFormSection>
|
||||||
<ElFormItem label="排序值">
|
|
||||||
<ElInputNumber v-model="model.sort" class="w-full" :min="0" :max="9999" placeholder="请输入排序值" />
|
<BusinessFormSection title="附件">
|
||||||
</ElFormItem>
|
<ElFormItem class="requirement-operate-dialog__attachment-item">
|
||||||
</ElCol>
|
<BusinessAttachmentUploader
|
||||||
</ElRow>
|
ref="attachmentUploaderRef"
|
||||||
|
v-model="model.attachments"
|
||||||
|
directory="requirement"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</BusinessFormSection>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</ElForm>
|
</ElForm>
|
||||||
</BusinessFormDialog>
|
</BusinessFormDialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped>
|
||||||
|
.requirement-operate-dialog__grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 360px 1fr;
|
||||||
|
gap: 24px;
|
||||||
|
align-items: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__col-left,
|
||||||
|
.requirement-operate-dialog__col-right {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__col-right {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__desc-item,
|
||||||
|
.requirement-operate-dialog__attachment-item {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (width <= 1024px) {
|
||||||
|
.requirement-operate-dialog__grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.requirement-operate-dialog__date-picker.el-date-editor.el-input) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -1,11 +1,19 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, nextTick, ref, watch } from 'vue';
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import { useResizeObserver } from '@vueuse/core';
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import { fetchGetRequirement, fetchGetRequirementModuleTree, fetchUpdateRequirement } from '@/service/api';
|
import {
|
||||||
|
fetchGetProjectListByProductId,
|
||||||
|
fetchGetRequirement,
|
||||||
|
fetchGetRequirementModuleTree,
|
||||||
|
fetchUpdateRequirement
|
||||||
|
} from '@/service/api';
|
||||||
import { useForm, useFormRules } from '@/hooks/common/form';
|
import { useForm, useFormRules } from '@/hooks/common/form';
|
||||||
import { useDict } from '@/hooks/business/dict';
|
import { useDict } from '@/hooks/business/dict';
|
||||||
|
import BusinessAttachmentUploader from '@/components/custom/business-attachment-uploader.vue';
|
||||||
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
|
||||||
import DictSelect from '@/components/custom/dict-select.vue';
|
import BusinessFormSection from '@/components/custom/business-form-section.vue';
|
||||||
|
import BusinessRichTextEditor from '@/components/custom/business-rich-text-editor.vue';
|
||||||
import ReadonlyField from '@/components/custom/readonly-field.vue';
|
import ReadonlyField from '@/components/custom/readonly-field.vue';
|
||||||
import MemberSelectOption from './member-select-option.vue';
|
import MemberSelectOption from './member-select-option.vue';
|
||||||
|
|
||||||
@@ -40,6 +48,9 @@ const { createRequiredRule } = useFormRules();
|
|||||||
const { getLabel: getCategoryLabel } = useDict(() => props.categoryDictCode);
|
const { getLabel: getCategoryLabel } = useDict(() => props.categoryDictCode);
|
||||||
const { getLabel: getPriorityLabel, enabledDictData: priorityDictData } = useDict(() => props.priorityDictCode);
|
const { getLabel: getPriorityLabel, enabledDictData: priorityDictData } = useDict(() => props.priorityDictCode);
|
||||||
|
|
||||||
|
const attachmentUploaderRef = ref<InstanceType<typeof BusinessAttachmentUploader> | null>(null);
|
||||||
|
const richTextEditorRef = ref<InstanceType<typeof BusinessRichTextEditor> | null>(null);
|
||||||
|
|
||||||
const priorityOptions = computed(() => {
|
const priorityOptions = computed(() => {
|
||||||
return priorityDictData.value.map(item => ({
|
return priorityDictData.value.map(item => ({
|
||||||
label: item.label,
|
label: item.label,
|
||||||
@@ -49,14 +60,17 @@ const priorityOptions = computed(() => {
|
|||||||
|
|
||||||
interface Model {
|
interface Model {
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string | null;
|
||||||
|
attachments: Api.Project.AttachmentItem[];
|
||||||
reviewRequired: number;
|
reviewRequired: number;
|
||||||
completionDate: string;
|
|
||||||
moduleId: string;
|
moduleId: string;
|
||||||
category: string;
|
category: string;
|
||||||
priority: number | null;
|
priority: number | null;
|
||||||
|
expectedTime: string | null;
|
||||||
proposerId: string;
|
proposerId: string;
|
||||||
|
proposerNickname: string;
|
||||||
currentHandlerUserId: string;
|
currentHandlerUserId: string;
|
||||||
|
currentHandlerUserNickname: string;
|
||||||
implementProjectId: string | null;
|
implementProjectId: string | null;
|
||||||
sort: number;
|
sort: number;
|
||||||
lastStatusReason: string;
|
lastStatusReason: string;
|
||||||
@@ -65,7 +79,7 @@ interface Model {
|
|||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const submitting = ref(false);
|
const submitting = ref(false);
|
||||||
const moduleTree = ref<Api.Product.RequirementModule[]>([]);
|
const moduleTree = ref<Api.Product.RequirementModule[]>([]);
|
||||||
|
const projectOptions = ref<Api.Project.Project[]>([]);
|
||||||
const model = ref<Model>(createDefaultModel());
|
const model = ref<Model>(createDefaultModel());
|
||||||
|
|
||||||
const isViewMode = computed(() => props.mode === 'view');
|
const isViewMode = computed(() => props.mode === 'view');
|
||||||
@@ -74,6 +88,7 @@ const dialogTitle = computed(() => {
|
|||||||
if (isViewMode.value) {
|
if (isViewMode.value) {
|
||||||
return '查看需求';
|
return '查看需求';
|
||||||
}
|
}
|
||||||
|
|
||||||
return '编辑需求';
|
return '编辑需求';
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -87,6 +102,7 @@ const memberLabelMap = computed(() => {
|
|||||||
|
|
||||||
const moduleLabelMap = computed(() => {
|
const moduleLabelMap = computed(() => {
|
||||||
const map = new Map<string | undefined, string>();
|
const map = new Map<string | undefined, string>();
|
||||||
|
|
||||||
function traverse(modules: Api.Product.RequirementModule[]) {
|
function traverse(modules: Api.Product.RequirementModule[]) {
|
||||||
for (const module of modules) {
|
for (const module of modules) {
|
||||||
map.set(module.id, module.moduleName);
|
map.set(module.id, module.moduleName);
|
||||||
@@ -95,55 +111,125 @@ const moduleLabelMap = computed(() => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
traverse(moduleTree.value);
|
traverse(moduleTree.value);
|
||||||
return map;
|
return map;
|
||||||
});
|
});
|
||||||
|
|
||||||
const moduleTreeProps = {
|
const projectOptionsMap = computed(() => {
|
||||||
label: 'moduleName',
|
return new Map(projectOptions.value.map(item => [String(item.id), item.projectName]));
|
||||||
value: 'id',
|
});
|
||||||
children: 'children'
|
|
||||||
};
|
const flatModuleOptions = computed<Array<{ label: string; value: string }>>(() => {
|
||||||
|
const options: Array<{ label: string; value: string }> = [];
|
||||||
|
|
||||||
|
function walk(modules: Api.Product.RequirementModule[], parentPath: string) {
|
||||||
|
for (const module of modules) {
|
||||||
|
const currentPath = `${parentPath}/${module.moduleName}`;
|
||||||
|
options.push({
|
||||||
|
label: currentPath,
|
||||||
|
value: module.id || ''
|
||||||
|
});
|
||||||
|
if (module.children?.length) {
|
||||||
|
walk(module.children, currentPath);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (moduleTree.value.length > 0) {
|
||||||
|
walk(moduleTree.value, '');
|
||||||
|
}
|
||||||
|
|
||||||
|
return options;
|
||||||
|
});
|
||||||
|
|
||||||
const reviewRequiredOptions = [
|
const reviewRequiredOptions = [
|
||||||
{ label: '不需要', value: 0 },
|
{ label: '不需要', value: 0 },
|
||||||
{ label: '需要', value: 1 }
|
{ label: '需要', value: 1 }
|
||||||
];
|
];
|
||||||
|
|
||||||
|
function buildExpectedTimeShortcut(text: string, mutator: (date: Date) => void) {
|
||||||
|
return {
|
||||||
|
text,
|
||||||
|
value: () => {
|
||||||
|
const date = new Date();
|
||||||
|
mutator(date);
|
||||||
|
return date;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const expectedTimeShortcuts = [
|
||||||
|
buildExpectedTimeShortcut('一星期', date => date.setDate(date.getDate() + 7)),
|
||||||
|
buildExpectedTimeShortcut('两星期', date => date.setDate(date.getDate() + 14)),
|
||||||
|
buildExpectedTimeShortcut('一个月', date => date.setMonth(date.getMonth() + 1)),
|
||||||
|
buildExpectedTimeShortcut('三个月', date => date.setMonth(date.getMonth() + 3)),
|
||||||
|
buildExpectedTimeShortcut('半年', date => date.setMonth(date.getMonth() + 6)),
|
||||||
|
buildExpectedTimeShortcut('一年', date => date.setFullYear(date.getFullYear() + 1))
|
||||||
|
];
|
||||||
|
|
||||||
const rules = computed(() => {
|
const rules = computed(() => {
|
||||||
const baseRules: Record<string, App.Global.FormRule[]> = {
|
const baseRules: Record<string, App.Global.FormRule[]> = {
|
||||||
title: isEditMode.value ? [createRequiredRule('请输入需求标题')] : [],
|
title: isEditMode.value ? [createRequiredRule('请输入需求名称')] : [],
|
||||||
category: isEditMode.value ? [createRequiredRule('请选择分类')] : [],
|
category: isEditMode.value ? [createRequiredRule('请选择需求类型')] : [],
|
||||||
priority: isEditMode.value ? [createRequiredRule('请选择优先级')] : [],
|
priority: isEditMode.value ? [createRequiredRule('请选择优先级')] : [],
|
||||||
proposerId: isEditMode.value ? [createRequiredRule('请选择提出人')] : [],
|
proposerId: isEditMode.value ? [createRequiredRule('请选择提出人')] : [],
|
||||||
currentHandlerUserId: isEditMode.value ? [createRequiredRule('请选择负责人')] : [],
|
currentHandlerUserId: isEditMode.value ? [createRequiredRule('请选择负责人')] : []
|
||||||
completionDate: isEditMode.value ? [createRequiredRule('请选择预期完成时间')] : []
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return baseRules;
|
return baseRules;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const leftColRef = ref<HTMLElement>();
|
||||||
|
const editorHeight = ref<string>('45vh');
|
||||||
|
|
||||||
|
const ATTACHMENT_SECTION_RESERVE_PX = 140;
|
||||||
|
|
||||||
|
useResizeObserver(leftColRef, entries => {
|
||||||
|
const height = entries[0]?.contentRect.height;
|
||||||
|
|
||||||
|
if (height && height > 120) {
|
||||||
|
editorHeight.value = `${Math.max(height - 60 - ATTACHMENT_SECTION_RESERVE_PX, 200)}px`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function isEmptyRichText(html: string | null | undefined) {
|
||||||
|
if (!html) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
const text = html
|
||||||
|
.replace(/<[^>]+>/g, '')
|
||||||
|
.replace(/ /g, '')
|
||||||
|
.trim();
|
||||||
|
|
||||||
|
if (text) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
return !/<img\b/i.test(html);
|
||||||
|
}
|
||||||
|
|
||||||
function createDefaultModel(): Model {
|
function createDefaultModel(): Model {
|
||||||
return {
|
return {
|
||||||
title: '',
|
title: '',
|
||||||
description: '',
|
description: null,
|
||||||
|
attachments: [],
|
||||||
reviewRequired: 0,
|
reviewRequired: 0,
|
||||||
completionDate: '',
|
|
||||||
moduleId: '0',
|
moduleId: '0',
|
||||||
category: '',
|
category: '',
|
||||||
priority: 1,
|
priority: 1,
|
||||||
|
expectedTime: null,
|
||||||
proposerId: '',
|
proposerId: '',
|
||||||
|
proposerNickname: '',
|
||||||
currentHandlerUserId: '',
|
currentHandlerUserId: '',
|
||||||
|
currentHandlerUserNickname: '',
|
||||||
implementProjectId: null,
|
implementProjectId: null,
|
||||||
sort: 0,
|
sort: 0,
|
||||||
lastStatusReason: ''
|
lastStatusReason: ''
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function getNullableText(value?: string | null) {
|
|
||||||
return value?.trim() || null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function closeDialog() {
|
function closeDialog() {
|
||||||
visible.value = false;
|
visible.value = false;
|
||||||
}
|
}
|
||||||
@@ -155,6 +241,13 @@ async function handleSubmit() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (attachmentUploaderRef.value?.hasUploading) {
|
||||||
|
window.$message?.warning('附件正在上传中,请稍候');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const handler = memberUserOptions.value.find(item => item.userId === model.value.currentHandlerUserId);
|
||||||
|
|
||||||
submitting.value = true;
|
submitting.value = true;
|
||||||
|
|
||||||
const updatePayload: Api.Product.UpdateRequirementParams = {
|
const updatePayload: Api.Product.UpdateRequirementParams = {
|
||||||
@@ -163,13 +256,16 @@ async function handleSubmit() {
|
|||||||
moduleId: model.value.moduleId || '0',
|
moduleId: model.value.moduleId || '0',
|
||||||
reviewRequired: model.value.reviewRequired as Api.Product.RequirementReviewRequired,
|
reviewRequired: model.value.reviewRequired as Api.Product.RequirementReviewRequired,
|
||||||
title: model.value.title.trim(),
|
title: model.value.title.trim(),
|
||||||
description: getNullableText(model.value.description),
|
description: isEmptyRichText(model.value.description) ? null : (model.value.description ?? null),
|
||||||
|
attachments: [...model.value.attachments],
|
||||||
category: model.value.category,
|
category: model.value.category,
|
||||||
priority: Number(model.value.priority) as Api.Product.RequirementPriority,
|
priority: Number(model.value.priority) as Api.Product.RequirementPriority,
|
||||||
|
expectedTime: model.value.expectedTime,
|
||||||
proposerId: model.value.proposerId,
|
proposerId: model.value.proposerId,
|
||||||
|
proposerNickname: model.value.proposerNickname,
|
||||||
currentHandlerUserId: model.value.currentHandlerUserId,
|
currentHandlerUserId: model.value.currentHandlerUserId,
|
||||||
|
currentHandlerUserNickname: handler?.userNickname || model.value.currentHandlerUserNickname,
|
||||||
implementProjectId: model.value.implementProjectId,
|
implementProjectId: model.value.implementProjectId,
|
||||||
completionDate: model.value.completionDate,
|
|
||||||
sort: model.value.sort
|
sort: model.value.sort
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -181,6 +277,8 @@ async function handleSubmit() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
await Promise.all([attachmentUploaderRef.value?.commit(), richTextEditorRef.value?.commit()]);
|
||||||
|
|
||||||
window.$message?.success('需求更新成功');
|
window.$message?.success('需求更新成功');
|
||||||
closeDialog();
|
closeDialog();
|
||||||
emit('submitted', props.requirement.id);
|
emit('submitted', props.requirement.id);
|
||||||
@@ -202,6 +300,55 @@ async function loadModuleTree() {
|
|||||||
moduleTree.value = data;
|
moduleTree.value = data;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadProjectOptions() {
|
||||||
|
if (!props.productId) {
|
||||||
|
projectOptions.value = [];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { error, data } = await fetchGetProjectListByProductId(props.productId);
|
||||||
|
|
||||||
|
if (error || !data) {
|
||||||
|
projectOptions.value = [];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
projectOptions.value = data;
|
||||||
|
}
|
||||||
|
|
||||||
|
function transformRequirementData(data: Api.Product.Requirement): typeof model.value {
|
||||||
|
return {
|
||||||
|
title: data.title || '',
|
||||||
|
description: data.description || null,
|
||||||
|
attachments: data.attachments ? [...data.attachments] : [],
|
||||||
|
reviewRequired: data.reviewRequired ?? 0,
|
||||||
|
moduleId: data.moduleId || '0',
|
||||||
|
category: data.category || '',
|
||||||
|
priority: data.priority ?? null,
|
||||||
|
expectedTime: formatExpectedTime(data.expectedTime),
|
||||||
|
proposerId: data.proposerId || '',
|
||||||
|
proposerNickname: data.proposerNickname || '',
|
||||||
|
currentHandlerUserId: data.currentHandlerUserId || '',
|
||||||
|
currentHandlerUserNickname: data.currentHandlerUserNickname || '',
|
||||||
|
implementProjectId: data.implementProjectId || null,
|
||||||
|
sort: data.sort ?? 0,
|
||||||
|
lastStatusReason: data.lastStatusReason || ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatExpectedTime(value?: string | number[] | null): string | null {
|
||||||
|
if (!value) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (Array.isArray(value)) {
|
||||||
|
const [year, month, day] = value;
|
||||||
|
return `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
return dayjs(value).format('YYYY-MM-DD');
|
||||||
|
}
|
||||||
|
|
||||||
async function loadRequirementDetail() {
|
async function loadRequirementDetail() {
|
||||||
if (!props.productId || !props.requirement?.id) {
|
if (!props.productId || !props.requirement?.id) {
|
||||||
return;
|
return;
|
||||||
@@ -217,20 +364,7 @@ async function loadRequirementDetail() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
model.value = {
|
model.value = transformRequirementData(data);
|
||||||
title: data.title || '',
|
|
||||||
description: data.description || '',
|
|
||||||
reviewRequired: data.reviewRequired ?? 0,
|
|
||||||
completionDate: data.completionDate || '',
|
|
||||||
moduleId: data.moduleId || '0',
|
|
||||||
category: data.category || '',
|
|
||||||
priority: data.priority ?? null,
|
|
||||||
proposerId: data.proposerId || '',
|
|
||||||
currentHandlerUserId: data.currentHandlerUserId || '',
|
|
||||||
implementProjectId: data.implementProjectId || null,
|
|
||||||
sort: data.sort ?? 0,
|
|
||||||
lastStatusReason: data.lastStatusReason || ''
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
@@ -240,13 +374,17 @@ watch(
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
await loadModuleTree();
|
await Promise.all([loadModuleTree(), loadProjectOptions()]);
|
||||||
|
|
||||||
if (props.requirement?.id) {
|
if (props.requirement?.id) {
|
||||||
await loadRequirementDetail();
|
await loadRequirementDetail();
|
||||||
|
} else {
|
||||||
|
model.value = createDefaultModel();
|
||||||
}
|
}
|
||||||
|
|
||||||
await nextTick();
|
await nextTick();
|
||||||
|
attachmentUploaderRef.value?.initSession();
|
||||||
|
richTextEditorRef.value?.initSession();
|
||||||
formRef.value?.clearValidate();
|
formRef.value?.clearValidate();
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
@@ -256,170 +394,173 @@ watch(
|
|||||||
<BusinessFormDialog
|
<BusinessFormDialog
|
||||||
v-model="visible"
|
v-model="visible"
|
||||||
:title="dialogTitle"
|
:title="dialogTitle"
|
||||||
preset="lg"
|
width="1100px"
|
||||||
|
max-body-height="78vh"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:confirm-loading="submitting"
|
:confirm-loading="submitting"
|
||||||
:show-footer="isEditMode"
|
|
||||||
@confirm="handleSubmit"
|
@confirm="handleSubmit"
|
||||||
>
|
>
|
||||||
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top">
|
<template v-if="isViewMode" #footer="{ close }">
|
||||||
<ElRow :gutter="16">
|
<ElButton type="primary" @click="close">关闭</ElButton>
|
||||||
<ElCol :span="12">
|
</template>
|
||||||
<ElFormItem label="标题" prop="title">
|
|
||||||
<template v-if="isViewMode">
|
<ElForm ref="formRef" :model="model" :rules="rules" label-position="top" :validate-on-rule-change="false">
|
||||||
|
<div class="requirement-operate-dialog__grid">
|
||||||
|
<div ref="leftColRef" class="requirement-operate-dialog__col-left">
|
||||||
|
<BusinessFormSection title="需求信息">
|
||||||
|
<ElFormItem label="需求名称" prop="title">
|
||||||
<ReadonlyField :value="model.title" />
|
<ReadonlyField :value="model.title" />
|
||||||
</template>
|
</ElFormItem>
|
||||||
<ElInput v-else v-model="model.title" clearable maxlength="256" placeholder="请输入需求标题" />
|
|
||||||
</ElFormItem>
|
<ElFormItem label="模块">
|
||||||
</ElCol>
|
<template v-if="isViewMode">
|
||||||
<ElCol :span="12">
|
<ReadonlyField :value="moduleLabelMap.get(model.moduleId) || '--'" />
|
||||||
<ElFormItem label="预期完成时间" prop="completionDate" style="width: 100%">
|
</template>
|
||||||
<template v-if="isViewMode">
|
<ElSelect v-else v-model="model.moduleId" class="w-full" filterable placeholder="请选择所属模块">
|
||||||
<ReadonlyField
|
<ElOption v-for="item in flatModuleOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
:value="model.completionDate ? dayjs(Number(model.completionDate)).format('YYYY-MM-DD HH:mm:ss') : '--'"
|
</ElSelect>
|
||||||
/>
|
</ElFormItem>
|
||||||
</template>
|
|
||||||
<ElDatePicker
|
<ElFormItem label="是否需要评审">
|
||||||
v-else
|
<ReadonlyField :value="reviewRequiredOptions.find(opt => opt.value === model.reviewRequired)?.label" />
|
||||||
v-model="model.completionDate"
|
</ElFormItem>
|
||||||
type="datetime"
|
|
||||||
class="w-full"
|
<ElFormItem label="优先级" prop="priority">
|
||||||
placeholder="选择预期完成时间"
|
<template v-if="isViewMode">
|
||||||
value-format="x"
|
<ReadonlyField
|
||||||
style="width: 100%"
|
:value="model.priority !== null ? getPriorityLabel(String(model.priority)) || '--' : '--'"
|
||||||
/>
|
/>
|
||||||
</ElFormItem>
|
</template>
|
||||||
</ElCol>
|
<ElSelect v-else v-model="model.priority" class="w-full" filterable placeholder="请选择优先级">
|
||||||
<ElCol :span="24">
|
<ElOption v-for="item in priorityOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
<ElFormItem label="描述">
|
</ElSelect>
|
||||||
<template v-if="isViewMode">
|
</ElFormItem>
|
||||||
<div class="readonly-textarea">
|
|
||||||
{{ model.description || '--' }}
|
<ElFormItem label="需求类型" prop="category">
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<ElInput
|
|
||||||
v-else
|
|
||||||
v-model="model.description"
|
|
||||||
type="textarea"
|
|
||||||
:rows="6"
|
|
||||||
maxlength="2000"
|
|
||||||
show-word-limit
|
|
||||||
placeholder="请输入需求描述"
|
|
||||||
/>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="是否需要评审">
|
|
||||||
<ReadonlyField :value="reviewRequiredOptions.find(opt => opt.value === model.reviewRequired)?.label" />
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="模块">
|
|
||||||
<template v-if="isViewMode">
|
|
||||||
<ReadonlyField :value="moduleLabelMap.get(model.moduleId) || '--'" />
|
|
||||||
</template>
|
|
||||||
<ElTreeSelect
|
|
||||||
v-else
|
|
||||||
v-model="model.moduleId"
|
|
||||||
:data="moduleTree"
|
|
||||||
:props="moduleTreeProps"
|
|
||||||
class="w-full"
|
|
||||||
check-strictly
|
|
||||||
:render-after-expand="false"
|
|
||||||
placeholder="请选择所属模块"
|
|
||||||
/>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="分类" prop="category">
|
|
||||||
<template v-if="isViewMode">
|
|
||||||
<ReadonlyField :value="getCategoryLabel(model.category) || '--'" />
|
<ReadonlyField :value="getCategoryLabel(model.category) || '--'" />
|
||||||
</template>
|
</ElFormItem>
|
||||||
<DictSelect
|
|
||||||
v-else
|
<ElFormItem label="提出人" prop="proposerId">
|
||||||
v-model="model.category"
|
|
||||||
:dict-code="categoryDictCode"
|
|
||||||
filterable
|
|
||||||
placeholder="请选择分类"
|
|
||||||
/>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="优先级" prop="priority">
|
|
||||||
<template v-if="isViewMode">
|
|
||||||
<ReadonlyField
|
|
||||||
:value="model.priority !== null ? getPriorityLabel(String(model.priority)) || '--' : '--'"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<ElSelect v-else v-model="model.priority" class="w-full" filterable placeholder="请选择优先级">
|
|
||||||
<ElOption v-for="item in priorityOptions" :key="item.value" :label="item.label" :value="item.value" />
|
|
||||||
</ElSelect>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="提出人" prop="proposerId">
|
|
||||||
<template v-if="isViewMode">
|
|
||||||
<ReadonlyField :value="memberLabelMap.get(model.proposerId) || '--'" />
|
<ReadonlyField :value="memberLabelMap.get(model.proposerId) || '--'" />
|
||||||
</template>
|
</ElFormItem>
|
||||||
<ElSelect v-else v-model="model.proposerId" class="w-full" filterable placeholder="请选择提出人">
|
|
||||||
<ElOption
|
<ElFormItem label="负责人" prop="currentHandlerUserId">
|
||||||
v-for="item in memberUserOptions"
|
<template v-if="isViewMode">
|
||||||
:key="item.userId"
|
<ReadonlyField :value="memberLabelMap.get(model.currentHandlerUserId) || '--'" />
|
||||||
:label="item.userNickname"
|
</template>
|
||||||
:value="item.userId"
|
<ElSelect
|
||||||
|
v-else
|
||||||
|
v-model="model.currentHandlerUserId"
|
||||||
|
class="w-full"
|
||||||
|
filterable
|
||||||
|
placeholder="请选择负责人"
|
||||||
>
|
>
|
||||||
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
<ElOption
|
||||||
</ElOption>
|
v-for="item in memberUserOptions"
|
||||||
</ElSelect>
|
:key="item.userId"
|
||||||
</ElFormItem>
|
:label="item.userNickname"
|
||||||
</ElCol>
|
:value="item.userId"
|
||||||
<ElCol :span="12">
|
>
|
||||||
<ElFormItem label="负责人" prop="currentHandlerUserId">
|
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
||||||
<template v-if="isViewMode">
|
</ElOption>
|
||||||
<ReadonlyField :value="memberLabelMap.get(model.currentHandlerUserId) || '--'" />
|
</ElSelect>
|
||||||
</template>
|
</ElFormItem>
|
||||||
<ElSelect v-else v-model="model.currentHandlerUserId" class="w-full" filterable placeholder="请选择负责人">
|
|
||||||
<ElOption
|
<ElFormItem v-if="isViewMode" label="关联项目">
|
||||||
v-for="item in memberUserOptions"
|
<ReadonlyField :value="projectOptionsMap.get(model.implementProjectId || '') || '--'" />
|
||||||
:key="item.userId"
|
</ElFormItem>
|
||||||
:label="item.userNickname"
|
|
||||||
:value="item.userId"
|
<ElFormItem label="预期完成时间">
|
||||||
>
|
<ReadonlyField v-if="isViewMode" :value="model.expectedTime || '--'" />
|
||||||
<MemberSelectOption :nickname="item.userNickname" :role-name="item.roleName" />
|
<ElDatePicker
|
||||||
</ElOption>
|
v-else
|
||||||
</ElSelect>
|
v-model="model.expectedTime"
|
||||||
</ElFormItem>
|
type="date"
|
||||||
</ElCol>
|
value-format="YYYY-MM-DD"
|
||||||
<ElCol :span="12">
|
placeholder="请选择预期完成时间"
|
||||||
<ElFormItem label="实现项目">
|
:shortcuts="expectedTimeShortcuts"
|
||||||
<ReadonlyField :value="model.implementProjectId || '--'" />
|
class="requirement-operate-dialog__date-picker"
|
||||||
</ElFormItem>
|
/>
|
||||||
</ElCol>
|
</ElFormItem>
|
||||||
<ElCol :span="12">
|
|
||||||
<ElFormItem label="排序值">
|
<!-- <ElFormItem label="排序值">-->
|
||||||
<template v-if="isViewMode">
|
<!-- <template v-if="isViewMode">-->
|
||||||
<ReadonlyField :value="model.sort" />
|
<!-- <ReadonlyField :value="model.sort" />-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
<ElInputNumber v-else v-model="model.sort" class="w-full" :min="0" :max="9999" placeholder="请输入排序值" />
|
<!-- <ElInputNumber-->
|
||||||
</ElFormItem>
|
<!-- v-else-->
|
||||||
</ElCol>
|
<!-- v-model="model.sort"-->
|
||||||
<ElCol v-if="isViewMode && model.lastStatusReason" :span="24">
|
<!-- class="w-full"-->
|
||||||
<ElFormItem label="状态变更原因">
|
<!-- :min="0"-->
|
||||||
<div class="readonly-textarea">
|
<!-- :max="9999"-->
|
||||||
{{ model.lastStatusReason }}
|
<!-- placeholder="请输入排序值"-->
|
||||||
</div>
|
<!-- />-->
|
||||||
</ElFormItem>
|
<!-- </ElFormItem>-->
|
||||||
</ElCol>
|
|
||||||
</ElRow>
|
<ElFormItem v-if="isViewMode && model.lastStatusReason" label="状态变更原因">
|
||||||
|
<div class="requirement-operate-dialog__readonly-textarea">{{ model.lastStatusReason }}</div>
|
||||||
|
</ElFormItem>
|
||||||
|
</BusinessFormSection>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="requirement-operate-dialog__col-right">
|
||||||
|
<BusinessFormSection title="需求内容">
|
||||||
|
<ElFormItem class="requirement-operate-dialog__desc-item">
|
||||||
|
<BusinessRichTextEditor
|
||||||
|
ref="richTextEditorRef"
|
||||||
|
v-model="model.description"
|
||||||
|
:disabled="isViewMode"
|
||||||
|
:height="editorHeight"
|
||||||
|
upload-directory="requirement"
|
||||||
|
placeholder="请输入需求内容"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</BusinessFormSection>
|
||||||
|
|
||||||
|
<BusinessFormSection title="附件">
|
||||||
|
<ElFormItem class="requirement-operate-dialog__attachment-item">
|
||||||
|
<BusinessAttachmentUploader
|
||||||
|
ref="attachmentUploaderRef"
|
||||||
|
v-model="model.attachments"
|
||||||
|
directory="requirement"
|
||||||
|
:disabled="isViewMode"
|
||||||
|
/>
|
||||||
|
</ElFormItem>
|
||||||
|
</BusinessFormSection>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</ElForm>
|
</ElForm>
|
||||||
</BusinessFormDialog>
|
</BusinessFormDialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.readonly-textarea {
|
.requirement-operate-dialog__grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 360px 1fr;
|
||||||
|
gap: 24px;
|
||||||
|
align-items: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__col-left,
|
||||||
|
.requirement-operate-dialog__col-right {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__col-right {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__desc-item,
|
||||||
|
.requirement-operate-dialog__attachment-item {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-operate-dialog__readonly-textarea {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 100px;
|
min-height: 65px;
|
||||||
padding: 8px 12px;
|
padding: 8px 12px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
background: linear-gradient(180deg, rgb(241 245 249 / 98%), rgb(226 232 240 / 94%)), rgb(241 245 249);
|
background: linear-gradient(180deg, rgb(241 245 249 / 98%), rgb(226 232 240 / 94%)), rgb(241 245 249);
|
||||||
@@ -430,4 +571,14 @@ watch(
|
|||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (width <= 1024px) {
|
||||||
|
.requirement-operate-dialog__grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.requirement-operate-dialog__date-picker.el-date-editor.el-input) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, nextTick, ref, watch } from 'vue';
|
import { computed, nextTick, provide, ref, watch } from 'vue';
|
||||||
import { ElMessageBox } from 'element-plus';
|
import { ElMessageBox } from 'element-plus';
|
||||||
import {
|
import {
|
||||||
fetchCreateRequirementModule,
|
fetchCreateRequirementModule,
|
||||||
@@ -41,12 +41,24 @@ const rootModule = computed<Api.Product.RequirementModule | null>(() => {
|
|||||||
const editingNodeId = ref<string | undefined>(undefined);
|
const editingNodeId = ref<string | undefined>(undefined);
|
||||||
const editingName = ref('');
|
const editingName = ref('');
|
||||||
|
|
||||||
const addingTopModule = ref(false);
|
|
||||||
const newModuleName = ref('');
|
|
||||||
|
|
||||||
const addingChildParentId = ref<string | undefined>(undefined);
|
const addingChildParentId = ref<string | undefined>(undefined);
|
||||||
const newChildModuleName = ref('');
|
const newChildModuleName = ref('');
|
||||||
|
|
||||||
|
const collapsedModuleIds = ref(new Set<string>());
|
||||||
|
|
||||||
|
function handleToggleCollapse(moduleId: string) {
|
||||||
|
const set = collapsedModuleIds.value;
|
||||||
|
if (set.has(moduleId)) {
|
||||||
|
set.delete(moduleId);
|
||||||
|
} else {
|
||||||
|
set.add(moduleId);
|
||||||
|
}
|
||||||
|
collapsedModuleIds.value = new Set(set);
|
||||||
|
}
|
||||||
|
|
||||||
|
provide('collapsedModuleIds', collapsedModuleIds);
|
||||||
|
provide('toggleCollapse', handleToggleCollapse);
|
||||||
|
|
||||||
const moduleRequirementCountMap = computed(() => {
|
const moduleRequirementCountMap = computed(() => {
|
||||||
const countMap = new Map<string, number>();
|
const countMap = new Map<string, number>();
|
||||||
|
|
||||||
@@ -98,59 +110,6 @@ function handleNodeSelect(moduleId: string) {
|
|||||||
emit('select', moduleId);
|
emit('select', moduleId);
|
||||||
}
|
}
|
||||||
|
|
||||||
function startAddTopModule() {
|
|
||||||
if (addingTopModule.value || addingChildParentId.value) return;
|
|
||||||
|
|
||||||
addingTopModule.value = true;
|
|
||||||
newModuleName.value = '';
|
|
||||||
|
|
||||||
nextTick(() => {
|
|
||||||
const input = document.querySelector('.new-module-input input') as HTMLInputElement;
|
|
||||||
input?.focus();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleAddTopModuleConfirm() {
|
|
||||||
const name = newModuleName.value.trim();
|
|
||||||
|
|
||||||
if (!name) {
|
|
||||||
addingTopModule.value = false;
|
|
||||||
newModuleName.value = '';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!currentObjectId.value || !rootModule.value?.id) {
|
|
||||||
addingTopModule.value = false;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const { error } = await fetchCreateRequirementModule({
|
|
||||||
id: undefined,
|
|
||||||
productId: currentObjectId.value,
|
|
||||||
parentId: rootModule.value.id,
|
|
||||||
moduleName: name,
|
|
||||||
remark: null,
|
|
||||||
icon: null,
|
|
||||||
sort: 0
|
|
||||||
});
|
|
||||||
|
|
||||||
if (error) {
|
|
||||||
addingTopModule.value = false;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
window.$message?.success('模块新增成功');
|
|
||||||
addingTopModule.value = false;
|
|
||||||
newModuleName.value = '';
|
|
||||||
await loadModuleTree();
|
|
||||||
emit('refresh');
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleAddTopModuleCancel() {
|
|
||||||
addingTopModule.value = false;
|
|
||||||
newModuleName.value = '';
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleStartEdit(module: Api.Product.RequirementModule) {
|
function handleStartEdit(module: Api.Product.RequirementModule) {
|
||||||
editingNodeId.value = module.id;
|
editingNodeId.value = module.id;
|
||||||
editingName.value = module.moduleName;
|
editingName.value = module.moduleName;
|
||||||
@@ -199,7 +158,7 @@ async function handleUpdateModuleName(module: Api.Product.RequirementModule, nam
|
|||||||
}
|
}
|
||||||
|
|
||||||
function handleStartAddChild(module: Api.Product.RequirementModule) {
|
function handleStartAddChild(module: Api.Product.RequirementModule) {
|
||||||
if (addingTopModule.value || addingChildParentId.value) return;
|
if (addingChildParentId.value) return;
|
||||||
|
|
||||||
addingChildParentId.value = module.id;
|
addingChildParentId.value = module.id;
|
||||||
newChildModuleName.value = '';
|
newChildModuleName.value = '';
|
||||||
@@ -257,15 +216,11 @@ async function handleDeleteModule(module: Api.Product.RequirementModule) {
|
|||||||
if (!currentObjectId.value) return;
|
if (!currentObjectId.value) return;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await ElMessageBox.confirm(
|
await ElMessageBox.confirm(`确定要删除模块 "${module.moduleName}" 吗?`, '删除确认', {
|
||||||
`确定要删除模块 "${module.moduleName}" 吗?该模块下的所有需求将被一并删除。`,
|
confirmButtonText: '确认删除',
|
||||||
'删除确认',
|
cancelButtonText: '取消',
|
||||||
{
|
type: 'warning'
|
||||||
confirmButtonText: '确认删除',
|
});
|
||||||
cancelButtonText: '取消',
|
|
||||||
type: 'warning'
|
|
||||||
}
|
|
||||||
);
|
|
||||||
} catch {
|
} catch {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -309,23 +264,12 @@ defineExpose({
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="requirement-module-tree-wrapper">
|
<ElCard class="requirement-module-tree-card card-wrapper">
|
||||||
<div class="module-tree-header">
|
<template #header>
|
||||||
<span class="module-tree-header__title">模块</span>
|
<div class="module-tree-header">
|
||||||
<ElSpace>
|
<span class="module-tree-header__title">模块</span>
|
||||||
<ElButton
|
</div>
|
||||||
v-auth="{ code: 'project:product:create', source: 'object' }"
|
</template>
|
||||||
circle
|
|
||||||
text
|
|
||||||
size="small"
|
|
||||||
@click="startAddTopModule"
|
|
||||||
>
|
|
||||||
<template #icon>
|
|
||||||
<icon-ic-round-plus class="text-16px" />
|
|
||||||
</template>
|
|
||||||
</ElButton>
|
|
||||||
</ElSpace>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="module-tree-list">
|
<div class="module-tree-list">
|
||||||
<template v-for="data in moduleTree" :key="data.id">
|
<template v-for="data in moduleTree" :key="data.id">
|
||||||
@@ -351,32 +295,24 @@ defineExpose({
|
|||||||
@update-new-child-module-name="newChildModuleName = $event"
|
@update-new-child-module-name="newChildModuleName = $event"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<div v-if="addingTopModule" class="module-tree-item module-tree-item--new">
|
|
||||||
<div class="module-tree-item__icon">
|
|
||||||
<icon-mdi-folder-plus-outline class="text-16px" />
|
|
||||||
</div>
|
|
||||||
<div class="module-tree-item__content">
|
|
||||||
<ElInput
|
|
||||||
v-model="newModuleName"
|
|
||||||
size="small"
|
|
||||||
class="new-module-input module-tree-item__input"
|
|
||||||
placeholder="请输入模块名"
|
|
||||||
@blur="handleAddTopModuleConfirm"
|
|
||||||
@keyup.enter="handleAddTopModuleConfirm"
|
|
||||||
@keyup.esc="handleAddTopModuleCancel"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</ElCard>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.requirement-module-tree-wrapper {
|
.requirement-module-tree-card {
|
||||||
display: flex;
|
height: 100%;
|
||||||
flex-direction: column;
|
}
|
||||||
gap: 14px;
|
|
||||||
|
.requirement-module-tree-card :deep(.el-card__header) {
|
||||||
|
padding: 12px 16px;
|
||||||
|
border-bottom: 1px solid #f1f5f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.requirement-module-tree-card :deep(.el-card__body) {
|
||||||
|
padding: 12px 8px;
|
||||||
|
height: calc(100% - 49px);
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-header {
|
.module-tree-header {
|
||||||
@@ -386,66 +322,34 @@ defineExpose({
|
|||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-header__title {
|
.module-tree-header__title {
|
||||||
color: rgb(15 23 42 / 94%);
|
color: #1e293b;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
font-weight: 700;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-list {
|
.module-tree-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 10px;
|
gap: 2px;
|
||||||
min-height: 0;
|
min-height: 0;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item {
|
.module-tree-list::-webkit-scrollbar {
|
||||||
display: flex;
|
width: 4px;
|
||||||
align-items: center;
|
|
||||||
gap: 10px;
|
|
||||||
width: 100%;
|
|
||||||
min-height: 42px;
|
|
||||||
padding: 0 14px;
|
|
||||||
border: 1px solid rgb(226 232 240 / 92%);
|
|
||||||
border-radius: 14px;
|
|
||||||
background-color: rgb(248 250 252 / 96%);
|
|
||||||
color: rgb(71 85 105 / 94%);
|
|
||||||
font-size: 14px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition:
|
|
||||||
border-color 0.2s ease,
|
|
||||||
background-color 0.2s ease,
|
|
||||||
color 0.2s ease,
|
|
||||||
transform 0.2s ease;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item:hover {
|
.module-tree-list::-webkit-scrollbar-track {
|
||||||
transform: translateY(-1px);
|
background: transparent;
|
||||||
border-color: rgb(148 163 184 / 56%);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item--new {
|
.module-tree-list::-webkit-scrollbar-thumb {
|
||||||
border-style: dashed;
|
background-color: #e2e8f0;
|
||||||
border-color: rgb(148 163 184 / 56%);
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.module-tree-item__icon {
|
.module-tree-list::-webkit-scrollbar-thumb:hover {
|
||||||
display: flex;
|
background-color: #cbd5e1;
|
||||||
align-items: center;
|
|
||||||
flex-shrink: 0;
|
|
||||||
color: rgb(100 116 139 / 80%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.module-tree-item__content {
|
|
||||||
flex: 1;
|
|
||||||
min-width: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.module-tree-item__input {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.module-tree-item__input :deep(.el-input__inner) {
|
|
||||||
height: 28px;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from 'vue';
|
import { computed, h, onMounted, ref } from 'vue';
|
||||||
import { RDMS_REQ_SOURCE_TYPE_DICT_CODE } from '@/constants/dict';
|
import { RDMS_REQ_SOURCE_TYPE_DICT_CODE } from '@/constants/dict';
|
||||||
import { fetchGetRequirementStatusDict } from '@/service/api';
|
import { fetchGetRequirementStatusDict } from '@/service/api';
|
||||||
import DictSelect from '@/components/custom/dict-select.vue';
|
import { useDict } from '@/hooks/business/dict';
|
||||||
import TableSearchPanel from '@/components/custom/table-search-panel.vue';
|
import TableSearchFields from '@/components/custom/table-search-fields.vue';
|
||||||
import MemberSelectOption from './member-select-option.vue';
|
import MemberSelectOption from './member-select-option.vue';
|
||||||
|
|
||||||
defineOptions({ name: 'RequirementSearch' });
|
defineOptions({ name: 'RequirementSearch' });
|
||||||
@@ -20,7 +20,7 @@ interface Props {
|
|||||||
priorityDictCode: string;
|
priorityDictCode: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
defineProps<Props>();
|
const props = defineProps<Props>();
|
||||||
|
|
||||||
interface Emits {
|
interface Emits {
|
||||||
(e: 'reset'): void;
|
(e: 'reset'): void;
|
||||||
@@ -33,6 +33,32 @@ const model = defineModel<Api.Product.RequirementSearchParams>('model', { requir
|
|||||||
|
|
||||||
const requirementStatusOptions = ref<Array<{ label: string; value: string }>>([]);
|
const requirementStatusOptions = ref<Array<{ label: string; value: string }>>([]);
|
||||||
|
|
||||||
|
const { enabledDictData: sourceTypeDictData } = useDict(RDMS_REQ_SOURCE_TYPE_DICT_CODE);
|
||||||
|
|
||||||
|
const sourceTypeOptions = computed(() => {
|
||||||
|
return sourceTypeDictData.value
|
||||||
|
.filter(item => item.value !== 'product_requirement')
|
||||||
|
.map(item => ({
|
||||||
|
label: item.label,
|
||||||
|
value: item.value
|
||||||
|
}));
|
||||||
|
});
|
||||||
|
|
||||||
|
const memberSelectOptions = computed(() => {
|
||||||
|
return props.memberOptions.map(item => ({
|
||||||
|
label: item.nickname,
|
||||||
|
value: item.id,
|
||||||
|
roleName: item.roleName
|
||||||
|
}));
|
||||||
|
});
|
||||||
|
|
||||||
|
function renderMemberOption(option: { label: string; value: string | number; roleName?: string }) {
|
||||||
|
return h(MemberSelectOption, {
|
||||||
|
nickname: option.label,
|
||||||
|
roleName: option.roleName || ''
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
async function loadStatusOptions() {
|
async function loadStatusOptions() {
|
||||||
const { error, data } = await fetchGetRequirementStatusDict();
|
const { error, data } = await fetchGetRequirementStatusDict();
|
||||||
|
|
||||||
@@ -47,80 +73,58 @@ async function loadStatusOptions() {
|
|||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
function reset() {
|
|
||||||
emit('reset');
|
|
||||||
}
|
|
||||||
|
|
||||||
function search() {
|
|
||||||
emit('search');
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await loadStatusOptions();
|
await loadStatusOptions();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const fields = computed(() => [
|
||||||
|
{
|
||||||
|
key: 'title',
|
||||||
|
label: '需求名称',
|
||||||
|
type: 'input' as const,
|
||||||
|
placeholder: '输入需求名称'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'priority',
|
||||||
|
label: '优先级',
|
||||||
|
type: 'dict' as const,
|
||||||
|
dictCode: props.priorityDictCode,
|
||||||
|
placeholder: '筛选优先级'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'statusCode',
|
||||||
|
label: '状态',
|
||||||
|
type: 'select' as const,
|
||||||
|
placeholder: '筛选状态',
|
||||||
|
options: requirementStatusOptions.value
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'category',
|
||||||
|
label: '需求类型',
|
||||||
|
type: 'dict' as const,
|
||||||
|
dictCode: props.categoryDictCode,
|
||||||
|
placeholder: '筛选需求类型'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'sourceType',
|
||||||
|
label: '需求来源',
|
||||||
|
type: 'select' as const,
|
||||||
|
placeholder: '筛选需求来源',
|
||||||
|
options: sourceTypeOptions.value
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'currentHandlerUserId',
|
||||||
|
label: '负责人',
|
||||||
|
type: 'select' as const,
|
||||||
|
placeholder: '筛选负责人',
|
||||||
|
options: memberSelectOptions.value,
|
||||||
|
renderOption: renderMemberOption
|
||||||
|
}
|
||||||
|
]);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TableSearchPanel :model="model" :action-col-lg="6" @reset="reset" @search="search">
|
<TableSearchFields v-model="model" :fields="fields" :columns="3" @search="emit('search')" @reset="emit('reset')" />
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="标题">
|
|
||||||
<ElInput v-model="model.title" clearable placeholder="输入需求标题" />
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="分类">
|
|
||||||
<DictSelect
|
|
||||||
v-model="model.category"
|
|
||||||
:dict-code="categoryDictCode"
|
|
||||||
clearable
|
|
||||||
filterable
|
|
||||||
placeholder="筛选分类"
|
|
||||||
/>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="优先级">
|
|
||||||
<DictSelect v-model="model.priority" :dict-code="priorityDictCode" clearable placeholder="筛选优先级" />
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="状态">
|
|
||||||
<ElSelect v-model="model.statusCode" clearable placeholder="筛选状态">
|
|
||||||
<ElOption
|
|
||||||
v-for="item in requirementStatusOptions"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
/>
|
|
||||||
</ElSelect>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="负责人">
|
|
||||||
<ElSelect
|
|
||||||
v-model="model.currentHandlerUserId"
|
|
||||||
clearable
|
|
||||||
filterable
|
|
||||||
placeholder="筛选负责人"
|
|
||||||
:filter-method="(val: string) => val"
|
|
||||||
>
|
|
||||||
<ElOption v-for="item in memberOptions" :key="item.id" :label="item.nickname" :value="item.id">
|
|
||||||
<MemberSelectOption :nickname="item.nickname" :role-name="item.roleName || ''" />
|
|
||||||
</ElOption>
|
|
||||||
</ElSelect>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
<ElCol :lg="6" :md="12" :sm="12">
|
|
||||||
<ElFormItem label="来源类型">
|
|
||||||
<DictSelect
|
|
||||||
v-model="model.sourceType"
|
|
||||||
:dict-code="RDMS_REQ_SOURCE_TYPE_DICT_CODE"
|
|
||||||
clearable
|
|
||||||
placeholder="筛选来源类型"
|
|
||||||
/>
|
|
||||||
</ElFormItem>
|
|
||||||
</ElCol>
|
|
||||||
</TableSearchPanel>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped></style>
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user