mirror of
https://github.com/fastapiadmin/FastapiAdmin.git
synced 2026-10-08 18:49:09 +00:00
fix(web): 修复代码格式和文件清理问题
清理无用文件和资源，调整代码格式统一双引号，修复部分组件路径引用问题 删除大量无用图片资源和组件文件，统一代码风格使用双引号，修复国际化文件路径引用，调整部分组件逻辑，优化项目结构
This commit is contained in:
zhangtao
@@ -71,7 +71,7 @@
|
||||
>
|
||||
<template #default="scope">
|
||||
<el-tag :type="scope.row.type === 1 ? 'success' : 'primary'">
|
||||
{{ scope.row.type === 1 ? '登录日志' : '操作日志' }}
|
||||
{{ scope.row.type === 1 ? "登录日志" : "操作日志" }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -220,7 +220,7 @@
|
||||
<el-descriptions :column="8" border label-width="200px">
|
||||
<el-descriptions-item label="日志类型" :span="2">
|
||||
<el-tag :type="formData.type === 1 ? 'success' : 'primary'">
|
||||
{{ formData.type === 1 ? '登录日志' : '操作日志' }}
|
||||
{{ formData.type === 1 ? "登录日志" : "操作日志" }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="请求路径" :span="2">
|
||||
@@ -300,256 +300,256 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
defineOptions({
|
||||
name: 'Log',
|
||||
inheritAttrs: false,
|
||||
});
|
||||
defineOptions({
|
||||
name: "Log",
|
||||
inheritAttrs: false,
|
||||
});
|
||||
|
||||
import { ref, reactive, computed, unref, markRaw, nextTick } from 'vue';
|
||||
import { fetchAllPages } from '@/utils/fetchAllPages';
|
||||
import LogAPI, { LogTable, LogPageQuery } from '@/api/module_system/log';
|
||||
import UserTableSelect from '@/views/module_system/user/components/UserTableSelect.vue';
|
||||
import ExportModal from '@/components/CURD/ExportModal.vue';
|
||||
import CrudToolbarLeft from '@/components/CURD/CrudToolbarLeft.vue';
|
||||
import CrudToolbarRight from '@/components/CURD/CrudToolbarRight.vue';
|
||||
import PageSearch from '@/components/CURD/PageSearch.vue';
|
||||
import PageContent from '@/components/CURD/PageContent.vue';
|
||||
import EnhancedDialog from '@/components/CURD/EnhancedDialog.vue';
|
||||
import JsonPretty from '@/components/JsonPretty/index.vue';
|
||||
import { useCrudList } from '@/components/CURD/useCrudList';
|
||||
import type { IContentConfig, ISearchConfig } from '@/components/CURD/types';
|
||||
import { ref, reactive, computed, unref, markRaw, nextTick } from "vue";
|
||||
import { fetchAllPages } from "@/utils/fetchAllPages";
|
||||
import LogAPI, { LogTable, LogPageQuery } from "@/api/module_system/log";
|
||||
import UserTableSelect from "@/views/module_system/user/components/UserTableSelect.vue";
|
||||
import ExportModal from "@/components/CURD/ExportModal.vue";
|
||||
import CrudToolbarLeft from "@/components/CURD/CrudToolbarLeft.vue";
|
||||
import CrudToolbarRight from "@/components/CURD/CrudToolbarRight.vue";
|
||||
import PageSearch from "@/components/CURD/PageSearch.vue";
|
||||
import PageContent from "@/components/CURD/PageContent.vue";
|
||||
import EnhancedDialog from "@/components/CURD/EnhancedDialog.vue";
|
||||
import JsonPretty from "@/components/JsonPretty/index.vue";
|
||||
import { useCrudList } from "@/components/CURD/useCrudList";
|
||||
import type { IContentConfig, ISearchConfig } from "@/components/CURD/types";
|
||||
|
||||
const { searchRef, contentRef, handleQueryClick, handleResetClick, refreshList } = useCrudList();
|
||||
const { searchRef, contentRef, handleQueryClick, handleResetClick, refreshList } = useCrudList();
|
||||
|
||||
function triggerUserSearch() {
|
||||
nextTick(() => refreshList());
|
||||
}
|
||||
function triggerUserSearch() {
|
||||
nextTick(() => refreshList());
|
||||
}
|
||||
|
||||
const searchConfig = reactive<ISearchConfig>({
|
||||
permPrefix: 'module_system:log',
|
||||
colon: true,
|
||||
isExpandable: true,
|
||||
showNumber: 2,
|
||||
form: { labelWidth: 'auto' },
|
||||
formItems: [
|
||||
{
|
||||
prop: 'request_path',
|
||||
label: '请求路径',
|
||||
type: 'input',
|
||||
attrs: { placeholder: '请输入请求路径', clearable: true },
|
||||
const searchConfig = reactive<ISearchConfig>({
|
||||
permPrefix: "module_system:log",
|
||||
colon: true,
|
||||
isExpandable: true,
|
||||
showNumber: 2,
|
||||
form: { labelWidth: "auto" },
|
||||
formItems: [
|
||||
{
|
||||
prop: "request_path",
|
||||
label: "请求路径",
|
||||
type: "input",
|
||||
attrs: { placeholder: "请输入请求路径", clearable: true },
|
||||
},
|
||||
{
|
||||
prop: "type",
|
||||
label: "日志类型",
|
||||
type: "select",
|
||||
options: [
|
||||
{ label: "登录日志", value: 1 },
|
||||
{ label: "操作日志", value: 2 },
|
||||
],
|
||||
attrs: { placeholder: "请选择日志类型", clearable: true, style: { width: "167.5px" } },
|
||||
},
|
||||
{
|
||||
prop: "created_id",
|
||||
label: "创建人",
|
||||
type: "user-table-select",
|
||||
initialValue: null,
|
||||
events: {
|
||||
"confirm-click": triggerUserSearch,
|
||||
"clear-click": triggerUserSearch,
|
||||
},
|
||||
{
|
||||
prop: 'type',
|
||||
label: '日志类型',
|
||||
type: 'select',
|
||||
options: [
|
||||
{ label: '登录日志', value: 1 },
|
||||
{ label: '操作日志', value: 2 },
|
||||
],
|
||||
attrs: { placeholder: '请选择日志类型', clearable: true, style: { width: '167.5px' } },
|
||||
},
|
||||
{
|
||||
prop: "created_time",
|
||||
label: "创建时间",
|
||||
type: "date-picker",
|
||||
initialValue: [],
|
||||
attrs: {
|
||||
type: "datetimerange",
|
||||
valueFormat: "YYYY-MM-DD HH:mm:ss",
|
||||
rangeSeparator: "至",
|
||||
startPlaceholder: "开始日期",
|
||||
endPlaceholder: "结束日期",
|
||||
style: { width: "340px" },
|
||||
},
|
||||
{
|
||||
prop: 'created_id',
|
||||
label: '创建人',
|
||||
type: 'user-table-select',
|
||||
initialValue: null,
|
||||
events: {
|
||||
'confirm-click': triggerUserSearch,
|
||||
'clear-click': triggerUserSearch,
|
||||
},
|
||||
},
|
||||
],
|
||||
customComponents: {
|
||||
"user-table-select": markRaw(UserTableSelect),
|
||||
},
|
||||
});
|
||||
|
||||
const contentCols = reactive<
|
||||
Array<{
|
||||
prop?: string;
|
||||
label?: string;
|
||||
show?: boolean;
|
||||
}>
|
||||
>([
|
||||
{ prop: "selection", label: "选择框", show: true },
|
||||
{ prop: "index", label: "序号", show: true },
|
||||
{ prop: "type", label: "日志类型", show: true },
|
||||
{ prop: "request_path", label: "请求路径", show: true },
|
||||
{ prop: "request_method", label: "请求方法", show: true },
|
||||
{ prop: "response_code", label: "状态码", show: true },
|
||||
{ prop: "request_ip", label: "请求IP", show: true },
|
||||
{ prop: "process_time", label: "处理时间", show: true },
|
||||
{ prop: "request_browser", label: "浏览器", show: true },
|
||||
{ prop: "request_os", label: "系统", show: true },
|
||||
{ prop: "description", label: "描述", show: true },
|
||||
{ prop: "created_time", label: "创建时间", show: true },
|
||||
{ prop: "created_id", label: "创建人", show: true },
|
||||
{ prop: "updated_id", label: "更新人", show: true },
|
||||
{ prop: "operation", label: "操作", show: true },
|
||||
]);
|
||||
|
||||
const contentConfig = reactive<IContentConfig<LogPageQuery>>({
|
||||
permPrefix: "module_system:log",
|
||||
pk: "id",
|
||||
cols: contentCols as IContentConfig["cols"],
|
||||
hideColumnFilter: false,
|
||||
toolbar: [],
|
||||
defaultToolbar: ["refresh", "filter"],
|
||||
pagination: {
|
||||
pageSize: 10,
|
||||
pageSizes: [10, 20, 30, 50],
|
||||
},
|
||||
request: { page_no: "page_no", page_size: "page_size" },
|
||||
indexAction: async (params) => {
|
||||
const res = await LogAPI.listLog(params as LogPageQuery);
|
||||
return {
|
||||
total: res.data.data.total,
|
||||
list: res.data.data.items,
|
||||
};
|
||||
},
|
||||
deleteAction: async (ids) => {
|
||||
await LogAPI.deleteLog(
|
||||
ids
|
||||
.split(",")
|
||||
.map((s) => Number(s.trim()))
|
||||
.filter((n) => !Number.isNaN(n))
|
||||
);
|
||||
},
|
||||
deleteConfirm: {
|
||||
title: "警告",
|
||||
message: "确认删除该项数据?",
|
||||
type: "warning",
|
||||
},
|
||||
});
|
||||
|
||||
const formData = ref<LogTable>({});
|
||||
|
||||
const dialogVisible = reactive({
|
||||
title: "",
|
||||
visible: false,
|
||||
type: "create" as "create" | "update" | "detail",
|
||||
});
|
||||
|
||||
const getStatusCodeType = (code?: number) => {
|
||||
if (code === undefined) {
|
||||
return "info";
|
||||
}
|
||||
if (code >= 200 && code < 300) {
|
||||
return "success";
|
||||
} else if (code >= 300 && code < 400) {
|
||||
return "warning";
|
||||
} else if (code >= 400 && code < 500) {
|
||||
return "danger";
|
||||
} else {
|
||||
return "danger";
|
||||
}
|
||||
};
|
||||
|
||||
const getMethodType = (method?: string) => {
|
||||
if (method === undefined) {
|
||||
return "info";
|
||||
}
|
||||
if (method === "GET") {
|
||||
return "info";
|
||||
} else if (method === "POST") {
|
||||
return "success";
|
||||
} else if (method === "PUT" || method === "PATCH") {
|
||||
return "warning";
|
||||
} else if (method === "DELETE") {
|
||||
return "danger";
|
||||
} else {
|
||||
return "info";
|
||||
}
|
||||
};
|
||||
|
||||
async function resetForm() {
|
||||
formData.value.id = undefined;
|
||||
}
|
||||
|
||||
async function handleCloseDialog() {
|
||||
dialogVisible.visible = false;
|
||||
await resetForm();
|
||||
}
|
||||
|
||||
async function handleOpenDialog(type: "create" | "update" | "detail", id: number) {
|
||||
dialogVisible.type = type;
|
||||
if (id) {
|
||||
const response = await LogAPI.detailLog(id);
|
||||
if (type === "detail") {
|
||||
dialogVisible.title = "日志详情";
|
||||
Object.assign(formData.value, response.data.data);
|
||||
}
|
||||
}
|
||||
dialogVisible.visible = true;
|
||||
}
|
||||
|
||||
function handleRowDelete(id: number) {
|
||||
contentRef.value?.handleDelete(id);
|
||||
}
|
||||
|
||||
const exportsDialogVisible = ref(false);
|
||||
|
||||
const exportQueryParams = computed(() => searchRef.value?.getQueryParams() ?? {});
|
||||
|
||||
const exportPageData = computed(() => {
|
||||
const pd = contentRef.value?.pageData;
|
||||
return (unref(pd) ?? []) as LogTable[];
|
||||
});
|
||||
|
||||
const exportSelectionData = computed(
|
||||
() => (contentRef.value?.getSelectionData() ?? []) as LogTable[]
|
||||
);
|
||||
|
||||
const exportColumns = [
|
||||
{ prop: "type", label: "日志类型" },
|
||||
{ prop: "request_path", label: "请求路径" },
|
||||
{ prop: "request_method", label: "请求方法" },
|
||||
{ prop: "response_code", label: "状态码" },
|
||||
{ prop: "request_ip", label: "请求IP" },
|
||||
{ prop: "login_location", label: "登录地点" },
|
||||
{ prop: "process_time", label: "处理时间" },
|
||||
{ prop: "request_browser", label: "浏览器" },
|
||||
{ prop: "request_os", label: "系统" },
|
||||
{ prop: "description", label: "描述" },
|
||||
{ prop: "created_time", label: "创建时间" },
|
||||
{ prop: "updated_time", label: "更新时间" },
|
||||
];
|
||||
|
||||
const curdContentConfig = {
|
||||
permPrefix: "module_system:log",
|
||||
cols: exportColumns as any,
|
||||
exportsAction: async (params: any) => {
|
||||
const query: Record<string, unknown> = { ...params };
|
||||
return fetchAllPages({
|
||||
initialQuery: query,
|
||||
fetchPage: async (q) => {
|
||||
const res = await LogAPI.listLog(q as unknown as LogPageQuery);
|
||||
return {
|
||||
total: res.data?.data?.total ?? 0,
|
||||
list: res.data?.data?.items ?? [],
|
||||
};
|
||||
},
|
||||
{
|
||||
prop: 'created_time',
|
||||
label: '创建时间',
|
||||
type: 'date-picker',
|
||||
initialValue: [],
|
||||
attrs: {
|
||||
type: 'datetimerange',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
rangeSeparator: '至',
|
||||
startPlaceholder: '开始日期',
|
||||
endPlaceholder: '结束日期',
|
||||
style: { width: '340px' },
|
||||
},
|
||||
},
|
||||
],
|
||||
customComponents: {
|
||||
'user-table-select': markRaw(UserTableSelect),
|
||||
},
|
||||
});
|
||||
});
|
||||
},
|
||||
} as unknown as IContentConfig;
|
||||
|
||||
const contentCols = reactive<
|
||||
Array<{
|
||||
prop?: string;
|
||||
label?: string;
|
||||
show?: boolean;
|
||||
}>
|
||||
>([
|
||||
{ prop: 'selection', label: '选择框', show: true },
|
||||
{ prop: 'index', label: '序号', show: true },
|
||||
{ prop: 'type', label: '日志类型', show: true },
|
||||
{ prop: 'request_path', label: '请求路径', show: true },
|
||||
{ prop: 'request_method', label: '请求方法', show: true },
|
||||
{ prop: 'response_code', label: '状态码', show: true },
|
||||
{ prop: 'request_ip', label: '请求IP', show: true },
|
||||
{ prop: 'process_time', label: '处理时间', show: true },
|
||||
{ prop: 'request_browser', label: '浏览器', show: true },
|
||||
{ prop: 'request_os', label: '系统', show: true },
|
||||
{ prop: 'description', label: '描述', show: true },
|
||||
{ prop: 'created_time', label: '创建时间', show: true },
|
||||
{ prop: 'created_id', label: '创建人', show: true },
|
||||
{ prop: 'updated_id', label: '更新人', show: true },
|
||||
{ prop: 'operation', label: '操作', show: true },
|
||||
]);
|
||||
|
||||
const contentConfig = reactive<IContentConfig<LogPageQuery>>({
|
||||
permPrefix: 'module_system:log',
|
||||
pk: 'id',
|
||||
cols: contentCols as IContentConfig['cols'],
|
||||
hideColumnFilter: false,
|
||||
toolbar: [],
|
||||
defaultToolbar: ['refresh', 'filter'],
|
||||
pagination: {
|
||||
pageSize: 10,
|
||||
pageSizes: [10, 20, 30, 50],
|
||||
},
|
||||
request: { page_no: 'page_no', page_size: 'page_size' },
|
||||
indexAction: async (params) => {
|
||||
const res = await LogAPI.listLog(params as LogPageQuery);
|
||||
return {
|
||||
total: res.data.data.total,
|
||||
list: res.data.data.items,
|
||||
};
|
||||
},
|
||||
deleteAction: async (ids) => {
|
||||
await LogAPI.deleteLog(
|
||||
ids
|
||||
.split(',')
|
||||
.map((s) => Number(s.trim()))
|
||||
.filter((n) => !Number.isNaN(n))
|
||||
);
|
||||
},
|
||||
deleteConfirm: {
|
||||
title: '警告',
|
||||
message: '确认删除该项数据?',
|
||||
type: 'warning',
|
||||
},
|
||||
});
|
||||
|
||||
const formData = ref<LogTable>({});
|
||||
|
||||
const dialogVisible = reactive({
|
||||
title: '',
|
||||
visible: false,
|
||||
type: 'create' as 'create' | 'update' | 'detail',
|
||||
});
|
||||
|
||||
const getStatusCodeType = (code?: number) => {
|
||||
if (code === undefined) {
|
||||
return 'info';
|
||||
}
|
||||
if (code >= 200 && code < 300) {
|
||||
return 'success';
|
||||
} else if (code >= 300 && code < 400) {
|
||||
return 'warning';
|
||||
} else if (code >= 400 && code < 500) {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'danger';
|
||||
}
|
||||
};
|
||||
|
||||
const getMethodType = (method?: string) => {
|
||||
if (method === undefined) {
|
||||
return 'info';
|
||||
}
|
||||
if (method === 'GET') {
|
||||
return 'info';
|
||||
} else if (method === 'POST') {
|
||||
return 'success';
|
||||
} else if (method === 'PUT' || method === 'PATCH') {
|
||||
return 'warning';
|
||||
} else if (method === 'DELETE') {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'info';
|
||||
}
|
||||
};
|
||||
|
||||
async function resetForm() {
|
||||
formData.value.id = undefined;
|
||||
}
|
||||
|
||||
async function handleCloseDialog() {
|
||||
dialogVisible.visible = false;
|
||||
await resetForm();
|
||||
}
|
||||
|
||||
async function handleOpenDialog(type: 'create' | 'update' | 'detail', id: number) {
|
||||
dialogVisible.type = type;
|
||||
if (id) {
|
||||
const response = await LogAPI.detailLog(id);
|
||||
if (type === 'detail') {
|
||||
dialogVisible.title = '日志详情';
|
||||
Object.assign(formData.value, response.data.data);
|
||||
}
|
||||
}
|
||||
dialogVisible.visible = true;
|
||||
}
|
||||
|
||||
function handleRowDelete(id: number) {
|
||||
contentRef.value?.handleDelete(id);
|
||||
}
|
||||
|
||||
const exportsDialogVisible = ref(false);
|
||||
|
||||
const exportQueryParams = computed(() => searchRef.value?.getQueryParams() ?? {});
|
||||
|
||||
const exportPageData = computed(() => {
|
||||
const pd = contentRef.value?.pageData;
|
||||
return (unref(pd) ?? []) as LogTable[];
|
||||
});
|
||||
|
||||
const exportSelectionData = computed(
|
||||
() => (contentRef.value?.getSelectionData() ?? []) as LogTable[]
|
||||
);
|
||||
|
||||
const exportColumns = [
|
||||
{ prop: 'type', label: '日志类型' },
|
||||
{ prop: 'request_path', label: '请求路径' },
|
||||
{ prop: 'request_method', label: '请求方法' },
|
||||
{ prop: 'response_code', label: '状态码' },
|
||||
{ prop: 'request_ip', label: '请求IP' },
|
||||
{ prop: 'login_location', label: '登录地点' },
|
||||
{ prop: 'process_time', label: '处理时间' },
|
||||
{ prop: 'request_browser', label: '浏览器' },
|
||||
{ prop: 'request_os', label: '系统' },
|
||||
{ prop: 'description', label: '描述' },
|
||||
{ prop: 'created_time', label: '创建时间' },
|
||||
{ prop: 'updated_time', label: '更新时间' },
|
||||
];
|
||||
|
||||
const curdContentConfig = {
|
||||
permPrefix: 'module_system:log',
|
||||
cols: exportColumns as any,
|
||||
exportsAction: async (params: any) => {
|
||||
const query: Record<string, unknown> = { ...params };
|
||||
return fetchAllPages({
|
||||
initialQuery: query,
|
||||
fetchPage: async (q) => {
|
||||
const res = await LogAPI.listLog(q as unknown as LogPageQuery);
|
||||
return {
|
||||
total: res.data?.data?.total ?? 0,
|
||||
list: res.data?.data?.items ?? [],
|
||||
};
|
||||
},
|
||||
});
|
||||
},
|
||||
} as unknown as IContentConfig;
|
||||
|
||||
function handleOpenExportsModal() {
|
||||
exportsDialogVisible.value = true;
|
||||
}
|
||||
function handleOpenExportsModal() {
|
||||
exportsDialogVisible.value = true;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
Reference in New Issue
Block a user