🔨 表格字段.

This commit is contained in:
lijiahangmax
2025-03-22 00:58:15 +08:00
parent 4efd2b5ec2
commit 94ed071897
33 changed files with 458 additions and 72 deletions

View File

@@ -62,8 +62,8 @@
</script>
<script lang="ts" setup>
import type { SelectOptionData } from '@arco-design/web-vue';
import type { OperatorLogQueryRequest } from '@/api/user/operator-log';
import type { SelectOptionData } from '@arco-design/web-vue';
import { ref, watch } from 'vue';
import useLoading from '@/hooks/loading';
import { useDictStore } from '@/store';

View File

@@ -3,7 +3,7 @@
<a-table row-key="id"
ref="tableRef"
:loading="loading"
:columns="logColumns"
:columns="tableColumns"
:data="tableRenderData"
:pagination="pagination"
:bordered="false"
@@ -83,7 +83,7 @@
import { ref, onMounted } from 'vue';
import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey, dictKeys } from '../types/const';
import columns from '../types/table.columns';
import { getLogDetail } from '../types/const';
import { TableName, getLogDetail } from '../types/const';
import { copy } from '@/hooks/copy';
import useLoading from '@/hooks/loading';
import { useTablePagination } from '@/hooks/table';
@@ -91,6 +91,7 @@
import { getOperatorLogPage } from '@/api/user/operator-log';
import { getCurrentUserOperatorLog } from '@/api/user/mine';
import { replaceHtmlTag, clearHtmlTag } from '@/utils';
import { useQueryOrder, DESC } from '@/hooks/query-order';
import JsonEditorModal from '@/components/view/json-editor/modal/index.vue';
const props = withDefaults(defineProps<Partial<{
@@ -108,11 +109,12 @@
});
const pagination = useTablePagination();
const { markOrderly } = useQueryOrder(TableName, DESC);
const { loading, setLoading } = useLoading();
const { getDictValue } = useDictStore();
const { getDictValue, loadKeys } = useDictStore();
const jsonView = ref();
const logColumns = ref();
const tableColumns = ref();
const tableRenderData = ref<OperatorLogQueryResponse[]>([]);
// 查看详情
@@ -135,11 +137,11 @@
let rows;
if (props.current) {
// 查询当前用户
const { data } = await getCurrentUserOperatorLog(request);
const { data } = await getCurrentUserOperatorLog(markOrderly(request));
rows = data;
} else {
// 查询所有
const { data } = await getOperatorLogPage({ ...request, ...props.baseParams });
const { data } = await getOperatorLogPage(markOrderly({ ...request, ...props.baseParams }));
rows = data;
}
tableRenderData.value = rows.rows.map(s => {
@@ -162,8 +164,7 @@
// 初始化
onMounted(async () => {
// 加载字典值
const dictStore = useDictStore();
await dictStore.loadKeys(dictKeys);
await loadKeys(dictKeys);
// 设置表格列
let cols = columns.map(s => {
return { ...s };
@@ -178,7 +179,7 @@
// 不显示操作
cols = cols.filter(s => s.dataIndex !== 'handle');
}
logColumns.value = cols;
tableColumns.value = cols;
// 加载数据
fetchTableData();
});

View File

@@ -42,6 +42,11 @@
</template>
</a-button>
</a-popconfirm>
<!-- 调整 -->
<table-adjust :columns="columns"
:columns-hook="columnsHook"
:query-order="queryOrder"
@query="fetchTableData" />
</a-space>
</div>
</template>
@@ -51,7 +56,7 @@
ref="tableRef"
:loading="loading"
:row-selection="rowSelection"
:columns="columns"
:columns="tableColumns"
:data="tableRenderData"
:pagination="pagination"
:bordered="false"
@@ -140,21 +145,26 @@
<script lang="ts" setup>
import type { OperatorLogQueryRequest, OperatorLogQueryResponse } from '@/api/user/operator-log';
import { ref, reactive, onMounted } from 'vue';
import { operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey } from '../types/const';
import { TableName, operatorLogModuleKey, operatorLogTypeKey, operatorRiskLevelKey, operatorLogResultKey } from '../types/const';
import columns from '../types/table.columns';
import { copy } from '@/hooks/copy';
import useLoading from '@/hooks/loading';
import { useTablePagination, useRowSelection } from '@/hooks/table';
import { useRoute } from 'vue-router';
import { useDictStore } from '@/store';
import { useTablePagination, useRowSelection, useTableColumns } from '@/hooks/table';
import { getOperatorLogPage, deleteOperatorLog } from '@/api/user/operator-log';
import { replaceHtmlTag, clearHtmlTag } from '@/utils';
import { Message } from '@arco-design/web-vue';
import { useQueryOrder, DESC } from '@/hooks/query-order';
import OperatorLogQueryHeader from './operator-log-query-header.vue';
import TableAdjust from '@/components/app/table-adjust/index.vue';
const emits = defineEmits(['openClear', 'openDetail']);
const pagination = useTablePagination();
const rowSelection = useRowSelection();
const pagination = useTablePagination();
const queryOrder = useQueryOrder(TableName, DESC);
const { tableColumns, columnsHook } = useTableColumns(TableName, columns);
const { loading, setLoading } = useLoading();
const { getDictValue } = useDictStore();
@@ -211,11 +221,13 @@
fetchTableData();
};
defineExpose({ reload });
// 加载数据
const doFetchTableData = async (request: OperatorLogQueryRequest) => {
try {
setLoading(true);
const { data } = await getOperatorLogPage(request);
const { data } = await getOperatorLogPage(queryOrder.markOrderly(request));
tableRenderData.value = data.rows.map(s => {
return { ...s, originLogInfo: clearHtmlTag(s.logInfo) };
});
@@ -236,6 +248,11 @@
// 初始化
onMounted(() => {
const operatorType = useRoute().query.operatorType as string;
if (operatorType) {
formModel.type = operatorType;
}
// 查询数据
fetchTableData();
});

View File

@@ -2,6 +2,9 @@ import type { OperatorLogQueryResponse } from '@/api/user/operator-log';
import { pick } from 'lodash';
import { dateFormat } from '@/utils';
// 表名称
export const TableName = 'opt-log';
// 结果状态
export const ResultStatus = {
// 失败

View File

@@ -9,23 +9,27 @@ const columns = [
width: 120,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '操作模块',
dataIndex: 'module',
slotName: 'module',
width: 234,
default: true,
}, {
title: '风险等级',
dataIndex: 'riskLevel',
slotName: 'riskLevel',
width: 90,
align: 'center',
default: true,
}, {
title: '执行结果',
dataIndex: 'result',
slotName: 'result',
width: 90,
align: 'center',
default: true,
}, {
title: '操作日志',
dataIndex: 'originLogInfo',
@@ -33,6 +37,7 @@ const columns = [
minWidth: 238,
align: 'left',
ellipsis: true,
default: true,
}, {
title: '留痕地址',
dataIndex: 'address',
@@ -40,6 +45,7 @@ const columns = [
width: 156,
align: 'left',
ellipsis: true,
default: true,
}, {
title: '操作时间',
dataIndex: 'createTime',
@@ -49,6 +55,7 @@ const columns = [
render: ({ record }) => {
return dateFormat(new Date(record.createTime));
},
default: true,
}, {
title: '操作',
dataIndex: 'handle',
@@ -56,6 +63,7 @@ const columns = [
width: 128,
align: 'center',
fixed: 'right',
default: true,
},
] as TableColumnData[];

View File

@@ -68,6 +68,7 @@
id: undefined,
name: undefined,
code: undefined,
description: undefined,
};
};

View File

@@ -55,6 +55,11 @@
<icon-plus />
</template>
</a-button>
<!-- 调整 -->
<table-adjust :columns="columns"
:columns-hook="columnsHook"
:query-order="queryOrder"
@query="fetchTableData" />
</a-space>
</div>
</template>
@@ -62,7 +67,7 @@
<a-table row-key="id"
ref="tableRef"
:loading="loading"
:columns="columns"
:columns="tableColumns"
:data="tableRenderData"
:pagination="pagination"
:bordered="false"
@@ -142,16 +147,20 @@
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns';
import { RoleStatus, roleStatusKey } from '../types/const';
import { useTablePagination } from '@/hooks/table';
import { TableName, RoleStatus, roleStatusKey } from '../types/const';
import { useTablePagination, useTableColumns } from '@/hooks/table';
import usePermission from '@/hooks/permission';
import { useCacheStore, useDictStore } from '@/store';
import { AdminRoleCode } from '@/types/const';
import { useQueryOrder, ASC } from '@/hooks/query-order';
import TableAdjust from '@/components/app/table-adjust/index.vue';
const emits = defineEmits(['openAdd', 'openUpdate', 'openGrant']);
const cacheStore = useCacheStore();
const pagination = useTablePagination();
const queryOrder = useQueryOrder(TableName, ASC);
const { tableColumns, columnsHook } = useTableColumns(TableName, columns);
const { hasPermission } = usePermission();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue } = useDictStore();
@@ -203,7 +212,7 @@
const doFetchTableData = async (request: RoleQueryRequest) => {
try {
setLoading(true);
const { data } = await getRolePage(request);
const { data } = await getRolePage(queryOrder.markOrderly(request));
tableRenderData.value = data.rows;
pagination.total = data.total;
pagination.current = request.page;

View File

@@ -1,3 +1,6 @@
// 表名称
export const TableName = 'role';
// 角色状态
export const RoleStatus = {
// 停用

View File

@@ -9,6 +9,7 @@ const columns = [
width: 100,
align: 'left',
fixed: 'left',
default: true,
}, {
title: '角色名称',
dataIndex: 'name',
@@ -16,11 +17,13 @@ const columns = [
minWidth: 118,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '角色编码',
dataIndex: 'code',
slotName: 'code',
minWidth: 118,
default: true,
}, {
title: '角色描述',
dataIndex: 'description',
@@ -28,27 +31,57 @@ const columns = [
minWidth: 128,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '角色状态',
dataIndex: 'status',
slotName: 'status',
align: 'center',
width: 128,
default: true,
}, {
title: '创建时间',
dataIndex: 'createTime',
slotName: 'createTime',
width: 180,
align: 'center',
width: 180,
render: ({ record }) => {
return dateFormat(new Date(record.createTime));
},
default: true,
}, {
title: '修改时间',
dataIndex: 'updateTime',
slotName: 'updateTime',
align: 'center',
width: 180,
render: ({ record }) => {
return dateFormat(new Date(record.updateTime));
},
default: true,
}, {
title: '创建人',
dataIndex: 'creator',
slotName: 'creator',
width: 148,
ellipsis: true,
tooltip: true,
default: false,
}, {
title: '修改人',
dataIndex: 'updater',
slotName: 'updater',
width: 148,
ellipsis: true,
tooltip: true,
default: false,
}, {
title: '操作',
slotName: 'handle',
width: 198,
align: 'center',
fixed: 'right',
default: true,
},
] as TableColumnData[];

View File

@@ -89,6 +89,11 @@
</template>
</a-button>
</a-popconfirm>
<!-- 调整 -->
<table-adjust :columns="columns"
:columns-hook="columnsHook"
:query-order="queryOrder"
@query="fetchTableData" />
</a-space>
</div>
</template>
@@ -97,7 +102,7 @@
row-key="id"
ref="tableRef"
:loading="loading"
:columns="columns"
:columns="tableColumns"
:row-selection="rowSelection"
:data="tableRenderData"
:pagination="pagination"
@@ -192,19 +197,23 @@
import { batchDeleteUser, deleteUser, getUserPage, updateUserStatus } from '@/api/user/user';
import { Message } from '@arco-design/web-vue';
import columns from '../types/table.columns';
import { userStatusKey, UserStatus } from '../types/const';
import { TableName, userStatusKey, UserStatus } from '../types/const';
import useLoading from '@/hooks/loading';
import { useTablePagination, useRowSelection } from '@/hooks/table';
import { useTablePagination, useRowSelection, useTableColumns } from '@/hooks/table';
import usePermission from '@/hooks/permission';
import { useRouter } from 'vue-router';
import { useCacheStore, useDictStore, useUserStore } from '@/store';
import { copy } from '@/hooks/copy';
import { useQueryOrder, ASC } from '@/hooks/query-order';
import TableAdjust from '@/components/app/table-adjust/index.vue';
const emits = defineEmits(['openAdd', 'openUpdate', 'openResetPassword', 'openGrantRole']);
const emits = defineEmits(['openAdd', 'openUpdate', 'openImport', 'openExport', 'openResetPassword', 'openGrantRole']);
const cacheStore = useCacheStore();
const pagination = useTablePagination();
const rowSelection = useRowSelection();
const pagination = useTablePagination();
const queryOrder = useQueryOrder(TableName, ASC);
const { tableColumns, columnsHook } = useTableColumns(TableName, columns);
const { hasPermission } = usePermission();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue } = useDictStore();
@@ -218,7 +227,6 @@
username: undefined,
password: undefined,
nickname: undefined,
avatar: undefined,
mobile: undefined,
email: undefined,
status: undefined,
@@ -287,7 +295,7 @@
const doFetchTableData = async (request: UserQueryRequest) => {
try {
setLoading(true);
const { data } = await getUserPage(request);
const { data } = await getUserPage(queryOrder.markOrderly(request));
tableRenderData.value = data.rows;
pagination.total = data.total;
pagination.current = request.page;

View File

@@ -1,3 +1,6 @@
// 表名称
export const TableName = 'user';
// 用户状态
export const UserStatus = {
// 禁用

View File

@@ -9,6 +9,7 @@ const columns = [
width: 68,
align: 'left',
fixed: 'left',
default: true,
}, {
title: '用户名',
dataIndex: 'username',
@@ -16,6 +17,7 @@ const columns = [
minWidth: 138,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '花名',
dataIndex: 'nickname',
@@ -23,6 +25,7 @@ const columns = [
minWidth: 138,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '手机号',
dataIndex: 'mobile',
@@ -30,6 +33,7 @@ const columns = [
minWidth: 88,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '邮箱',
dataIndex: 'email',
@@ -37,6 +41,7 @@ const columns = [
minWidth: 88,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '用户描述',
dataIndex: 'description',
@@ -44,12 +49,14 @@ const columns = [
minWidth: 128,
ellipsis: true,
tooltip: true,
default: true,
}, {
title: '用户状态',
dataIndex: 'status',
slotName: 'status',
align: 'center',
width: 128,
default: true,
}, {
title: '最后登录时间',
dataIndex: 'lastLoginTime',
@@ -59,12 +66,50 @@ const columns = [
render: ({ record }) => {
return record.lastLoginTime && dateFormat(new Date(record.lastLoginTime));
},
default: true,
}, {
title: '创建时间',
dataIndex: 'createTime',
slotName: 'createTime',
align: 'center',
width: 180,
render: ({ record }) => {
return dateFormat(new Date(record.createTime));
},
default: true,
}, {
title: '修改时间',
dataIndex: 'updateTime',
slotName: 'updateTime',
align: 'center',
width: 180,
render: ({ record }) => {
return dateFormat(new Date(record.updateTime));
},
default: false,
}, {
title: '创建人',
dataIndex: 'creator',
slotName: 'creator',
width: 148,
ellipsis: true,
tooltip: true,
default: false,
}, {
title: '修改人',
dataIndex: 'updater',
slotName: 'updater',
width: 148,
ellipsis: true,
tooltip: true,
default: false,
}, {
title: '操作',
slotName: 'handle',
width: 298,
align: 'center',
fixed: 'right',
default: true,
},
] as TableColumnData[];