@luck-design-biz/luckda 0.0.25-1 → 0.0.25-10

package/es/lowcode/engine/tools/useCanvasRender.js

@@ -2,21 +2,20 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 var _excluded = ["props", "children"],
   _excluded2 = ["id", "component", "name", "desc", "icon", "group", "groupName", "order"];
 import React, { useRef } from 'react';
 import { dynamic } from 'umi';
-import { useMemoizedFn, useCookieState, useCreation } from 'ahooks';
+import { useMemoizedFn, useCreation } from 'ahooks';
 import { upperFirst } from 'lodash';
-import { LC_BUILDIN_UNIT_KEY_LIST, RUNTIME_COOKIE_KEY } from "../../constants";
+import { useContext } from "../provider/ContextProvider";
+import { LC_BUILDIN_UNIT_KEY_LIST } from "../../constants";
 export default function useCanvasRender(data, deps) {
   var dynamicCompMap = useRef({});
-  var _useCookieState = useCookieState(RUNTIME_COOKIE_KEY),
-    _useCookieState2 = _slicedToArray(_useCookieState, 1),
-    runtime = _useCookieState2[0];
-  var render = useMemoizedFn(function (_ref) {
-    var props = _ref.props,
+  var ctx = useContext();
+  var render = useMemoizedFn(function () {
+    var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      props = _ref.props,
       children = _ref.children,
       childrenMap = _objectWithoutProperties(_ref, _excluded);
     if (props && !LC_BUILDIN_UNIT_KEY_LIST.includes(props.id)) {
@@ -37,7 +36,7 @@ export default function useCanvasRender(data, deps) {
               return _regeneratorRuntime().wrap(function _callee$(_context) {
                 while (1) switch (_context.prev = _context.next) {
                   case 0:
-                    _runtime = upperFirst(runtime);
+                    _runtime = upperFirst(ctx.runtime);
                     _context.next = 3;
                     return import("../../view/lc-components/".concat(component, "/Function").concat(_runtime));
                   case 3:

package/es/lowcode/engine/tools/usePageDataStore.js

@@ -0,0 +1,331 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import { useRef, useEffect, useCallback } from 'react';
+import { create, createStore, useStore } from 'zustand';
+import { immer } from 'zustand/middleware/immer';
+import { subscribeWithSelector } from 'zustand/middleware';
+import { useShallow } from 'zustand/react/shallow';
+import { isObject, isArray, isNil, isFunction, isString, get, set as _set, assign, forOwn, omit, debounce } from 'lodash';
+import isDeepEqual from 'fast-deep-equal';
+import { getPathNodesById, findNodeAndParent } from "./dataProcess";
+import { LC_BUILDIN_UNIT_KEY } from "../../constants";
+var temporalStateCreator = function temporalStateCreator(userSet, userGet, options) {
+  var stateCreator = function stateCreator(set, get) {
+    return {
+      pastStates: (options === null || options === void 0 ? void 0 : options.pastStates) || [],
+      futureStates: (options === null || options === void 0 ? void 0 : options.futureStates) || [],
+      undo: function undo() {
+        var steps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+        if (get().pastStates.length) {
+          var _options$partialize, _options$diff;
+          var currentState = (options === null || options === void 0 || (_options$partialize = options.partialize) === null || _options$partialize === void 0 ? void 0 : _options$partialize.call(options, userGet())) || userGet();
+          var statesToApply = get().pastStates.splice(-steps, steps);
+          var nextState = statesToApply.shift();
+          userSet(nextState);
+          set({
+            pastStates: get().pastStates,
+            futureStates: get().futureStates.concat((options === null || options === void 0 || (_options$diff = options.diff) === null || _options$diff === void 0 ? void 0 : _options$diff.call(options, currentState, nextState)) || currentState, statesToApply.reverse())
+          });
+        }
+      },
+      redo: function redo() {
+        var steps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+        if (get().futureStates.length) {
+          var _options$partialize2, _options$diff2;
+          var currentState = (options === null || options === void 0 || (_options$partialize2 = options.partialize) === null || _options$partialize2 === void 0 ? void 0 : _options$partialize2.call(options, userGet())) || userGet();
+          var statesToApply = get().futureStates.splice(-steps, steps);
+          var nextState = statesToApply.shift();
+          userSet(nextState);
+          set({
+            pastStates: get().pastStates.concat((options === null || options === void 0 || (_options$diff2 = options.diff) === null || _options$diff2 === void 0 ? void 0 : _options$diff2.call(options, currentState, nextState)) || currentState, statesToApply.reverse()),
+            futureStates: get().futureStates
+          });
+        }
+      },
+      clear: function clear() {
+        return set({
+          pastStates: [],
+          futureStates: []
+        });
+      },
+      isTracking: true,
+      pause: function pause() {
+        return set({
+          isTracking: false
+        });
+      },
+      resume: function resume() {
+        return set({
+          isTracking: true
+        });
+      },
+      setOnSave: function setOnSave(_onSave) {
+        return set({
+          _onSave: _onSave
+        });
+      },
+      // Internal properties
+      _onSave: options === null || options === void 0 ? void 0 : options.onSave,
+      _handleSet: function _handleSet(pastState, replace, currentState, deltaState) {
+        var _get$_onSave, _get;
+        if (options !== null && options !== void 0 && options.limit && get().pastStates.length >= (options === null || options === void 0 ? void 0 : options.limit)) {
+          get().pastStates.shift();
+        }
+        (_get$_onSave = (_get = get())._onSave) === null || _get$_onSave === void 0 || _get$_onSave.call(_get, pastState, currentState);
+        set({
+          pastStates: get().pastStates.concat(deltaState || pastState),
+          futureStates: []
+        });
+      }
+    };
+  };
+  return stateCreator;
+};
+var temporal = function temporal(config, options) {
+  var configWithTemporal = function configWithTemporal(set, get, store) {
+    var _options$wrapTemporal, _options$handleSet;
+    store.temporal = createStore((options === null || options === void 0 || (_options$wrapTemporal = options.wrapTemporal) === null || _options$wrapTemporal === void 0 ? void 0 : _options$wrapTemporal.call(options, temporalStateCreator(set, get, options))) || temporalStateCreator(set, get, options));
+    var curriedHandleSet = (options === null || options === void 0 || (_options$handleSet = options.handleSet) === null || _options$handleSet === void 0 ? void 0 : _options$handleSet.call(options, store.temporal.getState()._handleSet)) || store.temporal.getState()._handleSet;
+    var temporalHandleSet = function temporalHandleSet(pastState) {
+      var _options$partialize3, _options$diff3, _options$equality;
+      if (!store.temporal.getState().isTracking) return;
+      var currentState = (options === null || options === void 0 || (_options$partialize3 = options.partialize) === null || _options$partialize3 === void 0 ? void 0 : _options$partialize3.call(options, get())) || get();
+      var deltaState = options === null || options === void 0 || (_options$diff3 = options.diff) === null || _options$diff3 === void 0 ? void 0 : _options$diff3.call(options, pastState, currentState);
+      if (
+      // Don't call handleSet if state hasn't changed, as determined by diff fn or equality fn
+      !(
+      // If the user has provided a diff function but nothing has been changed, deltaState will be null
+
+      deltaState === null || // If the user has provided an equality function, use it
+      options !== null && options !== void 0 && (_options$equality = options.equality) !== null && _options$equality !== void 0 && _options$equality.call(options, pastState, currentState))) {
+        curriedHandleSet(pastState, void 0, currentState, deltaState);
+      }
+    };
+    var setState = store.setState;
+    store.setState = function () {
+      var _options$partialize4;
+      var pastState = (options === null || options === void 0 || (_options$partialize4 = options.partialize) === null || _options$partialize4 === void 0 ? void 0 : _options$partialize4.call(options, get())) || get();
+      setState.apply(void 0, arguments);
+      temporalHandleSet(pastState);
+    };
+    return config(
+    // Modify the set function to call the userlandSet function
+    function () {
+      var _options$partialize5;
+      var pastState = (options === null || options === void 0 || (_options$partialize5 = options.partialize) === null || _options$partialize5 === void 0 ? void 0 : _options$partialize5.call(options, get())) || get();
+      set.apply(void 0, arguments);
+      temporalHandleSet(pastState);
+    }, get, store);
+  };
+  return configWithTemporal;
+};
+var findNode = function findNode(obj, id) {
+  for (var key in obj) {
+    if (!['props', 'children'].includes(key)) {
+      if (key === id) {
+        return {
+          target: obj[key],
+          parent: obj
+        };
+      }
+      if (_typeof(obj[key]) === 'object' && !Array.isArray(obj[key])) {
+        var result = findNode(obj[key], id);
+        if (result) {
+          return result;
+        }
+      }
+    }
+  }
+  return null;
+};
+var usePageDataStore = create()(immer(subscribeWithSelector(temporal(function (set) {
+  return {
+    pageData: null,
+    moduleData: null,
+    initialize: function initialize(data) {
+      return set(function (state) {
+        state.pageData = data;
+      });
+    },
+    initializeModule: function initializeModule(data) {
+      return set(function (state) {
+        state.moduleData = data;
+      });
+    },
+    reset: function reset(data) {
+      return set(function (state) {
+        state.pageData = data || null;
+      });
+    }
+  };
+}, {
+  partialize: function partialize(state) {
+    return {
+      pageData: state.pageData
+    };
+  },
+  equality: function equality(pastState, newState) {
+    return !pastState.pageData || isDeepEqual(pastState, newState);
+  },
+  handleSet: function handleSet(_handleSet2) {
+    return debounce(function (state) {
+      for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key2 = 1; _key2 < _len; _key2++) {
+        args[_key2 - 1] = arguments[_key2];
+      }
+      return _handleSet2.apply(void 0, [state].concat(args));
+    }, 400, {
+      leading: true,
+      trailing: false
+    });
+  }
+}))));
+export default usePageDataStore;
+export var resetPageData = function resetPageData(data) {
+  usePageDataStore.setState(function (state) {
+    state.pageData = data || null;
+  });
+};
+export var addNode = function addNode(parentId, id, data) {
+  usePageDataStore.setState(function (state) {
+    if (parentId === LC_BUILDIN_UNIT_KEY.PAGE_ROOT) {
+      state.pageData.children.push(id);
+      state.pageData[id] = {
+        props: _objectSpread(_objectSpread({}, data), {}, {
+          id: id,
+          parentId: parentId
+        })
+      };
+      return;
+    }
+    var _ref = findNode(state.pageData, parentId) || {},
+      target = _ref.target;
+    if (!target) return;
+    if (!target.hasOwnProperty('children')) {
+      target.children = [];
+    }
+    if (!target.children.includes(id)) {
+      target.children.push(id);
+      target[id] = {
+        props: _objectSpread(_objectSpread({}, data), {}, {
+          id: id,
+          parentId: parentId
+        })
+      };
+    }
+  });
+};
+export var deleteNode = function deleteNode(id) {
+  usePageDataStore.setState(function (state) {
+    var _parent$children;
+    var _ref2 = findNode(state.pageData, id) || {},
+      parent = _ref2.parent;
+    if (!parent || !((_parent$children = parent.children) !== null && _parent$children !== void 0 && _parent$children.length)) return;
+    parent.children.splice(parent.children.indexOf(id), 1);
+    if (parent.children.length === 0) {
+      delete parent['children'];
+    }
+    delete parent[id];
+  });
+};
+export var modifyNode = function modifyNode(id, data) {
+  usePageDataStore.setState(function (state) {
+    if (id === LC_BUILDIN_UNIT_KEY.PAGE_ROOT) {
+      assign(state.pageData.props, omit(data, ['id', 'parentId', 'component', 'buildIn']));
+      return;
+    }
+    var _ref3 = findNode(state.pageData, id) || {},
+      target = _ref3.target;
+    if (!target) return;
+    forOwn(omit(data, ['id', 'parentId', 'component', 'buildIn']), function (_val, _key) {
+      _set(target.props, _key, _val);
+    });
+  });
+};
+export var useTask = function useTask(type) {
+  var promiseRef = useRef(null);
+  var task = useCallback(function () {
+    for (var _len2 = arguments.length, args = new Array(_len2), _key3 = 0; _key3 < _len2; _key3++) {
+      args[_key3] = arguments[_key3];
+    }
+    return new Promise(function (resolve) {
+      promiseRef.current = resolve;
+      switch (type) {
+        case 'add':
+          addNode.apply(void 0, args);
+          break;
+        case 'update':
+        case 'modify':
+          modifyNode.apply(void 0, args);
+          break;
+        case 'delete':
+          deleteNode.apply(void 0, args);
+          break;
+        default:
+          break;
+      }
+    });
+  }, []);
+  useEffect(function () {
+    var unsub = usePageDataStore.subscribe(function (state, prevState) {
+      if (!promiseRef.current) {
+        return;
+      }
+      promiseRef.current(state.pageData, prevState.pageData);
+      promiseRef.current = null;
+    });
+    return unsub;
+  }, []);
+  return task;
+};
+export var useGet = function useGet(_) {
+  var result = usePageDataStore(useShallow(function (state) {
+    if (isNil(_)) {
+      return state.pageData;
+    } else if (isFunction(_)) {
+      return _(state.pageData);
+    } else if (isArray(_)) {
+      return _.map(function (k) {
+        var _findNode;
+        return k.includes('.') ? get(state.pageData, k) : (_findNode = findNode(state.pageData, k)) === null || _findNode === void 0 ? void 0 : _findNode.target;
+      });
+    } else if (isObject(_) && _.id) {
+      var _findNode2;
+      var path = _.path;
+      var _target = _.id === LC_BUILDIN_UNIT_KEY.PAGE_ROOT ? state.pageData : (_findNode2 = findNode(state.pageData, _.id)) === null || _findNode2 === void 0 ? void 0 : _findNode2.target;
+      return isNil(path) ? _target : get(_target, path);
+    } else if (isString(_)) {
+      return get(state.pageData, _);
+    }
+  }));
+  return result;
+};
+export var getCanUndoAndRedo = function getCanUndoAndRedo() {
+  var _usePageDataStore$tem = usePageDataStore.temporal.getState(),
+    pastStates = _usePageDataStore$tem.pastStates,
+    futureStates = _usePageDataStore$tem.futureStates;
+  var canUndo = !!pastStates.length;
+  var canRedo = !!futureStates.length;
+  return {
+    canUndo: canUndo,
+    canRedo: canRedo
+  };
+};
+export var useTemporalStore = function useTemporalStore(selector) {
+  var temp = useStore(usePageDataStore.temporal, selector);
+  if (!temp) return {
+    canUndo: false,
+    canRedo: false
+  };
+  var canUndo = !!temp.pastStates.length;
+  var canRedo = !!temp.futureStates.length;
+  return _objectSpread(_objectSpread({}, temp), {}, {
+    canUndo: canUndo,
+    canRedo: canRedo
+  });
+};
+export var getLevelNodes = function getLevelNodes(id) {
+  return getPathNodesById(usePageDataStore.getState().pageData, id);
+};
+export var getSelfAndParent = function getSelfAndParent(id) {
+  return findNodeAndParent(id, usePageDataStore.getState().pageData);
+};

package/es/lowcode/engine/tools/usePromiseState.js

@@ -1,26 +1,24 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { useRef, useCallback } from 'react';
-import { useResetState, useDeepCompareEffect } from 'ahooks';
+import { useRef, useState, useCallback } from 'react';
+import { useUpdateLayoutEffect } from 'ahooks';
 var usePromiseState = function usePromiseState(initialState) {
-  var _useResetState = useResetState(initialState),
-    _useResetState2 = _slicedToArray(_useResetState, 3),
-    state = _useResetState2[0],
-    setState = _useResetState2[1],
-    resetState = _useResetState2[2];
+  var _useState = useState(initialState),
+    _useState2 = _slicedToArray(_useState, 2),
+    state = _useState2[0],
+    setState = _useState2[1];
   var promiseRef = useRef(null);
   var setStatePromise = useCallback(function (_state) {
     return new Promise(function (resolve) {
       promiseRef.current = resolve;
-      console.log('_state', _state);
       setState(_state);
     });
   }, []);
-  useDeepCompareEffect(function () {
+  useUpdateLayoutEffect(function () {
     if (promiseRef.current) {
       promiseRef.current(state);
       promiseRef.current = null;
     }
   }, [state]);
-  return [state, setStatePromise, resetState];
+  return [state, setStatePromise];
 };
 export default usePromiseState;

package/es/lowcode/engine/tools/useTodo.js

@@ -5,7 +5,8 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 var _excluded = ["datasetCode"];
 import { useBoolean, useMemoizedFn } from 'ahooks';
 import { message } from 'luck-design/antd';
-import { keys, isNil } from 'lodash';
+import { keys, isNil, isFunction } from 'lodash';
+import usePageDataStore from "./usePageDataStore";
 import { executeCode } from "./helper";
 import { fetchCallBehavior } from "../../constants/api-url";
 var useTodo = function useTodo() {
@@ -25,10 +26,13 @@ var useTodo = function useTodo() {
       behaviorKey: behaviorKey
     }, params), data);
   });
+  var moduleData = usePageDataStore(function (state) {
+    return state.moduleData;
+  });
   var todo = useMemoizedFn(function (ctx, actionPool) {
     var argsMap = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
     if (isNil(actionPool)) {
-      return;
+      return Promise.resolve();
     }
     var dsCode = argsMap.datasetCode,
       args = _objectWithoutProperties(argsMap, _excluded);
@@ -47,21 +51,27 @@ var useTodo = function useTodo() {
             return Promise.resolve(executeCode.apply(void 0, [ctx, info.code, argsName].concat(_toConsumableArray(_args))));
           case 'page-action':
             {
-              var _JSON$parse = JSON.parse(info.code || '{}'),
-                moduleCode = _JSON$parse.moduleCode,
-                datasetCode = _JSON$parse.datasetCode,
-                params = _JSON$parse.params,
-                data = _JSON$parse.data;
+              var _ref4 = executeCode.apply(void 0, [ctx, info.code, argsName].concat(_toConsumableArray(_args))) || {},
+                moduleCode = _ref4.moduleCode,
+                datasetCode = _ref4.datasetCode,
+                params = _ref4.params,
+                data = _ref4.data,
+                after = _ref4.after;
+              var _moduleCode = moduleCode || moduleData.moduleCode;
               var _dscode = datasetCode || dsCode;
-              if (!moduleCode || !_dscode) {
+              if (!_moduleCode || !_dscode) {
                 message.warning('接口重要参数（模块编码或数据集编码）丢失');
                 return;
               }
               return callBehavior({
                 datasetCode: _dscode,
-                moduleCode: moduleCode,
+                moduleCode: _moduleCode,
                 behaviorKey: actionKey
-              }, params, data);
+              }, params, data).then(function (res) {
+                if (isFunction(after)) {
+                  after(ctx, res);
+                }
+              });
             }
           case 'trigger':
             return Promise.resolve();

package/es/lowcode/painter/Design.js

@@ -1,9 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useRef, useState } from 'react';
-import { RawIntlProvider, getLocale, getIntl, localeInfo } from 'umi';
+import React, { useRef, useState, useEffect } from 'react';
+import { RawIntlProvider, getLocale, getIntl, localeInfo, history } from 'umi';
 import { useMemoizedFn } from 'ahooks';
 import moment from 'moment';
 import { ConfigProvider } from 'luck-design/antd';
+import { formatMessage } from '@luck-design-biz/base/utils';
+import { getCanUndoAndRedo } from "../engine/provider/ContextProvider";
 import DesignToolbar from "./DesignToolbar";
 import DesignOperator from "./DesignOperator";
 import Page from "../view/Page";
@@ -23,6 +25,39 @@ var Design = function Design() {
     _useState4 = _slicedToArray(_useState3, 2),
     intl = _useState4[0],
     setIntl = _useState4[1];
+  var unblock = useMemoizedFn(function () {
+    var _getCanUndoAndRedo = getCanUndoAndRedo(),
+      canUndo = _getCanUndoAndRedo.canUndo;
+    if (canUndo) return confirm("".concat(formatMessage({
+      id: 'app.base.operate.comfire.leave',
+      label: '离开当前页面？'
+    }), "\n").concat(formatMessage({
+      id: 'app.base.operate.comfire.message.leave',
+      label: '系统可能不会保存您所做的更改。'
+    })));
+    return true;
+  });
+  var handleBeforeUnload = useMemoizedFn(function (event) {
+    var _getCanUndoAndRedo2 = getCanUndoAndRedo(),
+      canUndo = _getCanUndoAndRedo2.canUndo;
+    if (canUndo) {
+      event.preventDefault();
+      event.returnValue = null;
+      return null;
+    }
+  });
+  useEffect(function () {
+    window.addEventListener('beforeunload', handleBeforeUnload);
+    history.block(function () {
+      return unblock();
+    });
+    return function () {
+      window.removeEventListener('beforeunload', handleBeforeUnload);
+      history.block(function () {
+        return true;
+      });
+    };
+  }, []);
   var handleLangChange = useMemoizedFn(function (_locale) {
     if (moment !== null && moment !== void 0 && moment.locale) {
       var _localeInfo$_locale;
@@ -38,15 +73,15 @@ var Design = function Design() {
     onLangChange: handleLangChange
   }), /*#__PURE__*/React.createElement("div", {
     className: styles['lc-painter-design-workspace']
-  }, /*#__PURE__*/React.createElement(DesignOperator, {
-    target: simulatorRef
-  }), /*#__PURE__*/React.createElement(ConfigProvider, {
+  }, /*#__PURE__*/React.createElement(ConfigProvider, {
     locale: ((_localeInfo$locale = localeInfo[locale]) === null || _localeInfo$locale === void 0 ? void 0 : _localeInfo$locale.antd) || {}
   }, /*#__PURE__*/React.createElement(RawIntlProvider, {
     value: intl
   }, /*#__PURE__*/React.createElement(Page, {
     ref: simulatorRef,
     className: styles['lc-painter-design-simulator']
-  })))));
+  }, /*#__PURE__*/React.createElement(DesignOperator, {
+    canvas: simulatorRef
+  }))))));
 };
 export default Design;