31 lines
1007 B
Vue
31 lines
1007 B
Vue
<template>
|
||
<section id="app" class="flex flex-col min-h-screen">
|
||
<NavBar class="fixed" />
|
||
|
||
<main class="w-full p-4 pt-[80px]">
|
||
<section class="grid grid-cols-7 gap-4 overflow-hidden">
|
||
<!-- 左側:地圖 -->
|
||
<section class="col-span-3 bg-white/50 rounded-md shadow p-3 h-full overflow-hidden">
|
||
<div class="w-full h-full flex items-center justify-center text-gray-500">
|
||
<Forge />
|
||
</div>
|
||
</section>
|
||
|
||
<!-- 右側:路由內容 -->
|
||
<section class="col-span-4 h-full overflow-hidden">
|
||
<div class="w-full h-full">
|
||
<RouterView class="h-[calc(100vh-72px-24px)]" />
|
||
</div>
|
||
</section>
|
||
</section>
|
||
</main>
|
||
</section>
|
||
</template>
|
||
|
||
<script setup>
|
||
import NavBar from "@/layouts/NavBar.vue";
|
||
// 延遲載入,避免首頁沒用到也被打包
|
||
import { defineAsyncComponent } from "vue";
|
||
const Forge = defineAsyncComponent(() => import("@/components/forge/Forge.vue"));
|
||
</script>
|