From b4d67859da0a1a10c5ced22c44ec2d239a968fb1 Mon Sep 17 00:00:00 2001
From: "pikachu1995@126.com" <pikachu1995@126.com>
Date: Mon, 12 Oct 2026 10:13:59 +0800
Subject: [PATCH] =?UTF-8?q?feat(manager):=20=E6=96=B0=E5=A2=9E=E8=BE=85?=
 =?UTF-8?q?=E5=8A=A9=E7=A9=BA=E7=99=BD=E8=A3=85=E4=BF=AE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../wap/config-panel/PanelBlank.vue           | 53 +++++++++++++++++++
 .../page-decoration/wap/config-panel/index.js |  6 ++-
 .../src/views/page-decoration/wap/config.js   | 12 +++++
 .../page-decoration/wap/template/index.js     |  2 +
 .../wap/template/tpl_blank.vue                | 19 +++++++
 5 files changed, 91 insertions(+), 1 deletion(-)
 create mode 100644 manager/src/views/page-decoration/wap/config-panel/PanelBlank.vue
 create mode 100644 manager/src/views/page-decoration/wap/template/tpl_blank.vue

diff --git a/manager/src/views/page-decoration/wap/config-panel/PanelBlank.vue b/manager/src/views/page-decoration/wap/config-panel/PanelBlank.vue
new file mode 100644
index 000000000..dec0e826c
--- /dev/null
+++ b/manager/src/views/page-decoration/wap/config-panel/PanelBlank.vue
@@ -0,0 +1,53 @@
+<template>
+  <div class="panel-blank">
+    <color-field
+      v-model="res.options.bgColor"
+      label="背景颜色"
+      :default-value="defaults.bgColor"
+    />
+    <slider-field
+      v-model="res.options.height"
+      label="空白高度"
+      :min="1"
+      :max="100"
+    />
+    <slider-field
+      v-model="res.options.paddingX"
+      label="左右边距"
+      :min="0"
+      :max="30"
+    />
+    <slider-field
+      v-model="res.options.pageGap"
+      label="页面间距"
+      :min="0"
+      :max="100"
+    />
+  </div>
+</template>
+
+<script>
+import ColorField from "../controls/ColorField.vue";
+import SliderField from "../controls/SliderField.vue";
+
+const DEFAULTS = {
+  bgColor: "#f5f5f5",
+  height: 10,
+  paddingX: 0,
+  pageGap: 10,
+};
+
+export default {
+  name: "PanelBlank",
+  components: { ColorField, SliderField },
+  props: {
+    res: { type: Object, required: true },
+  },
+  data() {
+    return { defaults: DEFAULTS };
+  },
+  created() {
+    this.res.options = Object.assign({}, DEFAULTS, this.res.options);
+  },
+};
+</script>
diff --git a/manager/src/views/page-decoration/wap/config-panel/index.js b/manager/src/views/page-decoration/wap/config-panel/index.js
index d397fa4fa..805736eb8 100644
--- a/manager/src/views/page-decoration/wap/config-panel/index.js
+++ b/manager/src/views/page-decoration/wap/config-panel/index.js
@@ -1,3 +1,7 @@
 // 新组件配置面板映射：type → 面板组件
 // 面板契约：props res（整个楼层条目），直接修改 res.options.*，保存链路自动感知
-export default {};
+import PanelBlank from "./PanelBlank.vue";
+
+export default {
+  blank: PanelBlank,
+};
diff --git a/manager/src/views/page-decoration/wap/config.js b/manager/src/views/page-decoration/wap/config.js
index 1387d996b..e4510bf66 100644
--- a/manager/src/views/page-decoration/wap/config.js
+++ b/manager/src/views/page-decoration/wap/config.js
@@ -690,5 +690,17 @@ export const modelData = [
         },
       ],
     }
+  },
+  {
+    type: "blank",
+    name: "辅助空白",
+    group: "tools",
+    img: "md-image",
+    options: {
+      bgColor: "#f5f5f5",
+      height: 10,
+      paddingX: 0,
+      pageGap: 10
+    }
   }
 ];
diff --git a/manager/src/views/page-decoration/wap/template/index.js b/manager/src/views/page-decoration/wap/template/index.js
index 89f29451b..522954f0d 100644
--- a/manager/src/views/page-decoration/wap/template/index.js
+++ b/manager/src/views/page-decoration/wap/template/index.js
@@ -23,6 +23,7 @@ import tpl_video from "./tpl_video";
 import tpl_goods from "./tpl_goods";
 import tpl_notice from "./tpl_notice";
 import tpl_promotions from "./tpl_promotions";
+import tpl_blank from "./tpl_blank";
 
 export default {
   notice: tpl_notice,
@@ -50,4 +51,5 @@ export default {
   tpl_ad_list,
   promotions: tpl_promotions,
   tpl_activity_list,
+  blank: tpl_blank,
 };
diff --git a/manager/src/views/page-decoration/wap/template/tpl_blank.vue b/manager/src/views/page-decoration/wap/template/tpl_blank.vue
new file mode 100644
index 000000000..38caac412
--- /dev/null
+++ b/manager/src/views/page-decoration/wap/template/tpl_blank.vue
@@ -0,0 +1,19 @@
+<template>
+  <div
+    class="tpl-blank"
+    :style="{
+      background: res.bgColor,
+      height: res.height + 'px',
+      margin: `0 ${res.paddingX}px ${res.pageGap}px`,
+    }"
+  ></div>
+</template>
+
+<script>
+export default {
+  name: "tpl_blank",
+  props: {
+    res: { type: Object, default: () => ({}) },
+  },
+};
+</script>