@a2simcode/ui 0.0.269 → 0.0.271

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 (371) hide show
  1. package/.cursor/skills/ui-component-helper/README.md +86 -86
  2. package/.cursor/skills/ui-component-helper/SKILL.md +115 -115
  3. package/LICENSE +53 -53
  4. package/README.md +156 -156
  5. package/dist/components/table/index.d.ts +15 -0
  6. package/dist/components/table/src/interface.d.ts +13 -0
  7. package/dist/components/table/src/table.vue.d.ts +16 -1
  8. package/dist/simcode-ui.es.js +4977 -4932
  9. package/dist/simcode-ui.umd.js +2 -2
  10. package/dist/stats.html +1 -1
  11. package/dist/ui.css +1 -1
  12. package/docs/components/autocomplete.md +89 -89
  13. package/docs/components/barcode.md +101 -101
  14. package/docs/components/button-select.md +24 -24
  15. package/docs/components/button.md +117 -117
  16. package/docs/components/buttons.md +119 -119
  17. package/docs/components/card-list.md +38 -38
  18. package/docs/components/cascader-select.md +114 -114
  19. package/docs/components/checkbox.md +114 -114
  20. package/docs/components/code-mirror.md +85 -85
  21. package/docs/components/collapse.md +26 -26
  22. package/docs/components/comp.md +91 -71
  23. package/docs/components/count-up.md +24 -24
  24. package/docs/components/count.md +24 -24
  25. package/docs/components/data-panel.md +24 -24
  26. package/docs/components/date.md +76 -76
  27. package/docs/components/dialog-full.md +112 -112
  28. package/docs/components/dialog.md +127 -127
  29. package/docs/components/divider.md +24 -24
  30. package/docs/components/drawer.md +127 -127
  31. package/docs/components/dynamic-layer.md +118 -118
  32. package/docs/components/echarts.md +72 -72
  33. package/docs/components/editor.md +24 -24
  34. package/docs/components/form.md +87 -87
  35. package/docs/components/guid.md +39 -39
  36. package/docs/components/hpanel.md +24 -24
  37. package/docs/components/icon.md +56 -56
  38. package/docs/components/input-button.md +24 -24
  39. package/docs/components/input-code.md +24 -24
  40. package/docs/components/input-color.md +114 -114
  41. package/docs/components/input-layer.md +56 -56
  42. package/docs/components/input-rows.md +370 -370
  43. package/docs/components/input-tag.md +50 -50
  44. package/docs/components/input.md +129 -129
  45. package/docs/components/layer-form.md +61 -61
  46. package/docs/components/layer.md +127 -127
  47. package/docs/components/layout.md +132 -132
  48. package/docs/components/map.md +24 -24
  49. package/docs/components/menu.md +121 -121
  50. package/docs/components/meta/button.ts +212 -212
  51. package/docs/components/meta/buttons.ts +76 -76
  52. package/docs/components/meta/card-list.ts +210 -210
  53. package/docs/components/meta/code-mirror.ts +108 -108
  54. package/docs/components/meta/comp.ts +236 -236
  55. package/docs/components/meta/date.ts +267 -267
  56. package/docs/components/meta/echarts.ts +64 -64
  57. package/docs/components/meta/form-item.ts +62 -62
  58. package/docs/components/meta/form.ts +181 -181
  59. package/docs/components/meta/input-button.ts +175 -175
  60. package/docs/components/meta/input-cards.ts +112 -112
  61. package/docs/components/meta/input-code.ts +161 -161
  62. package/docs/components/meta/input-color.ts +243 -243
  63. package/docs/components/meta/input-rows.ts +119 -119
  64. package/docs/components/meta/layer-form.ts +74 -74
  65. package/docs/components/meta/map.ts +68 -68
  66. package/docs/components/meta/panel.ts +152 -152
  67. package/docs/components/meta/radio.ts +55 -55
  68. package/docs/components/meta/select.ts +279 -279
  69. package/docs/components/meta/slider.ts +270 -270
  70. package/docs/components/meta/table-panel.ts +326 -326
  71. package/docs/components/meta/table.ts +489 -427
  72. package/docs/components/meta/tabs.ts +146 -146
  73. package/docs/components/meta/title.ts +91 -91
  74. package/docs/components/meta/tree-select.ts +199 -199
  75. package/docs/components/meta/tree.ts +225 -225
  76. package/docs/components/meta/vpanel.ts +19 -19
  77. package/docs/components/meta/workflow-viewer.ts +55 -55
  78. package/docs/components/number.md +124 -124
  79. package/docs/components/page.md +102 -102
  80. package/docs/components/panel.md +37 -37
  81. package/docs/components/radio.md +87 -87
  82. package/docs/components/rate.md +71 -71
  83. package/docs/components/select.md +133 -133
  84. package/docs/components/slider-captcha.md +41 -41
  85. package/docs/components/slider.md +101 -101
  86. package/docs/components/switch.md +90 -90
  87. package/docs/components/table-panel.md +312 -312
  88. package/docs/components/table.md +510 -495
  89. package/docs/components/tabs.md +26 -26
  90. package/docs/components/title.md +24 -24
  91. package/docs/components/tree.md +222 -222
  92. package/docs/components/upload.md +117 -117
  93. package/docs/components/workflow-viewer.md +21 -21
  94. package/docs/components/workflow.md +21 -21
  95. package/docs/examples/autocomplete/advanced.vue +35 -35
  96. package/docs/examples/autocomplete/basic.vue +32 -32
  97. package/docs/examples/autocomplete/clearable.vue +33 -33
  98. package/docs/examples/autocomplete/custom-template.vue +49 -49
  99. package/docs/examples/autocomplete/disabled.vue +33 -33
  100. package/docs/examples/autocomplete/icon.vue +37 -37
  101. package/docs/examples/barcode/all-types.vue +380 -380
  102. package/docs/examples/barcode/basic.vue +14 -14
  103. package/docs/examples/barcode/props-appearance.vue +243 -243
  104. package/docs/examples/barcode/props-geometry.vue +143 -143
  105. package/docs/examples/barcode/props-logic.vue +216 -216
  106. package/docs/examples/barcode/props-symbology.vue +199 -199
  107. package/docs/examples/barcode/props-text.vue +268 -268
  108. package/docs/examples/button/basic.vue +7 -7
  109. package/docs/examples/button/disabled.vue +42 -42
  110. package/docs/examples/button/loading.vue +6 -6
  111. package/docs/examples/button/shape.vue +7 -7
  112. package/docs/examples/button/size.vue +14 -14
  113. package/docs/examples/button/status.vue +34 -34
  114. package/docs/examples/button/type.vue +10 -10
  115. package/docs/examples/button-select/basic.vue +19 -19
  116. package/docs/examples/buttons/basic.vue +62 -62
  117. package/docs/examples/buttons/disabled.vue +36 -36
  118. package/docs/examples/buttons/dropdown.vue +63 -63
  119. package/docs/examples/buttons/group.vue +52 -52
  120. package/docs/examples/buttons/link.vue +47 -47
  121. package/docs/examples/buttons/popup.vue +39 -39
  122. package/docs/examples/buttons/size.vue +45 -45
  123. package/docs/examples/card-list/basic.vue +70 -70
  124. package/docs/examples/card-list/selection-pagination.vue +69 -69
  125. package/docs/examples/cascader-select/basic.vue +28 -28
  126. package/docs/examples/cascader-select/clearable.vue +34 -34
  127. package/docs/examples/cascader-select/disabled.vue +43 -43
  128. package/docs/examples/cascader-select/filterable.vue +37 -37
  129. package/docs/examples/cascader-select/methods.vue +84 -84
  130. package/docs/examples/cascader-select/multiple.vue +38 -38
  131. package/docs/examples/cascader-select/slot.vue +45 -45
  132. package/docs/examples/checkbox/basic.vue +18 -18
  133. package/docs/examples/checkbox/button.vue +19 -19
  134. package/docs/examples/checkbox/color.vue +25 -25
  135. package/docs/examples/checkbox/disabled.vue +17 -17
  136. package/docs/examples/checkbox/min-max.vue +20 -20
  137. package/docs/examples/checkbox/mixed.vue +56 -56
  138. package/docs/examples/checkbox/size.vue +28 -28
  139. package/docs/examples/code-mirror/basic.vue +11 -11
  140. package/docs/examples/code-mirror/events.vue +42 -42
  141. package/docs/examples/code-mirror/height.vue +25 -25
  142. package/docs/examples/code-mirror/mode.vue +33 -33
  143. package/docs/examples/code-mirror/readonly.vue +14 -14
  144. package/docs/examples/collapse/basic.vue +82 -82
  145. package/docs/examples/comp/basic.vue +7 -7
  146. package/docs/examples/comp/collapse.vue +38 -38
  147. package/docs/examples/comp/table-merge-rows.vue +77 -0
  148. package/docs/examples/comp/tabs.vue +38 -38
  149. package/docs/examples/count/basic.vue +101 -101
  150. package/docs/examples/count-up/basic.vue +89 -89
  151. package/docs/examples/data-panel/basic.vue +110 -110
  152. package/docs/examples/date/basic.vue +73 -73
  153. package/docs/examples/date/default-value.vue +59 -59
  154. package/docs/examples/date/format.vue +75 -75
  155. package/docs/examples/date/range.vue +66 -66
  156. package/docs/examples/date/types.vue +79 -79
  157. package/docs/examples/decorated-title/basic.vue +31 -31
  158. package/docs/examples/dialog/basic.vue +36 -36
  159. package/docs/examples/dialog/custom-buttons.vue +44 -44
  160. package/docs/examples/dialog/fullscreen.vue +23 -23
  161. package/docs/examples/dialog/no-mask.vue +17 -17
  162. package/docs/examples/dialog/size.vue +44 -44
  163. package/docs/examples/dialog/steps.vue +57 -57
  164. package/docs/examples/dialog-full/basic.vue +29 -29
  165. package/docs/examples/dialog-full/custom-buttons.vue +45 -45
  166. package/docs/examples/dialog-full/no-buttons.vue +18 -18
  167. package/docs/examples/dialog-full/no-header.vue +27 -27
  168. package/docs/examples/dialog-full/steps.vue +71 -71
  169. package/docs/examples/divider/basic.vue +52 -52
  170. package/docs/examples/drawer/basic.vue +35 -35
  171. package/docs/examples/drawer/custom-buttons.vue +34 -34
  172. package/docs/examples/drawer/direction.vue +47 -47
  173. package/docs/examples/drawer/mask.vue +36 -36
  174. package/docs/examples/drawer/no-buttons.vue +20 -20
  175. package/docs/examples/drawer/size.vue +28 -28
  176. package/docs/examples/dynamic-layer/basic.vue +33 -33
  177. package/docs/examples/dynamic-layer/custom-buttons.vue +43 -43
  178. package/docs/examples/dynamic-layer/form.vue +73 -73
  179. package/docs/examples/dynamic-layer/steps.vue +52 -52
  180. package/docs/examples/dynamic-layer/types.vue +40 -40
  181. package/docs/examples/echarts/basic.vue +31 -31
  182. package/docs/examples/echarts/dynamic.vue +43 -43
  183. package/docs/examples/echarts/line.vue +46 -46
  184. package/docs/examples/echarts/pie.vue +44 -44
  185. package/docs/examples/editor/basic.vue +15 -15
  186. package/docs/examples/form/basic.vue +688 -688
  187. package/docs/examples/form/init.vue +76 -76
  188. package/docs/examples/form/master-detail.vue +203 -203
  189. package/docs/examples/form/rule-format.vue +179 -179
  190. package/docs/examples/form/view-table.vue +378 -378
  191. package/docs/examples/guid/basic.vue +10 -10
  192. package/docs/examples/guid/size.vue +13 -13
  193. package/docs/examples/hpanel/basic.vue +79 -79
  194. package/docs/examples/icon/basic.vue +9 -9
  195. package/docs/examples/icon/rotate-flip.vue +9 -9
  196. package/docs/examples/icon/size.vue +7 -7
  197. package/docs/examples/input/basic.vue +10 -10
  198. package/docs/examples/input/clearable.vue +12 -12
  199. package/docs/examples/input/disabled.vue +6 -6
  200. package/docs/examples/input/icon.vue +23 -23
  201. package/docs/examples/input/password.vue +18 -18
  202. package/docs/examples/input/size.vue +13 -13
  203. package/docs/examples/input/textarea.vue +25 -25
  204. package/docs/examples/input/word-limit.vue +28 -28
  205. package/docs/examples/input-button/basic.vue +33 -33
  206. package/docs/examples/input-cards/basic.vue +79 -79
  207. package/docs/examples/input-code/basic.vue +29 -29
  208. package/docs/examples/input-color/basic.vue +10 -10
  209. package/docs/examples/input-color/disabled.vue +13 -13
  210. package/docs/examples/input-color/format.vue +17 -17
  211. package/docs/examples/input-color/no-alpha.vue +13 -13
  212. package/docs/examples/input-color/only-button.vue +15 -15
  213. package/docs/examples/input-color/predefine.vue +31 -31
  214. package/docs/examples/input-color/size.vue +15 -15
  215. package/docs/examples/input-layer/basic.vue +85 -85
  216. package/docs/examples/input-layer/render-vnode-page.vue +160 -160
  217. package/docs/examples/input-layer/render-vnode.vue +127 -127
  218. package/docs/examples/input-rows/basic.vue +73 -73
  219. package/docs/examples/input-rows/drag.vue +48 -48
  220. package/docs/examples/input-rows/layer-form.vue +85 -85
  221. package/docs/examples/input-rows/nested.vue +91 -91
  222. package/docs/examples/input-tag/basic.vue +27 -27
  223. package/docs/examples/input-tag/colors.vue +23 -23
  224. package/docs/examples/input-tag/readonly.vue +17 -17
  225. package/docs/examples/layer/basic.vue +43 -43
  226. package/docs/examples/layer/custom-buttons.vue +61 -61
  227. package/docs/examples/layer/drawer.vue +37 -37
  228. package/docs/examples/layer/full.vue +38 -38
  229. package/docs/examples/layer/modal.vue +34 -34
  230. package/docs/examples/layer/steps.vue +46 -46
  231. package/docs/examples/layer-form/basic.vue +76 -76
  232. package/docs/examples/layer-form/config.vue +82 -82
  233. package/docs/examples/layer-form/size.vue +72 -72
  234. package/docs/examples/layout/basic.vue +36 -36
  235. package/docs/examples/layout/custom-size.vue +50 -50
  236. package/docs/examples/layout/disable-move.vue +37 -37
  237. package/docs/examples/layout/hide-mid-when-narrow.vue +96 -96
  238. package/docs/examples/layout/min-size.vue +73 -73
  239. package/docs/examples/layout/percent-size.vue +80 -80
  240. package/docs/examples/layout/simple.vue +22 -22
  241. package/docs/examples/layout/top-side.vue +34 -34
  242. package/docs/examples/map/basic.vue +22 -22
  243. package/docs/examples/menu/basic.vue +58 -58
  244. package/docs/examples/menu/collapsed.vue +49 -49
  245. package/docs/examples/menu/horizontal.vue +44 -44
  246. package/docs/examples/menu/selection-test.vue +104 -104
  247. package/docs/examples/menu/theme.vue +46 -46
  248. package/docs/examples/menu/vertical.vue +46 -46
  249. package/docs/examples/number/advanced.vue +143 -143
  250. package/docs/examples/number/basic.vue +63 -63
  251. package/docs/examples/number/disabled.vue +49 -49
  252. package/docs/examples/number/size.vue +42 -42
  253. package/docs/examples/number/slots.vue +123 -123
  254. package/docs/examples/number/step-strictly.vue +41 -41
  255. package/docs/examples/number/step.vue +47 -47
  256. package/docs/examples/page/basic.vue +41 -41
  257. package/docs/examples/page/code-table-model.vue +428 -428
  258. package/docs/examples/page/dept-user-management.vue +211 -211
  259. package/docs/examples/page/init.vue +87 -87
  260. package/docs/examples/page/log.vue +453 -453
  261. package/docs/examples/page/user-management.vue +313 -313
  262. package/docs/examples/panel/tool-buttons.vue +18 -18
  263. package/docs/examples/radio/basic.vue +17 -17
  264. package/docs/examples/radio/button.vue +17 -17
  265. package/docs/examples/radio/color.vue +18 -18
  266. package/docs/examples/radio/disabled.vue +17 -17
  267. package/docs/examples/radio/size.vue +29 -29
  268. package/docs/examples/rate/basic.vue +24 -24
  269. package/docs/examples/rate/half.vue +24 -24
  270. package/docs/examples/rate/readonly.vue +11 -11
  271. package/docs/examples/rate/text.vue +37 -37
  272. package/docs/examples/select/basic.vue +16 -16
  273. package/docs/examples/select/clearable.vue +22 -22
  274. package/docs/examples/select/disabled.vue +31 -31
  275. package/docs/examples/select/filterable.vue +24 -24
  276. package/docs/examples/select/group.vue +23 -23
  277. package/docs/examples/select/icon.vue +16 -16
  278. package/docs/examples/select/multiple.vue +18 -18
  279. package/docs/examples/select/size.vue +39 -39
  280. package/docs/examples/slider/basic.vue +42 -42
  281. package/docs/examples/slider/disabled.vue +17 -17
  282. package/docs/examples/slider/marks.vue +30 -30
  283. package/docs/examples/slider/size.vue +37 -37
  284. package/docs/examples/slider/tooltip.vue +36 -36
  285. package/docs/examples/slider/vertical.vue +26 -26
  286. package/docs/examples/slider-captcha/basic.vue +44 -44
  287. package/docs/examples/slider-captcha/custom.vue +48 -48
  288. package/docs/examples/switch/basic.vue +16 -16
  289. package/docs/examples/switch/disabled.vue +13 -13
  290. package/docs/examples/switch/loading.vue +13 -13
  291. package/docs/examples/switch/size.vue +15 -15
  292. package/docs/examples/switch/text.vue +13 -13
  293. package/docs/examples/table/action-filter.vue +126 -126
  294. package/docs/examples/table/actions.vue +116 -116
  295. package/docs/examples/table/add-row.vue +103 -103
  296. package/docs/examples/table/basic.vue +168 -168
  297. package/docs/examples/table/checkbox-layout.vue +68 -68
  298. package/docs/examples/table/column-filter.vue +96 -96
  299. package/docs/examples/table/custom-layout.vue +115 -115
  300. package/docs/examples/table/custom-merge-cell.vue +206 -206
  301. package/docs/examples/table/dynamic-type.vue +73 -73
  302. package/docs/examples/table/editable.vue +262 -262
  303. package/docs/examples/table/field-selection.vue +87 -87
  304. package/docs/examples/table/frozen-column.vue +140 -140
  305. package/docs/examples/table/height-mode.vue +99 -99
  306. package/docs/examples/table/icon.vue +85 -85
  307. package/docs/examples/table/layer-form.vue +133 -133
  308. package/docs/examples/table/link.vue +66 -66
  309. package/docs/examples/table/merge-cell.vue +78 -78
  310. package/docs/examples/table/merge-header.vue +86 -0
  311. package/docs/examples/table/multiple-disabled.vue +112 -112
  312. package/docs/examples/table/multiple.vue +188 -188
  313. package/docs/examples/table/pagination.vue +151 -151
  314. package/docs/examples/table/row-drag.vue +67 -67
  315. package/docs/examples/table/row-fixed.vue +61 -61
  316. package/docs/examples/table/single-selection.vue +64 -64
  317. package/docs/examples/table/sub-table-lazy.vue +97 -97
  318. package/docs/examples/table/sub-table.vue +103 -103
  319. package/docs/examples/table/tag.vue +43 -43
  320. package/docs/examples/table/tree-column.vue +119 -119
  321. package/docs/examples/table/tree-data.vue +141 -141
  322. package/docs/examples/table/tree-default-expand-all.vue +60 -60
  323. package/docs/examples/table/tree-lazy.vue +80 -80
  324. package/docs/examples/table/tree-set-selection.vue +75 -75
  325. package/docs/examples/table-panel/basic.vue +229 -229
  326. package/docs/examples/table-panel/batch-operations.vue +286 -286
  327. package/docs/examples/table-panel/button-visibility.vue +88 -88
  328. package/docs/examples/table-panel/card.vue +101 -101
  329. package/docs/examples/table-panel/column-filter.vue +116 -116
  330. package/docs/examples/table-panel/filter.vue +219 -219
  331. package/docs/examples/table-panel/get-selection.vue +111 -111
  332. package/docs/examples/table-panel/mask.vue +151 -151
  333. package/docs/examples/table-panel/model-value.vue +87 -87
  334. package/docs/examples/table-panel/multiple-selection.vue +243 -243
  335. package/docs/examples/table-panel/pagination.vue +133 -133
  336. package/docs/examples/table-panel/search-list.vue +207 -207
  337. package/docs/examples/table-panel/sub-table-lazy.vue +118 -118
  338. package/docs/examples/table-panel/tree-parent-key.vue +67 -67
  339. package/docs/examples/tabs/basic.vue +98 -98
  340. package/docs/examples/time/base.vue +67 -67
  341. package/docs/examples/title/basic.vue +87 -87
  342. package/docs/examples/tree/accordion.vue +46 -46
  343. package/docs/examples/tree/basic.vue +50 -50
  344. package/docs/examples/tree/buttons.vue +53 -53
  345. package/docs/examples/tree/check-strictly.vue +53 -53
  346. package/docs/examples/tree/checkable.vue +52 -52
  347. package/docs/examples/tree/custom-keys.vue +39 -39
  348. package/docs/examples/tree/default-expanded.vue +52 -52
  349. package/docs/examples/tree/draggable.vue +29 -29
  350. package/docs/examples/tree/expand-on-click.vue +39 -39
  351. package/docs/examples/tree/flat-data.vue +20 -20
  352. package/docs/examples/tree/icon.vue +40 -40
  353. package/docs/examples/tree/load-data.vue +37 -37
  354. package/docs/examples/tree/methods.vue +74 -74
  355. package/docs/examples/tree/theme.vue +33 -33
  356. package/docs/examples/tree-select/basic.vue +47 -47
  357. package/docs/examples/upload/accept.vue +31 -31
  358. package/docs/examples/upload/basic.vue +12 -12
  359. package/docs/examples/upload/drag.vue +11 -11
  360. package/docs/examples/upload/image.vue +17 -17
  361. package/docs/examples/upload/limit.vue +20 -20
  362. package/docs/examples/upload/multiple.vue +17 -17
  363. package/docs/examples/upload/readonly.vue +17 -17
  364. package/docs/examples/utils/cipher.vue +160 -160
  365. package/docs/examples/utils/common.vue +153 -153
  366. package/docs/examples/utils/date.vue +56 -56
  367. package/docs/examples/utils/dom.vue +52 -52
  368. package/docs/examples/utils/is.vue +70 -70
  369. package/docs/examples/workflow/basic.vue +265 -265
  370. package/docs/examples/workflow-viewer/basic.vue +248 -248
  371. package/package.json +23 -23
@@ -1,87 +1,87 @@
1
- # Radio 单选框
2
-
3
- 在一组备选项中进行单选。
4
-
5
- ## 基础用法
6
-
7
- 使用 `v-model` 实现双向数据绑定。
8
-
9
- <Demo :source-code="radioBasicCode">
10
- <template #source>
11
- <radio-basic />
12
- </template>
13
- <template #description>
14
- 使用 v-model 实现双向数据绑定。
15
- </template>
16
- </Demo>
17
-
18
- ## 按钮样式
19
-
20
- 通过 `isButton` 属性可以将单选框设置为按钮样式。
21
-
22
- <Demo :source-code="radioButtonCode">
23
- <template #source>
24
- <radio-button />
25
- </template>
26
- <template #description>
27
- 设置 `isButton` 属性为 `true` 即可显示为按钮样式。
28
- </template>
29
- </Demo>
30
-
31
- ## 颜色标签
32
-
33
- 通过 `isColor` 属性可以为选项添加颜色标签。
34
-
35
- <Demo :source-code="radioColorCode">
36
- <template #source>
37
- <radio-color />
38
- </template>
39
- <template #description>
40
- 设置 `isColor` 属性为 `true` 即可显示颜色标签。可以通过 `colors` 属性或选项中的 `color` 属性设置颜色。
41
- </template>
42
- </Demo>
43
-
44
- ## 不同尺寸
45
-
46
- Radio 组件提供三种尺寸。
47
-
48
- <Demo :source-code="radioSizeCode">
49
- <template #source>
50
- <radio-size />
51
- </template>
52
- <template #description>
53
- 使用 `size` 属性配置尺寸,可选值为 `large`、`default` 和 `small`。
54
- </template>
55
- </Demo>
56
-
57
- ## 禁用状态
58
-
59
- 使用 `readonly` 属性来定义单选框是否被禁用。
60
-
61
- <Demo :source-code="radioDisabledCode">
62
- <template #source>
63
- <radio-disabled />
64
- </template>
65
- <template #description>
66
- 你可以使用 `readonly` 属性来定义单选框是否可用。
67
- </template>
68
- </Demo>
69
-
70
- ## API
71
-
72
- <ApiTable :data="radioApi" componentName="radio" />
73
-
74
- <script setup>
75
- import RadioBasic from '../examples/radio/basic.vue'
76
- import RadioButton from '../examples/radio/button.vue'
77
- import RadioColor from '../examples/radio/color.vue'
78
- import RadioSize from '../examples/radio/size.vue'
79
- import RadioDisabled from '../examples/radio/disabled.vue'
80
- import radioApi from './meta/radio'
81
-
82
- import radioBasicCode from '../examples/radio/basic.vue?raw'
83
- import radioButtonCode from '../examples/radio/button.vue?raw'
84
- import radioColorCode from '../examples/radio/color.vue?raw'
85
- import radioSizeCode from '../examples/radio/size.vue?raw'
86
- import radioDisabledCode from '../examples/radio/disabled.vue?raw'
87
- </script>
1
+ # Radio 单选框
2
+
3
+ 在一组备选项中进行单选。
4
+
5
+ ## 基础用法
6
+
7
+ 使用 `v-model` 实现双向数据绑定。
8
+
9
+ <Demo :source-code="radioBasicCode">
10
+ <template #source>
11
+ <radio-basic />
12
+ </template>
13
+ <template #description>
14
+ 使用 v-model 实现双向数据绑定。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 按钮样式
19
+
20
+ 通过 `isButton` 属性可以将单选框设置为按钮样式。
21
+
22
+ <Demo :source-code="radioButtonCode">
23
+ <template #source>
24
+ <radio-button />
25
+ </template>
26
+ <template #description>
27
+ 设置 `isButton` 属性为 `true` 即可显示为按钮样式。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## 颜色标签
32
+
33
+ 通过 `isColor` 属性可以为选项添加颜色标签。
34
+
35
+ <Demo :source-code="radioColorCode">
36
+ <template #source>
37
+ <radio-color />
38
+ </template>
39
+ <template #description>
40
+ 设置 `isColor` 属性为 `true` 即可显示颜色标签。可以通过 `colors` 属性或选项中的 `color` 属性设置颜色。
41
+ </template>
42
+ </Demo>
43
+
44
+ ## 不同尺寸
45
+
46
+ Radio 组件提供三种尺寸。
47
+
48
+ <Demo :source-code="radioSizeCode">
49
+ <template #source>
50
+ <radio-size />
51
+ </template>
52
+ <template #description>
53
+ 使用 `size` 属性配置尺寸,可选值为 `large`、`default` 和 `small`。
54
+ </template>
55
+ </Demo>
56
+
57
+ ## 禁用状态
58
+
59
+ 使用 `readonly` 属性来定义单选框是否被禁用。
60
+
61
+ <Demo :source-code="radioDisabledCode">
62
+ <template #source>
63
+ <radio-disabled />
64
+ </template>
65
+ <template #description>
66
+ 你可以使用 `readonly` 属性来定义单选框是否可用。
67
+ </template>
68
+ </Demo>
69
+
70
+ ## API
71
+
72
+ <ApiTable :data="radioApi" componentName="radio" />
73
+
74
+ <script setup>
75
+ import RadioBasic from '../examples/radio/basic.vue'
76
+ import RadioButton from '../examples/radio/button.vue'
77
+ import RadioColor from '../examples/radio/color.vue'
78
+ import RadioSize from '../examples/radio/size.vue'
79
+ import RadioDisabled from '../examples/radio/disabled.vue'
80
+ import radioApi from './meta/radio'
81
+
82
+ import radioBasicCode from '../examples/radio/basic.vue?raw'
83
+ import radioButtonCode from '../examples/radio/button.vue?raw'
84
+ import radioColorCode from '../examples/radio/color.vue?raw'
85
+ import radioSizeCode from '../examples/radio/size.vue?raw'
86
+ import radioDisabledCode from '../examples/radio/disabled.vue?raw'
87
+ </script>
@@ -1,71 +1,71 @@
1
- # Rate 评分
2
-
3
- 评分组件,用于对事物进行等级评价。
4
-
5
- ## 基础用法
6
-
7
- 最基础的评分用法。
8
-
9
- <Demo :source-code="rateBasicCode">
10
- <template #source>
11
- <rate-basic />
12
- </template>
13
- <template #description>
14
- 使用 v-model 实现双向绑定。
15
- </template>
16
- </Demo>
17
-
18
- ## 允许半选
19
-
20
- 可以允许选择半颗星。
21
-
22
- <Demo :source-code="rateHalfCode">
23
- <template #source>
24
- <rate-half />
25
- </template>
26
- <template #description>
27
- 设置 `allow-half` 属性可以实现半选。
28
- </template>
29
- </Demo>
30
-
31
- ## 辅助文字与分数
32
-
33
- 可以显示辅助文字或当前分数。
34
-
35
- <Demo :source-code="rateTextCode">
36
- <template #source>
37
- <rate-text />
38
- </template>
39
- <template #description>
40
- 使用 `show-text` 显示辅助文字,使用 `show-score` 显示当前分数。
41
- </template>
42
- </Demo>
43
-
44
- ## 只读
45
-
46
- 只读状态下无法交互。
47
-
48
- <Demo :source-code="rateReadonlyCode">
49
- <template #source>
50
- <rate-readonly />
51
- </template>
52
- <template #description>
53
- 通过 `readonly` 属性指定是否只读。
54
- </template>
55
- </Demo>
56
-
57
- ## API
58
-
59
- <ApiTable :data="rateApi" componentName="rate" />
60
-
61
- <script setup>
62
- import RateBasic from '../examples/rate/basic.vue'
63
- import RateHalf from '../examples/rate/half.vue'
64
- import RateText from '../examples/rate/text.vue'
65
- import RateReadonly from '../examples/rate/readonly.vue'
66
- import rateApi from './meta/rate'
67
- import rateBasicCode from '../examples/rate/basic.vue?raw'
68
- import rateHalfCode from '../examples/rate/half.vue?raw'
69
- import rateTextCode from '../examples/rate/text.vue?raw'
70
- import rateReadonlyCode from '../examples/rate/readonly.vue?raw'
71
- </script>
1
+ # Rate 评分
2
+
3
+ 评分组件,用于对事物进行等级评价。
4
+
5
+ ## 基础用法
6
+
7
+ 最基础的评分用法。
8
+
9
+ <Demo :source-code="rateBasicCode">
10
+ <template #source>
11
+ <rate-basic />
12
+ </template>
13
+ <template #description>
14
+ 使用 v-model 实现双向绑定。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 允许半选
19
+
20
+ 可以允许选择半颗星。
21
+
22
+ <Demo :source-code="rateHalfCode">
23
+ <template #source>
24
+ <rate-half />
25
+ </template>
26
+ <template #description>
27
+ 设置 `allow-half` 属性可以实现半选。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## 辅助文字与分数
32
+
33
+ 可以显示辅助文字或当前分数。
34
+
35
+ <Demo :source-code="rateTextCode">
36
+ <template #source>
37
+ <rate-text />
38
+ </template>
39
+ <template #description>
40
+ 使用 `show-text` 显示辅助文字,使用 `show-score` 显示当前分数。
41
+ </template>
42
+ </Demo>
43
+
44
+ ## 只读
45
+
46
+ 只读状态下无法交互。
47
+
48
+ <Demo :source-code="rateReadonlyCode">
49
+ <template #source>
50
+ <rate-readonly />
51
+ </template>
52
+ <template #description>
53
+ 通过 `readonly` 属性指定是否只读。
54
+ </template>
55
+ </Demo>
56
+
57
+ ## API
58
+
59
+ <ApiTable :data="rateApi" componentName="rate" />
60
+
61
+ <script setup>
62
+ import RateBasic from '../examples/rate/basic.vue'
63
+ import RateHalf from '../examples/rate/half.vue'
64
+ import RateText from '../examples/rate/text.vue'
65
+ import RateReadonly from '../examples/rate/readonly.vue'
66
+ import rateApi from './meta/rate'
67
+ import rateBasicCode from '../examples/rate/basic.vue?raw'
68
+ import rateHalfCode from '../examples/rate/half.vue?raw'
69
+ import rateTextCode from '../examples/rate/text.vue?raw'
70
+ import rateReadonlyCode from '../examples/rate/readonly.vue?raw'
71
+ </script>
@@ -1,133 +1,133 @@
1
- # Select 选择器
2
-
3
- 当选项过多时,使用下拉菜单展示并选择内容。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="selectBasicCode">
8
- <template #source>
9
- <select-basic />
10
- </template>
11
- <template #description>
12
- 使用 v-model 实现双向数据绑定。
13
- </template>
14
- </Demo>
15
-
16
- ## 不同尺寸
17
-
18
- Select 组件提供三种尺寸。
19
-
20
- <Demo :source-code="selectSizeCode">
21
- <template #source>
22
- <select-size />
23
- </template>
24
- <template #description>
25
- 使用 size 属性改变选择器大小。除了默认大小外,还有另外两个选项: large, small。
26
- </template>
27
- </Demo>
28
-
29
- ## 禁用和只读
30
-
31
- 通过 `disabled` 和 `readonly` 属性指定选择器的状态。
32
-
33
- <Demo :source-code="selectDisabledCode">
34
- <template #source>
35
- <select-disabled />
36
- </template>
37
- <template #description>
38
- 通过 disabled 属性指定是否禁用 select 组件,通过 readonly 属性指定是否只读。
39
- </template>
40
- </Demo>
41
-
42
- ## 可清除
43
-
44
- 使用 `clearable` 属性即可得到一个可清除的选择器。
45
-
46
- <Demo :source-code="selectClearableCode">
47
- <template #source>
48
- <select-clearable />
49
- </template>
50
- <template #description>
51
- 设置 `clearable` 属性为 `true` 即可显示清除按钮。
52
- </template>
53
- </Demo>
54
-
55
- ## 多选
56
-
57
- 使用 `multiple` 属性即可启用多选模式。
58
-
59
- ::: tip 注意
60
- 在多选模式下,绑定值(v-model)将以逗号分隔的字符串形式返回,例如:`"1,2,3"`。
61
- :::
62
-
63
- <Demo :source-code="selectMultipleCode">
64
- <template #source>
65
- <select-multiple />
66
- </template>
67
- <template #description>
68
- 设置 `multiple` 属性为 `true` 即可启用多选模式。
69
- </template>
70
- </Demo>
71
-
72
- ## 可搜索
73
-
74
- 使用 `filterable` 属性即可启用搜索功能。
75
-
76
- <Demo :source-code="selectFilterableCode">
77
- <template #source>
78
- <select-filterable />
79
- </template>
80
- <template #description>
81
- 设置 `filterable` 属性为 `true` 即可启用搜索功能。
82
- </template>
83
- </Demo>
84
-
85
- ## 分组
86
-
87
- 使用 `is-group` 和 `group-key` 属性即可实现选项分组。
88
-
89
- <Demo :source-code="selectGroupCode">
90
- <template #source>
91
- <select-group />
92
- </template>
93
- <template #description>
94
- 设置 `is-group` 属性为 `true` 并指定 `group-key` 即可实现选项分组。
95
- </template>
96
- </Demo>
97
-
98
- ## 带图标
99
-
100
- 选项可以包含图标。
101
-
102
- <Demo :source-code="selectIconCode">
103
- <template #source>
104
- <select-icon />
105
- </template>
106
- <template #description>
107
- 在选项数据中添加 `icon` 属性即可显示图标。
108
- </template>
109
- </Demo>
110
-
111
- ## API
112
-
113
- <ApiTable :data="selectApi" componentName="select" />
114
-
115
- <script setup>
116
- import SelectBasic from '../examples/select/basic.vue'
117
- import SelectSize from '../examples/select/size.vue'
118
- import SelectDisabled from '../examples/select/disabled.vue'
119
- import SelectClearable from '../examples/select/clearable.vue'
120
- import SelectMultiple from '../examples/select/multiple.vue'
121
- import SelectFilterable from '../examples/select/filterable.vue'
122
- import SelectGroup from '../examples/select/group.vue'
123
- import SelectIcon from '../examples/select/icon.vue'
124
- import selectApi from './meta/select'
125
- import selectBasicCode from '../examples/select/basic.vue?raw'
126
- import selectSizeCode from '../examples/select/size.vue?raw'
127
- import selectDisabledCode from '../examples/select/disabled.vue?raw'
128
- import selectClearableCode from '../examples/select/clearable.vue?raw'
129
- import selectMultipleCode from '../examples/select/multiple.vue?raw'
130
- import selectFilterableCode from '../examples/select/filterable.vue?raw'
131
- import selectGroupCode from '../examples/select/group.vue?raw'
132
- import selectIconCode from '../examples/select/icon.vue?raw'
133
- </script>
1
+ # Select 选择器
2
+
3
+ 当选项过多时,使用下拉菜单展示并选择内容。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="selectBasicCode">
8
+ <template #source>
9
+ <select-basic />
10
+ </template>
11
+ <template #description>
12
+ 使用 v-model 实现双向数据绑定。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## 不同尺寸
17
+
18
+ Select 组件提供三种尺寸。
19
+
20
+ <Demo :source-code="selectSizeCode">
21
+ <template #source>
22
+ <select-size />
23
+ </template>
24
+ <template #description>
25
+ 使用 size 属性改变选择器大小。除了默认大小外,还有另外两个选项: large, small。
26
+ </template>
27
+ </Demo>
28
+
29
+ ## 禁用和只读
30
+
31
+ 通过 `disabled` 和 `readonly` 属性指定选择器的状态。
32
+
33
+ <Demo :source-code="selectDisabledCode">
34
+ <template #source>
35
+ <select-disabled />
36
+ </template>
37
+ <template #description>
38
+ 通过 disabled 属性指定是否禁用 select 组件,通过 readonly 属性指定是否只读。
39
+ </template>
40
+ </Demo>
41
+
42
+ ## 可清除
43
+
44
+ 使用 `clearable` 属性即可得到一个可清除的选择器。
45
+
46
+ <Demo :source-code="selectClearableCode">
47
+ <template #source>
48
+ <select-clearable />
49
+ </template>
50
+ <template #description>
51
+ 设置 `clearable` 属性为 `true` 即可显示清除按钮。
52
+ </template>
53
+ </Demo>
54
+
55
+ ## 多选
56
+
57
+ 使用 `multiple` 属性即可启用多选模式。
58
+
59
+ ::: tip 注意
60
+ 在多选模式下,绑定值(v-model)将以逗号分隔的字符串形式返回,例如:`"1,2,3"`。
61
+ :::
62
+
63
+ <Demo :source-code="selectMultipleCode">
64
+ <template #source>
65
+ <select-multiple />
66
+ </template>
67
+ <template #description>
68
+ 设置 `multiple` 属性为 `true` 即可启用多选模式。
69
+ </template>
70
+ </Demo>
71
+
72
+ ## 可搜索
73
+
74
+ 使用 `filterable` 属性即可启用搜索功能。
75
+
76
+ <Demo :source-code="selectFilterableCode">
77
+ <template #source>
78
+ <select-filterable />
79
+ </template>
80
+ <template #description>
81
+ 设置 `filterable` 属性为 `true` 即可启用搜索功能。
82
+ </template>
83
+ </Demo>
84
+
85
+ ## 分组
86
+
87
+ 使用 `is-group` 和 `group-key` 属性即可实现选项分组。
88
+
89
+ <Demo :source-code="selectGroupCode">
90
+ <template #source>
91
+ <select-group />
92
+ </template>
93
+ <template #description>
94
+ 设置 `is-group` 属性为 `true` 并指定 `group-key` 即可实现选项分组。
95
+ </template>
96
+ </Demo>
97
+
98
+ ## 带图标
99
+
100
+ 选项可以包含图标。
101
+
102
+ <Demo :source-code="selectIconCode">
103
+ <template #source>
104
+ <select-icon />
105
+ </template>
106
+ <template #description>
107
+ 在选项数据中添加 `icon` 属性即可显示图标。
108
+ </template>
109
+ </Demo>
110
+
111
+ ## API
112
+
113
+ <ApiTable :data="selectApi" componentName="select" />
114
+
115
+ <script setup>
116
+ import SelectBasic from '../examples/select/basic.vue'
117
+ import SelectSize from '../examples/select/size.vue'
118
+ import SelectDisabled from '../examples/select/disabled.vue'
119
+ import SelectClearable from '../examples/select/clearable.vue'
120
+ import SelectMultiple from '../examples/select/multiple.vue'
121
+ import SelectFilterable from '../examples/select/filterable.vue'
122
+ import SelectGroup from '../examples/select/group.vue'
123
+ import SelectIcon from '../examples/select/icon.vue'
124
+ import selectApi from './meta/select'
125
+ import selectBasicCode from '../examples/select/basic.vue?raw'
126
+ import selectSizeCode from '../examples/select/size.vue?raw'
127
+ import selectDisabledCode from '../examples/select/disabled.vue?raw'
128
+ import selectClearableCode from '../examples/select/clearable.vue?raw'
129
+ import selectMultipleCode from '../examples/select/multiple.vue?raw'
130
+ import selectFilterableCode from '../examples/select/filterable.vue?raw'
131
+ import selectGroupCode from '../examples/select/group.vue?raw'
132
+ import selectIconCode from '../examples/select/icon.vue?raw'
133
+ </script>
@@ -1,41 +1,41 @@
1
- # SliderCaptcha 滑块验证
2
-
3
- 通过拖动滑块进行人机验证。
4
-
5
- ## 基础用法
6
-
7
- 最简单的滑块验证码使用方式。
8
-
9
- <Demo :source-code="sliderCaptchaBasicCode">
10
- <template #source>
11
- <slider-captcha-basic />
12
- </template>
13
- <template #description>
14
- 使用 v-model 绑定验证状态,可以通过 text 和 success-text 自定义提示文字。
15
- </template>
16
- </Demo>
17
-
18
- ## 自定义样式
19
-
20
- 可以通过样式属性自定义滑块验证码的外观。
21
-
22
- <Demo :source-code="sliderCaptchaCustomCode">
23
- <template #source>
24
- <slider-captcha-custom />
25
- </template>
26
- <template #description>
27
- 通过 wrapper-style、bar-style、action-style 和 content-style 属性可以自定义组件各部分的样式。
28
- </template>
29
- </Demo>
30
-
31
- ## API
32
-
33
- <ApiTable :data="sliderCaptchaApi" componentName="slider-captcha" />
34
-
35
- <script setup>
36
- import SliderCaptchaBasic from '../examples/slider-captcha/basic.vue'
37
- import SliderCaptchaCustom from '../examples/slider-captcha/custom.vue'
38
- import sliderCaptchaApi from './meta/slider-captcha'
39
- import sliderCaptchaBasicCode from '../examples/slider-captcha/basic.vue?raw'
40
- import sliderCaptchaCustomCode from '../examples/slider-captcha/custom.vue?raw'
41
- </script>
1
+ # SliderCaptcha 滑块验证
2
+
3
+ 通过拖动滑块进行人机验证。
4
+
5
+ ## 基础用法
6
+
7
+ 最简单的滑块验证码使用方式。
8
+
9
+ <Demo :source-code="sliderCaptchaBasicCode">
10
+ <template #source>
11
+ <slider-captcha-basic />
12
+ </template>
13
+ <template #description>
14
+ 使用 v-model 绑定验证状态,可以通过 text 和 success-text 自定义提示文字。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 自定义样式
19
+
20
+ 可以通过样式属性自定义滑块验证码的外观。
21
+
22
+ <Demo :source-code="sliderCaptchaCustomCode">
23
+ <template #source>
24
+ <slider-captcha-custom />
25
+ </template>
26
+ <template #description>
27
+ 通过 wrapper-style、bar-style、action-style 和 content-style 属性可以自定义组件各部分的样式。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## API
32
+
33
+ <ApiTable :data="sliderCaptchaApi" componentName="slider-captcha" />
34
+
35
+ <script setup>
36
+ import SliderCaptchaBasic from '../examples/slider-captcha/basic.vue'
37
+ import SliderCaptchaCustom from '../examples/slider-captcha/custom.vue'
38
+ import sliderCaptchaApi from './meta/slider-captcha'
39
+ import sliderCaptchaBasicCode from '../examples/slider-captcha/basic.vue?raw'
40
+ import sliderCaptchaCustomCode from '../examples/slider-captcha/custom.vue?raw'
41
+ </script>