diff --git a/web/src/pages/file-manager/folder-create-modal/index.tsx b/web/src/pages/file-manager/folder-create-modal/index.tsx
index 518ddb1c91..d336a01b4b 100644
--- a/web/src/pages/file-manager/folder-create-modal/index.tsx
+++ b/web/src/pages/file-manager/folder-create-modal/index.tsx
@@ -21,24 +21,12 @@ const FolderCreateModal = ({ visible, hideModal, loading, onOk }: IProps) => {
return onOk(ret.name);
};
- const handleCancel = () => {
- hideModal();
- };
-
- const onFinish = (values: any) => {
- console.log('Success:', values);
- };
-
- const onFinishFailed = (errorInfo: any) => {
- console.log('Failed:', errorInfo);
- };
-
return (
@@ -47,8 +35,6 @@ const FolderCreateModal = ({ visible, hideModal, loading, onOk }: IProps) => {
labelCol={{ span: 4 }}
wrapperCol={{ span: 20 }}
style={{ maxWidth: 600 }}
- onFinish={onFinish}
- onFinishFailed={onFinishFailed}
autoComplete="off"
form={form}
>
diff --git a/web/src/pages/file-manager/hooks.ts b/web/src/pages/file-manager/hooks.ts
index 3983ff873d..6be87c3664 100644
--- a/web/src/pages/file-manager/hooks.ts
+++ b/web/src/pages/file-manager/hooks.ts
@@ -4,6 +4,7 @@ import {
useCreateFolder,
useDeleteFile,
useFetchParentFolderList,
+ useMoveFile,
useRenameFile,
useUploadFile,
} from '@/hooks/file-manager-hooks';
@@ -246,3 +247,48 @@ export const useHandleBreadcrumbClick = () => {
return { handleBreadcrumbClick };
};
+
+export const useHandleMoveFile = (
+ setSelectedRowKeys: (keys: string[]) => void,
+) => {
+ const {
+ visible: moveFileVisible,
+ hideModal: hideMoveFileModal,
+ showModal: showMoveFileModal,
+ } = useSetModalState();
+ const { moveFile, loading } = useMoveFile();
+ const [sourceFileIds, setSourceFileIds] = useState([]);
+
+ const onMoveFileOk = useCallback(
+ async (targetFolderId: string) => {
+ const ret = await moveFile({
+ src_file_ids: sourceFileIds,
+ dest_file_id: targetFolderId,
+ });
+
+ if (ret === 0) {
+ setSelectedRowKeys([]);
+ hideMoveFileModal();
+ }
+ return ret;
+ },
+ [moveFile, hideMoveFileModal, sourceFileIds, setSelectedRowKeys],
+ );
+
+ const handleShowMoveFileModal = useCallback(
+ (ids: string[]) => {
+ setSourceFileIds(ids);
+ showMoveFileModal();
+ },
+ [showMoveFileModal],
+ );
+
+ return {
+ initialValue: '',
+ moveFileLoading: loading,
+ onMoveFileOk,
+ moveFileVisible,
+ hideMoveFileModal,
+ showMoveFileModal: handleShowMoveFileModal,
+ };
+};
diff --git a/web/src/pages/file-manager/index.tsx b/web/src/pages/file-manager/index.tsx
index 0fa3f4abe7..4683b95389 100644
--- a/web/src/pages/file-manager/index.tsx
+++ b/web/src/pages/file-manager/index.tsx
@@ -9,6 +9,7 @@ import {
useGetRowSelection,
useHandleConnectToKnowledge,
useHandleCreateFolder,
+ useHandleMoveFile,
useHandleUploadFile,
useNavigateToOtherFolder,
useRenameCurrentFile,
@@ -23,6 +24,7 @@ import { getExtension } from '@/utils/document-util';
import ConnectToKnowledgeModal from './connect-to-knowledge-modal';
import FolderCreateModal from './folder-create-modal';
import styles from './index.less';
+import FileMovingModal from './move-file-modal';
const { Text } = Typography;
@@ -61,7 +63,13 @@ const FileManager = () => {
initialValue,
connectToKnowledgeLoading,
} = useHandleConnectToKnowledge();
- // const { pagination } = useGetFilesPagination();
+ const {
+ showMoveFileModal,
+ moveFileVisible,
+ onMoveFileOk,
+ hideMoveFileModal,
+ moveFileLoading,
+ } = useHandleMoveFile(setSelectedRowKeys);
const { pagination, data, searchString, handleInputChange, loading } =
useFetchFileList();
const columns: ColumnsType = [
@@ -139,6 +147,7 @@ const FileManager = () => {
console.info(record);
}}
showRenameModal={showFileRenameModal}
+ showMoveFileModal={showMoveFileModal}
showConnectToKnowledgeModal={showConnectToKnowledgeModal}
setSelectedRowKeys={setSelectedRowKeys}
>
@@ -155,6 +164,7 @@ const FileManager = () => {
showFolderCreateModal={showFolderCreateModal}
showFileUploadModal={showFileUploadModal}
setSelectedRowKeys={setSelectedRowKeys}
+ showMoveFileModal={showMoveFileModal}
>
{
onOk={onConnectToKnowledgeOk}
loading={connectToKnowledgeLoading}
>
+ {moveFileVisible && (
+
+ )}
);
};
diff --git a/web/src/pages/file-manager/move-file-modal/async-tree-select.tsx b/web/src/pages/file-manager/move-file-modal/async-tree-select.tsx
new file mode 100644
index 0000000000..f88b734895
--- /dev/null
+++ b/web/src/pages/file-manager/move-file-modal/async-tree-select.tsx
@@ -0,0 +1,64 @@
+import { useFetchPureFileList } from '@/hooks/file-manager-hooks';
+import { IFile } from '@/interfaces/database/file-manager';
+import type { GetProp, TreeSelectProps } from 'antd';
+import { TreeSelect } from 'antd';
+import { useCallback, useEffect, useState } from 'react';
+
+type DefaultOptionType = GetProp[number];
+
+interface IProps {
+ value?: string;
+ onChange?: (value: string) => void;
+}
+
+const AsyncTreeSelect = ({ value, onChange }: IProps) => {
+ const { fetchList } = useFetchPureFileList();
+ const [treeData, setTreeData] = useState[]>(
+ [],
+ );
+
+ const onLoadData: TreeSelectProps['loadData'] = useCallback(
+ async ({ id }) => {
+ const ret = await fetchList(id);
+ if (ret.retcode === 0) {
+ setTreeData((tree) => {
+ return tree.concat(
+ ret.data.files
+ .filter((x: IFile) => x.type === 'folder')
+ .map((x: IFile) => ({
+ id: x.id,
+ pId: x.parent_id,
+ value: x.id,
+ title: x.name,
+ isLeaf: false,
+ })),
+ );
+ });
+ }
+ },
+ [fetchList],
+ );
+
+ const handleChange = (newValue: string) => {
+ onChange?.(newValue);
+ };
+
+ useEffect(() => {
+ onLoadData?.({ id: '', props: '' });
+ }, [onLoadData]);
+
+ return (
+
+ );
+};
+
+export default AsyncTreeSelect;
diff --git a/web/src/pages/file-manager/move-file-modal/index.tsx b/web/src/pages/file-manager/move-file-modal/index.tsx
new file mode 100644
index 0000000000..c7b13c48b3
--- /dev/null
+++ b/web/src/pages/file-manager/move-file-modal/index.tsx
@@ -0,0 +1,54 @@
+import { IModalManagerChildrenProps } from '@/components/modal-manager';
+import { useTranslate } from '@/hooks/common-hooks';
+import { Form, Modal } from 'antd';
+import AsyncTreeSelect from './async-tree-select';
+
+interface IProps extends Omit {
+ loading: boolean;
+ onOk: (id: string) => void;
+}
+
+const FileMovingModal = ({ visible, hideModal, loading, onOk }: IProps) => {
+ const [form] = Form.useForm();
+ const { t } = useTranslate('fileManager');
+
+ type FieldType = {
+ name?: string;
+ };
+
+ const handleOk = async () => {
+ const ret = await form.validateFields();
+
+ return onOk(ret.name);
+ };
+
+ return (
+
+
+
+ );
+};
+
+export default FileMovingModal;
diff --git a/web/src/services/file-manager-service.ts b/web/src/services/file-manager-service.ts
index e4fcf63be9..601b60ee15 100644
--- a/web/src/services/file-manager-service.ts
+++ b/web/src/services/file-manager-service.ts
@@ -13,6 +13,7 @@ const {
connectFileToKnowledge,
get_document_file,
getFile,
+ moveFile,
} = api;
const methods = {
@@ -49,6 +50,10 @@ const methods = {
method: 'get',
responseType: 'blob',
},
+ moveFile: {
+ url: moveFile,
+ method: 'post',
+ },
} as const;
const fileManagerService = registerServer(
diff --git a/web/src/utils/api.ts b/web/src/utils/api.ts
index 53dcc13700..1051e704da 100644
--- a/web/src/utils/api.ts
+++ b/web/src/utils/api.ts
@@ -79,6 +79,7 @@ export default {
createFolder: `${api_host}/file/create`,
connectFileToKnowledge: `${api_host}/file2document/convert`,
getFile: `${api_host}/file/get`,
+ moveFile: `${api_host}/file/mv`,
// system
getSystemVersion: `${api_host}/system/version`,