fix(admin): restore Vite admin source files
This commit is contained in:
kate522 committed
1 parent
8fe3a89c36
commit
ac5c0b2dd7
114 files changed
+17272
No files matched your search
@@ -0,0 +1,272 @@
|
||||
<template>
|
||||
<n-config-provider :style-mount-target="styleMountTarget">
|
||||
<n-message-provider>
|
||||
<n-dialog-provider>
|
||||
<n-notification-provider>
|
||||
<n-layout v-if="!isMobile" class="aksrt-admin-layout" has-sider>
|
||||
<n-layout-sider
|
||||
bordered
|
||||
collapse-mode="width"
|
||||
:collapsed-width="64"
|
||||
:width="240"
|
||||
show-collapse-trigger
|
||||
:collapsed="collapsed"
|
||||
:native-scrollbar="false"
|
||||
@collapse="collapsed = true"
|
||||
@expand="collapsed = false"
|
||||
>
|
||||
<div class="aksrt-logo">
|
||||
<span class="logo-icon">AK</span>
|
||||
<span v-if="!collapsed" class="logo-text">AKSRT</span>
|
||||
</div>
|
||||
|
||||
<n-menu
|
||||
:value="activeMenuKey"
|
||||
:collapsed="collapsed"
|
||||
:collapsed-width="64"
|
||||
:options="menuOptions"
|
||||
@update:value="handleMenuClick"
|
||||
/>
|
||||
</n-layout-sider>
|
||||
|
||||
<n-layout :native-scrollbar="false" class="aksrt-admin-content">
|
||||
<div class="aksrt-admin-content__inner">
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition name="fade-slide" mode="out-in">
|
||||
<div class="aksrt-page-wrapper" :key="route.fullPath">
|
||||
<component :is="Component" />
|
||||
</div>
|
||||
</transition>
|
||||
</router-view>
|
||||
|
||||
<div v-if="pageError" class="aksrt-error-fallback">
|
||||
<p class="aksrt-error-title">页面渲染异常</p>
|
||||
<p class="aksrt-error-msg">{{ pageError }}</p>
|
||||
<n-button size="small" @click="pageError = null">重试</n-button>
|
||||
</div>
|
||||
</div>
|
||||
</n-layout>
|
||||
</n-layout>
|
||||
|
||||
<div v-else class="aksrt-admin-mobile">
|
||||
<MobileTopBar :title="currentPageTitle" @toggle="drawerActive = true" />
|
||||
|
||||
<n-drawer v-model:show="drawerActive" placement="left" :width="280">
|
||||
<n-drawer-content :native-scrollbar="false" body-content-style="padding:0;">
|
||||
<div class="aksrt-logo aksrt-logo--drawer">
|
||||
<span class="logo-icon">AK</span>
|
||||
<span class="logo-text">AKSRT</span>
|
||||
</div>
|
||||
<n-menu
|
||||
:value="activeMenuKey"
|
||||
:options="menuOptions"
|
||||
@update:value="handleMenuClick"
|
||||
/>
|
||||
</n-drawer-content>
|
||||
</n-drawer>
|
||||
|
||||
<div class="aksrt-admin-mobile__body">
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition name="fade-slide" mode="out-in">
|
||||
<div class="aksrt-page-wrapper" :key="route.fullPath">
|
||||
<component :is="Component" />
|
||||
</div>
|
||||
</transition>
|
||||
</router-view>
|
||||
|
||||
<div v-if="pageError" class="aksrt-error-fallback">
|
||||
<p class="aksrt-error-title">页面渲染异常</p>
|
||||
<p class="aksrt-error-msg">{{ pageError }}</p>
|
||||
<n-button size="small" @click="pageError = null">重试</n-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</n-notification-provider>
|
||||
</n-dialog-provider>
|
||||
</n-message-provider>
|
||||
</n-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, onBeforeUnmount, onErrorCaptured, onMounted, provide, ref } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { NConfigProvider } from 'naive-ui'
|
||||
import MobileTopBar from './components/MobileTopBar.vue'
|
||||
import { styleMountTarget } from './style-target'
|
||||
import { ADMIN_SECTIONS } from './constants/admin-sections'
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const collapsed = ref(false)
|
||||
const pageError = ref(null)
|
||||
const isMobile = ref(false)
|
||||
const drawerActive = ref(false)
|
||||
|
||||
function checkMobile() {
|
||||
isMobile.value = window.innerWidth < 768
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
checkMobile()
|
||||
window.addEventListener('resize', checkMobile)
|
||||
})
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', checkMobile)
|
||||
})
|
||||
|
||||
provide('collapsed', collapsed)
|
||||
|
||||
onErrorCaptured((err) => {
|
||||
console.error('[AKSRT] 组件渲染错误:', err)
|
||||
pageError.value = err?.message || String(err)
|
||||
return false
|
||||
})
|
||||
|
||||
/* ------------------------------------------------------------------ */
|
||||
/* Build key → path lookup from ADMIN_SECTIONS */
|
||||
/* ------------------------------------------------------------------ */
|
||||
const keyToPath = {}
|
||||
for (const section of ADMIN_SECTIONS) {
|
||||
if (section.children) {
|
||||
for (const child of section.children) {
|
||||
keyToPath[child.key] = child.route
|
||||
}
|
||||
}
|
||||
// For placeholder sections (no children), the section key maps to its route
|
||||
if (section.placeholder) {
|
||||
keyToPath[section.key] = section.route
|
||||
}
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------------ */
|
||||
/* Build NaiveUI menu options from ADMIN_SECTIONS */
|
||||
/* ------------------------------------------------------------------ */
|
||||
const menuOptions = ADMIN_SECTIONS.filter((section) => !section.hidden).map((section) => {
|
||||
if (section.placeholder) {
|
||||
// Placeholder sections have no children — render as a leaf menu item
|
||||
return {
|
||||
label: section.label,
|
||||
key: section.key,
|
||||
icon: section.icon,
|
||||
}
|
||||
}
|
||||
return {
|
||||
label: section.label,
|
||||
key: section.key,
|
||||
icon: section.icon,
|
||||
children: section.children.map((child) => ({
|
||||
label: child.secondaryEntry ? `${child.label} · 次级` : child.label,
|
||||
key: child.key,
|
||||
props: child.secondaryEntry ? { class: 'aksrt-menu-item--secondary' } : undefined,
|
||||
})),
|
||||
}
|
||||
})
|
||||
|
||||
/* ------------------------------------------------------------------ */
|
||||
/* Active menu key resolution */
|
||||
/* ------------------------------------------------------------------ */
|
||||
const activeMenuKey = computed(() => {
|
||||
const path = route.path
|
||||
|
||||
// Find the child whose route matches the current path
|
||||
for (const section of ADMIN_SECTIONS) {
|
||||
if (section.children) {
|
||||
for (const child of section.children) {
|
||||
if (path === child.route || path.startsWith(child.route + '/')) {
|
||||
return child.key
|
||||
}
|
||||
}
|
||||
}
|
||||
// Placeholder section (no children)
|
||||
if (section.placeholder && (path === section.route || path.startsWith(section.route + '/'))) {
|
||||
return section.key
|
||||
}
|
||||
}
|
||||
|
||||
// Default: first section's first child
|
||||
return ADMIN_SECTIONS[0]?.children?.[0]?.key || 'global-common'
|
||||
})
|
||||
|
||||
const currentPageTitle = computed(() => route.meta?.title || 'AKSRT')
|
||||
|
||||
function handleMenuClick(key) {
|
||||
if (keyToPath[key]) {
|
||||
router.push(keyToPath[key])
|
||||
if (isMobile.value) {
|
||||
drawerActive.value = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.aksrt-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 60px;
|
||||
gap: 10px;
|
||||
border-bottom: 1px solid var(--n-border-color, #efeff5);
|
||||
}
|
||||
|
||||
.aksrt-logo--drawer {
|
||||
justify-content: flex-start;
|
||||
padding: 0 18px;
|
||||
}
|
||||
|
||||
.logo-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 8px;
|
||||
background: #18a058;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
}
|
||||
|
||||
.logo-text {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #1a1a2e;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.aksrt-admin-content__inner {
|
||||
padding: 24px 28px;
|
||||
}
|
||||
|
||||
.aksrt-admin-mobile {
|
||||
background: #f5f7fb;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.aksrt-admin-mobile__body {
|
||||
padding: 14px 12px 32px;
|
||||
}
|
||||
|
||||
.aksrt-page-wrapper {
|
||||
min-height: calc(100vh - 120px);
|
||||
}
|
||||
|
||||
.aksrt-error-fallback {
|
||||
padding: 48px 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.aksrt-error-title {
|
||||
margin: 0 0 10px;
|
||||
font-size: 16px;
|
||||
color: #d03050;
|
||||
}
|
||||
|
||||
.aksrt-error-msg {
|
||||
margin: 0 0 16px;
|
||||
font-size: 13px;
|
||||
color: #777;
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user