路由配置完成，修复历史遗留问题

study-project-frontend/src/App.vue

@@ -4,14 +4,10 @@ import {useStore} from "@/stores";
 import router from "@/router";
 
 const store = useStore()
+const user = localStorage.getItem('user')
 
-if(store.auth.user == null) {
+if(user != null) {
-    get('/api/user/me', (message) => {
+    store.auth.user = JSON.parse(user)
-        store.auth.user = message
-        router.push('/index')
-    }, () => {
-        store.auth.user = null
-    })
 }
 </script>
 

study-project-frontend/src/components/index/PostList.vue

@@ -0,0 +1,13 @@
+<script setup>
+
+</script>
+
+<template>
+  <div>
+    我是帖子列表
+  </div>
+</template>
+
+<style scoped>
+
+</style>

study-project-frontend/src/components/index/Settings.vue

@@ -0,0 +1,13 @@
+<script setup>
+
+</script>
+
+<template>
+  <div>
+    我是设置界面
+  </div>
+</template>
+
+<style scoped>
+
+</style>

study-project-frontend/src/components/welcome/LoginPage.vue

@@ -64,6 +64,7 @@ const login = () => {
             ElMessage.success(message)
             get('/api/user/me', (message) => {
                 store.auth.user = message
+                localStorage.setItem("user", JSON.stringify(message))
                 router.push('/index')
             }, () => {
                 store.auth.user = null

study-project-frontend/src/net/index.js

@@ -1,5 +1,6 @@
 import axios from "axios";
 import {ElMessage} from "element-plus";
+import router from "@/router";
 
 const defaultError = () => ElMessage.error('发生了一些错误，请联系管理员')
 const defaultFailure = (message) => ElMessage.warning(message)
@@ -11,7 +12,9 @@ function post(url, data, success, failure = defaultFailure, error = defaultError
         },
         withCredentials: true
     }).then(({data}) => {
-        if(data.success)
+        if(data.status === 401)
+            router.push('/')
+        else if(data.success)
             success(data.message, data.status)
         else
             failure(data.message, data.status)
@@ -22,7 +25,9 @@ function get(url, success, failure = defaultFailure, error = defaultError) {
     axios.get(url, {
         withCredentials: true
     }).then(({data}) => {
-        if(data.success)
+        if(data.status === 401)
+            router.push('/')
+        else if(data.success)
             success(data.message, data.status)
         else
             failure(data.message, data.status)

study-project-frontend/src/router/index.js

@@ -26,7 +26,18 @@ const router = createRouter({
     }, {
       path: '/index',
       name: 'index',
-      component: () => import('@/views/IndexView.vue')
+      component: () => import('@/views/IndexView.vue'),
+      children: [
+        {
+          path: '',
+          name: 'index-list',
+          component: () => import('@/components/index/PostList.vue')
+        }, {
+          path: 'settings',
+          name: 'index-settings',
+          component: () => import('@/components/index/Settings.vue')
+        }
+      ]
     }
   ]
 })

study-project-frontend/src/views/IndexView.vue

@@ -7,10 +7,11 @@
                     style="width: 150px"/>
         </div>
         <el-menu
-            default-active="1"
+            :default-active="router.currentRoute.value.path"
+            router
             :collapse="isCollapse"
             style="border: none">
-          <el-menu-item index="1">
+          <el-menu-item index="/index">
             <el-icon><icon-menu /></el-icon>
             <span>帖子列表</span>
           </el-menu-item>
@@ -26,7 +27,7 @@
             <el-icon><setting /></el-icon>
             <span>我的收藏</span>
           </el-menu-item>
-          <el-menu-item index="5">
+          <el-menu-item index="/index/settings">
             <el-icon><setting /></el-icon>
             <span>个人设置</span>
           </el-menu-item>
@@ -72,7 +73,9 @@
             </div>
           </div>
         </el-header>
-        <el-main style="">Main</el-main>
+        <el-main style="padding: 0">
+          <router-view/>
+        </el-main>
       </el-container>
     </el-container>
   </div>
@@ -83,7 +86,7 @@ import {get} from "@/net";
 import {ElMessage} from "element-plus";
 import router from "@/router";
 import {useStore} from "@/stores";
-import {Document, Location, Setting, Menu as IconMenu, Search, Back, Expand, Fold} from "@element-plus/icons-vue";
+import {Document, Setting, Menu as IconMenu, Search, Back, Expand, Fold} from "@element-plus/icons-vue";
 import {ref} from "vue";
 
 const store = useStore()
@@ -93,8 +96,9 @@ const isCollapse = ref(false)
 const logout = () => {
     get('/api/auth/logout', (message) => {
         ElMessage.success(message)
-        router.push('/')
         store.auth.user = null
+        localStorage.removeItem('user')
+        router.push('/')
     })
 }
 </script>