lisang
/
vue3-element-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: API请求路径优化 

Former-commit-id: c17689117a
This commit is contained in:
郝先瑞 2022-06-28 23:49:38 +08:00
parent 2c7267b655
commit e650ce1897
10 changed files with 156 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/api/system/menu.ts
View File

@ -1,7 +1,7 @@
import {
MenuFormData,
MenuItem,
MenuQueryParam,
MenuQueryParam
} from '@/types/api/system/menu';
import { Option } from '@/types/common';
import request from '@/utils/request';
@ -12,8 +12,8 @@ import { AxiosPromise } from 'axios';
*/
export function listRoutes() {
return request({
url: '/youlai-admin/api/v1/menus/route_list',
method: 'get',
url: '/youlai-admin/api/v1/menus/routes',
method: 'get'
});
}
@ -28,17 +28,17 @@ export function listMenus(
return request({
url: '/youlai-admin/api/v1/menus',
method: 'get',
params: queryParams,
params: queryParams
});
}
/**
* 获取菜单下拉树形列表
*/
export function listSelectMenus(): AxiosPromise<Option[]> {
export function listMenuOptions(): AxiosPromise<Option[]> {
return request({
url: '/youlai-admin/api/v1/menus/select_list',
method: 'get',
url: '/youlai-admin/api/v1/menus/options',
method: 'get'
});
}
@ -48,7 +48,7 @@ export function listSelectMenus(): AxiosPromise<Option[]> {
export function getResource(): AxiosPromise<any> {
return request({
url: '/youlai-admin/api/v1/menus/resources',
method: 'get',
method: 'get'
});
}
@ -59,7 +59,7 @@ export function getResource(): AxiosPromise<any> {
export function getMenuDetail(id: number): AxiosPromise<MenuFormData> {
return request({
url: '/youlai-admin/api/v1/menus/' + id,
method: 'get',
method: 'get'
});
}
@ -72,7 +72,7 @@ export function addMenu(data: MenuFormData) {
return request({
url: '/youlai-admin/api/v1/menus',
method: 'post',
data: data,
data: data
});
}
@ -86,7 +86,7 @@ export function updateMenu(id: string, data: MenuFormData) {
return request({
url: '/youlai-admin/api/v1/menus/' + id,
method: 'put',
data: data,
data: data
});
}
@ -98,6 +98,6 @@ export function updateMenu(id: string, data: MenuFormData) {
export function deleteMenus(ids: string) {
return request({
url: '/youlai-admin/api/v1/menus/' + ids,
method: 'delete',
method: 'delete'
});
}

24
src/api/system/role.ts
View File

@ -2,7 +2,7 @@ import {
RoleFormData,
RolePageResult,
RoleQueryParam,
RoleResourceData,
RoleResourceData
} from '@/types/api/system/role';
import { Option } from '@/types/common';
@ -14,13 +14,13 @@ import { AxiosPromise } from 'axios';
*
* @param queryParams
*/
export function listPageRoles(
export function listRolePages(
queryParams?: RoleQueryParam
): AxiosPromise<RolePageResult> {
return request({
url: '/youlai-admin/api/v1/roles',
method: 'get',
params: queryParams,
params: queryParams
});
}
@ -29,13 +29,13 @@ export function listPageRoles(
*
* @param queryParams
*/
export function listSelectRoles(
export function listRoleOptions(
queryParams?: RoleQueryParam
): AxiosPromise<Option[]> {
return request({
url: '/youlai-admin/api/v1/roles/select_list',
url: '/youlai-admin/api/v1/roles/options',
method: 'get',
params: queryParams,
params: queryParams
});
}
@ -47,7 +47,7 @@ export function listSelectRoles(
export function getRoleResourceIds(roleId: string): AxiosPromise<any> {
return request({
url: '/youlai-admin/api/v1/roles/' + roleId + '/resource_ids',
method: 'get',
method: 'get'
});
}
@ -63,7 +63,7 @@ export function updateRoleResource(
return request({
url: '/youlai-admin/api/v1/roles/' + roleId + '/resources',
method: 'put',
data: data,
data: data
});
}
@ -75,7 +75,7 @@ export function updateRoleResource(
export function getRoleFormDetail(id: number): AxiosPromise<RoleFormData> {
return request({
url: '/youlai-admin/api/v1/roles/' + id,
method: 'get',
method: 'get'
});
}
@ -88,7 +88,7 @@ export function addRole(data: RoleFormData) {
return request({
url: '/youlai-admin/api/v1/roles',
method: 'post',
data: data,
data: data
});
}
@ -102,7 +102,7 @@ export function updateRole(id: number, data: RoleFormData) {
return request({
url: '/youlai-admin/api/v1/roles/' + id,
method: 'put',
data: data,
data: data
});
}
@ -114,6 +114,6 @@ export function updateRole(id: number, data: RoleFormData) {
export function deleteRoles(ids: string) {
return request({
url: '/youlai-admin/api/v1/roles/' + ids,
method: 'delete',
method: 'delete'
});
}

28
src/api/system/user.ts
View File

@ -4,7 +4,7 @@ import {
UserFormData,
UserInfo,
UserPageResult,
UserQueryParam,
UserQueryParam
} from '@/types/api/system/user';
/**
@ -13,7 +13,7 @@ import {
export function getUserInfo(): AxiosPromise<UserInfo> {
return request({
url: '/youlai-admin/api/v1/users/me',
method: 'get',
method: 'get'
});
}
@ -22,13 +22,13 @@ export function getUserInfo(): AxiosPromise<UserInfo> {
*
* @param queryParams
*/
export function listUsersPage(
export function listUserPages(
queryParams: UserQueryParam
): AxiosPromise<UserPageResult> {
return request({
url: '/youlai-admin/api/v1/users',
url: '/youlai-admin/api/v1/users/pages',
method: 'get',
params: queryParams,
params: queryParams
});
}
@ -40,7 +40,7 @@ export function listUsersPage(
export function getUserFormData(userId: number): AxiosPromise<UserFormData> {
return request({
url: '/youlai-admin/api/v1/users/' + userId + '/form_data',
method: 'get',
method: 'get'
});
}
@ -53,7 +53,7 @@ export function addUser(data: any) {
return request({
url: '/youlai-admin/api/v1/users',
method: 'post',
data: data,
data: data
});
}
@ -67,7 +67,7 @@ export function updateUser(id: number, data: UserFormData) {
return request({
url: '/youlai-admin/api/v1/users/' + id,
method: 'put',
data: data,
data: data
});
}
@ -81,7 +81,7 @@ export function updateUserPart(id: number, data: any) {
return request({
url: '/youlai-admin/api/v1/users/' + id,
method: 'patch',
data: data,
data: data
});
}
@ -93,7 +93,7 @@ export function updateUserPart(id: number, data: any) {
export function deleteUsers(ids: string) {
return request({
url: '/youlai-admin/api/v1/users/' + ids,
method: 'delete',
method: 'delete'
});
}
@ -106,7 +106,7 @@ export function downloadTemplate() {
return request({
url: '/youlai-admin/api/v1/users/template',
method: 'get',
responseType: 'arraybuffer',
responseType: 'arraybuffer'
});
}
@ -121,7 +121,7 @@ export function exportUser(queryParams: UserQueryParam) {
url: '/youlai-admin/api/v1/users/_export',
method: 'get',
params: queryParams,
responseType: 'arraybuffer',
responseType: 'arraybuffer'
});
}
@ -140,7 +140,7 @@ export function importUser(deptId: number, roleIds: string, file: File) {
method: 'post',
data: formData,
headers: {
'Content-Type': 'multipart/form-data',
},
'Content-Type': 'multipart/form-data'
}
});
}

5
src/components/RightPanel/index.vue
View File

@ -117,7 +117,8 @@ onBeforeUnmount(() => {
transition: all 0.25s cubic-bezier(0.7, 0.3, 0.1, 1);
transform: translate(100%);
background: #fff;
z-index: 40000;
z-index: 199;
.icon {
width: 1em;
height: 1em;
@ -129,7 +130,7 @@ onBeforeUnmount(() => {
transition: all 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);
.right-panel-background {
z-index: 20000;
z-index: 99;
opacity: 1;
width: 100%;
height: 100%;

48
src/layout/components/Settings/index.vue
View File

@ -26,20 +26,20 @@
<el-divider>导航栏模式</el-divider>
<ul class="navbar">
<el-tooltip class="item" content="左侧模式" placement="bottom">
<li>
<el-tooltip content="左侧模式" placement="bottom">
<li class="navbar__item navbar__item--left">
<div />
<div />
</li>
</el-tooltip>
<el-tooltip class="item" content="左侧模式" placement="bottom">
<li>
<el-tooltip content="顶部模式" placement="bottom">
<li class="navbar__item navbar__item--top">
<div />
<div />
</li>
</el-tooltip>
<el-tooltip class="item" content="左侧模式" placement="bottom">
<li>
<el-tooltip content="混合模式" placement="bottom">
<li class="navbar__item navbar__item--mix">
<div />
<div />
</li>
@ -132,7 +132,7 @@ watch(
height: 50px;
padding: 0;
li {
&__item {
width: 18%;
height: 45px;
background: #f0f2f5;
@ -142,7 +142,7 @@ watch(
border-radius: 4px;
box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 18%);
&:nth-child(1) {
&--left {
div {
&:nth-child(1) {
width: 30%;
@ -161,6 +161,38 @@ watch(
}
}
}
&--top {
div {
&:nth-child(1) {
width: 100%;
height: 30%;
background: #1b2a47;
box-shadow: 0 0 1px #888;
}
}
}
&--mix {
div {
&:nth-child(1) {
width: 100%;
height: 30%;
background: #1b2a47;
box-shadow: 0 0 1px #888;
}
&:nth-child(2) {
width: 30%;
height: 70%;
bottom: 0;
left: 0;
background: #fff;
box-shadow: 0 0 1px #888;
position: absolute;
}
}
}
}
}
</style>

2
src/layout/components/Sidebar/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div :class="{ 'has-logo': showLogo }">
<logo v-if="showLogo" :collapse="isCollapse" />
<el-scrollbar wrap-class="scrollbar-wrapper">
<el-scrollbar>
<el-menu
:default-active="activeMenu"
:collapse="isCollapse"

4
src/layout/index.vue
View File

@ -11,7 +11,11 @@
<navbar />
<tags-view v-if="needTagsView" />
</div>
<!--主页面-->
<app-main />
<!-- 设置面板 -->
<RightPanel v-if="showSettings">
<settings />
</RightPanel>

26
src/views/system/menu/components/Menu.vue
View File

@ -225,16 +225,16 @@ import { Dialog, Option } from '@/types/common';
import {
MenuFormData,
MenuItem,
MenuQueryParam,
MenuQueryParam
} from '@/types/api/system/menu';
// API 依赖
import {
listMenus,
getMenuDetail,
listSelectMenus,
listMenuOptions,
addMenu,
deleteMenus,
updateMenu,
updateMenu
} from '@/api/system/menu';
import SvgIcon from '@/components/SvgIcon/index.vue';
@ -262,7 +262,7 @@ const state = reactive({
visible: 1,
sort: 1,
component: 'Layout',
type: 'MENU',
type: 'MENU'
} as MenuFormData,
rules: {
parentId: [{ required: true, message: '请选择顶级菜单', trigger: 'blur' }],
@ -270,8 +270,8 @@ const state = reactive({
type: [{ required: true, message: '请选择菜单类型', trigger: 'blur' }],
path: [{ required: true, message: '请输入路由路径', trigger: 'blur' }],
component: [
{ required: true, message: '请输入组件完整路径', trigger: 'blur' },
],
{ required: true, message: '请输入组件完整路径', trigger: 'blur' }
]
},
menuOptions: [] as Option[],
currentRow: undefined,
@ -279,8 +279,8 @@ const state = reactive({
iconSelectVisible: false,
cacheData: {
menuType: '',
menuPath: '',
},
menuPath: ''
}
});
const {
@ -292,7 +292,7 @@ const {
rules,
menuOptions,
iconSelectVisible,
cacheData,
cacheData
} = toRefs(state);
/**
@ -313,7 +313,7 @@ function handleQuery() {
*/
async function loadMenuData() {
const menuOptions: any[] = [];
await listSelectMenus().then(({ data }) => {
await listMenuOptions().then(({ data }) => {
const menuOption = { value: '0', label: '顶级菜单', children: data };
menuOptions.push(menuOption);
state.menuOptions = menuOptions;
@ -338,7 +338,7 @@ async function handleAdd(row: any) {
await loadMenuData();
state.dialog = {
title: '添加菜单',
visible: true,
visible: true
};
if (row.id) {
// 行点击新增
@ -368,7 +368,7 @@ async function handleUpdate(row: any) {
await loadMenuData();
state.dialog = {
title: '修改菜单',
visible: true,
visible: true
};
const id = row.id || state.ids;
getMenuDetail(id).then(({ data }) => {
@ -417,7 +417,7 @@ function handleDelete(row: any) {
ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
type: 'warning'
})
.then(() => {
deleteMenus(ids).then(() => {

48
src/views/system/role/index.vue
View File

@ -1,19 +1,19 @@
<script lang="ts">
export default {
name: 'role',
name: 'role'
};
</script>
<script setup lang="ts">
import { nextTick, onMounted, reactive, ref, toRefs } from 'vue';
import {
listPageRoles,
listRolePages,
updateRole,
getRoleFormDetail,
addRole,
deleteRoles,
getRoleResourceIds,
updateRoleResource,
updateRoleResource
} from '@/api/system/role';
import { getResource } from '@/api/system/menu';
@ -22,7 +22,7 @@ import { Search, Plus, Edit, Refresh, Delete } from '@element-plus/icons-vue';
import {
RoleFormData,
RoleItem,
RoleQueryParam,
RoleQueryParam
} from '@/types/api/system/role';
import SvgIcon from '@/components/SvgIcon/index.vue';
@ -41,18 +41,18 @@ const state = reactive({
multiple: true,
queryParams: {
pageNum: 1,
pageSize: 10,
pageSize: 10
} as RoleQueryParam,
roleList: [] as RoleItem[],
total: 0,
dialog: {
title: '',
visible: false,
visible: false
},
formData: {} as RoleFormData,
rules: {
name: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
code: [{ required: true, message: '请输入角色编码', trigger: 'blur' }],
code: [{ required: true, message: '请输入角色编码', trigger: 'blur' }]
},
resourceDialogVisible: false,
menuOptions: [] as any[],
@ -61,8 +61,8 @@ const state = reactive({
permGroupList: [],
checkedRole: {
id: '',
name: '',
}, // 选中的角色
name: ''
} // 选中的角色
});
const {
@ -78,13 +78,13 @@ const {
menuOptions,
permOptions,
checkedRole,
checkStrictly,
checkStrictly
} = toRefs(state);
function handleQuery() {
emit('roleClick', {});
state.loading = true;
listPageRoles(state.queryParams).then(({ data }) => {
listRolePages(state.queryParams).then(({ data }) => {
state.roleList = data.list;
state.total = data.total;
state.loading = false;
@ -109,14 +109,14 @@ function handleRowClick(row: any) {
function handleAdd() {
state.dialog = {
title: '添加角色',
visible: true,
visible: true
};
}
function handleUpdate(row: any) {
state.dialog = {
title: '修改角色',
visible: true,
visible: true
};
const roleId = row.id || state.ids;
getRoleFormDetail(roleId).then(({ data }) => {
@ -160,7 +160,7 @@ function handleDelete(row: any) {
ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
type: 'warning'
})
.then(() => {
deleteRoles(ids).then(() => {
@ -176,27 +176,27 @@ function handleDelete(row: any) {
*/
function handleResourceAssign(row: RoleItem) {
resourceDialogVisible.value = true;
permOptions.value.map((item) => (item.checked = false));
permOptions.value.map(item => (item.checked = false));
const roleId: any = row.id;
checkedRole.value = {
id: roleId,
name: row.name,
name: row.name
};
//资源下拉数据
getResource().then((response) => {
getResource().then(response => {
checkStrictly.value = true; // 父子节点不互相关联
state.menuOptions = response.data.menus;
state.permOptions = response.data.perms;
// 获取角色拥有的资源数据进行勾选
getRoleResourceIds(roleId).then((res) => {
getRoleResourceIds(roleId).then(res => {
const checkedMenuIds = res.data.menuIds;
const checkedPermIds = res.data.permIds;
nextTick(() => {
resourceRef.value.setCheckedKeys(checkedMenuIds);
permOptions.value.forEach((perm) => {
permOptions.value.forEach(perm => {
if (checkedPermIds.includes(perm.value)) {
perm.checked = true;
} else {
@ -218,15 +218,15 @@ function handleRoleResourceSubmit() {
.map((node: any) => node.value);
const checkedPermIds = state.permOptions
.filter((item) => item.checked)
.map((item) => item.value);
.filter(item => item.checked)
.map(item => item.value);
const roleResourceData = {
menuIds: checkedMenuIds,
permIds: checkedPermIds,
permIds: checkedPermIds
};
updateRoleResource(checkedRole.value.id, roleResourceData).then((res) => {
updateRoleResource(checkedRole.value.id, roleResourceData).then(res => {
ElMessage.success('修改成功');
state.resourceDialogVisible = false;
handleQuery();
@ -392,7 +392,7 @@ onMounted(() => {
<div class="resource-tree-node__content">
<el-checkbox
v-for="perm in permOptions.filter(
(perm) => perm.parentId == data.permPid
perm => perm.parentId == data.permPid
)"
:key="perm.value"
:label="perm.value"

66
src/views/system/user/index.vue
View File

@ -1,6 +1,6 @@
<script lang="ts">
export default {
name: 'user',
name: 'user'
};
</script>
@ -12,12 +12,12 @@ import {
watchEffect,
onMounted,
getCurrentInstance,
toRefs,
toRefs
} from 'vue';
// 导入API
import {
listUsersPage,
listUserPages,
getUserFormData,
deleteUsers,
addUser,
@ -25,10 +25,10 @@ import {
updateUserPart,
downloadTemplate,
exportUser,
importUser,
importUser
} from '@/api/system/user';
import { listSelectDepartments } from '@/api/system/dept';
import { listSelectRoles } from '@/api/system/role';
import { listRoleOptions } from '@/api/system/role';
// 组件依赖
import {
@ -36,7 +36,7 @@ import {
ElMessageBox,
ElTree,
ElForm,
UploadFile,
UploadFile
} from 'element-plus';
import {
Search,
@ -47,13 +47,13 @@ import {
Lock,
Download,
Top,
UploadFilled,
UploadFilled
} from '@element-plus/icons-vue';
import {
UserItem,
UserQueryParam,
UserFormData,
UserImportFormData,
UserImportFormData
} from '@/types/api/system/user';
import { Option, Dialog } from '@/types/common';
@ -81,7 +81,7 @@ const state = reactive({
userList: [] as UserItem[],
// 弹窗属性
dialog: {
visible: false,
visible: false
} as Dialog,
deptName: undefined,
// 部门树选项
@ -93,18 +93,18 @@ const state = reactive({
roleOptions: [] as Option[],
// 表单参数
formData: {
status: 1,
status: 1
} as UserFormData,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
pageSize: 10
} as UserQueryParam,
// 表单校验
rules: {
username: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
nickname: [
{ required: true, message: '用户昵称不能为空', trigger: 'blur' },
{ required: true, message: '用户昵称不能为空', trigger: 'blur' }
],
deptId: [{ required: true, message: '所属部门不能为空', trigger: 'blur' }],
roleIds: [{ required: true, message: '用户角色不能为空', trigger: 'blur' }],
@ -112,25 +112,25 @@ const state = reactive({
{
pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
message: '请输入正确的邮箱地址',
trigger: 'blur',
},
trigger: 'blur'
}
],
mobile: [
{
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
message: '请输入正确的手机号码',
trigger: 'blur',
},
],
trigger: 'blur'
}
]
},
importDialog: {
title: '用户导出',
visible: false,
visible: false
} as Dialog,
importFormData: {} as UserImportFormData,
excelFile: undefined as any,
excelFilelist: [] as File[],
excelFilelist: [] as File[]
});
const {
@ -147,7 +147,7 @@ const {
roleOptions,
importDialog,
importFormData,
excelFilelist,
excelFilelist
} = toRefs(state);
/**
@ -158,7 +158,7 @@ watchEffect(
deptTreeRef.value.filter(state.deptName);
},
{
flush: 'post', // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
flush: 'post' // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
}
);
@ -184,7 +184,7 @@ function handleDeptNodeClick(data: { [key: string]: any }) {
* 加载角色数据
*/
async function loadRoleOptions() {
listSelectRoles().then((response) => {
listRoleOptions().then(response => {
state.roleOptions = response.data;
});
}
@ -200,7 +200,7 @@ function handleStatusChange(row: { [key: string]: any }) {
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
type: 'warning'
}
)
.then(() => {
@ -219,7 +219,7 @@ function handleStatusChange(row: { [key: string]: any }) {
**/
function handleQuery() {
state.loading = true;
listUsersPage(state.queryParams).then(({ data }) => {
listUserPages(state.queryParams).then(({ data }) => {
state.userList = data.list;
state.total = data.total;
state.loading = false;
@ -252,7 +252,7 @@ function resetPassword(row: { [key: string]: any }) {
'重置密码',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
cancelButtonText: '取消'
}
)
.then(({ value }) => {
@ -261,7 +261,7 @@ function resetPassword(row: { [key: string]: any }) {
return false;
}
updateUserPart(row.id, {
password: value,
password: value
}).then(() => {
ElMessage.success('修改成功，新密码是：' + value);
});
@ -277,7 +277,7 @@ async function handleAdd() {
await loadRoleOptions();
state.dialog = {
title: '添加用户',
visible: true,
visible: true
};
}
@ -290,7 +290,7 @@ async function handleUpdate(row: { [key: string]: any }) {
await loadRoleOptions();
state.dialog = {
title: '修改用户',
visible: true,
visible: true
};
getUserFormData(userId).then(({ data }) => {
state.formData = data;
@ -332,7 +332,7 @@ function handleDelete(row: { [key: string]: any }) {
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
type: 'warning'
}
)
.then(function () {
@ -357,7 +357,7 @@ function cancel() {
* 加载部门
*/
async function loadDeptOptions() {
listSelectDepartments().then((response) => {
listSelectDepartments().then(response => {
state.deptOptions = response.data;
});
}
@ -377,7 +377,7 @@ function loadGenderOptions() {
function handleDownloadTemplate() {
downloadTemplate().then((response: any) => {
const blob = new Blob([response.data], {
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8',
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
});
const a = document.createElement('a');
const href = window.URL.createObjectURL(blob); // 下载链接
@ -429,7 +429,7 @@ function submitImportForm() {
const deptId = state.importFormData.deptId;
const roleIds = state.importFormData.roleIds.join(',');
importUser(deptId, roleIds, state.excelFile).then((response) => {
importUser(deptId, roleIds, state.excelFile).then(response => {
ElMessage.success(response.data);
closeImportDialog();
handleQuery();
@ -454,7 +454,7 @@ function closeImportDialog() {
function handleExport() {
exportUser(queryParams.value).then((response: any) => {
const blob = new Blob([response.data], {
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8',
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
});
const a = document.createElement('a');
const href = window.URL.createObjectURL(blob); // 下载的链接