purchase-let/components/bindPhone.vue

53 lines
1.3 KiB
Vue
Raw Normal View History

2024-05-06 11:51:21 +08:00
<template>
<up-popup :show="show" round="10" @close="close" mode="center" :safeAreaInsetBottom="false">
<view class="m-modal-popup">
<view class="head-title-modal">绑定手机号</view>
<view class="content-modal">系统检测到您未绑定手机号, 为方便您继续使用, 请绑定手机号码</view>
<view class="btn-box-modal">
<view style="width: 130rpx;"><up-button @click="close" plain color="#999">取消绑定</up-button></view>
<view style="width: 350rpx;"><up-button @getphonenumber="change" open-type="getPhoneNumber" color="#20B128">立即绑定</up-button></view>
</view>
</view>
</up-popup>
</template>
<script setup>
const props = defineProps({
show: {
type: Boolean,
default: false
}
})
const emit = defineEmits(['close', 'change']);
const close = () => {
emit('close');
}
const change = (e)=>{
emit('change', e);
}
</script>
<style scoped lang="scss">
.m-modal-popup{
width: 500rpx;
padding: 40rpx;
.head-title-modal{
font-size: 32rpx;
text-align: center;
}
.content-modal{
font-size: 26rpx;
color: #999;
text-align: center;
padding: 40rpx 0;
}
.btn-box-modal{
display: flex;
justify-content: space-between;
}
}
</style>