feat: 操作日志

src/pages/system/log/operate/index.tsx

@@ -1,5 +1,70 @@
+import type { ActionType, ProColumns } from '@ant-design/pro-components';
+import React, { useRef } from 'react';
+import EnhancedProTable from '@/components/EnhancedProTable';
+import ModalDescriptions, {
+  type DescriptionsFormRef,
+} from '@/components/ModalDescriptions';
+import {
+  getOperateLogPage,
+  type OperateLogVO,
+} from '@/services/system/log/operate';
+import { baseTenantColumns, descriptionsColumns } from './config';
+
 const SyStemLogOperate = () => {
-  return <>SyStemLogOperate</>;
+  const tableRef = useRef<ActionType>(null);
+  const descriptionsRef = useRef<DescriptionsFormRef>(null);
+  const onFetch = async (
+    params: OperateLogVO & {
+      pageSize?: number;
+      current?: number;
+    },
+  ) => {
+    const data = await getOperateLogPage({
+      ...params,
+      pageNo: params.current,
+      pageSize: params.pageSize,
+    });
+    return {
+      data: data.list,
+      success: true,
+      total: data.total,
+    };
+  };
+
+  const handleDetail = (record: OperateLogVO) => {
+    descriptionsRef.current?.open(record);
+  };
+
+  const actionColumns: ProColumns<OperateLogVO> = {
+    title: '操作',
+    dataIndex: 'option',
+    valueType: 'option',
+    fixed: 'right',
+    width: 80,
+    render: (text: React.ReactNode, record: OperateLogVO) => [
+      <a key="editable" onClick={() => handleDetail(record)}>
+        详情
+      </a>,
+    ],
+  };
+  const columns = [...baseTenantColumns, actionColumns];
+  return (
+    <>
+      <EnhancedProTable<OperateLogVO>
+        ref={tableRef}
+        columns={columns}
+        request={onFetch}
+        headerTitle="操作日志"
+        showIndex={false}
+        showSelection={false}
+      />
+      <ModalDescriptions
+        ref={descriptionsRef}
+        title="操作日志详情"
+        columns={descriptionsColumns()}
+      />
+    </>
+  );
 };
 
-export default SyStemLogOperate;
+export default React.memo(SyStemLogOperate);