<template>
|
|
<view class="page">
|
|
|
|
<view>
|
|
<!-- <uv-swiper
|
|
:list="bannerList"
|
|
indicator
|
|
height="490rpx"
|
|
indicatorStyle="bottom: 100rpx;"
|
|
keyName="image"></uv-swiper> -->
|
|
<image :src="headInfo.bg" style="width: 100%;height: 490rpx;" mode="aspectFill"></image>
|
|
</view>
|
|
|
|
<!-- 瑶都万能墙 -->
|
|
<view class="Headbackground">
|
|
<view class="Toggle">
|
|
<uv-icon size="30rpx" color="#fff" name="map"></uv-icon>
|
|
江华瑶族自治县
|
|
</view>
|
|
<view class="top">
|
|
<view class="profilePicture">
|
|
<image :src="headInfo.headImage" mode=""></image>
|
|
</view>
|
|
<view class="UniversalWall">
|
|
<view class="dynamic">
|
|
{{ headInfo.name }}
|
|
</view>
|
|
|
|
<!-- <view class="dynamics">
|
|
{{headInfo.num}}动态
|
|
|
|
<text>|</text>
|
|
<view
|
|
@click="$utils.navigateTo('/pages_order/mine/allUser')"
|
|
>
|
|
{{headInfo.userNum}}江华人
|
|
</view>
|
|
</view>
|
|
<view class="dynamics">
|
|
{{headInfo.homeNum}}租房
|
|
|
|
<text>|</text>
|
|
{{headInfo.jobNum}}工作
|
|
|
|
<text>|</text>
|
|
{{headInfo.jdNum}}景点
|
|
|
|
<text>|</text>
|
|
{{headInfo.shopNum}}美食
|
|
|
|
<text>|</text>
|
|
{{headInfo.activityNum}}活动
|
|
</view> -->
|
|
<view class="dynamics">
|
|
江华便民生活好帮手
|
|
</view>
|
|
</view>
|
|
|
|
<view class="join" @click="join">
|
|
<view v-if="userInfo.idCardOpen == 0">
|
|
审核中
|
|
</view>
|
|
<view v-else-if="!userInfo.idCardOpen">
|
|
成为会员
|
|
</view>
|
|
<view v-else>
|
|
<uv-icon color="#fff" size="30rpx" name="list-dot"></uv-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="box">
|
|
|
|
<!-- 菜单栏 -->
|
|
<scroll-view scroll-x="true">
|
|
<view class="life">
|
|
|
|
<view class="mouse"
|
|
@click="menuClick(item.url)"
|
|
v-if="index < 9"
|
|
:key="index" v-for="(item, index) in menu">
|
|
<view class="RentingAhouseimg">
|
|
<image :src="item.icon" mode=""></image>
|
|
</view>
|
|
<view class="RentingAhouse">
|
|
{{ item.title }}
|
|
</view>
|
|
</view>
|
|
|
|
<view class="more"
|
|
v-if="menu.length > 8"
|
|
@click="menuClick(item.url)" >
|
|
<view class="RentingAhouseimg">
|
|
<image src="" mode=""></image>
|
|
</view>
|
|
<view class="RentingAhouse">
|
|
更多
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
|
|
<!-- 分类 -->
|
|
<view class="LabelOptions">
|
|
<uv-tabs :list="category" :activeStyle="{color : '#000', fontWeight : 900, fontSize : '36rpx'}"
|
|
lineColor="#5baaff" lineHeight="8rpx" lineWidth="60rpx" keyName="title"
|
|
@click="tabsClick"></uv-tabs>
|
|
</view>
|
|
|
|
<!-- 动态列表 -->
|
|
<view class="dynamicList">
|
|
<dynamicItem :key="index" v-for="(item, index) in list" :item="item"
|
|
@click="$utils.navigateTo('/pages_order/post/postDetail?id=' + item.id)" />
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 页面浮窗 -->
|
|
<createDetailPopup @customerServiceOpen="$refs.customerServicePopup.open()"
|
|
@integralDetailsOpen="$refs.integralDetailsPopup.open('bottom')" />
|
|
|
|
<!-- 加入我们 -->
|
|
<certificationPopup ref="certificationPopup" />
|
|
|
|
<!-- 分享 -->
|
|
<sharePopup ref="sharePopup" />
|
|
|
|
<!-- 签到获取积分 -->
|
|
<signInOnePopup ref="signInOnePopup" />
|
|
|
|
<!-- 联系客服 -->
|
|
<customerServicePopup :title="headInfo.details" :image="headInfo.kefu" ref="customerServicePopup" />
|
|
|
|
<!-- 隐私协议 -->
|
|
<PrivacyAgreementPoup />
|
|
|
|
<!-- 积分规则 -->
|
|
<uv-popup ref="integralDetailsPopup" :round="30" :customStyle="{height: '60vh'}">
|
|
<view style="overflow: scroll;padding: 30rpx 20rpx;">
|
|
<uv-parse :content="headInfo.integralDetails"></uv-parse>
|
|
</view>
|
|
</uv-popup>
|
|
|
|
<tabber select="0" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import PrivacyAgreementPoup from '@/components/config/PrivacyAgreementPoup.vue'
|
|
import tabber from '@/components/base/tabbar.vue'
|
|
import certificationPopup from '@/components/user/certificationPopup.vue'
|
|
import createDetailPopup from '@/components/user/createDetailPopup.vue'
|
|
import customerServicePopup from '@/components/user/customerServicePopup.vue'
|
|
import sharePopup from '@/components/user/sharePopup.vue'
|
|
import signInOnePopup from '@/components/user/signInOnePopup.vue'
|
|
import dynamicItem from '@/components/list/dynamic/dynamicItem.vue'
|
|
import mixinsList from '@/mixins/list.js'
|
|
import {
|
|
mapState
|
|
} from 'vuex'
|
|
export default {
|
|
mixins: [mixinsList],
|
|
components: {
|
|
tabber,
|
|
PrivacyAgreementPoup,
|
|
createDetailPopup,
|
|
customerServicePopup,
|
|
dynamicItem,
|
|
certificationPopup,
|
|
sharePopup,
|
|
signInOnePopup,
|
|
},
|
|
data() {
|
|
return {
|
|
// headInfo: {},
|
|
menu: [],
|
|
mixinsListApi: 'getPostPage',
|
|
bannerList: [],
|
|
onShowData: false,
|
|
}
|
|
},
|
|
onLoad(query) {
|
|
if (query.shareId) {
|
|
uni.setStorageSync('shareId', query.shareId)
|
|
}
|
|
|
|
this.getData()
|
|
// this.getIndexHeaderInfo()
|
|
this.$store.commit('getIndexHeaderInfo')
|
|
this.getClassifyList()
|
|
// this.getBannerList()
|
|
this.$store.commit('getCategory')
|
|
},
|
|
onShareAppMessage(res) {
|
|
return {
|
|
title: this.headInfo.name,
|
|
path: '/pages/index/index'
|
|
}
|
|
},
|
|
onShow() {
|
|
this.getUserInfo()
|
|
},
|
|
onPullDownRefresh() {
|
|
// this.getIndexHeaderInfo()
|
|
this.getClassifyList()
|
|
// this.getBannerList()
|
|
this.$store.commit('getCategory')
|
|
this.getUserInfo()
|
|
},
|
|
computed: {
|
|
...mapState(['city', 'category', 'userInfo', 'headInfo']),
|
|
},
|
|
methods: {
|
|
tabsClick(item) {
|
|
if (item.index) {
|
|
this.queryParams.classId = item.id
|
|
} else {
|
|
delete this.queryParams.classId
|
|
}
|
|
this.getData()
|
|
},
|
|
|
|
menuClick(url) {
|
|
|
|
if (!url){
|
|
uni.showToast({
|
|
title:'暂未开放,请耐心等待',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
// 跳转页面
|
|
if (url.includes('reLaunch:')) {
|
|
uni.reLaunch({
|
|
url: url.replace('reLaunch:', '')
|
|
})
|
|
} else {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
}
|
|
},
|
|
//获取首页头部信息
|
|
getIndexHeaderInfo() {
|
|
this.$api('getIndexHeaderInfo', res => {
|
|
if (res.code == 200) {
|
|
this.headInfo = res.result
|
|
}
|
|
})
|
|
},
|
|
//获取菜单
|
|
getClassifyList() {
|
|
this.$api('getClassifyList', res => {
|
|
if (res.code == 200) {
|
|
this.menu = res.result
|
|
}
|
|
})
|
|
},
|
|
//获取菜单
|
|
getClassifyList() {
|
|
this.$api('getClassifyList', res => {
|
|
if (res.code == 200) {
|
|
this.menu = res.result
|
|
}
|
|
})
|
|
},
|
|
// 获取banner
|
|
getBannerList() {
|
|
this.$api('getBannerList', res => {
|
|
if (res.code == 200) {
|
|
this.bannerList = res.result
|
|
}
|
|
})
|
|
},
|
|
join() {
|
|
if (!uni.getStorageSync('token')) {
|
|
uni.navigateTo({
|
|
url: '/pages_order/auth/wxLogin'
|
|
})
|
|
return
|
|
}
|
|
|
|
// if(this.userInfo.idCardOpen == 0){
|
|
// uni.showToast({
|
|
// title: '审核中...',
|
|
// icon:'none'
|
|
// })
|
|
// }else if(!this.userInfo.idCardOpen){
|
|
// this.$refs.certificationPopup.open()
|
|
// }else{
|
|
this.$refs.sharePopup.open()
|
|
// }
|
|
|
|
},
|
|
getUserInfo() {
|
|
if (uni.getStorageSync('token')) {
|
|
this.$store.commit('getUserInfo')
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.page {
|
|
position: relative;
|
|
|
|
/deep/ .uv-tabs__wrapper__scroll-view::-webkit-scrollbar {
|
|
width: 0 !important;
|
|
height: 0 !important;
|
|
}
|
|
}
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.Headbackground {
|
|
position: absolute;
|
|
width: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
padding-top: 80rpx;
|
|
|
|
// background: linear-gradient(to bottom, rgb(85, 94, 123), rgb(45, 51, 73));
|
|
.Toggle {
|
|
margin: 10rpx 30rpx;
|
|
padding: 20rpx;
|
|
background-color: #00000022;
|
|
color: #fff;
|
|
border-radius: 40rpx;
|
|
width: fit-content;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.top {
|
|
display: flex;
|
|
color: white;
|
|
padding: 25rpx;
|
|
align-items: center;
|
|
position: relative;
|
|
|
|
.profilePicture {
|
|
width: 150rpx;
|
|
height: 150rpx;
|
|
|
|
image {
|
|
border-radius: 20rpx;
|
|
}
|
|
}
|
|
|
|
.UniversalWall {
|
|
padding: 0rpx 20rpx;
|
|
|
|
.dynamic {
|
|
font-size: 40rpx;
|
|
letter-spacing: 5rpx;
|
|
}
|
|
|
|
.dynamics {
|
|
margin-top: 20rpx;
|
|
font-size: 25rpx;
|
|
display: flex;
|
|
|
|
text {
|
|
margin: 0 10rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.join {
|
|
position: absolute;
|
|
right: 10rpx;
|
|
top: 40rpx;
|
|
padding: 10rpx 20rpx;
|
|
background-color: $uni-color;
|
|
margin-left: auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 50rpx;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.box {
|
|
margin-top: -70rpx;
|
|
background-color: #fff;
|
|
border-top-left-radius: 40rpx;
|
|
border-top-right-radius: 40rpx;
|
|
position: relative;
|
|
z-index: 9;
|
|
overflow: hidden;
|
|
|
|
.life {
|
|
|
|
display: flex;
|
|
text-align: center;
|
|
padding: 10rpx 0;
|
|
flex-wrap: wrap;
|
|
|
|
|
|
.mouse {
|
|
// margin-top: 20rpx;
|
|
width: 20%;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
font-size: 26rpx;
|
|
flex-shrink: 0;
|
|
|
|
.RentingAhouseimg {
|
|
margin-top: 20rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
|
|
image {
|
|
width: 70rpx;
|
|
height: 70rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.more {
|
|
margin-top: 85rpx;
|
|
margin-left: 47rpx;
|
|
}
|
|
}
|
|
|
|
.dynamicList {
|
|
padding-top: 10rpx;
|
|
}
|
|
}
|
|
</style>
|