上一页

src/App.vue

@@ -7,11 +7,11 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
-	<!--
+  <!--
  -->
-	<div id="container">
+  <div id="container">
 
-		<!-- <div id="nav">
+    <!-- <div id="nav">
       <router-link
         v-for="item in routes"
         :key="item.path"
@@ -24,16 +24,16 @@
         {{ item.name }}
       </router-link>
     </div> -->
-		<main style="z-index: 2">
-			<router-view />
-		</main>
-	</div>
+    <main style="z-index: 2">
+      <router-view/>
+    </main>
+  </div>
 </template>
 <script setup>
 import {boeRequest, request} from "@/api/request";
-import { GET_USER_INFO } from "@/api/ThirdApi";
-import { useStore } from "vuex";
-import { onMounted } from "vue";
+import {GET_USER_INFO} from "@/api/ThirdApi";
+import {useStore} from "vuex";
+import {onMounted} from "vue";
 import {useRoute} from "vue-router/dist/vue-router";
 import {USER_INFO} from "@/api/api";
 
@@ -45,11 +45,11 @@ onMounted(() => {
 });
 
 function getUserInfo() {
-  if(import.meta.env.MODE ==='development' || import.meta.env.MODE ==='test'){
-    request(USER_INFO,{}).then(res=>{
+  if (import.meta.env.MODE === 'development' || import.meta.env.MODE === 'test') {
+    request(USER_INFO, {}).then(res => {
       store.commit("SET_USER", res.data);
     })
-  }else{
+  } else {
     boeRequest(GET_USER_INFO).then((res) => {
       res.result.avatar = res.result.avatar || '/800e23f7-b58c-4192-820d-0c6a2b7544cc.png'
       store.commit("SET_USER", res.result);
@@ -59,58 +59,67 @@ function getUserInfo() {
 </script>
 <style lang="scss">
 #app {
-	// font-family: MicrosoftYaHei, Microsoft YaHei, Avenir, Helvetica, Arial,
-	// sans-serif;
-	font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
-		Microsoft YaHei, Arial, sans-serif;
-	-webkit-font-smoothing: antialiased;
-	-moz-osx-font-smoothing: grayscale;
-	color: #2c3e50;
-	height: 100%;
+  // font-family: MicrosoftYaHei, Microsoft YaHei, Avenir, Helvetica, Arial,
+  // sans-serif;
+  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
+  Microsoft YaHei, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  color: #2c3e50;
+  height: 100%;
+}
+
+.return {
+  right: 0 !important;
+}
+
+.preNext {
+  right: 115px !important;
+  margin-top:4px;
 }
 
 #container {
-	display: flex;
-	width: 100%;
-	min-height: 100%;
-	background-color: rgba(242, 245, 247, 1);
+  display: flex;
+  width: 100%;
+  min-height: 100%;
+  background-color: rgba(242, 245, 247, 1);
 
-	// background-color: #ccc;
-	#nav {
-		width: 220px;
-		height: 100%;
-		display: flex;
-		flex-direction: column;
-		gap: 20px;
-		padding: 30px 0;
-		box-sizing: border-box;
-		background: #f1f1f1;
-		box-shadow: 0 5px 15px 8px rgba(1, 22, 54, 0.795);
+  // background-color: #ccc;
+  #nav {
+    width: 220px;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+    padding: 30px 0;
+    box-sizing: border-box;
+    background: #f1f1f1;
+    box-shadow: 0 5px 15px 8px rgba(1, 22, 54, 0.795);
 
-		.link {
-			text-decoration: none;
-			color: rgb(0, 0, 0);
-			padding: 10px;
-			transition: all 0.4s;
-			text-align: center;
+    .link {
+      text-decoration: none;
+      color: rgb(0, 0, 0);
+      padding: 10px;
+      transition: all 0.4s;
+      text-align: center;
 
-			&:hover {
-				background: rgba(4, 37, 223, 0.274);
-				color: #f1f1f1;
-			}
+      &:hover {
+        background: rgba(4, 37, 223, 0.274);
+        color: #f1f1f1;
+      }
 
-			&.active {
-				color: #f1f1f1;
-				background: rgba(17, 120, 255, 0.74);
-			}
-		}
-	}
+      &.active {
+        color: #f1f1f1;
+        background: rgba(17, 120, 255, 0.74);
+      }
+    }
+  }
 
-	main {
-		flex: 1;
-		width: 100%;
-		// padding: 30px;
-		box-sizing: border-box;
-	}
+  main {
+    flex: 1;
+    width: 100%;
+    // padding: 30px;
+    box-sizing: border-box;
+  }
 }
 </style>