refactor(system): 优化日志列表组件
- 移除自定义 ID 列,使用 Arco Design 的 rowSelection 功能替代- 添加 rowSelection 配置,实现全选和单选功能- 优化代码结构,提高可维护性
This commit is contained in:
parent
ab6c1c63cd
commit
b3e4a11a7b
@ -98,17 +98,11 @@
|
||||
:data="renderData"
|
||||
:bordered="false"
|
||||
:size="size"
|
||||
:row-selection="rowSelection"
|
||||
style="margin-bottom: 40px"
|
||||
@select="select"
|
||||
@page-change="onPageChange"
|
||||
>
|
||||
<template #id="{ record }">
|
||||
<a-checkbox
|
||||
v-model="selectedIds"
|
||||
:value="record.id"
|
||||
style="margin-left: -5px"
|
||||
>
|
||||
</a-checkbox>
|
||||
</template>
|
||||
<template #operationTime="{ record }">
|
||||
{{ dayjs(record.operationTime).format('YYYY-MM-DD HH:mm') }}
|
||||
</template>
|
||||
@ -128,7 +122,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, onMounted, ref, watch } from 'vue';
|
||||
import { computed, onMounted, reactive, ref, watch } from 'vue';
|
||||
import useLoading from '@/hooks/loading';
|
||||
import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
|
||||
import useTableOption from '@/hooks/table-option';
|
||||
@ -154,12 +148,6 @@
|
||||
const { cloneColumns, size, deepClone } = useTableOption();
|
||||
|
||||
const columns = computed<TableColumnData[]>(() => [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: 'id',
|
||||
slotName: 'id',
|
||||
width: 60,
|
||||
},
|
||||
{
|
||||
title: '模块类型',
|
||||
dataIndex: 'moduleType',
|
||||
@ -185,6 +173,14 @@
|
||||
// dataIndex: 'operation',
|
||||
// },
|
||||
]);
|
||||
const rowSelection = {
|
||||
type: 'checkbox',
|
||||
showCheckedAll: true, // 默认选中的行 ID
|
||||
};
|
||||
|
||||
const select= (selectedRowKeys: number[]) => {
|
||||
selectedIds.value = selectedRowKeys;
|
||||
};
|
||||
|
||||
// 获取日志列表
|
||||
const fetchData = async (params = { size: 10, current: 1 }) => {
|
||||
|
Loading…
Reference in New Issue
Block a user