1

src/api/medical.js

@@ -1,16 +1,16 @@
-import axios from 'axios'
+import axiosInstance from '/src/utils/axiosInstance.js';
 
-const BASE_URL = 'http://localhost:8080/api/medical-records'
+const BASE_URL = '/api/medical-records';
 
 export const medicalApi = {
   // 创建病历
   createRecord(record) {
-    return axios.post(BASE_URL, record)
+    return axiosInstance.post(BASE_URL, record)
   },
 
   // 获取所有病历
   getAllRecords(patientName = '') {
-    return axios.get(BASE_URL, {
+    return axiosInstance.get(BASE_URL, {
       params: {
         patientName
       }
@@ -19,16 +19,16 @@ export const medicalApi = {
 
   // 获取单个病历
   getRecord(id) {
-    return axios.get(`${BASE_URL}/${id}`)
+    return axiosInstance.get(`${BASE_URL}/${id}`)
   },
 
   // 更新病历
   updateRecord(id, record) {
-    return axios.put(`${BASE_URL}/${id}`, record)
+    return axiosInstance.put(`${BASE_URL}/${id}`, record)
   },
 
   // 删除病历
   deleteRecord(id) {
-    return axios.delete(`${BASE_URL}/${id}`)
+    return axiosInstance.delete(`${BASE_URL}/${id}`)
   }
 }

src/api/user.js

@@ -1,4 +1,4 @@
-import request from "@/utils/request";
+import request from "@/utils/axiosInstance.js";
 
 // 获取所有用户
 export function userGetAllService() {

src/main.js

@@ -1,26 +1,26 @@
-import { createApp } from 'vue'
-import ElementPlus from 'element-plus'
-import 'element-plus/dist/index.css'
-import * as ElementPlusIconsVue from '@element-plus/icons-vue'
-import { createPinia } from 'pinia'
-import router from './router/index.js'
-import App from './App.vue'
-import './styles/views.css'
+import { createApp } from 'vue';
+import ElementPlus from 'element-plus';
+import 'element-plus/dist/index.css';
+import * as ElementPlusIconsVue from '@element-plus/icons-vue';
+import { createPinia } from 'pinia';
+import router from './router/index.js';
+import App from './App.vue';
+import './styles/views.css';
 import * as Vue from "echarts";
-import locale from 'element-plus/dist/locale/zh-cn.js'
-import axios from "axios"
+import axiosInstance from './utils/axiosInstance'; // 导入axios实例
 
-const app = createApp(App)
+const app = createApp(App);
 
 // 注册所有图标
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
-  app.component(key, component)
+    app.component(key, component);
 }
-app.config.globalProperties.$axios = axios
-app.use(ElementPlus)
-app.use(createPinia())
-app.use(router)
 
+// 将axios实例添加到Vue应用的全球属性中
+app.config.globalProperties.$axios = axiosInstance;
 
+app.use(ElementPlus);
+app.use(createPinia());
+app.use(router);
 
-app.mount('#app')
+app.mount('#app');

src/utils/axiosInstance.js

@@ -0,0 +1,54 @@
+// axiosInstance.js
+import axios from "axios";
+
+// 定义一个变量，记录公共的前缀，baseURL
+const baseURL = 'http://localhost:8080'; // 请根据实际后端接口修改
+const instance = axios.create({ baseURL });
+
+// 添加请求拦截器
+instance.interceptors.request.use(
+    config => {
+        const token = sessionStorage.getItem('token');
+        console.log("请求拦截器", token);
+        if (token) {
+            console.log("有token");
+            config.headers['Authorization'] = `Bearer ${token}`; // 添加 Bearer Token
+        } else {
+            console.log("无token");
+            delete config.headers['Authorization']; // 未登录时，删除 Authorization
+        }
+        return config;
+    },
+    error => {
+        console.log("请求拦截器错误", error);
+        return Promise.reject(error);
+    }
+);
+
+// 添加响应拦截器
+instance.interceptors.response.use(
+    result => {
+        // 成功的回调(状态码为200)
+        return result.data;
+    },
+    err => {
+        // 失败的回调(状态码非200)
+        if (err.response && err.response.status === 401) {
+            // 401 Unauthorized: Token 可能已过期或无效
+            alert("身份认证失败，请重新登录！");
+            sessionStorage.removeItem('token'); // 清除无效 Token
+            window.location.href = '/login'; // 跳转到登录页面
+        } else if(err.response && err.response.status === 403) {
+            // 403 Forbidden: 没有权限访问
+            alert("没有权限访问");
+        } else {
+            // 其它错误
+            alert("服务异常");
+        }
+        // 异步状态转为失败状态
+        return Promise.reject(err);
+    }
+);
+
+// 将实例暴露到外界
+export default instance;

src/utils/request.js

@@ -1,22 +0,0 @@
-import axios from "axios";
-
-// 定义一个变量，记录公共的前缀，baseURL
-const baseURL = 'api';
-const instance = axios.create({ baseURL })
-
-// 添加响应拦截器
-instance.interceptors.response.use(
-    result => {
-        // 成功的回调(状态码为200)
-        return result.data;
-    },
-    err => {
-        // 失败的回调(状态码非200)
-        alert("服务异常")
-        // 异步状态转为失败状态
-        return Promise.reject(err);
-    }
-)
-
-// 将实例暴露到外界
-export default instance

src/views/consultation/Record.vue

@@ -10,24 +10,27 @@
 
 <script lang="ts">
 import { defineComponent, ref, onMounted } from 'vue';
-import axios from 'axios';
+import axiosInstance from '@/utils/axiosInstance'; // 引入封装后的 axios 实例
+
+const BASE_URL = '/talk/record/all'; // 使用 BASE_URL 来确保路径一致性
 
 export default defineComponent({
   name: 'TalkHistory',
   setup() {
-    const tableData = ref([]);
+    const tableData = ref<any[]>([]); // 明确类型为数组
 
-    const fetchData = () => {
-      axios.get('http://127.0.0.1:8080/talk/record/all')
-          .then(response => {
-            console.log('Talk records fetched successfully:', response.data);
-            tableData.value = response.data;
-          })
-          .catch(error => {
-            console.error('There was an error fetching the talk records:', error);
-          });
+    const fetchData = async () => {
+      try {
+        // 使用 axiosInstance 发送请求
+        const response = await axiosInstance.get(BASE_URL);
+        console.log('Talk records fetched successfully:', response);
+        tableData.value = response; // 直接使用 response 中的数据
+      } catch (error) {
+        console.error('错误：', error);
+      }
     };
 
+    // 在组件挂载后获取数据
     onMounted(() => {
       fetchData();
     });

src/views/login/Index.vue

@@ -19,32 +19,39 @@
 </template>
 
 <script>
+// 导入Vue相关的库
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 import axios from 'axios';
 
+// 导出默认的组件
 export default {
   setup() {
+    // 定义用户信息的响应式引用
     const user = ref({
-      username: '',
-      pwd: '',
-      permission: ''
+      data: '',
+      code: 0,
+      message: ''
     });
     const router = useRouter();
 
+
+    // 定义注册函数，跳转到注册页面
     const register = () => {
       router.push('/register');
     };
 
+    // 定义登录函数，处理用户登录逻辑
     const login = async () => {
       try {
         const response = await axios.post('http://localhost:8080/user/login', user.value);
         console.log(response);
-        const { data } = response;
+        const {data} = response;
         if (data.code === 200) {
           alert('用户登录成功');
           console.log(data.data);
-          localStorage.setItem('user',JSON.stringify(data.data));
+          const token = data.data;
+          sessionStorage.setItem('token', token);
           await router.push('/home');
         } else {
           alert(data.message);

vite.config.js

@@ -13,7 +13,7 @@ export default defineConfig({
   server: {
     host: '0.0.0.0',
     port: 3000,
-    https:false,
+    https: false,
     open: true,
     cors: true,
     proxy: {
@@ -26,11 +26,9 @@ export default defineConfig({
   },
   css: {
     preprocessorOptions: {
-      preprocessorOptions:{
       scss: {
         additionalData: `@use "@/styles/element/index.scss" as *;`,
-        api:"modern-compiler"
-      }
+        api: "modern-compiler"
       }
     }
   }