@fonixtree/magic-design 0.0.71 → 0.0.72

package/es/core/Designer/CompListPanel/index.js

@@ -19,8 +19,6 @@ require("./index.less");
 
 var _locale = require("../../../locale");
 
-var _coreUtil = require("../../../utils/coreUtil");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -116,12 +114,10 @@ function (_super) {
       }, /*#__PURE__*/_react["default"].createElement("h5", {
         className: "cat-name"
       }, compCat, "(", "" + compSource[compCat].length, ")"), compSource[compCat].map(function (comp) {
-        return (0, _coreUtil.isActiveFloor)(comp.terminalType) ? /*#__PURE__*/_react["default"].createElement(_CompCard["default"], _extends({}, comp, {
+        return /*#__PURE__*/_react["default"].createElement(_CompCard["default"], _extends({}, comp, {
           key: comp.moduleId,
-          onAdd: function onAdd() {
-            return _this.onAddClick(comp);
-          }
-        })) : null;
+          onAdd: _this.onAddClick
+        }));
       }));
     })));
   };
@@ -129,5 +125,34 @@ function (_super) {
   return CompListPanel;
 }(_react.Component);
 
-var _default = CompListPanel;
+var _default = CompListPanel; // export default function CompListPanel({ visible, onClose, compSource, onAdd }) {
+//   useEffect(() => {
+//     if (visible) {
+//       document.getElementsByClassName('component-list')[0].scrollTop = 0;
+//     }
+//   }, [visible]);
+//   return (
+//     <div className={classNames('compListPanel', { visible })}>
+//       <header className="header">
+//         <Button icon="icon-close" onClick={onClose} type="icon" />
+//       </header>
+//       <h2 className="title">{i18n('ADD_COMPONENT')}</h2>
+//       <div className="component-list">
+//         {
+//           Object.keys(compSource).map(compCat => (
+//             <div key={compCat} className="cat-list">
+//               <h5 className="cat-name">{compCat}({`${compSource[compCat].length}`})</h5>
+//               {
+//                 compSource[compCat].map(comp => (
+//                   <CompCard {...comp} key={comp.moduleId} onAdd={onAdd} />
+//                 ))
+//               }
+//             </div>
+//           ))
+//         }
+//       </div>
+//     </div>
+//   );
+// }
+
 exports["default"] = _default;

package/es/core/Designer/ConfigPanel/index.js

@@ -9,8 +9,6 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _TerminalSelect = _interopRequireDefault(require("./TerminalSelect"));
-
 var _coreUtil = require("../../../utils/coreUtil");
 
 var _commonUtil = require("../../../utils/commonUtil");
@@ -74,34 +72,6 @@ function (_super) {
       selectedNode: {}
     };
 
-    _this.resetState = function (propsData, clickedFloor) {
-      var pageData = propsData.pageData;
-      var selectedNode = pageData.find(function (floor) {
-        return floor.id === clickedFloor;
-      });
-
-      _this.setState({
-        clickedGroup: _mobx.store.clickedGroup,
-        selectedNode: selectedNode
-      }); // 展开一级面板
-
-
-      if (selectedNode) {
-        _this.openConfig();
-      } else {
-        _this.closeConfig();
-      } // 展开二级面板
-
-
-      if (!_mobx.store.clickedGroup && _this.preClickedGroup) {
-        _this.closeSecConfig();
-      } else if (Boolean(_mobx.store.clickedGroup) != Boolean(_this.preClickedGroup)) {
-        _this.openSecConfig();
-      }
-
-      _this.preClickedGroup = _mobx.store.clickedGroup;
-    };
-
     _this.animation = function (type) {
       document.getElementsByClassName('config_wrap')[0].setAttribute('style', "animation-name:" + type + ";animation-duration: 0.3s;animation-fill-mode:both");
     };
@@ -187,13 +157,6 @@ function (_super) {
         device: device
       };
       var instance = Clazz ? /*#__PURE__*/_react["default"].createElement(Clazz, panelProps) : null;
-
-      if (!instance) {
-        _mobx.store.setState({
-          clickedFloor: null
-        });
-      }
-
       return instance;
     };
 
@@ -246,15 +209,11 @@ function (_super) {
           break;
 
         case 'MOBILE_NAVIGATION':
-        case 'PC_NAVIGATION':
           groupName = ((_f = panelProps.groupName) === null || _f === void 0 ? void 0 : _f.title.text) || (0, _locale.i18n)('NAVIGATION_NAME');
           break;
 
         case 'RECOMMEND':
           groupName = panelProps.groupName.text;
-
-        case 'TAG':
-          groupName = '';
       }
 
       return groupName || 'Group Name';
@@ -264,41 +223,40 @@ function (_super) {
       _mobx.store.setState({
         clickedGroup: null
       });
-
-      window.document.dispatchEvent(new Event(_constants.eventType.UPDATE_FIRST_CONFIG, {
-        bubbles: false
-      }));
     };
 
-    _this.onTerminalChange = function (terminal) {
-      var selectedNode = _this.state.selectedNode;
-      selectedNode.activeTerminal = terminal;
+    return _this;
+  }
+
+  ConfigPanel.prototype.componentDidMount = function () {
+    var _this = this;
+
+    this.distroy = (0, _mobx.autorun)(function () {
+      var selectedNode = _mobx.store.getFloorInfo();
 
       _this.setState({
+        clickedGroup: _mobx.store.clickedGroup,
         selectedNode: selectedNode
-      }); // 刷新页面组件列表 和 viewArea
+      }); // 展开以及面板
 
 
-      (0, _coreUtil.renderPreview)();
-    };
+      if (selectedNode) {
+        _this.openConfig();
+      } else {
+        _this.closeConfig();
+      } // 展开首期二级面板
 
-    return _this;
-  }
 
-  ConfigPanel.prototype.componentDidMount = function () {
-    var _this = this;
+      if (!_mobx.store.clickedGroup) {
+        _this.closeSecConfig();
+      } else if (_mobx.store.clickedGroup !== _this.preClickedGroup) {
+        _this.openSecConfig();
+      }
 
-    this.distroy = (0, _mobx.autorun)(function () {
-      _this.resetState(_this.props, _mobx.store.clickedFloor);
+      _this.preClickedGroup = _mobx.store.clickedGroup;
     });
   };
 
-  ConfigPanel.prototype.componentWillReceiveProps = function (nextProps) {
-    if (JSON.stringify(this.props) !== JSON.stringify(nextProps)) {
-      this.resetState(nextProps, _mobx.store.clickedFloor);
-    }
-  };
-
   ConfigPanel.prototype.componentWillUnmount = function () {
     this.distroy();
   };
@@ -317,17 +275,10 @@ function (_super) {
     }, /*#__PURE__*/_react["default"].createElement("span", {
       className: "title",
       title: (_a = _constants.compInfoMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type]) === null || _a === void 0 ? void 0 : _a.name
-    }, (_b = _constants.compInfoMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type]) === null || _b === void 0 ? void 0 : _b.name), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "right_wrap"
-    }, /*#__PURE__*/_react["default"].createElement(_TerminalSelect["default"], {
-      onChange: this.onTerminalChange,
-      terminalType: selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.terminalType,
-      value: selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.activeTerminal
-    }), device === _constants.deviceTypeMap.PC && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    }, (_b = _constants.compInfoMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type]) === null || _b === void 0 ? void 0 : _b.name), device === _constants.deviceTypeMap.PC && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
       onClick: this.onDoneClick,
-      size: "small",
       type: "light"
-    }, (0, _locale.i18n)('DONE')))), this.getConfigPanelInstance()), /*#__PURE__*/_react["default"].createElement("div", {
+    }, (0, _locale.i18n)('DONE'))), this.getConfigPanelInstance()), /*#__PURE__*/_react["default"].createElement("div", {
       className: "sec_config_wrap"
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: "config_header"

package/es/core/Designer/ConfigPanel/index.less

@@ -39,10 +39,6 @@
         line-height: 32px;
         color: #232F46;
       }
-      .right_wrap {
-        display: flex;
-        align-items: center;
-      }
     }
   }
 

package/es/core/Designer/History/index.js

@@ -7,8 +7,6 @@ exports["default"] = void 0;
 
 var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
 
-var _lodash = require("lodash");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 /**
@@ -16,25 +14,24 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
  * 有新的操作时存入数组的0位置，游标设置为0
  *
  */
+var debug = require('debug')('worker:History');
+
 var History =
 /** @class */
 function () {
   function History(hist) {
     var _this = this;
     /**
-      * 游标位置
-      */
+     * 游标位置
+     */
 
 
     this.cursor = 0;
     /**
-      * 历史数据
-      */
+     * 历史数据
+     */
 
     this.list = [];
-    /** 前进或者后退步数 */
-
-    this.step = 0;
 
     this.redoAble = function () {
       return _this.cursor !== 0;
@@ -44,50 +41,47 @@ function () {
       return _this.cursor !== _this.list.length - 1;
     };
     /**
-      * 清空0～cursor之间的数据，将data插入 位置0
-      */
+     * 清空0～cursor之间的数据，将data插入 位置0
+     */
 
 
     this.push = function (data) {
+      debug('push data', data);
       var cloneData = (0, _cloneDeep["default"])(data);
 
       _this.list.splice(0, _this.cursor, cloneData);
 
-      _this.cursor = 0;
       return data;
     };
     /**
-      * redu操作只修改当前游标-1
-      * 并且返回后一步的json对象
-      */
-
+     * redu操作只修改当前游标-1
+     * 并且返回后一步的json对象
+     */
 
-    this.redo = function (callback) {
-      _this.step -= 1;
 
-      _this.doAction(callback);
+    this.redo = function () {
+      debug('redo click');
+      var newCursor = _this.cursor - 1;
+      _this.cursor = newCursor;
+      var newData = _this.list[newCursor];
+      return newData;
     };
     /**
-      * undo操作只修改当前的游标+1
-      * 并且返回前一步的json对象
-      */
-
+     * undo操作只修改当前的游标+1
+     * 并且返回前一步的json对象
+     */
 
-    this.undo = function (callback) {
-      _this.step += 1;
 
-      _this.doAction(callback);
+    this.undo = function () {
+      debug('undo click');
+      var newCursor = _this.cursor + 1;
+      _this.cursor = newCursor;
+      var newData = _this.list[newCursor];
+      return newData;
     };
 
-    this.doAction = (0, _lodash.debounce)(function (callback) {
-      var newCursor = _this.cursor + _this.step;
-      _this.cursor = newCursor;
-      var newData = (0, _cloneDeep["default"])(_this.list[newCursor]);
-      _this.step = 0;
-      callback(newData);
-    }, 300);
     this.cursor = 0;
-    this.list = [(0, _cloneDeep["default"])(hist)];
+    this.list = [hist];
   }
 
   return History;

package/es/core/Designer/PageCompList/index.js

@@ -121,11 +121,9 @@ function PageCompList(_a) {
     }
   };
 
-  var onMenuClick = function onMenuClick(activeComp, operType) {
+  var onMenuClick = function onMenuClick(index, operType) {
     var newComponents = __spreadArrays(components);
 
-    var index = newComponents.indexOf(activeComp);
-
     if (operType === operTypeMap.MOVE_UP) {
       var temp = newComponents[index - 1];
       newComponents[index - 1] = newComponents[index];
@@ -180,7 +178,7 @@ function PageCompList(_a) {
     var menu = /*#__PURE__*/_react["default"].createElement(_antd.Menu, {
       onClick: function onClick(_a) {
         var item = _a.item;
-        return onMenuClick(comp, item.props.value);
+        return onMenuClick(index, item.props.value);
       }
     }, index !== 0 && /*#__PURE__*/_react["default"].createElement(_antd.Menu.Item, {
       className: "menu_item",
@@ -247,14 +245,6 @@ function PageCompList(_a) {
     })));
   };
 
-  var getActiveComponents = function getActiveComponents() {
-    var filter = components.filter(function (comp) {
-      return (0, _coreUtil.isActiveFloor)(comp.activeTerminal);
-    });
-    return filter;
-  };
-
-  var activeComponents = getActiveComponents();
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "page-comp-wrap"
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -272,7 +262,7 @@ function PageCompList(_a) {
     className: "list mt16"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "inner-list"
-  }, /*#__PURE__*/_react["default"].createElement("div", null, activeComponents.length > 0 && activeComponents.map(function (comp, i) {
+  }, /*#__PURE__*/_react["default"].createElement("div", null, components.length > 0 && components.map(function (comp, i) {
     return renderCard(comp, i);
   }))))));
 }

package/es/core/Designer/PageCompList/index.less

@@ -121,19 +121,19 @@
       display: block;
     }
   }
+}
 
-  &.active {
-    background: #E9F0FF;
-    color: #2F54EB;
+.active {
+  background: #E9F0FF;
+  color: #2F54EB;
 
-    .left {
-      .card-title {
-        font-weight: 600;
-      }
+  .left {
+    .card-title {
+      font-weight: 600;
     }
+  }
 
-    .more-btn {
-      display: block;
-    }
+  .more-btn {
+    display: block;
   }
 }

package/es/core/Designer/QuickMenuBar/index.js

@@ -82,7 +82,7 @@ function (_super) {
     var _this = _super !== null && _super.apply(this, arguments) || this;
 
     _this.onBtnClick = function (event) {
-      var code = event.currentTarget.dataset.code; // 保存和发布时需要清空组件和元组件的选中状态，否则截图中会看到选中状态
+      var code = event.currentTarget.dataset.code;
 
       if (code === _constants.quickMenuCode.SAVE || code === _constants.quickMenuCode.PUBLISH) {
         _mobx.store.setState({

package/es/core/Designer/ViewArea/index.js

@@ -17,12 +17,10 @@ var _constants = require("../../../constants");
 
 var _componentTypes = require("../../../constants/component-types");
 
-var _mobx = require("../../../mobx");
-
-var _coreUtil = require("../../../utils/coreUtil");
-
 require("./index.less");
 
+var _mobx = require("../../../mobx");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -88,22 +86,10 @@ function (_super) {
     _this.isPhoneEdit = function () {
       var device = _this.props.device;
       return device === _constants.deviceTypeMap.PHONE && !(0, _isEmpty["default"])(_this.state.clickedFloor);
-    }; // renderView = () => {
-    //   this.setState({});
-    // }
-    // 根据楼层展示设备进行过滤
-
-
-    _this.filterCompFloor = function (dataSource) {
-      var source = [];
-
-      if (dataSource && dataSource.length) {
-        source = dataSource.filter(function (node) {
-          return (0, _coreUtil.isActiveFloor)(node.activeTerminal);
-        });
-      }
+    };
 
-      return source;
+    _this.renderView = function () {
+      _this.setState({});
     };
 
     return _this;
@@ -139,7 +125,7 @@ function (_super) {
       style: {
         background: window.magicDesign.pageBackground
       }
-    }, this.filterCompFloor(pageData).map(function (nodeData) {
+    }, pageData && pageData.map(function (nodeData) {
       var Clazz = _componentTypes.componentMap[nodeData.type];
 
       if (!Clazz) {

package/es/core/Designer/index.js

@@ -97,13 +97,11 @@ var __spreadArrays = void 0 && (void 0).__spreadArrays || function () {
   return r;
 };
 
-window.magicDesign = {
-  mode: 'designer',
-  device: _constants.deviceTypeMap.PHONE
-};
-
 var setDesignConfig = function setDesignConfig(data) {
-  window.magicDesign = __assign(__assign(__assign({}, window.magicDesign), data), {
+  window.magicDesign = __assign(__assign({
+    mode: 'designer',
+    device: _constants.deviceTypeMap.PHONE
+  }, data), {
     MBaseUrl: data.MBaseUrl || ''
   });
 };
@@ -171,16 +169,14 @@ function (_super) {
       _this.configRef.current.closeMobileConfig();
     };
 
-    _this.reRenderViewArea = function (e) {
-      if (e.changeHistory) {
-        _this.history.push(_this.state.MPageData);
+    _this.reRenderViewArea = function () {
+      if (!_this.viewAreaRef || !_this.viewAreaRef.current) {
+        return;
       }
 
-      _mobx.store.setState({
-        MPageData: _this.state.MPageData
-      });
+      _this.history.push(_this.state.MPageData);
 
-      _this.setState({});
+      _this.viewAreaRef.current.renderView();
     };
 
     _this.componentClick = function (event) {
@@ -190,12 +186,12 @@ function (_super) {
     };
     /**
      * 楼层 的 新增、删除、拷贝、顺序调整、属性修改时调用
-     * @param {*} newPageData 模版信息
+     * @param {*} pageData 模版信息
      */
 
 
-    _this.setPageData = function (newPageData) {
-      var MPageData = _this.history.push(newPageData);
+    _this.setPageData = function (pageData) {
+      var MPageData = _this.history.push(pageData);
 
       _this.setState({
         MPageData: MPageData
@@ -251,8 +247,7 @@ function (_super) {
     };
 
     _this.addComponent = function (_a) {
-      var type = _a.type,
-          terminalType = _a.terminalType;
+      var type = _a.type;
       var MPageData = _this.state.MPageData;
       var compType = _componentTypes.componentMap[type];
 
@@ -263,10 +258,7 @@ function (_super) {
 
       var compInst = compType.getDefaultJSON();
 
-      var newData = __spreadArrays(MPageData, [__assign(__assign({}, compInst), {
-        terminalType: terminalType,
-        activeTerminal: terminalType
-      })]);
+      var newData = __spreadArrays(MPageData, [compInst]);
 
       _this.history.push(newData);
 
@@ -306,24 +298,18 @@ function (_super) {
         device: device
       };
 
-      var callback = function callback(newPageData) {
-        _mobx.store.setState({
-          MPageData: newPageData
-        });
-
-        _this.setState({
-          MPageData: newPageData
-        });
-      };
-
       switch (code) {
         case _constants.quickMenuCode.UNDO:
-          _this.history.undo(callback);
+          _this.setState({
+            MPageData: _this.history.undo()
+          });
 
           break;
 
         case _constants.quickMenuCode.REDO:
-          _this.history.redo(callback);
+          _this.setState({
+            MPageData: _this.history.redo()
+          });
 
           break;
 
@@ -349,6 +335,8 @@ function (_super) {
 
           break;
       }
+
+      console.log(JSON.stringify(handleParams.pageData));
     };
 
     _this.renderHeader = function () {
@@ -365,20 +353,27 @@ function (_super) {
         config = props.config,
         locale = props.locale;
     var MPageData = pageData.childNodes || [];
-    _this.configRef = /*#__PURE__*/_react["default"].createRef(); // this.viewAreaRef = React.createRef();
 
-    _this.compListRef = /*#__PURE__*/_react["default"].createRef();
-    _this.history = new _History["default"](MPageData);
+    _mobx.store.setState({
+      MPageData: MPageData
+    });
+    /** 使用默认国际化 */
+    // if (!store.locale) {
+
 
     _mobx.store.setState({
-      MPageData: MPageData,
       locale: locale
-    });
+    }); // }
+
 
+    _this.configRef = /*#__PURE__*/_react["default"].createRef();
+    _this.viewAreaRef = /*#__PURE__*/_react["default"].createRef();
+    _this.compListRef = /*#__PURE__*/_react["default"].createRef();
     _this.state = {
       MPageData: MPageData,
       device: _constants.deviceTypeMap.PHONE
     };
+    _this.history = new _History["default"](MPageData);
     setDesignConfig(config);
     return _this;
   }
@@ -403,7 +398,6 @@ function (_super) {
     var pageData = nextProps.pageData,
         config = nextProps.config;
     var MPageData = pageData.childNodes || [];
-    this.history = new _History["default"](MPageData);
     this.setState({
       MPageData: MPageData
     });
@@ -412,6 +406,7 @@ function (_super) {
       MPageData: MPageData
     });
 
+    this.history = new _History["default"](MPageData);
     setDesignConfig(config);
   };
 
@@ -472,8 +467,8 @@ function (_super) {
       device: device,
       onClose: this.onPropsPanelClose,
       pageData: MPageData
-    }), /*#__PURE__*/_react["default"].createElement(_ViewArea["default"] // ref={this.viewAreaRef}
-    , {
+    }), /*#__PURE__*/_react["default"].createElement(_ViewArea["default"], {
+      ref: this.viewAreaRef,
       device: device,
       pageData: MPageData,
       renderHeader: this.renderHeader