ll
liukangdong
2024-12-10 a8c03746e6bd8ac1d46dc48c1b10bceff543664f
h5/pages/staff/index.vue
@@ -1,291 +1,292 @@
<template>
  <view class="main_app">
    <view class="title_wrap">
      <view class="name" v-if="userInfo.realname"
        >{{ userInfo.realname || "" }},欢迎登录~</view
      >
      <view class="name" v-else>请先登录</view>
      <view class="btn" @click="loginOut">{{
        userInfo.realname ? "退出登录" : "去登录"
      }}</view>
    </view>
    <view class="banner_wrap">
      <view class="h1">安泰物流</view>
      <view class="h2">安全重于泰山 服务追求卓越</view>
      <image
        class="banner"
        src="../../static/banner.jpg"
        mode="widthFix"
      ></image>
    </view>
    <view v-if="list1.filter(i => checkAuth(i.auth)).length > 0" class="title_wrap"><view class="name">业务办理</view></view>
    <view class="container1">
         <view class="list">
            <block v-for="item in list1" :key="item.name">
               <view v-if="checkAuth(item.auth)" class="item" @click="jump(item.url)">
                  <image :src="item.img" class="icon" />
                  <view class="name">{{item.name}}</view>
               </view>
            </block>
         </view>
<!--      <view class="left">
        <view class="img_wrap img1" @click="jump('/pages/staff/visitorReport')">
          <image src="@/static/staff/ic_fangkebaobei.png" class="img"></image>
          <view class="h1">访客报备</view>
          <view class="h2">VISITOR REPORTING</view>
        </view>
        <view class="img_wrap img2" @click="jump('/pages/staff/meetingSub')">
          <image src="@/static/staff/ic_yuyuehuiyishi.png" class="img"></image>
          <view class="h1">预约会议室</view>
          <view class="h2">BOOK A MEETING ROOM</view>
        </view>
      </view>
      <view class="right">
        <view class="img_wrap img2" @click="jump('/pages/staff/snapshot')">
          <image src="@/static/staff/ic_yinhuansuipai.png" class="img"></image>
          <view class="h1">隐患随手拍</view>
          <view class="h2">HIDDEN DANGER</view>
        </view>
        <view class="img_wrap img2" @click="jump('/pages/staff/vehicle/index')">
          <image
            src="@/static/staff/ic_yongcheshenqing.png"
            class="img"
          ></image>
          <view class="h1">用车申请</view>
          <view class="h2">VEHICLE APPLICATION</view>
        </view>
        <view
          class="img_wrap img2"
          @click="jump('/pages/changePassword/changePassword')"
        >
          <image src="@/static/staff/ic_xiugaimima.png" class="img"></image>
          <view class="h1">修改密码</view>
          <view class="h2">CHANGE PASSWORD</view>
        </view>
      </view> -->
    </view>
    <!--  -->
    <view v-if="list2.filter(i => checkAuth(i.auth)).length > 0" class="title_wrap"><view class="name">业务查询</view></view>
    <view class="container2">
         <view class="list">
            <block v-for="item in list2" :key="item.name">
               <view v-if="checkAuth(item.auth)" class="item" @click="jump(item.url)">
                  <image :src="item.img" class="icon" />
                  <view class="name">{{item.name}}</view>
                  <view v-if="item.name == '任务中心' && taskInfo" class="task_num">{{ taskInfo }}</view>
               </view>
            </block>
         </view>
<!--      <view class="img_wrap" @click="jump('/pages/staff/task/index')">
        <image class="img" src="@/static/staff/ic_renwuzhongxin.png"></image>
        <view class="h1">任务中心</view>
        <view class="h2">TASK CENTER</view>
        <view class="task_num">{{
         taskInfo
        }}</view>
      </view>
      <view class="img_wrap" @click="jump('/pages/staff/meetingCalendar')">
        <image class="img" src="@/static/staff/ic_wodehuiyi.png"></image>
        <view class="h1">我的会议日历</view>
        <view class="h2">MY MEETING CALENDAR</view>
      </view>
      <view class="img_wrap" @click="jump('/pages/staff/vehicle/sendACar')">
        <image class="img" src="@/static/staff/ic_paichejilu.png"></image>
        <view class="h1">派车记录</view>
        <view class="h2">VEHICLE DISPATCH</view>
      </view>
      <view class="img_wrap" @click="jump('/pages/staff/meetingManager')">
        <image class="img" src="@/static/staff/ic_huiyishiguanli.png"></image>
        <view class="h1">会议室管理</view>
        <view class="h2">MANAGE MEETING ROOMS</view>
      </view> -->
    </view>
    <view class="copyright">
      <image src="@/static/logo_s@2x.png" mode="widthFix" />
      <text>安徽安泰物流有限责任公司版权所有</text>
    </view>
  </view>
</template>
<script>
import { logoutPost, stagingHead, wxAuthorize, refreshToken } from '@/api'
export default {
  data() {
    return {
      userInfo: uni.getStorageSync('userInfo') || {permissions: []},
      taskInfo: 0,
         list1: [
            { name: '访客报备', url: '/pages/staff/visitorReport', img: require('@/static/home/ic_fangkebaobei@3x.png'),auth: 'weixin:menu:visitcar' },
            { name: '隐患随手拍', url: '/pages/staff/snapshot', img: require('@/static/home/ic_yinhuansuishoupai@3x.png'),auth: 'weixin:menu:hiddendanger' },
            { name: '用车申请', url: '/pages/staff/vehicle/index', img: require('@/static/home/ic_yongcheshenqing@3x.png'),auth: 'weixin:menu:usecar' },
            { name: '预约会议室', url: '/pages/staff/meetingSub', img: require('@/static/home/ic_yuyuehuiyishi@3x.png'),auth: 'weixin:menu:meeting' },
            { name: '修改密码', url: '/pages/changePassword/changePassword', img: require('@/static/home/ic_xiugaimima@3x.png'),auth: 'weixin:menu:password' },
            { name: '我的考勤', url: '/pages/staff/signin', img: require('@/static/home/ic_kaoqin@3x.png'),auth: 'weixin:menu:attendance' },
         ],
         list2: [
            { name: '任务中心', url: '/pages/staff/task/index', img: require('@/static/home/ic_renwuzhongxin@3x.png'),auth: 'weixin:menu:taskcenter' },
            { name: '我的会议日历', url: '/pages/staff/meetingCalendar', img: require('@/static/home/ic_wodehuiyi@3x.png'),auth: 'weixin:menu:meetingcalendar' },
            { name: '派车记录', url: '/pages/staff/vehicle/sendACar', img: require('@/static/home/ic_paichejilu@3x.png'),auth: 'weixin:menu:usecarrecord' },
            { name: '会议室管理', url: '/pages/staff/meetingManager', img: require('@/static/home/ic_huiyishiguanli@3x.png'),auth: 'weixin:menu:meetingmanage' }
         ],
    }
  },
  onLoad() {
    this.getTaskInfo()
    // 刷新token
    // setTimeout(() => {
    //   refreshToken().then(res => {
    //     if (res.code && res.code === 200) {
    //       this.$store.commit('setToken', res.data)
    //     }
    //   })
    // }, 3000)
  },
  mounted() {
    this.$eventBus.$on('taskBack', () => {
      console.log('----');
      this.getTaskInfo()
    })
      console.log('aaa', this.userInfo.permissions.indexOf('system:user:create'));
  },
  methods: {
    jump(path) {
      uni.navigateTo({
        url: path
      })
    },
      checkAuth(str) {
         const permissions = this.userInfo.permissions
         return permissions.indexOf(str) > -1
      },
    loginOut() {
      this.$store.commit('empty')
      logoutPost()
      uni.redirectTo({
        url: '/pages/staffLogin/login'
      })
    },
    getTaskInfo() {
      stagingHead({
        isDetail: '1'
      }).then(res => {
        this.taskInfo = res.data.noticeWaitNum + res.data.noticeCopyNum
            if(this.taskInfo && this.taskInfo > 99){
               this.taskInfo = 99
            }
      })
    },
  }
};
</script>
<style lang="scss" scoped>
.title_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24rpx;
   padding-top: 10rpx;
  .name {
    font-weight: 600;
    font-size: 34rpx;
    color: #222222;
  }
  .btn {
    width: 144rpx;
    height: 56rpx;
    border-radius: 36rpx;
    border: 1rpx solid $uni-color-primary;
    font-size: 26rpx;
    color: $uni-color-primary;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.main_app {
  padding-top: 12rpx;
}
.list{
   display: flex;
   width: 100%;
   flex-wrap: wrap;
   .item{
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 25%;
      margin-bottom: 40rpx;
      font-size: 26rpx;
      position: relative;
      image{
         width: 88rpx;
         height: 88rpx;
         margin-bottom: 20rpx;
      }
      .task_num{
         position: absolute;
         top: -10rpx;
         right: 28rpx;
         font-size: 24rpx;
         width: 36rpx;
         height: 36rpx;
         background-color: red;
         color: #fff;
         border-radius: 50%;
         display: flex;
         justify-content: center;
         align-items: center;
      }
   }
}
.banner_wrap {
  padding: 54rpx 44rpx;
  color: #fff;
  position: relative;
  width: 688rpx;
  height: 270rpx;
  margin-bottom: 40rpx;
  .h1 {
    font-weight: bold;
    line-height: 66rpx;
    font-size: 44rpx;
    margin-bottom: 14rpx;
  }
  .banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
  }
}
.container1 {
  display: flex;
  flex-wrap: wrap;
   padding: 10rpx 0 10rpx;
}
.container2 {
  display: flex;
  flex-wrap: wrap;
}
.copyright {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24rpx;
  color: #666666;
   position: fixed;
   width: 100%;
   left: 0;
   bottom: 48rpx;
  image {
    width: 40rpx;
    height: 40rpx;
  }
}
</style>
<template>
   <view class="main_app">
      <view class="title_wrap">
         <view class="name" v-if="userInfo.realname">{{ userInfo.realname || "" }},欢迎登录~</view>
         <view class="name" v-else>请先登录</view>
         <view class="btn" @click="loginOut">{{
            userInfo.realname ? "退出登录" : "去登录"
         }}</view>
      </view>
      <view class="banner_wrap">
         <view class="h1">安泰物流</view>
         <view class="h2">安全重于泰山 服务追求卓越</view>
         <image class="banner" src="../../static/banner.jpg" mode="widthFix"></image>
      </view>
      <view v-if="list1.filter(i => checkAuth(i.auth)).length > 0" class="title_wrap">
         <view class="name">业务办理</view>
      </view>
      <view class="container1">
         <view class="list">
            <block v-for="item in list1" :key="item.name">
               <view v-if="checkAuth(item.auth)" class="item" @click="jump(item.url)">
                  <image :src="item.img" class="icon" />
                  <view class="name">{{ item.name }}</view>
               </view>
            </block>
         </view>
      </view>
      <!--  -->
      <view v-if="list2.filter(i => checkAuth(i.auth)).length > 0" class="title_wrap">
         <view class="name">业务查询</view>
      </view>
      <view class="container2">
         <view class="list">
            <block v-for="item in list2" :key="item.name">
               <view v-if="checkAuth(item.auth)" class="item" @click="jump(item.url)">
                  <image :src="item.img" class="icon" />
                  <view class="name">{{ item.name }}</view>
                  <view v-if="item.name == '任务中心' && taskInfo" class="task_num">{{ taskInfo }}</view>
               </view>
            </block>
         </view>
      </view>
      <view class="copyright">
         <image src="@/static/logo_s@2x.png" mode="widthFix" />
         <text>安徽安泰物流有限责任公司版权所有</text>
      </view>
   </view>
</template>
<script>
import {
   logoutPost,
   stagingHead,
   wxAuthorize,
   refreshToken,
   app_url
} from '@/api'
export default {
   data() {
      return {
         userInfo: uni.getStorageSync('userInfo') || {
            permissions: []
         },
         taskInfo: 0,
         list1: [{
            name: '访客报备',
            url: '/pages/staff/visitorReport',
            img: require('@/static/home/ic_fangkebaobei@3x.png'),
            auth: 'weixin:menu:visitcar'
         },
         {
            name: '隐患随手拍',
            url: '/pages/staff/snapshot',
            img: require('@/static/home/ic_yinhuansuishoupai@3x.png'),
            auth: 'weixin:menu:hiddendanger'
         },
         {
            name: '用车申请',
            url: '/pages/staff/vehicle/index',
            img: require('@/static/home/ic_yongcheshenqing@3x.png'),
            auth: 'weixin:menu:usecar'
         },
         {
            name: '预约会议室',
            url: '/pages/staff/meetingSub',
            img: require('@/static/home/ic_yuyuehuiyishi@3x.png'),
            auth: 'weixin:menu:meeting'
         },
         {
            name: '修改密码',
            url: '/pages/changePassword/changePassword',
            img: require('@/static/home/ic_xiugaimima@3x.png'),
            auth: 'weixin:menu:password'
         },
         {
            name: '我的考勤',
            url: '/pages/staff/signin',
            img: require('@/static/home/ic_kaoqin@3x.png'),
            auth: 'weixin:menu:attendance'
         },
         ],
         list2: [{
            name: '任务中心',
            url: '/pages/staff/task/index',
            img: require('@/static/home/ic_renwuzhongxin@3x.png'),
            auth: 'weixin:menu:taskcenter'
         },
         {
            name: '我的会议日历',
            url: '/pages/staff/meetingCalendar',
            img: require('@/static/home/ic_wodehuiyi@3x.png'),
            auth: 'weixin:menu:meetingcalendar'
         },
         {
            name: '派车记录',
            url: '/pages/staff/vehicle/sendACar',
            img: require('@/static/home/ic_paichejilu@3x.png'),
            auth: 'weixin:menu:usecarrecord'
         },
         {
            name: '会议室管理',
            url: '/pages/staff/meetingManager',
            img: require('@/static/home/ic_huiyishiguanli@3x.png'),
            auth: 'weixin:menu:meetingmanage'
         }
         ],
      }
   },
   mounted() {
   },
   onShow() {
      setTimeout(() => {
         this.getTaskInfo()
      }, 300)
   },
   methods: {
      jump(path) {
         if (path == '/pages/staff/signin') {
            window.open('https://atwl.ahzyssl.com/dps/web/wxAuth/loginV2?oaId=atwl&redirectId=index')
         } else {
            uni.navigateTo({
               url: path
            })
         }
      },
      checkAuth(str) {
         const permissions = this.userInfo.permissions
         return permissions.indexOf(str) > -1
      },
      loginOut() {
         logoutPost()
         this.$store.commit('empty')
         window.location.href = app_url
      },
      getTaskInfo() {
         stagingHead({
            isDetail: '1'
         }).then(res => {
            this.taskInfo = res.data.noticeWaitNum + res.data.noticeCopyNum
            if (this.taskInfo && this.taskInfo > 99) {
               this.taskInfo = 99
            }
         })
      },
   }
}
</script>
<style lang="scss" scoped>
.title_wrap {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 24rpx;
   padding-top: 10rpx;
   .name {
      font-weight: 600;
      font-size: 34rpx;
      color: #222222;
   }
   .btn {
      width: 144rpx;
      height: 56rpx;
      border-radius: 36rpx;
      border: 1rpx solid $uni-color-primary;
      font-size: 26rpx;
      color: $uni-color-primary;
      display: flex;
      justify-content: center;
      align-items: center;
   }
}
.main_app {
   padding-top: 12rpx;
}
.list {
   display: flex;
   width: 100%;
   flex-wrap: wrap;
   .item {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 25%;
      margin-bottom: 40rpx;
      font-size: 26rpx;
      position: relative;
      image {
         width: 88rpx;
         height: 88rpx;
         margin-bottom: 20rpx;
      }
      .task_num {
         position: absolute;
         top: -10rpx;
         right: 28rpx;
         font-size: 24rpx;
         width: 36rpx;
         height: 36rpx;
         background-color: red;
         color: #fff;
         border-radius: 50%;
         display: flex;
         justify-content: center;
         align-items: center;
      }
   }
}
.banner_wrap {
   padding: 54rpx 44rpx;
   color: #fff;
   position: relative;
   width: 688rpx;
   height: 270rpx;
   margin-bottom: 40rpx;
   .h1 {
      font-weight: bold;
      line-height: 66rpx;
      font-size: 44rpx;
      margin-bottom: 14rpx;
   }
   .banner {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      z-index: -1;
   }
}
.container1 {
   display: flex;
   flex-wrap: wrap;
   padding: 10rpx 0 10rpx;
}
.container2 {
   display: flex;
   flex-wrap: wrap;
}
.copyright {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 24rpx;
   color: #666666;
   position: fixed;
   width: 100%;
   left: 0;
   bottom: 48rpx;
   image {
      width: 40rpx;
      height: 40rpx;
   }
}
</style>