BookSystem/frontend/src/modules/admin/views/permissions/PermissionManage.vue
jayhgq 2c78e254e1 feat: 为多个管理页面添加统一的操作反馈提示,重构设置页面UI
1. 为用户、角色、权限管理页添加增删改成功/失败的全局提示,统一弹窗样式与时长
2. 重构系统设置管理页面的UI,替换element组件为原生html实现,优化布局样式
2026-05-27 16:26:36 +08:00

46 lines
1.3 KiB
Vue

<template>
<fs-page>
<fs-crud ref="crudRef" v-bind="crudBinding" @add-success="onAddSuccess" @edit-success="onEditSuccess" @del-success="onDelSuccess" @add-error="onError" @edit-error="onError" @del-error="onError" />
</fs-page>
</template>
<script setup lang="ts">
import { onMounted } from "vue";
import { useFs } from "@fast-crud/fast-crud";
import { ElMessage } from "element-plus";
import { createPermissionCrudOptions } from "./permission-crud";
const { crudBinding, crudRef, crudExpose } = useFs({
createCrudOptions: createPermissionCrudOptions,
});
const onAddSuccess = () => {
ElMessage.success({ message: "添加成功", duration: 5000 });
};
const onEditSuccess = () => {
ElMessage.success({ message: "修改成功", duration: 5000 });
};
const onDelSuccess = () => {
ElMessage.success({ message: "删除成功", duration: 5000 });
};
const onError = (error: any) => {
let message = "操作失败";
if (error.response?.data) {
const data = error.response.data;
if (data.message) {
message = data.message;
} else if (data.detail) {
message = typeof data.detail === "string" ? data.detail : "操作失败";
}
}
ElMessage.error({ message, duration: 5000 });
};
onMounted(() => {
crudExpose.doRefresh();
});
</script>