百富门答题小程序
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.
 
 
 

220 lines
4.5 KiB

<template>
<view class="home">
<image src="/static/image/bg/X1.png"
class="page-bg"
mode="aspectFill"></image>
<view class="content_now">
<view class="title">
Genius Journey Club
</view>
<view class="title-desc">
欢迎您的到来
</view>
<view class="desc">
使用小程序请确认您已满18周岁
</view>
<view class="mian-btn"
:class="{active:isActive === '未满18岁'}"
@click="setActive('未满18岁')">{{ '未满18岁' }}</view>
<view class="mian-btn"
:class="{active:isActive === '已满18岁'}"
@click="setActive('已满18岁')">{{ '已满18岁' }}</view>
<view class="checkbox">
<uv-checkbox-group v-model="checkboxValue">
<view class="flex-center"
style="flex-wrap: wrap;">
<uv-checkbox
size="40rpx"
icon-size="30rpx"
activeColor="#ecb864"
:name="1"></uv-checkbox>
<view>
我已仔细阅读并已同意以下
</view>
<view @click="$refs.popup.openContent(item.details)"
v-for="(item, index) in privacyPolicyList"
:key="item.id"
class="privacy"
v-if="index < 3"
>《 {{ item.title }} 》</view>
<text
class="privacy"
v-if="privacyPolicyList.length > 3"
@click="$refs.checkboxPopup.open('bottom')">
{{ privacyPolicyList.length }}项条款
</text>
<!-- <text @click="$refs.popup.open('user_ys_one')">《全球隐私声明1》</text>
<text @click="$refs.popup.open('user_ys_two')">《全球隐私声明2》</text>
<text @click="$refs.popup.open('user_xy_three')">《全球隐私声明3》</text>
-->
<!-- <text @click="$refs.popup.open('user_xy_four')">《全球隐私声明4》</text> -->
</view>
</uv-checkbox-group>
</view>
<view class="uni-color-btn"
@click="next">
立即开启
</view>
<text class="second-color">{{ configObj.bg_title }}</text>
</view>
<!-- <configPopup ref="popup"
required
:keys="keys"
@success="checkboxValue = [1]"/> -->
<uv-popup ref="checkboxPopup"
:round="30">
<view class="checkboxPopupContent">
<view @click="$refs.popup.openContent(item.details)"
v-for="item in privacyPolicyList"
:key="item.id"
> {{ item.title }} </view>
</view>
</uv-popup>
<configPopup ref="popup"/>
</view>
</template>
<script>
import { mapState } from 'vuex'
export default {
data() {
return {
isActive : null,
checkboxValue : [],
configObj : {},
keys : ['user_ys_one', 'user_ys_two', 'user_xy_three', 'user_xy_four'],
privacyPolicyList : [],
}
},
computed : {
},
onLoad() {
uni.$on('initConfig', data => {
this.configObj = data
})
this.getPrivacyPolicyList()
},
onShow() {
},
methods: {
setActive(value){
this.isActive = value
},
getPrivacyPolicyList(){
this.$api('privacyPolicyList', res => {
if(res.code == 200){
this.privacyPolicyList = res.result
}
})
},
next(){
if(!this.isActive){
uni.showToast({
title:'请选择',
icon: 'none'
})
return
}
if(!this.checkboxValue.length){
uni.showToast({
title:'请同意隐私政策',
icon: 'none'
})
// this.$refs.popup.openkeys()
return
}
if(!uni.getStorageSync('token')){
this.$utils.toLogin()
return
}
this.$store.commit('getUserInfo', () => {
uni.navigateTo({
url: '/pages/index/index'
})
})
},
}
}
</script>
<style lang="scss" scoped>
.content_now{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
position: fixed;
top: 55%;
transform: translate(0, -50%);
padding: 0 70rpx;
box-sizing: border-box;
width: 100%;
--color2 : #000;
.title-desc{
font-size: 26rpx;
}
.desc{
font-size: 26rpx;
margin-top: 30rpx;
}
.mian-btn{
border-color: $uni-color-primary;
color: $uni-color-primary;
}
.active{
background-color: $uni-color-primary;
color: #fff;
}
.checkbox{
margin-top: 470rpx;
view{
line-height: 50rpx;
}
.privacy{
color: #1e52ff;
}
}
.uni-color-btn{
width: 80%;
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
font-size: 26rpx;
}
}
.checkboxPopupContent{
padding: 40rpx;
display: flex;
flex-wrap: wrap;
view{
color: #1e52ff;
line-height: 50rpx;
}
}
</style>