@@ -48,4 +61,4 @@ const PasswordInputModal = (props: IProps) => {
);
};
-export default PasswordInputModal;
+export default observer(ConfigConfirmModal);
diff --git a/app/pages/Import/TaskCreate/FileSelect/index.tsx b/app/pages/Import/TaskCreate/FileSelect/index.tsx
index ffd56d50..9cfad631 100644
--- a/app/pages/Import/TaskCreate/FileSelect/index.tsx
+++ b/app/pages/Import/TaskCreate/FileSelect/index.tsx
@@ -16,7 +16,7 @@ const FormItem = Form.Item;
const FileSelect = (props: IProps) => {
const { type } = props;
- const { files, dataImport: { update, verticesConfig, edgesConfig } } = useStore();
+ const { files, dataImport: { update, verticesConfig, edgeConfig } } = useStore();
const { fileList, getFiles } = files;
const [visible, setVisible] = useState(false);
const { intl } = useI18n();
@@ -33,7 +33,7 @@ const FileSelect = (props: IProps) => {
});
} else {
update({
- edgesConfig: [...edgesConfig, {
+ edgeConfig: [...edgeConfig, {
name: uuidv4(),
file,
props: [],
diff --git a/app/pages/Import/TaskCreate/PasswordInputModal/index.module.less b/app/pages/Import/TaskCreate/PasswordInputModal/index.module.less
deleted file mode 100644
index 048b599a..00000000
--- a/app/pages/Import/TaskCreate/PasswordInputModal/index.module.less
+++ /dev/null
@@ -1,10 +0,0 @@
-.passwordModal {
- .btns {
- margin: 30px 0 0;
- display: flex;
- justify-content: center;
- :global(.ant-btn:not(:last-child)) {
- margin-right: 20px;
- }
- }
-}
diff --git a/app/pages/Import/TaskCreate/SchemaConfig/EdgeConfig/index.tsx b/app/pages/Import/TaskCreate/SchemaConfig/EdgeConfig/index.tsx
deleted file mode 100644
index 315057cc..00000000
--- a/app/pages/Import/TaskCreate/SchemaConfig/EdgeConfig/index.tsx
+++ /dev/null
@@ -1,109 +0,0 @@
-import { Select, Table, Tooltip } from 'antd';
-import React from 'react';
-import { CloseOutlined } from '@ant-design/icons';
-import { observer } from 'mobx-react-lite';
-import { useStore } from '@app/stores';
-import CSVPreviewLink from '@app/components/CSVPreviewLink';
-import classNames from 'classnames';
-import { useI18n } from '@vesoft-inc/i18n';
-import styles from '../index.module.less';
-
-const Option = Select.Option;
-
-interface IProps {
- configIndex: number;
- edge: any;
-}
-const EdgeConfig = (configProps: IProps) => {
- const { configIndex, edge: { type, props, file } } = configProps;
- const { dataImport, schema } = useStore();
- const { updateEdgeConfig, updateEdgePropMapping } = dataImport;
- const { edgeTypes } = schema;
- const { intl } = useI18n();
- const handleEdgeChange = (index: number, value: string) => {
- updateEdgeConfig({ index, edgeType: value });
- };
-
- const handleRemoveEdge = () => {
- updateEdgePropMapping({ configIndex });
- };
- const handlePropChange = (index, field, value) => {
- updateEdgePropMapping({
- configIndex,
- propIndex: index,
- field,
- value
- });
- };
-
- const columns = [
- {
- title: intl.get('import.prop'),
- dataIndex: 'name',
- ellipsis: {
- showTitle: false,
- },
- render: data => (
-
- {data}
-
- ),
- },
- {
- title: intl.get('import.mapping'),
- dataIndex: 'mapping',
- render: (mappingIndex, prop, propIndex) => (
-
- {!prop.isDefault && prop.name !== 'rank' && (
- *
- )}
-
- handlePropChange(propIndex, 'mapping', columnIndex)
- }
- file={file}
- >
- {mappingIndex === null ? intl.get('import.choose') : `Column ${mappingIndex}`}
-
-
- ),
- },
- {
- title: intl.get('common.type'),
- dataIndex: 'type',
- },
- ];
-
- return (
-
-
-
- Edge Type
-
-
-
-
- {type &&
}
-
- );
-};
-
-export default observer(EdgeConfig);
diff --git a/app/pages/Import/TaskCreate/SchemaConfig/FileMapping/index.tsx b/app/pages/Import/TaskCreate/SchemaConfig/FileMapping/index.tsx
new file mode 100644
index 00000000..57277214
--- /dev/null
+++ b/app/pages/Import/TaskCreate/SchemaConfig/FileMapping/index.tsx
@@ -0,0 +1,190 @@
+import { Collapse, Input, Select, Table, Tooltip } from 'antd';
+import React, { useMemo } from 'react';
+import { observer } from 'mobx-react-lite';
+import cls from 'classnames';
+import { useStore } from '@app/stores';
+import { useI18n } from '@vesoft-inc/i18n';
+import CSVPreviewLink from '@app/components/CSVPreviewLink';
+import { CloseOutlined } from '@ant-design/icons';
+import Instruction from '@app/components/Instruction';
+import { ISchemaEnum } from '@app/interfaces/schema';
+import { IEdgeFileItem, ITagFileItem } from '@app/stores/import';
+import { IImportFile } from '@app/interfaces/import';
+import styles from '../index.module.less';
+
+const Option = Select.Option;
+const Panel = Collapse.Panel;
+
+interface IProps {
+ item: ITagFileItem | IEdgeFileItem
+ onRemove: (file: ITagFileItem | IEdgeFileItem) => void;
+ onReset: (item: ITagFileItem | IEdgeFileItem, file: IImportFile) => void;
+ type: ISchemaEnum
+}
+
+
+const VIDSetting = observer((props: {
+ data: ITagFileItem | IEdgeFileItem,
+ keyMap: {
+ idKey: string,
+ idFunction?: string,
+ idPrefix?: string,
+ label: string
+ }
+}) => {
+ const { keyMap: { idKey, idFunction, idPrefix, label }, data } = props;
+ const { intl } = useI18n();
+ return
+
+
+
+ {intl.get(`import.${label}`)}
+ data.update({ [idKey]: index })}
+ file={data.file}
+ >
+ {!data[idKey] && data[idKey] !== 0 ? intl.get('import.selectCsvColumn') : `Column ${data[idKey]}`}
+
+
+
+
+ {intl.get('import.vidFunction')}
+ {intl.get('import.vidFunctionTip')}
+
+
+ {intl.get('import.vidPrefix')}
+ {intl.get('import.vidPrefixTip')}
+
+ >} />
+ } key="default">
+ {idFunction &&
+ {intl.get('import.vidFunction')}
+
+
}
+ {idPrefix &&
+ {intl.get('import.vidPrefix')}
+ data.update({ [idPrefix]: e.target.value })} />
+
}
+
+
+
;
+});
+
+const idMap = {
+ [ISchemaEnum.Tag]: [{
+ idKey: 'vidIndex',
+ idFunction: 'vidFunction',
+ idPrefix: 'vidPrefix',
+ label: 'vidColumn'
+ }],
+ [ISchemaEnum.Edge]: [{
+ idKey: 'srcIdIndex',
+ idFunction: 'srcIdFunction',
+ label: 'srcVidColumn'
+ }, {
+ idKey: 'dstIdIndex',
+ idFunction: 'dstIdFunction',
+ label: 'dstVidColumn'
+ }],
+};
+
+const FileMapping = (props: IProps) => {
+ const { item, onRemove, type, onReset } = props;
+ const { files } = useStore();
+ const { fileList, getFiles } = files;
+ const { file, props: mappingProps } = item;
+ const { intl } = useI18n();
+ const handleFileChange = (value: string) => {
+ const file = fileList.find(item => item.name === value);
+ onReset(item, file);
+ };
+
+ const updateFilePropMapping = (index: number, value: number) => item.updatePropItem(index, { mapping: value });
+ const columns = [
+ {
+ title: intl.get('import.prop'),
+ dataIndex: 'name',
+ ellipsis: {
+ showTitle: false,
+ },
+ render: (value, record) => {
+ return (
+