sard-uniapp 1.24.0 → 1.24.1

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.
Files changed (50) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/components/checkbox-input/checkbox-input.d.ts +1 -0
  3. package/components/checkbox-input/checkbox-input.vue +3 -0
  4. package/components/checkbox-input/common.d.ts +1 -0
  5. package/components/checkbox-popout/README.md +11 -10
  6. package/components/checkbox-popout/checkbox-popout.d.ts +1 -0
  7. package/components/checkbox-popout/checkbox-popout.vue +11 -1
  8. package/components/checkbox-popout/common.d.ts +2 -0
  9. package/components/config/index.d.ts +4 -0
  10. package/components/config/index.js +3 -0
  11. package/components/form/README.md +38 -36
  12. package/components/form/common.d.ts +3 -0
  13. package/components/form/form.d.ts +1 -0
  14. package/components/form/form.vue +2 -0
  15. package/components/form/useForm.js +1 -0
  16. package/components/form-item/form-item.vue +12 -3
  17. package/components/form-item/index.scss +4 -2
  18. package/components/form-item/useFormItem.d.ts +1 -0
  19. package/components/form-item/useFormItem.js +2 -0
  20. package/components/form-item-plain/form-item-plain.vue +2 -0
  21. package/components/form-plain/form-plain.d.ts +1 -0
  22. package/components/form-plain/form-plain.vue +2 -0
  23. package/components/input/README.md +48 -47
  24. package/components/input/input.vue +1 -0
  25. package/components/keyboard/README.md +12 -11
  26. package/components/keyboard/common.d.ts +1 -0
  27. package/components/keyboard/index.d.ts +1 -1
  28. package/components/keyboard/keyboard.d.ts +2 -0
  29. package/components/keyboard/keyboard.vue +20 -12
  30. package/components/locale/lang/ar-SA.d.ts +124 -0
  31. package/components/locale/lang/ar-SA.js +124 -0
  32. package/components/popout-input/index.scss +5 -0
  33. package/components/popout-input/popout-input.vue +11 -2
  34. package/components/popout-input/variables.scss +1 -0
  35. package/components/radio-input/common.d.ts +1 -0
  36. package/components/radio-input/radio-input.d.ts +1 -0
  37. package/components/radio-input/radio-input.vue +3 -0
  38. package/components/radio-popout/README.md +10 -9
  39. package/components/radio-popout/common.d.ts +2 -0
  40. package/components/radio-popout/radio-popout.d.ts +1 -0
  41. package/components/radio-popout/radio-popout.vue +10 -1
  42. package/components/rate/index.scss +2 -3
  43. package/components/stepper/index.scss +2 -3
  44. package/components/switch/index.scss +8 -4
  45. package/components/tree/README.md +1 -0
  46. package/components/tree/common.d.ts +5 -0
  47. package/components/tree/tree.d.ts +8 -0
  48. package/components/tree/tree.vue +11 -3
  49. package/components/tree-node/tree-node.vue +2 -1
  50. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,16 @@
1
+ ## [1.24.1](https://github.com/sutras/sard-uniapp/compare/v1.24.0...v1.24.1) (2025-08-31)
2
+
3
+
4
+ ### Features
5
+
6
+ * **form:** 新增content-position属性 ([b588249](https://github.com/sutras/sard-uniapp/commit/b5882493653491d6a03f0b04f898b6b9c31a06c5))
7
+ * **keyboard:** 为车牌键盘模式添加双向绑定支持 ([740f7bf](https://github.com/sutras/sard-uniapp/commit/740f7bf074658d845d49ad5582663af639757260))
8
+ * **tree:** 新增node-click事件 ([a70e5d7](https://github.com/sutras/sard-uniapp/commit/a70e5d786305e580cbac7eb8c897ed79cff54059))
9
+ * 新增checkbox-popout和radio-popout新增icon-position属性 ([32f458a](https://github.com/sutras/sard-uniapp/commit/32f458aa46ceebdb4ed46f51733f3749e60461a0))
10
+ * 新增阿拉伯语支持 ([b0b2c60](https://github.com/sutras/sard-uniapp/commit/b0b2c6050bad21f476e767659c8ac6802bfcadb6))
11
+
12
+
13
+
1
14
  # [1.24.0](https://github.com/sutras/sard-uniapp/compare/v1.23.5...v1.24.0) (2025-08-24)
2
15
 
3
16
 
@@ -9,6 +9,7 @@ declare const __VLS_component: import("vue").DefineComponent<CheckboxInputProps,
9
9
  }>, {
10
10
  options: import("../checkbox/common").CheckboxGroupOption[];
11
11
  valueOnClear: () => any;
12
+ iconPosition: "left" | "right";
12
13
  validateEvent: boolean;
13
14
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
14
15
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
@@ -34,6 +34,7 @@
34
34
  :searchable="searchable"
35
35
  :filter-placeholder="filterPlaceholder"
36
36
  :resettable="resettable"
37
+ :icon-position="iconPosition"
37
38
  @change="onChange"
38
39
  @visible-hook="onVisibleHook"
39
40
  @confirm="onConfirm"
@@ -74,6 +75,7 @@ import { usePopoutInput } from "../../use";
74
75
  * @property {boolean} searchable 是否可搜索,默认值:false。
75
76
  * @property {string} filterPlaceholder 搜索输入框占位符内容,默认值:-。
76
77
  * @property {boolean} resettable 关闭弹出框后,是否可复位弹出框值,默认值:false。
78
+ * @property {'left' | 'right'} iconPosition 可定义复选框的位置,默认值:'left'。
77
79
  * @property {boolean} clearable 是否显示清空按钮,默认值:false。
78
80
  * @property {string} placeholder 输入框占位符内容,默认值:-。
79
81
  * @property {() => any} valueOnClear 设置点击清除按钮后的值,默认值:() => undefined。
@@ -115,6 +117,7 @@ export default _defineComponent({
115
117
  searchable: { type: Boolean, required: false },
116
118
  filterPlaceholder: { type: String, required: false },
117
119
  resettable: { type: Boolean, required: false },
120
+ iconPosition: { type: String, required: false },
118
121
  rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
119
122
  rootClass: { type: String, required: false },
120
123
  modelValue: { type: Array, required: false },
@@ -9,6 +9,7 @@ export declare const defaultCheckboxInputProps: () => {
9
9
  valueOnClear: CheckboxInputProps["valueOnClear"];
10
10
  options: () => never[];
11
11
  validateEvent: boolean;
12
+ iconPosition: CheckboxPopoutProps["iconPosition"];
12
13
  };
13
14
  export interface CheckboxInputSlots extends PopoutInputSlots {
14
15
  }
@@ -48,16 +48,17 @@ import CheckboxPopout from 'sard-uniapp/components/checkbox-popout/checkbox-popo
48
48
 
49
49
  继承 [`CheckboxGroupProps`](./checkbox#CheckboxGroupProps) 并有以下额外属性:
50
50
 
51
- | 属性 | 描述 | 类型 | 默认值 |
52
- | ----------------------------------- | -------------------------------- | ---------- | ------ |
53
- | popout-class | 弹窗框根元素类名 | string | - |
54
- | popout-style | 弹窗框根元素样式 | StyleValue | - |
55
- | visible (v-model) | 是否显示弹出框 | boolean | - |
56
- | title | 弹出框标题 | string | - |
57
- | show-check-all <sup>1.20+</sup> | 是否显示全选 | boolean | false |
58
- | searchable <sup>1.20+</sup> | 是否可搜索 | boolean | false |
59
- | filter-placeholder <sup>1.20+</sup> | 搜索输入框占位符内容 | string | - |
60
- | resettable <sup>1.23.3+</sup> | 关闭弹出框后,是否可复位弹出框值 | boolean | false |
51
+ | 属性 | 描述 | 类型 | 默认值 |
52
+ | ----------------------------------- | -------------------------------- | ----------------- | ------ |
53
+ | popout-class | 弹窗框根元素类名 | string | - |
54
+ | popout-style | 弹窗框根元素样式 | StyleValue | - |
55
+ | visible (v-model) | 是否显示弹出框 | boolean | - |
56
+ | title | 弹出框标题 | string | - |
57
+ | show-check-all <sup>1.20+</sup> | 是否显示全选 | boolean | false |
58
+ | searchable <sup>1.20+</sup> | 是否可搜索 | boolean | false |
59
+ | filter-placeholder <sup>1.20+</sup> | 搜索输入框占位符内容 | string | - |
60
+ | resettable <sup>1.23.3+</sup> | 关闭弹出框后,是否可复位弹出框值 | boolean | false |
61
+ | icon-position <sup>1.24.1+</sup> | 可定义复选框的位置 | 'left' \| 'right' | 'left' |
61
62
 
62
63
  ### CheckboxPopoutEmits
63
64
 
@@ -8,6 +8,7 @@ declare const __VLS_component: import("vue").DefineComponent<CheckboxPopoutProps
8
8
  [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
9
9
  }>, {
10
10
  options: import("../checkbox/common").CheckboxGroupOption[];
11
+ iconPosition: "left" | "right";
11
12
  validateEvent: boolean;
12
13
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
13
14
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
@@ -61,7 +61,15 @@
61
61
  :hover="!option.disabled"
62
62
  @click="select(option, toggle)"
63
63
  >
64
- <template #icon>
64
+ <template v-if="iconPosition === 'left'" #icon>
65
+ <sar-checkbox
66
+ readonly
67
+ :disabled="option.disabled"
68
+ :value="option.value"
69
+ :validate-event="false"
70
+ />
71
+ </template>
72
+ <template v-if="iconPosition === 'right'" #value>
65
73
  <sar-checkbox
66
74
  readonly
67
75
  :disabled="option.disabled"
@@ -116,6 +124,7 @@ import { defaultOptionKeys } from "../checkbox/common";
116
124
  * @property {boolean} searchable 是否可搜索,默认值:false。
117
125
  * @property {string} filterPlaceholder 搜索输入框占位符内容,默认值:-。
118
126
  * @property {boolean} resettable 关闭弹出框后,是否可复位弹出框值,默认值:false。
127
+ * @property {'left' | 'right'} iconPosition 可定义复选框的位置,默认值:'left'。
119
128
  * @event {(visible: boolean) => void} update 弹出框显隐时触发
120
129
  * @event {(value: any[] | undefined) => void} change 复选输入组件值改变时触发
121
130
  * @event {() => void} confirm 点击确定按钮时触发
@@ -155,6 +164,7 @@ export default _defineComponent({
155
164
  searchable: { type: Boolean, required: false },
156
165
  filterPlaceholder: { type: String, required: false },
157
166
  resettable: { type: Boolean, required: false },
167
+ iconPosition: { type: String, required: false },
158
168
  rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
159
169
  rootClass: { type: String, required: false },
160
170
  modelValue: { type: Array, required: false },
@@ -10,10 +10,12 @@ export interface CheckboxPopoutProps extends CheckboxGroupProps {
10
10
  searchable?: boolean;
11
11
  filterPlaceholder?: string;
12
12
  resettable?: boolean;
13
+ iconPosition?: 'left' | 'right';
13
14
  }
14
15
  export declare const defaultCheckboxPopoutProps: () => {
15
16
  options: () => never[];
16
17
  validateEvent: boolean;
18
+ iconPosition: CheckboxPopoutProps["iconPosition"];
17
19
  };
18
20
  export interface CheckboxPopoutSlots {
19
21
  default?(props: Record<string, never>): any;
@@ -5,6 +5,7 @@ import { type CalendarInputProps } from '../calendar-input';
5
5
  import { type CalendarProps } from '../calendar';
6
6
  import { type CascaderInputProps } from '../cascader-input';
7
7
  import { type CheckboxGroupProps } from '../checkbox';
8
+ import { type CheckboxPopoutProps } from '../checkbox-popout';
8
9
  import { type CheckboxInputProps } from '../checkbox-input';
9
10
  import { type CoolIconProps } from '../cool-icon';
10
11
  import { type DatetimePickerInputProps } from '../datetime-picker-input';
@@ -127,6 +128,7 @@ export declare const defaultConfig: {
127
128
  };
128
129
  checkboxPopout: {
129
130
  validateEvent: boolean;
131
+ iconPosition: CheckboxPopoutProps["iconPosition"];
130
132
  };
131
133
  coolIcon: {
132
134
  shape: CoolIconProps["shape"];
@@ -218,6 +220,7 @@ export declare const defaultConfig: {
218
220
  labelAlign: FormProps["labelAlign"];
219
221
  labelValign: FormProps["labelValign"];
220
222
  starPosition: FormProps["starPosition"];
223
+ contentPosition: FormProps["contentPosition"];
221
224
  showError: boolean;
222
225
  scrollDuration: number;
223
226
  };
@@ -368,6 +371,7 @@ export declare const defaultConfig: {
368
371
  radioPopout: {
369
372
  validateEvent: boolean;
370
373
  type: RadioPopoutProps["type"];
374
+ iconPosition: RadioPopoutProps["iconPosition"];
371
375
  };
372
376
  rate: {
373
377
  count: number;
@@ -78,6 +78,7 @@ export const defaultConfig = {
78
78
  },
79
79
  checkboxPopout: {
80
80
  validateEvent: true,
81
+ iconPosition: 'left',
81
82
  },
82
83
  coolIcon: {
83
84
  shape: 'oval',
@@ -169,6 +170,7 @@ export const defaultConfig = {
169
170
  labelAlign: 'start',
170
171
  labelValign: 'center',
171
172
  starPosition: 'left',
173
+ contentPosition: 'left',
172
174
  showError: true,
173
175
  scrollDuration: 150,
174
176
  },
@@ -319,6 +321,7 @@ export const defaultConfig = {
319
321
  radioPopout: {
320
322
  validateEvent: true,
321
323
  type: 'circle',
324
+ iconPosition: 'left',
322
325
  },
323
326
  rate: {
324
327
  count: 5,
@@ -176,25 +176,26 @@ import FormItemPlain from 'sard-uniapp/components/form-item-plain/form-item-plai
176
176
 
177
177
  ### FormProps
178
178
 
179
- | 属性 | 描述 | 类型 | 默认值 |
180
- | ------------------------ | ---------------------------------------------------------------------------------- | -------------------------------------------------------------------- | --------------------------------------------------- |
181
- | root-class | 组件根元素类名 | string | - |
182
- | root-style | 组件根元素样式 | StyleValue | - |
183
- | model | 表单数据对象 | Record\<string, any> | - |
184
- | rules | 表单验证规则 | FormRules | - |
185
- | validate-trigger | 设置字段校验的时机 | TriggerType | change |
186
- | validate-on-rule-change | 是否在 `rules` 属性改变后立即触发一次验证 | boolean | true |
187
- | direction | 表单排列方向 | 'horizontal' \| 'vertical' | 'horizontal' |
188
- | label-width | 标签宽度 | string | - |
189
- | label-align | 标签水平对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
190
- | label-valign | 标签垂直对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
191
- | star-position | 必填星号在标签的左边或右边 | 'left' \| 'right' | 'left' |
192
- | hide-star | 是否隐藏必填时的星号 | boolean | false |
193
- | show-error | 是否显示校验错误信息 | boolean | true |
194
- | scroll-to-first-error | 当校验失败时,滚动到第一个错误表单项 | boolean | false |
195
- | scroll-into-view-options | 自定义滚动配置选项 | [ScrollIntoViewOptions](../utilities/geometry#ScrollIntoViewOptions) | {position: 'nearest', startOffset: 0, endOffset: 0} |
196
- | disabled | 是否禁用该表单内的所有组件。 如果设置为 `true`, 它将覆盖内部组件的 `disabled` 属性 | boolean | false |
197
- | readonly | 是否只读该表单内的所有组件。 如果设置为 `true`, 它将覆盖内部组件的 `readonly` 属性 | boolean | false |
179
+ | 属性 | 描述 | 类型 | 默认值 |
180
+ | ----------------------------------- | ---------------------------------------------------------------------------------- | -------------------------------------------------------------------- | --------------------------------------------------- |
181
+ | root-class | 组件根元素类名 | string | - |
182
+ | root-style | 组件根元素样式 | StyleValue | - |
183
+ | model | 表单数据对象 | Record\<string, any> | - |
184
+ | rules | 表单验证规则 | FormRules | - |
185
+ | validate-trigger | 设置字段校验的时机 | TriggerType | change |
186
+ | validate-on-rule-change | 是否在 `rules` 属性改变后立即触发一次验证 | boolean | true |
187
+ | direction | 表单排列方向 | 'horizontal' \| 'vertical' | 'horizontal' |
188
+ | label-width | 标签宽度 | string | - |
189
+ | label-align | 标签水平对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
190
+ | label-valign | 标签垂直对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
191
+ | star-position | 必填星号在标签的左边或右边 | 'left' \| 'right' | 'left' |
192
+ | hide-star | 是否隐藏必填时的星号 | boolean | false |
193
+ | content-position <sup>1.24.1+</sup> | 内容位置 | 'left' \| 'right' | 'left' |
194
+ | show-error | 是否显示校验错误信息 | boolean | true |
195
+ | scroll-to-first-error | 当校验失败时,滚动到第一个错误表单项 | boolean | false |
196
+ | scroll-into-view-options | 自定义滚动配置选项 | [ScrollIntoViewOptions](../utilities/geometry#ScrollIntoViewOptions) | {position: 'nearest', startOffset: 0, endOffset: 0} |
197
+ | disabled | 是否禁用该表单内的所有组件。 如果设置为 `true`, 它将覆盖内部组件的 `disabled` 属性 | boolean | false |
198
+ | readonly | 是否只读该表单内的所有组件。 如果设置为 `true`, 它将覆盖内部组件的 `readonly` 属性 | boolean | false |
198
199
 
199
200
  ### FormSlots
200
201
 
@@ -213,23 +214,24 @@ import FormItemPlain from 'sard-uniapp/components/form-item-plain/form-item-plai
213
214
 
214
215
  ### FormItemProps
215
216
 
216
- | 属性 | 描述 | 类型 | 默认值 |
217
- | ---------------- | -------------------------------------------------------------------------------------- | ---------------------------- | ------------ |
218
- | root-class | 组件根元素类名 | string | - |
219
- | root-style | 组件根元素样式 | StyleValue | - |
220
- | direction | 表单排列方向 | 'horizontal' \| 'vertical' | 'horizontal' |
221
- | label-width | 标签宽度 | string | - |
222
- | label-align | 标签水平对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
223
- | label-valign | 标签垂直对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
224
- | star-position | 必填星号在标签的左边或右边 | 'left' \| 'right' | 'left' |
225
- | label | 标签文本 | string | - |
226
- | required | 是否为必填项,如不设置,则会根据校验规则确认 | boolean | - |
227
- | name | 表单域 `model` 字段,在使用 `validate、reset` 方法的情况下,该属性是必填的。 | FieldName | - |
228
- | rules | 表单验证规则 | Rule \| Rule[] | - |
229
- | validate-trigger | 设置字段校验的时机 | TriggerType | change |
230
- | error | 表单域验证错误时的提示信息。设置该值会导致表单验证状态变为 `error`,并显示该错误信息。 | string | - |
231
- | show-error | 是否显示校验错误信息 | boolean | true |
232
- | inlaid | 去掉边框和内边距,用于嵌入到其他组件中 | boolean | false |
217
+ | 属性 | 描述 | 类型 | 默认值 |
218
+ | ----------------------------------- | -------------------------------------------------------------------------------------- | ---------------------------- | ------------ |
219
+ | root-class | 组件根元素类名 | string | - |
220
+ | root-style | 组件根元素样式 | StyleValue | - |
221
+ | direction | 表单排列方向 | 'horizontal' \| 'vertical' | 'horizontal' |
222
+ | label-width | 标签宽度 | string | - |
223
+ | label-align | 标签水平对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
224
+ | label-valign | 标签垂直对齐方式 | 'start' \| 'center' \| 'end' | 'start' |
225
+ | star-position | 必填星号在标签的左边或右边 | 'left' \| 'right' | 'left' |
226
+ | content-position <sup>1.24.1+</sup> | 内容位置 | 'left' \| 'right' | 'left' |
227
+ | label | 标签文本 | string | - |
228
+ | required | 是否为必填项,如不设置,则会根据校验规则确认 | boolean | - |
229
+ | name | 表单域 `model` 字段,在使用 `validate、reset` 方法的情况下,该属性是必填的。 | FieldName | - |
230
+ | rules | 表单验证规则 | Rule \| Rule[] | - |
231
+ | validate-trigger | 设置字段校验的时机 | TriggerType | change |
232
+ | error | 表单域验证错误时的提示信息。设置该值会导致表单验证状态变为 `error`,并显示该错误信息。 | string | - |
233
+ | show-error | 是否显示校验错误信息 | boolean | true |
234
+ | inlaid | 去掉边框和内边距,用于嵌入到其他组件中 | boolean | false |
233
235
 
234
236
  ### FormItemSlots
235
237
 
@@ -25,6 +25,7 @@ export interface FormProps {
25
25
  labelAlign?: 'start' | 'center' | 'end';
26
26
  labelValign?: 'start' | 'center' | 'end';
27
27
  starPosition?: 'left' | 'right';
28
+ contentPosition?: 'left' | 'right';
28
29
  hideStar?: boolean;
29
30
  showError?: boolean;
30
31
  scrollToFirstError?: boolean;
@@ -54,6 +55,7 @@ export interface FormItemProps {
54
55
  starPosition?: 'left' | 'right';
55
56
  label?: string;
56
57
  hideStar?: boolean;
58
+ contentPosition?: 'left' | 'right';
57
59
  required?: boolean | undefined;
58
60
  name?: FieldName;
59
61
  rules?: Rule | Rule[];
@@ -94,6 +96,7 @@ export interface FormContext {
94
96
  labelAlign: FormProps['labelAlign'];
95
97
  labelValign: FormProps['labelValign'];
96
98
  starPosition: FormProps['starPosition'];
99
+ contentPosition: FormProps['contentPosition'];
97
100
  hideStar: FormProps['hideStar'];
98
101
  showError: FormProps['showError'];
99
102
  scrollIntoViewOptions: FormProps['scrollIntoViewOptions'];
@@ -10,6 +10,7 @@ declare const __VLS_component: import("vue").DefineComponent<FormProps, {
10
10
  labelAlign: "start" | "center" | "end";
11
11
  labelValign: "start" | "center" | "end";
12
12
  starPosition: "left" | "right";
13
+ contentPosition: "left" | "right";
13
14
  validateOnRuleChange: boolean;
14
15
  showError: boolean;
15
16
  scrollDuration: number;
@@ -25,6 +25,7 @@ import { useForm } from "./useForm";
25
25
  * @property {'start' | 'center' | 'end'} labelValign 标签垂直对齐方式,默认值:'start'。
26
26
  * @property {'left' | 'right'} starPosition 必填星号在标签的左边或右边,默认值:'left'。
27
27
  * @property {boolean} hideStar 是否隐藏必填时的星号,默认值:false。
28
+ * @property {'left' | 'right'} contentPosition 内容位置,默认值:'left'。
28
29
  * @property {boolean} showError 是否显示校验错误信息,默认值:true。
29
30
  * @property {boolean} scrollToFirstError 当校验失败时,滚动到第一个错误表单项,默认值:false。
30
31
  * @property {[ScrollIntoViewOptions](../utilities/geometry#ScrollIntoViewOptions)} scrollIntoViewOptions 自定义滚动配置选项,默认值:{position: 'nearest', startOffset: 0, endOffset: 0}。
@@ -51,6 +52,7 @@ export default _defineComponent({
51
52
  labelAlign: { type: String, required: false },
52
53
  labelValign: { type: String, required: false },
53
54
  starPosition: { type: String, required: false },
55
+ contentPosition: { type: String, required: false },
54
56
  hideStar: { type: Boolean, required: false },
55
57
  showError: { type: Boolean, required: false },
56
58
  scrollToFirstError: { type: Boolean, required: false },
@@ -75,6 +75,7 @@ export function useForm(props) {
75
75
  labelAlign: toRef(() => props.labelAlign),
76
76
  labelValign: toRef(() => props.labelValign),
77
77
  starPosition: toRef(() => props.starPosition),
78
+ contentPosition: toRef(() => props.contentPosition),
78
79
  hideStar: toRef(() => props.hideStar),
79
80
  showError: toRef(() => props.showError),
80
81
  scrollIntoViewOptions: toRef(() => props.scrollIntoViewOptions),
@@ -8,7 +8,7 @@
8
8
  <view v-if="shouldShowStar" :class="bem.e('star')">*</view>
9
9
  <slot name="label">{{ label }}</slot>
10
10
  </view>
11
- <view :class="bem.e('content')">
11
+ <view :class="contentClass">
12
12
  <slot></slot>
13
13
  <slot name="validate" :state="validateState"></slot>
14
14
  <slot
@@ -40,6 +40,7 @@ import { useFormItem } from "./useFormItem";
40
40
  * @property {'start' | 'center' | 'end'} labelAlign 标签水平对齐方式,默认值:'start'。
41
41
  * @property {'start' | 'center' | 'end'} labelValign 标签垂直对齐方式,默认值:'start'。
42
42
  * @property {'left' | 'right'} starPosition 必填星号在标签的左边或右边,默认值:'left'。
43
+ * @property {'left' | 'right'} contentPosition 内容位置,默认值:'left'。
43
44
  * @property {string} label 标签文本,默认值:-。
44
45
  * @property {boolean} required 是否为必填项,如不设置,则会根据校验规则确认,默认值:-。
45
46
  * @property {FieldName} name 表单域 `model` 字段,在使用 `validate、reset` 方法的情况下,该属性是必填的。,默认值:-。
@@ -67,6 +68,7 @@ export default _defineComponent({
67
68
  starPosition: { type: String, required: false },
68
69
  label: { type: String, required: false },
69
70
  hideStar: { type: Boolean, required: false },
71
+ contentPosition: { type: String, required: false },
70
72
  required: { type: Boolean, required: false, skipCheck: true },
71
73
  name: { type: [String, Number, Array], required: false },
72
74
  rules: { type: [Object, Array], required: false },
@@ -89,7 +91,8 @@ export default _defineComponent({
89
91
  labelAlign,
90
92
  labelValign,
91
93
  starPosition,
92
- labelWidth
94
+ labelWidth,
95
+ contentPosition
93
96
  } = useFormItem(props);
94
97
  __expose(expose);
95
98
  const formItemClass = computed(() => {
@@ -112,7 +115,13 @@ export default _defineComponent({
112
115
  width: direction.value === "horizontal" && labelWidth.value
113
116
  });
114
117
  });
115
- const __returned__ = { props, bem, expose, fieldId, validateState, shouldShowStar, validateMessage, shouldShowError, direction, labelAlign, labelValign, starPosition, labelWidth, formItemClass, formItemStyle, labelStyle, get isNullish() {
118
+ const contentClass = computed(() => {
119
+ return classNames(
120
+ bem.e("content"),
121
+ bem.em("content", "right", contentPosition.value === "right")
122
+ );
123
+ });
124
+ const __returned__ = { props, bem, expose, fieldId, validateState, shouldShowStar, validateMessage, shouldShowError, direction, labelAlign, labelValign, starPosition, labelWidth, contentPosition, formItemClass, formItemStyle, labelStyle, contentClass, get isNullish() {
116
125
  return isNullish;
117
126
  } };
118
127
  return __returned__;
@@ -46,9 +46,11 @@
46
46
  }
47
47
 
48
48
  @include e(content) {
49
- @include universal;
50
- justify-content: center;
51
49
  flex: 1;
50
+
51
+ @include m('right') {
52
+ text-align: right;
53
+ }
52
54
  }
53
55
 
54
56
  @include e(error) {
@@ -18,4 +18,5 @@ export declare function useFormItem(props: FormItemProps): {
18
18
  labelValign: import("vue").ComputedRef<"start" | "center" | "end" | undefined>;
19
19
  starPosition: import("vue").ComputedRef<"left" | "right" | undefined>;
20
20
  labelWidth: import("vue").ComputedRef<string | undefined>;
21
+ contentPosition: import("vue").ComputedRef<"left" | "right" | undefined>;
21
22
  };
@@ -181,6 +181,7 @@ export function useFormItem(props) {
181
181
  const labelValign = computed(() => props.labelValign || formContext.labelValign);
182
182
  const starPosition = computed(() => props.starPosition || formContext.starPosition);
183
183
  const labelWidth = computed(() => props.labelWidth || formContext.labelWidth);
184
+ const contentPosition = computed(() => props.contentPosition ?? formContext.contentPosition);
184
185
  provide(formItemContextSymbol, context);
185
186
  const expose = {
186
187
  validate,
@@ -202,5 +203,6 @@ export function useFormItem(props) {
202
203
  labelValign,
203
204
  starPosition,
204
205
  labelWidth,
206
+ contentPosition,
205
207
  };
206
208
  }
@@ -29,6 +29,7 @@ import { defaultFormItemProps } from "../form/common";
29
29
  * @property {'start' | 'center' | 'end'} labelAlign 标签水平对齐方式,默认值:'start'。
30
30
  * @property {'start' | 'center' | 'end'} labelValign 标签垂直对齐方式,默认值:'start'。
31
31
  * @property {'left' | 'right'} starPosition 必填星号在标签的左边或右边,默认值:'left'。
32
+ * @property {'left' | 'right'} contentPosition 内容位置,默认值:'left'。
32
33
  * @property {string} label 标签文本,默认值:-。
33
34
  * @property {boolean} required 是否为必填项,如不设置,则会根据校验规则确认,默认值:-。
34
35
  * @property {FieldName} name 表单域 `model` 字段,在使用 `validate、reset` 方法的情况下,该属性是必填的。,默认值:-。
@@ -56,6 +57,7 @@ export default _defineComponent({
56
57
  starPosition: { type: String, required: false },
57
58
  label: { type: String, required: false },
58
59
  hideStar: { type: Boolean, required: false },
60
+ contentPosition: { type: String, required: false },
59
61
  required: { type: Boolean, required: false, skipCheck: true },
60
62
  name: { type: [String, Number, Array], required: false },
61
63
  rules: { type: [Object, Array], required: false },
@@ -10,6 +10,7 @@ declare const __VLS_component: import("vue").DefineComponent<FormPlainProps, {
10
10
  labelAlign: "start" | "center" | "end";
11
11
  labelValign: "start" | "center" | "end";
12
12
  starPosition: "left" | "right";
13
+ contentPosition: "left" | "right";
13
14
  validateOnRuleChange: boolean;
14
15
  showError: boolean;
15
16
  scrollDuration: number;
@@ -21,6 +21,7 @@ import { defaultFormProps } from "../form/common";
21
21
  * @property {'start' | 'center' | 'end'} labelValign 标签垂直对齐方式,默认值:'start'。
22
22
  * @property {'left' | 'right'} starPosition 必填星号在标签的左边或右边,默认值:'left'。
23
23
  * @property {boolean} hideStar 是否隐藏必填时的星号,默认值:false。
24
+ * @property {'left' | 'right'} contentPosition 内容位置,默认值:'left'。
24
25
  * @property {boolean} showError 是否显示校验错误信息,默认值:true。
25
26
  * @property {boolean} scrollToFirstError 当校验失败时,滚动到第一个错误表单项,默认值:false。
26
27
  * @property {[ScrollIntoViewOptions](../utilities/geometry#ScrollIntoViewOptions)} scrollIntoViewOptions 自定义滚动配置选项,默认值:{position: 'nearest', startOffset: 0, endOffset: 0}。
@@ -47,6 +48,7 @@ export default _defineComponent({
47
48
  labelAlign: { type: String, required: false },
48
49
  labelValign: { type: String, required: false },
49
50
  starPosition: { type: String, required: false },
51
+ contentPosition: { type: String, required: false },
50
52
  hideStar: { type: Boolean, required: false },
51
53
  showError: { type: Boolean, required: false },
52
54
  scrollToFirstError: { type: Boolean, required: false },