@fonixtree/magic-design 0.1.74 → 0.1.76

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

@@ -27,74 +27,46 @@
       position: relative;
       .img_wrap {
         width: 492px;
-        height: 492px;
-        display: grid;
-        grid-template-columns: repeat(2, 1fr);
-        grid-template-rows: repeat(2, 1fr);
-        grid-gap: 12px;
-        margin: 0 auto;
-    
-        .aiImageItem {
-          position: relative;
-          background-color: #ccc;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          font-size: 24px;
-          img {
-            width: 100%;
-          }
-          .imgHandleBtnWrap {
-            display: flex;
-            position: absolute;
-            bottom: 12px;
-            right: 12px;
-            .refreshBtnWrap {
-              background-color: #FFF;
-              cursor: pointer;
-              height: 28px;
-              width: 28px;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              border-radius: 50%;
-              border: 1px solid #D2D9E5;
-            }
-            .downloadBtnWrap {
-              background-color: #FFF;
-              cursor: pointer;
-              height: 28px;
-              width: 28px;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              margin-left: 12px;
-              border-radius: 50%;
-              border: 1px solid #D2D9E5;
-            }
+        height: 100%;
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        justify-content: center;
+        .aiImageWrap1 {
+          height: 492px;
+          width: 492px;
+        }
+        .aiImageWrap2 {
+          height: 240px;
+          width: 240px;
+          margin-bottom: 12px;
+          margin-left: 12px;
+          &:nth-child(2n - 1) {
+            margin-left: 0;
           }
-          .imgSelectBtnWrap {
-            position: absolute;
-            top: 12px;
-            right: 12px;
-            border-radius: 50%;
-            height: 22px;
-            display: flex;
-            background: #FFF;
+          img {
+            max-width: 100%;
           }
         }
-        .noDataWrap {
-          width: 100%;
-          height: 100%;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          .no_data {
-            height: 183px;
-            width: 212px;
+        
+        .aiImageWrap3 {
+          height: 156px;
+          width: 156px;
+          margin-bottom: 12px;
+          margin-bottom: 12px;
+          margin-left: 12px;
+          &:nth-child(3n + 1) {
+            margin-left: 0;
+          }
+          img {
+            max-width: 100%;
           }
         }
         
+        .no_data {
+          height: 183px;
+          width: 212px;
+        }
       }
       .btn_wrap {
         margin-top: 40px;

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

@@ -19,9 +19,9 @@ var _CopyBtn = _interopRequireDefault(require("./components/CopyBtn"));
 
 var _common = require("../../../common");
 
-var _FonixtreeGpt = _interopRequireDefault(require("../FonixtreeGpt"));
+var _mobx = require("../../../mobx");
 
-var _AiImageGenerator = _interopRequireDefault(require("../AiImageGenerator"));
+var _FonixtreeGpt = _interopRequireDefault(require("../FonixtreeGpt"));
 
 require("./index.less");
 
@@ -71,13 +71,12 @@ function (_super) {
       open: false,
       message: '',
       context: [],
-      isGenerating: false,
-      aiImageVisible: false
+      isGenerating: false
     };
 
     _this.scrollBottom = function () {
       var container = document.getElementById('content_wrap');
-      container.scrollTop = container.scrollHeight + 50;
+      container.scrollTop = container.scrollHeight;
     };
 
     _this.onMessageChage = function (e) {
@@ -106,8 +105,6 @@ function (_super) {
         isGenerating: true,
         context: context,
         message: ''
-      }, function () {
-        _this.scrollBottom();
       });
     };
 
@@ -142,8 +139,8 @@ function (_super) {
         open: false
       });
 
-      _this.setState({
-        aiImageVisible: true
+      _mobx.store.setState({
+        imgGenVisible: true
       });
     };
 
@@ -172,6 +169,7 @@ function (_super) {
   }
 
   ChatRobot.prototype.componentDidMount = function () {
+    this.chatGpt.initChatGpt();
     var context = this.chatGpt.getContext();
     this.setState({
       context: context
@@ -185,8 +183,7 @@ function (_super) {
         context = _a.context,
         message = _a.message,
         open = _a.open,
-        isGenerating = _a.isGenerating,
-        aiImageVisible = _a.aiImageVisible;
+        isGenerating = _a.isGenerating;
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "chat_wrap"
     }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -299,19 +296,7 @@ function (_super) {
         marginRight: 5
       },
       type: "icon-refresh"
-    }), "Regenerate Response"))), /*#__PURE__*/_react["default"].createElement(_AiImageGenerator["default"], {
-      onClose: function onClose() {
-        return _this.setState({
-          aiImageVisible: false
-        });
-      },
-      onConfirm: function onConfirm() {
-        return _this.setState({
-          aiImageVisible: false
-        });
-      },
-      visible: aiImageVisible
-    }));
+    }), "Regenerate Response"))));
   };
 
   return ChatRobot;

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

@@ -89,9 +89,6 @@
         padding: 7px 14px;
         background: #F5F6F7;
         color: #232F46;
-        p {
-          margin-bottom: 0;
-        }
       }
     }
     .regenerate_btn {

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

@@ -11,6 +11,149 @@ var _commonUtil = require("../../../utils/commonUtil");
 
 var _storeUtil = require("../../../utils/storeUtil");
 
+var __awaiter = void 0 && (void 0).__awaiter || function (thisArg, _arguments, P, generator) {
+  function adopt(value) {
+    return value instanceof P ? value : new P(function (resolve) {
+      resolve(value);
+    });
+  }
+
+  return new (P || (P = Promise))(function (resolve, reject) {
+    function fulfilled(value) {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+
+    function rejected(value) {
+      try {
+        step(generator["throw"](value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+
+    function step(result) {
+      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
+    }
+
+    step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
+};
+
+var __generator = void 0 && (void 0).__generator || function (thisArg, body) {
+  var _ = {
+    label: 0,
+    sent: function sent() {
+      if (t[0] & 1) throw t[1];
+      return t[1];
+    },
+    trys: [],
+    ops: []
+  },
+      f,
+      y,
+      t,
+      g;
+  return g = {
+    next: verb(0),
+    "throw": verb(1),
+    "return": verb(2)
+  }, typeof Symbol === "function" && (g[Symbol.iterator] = function () {
+    return this;
+  }), g;
+
+  function verb(n) {
+    return function (v) {
+      return step([n, v]);
+    };
+  }
+
+  function step(op) {
+    if (f) throw new TypeError("Generator is already executing.");
+
+    while (_) {
+      try {
+        if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+        if (y = 0, t) op = [op[0] & 2, t.value];
+
+        switch (op[0]) {
+          case 0:
+          case 1:
+            t = op;
+            break;
+
+          case 4:
+            _.label++;
+            return {
+              value: op[1],
+              done: false
+            };
+
+          case 5:
+            _.label++;
+            y = op[1];
+            op = [0];
+            continue;
+
+          case 7:
+            op = _.ops.pop();
+
+            _.trys.pop();
+
+            continue;
+
+          default:
+            if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+              _ = 0;
+              continue;
+            }
+
+            if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+              _.label = op[1];
+              break;
+            }
+
+            if (op[0] === 6 && _.label < t[1]) {
+              _.label = t[1];
+              t = op;
+              break;
+            }
+
+            if (t && _.label < t[2]) {
+              _.label = t[2];
+
+              _.ops.push(op);
+
+              break;
+            }
+
+            if (t[2]) _.ops.pop();
+
+            _.trys.pop();
+
+            continue;
+        }
+
+        op = body.call(thisArg, _);
+      } catch (e) {
+        op = [6, e];
+        y = 0;
+      } finally {
+        f = t = 0;
+      }
+    }
+
+    if (op[0] & 5) throw op[1];
+    return {
+      value: op[0] ? op[1] : void 0,
+      done: true
+    };
+  }
+};
+
 // 角色
 var roleMap = {
   ASSISTANT: 'assistant',
@@ -30,9 +173,9 @@ function () {
 
     this.isGenerating = false; // 初始化参数
 
-    this.initParams = {}; // 建立连接
+    this.initParams = {}; // 初始化
 
-    this.initChatConnect = function () {
+    this.initChatGpt = function () {
       var _a = _this.initParams,
           onMessage = _a.onMessage,
           onEnd = _a.onEnd;
@@ -42,7 +185,6 @@ function () {
       var eventSource = new EventSource("/designer/v1/ai/sse/create?clientId=" + _this.clientId);
 
       eventSource.onopen = function (event) {
-        console.log('onOpen');
         sse = event.target;
       };
 
@@ -74,9 +216,6 @@ function () {
 
       eventSource.onerror = function (event) {
         console.log('onerror', event);
-        _this.isGenerating = false;
-
-        _this.regenerate();
       };
     }; // 获取chat上下文
 
@@ -102,25 +241,28 @@ function () {
 
 
     this.sendMessage = function (message) {
-      if (!message) {
-        return;
-      }
-
-      _this.isGenerating = true;
-
-      _this.insertMessage2Context(message);
-
-      var messages = _this.getContext();
-
-      _this.initChatConnect();
+      return __awaiter(_this, void 0, void 0, function () {
+        var messages;
+        return __generator(this, function (_a) {
+          if (!message) {
+            return [2
+            /*return*/
+            ];
+          }
 
-      var newMessages = messages.splice(messages.length - 5);
-      setTimeout(function () {
-        (0, _commonUtil.commonFetch)('/designer/v1/ai/stream-chat-completion', {
-          clientId: _this.clientId,
-          messages: newMessages
-        }, 'POST');
-      }, 200);
+          this.isGenerating = true;
+          this.insertMessage2Context(message);
+          messages = this.getContext();
+          (0, _commonUtil.commonFetch)('/designer/v1/ai/stream-chat-completion', {
+            clientId: this.clientId,
+            messages: messages
+          }, 'POST');
+          this.initChatGpt();
+          return [2
+          /*return*/
+          ];
+        });
+      });
     }; // 重新生成
 
 
@@ -137,15 +279,12 @@ function () {
         (0, _storeUtil.setSessionStore)(catchKey, messages);
       }
 
-      _this.initChatConnect();
+      (0, _commonUtil.commonFetch)('/designer/v1/ai/stream-chat-completion', {
+        clientId: _this.clientId,
+        messages: messages
+      }, 'POST');
 
-      var newMessages = messages.splice(messages.length - 5);
-      setTimeout(function () {
-        (0, _commonUtil.commonFetch)('/designer/v1/ai/stream-chat-completion', {
-          clientId: _this.clientId,
-          messages: newMessages
-        }, 'POST');
-      }, 200);
+      _this.initChatGpt();
     }; // setSessionStore(catchKey, []);
 
 

package/es/core/Designer/index.js

@@ -35,6 +35,8 @@ var _LeftTitle = _interopRequireDefault(require("./LeftTitle"));
 
 var _RenderHtml = _interopRequireDefault(require("./RenderHtml"));
 
+var _AiImageGenerator = _interopRequireDefault(require("./AiImageGenerator"));
+
 var _componentTypes = require("../../constants/component-types");
 
 var _mobx = require("../../mobx");
@@ -775,7 +777,7 @@ function (_super) {
       },
       onConfirm: this.onAppointmentConfirm,
       visible: appointmentVisible
-    })), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_common.SystemNotification, null))), /*#__PURE__*/_react["default"].createElement(_RenderHtml["default"], {
+    }), /*#__PURE__*/_react["default"].createElement(_AiImageGenerator["default"], null)), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_common.SystemNotification, null))), /*#__PURE__*/_react["default"].createElement(_RenderHtml["default"], {
       ref: this.renderHtmlRef
     }));
   };

package/es/utils/commonUtil.js

@@ -748,8 +748,11 @@ var convertToRem = function convertToRem(value) {
     return value + "px";
   }
 
+  var baseFont = ensure(function () {
+    return window.getComputedStyle(document.getElementsByTagName('html')[0]).fontSize.replace('px');
+  }, 50);
   var pxValue = parseFloat(value);
-  var remValue = pxValue / 50; // 假设1rem = 50px
+  var remValue = pxValue / baseFont; // 假设1rem = 50px
 
   return remValue + "rem";
 };

package/lib/common/ImagePicker/index.js

@@ -17,8 +17,6 @@ var _ImageModal = _interopRequireDefault(require("../ImageModal"));
 
 var _ = require("..");
 
-var _AiImageGenerator = _interopRequireDefault(require("../../core/Designer/AiImageGenerator"));
-
 var _Iconfont = _interopRequireDefault(require("../Iconfont"));
 
 var _coreUtil = require("../../utils/coreUtil");
@@ -70,8 +68,7 @@ function (_super) {
 
     _this.state = {
       visible: false,
-      inputVal: '',
-      aiImageVisible: false
+      inputVal: ''
     };
 
     _this.onChange = function (v) {
@@ -96,12 +93,6 @@ function (_super) {
       }
     };
 
-    _this.onAiImageClick = function () {
-      _this.setState({
-        aiImageVisible: true
-      });
-    };
-
     _this.getImagePick = function () {
       var visible = _this.state.visible;
       var value = _this.props.value;
@@ -171,19 +162,6 @@ function (_super) {
       }));
     };
 
-    _this.onAiImageConfirm = function (data) {
-      _this.setState({
-        aiImageVisible: false
-      });
-
-      _this.props.onChange({
-        contentTitle: data.fileName,
-        contentType: 'File',
-        imgUrl: data.oriUrl,
-        url: data.oriUrl
-      });
-    };
-
     _this.getImageUrl = function () {
       var onChange = _this.props.onChange;
       var inputVal = _this.state.inputVal;
@@ -258,7 +236,6 @@ function (_super) {
 
     var imageSelectedWay = this.props.imageSelectedWay;
     var way = (0, _coreUtil.isPc)() ? imageSelectedWay.pc : imageSelectedWay.mobile;
-    var aiImageVisible = this.state.aiImageVisible;
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "image-picker-wrap"
     }, /*#__PURE__*/_react["default"].createElement(_.Field, {
@@ -277,25 +254,7 @@ function (_super) {
         key: v.key,
         value: v.key
       }, v.value);
-    })), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "ai-btn",
-      onClick: this.onAiImageClick
-    }, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
-      color: "#2F54EB",
-      size: 20,
-      type: "icon-ai"
-    }), /*#__PURE__*/_react["default"].createElement("span", {
-      className: "btn-txt"
-    }, (0, _locale.i18n)('AI_IMAGE'))))), way === 'url' ? this.getImageUrl() : this.getImagePick(), /*#__PURE__*/_react["default"].createElement(_AiImageGenerator["default"], {
-      onClose: function onClose() {
-        return _this.setState({
-          aiImageVisible: false
-        });
-      },
-      onConfirm: this.onAiImageConfirm,
-      single: true,
-      visible: aiImageVisible
-    }));
+    })))), way === 'url' ? this.getImageUrl() : this.getImagePick());
   };
 
   ImagePicker.defaultProps = {

package/lib/common/ImagePicker/index.less

@@ -7,7 +7,6 @@
     justify-content: space-between;
     align-items: center;
     .ai-btn {
-      cursor: pointer;
       background: #FFFFFF;
       border: 1px solid #2F54EB;
       border-radius: 8px;

package/lib/constants/index.js

@@ -7,8 +7,7 @@ exports.urlTypeMap = exports.urlType = exports.respCodeMap = exports.quickMenuCo
 var STORAGE_KEY = {
   LOCALE: 'magicLocale',
   MAGIC_RENDER_HTML: 'MAGIC_RENDER_HTML',
-  MAGIC_RENDER_PAGEDATA: 'MAGIC_RENDER_PAGEDATA',
-  FONIXTREE_AI_IMG_HIS: 'fonixtree_ai_img_his'
+  MAGIC_RENDER_PAGEDATA: 'MAGIC_RENDER_PAGEDATA'
 };
 /** 授信状态 */
 

package/lib/core/Designer/AiImageGenerator/GenerateSize/index.js

@@ -23,17 +23,17 @@ function GenerateSize(_a) {
     options: [{
       value: '1',
       label: '1:1'
+    }, {
+      value: '2',
+      label: '4:3'
+    }, {
+      value: '3',
+      label: '16:9'
     }]
   }), /*#__PURE__*/_react["default"].createElement(_antd.Select, {
     defaultValue: "1",
     options: [{
       value: '1',
-      label: '256x256'
-    }, {
-      value: '2',
-      label: '512x512'
-    }, {
-      value: '3',
       label: '1024x1024'
     }],
     style: {