93 lines
2.6 KiB
TypeScript
93 lines
2.6 KiB
TypeScript
/*
|
|
* @Author: ZhaoYing
|
|
* @Date: 2026-03-24 15:41:20
|
|
* @Last Modified by: ZhaoYing
|
|
* @Last Modified time: 2026-03-25 16:20:32
|
|
*/
|
|
import { type FC, useRef } from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { useParams } from 'react-router-dom';
|
|
import { Flex, Button, Form } from 'antd';
|
|
import type { ColumnsType } from 'antd/es/table';
|
|
|
|
import { getAppLogsUrl } from '@/api/application';
|
|
import Table from '@/components/Table'
|
|
import { formatDateTime } from '@/utils/format';
|
|
import type { LogItem, LogDetailModalRef } from './types'
|
|
import LogDetailModal from './components/LogDetailModal'
|
|
import SearchInput from '@/components/SearchInput'
|
|
|
|
const Statistics: FC = () => {
|
|
const { t } = useTranslation();
|
|
const { id } = useParams();
|
|
const logDetailRef = useRef<LogDetailModalRef>(null);
|
|
const [form] = Form.useForm();
|
|
const values = Form.useWatch([], form);
|
|
|
|
const handleViewDetail = (item: LogItem) => {
|
|
logDetailRef.current?.handleOpen(item);
|
|
}
|
|
|
|
/** Table column configuration */
|
|
const columns: ColumnsType<LogItem> = [
|
|
{
|
|
title: t('application.logTitle'),
|
|
dataIndex: 'title',
|
|
key: 'title',
|
|
className: 'rb:text-[#212332]'
|
|
},
|
|
{
|
|
title: t('application.created_at'),
|
|
dataIndex: 'created_at',
|
|
key: 'created_at',
|
|
render: (createdAt: string) => formatDateTime(createdAt, 'YYYY-MM-DD HH:mm:ss'),
|
|
},
|
|
{
|
|
title: t('common.updated_at'),
|
|
dataIndex: 'updated_at',
|
|
key: 'updated_at',
|
|
render: (updatedAt: string) => updatedAt ? formatDateTime(updatedAt, 'YYYY-MM-DD HH:mm:ss') : '-',
|
|
},
|
|
{
|
|
title: t('common.operation'),
|
|
key: 'action',
|
|
render: (_, record) => (
|
|
<Flex wrap>
|
|
<Button
|
|
type="link"
|
|
onClick={() => handleViewDetail(record as LogItem)}
|
|
>
|
|
{t('common.view')}
|
|
</Button>
|
|
</Flex>
|
|
),
|
|
},
|
|
];
|
|
return (
|
|
<div className="rb:bg-white rb:rounded-lg rb:pt-3 rb:px-3">
|
|
<Flex justify="flex-end" className="rb:mb-3!">
|
|
<Form form={form}>
|
|
<Form.Item name="keyword" noStyle>
|
|
<SearchInput
|
|
placeholder={t('application.logSearchPlaceholder')}
|
|
variant="outlined"
|
|
/>
|
|
</Form.Item>
|
|
</Form>
|
|
</Flex>
|
|
<Table<LogItem>
|
|
apiUrl={getAppLogsUrl(id || '')}
|
|
apiParams={{
|
|
is_draft: false,
|
|
...(values ?? {})
|
|
}}
|
|
columns={columns}
|
|
rowKey="id"
|
|
isScroll={true}
|
|
scrollY="calc(100vh - 242px)"
|
|
/>
|
|
<LogDetailModal ref={logDetailRef} />
|
|
</div>
|
|
);
|
|
}
|
|
export default Statistics; |