185 lines
3.6 KiB
Vue
185 lines
3.6 KiB
Vue
<script setup>
|
|
/**
|
|
* 支付密码
|
|
* @property {Boolean} check 是否验证
|
|
* @property {Function} confirm 输入密码完成时回调
|
|
*/
|
|
import {
|
|
computed,
|
|
defineExpose,
|
|
ref,
|
|
getCurrentInstance,
|
|
defineEmits,
|
|
onMounted,
|
|
nextTick
|
|
} from 'vue';
|
|
import {
|
|
useStore
|
|
} from 'vuex'
|
|
// 工具库
|
|
import util from '@/common/js/util.js'
|
|
// api
|
|
import api from '@/api/index.js'
|
|
// 加密
|
|
import CryptoJS from 'crypto-js';
|
|
// 条形码输入框
|
|
import codeInput from '@/components/mine/codeInput.vue'
|
|
// 软键盘
|
|
import keyboard from '@/components/public/keyboard/keyboard.vue'
|
|
|
|
//
|
|
const props = defineProps({
|
|
// 是否验证
|
|
check: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
// 金额
|
|
price: {
|
|
type: [Number, String],
|
|
},
|
|
// 单位
|
|
unitKey: {
|
|
type: String,
|
|
default: 'balance'
|
|
},
|
|
})
|
|
|
|
//
|
|
const {
|
|
proxy
|
|
} = getCurrentInstance()
|
|
// 触发父组件事件
|
|
const emits = defineEmits(['confirm'])
|
|
// 仓库
|
|
const store = useStore()
|
|
// 密码
|
|
const pwd = ref('')
|
|
// 用户信息
|
|
const userinfo = computed(() => store.state.userinfo)
|
|
// 单位
|
|
const unit = computed(() => {
|
|
let config = util.config.payType
|
|
return config[props.unitKey] || {}
|
|
})
|
|
|
|
onMounted(() => {
|
|
console.log('onMounted', keyboard, proxy.$refs)
|
|
})
|
|
|
|
// 打开弹窗
|
|
function open() {
|
|
// 如果用户没有二级密码
|
|
if (userinfo.value.hasSecondCipher) {
|
|
proxy.$refs.pwdRef.open()
|
|
} else {
|
|
uni.navigateTo({
|
|
url: '/pages/mine/setting/secondPwd'
|
|
})
|
|
}
|
|
}
|
|
|
|
// 关闭弹窗
|
|
function close() {
|
|
proxy.$refs.pwdRef.close()
|
|
|
|
setTimeout(() => {
|
|
// 清空二级密码
|
|
pwd.value = ''
|
|
}, 500)
|
|
}
|
|
|
|
/**
|
|
* 支付键盘回调
|
|
* @param {Object} val
|
|
*/
|
|
function KeyInfo(val) {
|
|
// 判断是否输入的是删除键
|
|
if (val.keyCode === 8) {
|
|
// 删除最后一位
|
|
pwd.value = pwd.value.slice(0, -1)
|
|
return
|
|
}
|
|
// 如果大于六位
|
|
if (pwd.value.length >= 6) return
|
|
// 判断是否输入的是.
|
|
else if (val.keyCode == 190) {
|
|
// 输入.无效
|
|
} else {
|
|
pwd.value += val.key
|
|
// passwordArr.push(val.key);
|
|
}
|
|
}
|
|
|
|
// 确认
|
|
function handleConfirm() {
|
|
if (!/^\d{6}$/.test(pwd.value)) {
|
|
util.alert('二级密码不正确')
|
|
return
|
|
}
|
|
// 加密后的密码
|
|
let password = CryptoJS.MD5(pwd.value).toString()
|
|
//
|
|
if (!props.check) {
|
|
// 验证
|
|
emits('confirm', password)
|
|
close()
|
|
return
|
|
}
|
|
|
|
// 验证二级密码
|
|
api.mine.checkSecondLevelCipher({
|
|
data: {
|
|
secondLevelCipher: password,
|
|
}
|
|
}).then(rs => {
|
|
if (rs.code == 200) {
|
|
emits('confirm', password)
|
|
close()
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
})
|
|
}
|
|
|
|
//
|
|
defineExpose({
|
|
open,
|
|
close,
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<uni-popup ref="pwdRef" type="bottom">
|
|
<view class="pwdAlt popBot plr30 bfff">
|
|
<view class="header rows mtb30 f30">
|
|
<view class="title ">验证二级密码</view>
|
|
<uni-icons type="closeempty" @click="close()" />
|
|
</view>
|
|
|
|
<view class="tac f48" v-if="price || unit">
|
|
<text>￥{{price}}</text>
|
|
<text>{{unit.name}}</text>
|
|
</view>
|
|
|
|
<view class="line mtb20 plr30">
|
|
<codeInput v-model:modelValue="pwd" />
|
|
<!-- <input v-model="pwd" :maxlength="6" type="number" placeholder="输入二级密码" /> -->
|
|
</view>
|
|
|
|
<view class="btns mtb30 rows">
|
|
<view class="btn lg cancel plr40 f1" @click="$refs.pwdRef.close()">取消</view>
|
|
<view class="btn lg black plr40 f1" @click="handleConfirm">验证</view>
|
|
</view>
|
|
|
|
<!-- 安全键盘 -->
|
|
<keyboard ref="CodeKeyboard" passwrdType="pay" @KeyInfo="KeyInfo" />
|
|
</view>
|
|
</uni-popup>
|
|
</template>
|
|
|
|
<style>
|
|
</style> |