vue3＋js示例

1，api接口调用示例

import request from '@/axios';export const getList = (current, size, params) =>request({url: '/blade-sample/sample/covid19/list',method: 'get',params: {...params,current,size,},});export const remove = ids =>request({url: '/blade-sample/sample/covid19/remove',method: 'post',params: {ids,},});export const add = row =>request({url: '/blade-sample/sample/covid19/save',method: 'post',data: row,});export const update = row =>request({url: '/blade-sample/sample/covid19/update',method: 'post',data: row,});

2，option实体类示例

import { getLazyTree } from '@/api/base/region';
import { validatePersonId, validatePersonName } from '@/utils/validatebusiness';export default {indexWidth: 80,gridBtn: false,height: 'auto',calcHeight: 55,menuWidth: 280,searchLabelWidth: 150,searchShow: true,searchMenuSpan: 8,index: true,selection: true,viewBtn: true,addBtnText: '单条录入',searchShowBtn: false,labelWidth: 180,dialogDirection: 'ltr',dialogType: 'drawer',addTitle: '录入样本信息',editTitle: '编辑样本信息',viewTitle: '样本信息详情',searchSpan: 7,searchIndex: 5,searchIcon: true,columnBtn: false,emptyText: '暂无样本信息数据',headerAlign: 'center',align: 'center',dialogClickModal: false,column: [{label: '统一样本编号',prop: 'sampleNo',type: 'input',order: 43,width: 220,overHidden: true,addDisplay: false,editDisplay: false,fixed: true,sortable: true,hide: false,},{label: '病例的传染病报告ID',prop: 'reportId',type: 'input',order: 38,overHidden: true,editDisabled: true,rules: [{required: true,message: '请输入病例的传染病报告ID',trigger: 'change',},],// fixed: true,width: 180,maxlength: 64,hide: false,},{label: '报送编码',prop: 'reportNo',type: 'input',order: 39,editDisabled: true,rules: [{required: true,message: '请输入报告编码',trigger: 'change',},],width: 150,overHidden: true,maxlength: 64,},{label: '报送地区',prop: 'fromArea',checkStrictly: true,search: true,formslot: true,type: 'cascader',order: 40,searchOrder: 21,formatter: val => {return val.fromAreaName;},lazy: true,lazyLoad: (node, resolve) => {const parentCode = node.level === 0 ? '00' : node.data.id;getLazyTree(parentCode).then(res => {resolve(res.data.data.map(item => {if (node.level === 0) {if (item.key == '71' || item.key == '81' || item.key == '82') {item.disabled = true;}}return {...item,leaf: !item.hasChildren,};}));});},props: {label: 'title',value: 'value',children: 'children',},rules: [{required: true,message: '请选择报送地区',trigger: 'change',},],width: 200,overHidden: true,},{label: '病例类型',prop: 'caseType',type: 'radio',order: 37,searchOrder: 22,editDisabled: true,search: true,dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_case_type',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},rules: [{required: true,message: '请选择病例类型',trigger: 'change',},],width: 100,hide: true,control: (val, form) => {if (val == 0) {form.infectSourceArea = '';form.infectSourceCountry = '';return {infectSourceArea: {display: false,},infectSourceCountry: {display: false,},};} else if (val == 1) {form.infectSourceArea = '';form.infectSourceCountry = '';return {infectSourceArea: {display: true,},infectSourceCountry: {display: false,},};} else if (val == 2) {form.infectSourceArea = '';form.infectSourceCountry = '';return {infectSourceCountry: {display: true,},infectSourceArea: {display: false,},};}else {form.infectSourceArea = '';form.infectSourceCountry = '';return {infectSourceCountry: {display: false,},infectSourceArea: {display: false,},};}},},{label: '感染来源地区',prop: 'infectSourceArea',checkStrictly: true,search: true,formslot: true,type: 'cascader',order: 36,searchOrder: 19,formatter: val => {return val.fromAreaName;},lazy: true,lazyLoad: (node, resolve) => {const parentCode = node.level === 0 ? '00' : node.data.id;getLazyTree(parentCode).then(res => {resolve(res.data.data.map(item => {if (node.level === 0) {if (item.key == '71' || item.key == '81' || item.key == '82') {item.disabled = true;}}return {...item,leaf: !item.hasChildren,};}));});},props: {label: 'title',value: 'value',children: 'children',},rules: [{required: true,message: '请选择感染来源地区',trigger: 'change',},],width: 200,overHidden: true,},{label: '感染来源国家',prop: 'infectSourceCountry',type: 'tree',order: 35,dicUrl: '/api/blade-sample/globalCountry/listAll',dataType: 'number',props: {label: 'name',value: 'code',},width: 120,formslot: true,overHidden: true,checkStrictly: true,display: false,rules: [{required: true,message: '请选择感染来源国家',trigger: 'change',},],},{label: '姓名',prop: 'personName',type: 'input',order: 33,rules: [{ required: true, validator: validatePersonName, trigger: 'change' }],width: 100,overHidden: true,maxlength: 64,},{label: '性别',prop: 'personSex',type: 'radio',order: 32,dicUrl: '/api/blade-system/dict-biz/dictionary?code=sex',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},rules: [{required: true,message: '请选择性别',trigger: 'change',},],width: 100,overHidden: true,},{label: '年龄',order: 31,prop: 'personAge',type: 'number',precision: 2,min: 0,max: 150,rules: [{required: true,message: '请输入年龄',trigger: 'change',},],// rules: [{ required: true, validator: validatePersonAge, trigger: 'change' }],width: 100,overHidden: true,},{label: '身份证号/护照',prop: 'personId',type: 'input',order: 30,width: 100,hide: true,showColumn: false,maxlength: 64,rules: [{ validator: validatePersonId, trigger: 'blur' }],},{label: '现住址',prop: 'addressArea',checkStrictly: true,search: true,formslot: true,type: 'cascader',order: 29,searchOrder: 18,formatter: val => {return val.fromAreaName;},lazy: true,lazyLoad: (node, resolve) => {const parentCode = node.level === 0 ? '00' : node.data.id;getLazyTree(parentCode).then(res => {resolve(res.data.data.map(item => {if (node.level === 0) {if (item.key == '71' || item.key == '81' || item.key == '82') {item.disabled = true;}}return {...item,leaf: !item.hasChildren,};}));});},props: {label: 'title',value: 'value',children: 'children',},rules: [{required: true,message: '请选择现住址',trigger: 'change',},],width: 200,overHidden: true,},{label: '采样日期',prop: 'sampleDate',type: 'date',order: 28,format: 'YYYY-MM-DD',valueFormat: 'YYYY-MM-DD',search: true,searchRange: true,searchOrder: 17,rules: [{required: true,message: '请选择采样日期',trigger: 'change',},],width: 100,overHidden: true,pickerOptions: {disabledDate(time) {return time.getTime() > Date.now();},},},{label: '发病日期',order: 27,prop: 'attackDate',type: 'date',format: 'YYYY-MM-DD',valueFormat: 'YYYY-MM-DD',rules: [{required: true,message: '请选择发病日期',trigger: 'change',},],pickerOptions: {disabledDate(time) {return time.getTime() > Date.now();},},searchRange: true,hide: true,showColumn: false,overHidden: true,},{label: '临床严重程度',prop: 'clinicalSeverity',type: 'select',search: true,order: 22,searchOrder: 15,dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_clinical_severity',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},rules: [{required: true,message: '请选择临床严重程度',trigger: 'change',},],width: 120,overHidden: true,},{label: '病例来源',order: 34,prop: 'caseSource',type: 'select',dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_case_source',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},width: 100,rules: [{required: true,message: '请选择病例来源',trigger: 'change',},],overHidden: true,},{label: '标本类型',order: 26,prop: 'specimenType',type: 'select',dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_specimen_type',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},width: 100,rules: [{required: true,message: '请选择标本类型',trigger: 'change',},],overHidden: true,control: (val, form) => {if (val == 1) {return {specimenOther: {display: true,},};} else {form.specimenOther = '';return {specimenOther: {display: false,},};}},},{label: '其他标本类型填写',prop: 'specimenOther',type: 'input',order: 25,rules: [{ required: true, validator: validatePersonName, trigger: 'change' }],width: 100,overHidden: true,maxlength: 64,hide: true,},{label: '血清型',prop: 'serologicType',type: 'select',order: 24,props: {label: 'dictValue',value: 'dictKey',},cascader: ['genetype'],dicUrl: `/api/blade-system/dict-biz/dictionary?code=denv_serologic_type`,rules: [{required: true,message: '请选择血清型',trigger: 'blur',},],},{label: '基因型',prop: 'genetype',type: 'select',order: 23,props: {label: 'dictValue',value: 'dictKey',},dicUrl: `/api/blade-system/dict-biz/dictionary?code=DENV-{{key}}`,rules: [{required: false,message: '请选择基因型',trigger: 'blur',},],hide: true,},{label: 'CT值',order: 19,prop: 'ct',type: 'number',precision: 2,min: 0,max: 50,rules: [{required: true,message: '请输入CT值',trigger: 'change',},],hide: true,showColumn: false,},{label: '测序技术',prop: 'seqType',order: 21,type: 'select',dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_seq_type',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},rules: [{required: true,message: '请选择测序技术',trigger: 'change',},],width: 100,hide: true,showColumn: false,},{label: '测序仪型号',prop: 'seqModel',type: 'input',order: 20,maxlength: 64,rules: [{required: true,message: '请输入测序仪型号',trigger: 'change',},],hide: true,showColumn: false,},{label: '是否有下机数据',prop: 'isMachine',type: 'select',order: 18,dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_is_machine',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},rules: [{required: true,message: '请选择是否有下机数据',trigger: 'change',},],hide: true,showColumn: false,},{label: '拼接序列是否上传',prop: 'seqNum',type: 'select',display: false,search: true,width: 150,searchOrder: 11,dicUrl: '/api/blade-system/dict-biz/dictionary?code=seq_info',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},},{label: '是否疑似重复',prop: 'isRepeat',type: 'select',order: 12,search: true,addDisplay: false,editDisplay: false,hide: true,showColumn: false,dicUrl: '/api/blade-system/dict-biz/dictionary?code = denv_is_repeat',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},searchOrder: 2,},{label: '是否参与统计',prop: 'isCount',type: 'select',display: false,hide: true,showColumn: false,dicUrl: '/api/blade-system/dict-biz/dictionary?code=is_count',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},},{label: '序列有效',prop: 'isValid',type: 'select',display: false,search: false,dicUrl: '/api/blade-system/dict-biz/dictionary?code = denv_is_valid',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},searchOrder: 11,width: 100,hide: true,showColumn: false,},{label: '无效原因',prop: 'invalidReason',type: 'input',display: false,hide: true,showColumn: false,},{label: '创建人',prop: 'createUserInfo',type: 'input',order: 11,addDisplay: false,editDisplay: false,hide: true,showColumn: false,},{label: '创建时间',order: 10,prop: 'createTime',type: 'date',format: 'YYYY-MM-DD',valueFormat: 'YYYY-MM-DD',addDisplay: false,editDisplay: false,hide: true,showColumn: false,},{label: '最后修改人',prop: 'updateUserInfo',order: 9,type: 'input',addDisplay: false,editDisplay: false,hide: true,showColumn: false,},{label: '最后修改时间',prop: 'updateTime',order: 8,searchOrder: 13,addDisplay: false,editDisplay: false,width: 150,search: true,searchRange: true,overHidden: true,type: 'datetime',format: 'YYYY-MM-DD HH:mm:ss',valueFormat: 'YYYY-MM-DD HH:mm:ss',pickerOptions: {disabledDate(data) {let curDate = new Date().getTime();let six = 270 * 24 * 3600 * 1000;let sixMonths = curDate - six;return data.getTime() > Date.now() || data.getTime() < sixMonths;},},},{label: '是否已删除',prop: 'isDeleted',type: 'input',display: false,hide: true,},{label: '删除人',prop: 'deleteUserInfo',order: 9,type: 'input',addDisplay: false,editDisplay: false,hide: true,showColumn: false,},{label: '删除日期',prop: 'deleteTime',type: 'date',format: 'YYYY-MM-DD',valueFormat: 'YYYY-MM-DD',display: false,hide: true,showColumn: false,pickerOptions: {disabledDate(time) {return time.getTime() > Date.now();},},},{label: '报送日期',order: 10,searchOrder: 19,prop: 'reportTime',type: 'date',format: 'YYYY-MM-DD',valueFormat: 'YYYY-MM-DD',addDisplay: false,editDisplay: false,search: true,searchRange: true,hide: true,showColumn: false,width: 100,overHidden: true,pickerOptions: {disabledDate(time) {return time.getTime() > Date.now();},},},{label: '原始序列是否需要',prop: 'requireOrigin',type: 'select',display: false,hide: true,showColumn: false,search: false,searchOrder: 2,order: 3,dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_require_origin',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},},{label: '是否需要报送序列',prop: 'isFasta',type: 'select',hide: true,showColumn: false,search: true,searchOrder: 2,order: 17,dicUrl: '/api/blade-system/dict-biz/dictionary?code=denv_is_fasta',dataType: 'number',props: {label: 'dictValue',value: 'dictKey',},rules: [{required: true,message: '请选择是否上传序列',trigger: 'change',},],},{label: '分析结果',prop: 'uploadResult',type: 'input',addDisplay: false,editDisplay: false,overHidden: true,},{label: '备注',prop: 'remark',type: 'input',maxlength: 256,hide: true,},{label: '关键字',prop: 'keyword',type: 'input',display: false,search: true,searchOrder: 20,hide: true,showColumn: false,},],
};

3，页面代码

<template><basic-container><avue-crud:option="option":table-loading="loading":data="data"v-model:page="page":permission="permissionList"v-model="form"ref="crud"@row-update="rowUpdate"@row-save="rowSave"@row-del="rowDel"@search-change="searchChange"@search-reset="searchReset"@selection-change="selectionChange"@current-change="currentChange"@size-change="sizeChange"@refresh-change="refreshChange"@on-load="onLoad"><template #menu-left><el-button type="danger" :icon="Delete" plain @click="handleDelete">批量删除</el-button><el-button icon="Flag" v-if="permission.denv_mark" @click="showTagDialog" plain>标记样本</el-button><el-button icon="el-icon-delete" v-if="permission.denv_recycle_show" @click="showTagDialog" plain>回收站</el-button></template></avue-crud></basic-container>
</template><script setup>
import { ref, reactive, computed, onMounted } from 'vue';
import { mapGetters, useStore } from 'vuex';
import { getList, add, update, remove } from '@/api/business/arbovirus/denv';
import { ElMessage, ElMessageBox } from 'element-plus';
import optionData from '@/option/business/arbovirus/optionDenv';
import { Delete, Upload } from '@element-plus/icons-vue';const store = useStore();
const form = ref({});
const query = ref({});
const loading = ref(true);
const option = reactive(optionData);const page = reactive({pageSize: 10,currentPage: 1,total: 0,
});const selectionList = ref([]);
const crud = ref(null);
const data = ref([]);const userInfo = computed(() => store.getters.userInfo);
const permission = computed(() => store.getters.permission);const permissionList = computed(() => ({addBtn: validData(permission.value.denv_add, false),viewBtn: validData(permission.value.denv_view, false),delBtn: validData(permission.value.denv_delete, false),editBtn: validData(permission.value.denv_edit, false),
}));const findObject = (arr, prop) => {return arr.find(item => item.prop === prop);
};const validData = (value, defaultValue) => {return value !== undefined ? value : defaultValue;
};onMounted(() => {const repeatColumn = findObject(option.column, 'isRepeat');if (userInfo.value.role_name.includes('administrator') || permission.value.denv_query_isRepeat) {repeatColumn.search = true;}const validColumn = findObject(option.column, 'isValid');if (userInfo.value.role_name.includes('administrator') || permission.value.denv_query_isValid) {validColumn.search = true;}
});const rowSave = (row, done, loading) => {add(row).then(() => {onLoad(page);ElMessage.success('操作成功!');done();}).catch(error => {console.error(error);loading();});
};const rowUpdate = (row, index, done, loading) => {update(row).then(() => {onLoad(page);ElMessage.success('操作成功!');done();}).catch(error => {console.error(error);loading();});
};const rowDel = row => {ElMessageBox.confirm('确定将选择数据删除?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',}).then(() => {return remove(row.id);}).then(() => {onLoad(page);ElMessage.success('操作成功!');});
};const handleDelete = () => {if (selectionList.value.length === 0) {ElMessage.warning('请选择至少一条数据');return;}ElMessageBox.confirm('确定将选择数据删除?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',}).then(() => {return remove(ids.value);}).then(() => {onLoad(page);ElMessage.success('操作成功!');crud.value.toggleSelection();});
};const searchReset = () => {query.value = {};onLoad(page);
};const searchChange = (params, done) => {query.value = params;page.currentPage = 1;if (query.value.reportTime) {query.value['reportTimeStart'] = query.value.reportTime[0];query.value['reportTimeEnd'] = query.value.reportTime[1];delete query.value.reportTime;}if (query.value.deleteTime) {query.value['deleteTimeStart'] = query.value.deleteTime[0];query.value['deleteTimeEnd'] = query.value.deleteTime[1];delete query.value.deleteTime;}if (query.value.sampleDate) {query.value['sampleDateStart'] = query.value.sampleDate[0];query.value['sampleDateEnd'] = query.value.sampleDate[1];delete query.value.sampleDate;}if (query.value.updateTime) {query.value['updateTimeStart'] = query.value.updateTime[0];query.value['updateTimeEnd'] = query.value.updateTime[1];delete query.value.updateTime;}onLoad(page, params);done();
};const selectionChange = list => {selectionList.value = list;
};const selectionClear = () => {selectionList.value = [];crud.value.toggleSelection();
};const currentChange = currentPage => {page.currentPage = currentPage;
};const sizeChange = pageSize => {page.pageSize = pageSize;
};const refreshChange = () => {onLoad(page, query.value);
};const onLoad = (page, params = {}) => {loading.value = true;getList(page.currentPage, page.pageSize, { ...params, ...query.value }).then(res => {const response = res.data;page.total = response.data.total;data.value = response.data.records;loading.value = false;selectionClear();});
};const ids = computed(() => selectionList.value.map(ele => ele.id).join(','));
</script><style scoped></style>

4，工具类接口

import request from '@/axios';export const getList = (current, size, params) => {return request({url: '/blade-system/region/list',method: 'get',params: {...params,current,size,},});
};export const getLazyTree = (parentCode, params) => {return request({url: '/blade-system/region/lazy-tree',method: 'get',params: {...params,parentCode,},});
};// export const getRegionLazyTree = parentId => {
//   return request({
//     url: '/blade-system/region/lazy-tree',
//     method: 'get',
//     params: {
//       parentId,
//     },
//   });
// };export const getDetail = code => {return request({url: '/blade-system/region/detail',method: 'get',params: {code,},});
};export const remove = id => {return request({url: '/blade-system/region/remove',method: 'post',params: {id,},});
};export const submit = row => {return request({url: '/blade-system/region/submit',method: 'post',data: row,});
};

export const validatePersonPhone = (rule, value, callback) => {if (value && value.toString().trim() !== "") {if (isMobile(value)) {callback();} else {callback(new Error('请输入正确格式的手机号'));}} else {callback();}
};export const validatePersonNumber = (rule, value, callback) => {if (value && value.toString().trim() !== "") {if (isNumber(value)) {callback();} else {callback(new Error('请输入正确格式'));}} else {callback();}
};export const validatePersonId = (rule, value, callback) => {if (value && value.toString().trim() !== "") {if (value.length === 18 || value.length === 15) {if (cardid(value)) {callback();}} else if (9 === value.length) {if(huzhao(value)){callback();}} else {callback(new Error('请输入正确格式的身份证/护照号'));}} else {callback();}
};export const validatePersonAge = (rule, value, callback) => {if(value === ''){callback(new Error('请输入年龄'));}else {callback();}
};export const validatePersonName = (rule, value, callback) => {if (value && value.toString().trim() !== "") {if (validatename(value)) {callback();} else {callback(new Error('请输入正确格式的姓名'));}} else {callback(new Error('请输入姓名'));}
};export const validateMail = (rule, value, callback) => {if (value && value.trim() !== "") {if (isMail(value)) {callback();} else {callback(new Error('请输入正确格式的邮箱'));}} else {callback(new Error('请输入邮箱，用于找回密码'));}
};// export const validateFromArea = (rule, value, callback) => {
//   console.log(value)
//   if (value !== '') {
//     callback();
//   } else {
//     callback(new Error('请选择来源地区'));
//   }
// };/*** 判断姓名是否正确*/
function validatename(name) {var regName = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~！@#￥……&*（）——|{}【】‘；：”“'。，、？]")if (regName.test(name)) return false;return true;
}/*** 手机号码* @param {*} s*/
function isMobile(s) {return /^1[0-9]{10}$/.test(s);
}/*** 判断是否数字* @param {*} s*/
function isNumber(s) {return /^-?[0-9]+(\.[0-9]+)?$/.test(s);
}function cardid(code) {let regs = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;return regs.test(code);
}function huzhao(code){let reg=/(^[EeKkGgDdSsPpHh]\d{8}$)|(^(([Ee][a-fA-F])|([DdSsPp][Ee])|([Kk][Jj])|([Mm][Aa])|(1[45]))\d{7}$)/;  //护照（包括香港和澳门）return reg.test(code);
}function isMail(s){return /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(s)
}

/*** 全站http配置** axios参数说明* isSerialize是否开启form表单提交* isToken是否需要token*/
import axios from 'axios';
import store from '@/store/';
import router from '@/router/';
import { serialize } from 'utils/util';
import { getToken } from 'utils/auth';
import { isURL } from 'utils/validate';
import { ElMessage } from 'element-plus';
import website from '@/config/website';
// import NProgress from 'nprogress'; // progress bar
// import 'nprogress/nprogress.css'; // progress bar style
import { Base64 } from 'js-base64';
import { baseUrl } from '@/config/env';
import crypto from '@/utils/crypto';axios.defaults.timeout = 10000;
//返回其他状态吗
axios.defaults.validateStatus = function (status) {return status >= 200 && status <= 500; // 默认的
};
//跨域请求，允许保存cookie
axios.defaults.withCredentials = true;
// NProgress Configuration
// NProgress.configure({
//   showSpinner: false,
// });
//HTTPrequest拦截
axios.interceptors.request.use(config => {// start progress bar// NProgress.start();//地址为已经配置状态则不添加前缀if (!isURL(config.url) && !config.url.startsWith(baseUrl)) {config.url = baseUrl + config.url;}//安全请求headerconfig.headers['Blade-Requested-With'] = 'BladeHttpRequest';//headers判断是否需要const authorization = config.authorization === false;if (!authorization) {config.headers['Authorization'] = `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`;}//headers判断请求是否携带tokenconst meta = config.meta || {};const isToken = meta.isToken === false;//headers传递token是否加密const cryptoToken = config.cryptoToken === true;//判断传递数据是否加密const cryptoData = config.cryptoData === true;const token = getToken();if (token && !isToken) {config.headers[website.tokenHeader] = cryptoToken? 'crypto ' + crypto.encryptAES(token, crypto.cryptoKey): 'bearer ' + token;}// 开启报文加密if (cryptoData) {if (config.params) {const data = crypto.encryptAES(JSON.stringify(config.params), crypto.aesKey);config.params = { data };}if (config.data) {config.text = true;config.data = crypto.encryptAES(JSON.stringify(config.data), crypto.aesKey);}}//headers中配置text请求if (config.text === true) {config.headers['Content-Type'] = 'text/plain';}//headers中配置serialize为true开启序列化if (config.method === 'post' && meta.isSerialize === true) {config.data = serialize(config.data);}return config;},error => {return Promise.reject(error);}
);
//HTTPresponse拦截
axios.interceptors.response.use(res => {if (res.data) {if (res.data instanceof Blob &&res.data.type === 'application/json') {let reader = new FileReader()reader.readAsText(res.data, 'utf-8')reader.onload = function(e) {let data = JSON.parse(e.target.result)if (data.code !== 0) {ElMessage({message: data.msg,type: 'error',});}}return Promise.reject(res)}}// NProgress.done();const status = res.data.code || res.status;const statusWhiteList = website.statusWhiteList || [];const message = res.data.msg || res.data.error_description || '系统错误';const config = res.config;const cryptoData = config.cryptoData === true;//如果在白名单里则自行catch逻辑处理if (statusWhiteList.includes(status)) return Promise.reject(res);//如果是401则跳转到登录页面if (status === 401) store.dispatch('FedLogOut').then(() => router.push({ path: '/login' }));// 如果请求为非200否者默认统一处理if (status !== 200) {ElMessage({message: message,type: 'error',});return Promise.reject(new Error(message));}// 解析加密报文if (cryptoData) {res.data = JSON.parse(crypto.decryptAES(res.data, crypto.aesKey));}return res;},error => {// NProgress.done();return Promise.reject(new Error(error));}
);export default axios;