Enzo 4 years ago
parent
commit
3ef7961c5f
  1. 3
      App.vue
  2. 66
      components/lf-adModal/lf-adModal.vue
  3. 17
      pages.json
  4. 7
      pages/index/index/index.vue
  5. 69
      pages/index/openScreenAd/openScreenAd.vue

3
App.vue

@ -7,6 +7,9 @@ export default {
share: false, // false
},
onLaunch: function(e) {
// 广 TODO
// this.$url('/pages/index/openScreenAd/openScreenAd', {type: 'redirect'});
// #ifdef MP-WEIXIN
var referrerInfo = e.referrerInfo;
if (referrerInfo.appId) {

66
components/lf-adModal/lf-adModal.vue

@ -0,0 +1,66 @@
<template>
<view class="content" v-if="value">
<view class="box">
<image class="img" src="https://picsum.photos/200" mode="aspectFill" @click="clickAd"></image>
<view class="close" @click="close">
<text class="lf-iconfont icon-shanchu"></text>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
value: {
type: Boolean,
default: true
}
},
created(){
},
methods: {
clickAd(){
this.$msg('您点击了广告图')
},
close(){
this.$emit('update:value', false);
}
}
}
</script>
<style lang="scss" scoped="scoped">
.content{
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
position: fixed;
left: 0;
top: 0;
.box{
width: 600rpx;
height: max-content;
.img{
width: 600rpx;
height: 840rpx;
border: 1rpx solid #979797;
}
.close{
width: 70rpx;
height: 70rpx;
margin: 34rpx auto 0;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
text{
font-size: 80rpx;
}
}
}
}
</style>

17
pages.json

@ -654,7 +654,14 @@
"style" : {
"navigationBarTitleText": "设置"
}
}
},
{
"path" : "pages/index/openScreenAd/openScreenAd",
"style" : {
"navigationBarTitleText": "欢迎使用",
"navigationStyle": "custom"
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
@ -703,8 +710,12 @@
"name": "首页", //
"path": "pages/index/index/index", //
"query": "" //onLoad
}
},
{
"name": "测试",
"path": "pages/index/openScreenAd/openScreenAd",
"query": ""
}
]
}

7
pages/index/index/index.vue

@ -320,6 +320,8 @@
</view>
</view>
</view>
<!-- ad广告弹出组件 TODO 暂时先注释 -->
<!-- <lf-ad-modal :value.sync="show_ad"></lf-ad-modal> -->
<!-- tabbar组件 -->
<lf-tabbar />
</block>
@ -344,6 +346,7 @@
import birthday from '@/components/birthday/birthday.vue';
import lfNav from '@/components/lf-nav/lf-nav.vue';
import lfTabbar from '@/components/lf-tabbar/lf-tabbar.vue';
import lfAdModal from '@/components/lf-adModal/lf-adModal.vue';
var app = getApp();
export default {
data() {
@ -383,6 +386,7 @@
userInfo: '',
microData:"",
is_login:'',//
show_ad: true
};
},
@ -404,7 +408,8 @@
indexGrouping,
birthday,
lfNav,
lfTabbar
lfTabbar,
lfAdModal
},
onShow(e) {

69
pages/index/openScreenAd/openScreenAd.vue

@ -0,0 +1,69 @@
<template>
<view class="content">
<image class="img" src="https://picsum.photos/200" mode="aspectFill"></image>
<view class="tips" @click="next">跳过 {{ num }}s</view>
</view>
</template>
<script>
export default {
data(){
return {
num: 5,
timer: null
}
},
onLoad(){
this.timer = setInterval(() => {
this.num--;
if(this.num <= 0){
clearInterval(this.timer);
this.timer = null;
this.next();
}
}, 1000);
},
onUnload(){
if(this.timer){
clearInterval(this.timer);
this.timer = null;
}
},
methods: {
next(){
this.$url('/pages/index/index/index', {type: 'redirect'});
}
}
}
</script>
<style>
page{
overflow: hidden;
}
</style>
<style lang="scss" scoped="scoped">
.content{
position: relative;
width: 100vw;
height: 100vh;
.img{
width: 100%;
height: 100%;
}
.tips{
position: absolute;
right: 32rpx;
top: 132rpx;
width: 144rpx;
height: 55rpx;
background-color: rgba(0,0,0,0.5);
color: #FFFFFF;
font-size: 26rpx;
display: flex;
justify-content: center;
align-items: center;
border-radius: 28rpx;
}
}
</style>
Loading…
Cancel
Save