| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273 |
- <template>
- <a-config-provider :locale="zhCN">
- <SidebarLayout
- v-if="showLayout"
- :userName="authStore.user?.name"
- :currentPath="route.path"
- @logout="handleLogout"
- >
- <router-view />
- </SidebarLayout>
- <router-view v-else />
- </a-config-provider>
- </template>
- <script setup lang="ts">
- import { computed, onMounted } from 'vue';
- import { useRouter, useRoute } from 'vue-router';
- import { message } from 'ant-design-vue';
- import zhCN from 'ant-design-vue/es/locale/zh_CN';
- import {
- DashboardOutlined,
- FileOutlined,
- AppstoreOutlined,
- UnorderedListOutlined,
- PayCircleOutlined,
- UserOutlined
- } from '@ant-design/icons-vue';
- import { SidebarLayout } from '@smartcut/shared-components';
- import { useAuthStore } from '@/stores/auth';
- import { useLayoutStore } from '@/stores/layout';
- const router = useRouter();
- const route = useRoute();
- const authStore = useAuthStore();
- const layoutStore = useLayoutStore();
- // 初始化布局配置
- onMounted(() => {
- layoutStore.init({
- menuItems: [
- { key: 'dashboard', label: '主页看板', icon: DashboardOutlined, path: '/' },
- { key: 'work-orders', label: '工单管理', icon: FileOutlined, path: '/work-orders' },
- { key: 'processes', label: '工序管理', icon: AppstoreOutlined, path: '/processes' },
- { key: 'records', label: '计件记录', icon: UnorderedListOutlined, path: '/records' },
- { key: 'salary', label: '工资管理', icon: PayCircleOutlined, path: '/salary' },
- { key: 'users', label: '用户管理', icon: UserOutlined, path: '/users' }
- ],
- theme: 'dark'
- });
- });
- // 根据路由 meta 判断是否显示布局
- const showLayout = computed(() => {
- return route.meta.showLayout !== false;
- });
- // 登出处理
- function handleLogout() {
- authStore.logout();
- message.success('已退出登录');
- router.push('/login');
- }
- </script>
- <style>
- #app {
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
- 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
- 'Noto Color Emoji';
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- }
- </style>
|