Skip to content

html / h5wandahuijia

Go to a project
Commit d779eba3 by mamingqun
Options

将提示写活

parent 8a4e8f68
Showing with 102 additions and 83 deletions
src/components/Fuceng.vue
<template> <template>
<div class="fuceng"> <div class="fuceng">
<div class="fucengBox"> <div class="fucengBox">
<div class="content"> <!-- <div class="content">
<div class="title">最美万达摄影月赛·春节回家</div> <div class="title">最美万达摄影月赛·春节回家</div>
<p>以“春节回家”为主题方向，<span class='jiacu'>有奖征集</span>与万达人和万达粉丝们春节回家过年相关的<span class='jiacu'>摄影作品</span>。</p> <p>
<p>反映春运返乡道路上的艰难与劳顿，回家后的放松与惬意，亲人团聚时刻的幸福和笑脸，传递亲人、爱人、朋友、同窗、战友等不同情感的动人瞬间和情感故事。</p> 以“春节回家”为主题方向，
<p>投稿作品要求立意鲜明、形象生动、情感真切，有较强的视觉表现力。</p> <span class="jiacu">有奖征集</span>与万达人和万达粉丝们春节回家过年相关的
</div> <span class="jiacu">摄影作品</span>。
<div class="close" @click="closeFuceng"></div> </p>
</div> <p>反映春运返乡道路上的艰难与劳顿，回家后的放松与惬意，亲人团聚时刻的幸福和笑脸，传递亲人、爱人、朋友、同窗、战友等不同情感的动人瞬间和情感故事。</p>
<p>投稿作品要求立意鲜明、形象生动、情感真切，有较强的视觉表现力。</p>
</div>-->
<img :src="fucengImg" alt>
<div class="close" @click="closeFuceng"></div>
</div> </div>
</div>
</template> </template>
<script> <script>
export default { export default {
data() { props: {
return { fucengImg: {
required: true
}
},
data() {
return {
imgUrl: null
}
},
mounted() {
var modal = document.getElementsByClassName('fucengBox')[0];
modal.addEventListener('touchmove', function (e) {
e.preventDefault();
}, false)
} setTimeout(() => {
}, this.imgUrl = window.windowFuceng
mounted() { }, 1000);
var modal = document.getElementsByClassName('fucengBox')[0];
modal.addEventListener('touchmove', function (e) { },
e.preventDefault(); methods: {
}, false) closeFuceng() {
}, $eventbus.$emit('closeFuceng')
methods: {
closeFuceng() {
$eventbus.$emit('closeFuceng')
}
} }
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.jiacu{ .jiacu {
font-weight: bold; font-weight: bold;
} }
.fuceng { .fuceng {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
z-index: 1000000; z-index: 1000000;
.fucengBox { .fucengBox {
width: 9rem; width: 9rem;
height: 12.5rem; height: 12.5rem;
background: url("~@/pages/index/assets/images/Fuceng.png") no-repeat // background: url("~@/pages/index/assets/images/Fuceng.png") no-repeat center;
center; background-size: contain;
background-size: contain; position: absolute;
position: absolute; top: 50%;
top: 50%; left: 50%;
left: 50%; transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
.content { .content {
width: 6.5rem; width: 6.5rem;
height: 7.5rem; height: 7.5rem;
position: absolute; position: absolute;
top: 55%; top: 55%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
// background: green;
.title{ .title {
font-size: 40px; font-size: 40px;
color: #cf9a56; color: #cf9a56;
margin-bottom: 20px; margin-bottom: 20px;
white-space: nowrap; white-space: nowrap;
} }
p{ p {
font-size: 28px; font-size: 28px;
line-height: 43px; line-height: 43px;
color: #002663; color: #002663;
text-align: justify; text-align: justify;
margin-bottom: 15px; margin-bottom: 15px;
} }
} }
.close { .close {
width: 1.5rem; width: 1.2rem;
height: 1.5rem; height: 1.2rem;
position: absolute; position: absolute;
bottom: 0px; bottom: 0px;
left: 50%; left: 50%;
transform: translate(-50%, 0); transform: translate(-50%, 0);
// background: red; z-index: 100000;
z-index: 100000; background: url("~@/pages/index/assets/images/close2.png") no-repeat center;
} background-size: 100% 100%;
} }
}
img {
width: 90%;
position: absolute;
left: 50%;
transform: translate(-50%, 0);
}
} }
</style> </style>
src/pages/index/Shouye.vue
...@@ -105,8 +105,8 @@ ...@@ -105,8 +105,8 @@
<div class="wangqiList"></div> <div class="wangqiList"></div>
<a v-show="tabActive !== 3" :href="userCenter" class="user"></a> <a v-show="tabActive !== 3" :href="userCenter" class="user"></a>
<mt-actionsheet :actions="wangqiTitle" v-model="wangqiList"></mt-actionsheet> <mt-actionsheet :actions="wangqiTitle" v-model="wangqiList"></mt-actionsheet>
<Fuceng v-if="fucengButton=== 'close'?false:true"></Fuceng> <Fuceng :fucengImg="fucengImg" v-if="fucengButton=== 'close'?false:true&&fucengImg"></Fuceng>
<!-- <Fuceng></Fuceng> --> <!-- <Fuceng :fucengImg="fucengImg" v-if="fucengImg"></Fuceng> -->
</div> </div>
</template> </template>
...@@ -172,7 +172,8 @@ export default { ...@@ -172,7 +172,8 @@ export default {
// 用户信息 // 用户信息
realName: null, realName: null,
phoneNumber: null, phoneNumber: null,
detailAddress: null detailAddress: null,
fucengImg: null
}; };
}, },
computed: { computed: {
...@@ -212,7 +213,8 @@ export default { ...@@ -212,7 +213,8 @@ export default {
window.windowIndexHref = result.data.data.indexHref window.windowIndexHref = result.data.data.indexHref
window.windowUserCenterHref = result.data.data.userCenterHref window.windowUserCenterHref = result.data.data.userCenterHref
window.windowWrapHref = result.data.data.weapHref window.windowWrapHref = result.data.data.weapHref
this.fucengImg = result.data.data.notice
console.log(window.windowIndexHref); console.log(window.windowIndexHref);
console.log(window.windowUserCenterHref); console.log(window.windowUserCenterHref);
console.log(window.windowWrapHref); console.log(window.windowWrapHref);
...@@ -259,10 +261,6 @@ export default { ...@@ -259,10 +261,6 @@ export default {
this.watchEventBus(); this.watchEventBus();
setTimeout(() => {
console.log('this.$store.state.publicShareInfo')
console.log( this.$store.state.publicShareInfo.image )
}, 1000);
}, },
activated() { activated() {
setTimeout(() => { setTimeout(() => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment