From 3278726a25387e951ece99fe36193f1669ffb8a5 Mon Sep 17 00:00:00 2001
From: "pikachu1995@126.com" <pikachu1995@126.com>
Date: Mon, 12 Oct 2026 10:10:22 +0800
Subject: [PATCH] =?UTF-8?q?feat(manager):=20=E8=A3=85=E4=BF=AE=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E9=9D=A2=E6=9D=BF=E4=B8=89=E7=B1=BB=E5=88=86=E7=BB=84?=
 =?UTF-8?q?=EF=BC=8C=E7=A7=BB=E9=99=A4=E4=BF=83=E9=94=80=E6=B4=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=EF=BC=8C=E7=94=BB=E5=B8=83=E5=AF=B9=E6=9C=AA?=
 =?UTF-8?q?=E7=9F=A5=E7=B1=BB=E5=9E=8B=E5=A2=9E=E5=8A=A0=E5=AE=88=E5=8D=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/page-decoration/wap/config.js   | 27 ++++----
 .../views/page-decoration/wap/decorate.vue    |  6 +-
 .../src/views/page-decoration/wap/index.vue   | 62 +++++++++++++------
 .../src/views/page-decoration/wap/style.scss  | 11 +++-
 4 files changed, 69 insertions(+), 37 deletions(-)

diff --git a/manager/src/views/page-decoration/wap/config.js b/manager/src/views/page-decoration/wap/config.js
index 08002a64e..1387d996b 100644
--- a/manager/src/views/page-decoration/wap/config.js
+++ b/manager/src/views/page-decoration/wap/config.js
@@ -6,12 +6,14 @@
  * notLink: true 没有链接功能
  * notImg: true 没有选择图片功能
  * close:true 右侧关闭按钮
+ * group: 'base' | 'marketing' | 'tools'  组件面板分组（无 group 的条目不在面板显示，仅供抽屉使用）
  */
 export const modelData = [
 
   {
     type: "flexOne",
     name: "图片",
+    group: "base",
     // drawer: true,
     notAdd: true,
     onlyImg: true,
@@ -31,6 +33,7 @@ export const modelData = [
   {
     type: "carousel",
     name: "轮播图",
+    group: "base",
     img: "md-image",
     // onlyImg: true,
     notTitle: false,
@@ -98,6 +101,7 @@ export const modelData = [
   {
     type: "title",
     name: "标题栏",
+    group: "tools",
     img: "md-image",
     // notTitle:true,
     notAdd: true,
@@ -366,6 +370,7 @@ export const modelData = [
   {
     type: "textPicture",
     name: "文字图片",
+    group: "base",
     drawer: true,
     notAdd: true,
 
@@ -411,6 +416,7 @@ export const modelData = [
   {
     type: "tpl_ad_list",
     name: "广告魔方",
+    group: "base",
     img: "md-image",
     options: {
       list: [
@@ -425,6 +431,7 @@ export const modelData = [
   {
     type: "menu",
     name: "宫格导航",
+    group: "base",
     img: "md-image",
     close: true,
     options: {
@@ -475,6 +482,7 @@ export const modelData = [
   {
     type: "search",
     name: "搜索",
+    group: "base",
     img: "md-image",
     notAdd: true,
     notLink: true,
@@ -490,6 +498,7 @@ export const modelData = [
   {
     type: "goods",
     name: "商品分类",
+    group: "base",
     img: "md-image",
     notAdd: true,
     notLink: true,
@@ -556,6 +565,7 @@ export const modelData = [
   {
     type: "notice",
     name: "公告",
+    group: "base",
     img: "md-image",
     notAdd: false,
     notLink: true,
@@ -572,23 +582,12 @@ export const modelData = [
       ]
     }
   },
-  {
-    type: "promotions",
-    name: "促销活动",
-    img: "md-image",
-    notAdd: true,
-    notLink: true,
-    notImg: true,
-    close: true,
-    options: {
-      list: []
-    }
-  },
   {
     notAdd: true,
     notImg: true,
     notLink: true,
     drawerPromotions: true,
+    group: "marketing",
     type: "promotionDetail",
     promotionsType: "PINTUAN",
     name: "拼团活动",
@@ -605,6 +604,7 @@ export const modelData = [
     notImg: true,
     notLink: true,
     drawerPromotions: true,
+    group: "marketing",
     type: "promotionDetail",
     promotionsType: "LIVE",
     name: "直播活动",
@@ -621,6 +621,7 @@ export const modelData = [
     notImg: true,
     notLink: true,
     drawerPromotions: true,
+    group: "marketing",
     type: "promotionDetail",
     promotionsType: "SECKILL",
     name: "秒杀活动",
@@ -637,6 +638,7 @@ export const modelData = [
     notImg: true,
     notLink: true,
     drawerPromotions: true,
+    group: "marketing",
     type: "promotionDetail",
     promotionsType: "KANJIA",
     name: "砍价活动",
@@ -651,6 +653,7 @@ export const modelData = [
   {
     type: "video",
     name: "视频",
+    group: "base",
     img: "md-image",
     notAdd: true,
     notImg: true,
diff --git a/manager/src/views/page-decoration/wap/decorate.vue b/manager/src/views/page-decoration/wap/decorate.vue
index 08dc33d49..c477e2e84 100644
--- a/manager/src/views/page-decoration/wap/decorate.vue
+++ b/manager/src/views/page-decoration/wap/decorate.vue
@@ -20,7 +20,7 @@
         style="margin-left: 20px"
         size="small"
         plain
-        v-if="res.type == 'promotions' || res.drawerPromotions"
+        v-if="res.drawerPromotions"
         type="primary"
         @click="selectPromotions()"
         >选择促销活动</el-button
@@ -95,9 +95,7 @@
     <div
       class="decorate-list"
       v-if="
-        (res.type != 'tpl_ad_list' &&
-          res.type != 'tpl_activity_list' &&
-          res.type != 'promotions') ||
+        (res.type != 'tpl_ad_list' && res.type != 'tpl_activity_list') ||
         res.drawer ||
         res.drawerPromotions
       "
diff --git a/manager/src/views/page-decoration/wap/index.vue b/manager/src/views/page-decoration/wap/index.vue
index 51285717a..74c1359d2 100644
--- a/manager/src/views/page-decoration/wap/index.vue
+++ b/manager/src/views/page-decoration/wap/index.vue
@@ -3,26 +3,30 @@
     <!-- 拖拽栏 ，展示栏  -->
     <div class="model-view">
       <div class="model-view-menu">
-        <draggable
-          class="model-view-menu-item"
-          :list="modelData"
-          :item-key="getModelKey"
-          :clone="cloneModel"
-          :move="handleMove"
-          :group="{ name: 'model', pull: 'clone', put: false, animation: 150 }"
-          :sort="false"
-          ghost-class="ghost"
+        <div
+          v-for="grp in modelGroups"
+          :key="grp.key"
+          class="model-group"
         >
-          <template #item="{ element: model }">
-            <li
-              v-if="!model.drawer && !model.drawerPromotions"
-              class="model-item"
-            >
-              <img src alt />
-              <span>{{ model.name }}</span>
-            </li>
-          </template>
-        </draggable>
+          <div class="model-group-title">{{ grp.title }}</div>
+          <draggable
+            class="model-view-menu-item"
+            :list="grp.list"
+            :item-key="getModelKey"
+            :clone="cloneModel"
+            :move="handleMove"
+            :group="{ name: 'model', pull: 'clone', put: false, animation: 150 }"
+            :sort="false"
+            ghost-class="ghost"
+          >
+            <template #item="{ element: model }">
+              <li class="model-item">
+                <img src alt />
+                <span>{{ model.name }}</span>
+              </li>
+            </template>
+          </draggable>
+        </div>
       </div>
 
       <div class="model-view-content">
@@ -40,6 +44,7 @@
             <template #item="{ element, index }">
               <div class="list">
                 <component
+                  v-if="templates[element.type]"
                   class="component"
                   :class="{ active: selected == index }"
                   @click="handleComponent(element, index)"
@@ -108,6 +113,20 @@ export default {
       deep: true,
     },
   },
+  computed: {
+    // 组件面板三类分组（无 group 的条目仅供抽屉使用，不进面板）
+    modelGroups() {
+      const groups = [
+        { key: "base", title: "基础组件" },
+        { key: "marketing", title: "营销组件" },
+        { key: "tools", title: "工具组件" },
+      ];
+      return groups.map((g) => ({
+        ...g,
+        list: this.modelData.filter((m) => m.group === g.key),
+      }));
+    },
+  },
   mounted() {
     this.init();
   },
@@ -150,7 +169,10 @@ export default {
       API_Other.getHomeData(this.$route.query.id).then((res) => {
         this.contentData = JSON.parse(res.result.pageData);
 
-        this.handleComponent(this.contentData.list[0], 0);
+        const first = this.contentData.list[0];
+        if (first && this.templates[first.type]) {
+          this.handleComponent(first, 0);
+        }
       });
 
     },
diff --git a/manager/src/views/page-decoration/wap/style.scss b/manager/src/views/page-decoration/wap/style.scss
index fb4e209ae..68c0b4e9f 100644
--- a/manager/src/views/page-decoration/wap/style.scss
+++ b/manager/src/views/page-decoration/wap/style.scss
@@ -3,11 +3,20 @@
   .model-view-menu {
     flex: 1.5;
     min-width: 250px;
-    > .model-view-menu-item {
+    .model-view-menu-item {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
     }
+    .model-group-title {
+      font-size: 13px;
+      font-weight: 600;
+      color: #303133;
+      margin: 10px 5px 8px;
+    }
+    .model-group:first-child .model-group-title {
+      margin-top: 0;
+    }
   }
   .model-config {
     flex: 2.5;