feat: 合并冲突

src/module/datasource/component/StepTwo.jsx

@@ -1,16 +1,56 @@
 import React, { useState, useEffect } from 'react'
-import { Form, Select, Input } from 'antd'
+import { Form, Select, Input, message } from 'antd'
+import { getTableNamesList } from '../services'
 
-const DATASOURCE_TYPE_MYSQL = 'mysql'
+export default function LoadFormConfig({ loadDataForm, dataSourceList }) {
+  const [datasourceType, setDatasourceType] = useState(null)
 
-export default function StepTwo({ loadDataForm }) {
-  const [datasourceType, setDatasourceType] = useState(DATASOURCE_TYPE_MYSQL)
+  const [datasources, setDatasources] = useState()
 
+  const [tableList, setTableList] = useState([])
+
+  // 获取数据源列表
+  useEffect(() => {
+    if (dataSourceList.length !== 0) {
+      setDatasources(
+        dataSourceList.map(item => {
+          return {
+            label: item.datasource_name,
+            value: item.key,
+          }
+        })
+      )
+    }
+  }, [dataSourceList])
+
+  // 初始化表单类型
   useEffect(() => {
     if (loadDataForm.getFieldValue('datasource_name')) {
-      setDatasourceType(loadDataForm.getFieldValue('datasource_name'))
+      const type = dataSourceList.find(
+        item => item.key === loadDataForm.getFieldValue('datasource_name')
+      ).datasource
+      setDatasourceType(type)
     }
   }, [])
+
+  // 选择数据源
+  const selectDatasource = async val => {
+    loadDataForm.setFieldValue('datasource_table', null)
+    const type = dataSourceList.find(item => item.key === val).datasource
+    setDatasourceType(type)
+    console.log(val)
+    const { data } = await getTableNamesList(val)
+    if (data.code === 200) {
+      const list = data.data.map(item => ({
+        label: item,
+        value: item,
+      }))
+      setTableList(list)
+    } else {
+      message.error('数据表加载失败')
+    }
+  }
+
   return (
     <>
       <p
@@ -29,9 +69,6 @@ export default function StepTwo({ loadDataForm }) {
         }}
         wrapperCol={{
           span: 6,
-        }}
-        initialValues={{
-          datasource_name: DATASOURCE_TYPE_MYSQL,
         }}>
         <Form.Item
           label="选择数据源"
@@ -43,26 +80,21 @@ export default function StepTwo({ loadDataForm }) {
             },
           ]}>
           <Select
-            options={[
-              { label: 'My SQL', value: 'mysql' },
-              { label: 'hive', value: 'hive' },
-            ]}
-            onSelect={val => {
-              setDatasourceType(val)
-            }}
+            options={datasources}
+            onSelect={selectDatasource}
             allowClear
           />
         </Form.Item>
         <Form.Item
           label="选择表"
-          name="datasource_form"
+          name="datasource_table"
           rules={[
             {
               required: true,
               message: '请选择表',
             },
           ]}>
-          <Select options={[]} allowClear />
+          <Select options={tableList} allowClear />
         </Form.Item>
         {datasourceType === 'mysql' ? (
           <>
@@ -96,7 +128,7 @@ export default function StepTwo({ loadDataForm }) {
               <Input placeholder="hdfs namenode节点地址" />
             </Form.Item>
             <Form.Item
-              label="选择表"
+              label="文件类型"
               name="file_type"
               rules={[
                 {
@@ -104,7 +136,14 @@ export default function StepTwo({ loadDataForm }) {
                   message: '请选择文件类型',
                 },
               ]}>
-              <Select options={[]} allowClear placeholder="文件的类型" />
+              <Select
+                options={[
+                  { label: 'txt', value: 'txt' },
+                  { label: 'ocr', value: 'ocr' },
+                ]}
+                allowClear
+                placeholder="文件的类型"
+              />
             </Form.Item>
             <Form.Item label="分隔符" name="datasource_partition">
               <Input placeholder="读取字段的分隔符" />