@luck-design-biz/luckda 0.0.25-7 → 0.0.25-9

package/es/lowcode/painter/components/field-setting/SettingUI.js

@@ -1,10 +1,13 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useState } from 'react';
-import { useRequest, useMemoizedFn } from 'ahooks';
-import { Spin, Input, Segmented, Switch, Tooltip, Icon, Radio } from 'luck-design/antd';
+import { useRequest, useMemoizedFn, useCreation } from 'ahooks';
+import { Spin, Input, Segmented, Switch, Tooltip, Icon, Radio, Modal } from 'luck-design/antd';
 import styled from 'styled-components';
-import { isArray } from 'lodash';
+import { isArray, keyBy, isNil, groupBy } from 'lodash';
 import { formatMessage } from '@luck-design-biz/base/utils';
 import Collapse from "../../components/Collapse";
 import PanelItem from "../../components/PanelItem";
@@ -13,6 +16,7 @@ import WidthHeight from "../../panel-section/WidthHeight";
 import FieldAttrsModal from "./FieldAttrsModal";
 import FieldRulesModal from "./FieldRulesModal";
 import { fetchFieldCondition, fetchAttrs } from "../../../constants/api-url";
+import { getFrontRules } from "./meta/frontRules";
 import { FIELD_SCOPES } from "../../../constants";
 var _I18N_PREFIX_ = 'luckda.lowcode.painter.panel-section.fieldsSetting';
 var _ALIGN_OPTIONS_ = [{
@@ -100,12 +104,16 @@ var SettingUI = function SettingUI(_ref) {
     setRules = _useState6[1];
   var _useState7 = useState(null),
     _useState8 = _slicedToArray(_useState7, 2),
-    condition = _useState8[0],
-    setCondition = _useState8[1];
+    frontRules = _useState8[0],
+    setFrontRules = _useState8[1];
   var _useState9 = useState(null),
     _useState10 = _slicedToArray(_useState9, 2),
-    optionalFields = _useState10[0],
-    setOptionalFields = _useState10[1];
+    condition = _useState10[0],
+    setCondition = _useState10[1];
+  var _useState11 = useState(null),
+    _useState12 = _slicedToArray(_useState11, 2),
+    optionalFields = _useState12[0],
+    setOptionalFields = _useState12[1];
   var fieldData = isBatch ? {} : data;
   var _useRequest = useRequest(fetchFieldCondition, {
       defaultParams: [{
@@ -131,20 +139,37 @@ var SettingUI = function SettingUI(_ref) {
       }],
       ready: !isBatch,
       refreshDeps: [fieldData.datasetFieldUid],
-      onSuccess: function onSuccess(_ref4) {
+      onSuccess: function onSuccess(_ref4, _ref5) {
         var code = _ref4.code,
           list = _ref4.list,
           detail = _ref4.detail;
+        var _ref6 = _slicedToArray(_ref5, 1),
+          verifyScope = _ref6[0].verifyScope;
         if (code === 1) {
           var _detail$list$;
-          setRules((_detail$list$ = detail[list[0]]) === null || _detail$list$ === void 0 ? void 0 : _detail$list$.ccmModuleFieldVerifies);
+          var _data = (_detail$list$ = detail[list[0]]) === null || _detail$list$ === void 0 ? void 0 : _detail$list$.ccmModuleFieldVerifies;
+          if (isNil(verifyScope)) {
+            var dataByGroup = groupBy(_data, 'verifyScope');
+            setRules(dataByGroup[1]);
+            setFrontRules(dataByGroup[0]);
+          } else if (verifyScope === 0) setFrontRules(_data);else if (verifyScope === 1) setRules(_data);
         }
       }
     }),
+    rulesParams = _useRequest2.params,
     rulesLoading = _useRequest2.loading,
-    rulesRefresh = _useRequest2.refresh;
-  var handleFieldRulesModalClose = useMemoizedFn(function (success) {
-    success && rulesRefresh();
+    rulesRun = _useRequest2.run;
+  var rulesRefresh = function rulesRefresh() {
+    var newParams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return rulesRun(_objectSpread(_objectSpread({}, rulesParams[0]), newParams));
+  };
+  var propertyRules = useCreation(function () {
+    return keyBy(getFrontRules(fieldData.property), 'key');
+  }, [fieldData]);
+  var handleFieldRulesModalClose = useMemoizedFn(function (success, verifyScope) {
+    success && rulesRefresh({
+      verifyScope: verifyScope
+    });
     setRule(null);
   });
   var renderCodeIcon = useMemoizedFn(function (_stateItem, _scope) {
@@ -170,6 +195,55 @@ var SettingUI = function SettingUI(_ref) {
       }
     })));
   });
+  var handleDelete = useMemoizedFn( /*#__PURE__*/function () {
+    var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(uid, verifyScope) {
+      return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            Modal.confirm({
+              title: formatMessage({
+                id: 'luckda.lowcode.painter.delete.tip',
+                label: '确定删除吗？'
+              }),
+              getContainer: function getContainer() {
+                return document.getElementById('lc-design-workspace');
+              },
+              zIndex: 1001,
+              onOk: function () {
+                var _onOk = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+                  var success;
+                  return _regeneratorRuntime().wrap(function _callee$(_context) {
+                    while (1) switch (_context.prev = _context.next) {
+                      case 0:
+                        _context.next = 2;
+                        return run('delRule', uid);
+                      case 2:
+                        success = _context.sent;
+                        if (success) rulesRefresh({
+                          verifyScope: verifyScope
+                        });
+                      case 4:
+                      case "end":
+                        return _context.stop();
+                    }
+                  }, _callee);
+                }));
+                function onOk() {
+                  return _onOk.apply(this, arguments);
+                }
+                return onOk;
+              }()
+            });
+          case 1:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+    return function (_x, _x2) {
+      return _ref7.apply(this, arguments);
+    };
+  }());
   return /*#__PURE__*/React.createElement(Spin, {
     spinning: _loading || loading || rulesLoading
   }, !isBatch ? /*#__PURE__*/React.createElement(PanelItem, {
@@ -183,7 +257,7 @@ var SettingUI = function SettingUI(_ref) {
     onChange: function onChange(e) {
       return onAliasChange(fieldData, e.target.value);
     }
-  })) : null, (component === 'table' || component === 'tableForm') && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PanelItem, {
+  })) : null, ['table', 'tableForm'].includes(component) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PanelItem, {
     label: formatMessage({
       id: "".concat(_I18N_PREFIX_, ".width"),
       label: '列宽'
@@ -327,15 +401,15 @@ var SettingUI = function SettingUI(_ref) {
       id: "".concat(_I18N_PREFIX_, ".required"),
       label: '是否必填'
     })
-  }, renderCodeIcon(fieldRequired, FIELD_SCOPES.FIELD_REQUIRED)), 'table' === component && /*#__PURE__*/React.createElement(PanelItem, {
+  }, renderCodeIcon(fieldRequired, FIELD_SCOPES.FIELD_REQUIRED)), ['table', 'tableForm'].includes && /*#__PURE__*/React.createElement(PanelItem, {
     label: formatMessage({
-      id: "".concat(_I18N_PREFIX_, ".display"),
-      label: '是否显示'
+      id: "".concat(_I18N_PREFIX_, ".table.display"),
+      label: '表格中显示'
     })
-  }, renderCodeIcon(fieldTable, FIELD_SCOPES.FIELD_TABLE_DISPLAY)), 'form' === component && /*#__PURE__*/React.createElement(PanelItem, {
+  }, renderCodeIcon(fieldTable, FIELD_SCOPES.FIELD_TABLE_DISPLAY)), ['form', 'tableForm'].includes(component) && /*#__PURE__*/React.createElement(PanelItem, {
     label: formatMessage({
-      id: "".concat(_I18N_PREFIX_, ".display"),
-      label: '是否显示'
+      id: "".concat(_I18N_PREFIX_, ".form.display"),
+      label: '表单中显示'
     })
   }, renderCodeIcon(fieldForm, FIELD_SCOPES.FIELD_FORM_DISPLAY)), /*#__PURE__*/React.createElement(PanelItem, {
     label: formatMessage({
@@ -362,7 +436,61 @@ var SettingUI = function SettingUI(_ref) {
   }), "\n              \u3010").concat(fieldDefaultValue.expression, "\u3011") : formatMessage({
     id: 'luckda.lowcode.painter.setting',
     label: '设置'
-  }))) : null, !isBatch ? /*#__PURE__*/React.createElement(Collapse, {
+  }))) : null, !isBatch ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Collapse, {
+    label: formatMessage({
+      id: "".concat(_I18N_PREFIX_, ".rules.front"),
+      label: '前端校验规则'
+    }),
+    bodyStyle: {
+      padding: '12px 16px'
+    }
+  }, /*#__PURE__*/React.createElement(ListEditor, {
+    addText: formatMessage({
+      id: "".concat(_I18N_PREFIX_, ".addRules"),
+      label: '添加校验规则'
+    }),
+    handleAdd: function handleAdd() {
+      return setRule({
+        ruleType: 'front'
+      });
+    }
+  }, frontRules === null || frontRules === void 0 ? void 0 : frontRules.map(function (_rule) {
+    return /*#__PURE__*/React.createElement(ListEditorItem, {
+      left: /*#__PURE__*/React.createElement("span", null, propertyRules[_rule.verifyType].label),
+      right: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
+        title: formatMessage({
+          id: 'luckda.lowcode.painter.edit',
+          label: '编辑'
+        })
+      }, /*#__PURE__*/React.createElement(Icon, {
+        type: "edit",
+        style: {
+          marginRight: '8px',
+          cursor: 'pointer'
+        },
+        onClick: function onClick() {
+          return setRule(_objectSpread(_objectSpread({}, _rule), {}, {
+            ruleType: 'front'
+          }));
+        }
+      })), /*#__PURE__*/React.createElement(Tooltip, {
+        title: formatMessage({
+          id: 'luckda.lowcode.painter.delete',
+          label: '删除'
+        })
+      }, /*#__PURE__*/React.createElement(Icon, {
+        type: "delete",
+        style: {
+          cursor: 'pointer'
+        },
+        onClick: function onClick() {
+          return handleDelete(_rule.uid, 0);
+        }
+      }))),
+      item: _rule,
+      sortable: false
+    });
+  }))), /*#__PURE__*/React.createElement(Collapse, {
     label: formatMessage({
       id: "".concat(_I18N_PREFIX_, ".rules"),
       label: '校验规则'
@@ -376,7 +504,9 @@ var SettingUI = function SettingUI(_ref) {
       label: '添加校验规则'
     }),
     handleAdd: function handleAdd() {
-      return setRule({});
+      return setRule({
+        ruleType: 'back'
+      });
     }
   }, rules === null || rules === void 0 ? void 0 : rules.map(function (_rule) {
     return /*#__PURE__*/React.createElement(ListEditorItem, {
@@ -393,7 +523,9 @@ var SettingUI = function SettingUI(_ref) {
           cursor: 'pointer'
         },
         onClick: function onClick() {
-          return setRule(_rule);
+          return setRule(_objectSpread(_objectSpread({}, _rule), {}, {
+            ruleType: 'back'
+          }));
         }
       })), /*#__PURE__*/React.createElement(Tooltip, {
         title: formatMessage({
@@ -406,13 +538,13 @@ var SettingUI = function SettingUI(_ref) {
           cursor: 'pointer'
         },
         onClick: function onClick() {
-          return run('delRule', _rule.uid);
+          return handleDelete(_rule.uid, 1);
         }
       }))),
       item: _rule,
       sortable: false
     });
-  }))) : null, /*#__PURE__*/React.createElement(FieldAttrsModal, {
+  })))) : null, /*#__PURE__*/React.createElement(FieldAttrsModal, {
     dataModelKey: dataModelKey,
     datasetId: datasetId,
     moduleId: moduleId,

package/es/lowcode/painter/components/field-setting/index.js

@@ -211,88 +211,57 @@ var FieldSetting = function FieldSetting(_ref) {
     }),
     runDebounce = _useDebounceFn.run;
   var run = useMemoizedFn( /*#__PURE__*/function () {
-    var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(key, val) {
-      var mapping, _stateItem, request, c, d, _yield$request, code;
-      return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
+    var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(key, val) {
+      var _yield$fetchDelAttrs, code, mapping, _stateItem, request, c, d, _yield$request, _code;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
           case 0:
             if (!(key === 'isEqual')) {
-              _context2.next = 5;
+              _context.next = 5;
               break;
             }
-            _context2.next = 3;
+            _context.next = 3;
             return runFetchUpdateUniqueField(_defineProperty({
               moduleDatasetUid: datasetId,
               moduleUid: moduleId
             }, val ? 'uniqueFieldUid' : 'noUniqueFieldUid', fieldData.uid));
           case 3:
-            _context2.next = 30;
+            _context.next = 34;
             break;
           case 5:
             if (!(key === 'align' || key === 'headerAlign' || key === 'pinned' || key === 'tip')) {
-              _context2.next = 9;
+              _context.next = 9;
               break;
             }
             handleUIChange(key, val);
-            _context2.next = 30;
+            _context.next = 34;
             break;
           case 9:
             if (!(key === 'col' || key === 'row')) {
-              _context2.next = 13;
+              _context.next = 13;
               break;
             }
             handleUIChange(key, val);
-            _context2.next = 30;
+            _context.next = 34;
             break;
           case 13:
             if (!(key === 'delRule')) {
-              _context2.next = 17;
+              _context.next = 21;
               break;
             }
-            Modal.confirm({
-              title: formatMessage({
-                id: 'luckda.lowcode.painter.delete.tip',
-                label: '确定删除吗？'
-              }),
-              getContainer: function getContainer() {
-                return document.getElementById('lc-design-workspace');
-              },
-              zIndex: 1001,
-              onOk: function () {
-                var _onOk = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-                  var _yield$fetchDelAttrs, code;
-                  return _regeneratorRuntime().wrap(function _callee$(_context) {
-                    while (1) switch (_context.prev = _context.next) {
-                      case 0:
-                        _context.next = 2;
-                        return fetchDelAttrs({
-                          moduleDatasetUid: fieldData.datasetFieldUid,
-                          ccmModuleFieldVerifies: [{
-                            uid: val
-                          }],
-                          scope: FIELD_SCOPES.CHECK_RULES
-                        });
-                      case 2:
-                        _yield$fetchDelAttrs = _context.sent;
-                        code = _yield$fetchDelAttrs.code;
-                        if (code === 1) {
-                          rulesRefresh();
-                        }
-                      case 5:
-                      case "end":
-                        return _context.stop();
-                    }
-                  }, _callee);
-                }));
-                function onOk() {
-                  return _onOk.apply(this, arguments);
-                }
-                return onOk;
-              }()
+            _context.next = 16;
+            return fetchDelAttrs({
+              moduleDatasetUid: fieldData.datasetFieldUid,
+              ccmModuleFieldVerifies: [{
+                uid: val
+              }],
+              scope: FIELD_SCOPES.CHECK_RULES
             });
-            _context2.next = 30;
-            break;
-          case 17:
+          case 16:
+            _yield$fetchDelAttrs = _context.sent;
+            code = _yield$fetchDelAttrs.code;
+            return _context.abrupt("return", code === 1);
+          case 21:
             mapping = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, FIELD_SCOPES.FIELD_REQUIRED, {
               key: 'fieldRequired',
               refresh: requiredRefresh
@@ -328,19 +297,19 @@ var FieldSetting = function FieldSetting(_ref) {
             if (!_stateItem) {
               d.datasetBusinessUids = [fieldData.uid];
             }
-            _context2.next = 27;
+            _context.next = 31;
             return request(d);
-          case 27:
-            _yield$request = _context2.sent;
-            code = _yield$request.code;
-            if (code === 1) {
+          case 31:
+            _yield$request = _context.sent;
+            _code = _yield$request.code;
+            if (_code === 1) {
               mapping[key].refresh();
             }
-          case 30:
+          case 34:
           case "end":
-            return _context2.stop();
+            return _context.stop();
         }
-      }, _callee2);
+      }, _callee);
     }));
     return function (_x, _x2) {
       return _ref8.apply(this, arguments);

package/es/lowcode/painter/components/field-setting/meta/frontRules.js

@@ -0,0 +1,53 @@
+export var getFrontRules = function getFrontRules(property) {
+  var rules = [];
+  switch (property) {
+    case 'number':
+    case 'money':
+    case 'decimal':
+    case 'sint':
+      rules = [{
+        label: '最小值',
+        key: 'min',
+        defaultCode: "function min(cValue) { \n return 0; // 返回数字 \n}"
+      }, {
+        label: '最大值',
+        key: 'max',
+        defaultCode: "function max(cValue) { \n return 100; // 返回数字 \n}"
+      }];
+      break;
+    case 'string':
+      rules = [{
+        label: '长度',
+        key: 'length',
+        defaultCode: "function length(cValue) { \n return 100; // 返回数字 \n}"
+      }, {
+        label: '邮箱',
+        key: 'email',
+        noCode: true
+      }, {
+        label: '身份证',
+        key: 'idcard',
+        noCode: true
+      }, {
+        label: '手机号码',
+        key: 'mobile',
+        noCode: true
+      }];
+      break;
+    case 'text':
+      rules = [{
+        label: '长度',
+        key: 'length',
+        defaultCode: "function length(cValue) { \n return 100; // 返回数字 \n}"
+      }];
+      break;
+    default:
+      ;
+  }
+  rules.push({
+    label: '自定义',
+    key: 'rules',
+    defaultCode: "function validator(cValue, rule, value, callback) { \n if(!value) callback('errorMsg'); \n callback(); \n}"
+  });
+  return rules;
+};

package/es/lowcode/painter/panel-section/BlocksEditor/index.js

@@ -48,13 +48,10 @@ var BlockEditor = function BlockEditor(_ref) {
     nodeId = _ref.nodeId,
     renderPanelItems = _ref.renderPanelItems,
     innerProps = _ref.innerProps;
-  var node = useGet({
-    id: nodeId
+  var blocks = useGet({
+    id: nodeId,
+    path: 'props.blocks'
   });
-  var _ref2 = node || {
-      props: {}
-    },
-    blocks = _ref2.props.blocks;
   var handleAddBlock = useMemoizedFn(function (type) {
     var _id = "block_".concat(suid());
     var newData = concat(blocks, _objectSpread(_objectSpread({
@@ -112,8 +109,8 @@ var BlockEditor = function BlockEditor(_ref) {
   });
   var menu = useCreation(function () {
     return /*#__PURE__*/React.createElement(Menu, {
-      onClick: function onClick(_ref3) {
-        var key = _ref3.key;
+      onClick: function onClick(_ref2) {
+        var key = _ref2.key;
         return handleAddBlock(key);
       }
     }, addOptions.map(function (opt) {
@@ -159,9 +156,7 @@ var BlockEditor = function BlockEditor(_ref) {
   }, renderPanelItems(commonProps.map(function (p) {
     var cloneP = cloneDeep(p);
     if (cloneP.key === 'dataset') {
-      var _valueKey = 'blocks[0].fields';
-      cloneP.next.props[0].valueKey = _valueKey;
-      cloneP.beforeChangeKey = _valueKey;
+      cloneP.fieldsKey = 'blocks[0].fields';
     }
     return _objectSpread(_objectSpread({}, cloneP), {}, {
       disabled: includes(['mode', 'serialEffect'], cloneP.key) || cloneP.disabled,
@@ -206,10 +201,9 @@ var BlockEditor = function BlockEditor(_ref) {
       cloneP.valueKey = "blocks[".concat(i + 1, "].").concat(p.key);
       if (p.key === 'dataset') {
         if (includes(['auto', 'grid', 'writer'], blockItem.type)) {
-          if (blockItem.type !== 'auto') cloneP.next.props[0].component = "tableForm";
-          var _valueKey = "blocks[".concat(i + 1, "].fields");
-          cloneP.next.props[0].valueKey = _valueKey;
-          cloneP.beforeChangeKey = _valueKey;
+          if (blockItem.type !== 'auto') cloneP.component = 'tableForm';
+          cloneP.fieldsKey = "blocks[".concat(i + 1, "].fields");
+          ;
           result.push(cloneP);
         }
       } else result.push(cloneP);

package/es/lowcode/painter/panel-section/DataSetSelector.js

@@ -7,6 +7,7 @@ import styled from 'styled-components';
 import { Select, Button, Tooltip } from 'luck-design/antd';
 import { useRemoteSource } from "../../engine/provider/ContextProvider";
 import { fetchAddDataset } from "../../constants/api-url";
+import { getLDMetaAttr } from "../../engine/tools/helper";
 var Div = styled.div.withConfig({
   displayName: "Div",
   componentId: "luckda-6530__sc-onj9tc-0"
@@ -14,7 +15,9 @@ var Div = styled.div.withConfig({
 var DataSetSelector = function DataSetSelector(_ref) {
   var defaultValue = _ref.defaultValue,
     onChange = _ref.onChange,
-    beforeChangeKey = _ref.beforeChangeKey,
+    _ref$fieldsKey = _ref.fieldsKey,
+    fieldsKey = _ref$fieldsKey === void 0 ? 'fields' : _ref$fieldsKey,
+    component = _ref.component,
     size = _ref.size,
     isTree = _ref.isTree,
     next = _ref.next;
@@ -30,8 +33,7 @@ var DataSetSelector = function DataSetSelector(_ref) {
     dataset = _useRemoteSource.dataset,
     fetchAllDatasetLoading = _useRemoteSource.fetchAllDatasetLoading,
     refreshModlueData = _useRemoteSource.refreshModlueData,
-    refreshDataset = _useRemoteSource.refreshDataset,
-    pageinfo = _useRemoteSource.pageinfo;
+    refreshDataset = _useRemoteSource.refreshDataset;
   var _useRequest = useRequest(fetchAddDataset, {
       manual: true
     }),
@@ -45,12 +47,12 @@ var DataSetSelector = function DataSetSelector(_ref) {
   }, [dataset, isTree]);
   var handleChange = useMemoizedFn( /*#__PURE__*/function () {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(value, _ref3) {
-      var key, _pageinfo$relationshi, moduleId, dataModelKey, _yield$runAsync, code, res, _ds;
+      var key, _getLDMetaAttr, _getLDMetaAttr2, moduleId, dataModelKey, _yield$runAsync, code, res, _ds;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             key = _ref3.key;
-            _pageinfo$relationshi = pageinfo.relationship, moduleId = _pageinfo$relationshi.moduleId, dataModelKey = _pageinfo$relationshi.dataModelKey;
+            _getLDMetaAttr = getLDMetaAttr(['moduleId', 'dataModelKey']), _getLDMetaAttr2 = _slicedToArray(_getLDMetaAttr, 2), moduleId = _getLDMetaAttr2[0], dataModelKey = _getLDMetaAttr2[1];
             _context.next = 4;
             return runAsync({
               uid: moduleId,
@@ -76,8 +78,25 @@ var DataSetSelector = function DataSetSelector(_ref) {
                 code: value,
                 uid: key
               };
-              onChange(_ds, function (_beforeChange) {
-                return _beforeChange(beforeChangeKey, []);
+              onChange(_ds, function (exe) {
+                var dsFields = res.data.dataSets[value];
+                exe(fieldsKey, dsFields.map(function (f) {
+                  var _extra = JSON.parse(f.extra || '{}');
+                  var restProps = {};
+                  if (['table', 'tableForm'].includes(component)) {
+                    var alignMapping = {
+                      0: 'left',
+                      1: 'center',
+                      2: 'right'
+                    };
+                    restProps.align = alignMapping[_extra.scell_alignment];
+                    restProps.headerAlign = alignMapping[_extra.sheading_alignment];
+                  }
+                  return {
+                    uid: f.uid,
+                    field: f.field
+                  };
+                }));
               });
               setCurrentDataset(_ds);
             }
@@ -118,9 +137,10 @@ var DataSetSelector = function DataSetSelector(_ref) {
     disabled: !currentDataset,
     onClick: function onClick() {
       return next({
-        pageinfo: pageinfo,
         datasetUid: currentDataset.uid,
-        datasetCode: currentDataset.code
+        datasetCode: currentDataset.code,
+        valueKey: fieldsKey,
+        component: component
       });
     }
   }), /*#__PURE__*/React.createElement(Button, {