75 lines
1.8 KiB
Vue
75 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import { BOUND_PHONE_MASKED } from '@/constants/bind-phone'
|
|
import CodeInput from '@/pages/Login/user-register/components/CodeInput.vue'
|
|
import { navigateBackWithFallback } from '@/utils/navigate-back'
|
|
|
|
const boundPhone = BOUND_PHONE_MASKED
|
|
const code = ref('')
|
|
|
|
function handleBack() {
|
|
navigateBackWithFallback('/pages/personal-center/account-security/index')
|
|
}
|
|
|
|
function handleSubmit() {
|
|
if (!code.value.trim()) {
|
|
uni.showToast({ title: '请输入验证码', icon: 'none' })
|
|
return
|
|
}
|
|
|
|
uni.navigateTo({ url: '/pages/personal-center/bind-phone-new/index' })
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<view class="bind-phone">
|
|
<view class="bind-phone__navbar">
|
|
<view
|
|
class="bind-phone__back"
|
|
@tap="handleBack"
|
|
>
|
|
<image
|
|
class="bind-phone__back-icon"
|
|
src="/static/icons/icon-back.svg"
|
|
mode="aspectFit"
|
|
/>
|
|
</view>
|
|
<text class="bind-phone__navbar-title">
|
|
绑定手机号
|
|
</text>
|
|
<view class="bind-phone__navbar-placeholder" />
|
|
</view>
|
|
|
|
<view class="bind-phone__content">
|
|
<view class="bind-phone__field">
|
|
<text class="bind-phone__label">
|
|
已绑定手机号
|
|
</text>
|
|
<view class="bind-phone__phone">
|
|
<text class="bind-phone__phone-text">
|
|
{{ boundPhone }}
|
|
</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="bind-phone__field">
|
|
<text class="bind-phone__label">
|
|
验证码
|
|
</text>
|
|
<CodeInput v-model="code" />
|
|
</view>
|
|
|
|
<view
|
|
class="bind-phone__submit"
|
|
@tap="handleSubmit"
|
|
>
|
|
验证并换绑
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
@import './index.scss';
|
|
</style>
|