App.vue 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <template>
  2. <a-config-provider :locale="zhCN">
  3. <SidebarLayout
  4. v-if="showLayout"
  5. :userName="authStore.user?.name"
  6. :currentPath="route.path"
  7. @logout="handleLogout"
  8. >
  9. <router-view />
  10. </SidebarLayout>
  11. <router-view v-else />
  12. </a-config-provider>
  13. </template>
  14. <script setup lang="ts">
  15. import { computed, onMounted } from 'vue';
  16. import { useRouter, useRoute } from 'vue-router';
  17. import { message } from 'ant-design-vue';
  18. import zhCN from 'ant-design-vue/es/locale/zh_CN';
  19. import {
  20. DashboardOutlined,
  21. FileOutlined,
  22. AppstoreOutlined,
  23. UnorderedListOutlined,
  24. PayCircleOutlined,
  25. UserOutlined
  26. } from '@ant-design/icons-vue';
  27. import { SidebarLayout } from '@smartcut/shared-components';
  28. import { useAuthStore } from '@/stores/auth';
  29. import { useLayoutStore } from '@/stores/layout';
  30. const router = useRouter();
  31. const route = useRoute();
  32. const authStore = useAuthStore();
  33. const layoutStore = useLayoutStore();
  34. // 初始化布局配置
  35. onMounted(() => {
  36. layoutStore.init({
  37. menuItems: [
  38. { key: 'dashboard', label: '主页看板', icon: DashboardOutlined, path: '/' },
  39. { key: 'work-orders', label: '工单管理', icon: FileOutlined, path: '/work-orders' },
  40. { key: 'processes', label: '工序管理', icon: AppstoreOutlined, path: '/processes' },
  41. { key: 'records', label: '计件记录', icon: UnorderedListOutlined, path: '/records' },
  42. { key: 'salary', label: '工资管理', icon: PayCircleOutlined, path: '/salary' },
  43. { key: 'users', label: '用户管理', icon: UserOutlined, path: '/users' }
  44. ],
  45. theme: 'dark'
  46. });
  47. });
  48. // 根据路由 meta 判断是否显示布局
  49. const showLayout = computed(() => {
  50. return route.meta.showLayout !== false;
  51. });
  52. // 登出处理
  53. function handleLogout() {
  54. authStore.logout();
  55. message.success('已退出登录');
  56. router.push('/login');
  57. }
  58. </script>
  59. <style>
  60. #app {
  61. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
  62. 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
  63. 'Noto Color Emoji';
  64. -webkit-font-smoothing: antialiased;
  65. -moz-osx-font-smoothing: grayscale;
  66. }
  67. </style>