✨ add internationalization / dynamic themes
This commit is contained in:
@@ -1,17 +1,25 @@
|
||||
import {handleLocalforage} from "@/utils/localforage";
|
||||
import localforage from "localforage";
|
||||
|
||||
|
||||
export const localforageStorageAdapter = {
|
||||
set(key: string, value: any) {
|
||||
handleLocalforage.setItem(key, value);
|
||||
localforage.setItem(key, value).then();
|
||||
},
|
||||
get(key: string) {
|
||||
const data: string = handleLocalforage.getItem(key);
|
||||
return data ? JSON.parse(data) : data;
|
||||
let value;
|
||||
localforage.getItem(key).then((res: any) => {
|
||||
if (res === null || res === undefined) {
|
||||
value = "";
|
||||
} else {
|
||||
value = res;
|
||||
}
|
||||
});
|
||||
return value ? JSON.parse(value) : value;
|
||||
},
|
||||
remove(key: any) {
|
||||
handleLocalforage.removeItem(key);
|
||||
localforage.removeItem(key).then();
|
||||
},
|
||||
clear() {
|
||||
handleLocalforage.clear().then();
|
||||
localforage.clear().then();
|
||||
}
|
||||
};
|
||||
|
@@ -6,6 +6,8 @@ import {axiosRequestAdapter} from "@alova/adapter-axios";
|
||||
import {AxiosError, AxiosResponse} from "axios";
|
||||
import {message} from "ant-design-vue";
|
||||
import {localforageStorageAdapter} from "@/utils/alova/adapter/localforageStorageAdapter.ts";
|
||||
import {handleCode} from "@/utils/errorCode/errorCodeHandler.ts";
|
||||
|
||||
|
||||
export const service = createAlova({
|
||||
timeout: 5000,
|
||||
@@ -51,103 +53,4 @@ export const service = createAlova({
|
||||
}
|
||||
});
|
||||
|
||||
function handleCode(code: number): void {
|
||||
switch (code) {
|
||||
case 400:
|
||||
message
|
||||
.open({
|
||||
content: "请求错误(400)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 401:
|
||||
message
|
||||
.open({
|
||||
content: "未授权,请重新登录(401)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 403:
|
||||
message
|
||||
.open({
|
||||
content: "拒绝访问(403)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 404:
|
||||
message
|
||||
.open({
|
||||
content: "请求出错(404)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 408:
|
||||
message
|
||||
.open({
|
||||
content: "请求超时(408)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 500:
|
||||
message
|
||||
.open({
|
||||
content: "服务器错误(500)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 501:
|
||||
message
|
||||
.open({
|
||||
content: "服务未实现(501)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 502:
|
||||
message
|
||||
.open({
|
||||
content: "网络错误(502)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 503:
|
||||
message
|
||||
.open({
|
||||
content: "服务不可用(503)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 504:
|
||||
message
|
||||
.open({
|
||||
content: "网络超时(504)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 505:
|
||||
message
|
||||
.open({
|
||||
content: "HTTP版本不受支持(505)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
default:
|
||||
message
|
||||
.open({
|
||||
content: `连接出错(${code})!`,
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -3,6 +3,7 @@
|
||||
import axios, {AxiosInstance, AxiosRequestConfig} from "axios";
|
||||
import {message} from "ant-design-vue";
|
||||
import useStore from "@/store";
|
||||
import {handleCode} from "@/utils/errorCode/errorCodeHandler.ts";
|
||||
|
||||
class Request {
|
||||
private instance: AxiosInstance | undefined;
|
||||
@@ -36,7 +37,7 @@ class Request {
|
||||
(error) => {
|
||||
const {response} = error;
|
||||
if (response) {
|
||||
this.handleCode(response.status);
|
||||
handleCode(response.status);
|
||||
}
|
||||
if (!window.navigator.onLine) {
|
||||
message.error("网络连接失败");
|
||||
@@ -46,107 +47,6 @@ class Request {
|
||||
);
|
||||
}
|
||||
|
||||
handleCode(code: number): void {
|
||||
switch (code) {
|
||||
case 400:
|
||||
message
|
||||
.open({
|
||||
content: "请求错误(400)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 401:
|
||||
message
|
||||
.open({
|
||||
content: "未授权,请重新登录(401)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 403:
|
||||
message
|
||||
.open({
|
||||
content: "拒绝访问(403)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 404:
|
||||
message
|
||||
.open({
|
||||
content: "请求出错(404)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 408:
|
||||
message
|
||||
.open({
|
||||
content: "请求超时(408)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 500:
|
||||
message
|
||||
.open({
|
||||
content: "服务器错误(500)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 501:
|
||||
message
|
||||
.open({
|
||||
content: "服务未实现(501)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 502:
|
||||
message
|
||||
.open({
|
||||
content: "网络错误(502)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 503:
|
||||
message
|
||||
.open({
|
||||
content: "服务不可用(503)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 504:
|
||||
message
|
||||
.open({
|
||||
content: "网络超时(504)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 505:
|
||||
message
|
||||
.open({
|
||||
content: "HTTP版本不受支持(505)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
default:
|
||||
message
|
||||
.open({
|
||||
content: `连接出错(${code})!`,
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
request<T>(config: AxiosRequestConfig<T>): Promise<T> {
|
||||
return new Promise<T>((resolve, reject) => {
|
||||
this.instance
|
||||
|
102
src/utils/errorCode/errorCodeHandler.ts
Normal file
102
src/utils/errorCode/errorCodeHandler.ts
Normal file
@@ -0,0 +1,102 @@
|
||||
import {message} from "ant-design-vue";
|
||||
|
||||
export function handleCode(code: number): void {
|
||||
switch (code) {
|
||||
case 400:
|
||||
message
|
||||
.open({
|
||||
content: "请求错误(400)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 401:
|
||||
message
|
||||
.open({
|
||||
content: "未授权,请重新登录(401)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 403:
|
||||
message
|
||||
.open({
|
||||
content: "拒绝访问(403)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 404:
|
||||
message
|
||||
.open({
|
||||
content: "请求出错(404)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 408:
|
||||
message
|
||||
.open({
|
||||
content: "请求超时(408)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 500:
|
||||
message
|
||||
.open({
|
||||
content: "服务器错误(500)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 501:
|
||||
message
|
||||
.open({
|
||||
content: "服务未实现(501)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 502:
|
||||
message
|
||||
.open({
|
||||
content: "网络错误(502)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 503:
|
||||
message
|
||||
.open({
|
||||
content: "服务不可用(503)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 504:
|
||||
message
|
||||
.open({
|
||||
content: "网络超时(504)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
case 505:
|
||||
message
|
||||
.open({
|
||||
content: "HTTP版本不受支持(505)",
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
default:
|
||||
message
|
||||
.open({
|
||||
content: `连接出错(${code})!`,
|
||||
type: "error",
|
||||
})
|
||||
.then();
|
||||
break;
|
||||
}
|
||||
}
|
@@ -1,65 +0,0 @@
|
||||
/** @format */
|
||||
|
||||
import localforage from "localforage";
|
||||
import CryptoJS from "crypto-js";
|
||||
|
||||
const SECRET_KEY = CryptoJS.enc.Utf8.parse("3333e6e143439161"); //十六位十六进制数作为密钥
|
||||
const SECRET_IV = CryptoJS.enc.Utf8.parse("e3bbe7e3ba84431a"); //十六位十六进制数作为密钥偏移量
|
||||
/**
|
||||
* 加密
|
||||
* @param data
|
||||
* @param output
|
||||
*/
|
||||
export const encrypt = (data: string, output?: undefined) => {
|
||||
const dataHex = CryptoJS.enc.Utf8.parse(data);
|
||||
const encrypted = CryptoJS.AES.encrypt(dataHex, SECRET_KEY, {
|
||||
iv: SECRET_IV,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.Pkcs7,
|
||||
});
|
||||
return encrypted.ciphertext.toString(output);
|
||||
};
|
||||
|
||||
/**
|
||||
* 解密
|
||||
* @param data
|
||||
*/
|
||||
export const decrypt = (data: string | unknown) => {
|
||||
if (data === null) {
|
||||
return;
|
||||
}
|
||||
const encryptedHex = CryptoJS.enc.Hex.parse(data as string);
|
||||
const encryptedHexStr = CryptoJS.enc.Base64.stringify(encryptedHex);
|
||||
const decrypted = CryptoJS.AES.decrypt(encryptedHexStr, SECRET_KEY, {
|
||||
iv: SECRET_IV,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.Pkcs7,
|
||||
});
|
||||
const decryptedStr = decrypted.toString(CryptoJS.enc.Utf8);
|
||||
return decryptedStr.toString();
|
||||
};
|
||||
|
||||
export const handleLocalforage = {
|
||||
config: async (options?: LocalForageOptions) => localforage.config(options || {}),
|
||||
setItem: (key: string, value: any) => {
|
||||
localforage.setItem(key, encrypt(value));
|
||||
},
|
||||
getItem: (key: string) => {
|
||||
let value: unknown = null;
|
||||
localforage.getItem(key).then((res: unknown) => {
|
||||
value = res;
|
||||
});
|
||||
return decrypt(value) as string;
|
||||
},
|
||||
removeItem: (key: string) => {
|
||||
localforage.removeItem(key);
|
||||
},
|
||||
clear: async () => {
|
||||
return await localforage.clear();
|
||||
},
|
||||
createInstance: async (name: string) => {
|
||||
return localforage.createInstance({
|
||||
name,
|
||||
});
|
||||
},
|
||||
};
|
@@ -5,7 +5,7 @@ import 'nprogress/nprogress.css';
|
||||
NProgress.configure({
|
||||
easing: 'ease', // 动画方式
|
||||
speed: 300, // 递增进度条的速度
|
||||
showSpinner: false, // 是否显示加载ico
|
||||
showSpinner: true, // 是否显示加载ico
|
||||
trickleSpeed: 200, // 自动递增间隔
|
||||
minimum: 0.3, // 更改启动时使用的最小百分比
|
||||
parent: 'body' //指定进度条的父容器
|
||||
|
Reference in New Issue
Block a user