init: 基本布局

src/App.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+import zhCn from 'element-plus/lib/locale/lang/zh-cn'
+import { IconConfigProvider } from '@vicons/utils'
+</script>
+
+<template>
+  <Suspense>
+    <el-config-provider :locale="zhCn">
+      <icon-config-provider size="18">
+        <RouterView />
+      </icon-config-provider>
+    </el-config-provider>
+  </Suspense>
+</template>

src/main.ts

@@ -0,0 +1,14 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import 'vue-global-api'
+import 'modern-normalize/modern-normalize.css'
+import router from './router';
+import { Icon } from '@vicons/utils'
+
+const app = createApp(App)
+
+app.component('Icon', Icon);
+
+app.use(router)
+
+app.mount('#app')

src/pages/YBangumi.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <section class="bangumi">
+    <el-row>
+
+      <el-col>
+
+      </el-col>
+
+    </el-row>
+  </section>
+</template>
+
+<style lang='scss' scope>
+</style>

src/pages/YDebug.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+</script>
+
+<template>
+debug
+</template>
+
+<style lang='scss' scope>
+</style>

src/pages/YLayout.vue

@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import YMenu from './YMenu.vue';
+</script>
+
+<template>
+  <div class="app-layout">
+    <el-container>
+      <el-header class="header">
+        <img
+          src="@/assets/logo.png"
+          alt="logo"
+          class="logo"
+        >
+      </el-header>
+
+      <el-container>
+        <el-aside width="200px">
+          <YMenu />
+        </el-aside>
+
+        <el-main>
+          <RouterView />
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+
+<style lang='scss' scope>
+.app-layout {
+  width: 100%;
+  height: 100vh;
+  overflow: hidden;
+  display: flex;
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-bottom: 1px solid var(--el-border-color);
+  height: 65px;
+
+  .logo {
+    height: 70%;
+  }
+}
+</style>

src/pages/YMenu.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+import { Home, Debug } from '@vicons/carbon';
+</script>
+
+<template>
+  <ElMenu
+    default-active="/bangumi"
+    class="app-menu"
+    router
+  >
+
+    <ElMenuItem index="/bangumi">
+      <Icon>
+        <Home />
+      </Icon>
+      <template #title>番剧管理</template>
+    </ElMenuItem>
+
+    <ElMenuItem index="/debug">
+      <Icon>
+        <Debug />
+      </Icon>
+      <template #title>调试</template>
+    </ElMenuItem>
+
+  </ElMenu>
+</template>
+
+<style lang='scss' scope>
+.app-menu {
+  height: 100%;
+
+  .xicon{
+    margin-right: .5em;
+  }
+}
+</style>

src/router/index.ts

@@ -0,0 +1,30 @@
+import { createRouter, createWebHashHistory } from 'vue-router';
+
+const YLayout = () => import('../pages/YLayout.vue');
+const YBangumi = () => import('../pages/YBangumi.vue');
+const YDebug = () => import('../pages/YDebug.vue');
+
+const routes = [
+  {
+    path: '/',
+    component: YLayout,
+    redirect: '/bangumi',
+    children: [
+      {
+        path: 'bangumi',
+        component: YBangumi
+      },
+      {
+        path: 'debug',
+        component: YDebug
+      }
+    ]
+  },
+]
+
+const router = createRouter({
+  history: createWebHashHistory(),
+  routes,
+})
+
+export default router;

src/vite-env.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue'
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}