heli-mes/mes-ui/mini-app/src/pages/index/index.vue

<script setup lang="ts">
import { onLoad, onShow } from '@dcloudio/uni-app'
import { useLoginStore } from '@/stores/modules/login'
import { computed, ref, reactive } from 'vue'
import CustomNavbar from './components/CustomNavbar.vue'
import CategoryPanel from './components/CategoryPanel.vue'
import footRight from './components/footRight.vue'
import PageSkeleton from './components/PageSkeleton.vue'
import { getHomeCategoryAPI } from '@/services/home'
// 获取前台分类数据
const categoryList = ref([
  {
    path: 'approveOrder',
    name: '订单批准',
    auth: false,
    imgUrl: '/static/images/approveOrder.png',
    defaultImgUrl: '/static/images/approveOrder-default.png',
  },
  {
    path: 'unqualifiedNotification',
    name: '品质异常通知',
    auth: false,
    imgUrl: '/static/images/unqualifiedNotification.png',
    defaultImgUrl: '/static/images/unqualifiedNotification-default.png',
  },
  {
    path: 'productionReport',
    name: '生产报工',
    auth: false,
    imgUrl: '/static/images/productionReport.png',
    defaultImgUrl: '/static/images/productionReport-default.png',
  },
  {
    path: 'assembleReport',
    name: '装配报工',
    auth: false,
    imgUrl: '/static/images/assembleReport.png',
    defaultImgUrl: '/static/images/assembleReport-default.png',
  },
  {
	  path: "pgMaster",
	  name: "过程检报工",
	  auth: true,
	  imgUrl: "/static/images/guochengjian.png",
	  defaultImgUrl: "/static/images/assembleReport-default.png"
	},
	{
	  path: "zjPgMaster",
	  name: "终检报工",
	  auth: true,
	  imgUrl: "/static/images/zhongjian.png",
	  defaultImgUrl: "/static/images/assembleReport-default.png"
	},
]) 
const loginStore = useLoginStore()
const isLogin = computed(() => {
  const accessToken = loginStore.userInfo?.accessToken
  const storage_token = uni.getStorageSync('storage_userInfo')?.accessToken
  return !!accessToken || !!storage_token
})
// 是否加载中标记
const isLoading = ref(false)
// 页面加载
onShow(async() => {
  if (isLogin.value) {
    await getHomeCategory()
  } else {
    categoryList.value.forEach((e) => {
      e.auth = true
    })
  }
})
const getHomeCategory = async () => {
  isLoading.value = true
  const params = {}
  const data = await getHomeCategoryAPI(params)
  const menus = data?.menus.find((e) => e.path == '/applet')?.children || []
  if (menus.length) {
    const arr = []
    categoryList.value.forEach((e) => {
      const target = menus.find((q) => q.path == e.path)
      e.auth = !!target
    })
  }
  if (loginStore.userInfo.userId) {
    const obj = {
      ...loginStore.userInfo,
      nickname: data.user.nickname
    }
    loginStore.setInfo(obj)
  }
  isLoading.value = false
}
</script>
<template>
  <view class="viewport">
    <template v-if="isLoading">
      <PageSkeleton />
    </template>
    <template v-else>
      <CustomNavbar />
      <view class="cont">
        <CategoryPanel :list="categoryList" />
        <footRight />
      </view>
    </template>
  </view>
</template>

<style lang="scss">
page {
  height: 100%;
  overflow: hidden;
  background-color: #F8FAFD;
}

.viewport {
  width: 100vw;
  height: 100vh;
  margin-bottom: 300rpx;
  .cont {
    //margin: 100rpx 0;
  }
}
</style>