From fdeb869c386da95150a087bc22bcebc4e57d0f76 Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Tue, 18 Mar 2025 18:16:32 +0800
Subject: [PATCH] 更新所有表单组件文档和头注释
---
forms/textarea/CTextArea.vue | 3
forms/imagePicker/CImagePicker.vue | 3
forms/checkbox/CCheckBox.vue | 8 +
_cursor.ai/forms.doc/imagePicker.doc/CImagePicker.doc.md | 78 ++++++++++++++-----
forms/numberStep/CNumberStep.vue | 2
_cursor.ai/forms.doc/input.doc/CInput.doc.md | 8 +
forms/input/CInput.vue | 2
_cursor.ai/forms.doc/form.doc/CForm.doc.md | 18 ++--
_cursor.ai/forms.doc/checkbox.doc/CCheckBox.doc.md | 15 ++-
_cursor.ai/forms.doc/numberStep.doc/CNumberStep.doc.md | 4
forms/switch/CSwitch.vue | 3
forms/chinaArea/CChinaArea.vue | 3
forms/datePicker/CDatePicker.vue | 3
forms/numberValve/CNumberValve.vue | 5 +
_cursor.ai/forms.doc/datePicker.doc/CDatePicker.doc.md | 15 ++-
_cursor.ai/forms.doc/select.doc/CSelect.doc.md | 4
forms/form/CForm.vue | 5 +
forms/select/CSelect.vue | 3
_cursor.ai/forms.doc/chinaArea.doc/CChinaArea.doc.md | 57 +++++++-------
19 files changed, 163 insertions(+), 76 deletions(-)
diff --git a/_cursor.ai/forms.doc/checkbox.doc/CCheckBox.doc.md b/_cursor.ai/forms.doc/checkbox.doc/CCheckBox.doc.md
index 1998ff2..dc8dac3 100644
--- a/_cursor.ai/forms.doc/checkbox.doc/CCheckBox.doc.md
+++ b/_cursor.ai/forms.doc/checkbox.doc/CCheckBox.doc.md
@@ -14,8 +14,12 @@
- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
- `options` (Array，可选)：选项列表，每个选项应包含 label 和 value 属性，默认为空数组
-- `boxType` (String，可选)：勾选类型，可选值有 checkbox（多选）、radio（单选），默认为 checkbox
-- `displayType` (String，可选)：显示模式，可选值有 plane（直接显示）、dialog（弹窗选择），默认为 plane
+- `boxType` (String，可选)：勾选类型，默认为 checkbox
+ - `checkbox`：多选模式
+ - `radio`：单选模式
+- `displayType` (String，可选)：显示模式，默认为 plane
+ - `plane`：直接显示模式
+ - `dialog`：弹窗选择模式
- `placeholder` (String，可选)：输入框占位提示文本
## 使用示例
@@ -121,12 +125,13 @@
## 注意事项
1. 组件支持两种选择类型：
- - `checkbox`：多选模式，可以选择多个选项，表单值为数组
- - `radio`：单选模式，只能选择一个选项，表单值为单个值
+ - `checkbox`：多选模式，可以选择多个选项，表单值为数组
+ - `radio`：单选模式，只能选择一个选项，表单值为单个值
2. 组件支持两种显示模式：
- `plane`：直接显示模式，选项直接显示在表单项下方
- `dialog`：弹窗选择模式，点击表单项后弹出选择弹窗
3. 当选项较多时，建议使用弹窗选择模式（`displayType="dialog"`）
4. 在多选模式下，表单值为选中项的 value 值组成的数组
5. 在单选模式下，表单值为选中项的 value 值
-6. 组件会自动根据表单值显示已选项的文本，多个选项时用逗号分隔
\ No newline at end of file
+6. 组件会自动根据表单值显示已选项的文本，多个选项时用逗号分隔
+7. 使用单选模式时，确保传入的表单值如果为单个值而非数组，否则可能导致显示异常
\ No newline at end of file
diff --git a/_cursor.ai/forms.doc/chinaArea.doc/CChinaArea.doc.md b/_cursor.ai/forms.doc/chinaArea.doc/CChinaArea.doc.md
index 335fe08..7d0cb73 100644
--- a/_cursor.ai/forms.doc/chinaArea.doc/CChinaArea.doc.md
+++ b/_cursor.ai/forms.doc/chinaArea.doc/CChinaArea.doc.md
@@ -2,7 +2,7 @@
## 功能说明
-CChinaArea 是一个中国地区选择器组件，用于在表单中选择省市区地址。组件内置了完整的中国行政区划数据，支持省、市、区三级联动选择，并且可以设置默认值和只读模式。
+CChinaArea 是一个中国地区选择器组件，用于在表单中选择省市区地址。组件内置了完整的中国行政区划数据，支持省、市、区(街道)多级联动选择，并且可以通过地理定位自动获取当前位置。
## 引用方式
@@ -13,11 +13,11 @@
## 组件参数
- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
-- `level` (Number，可选)：选择层级，可选值为 1（省）、2（省市）、3（省市区），默认为 3
+- `autoGeo` (Boolean，可选)：是否自动通过地理定位获取省市区，默认为 false
+- `level` (Number，可选)：联动级别，默认为 3
+ - `3`：省市区三级联动
+ - `4`：省市区街道四级联动
- `placeholder` (String，可选)：选择器占位提示文本
-- `readOnly` (Boolean，可选)：只读模式，默认为 false
-- `separator` (String，可选)：地址文本分隔符，默认为空格
-- `defaultCode` (String，可选)：默认选中的区域编码
## 使用示例
@@ -47,12 +47,7 @@
data() {
return {
form: {
- address: {
- province: '',
- city: '',
- district: '',
- code: ''
- }
+ address: []
}
};
}
@@ -60,30 +55,34 @@
</script>
```
-### 自定义配置
+### 四级联动
```html
-<CFormItem name="region" label="配送区域">
+<CFormItem name="region" label="详细区域">
<CChinaArea
- :level="2"
- separator="/"
- defaultCode="330100"
- placeholder="请选择配送区域"
+ :level="4"
+ placeholder="请选择所在区域"
+ />
+</CFormItem>
+```
+
+### 自动获取地理位置
+
+```html
+<CFormItem name="location" label="当前位置">
+ <CChinaArea
+ :autoGeo="true"
+ placeholder="正在获取位置..."
/>
</CFormItem>
```
## 注意事项
-1. 组件返回的数据格式为对象，包含以下字段：
- - `province`：省份名称
- - `city`：城市名称
- - `district`：区县名称（仅在 level=3 时有值）
- - `code`：选中区域的行政区划代码
-2. 可以通过 `defaultCode` 设置默认选中的区域
-3. `level` 参数决定了选择的层级：
- - 1：仅选择省份
- - 2：选择省份和城市
- - 3：选择省份、城市和区县
-4. 组件会根据当前选择自动联动更新下级选项
-5. 在只读模式下，地址信息将以文本形式显示，使用 `separator` 分隔
\ No newline at end of file
+1. 组件返回的数据格式为数组，包含选中的地区名称：
+ - 三级联动：`['浙江省', '杭州市', '西湖区']`
+ - 四级联动：`['浙江省', '杭州市', '西湖区', '文三路街道']`
+2. 当启用地理定位功能（`autoGeo=true`）时，组件会尝试获取当前位置的省市区信息
+3. 组件会根据当前选择自动联动更新下级选项
+4. 地区数据源来自内置的中国行政区划数据
+5. 位置信息在表单中显示时，地址各级之间会以 ` / ` 分隔
\ No newline at end of file
diff --git a/_cursor.ai/forms.doc/datePicker.doc/CDatePicker.doc.md b/_cursor.ai/forms.doc/datePicker.doc/CDatePicker.doc.md
index 2e6991d..1fcedb4 100644
--- a/_cursor.ai/forms.doc/datePicker.doc/CDatePicker.doc.md
+++ b/_cursor.ai/forms.doc/datePicker.doc/CDatePicker.doc.md
@@ -13,11 +13,17 @@
## 组件参数
- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
-- `mode` (String，可选)：日期时间选择器模式，可选值有 date、dateTime、dateRange，默认为 date
+- `mode` (String，可选)：日期时间选择器模式，默认为 date
+ - `date`：选择单个日期，使用系统日期选择器
+ - `dateTime`：选择日期和时间，使用自定义的日期时间选择器
+ - `dateRange`：选择日期范围，使用自定义的日期范围选择器
- `placeholder` (String，可选)：输入框占位提示文本
- `limitStart` (String，可选)：可选日期的开始日期，格式为 YYYY-MM-DD
- `limitEnd` (String，可选)：可选日期的结束日期，格式为 YYYY-MM-DD
-- `fields` (String，可选)：日期选择粒度，可选值有 year、month、day，默认为 day
+- `fields` (String，可选)：日期选择粒度，默认为 day
+ - `year`：只选择年
+ - `month`：选择到月
+ - `day`：选择到日
- `readOnly` (Boolean，可选)：只读模式，默认为 false
- `allowClear` (Boolean，可选)：是否允许清除已选值，默认为 false
@@ -102,10 +108,7 @@
## 注意事项
-1. 不同的 `mode` 值对应不同的日期选择交互方式：
- - `date`：选择单个日期，使用系统日期选择器
- - `dateTime`：选择日期和时间，使用自定义的日期时间选择器
- - `dateRange`：选择日期范围，使用自定义的日期范围选择器
+1. 不同的 `mode` 值对应不同的日期选择交互方式
2. 当设置 `allowClear` 为 true 时，已选择日期后会显示清除图标，点击可清除已选值
3. `limitStart` 和 `limitEnd` 参数仅在 `mode` 为 date 时生效
4. 组件默认的可选日期范围是当前年份的前后 30 年
diff --git a/_cursor.ai/forms.doc/form.doc/CForm.doc.md b/_cursor.ai/forms.doc/form.doc/CForm.doc.md
index 3280a71..5869514 100644
--- a/_cursor.ai/forms.doc/form.doc/CForm.doc.md
+++ b/_cursor.ai/forms.doc/form.doc/CForm.doc.md
@@ -13,16 +13,18 @@
## 组件参数
- `formData` (Object，必填)：表单数据对象，用于存储表单各项的值
-- `autoScrollToError` (String，可选)：是否自动滚动到错误位置，可选值有 on、off，默认为 off
+- `autoScrollToError` (String，可选)：是否自动滚动到错误位置，默认为 off
+ - `on`：启用自动滚动
+ - `off`：禁用自动滚动
- `onChange` (Function，可选)：表单项变化的回调函数，参数为变化的表单项数据
- `onFinish` (Function，可选)：表单完成的回调函数，仅在提交且通过表单验证后调用，参数为整个表单数据
## 实例方法
- `$submit`：手动触发表单提交，会执行表单验证
-- `$preVerify`：提前验证指定的表单项，参数为表单项名称数组和回调函数
-- `$setErrors`：直接设置表单错误，参数为错误对象，格式为 `{字段名: 错误信息}`
-- `$setScrollTop`：设置滚动位置，参数为滚动的 top 值
+- `$preVerify(keys, callback)`：提前验证指定的表单项，参数为表单项名称数组和回调函数
+- `$setErrors(errors)`：直接设置表单错误，参数为错误对象，格式为 `{字段名: 错误信息}`
+- `$setScrollTop(top)`：设置滚动位置，参数为滚动的 top 值
## 使用示例
@@ -31,7 +33,7 @@
```html
<template>
<CForm
- :form="form"
+ :formData="form"
:onFinish="handleFinish"
>
<CFormItem name="username" label="用户名" required>
@@ -78,7 +80,7 @@
```html
<CForm
- :form="form"
+ :formData="form"
autoScrollToError="on"
:onFinish="handleFinish"
>
@@ -98,11 +100,11 @@
```html
<CForm
ref="form"
- :form="form"
+ :formData="form"
:onFinish="handleFinish"
>
<!-- 表单项 -->
- <button @tap="submitForm">提交</button>
+ <button @tap="evt => submitForm()">提交</button>
</CForm>
```
diff --git a/_cursor.ai/forms.doc/imagePicker.doc/CImagePicker.doc.md b/_cursor.ai/forms.doc/imagePicker.doc/CImagePicker.doc.md
index 4af8934..5d60ec9 100644
--- a/_cursor.ai/forms.doc/imagePicker.doc/CImagePicker.doc.md
+++ b/_cursor.ai/forms.doc/imagePicker.doc/CImagePicker.doc.md
@@ -2,7 +2,7 @@
## 功能说明
-CImagePicker 是一个图片选择器组件，用于在表单中上传和管理图片。组件支持单张和多张图片上传，支持预览、删除等功能，并且可以限制上传图片的数量和大小。
+CImagePicker 是一个图片选择器组件，用于在表单中上传和管理图片。组件支持单张和多张图片上传，支持预览、删除等功能，并且可以限制上传图片的数量和来源。
## 引用方式
@@ -13,12 +13,16 @@
## 组件参数
- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
-- `maxCount` (Number，可选)：最大上传图片数量，默认为 9
-- `maxSize` (Number，可选)：单张图片最大大小，单位为 MB，默认为 5
-- `compress` (Boolean，可选)：是否压缩图片，默认为 true
-- `quality` (Number，可选)：图片压缩质量，取值范围 0-1，默认为 0.8
-- `placeholder` (String，可选)：选择器占位提示文本
-- `readOnly` (Boolean，可选)：只读模式，默认为 false
+- `count` (Number，可选)：最大图片张数，默认为 1
+- `sourceType` (Array，可选)：图片来源，默认为 ['album', 'camera']
+ - `album`：从相册选择
+ - `camera`：使用相机
+- `params` (Object，可选)：上传图片的附加参数，默认为空对象
+- `needThumb` (Boolean，可选)：是否开启缩略图，默认为 false
+
+## 实例方法
+
+- `$uploadImage(callback)`：上传图片到服务器，参数为回调函数，回调函数接收两个参数：状态和结果
## 使用示例
@@ -29,7 +33,7 @@
<CForm :form="form">
<CFormItem name="photos" label="图片上传">
<CImagePicker
- :maxCount="3"
+ :count="3"
placeholder="请上传图片"
/>
</CFormItem>
@@ -57,24 +61,58 @@
</script>
```
-### 自定义配置
+### 限制图片来源
```html
-<CFormItem name="certificate" label="证书照片">
+<CFormItem name="idCard" label="身份证照片">
<CImagePicker
- :maxCount="1"
- :maxSize="2"
- :compress="true"
- :quality="0.6"
- placeholder="请上传证书照片"
+ :count="1"
+ :sourceType="['camera']"
+ placeholder="请拍摄身份证照片"
/>
</CFormItem>
```
+### 使用上传方法
+
+```html
+<template>
+ <CForm :form="form">
+ <CFormItem name="certificate" label="证书照片">
+ <CImagePicker
+ ref="imagePicker"
+ :count="1"
+ :params="{type: 'certificate'}"
+ :needThumb="true"
+ placeholder="请上传证书照片"
+ />
+ </CFormItem>
+ <button @tap="evt => handleUpload()">上传图片</button>
+ </CForm>
+</template>
+
+<script>
+export default {
+ // ...
+ methods: {
+ handleUpload() {
+ this.$refs.imagePicker.$uploadImage((state, result) => {
+ if (state === 'success') {
+ console.log('上传成功', result);
+ } else {
+ console.error('上传失败', result);
+ }
+ });
+ }
+ }
+};
+</script>
+```
+
## 注意事项
-1. 组件会自动处理图片上传，支持压缩和预览功能
-2. 上传的图片会被转换为 base64 格式存储在表单数据中
-3. 当设置 `maxCount` 为 1 时，组件会以单图模式运行
-4. 建议根据实际需求设置合适的 `maxSize` 和压缩参数
-5. 在只读模式下，只能查看已上传的图片，无法进行上传和删除操作
\ No newline at end of file
+1. 组件会自动过滤不支持的图片格式，只允许上传 gif、png、jpg、jpeg 格式的图片
+2. 图片大小超过 1MB 的会自动进行压缩处理
+3. 通过 `$uploadImage` 方法可以将图片上传到服务器，上传成功后会自动更新表单值
+4. 如果设置了 `needThumb` 为 true，上传时会同时生成缩略图
+5. 组件内部集成了图片预览功能，点击已上传的图片可以放大查看
\ No newline at end of file
diff --git a/_cursor.ai/forms.doc/input.doc/CInput.doc.md b/_cursor.ai/forms.doc/input.doc/CInput.doc.md
index a6c1dae..e762d3c 100644
--- a/_cursor.ai/forms.doc/input.doc/CInput.doc.md
+++ b/_cursor.ai/forms.doc/input.doc/CInput.doc.md
@@ -13,7 +13,13 @@
## 组件参数
- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
-- `type` (String，可选)：输入框类型，可选值有 text、number、password、phone、idcard、digit
+- `type` (String，可选)：输入框类型
+ - `text`：文本输入
+ - `number`：数字输入
+ - `password`：密码输入
+ - `phone`：手机号输入
+ - `idcard`：身份证号输入
+ - `digit`：带小数点的数字输入
- `placeholder` (String，可选)：输入框占位提示文本
- `unit` (String，可选)：输入框单位，设置后会在输入框右侧显示单位文本
- `readOnly` (Boolean，可选)：只读模式，默认为 false
diff --git a/_cursor.ai/forms.doc/numberStep.doc/CNumberStep.doc.md b/_cursor.ai/forms.doc/numberStep.doc/CNumberStep.doc.md
index 3ef361c..fa9e54f 100644
--- a/_cursor.ai/forms.doc/numberStep.doc/CNumberStep.doc.md
+++ b/_cursor.ai/forms.doc/numberStep.doc/CNumberStep.doc.md
@@ -16,7 +16,9 @@
- `placeholder` (String，可选)：输入框占位提示文本
- `range` (Array，可选)：取值范围，格式为 [最小值, 最大值]，默认为 [0, 100]
- `step` (Number，可选)：步长，即每次点击增减按钮改变的数值，默认为 1
-- `correct` (String，可选)：奇偶修正模式，可选值有 odd（奇数）、even（偶数），默认为空
+- `correct` (String，可选)：奇偶修正模式，默认为空
+ - `odd`：只允许选择奇数
+ - `even`：只允许选择偶数
- `unit` (String，可选)：数值单位，显示在数字输入框右侧
## 使用示例
diff --git a/_cursor.ai/forms.doc/select.doc/CSelect.doc.md b/_cursor.ai/forms.doc/select.doc/CSelect.doc.md
index 42ab6cf..8a44b3e 100644
--- a/_cursor.ai/forms.doc/select.doc/CSelect.doc.md
+++ b/_cursor.ai/forms.doc/select.doc/CSelect.doc.md
@@ -16,7 +16,9 @@
- `options` (Array，必填)：选择菜单选项数组，每个选项应包含 name 和 value/id 属性
- `placeholder` (String，可选)：输入框占位提示文本
- `readOnly` (Boolean，可选)：只读模式，默认为 false
-- `selectByPage` (String，可选)：开启选择菜单跳转选择页面模式，值为 'on'
+- `selectByPage` (String，可选)：选择菜单模式
+ - 不设置：下拉选择模式
+ - `on`：跳转页面选择模式
- `onOpenSelectorPage` (Function，可选)：页面跳转模式下，发起选择的回调函数
## 使用示例
diff --git a/forms/checkbox/CCheckBox.vue b/forms/checkbox/CCheckBox.vue
index ef4718d..aa9c01a 100644
--- a/forms/checkbox/CCheckBox.vue
+++ b/forms/checkbox/CCheckBox.vue
@@ -1,5 +1,8 @@
/**
* CCheckBox
+ * 复选框组件，用于在表单中提供多选或单选功能
+ * 支持两种显示模式：直接显示模式和弹窗选择模式
+ * 支持两种选择类型：多选和单选
* @author Tevin
*/
@@ -142,9 +145,8 @@
return;
}
const selectedIndex = this.options.findIndex(
- opt => opt.value === item
+ opt => opt.value === item,
);
- console.log(item, selectedIndex);
if (selectedIndex < 0) {
return;
}
@@ -155,7 +157,7 @@
// 单选
else if (this.boxType === 'radio') {
const next = evt[evt.length - 1];
- const selectedIndex = this.options.find(opt => opt.value === item);
+ const selectedIndex = this.options.findIndex(opt => opt.value === next);
if (selectedIndex < 0) {
this.itemRes.onChange('');
} else {
diff --git a/forms/chinaArea/CChinaArea.vue b/forms/chinaArea/CChinaArea.vue
index d16511d..faadcf5 100644
--- a/forms/chinaArea/CChinaArea.vue
+++ b/forms/chinaArea/CChinaArea.vue
@@ -1,5 +1,8 @@
/**
* CChinaArea - 表单项，中国地址三级联动
+ * 中国地区选择器组件，用于在表单中选择省市区地址
+ * 内置完整的中国行政区划数据，支持多级联动选择
+ * 支持自动通过地理定位获取省市区
* @author Tevin
*/
diff --git a/forms/datePicker/CDatePicker.vue b/forms/datePicker/CDatePicker.vue
index 34bdb00..dd2c173 100644
--- a/forms/datePicker/CDatePicker.vue
+++ b/forms/datePicker/CDatePicker.vue
@@ -1,5 +1,8 @@
/**
* CDatePicker - 选择日期范围操作
+ * 日期选择组件，用于在表单中选择日期或日期范围
+ * 支持三种选择模式：日期选择、日期时间选择和日期范围选择
+ * 可限制日期选择范围，支持清除功能和只读模式
* @author Tevin
*/
diff --git a/forms/form/CForm.vue b/forms/form/CForm.vue
index 944feef..7245951 100644
--- a/forms/form/CForm.vue
+++ b/forms/form/CForm.vue
@@ -1,5 +1,8 @@
/**
* CForm - 表单套装组件，套件的主体
+ * 表单容器组件，用于管理表单数据、处理表单验证和提交
+ * 支持自动滚动到错误位置，提供表单项变化回调和表单完成回调
+ * 提供手动提交、预验证和错误设置等功能
* @author Tevin
*/
@@ -142,7 +145,7 @@
Object.keys(errors).forEach(errorKey => {
if (typeof this.validators[errorKey] !== 'undefined') {
checklist.push(
- this.validators[errorKey]('setError', errors[errorKey])
+ this.validators[errorKey]('setError', errors[errorKey]),
);
} else {
unchecks.push(errors[errorKey]);
diff --git a/forms/imagePicker/CImagePicker.vue b/forms/imagePicker/CImagePicker.vue
index e255fec..cdc08dc 100644
--- a/forms/imagePicker/CImagePicker.vue
+++ b/forms/imagePicker/CImagePicker.vue
@@ -1,5 +1,8 @@
/**
* CImagePicker
+ * 图片选择器组件，用于在表单中上传和管理图片
+ * 支持单张和多张图片上传，并提供压缩、预览等功能
+ * 可限制上传图片的数量和来源（相册/相机）
* @author Tevin
*/
diff --git a/forms/input/CInput.vue b/forms/input/CInput.vue
index ef6e805..d20866e 100644
--- a/forms/input/CInput.vue
+++ b/forms/input/CInput.vue
@@ -1,5 +1,7 @@
/**
* CInput - 表单项，文本输入框
+ * 用于在表单中收集用户的文本输入
+ * 支持多种输入类型，可以设置占位提示文本，并且支持显示单位标识
* @author Tevin
*/
diff --git a/forms/numberStep/CNumberStep.vue b/forms/numberStep/CNumberStep.vue
index b9ec157..b8b607c 100644
--- a/forms/numberStep/CNumberStep.vue
+++ b/forms/numberStep/CNumberStep.vue
@@ -1,5 +1,7 @@
/**
* CNumberStep
+ * 数字步进器组件，用于在表单中输入数字并通过步进按钮增减数值
+ * 支持设置数值范围、步长、奇偶修正和单位显示
* @author Tevin
*/
diff --git a/forms/numberValve/CNumberValve.vue b/forms/numberValve/CNumberValve.vue
index f642855..777778b 100644
--- a/forms/numberValve/CNumberValve.vue
+++ b/forms/numberValve/CNumberValve.vue
@@ -1,5 +1,8 @@
/**
* CNumberValve
+ * 数值滑块组件，用于在表单中通过滑块选择数值
+ * 提供了滑动条和增减按钮两种方式来调整数值
+ * 支持设置数值范围、步长和单位显示
* @author Tevin
*/
@@ -210,7 +213,7 @@
currentNext = Math.min(currentNext, this.range[1]);
// 设置
const sliderLeft = Math.round(
- ((currentNext - this.range[0]) / (this.range[1] - this.range[0])) * 100
+ ((currentNext - this.range[0]) / (this.range[1] - this.range[0])) * 100,
);
this.sliderLeft = sliderLeft;
this.current = currentNext;
diff --git a/forms/select/CSelect.vue b/forms/select/CSelect.vue
index 5183bb9..aae68bb 100644
--- a/forms/select/CSelect.vue
+++ b/forms/select/CSelect.vue
@@ -1,5 +1,8 @@
/**
* CSelect
+ * 下拉选择组件，用于在表单中提供选项选择功能
+ * 支持两种选择模式：下拉选择模式和跳转页面选择模式
+ * 可配置为只读模式，并支持自定义占位文本
* @author Tevin
*/
diff --git a/forms/switch/CSwitch.vue b/forms/switch/CSwitch.vue
index 9d459d9..6917985 100644
--- a/forms/switch/CSwitch.vue
+++ b/forms/switch/CSwitch.vue
@@ -1,5 +1,8 @@
/**
* CSwitch
+ * 开关组件，用于在表单中提供开关选择功能
+ * 基于 AtSwitch 封装，支持只读模式
+ * 能够显示必填和错误状态
* @author Tevin
*/
diff --git a/forms/textarea/CTextArea.vue b/forms/textarea/CTextArea.vue
index b6aec4b..a72589e 100644
--- a/forms/textarea/CTextArea.vue
+++ b/forms/textarea/CTextArea.vue
@@ -1,5 +1,8 @@
/**
* CTextArea
+ * 多行文本输入组件，用于在表单中收集用户的多行文本输入
+ * 支持设置输入区域高度，可以通过行数或像素值来控制
+ * 支持只读模式和自动增高功能
* @author Tevin
*/
--
Gitblit v1.9.1