Files
sociology_app/pages/advertisement/index/index.vue
2024-05-17 18:02:49 +08:00

305 lines
7.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view v-if="show">
<swiper class="guide_pages_swiper" indicator-dots="true" indicator-color="#d1d1d1"
indicator-active-color="#54a966">
<swiper-item>
<view class="guide_pages_bg1">
众妙之门
<br />
融儒文为一体<br />
带你感受国学之美
</view>
</swiper-item>
<swiper-item>
<view class="guide_pages_bg2">
众妙之门
<br />
融儒文为一体<br />
带你感受国学之美
</view>
</swiper-item>
<swiper-item>
<view class="guide_pages_bg3">
众妙之门
<br />
融儒文为一体<br />
带你感受国学之美
</view>
<button v-if="screenHeight > 667" style="color: #fff; border-color: #fff"
class="guide_pages_close close_1624" @click="onClose">
开始使用
</button>
<button v-else class="guide_pages_close close_btj" @click="onClose"
style="color: #fff; border-color: #fff">
开始使用
</button>
</swiper-item>
</swiper>
<u-popup :show="protocolShow" mode="center" round="6">
<view class="popup_box">
<view class="title">温馨提示</view>
<view class="content">
<view class="top">尊敬的用户感谢您信任并使用众妙之门</view>
<view class="center">众妙之门非常重视您的隐私保护和个人信息保护在您使用众妙之门提供的产品或服务前请务必仔细阅读<text class="aui-text-success"
@click="openDetail(1)">用户协议</text><text class="aui-text-success"
@click="openDetail(2)">隐私政策</text>全部条款众妙之门可能会收集您的相关使用信息个人信息未经授权众妙之门不会向任何第三方提供您的信息
</view>
<view class="bottom">
如您点击同意代表您已阅读并同意<text class="aui-text-success" @click="openDetail(1)">用户协议</text><text
class="aui-text-success"
@click="openDetail(2)">隐私政策</text>的全部条款众妙之门会尽全力保障您的合法权益并为您提供更优质的产品和服务
<view class="button_box">
<u-button size="small" text="不同意" @click="onDisagree"></u-button>
<u-button text="同意" color="#3AB3AE" size="small" @click="close"></u-button>
</view>
</view>
</view>
</view>
</u-popup>
<u-popup :show="DisagreeProtocolShow" mode="center" round="6">
<view class="popup_box">
<view class="title" style="text-align: center; color: #333">温馨提示</view>
<view class="content">
<view class="center">我们非常重视对您个人信息的保护如不同意很遗憾我们将无法提供服务</view>
<view class="button_box">
<u-button color="#b0b0b0" size="small" :plain="true" text="退出应用" @click="quit"></u-button>
<u-button color="#3AB3AE" text="再次查看" :plain="true" size="small" @click="onSee"></u-button>
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import {
mapState,
mapMutations
} from "vuex";
export default {
data() {
return {
screenHeight: 667,
show: false,
protocolShow: false,
DisagreeProtocolShow: false,
};
},
created() {
this.show = false;
this.protocolShow = false;
this.DisagreeProtocolShow = false;
if (uni.getStorageSync("guidePages") != 2) {
let systemInfo = uni.getSystemInfoSync();
this.screenHeight = systemInfo.screenHeight;
this.show = true;
this.protocolShow = true;
} else {
uni.switchTab({
url: "/pages/homePage/index/index",
success: function() {
let page = getCurrentPages()[0];
console.log(page);
page.$vm.requestAll();
},
});
}
},
methods: {
openDetail(type) {
console.log('type at line 152:', type)
uni.navigateTo({
url: "/pages/advertisement/index/detail?type=" + type,
});
},
quit() {
if (uni.getSystemInfoSync().platform === "ios") {
plus.runtime.launchApplication({
action: "QUIT"
});
} else {
plus.runtime.quit();
}
},
onSee() {
this.protocolShow = true;
this.DisagreeProtocolShow = false;
},
onDisagree() {
this.protocolShow = false;
this.DisagreeProtocolShow = true;
},
close() {
this.protocolShow = false;
},
onClose() {
uni.setStorageSync("guidePages", 2);
this.show = false;
this.protocolShow = false;
uni.redirectTo({
url: "/pages/user/login/login",
});
},
},
};
</script>
<style lang="scss">
.guide_pages_swiper {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: #000;
z-index: 10000;
image {
width: 100vw;
height: 100vh;
}
.guide_pages_bg1 {
width: 100vw;
height: 100vh;
background: url("@/static/icon/e_0ban_1.png") no-repeat bottom center;
background-size: cover;
// background-color: #4CD964;
display: flex;
align-items: center;
justify-content: center;
color: #000;
font-size: 46rpx;
font-weight: bold;
line-height: 80rpx;
}
.guide_pages_bg2 {
width: 100vw;
height: 100vh;
background: url("@/static/icon/e_0ban_2.jpg") no-repeat;
background-size: cover;
// background-color: #007AFF;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 46rpx;
font-weight: bold;
line-height: 80rpx;
}
.guide_pages_bg3 {
width: 100vw;
height: 100vh;
background: url("@/static/icon/e_0ban_3.png") no-repeat;
background-size: cover;
// background-color: #EA552D;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 46rpx;
font-weight: bold;
line-height: 80rpx;
}
.guide_pages_close {
border: 2rpx solid #000;
color: #000;
line-height: 68rpx;
height: 68rpx;
}
.close_btj {
position: absolute;
top: 50%;
left: 50%;
width: 290rpx;
height: 68rpx;
transform: translateX(-50%) translateY(438rpx);
background-color: transparent;
}
.close_1624 {
position: absolute;
top: 50%;
left: 50%;
width: 290rpx;
height: 68rpx;
background-color: transparent;
transform: translateX(-50%) translateY(412rpx);
}
}
.title {
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
font-size: 46rpx;
color: #3ab3ae;
background-color: #f5f5f5;
// line-height: 46rpx;
padding: 20rpx;
// border-leradius: 6px;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.aui-text-success {
color: #3ab3ae;
}
.popup_box {
padding-bottom: 20rpx;
width: 85vw;
overflow: hidden;
position: relative;
height: auto;
.content {
font-size: 32rpx;
letter-spacing: 0.15rpx;
padding: 20rpx;
color: #3f3f3f;
.top {
margin: 30rpx 0;
}
.center {
line-height: 40rpx;
// padding:0 10rpx;
}
.bottom {
width: 100%;
margin-top: 60rpx;
font-size: 28rpx;
line-height: 32rpx;
color: #b0b0b0;
}
}
}
.button_box {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20rpx;
.u-button {
margin-left: 40rpx;
}
.u-button:nth-child(1) {
margin-left: 0;
}
}
/deep/.uni-swiper-dot-active {
color: #3ab3ae !important;
}
</style>