feat(web): 实现能源站监控与运行管理系统的登录功能

- 新增登录页面组件 LoginView.vue
- 添加全局样式和布局调整
- 实现用户登录逻辑,包括表单验证、验证码校验和 token 存储
- 集成 ant-design-vue 组件库
- 添加请求拦截器和错误处理
This commit is contained in:
zhoumengru
2025-08-29 12:28:33 +08:00
parent 5e559f8d36
commit 390ea73d7d
11 changed files with 629 additions and 168 deletions

16
web/src/request/api.js Normal file
View File

@@ -0,0 +1,16 @@
import request from "@/request/index.js";
export function postReq(data, url) {
return request({
method: "post",
url,
data,
});
}
export function getReq(data, url) {
// const query = qs.stringify(data, { indices: false })
return request({
method: "get",
url: url + "?" + data,
});
}

61
web/src/request/index.js Normal file
View File

@@ -0,0 +1,61 @@
import axios from "axios";
// import openNotification from "../utils/notification";
// let { config } = window;
// let { baseUrl } = config;
const service = axios.create({
// baseURL: baseUrl,
baseURL: "",
timeout: 120000,
});
service.interceptors.request.use((config) => {
const webConfig = config;
// if (!["/user/login", "/config/getConfig"].includes(config.url)) {
// if (localStorage.getItem("token")) {
// webConfig.headers = {
// Authorization: localStorage.getItem("token"),
// };
// }
// }
return webConfig;
});
service.interceptors.response.use(
(response) => {
// 排除以下接口的错误提示
const { url } = response.config;
const urls = ["/light/", "/serve/delete", "/user/checkRandom"];
const urlFlag = urls.map((item) => {
return url.includes(item);
});
const res = response.data;
if (res.code !== 200) {
if (res.code == 401 || res.tip == "校验token过期") {
setTimeout(() => {
window.$wujie?.props.jump({ path: "/login" });
}, 1000);
} else if (urlFlag.every((item) => item === false)) {
// openNotification({
// status: "error",
// desc: res.tip,
// });
}
}
return res;
},
(error) => {
// console.log(error, 'error 此处添加监控超时处理')
if (
error.name === "AxiosError" &&
error.message === "timeout of 120000ms exceeded" &&
error.code === "ECONNABORTED"
) {
return error;
}
}
);
export default service;