@luck-design-biz/luckda 1.0.0-alpha → 1.0.1-10

package/lib/lowcode/painter/components/code-editor/JSEditor.js

@@ -18,6 +18,7 @@ var monaco = _interopRequireWildcard3(require("monaco-editor"));
 var _lodash = require("lodash");
 var _standalone = _interopRequireDefault(require("prettier/standalone"));
 var _parserBabel = _interopRequireDefault(require("prettier/parser-babel"));
+var _useCombinedRefs = _interopRequireDefault(require("../../../engine/tools/useCombinedRefs"));
 var _BaseEditor = _interopRequireDefault(require("./BaseEditor"));
 var _excluded = ["children", "keywords"];
 function capitalizeFirstLetter(string) {
@@ -115,31 +116,32 @@ var prettierFormetter = function prettierFormetter(unformattedCode) {
   }
 };
 
-/**
- * JSEditor 组件是一个专为 JavaScript 编辑设计的 React 组件，它基于 BaseEditor 组件构建，并集成了自动完成功能。
- * 该组件利用 monaco-editor 提供的 API，通过 setupAutocomplete 函数设置自动完成项，从而增强代码编辑体验。
- * 自动完成逻辑包括从预定义的自动完成模块中加载补全项，以及在编辑器中键入特定字符（如"."）时触发补全建议。
- *
- * @component
- * @example
- * <JSEditor
- *   language="javascript"
- *   options={{ fontSize: 14 }}
- * >
- *   {`function sayHello() {\n  console.log('Hello, World!');\n}`}
- * </JSEditor>
- *
- * @param {Object} props - 组件的属性。
- * @param {React.ReactNode} children - 传递给 BaseEditor 的 children，通常是初始代码或内容。
- * @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
- * @param {React.Ref} ref - React ref 引用，用于在外部组件中访问 BaseEditor 实例的方法。
- *
- * @returns {ReactElement} 返回一个 React 元素，其中包含了一个具有自动完成功能的 JavaScript 编辑器实例。
+/**
+ * JSEditor 组件是一个专为 JavaScript 编辑设计的 React 组件，它基于 BaseEditor 组件构建，并集成了自动完成功能。
+ * 该组件利用 monaco-editor 提供的 API，通过 setupAutocomplete 函数设置自动完成项，从而增强代码编辑体验。
+ * 自动完成逻辑包括从预定义的自动完成模块中加载补全项，以及在编辑器中键入特定字符（如"."）时触发补全建议。
+ *
+ * @component
+ * @example
+ * <JSEditor
+ *   language="javascript"
+ *   options={{ fontSize: 14 }}
+ * >
+ *   {`function sayHello() {\n  console.log('Hello, World!');\n}`}
+ * </JSEditor>
+ *
+ * @param {Object} props - 组件的属性。
+ * @param {React.ReactNode} children - 传递给 BaseEditor 的 children，通常是初始代码或内容。
+ * @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
+ * @param {React.Ref} ref - React ref 引用，用于在外部组件中访问 BaseEditor 实例的方法。
+ *
+ * @returns {ReactElement} 返回一个 React 元素，其中包含了一个具有自动完成功能的 JavaScript 编辑器实例。
  */
-var JSEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
+var JSEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, outRef) {
   var children = _ref2.children,
     keywords = _ref2.keywords,
     rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  var ref = (0, _useCombinedRefs.default)(outRef);
   (0, _react.useEffect)(function () {
     var originalGetValue = ref.current.editor.getValue.bind(ref.current.editor);
     ref.current.editor.getValue = function () {

package/lib/lowcode/painter/components/code-editor/JsonEditor.js

@@ -11,31 +11,31 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _BaseEditor = _interopRequireDefault(require("./BaseEditor"));
 var _excluded = ["children"];
-/**
- * JsonEditor 组件是一个专门用于编辑 CSS 代码的 React 组件，它基于 BaseEditor 组件构建。
- * 该组件通过将 language 属性固定设置为 "css"，确保编辑器环境专门用于 CSS 代码编辑。
- * 用户可以传入 CSS 代码作为 children，并通过其他 props 控制 BaseEditor 提供的额外功能。
- *
- * @component
- * @example
- * const handleCssChange = (newCss, event) => {
- *   console.log('CSS changed: ', newCss);
- * };
- * <JsonEditor
- *   onChange={handleCssChange}
- *   isFullscreen={false}
- *   width="600px"
- *   height="400px"
- * >
- *   {`body { margin: 0; font-family: Arial, sans-serif; }`}
- * </JsonEditor>
- *
- * @param {Object} props - 组件的属性。
- * @param {React.ReactNode} children - 子组件，通常是编辑器的初始 CSS 代码。
- * @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
- * @param {React.Ref} ref - React ref 引用，用于外部组件调用编辑器实例的方法。
- *
- * @returns {ReactElement} 返回一个 React 元素，该元素内部是一个专门用于 CSS 编辑的 BaseEditor 组件实例。
+/**
+ * JsonEditor 组件是一个专门用于编辑 CSS 代码的 React 组件，它基于 BaseEditor 组件构建。
+ * 该组件通过将 language 属性固定设置为 "css"，确保编辑器环境专门用于 CSS 代码编辑。
+ * 用户可以传入 CSS 代码作为 children，并通过其他 props 控制 BaseEditor 提供的额外功能。
+ *
+ * @component
+ * @example
+ * const handleCssChange = (newCss, event) => {
+ *   console.log('CSS changed: ', newCss);
+ * };
+ * <JsonEditor
+ *   onChange={handleCssChange}
+ *   isFullscreen={false}
+ *   width="600px"
+ *   height="400px"
+ * >
+ *   {`body { margin: 0; font-family: Arial, sans-serif; }`}
+ * </JsonEditor>
+ *
+ * @param {Object} props - 组件的属性。
+ * @param {React.ReactNode} children - 子组件，通常是编辑器的初始 CSS 代码。
+ * @param {Object} rest - 传递给 BaseEditor 组件的其他属性。
+ * @param {React.Ref} ref - React ref 引用，用于外部组件调用编辑器实例的方法。
+ *
+ * @returns {ReactElement} 返回一个 React 元素，该元素内部是一个专门用于 CSS 编辑的 BaseEditor 组件实例。
  */
 var JsonEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var children = _ref.children,

package/lib/lowcode/painter/components/code-editor/VisionEditor.js

@@ -0,0 +1,88 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var monaco = _interopRequireWildcard(require("monaco-editor"));
+var _BaseEditor = _interopRequireDefault(require("./BaseEditor"));
+var _excluded = ["children"];
+// 定义一个简单的JavaScript语言
+monaco.languages.register({
+  id: 'vision'
+});
+
+// 定义语言的配置
+monaco.languages.setLanguageConfiguration('vision', {
+  brackets: [['{', '}'], ['[', ']'], ['(', ')']],
+  autoClosingPairs: [{
+    open: '{',
+    close: '}'
+  }, {
+    open: '[',
+    close: ']'
+  }, {
+    open: '(',
+    close: ')'
+  }, {
+    open: '"',
+    close: '"',
+    notIn: ['string']
+  }, {
+    open: "'",
+    close: "'",
+    notIn: ['string']
+  }]
+});
+
+// 定义语言的词法规则
+monaco.languages.setMonarchTokensProvider('vision', {
+  tokenizer: {
+    root: [[/\b(true|false|null)\b/, 'constant'], [/[{}()\[\]]/, '@brackets'], [/[0-9]+/, 'number'], [/["'](.*?)["']/, 'string'],
+    // 新增模板字符串的词法规则
+    [/\$\{/, 'delimiter.curly'],
+    // 添加对模板表达式起始的支持
+    [/\`/, {
+      token: 'string.quote',
+      bracket: '@open',
+      next: '@template_string'
+    }] // 处理模板字符串
+    ],
+    template_string: [[/\$\{/, {
+      token: 'delimiter.curly',
+      next: '@expression'
+    }],
+    // 模板表达式开始
+    [/\`/, {
+      token: 'string.quote',
+      bracket: '@close',
+      next: '@pop'
+    }],
+    // 模板字符串结束
+    [/./, 'string'] // 模板字符串内的内容
+    ],
+    expression: [[/\}/, {
+      token: 'delimiter.curly',
+      next: '@pop'
+    }],
+    // 模板表达式结束
+    [/[0-9]+/, 'number'],
+    // 在模板表达式内的数字
+    [/[a-zA-Z_]\w*/, 'identifier'] // 在模板表达式内的标识符
+    ]
+  }
+});
+var VisionEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var children = _ref.children,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_BaseEditor.default, (0, _extends2.default)({
+    ref: ref,
+    language: "vision"
+  }, rest), children);
+});
+var _default = exports.default = /*#__PURE__*/_react.default.memo(VisionEditor);

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

@@ -21,6 +21,7 @@ var _Collapse = _interopRequireDefault(require("../../components/Collapse"));
 var _PanelItem = _interopRequireDefault(require("../../components/PanelItem"));
 var _ListEditor = require("../../components/ListEditor");
 var _WidthHeight = _interopRequireDefault(require("../../panel-section/WidthHeight"));
+var _JSEditor = _interopRequireDefault(require("../../panel-section/JSEditor"));
 var _FieldAttrsModal = _interopRequireDefault(require("./FieldAttrsModal"));
 var _FieldRulesModal = _interopRequireDefault(require("./FieldRulesModal"));
 var _apiUrl = require("../../../constants/api-url");
@@ -65,6 +66,19 @@ var _PINNED_OPTIONS_ = [{
   }),
   value: 'right'
 }];
+var _FORM_MODE_OPTIONS_ = [{
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".formMode.single"),
+    label: '单行'
+  }),
+  value: 'single'
+}, {
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".formMode.bulk"),
+    label: '批量'
+  }),
+  value: 'bulk'
+}];
 var _TRUE_FALSE_ = ['__TRUE__', '__FALSE__'];
 var CoderWrapper = _styledComponents.default.div.withConfig({
   displayName: "CoderWrapper",
@@ -78,6 +92,11 @@ var StyledRadio = (0, _styledComponents.default)(_antd.Radio.Group).withConfig({
   displayName: "StyledRadio",
   componentId: "luckda-6530__sc-1n41f3z-2"
 })(["span.ant-radio + *{padding-left:4px;padding-right:4px;}"]);
+var StyledCheckbox = (0, _styledComponents.default)(_antd.Checkbox.Group).withConfig({
+  displayName: "StyledCheckbox",
+  componentId: "luckda-6530__sc-1n41f3z-3"
+})([".ant-checkbox-wrapper{font-size:12px;}"]);
+var _DEFAULT_RENDER_CODE = "function render(value, data, rowIndex, params) { \n  return value;\n}";
 var SettingUI = function SettingUI(_ref) {
   var loading = _ref.loading,
     data = _ref.data,
@@ -323,7 +342,18 @@ var SettingUI = function SettingUI(_ref) {
     onChange: function onChange(val) {
       return run('tip', val);
     }
-  }))), component === 'form' && /*#__PURE__*/_react.default.createElement(_PanelItem.default, {
+  }))), component === 'tableForm' && /*#__PURE__*/_react.default.createElement(_PanelItem.default, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".formMode"),
+      label: '修改方式'
+    })
+  }, /*#__PURE__*/_react.default.createElement(StyledCheckbox, {
+    options: _FORM_MODE_OPTIONS_,
+    defaultValue: fieldData.formMode ? [fieldData.formMode] : ['single', 'bulk'],
+    onChange: function onChange(val) {
+      return run('formMode', val);
+    }
+  })), component === 'form' && /*#__PURE__*/_react.default.createElement(_PanelItem.default, {
     label: (0, _utils.formatMessage)({
       id: "".concat(_I18N_PREFIX_, ".fieldColumn"),
       label: '占列数'
@@ -357,7 +387,7 @@ var SettingUI = function SettingUI(_ref) {
       id: "".concat(_I18N_PREFIX_, ".required"),
       label: '是否必填'
     })
-  }, renderCodeIcon(fieldRequired, _constants.FIELD_SCOPES.FIELD_REQUIRED)), ['table', 'tableForm'].includes && /*#__PURE__*/_react.default.createElement(_PanelItem.default, {
+  }, renderCodeIcon(fieldRequired, _constants.FIELD_SCOPES.FIELD_REQUIRED)), ['table', 'tableForm'].includes(component) && /*#__PURE__*/_react.default.createElement(_PanelItem.default, {
     label: (0, _utils.formatMessage)({
       id: "".concat(_I18N_PREFIX_, ".table.display"),
       label: '表格中显示'
@@ -377,7 +407,19 @@ var SettingUI = function SettingUI(_ref) {
       id: "".concat(_I18N_PREFIX_, ".readonly"),
       label: '是否只读'
     })
-  }, renderCodeIcon(fieldReadonly, _constants.FIELD_SCOPES.FIELD_READONLY)), !isBatch ? /*#__PURE__*/_react.default.createElement(_Collapse.default, {
+  }, renderCodeIcon(fieldReadonly, _constants.FIELD_SCOPES.FIELD_READONLY)), !isBatch ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ['table', 'tableForm'].includes(component) ? /*#__PURE__*/_react.default.createElement(_Collapse.default, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".render"),
+      label: '内容定制渲染'
+    })
+  }, /*#__PURE__*/_react.default.createElement(_JSEditor.default, {
+    defaultValue: fieldData.render,
+    onChange: function onChange(val) {
+      return run('render', val);
+    },
+    mustConfirm: true,
+    defaultCode: _DEFAULT_RENDER_CODE
+  })) : null, /*#__PURE__*/_react.default.createElement(_Collapse.default, {
     label: (0, _utils.formatMessage)({
       id: "".concat(_I18N_PREFIX_, ".defaultValue"),
       label: '默认值'
@@ -392,7 +434,7 @@ var SettingUI = function SettingUI(_ref) {
   }), "\n              \u3010").concat(fieldDefaultValue.expression, "\u3011") : (0, _utils.formatMessage)({
     id: 'luckda.lowcode.painter.setting',
     label: '设置'
-  }))) : null, !isBatch ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Collapse.default, {
+  }))), /*#__PURE__*/_react.default.createElement(_Collapse.default, {
     label: (0, _utils.formatMessage)({
       id: "".concat(_I18N_PREFIX_, ".rules.front"),
       label: '前端校验规则'

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

@@ -231,30 +231,44 @@ var FieldSetting = function FieldSetting(_ref) {
               moduleUid: moduleId
             }, val ? 'uniqueFieldUid' : 'noUniqueFieldUid', fieldData.uid));
           case 3:
-            _context.next = 34;
+            _context.next = 38;
             break;
           case 5:
-            if (!(key === 'align' || key === 'headerAlign' || key === 'pinned' || key === 'tip')) {
+            if (!(key === 'align' || key === 'headerAlign' || key === 'pinned' || key === 'tip' || key === 'render')) {
               _context.next = 9;
               break;
             }
             handleUIChange(key, val);
-            _context.next = 34;
+            _context.next = 38;
             break;
           case 9:
-            if (!(key === 'col' || key === 'row')) {
+            if (!(key === 'formMode')) {
               _context.next = 13;
               break;
             }
-            handleUIChange(key, val);
-            _context.next = 34;
+            if (val.includes('single') && !val.includes('bulk')) {
+              handleUIChange(key, 'single');
+            } else if (!val.includes('single') && val.includes('bulk')) {
+              handleUIChange(key, 'bulk');
+            } else {
+              handleUIChange(key, void 0);
+            }
+            _context.next = 38;
             break;
           case 13:
+            if (!(key === 'col' || key === 'row')) {
+              _context.next = 17;
+              break;
+            }
+            handleUIChange(key, val);
+            _context.next = 38;
+            break;
+          case 17:
             if (!(key === 'delRule')) {
-              _context.next = 21;
+              _context.next = 25;
               break;
             }
-            _context.next = 16;
+            _context.next = 20;
             return (0, _apiUrl.fetchDelAttrs)({
               moduleDatasetUid: fieldData.datasetFieldUid,
               ccmModuleFieldVerifies: [{
@@ -262,11 +276,11 @@ var FieldSetting = function FieldSetting(_ref) {
               }],
               scope: _constants.FIELD_SCOPES.CHECK_RULES
             });
-          case 16:
+          case 20:
             _yield$fetchDelAttrs = _context.sent;
             code = _yield$fetchDelAttrs.code;
             return _context.abrupt("return", code === 1);
-          case 21:
+          case 25:
             mapping = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _constants.FIELD_SCOPES.FIELD_REQUIRED, {
               key: 'fieldRequired',
               refresh: requiredRefresh
@@ -302,15 +316,15 @@ var FieldSetting = function FieldSetting(_ref) {
             if (!_stateItem) {
               d.datasetBusinessUids = [fieldData.uid];
             }
-            _context.next = 31;
+            _context.next = 35;
             return request(d);
-          case 31:
+          case 35:
             _yield$request = _context.sent;
             _code = _yield$request.code;
             if (_code === 1) {
               mapping[key].refresh();
             }
-          case 34:
+          case 38:
           case "end":
             return _context.stop();
         }

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

@@ -11,6 +11,7 @@ var getFrontRules = exports.getFrontRules = function getFrontRules(property) {
     case 'money':
     case 'decimal':
     case 'sint':
+    case 'long':
       rules = [{
         label: '最小值',
         key: 'min',
@@ -53,7 +54,7 @@ var getFrontRules = exports.getFrontRules = function getFrontRules(property) {
   rules.push({
     label: '自定义',
     key: 'rules',
-    defaultCode: "function validator(cValue, rule, value, callback) { \n if(!value) callback('errorMsg'); \n callback(); \n}"
+    defaultCode: "function validator(cValue, rule, value, callback) { \n if(!value) callback('errorMsg'); \n else callback(); \n}"
   });
   return rules;
 };

package/lib/lowcode/painter/index.js

@@ -20,6 +20,7 @@ var Painter = function Painter(_ref) {
   var className = _ref.className,
     code = _ref.code;
   return /*#__PURE__*/_react.default.createElement(_EventBusProvider.default, {
+    key: code,
     runtime: _index.RUNTIME.DESIGN
   }, /*#__PURE__*/_react.default.createElement(_ContextProvider.default, {
     code: code

package/lib/lowcode/painter/panel-section/BlockEditor/index.js

@@ -8,6 +8,12 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _ahooks = require("ahooks");
 var _antd = require("luck-design/antd");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var Paragraph = _antd.Typography.Paragraph;
+var BlockIdSpan = (0, _styledComponents.default)(Paragraph).withConfig({
+  displayName: "BlockIdSpan",
+  componentId: "luckda-6530__sc-gbohir-0"
+})(["display:inline-block;margin:0;color:#595959;text-decoration:var(--ant-primary-color) wavy underline;cursor:copy;padding:0 4px;"]);
 var BlockEditor = function BlockEditor(_ref) {
   var blockName = _ref.blockName,
     blockId = _ref.blockId,
@@ -18,17 +24,25 @@ var BlockEditor = function BlockEditor(_ref) {
       blockId: blockId
     });
   });
-  return /*#__PURE__*/_react.default.createElement("span", {
+  var handleCopyBlockId = (0, _ahooks.useMemoizedFn)(function (e) {
+    e.stopPropagation();
+  });
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
     onClick: handleClick,
     style: next ? {
       color: 'var(--ant-primary-color)',
       cursor: 'pointer'
     } : {}
-  }, blockName || blockId, next && /*#__PURE__*/_react.default.createElement(_antd.Icon, {
-    type: "setting",
+  }, blockName, /*#__PURE__*/_react.default.createElement("span", {
+    onClick: handleCopyBlockId
+  }, /*#__PURE__*/_react.default.createElement(BlockIdSpan, {
     style: {
-      marginLeft: 4
+      display: 'inline-block',
+      margin: 0
+    },
+    copyable: {
+      text: blockId
     }
-  }));
+  }, blockId))));
 };
 var _default = exports.default = BlockEditor;

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

@@ -50,7 +50,7 @@ var addOptions = [{
   }),
   value: 'blank'
 }];
-var BlockEditor = function BlockEditor(_ref) {
+var BlocksEditor = function BlocksEditor(_ref) {
   var onChange = _ref.onChange,
     nodeId = _ref.nodeId,
     renderPanelItems = _ref.renderPanelItems,
@@ -233,4 +233,4 @@ var BlockEditor = function BlockEditor(_ref) {
     label: '新增区块'
   }))))) : null;
 };
-var _default = exports.default = BlockEditor;
+var _default = exports.default = BlocksEditor;