xt-element-ui 1.3.2 → 1.3.4

package/docs/components/base/xt-time.md

@@ -1,165 +1,165 @@
-## XtTime 时间组件
-
-集三种模式于一身的时间组件：当前时间实时显示、目标时间倒计时、日期文本格式化展示。
-
-## 基本用法
-
-### 三种显示模式
-
-::: demo 三种显示模式
-```vue
-<template>
-  <div style="display: flex; flex-direction: column; gap: 12px;">
-    <div>当前时间：<XtTime type="now" /></div>
-    <div>距 2026-12-31：<XtTime type="countdown" target-time="2026-12-31 23:59:59" /></div>
-    <div>创建时间：<XtTime type="text" :value="1704067200000" /></div>
-  </div>
-</template>
-```
-:::
-
-## 属性说明
-
-### 通用属性
-
-| 属性 | 类型 | 默认值 | 可选值 | 说明 |
-|------|------|--------|--------|------|
-| `type` | String | `now` | `now`、`countdown`、`text` | 显示模式 |
-| `format` | String | `YYYY-MM-DD HH:mm:ss` | - | `now` / `text` 模式下的日期格式 |
-| `size` | String | base | `extra-large`、`large`、`medium`、`base`、`small`、`extra-small` | 字体大小 |
-| `type-color` | String | - | `primary`、`success`、`warning`、`danger` | 颜色语义 |
-| `bold` | Boolean | false | - | 是否加粗 |
-| `prefix` | String | - | - | 前缀文本 |
-| `suffix` | String | - | - | 后缀文本 |
-| `empty-text` | String | `-` | - | 空值/无效值时展示的占位文本 |
-| `hide-empty` | Boolean | false | - | 值为空时是否不渲染内容 |
-| `interval` | Number | `1000` | `>= 100` | 刷新间隔（毫秒），仅 `now` / `countdown` 生效 |
-
-### text 模式专属属性
-
-| 属性 | 类型 | 默认值 | 说明 |
-|------|------|--------|------|
-| `value` | String / Number / Date | - | 待格式化的日期值，支持时间戳（10 位秒或 13 位毫秒）、Date 对象、`2024-01-01 12:00:00` 等字符串 |
-
-### countdown 模式专属属性
-
-| 属性 | 类型 | 默认值 | 可选值 | 说明 |
-|------|------|--------|--------|------|
-| `target-time` | String / Number / Date | - | - | 目标时间，取值同 `value` |
-| `countdown-format` | String | `DHMS` | `DHMS`、`HMS`、`MS`、`SEC` | 倒计时显示格式 |
-| `finished-text` | String | `已结束` | - | 倒计时结束后显示的文本 |
-
-## 事件
-
-| 事件名 | 说明 | 参数 |
-|--------|------|------|
-| `finish` | 倒计时结束触发（仅 `countdown` 模式） | - |
-| `click` | 点击组件触发 | `(event: MouseEvent)` |
-
-## 插槽
-
-| 插槽 | 说明 |
-|------|------|
-| `prefix` | 前缀插槽，优先级高于 `prefix` 属性 |
-| `suffix` | 后缀插槽，优先级高于 `suffix` 属性 |
-| `finished` | 倒计时结束态自定义内容（仅 `countdown` 模式） |
-| `default` | 自定义整体内容，覆盖默认渲染 |
-
-## 示例
-
-### 当前时间（now 模式）
-
-::: demo 当前时间
-```vue
-<template>
-  <div style="display: flex; flex-direction: column; gap: 8px;">
-    <XtTime type="now" />
-    <XtTime type="now" format="YYYY年MM月DD日 HH时mm分ss秒" type-color="primary" bold />
-    <XtTime type="now" format="HH:mm:ss" size="extra-large" type-color="danger" />
-  </div>
-</template>
-```
-:::
-
-### 日期文本（text 模式）
-
-`value` 支持时间戳、字符串、Date 对象，自动识别并格式化：
-
-::: demo 日期文本
-```vue
-<template>
-  <div style="display: flex; flex-direction: column; gap: 8px;">
-    <XtTime type="text" value="2024-01-01 12:00:00" />
-    <XtTime type="text" :value="1704067200" format="YYYY-MM-DD" />
-    <XtTime type="text" :value="new Date('2024-06-15')" format="YYYY/MM/DD" />
-    <XtTime type="text" value="无效值" />
-    <XtTime type="text" value="2024-01-01" prefix="创建于 " type-color="success" />
-  </div>
-</template>
-```
-:::
-
-### 倒计时（countdown 模式）
-
-::: demo 倒计时
-```vue
-<template>
-  <div style="display: flex; flex-direction: column; gap: 8px;">
-    <XtTime type="countdown" target-time="2026-12-31 23:59:59" />
-    <XtTime type="countdown" target-time="2026-12-31 23:59:59" countdown-format="HMS" type-color="primary" />
-    <XtTime type="countdown" target-time="2026-12-31 23:59:59" countdown-format="MS" />
-    <XtTime type="countdown" target-time="2026-12-31 23:59:59" countdown-format="SEC" suffix="后结束" />
-    <XtTime
-      type="countdown"
-      :target-time="Date.now() + 5000"
-      @finish="onFinish"
-    />
-  </div>
-</template>
-
-<script>
-export default {
-  methods: {
-    onFinish() {
-      this.$message && this.$message('倒计时结束！')
-    }
-  }
-}
-</script>
-```
-:::
-
-### 自定义结束态（finished 插槽）
-
-::: demo 自定义结束态
-```vue
-<template>
-  <XtTime type="countdown" :target-time="Date.now() + 3000">
-    <template #finished>
-      <span style="color: #67c23a;">🎉 活动已开始，欢迎参加</span>
-    </template>
-  </XtTime>
-</template>
-```
-:::
-
-### 前缀 / 后缀
-
-::: demo 前缀后缀
-```vue
-<template>
-  <div style="display: flex; flex-direction: column; gap: 8px;">
-    <XtTime type="now" prefix="当前时间：" />
-    <XtTime type="countdown" target-time="2026-12-31 23:59:59" suffix=" 后截止" type-color="warning" />
-    <XtTime type="text" value="2024-01-01 08:00:00" prefix="入职日期：" suffix="（周一）" />
-  </div>
-</template>
-```
-:::
-
-## 注意事项
-
-- `value` / `target-time` 对**纯数字时间戳**自动识别：10 位数字视作秒级时间戳，13 位数字视作毫秒级时间戳。
-- `countdown` 模式下组件销毁、切出 `keep-alive` 缓存时会自动清理定时器，避免内存泄漏。
-- `type` 从 `now`/`countdown` 切换为 `text`（或反向），组件会自动重置定时器。
-- 如需不同的时区展示，可在父组件中将 `value` 先转换为本地时区 Date 对象再传入。
+## XtTime 时间组件
+
+集三种模式于一身的时间组件：当前时间实时显示、目标时间倒计时、日期文本格式化展示。
+
+## 基本用法
+
+### 三种显示模式
+
+::: demo 三种显示模式
+```vue
+<template>
+  <div style="display: flex; flex-direction: column; gap: 12px;">
+    <div>当前时间：<XtTime type="now" /></div>
+    <div>距 2026-12-31：<XtTime type="countdown" target-time="2026-12-31 23:59:59" /></div>
+    <div>创建时间：<XtTime type="text" :value="1704067200000" /></div>
+  </div>
+</template>
+```
+:::
+
+## 属性说明
+
+### 通用属性
+
+| 属性 | 类型 | 默认值 | 可选值 | 说明 |
+|------|------|--------|--------|------|
+| `type` | String | `now` | `now`、`countdown`、`text` | 显示模式 |
+| `format` | String | `YYYY-MM-DD HH:mm:ss` | - | `now` / `text` 模式下的日期格式 |
+| `size` | String | base | `extra-large`、`large`、`medium`、`base`、`small`、`extra-small` | 字体大小 |
+| `type-color` | String | - | `primary`、`success`、`warning`、`danger` | 颜色语义 |
+| `bold` | Boolean | false | - | 是否加粗 |
+| `prefix` | String | - | - | 前缀文本 |
+| `suffix` | String | - | - | 后缀文本 |
+| `empty-text` | String | `-` | - | 空值/无效值时展示的占位文本 |
+| `hide-empty` | Boolean | false | - | 值为空时是否不渲染内容 |
+| `interval` | Number | `1000` | `>= 100` | 刷新间隔（毫秒），仅 `now` / `countdown` 生效 |
+
+### text 模式专属属性
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| `value` | String / Number / Date | - | 待格式化的日期值，支持时间戳（10 位秒或 13 位毫秒）、Date 对象、`2024-01-01 12:00:00` 等字符串 |
+
+### countdown 模式专属属性
+
+| 属性 | 类型 | 默认值 | 可选值 | 说明 |
+|------|------|--------|--------|------|
+| `target-time` | String / Number / Date | - | - | 目标时间，取值同 `value` |
+| `countdown-format` | String | `DHMS` | `DHMS`、`HMS`、`MS`、`SEC` | 倒计时显示格式 |
+| `finished-text` | String | `已结束` | - | 倒计时结束后显示的文本 |
+
+## 事件
+
+| 事件名 | 说明 | 参数 |
+|--------|------|------|
+| `finish` | 倒计时结束触发（仅 `countdown` 模式） | - |
+| `click` | 点击组件触发 | `(event: MouseEvent)` |
+
+## 插槽
+
+| 插槽 | 说明 |
+|------|------|
+| `prefix` | 前缀插槽，优先级高于 `prefix` 属性 |
+| `suffix` | 后缀插槽，优先级高于 `suffix` 属性 |
+| `finished` | 倒计时结束态自定义内容（仅 `countdown` 模式） |
+| `default` | 自定义整体内容，覆盖默认渲染 |
+
+## 示例
+
+### 当前时间（now 模式）
+
+::: demo 当前时间
+```vue
+<template>
+  <div style="display: flex; flex-direction: column; gap: 8px;">
+    <XtTime type="now" />
+    <XtTime type="now" format="YYYY年MM月DD日 HH时mm分ss秒" type-color="primary" bold />
+    <XtTime type="now" format="HH:mm:ss" size="extra-large" type-color="danger" />
+  </div>
+</template>
+```
+:::
+
+### 日期文本（text 模式）
+
+`value` 支持时间戳、字符串、Date 对象，自动识别并格式化：
+
+::: demo 日期文本
+```vue
+<template>
+  <div style="display: flex; flex-direction: column; gap: 8px;">
+    <XtTime type="text" value="2024-01-01 12:00:00" />
+    <XtTime type="text" :value="1704067200" format="YYYY-MM-DD" />
+    <XtTime type="text" :value="new Date('2024-06-15')" format="YYYY/MM/DD" />
+    <XtTime type="text" value="无效值" />
+    <XtTime type="text" value="2024-01-01" prefix="创建于 " type-color="success" />
+  </div>
+</template>
+```
+:::
+
+### 倒计时（countdown 模式）
+
+::: demo 倒计时
+```vue
+<template>
+  <div style="display: flex; flex-direction: column; gap: 8px;">
+    <XtTime type="countdown" target-time="2026-12-31 23:59:59" />
+    <XtTime type="countdown" target-time="2026-12-31 23:59:59" countdown-format="HMS" type-color="primary" />
+    <XtTime type="countdown" target-time="2026-12-31 23:59:59" countdown-format="MS" />
+    <XtTime type="countdown" target-time="2026-12-31 23:59:59" countdown-format="SEC" suffix="后结束" />
+    <XtTime
+      type="countdown"
+      :target-time="Date.now() + 5000"
+      @finish="onFinish"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  methods: {
+    onFinish() {
+      this.$message && this.$message('倒计时结束！')
+    }
+  }
+}
+</script>
+```
+:::
+
+### 自定义结束态（finished 插槽）
+
+::: demo 自定义结束态
+```vue
+<template>
+  <XtTime type="countdown" :target-time="Date.now() + 3000">
+    <template #finished>
+      <span style="color: #67c23a;">🎉 活动已开始，欢迎参加</span>
+    </template>
+  </XtTime>
+</template>
+```
+:::
+
+### 前缀 / 后缀
+
+::: demo 前缀后缀
+```vue
+<template>
+  <div style="display: flex; flex-direction: column; gap: 8px;">
+    <XtTime type="now" prefix="当前时间：" />
+    <XtTime type="countdown" target-time="2026-12-31 23:59:59" suffix=" 后截止" type-color="warning" />
+    <XtTime type="text" value="2024-01-01 08:00:00" prefix="入职日期：" suffix="（周一）" />
+  </div>
+</template>
+```
+:::
+
+## 注意事项
+
+- `value` / `target-time` 对**纯数字时间戳**自动识别：10 位数字视作秒级时间戳，13 位数字视作毫秒级时间戳。
+- `countdown` 模式下组件销毁、切出 `keep-alive` 缓存时会自动清理定时器，避免内存泄漏。
+- `type` 从 `now`/`countdown` 切换为 `text`（或反向），组件会自动重置定时器。
+- 如需不同的时区展示，可在父组件中将 `value` 先转换为本地时区 Date 对象再传入。

package/docs/components/extend/ex-bar.md

@@ -1,68 +1,68 @@
-## ExBar - 柱状图组件
-
-基于 ECharts 封装的柱状图组件。
-
-## 基本用法
-
-::: demo 柱状图基础示例
-```vue
-<template>
-  <ExChart type="bar" :chartData="chartData" style="height: 400px;" />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      chartData: [
-        { name: '张三', value: 65 },
-        { name: '李四', value: 78 },
-        { name: '王五', value: 89 },
-        { name: '赵六', value: 95 },
-        { name: '钱七', value: 72 }
-      ]
-    }
-  }
-}
-</script>
-```
-:::
-
-## 显示标记点
-
-::: demo 显示最大值和最小值标记点
-```vue
-<template>
-  <ExChart type="bar" :chartData="chartData" :markPoint="true" style="height: 400px;" />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      chartData: [
-        { name: '华东区', value: 1250 },
-        { name: '华南区', value: 980 },
-        { name: '华北区', value: 890 },
-        { name: '西南区', value: 720 },
-        { name: '西北区', value: 560 }
-      ]
-    }
-  }
-}
-</script>
-```
-:::
-
-## 属性说明
-
-| 属性 | 类型 | 默认值 | 说明 |
-|------|------|--------|------|
-| `chartData` | Array | [] | 图表数据 |
-| `theme` | String | '' | 主题名称 |
-| `size` | String | 'medium' | 尺寸 |
-| `markPoint` | Boolean | false | 是否显示标记点 |
-| `showZoom` | Boolean | false | 是否显示缩放功能 |
-| `reverse` | Boolean | false | 是否反转坐标轴 |
-| `longLable` | Boolean | false | 是否启用长标签模式 |
+## ExBar - 柱状图组件
+
+基于 ECharts 封装的柱状图组件。
+
+## 基本用法
+
+::: demo 柱状图基础示例
+```vue
+<template>
+  <ExChart type="bar" :chartData="chartData" style="height: 400px;" />
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      chartData: [
+        { name: '张三', value: 65 },
+        { name: '李四', value: 78 },
+        { name: '王五', value: 89 },
+        { name: '赵六', value: 95 },
+        { name: '钱七', value: 72 }
+      ]
+    }
+  }
+}
+</script>
+```
+:::
+
+## 显示标记点
+
+::: demo 显示最大值和最小值标记点
+```vue
+<template>
+  <ExChart type="bar" :chartData="chartData" :markPoint="true" style="height: 400px;" />
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      chartData: [
+        { name: '华东区', value: 1250 },
+        { name: '华南区', value: 980 },
+        { name: '华北区', value: 890 },
+        { name: '西南区', value: 720 },
+        { name: '西北区', value: 560 }
+      ]
+    }
+  }
+}
+</script>
+```
+:::
+
+## 属性说明
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| `chartData` | Array | [] | 图表数据 |
+| `theme` | String | '' | 主题名称 |
+| `size` | String | 'medium' | 尺寸 |
+| `markPoint` | Boolean | false | 是否显示标记点 |
+| `showZoom` | Boolean | false | 是否显示缩放功能 |
+| `reverse` | Boolean | false | 是否反转坐标轴 |
+| `longLable` | Boolean | false | 是否启用长标签模式 |
 | `energyType` | String | '' | Y轴单位 |

package/docs/components/extend/ex-button.md

@@ -1,62 +1,62 @@
-## ExButton 按钮
-
-基于 ElementUI 按钮封装，支持防抖和字体大小配置。
-
-## 基础用法
-
-::: demo 按钮基础示例
-```vue
-<template>
-  <div>
-    <ex-button>默认按钮</ex-button>
-    <ex-button type="primary">主要按钮</ex-button>
-    <ex-button type="success">成功按钮</ex-button>
-  </div>
-</template>
-```
-:::
-
-## 字体大小
-
-支持三种尺寸：`small`、`medium`、`large`
-
-::: demo 按钮字体大小示例
-```vue
-<template>
-  <div>
-    <ex-button size="mini">迷你按钮</ex-button>
-    <ex-button size="small">小按钮</ex-button>
-    <ex-button size="medium">中按钮</ex-button>
-    <ex-button size="large">大按钮</ex-button>
-  </div>
-</template>
-```
-:::
-
-## 继承 ConfigProvider 配置
-
-当 ExButton 被包裹在 XtConfigProvider 中时，会自动继承字体大小配置：
-
-::: demo 按钮继承字体大小示例
-```vue
-<template>
-  <xt-config-provider size="large">
-    <ex-button>自动继承大字体</ex-button>
-  </xt-config-provider>
-</template>
-```
-:::
-
-## Attributes
-
-| 参数 | 说明 | 类型 | 可选值 | 默认值 |
-|------|------|------|--------|--------|
-| type | 按钮类型 | string | primary/success/warning/danger | — |
-| size | 按钮尺寸 | string | small/medium/large | — |
-| throttle | 点击节流时间 (ms) | number | — | 0 |
-
-## Events
-
-| 事件名 | 说明 | 回调参数 |
-|--------|------|----------|
-| click | 点击按钮时触发 | — |
+## ExButton 按钮
+
+基于 ElementUI 按钮封装，支持防抖和字体大小配置。
+
+## 基础用法
+
+::: demo 按钮基础示例
+```vue
+<template>
+  <div>
+    <ex-button>默认按钮</ex-button>
+    <ex-button type="primary">主要按钮</ex-button>
+    <ex-button type="success">成功按钮</ex-button>
+  </div>
+</template>
+```
+:::
+
+## 字体大小
+
+支持三种尺寸：`small`、`medium`、`large`
+
+::: demo 按钮字体大小示例
+```vue
+<template>
+  <div>
+    <ex-button size="mini">迷你按钮</ex-button>
+    <ex-button size="small">小按钮</ex-button>
+    <ex-button size="medium">中按钮</ex-button>
+    <ex-button size="large">大按钮</ex-button>
+  </div>
+</template>
+```
+:::
+
+## 继承 ConfigProvider 配置
+
+当 ExButton 被包裹在 XtConfigProvider 中时，会自动继承字体大小配置：
+
+::: demo 按钮继承字体大小示例
+```vue
+<template>
+  <xt-config-provider size="large">
+    <ex-button>自动继承大字体</ex-button>
+  </xt-config-provider>
+</template>
+```
+:::
+
+## Attributes
+
+| 参数 | 说明 | 类型 | 可选值 | 默认值 |
+|------|------|------|--------|--------|
+| type | 按钮类型 | string | primary/success/warning/danger | — |
+| size | 按钮尺寸 | string | small/medium/large | — |
+| throttle | 点击节流时间 (ms) | number | — | 0 |
+
+## Events
+
+| 事件名 | 说明 | 回调参数 |
+|--------|------|----------|
+| click | 点击按钮时触发 | — |