persagy-vant 0.0.37 → 0.0.38

package/lib/work-order-card/WorkOrderCard.js

@@ -25,6 +25,7 @@ var import_button = require("../button");
 var import_utils = require("../utils");
 var import_divider = require("../divider");
 var import_icon = require("../icon");
+var import_label = require("../label");
 var import_tag = require("../tag");
 const [name, bem] = (0, import_utils.createNamespace)("work-order-card");
 const props = {
@@ -70,12 +71,39 @@ var stdin_default = (0, import_vue.defineComponent)({
         innerExpanded.value = value;
       emit("update:expanded", value);
     };
-    const renderInfo = (info) => (0, import_vue.createVNode)("div", {
-      "class": bem("info")
-    }, [info.icon && (0, import_vue.createVNode)(import_icon.Icon, {
-      "name": info.icon,
-      "size": "12"
-    }, null), (0, import_vue.createVNode)("span", null, [info.text])]);
+    const resolveInfo = (info) => {
+      if (info.label !== void 0 || info.content !== void 0) {
+        return {
+          label: info.label || "",
+          content: info.content || ""
+        };
+      }
+      const text = info.text || "";
+      const separatorIndex = text.search(/[:：]/);
+      return separatorIndex < 0 ? {
+        label: "",
+        content: text
+      } : {
+        label: text.slice(0, separatorIndex),
+        content: text.slice(separatorIndex + 1)
+      };
+    };
+    const renderInfo = (info) => {
+      const {
+        label,
+        content
+      } = resolveInfo(info);
+      return (0, import_vue.createVNode)("div", {
+        "class": bem("info")
+      }, [(0, import_vue.createVNode)(import_label.Label, {
+        "sameColor": true,
+        "showLeftIcon": Boolean(info.icon),
+        "leftIcon": info.icon,
+        "showLabel": Boolean(label),
+        "label": label,
+        "content": content
+      }, null)]);
+    };
     const renderAction = (action, index) => (0, import_vue.createVNode)(import_button.Button, {
       "type": "text",
       "disabled": action.disabled,
@@ -112,16 +140,29 @@ var stdin_default = (0, import_vue.defineComponent)({
     }, null)]), (0, import_vue.createVNode)("div", {
       "class": bem("tags")
     }, [slots.tags ? slots.tags() : props2.tags.map((tag) => (0, import_vue.createVNode)(import_tag.Tag, {
+      "type": tag.type,
+      "size": tag.size,
       "color": tag.color,
-      "textColor": tag.textColor
+      "textColor": tag.textColor,
+      "plain": tag.plain,
+      "round": tag.round,
+      "mark": tag.mark,
+      "rightIcon": tag.rightIcon,
+      "number": tag.number,
+      "showNumber": tag.showNumber,
+      "numberColor": tag.numberColor
     }, {
       default: () => [tag.text]
     }))]), props2.showLocation && props2.location && (0, import_vue.createVNode)("div", {
       "class": bem("location")
-    }, [(0, import_vue.createVNode)(import_icon.Icon, {
-      "name": "location-o",
-      "size": "12"
-    }, null), (0, import_vue.createVNode)("span", null, [props2.location])]), (0, import_vue.createVNode)("div", {
+    }, [(0, import_vue.createVNode)(import_label.Label, {
+      "sameColor": true,
+      "ellipsis": true,
+      "showLeftIcon": true,
+      "leftIcon": "location-o",
+      "showLabel": false,
+      "content": props2.location
+    }, null)]), (0, import_vue.createVNode)("div", {
       "class": bem("infos")
     }, [slots.info ? slots.info() : props2.primaryInfos.map(renderInfo)]), hasExpandedContent() && (0, import_vue.createVNode)("div", {
       "class": bem("expanded-wrapper", {

package/lib/work-order-card/index.css

@@ -1 +1 @@
-:root{--van-work-order-card-padding: var(--van-padding-md);--van-work-order-card-radius: var(--van-border-radius-lg);--van-work-order-card-title-font-size: 15px;--van-work-order-card-title-color: var(--van-gray-8);--van-work-order-card-info-color: var(--van-gray-7)}.van-work-order-card{position:relative;overflow:hidden;background:var(--van-white);border-radius:var(--van-work-order-card-radius)}.van-work-order-card__header{display:flex;align-items:flex-start;padding:var(--van-work-order-card-padding) var(--van-work-order-card-padding) 0;cursor:pointer}.van-work-order-card__title{flex:1;min-width:0;overflow:hidden;color:var(--van-work-order-card-title-color);font-size:var(--van-work-order-card-title-font-size);font-weight:var(--van-font-weight-bold);line-height:23px;text-overflow:ellipsis;white-space:nowrap}.van-work-order-card__arrow{flex:none;margin:4px 0 0 2px;color:var(--van-gray-6);transition:transform .2s}.van-work-order-card--expanded .van-work-order-card__title{overflow:visible;white-space:normal}.van-work-order-card:not(.van-work-order-card--expandable) .van-work-order-card__title{overflow:visible;white-space:normal}.van-work-order-card--expanded .van-work-order-card__arrow{color:var(--van-black);transform:rotate(180deg)}.van-work-order-card__tags{display:flex;flex-wrap:wrap;gap:4px;padding:8px var(--van-work-order-card-padding) 0}.van-work-order-card__location{display:flex;gap:4px;align-items:center;margin:8px 10px 0;padding:0 6px;overflow:hidden;color:var(--van-gray-8);font-size:13px;line-height:21px;white-space:nowrap;background:linear-gradient(90deg,rgba(223,232,243,.7),rgba(223,232,243,0));border-radius:4px}.van-work-order-card__location span{overflow:hidden;text-overflow:ellipsis}.van-work-order-card__infos{padding:8px var(--van-work-order-card-padding) 0}.van-work-order-card:not(.van-work-order-card--actions):not(.van-work-order-card--expanded-content) .van-work-order-card__infos{padding-bottom:8px}.van-work-order-card__info{display:flex;gap:4px;align-items:center;min-height:21px;color:var(--van-work-order-card-info-color);font-size:13px;line-height:21px}.van-work-order-card__expanded-wrapper{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .24s cubic-bezier(.2,.8,.2,1),opacity .18s ease}.van-work-order-card__expanded-wrapper--visible{grid-template-rows:1fr;opacity:1}.van-work-order-card__expanded-content{min-height:0;padding:0 var(--van-work-order-card-padding);overflow:hidden}.van-work-order-card:not(.van-work-order-card--actions) .van-work-order-card__expanded-content{padding-bottom:8px}.van-work-order-card__expanded-content .van-divider{margin:4px 0;border-color:var(--van-gray-4)}.van-work-order-card__overdue{position:absolute;top:0;right:0;padding:2px 8px;color:var(--van-white);font-size:10px;line-height:12px;background:var(--van-danger-color);border-radius:0 2px 0 8px}.van-work-order-card__actions{position:relative;display:flex;margin-top:8px;padding-top:1px;--van-button-default-height: 38px;--van-button-default-font-size: var(--van-font-size-md);--van-button-default-line-height: 22px;--van-button-border-radius: 0;--van-button-plain-background-color: transparent}.van-work-order-card__actions:before{position:absolute;top:0;right:var(--van-work-order-card-padding);left:var(--van-work-order-card-padding);height:.5px;background:var(--van-gray-2);content:""}.van-work-order-card__actions .van-button{flex:1}.van-work-order-card__actions .van-button+.van-button{position:relative}.van-work-order-card__actions .van-button+.van-button:after{position:absolute;top:50%;left:0;width:.5px;height:12px;background:var(--van-gray-2);transform:translateY(-50%);content:""}
+:root{--van-work-order-card-padding: var(--van-padding-md);--van-work-order-card-radius: var(--van-border-radius-lg);--van-work-order-card-title-font-size: 15px;--van-work-order-card-title-color: var(--van-gray-8);--van-work-order-card-info-color: var(--van-gray-7)}.van-work-order-card{position:relative;overflow:hidden;background:var(--van-white);border-radius:var(--van-work-order-card-radius)}.van-work-order-card__header{display:flex;align-items:flex-start;padding:var(--van-work-order-card-padding) var(--van-work-order-card-padding) 0;cursor:pointer}.van-work-order-card__title{flex:1;min-width:0;overflow:hidden;color:var(--van-work-order-card-title-color);font-size:var(--van-work-order-card-title-font-size);font-weight:var(--van-font-weight-bold);line-height:23px;text-overflow:ellipsis;white-space:nowrap}.van-work-order-card__arrow{flex:none;margin:4px 0 0 2px;color:var(--van-gray-6);transition:transform .2s}.van-work-order-card--expanded .van-work-order-card__title{overflow:visible;white-space:normal}.van-work-order-card:not(.van-work-order-card--expandable) .van-work-order-card__title{overflow:visible;white-space:normal}.van-work-order-card--expanded .van-work-order-card__arrow{color:var(--van-black);transform:rotate(180deg)}.van-work-order-card__tags{display:flex;flex-wrap:wrap;gap:4px;padding:8px var(--van-work-order-card-padding) 0}.van-work-order-card__location{margin:8px 10px 0;padding:0 6px;overflow:hidden;background:linear-gradient(90deg,rgba(223,232,243,.7),rgba(223,232,243,0));border-radius:4px}.van-work-order-card__infos{display:flex;flex-direction:column;gap:2px;padding:8px var(--van-work-order-card-padding) 0}.van-work-order-card:not(.van-work-order-card--actions):not(.van-work-order-card--expanded-content) .van-work-order-card__infos{padding-bottom:8px}.van-work-order-card__info{min-width:0}.van-work-order-card__expanded-wrapper{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .24s cubic-bezier(.2,.8,.2,1),opacity .18s ease}.van-work-order-card__expanded-wrapper--visible{grid-template-rows:1fr;opacity:1}.van-work-order-card__expanded-content{min-height:0;padding:0 var(--van-work-order-card-padding);overflow:hidden}.van-work-order-card:not(.van-work-order-card--actions) .van-work-order-card__expanded-content{padding-bottom:8px}.van-work-order-card__expanded-content .van-divider{margin:4px 0;border-color:var(--van-gray-4)}.van-work-order-card__overdue{position:absolute;top:0;right:0;padding:2px 8px;color:var(--van-white);font-size:10px;line-height:12px;background:var(--van-danger-color);border-radius:0 2px 0 8px}.van-work-order-card__actions{position:relative;display:flex;margin-top:8px;padding-top:1px;--van-button-default-height: 38px;--van-button-default-font-size: var(--van-font-size-md);--van-button-default-line-height: 22px;--van-button-border-radius: 0;--van-button-plain-background-color: transparent}.van-work-order-card__actions:before{position:absolute;top:0;right:var(--van-work-order-card-padding);left:var(--van-work-order-card-padding);height:.5px;background:var(--van-gray-2);content:""}.van-work-order-card__actions .van-button{flex:1}.van-work-order-card__actions .van-button+.van-button{position:relative}.van-work-order-card__actions .van-button+.van-button:after{position:absolute;top:50%;left:0;width:.5px;height:12px;background:var(--van-gray-2);transform:translateY(-50%);content:""}

package/lib/work-order-card/index.less

@@ -16,11 +16,10 @@
 .van-work-order-card:not(.van-work-order-card--expandable) .van-work-order-card__title { overflow: visible; white-space: normal; }
 .van-work-order-card--expanded .van-work-order-card__arrow { color: var(--van-black); transform: rotate(180deg); }
 .van-work-order-card__tags { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px var(--van-work-order-card-padding) 0; }
-.van-work-order-card__location { display: flex; gap: 4px; align-items: center; margin: 8px 10px 0; padding: 0 6px; overflow: hidden; color: var(--van-gray-8); font-size: 13px; line-height: 21px; white-space: nowrap; background: linear-gradient(90deg, rgb(223 232 243 / 70%), rgb(223 232 243 / 0%)); border-radius: 4px; }
-.van-work-order-card__location span { overflow: hidden; text-overflow: ellipsis; }
-.van-work-order-card__infos { padding: 8px var(--van-work-order-card-padding) 0; }
+.van-work-order-card__location { margin: 8px 10px 0; padding: 0 6px; overflow: hidden; background: linear-gradient(90deg, rgb(223 232 243 / 70%), rgb(223 232 243 / 0%)); border-radius: 4px; }
+.van-work-order-card__infos { display: flex; flex-direction: column; gap: 2px; padding: 8px var(--van-work-order-card-padding) 0; }
 .van-work-order-card:not(.van-work-order-card--actions):not(.van-work-order-card--expanded-content) .van-work-order-card__infos { padding-bottom: 8px; }
-.van-work-order-card__info { display: flex; gap: 4px; align-items: center; min-height: 21px; color: var(--van-work-order-card-info-color); font-size: 13px; line-height: 21px; }
+.van-work-order-card__info { min-width: 0; }
 .van-work-order-card__expanded-wrapper { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .24s cubic-bezier(.2, .8, .2, 1), opacity .18s ease; }
 .van-work-order-card__expanded-wrapper--visible { grid-template-rows: 1fr; opacity: 1; }
 .van-work-order-card__expanded-content { min-height: 0; padding: 0 var(--van-work-order-card-padding); overflow: hidden; }

package/lib/work-order-card/style/index.js

@@ -1,7 +1,9 @@
 require("../../style/base.css");
 require("../../badge/index.css");
 require("../../icon/index.css");
+require("../../image/index.css");
 require("../../tag/index.css");
+require("../../label/index.css");
 require("../../loading/index.css");
 require("../../button/index.css");
 require("../../divider/index.css");

package/lib/work-order-card/style/less.js

@@ -1,7 +1,9 @@
 require("../../style/base.less");
 require("../../badge/index.less");
 require("../../icon/index.less");
+require("../../image/index.less");
 require("../../tag/index.less");
+require("../../label/index.less");
 require("../../loading/index.less");
 require("../../button/index.less");
 require("../../divider/index.less");

package/lib/work-order-card/types.d.ts

@@ -1,12 +1,25 @@
+import type { TagSize, TagType } from '../tag';
 import type { Numeric } from '../utils';
 export declare type WorkOrderCardTag = {
     text: string;
+    type?: TagType;
+    size?: TagSize;
     color?: string;
     textColor?: string;
+    plain?: boolean;
+    round?: boolean;
+    mark?: boolean;
+    rightIcon?: string;
+    number?: string | number;
+    showNumber?: boolean;
+    numberColor?: string;
 };
 export declare type WorkOrderCardInfo = {
     icon?: string;
-    text: string;
+    /** @deprecated Prefer label and content for structured field display. */
+    text?: string;
+    label?: string;
+    content?: string;
 };
 export declare type WorkOrderCardAction = {
     text: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "persagy-vant",
-  "version": "0.0.37",
+  "version": "0.0.38",
   "description": "Lightweight Mobile UI Components built on Vue",
   "main": "lib/vant.cjs.js",
   "module": "es/index.mjs",
@@ -44,7 +44,7 @@
     "url": "git+https://gitea.meos.center/Persagy-AI/persagy-vant-ai.git"
   },
   "bugs": "https://gitea.meos.center/Persagy-AI/persagy-vant-ai/issues",
-  "homepage": "https://persagy-vant-ai.netlify.app",
+  "homepage": "https://sunshifu-persagy-vant-ai.netlify.app",
   "author": "chenjiahan",
   "license": "MIT",
   "keywords": [

package/skills/use-persagy-vant/references/component-documentation.md

@@ -38,7 +38,7 @@
 组件复用清单面向产品经理，组件名不得使用代码名（如 `label`、`bottom-action-bar`）或自行翻译。交付前执行以下规则：
 
 1. 从 `packages/persagy-mobile/vant.config.mjs` 的 `site.locales['zh-CN'].nav` 读取组件官网导航名称和 `path`；在已安装包项目中，从同包的 `vant.config.mjs` 或已发布文档导航读取。
-2. 使用官网导航名称中的中文名称作为链接文字，并链接到 `https://persagy-vant-ai.netlify.app/#/zh-CN/<path>`。例如：`[字段展示](https://persagy-vant-ai.netlify.app/#/zh-CN/label)`、`[动作栏](https://persagy-vant-ai.netlify.app/#/zh-CN/bottom-action-bar)`。
+2. 使用官网导航名称中的中文名称作为链接文字，并链接到 `https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/<path>`。例如：`[字段展示](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/label)`、`[动作栏](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/bottom-action-bar)`。
 3. 若官网导航本身展示“中文名称 + 英文名称”，可保留其完整名称，确保与网站完全一致；不得使用组件目录名替代名称。
 4. 若组件尚未出现在官网中文导航或未发布，禁止编造跳转地址；以官网中文名称（如可取得）标注“待官网发布”，并在交付中说明。
 
@@ -47,9 +47,9 @@
 ```md
 ## 组件复用清单
 
-- [字段展示](https://persagy-vant-ai.netlify.app/#/zh-CN/label)：展示字段名称与回显值；左侧标签使用冒号。
-- [信息卡片](https://persagy-vant-ai.netlify.app/#/zh-CN/info-card)：承载成组详情字段。
-- [动作栏](https://persagy-vant-ai.netlify.app/#/zh-CN/bottom-action-bar)：承载页面级提交操作。
+- [字段展示](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/label)：展示字段名称与回显值；左侧标签使用冒号。
+- [信息卡片](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/info-card)：承载成组详情字段。
+- [动作栏](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/bottom-action-bar)：承载页面级提交操作。
 ```
 
 ## 组件 README 的维护标准

package/skills/use-persagy-vant/references/component-variant-selection.md

@@ -45,8 +45,8 @@
 
 ```md
 ## 组件变体选型
-- [单元格](https://persagy-vant-ai.netlify.app/#/zh-CN/cell)：模拟器示例「后置选择」；用于工单批量选择，使用 `right-select` 绑定原有选中状态。未采用「展示箭头」，因为该行不是跳转入口。
-- [单元格](https://persagy-vant-ai.netlify.app/#/zh-CN/cell)：模拟器示例「三行样式」；用于设备条目，使用 `three-line`、`title`、`label`、`description` 和 `right-icon="arrow"` 呈现名称、编号、位置与详情入口。
+- [单元格](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/cell)：模拟器示例「后置选择」；用于工单批量选择，使用 `right-select` 绑定原有选中状态。未采用「展示箭头」，因为该行不是跳转入口。
+- [单元格](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/cell)：模拟器示例「三行样式」；用于设备条目，使用 `three-line`、`title`、`label`、`description` 和 `right-icon="arrow"` 呈现名称、编号、位置与详情入口。
 - <官网中文组件名>：模拟器示例「<README 中的准确示例标题>」；<页面意图>，使用 `<实际 Props/插槽/变量>`；<未选其他示例的关键原因>。
 ```
 

package/skills/use-persagy-vant/references/design-interaction-baseline.md

@@ -15,6 +15,7 @@
 - 页面含白色卡片时，优先使用 `background` 组件承载页面内容：一级页面（首页）使用 `theme="default"`，其他层级页面使用 `theme="gray"`。无白色卡片且无明确背景设计时，使用 `--van-gray-1`。
 - 信息展示和录入控件以白色卡片承载；背景主题与页面层级不一致时，以明确的页面原型为准。
 - 卡片内容与页面左右边缘保持 `16px` 间距；卡片之间间距 `8px`。
+- 页面含白色卡片时，在滚动内容的最后一张卡片之后必须保留**唯一且恰好 `24px` 高**的页面级空白容器，避免卡片视觉贴近页面底部；该容器不承载业务内容、不计入卡片间距，也不使用自定义组件实现。滚动到末尾时，该 `24px` 即为滚动内容的终点；不得再叠加 `padding-bottom`、安全区占位、空白节点或额外卡片间距，避免出现超过 `24px` 的可滚动空白。存在固定底部操作栏时，空白容器仍位于可滚动内容末尾、操作栏之前；操作栏自身的安全区只作用于操作栏，不得计入或叠加到滚动内容末尾。
 - 模块之间、控件之间使用 `8px` 或 `12px` 间距；仅左右排布的两组字段，纵向间距不得小于 `8px`。
 - 白色卡片内有分割线的控件列表，最后一个可见控件必须隐藏末尾分割线；使用组件公开能力实现，例如 `cell`/`field` 设置 `border="false"`、`material-display-bar` 设置 `divider="false"`。根据条件渲染或 `visible` 判定最后一个实际可见项，不使用 CSS 强行隐藏分割线。
 - 需要展示字段名称与回显值时，优先使用 `label`，不要手写同类标签和值的排版；左侧标签文本尽量自带冒号，保证名称和值之间的统一阅读间距。录入或选择入口仍使用 `field`、`cell` 等对应组件。多字段成组或存在多种字段展示类型（文字、强调文字、链接、标签、图片/视频或纵向字段）时，优先使用 `info-card` + `label`；按字段内容选择 `label` 的公开展示类型和纵向布局。字段无数据时整项隐藏，使用 `info-card` 时通过字段的 `visible: false` 实现。
@@ -69,7 +70,7 @@
 
 ```md
 ## 规范落实项
-- 布局与文本：<背景、卡片间距、文本溢出和空字段处理方式>
+- 布局与文本：<背景、卡片间距、末卡片后 24px 留白、文本溢出和空字段处理方式>
 - 页面结构与触达：<页面/面板层级、导航动效、热区、信息层级；不涉及则说明>
 - 输入与选择：<200 字限制、9 个上传限制、时间、键盘、单选/多选策略；不涉及则说明>
 - 编辑与全局操作：<表单面板、底部操作栏及其变量/布局选择；不涉及则说明>

package/skills/use-persagy-vant/references/page-recipes.md

@@ -2,6 +2,10 @@
 
 配方限定页面结构，不替代具体组件 API。开始编码前先选择最接近的一项。
 
+## 卡片页面底部留白
+
+页面以白色卡片承载内容时，在可滚动内容的最后一张卡片后增加唯一且恰好 `24px` 高的空白容器，避免内容贴底。该容器仅承担页面布局留白，不承载业务内容，不作为组件样式修改；滚动到底后必须立即停止，禁止额外的 `padding-bottom`、安全区占位、空白节点或间距使内容继续滚动。固定 `bottom-action-bar` 或其他底部操作栏存在时，将该容器放在操作栏之前；操作栏安全区仅在操作栏内处理，不得叠加到滚动内容末尾。
+
 ## 全页面进入过渡
 
 1. 页面首次进入时，使用纯色页面背景叠加 `loading type="illustration"`，作为页面内容加载完成前的过渡。

package/skills/use-persagy-vant/references/reuse-policy.md

@@ -49,8 +49,8 @@
 
 ```md
 ## 组件复用清单
-- [<官网中文组件名>](https://persagy-vant-ai.netlify.app/#/zh-CN/<组件路径>)：<承担的页面职责与关键公开能力>
-- [<官网中文组件名>](https://persagy-vant-ai.netlify.app/#/zh-CN/<组件路径>)：<承担的页面职责与关键公开能力>
+- [<官网中文组件名>](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/<组件路径>)：<承担的页面职责与关键公开能力>
+- [<官网中文组件名>](https://sunshifu-persagy-vant-ai.netlify.app/#/zh-CN/<组件路径>)：<承担的页面职责与关键公开能力>
 
 组件名和路径必须从 `component-documentation.md` 指定的官网中文导航读取；未发布组件标注“待官网发布”，不得编造链接。