persagy-vant 0.0.21 → 0.0.23
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/README.md +41 -7
- package/es/index.d.ts +1 -1
- package/es/index.mjs +1 -1
- package/es/material-add/MaterialAdd.mjs +7 -9
- package/es/material-add/index.css +1 -1
- package/es/material-add/index.less +4 -1
- package/lib/index.css +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/material-add/MaterialAdd.js +7 -9
- package/lib/material-add/index.css +1 -1
- package/lib/material-add/index.less +4 -1
- package/lib/vant.cjs.js +8 -10
- package/lib/vant.es.js +8 -10
- package/lib/vant.js +8 -10
- package/lib/vant.min.js +1 -1
- package/lib/web-types.json +1 -1
- package/package.json +1 -1
- package/skills/use-persagy-vant/SKILL.md +2 -2
package/README.md
CHANGED
|
@@ -1,6 +1,46 @@
|
|
|
1
1
|
# Persagy Vant AI
|
|
2
2
|
|
|
3
|
-
Persagy 移动端 Vue 3
|
|
3
|
+
Persagy 移动端 Vue 3 组件库。产品经理可通过 AI 编程工具复用统一的基础组件和业务组件，提升产品的视觉、交互与体验一致性。
|
|
4
|
+
|
|
5
|
+
## 产品经理使用方式
|
|
6
|
+
|
|
7
|
+
只使用这一条流程：在**自己的产品项目**安装组件库，再让 AI 读取包内的 Skill。无需下载或复制本仓库。
|
|
8
|
+
|
|
9
|
+
### 1. 安装组件库
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add persagy-vant
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### 2. 每次新开 AI 会话先发送统一指令
|
|
16
|
+
|
|
17
|
+
```text
|
|
18
|
+
请先读取并严格执行 node_modules/persagy-vant/skills/use-persagy-vant/SKILL.md。
|
|
19
|
+
|
|
20
|
+
本项目所有移动端 UI 和业务选择能力必须优先复用 persagy-vant；
|
|
21
|
+
不要自行实现组件库已有的组件、交互或样式。
|
|
22
|
+
实现前先阅读所用组件在 node_modules/persagy-vant/es/<组件名>/README.zh-CN.md 中的 API 和示例。
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
这套方式兼容 Codex、Cursor、Claude Code、Windsurf、Copilot 等可读取项目文件的 AI 编程工具。
|
|
26
|
+
|
|
27
|
+
### 3. 描述本次任务
|
|
28
|
+
|
|
29
|
+
- **根据 PRD 开发**：提供 PRD、原型说明或页面清单，并要求 AI 先列出页面结构、交互流程和拟复用的组件。
|
|
30
|
+
- **优化已有页面**：提供页面路径或问题描述，并要求 AI 先列出问题、改造方案和拟替换的组件，再改代码。
|
|
31
|
+
- **明确指定组件**：直接说“请使用 persagy-vant 的 `<组件名>` 实现 `<业务场景>`”，并要求 AI 先读取该组件 README 后实现。
|
|
32
|
+
|
|
33
|
+
### 获取最新版
|
|
34
|
+
|
|
35
|
+
组件库发布新版本后，在产品项目根目录执行：
|
|
36
|
+
|
|
37
|
+
```bash
|
|
38
|
+
pnpm up persagy-vant
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
然后在下一次 AI 会话重新发送“统一指令”。组件、组件文档和 Skill 会随 npm 包一起更新。
|
|
42
|
+
|
|
43
|
+
完整的可转发说明见：[产品经理 AI 开发使用说明](./docs/markdown/product-manager-guide.zh-CN.md)。
|
|
4
44
|
|
|
5
45
|
## 仓库结构
|
|
6
46
|
|
|
@@ -22,12 +62,6 @@ pnpm build
|
|
|
22
62
|
|
|
23
63
|
常用命令与发布配置见 [package.json](./package.json)。
|
|
24
64
|
|
|
25
|
-
## 使用 Skill
|
|
26
|
-
|
|
27
|
-
仓库内的 [use-persagy-vant](./skills/use-persagy-vant/SKILL.md) 用于在 Vue 3 移动端页面中选择、组合和接入 Persagy Vant 组件。
|
|
28
|
-
|
|
29
|
-
Skill 与组件库版本应一同评审和发布：凡是组件导入方式、关键 API 或设计变量发生变更，都需要同步更新 Skill 的引用资料。
|
|
30
|
-
|
|
31
65
|
## 产物管理
|
|
32
66
|
|
|
33
67
|
`es/`、`lib/`、`site-dist/` 和 `test/coverage/` 都是构建或测试产物。新文件默认不提交，由 CI 构建并用于发布；已经被 Git 跟踪的历史产物请在一次独立的清理提交中处理，不要与组件功能改动混合。
|
package/es/index.d.ts
CHANGED
package/es/index.mjs
CHANGED
|
@@ -95,7 +95,7 @@ import { TreeSelect } from "./tree-select/index.mjs";
|
|
|
95
95
|
import { Uploader } from "./uploader/index.mjs";
|
|
96
96
|
import { VideoPreview } from "./video-preview/index.mjs";
|
|
97
97
|
import { WorkOrderFilter } from "./work-order-filter/index.mjs";
|
|
98
|
-
const version = "0.0.
|
|
98
|
+
const version = "0.0.22";
|
|
99
99
|
function install(app) {
|
|
100
100
|
const components = [
|
|
101
101
|
ActionBar,
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
const import_meta = {};
|
|
2
1
|
import { Transition, Teleport, computed, defineComponent, ref, watch, createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment } from "vue";
|
|
3
2
|
import { ActionSheet } from "../action-sheet/index.mjs";
|
|
4
3
|
import { BlueMarkHeader } from "../blue-mark/index.mjs";
|
|
@@ -15,7 +14,7 @@ import TreeSelect from "../tree-select/index.mjs";
|
|
|
15
14
|
import { createNamespace, makeArrayProp, makeStringProp } from "../utils/index.mjs";
|
|
16
15
|
import MaterialAddItemComponent from "./MaterialAddItem.mjs";
|
|
17
16
|
const [name, bem] = createNamespace("material-add");
|
|
18
|
-
const detailBanners = [
|
|
17
|
+
const detailBanners = ["motor", "blower", "coil"];
|
|
19
18
|
const defaultItems = [{
|
|
20
19
|
id: "refrigerant",
|
|
21
20
|
name: "\u5236\u51B7\u5242",
|
|
@@ -374,14 +373,13 @@ var stdin_default = defineComponent({
|
|
|
374
373
|
detailBannerIndex.value = index;
|
|
375
374
|
}
|
|
376
375
|
}, {
|
|
377
|
-
default: () => [detailBanners.map((
|
|
378
|
-
"key":
|
|
376
|
+
default: () => [detailBanners.map((banner, index) => _createVNode(SwipeItem, {
|
|
377
|
+
"key": banner
|
|
379
378
|
}, {
|
|
380
|
-
default: () => [_createVNode("
|
|
381
|
-
"
|
|
382
|
-
"
|
|
383
|
-
"
|
|
384
|
-
"onDragstart": (event) => event.preventDefault()
|
|
379
|
+
default: () => [_createVNode("div", {
|
|
380
|
+
"class": [bem("detail-image"), bem("detail-image", banner)],
|
|
381
|
+
"role": "img",
|
|
382
|
+
"aria-label": `${item.name}\u56FE\u7247${index + 1}`
|
|
385
383
|
}, null)]
|
|
386
384
|
}))]
|
|
387
385
|
})]), _createVNode("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.van-material-add{position:relative;display:flex;flex-direction:column;height:calc(100vh - 96px);max-height:calc(100vh - 96px);bottom:56px;overflow:hidden;background:var(--van-gray-2)}.van-material-add>.van-action-sheet__content{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}.van-material-add__nav{flex:none;--van-nav-bar-background-color: var(--van-gray-2)}.van-material-add__nav .van-nav-bar__left--slot{left:var(--van-padding-md)}.van-material-add__nav .van-nav-bar__right--slot{right:var(--van-padding-md)}.van-material-add__search{flex:none;padding:8px var(--van-padding-md);--van-search-padding: 0;--van-search-background-color: var(--van-gray-2);--van-search-content-background-color: var(--van-white)}.van-material-add__search .van-search__field{padding-left:0}.van-material-add__tabs{flex:none;padding-left:8px;--van-tabs-line-height: 44px;--van-tab-font-size: var(--van-font-size-md);--van-tabs-bottom-bar-width: 40px;--van-tabs-nav-background-color: transparent}.van-material-add__filter-tags{display:flex;flex:none;gap:6px;padding:12px var(--van-padding-md)}.van-material-add__filter-tags .van-filter-tag{min-width:56px;--van-filter-tag-background-color: var(--van-gray-4)}.van-material-add__body{flex:1;min-height:0;padding:0 var(--van-padding-md) 12px;overflow-y:auto}.van-material-add__tree-card{margin-bottom:12px;overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__catalog-leaf{overflow:hidden}.van-material-add__catalog-leaf .van-material-add-item:after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);display:block;height:1px;content:"";background:var(--van-border-color);transform:scaleY(.5)}.van-tree-select__children>.van-tree-select__node:last-child>.van-material-add__catalog-leaf .van-material-add-item:after{display:none}.van-material-add__material-list{overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__empty{padding:32px 16px;color:var(--van-text-color-3);font-size:var(--van-font-size-md);text-align:center}.van-material-add__footer{position:relative;z-index:2;flex:none;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__footer .van-bottom-action-bar{box-shadow:none}.van-material-add__selected-panel{position:absolute;right:0;bottom:60px;left:0;display:flex;flex-direction:column;max-height:340px;overflow:hidden;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__selected-header{display:flex;align-items:center;justify-content:space-between;padding:12px var(--van-padding-md) 4px}.van-material-add__clear,.van-material-add__collapse{padding:0;background:transparent;border:0}.van-material-add__clear{color:var(--van-primary-color);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__collapse{display:inline-flex;gap:2px;align-items:center;color:var(--van-gray-6);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__selected-list{display:flex;flex-direction:column;gap:6px;padding:var(--van-padding-xs) var(--van-padding-md);overflow-y:auto}.van-material-add__detail-page{position:fixed;z-index:3000;inset:0;display:flex;flex-direction:column;overflow:hidden;background:var(--van-gray-2)}.van-material-add__detail-banner{position:absolute;top:0;right:0;left:0;height:320px;overflow:hidden;background:var(--van-gray-8)}.van-material-add__detail-swipe{height:320px;touch-action:pan-y}.van-material-add__detail-
|
|
1
|
+
.van-material-add{position:relative;display:flex;flex-direction:column;height:calc(100vh - 96px);max-height:calc(100vh - 96px);bottom:56px;overflow:hidden;background:var(--van-gray-2)}.van-material-add>.van-action-sheet__content{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}.van-material-add__nav{flex:none;--van-nav-bar-background-color: var(--van-gray-2)}.van-material-add__nav .van-nav-bar__left--slot{left:var(--van-padding-md)}.van-material-add__nav .van-nav-bar__right--slot{right:var(--van-padding-md)}.van-material-add__search{flex:none;padding:8px var(--van-padding-md);--van-search-padding: 0;--van-search-background-color: var(--van-gray-2);--van-search-content-background-color: var(--van-white)}.van-material-add__search .van-search__field{padding-left:0}.van-material-add__tabs{flex:none;padding-left:8px;--van-tabs-line-height: 44px;--van-tab-font-size: var(--van-font-size-md);--van-tabs-bottom-bar-width: 40px;--van-tabs-nav-background-color: transparent}.van-material-add__filter-tags{display:flex;flex:none;gap:6px;padding:12px var(--van-padding-md)}.van-material-add__filter-tags .van-filter-tag{min-width:56px;--van-filter-tag-background-color: var(--van-gray-4)}.van-material-add__body{flex:1;min-height:0;padding:0 var(--van-padding-md) 12px;overflow-y:auto}.van-material-add__tree-card{margin-bottom:12px;overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__catalog-leaf{overflow:hidden}.van-material-add__catalog-leaf .van-material-add-item:after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);display:block;height:1px;content:"";background:var(--van-border-color);transform:scaleY(.5)}.van-tree-select__children>.van-tree-select__node:last-child>.van-material-add__catalog-leaf .van-material-add-item:after{display:none}.van-material-add__material-list{overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__empty{padding:32px 16px;color:var(--van-text-color-3);font-size:var(--van-font-size-md);text-align:center}.van-material-add__footer{position:relative;z-index:2;flex:none;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__footer .van-bottom-action-bar{box-shadow:none}.van-material-add__selected-panel{position:absolute;right:0;bottom:60px;left:0;display:flex;flex-direction:column;max-height:340px;overflow:hidden;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__selected-header{display:flex;align-items:center;justify-content:space-between;padding:12px var(--van-padding-md) 4px}.van-material-add__clear,.van-material-add__collapse{padding:0;background:transparent;border:0}.van-material-add__clear{color:var(--van-primary-color);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__collapse{display:inline-flex;gap:2px;align-items:center;color:var(--van-gray-6);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__selected-list{display:flex;flex-direction:column;gap:6px;padding:var(--van-padding-xs) var(--van-padding-md);overflow-y:auto}.van-material-add__detail-page{position:fixed;z-index:3000;inset:0;display:flex;flex-direction:column;overflow:hidden;background:var(--van-gray-2)}.van-material-add__detail-banner{position:absolute;top:0;right:0;left:0;height:320px;overflow:hidden;background:var(--van-gray-8)}.van-material-add__detail-swipe{height:320px;touch-action:pan-y}.van-material-add__detail-image{width:100%;height:310px;background-position:center;background-size:cover}.van-material-add__detail-image--motor{background-image:url(./assets/material-banner-motor.png)}.van-material-add__detail-image--blower{background-image:url(./assets/material-banner-blower.png)}.van-material-add__detail-image--coil{background-image:url(./assets/material-banner-coil.png)}.van-material-add__detail-dots{position:absolute;z-index:2;top:226px;left:50%;display:flex;gap:6px;transform:translate(-50%)}.van-material-add__detail-dots>i{width:6px;height:6px;background:rgba(255,255,255,.55);border-radius:50%}.van-material-add__detail-dot--active{background:var(--van-white)!important}.van-material-add__detail-close{position:absolute;z-index:1;top:56px;left:var(--van-padding-md);display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;color:var(--van-gray-9);background:var(--van-gray-3);border:0;border-radius:50%;box-shadow:0 2px 5px rgba(27,33,41,.1)}.van-material-add__detail-content{position:relative;z-index:1;display:flex;flex:1;flex-direction:column;min-height:0;margin-top:246px;overflow:hidden;background:var(--van-white);border-radius:16px 16px 0 0}.van-material-add__detail-body{flex:1;min-height:0;padding:16px var(--van-padding-md) 24px;overflow-y:auto}.van-material-add__detail-section+.van-material-add__detail-section{margin-top:24px}.van-material-add__detail-section .van-blue-mark-header{margin-bottom:8px;padding:0}.van-material-add__detail-card{padding:8px 12px;color:var(--van-gray-9);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);background:linear-gradient(90deg,var(--van-gray-2),rgba(241,244,246,.2));border-radius:8px}.van-material-add__detail-info-rows{display:flex;flex-direction:column;gap:8px}.van-material-add__detail-row{display:flex;gap:16px;justify-content:space-between;min-height:22px}.van-material-add__detail-row>span{flex:none;width:56px;color:var(--van-gray-6)}.van-material-add__detail-row>strong{flex:1;color:var(--van-gray-9);font-weight:400;text-align:right;white-space:pre-line}.van-material-add__detail-link{color:var(--van-primary-color)!important;font-weight:var(--van-font-weight-bold)!important}.van-material-add-detail-enter-active{transition:transform var(--van-animation-duration-fast) var(--van-animation-timing-function-enter);will-change:transform}.van-material-add-detail-leave-active{transition:transform var(--van-animation-duration-fast) var(--van-animation-timing-function-leave);will-change:transform}.van-material-add-detail-enter-from,.van-material-add-detail-leave-to{transform:translateY(100%)}.van-material-add-detail-section-enter-active,.van-material-add-detail-section-leave-active{overflow:hidden;transition:max-height .2s ease,opacity .2s ease}.van-material-add-detail-section-enter-from,.van-material-add-detail-section-leave-to{max-height:0;opacity:0}.van-material-add-detail-section-enter-to,.van-material-add-detail-section-leave-from{max-height:480px;opacity:1}.van-material-add-item{position:relative;padding:10px var(--van-padding-md);cursor:pointer;transition:background-color .2s ease}.van-material-add-item:active{background-color:var(--van-active-color)}.van-material-add-item--selected{padding:10px var(--van-padding-md);background:var(--van-gray-2);border-radius:8px}.van-material-add-item--selected:after{display:none}.van-material-add-item:not(:last-child):after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);height:1px;background:var(--van-border-color);transform:scaleY(.5);content:""}.van-material-add-item__main{display:flex;align-items:center;min-height:22px}.van-material-add-item__detail{display:inline-flex;flex:1;gap:2px;align-items:center;min-width:0;padding:0;overflow:hidden;color:var(--van-gray-9);font:inherit;font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-align:left;background:transparent;border:0}.van-material-add-item__detail>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__kind-tag{flex:none;margin-left:4px}.van-material-add-item__stepper{flex:none;margin-left:8px;--van-stepper-input-width: 32px;--van-stepper-input-height: 18px;--van-stepper-input-font-size: var(--van-font-size-md);--van-stepper-input-line-height: var(--van-line-height-lg)}.van-material-add-item__unit{width:32px;margin-left:8px;overflow:hidden;color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__desc{margin:4px 0 0;overflow:hidden;color:var(--van-gray-6);font-size:var(--van-font-size-sm);line-height:20px;text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__keyword{color:var(--van-primary-color)}
|
|
@@ -46,7 +46,10 @@
|
|
|
46
46
|
&__detail-page { position: fixed; z-index: 3000; inset: 0; display: flex; flex-direction: column; overflow: hidden; background: var(--van-gray-2); }
|
|
47
47
|
&__detail-banner { position: absolute; top: 0; right: 0; left: 0; height: 320px; overflow: hidden; background: var(--van-gray-8); }
|
|
48
48
|
&__detail-swipe { height: 320px; touch-action: pan-y; }
|
|
49
|
-
&__detail-
|
|
49
|
+
&__detail-image { width: 100%; height: 310px; background-position: center; background-size: cover; }
|
|
50
|
+
&__detail-image--motor { background-image: url('./assets/material-banner-motor.png'); }
|
|
51
|
+
&__detail-image--blower { background-image: url('./assets/material-banner-blower.png'); }
|
|
52
|
+
&__detail-image--coil { background-image: url('./assets/material-banner-coil.png'); }
|
|
50
53
|
&__detail-dots { position: absolute; z-index: 2; top: 226px; left: 50%; display: flex; gap: 6px; transform: translateX(-50%); > i { width: 6px; height: 6px; background: rgb(255 255 255 / 55%); border-radius: 50%; } }
|
|
51
54
|
&__detail-dot--active { background: var(--van-white) !important; }
|
|
52
55
|
&__detail-close { position: absolute; z-index: 1; top: 56px; left: var(--van-padding-md); display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; color: var(--van-gray-9); background: var(--van-gray-3); border: 0; border-radius: 50%; box-shadow: 0 2px 5px rgb(27 33 41 / 10%); }
|