Houjie
2025-06-03 2fda34643bc22e25f6c569415da5f955c81536bf
pages/home/home.vue
@@ -2,22 +2,23 @@
   <view>
      <scroll-view>
         <!-- 轮播 -->
         <swiper class="screen-swiper square-dot"  :indicator-dots="true" :circular="true"
          :autoplay="true" interval="5000" duration="500" :style="[{animation: 'show 0.2s 1'}]">
         <swiper class="screen-swiper square-dot" :indicator-dots="true" :circular="true" :autoplay="true"
            interval="5000" duration="500" :style="[{animation: 'show 0.2s 1'}]">
            <swiper-item v-for="(item,index) in swiperList" :key="index">
               <image :src="item.url" mode="aspectFill" v-if="item.type=='image'"></image>
               <video :src="item.url" autoplay loop muted :show-play-btn="false" :controls="false" objectFit="cover" v-if="item.type=='video'"></video>
               <video :src="item.url" autoplay loop muted :show-play-btn="false" :controls="false"
                  objectFit="cover" v-if="item.type=='video'"></video>
            </swiper-item>
         </swiper>
         <!-- 设备维修 -->
         <view class="cu-bar bg-white solid-bottom" :style="[{animation: 'show 0.5s 1'}]">
            <view class="action">
               <text class='cuIcon-title text-blue'></text>工作台
            </view>
         </view>
         <view class="cu-list grid col-4 text-sm">
         <!--          <view class="cu-list grid col-4 text-sm">
            <view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.05 + 's'}]" v-for="(item,index) in usList" :key="index" @tap="goPage(item.page)">
               <view class="padding text-center">
                  <image :src="item.icon" style="width:28px;height:28px;">
@@ -28,140 +29,229 @@
                  <view class="margin-top-xs">{{item.title}}</view>
               </view>
            </view>
         </view> -->
         <view class="cu-list grid col-4 text-sm">
            <view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.05 + 's'}]"
               v-for="(item, index) in usList" :key="index" @tap="goPage(item.page)">
               <view class="padding text-center">
                  <image :src="item.icon" style="width:28px;height:28px;">
                     <view class="cu-tag badge margin-top-sm" style="margin-left:1.2em"
                        v-if="getTtemDotInfo(item)"></view>
                  </image>
                  <view class="margin-top-xs">{{ item.title }}</view>
               </view>
            </view>
         </view>
         <!-- 设备保养 -->
         <view class="cu-bar bg-white solid-bottom margin-top"  :style="[{animation: 'show 0.6s 1'}]">
         <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>保养
               <text class='cuIcon-title text-yellow'></text>保养
            </view>
         </view>
         <view class="cu-list grid col-4 text-sm">
            <view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.1 + 's'}]" v-for="(item,index) in osList" :key="index" @tap="goPage(item.page)">
            <view class="cu-item 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 text-center">
                  <image :src="item.icon" style="width:28px;height:28px;"/>
                  <image :src="item.icon" style="width:28px;height:28px;" />
                  <view class="margin-top-xs">{{item.title}}</view>
               </view>
            </view>
         </view>
         <!-- 设备维修 -->
         <view class="cu-bar bg-white solid-bottom margin-top"  :style="[{animation: 'show 0.6s 1'}]">
         <view class="cu-bar bg-white solid-bottom margin-top" :style="[{animation: 'show 0.6s 1'}]">
            <view class="action">
                <text class='cuIcon-title text-blue'></text>维修
               <text class='cuIcon-title text-blue'></text>维修
            </view>
         </view>
         <view class="cu-list grid col-4 text-sm">
            <view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.1 + 's'}]" v-for="(item,index) in wsList" :key="index" @tap="goPage(item.page)">
            <view class="cu-item animation-slide-bottom" :style="[{animationDelay: (index + 1)*0.1 + 's'}]"
               v-for="(item,index) in wsList" :key="index" @tap="goPage(item.page)">
               <view class="padding text-center">
                  <image :src="item.icon" style="width:28px;height:28px;"/>
                  <image :src="item.icon" style="width:28px;height:28px;" />
                  <view class="margin-top-xs">{{item.title}}</view>
               </view>
            </view>
         </view>
      </scroll-view>
      <view class="cu-tabbar-height margin-top"></view>
   </view>
</template>
<script>
   import { us,os,ws} from '@/common/util/work.js'
   import {
      ACCESS_TOKEN
   } from '@/common/util/constants.js'
   import {
      us,
      os,
      ws
   } from '@/common/util/work.js'
   import socket from '@/common/js-sdk/socket/socket.js'
   export default {
      name: 'home',
      props:{
         cur:String,
      props: {
         cur: String,
      },
      watch: {
         cur: {
            immediate: true,
            handler:function(val,oldVal){
               console.log('cur',val,oldVal)
                this.initMenu()
            handler: function(val, oldVal) {
               console.log('cur', val, oldVal)
               this.initMenu()
            },
         },
      },
      data() {
         return {
          swiperList: [
              {id:1,type: 'image',url: '/static/banner/eam_banner1.png', link: ''},
              {id:2,type: 'image',url: '/static/banner/eam_banner2.png', link: ''},
              {id:3,type: 'image',url: '/static/banner/eam_banner3.png', link: ''},
              {id:4,type: 'image',url: '/static/banner/eam_banner4.png', link: ''},
            url: {
               bindingThirdPhone: '/sys/permission/getUserPermissionByToken',
               countItem: '/assign/flow/taskCountBySelf'
            },
            swiperList: [{
                  id: 1,
                  type: 'image',
                  url: '/static/banner/eam_banner1.png',
                  link: ''
               },
               {
                  id: 2,
                  type: 'image',
                  url: '/static/banner/eam_banner2.png',
                  link: ''
               },
               {
                  id: 3,
                  type: 'image',
                  url: '/static/banner/eam_banner3.png',
                  link: ''
               },
               {
                  id: 4,
                  type: 'image',
                  url: '/static/banner/eam_banner4.png',
                  link: ''
               },
            ],
            middleApps: [
              {icon: 'line2_icon1.png', title: '审批', 'text': '个人审批'},
              {icon: 'line2_icon2.png', title: '审批稿', 'text': '审批草稿箱'},
            middleApps: [{
                  icon: 'line2_icon1.png',
                  title: '审批',
                  'text': '个人审批'
               },
               {
                  icon: 'line2_icon2.png',
                  title: '审批稿',
                  'text': '审批草稿箱'
               },
            ],
            usList:us.data,
            osList:os.data,
            wsList:ws.data,
            msgCount:0,
            dot:{
              mailHome:false
            usList: us.data,
            osList: os.data,
            wsList: ws.data,
            msgCount: 0,
            toDomsgCount: 0,
            dot: {
               mailHome: false
            }
         }
      },
      methods: {
         initMenu(){
         initMenu() {
            console.log("-----------home------------")
             this.onSocketOpen()
             this.onSocketReceive()
             this.loadCount(0);
            this.onSocketOpen()
            this.onSocketReceive()
            this.saveClientId()
            this.taskCountBySelf();
            this.loadCount(0);
         },
         goPage(page){
            if(!page){
         goPage(page) {
            if (!page) {
               return false;
            }
            if(page==='annotationList'){
              this.msgCount = 0
            if (page === 'annotationList') {
               this.msgCount = 0
            }
            this.dot[page]=false
            this.$Router.push({name: page})
            this.dot[page] = false
            this.$Router.push({
               name: page
            })
         },
         // 启动webSocket
         onSocketOpen() {
            socket.init('websocket');
         },
         onSocketReceive() {
            var _this=this
            socket.acceptMessage = function(res){
            var _this = this
            socket.acceptMessage = function(res) {
               // console.log("页面收到的消息", res);
               if(res.cmd == "topic"){
                 //系统通知
                 _this.loadCount('1')
               }else if(res.cmd == "user"){
                 //用户消息
                 _this.loadCount('2')
               } else if(res.cmd == 'email'){
                //邮件消息
                 _this.loadEmailCount()
               if (res.cmd == "topic") {
                  //系统通知
                  _this.loadCount('1')
               } else if (res.cmd == "user") {
                  //用户消息
                  _this.loadCount('2')
               } else if (res.cmd == 'email') {
                  //邮件消息
                  _this.loadEmailCount()
               }
            }
         },
         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)
              }
         taskCountBySelf() {
            let token = uni.getStorageSync(ACCESS_TOKEN)
            this.$http.get(this.url.countItem).then(res => {
               console.log("res::taskCountBySelf>", res)
               this.toDomsgCount = res.data.result
            })
         },
         loadEmailCount(){
         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)
               }
            })
         },
         saveClientId() {
            let token = uni.getStorageSync(ACCESS_TOKEN)
            this.$http.get(this.url.bindingThirdPhone, {
               params: {
                  token: token
               }
            }).then(res => {
               const authData = res.data.result.auth
               // 确保是数组
               if (!Array.isArray(authData)) {
                  console.warn('auth 不是数组:', authData)
                  return
               }
               // 存入 store
               this.$store.dispatch('saveAuth', authData)
               console.log('当前 store 中的 auth:', this.$store.getters.getAuth)
            }).catch(err => {
               console.error("获取 auth 失败:", err)
            })
         },
         loadEmailCount() {
            this.dot.mailHome = true
         },
         getTtemDotInfo(item){
            if(item.page==='annotationList' && this.msgCount>0){
              return this.msgCount
         getTtemDotInfo(item) {
            if (item.page === 'ToDoList' && this.toDomsgCount > 0) {
               // return this.toDomsgCount
               return true
            }
            return '';
            return false;
         }
      }
   }
@@ -169,11 +259,11 @@
<style scoped>
   .cu-list.grid>.cu-item {
     padding: 0px 0px;
      padding: 0px 0px;
   }
    .line2-icon {
     width: 60px;
     height: 60px;
    }
</style>
   .line2-icon {
      width: 60px;
      height: 60px;
   }
</style>