@a2simcode/ui 0.0.259 → 0.0.261
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.
- package/.cursor/skills/ui-component-helper/README.md +86 -86
- package/.cursor/skills/ui-component-helper/SKILL.md +115 -115
- package/LICENSE +53 -53
- package/README.md +156 -156
- package/dist/components/form-item/index.d.ts +30 -0
- package/dist/components/form-item/src/form-item.vue.d.ts +18 -0
- package/dist/simcode-ui.es.js +229 -218
- package/dist/simcode-ui.umd.js +2 -2
- package/dist/stats.html +1 -1
- package/dist/ui.css +1 -1
- package/docs/components/autocomplete.md +89 -89
- package/docs/components/barcode.md +101 -101
- package/docs/components/button-select.md +24 -24
- package/docs/components/button.md +117 -117
- package/docs/components/buttons.md +119 -119
- package/docs/components/card-list.md +38 -38
- package/docs/components/cascader-select.md +114 -114
- package/docs/components/checkbox.md +114 -114
- package/docs/components/code-mirror.md +85 -85
- package/docs/components/collapse.md +26 -26
- package/docs/components/comp.md +71 -71
- package/docs/components/count-up.md +24 -24
- package/docs/components/count.md +24 -24
- package/docs/components/data-panel.md +24 -24
- package/docs/components/date.md +76 -76
- package/docs/components/dialog-full.md +112 -112
- package/docs/components/dialog.md +127 -127
- package/docs/components/divider.md +24 -24
- package/docs/components/drawer.md +127 -127
- package/docs/components/dynamic-layer.md +118 -118
- package/docs/components/echarts.md +72 -72
- package/docs/components/editor.md +24 -24
- package/docs/components/form.md +87 -87
- package/docs/components/guid.md +39 -39
- package/docs/components/hpanel.md +24 -24
- package/docs/components/icon.md +56 -56
- package/docs/components/input-button.md +24 -24
- package/docs/components/input-code.md +24 -24
- package/docs/components/input-color.md +114 -114
- package/docs/components/input-layer.md +56 -56
- package/docs/components/input-rows.md +370 -370
- package/docs/components/input-tag.md +50 -50
- package/docs/components/input.md +129 -129
- package/docs/components/layer-form.md +61 -61
- package/docs/components/layer.md +127 -127
- package/docs/components/layout.md +132 -132
- package/docs/components/map.md +24 -24
- package/docs/components/menu.md +121 -121
- package/docs/components/meta/button.ts +212 -212
- package/docs/components/meta/buttons.ts +76 -76
- package/docs/components/meta/card-list.ts +210 -210
- package/docs/components/meta/code-mirror.ts +108 -108
- package/docs/components/meta/comp.ts +236 -236
- package/docs/components/meta/date.ts +267 -267
- package/docs/components/meta/echarts.ts +64 -64
- package/docs/components/meta/form-item.ts +50 -50
- package/docs/components/meta/form.ts +181 -181
- package/docs/components/meta/input-button.ts +175 -175
- package/docs/components/meta/input-cards.ts +112 -112
- package/docs/components/meta/input-code.ts +161 -161
- package/docs/components/meta/input-color.ts +243 -243
- package/docs/components/meta/input-rows.ts +119 -119
- package/docs/components/meta/layer-form.ts +74 -74
- package/docs/components/meta/map.ts +68 -68
- package/docs/components/meta/panel.ts +152 -152
- package/docs/components/meta/radio.ts +55 -55
- package/docs/components/meta/select.ts +279 -279
- package/docs/components/meta/slider.ts +270 -270
- package/docs/components/meta/table-panel.ts +326 -326
- package/docs/components/meta/table.ts +409 -409
- package/docs/components/meta/tabs.ts +146 -146
- package/docs/components/meta/title.ts +91 -91
- package/docs/components/meta/tree-select.ts +199 -199
- package/docs/components/meta/tree.ts +219 -219
- package/docs/components/meta/vpanel.ts +19 -19
- package/docs/components/meta/workflow-viewer.ts +55 -55
- package/docs/components/number.md +124 -124
- package/docs/components/page.md +102 -102
- package/docs/components/panel.md +37 -37
- package/docs/components/radio.md +87 -87
- package/docs/components/rate.md +71 -71
- package/docs/components/select.md +133 -133
- package/docs/components/slider-captcha.md +41 -41
- package/docs/components/slider.md +101 -101
- package/docs/components/switch.md +90 -90
- package/docs/components/table-panel.md +312 -312
- package/docs/components/table.md +450 -450
- package/docs/components/tabs.md +26 -26
- package/docs/components/title.md +24 -24
- package/docs/components/tree.md +207 -207
- package/docs/components/upload.md +117 -117
- package/docs/components/workflow-viewer.md +21 -21
- package/docs/components/workflow.md +21 -21
- package/docs/examples/autocomplete/advanced.vue +35 -35
- package/docs/examples/autocomplete/basic.vue +32 -32
- package/docs/examples/autocomplete/clearable.vue +33 -33
- package/docs/examples/autocomplete/custom-template.vue +49 -49
- package/docs/examples/autocomplete/disabled.vue +33 -33
- package/docs/examples/autocomplete/icon.vue +37 -37
- package/docs/examples/barcode/all-types.vue +380 -380
- package/docs/examples/barcode/basic.vue +14 -14
- package/docs/examples/barcode/props-appearance.vue +243 -243
- package/docs/examples/barcode/props-geometry.vue +143 -143
- package/docs/examples/barcode/props-logic.vue +216 -216
- package/docs/examples/barcode/props-symbology.vue +199 -199
- package/docs/examples/barcode/props-text.vue +268 -268
- package/docs/examples/button/basic.vue +7 -7
- package/docs/examples/button/disabled.vue +42 -42
- package/docs/examples/button/loading.vue +6 -6
- package/docs/examples/button/shape.vue +7 -7
- package/docs/examples/button/size.vue +14 -14
- package/docs/examples/button/status.vue +34 -34
- package/docs/examples/button/type.vue +10 -10
- package/docs/examples/button-select/basic.vue +19 -19
- package/docs/examples/buttons/basic.vue +62 -62
- package/docs/examples/buttons/disabled.vue +36 -36
- package/docs/examples/buttons/dropdown.vue +63 -63
- package/docs/examples/buttons/group.vue +52 -52
- package/docs/examples/buttons/link.vue +47 -47
- package/docs/examples/buttons/popup.vue +39 -39
- package/docs/examples/buttons/size.vue +45 -45
- package/docs/examples/card-list/basic.vue +70 -70
- package/docs/examples/card-list/selection-pagination.vue +69 -69
- package/docs/examples/cascader-select/basic.vue +28 -28
- package/docs/examples/cascader-select/clearable.vue +34 -34
- package/docs/examples/cascader-select/disabled.vue +43 -43
- package/docs/examples/cascader-select/filterable.vue +37 -37
- package/docs/examples/cascader-select/methods.vue +84 -84
- package/docs/examples/cascader-select/multiple.vue +38 -38
- package/docs/examples/cascader-select/slot.vue +45 -45
- package/docs/examples/checkbox/basic.vue +18 -18
- package/docs/examples/checkbox/button.vue +19 -19
- package/docs/examples/checkbox/color.vue +25 -25
- package/docs/examples/checkbox/disabled.vue +17 -17
- package/docs/examples/checkbox/min-max.vue +20 -20
- package/docs/examples/checkbox/mixed.vue +56 -56
- package/docs/examples/checkbox/size.vue +28 -28
- package/docs/examples/code-mirror/basic.vue +11 -11
- package/docs/examples/code-mirror/events.vue +42 -42
- package/docs/examples/code-mirror/height.vue +25 -25
- package/docs/examples/code-mirror/mode.vue +33 -33
- package/docs/examples/code-mirror/readonly.vue +14 -14
- package/docs/examples/collapse/basic.vue +82 -82
- package/docs/examples/comp/basic.vue +7 -7
- package/docs/examples/comp/collapse.vue +38 -38
- package/docs/examples/comp/tabs.vue +38 -38
- package/docs/examples/count/basic.vue +101 -101
- package/docs/examples/count-up/basic.vue +89 -89
- package/docs/examples/data-panel/basic.vue +110 -110
- package/docs/examples/date/basic.vue +73 -73
- package/docs/examples/date/default-value.vue +59 -59
- package/docs/examples/date/format.vue +75 -75
- package/docs/examples/date/range.vue +66 -66
- package/docs/examples/date/types.vue +79 -79
- package/docs/examples/decorated-title/basic.vue +31 -31
- package/docs/examples/dialog/basic.vue +36 -36
- package/docs/examples/dialog/custom-buttons.vue +44 -44
- package/docs/examples/dialog/fullscreen.vue +23 -23
- package/docs/examples/dialog/no-mask.vue +17 -17
- package/docs/examples/dialog/size.vue +44 -44
- package/docs/examples/dialog/steps.vue +57 -57
- package/docs/examples/dialog-full/basic.vue +29 -29
- package/docs/examples/dialog-full/custom-buttons.vue +45 -45
- package/docs/examples/dialog-full/no-buttons.vue +18 -18
- package/docs/examples/dialog-full/no-header.vue +27 -27
- package/docs/examples/dialog-full/steps.vue +71 -71
- package/docs/examples/divider/basic.vue +52 -52
- package/docs/examples/drawer/basic.vue +35 -35
- package/docs/examples/drawer/custom-buttons.vue +34 -34
- package/docs/examples/drawer/direction.vue +47 -47
- package/docs/examples/drawer/mask.vue +36 -36
- package/docs/examples/drawer/no-buttons.vue +20 -20
- package/docs/examples/drawer/size.vue +28 -28
- package/docs/examples/dynamic-layer/basic.vue +33 -33
- package/docs/examples/dynamic-layer/custom-buttons.vue +43 -43
- package/docs/examples/dynamic-layer/form.vue +73 -73
- package/docs/examples/dynamic-layer/steps.vue +52 -52
- package/docs/examples/dynamic-layer/types.vue +40 -40
- package/docs/examples/echarts/basic.vue +31 -31
- package/docs/examples/echarts/dynamic.vue +43 -43
- package/docs/examples/echarts/line.vue +46 -46
- package/docs/examples/echarts/pie.vue +44 -44
- package/docs/examples/editor/basic.vue +15 -15
- package/docs/examples/form/basic.vue +688 -686
- package/docs/examples/form/init.vue +76 -76
- package/docs/examples/form/master-detail.vue +203 -203
- package/docs/examples/form/rule-format.vue +179 -179
- package/docs/examples/form/view-table.vue +378 -378
- package/docs/examples/guid/basic.vue +10 -10
- package/docs/examples/guid/size.vue +13 -13
- package/docs/examples/hpanel/basic.vue +79 -79
- package/docs/examples/icon/basic.vue +9 -9
- package/docs/examples/icon/rotate-flip.vue +9 -9
- package/docs/examples/icon/size.vue +7 -7
- package/docs/examples/input/basic.vue +10 -10
- package/docs/examples/input/clearable.vue +12 -12
- package/docs/examples/input/disabled.vue +6 -6
- package/docs/examples/input/icon.vue +23 -23
- package/docs/examples/input/password.vue +18 -18
- package/docs/examples/input/size.vue +13 -13
- package/docs/examples/input/textarea.vue +25 -25
- package/docs/examples/input/word-limit.vue +28 -28
- package/docs/examples/input-button/basic.vue +33 -33
- package/docs/examples/input-cards/basic.vue +79 -79
- package/docs/examples/input-code/basic.vue +29 -29
- package/docs/examples/input-color/basic.vue +10 -10
- package/docs/examples/input-color/disabled.vue +13 -13
- package/docs/examples/input-color/format.vue +17 -17
- package/docs/examples/input-color/no-alpha.vue +13 -13
- package/docs/examples/input-color/only-button.vue +15 -15
- package/docs/examples/input-color/predefine.vue +31 -31
- package/docs/examples/input-color/size.vue +15 -15
- package/docs/examples/input-layer/basic.vue +85 -85
- package/docs/examples/input-layer/render-vnode-page.vue +160 -160
- package/docs/examples/input-layer/render-vnode.vue +127 -127
- package/docs/examples/input-rows/basic.vue +73 -73
- package/docs/examples/input-rows/drag.vue +48 -48
- package/docs/examples/input-rows/layer-form.vue +85 -85
- package/docs/examples/input-rows/nested.vue +91 -91
- package/docs/examples/input-tag/basic.vue +27 -27
- package/docs/examples/input-tag/colors.vue +23 -23
- package/docs/examples/input-tag/readonly.vue +17 -17
- package/docs/examples/layer/basic.vue +43 -43
- package/docs/examples/layer/custom-buttons.vue +61 -61
- package/docs/examples/layer/drawer.vue +37 -37
- package/docs/examples/layer/full.vue +38 -38
- package/docs/examples/layer/modal.vue +34 -34
- package/docs/examples/layer/steps.vue +46 -46
- package/docs/examples/layer-form/basic.vue +76 -76
- package/docs/examples/layer-form/config.vue +82 -82
- package/docs/examples/layer-form/size.vue +72 -72
- package/docs/examples/layout/basic.vue +36 -36
- package/docs/examples/layout/custom-size.vue +50 -50
- package/docs/examples/layout/disable-move.vue +37 -37
- package/docs/examples/layout/hide-mid-when-narrow.vue +96 -96
- package/docs/examples/layout/min-size.vue +73 -73
- package/docs/examples/layout/percent-size.vue +80 -80
- package/docs/examples/layout/simple.vue +22 -22
- package/docs/examples/layout/top-side.vue +34 -34
- package/docs/examples/map/basic.vue +22 -22
- package/docs/examples/menu/basic.vue +58 -58
- package/docs/examples/menu/collapsed.vue +49 -49
- package/docs/examples/menu/horizontal.vue +44 -44
- package/docs/examples/menu/selection-test.vue +104 -104
- package/docs/examples/menu/theme.vue +46 -46
- package/docs/examples/menu/vertical.vue +46 -46
- package/docs/examples/number/advanced.vue +143 -143
- package/docs/examples/number/basic.vue +63 -63
- package/docs/examples/number/disabled.vue +49 -49
- package/docs/examples/number/size.vue +42 -42
- package/docs/examples/number/slots.vue +123 -123
- package/docs/examples/number/step-strictly.vue +41 -41
- package/docs/examples/number/step.vue +47 -47
- package/docs/examples/page/basic.vue +41 -41
- package/docs/examples/page/code-table-model.vue +428 -428
- package/docs/examples/page/dept-user-management.vue +211 -211
- package/docs/examples/page/init.vue +87 -87
- package/docs/examples/page/log.vue +453 -453
- package/docs/examples/page/user-management.vue +313 -313
- package/docs/examples/panel/tool-buttons.vue +18 -18
- package/docs/examples/radio/basic.vue +17 -17
- package/docs/examples/radio/button.vue +17 -17
- package/docs/examples/radio/color.vue +18 -18
- package/docs/examples/radio/disabled.vue +17 -17
- package/docs/examples/radio/size.vue +29 -29
- package/docs/examples/rate/basic.vue +24 -24
- package/docs/examples/rate/half.vue +24 -24
- package/docs/examples/rate/readonly.vue +11 -11
- package/docs/examples/rate/text.vue +37 -37
- package/docs/examples/select/basic.vue +16 -16
- package/docs/examples/select/clearable.vue +22 -22
- package/docs/examples/select/disabled.vue +31 -31
- package/docs/examples/select/filterable.vue +24 -24
- package/docs/examples/select/group.vue +23 -23
- package/docs/examples/select/icon.vue +16 -16
- package/docs/examples/select/multiple.vue +18 -18
- package/docs/examples/select/size.vue +39 -39
- package/docs/examples/slider/basic.vue +42 -42
- package/docs/examples/slider/disabled.vue +17 -17
- package/docs/examples/slider/marks.vue +30 -30
- package/docs/examples/slider/size.vue +37 -37
- package/docs/examples/slider/tooltip.vue +36 -36
- package/docs/examples/slider/vertical.vue +26 -26
- package/docs/examples/slider-captcha/basic.vue +44 -44
- package/docs/examples/slider-captcha/custom.vue +48 -48
- package/docs/examples/switch/basic.vue +16 -16
- package/docs/examples/switch/disabled.vue +13 -13
- package/docs/examples/switch/loading.vue +13 -13
- package/docs/examples/switch/size.vue +15 -15
- package/docs/examples/switch/text.vue +13 -13
- package/docs/examples/table/action-filter.vue +126 -126
- package/docs/examples/table/actions.vue +116 -116
- package/docs/examples/table/add-row.vue +103 -103
- package/docs/examples/table/basic.vue +168 -168
- package/docs/examples/table/checkbox-layout.vue +68 -68
- package/docs/examples/table/column-filter.vue +96 -96
- package/docs/examples/table/custom-layout.vue +115 -115
- package/docs/examples/table/dynamic-type.vue +73 -73
- package/docs/examples/table/editable.vue +262 -262
- package/docs/examples/table/field-selection.vue +87 -87
- package/docs/examples/table/frozen-column.vue +140 -140
- package/docs/examples/table/height-mode.vue +99 -99
- package/docs/examples/table/icon.vue +85 -85
- package/docs/examples/table/layer-form.vue +133 -133
- package/docs/examples/table/link.vue +66 -66
- package/docs/examples/table/multiple-disabled.vue +112 -112
- package/docs/examples/table/multiple.vue +188 -188
- package/docs/examples/table/pagination.vue +151 -151
- package/docs/examples/table/row-drag.vue +67 -67
- package/docs/examples/table/single-selection.vue +64 -64
- package/docs/examples/table/sub-table-lazy.vue +97 -97
- package/docs/examples/table/sub-table.vue +103 -103
- package/docs/examples/table/tag.vue +43 -43
- package/docs/examples/table/tree-column.vue +119 -119
- package/docs/examples/table/tree-data.vue +141 -141
- package/docs/examples/table/tree-default-expand-all.vue +60 -60
- package/docs/examples/table/tree-lazy.vue +80 -80
- package/docs/examples/table/tree-set-selection.vue +75 -75
- package/docs/examples/table-panel/basic.vue +229 -229
- package/docs/examples/table-panel/batch-operations.vue +286 -286
- package/docs/examples/table-panel/button-visibility.vue +88 -88
- package/docs/examples/table-panel/card.vue +101 -101
- package/docs/examples/table-panel/column-filter.vue +116 -116
- package/docs/examples/table-panel/filter.vue +219 -219
- package/docs/examples/table-panel/get-selection.vue +111 -111
- package/docs/examples/table-panel/mask.vue +151 -151
- package/docs/examples/table-panel/model-value.vue +87 -87
- package/docs/examples/table-panel/multiple-selection.vue +243 -243
- package/docs/examples/table-panel/pagination.vue +133 -133
- package/docs/examples/table-panel/search-list.vue +207 -207
- package/docs/examples/table-panel/sub-table-lazy.vue +118 -118
- package/docs/examples/table-panel/tree-parent-key.vue +67 -67
- package/docs/examples/tabs/basic.vue +98 -98
- package/docs/examples/time/base.vue +67 -67
- package/docs/examples/title/basic.vue +87 -87
- package/docs/examples/tree/accordion.vue +46 -46
- package/docs/examples/tree/basic.vue +50 -50
- package/docs/examples/tree/buttons.vue +53 -53
- package/docs/examples/tree/checkable.vue +52 -52
- package/docs/examples/tree/custom-keys.vue +39 -39
- package/docs/examples/tree/default-expanded.vue +52 -52
- package/docs/examples/tree/draggable.vue +29 -29
- package/docs/examples/tree/expand-on-click.vue +39 -39
- package/docs/examples/tree/flat-data.vue +20 -20
- package/docs/examples/tree/icon.vue +40 -40
- package/docs/examples/tree/load-data.vue +37 -37
- package/docs/examples/tree/methods.vue +74 -74
- package/docs/examples/tree/theme.vue +33 -33
- package/docs/examples/tree-select/basic.vue +47 -47
- package/docs/examples/upload/accept.vue +31 -31
- package/docs/examples/upload/basic.vue +12 -12
- package/docs/examples/upload/drag.vue +11 -11
- package/docs/examples/upload/image.vue +17 -17
- package/docs/examples/upload/limit.vue +20 -20
- package/docs/examples/upload/multiple.vue +17 -17
- package/docs/examples/upload/readonly.vue +17 -17
- package/docs/examples/utils/cipher.vue +160 -160
- package/docs/examples/utils/common.vue +153 -153
- package/docs/examples/utils/date.vue +56 -56
- package/docs/examples/utils/dom.vue +52 -52
- package/docs/examples/utils/is.vue +70 -70
- package/docs/examples/workflow/basic.vue +265 -265
- package/docs/examples/workflow-viewer/basic.vue +248 -248
- package/package.json +23 -23
|
@@ -1,89 +1,89 @@
|
|
|
1
|
-
# Autocomplete 自动补全
|
|
2
|
-
|
|
3
|
-
通过输入部分内容,自动补全其余内容。
|
|
4
|
-
|
|
5
|
-
## 基础用法
|
|
6
|
-
|
|
7
|
-
<Demo :source-code="autocompleteBasicCode">
|
|
8
|
-
<template #source>
|
|
9
|
-
<autocomplete-basic />
|
|
10
|
-
</template>
|
|
11
|
-
<template #description>
|
|
12
|
-
基础的自动补全输入框用法。
|
|
13
|
-
</template>
|
|
14
|
-
</Demo>
|
|
15
|
-
|
|
16
|
-
## 可清除
|
|
17
|
-
|
|
18
|
-
<Demo :source-code="autocompleteClearableCode">
|
|
19
|
-
<template #source>
|
|
20
|
-
<autocomplete-clearable />
|
|
21
|
-
</template>
|
|
22
|
-
<template #description>
|
|
23
|
-
使用 clearable 属性即可得到一个可清除的输入框。
|
|
24
|
-
</template>
|
|
25
|
-
</Demo>
|
|
26
|
-
|
|
27
|
-
## 禁用状态
|
|
28
|
-
|
|
29
|
-
<Demo :source-code="autocompleteDisabledCode">
|
|
30
|
-
<template #source>
|
|
31
|
-
<autocomplete-disabled />
|
|
32
|
-
</template>
|
|
33
|
-
<template #description>
|
|
34
|
-
通过 readonly 属性指定是否禁用组件。
|
|
35
|
-
</template>
|
|
36
|
-
</Demo>
|
|
37
|
-
|
|
38
|
-
## 自定义模板
|
|
39
|
-
|
|
40
|
-
<Demo :source-code="autocompleteCustomTemplateCode">
|
|
41
|
-
<template #source>
|
|
42
|
-
<autocomplete-custom-template />
|
|
43
|
-
</template>
|
|
44
|
-
<template #description>
|
|
45
|
-
可以自定义下拉建议列表项的内容。
|
|
46
|
-
</template>
|
|
47
|
-
</Demo>
|
|
48
|
-
|
|
49
|
-
## 带图标
|
|
50
|
-
|
|
51
|
-
<Demo :source-code="autocompleteIconCode">
|
|
52
|
-
<template #source>
|
|
53
|
-
<autocomplete-icon />
|
|
54
|
-
</template>
|
|
55
|
-
<template #description>
|
|
56
|
-
通过插槽可以在输入框中显示图标。
|
|
57
|
-
</template>
|
|
58
|
-
</Demo>
|
|
59
|
-
|
|
60
|
-
## 高级用法
|
|
61
|
-
|
|
62
|
-
<Demo :source-code="autocompleteAdvancedCode">
|
|
63
|
-
<template #source>
|
|
64
|
-
<autocomplete-advanced />
|
|
65
|
-
</template>
|
|
66
|
-
<template #description>
|
|
67
|
-
配置更多高级属性,如防抖时间、是否在获得焦点时显示建议等。
|
|
68
|
-
</template>
|
|
69
|
-
</Demo>
|
|
70
|
-
|
|
71
|
-
## API
|
|
72
|
-
|
|
73
|
-
<ApiTable :data="autocompleteApi" componentName="autocomplete" />
|
|
74
|
-
|
|
75
|
-
<script setup>
|
|
76
|
-
import AutocompleteBasic from '../examples/autocomplete/basic.vue'
|
|
77
|
-
import AutocompleteClearable from '../examples/autocomplete/clearable.vue'
|
|
78
|
-
import AutocompleteDisabled from '../examples/autocomplete/disabled.vue'
|
|
79
|
-
import AutocompleteCustomTemplate from '../examples/autocomplete/custom-template.vue'
|
|
80
|
-
import AutocompleteIcon from '../examples/autocomplete/icon.vue'
|
|
81
|
-
import AutocompleteAdvanced from '../examples/autocomplete/advanced.vue'
|
|
82
|
-
import autocompleteApi from './meta/autocomplete'
|
|
83
|
-
import autocompleteBasicCode from '../examples/autocomplete/basic.vue?raw'
|
|
84
|
-
import autocompleteClearableCode from '../examples/autocomplete/clearable.vue?raw'
|
|
85
|
-
import autocompleteDisabledCode from '../examples/autocomplete/disabled.vue?raw'
|
|
86
|
-
import autocompleteCustomTemplateCode from '../examples/autocomplete/custom-template.vue?raw'
|
|
87
|
-
import autocompleteIconCode from '../examples/autocomplete/icon.vue?raw'
|
|
88
|
-
import autocompleteAdvancedCode from '../examples/autocomplete/advanced.vue?raw'
|
|
89
|
-
</script>
|
|
1
|
+
# Autocomplete 自动补全
|
|
2
|
+
|
|
3
|
+
通过输入部分内容,自动补全其余内容。
|
|
4
|
+
|
|
5
|
+
## 基础用法
|
|
6
|
+
|
|
7
|
+
<Demo :source-code="autocompleteBasicCode">
|
|
8
|
+
<template #source>
|
|
9
|
+
<autocomplete-basic />
|
|
10
|
+
</template>
|
|
11
|
+
<template #description>
|
|
12
|
+
基础的自动补全输入框用法。
|
|
13
|
+
</template>
|
|
14
|
+
</Demo>
|
|
15
|
+
|
|
16
|
+
## 可清除
|
|
17
|
+
|
|
18
|
+
<Demo :source-code="autocompleteClearableCode">
|
|
19
|
+
<template #source>
|
|
20
|
+
<autocomplete-clearable />
|
|
21
|
+
</template>
|
|
22
|
+
<template #description>
|
|
23
|
+
使用 clearable 属性即可得到一个可清除的输入框。
|
|
24
|
+
</template>
|
|
25
|
+
</Demo>
|
|
26
|
+
|
|
27
|
+
## 禁用状态
|
|
28
|
+
|
|
29
|
+
<Demo :source-code="autocompleteDisabledCode">
|
|
30
|
+
<template #source>
|
|
31
|
+
<autocomplete-disabled />
|
|
32
|
+
</template>
|
|
33
|
+
<template #description>
|
|
34
|
+
通过 readonly 属性指定是否禁用组件。
|
|
35
|
+
</template>
|
|
36
|
+
</Demo>
|
|
37
|
+
|
|
38
|
+
## 自定义模板
|
|
39
|
+
|
|
40
|
+
<Demo :source-code="autocompleteCustomTemplateCode">
|
|
41
|
+
<template #source>
|
|
42
|
+
<autocomplete-custom-template />
|
|
43
|
+
</template>
|
|
44
|
+
<template #description>
|
|
45
|
+
可以自定义下拉建议列表项的内容。
|
|
46
|
+
</template>
|
|
47
|
+
</Demo>
|
|
48
|
+
|
|
49
|
+
## 带图标
|
|
50
|
+
|
|
51
|
+
<Demo :source-code="autocompleteIconCode">
|
|
52
|
+
<template #source>
|
|
53
|
+
<autocomplete-icon />
|
|
54
|
+
</template>
|
|
55
|
+
<template #description>
|
|
56
|
+
通过插槽可以在输入框中显示图标。
|
|
57
|
+
</template>
|
|
58
|
+
</Demo>
|
|
59
|
+
|
|
60
|
+
## 高级用法
|
|
61
|
+
|
|
62
|
+
<Demo :source-code="autocompleteAdvancedCode">
|
|
63
|
+
<template #source>
|
|
64
|
+
<autocomplete-advanced />
|
|
65
|
+
</template>
|
|
66
|
+
<template #description>
|
|
67
|
+
配置更多高级属性,如防抖时间、是否在获得焦点时显示建议等。
|
|
68
|
+
</template>
|
|
69
|
+
</Demo>
|
|
70
|
+
|
|
71
|
+
## API
|
|
72
|
+
|
|
73
|
+
<ApiTable :data="autocompleteApi" componentName="autocomplete" />
|
|
74
|
+
|
|
75
|
+
<script setup>
|
|
76
|
+
import AutocompleteBasic from '../examples/autocomplete/basic.vue'
|
|
77
|
+
import AutocompleteClearable from '../examples/autocomplete/clearable.vue'
|
|
78
|
+
import AutocompleteDisabled from '../examples/autocomplete/disabled.vue'
|
|
79
|
+
import AutocompleteCustomTemplate from '../examples/autocomplete/custom-template.vue'
|
|
80
|
+
import AutocompleteIcon from '../examples/autocomplete/icon.vue'
|
|
81
|
+
import AutocompleteAdvanced from '../examples/autocomplete/advanced.vue'
|
|
82
|
+
import autocompleteApi from './meta/autocomplete'
|
|
83
|
+
import autocompleteBasicCode from '../examples/autocomplete/basic.vue?raw'
|
|
84
|
+
import autocompleteClearableCode from '../examples/autocomplete/clearable.vue?raw'
|
|
85
|
+
import autocompleteDisabledCode from '../examples/autocomplete/disabled.vue?raw'
|
|
86
|
+
import autocompleteCustomTemplateCode from '../examples/autocomplete/custom-template.vue?raw'
|
|
87
|
+
import autocompleteIconCode from '../examples/autocomplete/icon.vue?raw'
|
|
88
|
+
import autocompleteAdvancedCode from '../examples/autocomplete/advanced.vue?raw'
|
|
89
|
+
</script>
|
|
@@ -1,101 +1,101 @@
|
|
|
1
|
-
# Barcode 条码
|
|
2
|
-
|
|
3
|
-
条码/二维码生成组件,支持多种条码格式和二维码,使用SVG渲染。
|
|
4
|
-
|
|
5
|
-
## 所有条码类型
|
|
6
|
-
|
|
7
|
-
组件支持多种条码格式,包括常用零售条码、通用一维码、二维码、邮政编码和医药行业条码。
|
|
8
|
-
|
|
9
|
-
<Demo :source-code="barcodeAllTypesCode">
|
|
10
|
-
<template #source>
|
|
11
|
-
<barcode-all-types />
|
|
12
|
-
</template>
|
|
13
|
-
<template #description>
|
|
14
|
-
展示所有支持的条码类型,包括常用零售条码(EAN-13、EAN-8、UPC-A、UPC-E、ITF-14、GS1-128)、通用一维码(CODE128、CODE39、CODE93、Interleaved 2 of 5、Codabar、MSI)、二维码(QR Code、Micro QR Code、Data Matrix、PDF417、Aztec Code、Hanxin)、邮政编码(USPS OneCode、POSTNET、PLANET、Royal Mail、Japan Post、AUSPOST)和医药行业条码(Pharmacode、CODE32、HIBCCode128、PZN)。
|
|
15
|
-
</template>
|
|
16
|
-
</Demo>
|
|
17
|
-
|
|
18
|
-
## 几何尺寸属性
|
|
19
|
-
|
|
20
|
-
控制条码的尺寸、缩放和旋转。
|
|
21
|
-
|
|
22
|
-
<Demo :source-code="barcodePropsGeometryCode">
|
|
23
|
-
<template #source>
|
|
24
|
-
<barcode-props-geometry />
|
|
25
|
-
</template>
|
|
26
|
-
<template #description>
|
|
27
|
-
展示几何尺寸相关属性:scale(整体缩放比例)、scaleX/scaleY(水平和垂直缩放)、height(一维码高度)、rotate(旋转角度:N/R/L/I)。
|
|
28
|
-
</template>
|
|
29
|
-
</Demo>
|
|
30
|
-
|
|
31
|
-
## 颜色与外观属性
|
|
32
|
-
|
|
33
|
-
自定义条码的颜色、背景和内边距。
|
|
34
|
-
|
|
35
|
-
<Demo :source-code="barcodePropsAppearanceCode">
|
|
36
|
-
<template #source>
|
|
37
|
-
<barcode-props-appearance />
|
|
38
|
-
</template>
|
|
39
|
-
<template #description>
|
|
40
|
-
展示颜色与外观相关属性:barcolor(条码前景色)、backgroundcolor(背景色)、padding(内边距)、paddingwidth/paddingheight(左右/上下内边距)、inkspread(油墨扩散补偿)。
|
|
41
|
-
</template>
|
|
42
|
-
</Demo>
|
|
43
|
-
|
|
44
|
-
## 文本设置属性
|
|
45
|
-
|
|
46
|
-
控制条码下方人眼可读文本的显示方式。
|
|
47
|
-
|
|
48
|
-
<Demo :source-code="barcodePropsTextCode">
|
|
49
|
-
<template #source>
|
|
50
|
-
<barcode-props-text />
|
|
51
|
-
</template>
|
|
52
|
-
<template #description>
|
|
53
|
-
展示文本设置相关属性:includetext(是否显示文本)、alttext(替代显示文本)、textfont(字体:OCR-A/OCR-B/Helvetica/Courier)、textsize(字体大小)、textxalign/textyalign(文本对齐方式)、textxoffset/textyoffset(文本偏移)、textcolor(文本颜色)。
|
|
54
|
-
</template>
|
|
55
|
-
</Demo>
|
|
56
|
-
|
|
57
|
-
## 校验与逻辑属性
|
|
58
|
-
|
|
59
|
-
控制条码的校验位显示和字符解析。
|
|
60
|
-
|
|
61
|
-
<Demo :source-code="barcodePropsLogicCode">
|
|
62
|
-
<template #source>
|
|
63
|
-
<barcode-props-logic />
|
|
64
|
-
</template>
|
|
65
|
-
<template #description>
|
|
66
|
-
展示校验与逻辑相关属性:includecheck(在文本中包含校验位)、includecheckintext(针对特定码制的校验位显示)、parse(启用转义字符解析)、parsefnc(启用功能字符解析)、guardwhitespace(强制显示两侧静区)、guardwidth(静区宽度)。
|
|
67
|
-
</template>
|
|
68
|
-
</Demo>
|
|
69
|
-
|
|
70
|
-
## 专用条码参数
|
|
71
|
-
|
|
72
|
-
针对特定条码类型的专用参数设置。
|
|
73
|
-
|
|
74
|
-
<Demo :source-code="barcodePropsSymbologyCode">
|
|
75
|
-
<template #source>
|
|
76
|
-
<barcode-props-symbology />
|
|
77
|
-
</template>
|
|
78
|
-
<template #description>
|
|
79
|
-
展示专用条码参数:eclevel(QR码/Aztec纠错等级:L/M/Q/H)、version(QR码强制版本:1-40)、format(Data Matrix形状:square/rect)、columns/rows(PDF417列数/行数)、errorlevel(PDF417纠错等级:0-8)。
|
|
80
|
-
</template>
|
|
81
|
-
</Demo>
|
|
82
|
-
|
|
83
|
-
## API
|
|
84
|
-
|
|
85
|
-
<ApiTable :data="barcodeApi" componentName="barcode" />
|
|
86
|
-
|
|
87
|
-
<script setup>
|
|
88
|
-
import BarcodeAllTypes from '../examples/barcode/all-types.vue'
|
|
89
|
-
import BarcodePropsGeometry from '../examples/barcode/props-geometry.vue'
|
|
90
|
-
import BarcodePropsAppearance from '../examples/barcode/props-appearance.vue'
|
|
91
|
-
import BarcodePropsText from '../examples/barcode/props-text.vue'
|
|
92
|
-
import BarcodePropsLogic from '../examples/barcode/props-logic.vue'
|
|
93
|
-
import BarcodePropsSymbology from '../examples/barcode/props-symbology.vue'
|
|
94
|
-
import barcodeApi from './meta/barcode'
|
|
95
|
-
import barcodeAllTypesCode from '../examples/barcode/all-types.vue?raw'
|
|
96
|
-
import barcodePropsGeometryCode from '../examples/barcode/props-geometry.vue?raw'
|
|
97
|
-
import barcodePropsAppearanceCode from '../examples/barcode/props-appearance.vue?raw'
|
|
98
|
-
import barcodePropsTextCode from '../examples/barcode/props-text.vue?raw'
|
|
99
|
-
import barcodePropsLogicCode from '../examples/barcode/props-logic.vue?raw'
|
|
100
|
-
import barcodePropsSymbologyCode from '../examples/barcode/props-symbology.vue?raw'
|
|
101
|
-
</script>
|
|
1
|
+
# Barcode 条码
|
|
2
|
+
|
|
3
|
+
条码/二维码生成组件,支持多种条码格式和二维码,使用SVG渲染。
|
|
4
|
+
|
|
5
|
+
## 所有条码类型
|
|
6
|
+
|
|
7
|
+
组件支持多种条码格式,包括常用零售条码、通用一维码、二维码、邮政编码和医药行业条码。
|
|
8
|
+
|
|
9
|
+
<Demo :source-code="barcodeAllTypesCode">
|
|
10
|
+
<template #source>
|
|
11
|
+
<barcode-all-types />
|
|
12
|
+
</template>
|
|
13
|
+
<template #description>
|
|
14
|
+
展示所有支持的条码类型,包括常用零售条码(EAN-13、EAN-8、UPC-A、UPC-E、ITF-14、GS1-128)、通用一维码(CODE128、CODE39、CODE93、Interleaved 2 of 5、Codabar、MSI)、二维码(QR Code、Micro QR Code、Data Matrix、PDF417、Aztec Code、Hanxin)、邮政编码(USPS OneCode、POSTNET、PLANET、Royal Mail、Japan Post、AUSPOST)和医药行业条码(Pharmacode、CODE32、HIBCCode128、PZN)。
|
|
15
|
+
</template>
|
|
16
|
+
</Demo>
|
|
17
|
+
|
|
18
|
+
## 几何尺寸属性
|
|
19
|
+
|
|
20
|
+
控制条码的尺寸、缩放和旋转。
|
|
21
|
+
|
|
22
|
+
<Demo :source-code="barcodePropsGeometryCode">
|
|
23
|
+
<template #source>
|
|
24
|
+
<barcode-props-geometry />
|
|
25
|
+
</template>
|
|
26
|
+
<template #description>
|
|
27
|
+
展示几何尺寸相关属性:scale(整体缩放比例)、scaleX/scaleY(水平和垂直缩放)、height(一维码高度)、rotate(旋转角度:N/R/L/I)。
|
|
28
|
+
</template>
|
|
29
|
+
</Demo>
|
|
30
|
+
|
|
31
|
+
## 颜色与外观属性
|
|
32
|
+
|
|
33
|
+
自定义条码的颜色、背景和内边距。
|
|
34
|
+
|
|
35
|
+
<Demo :source-code="barcodePropsAppearanceCode">
|
|
36
|
+
<template #source>
|
|
37
|
+
<barcode-props-appearance />
|
|
38
|
+
</template>
|
|
39
|
+
<template #description>
|
|
40
|
+
展示颜色与外观相关属性:barcolor(条码前景色)、backgroundcolor(背景色)、padding(内边距)、paddingwidth/paddingheight(左右/上下内边距)、inkspread(油墨扩散补偿)。
|
|
41
|
+
</template>
|
|
42
|
+
</Demo>
|
|
43
|
+
|
|
44
|
+
## 文本设置属性
|
|
45
|
+
|
|
46
|
+
控制条码下方人眼可读文本的显示方式。
|
|
47
|
+
|
|
48
|
+
<Demo :source-code="barcodePropsTextCode">
|
|
49
|
+
<template #source>
|
|
50
|
+
<barcode-props-text />
|
|
51
|
+
</template>
|
|
52
|
+
<template #description>
|
|
53
|
+
展示文本设置相关属性:includetext(是否显示文本)、alttext(替代显示文本)、textfont(字体:OCR-A/OCR-B/Helvetica/Courier)、textsize(字体大小)、textxalign/textyalign(文本对齐方式)、textxoffset/textyoffset(文本偏移)、textcolor(文本颜色)。
|
|
54
|
+
</template>
|
|
55
|
+
</Demo>
|
|
56
|
+
|
|
57
|
+
## 校验与逻辑属性
|
|
58
|
+
|
|
59
|
+
控制条码的校验位显示和字符解析。
|
|
60
|
+
|
|
61
|
+
<Demo :source-code="barcodePropsLogicCode">
|
|
62
|
+
<template #source>
|
|
63
|
+
<barcode-props-logic />
|
|
64
|
+
</template>
|
|
65
|
+
<template #description>
|
|
66
|
+
展示校验与逻辑相关属性:includecheck(在文本中包含校验位)、includecheckintext(针对特定码制的校验位显示)、parse(启用转义字符解析)、parsefnc(启用功能字符解析)、guardwhitespace(强制显示两侧静区)、guardwidth(静区宽度)。
|
|
67
|
+
</template>
|
|
68
|
+
</Demo>
|
|
69
|
+
|
|
70
|
+
## 专用条码参数
|
|
71
|
+
|
|
72
|
+
针对特定条码类型的专用参数设置。
|
|
73
|
+
|
|
74
|
+
<Demo :source-code="barcodePropsSymbologyCode">
|
|
75
|
+
<template #source>
|
|
76
|
+
<barcode-props-symbology />
|
|
77
|
+
</template>
|
|
78
|
+
<template #description>
|
|
79
|
+
展示专用条码参数:eclevel(QR码/Aztec纠错等级:L/M/Q/H)、version(QR码强制版本:1-40)、format(Data Matrix形状:square/rect)、columns/rows(PDF417列数/行数)、errorlevel(PDF417纠错等级:0-8)。
|
|
80
|
+
</template>
|
|
81
|
+
</Demo>
|
|
82
|
+
|
|
83
|
+
## API
|
|
84
|
+
|
|
85
|
+
<ApiTable :data="barcodeApi" componentName="barcode" />
|
|
86
|
+
|
|
87
|
+
<script setup>
|
|
88
|
+
import BarcodeAllTypes from '../examples/barcode/all-types.vue'
|
|
89
|
+
import BarcodePropsGeometry from '../examples/barcode/props-geometry.vue'
|
|
90
|
+
import BarcodePropsAppearance from '../examples/barcode/props-appearance.vue'
|
|
91
|
+
import BarcodePropsText from '../examples/barcode/props-text.vue'
|
|
92
|
+
import BarcodePropsLogic from '../examples/barcode/props-logic.vue'
|
|
93
|
+
import BarcodePropsSymbology from '../examples/barcode/props-symbology.vue'
|
|
94
|
+
import barcodeApi from './meta/barcode'
|
|
95
|
+
import barcodeAllTypesCode from '../examples/barcode/all-types.vue?raw'
|
|
96
|
+
import barcodePropsGeometryCode from '../examples/barcode/props-geometry.vue?raw'
|
|
97
|
+
import barcodePropsAppearanceCode from '../examples/barcode/props-appearance.vue?raw'
|
|
98
|
+
import barcodePropsTextCode from '../examples/barcode/props-text.vue?raw'
|
|
99
|
+
import barcodePropsLogicCode from '../examples/barcode/props-logic.vue?raw'
|
|
100
|
+
import barcodePropsSymbologyCode from '../examples/barcode/props-symbology.vue?raw'
|
|
101
|
+
</script>
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
# ButtonSelect 按钮选择
|
|
2
|
-
|
|
3
|
-
通过点击按钮弹出选项面板,支持搜索与多次添加。
|
|
4
|
-
|
|
5
|
-
## 基础用法
|
|
6
|
-
|
|
7
|
-
<Demo :source-code="basicCode">
|
|
8
|
-
<template #source>
|
|
9
|
-
<button-select-basic />
|
|
10
|
-
</template>
|
|
11
|
-
<template #description>
|
|
12
|
-
使用 v-model 以逗号分隔的字符串记录已选择项。
|
|
13
|
-
</template>
|
|
14
|
-
</Demo>
|
|
15
|
-
|
|
16
|
-
## API
|
|
17
|
-
|
|
18
|
-
<ApiTable :data="buttonSelectApi" componentName="button-select" />
|
|
19
|
-
|
|
20
|
-
<script setup>
|
|
21
|
-
import ButtonSelectBasic from '../examples/button-select/basic.vue'
|
|
22
|
-
import buttonSelectApi from './meta/button-select'
|
|
23
|
-
import basicCode from '../examples/button-select/basic.vue?raw'
|
|
24
|
-
</script>
|
|
1
|
+
# ButtonSelect 按钮选择
|
|
2
|
+
|
|
3
|
+
通过点击按钮弹出选项面板,支持搜索与多次添加。
|
|
4
|
+
|
|
5
|
+
## 基础用法
|
|
6
|
+
|
|
7
|
+
<Demo :source-code="basicCode">
|
|
8
|
+
<template #source>
|
|
9
|
+
<button-select-basic />
|
|
10
|
+
</template>
|
|
11
|
+
<template #description>
|
|
12
|
+
使用 v-model 以逗号分隔的字符串记录已选择项。
|
|
13
|
+
</template>
|
|
14
|
+
</Demo>
|
|
15
|
+
|
|
16
|
+
## API
|
|
17
|
+
|
|
18
|
+
<ApiTable :data="buttonSelectApi" componentName="button-select" />
|
|
19
|
+
|
|
20
|
+
<script setup>
|
|
21
|
+
import ButtonSelectBasic from '../examples/button-select/basic.vue'
|
|
22
|
+
import buttonSelectApi from './meta/button-select'
|
|
23
|
+
import basicCode from '../examples/button-select/basic.vue?raw'
|
|
24
|
+
</script>
|