uview-pro 0.6.18 → 0.6.19

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 (278) hide show
  1. package/changelog.md +1778 -1768
  2. package/components/u-action-sheet/types.ts +52 -52
  3. package/components/u-action-sheet/u-action-sheet.vue +196 -196
  4. package/components/u-action-sheet-item/types.ts +35 -35
  5. package/components/u-action-sheet-item/u-action-sheet-item.vue +85 -85
  6. package/components/u-alert-tips/types.ts +49 -49
  7. package/components/u-alert-tips/u-alert-tips.vue +239 -239
  8. package/components/u-avatar/types.ts +44 -44
  9. package/components/u-avatar/u-avatar.vue +218 -218
  10. package/components/u-avatar-cropper/types.ts +23 -23
  11. package/components/u-avatar-cropper/u-avatar-cropper.vue +299 -299
  12. package/components/u-avatar-cropper/weCropper.d.ts +62 -62
  13. package/components/u-avatar-cropper/weCropper.js +1281 -1281
  14. package/components/u-avatar-cropper/weCropper.ts +1276 -1276
  15. package/components/u-back-top/types.ts +44 -44
  16. package/components/u-back-top/u-back-top.vue +141 -141
  17. package/components/u-badge/types.ts +46 -46
  18. package/components/u-badge/u-badge.vue +153 -153
  19. package/components/u-button/types.ts +76 -76
  20. package/components/u-button/u-button.vue +608 -608
  21. package/components/u-calendar/types.ts +126 -126
  22. package/components/u-calendar/u-calendar.vue +1243 -1243
  23. package/components/u-car-keyboard/types.ts +22 -22
  24. package/components/u-car-keyboard/u-car-keyboard.vue +263 -263
  25. package/components/u-card/types.ts +69 -69
  26. package/components/u-card/u-card.vue +210 -210
  27. package/components/u-cell-group/types.ts +27 -27
  28. package/components/u-cell-group/u-cell-group.vue +60 -60
  29. package/components/u-cell-item/types.ts +64 -64
  30. package/components/u-cell-item/u-cell-item.vue +221 -221
  31. package/components/u-checkbox/types.ts +45 -45
  32. package/components/u-checkbox/u-checkbox.vue +363 -363
  33. package/components/u-checkbox-group/types.ts +45 -45
  34. package/components/u-checkbox-group/u-checkbox-group.vue +172 -172
  35. package/components/u-circle-progress/types.ts +63 -63
  36. package/components/u-circle-progress/u-circle-progress.vue +299 -299
  37. package/components/u-city-select/types.ts +30 -30
  38. package/components/u-city-select/u-city-select.vue +281 -281
  39. package/components/u-col/types.ts +40 -40
  40. package/components/u-col/u-col.vue +142 -142
  41. package/components/u-collapse/types.ts +41 -41
  42. package/components/u-collapse/u-collapse.vue +190 -190
  43. package/components/u-collapse-item/types.ts +35 -35
  44. package/components/u-collapse-item/u-collapse-item.vue +291 -291
  45. package/components/u-column-notice/types.ts +58 -58
  46. package/components/u-column-notice/u-column-notice.vue +223 -223
  47. package/components/u-config-provider/types.ts +53 -53
  48. package/components/u-config-provider/u-config-provider.vue +185 -185
  49. package/components/u-count-down/types.ts +52 -52
  50. package/components/u-count-down/u-count-down.vue +288 -288
  51. package/components/u-count-to/types.ts +42 -42
  52. package/components/u-count-to/u-count-to.vue +266 -266
  53. package/components/u-divider/types.ts +41 -41
  54. package/components/u-divider/u-divider.vue +146 -146
  55. package/components/u-dropdown/types.ts +67 -67
  56. package/components/u-dropdown/u-dropdown.vue +436 -436
  57. package/components/u-dropdown-item/types.ts +40 -40
  58. package/components/u-dropdown-item/u-dropdown-item.vue +124 -124
  59. package/components/u-empty/types.ts +46 -46
  60. package/components/u-empty/u-empty.vue +109 -109
  61. package/components/u-fab/types.ts +83 -83
  62. package/components/u-fab/u-fab.vue +330 -330
  63. package/components/u-field/types.ts +81 -81
  64. package/components/u-field/u-field.vue +398 -398
  65. package/components/u-form/types.ts +39 -39
  66. package/components/u-form/u-form.vue +175 -135
  67. package/components/u-form-item/types.ts +95 -95
  68. package/components/u-form-item/u-form-item.vue +563 -563
  69. package/components/u-full-screen/types.ts +26 -26
  70. package/components/u-full-screen/u-full-screen.vue +100 -100
  71. package/components/u-gap/types.ts +28 -28
  72. package/components/u-gap/u-gap.vue +50 -50
  73. package/components/u-grid/types.ts +29 -29
  74. package/components/u-grid/u-grid.vue +91 -91
  75. package/components/u-grid-item/types.ts +24 -24
  76. package/components/u-grid-item/u-grid-item.vue +130 -130
  77. package/components/u-icon/types.ts +69 -69
  78. package/components/u-icon/u-icon.vue +301 -301
  79. package/components/u-image/types.ts +61 -61
  80. package/components/u-image/u-image.vue +245 -245
  81. package/components/u-index-anchor/types.ts +24 -24
  82. package/components/u-index-anchor/u-index-anchor.vue +120 -120
  83. package/components/u-index-list/types.ts +44 -44
  84. package/components/u-index-list/u-index-list.vue +346 -346
  85. package/components/u-input/types.ts +165 -165
  86. package/components/u-input/u-input.vue +453 -453
  87. package/components/u-keyboard/types.ts +40 -40
  88. package/components/u-keyboard/u-keyboard.vue +201 -201
  89. package/components/u-lazy-load/types.ts +37 -37
  90. package/components/u-lazy-load/u-lazy-load.vue +246 -246
  91. package/components/u-line/types.ts +44 -44
  92. package/components/u-line/u-line.vue +68 -68
  93. package/components/u-line-progress/types.ts +58 -58
  94. package/components/u-line-progress/u-line-progress.vue +131 -131
  95. package/components/u-link/types.ts +54 -54
  96. package/components/u-link/u-link.vue +100 -100
  97. package/components/u-loading/types.ts +45 -45
  98. package/components/u-loading/u-loading.vue +106 -106
  99. package/components/u-loading-popup/types.ts +26 -26
  100. package/components/u-loading-popup/u-loading-popup.vue +254 -254
  101. package/components/u-loadmore/types.ts +88 -88
  102. package/components/u-loadmore/u-loadmore.vue +170 -170
  103. package/components/u-mask/types.ts +48 -48
  104. package/components/u-mask/u-mask.vue +113 -113
  105. package/components/u-message-input/types.ts +90 -90
  106. package/components/u-message-input/u-message-input.vue +283 -283
  107. package/components/u-modal/service.ts +48 -48
  108. package/components/u-modal/types.ts +139 -139
  109. package/components/u-modal/u-modal.vue +465 -465
  110. package/components/u-navbar/types.ts +104 -104
  111. package/components/u-navbar/u-navbar.vue +268 -268
  112. package/components/u-no-network/image.ts +2 -2
  113. package/components/u-no-network/types.ts +29 -29
  114. package/components/u-no-network/u-no-network.vue +313 -313
  115. package/components/u-notice-bar/types.ts +111 -111
  116. package/components/u-notice-bar/u-notice-bar.vue +191 -191
  117. package/components/u-number-box/types.ts +42 -42
  118. package/components/u-number-box/u-number-box.vue +322 -322
  119. package/components/u-number-keyboard/types.ts +26 -26
  120. package/components/u-number-keyboard/u-number-keyboard.vue +189 -189
  121. package/components/u-pagination/types.ts +38 -38
  122. package/components/u-pagination/u-pagination.vue +102 -102
  123. package/components/u-picker/types.ts +140 -140
  124. package/components/u-picker/u-picker.vue +854 -854
  125. package/components/u-popup/types.ts +64 -64
  126. package/components/u-popup/u-popup.vue +427 -427
  127. package/components/u-radio/types.ts +39 -39
  128. package/components/u-radio/u-radio.vue +349 -349
  129. package/components/u-radio-group/types.ts +40 -40
  130. package/components/u-radio-group/u-radio-group.vue +96 -96
  131. package/components/u-rate/types.ts +50 -50
  132. package/components/u-rate/u-rate.vue +250 -250
  133. package/components/u-read-more/types.ts +46 -46
  134. package/components/u-read-more/u-read-more.vue +182 -182
  135. package/components/u-root-portal/u-root-portal.vue +55 -55
  136. package/components/u-row/types.ts +30 -30
  137. package/components/u-row/u-row.vue +105 -105
  138. package/components/u-row-notice/types.ts +49 -49
  139. package/components/u-row-notice/u-row-notice.vue +257 -257
  140. package/components/u-safe-bottom/types.ts +19 -19
  141. package/components/u-safe-bottom/u-safe-bottom.vue +55 -55
  142. package/components/u-search/u-search.vue +297 -297
  143. package/components/u-section/types.ts +42 -42
  144. package/components/u-section/u-section.vue +156 -156
  145. package/components/u-select/types.ts +56 -56
  146. package/components/u-select/u-select.vue +447 -447
  147. package/components/u-skeleton/types.ts +89 -89
  148. package/components/u-skeleton/u-skeleton.vue +253 -253
  149. package/components/u-slider/types.ts +55 -55
  150. package/components/u-slider/u-slider.vue +422 -422
  151. package/components/u-status-bar/types.ts +21 -21
  152. package/components/u-status-bar/u-status-bar.vue +64 -64
  153. package/components/u-step/types.ts +37 -37
  154. package/components/u-step/u-step.vue +292 -292
  155. package/components/u-steps/types.ts +39 -39
  156. package/components/u-steps/u-steps.vue +105 -105
  157. package/components/u-sticky/types.ts +33 -33
  158. package/components/u-sticky/u-sticky.vue +177 -177
  159. package/components/u-subsection/types.ts +46 -46
  160. package/components/u-subsection/u-subsection.vue +358 -358
  161. package/components/u-swipe-action/types.ts +60 -60
  162. package/components/u-swipe-action/u-swipe-action.vue +276 -276
  163. package/components/u-swiper/types.ts +57 -57
  164. package/components/u-swiper/u-swiper.vue +308 -308
  165. package/components/u-switch/types.ts +39 -39
  166. package/components/u-switch/u-switch.vue +212 -212
  167. package/components/u-tabbar/types.ts +57 -57
  168. package/components/u-tabbar/u-tabbar.vue +480 -480
  169. package/components/u-table/types.ts +35 -35
  170. package/components/u-table/u-table.vue +67 -67
  171. package/components/u-tabs/types.ts +64 -64
  172. package/components/u-tabs/u-tabs.vue +328 -328
  173. package/components/u-tabs-swiper/types.ts +64 -64
  174. package/components/u-tabs-swiper/u-tabs-swiper.vue +407 -407
  175. package/components/u-tag/types.ts +47 -47
  176. package/components/u-tag/u-tag.vue +276 -276
  177. package/components/u-td/types.ts +22 -22
  178. package/components/u-td/u-td.vue +65 -65
  179. package/components/u-text/types.ts +80 -80
  180. package/components/u-text/u-text.vue +355 -355
  181. package/components/u-textarea/types.ts +105 -105
  182. package/components/u-textarea/u-textarea.vue +450 -450
  183. package/components/u-th/types.ts +22 -22
  184. package/components/u-th/u-th.vue +63 -63
  185. package/components/u-time-line/u-time-line.vue +64 -64
  186. package/components/u-time-line-item/types.ts +24 -24
  187. package/components/u-time-line-item/u-time-line-item.vue +89 -89
  188. package/components/u-toast/service.ts +40 -40
  189. package/components/u-toast/types.ts +54 -54
  190. package/components/u-toast/u-toast.vue +385 -385
  191. package/components/u-top-tips/types.ts +25 -25
  192. package/components/u-top-tips/u-top-tips.vue +130 -130
  193. package/components/u-tr/types.ts +19 -19
  194. package/components/u-tr/u-tr.vue +39 -39
  195. package/components/u-transition/types.ts +43 -43
  196. package/components/u-transition/u-transition.vue +437 -437
  197. package/components/u-upload/types.ts +171 -171
  198. package/components/u-upload/u-upload.vue +1605 -1605
  199. package/components/u-verification-code/types.ts +32 -32
  200. package/components/u-verification-code/u-verification-code.vue +183 -183
  201. package/components/u-waterfall/types.ts +26 -26
  202. package/components/u-waterfall/u-waterfall.vue +188 -188
  203. package/iconfont.css +913 -913
  204. package/index.scss +26 -26
  205. package/libs/config/color.ts +9 -9
  206. package/libs/config/config.ts +59 -59
  207. package/libs/config/theme-tokens.ts +102 -102
  208. package/libs/config/zIndex.ts +32 -32
  209. package/libs/css/color.scss +155 -155
  210. package/libs/css/common.scss +183 -183
  211. package/libs/css/style.components.scss +16 -16
  212. package/libs/css/style.h5.scss +8 -8
  213. package/libs/css/style.mp.scss +68 -68
  214. package/libs/css/style.nvue.scss +15 -15
  215. package/libs/css/style.theme.scss +56 -56
  216. package/libs/css/style.vue.scss +188 -188
  217. package/libs/function/$parent.ts +24 -24
  218. package/libs/function/addUnit.ts +50 -50
  219. package/libs/function/clipboard.ts +73 -73
  220. package/libs/function/color.ts +28 -28
  221. package/libs/function/colorGradient.ts +139 -139
  222. package/libs/function/debounce.ts +28 -28
  223. package/libs/function/deepClone.ts +39 -39
  224. package/libs/function/deepMerge.ts +35 -35
  225. package/libs/function/getParent.ts +63 -63
  226. package/libs/function/getRect.ts +26 -26
  227. package/libs/function/guid.ts +42 -42
  228. package/libs/function/md5.ts +403 -403
  229. package/libs/function/parent.ts +21 -21
  230. package/libs/function/queryParams.ts +64 -64
  231. package/libs/function/random.ts +16 -16
  232. package/libs/function/randomArray.ts +11 -11
  233. package/libs/function/route.ts +118 -118
  234. package/libs/function/styleUtils.ts +83 -83
  235. package/libs/function/sys.ts +15 -15
  236. package/libs/function/test.ts +289 -289
  237. package/libs/function/throttle.ts +31 -31
  238. package/libs/function/timeFormat.ts +55 -55
  239. package/libs/function/timeFrom.ts +48 -48
  240. package/libs/function/toast.ts +14 -14
  241. package/libs/function/trim.ts +21 -21
  242. package/libs/function/type2icon.ts +38 -38
  243. package/libs/hooks/index.ts +10 -10
  244. package/libs/hooks/useColor.ts +61 -61
  245. package/libs/hooks/useCompRelation.ts +424 -424
  246. package/libs/hooks/useDebounce.ts +15 -15
  247. package/libs/hooks/useEmitter.ts +79 -79
  248. package/libs/hooks/useLocale.ts +34 -34
  249. package/libs/hooks/useModal.ts +131 -131
  250. package/libs/hooks/useRect.ts +40 -40
  251. package/libs/hooks/useRouter.ts +173 -173
  252. package/libs/hooks/useTheme.ts +173 -173
  253. package/libs/hooks/useThrottle.ts +16 -16
  254. package/libs/hooks/useToast.ts +115 -115
  255. package/libs/index.ts +349 -349
  256. package/libs/request/auto-http.ts +76 -76
  257. package/libs/request/index.ts +301 -301
  258. package/libs/store/index.ts +88 -88
  259. package/libs/util/async-validator.d.ts +75 -75
  260. package/libs/util/async-validator.js +1 -1
  261. package/libs/util/calendar.d.ts +57 -57
  262. package/libs/util/canvas-2d.ts +182 -182
  263. package/libs/util/config-provider.ts +804 -804
  264. package/libs/util/emitter.ts +112 -112
  265. package/libs/util/mitt.ts +118 -118
  266. package/libs/util/system-theme.ts +25 -25
  267. package/locale/index.ts +2 -2
  268. package/locale/lang/en-US.ts +136 -136
  269. package/locale/lang/zh-CN.ts +136 -136
  270. package/package.json +1 -1
  271. package/plugins/root/page.ts +77 -77
  272. package/plugins/root/root.ts +53 -53
  273. package/theme.scss +149 -149
  274. package/types/components.d.ts +105 -105
  275. package/types/global.d.ts +470 -470
  276. package/types/ignore-errors.d.ts +30 -30
  277. package/types/index.d.ts +15 -15
  278. package/types/uni-app.d.ts +63 -63
@@ -1,40 +1,40 @@
1
- import type { ExtractPropTypes, PropType } from 'vue';
2
-
3
- /**
4
- * u-keyboard 组件 Props 类型定义
5
- * @description 自定义键盘面板属性
6
- */
7
- export const KeyboardProps = {
8
- /** 键盘的类型,number-数字键盘,card-身份证键盘,car-车牌号键盘 */
9
- mode: { type: String, default: 'number' },
10
- /** 是否显示键盘的"."符号 */
11
- dotEnabled: { type: Boolean, default: true },
12
- /** 是否显示顶部工具条 */
13
- tooltip: { type: Boolean, default: true },
14
- /** 是否显示工具条中间的提示 */
15
- showTips: { type: Boolean, default: true },
16
- /** 工具条中间的提示文字 */
17
- tips: { type: String, default: '' },
18
- /** 是否显示工具条左边的"取消"按钮 */
19
- cancelBtn: { type: Boolean, default: true },
20
- /** 是否显示工具条右边的"完成"按钮 */
21
- confirmBtn: { type: Boolean, default: true },
22
- /** 是否打乱键盘按键的顺序 */
23
- random: { type: Boolean, default: false },
24
- /** 是否开启底部安全区适配 */
25
- safeAreaInsetBottom: { type: Boolean, default: false },
26
- /** 是否允许通过点击遮罩关闭键盘 */
27
- maskCloseAble: { type: Boolean, default: true },
28
- /** 通过双向绑定控制键盘的弹出与收起 */
29
- modelValue: { type: Boolean, default: false },
30
- /** 是否显示遮罩 */
31
- mask: { type: Boolean, default: true },
32
- /** z-index值 */
33
- zIndex: { type: [Number, String] as PropType<string | number>, default: '' },
34
- /** 取消按钮的文字 */
35
- cancelText: { type: String, default: '' },
36
- /** 确认按钮的文字 */
37
- confirmText: { type: String, default: '' }
38
- };
39
-
40
- export type KeyboardProps = ExtractPropTypes<typeof KeyboardProps>;
1
+ import type { ExtractPropTypes, PropType } from 'vue';
2
+
3
+ /**
4
+ * u-keyboard 组件 Props 类型定义
5
+ * @description 自定义键盘面板属性
6
+ */
7
+ export const KeyboardProps = {
8
+ /** 键盘的类型,number-数字键盘,card-身份证键盘,car-车牌号键盘 */
9
+ mode: { type: String, default: 'number' },
10
+ /** 是否显示键盘的"."符号 */
11
+ dotEnabled: { type: Boolean, default: true },
12
+ /** 是否显示顶部工具条 */
13
+ tooltip: { type: Boolean, default: true },
14
+ /** 是否显示工具条中间的提示 */
15
+ showTips: { type: Boolean, default: true },
16
+ /** 工具条中间的提示文字 */
17
+ tips: { type: String, default: '' },
18
+ /** 是否显示工具条左边的"取消"按钮 */
19
+ cancelBtn: { type: Boolean, default: true },
20
+ /** 是否显示工具条右边的"完成"按钮 */
21
+ confirmBtn: { type: Boolean, default: true },
22
+ /** 是否打乱键盘按键的顺序 */
23
+ random: { type: Boolean, default: false },
24
+ /** 是否开启底部安全区适配 */
25
+ safeAreaInsetBottom: { type: Boolean, default: false },
26
+ /** 是否允许通过点击遮罩关闭键盘 */
27
+ maskCloseAble: { type: Boolean, default: true },
28
+ /** 通过双向绑定控制键盘的弹出与收起 */
29
+ modelValue: { type: Boolean, default: false },
30
+ /** 是否显示遮罩 */
31
+ mask: { type: Boolean, default: true },
32
+ /** z-index值 */
33
+ zIndex: { type: [Number, String] as PropType<string | number>, default: '' },
34
+ /** 取消按钮的文字 */
35
+ cancelText: { type: String, default: '' },
36
+ /** 确认按钮的文字 */
37
+ confirmText: { type: String, default: '' }
38
+ };
39
+
40
+ export type KeyboardProps = ExtractPropTypes<typeof KeyboardProps>;
@@ -1,201 +1,201 @@
1
- <template>
2
- <u-popup
3
- :mask="mask"
4
- :maskCloseAble="maskCloseAble"
5
- mode="bottom"
6
- :popup="false"
7
- v-model="popupValue"
8
- length="auto"
9
- :safeAreaInsetBottom="safeAreaInsetBottom"
10
- @close="popupClose"
11
- :zIndex="uZIndex"
12
- >
13
- <slot />
14
- <view class="u-tooltip" v-if="tooltip">
15
- <view class="u-tooltip-item u-tooltip-cancel" hover-class="u-tooltip-cancel-hover" @tap="onCancel">
16
- {{ cancelBtn ? getCancelText : '' }}
17
- </view>
18
- <view v-if="showTips" class="u-tooltip-item u-tooltip-tips">
19
- {{
20
- tips
21
- ? tips
22
- : mode == 'number'
23
- ? t('uKeyboard.number')
24
- : mode == 'card'
25
- ? t('uKeyboard.idCard')
26
- : t('uKeyboard.plate')
27
- }}
28
- </view>
29
- <view
30
- v-if="confirmBtn"
31
- @tap="onConfirm"
32
- class="u-tooltip-item u-tooltips-submit"
33
- hover-class="u-tooltips-submit-hover"
34
- >
35
- {{ confirmBtn ? getConfirmText : '' }}
36
- </view>
37
- </view>
38
- <block v-if="mode == 'number' || mode == 'card'">
39
- <u-number-keyboard
40
- :random="random"
41
- @backspace="backspace"
42
- @change="change"
43
- :mode="mode"
44
- :dotEnabled="dotEnabled"
45
- ></u-number-keyboard>
46
- </block>
47
- <block v-else>
48
- <u-car-keyboard :random="random" @backspace="backspace" @change="change"></u-car-keyboard>
49
- </block>
50
- </u-popup>
51
- </template>
52
-
53
- <script lang="ts">
54
- export default {
55
- name: 'u-keyboard',
56
- options: {
57
- addGlobalClass: true,
58
- // #ifndef MP-TOUTIAO
59
- virtualHost: true,
60
- // #endif
61
- styleIsolation: 'shared'
62
- }
63
- };
64
- </script>
65
-
66
- <script setup lang="ts">
67
- import { KeyboardProps } from './types';
68
- import { computed } from 'vue';
69
- import { $u, useLocale } from '../..';
70
- import uCarKeyboard from '../u-car-keyboard/u-car-keyboard.vue';
71
- import uNumberKeyboard from '../u-number-keyboard/u-number-keyboard.vue';
72
- import uPopup from '../u-popup/u-popup.vue';
73
-
74
- /**
75
- * keyboard 键盘
76
- * @description 此为uViw自定义的键盘面板,内含了数字键盘,车牌号键,身份证号键盘3中模式,都有可以打乱按键顺序的选项。
77
- * @tutorial https://uviewpro.cn/zh/components/keyboard.html
78
- * @property {String} mode 键盘类型,见官网基本使用的说明(默认number)
79
- * @property {Boolean} dot-enabled 是否显示"."按键,只在mode=number时有效(默认true)
80
- * @property {Boolean} tooltip 是否显示键盘顶部工具条(默认true)
81
- * @property {String} tips 工具条中间的提示文字,见上方基本使用的说明,如不需要,请传""空字符
82
- * @property {Boolean} cancel-btn 是否显示工具条左边的"取消"按钮(默认true)
83
- * @property {Boolean} confirm-btn 是否显示工具条右边的"完成"按钮(默认true)
84
- * @property {Boolean} mask 是否显示遮罩(默认true)
85
- * @property {String} confirm-text 确认按钮的文字
86
- * @property {String} cancel-text 取消按钮的文字
87
- * @property {Number String} z-index 弹出键盘的z-index值(默认1075)
88
- * @property {Boolean} random 是否打乱键盘按键的顺序(默认false)
89
- * @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
90
- * @property {Boolean} mask-close-able 是否允许点击遮罩收起键盘(默认true)
91
- * @event {Function} change 按键被点击(不包含退格键被点击)
92
- * @event {Function} cancel 键盘顶部工具条左边的"取消"按钮被点击
93
- * @event {Function} confirm 键盘顶部工具条右边的"完成"按钮被点击
94
- * @event {Function} backspace 键盘退格键被点击
95
- * @example <u-keyboard mode="number" v-model="show"></u-keyboard>
96
- */
97
-
98
- const props = defineProps(KeyboardProps);
99
- const emit = defineEmits(['change', 'update:modelValue', 'confirm', 'cancel', 'backspace']);
100
-
101
- const { t } = useLocale();
102
-
103
- const uZIndex = computed(() => (props.zIndex ? props.zIndex : $u.zIndex.popup));
104
-
105
- // 国际化计算属性
106
- const getCancelText = computed(() => props.cancelText || t('uKeyboard.cancelText'));
107
- const getConfirmText = computed(() => props.confirmText || t('uKeyboard.confirmText'));
108
-
109
- const popupValue = computed({
110
- get: () => props.modelValue,
111
- set: (val: boolean) => emit('update:modelValue', val)
112
- });
113
-
114
- /**
115
- * 按键被点击(不包含退格键被点击)
116
- */
117
- function change(e: any) {
118
- emit('change', e);
119
- }
120
-
121
- /**
122
- * 键盘关闭
123
- */
124
- function popupClose() {
125
- emit('update:modelValue', false);
126
- }
127
-
128
- /**
129
- * 输入完成
130
- */
131
- function onConfirm() {
132
- popupClose();
133
- emit('confirm');
134
- }
135
-
136
- /**
137
- * 取消输入
138
- */
139
- function onCancel() {
140
- popupClose();
141
- emit('cancel');
142
- }
143
-
144
- /**
145
- * 退格键
146
- */
147
- function backspace() {
148
- emit('backspace');
149
- }
150
- </script>
151
-
152
- <style lang="scss" scoped>
153
- @import '../../libs/css/style.components.scss';
154
-
155
- .u-keyboard {
156
- position: relative;
157
- z-index: 1003;
158
- }
159
-
160
- .u-tooltip {
161
- @include vue-flex;
162
- justify-content: space-between;
163
- }
164
-
165
- .u-tooltip-item {
166
- color: var(--u-main-color);
167
- flex: 0 0 30%;
168
- text-align: center;
169
- padding: 20rpx 10rpx;
170
- font-size: 28rpx;
171
- }
172
-
173
- .u-tooltip-tips {
174
- flex-basis: 40%;
175
- word-break: break-all;
176
- }
177
-
178
- .u-tooltips-submit {
179
- text-align: right;
180
- flex-grow: 1;
181
- flex-wrap: 0;
182
- padding-right: 40rpx;
183
- color: $u-type-primary;
184
- }
185
-
186
- .u-tooltip-cancel {
187
- text-align: left;
188
- flex-grow: 1;
189
- flex-wrap: 0;
190
- padding-left: 40rpx;
191
- color: var(--u-tips-color);
192
- }
193
-
194
- .u-tooltips-submit-hover {
195
- color: $u-type-success;
196
- }
197
-
198
- .u-tooltip-cancel-hover {
199
- color: var(--u-main-color);
200
- }
201
- </style>
1
+ <template>
2
+ <u-popup
3
+ :mask="mask"
4
+ :maskCloseAble="maskCloseAble"
5
+ mode="bottom"
6
+ :popup="false"
7
+ v-model="popupValue"
8
+ length="auto"
9
+ :safeAreaInsetBottom="safeAreaInsetBottom"
10
+ @close="popupClose"
11
+ :zIndex="uZIndex"
12
+ >
13
+ <slot />
14
+ <view class="u-tooltip" v-if="tooltip">
15
+ <view class="u-tooltip-item u-tooltip-cancel" hover-class="u-tooltip-cancel-hover" @tap="onCancel">
16
+ {{ cancelBtn ? getCancelText : '' }}
17
+ </view>
18
+ <view v-if="showTips" class="u-tooltip-item u-tooltip-tips">
19
+ {{
20
+ tips
21
+ ? tips
22
+ : mode == 'number'
23
+ ? t('uKeyboard.number')
24
+ : mode == 'card'
25
+ ? t('uKeyboard.idCard')
26
+ : t('uKeyboard.plate')
27
+ }}
28
+ </view>
29
+ <view
30
+ v-if="confirmBtn"
31
+ @tap="onConfirm"
32
+ class="u-tooltip-item u-tooltips-submit"
33
+ hover-class="u-tooltips-submit-hover"
34
+ >
35
+ {{ confirmBtn ? getConfirmText : '' }}
36
+ </view>
37
+ </view>
38
+ <block v-if="mode == 'number' || mode == 'card'">
39
+ <u-number-keyboard
40
+ :random="random"
41
+ @backspace="backspace"
42
+ @change="change"
43
+ :mode="mode"
44
+ :dotEnabled="dotEnabled"
45
+ ></u-number-keyboard>
46
+ </block>
47
+ <block v-else>
48
+ <u-car-keyboard :random="random" @backspace="backspace" @change="change"></u-car-keyboard>
49
+ </block>
50
+ </u-popup>
51
+ </template>
52
+
53
+ <script lang="ts">
54
+ export default {
55
+ name: 'u-keyboard',
56
+ options: {
57
+ addGlobalClass: true,
58
+ // #ifndef MP-TOUTIAO
59
+ virtualHost: true,
60
+ // #endif
61
+ styleIsolation: 'shared'
62
+ }
63
+ };
64
+ </script>
65
+
66
+ <script setup lang="ts">
67
+ import { KeyboardProps } from './types';
68
+ import { computed } from 'vue';
69
+ import { $u, useLocale } from '../..';
70
+ import uCarKeyboard from '../u-car-keyboard/u-car-keyboard.vue';
71
+ import uNumberKeyboard from '../u-number-keyboard/u-number-keyboard.vue';
72
+ import uPopup from '../u-popup/u-popup.vue';
73
+
74
+ /**
75
+ * keyboard 键盘
76
+ * @description 此为uViw自定义的键盘面板,内含了数字键盘,车牌号键,身份证号键盘3中模式,都有可以打乱按键顺序的选项。
77
+ * @tutorial https://uviewpro.cn/zh/components/keyboard.html
78
+ * @property {String} mode 键盘类型,见官网基本使用的说明(默认number)
79
+ * @property {Boolean} dot-enabled 是否显示"."按键,只在mode=number时有效(默认true)
80
+ * @property {Boolean} tooltip 是否显示键盘顶部工具条(默认true)
81
+ * @property {String} tips 工具条中间的提示文字,见上方基本使用的说明,如不需要,请传""空字符
82
+ * @property {Boolean} cancel-btn 是否显示工具条左边的"取消"按钮(默认true)
83
+ * @property {Boolean} confirm-btn 是否显示工具条右边的"完成"按钮(默认true)
84
+ * @property {Boolean} mask 是否显示遮罩(默认true)
85
+ * @property {String} confirm-text 确认按钮的文字
86
+ * @property {String} cancel-text 取消按钮的文字
87
+ * @property {Number String} z-index 弹出键盘的z-index值(默认1075)
88
+ * @property {Boolean} random 是否打乱键盘按键的顺序(默认false)
89
+ * @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
90
+ * @property {Boolean} mask-close-able 是否允许点击遮罩收起键盘(默认true)
91
+ * @event {Function} change 按键被点击(不包含退格键被点击)
92
+ * @event {Function} cancel 键盘顶部工具条左边的"取消"按钮被点击
93
+ * @event {Function} confirm 键盘顶部工具条右边的"完成"按钮被点击
94
+ * @event {Function} backspace 键盘退格键被点击
95
+ * @example <u-keyboard mode="number" v-model="show"></u-keyboard>
96
+ */
97
+
98
+ const props = defineProps(KeyboardProps);
99
+ const emit = defineEmits(['change', 'update:modelValue', 'confirm', 'cancel', 'backspace']);
100
+
101
+ const { t } = useLocale();
102
+
103
+ const uZIndex = computed(() => (props.zIndex ? props.zIndex : $u.zIndex.popup));
104
+
105
+ // 国际化计算属性
106
+ const getCancelText = computed(() => props.cancelText || t('uKeyboard.cancelText'));
107
+ const getConfirmText = computed(() => props.confirmText || t('uKeyboard.confirmText'));
108
+
109
+ const popupValue = computed({
110
+ get: () => props.modelValue,
111
+ set: (val: boolean) => emit('update:modelValue', val)
112
+ });
113
+
114
+ /**
115
+ * 按键被点击(不包含退格键被点击)
116
+ */
117
+ function change(e: any) {
118
+ emit('change', e);
119
+ }
120
+
121
+ /**
122
+ * 键盘关闭
123
+ */
124
+ function popupClose() {
125
+ emit('update:modelValue', false);
126
+ }
127
+
128
+ /**
129
+ * 输入完成
130
+ */
131
+ function onConfirm() {
132
+ popupClose();
133
+ emit('confirm');
134
+ }
135
+
136
+ /**
137
+ * 取消输入
138
+ */
139
+ function onCancel() {
140
+ popupClose();
141
+ emit('cancel');
142
+ }
143
+
144
+ /**
145
+ * 退格键
146
+ */
147
+ function backspace() {
148
+ emit('backspace');
149
+ }
150
+ </script>
151
+
152
+ <style lang="scss" scoped>
153
+ @import '../../libs/css/style.components.scss';
154
+
155
+ .u-keyboard {
156
+ position: relative;
157
+ z-index: 1003;
158
+ }
159
+
160
+ .u-tooltip {
161
+ @include vue-flex;
162
+ justify-content: space-between;
163
+ }
164
+
165
+ .u-tooltip-item {
166
+ color: var(--u-main-color);
167
+ flex: 0 0 30%;
168
+ text-align: center;
169
+ padding: 20rpx 10rpx;
170
+ font-size: 28rpx;
171
+ }
172
+
173
+ .u-tooltip-tips {
174
+ flex-basis: 40%;
175
+ word-break: break-all;
176
+ }
177
+
178
+ .u-tooltips-submit {
179
+ text-align: right;
180
+ flex-grow: 1;
181
+ flex-wrap: 0;
182
+ padding-right: 40rpx;
183
+ color: $u-type-primary;
184
+ }
185
+
186
+ .u-tooltip-cancel {
187
+ text-align: left;
188
+ flex-grow: 1;
189
+ flex-wrap: 0;
190
+ padding-left: 40rpx;
191
+ color: var(--u-tips-color);
192
+ }
193
+
194
+ .u-tooltips-submit-hover {
195
+ color: $u-type-success;
196
+ }
197
+
198
+ .u-tooltip-cancel-hover {
199
+ color: var(--u-main-color);
200
+ }
201
+ </style>
@@ -1,37 +1,37 @@
1
- import type { ExtractPropTypes, PropType } from 'vue';
2
- import type { Effect, ImgMode } from '../../types/global';
3
-
4
- /**
5
- * u-lazy-load 组件 Props 类型定义
6
- * @description 懒加载图片组件属性
7
- */
8
- export const LazyLoadProps = {
9
- /** 用户自定义值,在事件触发时回调,用以区分是哪个图片 */
10
- index: [Number, String],
11
- /** 要显示的图片 */
12
- image: { type: String, default: '' },
13
- /** 图片裁剪模式 */
14
- imgMode: { type: String as PropType<ImgMode>, default: 'widthFix' },
15
- /** 占位图片路径 */
16
- loadingImg: {
17
- type: String,
18
- default:
19
- 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQCAMAAAC3Ycb+AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1zbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1zbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OUM0QjNBQjkyQUQ2MTFFQTlCNUQ4RTIzNDE5RUIxNjciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OUM0QjNBQkEyQUQ2MTFFQTlCNUQ4RTIzNDE5RUIxNjciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5QzRCM0FCNzJBRDYxMUVBOUI1RDhFMjM0MTlFQjE2NyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5QzRCM0FCODJBRDYxMUVBOUI1RDhFMjM0MTlFQjE2NyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtRHfPcAAAAzUExURZWVldfX18PD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'
20
- },
21
- /** 加载失败的错误占位图 */
22
- errorImg: { type: String },
23
- /** 图片进入可见区域前多少像素时,单位rpx,开始加载图片 */
24
- threshold: { type: [String, Number] as PropType<string | number>, default: 100 },
25
- /** 淡入淡出动画的过渡时间 */
26
- duration: { type: [String, Number] as PropType<string | number>, default: 500 },
27
- /** 渡效果的速度曲线 */
28
- effect: { type: String as PropType<Effect>, default: 'ease-in-out' },
29
- /** 是否使用过渡效果 */
30
- isEffect: { type: Boolean, default: true },
31
- /** 圆角值 */
32
- borderRadius: { type: [String, Number] as PropType<string | number>, default: 0 },
33
- /** 图片高度,单位rpx */
34
- height: { type: [String, Number] as PropType<string | number>, default: 450 }
35
- };
36
-
37
- export type LazyLoadProps = ExtractPropTypes<typeof LazyLoadProps>;
1
+ import type { ExtractPropTypes, PropType } from 'vue';
2
+ import type { Effect, ImgMode } from '../../types/global';
3
+
4
+ /**
5
+ * u-lazy-load 组件 Props 类型定义
6
+ * @description 懒加载图片组件属性
7
+ */
8
+ export const LazyLoadProps = {
9
+ /** 用户自定义值,在事件触发时回调,用以区分是哪个图片 */
10
+ index: [Number, String],
11
+ /** 要显示的图片 */
12
+ image: { type: String, default: '' },
13
+ /** 图片裁剪模式 */
14
+ imgMode: { type: String as PropType<ImgMode>, default: 'widthFix' },
15
+ /** 占位图片路径 */
16
+ loadingImg: {
17
+ type: String,
18
+ default:
19
+ 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQCAMAAAC3Ycb+AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1zbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1zbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OUM0QjNBQjkyQUQ2MTFFQTlCNUQ4RTIzNDE5RUIxNjciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OUM0QjNBQkEyQUQ2MTFFQTlCNUQ4RTIzNDE5RUIxNjciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5QzRCM0FCNzJBRDYxMUVBOUI1RDhFMjM0MTlFQjE2NyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5QzRCM0FCODJBRDYxMUVBOUI1RDhFMjM0MTlFQjE2NyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtRHfPcAAAAzUExURZWVldfX18PD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'
20
+ },
21
+ /** 加载失败的错误占位图 */
22
+ errorImg: { type: String },
23
+ /** 图片进入可见区域前多少像素时,单位rpx,开始加载图片 */
24
+ threshold: { type: [String, Number] as PropType<string | number>, default: 100 },
25
+ /** 淡入淡出动画的过渡时间 */
26
+ duration: { type: [String, Number] as PropType<string | number>, default: 500 },
27
+ /** 渡效果的速度曲线 */
28
+ effect: { type: String as PropType<Effect>, default: 'ease-in-out' },
29
+ /** 是否使用过渡效果 */
30
+ isEffect: { type: Boolean, default: true },
31
+ /** 圆角值 */
32
+ borderRadius: { type: [String, Number] as PropType<string | number>, default: 0 },
33
+ /** 图片高度,单位rpx */
34
+ height: { type: [String, Number] as PropType<string | number>, default: 450 }
35
+ };
36
+
37
+ export type LazyLoadProps = ExtractPropTypes<typeof LazyLoadProps>;