<template name="home"> <div> <cu-custom bgColor="bg-gradual-pink"> <block slot="content">首页</block> </cu-custom> <div class="panlens" v-if='isshow==false'> <br> <div style="margin-left: 20px;"> <span style="font-size: 20px;color: #FFFFFF">亲爱的   {{realname}}</span> <br> <br> <span style="color: #FFFFFF;">今天是您在格克走过的第{{day}}天</span> </div> </div> <div class="panlenes" v-if='isshow==true'> <br> <div style="margin-left: 20px;"> <span style="font-size: 20px;color: #FFFFFF;">亲爱的   {{realname}}</span> <br> <br> <span style="color: #FFFFFF;">今天是您的生日,格克感谢您的付出</span> <br> <span style="color: #FFFFFF;">祝您生日快乐!</span> </div> </div> <br> <div class="itemt"> <view class="cu-bar bg-white solid-bottom" :style="[{animation: 'show 0.6s 1'}]"> <view class="action"> <text class='cuIcon-title text-blue'></text>个人自助 </view> </view> <view class=" bg-white grid col-2 padding-sm"> <view class="padding-sm animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.1 + 's'}]" v-for="(item,index) in usList" :key="index" @tap="goPage(item.component)"> <view class="padding radius text-center shadow-blur solid-right "> <!-- <image :src="item.icon" mode="aspectFill" class="line2-icon"></image> --> <view class="cu-avatar lg " :style="{background: 'url(' + item.icon + ') no-repeat',backgroundSize:'95upx 95upx'}"> <view class="cu-tag badge" v-if="getTtemDotInfo(item)">{{getTtemDotInfo(item)}}</view> </view> <view class="text-lg margin-top">{{item.name}}</view> </view> </view> </view> </div> <!-- 其他服务 --> <!-- <div class="itemt"> <view class="cu-bar bg-white solid-bottom margin-top" :style="[{animation: 'show 0.6s 1'}]"> <view class="action"> <text class='cuIcon-title text-yellow'></text>团队信息 </view> </view> <view class=" bg-white grid col-3 padding-sm"> <view class="padding-sm animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.1 + 's'}]" v-for="(item,index) in osList" :key="index" @tap="goPage(item.page)"> <view class="padding radius text-center shadow-blur solid-right "> <view class="cu-avatar lg " :style="{background: 'url(' + item.icon + ') no-repeat',backgroundSize:'100upx 100upx'}"></view> <view class="text-lg margin-top">{{item.title}}</view> </view> </view> </view> </div> --> </div> </template> <script> import { us,os } from '@/common/util/work.js' export default { name: 'home', props:{ cur:String, }, watch: { cur: { immediate: true, handler() { console.log('watch',this.cur) this.initMenu() }, }, }, data() { return { usList:null, osList:os.data, websock:'', heartCheck:null, lockReconnect:false, realname:"", msgCount:0, day:'', dot:{ mailHome:false }, isshow:false, url:'/sys/permission/qeryPerssion' } }, created(){ this.queryPerssion(); }, methods: { queryPerssion(){ this.$http.get(this.url,{params:{userid:this.$store.getters.userid}}).then(res=>{ this.usList=res.data.result.men; this.realname=res.data.result.user.realname; if(res.data.result.user.entryDate!=null){ var da=res.data.result.user.entryDate; let day = (new Date().getTime()) - (new Date(da).getTime())//日期转时间戳 let dayCount=1; let count= Math.floor(day / 86400000) ;//时间戳获取天数 if(count!=0&&count!=null&&count!=""){ dayCount=count+1; } this.day=dayCount; if(res.data.result.user.birthday!=null){ var dt=res.data.result.user.birthday; var ddt=new Date(dt); var ddr=new Date(); if(ddt.getMonth()==ddr.getMonth()&&ddt.getDate()==ddr.getDate()){ this.isshow=true; } } } }) }, initMenu(){ console.log("-----------home------------") this.initWebSocket(); this.loadCount(0); }, goPage(page){ if(!page){ return false; } if(page==='annotationList'){ this.msgCount = 0 } this.dot[page]=false this.$router.push({name: page}) }, initWebSocket: function () { // WebSocket与普通的请求所用协议有所不同,ws等同于http,wss等同于https var userId = this.$store.getters.userid; var token=this.$store.getters.token; var url = this.$config.apiUrl.replace("https://","wss://").replace("http://","ws://")+"/websocket/"+userId+"/"+token; console.log('websocket url>>'+url); this.websock = new WebSocket(url); this.websock.onopen = this.websocketOnopen; this.websock.onerror = this.websocketOnerror; this.websock.onmessage = this.websocketOnmessage; this.websock.onclose = this.websocketOnclose; }, websocketOnopen: function () { console.log("WebSocket连接成功"); //心跳检测重置 //this.heartCheck.reset().start(); }, websocketOnerror: function () { console.log("WebSocket连接发生错误"); this.reconnect(); }, websocketOnmessage: function (e) { console.log("-----接收消息-------",e.data); uni.showModal({ title: '⚡',//⚡❕ showCancel:false, content: e.data, confirmText: '确定', success: res => { this.$store.commit('SET_TOKEN',""); uni.navigateTo({ url:'/pages/login/login' }) } }) /* var data = eval("(" + e.data + ")"); //解析对象 if(data.cmd == "topic"){ //系统通知 this.loadCount('1') }else if(data.cmd == "user"){ //用户消息 this.loadCount('2') } else if(data.cmd == 'email'){ this.loadEmailCount() } */ //心跳检测重置 //this.heartCheck.reset().start(); }, websocketOnclose: function (e) { console.log("connection closed (" + e.code + ")"); this.reconnect(); }, websocketSend:function(text) { // 数据发送 try { this.websock.send(text); } catch (err) { console.log("send failed (" + err.code + ")"); } }, reconnect() { var that = this; if(that.lockReconnect) return; that.lockReconnect = true; //没连接上会一直重连,设置延迟避免请求过多 setTimeout(function () { console.info("尝试重连..."); that.initWebSocket(); that.lockReconnect = false; }, 5000); }, loadCount(flag){ console.log("loadCount::flag",flag) let url = '/sys/annountCement/listByUser'; this.$http.get(url).then(res=>{ console.log("res::",res) if(res.data.success){ let msg1Count = res.data.result.anntMsgTotal; let msg2Count = res.data.result.sysMsgTotal; this.msgCount = msg1Count + msg2Count console.log("this.msgCount",this.msgCount) } }) }, loadEmailCount(){ this.dot.mailHome = true }, getTtemDotInfo(item){ if(item.page==='annotationList' && this.msgCount>0){ return this.msgCount } return ''; } } } </script> <style> .line2-icon { width: 60px; height: 60px; } .panlens{ width: 95%; margin:0 auto; border-radius:5px 5px 5px 5px; margin-top: 10px; background: url(../../static/sy.png); background-size:100% 100%; height: 130px; } .panlenes{ width: 95%; margin:0 auto; border-radius:5px 5px 5px 5px; margin-top: 10px; background: url(../../static/bjsr.png) ; background-size:100% 100%; height: 130px; } .itemt{ width: 95%; margin:0 auto; border-radius:5px 5px 5px 5px; } .top{ background-color: #5677AC; width: 100%; height: 40px; } </style>