ronds-metadata 1.2.37 → 1.2.39

package/es/comps/FormGenerator/comps/Canvas/core/RenderField/HOC/index.js

@@ -8,6 +8,11 @@ import _Tooltip from "antd/es/tooltip";
 import _objectDestructuringEmpty from "@babel/runtime/helpers/esm/objectDestructuringEmpty";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/*
+ * @Author: wangxian
+ * @Date: 2021-09-18 14:15:04
+ * @LastEditTime: 2023-02-28 13:59:21
+ */
 import React from 'react';
 import { useDrag, useDrop } from 'react-dnd';
 import { DragOutlined, SnippetsOutlined, DeleteOutlined } from '@ant-design/icons';
@@ -17,28 +22,23 @@ import useObservable from '../../../../../../../framework/rxjs-hooks/useObservab
 export function withFieldCellWrapper(WrappedComponent) {
   return function (props) {
     var _cellSetting$depend, _cellSetting$depend2, _cellSetting$depend3, _cellSetting$depend4, _cellSetting$depend5, _cellSetting$depend6;
-
     var data = props.data,
-        refId = props.refId,
-        isShowAction = props.isShowAction;
+      refId = props.refId,
+      isShowAction = props.isShowAction;
     var fGCtx = React.useContext(FGCtx) || {};
     var boxRef = React.useRef(null);
-
     var _React$useState = React.useState(),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        cellSetting = _React$useState2[0],
-        setCellSetting = _React$useState2[1];
-
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      cellSetting = _React$useState2[0],
+      setCellSetting = _React$useState2[1];
     var _React$useState3 = React.useState(),
-        _React$useState4 = _slicedToArray(_React$useState3, 2),
-        types = _React$useState4[0],
-        setTypes = _React$useState4[1];
-
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      types = _React$useState4[0],
+      setTypes = _React$useState4[1];
     var _React$useState5 = React.useState(),
-        _React$useState6 = _slicedToArray(_React$useState5, 2),
-        position = _React$useState6[0],
-        setPosition = _React$useState6[1];
-
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      position = _React$useState6[0],
+      setPosition = _React$useState6[1];
     React.useEffect(function () {
       if ((fGCtx === null || fGCtx === void 0 ? void 0 : fGCtx.types) && (fGCtx === null || fGCtx === void 0 ? void 0 : fGCtx.types[data.id])) {
         //
@@ -53,106 +53,89 @@ export function withFieldCellWrapper(WrappedComponent) {
               setCellSetting(_objectSpread({}, p === null || p === void 0 ? void 0 : p.payload[data.id]));
             }
           }
-
           break;
       }
     }, []);
     useObservable(function (p) {
       processFgStreamData(p);
     }, [fGCtx.fgStream]);
-
     var _useDrag = useDrag({
-      item: {
-        dragItem: data,
-        type: dragItemType
-      },
-      end: function end(item, monitor) {
-        var dropResult = monitor.getDropResult();
-
-        if (item && dropResult) {}
-      },
-      collect: function collect(monitor) {
-        return {
-          isDragging: monitor.isDragging()
-        };
-      }
-    }),
-        _useDrag2 = _slicedToArray(_useDrag, 3);
-
+        item: {
+          dragItem: data,
+          type: dragItemType
+        },
+        end: function end(item, monitor) {
+          var dropResult = monitor.getDropResult();
+          if (item && dropResult) {}
+        },
+        collect: function collect(monitor) {
+          return {
+            isDragging: monitor.isDragging()
+          };
+        }
+      }),
+      _useDrag2 = _slicedToArray(_useDrag, 3);
     _objectDestructuringEmpty(_useDrag2[0]);
-
     var drag = _useDrag2[1],
-        dragPreview = _useDrag2[2]; // 处理组件拖拽落下事件
-
+      dragPreview = _useDrag2[2];
+    // 处理组件拖拽落下事件
     var _useDrop = useDrop({
-      accept: [dragItemType],
-      drop: function drop(item, monitor) {
-        // 如果 children 已经作为了 drop target，不处理
-        var didDrop = monitor.didDrop();
-
-        if (didDrop) {
-          return;
-        }
-
-        (fGCtx === null || fGCtx === void 0 ? void 0 : fGCtx.fgStream) && fGCtx.fgStream.next({
-          type: streamEventType.onDropOver,
-          payload: {
-            dragItem: item.dragItem,
-            dropId: data.id,
-            position: position,
-            refId: refId
+        accept: [dragItemType],
+        drop: function drop(item, monitor) {
+          // 如果 children 已经作为了 drop target，不处理
+          var didDrop = monitor.didDrop();
+          if (didDrop) {
+            return;
           }
-        });
-      },
-      hover: function hover(item, monitor) {
-        // 只检查被hover的最小元素
-        var didHover = monitor.isOver({
-          shallow: true
-        });
-
-        if (didHover) {
-          if (item.dragItem.id === data.id) return; // Determine rectangle on screen
-
-          // Determine rectangle on screen
-          var hoverBoundingRect = boxRef.current && boxRef.current.getBoundingClientRect(); // Get vertical middle
-
-          // Get vertical middle
-          var hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2; // Determine mouse position
-          // const clientOffset = monitor.getClientOffset();
-
-          // Determine mouse position
-          // const clientOffset = monitor.getClientOffset();
-          var dragOffset = monitor.getSourceClientOffset(); // Get pixels to the top
-
-          // Get pixels to the top
-          var hoverClientY = dragOffset.y - hoverBoundingRect.top;
-
-          if (hoverClientY <= hoverMiddleY) {
-            setPosition('borderTop');
-          } // Dragging upwards
-
-
-          // Dragging upwards
-          if (hoverClientY > hoverMiddleY) {
-            setPosition('borderBottom');
+          (fGCtx === null || fGCtx === void 0 ? void 0 : fGCtx.fgStream) && fGCtx.fgStream.next({
+            type: streamEventType.onDropOver,
+            payload: {
+              dragItem: item.dragItem,
+              dropId: data.id,
+              position: position,
+              refId: refId
+            }
+          });
+        },
+        hover: function hover(item, monitor) {
+          // 只检查被hover的最小元素
+          var didHover = monitor.isOver({
+            shallow: true
+          });
+          if (didHover) {
+            if (item.dragItem.id === data.id) return;
+            // Determine rectangle on screen
+            var hoverBoundingRect = boxRef.current && boxRef.current.getBoundingClientRect();
+            // Get vertical middle
+            var hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
+            // Determine mouse position
+            // const clientOffset = monitor.getClientOffset();
+            var dragOffset = monitor.getSourceClientOffset();
+            // Get pixels to the top
+            var hoverClientY = dragOffset.y - hoverBoundingRect.top;
+            if (hoverClientY <= hoverMiddleY) {
+              setPosition('borderTop');
+            }
+            // Dragging upwards
+            if (hoverClientY > hoverMiddleY) {
+              setPosition('borderBottom');
+            }
           }
+        },
+        collect: function collect(monitor) {
+          return {
+            isOver: monitor.isOver({
+              shallow: true
+            }),
+            canDrop: monitor.canDrop()
+          };
         }
-      },
-      collect: function collect(monitor) {
-        return {
-          isOver: monitor.isOver({
-            shallow: true
-          }),
-          canDrop: monitor.canDrop()
-        };
-      }
-    }),
-        _useDrop2 = _slicedToArray(_useDrop, 2),
-        _useDrop2$ = _useDrop2[0],
-        canDrop = _useDrop2$.canDrop,
-        isOver = _useDrop2$.isOver,
-        dropRef = _useDrop2[1];
-
+      }),
+      _useDrop2 = _slicedToArray(_useDrop, 2),
+      _useDrop2$ = _useDrop2[0],
+      canDrop = _useDrop2$.canDrop,
+      isOver = _useDrop2$.isOver,
+      dropRef = _useDrop2[1];
     var onNodeDelete = function onNodeDelete(e) {
       e.stopPropagation();
       fGCtx.fgStream && fGCtx.fgStream.next({
@@ -163,7 +146,6 @@ export function withFieldCellWrapper(WrappedComponent) {
         }
       });
     };
-
     var onNodeCopy = function onNodeCopy(e) {
       e.stopPropagation();
       fGCtx.fgStream && fGCtx.fgStream.next({
@@ -171,24 +153,19 @@ export function withFieldCellWrapper(WrappedComponent) {
         payload: data
       });
     };
-
     var isActive = canDrop && isOver;
     dragPreview(dropRef(boxRef));
-
     var getBorder = function getBorder(_position) {
       var _style = {
         width: '100%',
         height: '100%',
         padding: '4px 10px'
       };
-
       if (_position && isActive) {
         _style[_position] = '2px solid red';
       }
-
       return _style;
     };
-
     return /*#__PURE__*/React.createElement("div", {
       ref: boxRef,
       style: _objectSpread({}, getBorder(position))

package/es/comps/FormGenerator/comps/Canvas/core/RenderField/index.js

@@ -19,15 +19,13 @@ import Upload from './Cell/Upload';
 import Obj from './Cell/Obj';
 import List from './Cell/List';
 import Table from './Cell/Table';
-
 var RenderField = function RenderField(props) {
   var data = props.data,
-      refId = props.refId,
-      _props$isShowAction = props.isShowAction,
-      isShowAction = _props$isShowAction === void 0 ? false : _props$isShowAction;
+    refId = props.refId,
+    _props$isShowAction = props.isShowAction,
+    isShowAction = _props$isShowAction === void 0 ? false : _props$isShowAction;
   var FieldContent = React.useMemo(function () {
     var _content = /*#__PURE__*/React.createElement(React.Fragment, null);
-
     if (data.type && DataCellMap[data.type]) {
       var Comm = DataCellMap[data.type];
       return /*#__PURE__*/React.createElement(Comm, {
@@ -36,12 +34,10 @@ var RenderField = function RenderField(props) {
         isShowAction: isShowAction
       });
     }
-
     return _content;
   }, [data, isShowAction]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, FieldContent);
 };
-
 export default RenderField;
 var DataCellMap = {
   input: Input,

package/es/comps/FormGenerator/comps/Canvas/core/index.js

@@ -7,6 +7,11 @@ import _Col from "antd/es/col";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/*
+ * @Author: wangxian
+ * @Date: 2023-02-06 09:46:17
+ * @LastEditTime: 2023-02-27 11:06:05
+ */
 import React from 'react';
 import { useDrop } from 'react-dnd';
 import { FGCtx } from '../../../../../comps/FormGenerator/Provider';
@@ -15,78 +20,63 @@ import useObservable from '../../../../../framework/rxjs-hooks/useObservable';
 import { arrayInsert, arrayMoveImmutable, guid } from '../../../../../utils';
 import RenderField from './RenderField';
 import './index.less';
-
 var CanvasCore = function CanvasCore(props) {
   var _formSetting$layout;
-
   var refId = props.refId,
-      nodes = props.nodes,
-      onChange = props.onChange;
+    nodes = props.nodes,
+    onChange = props.onChange;
   var fGCtx = React.useContext(FGCtx) || {};
-
   var _React$useState = React.useState([]),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      list = _React$useState2[0],
-      setList = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    list = _React$useState2[0],
+    setList = _React$useState2[1];
   var listRef = React.useRef([]);
-
   var _React$useState3 = React.useState(),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      curNodeId = _React$useState4[0],
-      setCurNodeId = _React$useState4[1];
-
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    curNodeId = _React$useState4[0],
+    setCurNodeId = _React$useState4[1];
   var _React$useState5 = React.useState(_formSetting.param.defaultValue),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      formSetting = _React$useState6[0],
-      setFormSetting = _React$useState6[1];
-
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    formSetting = _React$useState6[0],
+    setFormSetting = _React$useState6[1];
   var _React$useState7 = React.useState(),
-      _React$useState8 = _slicedToArray(_React$useState7, 2),
-      allSetting = _React$useState8[0],
-      setAllSetting = _React$useState8[1];
-
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    allSetting = _React$useState8[0],
+    setAllSetting = _React$useState8[1];
   var allSettingRef = React.useRef();
   React.useEffect(function () {
     if (refId && nodes.length > 0) {
       setList(_toConsumableArray(nodes));
       listRef.current = nodes;
     }
-  }, [refId, nodes]); // 处理默认数据
-
+  }, [refId, nodes]);
+  // 处理默认数据
   var processDefaultValue = React.useCallback(function (data) {
     if (!refId) {
       setList(_toConsumableArray(data.nodes));
       listRef.current = data.nodes;
-
       if (data.types) {
         fGCtx.fgStream && fGCtx.fgStream.next({
           type: streamEventType.onTypesChange,
           payload: data.types
         });
       }
-
       onChange && onChange(data.nodes);
     }
   }, []);
   var addNewNode = React.useCallback(function (_node, dropId, position) {
     var _newNode;
-
     var _list = listRef.current;
     var newNode = _node;
-
     var oldIdx = _list.findIndex(function (it) {
       return it.id === _node.id;
     });
-
     if (dropId && position) {
       //先判断是新增还是改变顺序
       var newIdx = _list.findIndex(function (it) {
         return it.id === dropId;
       });
-
       newIdx = position === 'borderTop' ? newIdx : newIdx + 1;
-
       if (oldIdx === -1) {
         newNode = _objectSpread(_objectSpread({}, _node), {}, {
           id: "".concat(_node.id.split('-')[0], "-").concat(guid().substring(0, 4))
@@ -101,11 +91,9 @@ var CanvasCore = function CanvasCore(props) {
         newNode = _objectSpread(_objectSpread({}, _node), {}, {
           id: "".concat(_node.id.split('-')[0], "-").concat(guid().substring(0, 4))
         });
-
         _list.push(newNode);
       }
     }
-
     if ((_newNode = newNode) === null || _newNode === void 0 ? void 0 : _newNode.id) {
       fGCtx.fgStream && fGCtx.fgStream.next({
         type: streamEventType.onNodeSelect,
@@ -115,36 +103,29 @@ var CanvasCore = function CanvasCore(props) {
         }
       });
     }
-
     setList(_toConsumableArray(_list));
     listRef.current = _list;
     onChange && onChange(_list);
   }, []);
   var processFgStreamData = React.useCallback(function (p) {
     var _p$payload, _p$payload$node, _p$payload2, _p$payload3, _p$payload4;
-
     switch (p === null || p === void 0 ? void 0 : p.type) {
       case streamEventType.onNodeSelect:
         setCurNodeId(p === null || p === void 0 ? void 0 : (_p$payload = p.payload) === null || _p$payload === void 0 ? void 0 : (_p$payload$node = _p$payload.node) === null || _p$payload$node === void 0 ? void 0 : _p$payload$node.id);
         break;
-
       case streamEventType.onClearCanvas:
         setList([]);
         listRef.current = [];
         onChange && onChange([]);
         break;
-
       case streamEventType.onDropOver:
         if (refId === ((_p$payload2 = p.payload) === null || _p$payload2 === void 0 ? void 0 : _p$payload2.refId)) {
           addNewNode(p.payload.dragItem, p.payload.dropId, p.payload.position);
         }
-
         break;
-
       case streamEventType.onNodeCopy:
         addNewNode(p.payload);
         break;
-
       case streamEventType.onNodeDelete:
         if (refId === ((_p$payload3 = p.payload) === null || _p$payload3 === void 0 ? void 0 : _p$payload3.refId)) {
           var _list = listRef.current;
@@ -153,8 +134,8 @@ var CanvasCore = function CanvasCore(props) {
           });
           setList(_toConsumableArray(_list));
           listRef.current = _list;
-          onChange && onChange(_list); // 默认焦点放在第一个
-
+          onChange && onChange(_list);
+          // 默认焦点放在第一个
           if (_list.length > 0) {
             onSelect(_list[0]);
           } else {
@@ -163,32 +144,24 @@ var CanvasCore = function CanvasCore(props) {
             });
           }
         }
-
         break;
-
       case streamEventType.onSettingValueChange:
         if (p === null || p === void 0 ? void 0 : (_p$payload4 = p.payload) === null || _p$payload4 === void 0 ? void 0 : _p$payload4.formSetting) {
           var _p$payload5;
-
           setFormSetting(_objectSpread({}, p === null || p === void 0 ? void 0 : (_p$payload5 = p.payload) === null || _p$payload5 === void 0 ? void 0 : _p$payload5.formSetting));
         }
-
         if ((p === null || p === void 0 ? void 0 : p.payload.refId) === refId) {
           if (refId) {
             var _p$payload6, _p$payload7;
-
             setAllSetting(_objectSpread({}, p === null || p === void 0 ? void 0 : (_p$payload6 = p.payload) === null || _p$payload6 === void 0 ? void 0 : _p$payload6.allSetting[refId]));
             allSettingRef.current = _objectSpread({}, p === null || p === void 0 ? void 0 : (_p$payload7 = p.payload) === null || _p$payload7 === void 0 ? void 0 : _p$payload7.allSetting[refId]);
           } else {
             var _p$payload8, _p$payload9;
-
             setAllSetting(_objectSpread({}, p === null || p === void 0 ? void 0 : (_p$payload8 = p.payload) === null || _p$payload8 === void 0 ? void 0 : _p$payload8.allSetting));
             allSettingRef.current = _objectSpread({}, p === null || p === void 0 ? void 0 : (_p$payload9 = p.payload) === null || _p$payload9 === void 0 ? void 0 : _p$payload9.allSetting);
           }
         }
-
         break;
-
       case streamEventType.onDefaultValue:
         processDefaultValue(p === null || p === void 0 ? void 0 : p.payload);
         break;
@@ -196,43 +169,39 @@ var CanvasCore = function CanvasCore(props) {
   }, []);
   useObservable(function (p) {
     processFgStreamData(p);
-  }, [fGCtx.fgStream]); // 处理组件拖拽落下事件
-
+  }, [fGCtx.fgStream]);
+  // 处理组件拖拽落下事件
   var _useDrop = useDrop({
-    accept: [dragItemType],
-    drop: function drop(item, monitor) {
-      // 如果 children 已经作为了 drop target，不处理
-      var didDrop = monitor.didDrop();
-
-      if (didDrop) {
-        return;
-      }
-
-      addNewNode(item.dragItem);
-    },
-    hover: function hover(item, monitor) {
-      // 只检查被hover的最小元素
-      var didHover = monitor.isOver({
-        shallow: true
-      });
-
-      if (didHover) {}
-    },
-    collect: function collect(monitor) {
-      return {
-        isOver: monitor.isOver({
+      accept: [dragItemType],
+      drop: function drop(item, monitor) {
+        // 如果 children 已经作为了 drop target，不处理
+        var didDrop = monitor.didDrop();
+        if (didDrop) {
+          return;
+        }
+        addNewNode(item.dragItem);
+      },
+      hover: function hover(item, monitor) {
+        // 只检查被hover的最小元素
+        var didHover = monitor.isOver({
           shallow: true
-        }),
-        canDrop: monitor.canDrop()
-      };
-    }
-  }),
-      _useDrop2 = _slicedToArray(_useDrop, 2),
-      _useDrop2$ = _useDrop2[0],
-      isOver = _useDrop2$.isOver,
-      canDrop = _useDrop2$.canDrop,
-      dropRef = _useDrop2[1];
-
+        });
+        if (didHover) {}
+      },
+      collect: function collect(monitor) {
+        return {
+          isOver: monitor.isOver({
+            shallow: true
+          }),
+          canDrop: monitor.canDrop()
+        };
+      }
+    }),
+    _useDrop2 = _slicedToArray(_useDrop, 2),
+    _useDrop2$ = _useDrop2[0],
+    isOver = _useDrop2$.isOver,
+    canDrop = _useDrop2$.canDrop,
+    dropRef = _useDrop2[1];
   var onSelect = function onSelect(it) {
     fGCtx.fgStream && fGCtx.fgStream.next({
       type: streamEventType.onNodeSelect,
@@ -242,17 +211,13 @@ var CanvasCore = function CanvasCore(props) {
       }
     });
   };
-
   var processColSpan = function processColSpan(compColSpan, formColSpan) {
     var _formColSpan = formColSpan !== null && formColSpan !== void 0 ? formColSpan : 24;
-
     if (compColSpan) {
       return compColSpan * _formColSpan <= 24 ? compColSpan * _formColSpan : 24;
     }
-
     return _formColSpan;
   };
-
   var isActive = canDrop && isOver;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: "canvas-wrapper",
@@ -282,7 +247,6 @@ var CanvasCore = function CanvasCore(props) {
     gutter: 8
   }, list.length > 0 && list.map(function (it) {
     var _allSetting$it$id;
-
     return /*#__PURE__*/React.createElement(_Col, {
       key: it.id,
       span: processColSpan(allSetting && ((_allSetting$it$id = allSetting[it.id]) === null || _allSetting$it$id === void 0 ? void 0 : _allSetting$it$id.colSpan), formSetting === null || formSetting === void 0 ? void 0 : formSetting.colSpan),
@@ -311,5 +275,4 @@ var CanvasCore = function CanvasCore(props) {
     }
   }, "\u62D6\u62FD\u5DE6\u4FA7\u680F\u7684\u7EC4\u4EF6\u8FDB\u884C\u6DFB\u52A0")))));
 };
-
 export default /*#__PURE__*/React.memo(CanvasCore);