uview-pro 0.3.0 → 0.3.1
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/changelog.md +584 -574
- package/components/common/props.ts +22 -22
- package/components/u-action-sheet/types.ts +37 -37
- package/components/u-action-sheet/u-action-sheet.vue +178 -178
- package/components/u-alert-tips/types.ts +41 -41
- package/components/u-alert-tips/u-alert-tips.vue +238 -238
- package/components/u-avatar/types.ts +36 -36
- package/components/u-avatar/u-avatar.vue +217 -217
- package/components/u-avatar-cropper/types.ts +23 -23
- package/components/u-avatar-cropper/u-avatar-cropper.vue +297 -297
- package/components/u-avatar-cropper/weCropper.d.ts +62 -62
- package/components/u-avatar-cropper/weCropper.js +1281 -1281
- package/components/u-avatar-cropper/weCropper.ts +1276 -1276
- package/components/u-back-top/types.ts +36 -36
- package/components/u-back-top/u-back-top.vue +140 -140
- package/components/u-badge/types.ts +38 -38
- package/components/u-badge/u-badge.vue +183 -183
- package/components/u-button/types.ts +66 -66
- package/components/u-button/u-button.vue +579 -579
- package/components/u-calendar/types.ts +75 -75
- package/components/u-calendar/u-calendar.vue +793 -793
- package/components/u-car-keyboard/types.ts +14 -14
- package/components/u-car-keyboard/u-car-keyboard.vue +262 -262
- package/components/u-card/types.ts +61 -61
- package/components/u-card/u-card.vue +209 -209
- package/components/u-cell-group/types.ts +19 -19
- package/components/u-cell-group/u-cell-group.vue +60 -60
- package/components/u-cell-item/types.ts +56 -56
- package/components/u-cell-item/u-cell-item.vue +226 -226
- package/components/u-checkbox/types.ts +33 -33
- package/components/u-checkbox/u-checkbox.vue +282 -282
- package/components/u-checkbox-group/types.ts +34 -34
- package/components/u-checkbox-group/u-checkbox-group.vue +130 -130
- package/components/u-circle-progress/types.ts +54 -54
- package/components/u-circle-progress/u-circle-progress.vue +206 -206
- package/components/u-city-select/types.ts +22 -22
- package/components/u-city-select/u-city-select.vue +276 -276
- package/components/u-col/types.ts +32 -32
- package/components/u-col/u-col.vue +142 -142
- package/components/u-collapse/types.ts +33 -33
- package/components/u-collapse/u-collapse.vue +190 -190
- package/components/u-collapse-item/types.ts +27 -27
- package/components/u-collapse-item/u-collapse-item.vue +290 -290
- package/components/u-column-notice/types.ts +50 -50
- package/components/u-column-notice/u-column-notice.vue +222 -222
- package/components/u-count-down/types.ts +44 -44
- package/components/u-count-down/u-count-down.vue +286 -286
- package/components/u-count-to/types.ts +34 -34
- package/components/u-count-to/u-count-to.vue +266 -266
- package/components/u-divider/types.ts +33 -33
- package/components/u-divider/u-divider.vue +145 -145
- package/components/u-dropdown/types.ts +34 -34
- package/components/u-dropdown/u-dropdown.vue +330 -330
- package/components/u-dropdown-item/types.ts +29 -29
- package/components/u-dropdown-item/u-dropdown-item.vue +120 -120
- package/components/u-empty/types.ts +38 -38
- package/components/u-empty/u-empty.vue +103 -103
- package/components/u-field/types.ts +71 -71
- package/components/u-field/u-field.vue +388 -388
- package/components/u-form/types.ts +29 -29
- package/components/u-form/u-form.vue +130 -130
- package/components/u-form-item/types.ts +72 -72
- package/components/u-form-item/u-form-item.vue +447 -447
- package/components/u-full-screen/types.ts +16 -16
- package/components/u-full-screen/u-full-screen.vue +103 -103
- package/components/u-gap/types.ts +20 -20
- package/components/u-gap/u-gap.vue +50 -50
- package/components/u-grid/types.ts +21 -21
- package/components/u-grid/u-grid.vue +91 -91
- package/components/u-grid-item/types.ts +16 -16
- package/components/u-grid-item/u-grid-item.vue +130 -130
- package/components/u-icon/types.ts +61 -61
- package/components/u-icon/u-icon.vue +296 -296
- package/components/u-image/types.ts +51 -51
- package/components/u-image/u-image.vue +239 -239
- package/components/u-index-anchor/types.ts +16 -16
- package/components/u-index-anchor/u-index-anchor.vue +94 -94
- package/components/u-index-list/types.ts +43 -43
- package/components/u-index-list/u-index-list.vue +352 -352
- package/components/u-input/types.ts +137 -137
- package/components/u-input/u-input.vue +288 -288
- package/components/u-keyboard/types.ts +40 -40
- package/components/u-keyboard/u-keyboard.vue +178 -178
- package/components/u-lazy-load/types.ts +37 -37
- package/components/u-lazy-load/u-lazy-load.vue +246 -246
- package/components/u-line/types.ts +44 -44
- package/components/u-line/u-line.vue +68 -68
- package/components/u-line-progress/types.ts +58 -58
- package/components/u-line-progress/u-line-progress.vue +126 -126
- package/components/u-link/types.ts +43 -43
- package/components/u-link/u-link.vue +84 -84
- package/components/u-loading/types.ts +35 -35
- package/components/u-loading/u-loading.vue +105 -105
- package/components/u-loading-popup/types.ts +26 -26
- package/components/u-loading-popup/u-loading-popup.vue +253 -253
- package/components/u-loadmore/types.ts +79 -79
- package/components/u-loadmore/u-loadmore.vue +156 -156
- package/components/u-mask/types.ts +40 -40
- package/components/u-mask/u-mask.vue +113 -113
- package/components/u-message-input/types.ts +74 -74
- package/components/u-message-input/u-message-input.vue +281 -281
- package/components/u-modal/types.ts +118 -118
- package/components/u-modal/u-modal.vue +220 -220
- package/components/u-navbar/types.ts +103 -103
- package/components/u-navbar/u-navbar.vue +251 -251
- package/components/u-no-network/image.ts +2 -2
- package/components/u-no-network/types.ts +28 -28
- package/components/u-no-network/u-no-network.vue +303 -303
- package/components/u-notice-bar/types.ts +111 -111
- package/components/u-notice-bar/u-notice-bar.vue +189 -189
- package/components/u-number-box/types.ts +42 -42
- package/components/u-number-box/u-number-box.vue +321 -321
- package/components/u-number-keyboard/types.ts +26 -26
- package/components/u-number-keyboard/u-number-keyboard.vue +188 -188
- package/components/u-picker/types.ts +123 -123
- package/components/u-picker/u-picker.vue +685 -685
- package/components/u-popup/types.ts +59 -59
- package/components/u-popup/u-popup.vue +385 -385
- package/components/u-radio/types.ts +27 -27
- package/components/u-radio/u-radio.vue +279 -279
- package/components/u-radio-group/types.ts +31 -31
- package/components/u-radio-group/u-radio-group.vue +96 -96
- package/components/u-rate/types.ts +42 -42
- package/components/u-rate/u-rate.vue +249 -249
- package/components/u-read-more/types.ts +37 -37
- package/components/u-read-more/u-read-more.vue +172 -172
- package/components/u-root-portal/u-root-portal.vue +56 -56
- package/components/u-row/types.ts +22 -22
- package/components/u-row/u-row.vue +105 -105
- package/components/u-row-notice/types.ts +41 -41
- package/components/u-row-notice/u-row-notice.vue +256 -256
- package/components/u-safe-bottom/u-safe-bottom.vue +57 -57
- package/components/u-search/types.ts +55 -55
- package/components/u-search/u-search.vue +279 -279
- package/components/u-section/types.ts +34 -34
- package/components/u-section/u-section.vue +150 -150
- package/components/u-select/types.ts +45 -45
- package/components/u-select/u-select.vue +388 -388
- package/components/u-skeleton/types.ts +22 -22
- package/components/u-skeleton/u-skeleton.vue +231 -231
- package/components/u-slider/types.ts +34 -34
- package/components/u-slider/u-slider.vue +255 -255
- package/components/u-status-bar/u-status-bar.vue +74 -74
- package/components/u-steps/types.ts +30 -30
- package/components/u-steps/u-steps.vue +181 -181
- package/components/u-sticky/types.ts +24 -24
- package/components/u-sticky/u-sticky.vue +178 -178
- package/components/u-subsection/types.ts +38 -38
- package/components/u-subsection/u-subsection.vue +339 -339
- package/components/u-swipe-action/types.ts +52 -52
- package/components/u-swipe-action/u-swipe-action.vue +276 -276
- package/components/u-swiper/types.ts +49 -49
- package/components/u-swiper/u-swiper.vue +308 -308
- package/components/u-switch/types.ts +30 -30
- package/components/u-switch/u-switch.vue +150 -150
- package/components/u-tabbar/types.ts +38 -38
- package/components/u-tabbar/u-tabbar.vue +315 -315
- package/components/u-table/types.ts +27 -27
- package/components/u-table/u-table.vue +67 -67
- package/components/u-tabs/types.ts +53 -53
- package/components/u-tabs/u-tabs.vue +302 -302
- package/components/u-tabs-swiper/types.ts +55 -55
- package/components/u-tabs-swiper/u-tabs-swiper.vue +409 -409
- package/components/u-tag/types.ts +39 -39
- package/components/u-tag/u-tag.vue +268 -268
- package/components/u-td/types.ts +14 -14
- package/components/u-td/u-td.vue +98 -98
- package/components/u-text/types.ts +72 -72
- package/components/u-text/u-text.vue +343 -343
- package/components/u-th/types.ts +14 -14
- package/components/u-th/u-th.vue +92 -92
- package/components/u-time-line/u-time-line.vue +53 -53
- package/components/u-time-line-item/types.ts +16 -16
- package/components/u-time-line-item/u-time-line-item.vue +90 -90
- package/components/u-toast/types.ts +38 -38
- package/components/u-toast/u-toast.vue +240 -240
- package/components/u-top-tips/types.ts +16 -16
- package/components/u-top-tips/u-top-tips.vue +130 -130
- package/components/u-tr/types.ts +11 -11
- package/components/u-tr/u-tr.vue +39 -39
- package/components/u-upload/types.ts +82 -82
- package/components/u-upload/u-upload.vue +568 -568
- package/components/u-verification-code/types.ts +24 -24
- package/components/u-verification-code/u-verification-code.vue +176 -176
- package/components/u-waterfall/types.ts +18 -18
- package/components/u-waterfall/u-waterfall.vue +187 -187
- package/iconfont.css +913 -913
- package/index.scss +25 -25
- package/index.ts +38 -38
- package/libs/config/config.ts +26 -26
- package/libs/config/zIndex.ts +37 -37
- package/libs/css/color.scss +155 -155
- package/libs/css/common.scss +178 -178
- package/libs/css/style.components.scss +16 -16
- package/libs/css/style.h5.scss +8 -8
- package/libs/css/style.mp.scss +72 -72
- package/libs/css/style.nvue.scss +15 -15
- package/libs/css/style.vue.scss +188 -188
- package/libs/function/$parent.ts +24 -24
- package/libs/function/addUnit.ts +13 -13
- package/libs/function/color.ts +37 -37
- package/libs/function/colorGradient.ts +139 -139
- package/libs/function/debounce.ts +28 -28
- package/libs/function/deepClone.ts +39 -39
- package/libs/function/deepMerge.ts +35 -35
- package/libs/function/getParent.ts +63 -63
- package/libs/function/getRect.ts +26 -26
- package/libs/function/guid.ts +42 -42
- package/libs/function/md5.ts +403 -403
- package/libs/function/parent.ts +21 -21
- package/libs/function/queryParams.ts +64 -64
- package/libs/function/random.ts +16 -16
- package/libs/function/randomArray.ts +11 -11
- package/libs/function/route.ts +118 -118
- package/libs/function/styleUtils.ts +83 -83
- package/libs/function/sys.ts +15 -15
- package/libs/function/test.ts +289 -289
- package/libs/function/throttle.ts +31 -31
- package/libs/function/timeFormat.ts +55 -55
- package/libs/function/timeFrom.ts +48 -48
- package/libs/function/toast.ts +14 -14
- package/libs/function/trim.ts +21 -21
- package/libs/function/type2icon.ts +39 -39
- package/libs/hooks/index.ts +4 -4
- package/libs/hooks/useCompRelation.ts +364 -364
- package/libs/hooks/useComponent.ts +759 -759
- package/libs/hooks/useEmitter.ts +79 -79
- package/libs/hooks/useParent.ts +33 -33
- package/libs/hooks/useRect.ts +33 -33
- package/libs/index.ts +337 -337
- package/libs/request/auto-http.ts +76 -76
- package/libs/request/index.ts +242 -242
- package/libs/store/index.ts +88 -88
- package/libs/util/async-validator.d.ts +75 -75
- package/libs/util/async-validator.js +1 -1
- package/libs/util/calendar.d.ts +57 -57
- package/libs/util/emitter.ts +112 -112
- package/libs/util/eventBus.ts +86 -86
- package/libs/util/logger.ts +364 -364
- package/libs/util/mitt.ts +118 -118
- package/libs/util/parent.ts +20 -20
- package/package.json +4 -4
- package/readme.md +241 -241
- package/theme.scss +38 -38
- package/types/components.d.ts +97 -97
- package/types/global.d.ts +331 -331
- package/types/ignore-errors.d.ts +30 -30
- package/types/index.d.ts +19 -19
- package/types/uni-app.d.ts +63 -63
|
@@ -1,178 +1,178 @@
|
|
|
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 ? cancelText : '' }}
|
|
17
|
-
</view>
|
|
18
|
-
<view v-if="showTips" class="u-tooltip-item u-tooltip-tips">
|
|
19
|
-
{{ tips ? tips : mode == 'number' ? '数字键盘' : mode == 'card' ? '身份证键盘' : '车牌号键盘' }}
|
|
20
|
-
</view>
|
|
21
|
-
<view
|
|
22
|
-
v-if="confirmBtn"
|
|
23
|
-
@tap="onConfirm"
|
|
24
|
-
class="u-tooltip-item u-tooltips-submit"
|
|
25
|
-
hover-class="u-tooltips-submit-hover"
|
|
26
|
-
>
|
|
27
|
-
{{ confirmBtn ? confirmText : '' }}
|
|
28
|
-
</view>
|
|
29
|
-
</view>
|
|
30
|
-
<block v-if="mode == 'number' || mode == 'card'">
|
|
31
|
-
<u-number-keyboard
|
|
32
|
-
:random="random"
|
|
33
|
-
@backspace="backspace"
|
|
34
|
-
@change="change"
|
|
35
|
-
:mode="mode"
|
|
36
|
-
:dotEnabled="dotEnabled"
|
|
37
|
-
></u-number-keyboard>
|
|
38
|
-
</block>
|
|
39
|
-
<block v-else>
|
|
40
|
-
<u-car-keyboard :random="random" @backspace="backspace" @change="change"></u-car-keyboard>
|
|
41
|
-
</block>
|
|
42
|
-
</u-popup>
|
|
43
|
-
</template>
|
|
44
|
-
|
|
45
|
-
<script lang="ts">
|
|
46
|
-
export default {
|
|
47
|
-
name: 'u-keyboard',
|
|
48
|
-
options: {
|
|
49
|
-
addGlobalClass: true,
|
|
50
|
-
// #ifndef MP-TOUTIAO
|
|
51
|
-
virtualHost: true,
|
|
52
|
-
// #endif
|
|
53
|
-
styleIsolation: 'shared'
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
</script>
|
|
57
|
-
|
|
58
|
-
<script setup lang="ts">
|
|
59
|
-
import { KeyboardProps } from './types';
|
|
60
|
-
import { computed } from 'vue';
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* keyboard 键盘
|
|
64
|
-
* @description 此为uViw自定义的键盘面板,内含了数字键盘,车牌号键,身份证号键盘3中模式,都有可以打乱按键顺序的选项。
|
|
65
|
-
* @tutorial https://uviewpro.cn/zh/components/keyboard.html
|
|
66
|
-
* @property {String} mode 键盘类型,见官网基本使用的说明(默认number)
|
|
67
|
-
* @property {Boolean} dot-enabled 是否显示"."按键,只在mode=number时有效(默认true)
|
|
68
|
-
* @property {Boolean} tooltip 是否显示键盘顶部工具条(默认true)
|
|
69
|
-
* @property {String} tips 工具条中间的提示文字,见上方基本使用的说明,如不需要,请传""空字符
|
|
70
|
-
* @property {Boolean} cancel-btn 是否显示工具条左边的"取消"按钮(默认true)
|
|
71
|
-
* @property {Boolean} confirm-btn 是否显示工具条右边的"完成"按钮(默认true)
|
|
72
|
-
* @property {Boolean} mask 是否显示遮罩(默认true)
|
|
73
|
-
* @property {String} confirm-text 确认按钮的文字
|
|
74
|
-
* @property {String} cancel-text 取消按钮的文字
|
|
75
|
-
* @property {Number String} z-index 弹出键盘的z-index值(默认1075)
|
|
76
|
-
* @property {Boolean} random 是否打乱键盘按键的顺序(默认false)
|
|
77
|
-
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
|
|
78
|
-
* @property {Boolean} mask-close-able 是否允许点击遮罩收起键盘(默认true)
|
|
79
|
-
* @event {Function} change 按键被点击(不包含退格键被点击)
|
|
80
|
-
* @event {Function} cancel 键盘顶部工具条左边的"取消"按钮被点击
|
|
81
|
-
* @event {Function} confirm 键盘顶部工具条右边的"完成"按钮被点击
|
|
82
|
-
* @event {Function} backspace 键盘退格键被点击
|
|
83
|
-
* @example <u-keyboard mode="number" v-model="show"></u-keyboard>
|
|
84
|
-
*/
|
|
85
|
-
|
|
86
|
-
const props = defineProps(KeyboardProps);
|
|
87
|
-
const emit = defineEmits(['change', 'update:modelValue', 'confirm', 'cancel', 'backspace']);
|
|
88
|
-
|
|
89
|
-
const uZIndex = computed(() => (props.zIndex ? props.zIndex : 1075));
|
|
90
|
-
|
|
91
|
-
const popupValue = computed({
|
|
92
|
-
get: () => props.modelValue,
|
|
93
|
-
set: (val: boolean) => emit('update:modelValue', val)
|
|
94
|
-
});
|
|
95
|
-
|
|
96
|
-
/**
|
|
97
|
-
* 按键被点击(不包含退格键被点击)
|
|
98
|
-
*/
|
|
99
|
-
function change(e: any) {
|
|
100
|
-
emit('change', e);
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
/**
|
|
104
|
-
* 键盘关闭
|
|
105
|
-
*/
|
|
106
|
-
function popupClose() {
|
|
107
|
-
emit('update:modelValue', false);
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
/**
|
|
111
|
-
* 输入完成
|
|
112
|
-
*/
|
|
113
|
-
function onConfirm() {
|
|
114
|
-
popupClose();
|
|
115
|
-
emit('confirm');
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
/**
|
|
119
|
-
* 取消输入
|
|
120
|
-
*/
|
|
121
|
-
function onCancel() {
|
|
122
|
-
popupClose();
|
|
123
|
-
emit('cancel');
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
/**
|
|
127
|
-
* 退格键
|
|
128
|
-
*/
|
|
129
|
-
function backspace() {
|
|
130
|
-
emit('backspace');
|
|
131
|
-
}
|
|
132
|
-
</script>
|
|
133
|
-
|
|
134
|
-
<style lang="scss" scoped>
|
|
135
|
-
@import '../../libs/css/style.components.scss';
|
|
136
|
-
|
|
137
|
-
.u-keyboard {
|
|
138
|
-
position: relative;
|
|
139
|
-
z-index: 1003;
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
.u-tooltip {
|
|
143
|
-
@include vue-flex;
|
|
144
|
-
justify-content: space-between;
|
|
145
|
-
}
|
|
146
|
-
|
|
147
|
-
.u-tooltip-item {
|
|
148
|
-
color: #333333;
|
|
149
|
-
flex: 0 0 33.333333%;
|
|
150
|
-
text-align: center;
|
|
151
|
-
padding: 20rpx 10rpx;
|
|
152
|
-
font-size: 28rpx;
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
.u-tooltips-submit {
|
|
156
|
-
text-align: right;
|
|
157
|
-
flex-grow: 1;
|
|
158
|
-
flex-wrap: 0;
|
|
159
|
-
padding-right: 40rpx;
|
|
160
|
-
color: $u-type-primary;
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
.u-tooltip-cancel {
|
|
164
|
-
text-align: left;
|
|
165
|
-
flex-grow: 1;
|
|
166
|
-
flex-wrap: 0;
|
|
167
|
-
padding-left: 40rpx;
|
|
168
|
-
color: #888888;
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
.u-tooltips-submit-hover {
|
|
172
|
-
color: $u-type-success;
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
.u-tooltip-cancel-hover {
|
|
176
|
-
color: #333333;
|
|
177
|
-
}
|
|
178
|
-
</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 ? cancelText : '' }}
|
|
17
|
+
</view>
|
|
18
|
+
<view v-if="showTips" class="u-tooltip-item u-tooltip-tips">
|
|
19
|
+
{{ tips ? tips : mode == 'number' ? '数字键盘' : mode == 'card' ? '身份证键盘' : '车牌号键盘' }}
|
|
20
|
+
</view>
|
|
21
|
+
<view
|
|
22
|
+
v-if="confirmBtn"
|
|
23
|
+
@tap="onConfirm"
|
|
24
|
+
class="u-tooltip-item u-tooltips-submit"
|
|
25
|
+
hover-class="u-tooltips-submit-hover"
|
|
26
|
+
>
|
|
27
|
+
{{ confirmBtn ? confirmText : '' }}
|
|
28
|
+
</view>
|
|
29
|
+
</view>
|
|
30
|
+
<block v-if="mode == 'number' || mode == 'card'">
|
|
31
|
+
<u-number-keyboard
|
|
32
|
+
:random="random"
|
|
33
|
+
@backspace="backspace"
|
|
34
|
+
@change="change"
|
|
35
|
+
:mode="mode"
|
|
36
|
+
:dotEnabled="dotEnabled"
|
|
37
|
+
></u-number-keyboard>
|
|
38
|
+
</block>
|
|
39
|
+
<block v-else>
|
|
40
|
+
<u-car-keyboard :random="random" @backspace="backspace" @change="change"></u-car-keyboard>
|
|
41
|
+
</block>
|
|
42
|
+
</u-popup>
|
|
43
|
+
</template>
|
|
44
|
+
|
|
45
|
+
<script lang="ts">
|
|
46
|
+
export default {
|
|
47
|
+
name: 'u-keyboard',
|
|
48
|
+
options: {
|
|
49
|
+
addGlobalClass: true,
|
|
50
|
+
// #ifndef MP-TOUTIAO
|
|
51
|
+
virtualHost: true,
|
|
52
|
+
// #endif
|
|
53
|
+
styleIsolation: 'shared'
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
</script>
|
|
57
|
+
|
|
58
|
+
<script setup lang="ts">
|
|
59
|
+
import { KeyboardProps } from './types';
|
|
60
|
+
import { computed } from 'vue';
|
|
61
|
+
|
|
62
|
+
/**
|
|
63
|
+
* keyboard 键盘
|
|
64
|
+
* @description 此为uViw自定义的键盘面板,内含了数字键盘,车牌号键,身份证号键盘3中模式,都有可以打乱按键顺序的选项。
|
|
65
|
+
* @tutorial https://uviewpro.cn/zh/components/keyboard.html
|
|
66
|
+
* @property {String} mode 键盘类型,见官网基本使用的说明(默认number)
|
|
67
|
+
* @property {Boolean} dot-enabled 是否显示"."按键,只在mode=number时有效(默认true)
|
|
68
|
+
* @property {Boolean} tooltip 是否显示键盘顶部工具条(默认true)
|
|
69
|
+
* @property {String} tips 工具条中间的提示文字,见上方基本使用的说明,如不需要,请传""空字符
|
|
70
|
+
* @property {Boolean} cancel-btn 是否显示工具条左边的"取消"按钮(默认true)
|
|
71
|
+
* @property {Boolean} confirm-btn 是否显示工具条右边的"完成"按钮(默认true)
|
|
72
|
+
* @property {Boolean} mask 是否显示遮罩(默认true)
|
|
73
|
+
* @property {String} confirm-text 确认按钮的文字
|
|
74
|
+
* @property {String} cancel-text 取消按钮的文字
|
|
75
|
+
* @property {Number String} z-index 弹出键盘的z-index值(默认1075)
|
|
76
|
+
* @property {Boolean} random 是否打乱键盘按键的顺序(默认false)
|
|
77
|
+
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
|
|
78
|
+
* @property {Boolean} mask-close-able 是否允许点击遮罩收起键盘(默认true)
|
|
79
|
+
* @event {Function} change 按键被点击(不包含退格键被点击)
|
|
80
|
+
* @event {Function} cancel 键盘顶部工具条左边的"取消"按钮被点击
|
|
81
|
+
* @event {Function} confirm 键盘顶部工具条右边的"完成"按钮被点击
|
|
82
|
+
* @event {Function} backspace 键盘退格键被点击
|
|
83
|
+
* @example <u-keyboard mode="number" v-model="show"></u-keyboard>
|
|
84
|
+
*/
|
|
85
|
+
|
|
86
|
+
const props = defineProps(KeyboardProps);
|
|
87
|
+
const emit = defineEmits(['change', 'update:modelValue', 'confirm', 'cancel', 'backspace']);
|
|
88
|
+
|
|
89
|
+
const uZIndex = computed(() => (props.zIndex ? props.zIndex : 1075));
|
|
90
|
+
|
|
91
|
+
const popupValue = computed({
|
|
92
|
+
get: () => props.modelValue,
|
|
93
|
+
set: (val: boolean) => emit('update:modelValue', val)
|
|
94
|
+
});
|
|
95
|
+
|
|
96
|
+
/**
|
|
97
|
+
* 按键被点击(不包含退格键被点击)
|
|
98
|
+
*/
|
|
99
|
+
function change(e: any) {
|
|
100
|
+
emit('change', e);
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* 键盘关闭
|
|
105
|
+
*/
|
|
106
|
+
function popupClose() {
|
|
107
|
+
emit('update:modelValue', false);
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
/**
|
|
111
|
+
* 输入完成
|
|
112
|
+
*/
|
|
113
|
+
function onConfirm() {
|
|
114
|
+
popupClose();
|
|
115
|
+
emit('confirm');
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
/**
|
|
119
|
+
* 取消输入
|
|
120
|
+
*/
|
|
121
|
+
function onCancel() {
|
|
122
|
+
popupClose();
|
|
123
|
+
emit('cancel');
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
/**
|
|
127
|
+
* 退格键
|
|
128
|
+
*/
|
|
129
|
+
function backspace() {
|
|
130
|
+
emit('backspace');
|
|
131
|
+
}
|
|
132
|
+
</script>
|
|
133
|
+
|
|
134
|
+
<style lang="scss" scoped>
|
|
135
|
+
@import '../../libs/css/style.components.scss';
|
|
136
|
+
|
|
137
|
+
.u-keyboard {
|
|
138
|
+
position: relative;
|
|
139
|
+
z-index: 1003;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
.u-tooltip {
|
|
143
|
+
@include vue-flex;
|
|
144
|
+
justify-content: space-between;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
.u-tooltip-item {
|
|
148
|
+
color: #333333;
|
|
149
|
+
flex: 0 0 33.333333%;
|
|
150
|
+
text-align: center;
|
|
151
|
+
padding: 20rpx 10rpx;
|
|
152
|
+
font-size: 28rpx;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
.u-tooltips-submit {
|
|
156
|
+
text-align: right;
|
|
157
|
+
flex-grow: 1;
|
|
158
|
+
flex-wrap: 0;
|
|
159
|
+
padding-right: 40rpx;
|
|
160
|
+
color: $u-type-primary;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
.u-tooltip-cancel {
|
|
164
|
+
text-align: left;
|
|
165
|
+
flex-grow: 1;
|
|
166
|
+
flex-wrap: 0;
|
|
167
|
+
padding-left: 40rpx;
|
|
168
|
+
color: #888888;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.u-tooltips-submit-hover {
|
|
172
|
+
color: $u-type-success;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
.u-tooltip-cancel-hover {
|
|
176
|
+
color: #333333;
|
|
177
|
+
}
|
|
178
|
+
</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>;
|