+
= ({
setIsModalVisible(false)}
- taskInfo={taskInfo}
+ logInfo={logInfo}
/>
);
diff --git a/web/src/pages/dataset/dataset/dataset-table.tsx b/web/src/pages/dataset/dataset/dataset-table.tsx
index 2182ec2d6..524a8ba14 100644
--- a/web/src/pages/dataset/dataset/dataset-table.tsx
+++ b/web/src/pages/dataset/dataset/dataset-table.tsx
@@ -29,6 +29,8 @@ import { useFetchDocumentList } from '@/hooks/use-document-request';
import { getExtension } from '@/utils/document-util';
import { pick } from 'lodash';
import { useMemo } from 'react';
+import ProcessLogModal from '../process-log-modal';
+import { useShowLog } from './hooks';
import { SetMetaDialog } from './set-meta-dialog';
import { useChangeDocumentParser } from './use-change-document-parser';
import { useDatasetTableColumns } from './use-dataset-table-columns';
@@ -81,11 +83,13 @@ export function DatasetTable({
onSetMetaModalOk,
metaRecord,
} = useSaveMeta();
+ const { showLog, logInfo, logVisible, hideLog } = useShowLog(documents);
const columns = useDatasetTableColumns({
showChangeParserModal,
showRenameModal,
showSetMetaModal,
+ showLog,
});
const currentPagination = useMemo(() => {
@@ -207,6 +211,13 @@ export function DatasetTable({
initialMetaData={metaRecord.meta_fields}
>
)}
+ {logVisible && (
+
hideLog()}
+ logInfo={logInfo}
+ />
+ )}
);
}
diff --git a/web/src/pages/dataset/dataset/generate-button/generate.tsx b/web/src/pages/dataset/dataset/generate-button/generate.tsx
new file mode 100644
index 000000000..7b3fe75ae
--- /dev/null
+++ b/web/src/pages/dataset/dataset/generate-button/generate.tsx
@@ -0,0 +1,113 @@
+import { IconFontFill } from '@/components/icon-font';
+import { Button } from '@/components/ui/button';
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import { toFixed } from '@/utils/common-util';
+import { t } from 'i18next';
+import { lowerFirst } from 'lodash';
+import { CirclePause, WandSparkles } from 'lucide-react';
+import { useState } from 'react';
+import { generateStatus, useFetchGenerateData } from './hook';
+
+const MenuItem: React.FC<{ name: 'KnowledgeGraph' | 'Raptor' }> = ({
+ name,
+}) => {
+ console.log(name, 'pppp');
+ const iconKeyMap = {
+ KnowledgeGraph: 'knowledgegraph',
+ Raptor: 'dataflow-01',
+ };
+ const {
+ data: { percent, type },
+ pauseGenerate,
+ } = useFetchGenerateData();
+ return (
+
+
+
+ {t(`knowledgeDetails.${lowerFirst(name)}`)}
+
+ {type === generateStatus.start && (
+
+ {t(`knowledgeDetails.generate${name}`)}
+
+ )}
+ {type === generateStatus.running && (
+
+
+
{toFixed(percent) as string}%
+
{
+ pauseGenerate();
+ }}
+ >
+
+
+
+ )}
+
+ );
+};
+
+const Generate: React.FC = () => {
+ const [open, setOpen] = useState(false);
+
+ const handleOpenChange = (isOpen: boolean) => {
+ setOpen(isOpen);
+ console.log('Dropdown is now', isOpen ? 'open' : 'closed');
+ };
+
+ return (
+
+
+
+
+
+
+ {
+ e.preventDefault();
+ }}
+ onClick={(e) => {
+ e.stopPropagation();
+ }}
+ >
+
+
+ {
+ e.preventDefault();
+ }}
+ onClick={(e) => {
+ e.stopPropagation();
+ }}
+ >
+
+
+
+
+
+ );
+};
+
+export default Generate;
diff --git a/web/src/pages/dataset/dataset/generate-button/hook.ts b/web/src/pages/dataset/dataset/generate-button/hook.ts
new file mode 100644
index 000000000..0be24a60d
--- /dev/null
+++ b/web/src/pages/dataset/dataset/generate-button/hook.ts
@@ -0,0 +1,32 @@
+import { useQuery } from '@tanstack/react-query';
+import { useCallback } from 'react';
+export const generateStatus = {
+ running: 'running',
+ completed: 'completed',
+ start: 'start',
+};
+const useFetchGenerateData = () => {
+ let number = 10;
+ // TODO: 获取数据
+ const { data, isFetching: loading } = useQuery({
+ queryKey: ['generateData', 'id'],
+ initialData: { id: 0, percent: 0, type: 'running' },
+ gcTime: 0,
+ refetchInterval: 3000,
+ queryFn: async () => {
+ number += Math.random() * 10;
+ const data = {
+ id: Math.random(),
+ percent: number,
+ type: generateStatus.running,
+ };
+ return data;
+ },
+ });
+ const pauseGenerate = useCallback(() => {
+ // TODO: pause generate
+ console.log('pause generate');
+ }, []);
+ return { data, loading, pauseGenerate };
+};
+export { useFetchGenerateData };
diff --git a/web/src/pages/dataset/dataset/generate.tsx b/web/src/pages/dataset/dataset/generate.tsx
deleted file mode 100644
index 6dad4d56f..000000000
--- a/web/src/pages/dataset/dataset/generate.tsx
+++ /dev/null
@@ -1,68 +0,0 @@
-import SvgIcon from '@/components/svg-icon';
-import { Button } from '@/components/ui/button';
-import {
- DropdownMenu,
- DropdownMenuContent,
- DropdownMenuItem,
- DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu';
-import { t } from 'i18next';
-import { lowerFirst, toLower } from 'lodash';
-import { WandSparkles } from 'lucide-react';
-
-const MenuItem: React.FC<{ name: 'KnowledgeGraph' | 'Raptor' }> = ({
- name,
-}) => {
- console.log(name, 'pppp');
- return (
-
-
-
- {t(`knowledgeDetails.${lowerFirst(name)}`)}
-
-
- {t(`knowledgeDetails.generate${name}`)}
-
-
- );
-};
-
-const Generate: React.FC = () => {
- return (
-
-
-
-
-
-
-
-
-
- {
- e.preventDefault();
- }}
- onClick={(e) => {
- e.stopPropagation();
- }}
- >
-
- {/*
-
-
- {t('knowledgeDetails.raptor')}
-
-
{t('knowledgeDetails.generateRaptor')}
-
*/}
-
-
-
-
- );
-};
-
-export default Generate;
diff --git a/web/src/pages/dataset/dataset/hooks.ts b/web/src/pages/dataset/dataset/hooks.ts
index 1613f9cc9..5b44722cf 100644
--- a/web/src/pages/dataset/dataset/hooks.ts
+++ b/web/src/pages/dataset/dataset/hooks.ts
@@ -1,8 +1,10 @@
import { useSetModalState } from '@/hooks/common-hooks';
import { useNextWebCrawl } from '@/hooks/document-hooks';
import { useGetKnowledgeSearchParams } from '@/hooks/route-hook';
-import { useCallback, useState } from 'react';
+import { IDocumentInfo } from '@/interfaces/database/document';
+import { useCallback, useMemo, useState } from 'react';
import { useNavigate } from 'umi';
+import { ILogInfo } from '../process-log-modal';
export const useNavigateToOtherPage = () => {
const navigate = useNavigate();
@@ -58,3 +60,41 @@ export const useHandleWebCrawl = () => {
showWebCrawlUploadModal,
};
};
+
+export const useShowLog = (documents: IDocumentInfo[]) => {
+ const { showModal, hideModal, visible } = useSetModalState();
+ const [record, setRecord] = useState
();
+ const logInfo = useMemo(() => {
+ const findRecord = documents.find(
+ (item: IDocumentInfo) => item.id === record?.id,
+ );
+ let log: ILogInfo = {
+ taskId: record?.id,
+ fileName: record?.name || '-',
+ details: record?.progress_msg || '-',
+ };
+ if (findRecord) {
+ log = {
+ taskId: findRecord.id,
+ fileName: findRecord.name,
+ fileSize: findRecord.size + '',
+ source: findRecord.source_type,
+ task: findRecord.status,
+ state: findRecord.run,
+ startTime: findRecord.process_begin_at,
+ endTime: findRecord.process_begin_at,
+ duration: findRecord.process_duration + 's',
+ details: findRecord.progress_msg,
+ };
+ }
+ return log;
+ }, [record, documents]);
+ const showLog = useCallback(
+ (data: IDocumentInfo) => {
+ setRecord(data);
+ showModal();
+ },
+ [showModal],
+ );
+ return { showLog, hideLog: hideModal, logVisible: visible, logInfo };
+};
diff --git a/web/src/pages/dataset/dataset/index.tsx b/web/src/pages/dataset/dataset/index.tsx
index f7752c5c3..c3c63d6aa 100644
--- a/web/src/pages/dataset/dataset/index.tsx
+++ b/web/src/pages/dataset/dataset/index.tsx
@@ -15,7 +15,7 @@ import { useFetchDocumentList } from '@/hooks/use-document-request';
import { Upload } from 'lucide-react';
import { useTranslation } from 'react-i18next';
import { DatasetTable } from './dataset-table';
-import Generate from './generate';
+import Generate from './generate-button/generate';
import { useBulkOperateDataset } from './use-bulk-operate-dataset';
import { useCreateEmptyDocument } from './use-create-empty-document';
import { useSelectDatasetFilters } from './use-select-filters';
diff --git a/web/src/pages/dataset/dataset/parsing-card.tsx b/web/src/pages/dataset/dataset/parsing-card.tsx
index d9cdefec3..17bc857f6 100644
--- a/web/src/pages/dataset/dataset/parsing-card.tsx
+++ b/web/src/pages/dataset/dataset/parsing-card.tsx
@@ -11,6 +11,7 @@ import { RunningStatus, RunningStatusMap } from './constant';
interface IProps {
record: IDocumentInfo;
+ handleShowLog?: (record: IDocumentInfo) => void;
}
function Dot({ run }: { run: RunningStatus }) {
@@ -85,11 +86,16 @@ export const PopoverContent = ({ record }: IProps) => {
);
};
-export function ParsingCard({ record }: IProps) {
+export function ParsingCard({ record, handleShowLog }: IProps) {
return (
-
diff --git a/web/src/pages/dataset/dataset/parsing-status-cell.tsx b/web/src/pages/dataset/dataset/parsing-status-cell.tsx
index 8ada0b09d..8743e35b0 100644
--- a/web/src/pages/dataset/dataset/parsing-status-cell.tsx
+++ b/web/src/pages/dataset/dataset/parsing-status-cell.tsx
@@ -1,4 +1,5 @@
import { ConfirmDeleteDialog } from '@/components/confirm-delete-dialog';
+import { IconFontFill } from '@/components/icon-font';
import { Button } from '@/components/ui/button';
import {
DropdownMenu,
@@ -14,7 +15,7 @@ import {
import { Progress } from '@/components/ui/progress';
import { Separator } from '@/components/ui/separator';
import { IDocumentInfo } from '@/interfaces/database/document';
-import { CircleX, RefreshCw } from 'lucide-react';
+import { CircleX } from 'lucide-react';
import { useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { DocumentType, RunningStatus } from './constant';
@@ -28,16 +29,26 @@ const IconMap = {
),
[RunningStatus.RUNNING]: ,
- [RunningStatus.CANCEL]: ,
- [RunningStatus.DONE]: ,
- [RunningStatus.FAIL]: ,
+ [RunningStatus.CANCEL]: (
+
+ ),
+ [RunningStatus.DONE]: (
+
+ ),
+ [RunningStatus.FAIL]: (
+
+ ),
};
export function ParsingStatusCell({
record,
showChangeParserModal,
showSetMetaModal,
-}: { record: IDocumentInfo } & UseChangeDocumentParserShowType &
+ showLog,
+}: {
+ record: IDocumentInfo;
+ showLog: (record: IDocumentInfo) => void;
+} & UseChangeDocumentParserShowType &
UseSaveMetaShowType) {
const { t } = useTranslation();
const { run, parser_id, progress, chunk_num, id } = record;
@@ -65,6 +76,9 @@ export function ParsingStatusCell({
return record.type !== DocumentType.Virtual;
}, [record]);
+ const handleShowLog = (record: IDocumentInfo) => {
+ showLog(record);
+ };
return (
@@ -85,41 +99,64 @@ export function ParsingStatusCell({
{showParse && (
- <>
-
- {}
- }
+
+
+ {!isParserRunning(run) && (
+
-
- {operationIcon}
-
-
- {isParserRunning(run) ? (
-
-
-
-
-
-
-
-
- ) : (
-
+
{}
+ }
+ >
+ {!isParserRunning(run) && operationIcon}
+
+
)}
- >
+ {isParserRunning(run) ? (
+ <>
+
+
+ handleShowLog(record)}
+ >
+
+ {p}%
+
+
+
+
+
+
+
{}
+ }
+ >
+ {operationIcon}
+
+ >
+ ) : (
+
+ )}
+
)}
);
diff --git a/web/src/pages/dataset/dataset/use-dataset-table-columns.tsx b/web/src/pages/dataset/dataset/use-dataset-table-columns.tsx
index fc492db13..762264b0c 100644
--- a/web/src/pages/dataset/dataset/use-dataset-table-columns.tsx
+++ b/web/src/pages/dataset/dataset/use-dataset-table-columns.tsx
@@ -23,12 +23,13 @@ import { UseSaveMetaShowType } from './use-save-meta';
type UseDatasetTableColumnsType = UseChangeDocumentParserShowType &
UseRenameDocumentShowType &
- UseSaveMetaShowType;
+ UseSaveMetaShowType & { showLog: (record: IDocumentInfo) => void };
export function useDatasetTableColumns({
showChangeParserModal,
showRenameModal,
showSetMetaModal,
+ showLog,
}: UseDatasetTableColumnsType) {
const { t } = useTranslation('translation', {
keyPrefix: 'knowledgeDetails',
@@ -151,6 +152,7 @@ export function useDatasetTableColumns({
record={row.original}
showChangeParserModal={showChangeParserModal}
showSetMetaModal={showSetMetaModal}
+ showLog={showLog}
>
);
},
diff --git a/web/src/pages/datasets/process-log-modal.tsx b/web/src/pages/dataset/process-log-modal.tsx
similarity index 50%
rename from web/src/pages/datasets/process-log-modal.tsx
rename to web/src/pages/dataset/process-log-modal.tsx
index 4d7315cd5..4a8f6ccd2 100644
--- a/web/src/pages/datasets/process-log-modal.tsx
+++ b/web/src/pages/dataset/process-log-modal.tsx
@@ -4,22 +4,23 @@ import { Modal } from '@/components/ui/modal/modal';
import { useTranslate } from '@/hooks/common-hooks';
import React from 'react';
import reactStringReplace from 'react-string-replace';
+export interface ILogInfo {
+ taskId?: string;
+ fileName: string;
+ fileSize?: string;
+ source?: string;
+ task?: string;
+ state?: 'Running' | 'Success' | 'Failed' | 'Pending';
+ startTime?: string;
+ endTime?: string;
+ duration?: string;
+ details: string;
+}
interface ProcessLogModalProps {
visible: boolean;
onCancel: () => void;
- taskInfo: {
- taskId: string;
- fileName: string;
- fileSize: string;
- source: string;
- task: string;
- state: 'Running' | 'Success' | 'Failed' | 'Pending';
- startTime: string;
- endTime?: string;
- duration?: string;
- details: string;
- };
+ logInfo: ILogInfo;
}
const InfoItem: React.FC<{
@@ -38,9 +39,10 @@ const InfoItem: React.FC<{
const ProcessLogModal: React.FC = ({
visible,
onCancel,
- taskInfo,
+ logInfo,
}) => {
const { t } = useTranslate('knowledgeDetails');
+ const blackKeyList = [''];
const replaceText = (text: string) => {
// Remove duplicate \n
const nextText = text.replace(/(\n)\1+/g, '$1');
@@ -71,47 +73,57 @@ const ProcessLogModal: React.FC = ({
}
className="process-log-modal"
>
-
-
- {/* Left Column */}
-
-
-
-
-
-
-
-
- {/* Right Column */}
-
-
-
Status
-
-
+
+
+ {Object.keys(logInfo).map((key) => {
+ if (blackKeyList.includes(key)) {
+ return null;
+ }
+ if (key === 'details') {
+ return (
+
+
+ {replaceText(logInfo.details)}
+
+ }
+ />
+
+ );
+ }
+ if (key === 'Status') {
+ return (
+
+ );
+ }
+ return (
+
+
-
-
-
-
-
-
-
-
+ );
+ })}
- {/*
*/}
-
*/}
);
diff --git a/web/src/routes.ts b/web/src/routes.ts
index c82f54c70..b09eceae9 100644
--- a/web/src/routes.ts
+++ b/web/src/routes.ts
@@ -287,7 +287,7 @@ const routes = [
],
},
{
- path: `${Routes.DataflowResult}/:id`,
+ path: `${Routes.DataflowResult}`,
layout: false,
component: `@/pages${Routes.DataflowResult}`,
},