DESKTOP-72TV0V4\caoxiaozhu
6d5ae6c604
- Reorganize project structure: move frontend to web/ directory - Add Database page with connection list (name, type, subtables, status, created, actions) - Integrate Element Plus for UI components with dark theme support - Add Quicksand font for rounded UI design - Configure root package.json to run frontend from web/ directory Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
42 lines
922 B
Vue
42 lines
922 B
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import { ElConfigProvider } from 'element-plus'
|
|
import Sidebar from '@/components/Sidebar.vue'
|
|
|
|
const route = useRoute()
|
|
const showSidebar = computed(() => route.path !== '/')
|
|
</script>
|
|
|
|
<template>
|
|
<ElConfigProvider :z-index="3000">
|
|
<div class="flex min-h-screen bg-dark-900">
|
|
<!-- 左侧侧边栏 (除了登录页) -->
|
|
<Sidebar v-if="showSidebar" />
|
|
|
|
<!-- 右侧内容区 -->
|
|
<main :class="showSidebar ? 'ml-64' : ''" class="flex-1 min-h-screen">
|
|
<router-view class="page-content" />
|
|
</main>
|
|
</div>
|
|
</ElConfigProvider>
|
|
</template>
|
|
|
|
<style>
|
|
/* 页面进入动画 */
|
|
.page-content {
|
|
animation: page-enter 0.3s ease-out;
|
|
}
|
|
|
|
@keyframes page-enter {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(10px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
</style>
|