From 0dde4fcf7fdae2dffc34e80f854183901938ac8b Mon Sep 17 00:00:00 2001
From: bai <1643359946@qq.com>
Date: Sat, 1 Apr 2023 10:59:46 +0800
Subject: [PATCH] =?UTF-8?q?2023=E5=B9=B44=E6=9C=881=E6=97=A5=20=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E9=97=A8=E6=88=B7=E5=9F=BA=E6=9C=AC=E6=9E=B6=E5=AD=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/site/index.vue | 138 +++++++++++++++++++++++++++++++++------
 1 file changed, 117 insertions(+), 21 deletions(-)

diff --git a/src/views/site/index.vue b/src/views/site/index.vue
index 89fab4d..bac8d7b 100644
--- a/src/views/site/index.vue
+++ b/src/views/site/index.vue
@@ -1,29 +1,74 @@
 <template>
-  <a-card>
-    <div>
-      <h1>首页</h1>
-    </div>
-    <div>{{ list }} - {{ stateCount }}</div>
-    <div>
-      {{ state }}
-      <a-button type="primary" @click="() => state.count++">点击+1</a-button>
-    </div>
-    <div>
-      {{ i }}
-      <a-button type="primary" @click="changeClick">点击+1</a-button>
-    </div>
-    <div>
-      <RouterLink to="/site/index2">跳转到子页</RouterLink>
-    </div>
-    <br/>
-    <div>
-      <RouterLink to="/dashboard/analysis">跳转到首页</RouterLink>
-    </div>
-  </a-card>
+  <div id="siteMain">
+    <!-- <a-card>
+      <div>
+        <h1>首页</h1>
+      </div>
+      <div>{{ list }} - {{ stateCount }}</div>
+      <div>
+        {{ state }}
+        <a-button type="primary" @click="() => state.count++">点击+1</a-button>
+      </div>
+      <div>
+        {{ i }}
+        <a-button type="primary" @click="changeClick">点击+1</a-button>
+      </div>
+      <div>
+        <RouterLink to="/site/index2">跳转到子页</RouterLink>
+      </div>
+      <br/>
+      <div>
+        <RouterLink to="/dashboard/analysis">跳转到首页</RouterLink>
+      </div>
+    </a-card>
+    ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// -->
+    <a-layout>
+      <a-layout-header>
+        <span class="topTitle">管理系统</span>
+        <span class="topRight">
+          <a-dropdown>
+            <span class="ant-dropdown-link topRightMenu" @click.prevent>
+              {{ userStore?.getUserInfo?.realname }}
+              <DownOutlined />
+            </span>
+            <template #overlay>
+              <a-menu>
+                <a-menu-item>
+                  <!-- <a href="javascript:;">后台管理</a> -->
+                  <RouterLink to="/dashboard/analysis">后台管理</RouterLink>
+                </a-menu-item>
+                <a-menu-item>
+                  <a href="javascript:;" @click="userStore?.confirmLoginOut();">安全退出</a>
+                </a-menu-item>
+              </a-menu>
+            </template>
+          </a-dropdown>
+        </span>
+      </a-layout-header>
+      <a-layout-content>
+        内容流区域
+      </a-layout-content>
+      <a-layout-footer>
+        <span class="footerLeft">TEL：0431-85099971</span>
+        <span class="footerRight">Copyright 东北师范大学教务处 2023</span>
+      </a-layout-footer>
+    </a-layout>
+  </div>
 </template>
 
 <script lang="ts" setup>
   import { ref, reactive, computed, onMounted } from 'vue';
+  import { DownOutlined } from '@ant-design/icons-vue';
+  import { useUserStore } from '/@/store/modules/user';
+
+  //用户相关
+  const userStore = useUserStore();
+
+  console.log(`🚀 -----------------------------------------------🚀`);
+  console.log(`🚀 ~ file: index.vue:66 ~ userStore:`, userStore);
+  console.log(`🚀 -----------------------------------------------🚀`);
+
+
   // reactive
   let list = reactive({ list: [] });
   //针对基础类型
@@ -45,3 +90,54 @@
     // list.list.push({ key: i.value });
   }
 </script>
+<style lang="less">
+#siteMain {
+  //最大宽度
+  max-width: 1100px;
+  //居中
+  margin: 0 auto;
+  .topTitle {
+    font-size: 1.5rem;
+  }
+  .topRight {
+    float: right;
+    .topRightMenu {
+      font-size: 1.1rem;
+    }
+  }
+  .footerRight {
+    float: right;
+  }
+
+  .ant-layout-header {
+    color: #fff;
+    background: #1ab394;
+  }
+  .ant-layout-footer {
+    line-height: 1.5;
+  }
+  .ant-layout-sider {
+    color: #fff;
+    line-height: 120px;
+    background: #3ba0e9;
+  }
+  .ant-layout-content {
+    min-height: 120px;
+    color: #000;
+    line-height: 120px;
+    background: #FFF
+  }
+}s
+/**暗黑模式特殊配色*/
+[data-theme='dark'] #siteMain {
+  .ant-layout-header, .ant-layout-footer {
+    background: #6aa0c7;
+  }
+  .ant-layout-content {
+    background: #107bcb;
+  }
+  .ant-layout-sider {
+    background: #3499ec;
+  }
+}
+</style>
\ No newline at end of file