forked from angelo/web-retail-h5
69 lines
1.3 KiB
Vue
69 lines
1.3 KiB
Vue
|
<template>
|
||
|
|
<u-popup :show="isPw" mode="center" closeable @close="closePw">
|
||
|
|
<view class="t_tit mt-20">{{ '支付验证' }}</view>
|
||
|
|
<view class="box">
|
||
|
|
<view class="mt-20" v-if="isBank">请输入短信验证码</view>
|
||
|
|
<view class="mt-20" v-else>请输入密码</view>
|
||
|
|
<u--input v-if="isBank" border="surround" v-model="codeValue"></u--input>
|
||
|
|
<u--input
|
||
|
|
v-else
|
||
|
|
border="surround"
|
||
|
|
type="password"
|
||
|
|
v-model="codeValue"
|
||
|
|
></u--input>
|
||
|
|
<u-button
|
||
|
|
type="success"
|
||
|
|
class="mt-20"
|
||
|
|
shape="circle"
|
||
|
|
:loading="isLoading"
|
||
|
|
loadingText="支付中"
|
||
|
|
@tap="payPw()"
|
||
|
|
color="linear-gradient(to right, #005BAC, #005BAC )"
|
||
|
|
>{{ '立即支付' }}
|
||
|
|
</u-button>
|
||
|
|
</view>
|
||
|
|
</u-popup>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'PayModal',
|
||
|
|
props: {
|
||
|
|
isBank: {
|
||
|
|
type: Boolean,
|
||
|
|
default: false,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
isPw: false,
|
||
|
|
codeValue: '',
|
||
|
|
isLoading: false,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
::v-deep .u-popup__content {
|
||
|
|
width: 80%;
|
||
|
|
}
|
||
|
|
.box {
|
||
|
|
padding: 40px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.mt-20 {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
.t_tit {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.mt-20 {
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
.mt-20 {
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
</style>
|