ronds-metadata 1.3.58 → 1.3.60

package/es/comps/MetadataForm/DataCell/Input.js

@@ -33,7 +33,7 @@ import { useAsyncMemo } from '../../../framework/hooks/use-async-memo';
 import { MetadataService } from '../../../framework/metadata/MetadataService';
 import SparkSqlTable from './plugin/SparkSqlTable';
 import MapTable from './plugin/MapTable';
-import IconButton from './plugin/IconButton';
+import SourceConfig from './plugin/SourceConfig';
 var TextArea = _Input.TextArea;
 function Index(props) {
   var _extraInfo$addonAfter7;
@@ -195,8 +195,8 @@ function Index(props) {
         return /*#__PURE__*/React.createElement(SparkSqlTable, extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.sparkSqlTable);
       case 'mapTable':
         return /*#__PURE__*/React.createElement(MapTable, extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.mapTable);
-      case 'iconButton':
-        return /*#__PURE__*/React.createElement(IconButton, extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.iconButton);
+      case 'sourceConfig':
+        return /*#__PURE__*/React.createElement(SourceConfig, extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.sourceConfig);
       default:
         return /*#__PURE__*/React.createElement(_Input, {
           addonAfter: ((_extraInfo$addonAfter2 = extraInfo.addonAfter) === null || _extraInfo$addonAfter2 === void 0 ? void 0 : _extraInfo$addonAfter2.key) ? /*#__PURE__*/React.createElement(_Form.Item, {

package/es/comps/MetadataForm/DataCell/plugin/SourceConfig.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface ISourceConfigProps {
+    configType?: string;
+}
+declare const SourceConfig: (props: ISourceConfigProps) => React.JSX.Element;
+export default SourceConfig;

package/es/comps/MetadataForm/DataCell/plugin/SourceConfig.js

@@ -0,0 +1,397 @@
+import "antd/es/form/style";
+import _Form from "antd/es/form";
+import "antd/es/upload/style";
+import _Upload from "antd/es/upload";
+import "antd/es/input/style";
+import _Input from "antd/es/input";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+import "antd/es/select/style";
+import _Select from "antd/es/select";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { tr } from '@/framework/locale';
+import { LinkOutlined, UploadOutlined, PlusOutlined } from '@ant-design/icons';
+import React from 'react';
+import Editable from '@/comps/Editable';
+var SourceConfig = function SourceConfig(props) {
+  var configType = props.configType;
+  var isTarget = configType === 'target';
+  var isSource = configType === 'source';
+  var sourceOpts = isTarget ? [{
+    value: 'Cassandra',
+    label: 'Cassandra'
+  }, {
+    value: 'PgSql',
+    label: 'PgSql'
+  }, {
+    value: 'Minio',
+    label: 'Minio'
+  }, {
+    value: 'SqlServer',
+    label: 'SqlServer'
+  }] : [{
+    value: 'Kafka',
+    label: 'Kafka'
+  }, {
+    value: 'PgSql',
+    label: 'PgSql'
+  }, {
+    value: 'Minio',
+    label: 'Minio'
+  }, {
+    value: 'SqlServer',
+    label: 'SqlServer'
+  }];
+  var _React$useState = React.useState(),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    source = _React$useState2[0],
+    setSource = _React$useState2[1];
+  var _React$useState3 = React.useState(),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    defaultSource = _React$useState4[0],
+    setDefaultSource = _React$useState4[1];
+  // kafka source
+  var _React$useState5 = React.useState(),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    autoOffsetReset = _React$useState6[0],
+    setAutoOffsetReset = _React$useState6[1];
+  var _React$useState7 = React.useState(),
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    batchDuration = _React$useState8[0],
+    setBatchDuration = _React$useState8[1];
+  var strategyOpts = [{
+    value: 'earliest',
+    label: 'earliest'
+  }, {
+    value: 'latest',
+    label: 'latest'
+  }];
+  // sql source
+  var _React$useState9 = React.useState(),
+    _React$useState10 = _slicedToArray(_React$useState9, 2),
+    fetchSize = _React$useState10[0],
+    setFetchSize = _React$useState10[1];
+  var _React$useState11 = React.useState(),
+    _React$useState12 = _slicedToArray(_React$useState11, 2),
+    sql = _React$useState12[0],
+    setSql = _React$useState12[1];
+  // minio source
+  var streamRef = React.useRef();
+  var columns = [{
+    title: 'sheetName',
+    key: 'sheetName',
+    dataIndex: 'sheetName',
+    editable: true,
+    type: 'text'
+  }, {
+    title: 'header',
+    key: 'header',
+    dataIndex: 'header',
+    editable: true,
+    type: 'text'
+  }];
+  var _React$useState13 = React.useState([]),
+    _React$useState14 = _slicedToArray(_React$useState13, 2),
+    list = _React$useState14[0],
+    setList = _React$useState14[1];
+  var listRef = React.useRef([]);
+  var onAddRow = function onAddRow() {
+    var _list = listRef.current;
+    var newRow = {
+      sheetName: '',
+      header: ''
+    };
+    _list.push(newRow);
+    streamRef.current.next({
+      type: 'editRowKey',
+      payload: {
+        _rowKey_: _list.length - 1
+      }
+    });
+    setList(_toConsumableArray(_list));
+    listRef.current = _list;
+  };
+  var onRowConfirm = function onRowConfirm(record) {
+    var _list = listRef.current;
+    _list[record.rowIdx] = _objectSpread(_objectSpread({}, _list[record.rowIdx]), record.allValues);
+    setList(_toConsumableArray(_list));
+    listRef.current = _list;
+  };
+  var onRowDelete = function onRowDelete(record) {
+    var _list = listRef.current;
+    _list.splice(record._rowKey_, 1);
+    setList(_toConsumableArray(_list));
+    listRef.current = _list;
+  };
+  // cassandra target
+  var _React$useState15 = React.useState(),
+    _React$useState16 = _slicedToArray(_React$useState15, 2),
+    keyspace = _React$useState16[0],
+    setKeyspace = _React$useState16[1];
+  var _React$useState17 = React.useState(),
+    _React$useState18 = _slicedToArray(_React$useState17, 2),
+    dtname = _React$useState18[0],
+    setDtname = _React$useState18[1];
+  // pgsql target
+  var _React$useState19 = React.useState(),
+    _React$useState20 = _slicedToArray(_React$useState19, 2),
+    schema = _React$useState20[0],
+    setSchema = _React$useState20[1];
+  var _React$useState21 = React.useState(),
+    _React$useState22 = _slicedToArray(_React$useState21, 2),
+    dbname = _React$useState22[0],
+    setDbname = _React$useState22[1];
+  // minio target
+  var _React$useState23 = React.useState(),
+    _React$useState24 = _slicedToArray(_React$useState23, 2),
+    filePath = _React$useState24[0],
+    setFilePath = _React$useState24[1];
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('数据源'),
+    name: 'dataSource',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    options: sourceOpts,
+    value: source,
+    onChange: function onChange(val) {
+      return setSource(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    name: tr('defaultSource'),
+    colon: false
+  }, /*#__PURE__*/React.createElement(_Select, {
+    value: defaultSource,
+    onChange: function onChange(val) {
+      return setDefaultSource(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    colon: false
+  }, /*#__PURE__*/React.createElement(_Button, {
+    className: "ml-2",
+    type: "link",
+    icon: /*#__PURE__*/React.createElement(LinkOutlined, null),
+    onClick: function onClick() {}
+  }, tr('测试连接')))), isSource && source === 'Kafka' && /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('消费策略'),
+    name: 'autoOffsetReset',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    options: strategyOpts,
+    value: autoOffsetReset,
+    onChange: function onChange(val) {
+      return setAutoOffsetReset(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('批间隔'),
+    name: 'batchDuration',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Input, {
+    value: batchDuration,
+    onChange: function onChange(e) {
+      var _e$target;
+      return setBatchDuration(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value);
+    }
+  }))), isSource && (source === 'PgSql' || source === 'SqlServer') && /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: 'fetch size',
+    name: 'fetchSize',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Input, {
+    value: fetchSize,
+    onChange: function onChange(e) {
+      var _e$target2;
+      return setFetchSize(e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value);
+    }
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    label: 'sql',
+    name: 'sql',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Input, {
+    value: sql,
+    onChange: function onChange(e) {
+      var _e$target3;
+      return setSql(e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value);
+    }
+  }))), isSource && source === 'Minio' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('上传文件'),
+    name: 'filepath',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Upload, {
+    customRequest: function customRequest(options) {
+      setTimeout(function () {
+        options.onSuccess();
+      }, 1000);
+    }
+  }, /*#__PURE__*/React.createElement(_Button, {
+    icon: /*#__PURE__*/React.createElement(UploadOutlined, null)
+  }, tr('上传'))))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('文件信息'),
+    name: 'headers'
+  }, /*#__PURE__*/React.createElement(Editable, {
+    type: "single",
+    columns: columns,
+    dataSource: list,
+    onRowConfirm: onRowConfirm,
+    onRowDelete: onRowDelete,
+    getStreamInstance: function getStreamInstance(stream) {
+      return streamRef.current = stream;
+    },
+    onRowClick: function onRowClick(record) {}
+  }), /*#__PURE__*/React.createElement(_Button, {
+    type: "dashed",
+    onClick: onAddRow,
+    style: {
+      width: '100%',
+      marginTop: '2px'
+    }
+  }, tr('添加一行'))))), isTarget && source === 'Cassandra' && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('键空间'),
+    name: 'keyspace',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    value: keyspace,
+    onChange: function onChange(val) {
+      return setKeyspace(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('数据表'),
+    name: 'dtname',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    value: dtname,
+    onChange: function onChange(val) {
+      return setDtname(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    colon: false
+  }, /*#__PURE__*/React.createElement(_Button, {
+    className: "ml-2",
+    type: "link",
+    icon: /*#__PURE__*/React.createElement(PlusOutlined, null),
+    onClick: function onClick() {}
+  }, tr('手动建表'))))), isTarget && (source === 'PgSql' || source === 'SqlServer') && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: 'schema',
+    name: 'schema',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    value: schema,
+    onChange: function onChange(val) {
+      return setSchema(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('数据库'),
+    name: 'dbname',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    value: dbname,
+    onChange: function onChange(val) {
+      return setDbname(val);
+    },
+    allowClear: true
+  }))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('数据表'),
+    name: 'dtname',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    value: dtname,
+    onChange: function onChange(val) {
+      return setDtname(val);
+    },
+    allowClear: true
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    colon: false
+  }, /*#__PURE__*/React.createElement(_Button, {
+    className: "ml-2",
+    type: "link",
+    icon: /*#__PURE__*/React.createElement(PlusOutlined, null),
+    onClick: function onClick() {}
+  }, tr('手动建表'))))), isTarget && source === 'Minio' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormItem, {
+    label: tr('文件路径'),
+    name: 'filepath',
+    required: true
+  }, /*#__PURE__*/React.createElement(_Input, {
+    value: filePath,
+    onChange: function onChange(e) {
+      return setFilePath(e.target.value);
+    }
+  }))));
+};
+export default SourceConfig;
+var FormItem = function FormItem(props) {
+  var color = props.color,
+    _props$labelSpan = props.labelSpan,
+    labelSpan = _props$labelSpan === void 0 ? 0 : _props$labelSpan,
+    _props$layout = props.layout,
+    layout = _props$layout === void 0 ? 'horizontal' : _props$layout,
+    name = props.name,
+    label = props.label,
+    colon = props.colon,
+    help = props.help,
+    tooltip = props.tooltip,
+    _props$required = props.required,
+    required = _props$required === void 0 ? false : _props$required,
+    children = props.children,
+    _props$wrapperSpan = props.wrapperSpan,
+    wrapperSpan = _props$wrapperSpan === void 0 ? 3 : _props$wrapperSpan;
+  return /*#__PURE__*/React.createElement(_Form.Item, {
+    style: {
+      flex: 1,
+      paddingRight: '10px'
+    },
+    label: /*#__PURE__*/React.createElement("span", {
+      style: color ? {
+        color: color
+      } : {}
+    }, tr(label)),
+    labelCol: labelSpan && layout === 'horizontal' ? {
+      flex: "0 0 ".concat(labelSpan * 100 / 24, "%"),
+      offset: 0
+    } : undefined,
+    wrapperCol: labelSpan && wrapperSpan && layout === 'horizontal' ? {
+      style: {
+        width: "".concat((wrapperSpan - labelSpan) * 100 / 24, "%")
+      },
+      flex: "0 0 ".concat((wrapperSpan - labelSpan) * 100 / 24, "%"),
+      offset: 0
+    } : undefined,
+    name: name,
+    rules: [{
+      required: required,
+      message: "".concat(tr('请输入'), " ").concat(tr(label))
+    }],
+    help: tr(help),
+    tooltip: tr(tooltip),
+    colon: colon
+  }, children);
+};