@epxing/designer 5.3.0-beta.2 → 5.3.0-beta.4

package/dist/src/page-designer/setting-panel/Setting.js

@@ -19,7 +19,9 @@ const _sfc_main = {
   data() {
     return {
       activeTab: "property",
-      showCodeEditor: false
+      showCodeEditor: false,
+      showPropertyPanel: true,
+      showSwitchDialog: false
     };
   },
   computed: {
@@ -33,6 +35,11 @@ const _sfc_main = {
       if (!this.designer.selectedWidget) return this.designer.page.pageId;
       return this.designer.selectedWidget.id;
     },
+    // 切换组件后 id 不变，属性面板需按组件类型重建，才能加载新组件的配置面板
+    propertyKey() {
+      var _a;
+      return this.widgetId + "_" + (((_a = this.designer.selectedWidget) == null ? void 0 : _a.contentType) || "");
+    },
     widgetConfig() {
       const { configs = {}, id } = this.designer.selectedWidget;
       const widgetConfig = this.designer.widgetConfig[id] || {};
@@ -86,6 +93,13 @@ const _sfc_main = {
         }
       });
     },
+    // 换成弹窗中选择的组件，组件 id 不变，原配置保留
+    switchComponent(widgetInfo) {
+      this.showSwitchDialog = false;
+      const widget = this.designer.selectedWidget;
+      if (!widget || widget.contentType === widgetInfo.CODE) return;
+      this.designer.switchWidget(widget, widgetInfo);
+    },
     updateWidgetConfig(v) {
       this.designer.updateWidgetConfig(this.designer.selectedWidget.id, v);
     },
@@ -175,6 +189,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_epx_page_designer_setting_style = resolveComponent("epx-page-designer-setting-style");
   const _component_epx_page_designer_setting_advance = resolveComponent("epx-page-designer-setting-advance");
   const _component_el_tabs = resolveComponent("el-tabs");
+  const _component_epx_visual_component_library_dialog = resolveComponent("epx-visual-component-library-dialog");
+  const _component_el_dialog = resolveComponent("el-dialog");
   const _component_el_container = resolveComponent("el-container");
   return $props.designer.selectedWidget || $props.designer.mode !== "template" && $props.designer.mode !== "component" ? (openBlock(), createBlock(_component_el_container, {
     key: 0,
@@ -184,7 +200,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       createVNode(_component_el_tabs, {
         class: "epx-page-designer-setting__tabs",
         modelValue: $data.activeTab,
-        "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => $data.activeTab = $event),
+        "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => $data.activeTab = $event),
         stretch: true
       }, {
         default: withCtx(() => [
@@ -194,7 +210,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           }, {
             default: withCtx(() => [
               !$props.designer.selectedWidget ? (openBlock(), createElementBlock("div", _hoisted_1, [
-                _cache[6] || (_cache[6] = createElementVNode("label", { class: "epx-page-designer-setting__widget-title-label" }, "页面", -1)),
+                _cache[8] || (_cache[8] = createElementVNode("label", { class: "epx-page-designer-setting__widget-title-label" }, "页面", -1)),
                 createTextVNode(toDisplayString($props.designer.page.title) + " ", 1),
                 createElementVNode("i", {
                   class: "el-icon-copy-document",
@@ -202,7 +218,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                   onClick: _cache[0] || (_cache[0] = (...args) => $options.copyPageId && $options.copyPageId(...args))
                 })
               ])) : (openBlock(), createElementBlock("div", _hoisted_2, [
-                _cache[9] || (_cache[9] = createElementVNode("label", { class: "epx-page-designer-setting__widget-title-label" }, "组件类型", -1)),
+                _cache[11] || (_cache[11] = createElementVNode("label", { class: "epx-page-designer-setting__widget-title-label" }, "组件类型", -1)),
                 createTextVNode(toDisplayString($options.widgetInfo.TITLE || $options.widgetInfo.NAME) + " ", 1),
                 $options.widgetInfo.HELP ? (openBlock(), createElementBlock("i", {
                   key: 0,
@@ -214,20 +230,25 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                   key: 1,
                   class: "epx-page-designer-setting__widget-split",
                   onClick: _cache[2] || (_cache[2] = (...args) => $options.splitTemplate && $options.splitTemplate(...args))
-                }, [..._cache[7] || (_cache[7] = [
+                }, [..._cache[9] || (_cache[9] = [
                   createElementVNode("i", {
                     class: "epx-icon-quxiaofenzu",
                     title: "拆分模板"
                   }, null, -1),
                   createElementVNode("span", null, "拆分", -1)
-                ])])) : createCommentVNode("", true),
+                ])])) : (openBlock(), createElementBlock("i", {
+                  key: 2,
+                  class: "epx-page-designer-setting__widget-switch el-icon-sort",
+                  title: "切换组件",
+                  onClick: _cache[3] || (_cache[3] = ($event) => $data.showSwitchDialog = true)
+                })),
                 createVNode(_component_el_popover, {
                   ref: "codeEditorPopover",
                   placement: "bottom",
                   width: "400",
                   trigger: "click",
-                  onBeforeEnter: _cache[3] || (_cache[3] = ($event) => $data.showCodeEditor = true),
-                  onAfterLeave: _cache[4] || (_cache[4] = ($event) => $data.showCodeEditor = false)
+                  onBeforeEnter: _cache[4] || (_cache[4] = ($event) => $data.showCodeEditor = true),
+                  onAfterLeave: _cache[5] || (_cache[5] = ($event) => $data.showCodeEditor = false)
                 }, {
                   reference: withCtx(() => [
                     createVNode(_component_el_button, {
@@ -235,7 +256,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                       round: "",
                       size: "small"
                     }, {
-                      default: withCtx(() => [..._cache[8] || (_cache[8] = [
+                      default: withCtx(() => [..._cache[10] || (_cache[10] = [
                         createElementVNode("i", { class: "epx-icon-code" }, null, -1)
                       ])]),
                       _: 1
@@ -252,7 +273,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 }, 512)
               ])),
               (openBlock(), createBlock(_component_epx_page_designer_setting_property, {
-                key: $options.widgetId,
+                key: $options.propertyKey,
                 designer: $props.designer,
                 relationList: $props.relationList
               }, null, 8, ["designer", "relationList"]))
@@ -285,6 +306,21 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           })) : createCommentVNode("", true)
         ]),
         _: 1
+      }, 8, ["modelValue"]),
+      createVNode(_component_el_dialog, {
+        title: "切换组件",
+        modelValue: $data.showSwitchDialog,
+        "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => $data.showSwitchDialog = $event),
+        width: "960px",
+        "append-to-body": ""
+      }, {
+        default: withCtx(() => [
+          createVNode(_component_epx_visual_component_library_dialog, {
+            "hide-template": "",
+            onClick: $options.switchComponent
+          }, null, 8, ["onClick"])
+        ]),
+        _: 1
       }, 8, ["modelValue"])
     ]),
     _: 1

package/dist/src/visual/config-page/ComponentLibraryDialog.js

@@ -6,7 +6,12 @@ import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
 const _sfc_main = {
   name: "epx-visual-component-library-dialog",
   props: {
-    initialTerminal: { type: String, default: "pc" }
+    initialTerminal: { type: String, default: "pc" },
+    // 隐藏「模板组件」分类（如切换组件时，模板不能作为切换目标）
+    hideTemplate: {
+      type: Boolean,
+      default: false
+    }
   },
   data() {
     return {
@@ -25,6 +30,7 @@ const _sfc_main = {
     ]),
     componentTypeList() {
       const code = this.getCodeById("COMPONENT_TYPE") || [];
+      if (this.hideTemplate) return code;
       return [...code, { code: "template", name: "模板组件" }];
     }
   },
@@ -244,7 +250,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-const ComponentLibraryDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-de84464b"]]);
+const ComponentLibraryDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-be6fc4ff"]]);
 export {
   ComponentLibraryDialog as default
 };

package/dist/src/visual/config-page/DashboardMobile.js

@@ -1109,7 +1109,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }, 8, ["modelValue"])
   ], 2);
 }
-const DashboardMobile = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-ab9c83f8"]]);
+const DashboardMobile = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-49553b15"]]);
 export {
   DashboardMobile as default
 };