@a2simcode/ui 0.0.241 → 0.0.242

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 (362) 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/table.vue.d.ts +15 -0
  7. package/dist/components/table-panel/index.d.ts +15 -0
  8. package/dist/components/table-panel/src/table-panel.vue.d.ts +15 -0
  9. package/dist/simcode-ui.es.js +2610 -2589
  10. package/dist/simcode-ui.umd.js +2 -2
  11. package/dist/stats.html +1 -1
  12. package/dist/ui.css +1 -1
  13. package/docs/components/autocomplete.md +89 -89
  14. package/docs/components/barcode.md +101 -101
  15. package/docs/components/button-select.md +24 -24
  16. package/docs/components/button.md +117 -117
  17. package/docs/components/buttons.md +119 -119
  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 +71 -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/code-mirror.ts +108 -108
  53. package/docs/components/meta/comp.ts +236 -236
  54. package/docs/components/meta/date.ts +267 -267
  55. package/docs/components/meta/echarts.ts +64 -64
  56. package/docs/components/meta/form-item.ts +50 -50
  57. package/docs/components/meta/form.ts +181 -181
  58. package/docs/components/meta/input-button.ts +175 -175
  59. package/docs/components/meta/input-cards.ts +112 -112
  60. package/docs/components/meta/input-code.ts +161 -161
  61. package/docs/components/meta/input-color.ts +243 -243
  62. package/docs/components/meta/input-layer.ts +382 -382
  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 +7 -1
  71. package/docs/components/meta/table.ts +10 -4
  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 +219 -219
  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 +297 -282
  88. package/docs/components/table.md +450 -435
  89. package/docs/components/tabs.md +26 -26
  90. package/docs/components/title.md +24 -24
  91. package/docs/components/tree.md +207 -207
  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/cascader-select/basic.vue +28 -28
  124. package/docs/examples/cascader-select/clearable.vue +34 -34
  125. package/docs/examples/cascader-select/disabled.vue +43 -43
  126. package/docs/examples/cascader-select/filterable.vue +37 -37
  127. package/docs/examples/cascader-select/methods.vue +84 -84
  128. package/docs/examples/cascader-select/multiple.vue +38 -38
  129. package/docs/examples/cascader-select/slot.vue +45 -45
  130. package/docs/examples/checkbox/basic.vue +18 -18
  131. package/docs/examples/checkbox/button.vue +19 -19
  132. package/docs/examples/checkbox/color.vue +25 -25
  133. package/docs/examples/checkbox/disabled.vue +17 -17
  134. package/docs/examples/checkbox/min-max.vue +20 -20
  135. package/docs/examples/checkbox/mixed.vue +56 -56
  136. package/docs/examples/checkbox/size.vue +28 -28
  137. package/docs/examples/code-mirror/basic.vue +11 -11
  138. package/docs/examples/code-mirror/events.vue +42 -42
  139. package/docs/examples/code-mirror/height.vue +25 -25
  140. package/docs/examples/code-mirror/mode.vue +33 -33
  141. package/docs/examples/code-mirror/readonly.vue +14 -14
  142. package/docs/examples/collapse/basic.vue +82 -82
  143. package/docs/examples/comp/basic.vue +7 -7
  144. package/docs/examples/comp/collapse.vue +38 -38
  145. package/docs/examples/comp/tabs.vue +38 -38
  146. package/docs/examples/count/basic.vue +101 -101
  147. package/docs/examples/count-up/basic.vue +89 -89
  148. package/docs/examples/data-panel/basic.vue +110 -110
  149. package/docs/examples/date/basic.vue +73 -73
  150. package/docs/examples/date/default-value.vue +59 -59
  151. package/docs/examples/date/format.vue +75 -75
  152. package/docs/examples/date/range.vue +66 -66
  153. package/docs/examples/date/types.vue +79 -79
  154. package/docs/examples/decorated-title/basic.vue +31 -31
  155. package/docs/examples/dialog/basic.vue +36 -36
  156. package/docs/examples/dialog/custom-buttons.vue +44 -44
  157. package/docs/examples/dialog/fullscreen.vue +23 -23
  158. package/docs/examples/dialog/no-mask.vue +17 -17
  159. package/docs/examples/dialog/size.vue +44 -44
  160. package/docs/examples/dialog/steps.vue +57 -57
  161. package/docs/examples/dialog-full/basic.vue +29 -29
  162. package/docs/examples/dialog-full/custom-buttons.vue +45 -45
  163. package/docs/examples/dialog-full/no-buttons.vue +18 -18
  164. package/docs/examples/dialog-full/no-header.vue +27 -27
  165. package/docs/examples/dialog-full/steps.vue +71 -71
  166. package/docs/examples/divider/basic.vue +52 -52
  167. package/docs/examples/drawer/basic.vue +35 -35
  168. package/docs/examples/drawer/custom-buttons.vue +34 -34
  169. package/docs/examples/drawer/direction.vue +47 -47
  170. package/docs/examples/drawer/mask.vue +36 -36
  171. package/docs/examples/drawer/no-buttons.vue +20 -20
  172. package/docs/examples/drawer/size.vue +28 -28
  173. package/docs/examples/dynamic-layer/basic.vue +33 -33
  174. package/docs/examples/dynamic-layer/custom-buttons.vue +43 -43
  175. package/docs/examples/dynamic-layer/form.vue +73 -73
  176. package/docs/examples/dynamic-layer/steps.vue +52 -52
  177. package/docs/examples/dynamic-layer/types.vue +40 -40
  178. package/docs/examples/echarts/basic.vue +31 -31
  179. package/docs/examples/echarts/dynamic.vue +43 -43
  180. package/docs/examples/echarts/line.vue +46 -46
  181. package/docs/examples/echarts/pie.vue +44 -44
  182. package/docs/examples/editor/basic.vue +15 -15
  183. package/docs/examples/form/basic.vue +663 -663
  184. package/docs/examples/form/init.vue +76 -76
  185. package/docs/examples/form/master-detail.vue +203 -203
  186. package/docs/examples/form/rule-format.vue +179 -179
  187. package/docs/examples/form/view-table.vue +378 -378
  188. package/docs/examples/guid/basic.vue +10 -10
  189. package/docs/examples/guid/size.vue +13 -13
  190. package/docs/examples/hpanel/basic.vue +79 -79
  191. package/docs/examples/icon/basic.vue +9 -9
  192. package/docs/examples/icon/rotate-flip.vue +9 -9
  193. package/docs/examples/icon/size.vue +7 -7
  194. package/docs/examples/input/basic.vue +10 -10
  195. package/docs/examples/input/clearable.vue +12 -12
  196. package/docs/examples/input/disabled.vue +6 -6
  197. package/docs/examples/input/icon.vue +23 -23
  198. package/docs/examples/input/password.vue +18 -18
  199. package/docs/examples/input/size.vue +13 -13
  200. package/docs/examples/input/textarea.vue +25 -25
  201. package/docs/examples/input/word-limit.vue +28 -28
  202. package/docs/examples/input-button/basic.vue +33 -33
  203. package/docs/examples/input-cards/basic.vue +79 -79
  204. package/docs/examples/input-code/basic.vue +29 -29
  205. package/docs/examples/input-color/basic.vue +10 -10
  206. package/docs/examples/input-color/disabled.vue +13 -13
  207. package/docs/examples/input-color/format.vue +17 -17
  208. package/docs/examples/input-color/no-alpha.vue +13 -13
  209. package/docs/examples/input-color/only-button.vue +15 -15
  210. package/docs/examples/input-color/predefine.vue +31 -31
  211. package/docs/examples/input-color/size.vue +15 -15
  212. package/docs/examples/input-layer/basic.vue +85 -85
  213. package/docs/examples/input-layer/render-vnode-page.vue +160 -160
  214. package/docs/examples/input-layer/render-vnode.vue +127 -127
  215. package/docs/examples/input-rows/basic.vue +73 -73
  216. package/docs/examples/input-rows/drag.vue +48 -48
  217. package/docs/examples/input-rows/layer-form.vue +85 -85
  218. package/docs/examples/input-rows/nested.vue +91 -91
  219. package/docs/examples/input-tag/basic.vue +27 -27
  220. package/docs/examples/input-tag/colors.vue +23 -23
  221. package/docs/examples/input-tag/readonly.vue +17 -17
  222. package/docs/examples/layer/basic.vue +43 -43
  223. package/docs/examples/layer/custom-buttons.vue +61 -61
  224. package/docs/examples/layer/drawer.vue +37 -37
  225. package/docs/examples/layer/full.vue +38 -38
  226. package/docs/examples/layer/modal.vue +34 -34
  227. package/docs/examples/layer/steps.vue +46 -46
  228. package/docs/examples/layer-form/basic.vue +76 -76
  229. package/docs/examples/layer-form/config.vue +82 -82
  230. package/docs/examples/layer-form/size.vue +72 -72
  231. package/docs/examples/layout/basic.vue +36 -36
  232. package/docs/examples/layout/custom-size.vue +50 -50
  233. package/docs/examples/layout/disable-move.vue +37 -37
  234. package/docs/examples/layout/hide-mid-when-narrow.vue +96 -96
  235. package/docs/examples/layout/min-size.vue +73 -73
  236. package/docs/examples/layout/percent-size.vue +80 -80
  237. package/docs/examples/layout/simple.vue +22 -22
  238. package/docs/examples/layout/top-side.vue +34 -34
  239. package/docs/examples/map/basic.vue +22 -22
  240. package/docs/examples/menu/basic.vue +58 -58
  241. package/docs/examples/menu/collapsed.vue +49 -49
  242. package/docs/examples/menu/horizontal.vue +44 -44
  243. package/docs/examples/menu/selection-test.vue +104 -104
  244. package/docs/examples/menu/theme.vue +46 -46
  245. package/docs/examples/menu/vertical.vue +46 -46
  246. package/docs/examples/number/advanced.vue +143 -143
  247. package/docs/examples/number/basic.vue +63 -63
  248. package/docs/examples/number/disabled.vue +49 -49
  249. package/docs/examples/number/size.vue +42 -42
  250. package/docs/examples/number/slots.vue +123 -123
  251. package/docs/examples/number/step-strictly.vue +41 -41
  252. package/docs/examples/number/step.vue +47 -47
  253. package/docs/examples/page/basic.vue +41 -41
  254. package/docs/examples/page/code-table-model.vue +428 -428
  255. package/docs/examples/page/dept-user-management.vue +211 -211
  256. package/docs/examples/page/init.vue +87 -87
  257. package/docs/examples/page/log.vue +453 -453
  258. package/docs/examples/page/user-management.vue +313 -313
  259. package/docs/examples/panel/tool-buttons.vue +18 -18
  260. package/docs/examples/radio/basic.vue +17 -17
  261. package/docs/examples/radio/button.vue +17 -17
  262. package/docs/examples/radio/color.vue +18 -18
  263. package/docs/examples/radio/disabled.vue +17 -17
  264. package/docs/examples/radio/size.vue +29 -29
  265. package/docs/examples/rate/basic.vue +24 -24
  266. package/docs/examples/rate/half.vue +24 -24
  267. package/docs/examples/rate/readonly.vue +11 -11
  268. package/docs/examples/rate/text.vue +37 -37
  269. package/docs/examples/select/basic.vue +16 -16
  270. package/docs/examples/select/clearable.vue +22 -22
  271. package/docs/examples/select/disabled.vue +31 -31
  272. package/docs/examples/select/filterable.vue +24 -24
  273. package/docs/examples/select/group.vue +23 -23
  274. package/docs/examples/select/icon.vue +16 -16
  275. package/docs/examples/select/multiple.vue +18 -18
  276. package/docs/examples/select/size.vue +39 -39
  277. package/docs/examples/slider/basic.vue +42 -42
  278. package/docs/examples/slider/disabled.vue +17 -17
  279. package/docs/examples/slider/marks.vue +30 -30
  280. package/docs/examples/slider/size.vue +37 -37
  281. package/docs/examples/slider/tooltip.vue +36 -36
  282. package/docs/examples/slider/vertical.vue +26 -26
  283. package/docs/examples/slider-captcha/basic.vue +44 -44
  284. package/docs/examples/slider-captcha/custom.vue +48 -48
  285. package/docs/examples/switch/basic.vue +16 -16
  286. package/docs/examples/switch/disabled.vue +13 -13
  287. package/docs/examples/switch/loading.vue +13 -13
  288. package/docs/examples/switch/size.vue +15 -15
  289. package/docs/examples/switch/text.vue +13 -13
  290. package/docs/examples/table/action-filter.vue +126 -126
  291. package/docs/examples/table/actions.vue +116 -116
  292. package/docs/examples/table/add-row.vue +103 -103
  293. package/docs/examples/table/basic.vue +168 -168
  294. package/docs/examples/table/checkbox-layout.vue +68 -68
  295. package/docs/examples/table/column-filter.vue +96 -0
  296. package/docs/examples/table/custom-layout.vue +115 -115
  297. package/docs/examples/table/dynamic-type.vue +73 -73
  298. package/docs/examples/table/editable.vue +262 -262
  299. package/docs/examples/table/field-selection.vue +87 -87
  300. package/docs/examples/table/frozen-column.vue +140 -140
  301. package/docs/examples/table/height-mode.vue +99 -99
  302. package/docs/examples/table/icon.vue +85 -85
  303. package/docs/examples/table/layer-form.vue +133 -133
  304. package/docs/examples/table/link.vue +66 -66
  305. package/docs/examples/table/multiple-disabled.vue +112 -112
  306. package/docs/examples/table/multiple.vue +188 -188
  307. package/docs/examples/table/pagination.vue +151 -151
  308. package/docs/examples/table/row-drag.vue +67 -67
  309. package/docs/examples/table/single-selection.vue +64 -64
  310. package/docs/examples/table/sub-table-lazy.vue +97 -97
  311. package/docs/examples/table/sub-table.vue +103 -103
  312. package/docs/examples/table/tag.vue +43 -43
  313. package/docs/examples/table/tree-column.vue +119 -119
  314. package/docs/examples/table/tree-data.vue +141 -141
  315. package/docs/examples/table/tree-default-expand-all.vue +60 -60
  316. package/docs/examples/table/tree-lazy.vue +80 -80
  317. package/docs/examples/table/tree-set-selection.vue +75 -75
  318. package/docs/examples/table-panel/basic.vue +229 -229
  319. package/docs/examples/table-panel/batch-operations.vue +286 -286
  320. package/docs/examples/table-panel/button-visibility.vue +88 -88
  321. package/docs/examples/table-panel/column-filter.vue +116 -0
  322. package/docs/examples/table-panel/filter.vue +219 -219
  323. package/docs/examples/table-panel/get-selection.vue +111 -111
  324. package/docs/examples/table-panel/mask.vue +151 -151
  325. package/docs/examples/table-panel/model-value.vue +87 -87
  326. package/docs/examples/table-panel/multiple-selection.vue +243 -243
  327. package/docs/examples/table-panel/pagination.vue +133 -133
  328. package/docs/examples/table-panel/search-list.vue +207 -207
  329. package/docs/examples/table-panel/sub-table-lazy.vue +118 -118
  330. package/docs/examples/table-panel/tree-parent-key.vue +67 -67
  331. package/docs/examples/tabs/basic.vue +98 -98
  332. package/docs/examples/time/base.vue +67 -67
  333. package/docs/examples/title/basic.vue +87 -87
  334. package/docs/examples/tree/accordion.vue +46 -46
  335. package/docs/examples/tree/basic.vue +50 -50
  336. package/docs/examples/tree/buttons.vue +53 -53
  337. package/docs/examples/tree/checkable.vue +52 -52
  338. package/docs/examples/tree/custom-keys.vue +39 -39
  339. package/docs/examples/tree/default-expanded.vue +52 -52
  340. package/docs/examples/tree/draggable.vue +29 -29
  341. package/docs/examples/tree/expand-on-click.vue +39 -39
  342. package/docs/examples/tree/flat-data.vue +20 -20
  343. package/docs/examples/tree/icon.vue +40 -40
  344. package/docs/examples/tree/load-data.vue +37 -37
  345. package/docs/examples/tree/methods.vue +74 -74
  346. package/docs/examples/tree/theme.vue +33 -33
  347. package/docs/examples/tree-select/basic.vue +47 -47
  348. package/docs/examples/upload/accept.vue +31 -31
  349. package/docs/examples/upload/basic.vue +12 -12
  350. package/docs/examples/upload/drag.vue +11 -11
  351. package/docs/examples/upload/image.vue +17 -17
  352. package/docs/examples/upload/limit.vue +20 -20
  353. package/docs/examples/upload/multiple.vue +17 -17
  354. package/docs/examples/upload/readonly.vue +17 -17
  355. package/docs/examples/utils/cipher.vue +160 -160
  356. package/docs/examples/utils/common.vue +153 -153
  357. package/docs/examples/utils/date.vue +56 -56
  358. package/docs/examples/utils/dom.vue +52 -52
  359. package/docs/examples/utils/is.vue +70 -70
  360. package/docs/examples/workflow/basic.vue +265 -265
  361. package/docs/examples/workflow-viewer/basic.vue +248 -248
  362. package/package.json +23 -23
@@ -1,112 +1,112 @@
1
- # DialogFull 全屏弹窗
2
-
3
- 全屏模态对话框,在整个屏幕中显示内容,适用于复杂表单或大量内容展示的场景。
4
-
5
- ## 基础用法
6
-
7
- 最简单的用法。
8
-
9
- <Demo :source-code="dialogFullBasicCode">
10
- <template #source>
11
- <dialog-full-basic />
12
- </template>
13
- <template #description>
14
- 基础的全屏弹窗,占据整个屏幕。使用 `v-model:visible` 控制显示隐藏。
15
- </template>
16
- </Demo>
17
-
18
- ## 无按钮
19
-
20
- 设置 `hasBtns` 为 `false` 可以隐藏所有操作按钮。
21
-
22
- <Demo :source-code="dialogFullNoButtonsCode">
23
- <template #source>
24
- <dialog-full-no-buttons />
25
- </template>
26
- <template #description>
27
- 隐藏所有操作按钮,适用于只展示内容不需要操作的场景。
28
- </template>
29
- </Demo>
30
-
31
- ## 无表头
32
-
33
- 通过隐藏按钮和关闭按钮可以实现无表头效果。
34
-
35
- <Demo :source-code="dialogFullNoHeaderCode">
36
- <template #source>
37
- <dialog-full-no-header />
38
- </template>
39
- <template #description>
40
- 设置 `has-header` 和 `showCloseBtn` 为 `false` 可以隐藏表头区域和关闭按钮,适用于需要完全自定义布局的场景。
41
- </template>
42
- </Demo>
43
-
44
- ## 自定义按钮
45
-
46
- 通过 `buttons` 属性可以自定义顶部操作按钮。
47
-
48
- <Demo :source-code="dialogFullCustomButtonsCode">
49
- <template #source>
50
- <dialog-full-custom-buttons />
51
- </template>
52
- <template #description>
53
- 使用 `buttons` 属性配置自定义按钮,支持设置按钮类型、样式、图标、点击事件等。
54
- </template>
55
- </Demo>
56
-
57
- ## 步骤弹窗
58
-
59
- 通过 `isStep` 属性可以创建带步骤条的弹窗。
60
-
61
- <Demo :source-code="dialogFullStepsCode">
62
- <template #source>
63
- <dialog-full-steps />
64
- </template>
65
- <template #description>
66
- 适用于分步骤的表单或流程,支持步骤校验。使用 `v-model:stepActive` 控制当前步骤,使用 `validateSteps` 进行步骤校验。
67
- </template>
68
- </Demo>
69
-
70
- ## API
71
-
72
- ### 属性
73
-
74
- <ApiTable :data="dialogFullApi" componentName="dialog-full" />
75
-
76
- ### 事件
77
-
78
- | 事件名 | 说明 | 回调参数 |
79
- | ----------------- | ---------------------- | ------------------------------------------------ |
80
- | update:visible | 弹窗显示状态变化时触发 | `(visible: boolean)` |
81
- | update:stepActive | 步骤变化时触发 | `(stepActive: number)` |
82
- | cancel | 点击关闭按钮时触发 | - |
83
- | ok | 点击确定按钮时触发 | `(showLoading: Function, hideLoading: Function)` |
84
- | closed | 弹窗关闭动画结束后触发 | - |
85
-
86
- ### 插槽
87
-
88
- | 插槽名 | 说明 |
89
- | ------- | ------------ |
90
- | default | 弹窗内容区域 |
91
-
92
- ### 方法
93
-
94
- | 方法名 | 说明 | 参数 |
95
- | ----------- | ------------ | ----------------- |
96
- | showLoading | 显示加载状态 | `(text?: string)` |
97
- | hideLoading | 隐藏加载状态 | - |
98
-
99
- <script setup>
100
- import DialogFullBasic from '../examples/dialog-full/basic.vue'
101
- import DialogFullNoHeader from '../examples/dialog-full/no-header.vue'
102
- import DialogFullCustomButtons from '../examples/dialog-full/custom-buttons.vue'
103
- import DialogFullSteps from '../examples/dialog-full/steps.vue'
104
- import DialogFullNoButtons from '../examples/dialog-full/no-buttons.vue'
105
- import dialogFullApi from './meta/dialog-full'
106
-
107
- import dialogFullBasicCode from '../examples/dialog-full/basic.vue?raw'
108
- import dialogFullNoHeaderCode from '../examples/dialog-full/no-header.vue?raw'
109
- import dialogFullCustomButtonsCode from '../examples/dialog-full/custom-buttons.vue?raw'
110
- import dialogFullStepsCode from '../examples/dialog-full/steps.vue?raw'
111
- import dialogFullNoButtonsCode from '../examples/dialog-full/no-buttons.vue?raw'
112
- </script>
1
+ # DialogFull 全屏弹窗
2
+
3
+ 全屏模态对话框,在整个屏幕中显示内容,适用于复杂表单或大量内容展示的场景。
4
+
5
+ ## 基础用法
6
+
7
+ 最简单的用法。
8
+
9
+ <Demo :source-code="dialogFullBasicCode">
10
+ <template #source>
11
+ <dialog-full-basic />
12
+ </template>
13
+ <template #description>
14
+ 基础的全屏弹窗,占据整个屏幕。使用 `v-model:visible` 控制显示隐藏。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 无按钮
19
+
20
+ 设置 `hasBtns` 为 `false` 可以隐藏所有操作按钮。
21
+
22
+ <Demo :source-code="dialogFullNoButtonsCode">
23
+ <template #source>
24
+ <dialog-full-no-buttons />
25
+ </template>
26
+ <template #description>
27
+ 隐藏所有操作按钮,适用于只展示内容不需要操作的场景。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## 无表头
32
+
33
+ 通过隐藏按钮和关闭按钮可以实现无表头效果。
34
+
35
+ <Demo :source-code="dialogFullNoHeaderCode">
36
+ <template #source>
37
+ <dialog-full-no-header />
38
+ </template>
39
+ <template #description>
40
+ 设置 `has-header` 和 `showCloseBtn` 为 `false` 可以隐藏表头区域和关闭按钮,适用于需要完全自定义布局的场景。
41
+ </template>
42
+ </Demo>
43
+
44
+ ## 自定义按钮
45
+
46
+ 通过 `buttons` 属性可以自定义顶部操作按钮。
47
+
48
+ <Demo :source-code="dialogFullCustomButtonsCode">
49
+ <template #source>
50
+ <dialog-full-custom-buttons />
51
+ </template>
52
+ <template #description>
53
+ 使用 `buttons` 属性配置自定义按钮,支持设置按钮类型、样式、图标、点击事件等。
54
+ </template>
55
+ </Demo>
56
+
57
+ ## 步骤弹窗
58
+
59
+ 通过 `isStep` 属性可以创建带步骤条的弹窗。
60
+
61
+ <Demo :source-code="dialogFullStepsCode">
62
+ <template #source>
63
+ <dialog-full-steps />
64
+ </template>
65
+ <template #description>
66
+ 适用于分步骤的表单或流程,支持步骤校验。使用 `v-model:stepActive` 控制当前步骤,使用 `validateSteps` 进行步骤校验。
67
+ </template>
68
+ </Demo>
69
+
70
+ ## API
71
+
72
+ ### 属性
73
+
74
+ <ApiTable :data="dialogFullApi" componentName="dialog-full" />
75
+
76
+ ### 事件
77
+
78
+ | 事件名 | 说明 | 回调参数 |
79
+ | ----------------- | ---------------------- | ------------------------------------------------ |
80
+ | update:visible | 弹窗显示状态变化时触发 | `(visible: boolean)` |
81
+ | update:stepActive | 步骤变化时触发 | `(stepActive: number)` |
82
+ | cancel | 点击关闭按钮时触发 | - |
83
+ | ok | 点击确定按钮时触发 | `(showLoading: Function, hideLoading: Function)` |
84
+ | closed | 弹窗关闭动画结束后触发 | - |
85
+
86
+ ### 插槽
87
+
88
+ | 插槽名 | 说明 |
89
+ | ------- | ------------ |
90
+ | default | 弹窗内容区域 |
91
+
92
+ ### 方法
93
+
94
+ | 方法名 | 说明 | 参数 |
95
+ | ----------- | ------------ | ----------------- |
96
+ | showLoading | 显示加载状态 | `(text?: string)` |
97
+ | hideLoading | 隐藏加载状态 | - |
98
+
99
+ <script setup>
100
+ import DialogFullBasic from '../examples/dialog-full/basic.vue'
101
+ import DialogFullNoHeader from '../examples/dialog-full/no-header.vue'
102
+ import DialogFullCustomButtons from '../examples/dialog-full/custom-buttons.vue'
103
+ import DialogFullSteps from '../examples/dialog-full/steps.vue'
104
+ import DialogFullNoButtons from '../examples/dialog-full/no-buttons.vue'
105
+ import dialogFullApi from './meta/dialog-full'
106
+
107
+ import dialogFullBasicCode from '../examples/dialog-full/basic.vue?raw'
108
+ import dialogFullNoHeaderCode from '../examples/dialog-full/no-header.vue?raw'
109
+ import dialogFullCustomButtonsCode from '../examples/dialog-full/custom-buttons.vue?raw'
110
+ import dialogFullStepsCode from '../examples/dialog-full/steps.vue?raw'
111
+ import dialogFullNoButtonsCode from '../examples/dialog-full/no-buttons.vue?raw'
112
+ </script>
@@ -1,127 +1,127 @@
1
- # Dialog 弹窗
2
-
3
- 模态对话框,在浮层中显示内容,支持拖拽、缩放等功能。
4
-
5
- ## 基础用法
6
-
7
- 最简单的用法。
8
-
9
- <Demo :source-code="dialogBasicCode">
10
- <template #source>
11
- <dialog-basic />
12
- </template>
13
- <template #description>
14
- 基础的弹窗,支持拖拽、缩放等功能。使用 `v-model:visible` 控制显示隐藏。
15
- </template>
16
- </Demo>
17
-
18
- ## 不同尺寸
19
-
20
- 通过 `width` 和 `height` 属性可以设置弹窗的尺寸。
21
-
22
- <Demo :source-code="dialogSizeCode">
23
- <template #source>
24
- <dialog-size />
25
- </template>
26
- <template #description>
27
- 支持自定义弹窗的宽度和高度,单位为像素。设置 `minWidth` 和 `minHeight` 可限制最小尺寸。
28
- </template>
29
- </Demo>
30
-
31
- ## 全屏显示
32
-
33
- 使用全屏显示弹窗。
34
-
35
- <Demo :source-code="dialogFullscreenCode">
36
- <template #source>
37
- <dialog-fullscreen />
38
- </template>
39
- <template #description>
40
- 可以通过缩放控制实现全屏显示效果。
41
- </template>
42
- </Demo>
43
-
44
- ## 自定义按钮
45
-
46
- 通过 `buttons` 属性可以自定义底部按钮。
47
-
48
- <Demo :source-code="dialogCustomButtonsCode">
49
- <template #source>
50
- <dialog-custom-buttons />
51
- </template>
52
- <template #description>
53
- 使用 `buttons` 属性配置自定义按钮,支持设置按钮类型、样式、图标、点击事件等。设置 `hasBtns` 为 `false` 可隐藏整个按钮区域。
54
- </template>
55
- </Demo>
56
-
57
- ## 步骤弹窗
58
-
59
- 通过 `isStep` 属性可以创建带步骤条的弹窗。
60
-
61
- <Demo :source-code="dialogStepsCode">
62
- <template #source>
63
- <dialog-steps />
64
- </template>
65
- <template #description>
66
- 适用于分步骤的表单或流程,支持步骤校验。使用 `v-model:stepActive` 控制当前步骤,使用 `validateSteps` 进行步骤校验。
67
- </template>
68
- </Demo>
69
-
70
- ## 无遮罩层
71
-
72
- 设置 `mask` 为 `false` 可以取消遮罩层。
73
-
74
- <Demo :source-code="dialogNoMaskCode">
75
- <template #source>
76
- <dialog-no-mask />
77
- </template>
78
- <template #description>
79
- 无遮罩层的弹窗允许用户与页面其他内容进行交互。
80
- </template>
81
- </Demo>
82
-
83
- ## API
84
-
85
- ### 属性
86
-
87
- <ApiTable :data="dialogApi" componentName="dialog" />
88
-
89
- ### 事件
90
-
91
- | 事件名 | 说明 | 回调参数 |
92
- | ----------------- | ---------------------------- | ------------------------------------------------ |
93
- | update:visible | 弹窗显示状态变化时触发 | `(visible: boolean)` |
94
- | update:stepActive | 步骤变化时触发 | `(stepActive: number)` |
95
- | cancel | 点击取消按钮或关闭按钮时触发 | - |
96
- | ok | 点击确定按钮时触发 | `(showLoading: Function, hideLoading: Function)` |
97
- | closed | 弹窗关闭动画结束后触发 | - |
98
-
99
- ### 插槽
100
-
101
- | 插槽名 | 说明 |
102
- | ------- | ------------ |
103
- | default | 弹窗内容区域 |
104
-
105
- ### 方法
106
-
107
- | 方法名 | 说明 | 参数 |
108
- | ----------- | ------------ | ----------------- |
109
- | showLoading | 显示加载状态 | `(text?: string)` |
110
- | hideLoading | 隐藏加载状态 | - |
111
-
112
- <script setup>
113
- import DialogBasic from '../examples/dialog/basic.vue'
114
- import DialogSize from '../examples/dialog/size.vue'
115
- import DialogFullscreen from '../examples/dialog/fullscreen.vue'
116
- import DialogCustomButtons from '../examples/dialog/custom-buttons.vue'
117
- import DialogSteps from '../examples/dialog/steps.vue'
118
- import DialogNoMask from '../examples/dialog/no-mask.vue'
119
- import dialogApi from './meta/dialog'
120
-
121
- import dialogBasicCode from '../examples/dialog/basic.vue?raw'
122
- import dialogSizeCode from '../examples/dialog/size.vue?raw'
123
- import dialogFullscreenCode from '../examples/dialog/fullscreen.vue?raw'
124
- import dialogCustomButtonsCode from '../examples/dialog/custom-buttons.vue?raw'
125
- import dialogStepsCode from '../examples/dialog/steps.vue?raw'
126
- import dialogNoMaskCode from '../examples/dialog/no-mask.vue?raw'
127
- </script>
1
+ # Dialog 弹窗
2
+
3
+ 模态对话框,在浮层中显示内容,支持拖拽、缩放等功能。
4
+
5
+ ## 基础用法
6
+
7
+ 最简单的用法。
8
+
9
+ <Demo :source-code="dialogBasicCode">
10
+ <template #source>
11
+ <dialog-basic />
12
+ </template>
13
+ <template #description>
14
+ 基础的弹窗,支持拖拽、缩放等功能。使用 `v-model:visible` 控制显示隐藏。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 不同尺寸
19
+
20
+ 通过 `width` 和 `height` 属性可以设置弹窗的尺寸。
21
+
22
+ <Demo :source-code="dialogSizeCode">
23
+ <template #source>
24
+ <dialog-size />
25
+ </template>
26
+ <template #description>
27
+ 支持自定义弹窗的宽度和高度,单位为像素。设置 `minWidth` 和 `minHeight` 可限制最小尺寸。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## 全屏显示
32
+
33
+ 使用全屏显示弹窗。
34
+
35
+ <Demo :source-code="dialogFullscreenCode">
36
+ <template #source>
37
+ <dialog-fullscreen />
38
+ </template>
39
+ <template #description>
40
+ 可以通过缩放控制实现全屏显示效果。
41
+ </template>
42
+ </Demo>
43
+
44
+ ## 自定义按钮
45
+
46
+ 通过 `buttons` 属性可以自定义底部按钮。
47
+
48
+ <Demo :source-code="dialogCustomButtonsCode">
49
+ <template #source>
50
+ <dialog-custom-buttons />
51
+ </template>
52
+ <template #description>
53
+ 使用 `buttons` 属性配置自定义按钮,支持设置按钮类型、样式、图标、点击事件等。设置 `hasBtns` 为 `false` 可隐藏整个按钮区域。
54
+ </template>
55
+ </Demo>
56
+
57
+ ## 步骤弹窗
58
+
59
+ 通过 `isStep` 属性可以创建带步骤条的弹窗。
60
+
61
+ <Demo :source-code="dialogStepsCode">
62
+ <template #source>
63
+ <dialog-steps />
64
+ </template>
65
+ <template #description>
66
+ 适用于分步骤的表单或流程,支持步骤校验。使用 `v-model:stepActive` 控制当前步骤,使用 `validateSteps` 进行步骤校验。
67
+ </template>
68
+ </Demo>
69
+
70
+ ## 无遮罩层
71
+
72
+ 设置 `mask` 为 `false` 可以取消遮罩层。
73
+
74
+ <Demo :source-code="dialogNoMaskCode">
75
+ <template #source>
76
+ <dialog-no-mask />
77
+ </template>
78
+ <template #description>
79
+ 无遮罩层的弹窗允许用户与页面其他内容进行交互。
80
+ </template>
81
+ </Demo>
82
+
83
+ ## API
84
+
85
+ ### 属性
86
+
87
+ <ApiTable :data="dialogApi" componentName="dialog" />
88
+
89
+ ### 事件
90
+
91
+ | 事件名 | 说明 | 回调参数 |
92
+ | ----------------- | ---------------------------- | ------------------------------------------------ |
93
+ | update:visible | 弹窗显示状态变化时触发 | `(visible: boolean)` |
94
+ | update:stepActive | 步骤变化时触发 | `(stepActive: number)` |
95
+ | cancel | 点击取消按钮或关闭按钮时触发 | - |
96
+ | ok | 点击确定按钮时触发 | `(showLoading: Function, hideLoading: Function)` |
97
+ | closed | 弹窗关闭动画结束后触发 | - |
98
+
99
+ ### 插槽
100
+
101
+ | 插槽名 | 说明 |
102
+ | ------- | ------------ |
103
+ | default | 弹窗内容区域 |
104
+
105
+ ### 方法
106
+
107
+ | 方法名 | 说明 | 参数 |
108
+ | ----------- | ------------ | ----------------- |
109
+ | showLoading | 显示加载状态 | `(text?: string)` |
110
+ | hideLoading | 隐藏加载状态 | - |
111
+
112
+ <script setup>
113
+ import DialogBasic from '../examples/dialog/basic.vue'
114
+ import DialogSize from '../examples/dialog/size.vue'
115
+ import DialogFullscreen from '../examples/dialog/fullscreen.vue'
116
+ import DialogCustomButtons from '../examples/dialog/custom-buttons.vue'
117
+ import DialogSteps from '../examples/dialog/steps.vue'
118
+ import DialogNoMask from '../examples/dialog/no-mask.vue'
119
+ import dialogApi from './meta/dialog'
120
+
121
+ import dialogBasicCode from '../examples/dialog/basic.vue?raw'
122
+ import dialogSizeCode from '../examples/dialog/size.vue?raw'
123
+ import dialogFullscreenCode from '../examples/dialog/fullscreen.vue?raw'
124
+ import dialogCustomButtonsCode from '../examples/dialog/custom-buttons.vue?raw'
125
+ import dialogStepsCode from '../examples/dialog/steps.vue?raw'
126
+ import dialogNoMaskCode from '../examples/dialog/no-mask.vue?raw'
127
+ </script>
@@ -1,24 +1,24 @@
1
- # Divider 分隔符
2
-
3
- 用于分隔不同的内容区域。支持自定义文本、颜色、大小和样式等功能。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="dividerBasicCode">
8
- <template #source>
9
- <divider-basic />
10
- </template>
11
- <template #description>
12
- 通过 `content` 属性添加文本,`contentPosition` 属性控制文本对齐方式。
13
- </template>
14
- </Demo>
15
-
16
- ## API
17
-
18
- <ApiTable :data="dividerApi" componentName="divider" />
19
-
20
- <script setup>
21
- import DividerBasic from '../examples/divider/basic.vue'
22
- import dividerApi from './meta/divider'
23
- import dividerBasicCode from '../examples/divider/basic.vue?raw'
24
- </script>
1
+ # Divider 分隔符
2
+
3
+ 用于分隔不同的内容区域。支持自定义文本、颜色、大小和样式等功能。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="dividerBasicCode">
8
+ <template #source>
9
+ <divider-basic />
10
+ </template>
11
+ <template #description>
12
+ 通过 `content` 属性添加文本,`contentPosition` 属性控制文本对齐方式。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## API
17
+
18
+ <ApiTable :data="dividerApi" componentName="divider" />
19
+
20
+ <script setup>
21
+ import DividerBasic from '../examples/divider/basic.vue'
22
+ import dividerApi from './meta/divider'
23
+ import dividerBasicCode from '../examples/divider/basic.vue?raw'
24
+ </script>