fix: Added dataset generation logging functionality #9869 (#10180)

### What problem does this PR solve?

fix: Added dataset generation logging functionality #9869

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
This commit is contained in:
chanx
2025-09-22 10:01:34 +08:00
committed by GitHub
parent d050ef568d
commit d039d1e73d
15 changed files with 491 additions and 119 deletions

View File

@ -2,7 +2,7 @@ import SvgIcon from '@/components/svg-icon';
import { useIsDarkTheme } from '@/components/theme-provider';
import { parseColorToRGBA } from '@/utils/common-util';
import { CircleQuestionMark } from 'lucide-react';
import { FC, useMemo, useState } from 'react';
import { FC, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { LogTabs } from './dataset-common';
import { DatasetFilter } from './dataset-filter';
@ -74,25 +74,35 @@ const FileLogsPage: FC = () => {
const [active, setActive] = useState<(typeof LogTabs)[keyof typeof LogTabs]>(
LogTabs.FILE_LOGS,
);
const topMockData = {
const [topAllData, setTopAllData] = useState({
totalFiles: {
value: 2827,
precent: 12.5,
value: 0,
precent: 0,
},
downloads: {
value: 28,
success: 8,
failed: 2,
value: 0,
success: 0,
failed: 0,
},
processing: {
value: 156,
success: 8,
failed: 2,
value: 0,
success: 0,
failed: 0,
},
};
});
const { data: topData } = useFetchOverviewTital();
console.log('topData --> ', topData);
useEffect(() => {
setTopAllData({
...topAllData,
processing: {
value: topData?.processing || 0,
success: topData?.finished || 0,
failed: topData?.failed || 0,
},
});
}, [topData, topAllData]);
const mockData = useMemo(() => {
if (active === LogTabs.FILE_LOGS) {
@ -161,7 +171,7 @@ const FileLogsPage: FC = () => {
<div className="grid grid-cols-3 md:grid-cols-3 gap-4 mb-6">
<StatCard
title="Total Files"
value={topMockData.totalFiles.value}
value={topAllData.totalFiles.value}
icon={
isDark ? (
<SvgIcon name="data-flow/total-files-icon" width={40} />
@ -172,15 +182,15 @@ const FileLogsPage: FC = () => {
>
<div>
<span className="text-accent-primary">
{topMockData.totalFiles.precent > 0 ? '+' : ''}
{topMockData.totalFiles.precent}%{' '}
{topAllData.totalFiles.precent > 0 ? '+' : ''}
{topAllData.totalFiles.precent}%{' '}
</span>
from last week
</div>
</StatCard>
<StatCard
title="Downloading"
value={topMockData.downloads.value}
value={topAllData.downloads.value}
icon={
isDark ? (
<SvgIcon name="data-flow/data-icon" width={40} />
@ -190,13 +200,13 @@ const FileLogsPage: FC = () => {
}
>
<CardFooterProcess
success={topMockData.downloads.success}
failed={topMockData.downloads.failed}
success={topAllData.downloads.success}
failed={topAllData.downloads.failed}
/>
</StatCard>
<StatCard
title="Processing"
value={topMockData.processing.value}
value={topAllData.processing.value}
icon={
isDark ? (
<SvgIcon name="data-flow/processing-icon" width={40} />
@ -206,8 +216,8 @@ const FileLogsPage: FC = () => {
}
>
<CardFooterProcess
success={topMockData.processing.success}
failed={topMockData.processing.failed}
success={topAllData.processing.success}
failed={topAllData.processing.failed}
/>
</StatCard>
</div>

View File

@ -65,25 +65,25 @@ export const getFileLogsTableColumns = (
) => {
// const { t } = useTranslate('knowledgeDetails');
const columns: ColumnDef<DocumentLog>[] = [
{
id: 'select',
header: ({ table }) => (
<input
type="checkbox"
checked={table.getIsAllRowsSelected()}
onChange={table.getToggleAllRowsSelectedHandler()}
className="rounded bg-gray-900 text-blue-500 focus:ring-blue-500"
/>
),
cell: ({ row }) => (
<input
type="checkbox"
checked={row.getIsSelected()}
onChange={row.getToggleSelectedHandler()}
className="rounded border-gray-600 bg-gray-900 text-blue-500 focus:ring-blue-500"
/>
),
},
// {
// id: 'select',
// header: ({ table }) => (
// <input
// type="checkbox"
// checked={table.getIsAllRowsSelected()}
// onChange={table.getToggleAllRowsSelectedHandler()}
// className="rounded bg-gray-900 text-blue-500 focus:ring-blue-500"
// />
// ),
// cell: ({ row }) => (
// <input
// type="checkbox"
// checked={row.getIsSelected()}
// onChange={row.getToggleSelectedHandler()}
// className="rounded border-gray-600 bg-gray-900 text-blue-500 focus:ring-blue-500"
// />
// ),
// },
{
accessorKey: 'id',
header: 'ID',
@ -156,7 +156,7 @@ export const getFileLogsTableColumns = (
id: 'operations',
header: t('operations'),
cell: ({ row }) => (
<div className="flex justify-start space-x-2">
<div className="flex justify-start space-x-2 opacity-0 group-hover:opacity-100 transition-opacity">
<Button
variant="ghost"
size="sm"
@ -189,25 +189,25 @@ export const getDatasetLogsTableColumns = (
) => {
// const { t } = useTranslate('knowledgeDetails');
const columns: ColumnDef<DocumentLog>[] = [
{
id: 'select',
header: ({ table }) => (
<input
type="checkbox"
checked={table.getIsAllRowsSelected()}
onChange={table.getToggleAllRowsSelectedHandler()}
className="rounded bg-gray-900 text-blue-500 focus:ring-blue-500"
/>
),
cell: ({ row }) => (
<input
type="checkbox"
checked={row.getIsSelected()}
onChange={row.getToggleSelectedHandler()}
className="rounded border-gray-600 bg-gray-900 text-blue-500 focus:ring-blue-500"
/>
),
},
// {
// id: 'select',
// header: ({ table }) => (
// <input
// type="checkbox"
// checked={table.getIsAllRowsSelected()}
// onChange={table.getToggleAllRowsSelectedHandler()}
// className="rounded bg-gray-900 text-blue-500 focus:ring-blue-500"
// />
// ),
// cell: ({ row }) => (
// <input
// type="checkbox"
// checked={row.getIsSelected()}
// onChange={row.getToggleSelectedHandler()}
// className="rounded border-gray-600 bg-gray-900 text-blue-500 focus:ring-blue-500"
// />
// ),
// },
{
accessorKey: 'id',
header: 'ID',
@ -251,7 +251,7 @@ export const getDatasetLogsTableColumns = (
id: 'operations',
header: t('operations'),
cell: ({ row }) => (
<div className="flex justify-start space-x-2">
<div className="flex justify-start space-x-2 opacity-0 group-hover:opacity-100 transition-opacity">
<Button
variant="ghost"
size="sm"