3
0
Fork 0
web-store-retail-h5/components/pay-modal/index.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>