ronds-metadata 1.3.73 → 1.3.75

package/es/comps/MetadataForm/DataCell/plugin/Datasource/SqlServer.js

@@ -0,0 +1,118 @@
+import "antd/es/select/style";
+import _Select from "antd/es/select";
+import "antd/es/col/style";
+import _Col from "antd/es/col";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { tr } from '../../../../../framework/locale';
+import { useGetDatasource } from './hooks';
+import React from 'react';
+var SqlServerDatasource = function SqlServerDatasource(props) {
+  var _extraInfo$datasource, _extraInfo$datasource2, _extraInfo$datasource3, _extraInfo$datasource4, _extraInfo$datasource5, _extraInfo$datasource6;
+  var extraInfo = props.extraInfo,
+    datasource = props.datasource,
+    wrapperCol = props.wrapperCol,
+    labelCol = props.labelCol,
+    onChange = props.onChange;
+  var _React$useState = React.useState(),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    dataBase = _React$useState2[0],
+    setDataBase = _React$useState2[1];
+  var _React$useState3 = React.useState(),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    schema = _React$useState4[0],
+    setSchema = _React$useState4[1];
+  var dataBaseOpts = useGetDatasource('SqlServer', 2, datasource);
+  var schemaOpts = useGetDatasource('SqlServer', 3, datasource, dataBase ? JSON.parse(dataBase).name : undefined);
+  var dataTableOpts = useGetDatasource('SqlServer', 4, datasource, dataBase ? JSON.parse(dataBase).name : undefined, schema ? JSON.parse(schema).name : undefined);
+  var onDataBaseChange = function onDataBaseChange(value) {
+    setDataBase(value);
+    onChange && onChange({
+      db: value
+    });
+  };
+  var onSchemaChange = function onSchemaChange(value) {
+    setSchema(value);
+    onChange && onChange({
+      schema: value
+    });
+  };
+  var onDataTableChange = function onDataTableChange(value) {
+    onChange && onChange({
+      dt: value
+    });
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Col, {
+    span: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'vertical' && 24,
+    flex: labelCol
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ant-form-item-label",
+    style: {
+      width: '100%',
+      textAlign: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'horizontal' ? 'right' : 'left'),
+      flex: '1'
+    }
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, tr('数据库'))))), /*#__PURE__*/React.createElement(_Col, {
+    flex: wrapperCol,
+    style: {
+      paddingBottom: '8px'
+    }
+  }, /*#__PURE__*/React.createElement(_Select, {
+    mode: (extraInfo === null || extraInfo === void 0 ? void 0 : (_extraInfo$datasource = extraInfo.datasource) === null || _extraInfo$datasource === void 0 ? void 0 : (_extraInfo$datasource2 = _extraInfo$datasource.sqlServer) === null || _extraInfo$datasource2 === void 0 ? void 0 : _extraInfo$datasource2.isMutiple) ? 'multiple' : undefined,
+    allowClear: true,
+    options: dataBaseOpts,
+    onChange: onDataBaseChange
+  })), /*#__PURE__*/React.createElement(_Col, {
+    span: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'vertical' && 24,
+    flex: labelCol
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ant-form-item-label",
+    style: {
+      width: '100%',
+      textAlign: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'horizontal' ? 'right' : 'left'),
+      flex: '1'
+    }
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, tr('模式'))))), /*#__PURE__*/React.createElement(_Col, {
+    flex: wrapperCol,
+    style: {
+      paddingBottom: '8px'
+    }
+  }, /*#__PURE__*/React.createElement(_Select, {
+    mode: (extraInfo === null || extraInfo === void 0 ? void 0 : (_extraInfo$datasource3 = extraInfo.datasource) === null || _extraInfo$datasource3 === void 0 ? void 0 : (_extraInfo$datasource4 = _extraInfo$datasource3.sqlServer) === null || _extraInfo$datasource4 === void 0 ? void 0 : _extraInfo$datasource4.isMutiple) ? 'multiple' : undefined,
+    allowClear: true,
+    options: schemaOpts,
+    onChange: onSchemaChange
+  })), /*#__PURE__*/React.createElement(_Col, {
+    span: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'vertical' && 24,
+    flex: labelCol
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ant-form-item-label",
+    style: {
+      width: '100%',
+      textAlign: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'horizontal' ? 'right' : 'left'),
+      flex: '1'
+    }
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, tr('数据表'))))), /*#__PURE__*/React.createElement(_Col, {
+    flex: wrapperCol,
+    style: {
+      paddingBottom: '8px'
+    }
+  }, /*#__PURE__*/React.createElement(_Select, {
+    mode: (extraInfo === null || extraInfo === void 0 ? void 0 : (_extraInfo$datasource5 = extraInfo.datasource) === null || _extraInfo$datasource5 === void 0 ? void 0 : (_extraInfo$datasource6 = _extraInfo$datasource5.sqlServer) === null || _extraInfo$datasource6 === void 0 ? void 0 : _extraInfo$datasource6.isMutiple) ? 'multiple' : undefined,
+    allowClear: true,
+    options: dataTableOpts,
+    onChange: onDataTableChange
+  })));
+};
+export default SqlServerDatasource;

package/es/comps/MetadataForm/DataCell/plugin/Datasource/hooks.d.ts

@@ -0,0 +1,3 @@
+export declare const useGetDatasource: (type: string, level?: number, source?: string, levelTwo?: string, levelThree?: string) => any[];
+export declare const useGetLabelCol: (extraInfo: any) => string;
+export declare const useGetWrapperCol: (extraInfo: any) => string;

package/es/comps/MetadataForm/DataCell/plugin/Datasource/hooks.js

@@ -0,0 +1,129 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { MetadataService } from '../../../../../framework/metadata/MetadataService';
+import React from 'react';
+/*
+ * @Author: wangxian
+ * @Date: 2024-08-20 14:38:09
+ * @LastEditTime: 2024-08-21 09:31:11
+ */
+export var useGetDatasource = function useGetDatasource(type) {
+  var level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
+  var source = arguments.length > 2 ? arguments[2] : undefined;
+  var levelTwo = arguments.length > 3 ? arguments[3] : undefined;
+  var levelThree = arguments.length > 4 ? arguments[4] : undefined;
+  var _React$useState = React.useState([]),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    list = _React$useState2[0],
+    setList = _React$useState2[1];
+  var server = new MetadataService();
+  var getHttpResult = React.useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_type, _level) {
+      var param, res, _config, _list;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (levelThree) {
+              param = {
+                type: _type,
+                level: _level,
+                source: source,
+                levelTwo: levelTwo,
+                levelThree: levelThree
+              };
+            } else if (levelTwo) {
+              param = {
+                type: _type,
+                level: _level,
+                source: source,
+                levelTwo: levelTwo
+              };
+            } else {
+              param = {
+                type: _type,
+                level: _level,
+                source: source
+              };
+            }
+            _context.next = 3;
+            return server.GetEnumDataByUrl(DATASOURCE_HTTP_URL, 'post', param);
+          case 3:
+            res = _context.sent;
+            _config = RESULT_MAP[_level];
+            _list = res.map(function (it) {
+              return {
+                value: it[_config.key],
+                label: it[_config.value]
+              };
+            });
+            setList(_toConsumableArray(_list));
+          case 7:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }(), [source, levelTwo, levelThree]);
+  React.useEffect(function () {
+    if (type && level) {
+      getHttpResult(type, level);
+    }
+  }, [type, level, source, levelTwo, levelThree, getHttpResult]);
+  return list;
+};
+export var useGetLabelCol = function useGetLabelCol(extraInfo) {
+  var _React$useState3 = React.useState(''),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    flex = _React$useState4[0],
+    setFlex = _React$useState4[1];
+  React.useEffect(function () {
+    if ((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'horizontal') {
+      if ((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.titleHidden) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.colSpan)) {
+        setFlex("0 0 ".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) * 100 / (24 * (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.colSpan)), "%"));
+      } else {
+        setFlex("0 0 ".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) * 100 / 24, "%"));
+      }
+    }
+  }, [extraInfo]);
+  return flex;
+};
+export var useGetWrapperCol = function useGetWrapperCol(extraInfo) {
+  var _React$useState5 = React.useState('1'),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    flex = _React$useState6[0],
+    setFlex = _React$useState6[1];
+  React.useEffect(function () {
+    if ((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'horizontal') {
+      if ((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.titleHidden) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.colSpan)) {
+        setFlex("0 0 ".concat(100 - (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) * 100 / (24 * (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.colSpan)), "%"));
+      } else {
+        setFlex("0 0 ".concat((24 - (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan)) * 100 / 24, "%"));
+      }
+    }
+  }, [extraInfo]);
+  return flex;
+};
+var DATASOURCE_HTTP_URL = '/dataset-web/source/cascade/data/v2';
+var RESULT_MAP = {
+  1: {
+    key: 'config',
+    value: 'name'
+  },
+  2: {
+    key: 'config',
+    value: 'name'
+  },
+  3: {
+    key: 'config',
+    value: 'name'
+  },
+  4: {
+    key: 'config',
+    value: 'name'
+  }
+};

package/es/comps/MetadataForm/DataCell/plugin/Datasource/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface IDatasourceProps {
+    extraInfo?: any;
+    disabled?: boolean;
+    value?: any;
+    onChange?: (value: any) => void;
+}
+declare const DataSource: (props: IDatasourceProps) => React.JSX.Element;
+export default DataSource;

package/es/comps/MetadataForm/DataCell/plugin/Datasource/index.js

@@ -0,0 +1,155 @@
+import "antd/es/row/style";
+import _Row from "antd/es/row";
+import "antd/es/input/style";
+import _Input from "antd/es/input";
+import "antd/es/tooltip/style";
+import _Tooltip from "antd/es/tooltip";
+import "antd/es/button/style";
+import _Button from "antd/es/button";
+import "antd/es/select/style";
+import _Select from "antd/es/select";
+import "antd/es/col/style";
+import _Col from "antd/es/col";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { tr } from '../../../../../framework/locale';
+import React from 'react';
+import KafkaDatasource from './Kafka';
+import { LinkOutlined } from '@ant-design/icons';
+import PostgreSQLDatasource from './PostgreSQL';
+import { useGetDatasource, useGetLabelCol, useGetWrapperCol } from './hooks';
+import CassandraDatasource from './Cassandra';
+import SqlServerDatasource from './SqlServer';
+var DataSource = function DataSource(props) {
+  var _extraInfo$datasource2;
+  var extraInfo = props.extraInfo,
+    disabled = props.disabled,
+    value = props.value,
+    onChange = props.onChange;
+  var _React$useState = React.useState(''),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    dsType = _React$useState2[0],
+    setDsType = _React$useState2[1];
+  var _React$useState3 = React.useState(''),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    datasource = _React$useState4[0],
+    setDatasource = _React$useState4[1];
+  var valueRef = React.useRef({});
+  var datasourceOpts = useGetDatasource(dsType);
+  var labelCol = useGetLabelCol(extraInfo);
+  var wrapperCol = useGetWrapperCol(extraInfo);
+  var datasourceTypeOpts = React.useMemo(function () {
+    var _extraInfo$datasource;
+    var typeEnum = (extraInfo === null || extraInfo === void 0 ? void 0 : (_extraInfo$datasource = extraInfo.datasource) === null || _extraInfo$datasource === void 0 ? void 0 : _extraInfo$datasource.type) || [];
+    return typeEnum.map(function (it) {
+      return {
+        value: it,
+        label: it
+      };
+    });
+  }, [extraInfo === null || extraInfo === void 0 ? void 0 : (_extraInfo$datasource2 = extraInfo.datasource) === null || _extraInfo$datasource2 === void 0 ? void 0 : _extraInfo$datasource2.type]);
+  var triggerChange = function triggerChange(changedValue) {
+    valueRef.current = _objectSpread(_objectSpread({}, valueRef.current), changedValue);
+    onChange && onChange(valueRef.current);
+  };
+  var onDatasourceTypeChange = function onDatasourceTypeChange(value) {
+    setDsType(value);
+    setDatasource('');
+    triggerChange({
+      dsType: value
+    });
+  };
+  var onDatasourceChange = function onDatasourceChange(value) {
+    setDatasource(value);
+    triggerChange(_objectSpread({
+      datasource: value
+    }, JSON.parse(value)));
+  };
+  var onKafkaChange = function onKafkaChange(value) {
+    triggerChange(_objectSpread({}, value));
+  };
+  var onPgSqlChange = function onPgSqlChange(value) {};
+  var onCassandraChange = function onCassandraChange(value) {
+    triggerChange(_objectSpread({}, value));
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    style: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.borderHidden) ? {
+      padding: '10px 10px 10px 10px',
+      border: '1px solid var(--ronds-metadata-color-border-1)',
+      width: '100%',
+      borderRadius: '4px'
+    } : {}
+  }, /*#__PURE__*/React.createElement(_Row, {
+    className: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.borderHidden) && 'ant-form-item',
+    style: {
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(_Col, {
+    span: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'vertical' && 24,
+    flex: labelCol
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ant-form-item-label",
+    style: {
+      width: '100%',
+      textAlign: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'horizontal' ? 'right' : 'left'),
+      flex: '1'
+    }
+  }, /*#__PURE__*/React.createElement("label", {
+    className: "".concat((extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.require) && 'ant-form-item-required')
+  }, tr('数据源')))), /*#__PURE__*/React.createElement(_Col, {
+    flex: wrapperCol,
+    style: {
+      paddingBottom: '8px'
+    }
+  }, /*#__PURE__*/React.createElement(_Input.Group, {
+    compact: true
+  }, /*#__PURE__*/React.createElement(_Select, {
+    id: 'datasourceType',
+    style: {
+      width: '30%'
+    },
+    value: dsType,
+    options: datasourceTypeOpts,
+    onChange: onDatasourceTypeChange
+  }), /*#__PURE__*/React.createElement(_Select, {
+    id: 'datasource',
+    style: {
+      width: 'calc(70% - 32px)'
+    },
+    value: datasource,
+    options: datasourceOpts,
+    onChange: onDatasourceChange
+  }), /*#__PURE__*/React.createElement(_Tooltip, {
+    title: tr('测试链接'),
+    style: {
+      width: '32px'
+    }
+  }, /*#__PURE__*/React.createElement(_Button, {
+    icon: /*#__PURE__*/React.createElement(LinkOutlined, null)
+  })))), dsType === 'Kafka' && /*#__PURE__*/React.createElement(KafkaDatasource, {
+    wrapperCol: wrapperCol,
+    labelCol: labelCol,
+    extraInfo: extraInfo,
+    datasource: datasource,
+    onChange: onKafkaChange
+  }), dsType === 'PostgreSql' && /*#__PURE__*/React.createElement(PostgreSQLDatasource, {
+    wrapperCol: wrapperCol,
+    labelCol: labelCol,
+    extraInfo: extraInfo,
+    datasource: datasource,
+    onChange: onPgSqlChange
+  }), dsType === 'Cassandra' && /*#__PURE__*/React.createElement(CassandraDatasource, {
+    wrapperCol: wrapperCol,
+    labelCol: labelCol,
+    extraInfo: extraInfo,
+    datasource: datasource,
+    onChange: onCassandraChange
+  }), dsType === 'SqlServer' && /*#__PURE__*/React.createElement(SqlServerDatasource, {
+    wrapperCol: wrapperCol,
+    labelCol: labelCol,
+    extraInfo: extraInfo,
+    datasource: datasource,
+    onChange: onCassandraChange
+  }))));
+};
+export default DataSource;

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

@@ -1,5 +1,6 @@
 import React from 'react';
 interface IMapTableProps {
+    extraInfo?: any;
     value?: any;
     onChange?: (value: any) => void;
 }

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

@@ -1,5 +1,9 @@
 import "antd/es/checkbox/style";
 import _Checkbox from "antd/es/checkbox";
+import "antd/es/row/style";
+import _Row from "antd/es/row";
+import "antd/es/col/style";
+import _Col from "antd/es/col";
 import "antd/es/button/style";
 import _Button from "antd/es/button";
 import "antd/es/select/style";
@@ -11,9 +15,11 @@ import { CloseCircleFilled, ArrowRightOutlined } from '@ant-design/icons';
 import React from 'react';
 import Editable from '../../../../comps/Editable';
 import { MetadataFormContext } from '../../interface';
+import { useGetLabelCol } from './Datasource/hooks';
 var MapTable = function MapTable(props) {
   var value = props.value,
-    onChange = props.onChange;
+    onChange = props.onChange,
+    extraInfo = props.extraInfo;
   var _React$useState = React.useState([]),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     tableDataSource = _React$useState2[0],
@@ -34,18 +40,15 @@ var MapTable = function MapTable(props) {
     _React$useState10 = _slicedToArray(_React$useState9, 2),
     output = _React$useState10[0],
     setOutput = _React$useState10[1];
-  var _React$useState11 = React.useState(false),
+  var _React$useState11 = React.useState(),
     _React$useState12 = _slicedToArray(_React$useState11, 2),
-    isDataCome = _React$useState12[0],
-    setIsDataCome = _React$useState12[1];
-  var _React$useState13 = React.useState(),
-    _React$useState14 = _slicedToArray(_React$useState13, 2),
-    disableArray = _React$useState14[0],
-    setDisableArray = _React$useState14[1];
+    disableArray = _React$useState12[0],
+    setDisableArray = _React$useState12[1];
   var sourceEditableStreamRef = React.useRef();
   var targetEditableStreamRef = React.useRef();
   var _React$useContext = React.useContext(MetadataFormContext),
     form = _React$useContext.form;
+  var labelCol = useGetLabelCol(extraInfo);
   var triggerChange = function triggerChange(changedValue) {
     onChange && onChange(_objectSpread({
       mapping: mapping,
@@ -110,20 +113,25 @@ var MapTable = function MapTable(props) {
     }
   }, [disableArray]);
   React.useEffect(function () {
-    if (!isDataCome) {
-      var values = form.getFieldsValue().mapTable;
-      values.dataSource && setTableDataSource(values.dataSource);
-      values.dataTarget && setTableDataTarget(values.dataTarget);
-      values.options && setOptions(values.options);
-      if (!disableArray && values.dataSource && values.dataTarget) {
-        var _values$dataSource, _values$dataTarget;
-        var valueArray = new Array(Math.min((_values$dataSource = values.dataSource) === null || _values$dataSource === void 0 ? void 0 : _values$dataSource.length, (_values$dataTarget = values.dataTarget) === null || _values$dataTarget === void 0 ? void 0 : _values$dataTarget.length)).fill(true);
-        setDisableArray(valueArray);
-      }
-      setIsDataCome(true);
+    var values = form.getFieldsValue().mapTable;
+    (values === null || values === void 0 ? void 0 : values.dataSource) && setTableDataSource(values.dataSource);
+    (values === null || values === void 0 ? void 0 : values.dataTarget) && setTableDataTarget(values.dataTarget);
+    (values === null || values === void 0 ? void 0 : values.options) && setOptions(values.options);
+    if (!disableArray && (values === null || values === void 0 ? void 0 : values.dataSource) && (values === null || values === void 0 ? void 0 : values.dataTarget)) {
+      var _values$dataSource, _values$dataTarget;
+      var valueArray = new Array(Math.min((_values$dataSource = values.dataSource) === null || _values$dataSource === void 0 ? void 0 : _values$dataSource.length, (_values$dataTarget = values.dataTarget) === null || _values$dataTarget === void 0 ? void 0 : _values$dataTarget.length)).fill(true);
+      setDisableArray(valueArray);
     }
   }, [form.getFieldsValue()]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Row, {
+    className: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.borderHidden) && 'ant-form-item',
+    style: {
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(_Col, {
+    span: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'vertical' && 24,
+    flex: labelCol
+  }, /*#__PURE__*/React.createElement("div", {
     style: {
       width: '100%',
       height: '100%'
@@ -145,7 +153,7 @@ var MapTable = function MapTable(props) {
       width: '100%',
       height: '100%'
     }
-  }, /*#__PURE__*/React.createElement("div", {
+  }, (tableDataSource === null || tableDataSource === void 0 ? void 0 : tableDataSource.length) > 0 && (tableDataTarget === null || tableDataTarget === void 0 ? void 0 : tableDataTarget.length) > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     style: {
       width: '40%'
     }
@@ -197,7 +205,7 @@ var MapTable = function MapTable(props) {
     },
     onRowClick: function onRowClick(record) {},
     onMove: onTargetMove
-  })))));
+  }))))))));
 };
 export default MapTable;
 var columnSource = [{

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

@@ -2,9 +2,8 @@ import React from 'react';
 interface ISparkSqlTableProps {
     extraDico?: any[];
     initSql?: string;
-    dataSource?: any[];
     value?: any;
-    onSearch?: (data: any) => void;
+    extraInfo?: any;
     onChange?: (value: any) => void;
 }
 declare const SparkSqlTable: (props: ISparkSqlTableProps) => React.JSX.Element;

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

@@ -1,3 +1,7 @@
+import "antd/es/row/style";
+import _Row from "antd/es/row";
+import "antd/es/col/style";
+import _Col from "antd/es/col";
 import "antd/es/button/style";
 import _Button from "antd/es/button";
 import "antd/es/input/style";
@@ -10,9 +14,11 @@ import React from 'react';
 import { EyeOutlined, MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
 import Split from '../../../Split';
 import SqlEdit from '../../../JsonEdit';
+import { useGetLabelCol } from './Datasource/hooks';
 var SparkSqlTable = function SparkSqlTable(props) {
   var extraDico = props.extraDico,
     value = props.value,
+    extraInfo = props.extraInfo,
     onChange = props.onChange;
   var _React$useState = React.useState('orgin'),
     _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -26,6 +32,7 @@ var SparkSqlTable = function SparkSqlTable(props) {
     _React$useState6 = _slicedToArray(_React$useState5, 2),
     list = _React$useState6[0],
     setList = _React$useState6[1];
+  var labelCol = useGetLabelCol(extraInfo);
   var handleAddItem = function handleAddItem() {
     var _list = [].concat(_toConsumableArray(list), [{
       alias: undefined,
@@ -86,10 +93,20 @@ var SparkSqlTable = function SparkSqlTable(props) {
       }
     }
   }, [value]);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_Row, {
+    className: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.borderHidden) && 'ant-form-item',
+    style: {
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(_Col, {
+    span: !(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.labelSpan) && (extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.layout) === 'vertical' && 24,
+    flex: labelCol
+  }, /*#__PURE__*/React.createElement("div", {
     style: {
       border: '2px solid #bebebe',
-      height: '500px'
+      height: '500px',
+      margin: '6px',
+      width: '1135px'
     }
   }, /*#__PURE__*/React.createElement(Split, {
     gutterSize: 2,
@@ -223,6 +240,6 @@ var SparkSqlTable = function SparkSqlTable(props) {
       }]));
     },
     icon: /*#__PURE__*/React.createElement(PlusOutlined, null)
-  }, tr('添加SQL语句')))));
+  }, tr('添加SQL语句'))))))));
 };
 export default SparkSqlTable;

package/es/comps/MetadataForm/HOC/index.js

@@ -5,7 +5,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 /*
  * @Author: wangxian
  * @Date: 2021-09-18 14:15:04
- * @LastEditTime: 2023-11-27 11:19:01
+ * @LastEditTime: 2024-08-21 09:26:31
  */
 import React from 'react';
 import { deepClone } from '../../../utils';

package/es/comps/MetadataForm/hooks/index.js

@@ -4,7 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 /*
  * @Author: your name
  * @Date: 2021-09-18 14:15:04
- * @LastEditTime: 2023-11-27 13:58:40
+ * @LastEditTime: 2024-08-20 19:38:44
  */
 import { getLocale } from '../../../framework/locale';
 import moment from 'moment';
@@ -99,6 +99,9 @@ export var useWatchDepend = function useWatchDepend(_depends, stream$, name) {
 };
 var processDependHiddenOrShow = function processDependHiddenOrShow(depend, changeData, stream$, name) {
   try {
+    // if (depend === 'datasource.dsType =="Kafka"') {
+    //   debugger;
+    // }
     // const regex = /\w+(\.\w+)?[=<>!]{1}/g;
     var regex = /\w+(\.\w+)?[=<>!]{1}|\w+(\.\w+)?(\.indexOf\('.+'\)[=<>!]{1})/g;
     var keys = depend.trim().replace(/\s/g, '').match(regex);
@@ -127,6 +130,8 @@ var processDependHiddenOrShow = function processDependHiddenOrShow(depend, chang
       }
       if (_changeData || _changeData === 0) {
         var r = key === _key[0] ? "'".concat(_changeData, "'") : eval("_changeData.".concat(_key[1]));
+        // 判断 r 是否是字符串
+        r = typeof r === 'string' ? "\"".concat(r, "\"") : r;
         expression = expression.replace(key, r);
       } else {
         expression = expression.replace(key, undefined);