From 59f416cac8a880459b09ad31004a1f470bc36cb7 Mon Sep 17 00:00:00 2001
From: RogerWork <roger.x.sun@qq.com>
Date: Mon, 11 Dec 2023 10:30:08 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=BA=86header=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E4=BA=86=E9=BB=98=E8=AE=A4=E4=B8=AD=E6=96=87=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                          | 40 ++++++++++++++--------------
 src/layout/components/PageAside.vue  | 32 ++++++++++++++++++++++
 src/layout/components/PageHeader.vue | 17 ++++++++++++
 src/layout/index.vue                 | 34 +++++++++++++++++++++++
 src/main.js                          |  4 ++-
 src/router/index.js                  | 13 ++++++++-
 src/views/update/index.vue           | 11 ++++++++
 7 files changed, 129 insertions(+), 22 deletions(-)
 create mode 100644 src/layout/components/PageAside.vue
 create mode 100644 src/layout/components/PageHeader.vue
 create mode 100644 src/layout/index.vue
 create mode 100644 src/views/update/index.vue

diff --git a/src/App.vue b/src/App.vue
index 994c1e4..9f1beb3 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,27 +1,27 @@
-<script setup>
-import HelloWorld from './components/HelloWorld.vue'
+<script>
+import { defineComponent } from 'vue'
+import { ElConfigProvider } from 'element-plus'
+
+import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
+
+export default defineComponent({
+  components: {
+    ElConfigProvider,
+  },
+  setup() {
+    return {
+      locale: zhCn,
+    }
+  },
+})
 </script>
 
 <template>
-  <div class="common-layout">
-    <el-container>
-      <el-aside width="200px">
-        Aside
-      </el-aside>
-      <el-main>
-        <HelloWorld/>
-      </el-main>
-    </el-container>
-  </div>
+  <el-config-provider :locale="locale">
+    <router-view></router-view>
+  </el-config-provider>
 </template>
 
 <style>
-#app,
-html,
-body,
-.el-container {
-  padding: 0;
-  margin: 0;
-  height: 100%;
-}
+
 </style>
diff --git a/src/layout/components/PageAside.vue b/src/layout/components/PageAside.vue
new file mode 100644
index 0000000..daf92f4
--- /dev/null
+++ b/src/layout/components/PageAside.vue
@@ -0,0 +1,32 @@
+<script setup>
+import {
+  Document,
+  Menu as IconMenu,
+  Location,
+  Setting,
+} from '@element-plus/icons-vue'
+</script>
+
+<template>
+  <el-row class="tac">
+    <el-col :span="15">
+      <h5 class="mb-2">鼎新工具集</h5>
+      <el-menu
+          default-active="1"
+          class="el-menu-vertical-demo"
+      >
+        <el-menu-item index="1">
+          <el-icon>
+            <icon-menu/>
+          </el-icon>
+          <span>影院列表</span>
+        </el-menu-item>
+      </el-menu>
+    </el-col>
+  </el-row>
+
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/layout/components/PageHeader.vue b/src/layout/components/PageHeader.vue
new file mode 100644
index 0000000..1489105
--- /dev/null
+++ b/src/layout/components/PageHeader.vue
@@ -0,0 +1,17 @@
+<script setup>
+const goBack = () => {
+  console.log('go back')
+}
+</script>
+
+<template>
+  <el-page-header @back="goBack">
+    <template #content>
+      <span class="text-large font-600 mr-3">影院列表</span>
+    </template>
+  </el-page-header>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/layout/index.vue b/src/layout/index.vue
new file mode 100644
index 0000000..df7171a
--- /dev/null
+++ b/src/layout/index.vue
@@ -0,0 +1,34 @@
+<script setup>
+import HelloWorld from "@/components/HelloWorld.vue";
+import PageHeader from "@/layout/components/PageHeader.vue";
+import PageAside from "@/layout/components/PageAside.vue";
+</script>
+
+<template>
+  <div class="common-layout">
+    <el-container>
+      <el-aside width="200px">
+        <PageAside/>
+      </el-aside>
+      <el-container>
+        <el-header>
+          <PageHeader/>
+        </el-header>
+        <el-main>
+          <HelloWorld/>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+
+<style>
+#app,
+html,
+body,
+.el-container {
+  padding: 0;
+  margin: 0;
+  height: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 121a6e6..5ff8e7d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,6 +3,8 @@ import './style.css'
 import App from './App.vue'
 import ElementPlus from 'element-plus'
 import * as ELIcons from '@element-plus/icons-vue'
+import router from './router/index.js'
+import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
 
 const app = createApp(App)
 
@@ -10,4 +12,4 @@ for (const name in ELIcons){
     app.component(name, ELIcons[name]);
 }
 
-app.use(ElementPlus).mount('#app')
+app.use(router).use(ElementPlus, {locale: zhCn,}).mount('#app')
diff --git a/src/router/index.js b/src/router/index.js
index b7889b1..8c6f80b 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,3 +1,14 @@
 import {createRouter, createWebHashHistory} from 'vue-router';
+import Layout from '@/layout/index.vue'
 
-const routes = []
\ No newline at end of file
+const routes = [
+    {
+        path: '/',
+        name: 'Home',
+        component: Layout,
+    }
+]
+
+const router = createRouter({history: createWebHashHistory(), routes})
+
+export default router
\ No newline at end of file
diff --git a/src/views/update/index.vue b/src/views/update/index.vue
new file mode 100644
index 0000000..f79cdd8
--- /dev/null
+++ b/src/views/update/index.vue
@@ -0,0 +1,11 @@
+<script setup>
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file