From fe75cffbf3bae6777aa2794fd89fa5dc37f5df8d Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 15 七月 2025 10:11:23 +0800
Subject: [PATCH] 项目初始化
---
src/pages_template/pages/keyboardPay/index.vue | 106 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 106 insertions(+), 0 deletions(-)
diff --git a/src/pages_template/pages/keyboardPay/index.vue b/src/pages_template/pages/keyboardPay/index.vue
new file mode 100644
index 0000000..1637ec6
--- /dev/null
+++ b/src/pages_template/pages/keyboardPay/index.vue
@@ -0,0 +1,106 @@
+<script setup>
+import { ref } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+
+const show = ref(false)
+const password = ref('')
+
+onLoad(() => {
+})
+
+const onChange = (val) => {
+ if (password.value.length < 6) {
+ password.value += val
+ }
+
+ if (password.value.length >= 6) {
+ pay()
+ }
+}
+
+const onBackspace = () => {
+ if (password.value.length > 0) {
+ password.value = password.value.substring(0, password.value.length - 1)
+ }
+}
+
+const pay = () => {
+ uni.showLoading({
+ title: '鏀粯涓�'
+ })
+
+ setTimeout(() => {
+ uni.hideLoading()
+ show.value = false
+ uni.showToast({
+ icon: 'success',
+ title: '鏀粯鎴愬姛'
+ })
+ }, 2000)
+}
+
+const showPop = (flag = true) => {
+ password.value = ''
+ show.value = flag
+ // #ifdef H5 || WEB
+ setTimeout(() => {
+ const btn = document.querySelector('.u-keyboard__button-wrapper__button.u-keyboard__button-wrapper__button--gray')
+ if (btn) {
+ console.log(btn)
+ btn.onclick = onBackspace
+ }
+ }, 500)
+ // #endif
+}
+
+const finish = () => {
+ console.log(11111)
+}
+</script>
+<template>
+ <view>
+ <view class="u-padding-40">
+ <u-button type="success" @click="showPop(true)">
+ <u-icon name="red-packet"></u-icon>
+ <text class="u-padding-left-10">鍙戦��1.00鍏冪孩鍖�</text>
+ </u-button>
+ </view>
+ <u-keyboard default="" ref="uKeyboard" mode="number" :mask="true" :mask-close-able="false" :dot-enabled="false"
+ :show="show" :safe-area-inset-bottom="true" :tooltip="false" @change="onChange" @backspace="onBackspace">
+ <view>
+ <view class="u-text-center u-padding-20 money">
+ <text>1.00</text>
+ <text class="u-font-20 u-padding-left-10">鍏�</text>
+ <view class="u-padding-10 close" data-flag="false" @tap="showPop(false)">
+ <u-icon name="close" color="#333333" size="28"></u-icon>
+ </view>
+ </view>
+ <view class="u-flex u-row-center">
+ <u-message-input mode="box" :maxlength="6" :dot-fill="true" v-model="password"
+ :disabled-keyboard="true" @finish="finish"></u-message-input>
+ </view>
+ <view class="u-text-center u-padding-top-10 u-padding-bottom-20 tips">鏀粯閿洏</view>
+ </view>
+ </u-keyboard>
+ </view>
+</template>
+
+<style lang="scss">
+.money {
+ font-size: 80rpx;
+ color: $u-warning;
+ position: relative;
+
+ .close {
+ position: absolute;
+ top: 20rpx;
+ right: 20rpx;
+ line-height: 28rpx;
+ font-size: 28rpx;
+ }
+}
+
+.tips {
+ color: $u-tips-color;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3