敢为人鲜小程序前端代码仓库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

206 lines
4.2 KiB

<template>
<view class="login">
<view class="logo">
<image :src="configList.config_logo" mode="aspectFill" />
</view>
<view class="title">
{{ configList.config_app_name }}
</view>
<view class="btn mt" @tap="wxLogin">
<view class="">
手机号授权登录
</view>
</view>
<view class="btn b2" @tap="qux">
取消登录
<view class="config" @tap.stop>
<uv-checkbox-group v-model="checkboxValue" shape="circle">
<view class="content">
<view style="display: flex; align-items: start;">
<uv-checkbox size="34rpx" icon-size="26rpx" activeColor="#019245" :name="1"
style="margin-top: 6rpx;" />
<!-- <text class="text-privacy">阅读并同意我们的<text
@tap="$refs.popup.open('user_xy')">《服务协议与隐私条款》</text>以及<text
@tap="$refs.popup.open('user_ys')">《个人信息保护指引》</text></text> -->
<text class="text-privacy">
阅读并同意我们的
<text @tap="openPrivacyPopup(0)">
《服务协议与隐私条款》
</text>
以及
<text @tap="openPrivacyPopup(1)">
《个人信息保护指引》
</text>
</text>
</view>
<!-- <view class="">
以及<text @tap="$refs.popup.open('user_ys')">隐私政策</text>
</view> -->
</view>
</uv-checkbox-group>
</view>
</view>
<configPopup ref="popup" />
<PrivacyPopup ref="privacyPopup" :title="title">
<view>
<view>
<text>{{ serviceAgreement }}</text>
</view>
</view>
</PrivacyPopup>
</view>
</template>
<script>
import PrivacyPopup from '@/components/config/PrivacyPopup.vue'
export default {
name : 'Login',
components: {
PrivacyPopup
},
data() {
return {
checkboxValue : [],
config : {},
title: '服务协议',
serviceAgreement: '暂未拿到信息'
}
},
onLoad(query) {
if (query.shareId) {
uni.setStorageSync('shareId', query.shareId) // 存储分享Id
}
if(query.path){
this.config = query // 从路由拿取配置?
}
console.log('这是从路由拿到的配置', this.config);
},
methods: {
openPrivacyPopup(index){
if (index == 0) {
this.title = '服务协议'
this.serviceAgreement = this.configList.config_privacy_policy
} else {
this.title = '隐私政策'
this.serviceAgreement = this.configList.config_personal_protection
}
this.$refs.privacyPopup.open()
},
getPhoneNumber(e){
console.log(e, e.detail.code);
this.wxLogin(phoneCode)
},
wxLogin(phoneCode){
if(!this.checkboxValue.length){
return uni.showToast({
title: '请先同意隐私协议',
icon:'error',
})
}
this.$store.commit('login', this.config)
},
//打开应用配置
openConfigDetail(key){
this.$refs.popup.open(key)
},
qux(){
uni.reLaunch({
url: '/pages/index/index'
})
},
}
}
</script>
<style scoped lang="scss">
.login{
display: flex;
justify-content: center;
align-items: center;
height: 80vh;
flex-direction: column;
position: relative;
.logo{
height: 400rpx;
width: 400rpx;
image{
height: 400rpx;
width: 400rpx;
border-radius: 30rpx;
}
margin-bottom: 20rpx;
}
.title{
position: relative;
font-weight: 600;
font-size: 40rpx;
// &::after{
// content: '';
// position: absolute;
// left: 0;
// top: 100%;
// display: block;
// height: 8rpx;
// width: 210rpx;
// background: linear-gradient(to right,$uni-color, #fff);
// }
}
.btn{
all: unset;
width: 80%;
height: 100rpx;
display: flex;
justify-content: center;
align-items: center;
margin: 20rpx 0;
border-radius: 50rpx;
border: none;
&::after{
}
.icon{
margin-right: 10rpx;
image{
width: 40rpx;
height: 35rpx;
}
}
}
.b2{
// background-color: rgba($uni-color, 0.2);
color: #999;
border: 2rpx solid;
position: relative;
.config{
position: absolute;
bottom: -110%;
font-size: 24rpx;
text-align: center;
line-height: 40rpx;
width: 100%;
.text-privacy{
color: inherit;
text-align: left;
}
text{
color: $uni-color;
}
}
}
.mt{
color: #fff;
background-color: $uni-color;
margin-top: 100rpx;
}
}
</style>