You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
401 lines
8.0 KiB
401 lines
8.0 KiB
<template>
|
|
<view class="page">
|
|
|
|
<view>
|
|
<uv-swiper
|
|
:list="bannerList"
|
|
indicator
|
|
height="490rpx"
|
|
indicatorStyle="bottom: 100rpx;"
|
|
keyName="image"></uv-swiper>
|
|
</view>
|
|
|
|
<!-- 瑶都万能墙 -->
|
|
<view class="Headbackground">
|
|
<view class="Toggle">
|
|
<uv-icon
|
|
size="30rpx"
|
|
color="#fff"
|
|
name="map"></uv-icon>
|
|
江华瑶族自治县
|
|
</view>
|
|
<view class="top">
|
|
<view class="profilePicture"
|
|
@click="$refs.customerServicePopup.open()">
|
|
<image :src="headinfo.headImage" mode=""></image>
|
|
</view>
|
|
<view class="UniversalWall">
|
|
<view class="dynamic"
|
|
@click="$refs.customerServicePopup.open()">
|
|
{{ 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)"
|
|
: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>
|
|
</scroll-view>
|
|
|
|
<!-- 分类 -->
|
|
<view class="LabelOptions">
|
|
<uv-tabs :list="category"
|
|
:activeStyle="{color : '#000', fontWeight : 900}"
|
|
lineColor="#5baaff"
|
|
lineHeight="8rpx"
|
|
lineWidth="50rpx"
|
|
keyName="title"
|
|
@click="tabsClick"></uv-tabs>
|
|
</view>
|
|
|
|
<!-- 动态列表 -->
|
|
<view
|
|
class="dynamicList"
|
|
:style="{backgroundColor: queryParams.classId ? '' : 'wheat'}">
|
|
<dynamicItem
|
|
:key="index"
|
|
v-for="(item, index) in list"
|
|
:item="item"
|
|
@click="$utils.navigateTo('/pages_order/post/postDetail?id=' + item.id)"
|
|
/>
|
|
</view>
|
|
</view>
|
|
|
|
<createDetailPopup/>
|
|
<certificationPopup ref="certificationPopup"/>
|
|
<sharePopup ref="sharePopup"/>
|
|
|
|
<customerServicePopup
|
|
:title="headinfo.details"
|
|
:image="headinfo.kefu"
|
|
ref="customerServicePopup"/>
|
|
<PrivacyAgreementPoup />
|
|
|
|
<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 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,
|
|
},
|
|
data() {
|
|
return {
|
|
headinfo: {},
|
|
menu : [],
|
|
mixinsListApi : 'getPostPage',
|
|
bannerList : [],
|
|
onShowData : false,
|
|
}
|
|
},
|
|
onLoad(query) {
|
|
if(query.shareId){
|
|
uni.setStorageSync('shareId', query.shareId)
|
|
}
|
|
|
|
this.getData()
|
|
this.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']),
|
|
},
|
|
methods: {
|
|
tabsClick(item) {
|
|
if(item.index){
|
|
this.queryParams.classId = item.id
|
|
}else{
|
|
delete this.queryParams.classId
|
|
}
|
|
this.getData()
|
|
},
|
|
menuClick(url) {
|
|
// 跳转页面
|
|
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;
|
|
|
|
}
|
|
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;
|
|
width: 125rpx;
|
|
height: 50rpx;
|
|
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;
|
|
.mouse {
|
|
width: 20%;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
font-size: 26rpx;
|
|
flex-shrink: 0;
|
|
.RentingAhouseimg {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
image{
|
|
width: 70rpx;
|
|
height: 70rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.dynamicList{
|
|
padding-top: 10rpx;
|
|
}
|
|
}
|
|
|
|
</style>
|