采集新增任务多选

src/view/Manage/DatasourceManage/Component/UpdateTaskModal.jsx

 import React, { useEffect, useMemo, useState } from 'react';
-import { Modal, Checkbox, Row, Col, Divider, Input, Typography, Form, Switch } from 'antd';
+import { Modal, Checkbox, Row, Col, Divider, Input, Typography, Form, Switch, Select } from 'antd';
 
 import { dispatch } from '../../../../model';
 
+const MultiSelect = ({ value='', data, onChange }) => {
+  const handleChange = (newValue) => {
+    if (newValue?.length > 0) {
+      onChange?.(newValue.toString());
+    } else {
+      onChange?.(null);
+    }
+  }
+
+  return (
+    <Select
+      mode="multiple"
+      placeholder={data?.explain}
+      value={value?value.split(','):[]}
+      onChange={handleChange}
+      allowClear
+      style={{
+        width: '100%',
+      }}
+    >
+    {
+      data?.selectItem?.map((item, index) => {
+        return (
+          <Select.Option key={index} value={item}>{item}</Select.Option>
+        );
+      })
+    }
+    </Select>
+  )
+}
+
 const UpdateTaskModal = (props) => {
   const { visible, onCancel, action, id, datasourceId,currentDatabase } = props;
   const [ schemas, setSchemas ] = useState([]);
@@ -241,6 +272,7 @@ const UpdateTaskModal = (props) => {
               rules={[{ required: param.required, message: '必填项'}]}
             >
             {
+              (param.selectMode==='multiSelect') ? <MultiSelect data={param} /> :
               ( param.show ? <Input placeholder={param.explain||''} /> : <Input.Password placeholder={param.explain||''} visibilityToggle={false} /> )
             }
             </Form.Item>