<template> <view class="home" :style="'padding-top:'+nvaHeight+'px;'"> <view class="navbox"> <uni-nav-bar color="#ffffff" leftWidth='400rpx' :background-color="backgroundColor" :border="false" statusBar='true' fixed="true"> <block slot="left"> <view class="topl flexc"> <image :src="adrimg" ></image> <view class="over">{{city}}</view> </view> </block> </uni-nav-bar> </view> <!-- 主体 --> <!-- <image :src="navbg" class="navbg"></image> --> <view class="wymain"> <view class="adrbox"> <view class="flexc mb14"> <image :src="adraimg" class="adr"></image> <view class="adrtit flex0">智慧<text>社区</text></view> <view v-if="voList&&voList.length>1"> <w-select style="margin-left: 20rpx;" v-model="chooseValue" :list='voList' width='200rpx' valueName='dictLabel' keyName="dictValue" :valuea="tenantId" :chosevalue="tenantName?tenantName:statusFormats(tenantId,voList,'tenant')" :filterable='filterable' @change='getchange' > </w-select> </view> </view> <view class="adrtxt flexc mb4"> <view class="over">嗨~{{nickName}}!</view><text>业主</text> </view> <view class="adrtip" v-if="houselist&&houselist.length">{{houselist[0].communityName}}{{houselist[0].detailedAddress}}</view> <image :src="adrbgimg" class="adrbgimg"></image> </view> <!-- 轮播图 --> <swiper class="swiper mb12" circular :indicator-color="incolorh" :indicator-active-color="activecolorh" :indicator-dots="indicatorDotsh" :autoplay="autoplayh"> <!-- v-if="checkPermi(['system:application:list'])" --> <swiper-item> <view class="grid"> <view class="grid-item-box" @click="getHouseFn" v-if="checkPermi(['wuYe:houseInfo:list'])"> <view class="img"><image :src="htabi" class="imgf"></image></view> <view>我的房屋<text class="co05">( <block v-if="count.houseCount>98">99+</block> <block v-else>{{count.houseCount||0}}</block> )</text></view> </view> <view class="grid-item-box" @click="getCarFn" v-if="checkPermi(['wuYe:car:list'])"> <view class="img"><image :src="htabj" class="imgg"></image></view> <view>我的车辆<text class="co05">( <block v-if="count.carCount>98">99+</block> <block v-else>{{count.carCount||0}}</block> )</text></view> </view> <view class="grid-item-box" @click="getWarrantyFn" v-if="checkPermi(['wuYe:repair:list'])"> <view class="img"><image :src="htabb" class="imga"></image></view> <view>物业报修 <view class="cir"> <block v-if="count.propertyRepair>98">99+</block> <block v-else>{{count.propertyRepair||0}}</block> </view> </view> </view> <view class="grid-item-box" @click="getNewsFn" v-if="checkPermi(['wuYe:news:list'])"> <view class="img"><image :src="htabd" class="imgb"></image></view> <view>社区资讯<view class="cir"> <block v-if="count.commentInteractionUserCount>98">99+</block> <block v-else>{{count.commentInteractionUserCount||0}}</block> </view></view> <!-- <view class="flexcw"> <view class="txt">点赞<text class="co05 mr2">(5)</text></view> <view class="txt">评论<text class="co05">(12)</text></view> </view> --> <view class="txt">点赞<text class="co05 mr2">( <block v-if="count.likeCount>98">99+</block> <block v-else>{{count.likeCount||0}}</block> )</text>评论<text class="co05">( <block v-if="count.contentCount>98">99+</block> <block v-else>{{count.contentCount||0}}</block> )</text></view> </view> <view class="grid-item-box" @click="getNewsDjFn" v-if="checkPermi(['wuYe:partyNews:list'])"> <view class="img"><image :src="htabe" class="imgc"></image></view> <view>党建资讯</view> </view> <view class="grid-item-box" @click="getComplaintFn" v-if="checkPermi(['wuYe:suggestion:list'])"> <view class="img"><image :src="htabf" class="imgd"></image></view> <view>投诉建议<view class="cir"> <block v-if="count.complaintSuggestion>98">99+</block> <block v-else>{{count.complaintSuggestion||0}}</block> </view></view> </view> <view class="grid-item-box" @click="getVisitorFn" v-if="checkPermi(['wuYe:reservRecord:add'])"> <view class="img"><image :src="htabg" class="imge"></image></view> <view>访客邀请</view> </view> <view class="grid-item-box" @click="getWygjFn" v-if="checkPermi(['wuYe:settings:list'])"> <view class="img"><image :src="htabh" class="imga"></image></view> <view>联系管家</view> </view> </view> </swiper-item> <swiper-item> <view class="grid"> <view class="grid-item-box" @click="getClearFn" > <view class="img"><image :src="htaba" class="imga"></image></view> <view>家政服务</view> </view> <view class="grid-item-box" @click="getBusListFn(1)" > <view class="img"><image :src="htabc" class="imgb"></image></view> <view>供求资讯</view> </view> <view class="grid-item-box" @click="getMoneyFn" > <view class="img"><image :src="htabk" class="imgh"></image></view> <view>物业缴费</view> </view> <view class="grid-item-box" @click="getBusListFn(1)" > <view class="img"><image :src="htabl" class="imga"></image></view> <view>敬请期待</view> </view> </view> </swiper-item> </swiper> <!-- 消息 --> <view class="mb12"> <notice :noticelist='noticelist' :activeColor="activeColor" :nactiveColor="nactiveColor" @getNoticeDet="getNoticeDet"></notice> </view> <view class="mb18 flexc"> <view class="cbgs mr12"> <image :src="cbga"></image> <view class="cbga"> <view class="tit">空闲充电桩</view> <view class="txt">37</view> </view> </view> <view class="cbgs"> <image :src="cbgb"></image> <view class="cbga"> <view class="tita">剩余停车位</view> <view class="txta">37</view> </view> </view> </view> <!-- 我的快递 --> <view class="hlist"> <view class="hlista flexc mb6"> <image :src="lista" class="limg flex0"></image> <view class="tit flex1">我的快递</view> <view class="more flex0 flexc" @click="getKdFn">更多<image :src="more"></image></view> </view> <box-list :datainfo="list" type="delivery"></box-list> </view> </view> <!-- 今日优惠 --> <view class="hlist plr12"> <view class="hlista flexc mb10 "> <image :src="listb" class="limg flex0"></image> <view class="tit flex1">今日优惠</view> <view class="more flex0 flexc">更多<image :src="more"></image></view> </view> </view> <view class="mb4"> <box-list type='coupon' :datainfo="list"></box-list> </view> <view class="wymain"> <!-- 本地资讯 --> <view class="hlist"> <view class="hlista flexc" style="padding-bottom: 0;"> <image :src="listc" class="limg flex0"></image> <view class="htabs flexc"> <view :class="tabval==ite.val?'act':''" v-for="(ite,idx) in tablist" :key="idx">{{ite.tit}}</view> </view> <view class="more flex0 flexc">更多<image :src="more"></image></view> </view> <box-list :datainfo="list" :wtdt="wtdt" type="news"></box-list> </view> </view> <loading></loading> <pop-up :type="type" @getClose="getClose" :phoneList="phoneList" :initFace='initFace' @getXxwsFn="getXxwsFn"></pop-up> <footers v-if="isfootflag" :footerindex="footerindex"></footers> </view> </template> <script> import footers from '@/components/footer/footer.vue' import notice from '@/components/swiper/notice.vue' import boxList from "@/components/box/list.vue" import popUp from "@/components/box/popup.vue" import {checkPermi,checkRole} from "@/utils/permission"; // 权限判断函数 import {gettenantUserName,gettenantCheck} from "@/api/login.js" import {houseInfoList} from "@/api/work/work.js" import {gesettingsList,getCount} from "@/api/work/index.js" import {selectValueKey} from "@/utils/common.js" import {newsList} from "@/api/work/manage.js" import self from '@/utils/location.js'; import wSelect from "@/work/components/w-select/w-select.vue" import config from '@/config' const Clientid = config.Clientid import store from "@/store" export default { components:{footers,notice,boxList,popUp,wSelect}, data(){ return{ footerindex:'home', isfootflag:true, nvaHeight:44, activeColor:'#A7A7A7', nactiveColor:'#E6E6E6', backgroundColor: "transparent", navbg:require("@/static/images/navbg.png"), adrimg:require("@/static/images/home/adr.png"), adraimg:require("@/static/images/home/adra.png"), adrbgimg:require("@/static/images/home/adrbg.png"), htaba:require("@/static/images/home/htaba.png"), htabb:require("@/static/images/home/htabb.png"), htabc:require("@/static/images/home/htabc.png"), htabd:require("@/static/images/home/htabd.png"), htabe:require("@/static/images/home/htabe.png"), htabf:require("@/static/images/home/htabf.png"), htabg:require("@/static/images/home/htabg.png"), htabh:require("@/static/images/home/htabh.png"), htabi:require("@/static/images/home/htabi.png"), htabj:require("@/static/images/home/htabj.png"), htabk:require("@/static/images/home/htabk.png"), htabl:require("@/static/images/home/htabl.png"), cbga:require("@/static/images/home/cbga.png"), cbgb:require("@/static/images/home/cbgb.png"), lista:require("@/static/images/home/lista.png"), listb:require("@/static/images/home/listb.png"), listc:require("@/static/images/home/listc.png"), more:require("@/static/images/home/more.png"), initFace:'',//initFace 1:双端都未认证 2:只认证了业主端 3:只认证了物业端 4:双端都认证过 type:'',//wygj wtdt:"加载更多", yhbg:require("@/static/images/home/yhbg.png"), eye:require("@/static/images/home/eye.png"), autoplay:false, autoplayh:false, incolorh:'#E6E6E6', activecolorh:'#A7A7A7', indicatorDotsh: true, city:'合肥市', list:[{tit:'123'},{tit:'123'},{tit:'123'}], userId:this.$store.state.user.userId, nickName:this.$store.state.user.nickName, phonenumber:this.$store.state.user.phonenumber, // avatar:this.$store.state.user.avatar, tabval:0, houselist:[], phoneList:[], tablist:[{tit:'本地资讯',val:"0"},{tit:'供求资讯',val:"1"},{tit:'热门资讯',val:"2"}], count:'',//统计 noticelist:[], chooseValue:'', tenantId:'', tenantName:'', voList:[], filterable:true, } }, onPageScroll(e) { var scrollTop = Number(e.scrollTop); if (scrollTop > 0) { this.backgroundColor = '#FFF7E1' } else { this.backgroundColor = 'transparent' } }, onShow() { this.initFace=this.$store.state.user.initFace; // this.tenantId=this.$store.state.user.tenantId; }, onLoad: function() { // 登录提示去除,登录页面,验证码不要,微信支付宝登录,快递,我的车辆,, //房屋:房产证分开,我的房本 。物业报修:标题不要,报修门户,不是必填。联系方式:默认自己的。 列表查看详情,列表状态加个进度条,详情东西都在列表页展示,,类似快递形式,报修加评论。社区资讯:发表评论框小了,抄头条。访客,来访人数,5人以上,1,23456789,样式修改。来访时间,当前时间,来访事由,选择,来访门户,默认,,有驾车,在车牌号,手机号放上面,常用访客:家人信息。投诉建议和报修一样,交流回复。管家电话:点击s可以打, //物管端 今日统计可以打开点击,,外来车辆登记,临停,,人员面貌,群众,党员,,评论审核,不用二次确认框, var that=this; uni.getSystemInfo({ success: (e) => { this.nvaHeight = Number(e.statusBarHeight)+44; } }) this.gettenantList() // 获取房子 if(checkPermi(['wuYe:houseInfo:list'])){ this.getDataFn() } if(checkPermi(['wuYe:settings:list'])){ this.gesettingsList() } if(checkPermi(['wuYe:statistics:yeZhuTips'])){ this.getCount() } if(checkPermi(['wuYe:news:list'])){ this.newsList() } // #ifndef H5 self.getLocation(function(res){ if(res==-1){ }else{ that.city=res.city; } }) // #endif }, methods:{ checkPermi,checkRole, statusFormats(data, list,type) { var aite=selectValueKey(list, data); if(type=='tenant'){ this.tenantName=aite.actions } return aite.actions; }, // 获取租户列表 gettenantList(){ var params={ userId:this.userId } gettenantUserName().then(res=>{ if(res.code==200){ if(res.data&&res.data.length){ this.voList = res.data.map(v => { return { dictLabel: v.companyName, dictValue: v.tenantId } }) } }else{ this.$toast(res.msg) } }) }, getchange(e){ var id=e.dictValue; var name=e.dictLabel; var that=this; this.tenantId=id; this.tenantName=name; var params={ tenantId:id, clientId:Clientid, grantType:'password' } gettenantCheck(params).then(res=>{ var token=res.msg; // 切换token this.$store.dispatch('checkToken', token).then(() => { this.$store.dispatch('GetInfo').then(res => { }) }).catch(() => { }) }) }, getXxwsFn(){ var type='rz' // this.$tab.navigateTo(`/people/pages/people/staffadd?type=${type}`) }, getClose(){ this.initFace=''; }, getDataFn(){ var params={ userId:this.userId, pageSize:5, pageNum: 1, } houseInfoList(params).then(res=>{ if(res.code==200){ this.houselist = JSON.parse(JSON.stringify(res.rows)); if(res.rows&&res.rows.length){ // var info=res.rows[0]; // var obj={ // houseId:info.houseId, // communityName:info.communityName, // detailedAddress:info.detailedAddress, // } // this.$store.commit('SET_HOUSE', obj) } }else{ this.$toast(res.msg) } }) }, newsList(){ var params={ pageSize:10, pageNum: 1, status:1, } newsList(params).then(res=>{ if(res.code==200){ this.noticelist = res.rows; }else{ this.$toast(res.msg) } }) }, getBusListFn(){ }, getCount(){ var params={ userId:this.userId, residentPhone:this.phonenumber } getCount(params).then(res => { if(res.code==200){ this.count=res.data; } }) }, gesettingsList(){ gesettingsList().then(res=>{ if(res.code==200){ this.phoneList=res.rows } }) }, getClose(){ this.type=''; this.initFace=''; }, getXxwsFn(){ var type='rz' this.$tab.navigateTo(`/mine/pages/info/authenadd?type=${type}`) }, getNoticeDet(id){ this.$tab.navigateTo(`/news/pages/news/detail?id=${id}`) }, getZhanFn(){ this.zhanflag=!this.zhanflag }, getClearFn(){//家政服务 this.$tab.navigateTo(`/work/pages/clean/index`) }, getWarrantyFn(){//物业报修 this.$tab.navigateTo(`/work/pages/service/warranty`) }, getHouseFn(){//我的房屋 this.$tab.navigateTo(`/mine/pages/house/index`) }, getCarFn(){//我的车辆 this.$tab.navigateTo(`/mine/pages/car/index`) }, getMoneyFn(){//物业缴费 this.$tab.navigateTo(`/work/pages/manage/index`) }, getVisitorFn(){//访客邀请 this.$tab.navigateTo(`/work/pages/visitor/index`) }, getNewsFn(){//社区资讯 this.$tab.navigateTo(`/news/pages/news/newssq`) }, getNewsDjFn(){//党建资讯 this.$tab.navigateTo(`/news/pages/news/newsdj`) }, getComplaintFn(){//投诉建议 this.$tab.navigateTo(`/news/pages/complaint/index`) }, getKdFn(){//我的快递 this.$tab.navigateTo(`/mine/pages/delivery/index`) }, getWygjFn(){//物业管家 this.type='wygj' } } } </script> <style lang="scss" scoped> .home{min-height: 100vh;background: linear-gradient(180deg, #FFF7E1 0%, rgba(255,255,255,0) 100%) no-repeat;background-size: 100% 782rpx;} .navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4; } .navbg{width: 100%;height: 782rpx;} .wymain{z-index: 2;position: relative;padding: 0 24rpx;} .topl{overflow: hidden;padding-left: 16rpx; image{width: 18rpx;height: 22rpx;margin-right: 14rpx;flex: 0 0 auto;} view{font-weight: bold;font-size: 26rpx;color: #272727;} } .adrbox{position: relative;padding:8rpx 260rpx 16rpx 36rpx;margin-bottom: 28rpx; .adr{width: 36rpx;height: 34rpx;margin-right: 14rpx;} .adrtit{font-size: 17px;color: #272727;font-weight: bold; text{color: #E99D4F;} } .adrtxt{font-size: 16px;color: #272727;font-weight: bold; text{font-size: 10px;color: #E99D4F;display: inline-flex;background: rgba(233, 157, 79, 0.3);margin-left: 22rpx;min-width: 66rpx;height: 30rpx;padding: 0 14rpx;box-sizing: border-box;flex: 0 0 auto;border-radius: 8px;align-items: center;justify-content: center;} } .adrtip{font-weight: 500;font-size: 24rpx;color: #828282;} .adrbgimg{width: 262rpx;height: 242rpx;position: absolute;right: 0rpx;top: -54rpx;} } // tab栏 .swiper{min-height: 300rpx;} .grid{ display: flex;align-items: center;flex-wrap: wrap; .grid-item-box {display: flex;flex-direction: column;align-items: center;width: 25%;box-sizing: border-box;height: 152rpx; .img{width: 50rpx;height: 50rpx;display: flex;align-items: center;justify-content: center;margin-bottom: 20rpx; .imga{width: 48rpx;height: 44rpx;} .imgb{width: 42rpx;height: 42rpx;} .imgc{width: 44rpx;height: 48rpx;} .imgd{width: 46rpx;height: 38rpx;} .imge{width: 40rpx;height: 50rpx;} .imgf{width: 48rpx;height: 50rpx;} .imgg{width: 48rpx;height: 40rpx;} .imgh{width: 44rpx;height: 46rpx;} } view{font-weight: bold;font-size: 26rpx;color: #272727;position: relative; .cir{width: 20rpx;height: 20rpx;background: #D32C26;border-radius: 10rpx;font-weight: bold;font-size: 16rpx;color: #FCF9F1;position: absolute;display: flex;align-items: center;justify-content: center;padding: 0 2rpx;box-sizing: border-box;right: -10rpx;top: -10rpx; } } .txt{font-size: 20rpx;color: #666666;} } } .cbgs{width: 340rpx;height: 152rpx;position: relative; image{width: 340rpx;height: 152rpx;position: absolute;left: 0;top: 0;z-index: 0;} .cbga{z-index: 1;position: relative;padding: 30rpx 0 0 36rpx; .tit{font-weight: bold;font-size: 28rpx;color: #FFFFFF;text-shadow: 0px 4rpx 6rpx #13A97A;margin-bottom: 10rpx;} .txt{font-size: 40rpx;color: #FFFFFF;text-shadow: 0px 4rpx 6rpx #13A97A;} .tita{font-weight: bold;font-size: 28rpx;color: #FFFFFF;text-shadow: 0px 4rpx 6rpx #E89D00;;margin-bottom: 10rpx;} .txta{font-size: 40rpx;color: #FFFFFF;text-shadow: 0px 4rpx 6rpx #E89D00;} } } .hlist{ .hlista{padding: 8rpx 0; .limg{width: 32rpx;height: 32rpx;margin-right: 18rpx;} .tit{font-weight: bold;font-size: 30rpx;color: #272727;} .more{font-weight: 500;font-size: 24rpx;color: #AAAAAA; image{width: 18rpx;height: 16rpx;margin-left: 16rpx;} } .htabs{flex: 1;overflow: auto;padding: 10rpx 0; view{font-weight: 500;font-size: 28rpx;color: #666666;position: relative;height: 56rpx;line-height: 56rpx;margin-right: 48rpx;flex: 0 0 auto; &.act{font-size: 15px;font-weight: bold;color: #272727; &:after{width: 36rpx;height: 10rpx;background: linear-gradient(150deg, rgba(177,240,216,0.97), rgba(3,218,138,0.97));border-radius: 6rpx;content: '';position: absolute;bottom: -10rpx;left: 50%;margin-left: -18rpx;} } } } } } </style>