feat(菜单模块):添加菜单模块
- 优化登录流程 - 添加服务器端获取菜单
This commit is contained in:
vertoryao
parent
6b25c03d37
commit
586bd23203
@ -177,5 +177,5 @@ export function getUserDetail(id: number) {
|
||||
}
|
||||
|
||||
export function getMenuList() {
|
||||
return axios.post<RouteRecordNormalized[]>('/api/user/menu');
|
||||
return axios.get<RouteRecordNormalized[]>('/api/rest/user/menu');
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<a-spin style="display: block" :loading="loading">
|
||||
<a-tabs v-model:activeKey="messageType" type="rounded" destroy-on-hide>
|
||||
<a-tabs v-model:active-key="messageType" type="rounded" destroy-on-hide>
|
||||
<a-tab-pane v-for="item in tabList" :key="item.key">
|
||||
<template #title>
|
||||
<span> {{ item.title }}{{ formatUnreadLength(item.key) }} </span>
|
||||
|
||||
@ -12,6 +12,6 @@
|
||||
"globalSettings": false,
|
||||
"device": "desktop",
|
||||
"tabBar": false,
|
||||
"menuFromServer": false,
|
||||
"menuFromServer": true,
|
||||
"serverMenu": []
|
||||
}
|
||||
|
||||
@ -29,7 +29,7 @@ const SYSTEM: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
locale: 'menu.system.role',
|
||||
requiresAuth: true,
|
||||
permissions: ['admin'],
|
||||
permissions: ['*'],
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -39,7 +39,7 @@ const SYSTEM: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
locale: 'menu.system.dept',
|
||||
requiresAuth: true,
|
||||
permissions: ['admin'],
|
||||
permissions: ['*'],
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -49,7 +49,7 @@ const SYSTEM: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
locale: 'menu.system.user',
|
||||
requiresAuth: true,
|
||||
permissions: ['admin'],
|
||||
permissions: ['*'],
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -59,7 +59,7 @@ const SYSTEM: AppRouteRecordRaw = {
|
||||
meta: {
|
||||
locale: '权限管理',
|
||||
requiresAuth: true,
|
||||
permissions: ['admin'],
|
||||
permissions: ['*'],
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
@ -13,6 +13,7 @@ export interface UserState {
|
||||
id?: number;
|
||||
role?: RoleRecord;
|
||||
roles?: RoleRecord[];
|
||||
permissions?: string[] | '' | '*' | 'admin' | 'user' | 'auditor';
|
||||
// permissions?: string[] | '' | '*' | 'admin' | 'user' | 'auditor';
|
||||
permissions?: string[];
|
||||
authorities?: string[];
|
||||
}
|
||||
|
||||
@ -1,68 +1,68 @@
|
||||
// 新建 @/utils/excel.ts
|
||||
|
||||
import saveAs from 'file-saver'; // https://www.npmjs.com/package/file-saver
|
||||
import ExcelJS from 'exceljs'; // https://github.com/exceljs/exceljs/blob/master/README_zh.md
|
||||
import * as XLSX from 'xlsx'; // https://www.npmjs.com/package/xlsx
|
||||
import { Message } from '@arco-design/web-vue'; // https://arco.design/vue/component/message
|
||||
import { FileItem } from '@arco-design/web-vue/es/upload/interfaces'; // arco类型
|
||||
|
||||
export interface DownloadExcelPrams {
|
||||
columns: { title: string; key: string }[];
|
||||
rows: object[];
|
||||
name: string;
|
||||
}
|
||||
|
||||
// 导出下载文件
|
||||
export function downloadExcel({
|
||||
columns,
|
||||
rows,
|
||||
name = '未命名文件',
|
||||
}: DownloadExcelPrams) {
|
||||
const workbook = new ExcelJS.Workbook();
|
||||
workbook.creator = 'Start-front';
|
||||
workbook.lastModifiedBy = 'Start-front';
|
||||
workbook.created = new Date(1985, 8, 30);
|
||||
workbook.modified = new Date();
|
||||
workbook.lastPrinted = new Date(2016, 9, 27);
|
||||
|
||||
// 将工作簿添加一个sheet页sheet1
|
||||
const sheet1 = workbook.addWorksheet(name);
|
||||
// 表头数据添加
|
||||
sheet1.columns = columns.map((item) => ({
|
||||
header: item.title,
|
||||
key: item.key,
|
||||
width: 20,
|
||||
}));
|
||||
// 表格内容添加
|
||||
rows.map((item) => sheet1.addRow(item));
|
||||
workbook.xlsx.writeBuffer().then((buffer) => {
|
||||
saveAs(
|
||||
new Blob([buffer], { type: 'application/octet-stream' }),
|
||||
`${name}.xlsx`
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
// 读取文件为json格式
|
||||
export function readExcle(fileItem: FileItem) {
|
||||
return new Promise((resove, reject) => {
|
||||
try {
|
||||
let workbook: XLSX.Sheet;
|
||||
const reader = new FileReader();
|
||||
reader.readAsBinaryString(fileItem.file as File); // 发起异步请求
|
||||
reader.onload = function (ev) {
|
||||
const data = ev.target?.result;
|
||||
workbook = XLSX.read(data, { type: 'binary' });
|
||||
const sheetNames = workbook.SheetNames; // 工作表名称集合
|
||||
sheetNames.forEach((name: string) => {
|
||||
const worksheet = workbook.Sheets[name]; // 只能通过工作表名称来获取指定工作表
|
||||
const jsonres = XLSX.utils.sheet_to_json(worksheet);
|
||||
resove(jsonres);
|
||||
});
|
||||
}; // onload
|
||||
} catch (error) {
|
||||
Message.error('读取失败,请选择正确文件');
|
||||
reject(error);
|
||||
}
|
||||
});
|
||||
}
|
||||
// // 新建 @/utils/excel.ts
|
||||
//
|
||||
// import saveAs from 'file-saver'; // https://www.npmjs.com/package/file-saver
|
||||
// import ExcelJS from 'exceljs'; // https://github.com/exceljs/exceljs/blob/master/README_zh.md
|
||||
// import * as XLSX from 'xlsx'; // https://www.npmjs.com/package/xlsx
|
||||
// import { Message } from '@arco-design/web-vue'; // https://arco.design/vue/component/message
|
||||
// import { FileItem } from '@arco-design/web-vue/es/upload/interfaces'; // arco类型
|
||||
//
|
||||
// export interface DownloadExcelPrams {
|
||||
// columns: { title: string; key: string }[];
|
||||
// rows: object[];
|
||||
// name: string;
|
||||
// }
|
||||
//
|
||||
// // 导出下载文件
|
||||
// export function downloadExcel({
|
||||
// columns,
|
||||
// rows,
|
||||
// name = '未命名文件',
|
||||
// }: DownloadExcelPrams) {
|
||||
// const workbook = new ExcelJS.Workbook();
|
||||
// workbook.creator = 'Start-front';
|
||||
// workbook.lastModifiedBy = 'Start-front';
|
||||
// workbook.created = new Date(1985, 8, 30);
|
||||
// workbook.modified = new Date();
|
||||
// workbook.lastPrinted = new Date(2016, 9, 27);
|
||||
//
|
||||
// // 将工作簿添加一个sheet页sheet1
|
||||
// const sheet1 = workbook.addWorksheet(name);
|
||||
// // 表头数据添加
|
||||
// sheet1.columns = columns.map((item) => ({
|
||||
// header: item.title,
|
||||
// key: item.key,
|
||||
// width: 20,
|
||||
// }));
|
||||
// // 表格内容添加
|
||||
// rows.map((item) => sheet1.addRow(item));
|
||||
// workbook.xlsx.writeBuffer().then((buffer) => {
|
||||
// saveAs(
|
||||
// new Blob([buffer], { type: 'application/octet-stream' }),
|
||||
// `${name}.xlsx`
|
||||
// );
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// // 读取文件为json格式
|
||||
// export function readExcle(fileItem: FileItem) {
|
||||
// return new Promise((resove, reject) => {
|
||||
// try {
|
||||
// let workbook: XLSX.Sheet;
|
||||
// const reader = new FileReader();
|
||||
// reader.readAsBinaryString(fileItem.file as File); // 发起异步请求
|
||||
// reader.onload = function (ev) {
|
||||
// const data = ev.target?.result;
|
||||
// workbook = XLSX.read(data, { type: 'binary' });
|
||||
// const sheetNames = workbook.SheetNames; // 工作表名称集合
|
||||
// sheetNames.forEach((name: string) => {
|
||||
// const worksheet = workbook.Sheets[name]; // 只能通过工作表名称来获取指定工作表
|
||||
// const jsonres = XLSX.utils.sheet_to_json(worksheet);
|
||||
// resove(jsonres);
|
||||
// });
|
||||
// }; // onload
|
||||
// } catch (error) {
|
||||
// Message.error('读取失败,请选择正确文件');
|
||||
// reject(error);
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
|
||||
@ -226,7 +226,7 @@
|
||||
import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
|
||||
import { useUserStore } from '@/store';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import { downloadExcel, DownloadExcelPrams } from '@/utils/excel';
|
||||
// import { downloadExcel, DownloadExcelPrams } from '@/utils/excel';
|
||||
import useTableOption from '@/hooks/table-option';
|
||||
import UserEdit from './components/user-edit.vue';
|
||||
|
||||
@ -348,22 +348,22 @@
|
||||
};
|
||||
|
||||
// 下载表格
|
||||
const generateExcel = () => {
|
||||
const param: DownloadExcelPrams = {
|
||||
columns: [
|
||||
{ title: '用户名', key: 'username' },
|
||||
{ title: '昵称', key: 'nickName' },
|
||||
{ title: '电话号码', key: 'phone' },
|
||||
{ title: '部门Id', key: 'deptId' },
|
||||
{ title: '角色Id', key: 'roleId' },
|
||||
{ title: 'email', key: 'email' },
|
||||
{ title: '启用状态', key: 'enabled' },
|
||||
],
|
||||
rows: renderData.value,
|
||||
name: '用户表格',
|
||||
};
|
||||
downloadExcel(param);
|
||||
};
|
||||
// const generateExcel = () => {
|
||||
// const param: DownloadExcelPrams = {
|
||||
// columns: [
|
||||
// { title: '用户名', key: 'username' },
|
||||
// { title: '昵称', key: 'nickName' },
|
||||
// { title: '电话号码', key: 'phone' },
|
||||
// { title: '部门Id', key: 'deptId' },
|
||||
// { title: '角色Id', key: 'roleId' },
|
||||
// { title: 'email', key: 'email' },
|
||||
// { title: '启用状态', key: 'enabled' },
|
||||
// ],
|
||||
// rows: renderData.value,
|
||||
// name: '用户表格',
|
||||
// };
|
||||
// downloadExcel(param);
|
||||
// };
|
||||
|
||||
// 查询
|
||||
const search = () => {
|
||||
|
||||
@ -55,7 +55,6 @@
|
||||
import { FormInstance } from '@arco-design/web-vue/es/form';
|
||||
import { PasswordReSetModel, resetPassword } from '@/api/user';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import useUser from '@/hooks/user';
|
||||
import router from '@/router';
|
||||
import { clearToken } from '@/utils/auth';
|
||||
|
||||
@ -78,8 +77,6 @@
|
||||
}
|
||||
};
|
||||
|
||||
const user = useUser();
|
||||
|
||||
const validate = async () => {
|
||||
const vali = await formRef.value?.validate();
|
||||
if (!vali) {
|
||||
|
||||
@ -2,12 +2,12 @@
|
||||
<a-card :bordered="false">
|
||||
<a-space :size="54">
|
||||
<a-upload
|
||||
:custom-request="Onchange"
|
||||
:custom-request="() => {}"
|
||||
list-type="picture-card"
|
||||
:file-list="fileList"
|
||||
:show-upload-button="true"
|
||||
:show-file-list="false"
|
||||
@change="Onchange"
|
||||
@change="() => {}"
|
||||
>
|
||||
<template #upload-button>
|
||||
<a-avatar :size="100" class="info-avatar">
|
||||
@ -49,7 +49,7 @@
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { ref } from 'vue';
|
||||
import type { FileItem } from '@arco-design/web-vue/es/upload/interfaces';
|
||||
import { useUserStore, useTicketStore } from '@/store';
|
||||
import { useUserStore } from '@/store';
|
||||
import userIcon from '@/assets/images/user-circle.png';
|
||||
import type { DescData } from '@arco-design/web-vue/es/descriptions/interface';
|
||||
import dayjs from 'dayjs';
|
||||
@ -58,7 +58,6 @@
|
||||
|
||||
const userStore = useUserStore();
|
||||
const { t } = useI18n();
|
||||
const ticketStore = useTicketStore();
|
||||
|
||||
const file = {
|
||||
uid: '-2',
|
||||
@ -86,26 +85,26 @@
|
||||
|
||||
const fileList = ref<FileItem[]>([file]);
|
||||
|
||||
const Onchange = async (option: any) => {
|
||||
const FormDatas = new FormData();
|
||||
FormDatas.append('file', option.fileItem.file);
|
||||
const res = await ticketStore.uploadFile(FormDatas);
|
||||
if (res.status === 200) {
|
||||
Message.success({
|
||||
content: t('upload.sucess'),
|
||||
duration: 3 * 1000,
|
||||
});
|
||||
res.data.name = res.data.fileName;
|
||||
fileList.value.push(res.data);
|
||||
await selfUpdate({ avatar: res.data.id });
|
||||
await userStore.info();
|
||||
} else {
|
||||
Message.error({
|
||||
content: t('upload.fail'),
|
||||
duration: 3 * 1000,
|
||||
});
|
||||
}
|
||||
};
|
||||
// const Onchange = async (option: any) => {
|
||||
// const FormDatas = new FormData();
|
||||
// FormDatas.append('file', option.fileItem.file);
|
||||
// const res = await ticketStore.uploadFile(FormDatas);
|
||||
// if (res.status === 200) {
|
||||
// Message.success({
|
||||
// content: t('upload.sucess'),
|
||||
// duration: 3 * 1000,
|
||||
// });
|
||||
// res.data.name = res.data.fileName;
|
||||
// fileList.value.push(res.data);
|
||||
// await selfUpdate({ avatar: res.data.id });
|
||||
// await userStore.info();
|
||||
// } else {
|
||||
// Message.error({
|
||||
// content: t('upload.fail'),
|
||||
// duration: 3 * 1000,
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user