kubbo/dvcp_v2_wechat_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug

Browse Source
This commit is contained in:
yanran200730
2022-11-02 17:47:19 +08:00
parent 33b9400e4a
commit 1a65407ef7
1 changed files with 121 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

150
src/project/tianfuxing/AppHome/AppHome.vue
View File

@@ -1,34 +1,44 @@
<template>
<div class="home">
<image class="banner" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/banner.png" />
<div class="nav">
<div class="nav-item" hover-class="text-hover" @click="$linkTo('./PhotoReport')">
<image mode="aspectFill" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/ssp.png" />
</div>
<div class="nav-item" hover-class="text-hover" @click="$linkTo('./Culture')">
<image mode="aspectFill" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/wmcd.png" />
<div class="header" :class="[isFixed ? 'header-active' : '']">
<div class="status-bar" :style="{height: statusBarHeight + 'px'}"></div>
<div class="nav-bar">
<h2>天府星小程序</h2>
</div>
</div>
<div class="activity-wrapper">
<h2>线下活动</h2>
<div class="activity-list">
<div class="activity-item" @click="$linkTo('./Activity?id=' + item.id)" hover-class="bg-hover" v-for="(item, index) in list" :key="index">
<div class="top">
<h2>{{ item.title }}</h2>
<p>{{ item.detail }}</p>
</div>
<div class="bottom">
<div class="item">
<h3>进场时间：</h3>
<span>{{ item.intoBegintime }} 至 {{ item.intoEndtime }}</span>
</div>
<div class="item">
<h3>进场时间：</h3>
<span>{{ item.exitBegintime }} 至 {{ item.exitEndtime }}</span>
</div>
</div>
<div></div>
<image class="bg-img" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/home-bg.png" />
<div class="wrapper">
<image class="banner" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/banner.png" />
<div class="nav">
<div class="nav-item" hover-class="text-hover" @click="$linkTo('./PhotoReport')">
<image mode="aspectFill" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/ssp.png" />
</div>
<div class="nav-item" hover-class="text-hover" @click="$linkTo('./Culture')">
<image mode="aspectFill" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/wmcd.png" />
</div>
</div>
<div class="activity-wrapper">
<h2>线下活动</h2>
<div class="activity-list">
<div class="activity-item" @click="$linkTo('./Activity?id=' + item.id)" hover-class="bg-hover" v-for="(item, index) in list" :key="index">
<div class="top">
<h2>{{ item.title }}</h2>
<p>{{ item.detail }}</p>
</div>
<div class="bottom">
<div class="item">
<h3>进场时间：</h3>
<span>{{ item.intoBegintime }} 至 {{ item.intoEndtime }}</span>
</div>
<div class="item">
<h3>进场时间：</h3>
<span>{{ item.exitBegintime }} 至 {{ item.exitEndtime }}</span>
</div>
</div>
</div>
<AiEmpty v-if="!list.length"></AiEmpty>
</div>
<AiEmpty v-if="!list.length"></AiEmpty>
</div>
</div>
</div>
@@ -38,15 +48,18 @@
import { mapActions, mapState } from 'vuex'
export default {
appName: '天府星小程序',
appName: '首页',
customNavigation: true,
navigationBarTitleText: '天府星小程序',
name: 'AppHome',
data () {
return {
current: 1,
list: [],
isMore: false
isMore: false,
isFixed: false,
statusBarHeight: 20,
}
},
@@ -55,6 +68,10 @@
},
onLoad () {
this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight
uni.setNavigationBarColor({
frontColor: '#000000'
})
this.getList()
if (!this.token) {
@@ -104,14 +121,89 @@
onReachBottom () {
this.getList()
},
onPageScroll (params) {
this.isFixed = params.scrollTop > 60
}
}
</script>
<style lang="scss" scoped>
.home {
position: relative;
padding: 32px 0 40px;
.bg-img {
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 100%;
height: 512px;
}
.wrapper {
position: relative;
z-index: 11;
padding-top: 208px;
}
.back-wrapper {
position: fixed;
z-index: 11;
left: 20px;
top: 24px;
width: 40px;
height: 40px;
image {
width: 40px;
height: 40px;
}
}
.header {
position: fixed;
left: 0;
top: 0;
z-index: 111;
width: 100%;
opacity: 1;
transition: all 0.2s ease;
.nav-bar {
position: relative;
height: 88px;
line-height: 88px;
color: #000;
font-size: 34px;
font-weight: 600;
text-align: center;
image {
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 40px;
height: 40px;
padding: 24px 20px 0 20px;
box-sizing: content-box;
}
}
&.header-active {
z-index: 1111;
opacity: 1;
color: #fff;
background: linear-gradient(180deg, #2D7DFF 0%, #2D7DFF 40%);
.nav-bar {
color: #fff;
}
}
}
.banner {
display: block;
width: 686px;