metro-os-tools v0.0.195
主题样式使用
正常情况下组件类名
组件 | 类名 |
---|---|
el-button | class="os-button" |
el-checkbox | class="os-checkbox" |
el-select | class="os-select" popper-class="os-select--popper" |
el-time-picker | class="os-date-picker" popper-class="os-time--popper" |
el-date-picker | class="os-date-picker" popper-class="os-date--popper" |
el-dialog | class="os-dialog" |
el-form | class="os-form" |
el-input | class="os-input" |
el-list | class="os-list" |
el-pagination | class="os-pagination os-pagination--primary" |
el-radio | class="os-radio os-radio--primary" |
el-switch | class="os-switch" |
el-table | class="os-table os-table--primary" |
el-tabs | class="os-tabs" |
el-tag | class="os-tag" |
el-tree | class="os-tree" |
弹窗情况(dialog)组件类名
组件 | 类名 |
---|---|
el-input | class="os-input os-input--info" |
el-pagination | class="os-pagination os-pagination--info" |
el-radio | class="os-radio os-radio--info" |
el-radio | class="os-radio os-radio--info" |
el-select | class="os-select os-select--info" popper-class="os-select--popper" |
el-table | class="os-table os-table--info" |
项目中接口请求使用
引入metro-os-tools的createAxios方法
createAxios
方法只是对请求头添加了一个token
参数,并没有进行其他操作,在创建完createAxios
后生成{_axios, signals}
两个对象,其中_axios
可用来再次封装,包括请求头、响应体的封装,signals
是来做请求拦截的,需要配合工具包提供removeAbortSignals
方法
项目中使用metro-os-tools的createAxios方法 实例
// axios.ts 文件
'use strict';
import {
MError, createAxios, removeAbortSignals, clearLocalStorage,
clearSessionStorage,
} from 'metro-os-tools';
export default function (
baseURL: string,
abort: boolean = false,
obj?: any,
) {
const { signals, _axios } = createAxios(baseURL, abort, obj);
_axios.interceptors.response.use(
function (response) {
if (response && response.config) {
abort && removeAbortSignals(response.config, signals);
}
if (response.data?.result?.resultCode === '0') {
return Promise.resolve(response.data);
} else if (response.data?.result?.resultCode === '3') {
MError({
message:
response.data.result.resultError || 'Token失效,请重新登录!',
});
clearSessionStorage('windowStoreTask');
clearLocalStorage('token');
return Promise.reject(response.data);
} else if (response.status === 200) {
return Promise.resolve(response.data);
}
return Promise.reject(response.data);
},
function (error) {
if (error) {
return Promise.reject('request canceled!');
}
const status = error.response?.status;
if (status) {
return Promise.reject(error);
} else {
return Promise.reject({
result: { resultCode: '-1', resultError: '请求异常' },
});
}
},
);
return { signals, _axios };
};
// api.ts 文件 =========================
import { IResponse } from '@/types/lineType';
import createAxios from '@/utils/axios';
const { _axios } = createAxios('/mos/mos-bizcenter-server/');
// 查看所有文件目录
export const getFolderListApi = async () => {
return await _axios.get('/folder/list');
};
// 新建文件目录
export const createFolderApi = async (data: createFolderParams) => {
return await _axios.post('/folder/create', data);
};
// 删除文件夹
export const removeFolderApi = async (folderId: string) => {
return await _axios.delete(`/folder/${folderId}`);
};
// 获取PA数据
export function vehiclePadataQuery() {
return _axios({
method: 'POST',
url: Url.vehiclePadataQuery,
data: {}
})
}
工具包的本地存储方法
工具包封装了localStorage和sessionStorage两种本地数据存储方法,对这两种本地数据做了数据隔离功能,根据存储传入的不同应用code进行隔离
import {
setLocalStorage,
getLocalStorage,
clearLocalStorage,
setSessionStorage,
getSessionStorage,
clearSessionStorage,
} from 'metro-os-tools';
11 days ago
14 days ago
22 days ago
22 days ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
5 months ago
6 months ago
6 months ago
6 months ago
5 months ago
5 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago