This commit is contained in:
Ling53666
2025-08-18 09:11:51 +08:00
commit 02554225da
2516 changed files with 133155 additions and 0 deletions

View File

@ -0,0 +1,131 @@
<view
key="ant-number-input-{{$id}}"
style="{{style}}"
class="ant-number-keyboard {{className || ''}}"
>
<view
a:if="{{visible}}"
class="ant-number-keyboard-modal"
onTap="handleHide"
onAppear="catchAppearModal"
></view>
<view class="ant-number-keyboard-kb {{visible ? '' : 'ant-number-keyboard-kb_hide'}}">
<slot name="header">
<view
a:if="{{closeable}}"
onTap="handleHide"
class="ant-number-keyboard-kb_none"
>
<ant-icon
type="DownOutline"
className="ant-number-keyboard-down"
></ant-icon>
</view>
</slot>
<view class="ant-number-keyboard-kb_bd">
<view class="ant-number-keyboard-kb_keys">
<block
a:for="{{random ? randomArr : numArr}}"
a:for-index="index"
a:for-item="item"
>
<view class="ant-number-keyboard-kb_row">
<block
a:for="{{item}}"
a:for-index="index"
a:for-item="itemKey"
>
<view
data-key="{{itemKey}}"
class="ant-number-keyboard-kb_number"
onTouchStart="tapButton"
>
{{itemKey}}
</view>
</block>
</view>
</block>
<view
a:if="{{!confirmText}}"
class="ant-number-keyboard-kb_row"
>
<view
a:if="{{!point}}"
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_point ant-number-keyboard-kb_flex ant-number-keyboard-kb_e"
></view>
<view
a:if="{{point}}"
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_point ant-number-keyboard-kb_flex"
data-key="."
onTouchStart="tapButton"
>
.
</view>
<view
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_zero ant-number-keyboard-kb_flex"
data-key="0"
onTouchStart="tapButton"
>
0
</view>
<view
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_point ant-number-keyboard-kb_flex {{point ? '' : 'ant-number-keyboard-kb_e'}}"
data-key="del"
onTouchStart="tapButton"
>
<ant-icon
type="TextDeletionOutline"
className="ant-number-keyboard-del"
></ant-icon>
</view>
</view>
<view
a:if="{{confirmText}}"
class="ant-number-keyboard-kb_row"
>
<view
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_zero"
data-key="0"
onTouchStart="tapButton"
>
0
</view>
<view
a:if="{{point}}"
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_point"
data-key="."
onTouchStart="tapButton"
>
.
</view>
</view>
</view>
<view
a:if="{{confirmText}}"
class="ant-number-keyboard-kb_function"
>
<view
class="ant-number-keyboard-kb_number ant-number-keyboard-kb_del"
data-key="del"
onTouchStart="tapButton"
>
<ant-icon
type="TextDeletionOutline"
className="ant-number-keyboard-del"
></ant-icon>
</view>
<view
style="opacity: {{confirmDisabled ? '0.5' : '1'}}"
onTouchStart="tapButton"
class="ant-number-keyboard-kb_transfer"
data-key="enter"
>
<slot name="confirm">
<view class="amount-input-kb_transfer-btn">{{confirmText}}</view>
</slot>
</view>
</view>
</view>
<view class="ant-number-keyboard-kb_iphonex-safe"></view>
</view>
</view>

View File

@ -0,0 +1 @@
export {};

View File

@ -0,0 +1,71 @@
import { Component, triggerEvent, triggerEventOnly, getValueFromProps, } from '../_util/simply';
import { NumberKeyboardDefaultProps } from './props';
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
Component(NumberKeyboardDefaultProps, {
catchAppearModal: function () {
this.setRandom();
},
setRandom: function () {
if (getValueFromProps(this, 'random')) {
var newArr = arr.sort(function () {
return Math.random() - 0.5;
});
this.setData({
randomArr: [
newArr.slice(0, 3),
newArr.slice(3, 6),
newArr.slice(6, 9),
],
});
}
},
tapButton: function (e) {
var _a = getValueFromProps(this, [
'value',
'confirmDisabled',
]), value = _a[0], confirmDisabled = _a[1];
this.vibrate();
var _key = e.currentTarget.dataset.key;
var _val = "".concat(value);
// 回退
if (_key === 'del') {
triggerEvent(this, 'change', "".concat(_val.substr(0, _val.length - 1)), e);
return;
}
if (_key !== 'del' && _key !== 'enter') {
triggerEvent(this, 'change', "".concat(_val).concat(_key), e);
}
if (_key === 'enter' && !confirmDisabled) {
this.onClickEnter();
triggerEventOnly(this, 'close');
}
},
// 隐藏键盘,失去焦点
handleHide: function () {
triggerEventOnly(this, 'close');
},
onClickEnter: function () {
var confirmDisabled = getValueFromProps(this, 'confirmDisabled');
if (confirmDisabled)
return;
this.handleHide();
triggerEventOnly(this, 'confirm');
},
// 振动反馈
vibrate: function () {
if (getValueFromProps(this, 'vibrate') && typeof my !== 'undefined') {
my.canIUse('vibrateShort') && my.vibrateShort();
}
},
}, {
numArr: [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9],
],
randomArr: [],
}, undefined, {
didMount: function () {
this.setRandom();
},
});

View File

@ -0,0 +1,6 @@
{
"component": true,
"usingComponents": {
"ant-icon": "../Icon/index"
}
}

View File

@ -0,0 +1,157 @@
@import (reference) '../style/themes/index.less';
@keyframes number-input-cursor {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.ant-number-keyboard {
color: @COLOR_TEXT_PRIMARY;
width: 0;
height: 0;
position: relative;
overflow: hidden;
&-modal {
z-index: 998;
position: fixed;
bottom: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: transparent;
}
&-kb {
background: @COLOR_BACKGROUND;
max-height: 600px;
min-width: 100vw;
overflow: hidden;
position: fixed;
bottom: 0;
left: 0;
transition: all 200ms linear;
z-index: 999;
&_hide {
transform: translateY(100%);
max-height: 0;
}
&_bd {
display: flex;
}
&_row {
display: flex;
}
&_keys {
flex: 3;
}
&_function {
flex: 1;
display: flex;
flex-direction: column;
}
&_none {
height: 80 * @rpx;
width: calc(100% - 96 * @rpx);
padding: 0 48 * @rpx;
font-size: 28 * @rpx;
background-color: @COLOR_CARD;
display: flex;
position: relative;
flex-direction: row;
align-items: center;
justify-content: center;
border-bottom: @border-width-standard solid @COLOR_BACKGROUND;
color: @COLOR_TEXT_ASSIST;
}
&_number {
flex: 1;
height: calc(100vh / 14);
text-align: center;
font-size: 50 * @rpx;
color: @COLOR_TEXT_PRIMARY;
background: @COLOR_CARD;
border-right: @border-width-standard solid @COLOR_BACKGROUND;
border-bottom: @border-width-standard solid @COLOR_BACKGROUND;
display: flex;
justify-content: center;
align-items: center;
user-select: none;
&:active {
background-color: #d3d3d3;
opacity: 0.5;
color: @COLOR_TEXT_PRIMARY;
}
}
&_disable {
&:active {
opacity: 1;
}
}
&_zero {
flex: 2;
}
&_point {
flex: 1;
}
&_transfer {
background-color: @COLOR_BRAND1;
color: white;
flex: 1;
height: calc(100vh / 14);
text-align: center;
font-size: 34 * @rpx;
border-right: @border-width-standard solid @COLOR_BACKGROUND;
border-bottom: @border-width-standard solid @COLOR_BACKGROUND;
display: flex;
justify-content: center;
align-items: center;
user-select: none;
position: relative;
overflow: hidden;
&-btn {
font-size: 32 * @rpx;
font-weight: bold;
}
&:active {
opacity: 0.9;
}
}
&_del {
position: relative;
flex: none;
border-right: none;
&::before {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
content: '';
}
}
&_iphonex-safe {
height: 48 * @rpx;
width: 100%;
background-color: @COLOR_CARD;
}
&_flex {
flex: 1;
}
&-e {
background-color: @COLOR_BORDER;
}
}
&-down {
font-size: 40 * @rpx;
}
&-del {
font-size: 50 * @rpx;
}
}

View File

@ -0,0 +1,61 @@
import { IBaseProps } from '../_util/base';
export interface INumberKeyboardProps extends IBaseProps {
/**
* @description 关闭箭头
* @default false
*/
closeable: boolean;
/**
* @description 展示小数点
* @default true
*/
point: boolean;
/**
* @description 确认按钮文字
* @default ''
*/
confirmText: string;
/**
* @description 是否震动
* @default true
*/
vibrate: boolean;
/**
* @description 是否展示
* @default false
*/
visible: boolean;
/**
* @description 值
* @default ''
*/
value: string;
/**
* @description 安全距离
* @default true
*/
safeArea: boolean;
/**
* @description 乱序
* @default fasle
*/
random: boolean;
/**
* @description 禁用
* @default false
*/
confirmDisabled: boolean;
/**
* @description 输入值变化时的回调
*/
onChange?: (val: string) => void;
/**
* @description 点击确认时的回调
*/
onConfirm?: () => void;
/**
* @description 隐藏键盘时的回调
*/
onClose?: () => void;
}
export declare const NumberKeyboardDefaultProps: Partial<INumberKeyboardProps>;

View File

@ -0,0 +1,14 @@
export var NumberKeyboardDefaultProps = {
closeable: false,
point: true,
confirmText: '',
vibrate: false,
visible: false,
value: '',
safeArea: true,
random: false,
confirmDisabled: false,
onChange: function () { },
onConfirm: function () { },
onClose: function () { },
};