vue2-client 1.19.65 → 1.19.67
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude/skills/af-vue2-client-maintainer/.openskills.json +5 -0
- package/.claude/skills/af-vue2-client-maintainer/SKILL.md +69 -0
- package/.claude/skills/af-vue2-client-maintainer/references/examples.md +87 -0
- package/.claude/skills/af-vue2-client-maintainer/references/reference.md +119 -0
- package/.claude/skills/af-vue2-client-maintainer/scripts/lint-check.sh +20 -0
- package/AGENTS.md +142 -0
- package/docs//350/257/267/346/261/202/345/267/245/345/205/267/344/275/277/347/224/250/350/257/264/346/230/216.md +20 -2
- package/package.json +1 -1
- package/src/base-client/components/common/XDescriptions/XDescriptionsGroup.vue +2 -2
- package/src/base-client/components/common/XForm/XTreeSelect.vue +276 -276
- package/src/base-client/components/common/XFormTable/demo.vue +80 -35
- package/src/base-client/components/common/XTable/ExportExcel.vue +36 -6
- package/src/base-client/components/common/XTable/XTable.vue +7 -3
- package/src/base-client/components/his/XHDescriptions/XHDescriptions.vue +1473 -1473
- package/src/components/xScrollBox/index.vue +6 -25
- package/src/pages/LayoutTest/index.vue +19 -0
- package/src/pages/WorkflowDetail/WorkFlowDemo4.vue +127 -0
- package/src/pages/WorkflowDetail/WorkflowPageDetail/WorkFlowBaseInformation.vue +417 -417
- package/src/router/async/router.map.js +2 -1
- package/src/utils/requestDedupe.js +24 -8
- package/vue.config.js +1 -1
- package/src/base-client/components/common/XAddForm/XAddForm +0 -0
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: af-vue2-client-maintainer
|
|
3
|
+
description: Maintains and extends the af-vue2-client (Vue 2.7 + Ant Design Vue) frontend. Use when developing, fixing, refactoring, or extending af-vue2-client; when working with base-client X components (XForm, XTable, XCard, XPageView), config-driven UI, multi-environment deployment (his, gaslink, revenue, etc.), or Vue 2.7 frontend maintenance.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# af-vue2-client 项目维护
|
|
7
|
+
|
|
8
|
+
## 使用本技能时的工作流程
|
|
9
|
+
|
|
10
|
+
1. **确认任务类型**:区分是开发新功能、修复问题、重构、发布版本,还是查配置/排错。
|
|
11
|
+
2. **定位入口**:根据任务查下方「关键路径速查」或「修改与排错」,确定要改的目录与文件(如页面→`src/pages/`+`src/router/`,接口→`src/services/`,配置→`vue.config.js`/`.env*`)。
|
|
12
|
+
3. **按需查阅参考**:需要代码风格、目录树、技术栈或发布清单时读 [references/reference.md](references/reference.md);需要按步骤操作(新增页面、lint、发布、API、X 组件)时读 [references/examples.md](references/examples.md)。
|
|
13
|
+
4. **按规范修改**:遵循本页「架构与规范要点」与 reference 中的约定;优先用配置与 X 组件,少写硬编码;新代码用 Vue 2.7 组合 API + `<script setup>`。
|
|
14
|
+
5. **验证与收尾**:修改后运行 `npm run lint`(或执行 `scripts/lint-check.sh`);涉及功能时视情况 `npm run mac-serve` 或运行测试;若为发布,按「发布前检查」完成版本号、CHANGELOG、commit。
|
|
15
|
+
|
|
16
|
+
---
|
|
17
|
+
|
|
18
|
+
## 快速开始
|
|
19
|
+
|
|
20
|
+
### 常用命令
|
|
21
|
+
|
|
22
|
+
| 场景 | 命令 |
|
|
23
|
+
|------|------|
|
|
24
|
+
| 开发(macOS/Linux) | `npm run mac-serve`(端口 8020,默认 his 模式) |
|
|
25
|
+
| 开发(Windows) | `npm run serve`(需 SET NODE_OPTIONS=--openssl-legacy-provider) |
|
|
26
|
+
| 多环境 | `npm run serve:his`、`serve:gaslink`、`serve:revenue`、`serve:liuli`、`serve:scada`、`serve:iot`、`serve:runtime`、`serve:message`、`serve:apply` |
|
|
27
|
+
| 构建 | `npm run build`、`npm run build:preview` |
|
|
28
|
+
| 质量 | `npm run lint`、`npm run lint:nofix`;`npm test` / `npm run test:unit` |
|
|
29
|
+
|
|
30
|
+
### 发布前检查
|
|
31
|
+
|
|
32
|
+
1. 更新 `package.json` 版本号 → 2. 运行 `yarn lint` 或 `npm run lint` 通过 → 3. 更新 `CHANGELOG.md`(格式参考既有条目,提交人 `git config user.name`,日期当前)→ 4. `git status` 确认 → 5. 约定式 commit,可加 emoji(✨🐛⚡🔧📝♻️🎨)。详见 [references/reference.md](references/reference.md) 发布检查清单与项目内 `.cursor/commands/release.md`。
|
|
33
|
+
|
|
34
|
+
## 架构与规范要点
|
|
35
|
+
|
|
36
|
+
- **技术栈**:Vue 2.7、Vue Router 3、Vuex 3、Ant Design Vue 1.7.8、Less、Vue CLI 5、Webpack 5。
|
|
37
|
+
- **基础组件**:`src/base-client/` 下 XForm、XTable、XCard、XPageView 等全局注册,JSON 配置驱动;优先用配置,少写硬编码。
|
|
38
|
+
- **目录与命名**:目录 kebab-case;组件 PascalCase;可组合/工具 camelCase;常量 UPPER_SNAKE_CASE;注释与用户文案中文。
|
|
39
|
+
- **代码风格**:优先 Vue 2.7 组合 API + `<script setup>`;方法/计算属性用箭头函数;布尔用 is/has/can/should 前缀;导入顺序:Vue/第三方 → 组件 → composables → utils → 样式。完整约定见 [references/reference.md](references/reference.md)。
|
|
40
|
+
- **API 与数据**:统一 `src/services/apiService.js`,DataModel 转换,axios 拦截器错误处理;Webpack 别名 `@`、`@vue2-client` → `src/`。
|
|
41
|
+
- **环境**:开发端口 8020;Windows 需 NODE_OPTIONS=--openssl-legacy-provider;多模式代理见 `vue.config.js` 与 `.env*`。
|
|
42
|
+
|
|
43
|
+
## 关键路径速查
|
|
44
|
+
|
|
45
|
+
| 用途 | 路径 |
|
|
46
|
+
|------|------|
|
|
47
|
+
| 入口 | `src/main.js`、`src/bootstrap.js`、`src/App.vue` |
|
|
48
|
+
| 基础组件 | `src/base-client/components/` |
|
|
49
|
+
| 页面/布局/路由 | `src/pages/`、`src/layouts/`、`src/router/`(含 guards、async/router.map.js) |
|
|
50
|
+
| 服务/状态/配置 | `src/services/`、`src/store/modules/`、`src/config/` |
|
|
51
|
+
| 工具/主题/低代码 | `src/utils/`、`src/theme/`、`src/expression/`、`src/logic/` |
|
|
52
|
+
| 静态/测试 | `public/`、`src/assets/`;`test/`、`tests/unit/` |
|
|
53
|
+
|
|
54
|
+
## 修改与排错
|
|
55
|
+
|
|
56
|
+
- **配置/环境**:`vue.config.js`、根目录 `.env*`。
|
|
57
|
+
- **接口/数据流**:`src/services/apiService.js`、`api/*`、DataModel。
|
|
58
|
+
- **页面/路由**:`src/router/`、`src/pages/`;动态路由看 `async/router.map.js`。
|
|
59
|
+
- **全局/插件**:`src/bootstrap.js`、`src/base-client/plugins/`。
|
|
60
|
+
- **UI 组件**:优先改 JSON 配置或 X 组件用法;必须改组件再动 `base-client/components/`。
|
|
61
|
+
- **低代码/表达式**:`src/logic/`、`src/expression/`;前端脚本与配置见 `docs/`。
|
|
62
|
+
|
|
63
|
+
## 附加资源
|
|
64
|
+
|
|
65
|
+
- **详细参考**(代码风格、目录树、技术栈、发布清单):需要更细约定或清单时读 [references/reference.md](references/reference.md)。
|
|
66
|
+
- **步骤示例**(新增页面/路由、lint、发布、API、X 组件):需要按步骤执行时读 [references/examples.md](references/examples.md)。
|
|
67
|
+
- **脚本**:提交或发布前可在项目根执行 `bash .claude/skills/af-vue2-client-maintainer/scripts/lint-check.sh`,依 lint 结果退出(0=通过)。
|
|
68
|
+
|
|
69
|
+
项目内补充:根目录 CLAUDE.md、`.serena/memories/` 下代码风格/结构/技术栈、`.cursor/commands/release.md`。
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
# af-vue2-client 维护示例
|
|
2
|
+
|
|
3
|
+
以下为常见维护场景的步骤示例,按需查阅。需要代码风格、目录或技术栈细节时见 [reference.md](reference.md)。
|
|
4
|
+
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
## 示例 1:新增一个页面并配置路由
|
|
8
|
+
|
|
9
|
+
1. **新建页面目录与组件**(目录 kebab-case,组件 PascalCase)
|
|
10
|
+
- 在 `src/pages/` 下新建目录,如 `src/pages/demo-list/`。
|
|
11
|
+
- 新建 `DemoList.vue`,使用组合 API + `<script setup>`,按 [reference.md](reference.md) 的命名与导入顺序。
|
|
12
|
+
|
|
13
|
+
2. **配置路由**
|
|
14
|
+
- 静态路由:在 `src/router/index.js` 中增加对应 `path`、`name`、`component`(指向 `pages/demo-list/DemoList.vue`)。
|
|
15
|
+
- 动态/异步路由:在 `src/router/async/router.map.js` 或对应映射中增加菜单与路由配置。
|
|
16
|
+
|
|
17
|
+
3. **如需菜单**
|
|
18
|
+
- 在菜单配置(通常与路由映射或权限配置在一起)中增加该页的菜单项与 path/name 对应。
|
|
19
|
+
|
|
20
|
+
4. **验证**
|
|
21
|
+
- `npm run mac-serve` 或 `npm run serve` 启动,访问对应 path,确认页面与路由正常。
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
## 示例 2:提交前做 Lint 检查
|
|
26
|
+
|
|
27
|
+
1. **本地执行**
|
|
28
|
+
- 在项目根目录执行:`npm run lint` 或 `yarn lint`。
|
|
29
|
+
- 若有自动修复,保存后再跑一次直至无报错。
|
|
30
|
+
|
|
31
|
+
2. **使用技能自带脚本(可选)**
|
|
32
|
+
- 在项目根执行:`bash .claude/skills/af-vue2-client-maintainer/scripts/lint-check.sh`。
|
|
33
|
+
- 脚本以 lint 退出码退出:0 表示通过,非 0 表示未通过,需先修完再提交。
|
|
34
|
+
|
|
35
|
+
3. **发布前**
|
|
36
|
+
- 按 [reference.md](reference.md) 的发布检查清单,确保「代码检查:yarn lint 无错误通过」已勾选。
|
|
37
|
+
|
|
38
|
+
---
|
|
39
|
+
|
|
40
|
+
## 示例 3:发布版本(按 release 流程)
|
|
41
|
+
|
|
42
|
+
1. 更新 `package.json` 的 `version`。
|
|
43
|
+
2. 运行 `yarn lint`(或 `npm run lint`),确保通过。
|
|
44
|
+
3. 编辑 `CHANGELOG.md`:新增当前版本小节,写版本号、日期、更新内容;提交人用 `git config user.name`;格式参考已有条目。
|
|
45
|
+
4. 运行 `git status`,确认无未提交修改。
|
|
46
|
+
5. 提交:
|
|
47
|
+
`git add ... && git commit -m "发布 x.xx.xx\n\n- 条目1\n- 条目2"`
|
|
48
|
+
可按需加 emoji(✨🐛⚡🔧📝♻️🎨)。
|
|
49
|
+
|
|
50
|
+
详见 [reference.md](reference.md) 的「发布检查清单」与项目内 `.cursor/commands/release.md`。
|
|
51
|
+
|
|
52
|
+
---
|
|
53
|
+
|
|
54
|
+
## 示例 4:新增或调用一个 API 模块
|
|
55
|
+
|
|
56
|
+
1. **定义接口**
|
|
57
|
+
- 在 `src/services/api/` 下新增或修改模块(如 `demo.js`),使用 `apiService` 或项目约定的请求封装发起 HTTP 请求。
|
|
58
|
+
|
|
59
|
+
2. **在页面/组件中调用**
|
|
60
|
+
- 在页面中 `import` 该 API 模块,在组合 API 的 `setup` 中调用(如 `onMounted` 或事件处理函数内)。
|
|
61
|
+
- 数据转换如需统一模型,使用 `DataModel` 或项目约定的转换方式。
|
|
62
|
+
|
|
63
|
+
3. **错误处理**
|
|
64
|
+
- 依赖项目已有的 axios 拦截器做统一错误处理;如需页面级提示,使用 Ant Design Vue 的 `message` 或项目约定方式。
|
|
65
|
+
|
|
66
|
+
4. **联调与验证**
|
|
67
|
+
- 确认 `vue.config.js` 或对应环境的代理指向正确后端;启动开发服务后调通接口并检查数据与错误提示。
|
|
68
|
+
|
|
69
|
+
---
|
|
70
|
+
|
|
71
|
+
## 示例 5:用 X 组件做配置驱动的表单/表格
|
|
72
|
+
|
|
73
|
+
1. **准备 JSON 配置**
|
|
74
|
+
- 参考现有使用 XForm、XTable 的页面,准备 `columns`/`formConfig` 等 JSON(字段 key、title、type、rule 等)。
|
|
75
|
+
|
|
76
|
+
2. **在页面中挂载**
|
|
77
|
+
- 在页面中引入或使用全局已注册的 XForm、XTable,将配置通过 props 传入;如需数据,从 API 获取后绑定到对应 props。
|
|
78
|
+
|
|
79
|
+
3. **事件与提交**
|
|
80
|
+
- 按 X 组件文档或现有用法,监听提交/校验事件,在回调中调用 `apiService` 或具体 API 完成提交;错误用项目统一方式展示。
|
|
81
|
+
|
|
82
|
+
4. **样式**
|
|
83
|
+
- 如需覆盖样式,使用 Less,作用域限定在页面或组件内;主题变量从 `src/theme/` 引用。
|
|
84
|
+
|
|
85
|
+
---
|
|
86
|
+
|
|
87
|
+
需要更细的代码风格、目录说明或技术栈版本时,见 [reference.md](reference.md)。
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
# af-vue2-client 详细参考
|
|
2
|
+
|
|
3
|
+
需要更细的约定、目录树或技术栈时查阅本文档。日常以 [SKILL.md](../SKILL.md) 为主。
|
|
4
|
+
|
|
5
|
+
## 目录
|
|
6
|
+
|
|
7
|
+
- [代码风格与约定](#代码风格与约定)
|
|
8
|
+
- [项目目录结构](#项目目录结构)
|
|
9
|
+
- [技术栈版本](#技术栈版本)
|
|
10
|
+
- [发布检查清单](#发布检查清单)
|
|
11
|
+
- [项目内其他文档](#项目内其他文档)
|
|
12
|
+
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
## 代码风格与约定
|
|
16
|
+
|
|
17
|
+
### 组件
|
|
18
|
+
- 优先:Vue 2.7 组合 API + `<script setup>`,声明式。
|
|
19
|
+
- 避免:选项 API(除非改既有代码)。
|
|
20
|
+
- 方法/计算属性用箭头函数;简单条件可单行 `if (x) return y`。
|
|
21
|
+
|
|
22
|
+
### 命名
|
|
23
|
+
- 目录:kebab-case(如 `user-manage`)。
|
|
24
|
+
- 组件文件:PascalCase(如 `UserTable.vue`)。
|
|
25
|
+
- 可组合/工具:camelCase(如 `useAuthState.js`、`formatDate.js`)。
|
|
26
|
+
- 布尔:`isLoading`、`hasError`、`canEdit`、`shouldShow`。
|
|
27
|
+
- 常量:UPPER_SNAKE_CASE。
|
|
28
|
+
- 注释与用户可见文案:中文。
|
|
29
|
+
|
|
30
|
+
### 导入顺序
|
|
31
|
+
1. Vue/第三方库 → 2. 组件 → 3. composables → 4. utils → 5. 样式。
|
|
32
|
+
|
|
33
|
+
### X 组件与配置
|
|
34
|
+
- base-client 中 XForm、XTable、XCard、XPageView 等全局注册,用 JSON 配置驱动。
|
|
35
|
+
- 系统配置在 `src/config/`,默认配置在 `src/config/default/`,替换器在 `src/config/replacer/`。
|
|
36
|
+
- 能用配置的不写硬编码;表单校验等共享逻辑用 mixins;布局用 XFormCol 栅格。
|
|
37
|
+
|
|
38
|
+
### Less 与主题
|
|
39
|
+
- Less 变量在 `src/theme/`,Ant Design 主题可动态替换;组件样式与组件同目录;可选 BEM。
|
|
40
|
+
|
|
41
|
+
### ESLint / Git
|
|
42
|
+
- 提交前必须 `npm run lint` 通过;推荐约定式提交(feat/fix/docs/style/refactor/test/chore)。
|
|
43
|
+
|
|
44
|
+
---
|
|
45
|
+
|
|
46
|
+
## 项目目录结构
|
|
47
|
+
|
|
48
|
+
```
|
|
49
|
+
vue2-client/
|
|
50
|
+
├── src/
|
|
51
|
+
│ ├── main.js, bootstrap.js, App.vue # 入口
|
|
52
|
+
│ ├── base-client/ # 基础组件(X 系列,全局注册)
|
|
53
|
+
│ │ ├── components/ # XForm, XTable, XCard, XPageView...
|
|
54
|
+
│ │ └── plugins/
|
|
55
|
+
│ ├── pages/ # 页面(按功能分子目录)
|
|
56
|
+
│ ├── layouts/ # 布局
|
|
57
|
+
│ ├── router/ # 路由(index, guards, async/router.map.js)
|
|
58
|
+
│ ├── services/ # apiService, DataModel, api/*
|
|
59
|
+
│ ├── store/modules/ # Vuex 模块
|
|
60
|
+
│ ├── config/ # 配置(default, replacer)
|
|
61
|
+
│ ├── utils/ # 工具
|
|
62
|
+
│ ├── theme/ # 主题
|
|
63
|
+
│ ├── expression/, logic/ # 低代码表达式与逻辑
|
|
64
|
+
│ ├── components/ # 通用组件(按需引入)
|
|
65
|
+
│ ├── mixins/, plugins/ # 混入与自定义插件
|
|
66
|
+
│ └── assets/ # 静态资源(经 Webpack)
|
|
67
|
+
├── public/ # 静态资源(不经 Webpack)
|
|
68
|
+
├── test/, tests/unit/ # 测试
|
|
69
|
+
├── vue.config.js, package.json, .env* # 配置
|
|
70
|
+
└── .cursor/commands/release.md # 发布步骤
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
---
|
|
74
|
+
|
|
75
|
+
## 技术栈版本
|
|
76
|
+
|
|
77
|
+
| 类别 | 依赖 | 版本/说明 |
|
|
78
|
+
|----------|--------------------|------------------|
|
|
79
|
+
| 框架 | Vue | 2.7.14 |
|
|
80
|
+
| 路由/状态| Vue Router / Vuex | 3.6.x |
|
|
81
|
+
| UI | ant-design-vue | 1.7.8 |
|
|
82
|
+
| 构建 | Vue CLI / Webpack | 5.x / 5.x |
|
|
83
|
+
| 样式 | Less | 预处理器 |
|
|
84
|
+
| HTTP | axios | 0.27.x |
|
|
85
|
+
| 测试 | Jest, @vue/test-utils | 29.x, 1.3.x |
|
|
86
|
+
| 开发端口 | — | 8020 |
|
|
87
|
+
| 别名 | @, @vue2-client | → src/ |
|
|
88
|
+
|
|
89
|
+
- Windows 需 `NODE_OPTIONS=--openssl-legacy-provider`;不支持 IE11。
|
|
90
|
+
|
|
91
|
+
---
|
|
92
|
+
|
|
93
|
+
## 发布检查清单
|
|
94
|
+
|
|
95
|
+
1. 更新 `package.json` 版本号。
|
|
96
|
+
2. 运行 `yarn lint` 或 `npm run lint`,无错误通过。
|
|
97
|
+
3. 更新 `CHANGELOG.md`:版本号、更新内容、提交人(`git config user.name`)、当前日期;格式参考既有条目。
|
|
98
|
+
4. `git status` 确认无遗漏未提交更改。
|
|
99
|
+
5. 写约定式 commit,可加 emoji:✨ 新功能、🐛 修复、⚡ 性能、🔧 配置、📝 文档、♻️ 重构、🎨 样式。
|
|
100
|
+
|
|
101
|
+
提交 message 示例:
|
|
102
|
+
|
|
103
|
+
```
|
|
104
|
+
发布 x.xx.xx
|
|
105
|
+
|
|
106
|
+
- 新增 xxx 功能
|
|
107
|
+
- 修改 xxx 中的 xxx 方法
|
|
108
|
+
- 更新 xxx 枚举,增加 xxx 选项
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
---
|
|
112
|
+
|
|
113
|
+
## 项目内其他文档
|
|
114
|
+
|
|
115
|
+
- 项目根目录 [CLAUDE.md](../../../../CLAUDE.md):命令与架构总览。
|
|
116
|
+
- `.serena/memories/code_style_conventions.md`:完整代码风格。
|
|
117
|
+
- `.serena/memories/project_structure.md`:完整目录与模块说明。
|
|
118
|
+
- `.serena/memories/tech_stack.md`:完整技术栈与配置。
|
|
119
|
+
- `.cursor/commands/release.md`:发布步骤与 commit 示例。
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
#!/usr/bin/env bash
|
|
2
|
+
# 在 af-vue2-client 项目根目录执行 lint,退出码与 lint 结果一致(0=通过,非0=未通过)。
|
|
3
|
+
# 用法:在项目根目录执行 bash .claude/skills/af-vue2-client-maintainer/scripts/lint-check.sh
|
|
4
|
+
# 或从技能目录执行:bash scripts/lint-check.sh(需先 cd 到项目根)
|
|
5
|
+
|
|
6
|
+
set -e
|
|
7
|
+
|
|
8
|
+
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
|
|
9
|
+
# 技能目录 = scripts 的上一级
|
|
10
|
+
SKILL_DIR="$(cd "$SCRIPT_DIR/.." && pwd)"
|
|
11
|
+
# 项目根 = 技能目录的上一级的上一级(.claude/skills/af-vue2-client-maintainer -> 项目根)
|
|
12
|
+
ROOT_DIR="$(cd "$SKILL_DIR/../.." && pwd)"
|
|
13
|
+
|
|
14
|
+
cd "$ROOT_DIR"
|
|
15
|
+
|
|
16
|
+
if command -v yarn >/dev/null 2>&1; then
|
|
17
|
+
yarn lint
|
|
18
|
+
else
|
|
19
|
+
npm run lint
|
|
20
|
+
fi
|
package/AGENTS.md
ADDED
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
# AGENTS
|
|
2
|
+
|
|
3
|
+
<skills_system priority="1">
|
|
4
|
+
|
|
5
|
+
## Available Skills
|
|
6
|
+
|
|
7
|
+
<!-- SKILLS_TABLE_START -->
|
|
8
|
+
<usage>
|
|
9
|
+
When users ask you to perform tasks, check if any of the available skills below can help complete the task more effectively. Skills provide specialized capabilities and domain knowledge.
|
|
10
|
+
|
|
11
|
+
How to use skills:
|
|
12
|
+
- Invoke: `npx openskills read <skill-name>` (run in your shell)
|
|
13
|
+
- For multiple: `npx openskills read skill-one,skill-two`
|
|
14
|
+
- The skill content will load with detailed instructions on how to complete the task
|
|
15
|
+
- Base directory provided in output for resolving bundled resources (references/, scripts/, assets/)
|
|
16
|
+
|
|
17
|
+
Usage notes:
|
|
18
|
+
- Only use skills listed in <available_skills> below
|
|
19
|
+
- Do not invoke a skill that is already loaded in your context
|
|
20
|
+
- Each skill invocation is stateless
|
|
21
|
+
</usage>
|
|
22
|
+
|
|
23
|
+
<available_skills>
|
|
24
|
+
|
|
25
|
+
<skill>
|
|
26
|
+
<name>af-vue2-client-maintainer</name>
|
|
27
|
+
<description>Maintains and extends the af-vue2-client (Vue 2.7 + Ant Design Vue) frontend project. Use when developing, fixing, refactoring, or extending af-vue2-client, when working with base-client X components, config-driven UI, multi-environment deployment, or Vue 2.7 frontend maintenance.</description>
|
|
28
|
+
<location>project</location>
|
|
29
|
+
</skill>
|
|
30
|
+
|
|
31
|
+
<skill>
|
|
32
|
+
<name>algorithmic-art</name>
|
|
33
|
+
<description>Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.</description>
|
|
34
|
+
<location>global</location>
|
|
35
|
+
</skill>
|
|
36
|
+
|
|
37
|
+
<skill>
|
|
38
|
+
<name>brand-guidelines</name>
|
|
39
|
+
<description>Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.</description>
|
|
40
|
+
<location>global</location>
|
|
41
|
+
</skill>
|
|
42
|
+
|
|
43
|
+
<skill>
|
|
44
|
+
<name>canvas-design</name>
|
|
45
|
+
<description>Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.</description>
|
|
46
|
+
<location>global</location>
|
|
47
|
+
</skill>
|
|
48
|
+
|
|
49
|
+
<skill>
|
|
50
|
+
<name>doc-coauthoring</name>
|
|
51
|
+
<description>Guide users through a structured workflow for co-authoring documentation. Use when user wants to write documentation, proposals, technical specs, decision docs, or similar structured content. This workflow helps users efficiently transfer context, refine content through iteration, and verify the doc works for readers. Trigger when user mentions writing docs, creating proposals, drafting specs, or similar documentation tasks.</description>
|
|
52
|
+
<location>global</location>
|
|
53
|
+
</skill>
|
|
54
|
+
|
|
55
|
+
<skill>
|
|
56
|
+
<name>docx</name>
|
|
57
|
+
<description>"Comprehensive document creation, editing, and analysis with support for tracked changes, comments, formatting preservation, and text extraction. When Claude needs to work with professional documents (.docx files) for: (1) Creating new documents, (2) Modifying or editing content, (3) Working with tracked changes, (4) Adding comments, or any other document tasks"</description>
|
|
58
|
+
<location>global</location>
|
|
59
|
+
</skill>
|
|
60
|
+
|
|
61
|
+
<skill>
|
|
62
|
+
<name>frontend-design</name>
|
|
63
|
+
<description>Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.</description>
|
|
64
|
+
<location>global</location>
|
|
65
|
+
</skill>
|
|
66
|
+
|
|
67
|
+
<skill>
|
|
68
|
+
<name>his-config-gen</name>
|
|
69
|
+
<description>Medical HIS (Hospital Information System) configuration generator. Use when user wants to create or generate configuration files for a low-code medical HIS platform, including CRUD forms, report grids, SQL queries, business logic, and charts. Specialized for Chinese medical terminology and follows strict naming conventions.</description>
|
|
70
|
+
<location>global</location>
|
|
71
|
+
</skill>
|
|
72
|
+
|
|
73
|
+
<skill>
|
|
74
|
+
<name>internal-comms</name>
|
|
75
|
+
<description>A set of resources to help me write all kinds of internal communications, using the formats that my company likes to use. Claude should use this skill whenever asked to write some sort of internal communications (status reports, leadership updates, 3P updates, company newsletters, FAQs, incident reports, project updates, etc.).</description>
|
|
76
|
+
<location>global</location>
|
|
77
|
+
</skill>
|
|
78
|
+
|
|
79
|
+
<skill>
|
|
80
|
+
<name>mcp-builder</name>
|
|
81
|
+
<description>Guide for creating high-quality MCP (Model Context Protocol) servers that enable LLMs to interact with external services through well-designed tools. Use when building MCP servers to integrate external APIs or services, whether in Python (FastMCP) or Node/TypeScript (MCP SDK).</description>
|
|
82
|
+
<location>global</location>
|
|
83
|
+
</skill>
|
|
84
|
+
|
|
85
|
+
<skill>
|
|
86
|
+
<name>pdf</name>
|
|
87
|
+
<description>Comprehensive PDF manipulation toolkit for extracting text and tables, creating new PDFs, merging/splitting documents, and handling forms. When Claude needs to fill in a PDF form or programmatically process, generate, or analyze PDF documents at scale.</description>
|
|
88
|
+
<location>global</location>
|
|
89
|
+
</skill>
|
|
90
|
+
|
|
91
|
+
<skill>
|
|
92
|
+
<name>pptx</name>
|
|
93
|
+
<description>"Presentation creation, editing, and analysis. When Claude needs to work with presentations (.pptx files) for: (1) Creating new presentations, (2) Modifying or editing content, (3) Working with layouts, (4) Adding comments or speaker notes, or any other presentation tasks"</description>
|
|
94
|
+
<location>global</location>
|
|
95
|
+
</skill>
|
|
96
|
+
|
|
97
|
+
<skill>
|
|
98
|
+
<name>skill-creator</name>
|
|
99
|
+
<description>Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations.</description>
|
|
100
|
+
<location>global</location>
|
|
101
|
+
</skill>
|
|
102
|
+
|
|
103
|
+
<skill>
|
|
104
|
+
<name>slack-gif-creator</name>
|
|
105
|
+
<description>Knowledge and utilities for creating animated GIFs optimized for Slack. Provides constraints, validation tools, and animation concepts. Use when users request animated GIFs for Slack like "make me a GIF of X doing Y for Slack."</description>
|
|
106
|
+
<location>global</location>
|
|
107
|
+
</skill>
|
|
108
|
+
|
|
109
|
+
<skill>
|
|
110
|
+
<name>template</name>
|
|
111
|
+
<description>Replace with description of the skill and when Claude should use it.</description>
|
|
112
|
+
<location>global</location>
|
|
113
|
+
</skill>
|
|
114
|
+
|
|
115
|
+
<skill>
|
|
116
|
+
<name>theme-factory</name>
|
|
117
|
+
<description>Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.</description>
|
|
118
|
+
<location>global</location>
|
|
119
|
+
</skill>
|
|
120
|
+
|
|
121
|
+
<skill>
|
|
122
|
+
<name>web-artifacts-builder</name>
|
|
123
|
+
<description>Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.</description>
|
|
124
|
+
<location>global</location>
|
|
125
|
+
</skill>
|
|
126
|
+
|
|
127
|
+
<skill>
|
|
128
|
+
<name>webapp-testing</name>
|
|
129
|
+
<description>Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.</description>
|
|
130
|
+
<location>global</location>
|
|
131
|
+
</skill>
|
|
132
|
+
|
|
133
|
+
<skill>
|
|
134
|
+
<name>xlsx</name>
|
|
135
|
+
<description>"Comprehensive spreadsheet creation, editing, and analysis with support for formulas, formatting, data analysis, and visualization. When Claude needs to work with spreadsheets (.xlsx, .xlsm, .csv, .tsv, etc) for: (1) Creating new spreadsheets with formulas and formatting, (2) Reading or analyzing data, (3) Modify existing spreadsheets while preserving formulas, (4) Data analysis and visualization in spreadsheets, or (5) Recalculating formulas"</description>
|
|
136
|
+
<location>global</location>
|
|
137
|
+
</skill>
|
|
138
|
+
|
|
139
|
+
</available_skills>
|
|
140
|
+
<!-- SKILLS_TABLE_END -->
|
|
141
|
+
|
|
142
|
+
</skills_system>
|
|
@@ -193,17 +193,35 @@ POST 请求默认开启去重,防止用户快速重复点击导致的重复提
|
|
|
193
193
|
|
|
194
194
|
**工作原理:**
|
|
195
195
|
- 相同的 URL + 参数 组合视为重复请求
|
|
196
|
-
-
|
|
196
|
+
- **开发环境**:默认使用 `reuse` 策略,复用请求结果,避免热更新(HMR)触发重复请求
|
|
197
|
+
- **生产环境**:默认使用 `reject` 策略,拒绝重复请求,严格防止重复提交
|
|
197
198
|
- 请求完成后自动清理记录
|
|
198
199
|
|
|
200
|
+
**去重策略:**
|
|
201
|
+
|
|
202
|
+
| 策略 | 行为 | 默认环境 | 适用场景 |
|
|
203
|
+
|------|------|---------|---------|
|
|
204
|
+
| `reuse` | 复用第一个请求的结果 | 开发环境 | 下拉框数据、热更新场景 |
|
|
205
|
+
| `reject` | 拒绝后续重复请求 | 生产环境 | 表单提交、数据保存 |
|
|
206
|
+
|
|
199
207
|
**关闭去重:**
|
|
200
208
|
|
|
201
209
|
```javascript
|
|
202
210
|
post('/api/save', data, { dedupe: false })
|
|
203
211
|
```
|
|
204
212
|
|
|
213
|
+
**显式指定策略:**
|
|
214
|
+
|
|
215
|
+
```javascript
|
|
216
|
+
// 强制使用拒绝策略(即使在开发环境)
|
|
217
|
+
post('/api/submit', data, { dedupeStrategy: 'reject' })
|
|
218
|
+
|
|
219
|
+
// 强制使用复用策略(即使在生产环境)
|
|
220
|
+
post('/api/options', params, { dedupeStrategy: 'reuse' })
|
|
221
|
+
```
|
|
222
|
+
|
|
205
223
|
**错误码:**
|
|
206
|
-
- 重复请求被拦截时,error.code 为 `ERR_DUPLICATE_REQUEST
|
|
224
|
+
- 重复请求被拦截时,error.code 为 `ERR_DUPLICATE_REQUEST`(仅 reject 策略)
|
|
207
225
|
|
|
208
226
|
### 2. 全局 Loading
|
|
209
227
|
|
package/package.json
CHANGED
|
@@ -518,12 +518,12 @@ export default {
|
|
|
518
518
|
}
|
|
519
519
|
|
|
520
520
|
:deep(.ant-descriptions-item-label) {
|
|
521
|
-
color: #
|
|
521
|
+
color: #6b7280; // 统一标签颜色
|
|
522
522
|
font-weight: 500;
|
|
523
523
|
}
|
|
524
524
|
|
|
525
525
|
:deep(.ant-descriptions-item-content) {
|
|
526
|
-
color: #
|
|
526
|
+
color: #111827; // 统一内容颜色
|
|
527
527
|
font-weight: 400;
|
|
528
528
|
}
|
|
529
529
|
|