From 435ef8e71800d1b9a431f38b1803cb4ab86e9eb0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Tue, 18 Feb 2025 13:36:45 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=80=89=E9=A1=B9=E5=8D=A1?=
 =?UTF-8?q?=E8=BD=AE=E6=92=AD=E7=9A=84=E5=A4=84=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/model-tabs-carousel/index.vue  | 10 +++++++---
 .../model-tabs/model-tabs-content.vue         | 20 +++++++++++++------
 src/config/const/tabs-carousel.ts             |  2 ++
 3 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/src/components/model-tabs-carousel/index.vue b/src/components/model-tabs-carousel/index.vue
index 032beecf..a58096d7 100644
--- a/src/components/model-tabs-carousel/index.vue
+++ b/src/components/model-tabs-carousel/index.vue
@@ -2,8 +2,8 @@
     <div class="re" :style="style_container + swiper_bg_style">
         <div class="abs z-i top-0 w h" :style="swiper_bg_img_style"></div>
         <div class="flex-col oh" :style="style_img_container + (!isEmpty(swiper_bg_img_style) ? `background-image: url('');` : '')">
-            <div class="oh z-deep re" :style="tabs_container + swiper_bg_style">
-                <div class="abs z-i top-0 w h" :style="swiper_bg_img_style"></div>
+            <div class="oh z-deep re" :style="tabs_container + (is_rotating_background ? swiper_bg_style : '')">
+                <div v-if="is_rotating_background" class="abs z-i top-0 w h" :style="swiper_bg_img_style"></div>
                 <div class="oh z-deep" :style="tabs_img_container">
                     <tabs-view ref="tabs" :value="tabs_list" :is-tabs="true" :active-index="tabs_active_index" :tabs-sliding-fixed-bg="tabs_sliding_fixed_bg"></tabs-view>
                 </div>
@@ -41,11 +41,12 @@ const carousel_container = ref('');
 const carousel_img_container = ref('');
 // 打开滑动固定开关之后，显示的样式
 const tabs_sliding_fixed_bg = ref('');
+const is_rotating_background = ref(false);
 watch(
     props.value,
     (val) => {
         let new_data = cloneDeep(val);
-        const { home_data, is_tabs_safe_distance = '0' } = new_data.content;
+        const { home_data, is_tabs_safe_distance = '0', rotating_background } = new_data.content;
         const new_style = new_data?.style;
         // 选项卡背景设置
         const tabs_data = {
@@ -60,6 +61,9 @@ watch(
             ...new_style.tabs_padding,
             padding_top: (new_style.tabs_padding?.padding_top || 0) + (is_general_safe_distance ? common_store.header_height : 0),
         }
+        // 是否开启轮播图背景设置
+        is_rotating_background.value = rotating_background == '1';
+        // 选项卡滑动固定背景
         tabs_sliding_fixed_bg.value = gradient_computer(tabs_data);
         tabs_container.value = gradient_computer(tabs_data) + radius_computer(new_style.tabs_radius) + margin_computer(new_style.tabs_margin) + box_shadow_computer(new_style.tabs_content) + border_computer(new_style.tabs_content) + `margin-top: ${ new_style.tabs_margin.margin_top - (is_general_safe_distance ? common_store.header_height : 0) }px;`;
         tabs_img_container.value = background_computer(tabs_data) + padding_computer(new_tabs_padding);
diff --git a/src/components/model-tabs/model-tabs-content.vue b/src/components/model-tabs/model-tabs-content.vue
index 70d105d1..7165d16d 100644
--- a/src/components/model-tabs/model-tabs-content.vue
+++ b/src/components/model-tabs/model-tabs-content.vue
@@ -33,12 +33,20 @@
                         <icon name="miaosha-hdgz" size="12" color="#999"></icon>
                     </el-tooltip>
                 </el-form-item>
-                <el-form-item v-if="is_general_safe_distance && !isCommon" label="安全距离">
-                    <el-switch v-model="form.is_tabs_safe_distance" class="mr-10" active-value="1" inactive-value="0" />
-                    <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="<span>选项卡是否支持安全距离</span>" raw-content placement="top">
-                        <icon name="miaosha-hdgz" size="12" color="#999"></icon>
-                    </el-tooltip>
-                </el-form-item>
+                <template v-if="!isCommon">
+                    <el-form-item v-if="is_general_safe_distance" label="安全距离">
+                        <el-switch v-model="form.is_tabs_safe_distance" class="mr-10" active-value="1" inactive-value="0" />
+                        <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="<span>选项卡是否支持安全距离</span>" raw-content placement="top">
+                            <icon name="miaosha-hdgz" size="12" color="#999"></icon>
+                        </el-tooltip>
+                    </el-form-item>
+                    <el-form-item label="轮播背景">
+                        <el-switch v-model="form.rotating_background" class="mr-10" active-value="1" inactive-value="0" />
+                        <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="<span>1.关闭的时候,如果没有选项卡背景会使用通用背景.<br/>2.打开的时候,如果没有选项卡背景会使用轮播背景,都没有的时候会使用通用背景.</span>" raw-content placement="top">
+                            <icon name="miaosha-hdgz" size="12" color="#999"></icon>
+                        </el-tooltip>
+                    </el-form-item>
+                </template>
             </card-container>
             <div class="divider-line"></div>
             <card-container>
diff --git a/src/config/const/tabs-carousel.ts b/src/config/const/tabs-carousel.ts
index 6811f49a..355d730e 100644
--- a/src/config/const/tabs-carousel.ts
+++ b/src/config/const/tabs-carousel.ts
@@ -33,6 +33,7 @@ interface defaultTabs {
     content: {
         content_top: object;
         justification: string,
+        rotating_background: string;
         show_more: string,
         tabs_theme: string;
         tabs_adorn_icon: string;
@@ -131,6 +132,7 @@ const defaultTabs: defaultTabs = {
         show_more: '1',
         // 选项卡风格
         tabs_theme: '0',
+        rotating_background: '0',
         // 选中装饰图标
         tabs_adorn_icon: 'checked-smooth',
         tabs_adorn_img: [],