修改部分含有用户id的请求，pinia修复登出问题

Author: caolib

src/components/HeaderView.vue

@@ -27,9 +27,11 @@ const isDark = useDark();
 // 头像下拉菜单命令
 const handleCommand = function (command) {
   if (command === "logout") {
-    // 退出后清除token和reader信息
+    // 退出后清除token和用户信息
     tokenStore.setToken(null);
-    readerStore.setReader(null);
+    readerStore.clearReader();
+    adminStore.clearAdmin();
+
     router.push("/login");
   } else if (command === "frontend") {
     window.open("https://github.com/TankingCao/vue3-vite");
@@ -86,7 +88,7 @@ const url = ref("https://pic.imgdb.cn/item/65a271fe871b83018a8f9a8f.gif");
         <el-tag v-if="isAdmin" type="warning" size="large" round>
           管理员
         </el-tag>
-        <el-tag v-else type="primary" size="large" round> 读者 </el-tag>
+        <el-tag v-else size="large" round> 读者 </el-tag>
       </el-menu-item>
 
       <!--深浅色图标-->

src/components/SideView.vue

@@ -62,8 +62,8 @@ const router = useRouter();
 const logout = () => {
   // 退出后清除token、reader和admin信息
   tokenStore.setToken(null);
-  readerStore.setReader(null);
-  adminStore.setAdmin(null);
+  readerStore.clearReader();
+  
   router.push("/login");
 };
 

src/methods/borrow.js

@@ -1,18 +1,15 @@
 import request from "@/util/request";
 
 // 查询个人的借书记录
-const getBorrowByReaderIdService = function (id) {
-    return request.get('/borrow', {
-        params: {readerId: id},
-    });
+const getBorrowByReaderIdService = function () {
+    return request.get('/borrow');
 };
 
 //借书
-const borrowService = function (isbn, readerId, dueDate) {
+const borrowService = function (isbn, dueDate) {
     return request.get('/borrow/borrowBook', {
         params: {
             isbn: isbn,
-            readerId: readerId,
             dueDate: dueDate
         }
     });

src/stores/admin.js

@@ -19,8 +19,16 @@ export const useAdminStore = defineStore('admin', () => {
         const setAdmin = (data) => {
             admin.value = data;
         }
+        //清除信息
+        const clearAdmin = ()=>{
+            admin.value.id = '';
+            admin.value.username = '';
+            admin.value.nickname = '';
+            admin.value.token = '';
+        }
+
         return {
-            admin, setAdmin,isAdmin,setIsAdmin
+            admin, setAdmin,isAdmin,setIsAdmin,clearAdmin
         }
     },
     // 持久化，pinia保存在内存中，刷新即丢失

src/stores/reader.js

@@ -18,8 +18,18 @@ export const useReaderStore = defineStore('reader', () => {
         const setReader = (data) => {
             reader.value = data;
         }
+        //清除信息
+        const clearReader = () => {
+            reader.value.id = '';
+            reader.value.username = '';
+            reader.value.nickname = '';
+            reader.value.gender = '';
+            reader.value.age = '';
+            reader.value.tel = '';
+            reader.value.token = '';
+        }
         return {
-            reader, setReader
+            reader, setReader,clearReader
         }
     },
     {

src/views/BookView.vue

@@ -13,7 +13,9 @@ const tableData = ref([]);
 
 // 页面加载时获取所有书籍
 onMounted(async () => {
+  loading.value = true;
   await getAllBooks();
+  loading.value = false;
 });
 
 // 获取所有书籍
@@ -89,7 +91,7 @@ const showBorrow = (row) => {
 
 //借阅
 const borrow = async () => {
-  await borrowService(book.value.isbn, readerStore.reader.id, dueDate.value);
+  await borrowService(book.value.isbn, dueDate.value);
   ElMessage.success("借阅成功");
   showDrawer.value = false;
   //刷新表格

src/views/BorrowView.vue

@@ -1,5 +1,4 @@
 <script setup>
-import {useReaderStore} from "@/stores/reader.js";
 import {
   deleteBorrowBatchService,
   deleteByIdService,
@@ -12,7 +11,7 @@ import SideView from "@/components/SideView.vue";
 import {ElMessage} from "element-plus";
 import {Delete} from "@element-plus/icons-vue";
 
-const readerStore = useReaderStore();
+
 const tableData = ref([]);
 
 onMounted(() => {
@@ -36,7 +35,7 @@ const tableRowClassName = ({row}) => {
 
 //获取当前读者的借阅信息
 const getBorrowByReaderId = async function () {
-  const result = await getBorrowByReaderIdService(readerStore.reader.id);
+  const result = await getBorrowByReaderIdService();
   tableData.value = result.data;
   if (filterStatus.value === 'all') {
     tableData.value = result.data;

src/views/LoginView.vue

@@ -42,9 +42,8 @@ const login = async function () {
   //保存用户信息和token
   readerStore.setReader(returnReader);
   tokenStore.setToken(returnReader.token);
-  //设置为管理员视图
   adminStore.setIsAdmin(false);
-  console.log("tokenStore:" + tokenStore.token);
+  // console.log("tokenStore:" + tokenStore.token);
   await router.push("/book");
   ElNotification.success({
     title: "登录成功",

vite.config.js

@@ -29,6 +29,7 @@ export default defineConfig({
         port: 5173,
         proxy: {
             '/api': { //匹配请求路径中含有 /api 的请求
+                // target: 'http://47.115.226.138:8080', //后端服务地址
                 target: 'http://localhost:8080', //后端服务地址
                 changeOrigin: true,
                 rewrite: (path) => path.replace(/^\/api/, '') //去除路径中的/api，还原请求路径