203 lines
7.4 KiB
Vue
203 lines
7.4 KiB
Vue
<route lang="jsonc" type="page">{
|
||
"layout": "default",
|
||
"style": {
|
||
"navigationBarTitleText": "",
|
||
"navigationBarBackgroundColor": "#fff"
|
||
}
|
||
}</route>
|
||
|
||
<template>
|
||
<view>
|
||
<wd-popup v-model="showBindMobilePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||
<view class="relative pt-54rpx pb-74rpx">
|
||
<view class="text-[#303133] text-36rpx leading-46rpx text-center">绑定手机号码</view>
|
||
<view class="flex justify-center items-center mt-78rpx">
|
||
<wd-button type="text" open-type="getPhoneNumber" @getphonenumber="Login.handleBindMobile" custom-class="!p-0 !m-0 !bg-[#4C9F44] !h-90rpx !leading-90rpx !w-630rpx !text-[#fff] !rounded-8rpx">
|
||
一键绑定
|
||
</wd-button>
|
||
</view>
|
||
</view>
|
||
</wd-popup>
|
||
|
||
<view class="mx-48rpx mt-50rpx">
|
||
<view class="text-[#303133] text-40rpx leading-56rpx">
|
||
<text class="font-400 mr-24rpx">欢迎使用</text>
|
||
<text class="font-700">茶址</text>
|
||
</view>
|
||
<view class="font-400 text-26rpx leading-36rpx text-[#606266] mt-20rpx">登录后可进行茶室预约，开启您的专属茶席</view>
|
||
</view>
|
||
<view class="mt-176rpx w-162rpx h-160rpx mx-auto">
|
||
<wd-img :src="`${OSS}images/logo.png`" width="100%" height="100%" mode="aspectFill"></wd-img>
|
||
</view>
|
||
<view class="mt-124rpx mx-60rpx box-border">
|
||
<wd-button custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border" @click="Login.handleLogin">立即登录</wd-button>
|
||
<wd-button
|
||
v-if="env === 'development'"
|
||
custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border"
|
||
@click="Login.handleMobileLogin">
|
||
测试-账号登录
|
||
</wd-button>
|
||
<!-- <wd-button open-type="getUserInfo" @getuserinfo="Login.handleWxLogin" custom-class="!bg-[#4C9F44] !rounded-8rpx !text-[#fff] !text-30rpx !leading-42rpx !h-90rpx !w-[100%] box-border">立即登录</wd-button> -->
|
||
<!-- <view class="text-30rpx font-400 text-[#303133] leading-42rpx text-center mt-32rpx">其它手机号登录</view> -->
|
||
</view>
|
||
|
||
<view class="flex items-center mx-32rpx mt-64rpx">
|
||
<view class="w-32rpx h-32rpx">
|
||
<wd-checkbox v-model="agree" @change="Login.handleAgree" checked-color="#4C9F44" size="large"> </wd-checkbox>
|
||
</view>
|
||
<view class="font-400 text-26rpx leading-40rpx text-[#8F959E] ml-14rpx flex-1" @click="agree = !agree">
|
||
我已阅读并同意 <text class="text-[#4C9F44]" @click.stop="Login.handleToService">《服务协议》</text> 和<text class="text-[#4C9F44]" @click.stop="Login.handleToPrivacy">《隐私政策》</text>，未注册手机号登录后将自动你为您创建账号
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
|
||
<script lang="ts" setup>
|
||
import { toast } from '@/utils/toast'
|
||
import { getWxCode } from '@/api/login'
|
||
import { useUserStore } from '@/store'
|
||
import { router } from '@/utils/tools'
|
||
import { getMobileByMnp } from '@/api/user'
|
||
|
||
const OSS = inject('OSS')
|
||
const env = import.meta.env.VITE_NODE_ENV
|
||
|
||
// 服务协议条款
|
||
const agree = ref<boolean>(false)
|
||
|
||
const redirectUrl = ref<string>('')
|
||
const redirectParams = ref<string>('')
|
||
|
||
// 绑定手机号码popup
|
||
const showBindMobilePopup = ref<boolean>(false)
|
||
|
||
onLoad((args) => {
|
||
redirectUrl.value = args.redirect || ''
|
||
})
|
||
|
||
const Login = {
|
||
// 获取手机号
|
||
handleLogin: async (e: object) => {
|
||
if (!agree.value) {
|
||
toast.info('请同意服务协议和隐私政策')
|
||
return
|
||
}
|
||
|
||
uni.showLoading({
|
||
title: '登录中...',
|
||
mask: true
|
||
})
|
||
try {
|
||
const userStore = useUserStore()
|
||
const res = await userStore.wxLogin()
|
||
console.log("🚀 ~ res:", res)
|
||
uni.hideLoading()
|
||
if (!res.mobile) {
|
||
showBindMobilePopup.value = true
|
||
return false
|
||
}
|
||
|
||
Login.handleToLogin()
|
||
|
||
// Login.handleToLogin()
|
||
// if (res) {
|
||
// const decoded = decodeURIComponent(redirectUrl.value)
|
||
// console.log("🚀 ~ decoded:", decoded)
|
||
// if (decoded == '/bundle/order/tea-room/order-detail') {
|
||
// const transferOrderParams = uni.getStorageSync('transferOrderParams')
|
||
// uni.$emit('transferOrder', transferOrderParams)
|
||
// }
|
||
|
||
// toast.info('登录成功')
|
||
// router.navigateBack(1, 500)
|
||
// }
|
||
} catch(error) {
|
||
uni.hideLoading()
|
||
}
|
||
},
|
||
|
||
/**
|
||
* 一键授权绑定手机号码
|
||
*/
|
||
handleBindMobile: async (e: any) => {
|
||
uni.showLoading({ title: '绑定中...', mask: true })
|
||
try {
|
||
await getMobileByMnp(e.code)
|
||
showBindMobilePopup.value = false
|
||
|
||
// 手动设置登录状态
|
||
const userStore = useUserStore()
|
||
userStore.isLoggedIn = true
|
||
|
||
uni.hideLoading()
|
||
Login.handleToLogin()
|
||
} catch(error) {
|
||
uni.hideLoading()
|
||
}
|
||
},
|
||
|
||
/**
|
||
* 测试-账号登录
|
||
*/
|
||
handleMobileLogin: async () => {
|
||
const userStore = useUserStore()
|
||
console.log("🚀 ~ userStore:", userStore)
|
||
const res = await userStore.mobileLogin('15005837859', 1, 2)
|
||
if (res) {
|
||
uni.setStorageSync('latitude', '30.74744')
|
||
uni.setStorageSync('longitude', '120.78483')
|
||
toast.info('登录成功')
|
||
router.navigateBack(1, 500)
|
||
}
|
||
},
|
||
|
||
/**
|
||
* 登录成功跳转页面
|
||
*/
|
||
handleToLogin: () => {
|
||
const decoded = decodeURIComponent(redirectUrl.value)
|
||
console.log("🚀 ~ decoded:", decoded)
|
||
if (decoded == '/bundle/order/tea-room/order-detail') {
|
||
const transferOrderParams = uni.getStorageSync('transferOrderParams')
|
||
uni.$emit('transferOrder', transferOrderParams)
|
||
}
|
||
|
||
toast.info('登录成功')
|
||
router.navigateBack(1, 500)
|
||
},
|
||
|
||
handleAgree: async (e: any) => {
|
||
},
|
||
|
||
// 跳转到服务协议页面
|
||
handleToService: () => {
|
||
router.navigateTo('/pages/webview/webview?type=service')
|
||
},
|
||
|
||
// 跳转到隐私政策页面
|
||
handleToPrivacy: () => {
|
||
router.navigateTo('/pages/webview/webview?type=privacy')
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
background-color: #fff;
|
||
}
|
||
|
||
.service {
|
||
:deep() {
|
||
.wd-checkbox {
|
||
display: flex;
|
||
align-content: flex-start;
|
||
}
|
||
|
||
.wd-checkbox__label {
|
||
margin-left: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|