<template> <view class="zxbox"> <view class="zxtop"> <view class="navbox"> <uni-nav-bar color="#ffffff" leftWidth='340rpx' @clickRight="getNewsFn" :background-color="backgroundColor" :border="false" statusBar='true' fixed="true"> <block slot="left"> <image :src="titimg" class="topl"></image> </block> <block slot="right" v-if="checkPermi(['zxNotice:notice:list'])"> <view class="topr"> <image :src="noticeimg"></image> <view class="cir"></view> </view> </block> </uni-nav-bar> </view> <image :src="bgimg" class="bgimg"></image> <view class="zxmain"> <image :src="titbg" class="titbg"></image> <!-- <view class="flexc mb27"> <view class="htop" @click="getAddCase" v-if="checkPermi(['proposalInfo:info:add'])"> <view class="imgs"> <image :src="htopa" class="imga"></image> </view> <view class="tit">提交提案</view> </view> <view class="htop" @click="getAddsqmy" v-if="checkPermi(['sqmyInfo:info:add'])"> <view class="imgs"> <image :src="htopb" class="imgb"></image> </view> <view class="tit">上报社情民意</view> </view> <view class="htop" @click="getAddlzda" v-if="checkPermi(['member:info:add'])"> <view class="imgs"> <image :src="htopc" class="imgc"></image> </view> <view class="tit">履职档案</view> </view> <view class="htop" @click="getAddhy" v-if="checkPermi(['zxConference:conference:add'])"> <view class="imgs"> <image :src="htopd" class="imga"></image> </view> <view class="tit">创建会议</view> </view> </view> --> <view class="hbox"> <!-- 通知栏 --> <block v-if="checkPermi(['zxNotice:notice:list'])"> <h-notice :noticelist="noticelist" :autoplay='autoplay' @getNoticeDet="getNoticeDet"></h-notice> </block> <!-- 提案办理 --> <view class="flexcw blbox" v-if="checkPermi(['proposalInfo:info:unitList','sqmyInfo:info:unitList','zxUrge:urge:list'])"> <view class="htbox" @click="handleTotabl" v-if="checkPermi(['proposalInfo:info:unitList','sqmyInfo:info:unitList'])"> <image :src="kricob" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">提案/社情办理</view> <view class="txt">提案、社情单位办理</view> </view> <!-- <image :src="hrimgc" class="flex0 imgc"></image> --> </view> </view> <view class="htbox" @click="handleTocu" v-if="checkPermi(['zxUrge:urge:list'])"> <image :src="kricoa" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">催办信息</view> <view class="txt">了解催办信息</view> </view> <!-- <image :src="hrimgd" class="flex0 imgd"></image> --> </view> </view> </view> <!-- 入口 --> <view class="mt22"> <view class="htit">快捷入口</view> <view class="mt18 flexcw"> <view class="htbox" @click="getZxCaseFn" v-if="checkPermi(['proposalInfo:info:list'])"> <image :src="hrbga" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">政协提案</view> <view class="txt">全方位审核委员提案</view> </view> <image :src="hrimga" class="flex0 imga"></image> </view> </view> <view class="htbox" @click="getsqmyInfoFn" v-if="checkPermi(['sqmyInfo:info:list'])"> <image :src="hrbgb" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">社情民意</view> <view class="txt">录入社情民意信息</view> </view> <image :src="hrimgb" class="flex0 imgb"></image> </view> </view> <view class="htbox" @click="getlzInfoFn" v-if="checkPermi(['member:info:list'])"> <image :src="hrbgc" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">履职信息</view> <view class="txt">管理委员履职信息</view> </view> <image :src="hrimgc" class="flex0 imgc"></image> </view> </view> <view class="htbox" @click="getMettFn" v-if="checkPermi(['zxConference:conference:list','zxActivity:activity:list'])"> <image :src="hrbgd" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">会议活动</view> <view class="txt">了解会议活动信息</view> </view> <image :src="hrimgd" class="flex0 imgd"></image> </view> </view> <!-- <view class="htbox" @click="handleTotabl" v-if="checkPermi(['proposalInfo:info:unitList','sqmyInfo:info:unitList'])"> <image :src="hrbgc" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">提案/社情办理</view> <view class="txt">提案、社情单位处理</view> </view> <image :src="hrimgc" class="flex0 imgc"></image> </view> </view> <view class="htbox" @click="handleTocu" v-if="checkPermi(['zxUrge:urge:list'])"> <image :src="hrbgd" class="hrbg"></image> <view class="htboxa flexc"> <view class="flex1 mr10"> <view class="tit">催办信息</view> <view class="txt">了解催办信息</view> </view> <image :src="hrimgd" class="flex0 imgd"></image> </view> </view> --> </view> </view> </view> </view> </view> <!-- 新闻 --> <view class="hnbox"> <view class="hntabs flexc" :class="fixedflag?'tabfix':''" :style="fixedflag?'top:'+nvaHeight+'px;':''"> <view class="flex1 flexc"> <block v-for="(ite,idx) in tabList" :key="idx"> <view class="tit" v-if="checkPermi([ite.limit])" :class="tabval==ite.val?'act':''" @click="getTab(ite.val)">{{ite.tit}}</view> </block> </view> <view class="flex0 txtr" @click="getMoreList">了解更多>></view> </view> <view style="height:114rpx;" v-if="fixedflag"></view> <!-- 列表 --> <view class="mt2 plr12" :style="'min-height: ' + minheight + 'px;'"> <notice-list :datalist="list" :wtdt="wtdt" :tajdlist="tajdlist" :ztlxlist="ztlxlist" :type='tabval' @getDetail="getDetail"></notice-list> <view class="upmore flexccc" @click="getMoreFn" v-if="reachflag"> <image :src="upimg"></image> <view>加载更多</view> </view> </view> </view> <pop-up :type='ptype' :isMember="isMember" @getClose="getClose" @getFaFn="getFaFn" @getlzdaFn="getAddlzda"></pop-up> <footers v-if="isfootflag" :footlist="footlist" :footerindex="footerindex" :color_checked="color_checked" :color_nochecked="color_nochecked" :isHomeIndex="true"></footers> </view> </template> <script> import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数 // let { calendar } = require("@/components/lunc-calendar/calendar.js"); import {getCaseListFn} from "@/api/mine/case.js" import {getsqmyInfoListFn} from "@/api/mine/sqmyInfo.js" import {getDictionaryFn} from "@/api/mine/register.js" import {getNoticeList} from "@/api/mine/news.js" import popUp from "@/components/popup/popup.vue" import hNotice from '@/components/swiper/notice.vue' import noticeList from '@/components/notice/list.vue' import footers from '@/components/footer/footer.vue' export default { components:{hNotice,noticeList,footers,popUp}, data(){ return{ footlist:[ {module:'home',title:'潜山政协',icon_checked:require('@/static/images/tabbar/home_.png'),icon_nochecked:require('@/static/images/tabbar/home.png')}, {module:'report',title:'履职报告',icon_checked:require('@/static/images/tabbar/report_.png'),icon_nochecked:require('@/static/images/tabbar/report.png')}, {module:'notice',title:'会议通知',icon_checked:require('@/static/images/tabbar/notice_.png'),icon_nochecked:require('@/static/images/tabbar/notice.png')}, {module:'mine',title:'个人中心',icon_checked:require('@/static/images/tabbar/mine_.png'),icon_nochecked:require('@/static/images/tabbar/mine.png')}, ], color_checked :'222327', color_nochecked :'AAAAAA', footerindex:'home', isfootflag:true, backgroundColor:'transparent', bgimg:require("@/static/images/bg.png"), titimg:require("@/static/images/home/tit.png"), noticeimg:require("@/static/images/home/notice.png"), htopa:require("@/static/images/home/htopa.png"), htopb:require("@/static/images/home/htopb.png"), htopc:require("@/static/images/home/htopc.png"), htopd:require("@/static/images/home/htopd.png"), hrbga:require("@/static/images/home/hrbga.png"), hrbgb:require("@/static/images/home/hrbgb.png"), hrbgc:require("@/static/images/home/hrbgc.png"), hrbgd:require("@/static/images/home/hrbgd.png"), hrimga:require("@/static/images/home/hrimga.png"), hrimgb:require("@/static/images/home/hrimgb.png"), hrimgc:require("@/static/images/home/hrimgc.png"), hrimgd:require("@/static/images/home/hrimgd.png"), kricoa:require("@/static/images/home/kricoa.png"), kricob:require("@/static/images/home/kricob.png"), upimg:require("@/static/images/home/up.png"), titbg:require("@/static/images/home/titbg.png"), tabval:1, tabList:[{tit:'重点提案',val:1,limit:'proposalInfo:info:list'},{tit:'社情民意',val:2,limit:'sqmyInfo:info:list'},], list:[], pageSize: 10, pageNum: 1, reachflag: true, wtdt:'', nvaHeight:44, listTop:0,//距离顶部的距离 fixedflag:false, ptype:"",//lmta 联名填弹窗 tajdlist:[], ztlxlist:[], minheight:0, noticelist:[], autoplay:true, isMember:'0' } }, onPageScroll(e) { var scrollTop = Number(e.scrollTop); var listTop=Number(this.listTop)-Number(this.nvaHeight) if (scrollTop <=this.nvaHeight) { const opacity = scrollTop / 100 // 计算透明度值 const color = `rgba(29, 100, 226, ${opacity})` this.backgroundColor = color // 更新盒子背景颜色 } else { this.backgroundColor = '#1D64E2' } if(scrollTop>listTop){ this.fixedflag=true }else{ this.fixedflag=false } }, onUnload(){ uni.$off('refreindexlist') }, onLoad: function() { uni.$on('refreindexlist',(e) => { this.reachflag=false; this.pageNum=1; this.list=[]; this.getDataFn(); }) this.init() this.getDataFn() if(checkPermi(['zxNotice:notice:list'])){ this.getNoticeList() } uni.getSystemInfo({ success: (e) => { this.nvaHeight = Number(e.statusBarHeight)+44; this.minheight = e.screenHeight -Number(this.nvaHeight)- 57; } }) }, onUnload() { uni.$off('refreshdatalist') }, onShow() { this.isMember=this.$store.state.user.isMember; // var that=this; // this.time(); }, mounted() { this.getHeightFn() }, // 上拉触底加载更多触发事件 onReachBottom() { // if (this.reachflag) { // this.pageNum++ // this.getDataFn() // } }, methods:{ checkPermi, checkRole, getNewsFn(){ if(checkPermi(['zxNotice:notice:list'])){ this.$tab.navigateTo('/work/pages/news/list') } }, getNoticeDet(e){ this.$tab.navigateTo('/work/pages/news/detail?id='+e) }, getMoreFn(){ if (this.reachflag) { this.pageNum++ this.getDataFn() } }, getNoticeList(){ var params={ pageSize:10, pageNum:1 } getNoticeList(params).then(res=>{ if(res.code==200){ this.noticelist=res.rows } }) }, getMoreList(){ if(this.tabval==1){ this.getZxCaseFn() }else if(this.tabval==2){ this.getsqmyInfoFn() } }, getClose(){ this.ptype='' }, getTab(val){ this.tabval=val; this.list=[]; this.pageNum=1; this.reachflag=true; this.getDataFn() }, getHeightFn(){ let query = uni.createSelectorQuery().in(this); //需要给黄色区域设置一个id标识,在这里是demo query.select('.zxtop').boundingClientRect(data => { this.listTop = data.height//赋值,待会要用 }).exec(); }, getAddCase(){ if(uni.getStorageSync('tjtaList')){ // var newObj=JSON.parse(JSON.stringify(uni.getStorageSync('tjtaList'))) this.ptype='zcta' }else{ this.$tab.navigateTo('/work/pages/case/add') } }, getAddsqmy(){ if(uni.getStorageSync('sqmyList')){ this.ptype='sqmy' }else{ this.$tab.navigateTo('/work/pages/sqmyInfo/add') } }, getAddlzda(){ this.$tab.navigateTo('/work/pages/report/mineinfo?type=add') // this.$tab.navigateTo('/work/pages/report/info') }, getAddhy(){ this.$tab.navigateTo('/work/pages/meeting/add') // if(uni.getStorageSync('cjhyList')){ // this.ptype='zchy' // }else{ // this.$tab.navigateTo('/work/pages/meeting/add') // } }, getFaFn(type,ptype){ this.ptype=''; if(ptype=='zcta'){ if(type=='new'){uni.removeStorageSync('tjtaList')} this.$tab.navigateTo('/work/pages/case/add?type='+type) }else if(ptype=='zchy'){ if(type=='new'){uni.removeStorageSync('cjhyList')} this.$tab.navigateTo('/work/pages/meeting/add?type='+type) }else if(ptype=='sqmy'){ if(type=='new'){uni.removeStorageSync('sqmyList')} this.$tab.navigateTo('/work/pages/sqmyInfo/add?type='+type) } }, getZxCaseFn(){ this.$tab.navigateTo('/work/pages/case/mine') }, getsqmyInfoFn(){ this.$tab.navigateTo('/work/pages/sqmyInfo/mine') }, getMettFn(){ this.$tab.navigateTo('/work/pages/meeting/list') }, getlzInfoFn(){ this.$tab.navigateTo('/work/pages/report/info') }, init(){ // 提案进度 getDictionaryFn('proposal_progress').then(res=>{ if(res.code==200){ this.tajdlist = res.data.map(v => { return { label: v.dictLabel, value: v.dictValue } }) } }) //主题类型 getDictionaryFn('sqmy_topic_type').then(res=>{ if(res.code==200){ this.ztlxlist = res.data.map(v => { return { label: v.dictLabel, value: v.dictValue } }) } }) }, time() { var date = new Date(); var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); let lunar = calendar.solar2lunar(y, m, d); //农历 this.lunar=lunar.IMonthCn+lunar.IDayCn; this.daytime=m+'月'+d+"日"; // var h = date.getHours(); // var min = date.getMinutes(); // var s = date.getSeconds(); // var week = date.getDay(); //获取当前星期X(0-6,0代表星期天) // var weeks = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]; // var yearStr = y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d) // var timeStr = (h < 10 ? ('0' + h) : h) + ':' + (min < 10 ? ('0' + min) : min) + ':' + (s < 10 ? ( // '0' + s) : s); // this.kaTime = yearStr + ' ' + timeStr; }, getDetail(data){ if(this.tabval==1){ this.$tab.navigateTo('/work/pages/case/details?id='+data) }else{ this.$tab.navigateTo('/work/pages/sqmyInfo/details?id='+data) } }, handleTotabl(){ this.$tab.navigateTo('/work/pages/single/unitList') }, handleTocu(){ this.$tab.navigateTo('/work/pages/single/urge') }, getDataFn(){ var params={ pageSize:this.pageSize, pageNum: this.pageNum, // visitType:3 } if(this.tabval==1){//重点提案 params.isKeyPoint='0'; // params.isRecord=0 getCaseListFn(params).then(res=>{ if(res.code==200){ if (res.rows.length < this.pageSize) { this.reachflag = false this.wtdt = '到底了~'; } else { var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1) if (num < res.total) { this.reachflag = true this.wtdt = '' } else { this.reachflag = false this.wtdt = '到底了~'; } } if (this.pageNum == 1) { this.list = res.rows; } else { this.list = this.list.concat(res.rows) } }else{ this.$toast(res.msg) } }) }else if(this.tabval==2){//社情民意 getsqmyInfoListFn(params).then(res=>{ if(res.code==200){ if (res.rows.length < this.pageSize) { this.reachflag = false this.wtdt = '到底了~'; } else { var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1) if (num < res.total) { this.reachflag = true this.wtdt = '' } else { this.reachflag = false this.wtdt = '到底了~'; } } if (this.pageNum == 1) { this.list = res.rows; } else { this.list = this.list.concat(res.rows) } }else{ this.$toast(res.msg) } }) } }, }, } </script> <style lang="scss" scoped> .navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4; .topl{width: 274rpx;height: 50rpx;margin-left: 14rpx;} .topr{width: 36rpx;height: 36rpx;position: relative;margin-right: 10rpx; image{width: 100%;height: 100%;} .cir{width: 14rpx;height: 14rpx;background: #DF0024;border-radius: 50%;position: absolute;right: -7rpx;top: -7rpx;} } } // .zxbox /deep/ .ql-editor p{text-indent: 2rem;} .zxbox{ .bgimg{width: 100%;height: 420rpx;} .zxmain{margin-top: -260rpx;z-index: 1;position: relative; .htop{width: 25%;display: flex;flex-direction: column;align-items: center;justify-content: center; .imgs{ width: 74rpx;height: 74rpx;display: flex;align-items: center;justify-content: center; .imga{width: 72rpx;height: 72rpx;} .imgb{width: 68rpx;height: 74rpx;} .imgc{width: 68rpx;height: 72rpx;} } .tit{font-weight: 500;font-size: 26rpx;color: #F1F9FF;margin-top: 26rpx;} } .hbox{ background: #ffffff;border-radius: 30rpx 30rpx 0 0;padding: 38rpx 24rpx 0 24rpx; .htit{font-size: 36rpx;color: #343434;font-weight: bold;} .htbox{position: relative;width: 342rpx;height: 146rpx;position: relative;margin-bottom: 24rpx;margin-right: 18rpx; &:nth-of-type(2n){margin-right: 0;} .hrbg{width: 100%;height: 100%;} .htboxa{position: absolute;left: 0;right: 0;top: 0;bottom: 0;padding: 0 18rpx 0 32rpx;box-sizing: border-box; .tit{font-size: 16px;color: #222327;font-weight: bold;margin-bottom: 8rpx;line-height: 44rpx;} .txt{font-weight: 500;font-size: 24rpx;color: #666666;} .imga{width: 56rpx;height: 60rpx;} .imgb{width: 50rpx;height: 60rpx;} .imgc{width: 54rpx;height: 58rpx;} .imgd{width: 70rpx;height: 56rpx;} } } .blbox{margin-top: 38rpx; .htbox{width: 340rpx;height: 150rpx;background: #FFFFFF;box-shadow: 0px 0px 30rpx 0px #DADADA;border-radius: 10rpx;margin-bottom: 0; .htboxa{padding: 0 24rpx; .txt{color: #959595;} } } } } } .hnbox{background-color: #ffffff;padding-bottom: 32rpx; .hntabs{padding:32rpx 24rpx;background-color: #ffffff; &.tabfix{position: fixed;left: 0;right: 0;z-index: 4;box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(196,191,191,0.22);} .tit{font-weight: 500;font-size: 32rpx;color: #AAAAAA;position: relative;line-height: 50rpx;margin-right: 64rpx; &.act{font-weight: bold;font-size: 36rpx;color: #222327; &::after{ content: '';width: 52rpx;height: 12rpx;background: #1D64E2;border-radius: 6rpx;position: absolute;left: 50%;bottom: -32rpx;margin-left: -26rpx; } } } .txtr{font-size: 26rpx;color: #aaaaaa;font-weight:500;} } .upmore{ image{width: 40rpx;height: 32rpx;margin-bottom: 16rpx;} view{font-weight: 500;font-size: 26rpx;color: #AAAAAA;} } } } .titbg{width: 460rpx;height: 108rpx;margin-left: 48rpx;margin-bottom: 46rpx;position: relative;} </style>