mirror of
https://github.com/infiniflow/ragflow.git
synced 2026-01-03 02:55:29 +08:00
### 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:
@ -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>
|
||||
|
||||
@ -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"
|
||||
|
||||
Reference in New Issue
Block a user