@a2simcode/ui 0.0.317 → 0.0.319

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 (382) 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/menu/index.d.ts +15 -0
  6. package/dist/components/menu/src/hmenu/index.vue.d.ts +15 -0
  7. package/dist/components/menu/src/imenu/index.vue.d.ts +15 -0
  8. package/dist/components/menu/src/menu-item/index.vue.d.ts +15 -0
  9. package/dist/components/menu/src/menu.vue.d.ts +15 -0
  10. package/dist/components/menu/src/sub-menu/index.vue.d.ts +17 -1
  11. package/dist/components/menu/src/vmenu/index.vue.d.ts +15 -0
  12. package/dist/simcode-ui.es.js +2301 -2246
  13. package/dist/simcode-ui.umd.js +2 -2
  14. package/dist/stats.html +1 -1
  15. package/dist/ui.css +1 -1
  16. package/docs/components/autocomplete.md +89 -89
  17. package/docs/components/barcode.md +101 -101
  18. package/docs/components/button-select.md +24 -24
  19. package/docs/components/button.md +117 -117
  20. package/docs/components/buttons.md +119 -119
  21. package/docs/components/card-list.md +38 -38
  22. package/docs/components/cascader-select.md +114 -114
  23. package/docs/components/checkbox.md +114 -114
  24. package/docs/components/code-mirror.md +85 -85
  25. package/docs/components/collapse.md +26 -26
  26. package/docs/components/comp.md +106 -106
  27. package/docs/components/count-up.md +24 -24
  28. package/docs/components/count.md +24 -24
  29. package/docs/components/data-panel.md +24 -24
  30. package/docs/components/date.md +76 -76
  31. package/docs/components/dialog-full.md +112 -112
  32. package/docs/components/dialog.md +127 -127
  33. package/docs/components/divider.md +24 -24
  34. package/docs/components/drawer.md +127 -127
  35. package/docs/components/dynamic-layer.md +118 -118
  36. package/docs/components/echarts.md +72 -72
  37. package/docs/components/editor.md +24 -24
  38. package/docs/components/form.md +87 -87
  39. package/docs/components/guid.md +39 -39
  40. package/docs/components/hpanel.md +24 -24
  41. package/docs/components/icon.md +56 -56
  42. package/docs/components/input-button.md +24 -24
  43. package/docs/components/input-code.md +24 -24
  44. package/docs/components/input-color.md +114 -114
  45. package/docs/components/input-layer.md +56 -56
  46. package/docs/components/input-rows.md +370 -370
  47. package/docs/components/input-tag.md +50 -50
  48. package/docs/components/input.md +129 -129
  49. package/docs/components/layer-form.md +61 -61
  50. package/docs/components/layer.md +127 -127
  51. package/docs/components/layout.md +132 -132
  52. package/docs/components/map.md +24 -24
  53. package/docs/components/menu.md +121 -121
  54. package/docs/components/meta/button.ts +212 -212
  55. package/docs/components/meta/buttons.ts +81 -81
  56. package/docs/components/meta/card-list.ts +210 -210
  57. package/docs/components/meta/code-mirror.ts +108 -108
  58. package/docs/components/meta/comp.ts +235 -235
  59. package/docs/components/meta/date.ts +277 -277
  60. package/docs/components/meta/echarts.ts +64 -64
  61. package/docs/components/meta/form-item.ts +62 -62
  62. package/docs/components/meta/form.ts +181 -181
  63. package/docs/components/meta/input-button.ts +175 -175
  64. package/docs/components/meta/input-cards.ts +112 -112
  65. package/docs/components/meta/input-code.ts +161 -161
  66. package/docs/components/meta/input-color.ts +243 -243
  67. package/docs/components/meta/input-rows.ts +119 -119
  68. package/docs/components/meta/layer-form.ts +74 -74
  69. package/docs/components/meta/map.ts +68 -68
  70. package/docs/components/meta/menu.ts +6 -0
  71. package/docs/components/meta/panel.ts +152 -152
  72. package/docs/components/meta/radio.ts +55 -55
  73. package/docs/components/meta/select.ts +289 -289
  74. package/docs/components/meta/slider.ts +270 -270
  75. package/docs/components/meta/table-panel.ts +343 -343
  76. package/docs/components/meta/table.ts +495 -495
  77. package/docs/components/meta/tabs.ts +146 -146
  78. package/docs/components/meta/title.ts +91 -91
  79. package/docs/components/meta/tree-select.ts +220 -220
  80. package/docs/components/meta/tree.ts +225 -225
  81. package/docs/components/meta/vpanel.ts +19 -19
  82. package/docs/components/meta/workflow-viewer.ts +55 -55
  83. package/docs/components/number.md +124 -124
  84. package/docs/components/page.md +102 -102
  85. package/docs/components/panel.md +37 -37
  86. package/docs/components/radio.md +87 -87
  87. package/docs/components/rate.md +71 -71
  88. package/docs/components/select.md +149 -149
  89. package/docs/components/slider-captcha.md +41 -41
  90. package/docs/components/slider.md +101 -101
  91. package/docs/components/switch.md +90 -90
  92. package/docs/components/table-panel.md +342 -342
  93. package/docs/components/table.md +526 -526
  94. package/docs/components/tabs.md +26 -26
  95. package/docs/components/title.md +24 -24
  96. package/docs/components/tree.md +222 -222
  97. package/docs/components/upload.md +117 -117
  98. package/docs/components/workflow-viewer.md +21 -21
  99. package/docs/components/workflow.md +21 -21
  100. package/docs/examples/autocomplete/advanced.vue +35 -35
  101. package/docs/examples/autocomplete/basic.vue +32 -32
  102. package/docs/examples/autocomplete/clearable.vue +33 -33
  103. package/docs/examples/autocomplete/custom-template.vue +49 -49
  104. package/docs/examples/autocomplete/disabled.vue +33 -33
  105. package/docs/examples/autocomplete/icon.vue +37 -37
  106. package/docs/examples/barcode/all-types.vue +380 -380
  107. package/docs/examples/barcode/basic.vue +14 -14
  108. package/docs/examples/barcode/props-appearance.vue +243 -243
  109. package/docs/examples/barcode/props-geometry.vue +143 -143
  110. package/docs/examples/barcode/props-logic.vue +216 -216
  111. package/docs/examples/barcode/props-symbology.vue +199 -199
  112. package/docs/examples/barcode/props-text.vue +268 -268
  113. package/docs/examples/button/basic.vue +7 -7
  114. package/docs/examples/button/disabled.vue +42 -42
  115. package/docs/examples/button/loading.vue +6 -6
  116. package/docs/examples/button/shape.vue +7 -7
  117. package/docs/examples/button/size.vue +14 -14
  118. package/docs/examples/button/status.vue +34 -34
  119. package/docs/examples/button/type.vue +10 -10
  120. package/docs/examples/button-select/basic.vue +19 -19
  121. package/docs/examples/buttons/basic.vue +62 -62
  122. package/docs/examples/buttons/disabled.vue +36 -36
  123. package/docs/examples/buttons/dropdown.vue +63 -63
  124. package/docs/examples/buttons/group.vue +52 -52
  125. package/docs/examples/buttons/link.vue +47 -47
  126. package/docs/examples/buttons/popup.vue +39 -39
  127. package/docs/examples/buttons/size.vue +45 -45
  128. package/docs/examples/card-list/basic.vue +70 -70
  129. package/docs/examples/card-list/selection-pagination.vue +69 -69
  130. package/docs/examples/cascader-select/basic.vue +28 -28
  131. package/docs/examples/cascader-select/clearable.vue +34 -34
  132. package/docs/examples/cascader-select/disabled.vue +43 -43
  133. package/docs/examples/cascader-select/filterable.vue +37 -37
  134. package/docs/examples/cascader-select/methods.vue +84 -84
  135. package/docs/examples/cascader-select/multiple.vue +38 -38
  136. package/docs/examples/cascader-select/slot.vue +45 -45
  137. package/docs/examples/checkbox/basic.vue +18 -18
  138. package/docs/examples/checkbox/button.vue +19 -19
  139. package/docs/examples/checkbox/color.vue +25 -25
  140. package/docs/examples/checkbox/disabled.vue +17 -17
  141. package/docs/examples/checkbox/min-max.vue +20 -20
  142. package/docs/examples/checkbox/mixed.vue +56 -56
  143. package/docs/examples/checkbox/size.vue +28 -28
  144. package/docs/examples/code-mirror/basic.vue +11 -11
  145. package/docs/examples/code-mirror/events.vue +42 -42
  146. package/docs/examples/code-mirror/height.vue +25 -25
  147. package/docs/examples/code-mirror/mode.vue +33 -33
  148. package/docs/examples/code-mirror/readonly.vue +14 -14
  149. package/docs/examples/collapse/basic.vue +82 -82
  150. package/docs/examples/comp/basic.vue +7 -7
  151. package/docs/examples/comp/collapse.vue +38 -38
  152. package/docs/examples/comp/table-merge-rows.vue +77 -77
  153. package/docs/examples/comp/table-row-fixed-merge.vue +105 -105
  154. package/docs/examples/comp/tabs.vue +38 -38
  155. package/docs/examples/count/basic.vue +101 -101
  156. package/docs/examples/count-up/basic.vue +89 -89
  157. package/docs/examples/data-panel/basic.vue +110 -110
  158. package/docs/examples/date/basic.vue +73 -73
  159. package/docs/examples/date/default-value.vue +59 -59
  160. package/docs/examples/date/format.vue +75 -75
  161. package/docs/examples/date/range.vue +66 -66
  162. package/docs/examples/date/types.vue +79 -79
  163. package/docs/examples/decorated-title/basic.vue +31 -31
  164. package/docs/examples/dialog/basic.vue +36 -36
  165. package/docs/examples/dialog/custom-buttons.vue +44 -44
  166. package/docs/examples/dialog/fullscreen.vue +23 -23
  167. package/docs/examples/dialog/no-mask.vue +17 -17
  168. package/docs/examples/dialog/size.vue +44 -44
  169. package/docs/examples/dialog/steps.vue +57 -57
  170. package/docs/examples/dialog-full/basic.vue +29 -29
  171. package/docs/examples/dialog-full/custom-buttons.vue +45 -45
  172. package/docs/examples/dialog-full/no-buttons.vue +18 -18
  173. package/docs/examples/dialog-full/no-header.vue +27 -27
  174. package/docs/examples/dialog-full/steps.vue +71 -71
  175. package/docs/examples/divider/basic.vue +52 -52
  176. package/docs/examples/drawer/basic.vue +35 -35
  177. package/docs/examples/drawer/custom-buttons.vue +34 -34
  178. package/docs/examples/drawer/direction.vue +47 -47
  179. package/docs/examples/drawer/mask.vue +36 -36
  180. package/docs/examples/drawer/no-buttons.vue +20 -20
  181. package/docs/examples/drawer/size.vue +28 -28
  182. package/docs/examples/dynamic-layer/basic.vue +33 -33
  183. package/docs/examples/dynamic-layer/custom-buttons.vue +43 -43
  184. package/docs/examples/dynamic-layer/form.vue +73 -73
  185. package/docs/examples/dynamic-layer/steps.vue +52 -52
  186. package/docs/examples/dynamic-layer/types.vue +40 -40
  187. package/docs/examples/echarts/basic.vue +31 -31
  188. package/docs/examples/echarts/dynamic.vue +43 -43
  189. package/docs/examples/echarts/line.vue +46 -46
  190. package/docs/examples/echarts/pie.vue +44 -44
  191. package/docs/examples/editor/basic.vue +15 -15
  192. package/docs/examples/form/basic.vue +688 -688
  193. package/docs/examples/form/init.vue +76 -76
  194. package/docs/examples/form/master-detail.vue +203 -203
  195. package/docs/examples/form/rule-format.vue +179 -179
  196. package/docs/examples/form/view-table.vue +378 -378
  197. package/docs/examples/guid/basic.vue +10 -10
  198. package/docs/examples/guid/size.vue +13 -13
  199. package/docs/examples/hpanel/basic.vue +79 -79
  200. package/docs/examples/icon/basic.vue +9 -9
  201. package/docs/examples/icon/rotate-flip.vue +9 -9
  202. package/docs/examples/icon/size.vue +7 -7
  203. package/docs/examples/input/basic.vue +10 -10
  204. package/docs/examples/input/clearable.vue +12 -12
  205. package/docs/examples/input/disabled.vue +6 -6
  206. package/docs/examples/input/icon.vue +23 -23
  207. package/docs/examples/input/password.vue +18 -18
  208. package/docs/examples/input/size.vue +13 -13
  209. package/docs/examples/input/textarea.vue +25 -25
  210. package/docs/examples/input/word-limit.vue +28 -28
  211. package/docs/examples/input-button/basic.vue +33 -33
  212. package/docs/examples/input-cards/basic.vue +79 -79
  213. package/docs/examples/input-code/basic.vue +29 -29
  214. package/docs/examples/input-color/basic.vue +10 -10
  215. package/docs/examples/input-color/disabled.vue +13 -13
  216. package/docs/examples/input-color/format.vue +17 -17
  217. package/docs/examples/input-color/no-alpha.vue +13 -13
  218. package/docs/examples/input-color/only-button.vue +15 -15
  219. package/docs/examples/input-color/predefine.vue +31 -31
  220. package/docs/examples/input-color/size.vue +15 -15
  221. package/docs/examples/input-layer/basic.vue +85 -85
  222. package/docs/examples/input-layer/render-vnode-page.vue +160 -160
  223. package/docs/examples/input-layer/render-vnode.vue +127 -127
  224. package/docs/examples/input-rows/basic.vue +73 -73
  225. package/docs/examples/input-rows/drag.vue +48 -48
  226. package/docs/examples/input-rows/layer-form.vue +85 -85
  227. package/docs/examples/input-rows/nested.vue +91 -91
  228. package/docs/examples/input-tag/basic.vue +27 -27
  229. package/docs/examples/input-tag/colors.vue +23 -23
  230. package/docs/examples/input-tag/readonly.vue +17 -17
  231. package/docs/examples/layer/basic.vue +43 -43
  232. package/docs/examples/layer/custom-buttons.vue +61 -61
  233. package/docs/examples/layer/drawer.vue +37 -37
  234. package/docs/examples/layer/full.vue +38 -38
  235. package/docs/examples/layer/modal.vue +34 -34
  236. package/docs/examples/layer/steps.vue +46 -46
  237. package/docs/examples/layer-form/basic.vue +76 -76
  238. package/docs/examples/layer-form/config.vue +82 -82
  239. package/docs/examples/layer-form/size.vue +72 -72
  240. package/docs/examples/layout/basic.vue +36 -36
  241. package/docs/examples/layout/custom-size.vue +50 -50
  242. package/docs/examples/layout/disable-move.vue +37 -37
  243. package/docs/examples/layout/hide-mid-when-narrow.vue +96 -96
  244. package/docs/examples/layout/min-size.vue +73 -73
  245. package/docs/examples/layout/percent-size.vue +80 -80
  246. package/docs/examples/layout/simple.vue +22 -22
  247. package/docs/examples/layout/top-side.vue +34 -34
  248. package/docs/examples/map/basic.vue +22 -22
  249. package/docs/examples/menu/basic.vue +58 -58
  250. package/docs/examples/menu/collapsed.vue +49 -49
  251. package/docs/examples/menu/horizontal.vue +44 -44
  252. package/docs/examples/menu/selection-test.vue +104 -104
  253. package/docs/examples/menu/theme.vue +46 -46
  254. package/docs/examples/menu/vertical.vue +46 -46
  255. package/docs/examples/number/advanced.vue +143 -143
  256. package/docs/examples/number/basic.vue +63 -63
  257. package/docs/examples/number/disabled.vue +49 -49
  258. package/docs/examples/number/size.vue +42 -42
  259. package/docs/examples/number/slots.vue +123 -123
  260. package/docs/examples/number/step-strictly.vue +41 -41
  261. package/docs/examples/number/step.vue +47 -47
  262. package/docs/examples/page/basic.vue +41 -41
  263. package/docs/examples/page/code-table-model.vue +428 -428
  264. package/docs/examples/page/dept-user-management.vue +211 -211
  265. package/docs/examples/page/init.vue +87 -87
  266. package/docs/examples/page/log.vue +453 -453
  267. package/docs/examples/page/user-management.vue +313 -313
  268. package/docs/examples/panel/tool-buttons.vue +18 -18
  269. package/docs/examples/radio/basic.vue +17 -17
  270. package/docs/examples/radio/button.vue +17 -17
  271. package/docs/examples/radio/color.vue +18 -18
  272. package/docs/examples/radio/disabled.vue +17 -17
  273. package/docs/examples/radio/size.vue +29 -29
  274. package/docs/examples/rate/basic.vue +24 -24
  275. package/docs/examples/rate/half.vue +24 -24
  276. package/docs/examples/rate/readonly.vue +11 -11
  277. package/docs/examples/rate/text.vue +37 -37
  278. package/docs/examples/select/basic.vue +16 -16
  279. package/docs/examples/select/clearable.vue +22 -22
  280. package/docs/examples/select/color.vue +16 -16
  281. package/docs/examples/select/disabled.vue +31 -31
  282. package/docs/examples/select/filterable.vue +24 -24
  283. package/docs/examples/select/group.vue +23 -23
  284. package/docs/examples/select/icon.vue +16 -16
  285. package/docs/examples/select/multiple.vue +18 -18
  286. package/docs/examples/select/size.vue +39 -39
  287. package/docs/examples/slider/basic.vue +42 -42
  288. package/docs/examples/slider/disabled.vue +17 -17
  289. package/docs/examples/slider/marks.vue +30 -30
  290. package/docs/examples/slider/size.vue +37 -37
  291. package/docs/examples/slider/tooltip.vue +36 -36
  292. package/docs/examples/slider/vertical.vue +26 -26
  293. package/docs/examples/slider-captcha/basic.vue +44 -44
  294. package/docs/examples/slider-captcha/custom.vue +48 -48
  295. package/docs/examples/switch/basic.vue +16 -16
  296. package/docs/examples/switch/disabled.vue +13 -13
  297. package/docs/examples/switch/loading.vue +13 -13
  298. package/docs/examples/switch/size.vue +15 -15
  299. package/docs/examples/switch/text.vue +13 -13
  300. package/docs/examples/table/action-filter.vue +126 -126
  301. package/docs/examples/table/actions.vue +116 -116
  302. package/docs/examples/table/add-row.vue +98 -98
  303. package/docs/examples/table/basic.vue +168 -168
  304. package/docs/examples/table/checkbox-layout.vue +68 -68
  305. package/docs/examples/table/column-filter.vue +96 -96
  306. package/docs/examples/table/custom-layout.vue +115 -115
  307. package/docs/examples/table/custom-merge-cell.vue +206 -206
  308. package/docs/examples/table/dynamic-type.vue +74 -74
  309. package/docs/examples/table/editable.vue +290 -290
  310. package/docs/examples/table/field-selection.vue +87 -87
  311. package/docs/examples/table/frozen-column.vue +140 -140
  312. package/docs/examples/table/height-mode.vue +99 -99
  313. package/docs/examples/table/icon.vue +85 -85
  314. package/docs/examples/table/layer-form.vue +133 -133
  315. package/docs/examples/table/link.vue +66 -66
  316. package/docs/examples/table/merge-cell.vue +78 -78
  317. package/docs/examples/table/merge-header.vue +86 -86
  318. package/docs/examples/table/multiple-disabled.vue +112 -112
  319. package/docs/examples/table/multiple.vue +188 -188
  320. package/docs/examples/table/pagination.vue +151 -151
  321. package/docs/examples/table/row-drag.vue +67 -67
  322. package/docs/examples/table/row-fixed.vue +61 -61
  323. package/docs/examples/table/show-tag.vue +68 -68
  324. package/docs/examples/table/single-selection.vue +64 -64
  325. package/docs/examples/table/sub-table-lazy.vue +97 -97
  326. package/docs/examples/table/sub-table.vue +103 -103
  327. package/docs/examples/table/tag.vue +43 -43
  328. package/docs/examples/table/tree-column.vue +119 -119
  329. package/docs/examples/table/tree-data.vue +141 -141
  330. package/docs/examples/table/tree-default-expand-all.vue +60 -60
  331. package/docs/examples/table/tree-lazy.vue +80 -80
  332. package/docs/examples/table/tree-set-selection.vue +75 -75
  333. package/docs/examples/table-panel/basic.vue +229 -229
  334. package/docs/examples/table-panel/batch-operations.vue +286 -286
  335. package/docs/examples/table-panel/button-visibility.vue +88 -88
  336. package/docs/examples/table-panel/card.vue +101 -101
  337. package/docs/examples/table-panel/column-filter.vue +116 -116
  338. package/docs/examples/table-panel/filter.vue +219 -219
  339. package/docs/examples/table-panel/get-selection.vue +111 -111
  340. package/docs/examples/table-panel/mask.vue +151 -151
  341. package/docs/examples/table-panel/model-value.vue +87 -87
  342. package/docs/examples/table-panel/multiple-selection.vue +243 -243
  343. package/docs/examples/table-panel/pagination-select-state-key.vue +176 -176
  344. package/docs/examples/table-panel/pagination.vue +133 -133
  345. package/docs/examples/table-panel/remote-selection.vue +159 -159
  346. package/docs/examples/table-panel/search-list.vue +207 -207
  347. package/docs/examples/table-panel/sub-table-lazy.vue +118 -118
  348. package/docs/examples/table-panel/tree-parent-key.vue +67 -67
  349. package/docs/examples/tabs/basic.vue +98 -98
  350. package/docs/examples/time/base.vue +67 -67
  351. package/docs/examples/title/basic.vue +87 -87
  352. package/docs/examples/tree/accordion.vue +46 -46
  353. package/docs/examples/tree/basic.vue +50 -50
  354. package/docs/examples/tree/buttons.vue +53 -53
  355. package/docs/examples/tree/check-strictly.vue +53 -53
  356. package/docs/examples/tree/checkable.vue +52 -52
  357. package/docs/examples/tree/custom-keys.vue +39 -39
  358. package/docs/examples/tree/default-expanded.vue +52 -52
  359. package/docs/examples/tree/draggable.vue +29 -29
  360. package/docs/examples/tree/expand-on-click.vue +39 -39
  361. package/docs/examples/tree/flat-data.vue +20 -20
  362. package/docs/examples/tree/icon.vue +40 -40
  363. package/docs/examples/tree/load-data.vue +37 -37
  364. package/docs/examples/tree/methods.vue +74 -74
  365. package/docs/examples/tree/theme.vue +33 -33
  366. package/docs/examples/tree-select/basic.vue +47 -47
  367. package/docs/examples/tree-select/lazy.vue +42 -42
  368. package/docs/examples/upload/accept.vue +31 -31
  369. package/docs/examples/upload/basic.vue +12 -12
  370. package/docs/examples/upload/drag.vue +11 -11
  371. package/docs/examples/upload/image.vue +17 -17
  372. package/docs/examples/upload/limit.vue +20 -20
  373. package/docs/examples/upload/multiple.vue +17 -17
  374. package/docs/examples/upload/readonly.vue +17 -17
  375. package/docs/examples/utils/cipher.vue +160 -160
  376. package/docs/examples/utils/common.vue +153 -153
  377. package/docs/examples/utils/date.vue +56 -56
  378. package/docs/examples/utils/dom.vue +52 -52
  379. package/docs/examples/utils/is.vue +70 -70
  380. package/docs/examples/workflow/basic.vue +265 -265
  381. package/docs/examples/workflow-viewer/basic.vue +248 -248
  382. package/package.json +23 -23
@@ -1,117 +1,117 @@
1
- # Upload 上传
2
-
3
- 通过点击或者拖拽上传文件。
4
-
5
- ## 基础用法
6
-
7
- 最基本的上传组件。
8
-
9
- <Demo :source-code="uploadBasicCode">
10
- <template #source>
11
- <upload-basic />
12
- </template>
13
- <template #description>
14
- 使用 `v-model` 绑定文件ID值。设置 `is-not-api` 为 `true` 可在不调用后端API的情况下预览效果。
15
- </template>
16
- </Demo>
17
-
18
- ## 多文件上传
19
-
20
- 支持一次性选择多个文件进行上传。
21
-
22
- <Demo :source-code="uploadMultipleCode">
23
- <template #source>
24
- <upload-multiple />
25
- </template>
26
- <template #description>
27
- 设置 `multiple` 属性启用多选模式。使用 `limit` 属性限制上传数量,设置为 `-1` 表示不限制。
28
- </template>
29
- </Demo>
30
-
31
- ## 拖拽上传
32
-
33
- 支持拖拽文件到指定区域进行上传。
34
-
35
- <Demo :source-code="uploadDragCode">
36
- <template #source>
37
- <upload-drag />
38
- </template>
39
- <template #description>
40
- 设置 `drag` 属性为 `true` 即可启用拖拽上传功能。
41
- </template>
42
- </Demo>
43
-
44
- ## 图片上传
45
-
46
- 专门用于上传图片的模式,提供图片预览功能。
47
-
48
- <Demo :source-code="uploadImageCode">
49
- <template #source>
50
- <upload-image />
51
- </template>
52
- <template #description>
53
- 设置 `is-upload-img` 属性为 `true` 启用图片上传模式,会以卡片形式展示上传的图片。
54
- </template>
55
- </Demo>
56
-
57
- ## 限制上传数量和大小
58
-
59
- 可以限制上传文件的数量和大小。
60
-
61
- <Demo :source-code="uploadLimitCode">
62
- <template #source>
63
- <upload-limit />
64
- </template>
65
- <template #description>
66
- 使用 `limit` 属性限制上传数量,`max-size` 和 `size-type` 配合使用限制文件大小。设置 `is-tip` 显示提示信息。
67
- </template>
68
- </Demo>
69
-
70
- ## 文件类型限制
71
-
72
- 限制上传的文件类型。
73
-
74
- <Demo :source-code="uploadAcceptCode">
75
- <template #source>
76
- <upload-accept />
77
- </template>
78
- <template #description>
79
- 使用 `accept` 属性指定接受的文件类型,例如 `.pdf`、`.xlsx,.xls`、`image/*` 等。
80
- </template>
81
- </Demo>
82
-
83
- ## 只读模式
84
-
85
- 只读状态下不能上传,只能查看已上传的文件。
86
-
87
- <Demo :source-code="uploadReadonlyCode">
88
- <template #source>
89
- <upload-readonly />
90
- </template>
91
- <template #description>
92
- 设置 `readonly` 属性为 `true` 即可进入只读模式。可通过 `btn-text` 自定义按钮文字。
93
- </template>
94
- </Demo>
95
-
96
- ## API
97
-
98
- <ApiTable :data="uploadApi" componentName="upload" />
99
-
100
- <script setup>
101
- import UploadBasic from '../examples/upload/basic.vue'
102
- import UploadMultiple from '../examples/upload/multiple.vue'
103
- import UploadDrag from '../examples/upload/drag.vue'
104
- import UploadImage from '../examples/upload/image.vue'
105
- import UploadLimit from '../examples/upload/limit.vue'
106
- import UploadAccept from '../examples/upload/accept.vue'
107
- import UploadReadonly from '../examples/upload/readonly.vue'
108
- import uploadApi from './meta/upload'
109
-
110
- import uploadBasicCode from '../examples/upload/basic.vue?raw'
111
- import uploadMultipleCode from '../examples/upload/multiple.vue?raw'
112
- import uploadDragCode from '../examples/upload/drag.vue?raw'
113
- import uploadImageCode from '../examples/upload/image.vue?raw'
114
- import uploadLimitCode from '../examples/upload/limit.vue?raw'
115
- import uploadAcceptCode from '../examples/upload/accept.vue?raw'
116
- import uploadReadonlyCode from '../examples/upload/readonly.vue?raw'
117
- </script>
1
+ # Upload 上传
2
+
3
+ 通过点击或者拖拽上传文件。
4
+
5
+ ## 基础用法
6
+
7
+ 最基本的上传组件。
8
+
9
+ <Demo :source-code="uploadBasicCode">
10
+ <template #source>
11
+ <upload-basic />
12
+ </template>
13
+ <template #description>
14
+ 使用 `v-model` 绑定文件ID值。设置 `is-not-api` 为 `true` 可在不调用后端API的情况下预览效果。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 多文件上传
19
+
20
+ 支持一次性选择多个文件进行上传。
21
+
22
+ <Demo :source-code="uploadMultipleCode">
23
+ <template #source>
24
+ <upload-multiple />
25
+ </template>
26
+ <template #description>
27
+ 设置 `multiple` 属性启用多选模式。使用 `limit` 属性限制上传数量,设置为 `-1` 表示不限制。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## 拖拽上传
32
+
33
+ 支持拖拽文件到指定区域进行上传。
34
+
35
+ <Demo :source-code="uploadDragCode">
36
+ <template #source>
37
+ <upload-drag />
38
+ </template>
39
+ <template #description>
40
+ 设置 `drag` 属性为 `true` 即可启用拖拽上传功能。
41
+ </template>
42
+ </Demo>
43
+
44
+ ## 图片上传
45
+
46
+ 专门用于上传图片的模式,提供图片预览功能。
47
+
48
+ <Demo :source-code="uploadImageCode">
49
+ <template #source>
50
+ <upload-image />
51
+ </template>
52
+ <template #description>
53
+ 设置 `is-upload-img` 属性为 `true` 启用图片上传模式,会以卡片形式展示上传的图片。
54
+ </template>
55
+ </Demo>
56
+
57
+ ## 限制上传数量和大小
58
+
59
+ 可以限制上传文件的数量和大小。
60
+
61
+ <Demo :source-code="uploadLimitCode">
62
+ <template #source>
63
+ <upload-limit />
64
+ </template>
65
+ <template #description>
66
+ 使用 `limit` 属性限制上传数量,`max-size` 和 `size-type` 配合使用限制文件大小。设置 `is-tip` 显示提示信息。
67
+ </template>
68
+ </Demo>
69
+
70
+ ## 文件类型限制
71
+
72
+ 限制上传的文件类型。
73
+
74
+ <Demo :source-code="uploadAcceptCode">
75
+ <template #source>
76
+ <upload-accept />
77
+ </template>
78
+ <template #description>
79
+ 使用 `accept` 属性指定接受的文件类型,例如 `.pdf`、`.xlsx,.xls`、`image/*` 等。
80
+ </template>
81
+ </Demo>
82
+
83
+ ## 只读模式
84
+
85
+ 只读状态下不能上传,只能查看已上传的文件。
86
+
87
+ <Demo :source-code="uploadReadonlyCode">
88
+ <template #source>
89
+ <upload-readonly />
90
+ </template>
91
+ <template #description>
92
+ 设置 `readonly` 属性为 `true` 即可进入只读模式。可通过 `btn-text` 自定义按钮文字。
93
+ </template>
94
+ </Demo>
95
+
96
+ ## API
97
+
98
+ <ApiTable :data="uploadApi" componentName="upload" />
99
+
100
+ <script setup>
101
+ import UploadBasic from '../examples/upload/basic.vue'
102
+ import UploadMultiple from '../examples/upload/multiple.vue'
103
+ import UploadDrag from '../examples/upload/drag.vue'
104
+ import UploadImage from '../examples/upload/image.vue'
105
+ import UploadLimit from '../examples/upload/limit.vue'
106
+ import UploadAccept from '../examples/upload/accept.vue'
107
+ import UploadReadonly from '../examples/upload/readonly.vue'
108
+ import uploadApi from './meta/upload'
109
+
110
+ import uploadBasicCode from '../examples/upload/basic.vue?raw'
111
+ import uploadMultipleCode from '../examples/upload/multiple.vue?raw'
112
+ import uploadDragCode from '../examples/upload/drag.vue?raw'
113
+ import uploadImageCode from '../examples/upload/image.vue?raw'
114
+ import uploadLimitCode from '../examples/upload/limit.vue?raw'
115
+ import uploadAcceptCode from '../examples/upload/accept.vue?raw'
116
+ import uploadReadonlyCode from '../examples/upload/readonly.vue?raw'
117
+ </script>
@@ -1,21 +1,21 @@
1
- # WorkflowViewer 工作流查看器
2
-
3
- 工作流查看器组件。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="basicCode">
8
- <template #source>
9
- <Basic />
10
- </template>
11
- </Demo>
12
-
13
- ## API
14
-
15
- <ApiTable :data="metaData" componentName="workflow-viewer" />
16
-
17
- <script setup>
18
- import Basic from '../examples/workflow-viewer/basic.vue'
19
- import basicCode from '../examples/workflow-viewer/basic.vue?raw'
20
- import metaData from './meta/workflow-viewer'
21
- </script>
1
+ # WorkflowViewer 工作流查看器
2
+
3
+ 工作流查看器组件。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="basicCode">
8
+ <template #source>
9
+ <Basic />
10
+ </template>
11
+ </Demo>
12
+
13
+ ## API
14
+
15
+ <ApiTable :data="metaData" componentName="workflow-viewer" />
16
+
17
+ <script setup>
18
+ import Basic from '../examples/workflow-viewer/basic.vue'
19
+ import basicCode from '../examples/workflow-viewer/basic.vue?raw'
20
+ import metaData from './meta/workflow-viewer'
21
+ </script>
@@ -1,21 +1,21 @@
1
- # Workflow 工作流
2
-
3
- 工作流编辑器组件,支持创建工作流图、编辑节点和连接线。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="basicCode">
8
- <template #source>
9
- <Basic />
10
- </template>
11
- </Demo>
12
-
13
- ## API
14
-
15
- <ApiTable :data="metaData" componentName="workflow" />
16
-
17
- <script setup>
18
- import Basic from '../examples/workflow/basic.vue'
19
- import basicCode from '../examples/workflow/basic.vue?raw'
20
- import metaData from './meta/workflow'
21
- </script>
1
+ # Workflow 工作流
2
+
3
+ 工作流编辑器组件,支持创建工作流图、编辑节点和连接线。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="basicCode">
8
+ <template #source>
9
+ <Basic />
10
+ </template>
11
+ </Demo>
12
+
13
+ ## API
14
+
15
+ <ApiTable :data="metaData" componentName="workflow" />
16
+
17
+ <script setup>
18
+ import Basic from '../examples/workflow/basic.vue'
19
+ import basicCode from '../examples/workflow/basic.vue?raw'
20
+ import metaData from './meta/workflow'
21
+ </script>
@@ -1,35 +1,35 @@
1
- <template>
2
- <j-autocomplete
3
- v-model="state"
4
- :options="restaurants"
5
- placeholder="请输入内容"
6
- :trigger-on-focus="false"
7
- :debounce="500"
8
- clearable
9
- @select="handleSelect"
10
- />
11
- </template>
12
-
13
- <script setup lang="ts">
14
- import { ref } from 'vue'
15
-
16
- interface RestaurantItem {
17
- value: string
18
- link: string
19
- }
20
-
21
- const state = ref('')
22
-
23
- const restaurants = ref<RestaurantItem[]>([
24
- { value: 'vue', link: 'https://github.com/vuejs/vue' },
25
- { value: 'element', link: 'https://github.com/ElemeFE/element' },
26
- { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
27
- { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
28
- { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
29
- { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
30
- { value: 'babel', link: 'https://github.com/babel/babel' },
31
- ])
32
- const handleSelect = (item: RestaurantItem) => {
33
- console.log(item)
34
- }
35
- </script>
1
+ <template>
2
+ <j-autocomplete
3
+ v-model="state"
4
+ :options="restaurants"
5
+ placeholder="请输入内容"
6
+ :trigger-on-focus="false"
7
+ :debounce="500"
8
+ clearable
9
+ @select="handleSelect"
10
+ />
11
+ </template>
12
+
13
+ <script setup lang="ts">
14
+ import { ref } from 'vue'
15
+
16
+ interface RestaurantItem {
17
+ value: string
18
+ link: string
19
+ }
20
+
21
+ const state = ref('')
22
+
23
+ const restaurants = ref<RestaurantItem[]>([
24
+ { value: 'vue', link: 'https://github.com/vuejs/vue' },
25
+ { value: 'element', link: 'https://github.com/ElemeFE/element' },
26
+ { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
27
+ { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
28
+ { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
29
+ { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
30
+ { value: 'babel', link: 'https://github.com/babel/babel' },
31
+ ])
32
+ const handleSelect = (item: RestaurantItem) => {
33
+ console.log(item)
34
+ }
35
+ </script>
@@ -1,32 +1,32 @@
1
- <template>
2
- <j-autocomplete
3
- v-model="state"
4
- :options="restaurants"
5
- placeholder="请输入内容"
6
- @select="handleSelect"
7
- />
8
- </template>
9
-
10
- <script setup lang="ts">
11
- import { ref } from 'vue'
12
-
13
- interface RestaurantItem {
14
- value: string
15
- link: string
16
- }
17
-
18
- const state = ref('')
19
-
20
- const restaurants = ref<RestaurantItem[]>([
21
- { value: 'vue', link: 'https://github.com/vuejs/vue' },
22
- { value: 'element', link: 'https://github.com/ElemeFE/element' },
23
- { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
24
- { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
25
- { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
26
- { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
27
- { value: 'babel', link: 'https://github.com/babel/babel' },
28
- ])
29
- const handleSelect = (item: RestaurantItem) => {
30
- console.log(item)
31
- }
32
- </script>
1
+ <template>
2
+ <j-autocomplete
3
+ v-model="state"
4
+ :options="restaurants"
5
+ placeholder="请输入内容"
6
+ @select="handleSelect"
7
+ />
8
+ </template>
9
+
10
+ <script setup lang="ts">
11
+ import { ref } from 'vue'
12
+
13
+ interface RestaurantItem {
14
+ value: string
15
+ link: string
16
+ }
17
+
18
+ const state = ref('')
19
+
20
+ const restaurants = ref<RestaurantItem[]>([
21
+ { value: 'vue', link: 'https://github.com/vuejs/vue' },
22
+ { value: 'element', link: 'https://github.com/ElemeFE/element' },
23
+ { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
24
+ { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
25
+ { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
26
+ { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
27
+ { value: 'babel', link: 'https://github.com/babel/babel' },
28
+ ])
29
+ const handleSelect = (item: RestaurantItem) => {
30
+ console.log(item)
31
+ }
32
+ </script>
@@ -1,33 +1,33 @@
1
- <template>
2
- <j-autocomplete
3
- v-model="state"
4
- :options="restaurants"
5
- placeholder="请输入内容"
6
- clearable
7
- @select="handleSelect"
8
- />
9
- </template>
10
-
11
- <script setup lang="ts">
12
- import { ref } from 'vue'
13
-
14
- interface RestaurantItem {
15
- value: string
16
- link: string
17
- }
18
-
19
- const state = ref('')
20
-
21
- const restaurants = ref<RestaurantItem[]>([
22
- { value: 'vue', link: 'https://github.com/vuejs/vue' },
23
- { value: 'element', link: 'https://github.com/ElemeFE/element' },
24
- { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
25
- { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
26
- { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
27
- { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
28
- { value: 'babel', link: 'https://github.com/babel/babel' },
29
- ])
30
- const handleSelect = (item: RestaurantItem) => {
31
- console.log(item)
32
- }
33
- </script>
1
+ <template>
2
+ <j-autocomplete
3
+ v-model="state"
4
+ :options="restaurants"
5
+ placeholder="请输入内容"
6
+ clearable
7
+ @select="handleSelect"
8
+ />
9
+ </template>
10
+
11
+ <script setup lang="ts">
12
+ import { ref } from 'vue'
13
+
14
+ interface RestaurantItem {
15
+ value: string
16
+ link: string
17
+ }
18
+
19
+ const state = ref('')
20
+
21
+ const restaurants = ref<RestaurantItem[]>([
22
+ { value: 'vue', link: 'https://github.com/vuejs/vue' },
23
+ { value: 'element', link: 'https://github.com/ElemeFE/element' },
24
+ { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
25
+ { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
26
+ { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
27
+ { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
28
+ { value: 'babel', link: 'https://github.com/babel/babel' },
29
+ ])
30
+ const handleSelect = (item: RestaurantItem) => {
31
+ console.log(item)
32
+ }
33
+ </script>
@@ -1,49 +1,49 @@
1
- <template>
2
- <j-autocomplete
3
- v-model="state"
4
- :options="restaurants"
5
- placeholder="请输入内容"
6
- @select="handleSelect"
7
- >
8
- <template #default="{ item }">
9
- <div class="value">{{ item.value }}</div>
10
- <span class="link">{{ item.link }}</span>
11
- </template>
12
- </j-autocomplete>
13
- </template>
14
-
15
- <script setup lang="ts">
16
- import { ref } from 'vue'
17
-
18
- interface RestaurantItem {
19
- value: string
20
- link: string
21
- }
22
-
23
- const state = ref('')
24
-
25
- const restaurants = ref<RestaurantItem[]>([
26
- { value: 'vue', link: 'https://github.com/vuejs/vue' },
27
- { value: 'element', link: 'https://github.com/ElemeFE/element' },
28
- { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
29
- { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
30
- { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
31
- { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
32
- { value: 'babel', link: 'https://github.com/babel/babel' },
33
- ])
34
- const handleSelect = (item: RestaurantItem) => {
35
- console.log(item)
36
- }
37
- </script>
38
-
39
- <style scoped>
40
- .link {
41
- font-size: 12px;
42
- color: #b4b4b4;
43
- }
44
-
45
- .value {
46
- line-height: 26px;
47
- padding-right: 10px;
48
- }
49
- </style>
1
+ <template>
2
+ <j-autocomplete
3
+ v-model="state"
4
+ :options="restaurants"
5
+ placeholder="请输入内容"
6
+ @select="handleSelect"
7
+ >
8
+ <template #default="{ item }">
9
+ <div class="value">{{ item.value }}</div>
10
+ <span class="link">{{ item.link }}</span>
11
+ </template>
12
+ </j-autocomplete>
13
+ </template>
14
+
15
+ <script setup lang="ts">
16
+ import { ref } from 'vue'
17
+
18
+ interface RestaurantItem {
19
+ value: string
20
+ link: string
21
+ }
22
+
23
+ const state = ref('')
24
+
25
+ const restaurants = ref<RestaurantItem[]>([
26
+ { value: 'vue', link: 'https://github.com/vuejs/vue' },
27
+ { value: 'element', link: 'https://github.com/ElemeFE/element' },
28
+ { value: 'cooking', link: 'https://github.com/ElemeFE/cooking' },
29
+ { value: 'mint-ui', link: 'https://github.com/ElemeFE/mint-ui' },
30
+ { value: 'vuex', link: 'https://github.com/vuejs/vuex' },
31
+ { value: 'vue-router', link: 'https://github.com/vuejs/vue-router' },
32
+ { value: 'babel', link: 'https://github.com/babel/babel' },
33
+ ])
34
+ const handleSelect = (item: RestaurantItem) => {
35
+ console.log(item)
36
+ }
37
+ </script>
38
+
39
+ <style scoped>
40
+ .link {
41
+ font-size: 12px;
42
+ color: #b4b4b4;
43
+ }
44
+
45
+ .value {
46
+ line-height: 26px;
47
+ padding-right: 10px;
48
+ }
49
+ </style>