@a2simcode/ui 0.0.271 → 0.0.272

package/docs/components/collapse.md

@@ -1,26 +1,26 @@
-# Collapse 折叠面板
-
-通过折叠面板收纳内容区域。
-
-## 基础用法
-
-可以折叠/展开的内容区域。
-
-<Demo :source-code="collapseBasicCode">
-  <template #source>
-    <collapse-basic />
-  </template>
-  <template #description>
-    通过 `v-model` 绑定当前激活的面板，使用 `el-collapse-item` 定义面板内容。支持 `accordion` 属性开启手风琴模式。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="collapseApi" componentName="collapse" />
-
-<script setup>
-import CollapseBasic from '../examples/collapse/basic.vue'
-import collapseApi from './meta/collapse'
-import collapseBasicCode from '../examples/collapse/basic.vue?raw'
-</script>
+# Collapse 折叠面板
+
+通过折叠面板收纳内容区域。
+
+## 基础用法
+
+可以折叠/展开的内容区域。
+
+<Demo :source-code="collapseBasicCode">
+  <template #source>
+    <collapse-basic />
+  </template>
+  <template #description>
+    通过 `v-model` 绑定当前激活的面板，使用 `el-collapse-item` 定义面板内容。支持 `accordion` 属性开启手风琴模式。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="collapseApi" componentName="collapse" />
+
+<script setup>
+import CollapseBasic from '../examples/collapse/basic.vue'
+import collapseApi from './meta/collapse'
+import collapseBasicCode from '../examples/collapse/basic.vue?raw'
+</script>

package/docs/components/comp.md

@@ -1,91 +1,106 @@
-# Comp 动态组件
-
-`j-comp` 是一个通用的动态组件渲染器，它可以根据配置渲染不同类型的组件，并支持递归渲染子组件。
-
-## 基础用法
-
-通过 `type` 属性指定组件类型，`config` 属性传递组件配置。
-
-<Demo :source-code="basicCode">
-  <template #source>
-    <basic />
-  </template>
-  <template #description>
-    使用 `j-comp` 渲染一个简单的按钮组件。
-  </template>
-</Demo>
-
-## Tabs 示例
-
-当 `type` 为 `j-tabs` 时：
-
-1. 子组件会自动添加 `name` 属性（`_tab` + index）。
-2. 组件会自动开启输入模式（`v-model` 生效）。
-3. 默认值规则：
-   - 优先使用 `config.defaultValue`。
-   - 其次查找子组件中配置了 `active: true` 的项，使用其对应的 `_tab` + index。
-   - 默认值为 `_tab0`。
-
-<Demo :source-code="tabsCode">
-  <template #source>
-    <tabs />
-  </template>
-  <template #description>
-    使用 `j-comp` 渲染 `j-tabs` 组件，子组件会自动获得 `name` 属性。
-  </template>
-</Demo>
-
-## Collapse 示例
-
-当 `type` 为 `j-collapse` 时：
-
-1. 子组件会自动添加 `name` 属性（`_collapse` + index）。
-2. 组件会自动开启输入模式（`v-model` 生效）。
-3. 默认值规则：
-   - 优先使用 `config.defaultValue`。
-   - 其次查找子组件中配置了 `active: true` 的项，使用其对应的 `_collapse` + index。
-   - 默认值为 `[]`（非手风琴模式）或 `''`（手风琴模式）。
-
-<Demo :source-code="collapseCode">
-  <template #source>
-    <collapse />
-  </template>
-  <template #description>
-    使用 `j-comp` 渲染 `j-collapse` 组件，子组件会自动获得 `name` 属性。
-  </template>
-</Demo>
-
-## Table mergeRows 示例
-
-当 `type` 为 `j-table` 时，`config.mergeRows` 支持按行号范围合并指定列的单元格：
-
-1. `mergeRows` 格式为 `[{ col, row1, row2 }]`，`col` 对应列的 `id`，`row1`/`row2` 为 1-based 数据行号范围。
-2. 匹配按列归一化后的 `id` 进行，嵌套子列同样生效。
-3. 命中的列会自动生成 `mergeCell` 函数，范围内的行无条件合并。
-4. 仅当未显式传入 `config.columns`（列由 `children` 推导）时生效。
-
-<Demo :source-code="tableMergeRowsCode">
-  <template #source>
-    <table-merge-rows />
-  </template>
-  <template #description>
-    使用 `j-comp` 渲染 `j-table`，通过 `mergeRows` 将“部门”列按行号范围合并。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="compApi" componentName="comp" />
-
-<script setup>
-import Basic from '../examples/comp/basic.vue'
-import Tabs from '../examples/comp/tabs.vue'
-import Collapse from '../examples/comp/collapse.vue'
-import TableMergeRows from '../examples/comp/table-merge-rows.vue'
-import compApi from './meta/comp'
-
-import basicCode from '../examples/comp/basic.vue?raw'
-import tabsCode from '../examples/comp/tabs.vue?raw'
-import collapseCode from '../examples/comp/collapse.vue?raw'
-import tableMergeRowsCode from '../examples/comp/table-merge-rows.vue?raw'
-</script>
+# Comp 动态组件
+
+`j-comp` 是一个通用的动态组件渲染器，它可以根据配置渲染不同类型的组件，并支持递归渲染子组件。
+
+## 基础用法
+
+通过 `type` 属性指定组件类型，`config` 属性传递组件配置。
+
+<Demo :source-code="basicCode">
+  <template #source>
+    <basic />
+  </template>
+  <template #description>
+    使用 `j-comp` 渲染一个简单的按钮组件。
+  </template>
+</Demo>
+
+## Tabs 示例
+
+当 `type` 为 `j-tabs` 时：
+
+1. 子组件会自动添加 `name` 属性（`_tab` + index）。
+2. 组件会自动开启输入模式（`v-model` 生效）。
+3. 默认值规则：
+   - 优先使用 `config.defaultValue`。
+   - 其次查找子组件中配置了 `active: true` 的项，使用其对应的 `_tab` + index。
+   - 默认值为 `_tab0`。
+
+<Demo :source-code="tabsCode">
+  <template #source>
+    <tabs />
+  </template>
+  <template #description>
+    使用 `j-comp` 渲染 `j-tabs` 组件，子组件会自动获得 `name` 属性。
+  </template>
+</Demo>
+
+## Collapse 示例
+
+当 `type` 为 `j-collapse` 时：
+
+1. 子组件会自动添加 `name` 属性（`_collapse` + index）。
+2. 组件会自动开启输入模式（`v-model` 生效）。
+3. 默认值规则：
+   - 优先使用 `config.defaultValue`。
+   - 其次查找子组件中配置了 `active: true` 的项，使用其对应的 `_collapse` + index。
+   - 默认值为 `[]`（非手风琴模式）或 `''`（手风琴模式）。
+
+<Demo :source-code="collapseCode">
+  <template #source>
+    <collapse />
+  </template>
+  <template #description>
+    使用 `j-comp` 渲染 `j-collapse` 组件，子组件会自动获得 `name` 属性。
+  </template>
+</Demo>
+
+## Table mergeRows 示例
+
+当 `type` 为 `j-table` 时，`config.mergeRows` 支持按行号范围合并指定列的单元格：
+
+1. `mergeRows` 格式为 `[{ col, row1, row2 }]`，`col` 对应列的 `id`，`row1`/`row2` 为 1-based 数据行号范围。
+2. 匹配按列归一化后的 `id` 进行，嵌套子列同样生效。
+3. 命中的列会自动生成 `mergeCell` 函数，范围内的行无条件合并。
+4. 仅当未显式传入 `config.columns`（列由 `children` 推导）时生效。
+
+<Demo :source-code="tableMergeRowsCode">
+  <template #source>
+    <table-merge-rows />
+  </template>
+  <template #description>
+    使用 `j-comp` 渲染 `j-table`，通过 `mergeRows` 将“部门”列按行号范围合并。
+  </template>
+</Demo>
+
+## Table 固定行数与合并表头示例
+
+当 `type` 为 `j-table` 时，可以通过 `config` 同时传入 `isRowFixed`、`rowNum`、`mergeRows` 和 `mergeHeader`：
+
+<Demo :source-code="tableRowFixedMergeCode">
+  <template #source>
+    <table-row-fixed-merge />
+  </template>
+  <template #description>
+    使用 `j-comp` 渲染 `j-table`，展示固定 7 行、指定列行合并和分组合并表头。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="compApi" componentName="comp" />
+
+<script setup>
+import Basic from '../examples/comp/basic.vue'
+import Tabs from '../examples/comp/tabs.vue'
+import Collapse from '../examples/comp/collapse.vue'
+import TableMergeRows from '../examples/comp/table-merge-rows.vue'
+import TableRowFixedMerge from '../examples/comp/table-row-fixed-merge.vue'
+import compApi from './meta/comp'
+
+import basicCode from '../examples/comp/basic.vue?raw'
+import tabsCode from '../examples/comp/tabs.vue?raw'
+import collapseCode from '../examples/comp/collapse.vue?raw'
+import tableMergeRowsCode from '../examples/comp/table-merge-rows.vue?raw'
+import tableRowFixedMergeCode from '../examples/comp/table-row-fixed-merge.vue?raw'
+</script>

package/docs/components/count-up.md

@@ -1,24 +1,24 @@
-# CountUp 数字滚动动画组件
-
-使用数字滚动效果展示数值的变化，常用于数据统计展示和数值动画效果。
-
-## 基础用法
-
-<Demo :source-code="countUpBasicCode">
-  <template #source>
-    <count-up-basic />
-  </template>
-  <template #description>
-    通过 `end-value` 传入要显示的最终值。支持自定义动画时长、小数位数、起始值等功能。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="countUpApi" componentName="count-up" />
-
-<script setup>
-import CountUpBasic from '../examples/count-up/basic.vue'
-import countUpApi from './meta/count-up'
-import countUpBasicCode from '../examples/count-up/basic.vue?raw'
-</script>
+# CountUp 数字滚动动画组件
+
+使用数字滚动效果展示数值的变化，常用于数据统计展示和数值动画效果。
+
+## 基础用法
+
+<Demo :source-code="countUpBasicCode">
+  <template #source>
+    <count-up-basic />
+  </template>
+  <template #description>
+    通过 `end-value` 传入要显示的最终值。支持自定义动画时长、小数位数、起始值等功能。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="countUpApi" componentName="count-up" />
+
+<script setup>
+import CountUpBasic from '../examples/count-up/basic.vue'
+import countUpApi from './meta/count-up'
+import countUpBasicCode from '../examples/count-up/basic.vue?raw'
+</script>

package/docs/components/count.md

@@ -1,24 +1,24 @@
-# Count 计算组件
-
-用于根据公式自动计算数值。
-
-## 基础用法
-
-<Demo :source-code="countBasicCode">
-  <template #source>
-    <count-basic />
-  </template>
-  <template #description>
-    通过 `format-json` 传入计算公式。支持千分位分隔、大写转换、小数精度控制等功能。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="countApi" componentName="count" />
-
-<script setup>
-import CountBasic from '../examples/count/basic.vue'
-import countApi from './meta/count'
-import countBasicCode from '../examples/count/basic.vue?raw'
-</script>
+# Count 计算组件
+
+用于根据公式自动计算数值。
+
+## 基础用法
+
+<Demo :source-code="countBasicCode">
+  <template #source>
+    <count-basic />
+  </template>
+  <template #description>
+    通过 `format-json` 传入计算公式。支持千分位分隔、大写转换、小数精度控制等功能。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="countApi" componentName="count" />
+
+<script setup>
+import CountBasic from '../examples/count/basic.vue'
+import countApi from './meta/count'
+import countBasicCode from '../examples/count/basic.vue?raw'
+</script>

package/docs/components/data-panel.md

@@ -1,24 +1,24 @@
-# DataPanel 数据面板组件
-
-用于展示和组织数据内容的面板容器组件，提供标题、插槽等功能支持。
-
-## 基础用法
-
-<Demo :source-code="dataPanelBasicCode">
-  <template #source>
-    <data-panel-basic />
-  </template>
-  <template #description>
-    通过 `title` 属性设置面板标题。支持 `titleRight` 插槽在标题右侧添加额外内容。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="dataPanelApi" componentName="data-panel" />
-
-<script setup>
-import DataPanelBasic from '../examples/data-panel/basic.vue'
-import dataPanelApi from './meta/data-panel'
-import dataPanelBasicCode from '../examples/data-panel/basic.vue?raw'
-</script>
+# DataPanel 数据面板组件
+
+用于展示和组织数据内容的面板容器组件，提供标题、插槽等功能支持。
+
+## 基础用法
+
+<Demo :source-code="dataPanelBasicCode">
+  <template #source>
+    <data-panel-basic />
+  </template>
+  <template #description>
+    通过 `title` 属性设置面板标题。支持 `titleRight` 插槽在标题右侧添加额外内容。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="dataPanelApi" componentName="data-panel" />
+
+<script setup>
+import DataPanelBasic from '../examples/data-panel/basic.vue'
+import dataPanelApi from './meta/data-panel'
+import dataPanelBasicCode from '../examples/data-panel/basic.vue?raw'
+</script>

package/docs/components/date.md

@@ -1,76 +1,76 @@
-# Date 日期选择器
-
-用于选择或输入日期
-
-## 基础用法
-
-<Demo :source-code="dateBasicCode">
-  <template #source>
-    <DateBasic />
-  </template>
-  <template #description>
-    基本单位由`selectType`属性指定。通过`shortcuts`配置快捷选项，禁用日期通过`disabledDate`设置，默认是`Date`对象。
-  </template>
-</Demo>
-
-## 其他选择器类型
-
-<Demo :source-code="dateTypesCode">
-  <template #source>
-    <DateTypes />
-  </template>
-  <template #description>
-    通过 `selectType` 属性可以设置不同的选择器类型，如 `year`, `month`, `week`, `dates`, `datetime`。
-  </template>
-</Demo>
-
-## 选择日期范围
-
-<Demo :source-code="dateRangeCode">
-  <template #source>
-    <DateRange />
-  </template>
-  <template #description>
-    通过 `selectType` 设置为 `daterange`, `datetimerange`, `monthrange` 即可选择日期范围。
-  </template>
-</Demo>
-
-## 日期格式
-
-<Demo :source-code="dateFormatCode">
-  <template #source>
-    <DateFormat />
-  </template>
-  <template #description>
-    使用 `format` 指定输入框的格式。使用 `value-format` 指定绑定值的格式。
-  </template>
-</Demo>
-
-## 默认显示日期
-
-<Demo :source-code="dateDefaultValueCode">
-  <template #source>
-    <DateDefaultValue />
-  </template>
-  <template #description>
-    `defaultValue` 可选，选择器打开时默认显示的时间。`defaultTime` 范围选择时选中日期所使用的当日内具体时刻。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="dateApi" componentName="date" />
-
-<script setup>
-import DateBasic from '../examples/date/basic.vue'
-import DateTypes from '../examples/date/types.vue'
-import DateRange from '../examples/date/range.vue'
-import DateFormat from '../examples/date/format.vue'
-import DateDefaultValue from '../examples/date/default-value.vue'
-import dateApi from './meta/date'
-import dateBasicCode from '../examples/date/basic.vue?raw'
-import dateTypesCode from '../examples/date/types.vue?raw'
-import dateRangeCode from '../examples/date/range.vue?raw'
-import dateFormatCode from '../examples/date/format.vue?raw'
-import dateDefaultValueCode from '../examples/date/default-value.vue?raw'
-</script>
+# Date 日期选择器
+
+用于选择或输入日期
+
+## 基础用法
+
+<Demo :source-code="dateBasicCode">
+  <template #source>
+    <DateBasic />
+  </template>
+  <template #description>
+    基本单位由`selectType`属性指定。通过`shortcuts`配置快捷选项，禁用日期通过`disabledDate`设置，默认是`Date`对象。
+  </template>
+</Demo>
+
+## 其他选择器类型
+
+<Demo :source-code="dateTypesCode">
+  <template #source>
+    <DateTypes />
+  </template>
+  <template #description>
+    通过 `selectType` 属性可以设置不同的选择器类型，如 `year`, `month`, `week`, `dates`, `datetime`。
+  </template>
+</Demo>
+
+## 选择日期范围
+
+<Demo :source-code="dateRangeCode">
+  <template #source>
+    <DateRange />
+  </template>
+  <template #description>
+    通过 `selectType` 设置为 `daterange`, `datetimerange`, `monthrange` 即可选择日期范围。
+  </template>
+</Demo>
+
+## 日期格式
+
+<Demo :source-code="dateFormatCode">
+  <template #source>
+    <DateFormat />
+  </template>
+  <template #description>
+    使用 `format` 指定输入框的格式。使用 `value-format` 指定绑定值的格式。
+  </template>
+</Demo>
+
+## 默认显示日期
+
+<Demo :source-code="dateDefaultValueCode">
+  <template #source>
+    <DateDefaultValue />
+  </template>
+  <template #description>
+    `defaultValue` 可选，选择器打开时默认显示的时间。`defaultTime` 范围选择时选中日期所使用的当日内具体时刻。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="dateApi" componentName="date" />
+
+<script setup>
+import DateBasic from '../examples/date/basic.vue'
+import DateTypes from '../examples/date/types.vue'
+import DateRange from '../examples/date/range.vue'
+import DateFormat from '../examples/date/format.vue'
+import DateDefaultValue from '../examples/date/default-value.vue'
+import dateApi from './meta/date'
+import dateBasicCode from '../examples/date/basic.vue?raw'
+import dateTypesCode from '../examples/date/types.vue?raw'
+import dateRangeCode from '../examples/date/range.vue?raw'
+import dateFormatCode from '../examples/date/format.vue?raw'
+import dateDefaultValueCode from '../examples/date/default-value.vue?raw'
+</script>