|
|
<template>
|
|
|
<view>
|
|
|
<u-popup :show="show" mode="bottom" @close="close" :round="10" zIndex="999999">
|
|
|
<view class="popup-box" style="background: #FFF;">
|
|
|
<view class="title">
|
|
|
授权登录
|
|
|
<view class="iconClear">
|
|
|
<u-icon name="close" size="14" @click="close"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
|
<view style="width: 100%;display: flex;justify-content: center;">
|
|
|
<u-icon color="#19be6b" name="fingerprint" size="40px"></u-icon>
|
|
|
</view>
|
|
|
<view class="logo-box">
|
|
|
|
|
|
<u-button v-if="storeDetail.display_setting && storeDetail.display_setting.wx_login_phone == 1"
|
|
|
type="success" text="登录/注册" open-type="getPhoneNumber"
|
|
|
@getphonenumber="getPhoneNumber"></u-button>
|
|
|
|
|
|
<u-button v-else type="success" text="登录" @click="click"></u-button>
|
|
|
</view>
|
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifdef MP-ALIPAY -->
|
|
|
<view style="width: 100%;display: flex;justify-content: center;">
|
|
|
<u-icon color="#2979ff" name="zhifubao" size="40px"></u-icon>
|
|
|
</view>
|
|
|
<view class="logo-box">
|
|
|
<u-button type="primary" text="支付宝授权登录" @click="click"></u-button>
|
|
|
</view>
|
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifdef H5 -->
|
|
|
<template v-if="$utils.isInWeChatBrowser()">
|
|
|
<view style="width: 100%;display: flex;justify-content: center;">
|
|
|
<u-icon color="#19be6b" name="fingerprint" size="40px"></u-icon>
|
|
|
</view>
|
|
|
<view class="logo-box">
|
|
|
<!-- <u-button @click="click" shape="circle" type="success" text="微信快捷登录"></u-button> -->
|
|
|
<u-button @click="$utils.toUrl('/subPackages/login/login/index')" shape="circle" type="success" text="微信快捷登录"></u-button>
|
|
|
</view>
|
|
|
</template>
|
|
|
<template v-else-if="$utils.isInAliBrowser()">
|
|
|
<view style="width: 100%;display: flex;justify-content: center;">
|
|
|
<u-icon color="#2979ff" name="zhifubao" size="40px"></u-icon>
|
|
|
</view>
|
|
|
<view class="logo-box">
|
|
|
<u-button @click="click" type="primary" text="支付宝授权登录"></u-button>
|
|
|
</view>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<view class="logo-box">
|
|
|
<u-button @click="$utils.toUrl('/subPackages/login/login/index')" shape="circle" type="success"
|
|
|
text="去登陆"></u-button>
|
|
|
</view>
|
|
|
</template>
|
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifdef APP -->
|
|
|
<template>
|
|
|
<view class="logo-box">
|
|
|
<u-button @click="$utils.toUrl('/subPackages/login/login/index')" shape="circle" type="success"
|
|
|
text="去登陆"></u-button>
|
|
|
</view>
|
|
|
</template>
|
|
|
<!-- #endif -->
|
|
|
</view>
|
|
|
</u-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
|
|
|
<script>
|
|
|
// #ifdef H5
|
|
|
// import ap from "@/uni_modules/alipayjsapi/alipayjsapi.js"
|
|
|
// #endif
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
|
|
|
}
|
|
|
},
|
|
|
props: {
|
|
|
show: Boolean
|
|
|
},
|
|
|
computed: {
|
|
|
storeDetail() {
|
|
|
return this.$store.state.$GstoreDetail || {}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
close() {
|
|
|
this.$emit('loginShow', false)
|
|
|
},
|
|
|
click() {
|
|
|
this.$emit('empower', true)
|
|
|
},
|
|
|
// // 微信登录 H5
|
|
|
// async weChatLogin() {
|
|
|
// // 从后端API获取微信H5相关信息
|
|
|
// const res = await this.$api.common.wechatH5();
|
|
|
// // 获取微信应用的 appid
|
|
|
// const appid = res.data.appid;
|
|
|
// // 获取当前页面的重定向地址并进行编码
|
|
|
// let redirect_uri = window.location.href;
|
|
|
// redirect_uri = encodeURIComponent(redirect_uri);
|
|
|
// // 构建微信授权链接，包含应用的appid、重定向地址等参数
|
|
|
// const wxAuthUrl =
|
|
|
// `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`;
|
|
|
// // 通过重定向将用户导向微信授权页面
|
|
|
// window.location.href = wxAuthUrl;
|
|
|
// },
|
|
|
// // 支付宝h5登陆
|
|
|
// async aliH5Login() {
|
|
|
// // 获取和授权的
|
|
|
// ap.getAuthCode({
|
|
|
// appId: '2021004101685250',
|
|
|
// scopes: ['auth_user'],
|
|
|
// }, function(res) {
|
|
|
// ap.alert(JSON.stringify(res));
|
|
|
// if (res.authCode) {
|
|
|
|
|
|
// } else {
|
|
|
// uni.showToast({
|
|
|
// icon: 'none',
|
|
|
// title: res.errorDesc
|
|
|
// })
|
|
|
// }
|
|
|
// });
|
|
|
// },
|
|
|
async getPhoneNumber(e) {
|
|
|
let detail = e.detail
|
|
|
console.log(detail, 'detail')
|
|
|
if (detail.errMsg == 'getPhoneNumber:ok') {
|
|
|
let code = detail.code
|
|
|
this.login({
|
|
|
phone_code: code
|
|
|
})
|
|
|
} else {
|
|
|
uni.showToast({
|
|
|
icon: 'none',
|
|
|
title: detail.encryptedData
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
login({
|
|
|
phone_code
|
|
|
} = {}) {
|
|
|
// console.log(phone_code, 'phone_code')
|
|
|
this.$emit('goLogin', true, {
|
|
|
phone_code: phone_code
|
|
|
})
|
|
|
},
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.popup-box {
|
|
|
padding-bottom: 20px;
|
|
|
|
|
|
.title {
|
|
|
width: 100%;
|
|
|
height: 100rpx;
|
|
|
text-align: center;
|
|
|
position: relative;
|
|
|
line-height: 100rpx;
|
|
|
border-radius: 20rpx 20rpx 0 0;
|
|
|
font-weight: bold;
|
|
|
|
|
|
.iconClear {
|
|
|
position: absolute;
|
|
|
right: 20rpx;
|
|
|
top: 40rpx;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.logo-box {
|
|
|
padding: 30rpx 0;
|
|
|
text-align: center;
|
|
|
margin: 0 100rpx;
|
|
|
}
|
|
|
}
|
|
|
</style> |