shalu-velofex/apps/web-velofex/src/views/dashboard/home/index.vue

<script setup lang="ts">
import { computed, onMounted, ref, watch } from 'vue';

import { useAccessStore, useUserStore } from '@vben/stores';

import { Col, Row } from 'antdv-next';

import { getAllMenusApi, getUserInfoApi } from '#/api';

import ApplicationManagement from './application-management.vue';
import DeliveryPartners from './delivery-partners.vue';
import EnterpriseCustomers from './enterprise-customers.vue';
import ProductList from './product-list.vue';
import SalesPartners from './sales-partners.vue';
import UserInfo from './user-info.vue';

const userStore = useUserStore();
const accessStore = useAccessStore();

const isLogin = computed(() => !!userStore.userInfo);
const menus = ref<any[]>([]);
const salesPartnersShow = ref(true);
const enterpriseCustomersShow = ref(true);
const applicationManagementShow = ref(true);
const deliveryPartnersShow = ref(true);

async function checkTokenAndGetUserInfo() {
  try {
    const token = localStorage.getItem('token_a');
    if (token) {
      accessStore.setAccessToken(token);
      const userInfoRes = await getUserInfoApi();
      if (userInfoRes && userInfoRes.isSuccess) {
        const userInfo = {
          account:
            userInfoRes.result?.account ||
            userInfoRes.result?.englishName ||
            '',
          avatar: userInfoRes.result?.avatarFileId || '',
          cellPhone: userInfoRes.result?.cellPhone || '',
          realName:
            userInfoRes.result?.chineseName || userInfoRes.result?.name || '',
          email: userInfoRes.result?.emailAddress || '',
          roles: [],
          userId: userInfoRes.result?.id || '',
          username: userInfoRes.result?.name || '',
        };
        userStore.setUserInfo(userInfo);
      }
    }
  } catch (error) {
    console.error('检查token并获取用户信息失败:', error);
  }
}

async function fetchMenus() {
  try {
    const result = await getAllMenusApi();
    menus.value = result.result.children;
    const menuCodes = new Set(menus.value.map((menu) => menu.code));
    salesPartnersShow.value = menuCodes.has('Sys_Menu_Partner');
    enterpriseCustomersShow.value = menuCodes.has('Sys_Menu_EnterClient');
    applicationManagementShow.value = menuCodes.has('Sys_Menu_Project');
    deliveryPartnersShow.value = menuCodes.has('Sys_Menu_User');
  } catch (error) {
    console.error('获取菜单失败:', error);
  }
}

watch(
  () => isLogin.value,
  (newValue) => {
    if (newValue) {
      fetchMenus();
    }
  },
  { immediate: true },
);

onMounted(() => {
  checkTokenAndGetUserInfo();
});
</script>

<template>
  <div>
    <Row :gutter="[30, 25]">
      <Col :span="9">
        <SalesPartners :jurisdiction="salesPartnersShow" />
      </Col>
      <Col :span="9">
        <EnterpriseCustomers :jurisdiction="enterpriseCustomersShow" />
      </Col>
      <Col :span="6">
        <UserInfo />
      </Col>

      <Col :span="18">
        <ApplicationManagement :jurisdiction="applicationManagementShow" />
      </Col>
      <Col :span="6">
        <DeliveryPartners :jurisdiction="deliveryPartnersShow" />
      </Col>
    </Row>
    <ProductList />
  </div>
</template>

<style scoped></style>