初始化代码
This commit is contained in:
yiqiuyang
@@ -0,0 +1,152 @@
|
||||
import Cookies from 'js-cookie'
|
||||
|
||||
const SystemType = 'protal'
|
||||
|
||||
// Cookie键名常量
|
||||
const COOKIE_KEYS = {
|
||||
TOKEN: `${SystemType}-Server-Token`,
|
||||
USER_TENANT_INFO: `${SystemType}-User-TenantInfo`,
|
||||
USER_ID: `${SystemType}-UserId`,
|
||||
LOGIN_TOKEN: `${SystemType}-Login-Token`,
|
||||
USERNAME: `${SystemType}-Username`,
|
||||
PASSWORD: `${SystemType}-Password`,
|
||||
REMEMBER_ME: `${SystemType}-RememberMe`,
|
||||
}
|
||||
|
||||
// 默认Cookie选项
|
||||
const DEFAULT_COOKIE_OPTIONS = {
|
||||
expires: 30, // 30天过期
|
||||
}
|
||||
|
||||
// 请求接口token
|
||||
export function getToken() {
|
||||
return Cookies.get(COOKIE_KEYS.TOKEN)
|
||||
}
|
||||
|
||||
export function setToken(token) {
|
||||
return Cookies.set(COOKIE_KEYS.TOKEN, token)
|
||||
}
|
||||
|
||||
export function removeToken() {
|
||||
return Cookies.remove(COOKIE_KEYS.TOKEN)
|
||||
}
|
||||
|
||||
// 用户扩展数据
|
||||
export function getUserTenantInfo() {
|
||||
return Cookies.get(COOKIE_KEYS.USER_TENANT_INFO)
|
||||
}
|
||||
|
||||
export function setUserTenantInfo(tenantInfo) {
|
||||
return Cookies.set(COOKIE_KEYS.USER_TENANT_INFO, tenantInfo)
|
||||
}
|
||||
|
||||
export function removeUserTenantInfo() {
|
||||
return Cookies.remove(COOKIE_KEYS.USER_TENANT_INFO)
|
||||
}
|
||||
|
||||
// userId缓存
|
||||
export function setUserId(userId) {
|
||||
return Cookies.set(COOKIE_KEYS.USER_ID, userId)
|
||||
}
|
||||
|
||||
export function removeUserId() {
|
||||
return Cookies.remove(COOKIE_KEYS.USER_ID)
|
||||
}
|
||||
|
||||
// 登陆token缓存
|
||||
export function getLoginToken() {
|
||||
return Cookies.get(COOKIE_KEYS.LOGIN_TOKEN)
|
||||
}
|
||||
|
||||
export function setLoginToken(token) {
|
||||
return Cookies.set(COOKIE_KEYS.LOGIN_TOKEN, token)
|
||||
}
|
||||
|
||||
export function removeLoginToken() {
|
||||
return Cookies.remove(COOKIE_KEYS.LOGIN_TOKEN)
|
||||
}
|
||||
|
||||
// 用户账号密码缓存
|
||||
export function getUsernameToken() {
|
||||
return Cookies.get(COOKIE_KEYS.USERNAME)
|
||||
}
|
||||
|
||||
export function setUsernameToken(token) {
|
||||
return Cookies.set(COOKIE_KEYS.USERNAME, token, DEFAULT_COOKIE_OPTIONS)
|
||||
}
|
||||
|
||||
export function removeUsernameToken() {
|
||||
return Cookies.remove(COOKIE_KEYS.USERNAME)
|
||||
}
|
||||
|
||||
export function getPasswordToken() {
|
||||
return Cookies.get(COOKIE_KEYS.PASSWORD)
|
||||
}
|
||||
|
||||
export function setPasswordToken(token) {
|
||||
return Cookies.set(COOKIE_KEYS.PASSWORD, token, DEFAULT_COOKIE_OPTIONS)
|
||||
}
|
||||
|
||||
export function removePasswordToken() {
|
||||
return Cookies.remove(COOKIE_KEYS.PASSWORD)
|
||||
}
|
||||
|
||||
export function getRememberMeToken() {
|
||||
return Cookies.get(COOKIE_KEYS.REMEMBER_ME)
|
||||
}
|
||||
|
||||
export function setRememberMeToken(token) {
|
||||
return Cookies.set(COOKIE_KEYS.REMEMBER_ME, token, DEFAULT_COOKIE_OPTIONS)
|
||||
}
|
||||
|
||||
export function removeRememberMeToken() {
|
||||
return Cookies.remove(COOKIE_KEYS.REMEMBER_ME)
|
||||
}
|
||||
|
||||
// 清空所有用户相关缓存
|
||||
export function clearAllUserData() {
|
||||
removeToken()
|
||||
removeUserTenantInfo()
|
||||
removeUserId()
|
||||
removeLoginToken()
|
||||
removeUsernameToken()
|
||||
removePasswordToken()
|
||||
removeRememberMeToken()
|
||||
}
|
||||
|
||||
// 获取所有用户信息
|
||||
export function getAllUserInfo() {
|
||||
return {
|
||||
token: getToken(),
|
||||
userTenantInfo: getUserTenantInfo(),
|
||||
userId: Cookies.get(COOKIE_KEYS.USER_ID),
|
||||
loginToken: getLoginToken(),
|
||||
username: getUsernameToken(),
|
||||
rememberMe: getRememberMeToken(),
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
getToken,
|
||||
setToken,
|
||||
removeToken,
|
||||
getUserTenantInfo,
|
||||
setUserTenantInfo,
|
||||
removeUserTenantInfo,
|
||||
setUserId,
|
||||
removeUserId,
|
||||
getLoginToken,
|
||||
setLoginToken,
|
||||
removeLoginToken,
|
||||
getUsernameToken,
|
||||
setUsernameToken,
|
||||
removeUsernameToken,
|
||||
getPasswordToken,
|
||||
setPasswordToken,
|
||||
removePasswordToken,
|
||||
getRememberMeToken,
|
||||
setRememberMeToken,
|
||||
removeRememberMeToken,
|
||||
clearAllUserData,
|
||||
getAllUserInfo,
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
/**
|
||||
* 根据屏幕宽度自适应计算字体大小（基于1920设计稿）
|
||||
* @param {number} res - 设计稿上的原始尺寸
|
||||
* @returns {number} 自适应后的尺寸
|
||||
*/
|
||||
export function fontSize(res) {
|
||||
let clientWidth =
|
||||
window.innerWidth ||
|
||||
document.documentElement.clientWidth ||
|
||||
document.body.clientWidth
|
||||
if (!clientWidth) return
|
||||
let fontSize = clientWidth / 1920
|
||||
return res * fontSize
|
||||
}
|
||||
|
||||
/**
|
||||
* 生成随机背景色
|
||||
* @param {String} type 'hex' | 'rgb' 输出格式，默认 hex
|
||||
* @returns {String} '#RRGGBB' 或 'rgb(r,g,b)'
|
||||
* @example randomBgColor()
|
||||
*/
|
||||
export function randomBgColor(type = 'hex') {
|
||||
if (type === 'rgb') {
|
||||
const r = Math.floor(Math.random() * 256)
|
||||
const g = Math.floor(Math.random() * 256)
|
||||
const b = Math.floor(Math.random() * 256)
|
||||
return `rgb(${r},${g},${b})`
|
||||
}
|
||||
// 默认 hex
|
||||
return (
|
||||
'#' +
|
||||
Math.floor(Math.random() * 0xffffff)
|
||||
.toString(16)
|
||||
.padStart(6, '0')
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,42 @@
|
||||
// rem等比适配配置
|
||||
// 基准大小
|
||||
const baseSize = 16
|
||||
// 设计稿宽度
|
||||
const designWidth = 1920
|
||||
// 最大缩放比例
|
||||
const maxScale = 2
|
||||
|
||||
// 设置 rem 函数
|
||||
function setRem() {
|
||||
// 当前页面宽度相对于设计稿宽度的缩放比例
|
||||
const scale = document.documentElement.clientWidth / designWidth
|
||||
// 设置页面根节点字体大小（最高放大比例为maxScale）
|
||||
document.documentElement.style.fontSize =
|
||||
baseSize * Math.min(scale, maxScale) + 'px'
|
||||
}
|
||||
|
||||
// 根据设计稿尺寸计算实际尺寸
|
||||
export function fontSize(res) {
|
||||
const clientWidth =
|
||||
window.innerWidth ||
|
||||
document.documentElement.clientWidth ||
|
||||
document.body.clientWidth
|
||||
if (!clientWidth) return res
|
||||
const scale = clientWidth / designWidth
|
||||
return res * Math.min(scale, maxScale)
|
||||
}
|
||||
|
||||
// 初始化rem配置
|
||||
export function initRem() {
|
||||
setRem()
|
||||
// 改变窗口大小时重新设置 rem
|
||||
window.addEventListener('resize', setRem)
|
||||
}
|
||||
|
||||
// 移除rem监听（可选，用于清理）
|
||||
export function removeRemListener() {
|
||||
window.removeEventListener('resize', setRem)
|
||||
}
|
||||
|
||||
// 自动初始化（如果需要在导入时自动初始化）
|
||||
// initRem()
|
||||
@@ -0,0 +1,134 @@
|
||||
/**
|
||||
* axios 封装
|
||||
*/
|
||||
import axios from 'axios'
|
||||
import {ElMessage, ElMessageBox} from 'element-plus'
|
||||
import {tansParams} from '@/utils/index'
|
||||
import {getToken, removeToken, removeUserTenantInfo} from '@/utils/auth'
|
||||
|
||||
// 配置基础URL
|
||||
const baseURL = window.config?.baseUrl || 'http://work.rangutech.cn:9131'
|
||||
|
||||
// 设置默认请求头
|
||||
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
|
||||
|
||||
// 创建axios实例
|
||||
const service = axios.create({
|
||||
baseURL,
|
||||
timeout: 10000, // 添加合理的超时时间
|
||||
})
|
||||
|
||||
// 请求拦截器
|
||||
service.interceptors.request.use(
|
||||
(config) => {
|
||||
// 是否需要设置 token
|
||||
const isToken = (config.headers || {}).isToken === false
|
||||
|
||||
// 添加token到请求头
|
||||
if (getToken() && !isToken) {
|
||||
config.headers.Authorization = `Bearer ${getToken()}`
|
||||
}
|
||||
|
||||
// GET请求参数处理
|
||||
if (config.method?.toLowerCase() === 'get' && config.params) {
|
||||
const urlParams = tansParams(config.params)
|
||||
config.url = `${config.url}?${urlParams}`
|
||||
config.params = {}
|
||||
}
|
||||
|
||||
return config
|
||||
},
|
||||
(error) => {
|
||||
console.error('Request error:', error)
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
|
||||
// 响应拦截器
|
||||
service.interceptors.response.use(
|
||||
(response) => {
|
||||
const {data, config} = response
|
||||
|
||||
// 处理二进制数据响应
|
||||
if (
|
||||
config.responseType === 'blob' ||
|
||||
config.responseType === 'arraybuffer'
|
||||
) {
|
||||
return data
|
||||
}
|
||||
|
||||
// 正常响应处理
|
||||
if (response.status === 200) {
|
||||
return data
|
||||
}
|
||||
|
||||
// 异常响应处理
|
||||
return Promise.reject(response)
|
||||
},
|
||||
(error) => {
|
||||
const {config, response, message} = error
|
||||
|
||||
console.error('Response error:', {config, response, message})
|
||||
|
||||
// 处理认证错误
|
||||
if (response && [401, 471, 472].includes(response.status)) {
|
||||
handleAuthError(config, response)
|
||||
return Promise.reject(error)
|
||||
}
|
||||
|
||||
// 处理网络错误
|
||||
handleNetworkError(message)
|
||||
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
|
||||
/**
|
||||
* 处理认证错误
|
||||
*/
|
||||
function handleAuthError(config, response) {
|
||||
const excludeUrls = ['/Token/Logout', '/Token/Access']
|
||||
|
||||
if (!excludeUrls.includes(config.url)) {
|
||||
ElMessageBox.confirm(
|
||||
'登录状态已过期，您可以继续留在该页面，或者重新登录',
|
||||
'系统提示',
|
||||
{
|
||||
confirmButtonText: '重新登录',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
removeToken()
|
||||
removeUserTenantInfo()
|
||||
// 这里需要导入store
|
||||
// store.dispatch('LogOut').then(() => {});
|
||||
window.location.reload() // 简单重载页面
|
||||
})
|
||||
.catch(() => {
|
||||
// 用户取消操作
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理网络错误
|
||||
*/
|
||||
function handleNetworkError(message) {
|
||||
let errorMsg = message
|
||||
|
||||
if (message === 'Network Error') {
|
||||
errorMsg = '网络连接异常，请检查网络设置'
|
||||
} else if (message.includes('timeout')) {
|
||||
errorMsg = '请求超时，请稍后重试'
|
||||
}
|
||||
|
||||
ElMessage({
|
||||
message: errorMsg,
|
||||
type: 'error',
|
||||
duration: 5 * 1000,
|
||||
})
|
||||
}
|
||||
|
||||
export default service
|
||||
Reference in New Issue
Block a user