From df1db8d71bf74190911ceb9ed5f9a74944adb141 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Sat, 14 Sep 2024 18:34:35 +0800
Subject: [PATCH 1/5] =?UTF-8?q?1.=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../layout/components/main/default/article-tabs.ts  | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/views/layout/components/main/default/article-tabs.ts b/src/views/layout/components/main/default/article-tabs.ts
index ae2ab15f..6e0b4666 100644
--- a/src/views/layout/components/main/default/article-tabs.ts
+++ b/src/views/layout/components/main/default/article-tabs.ts
@@ -15,6 +15,7 @@ interface articleTabsList {
     order_by_type: string;
     order_by_rule: string;
     is_cover: string;
+    data_ids: string;
     data_list: ArticleList[];
     data_auto_list: ArticleList[];
 }
@@ -64,12 +65,12 @@ const defaultArticleTabs: DefaultArticleTabs = {
         article_theme: '0',
         article_carousel_col: '2',
         tabs_list: [
-            { id: '1', title: '热门推荐', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
-            { id: '2', title: '测试一', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
-            { id: '3', title: '测试二', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
-            { id: '4', title: '测试三', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
-            { id: '5', title: '测试四', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
-            { id: '6', title: '测试五', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
+            { id: '1', title: '热门推荐', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
+            { id: '2', title: '测试一', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
+            { id: '3', title: '测试二', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
+            { id: '4', title: '测试三', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
+            { id: '5', title: '测试四', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
+            { id: '6', title: '测试五', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
         ],
         field_show: ['0', '1'],
     },

From d906f4fd0c12136062c75babe94b5a009bdfa9c5 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Sat, 14 Sep 2024 18:59:08 +0800
Subject: [PATCH 2/5] =?UTF-8?q?1.=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/layout/index.vue | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue
index 7e25d0fb..cd6212cd 100644
--- a/src/views/layout/index.vue
+++ b/src/views/layout/index.vue
@@ -187,16 +187,23 @@ const save_formmat_form_data = (data: diy_data_item, close: boolean = false, is_
     const clone_form = cloneDeep(data);
     clone_form.header.show_tabs = '1';
     clone_form.footer.show_tabs = '0';
-    const new_array = ['goods-list', 'goods-tabs', 'article-list', 'article-tabs', 'coupon'];
+    const new_array_1 = ['goods-list', 'article-list', 'coupon'];
+    const new_array_2 = ['goods-tabs', 'article-tabs'];
     clone_form.diy_data = clone_form.diy_data.map((item: any) => {
-        if (new_array.includes(item.key)) {
+        if (new_array_1.includes(item.key)) {
             item.com_data.content.data_ids = item.com_data.content.data_list.map((item: any) => item.data.id).join(',') || '';
-            // item.com_data.content.data_list = [];
-            // item.com_data.content.data_auto_list = [];
+            item.com_data.content.data_list = [];
+            item.com_data.content.data_auto_list = [];
+        } else if (new_array_2.includes(item.key)) {
+            item.com_data.content.tabs_list.map((item: any) => {
+                item.data_ids = item.data_list.map((item1: any) => item1.data.id).join(',') || '';
+                item.data_list = [];
+                item.data_auto_list = [];
+            });
         } else if (item.key == 'data-magic') {
             item.com_data.content.data_magic_list.map((item1: any) => {
                 item1.goods_ids = item.goods_list.map((item2: any) => item2.data.id).join(',') || '';
-                // item1.goods_list = [];
+                item1.goods_list = [];
             });
         }
         return {

From b2273c3cf11905bf0622295204589d6774a40134 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Sat, 14 Sep 2024 19:16:34 +0800
Subject: [PATCH 3/5] =?UTF-8?q?1.=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/layout/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue
index cd6212cd..080e4822 100644
--- a/src/views/layout/index.vue
+++ b/src/views/layout/index.vue
@@ -202,8 +202,8 @@ const save_formmat_form_data = (data: diy_data_item, close: boolean = false, is_
             });
         } else if (item.key == 'data-magic') {
             item.com_data.content.data_magic_list.map((item1: any) => {
-                item1.goods_ids = item.goods_list.map((item2: any) => item2.data.id).join(',') || '';
-                item1.goods_list = [];
+                item1.data_content.goods_ids = item1.data_content.goods_list.map((item2: any) => item2.data.id).join(',') || '';
+                item1.data_content.goods_list = [];
             });
         }
         return {

From ca409f551a1129cc542246c062118b44fa577ca5 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Wed, 18 Sep 2024 11:03:06 +0800
Subject: [PATCH 4/5] =?UTF-8?q?1.=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/model-article-list/index.vue | 44 +++++++++++----------
 src/components/model-article-tabs/index.vue |  1 +
 src/views/layout/index.vue                  | 35 +++++++++++++---
 3 files changed, 55 insertions(+), 25 deletions(-)

diff --git a/src/components/model-article-list/index.vue b/src/components/model-article-list/index.vue
index 3352c8ab..34c8e81b 100644
--- a/src/components/model-article-list/index.vue
+++ b/src/components/model-article-list/index.vue
@@ -2,28 +2,26 @@
     <div class="oh" :style="style_container">
         <div class="re oh" :style="style">
             <div v-if="!['4'].includes(article_theme)" class="flex-warp" :class="article_theme_class" :style="article_theme !== '3' ? article_spacing : ''">
-                <template v-for="(item, index) in data_list" :key="index">
-                    <div class="item bg-f oh" :class="article_theme == '0' ? 'flex-row' : 'flex-col'" :style="article_style">
-                        <template v-if="article_theme !== '3'">
-                            <template v-if="item.new_cover.length > 0">
-                                <image-empty v-model="item.new_cover[0].url" class="img" :style="img_radius" :error-img-style="error_img"></image-empty>
-                            </template>
-                            <template v-else> <image-empty v-model="item.data.cover" class="img" :style="img_radius" :error-img-style="error_img"></image-empty> </template>
+                <div v-for="(item, index) in data_list" :key="index" class="item bg-f oh" :class="article_theme == '0' ? 'flex-row' : 'flex-col'" :style="article_style">
+                    <template v-if="article_theme !== '3'">
+                        <template v-if="item.new_cover.length > 0">
+                            <image-empty v-model="item.new_cover[0].url" class="img" :style="img_radius" :error-img-style="error_img"></image-empty>
                         </template>
-                        <div class="jc-sb flex-1" :class="article_theme == '3' ? 'flex-row align-c' : 'flex-col'" :style="article_theme !== '0' ? content_padding : ''">
-                            <div class="title" :class="article_theme == '3' ? 'text-line-1 flex-1 flex-width' : 'text-line-2'" :style="article_name">{{ !isEmpty(item.new_title) ? item.new_title : item.data.title }}</div>
-                            <div class="flex-row jc-sb gap-8" :class="article_theme == '3' ? 'ml-10' : 'align-e mt-10'">
-                                <div :style="article_date">{{ field_show.includes('0') ? (!is_obj_empty(item.data) ? item.data.add_time : '2020-06-05 15:20') : '' }}</div>
-                                <div v-show="field_show.includes('1')" class="flex-row align-c gap-3" :style="article_page_view">
-                                    <icon name="eye"></icon>
-                                    <div>
-                                        {{ item.data.access_count ? item.data.access_count : '16' }}
-                                    </div>
+                        <template v-else> <image-empty v-model="item.data.cover" class="img" :style="img_radius" :error-img-style="error_img"></image-empty> </template>
+                    </template>
+                    <div class="jc-sb flex-1" :class="article_theme == '3' ? 'flex-row align-c' : 'flex-col'" :style="article_theme !== '0' ? content_padding : ''">
+                        <div class="title" :class="article_theme == '3' ? 'text-line-1 flex-1 flex-width' : 'text-line-2'" :style="article_name">{{ !isEmpty(item.new_title) ? item.new_title : item.data.title }}</div>
+                        <div class="flex-row jc-sb gap-8" :class="article_theme == '3' ? 'ml-10' : 'align-e mt-10'">
+                            <div :style="article_date">{{ field_show.includes('0') ? (!is_obj_empty(item.data) ? item.data.add_time : '2020-06-05 15:20') : '' }}</div>
+                            <div v-show="field_show.includes('1')" class="flex-row align-c gap-3" :style="article_page_view">
+                                <icon name="eye"></icon>
+                                <div>
+                                    {{ item.data.access_count ? item.data.access_count : '16' }}
                                 </div>
                             </div>
                         </div>
                     </div>
-                </template>
+                </div>
             </div>
             <div v-else class="oh" :class="article_theme_class">
                 <el-carousel :key="carousel_key" indicator-position="none" :interval="interval_time" arrow="never" :autoplay="is_roll ? true : false">
@@ -156,10 +154,16 @@ const get_auto_data_list = async () => {
 const new_content = computed(() => props.value?.content || {});
 const new_style = computed(() => props.value?.style || {});
 onMounted(() => {
-    if (!isEmpty(new_content.value.data_list) && new_content.value.data_type == '0') {
+    if (new_content.value.data_type == '0' && !isEmpty(new_content.value.data_list)) {
         data_list.value = new_content.value.data_list;
-    } else if (!isEmpty(new_content.value.data_auto_list) && new_content.value.data_type == '1') {
-        data_list.value = new_content.value.data_auto_list;
+    } else if (new_content.value.data_type == '1' && !isEmpty(new_content.value.data_auto_list)) {
+        // data_list.value = new_content.value.data_auto_list;
+        data_list.value = new_content.value.data_auto_list.map((item: any) => ({
+            id: get_math(),
+            new_title: '',
+            new_cover: [],
+            data: item,
+        }));
     } else {
         data_list.value = Array(4).fill(default_data_list);
     }
diff --git a/src/components/model-article-tabs/index.vue b/src/components/model-article-tabs/index.vue
index 774b778c..cdee5f34 100644
--- a/src/components/model-article-tabs/index.vue
+++ b/src/components/model-article-tabs/index.vue
@@ -27,6 +27,7 @@ watch(() => props.value, (val) => {
     new_data.content.category_ids = new_data.content.tabs_list[0].category_ids;
     new_data.content.carousel_col = new_data.content.article_carousel_col;
     new_data.content.data_list = new_data.content.tabs_list[0].data_list;
+    new_data.content.data_auto_list = new_data.content.tabs_list[0].data_auto_list;
     new_data.content.data_ids = new_data.content.tabs_list[0].data_ids;
     new_data.content.number = new_data.content.tabs_list[0].number;
     new_data.content.order_by_type = new_data.content.tabs_list[0].order_by_type;
diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue
index 080e4822..9dae554a 100644
--- a/src/views/layout/index.vue
+++ b/src/views/layout/index.vue
@@ -187,23 +187,48 @@ const save_formmat_form_data = (data: diy_data_item, close: boolean = false, is_
     const clone_form = cloneDeep(data);
     clone_form.header.show_tabs = '1';
     clone_form.footer.show_tabs = '0';
-    const new_array_1 = ['goods-list', 'article-list', 'coupon'];
+    // 字段比coupon多
+    const new_array_1 = ['goods-list', 'article-list'];
+    // 数据比正常list多一级
     const new_array_2 = ['goods-tabs', 'article-tabs'];
+    // 数据格式简单
+    const new_array_3 = ['coupon'];
+    // 层级更深
+    const new_array_4 = ['data-magic'];
     clone_form.diy_data = clone_form.diy_data.map((item: any) => {
         if (new_array_1.includes(item.key)) {
             item.com_data.content.data_ids = item.com_data.content.data_list.map((item: any) => item.data.id).join(',') || '';
-            item.com_data.content.data_list = [];
+            item.com_data.content.data_list = item.com_data.content.data_list.map((item1: any) => {
+                return {
+                    ...item1,
+                    data: [],
+                };
+            });
             item.com_data.content.data_auto_list = [];
         } else if (new_array_2.includes(item.key)) {
             item.com_data.content.tabs_list.map((item: any) => {
                 item.data_ids = item.data_list.map((item1: any) => item1.data.id).join(',') || '';
-                item.data_list = [];
+                item.data_list = item.data_list.map((item2: any) => {
+                    return {
+                        ...item2,
+                        data: [],
+                    };
+                });
                 item.data_auto_list = [];
             });
-        } else if (item.key == 'data-magic') {
+        } else if (new_array_3.includes(item.key)) {
+            item.com_data.content.data_ids = item.com_data.content.data_list.map((item: any) => item.data.id).join(',') || '';
+            item.com_data.content.data_list = [];
+            item.com_data.content.data_auto_list = [];
+        } else if (new_array_4.includes(item.key)) {
             item.com_data.content.data_magic_list.map((item1: any) => {
                 item1.data_content.goods_ids = item1.data_content.goods_list.map((item2: any) => item2.data.id).join(',') || '';
-                item1.data_content.goods_list = [];
+                item1.data_content.goods_list = item1.data_content.goods_list.map((item3: any) => {
+                    return {
+                        ...item3,
+                        data: [],
+                    };
+                });
             });
         }
         return {

From b9cdd09fc40ac4fec6041e6375021088d4c33056 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Wed, 18 Sep 2024 13:44:59 +0800
Subject: [PATCH 5/5] =?UTF-8?q?1.=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/tabs-view/index.vue     | 36 ++++++++------
 src/components/common/upload/index.vue        |  6 +--
 src/components/model-article-tabs/index.vue   | 48 +++++++++++--------
 .../model-article-tabs-content.vue            |  5 +-
 src/components/model-goods-tabs/index.vue     | 46 ++++++++++--------
 .../model-goods-tabs-content.vue              |  6 +--
 .../components/main/default/article-tabs.ts   |  2 +
 .../components/main/default/goods-tabs.ts     |  2 +
 8 files changed, 82 insertions(+), 69 deletions(-)

diff --git a/src/components/common/tabs-view/index.vue b/src/components/common/tabs-view/index.vue
index d5b076b5..b457b583 100644
--- a/src/components/common/tabs-view/index.vue
+++ b/src/components/common/tabs-view/index.vue
@@ -1,8 +1,8 @@
 <template>
     <div class="flex-row gap-10 jc-sb align-c">
-        <div class="tabs flex-row oh" :style="`column-gap: ${ new_style.tabs_spacing }px;`">
+        <div class="tabs flex-row oh" :style="`column-gap: ${new_style.tabs_spacing}px;`">
             <template v-for="(item, index) in form.tabs_list" :key="index">
-                <div class="item nowrap flex-col jc-c gap-4" :class="tabs_theme + (index == 0 ? ' active' : '')">
+                <div class="item nowrap flex-col jc-c gap-4" :class="tabs_theme + (index == activeIndex ? ' active' : '')">
                     <template v-if="!isEmpty(item.img)">
                         <image-empty v-model="item.img[0]" class="img" error-img-style="width:2rem;height:2rem;"></image-empty>
                     </template>
@@ -10,7 +10,7 @@
                         <image-empty class="img" error-img-style="width:2rem;height:2rem;"></image-empty>
                     </template>
                     <div class="title" :style="title_style(index)">{{ item.title }}</div>
-                    <div class="desc" :style="tabs_theme_index == '1' && index == 0 ? tabs_check : ''">{{ item.desc }}</div>
+                    <div class="desc" :style="tabs_theme_index == '1' && index == activeIndex ? tabs_check : ''">{{ item.desc }}</div>
                     <icon name="checked-1" class="icon" :style="tabs_theme_index == '3' ? icon_tabs_check() : ''"></icon>
                     <div class="bottom_line" :style="tabs_check"></div>
                 </div>
@@ -23,6 +23,7 @@
 <script lang="ts" setup>
 import { gradient_computer } from '@/utils';
 import { isEmpty } from 'lodash';
+import { active } from 'sortablejs';
 const props = defineProps({
     value: {
         type: Object,
@@ -31,7 +32,11 @@ const props = defineProps({
     isTabs: {
         type: Boolean,
         default: false,
-    }
+    },
+    activeIndex: {
+        type: Number,
+        default: 0,
+    },
 });
 // const tabs = ref(props.value);
 // 用于页面判断显示
@@ -67,14 +72,14 @@ const tabs_check = computed(() => {
 // 选中的内部样式
 const tabs_theme_style = computed(() => {
     return {
-        tabs_title_checked: `font-weight: ${ new_style.value.tabs_weight_checked };font-size: ${ new_style.value.tabs_size_checked}px;color:${ new_style.value.tabs_color_checked };`,
-        tabs_title: `font-weight: ${ new_style.value.tabs_weight };font-size: ${ new_style.value.tabs_size}px;color:${ new_style.value.tabs_color };`,
+        tabs_title_checked: `font-weight: ${new_style.value.tabs_weight_checked};font-size: ${new_style.value.tabs_size_checked}px;color:${new_style.value.tabs_color_checked};`,
+        tabs_title: `font-weight: ${new_style.value.tabs_weight};font-size: ${new_style.value.tabs_size}px;color:${new_style.value.tabs_color};`,
     };
 });
 
 const title_style = (index: number) => {
     // 默认是未选中的状态
-    let style = `${ tabs_theme_style.value.tabs_title }`;
+    let style = `${tabs_theme_style.value.tabs_title}`;
     if (index == 0) {
         let checked_style = tabs_theme_style.value.tabs_title_checked;
         if (['2', '4'].includes(tabs_theme_index.value)) {
@@ -86,8 +91,8 @@ const title_style = (index: number) => {
 };
 // icon的渐变色处理
 const icon_tabs_check = () => {
-    return `${ tabs_check.value };line-height: 1;background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;`;
-}
+    return `${tabs_check.value};line-height: 1;background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;`;
+};
 </script>
 <style lang="scss" scoped>
 .tabs {
@@ -96,6 +101,7 @@ const icon_tabs_check = () => {
         padding: 0 0 0.5rem 0;
         // margin: 0 1rem;
         position: relative;
+        transition: all 0.3s ease-in-out;
         &:first-of-type {
             margin-left: 0;
         }
@@ -149,7 +155,7 @@ const icon_tabs_check = () => {
         &.tabs-style-2 {
             &.active {
                 .desc {
-                    background: #FF5E5E;
+                    background: #ff5e5e;
                     color: #fff;
                 }
             }
@@ -162,7 +168,7 @@ const icon_tabs_check = () => {
         &.tabs-style-3 {
             &.active {
                 .title {
-                    background: #FF2222;
+                    background: #ff2222;
                     border-radius: 2rem;
                     padding: 0.2rem 1.2rem;
                     color: #fff;
@@ -173,10 +179,10 @@ const icon_tabs_check = () => {
             padding-bottom: 1.8rem;
             &.active {
                 .title {
-                    color: #FF2222;
+                    color: #ff2222;
                 }
                 .icon {
-                    color: #FF2222;
+                    color: #ff2222;
                     display: block;
                 }
             }
@@ -186,13 +192,13 @@ const icon_tabs_check = () => {
             &.active {
                 .title {
                     font-size: 1.1rem;
-                    background: #FF5E5E;
+                    background: #ff5e5e;
                     border-radius: 2rem;
                     padding: 0.2rem 0.7rem;
                     color: #fff;
                 }
                 .img {
-                    border-color: #FF5E5E;
+                    border-color: #ff5e5e;
                 }
             }
             .img {
diff --git a/src/components/common/upload/index.vue b/src/components/common/upload/index.vue
index 49f876e9..badef15b 100644
--- a/src/components/common/upload/index.vue
+++ b/src/components/common/upload/index.vue
@@ -446,10 +446,6 @@ const edit_type_event = (data: Tree) => {
 const remove_type_event = (node: any, data: Tree) => {
     app?.appContext.config.globalProperties.$common.message_box('删除后不可恢复，确定继续吗?', 'warning').then(() => {
         UploadAPI.delTree({ id: data.id }).then((res) => {
-            // const parent = node.parent;
-            // const children: Tree[] = parent.data.items || parent.data;
-            // const index = children.findIndex((d) => d.id === data.id);
-            // children.splice(index, 1);
             get_tree(true);
             ElMessage({
                 type: 'success',
@@ -484,7 +480,7 @@ const get_attachment_list = (type?: string) => {
         page_size: page_size.value,
         type: upload_type.value == 'img' ? 'image' : upload_type.value == 'video' ? 'video' : upload_type.value == 'file' ? 'file' : '',
         keywords: search_name.value,
-        category_id: category_id.value,
+        category_id: category_id.value == 'all' ? '' : category_id.value,
     };
     UploadAPI.getAttachmentList(new_data).then((res) => {
         const data = res.data;
diff --git a/src/components/model-article-tabs/index.vue b/src/components/model-article-tabs/index.vue
index cdee5f34..5b5a2256 100644
--- a/src/components/model-article-tabs/index.vue
+++ b/src/components/model-article-tabs/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div :style="style_container">
-        <tabs-view ref="tabs" :value="article_tabs"></tabs-view>
+        <tabs-view ref="tabs" :value="article_tabs" :active-index="tabs_active_index"></tabs-view>
         <div class="pt-10">
             <model-article-list :value="article_tabs" :is-common-style="false"></model-article-list>
         </div>
@@ -18,25 +18,31 @@ const props = defineProps({
 });
 const style_container = ref('');
 const article_tabs = ref({});
-watch(() => props.value, (val) => {
-    const newVal = cloneDeep(val);
-    const new_style = newVal?.style;
-    let new_data = newVal;
-    new_data.content.theme = new_data.content.article_theme;
-    new_data.content.data_type = new_data.content.tabs_list[0].data_type;
-    new_data.content.category_ids = new_data.content.tabs_list[0].category_ids;
-    new_data.content.carousel_col = new_data.content.article_carousel_col;
-    new_data.content.data_list = new_data.content.tabs_list[0].data_list;
-    new_data.content.data_auto_list = new_data.content.tabs_list[0].data_auto_list;
-    new_data.content.data_ids = new_data.content.tabs_list[0].data_ids;
-    new_data.content.number = new_data.content.tabs_list[0].number;
-    new_data.content.order_by_type = new_data.content.tabs_list[0].order_by_type;
-    new_data.content.order_by_rule = new_data.content.tabs_list[0].order_by_rule;
-    new_data.content.field_show = new_data.content.field_show;
-    new_data.content.is_cover = new_data.content.tabs_list[0].is_cover;
-    article_tabs.value = new_data;
-    
-    style_container.value += common_styles_computer(new_style.common_style);
-}, { immediate: true, deep: true });
+const tabs_active_index = ref(0);
+watch(
+    () => props.value,
+    (val) => {
+        const newVal = cloneDeep(val);
+        const new_style = newVal?.style;
+        let new_data = newVal;
+        tabs_active_index.value = new_data.content.tabs_list.length - 1 >= new_data.content.tabs_active_index ? new_data.content.tabs_active_index : new_data.content.tabs_list.length - 1;
+        new_data.content.theme = new_data.content.article_theme;
+        new_data.content.data_type = new_data.content.tabs_list[tabs_active_index.value].data_type;
+        new_data.content.category_ids = new_data.content.tabs_list[tabs_active_index.value].category_ids;
+        new_data.content.carousel_col = new_data.content.article_carousel_col;
+        new_data.content.data_list = new_data.content.tabs_list[tabs_active_index.value].data_list;
+        new_data.content.data_auto_list = new_data.content.tabs_list[tabs_active_index.value].data_auto_list;
+        new_data.content.data_ids = new_data.content.tabs_list[tabs_active_index.value].data_ids;
+        new_data.content.number = new_data.content.tabs_list[tabs_active_index.value].number;
+        new_data.content.order_by_type = new_data.content.tabs_list[tabs_active_index.value].order_by_type;
+        new_data.content.order_by_rule = new_data.content.tabs_list[tabs_active_index.value].order_by_rule;
+        new_data.content.field_show = new_data.content.field_show;
+        new_data.content.is_cover = new_data.content.tabs_list[tabs_active_index.value].is_cover;
+        article_tabs.value = new_data;
+
+        style_container.value += common_styles_computer(new_style.common_style);
+    },
+    { immediate: true, deep: true }
+);
 </script>
 <style lang="scss" scoped></style>
diff --git a/src/components/model-article-tabs/model-article-tabs-content.vue b/src/components/model-article-tabs/model-article-tabs-content.vue
index 5cc4d900..9e05bf5d 100644
--- a/src/components/model-article-tabs/model-article-tabs-content.vue
+++ b/src/components/model-article-tabs/model-article-tabs-content.vue
@@ -32,7 +32,7 @@
                                 <el-form-item label="显示标题">
                                     <el-input v-model="row.title" placeholder="请输入标题文字" clearable />
                                 </el-form-item>
-                                <template v-if="active_index == index">
+                                <template v-if="form.tabs_active_index == index">
                                     <el-form-item v-if="form.tabs_theme == '1'" label="简介配置">
                                         <el-input v-model="row.desc" placeholder="请输入简介" clearable />
                                     </el-form-item>
@@ -188,9 +188,8 @@ const article_theme_change = (val: any) => {
 
 // 开启关闭链接
 const url_value_dialog_visible = ref(false);
-const active_index = ref(0);
 const tabs_list_click = (item: any, index: number) => {
-    active_index.value = index;
+    form.tabs_active_index = index;
 };
 // 选项卡设置
 const tabs_list_remove = (index: number) => {
diff --git a/src/components/model-goods-tabs/index.vue b/src/components/model-goods-tabs/index.vue
index c1cf8d45..b59ee564 100644
--- a/src/components/model-goods-tabs/index.vue
+++ b/src/components/model-goods-tabs/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div :style="style_container">
-        <tabs-view ref="tabs" :value="props.value"></tabs-view>
+        <tabs-view ref="tabs" :value="props.value" :active-index="tabs_active_index"></tabs-view>
         <div class="pt-10">
             <model-goods-list :value="tabs_list" :is-common-style="false"></model-goods-list>
         </div>
@@ -21,25 +21,29 @@ const props = defineProps({
 
 const style_container = ref('');
 const tabs_list = ref({});
+const tabs_active_index = ref(0);
+watch(
+    () => props.value,
+    (val) => {
+        const new_val = cloneDeep(val);
+        const new_style = new_val?.style;
+        let new_data = new_val;
+        tabs_active_index.value = new_data.content.tabs_list.length - 1 >= new_data.content.tabs_active_index ? new_data.content.tabs_active_index : new_data.content.tabs_list.length - 1;
+        // 产品的值
+        new_data.content.data_type = new_data.content.tabs_list[tabs_active_index.value].data_type;
+        new_data.content.category_ids = new_data.content.tabs_list[tabs_active_index.value].category_ids;
+        new_data.content.brand_ids = new_data.content.tabs_list[tabs_active_index.value].brand_ids;
+        new_data.content.number = new_data.content.tabs_list[tabs_active_index.value].number;
+        new_data.content.order_by_type = new_data.content.tabs_list[tabs_active_index.value].order_by_type;
+        new_data.content.order_by_rule = new_data.content.tabs_list[tabs_active_index.value].order_by_rule;
+        new_data.content.data_list = new_data.content.tabs_list[tabs_active_index.value].data_list;
+        new_data.content.data_auto_list = new_data.content.tabs_list[tabs_active_index.value].data_auto_list;
 
-watch(() => props.value, (val) => {
-    const new_val = cloneDeep(val);
-    const new_style = new_val?.style;
-    let new_data = new_val;
-    // 产品的值
-    new_data.content.data_type = new_data.content.tabs_list[0].data_type;
-    new_data.content.category_ids = new_data.content.tabs_list[0].category_ids;
-    new_data.content.brand_ids = new_data.content.tabs_list[0].brand_ids;
-    new_data.content.number = new_data.content.tabs_list[0].number;
-    new_data.content.order_by_type = new_data.content.tabs_list[0].order_by_type;
-    new_data.content.order_by_rule = new_data.content.tabs_list[0].order_by_rule;
-    new_data.content.data_list = new_data.content.tabs_list[0].data_list;
-    new_data.content.data_auto_list = new_data.content.tabs_list[0].data_auto_list;
-
-    tabs_list.value = new_data;
-    // 公共样式
-    style_container.value += common_styles_computer(new_style.common_style);
-},{ immediate: true, deep: true });
+        tabs_list.value = new_data;
+        // 公共样式
+        style_container.value += common_styles_computer(new_style.common_style);
+    },
+    { immediate: true, deep: true }
+);
 </script>
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/model-goods-tabs/model-goods-tabs-content.vue b/src/components/model-goods-tabs/model-goods-tabs-content.vue
index 9007d07d..a9d98d16 100644
--- a/src/components/model-goods-tabs/model-goods-tabs-content.vue
+++ b/src/components/model-goods-tabs/model-goods-tabs-content.vue
@@ -35,7 +35,7 @@
                                 <el-form-item label="显示标题">
                                     <el-input v-model="row.title" placeholder="请输入标题文字" clearable />
                                 </el-form-item>
-                                <template v-if="active_index == index">
+                                <template v-if="form.tabs_active_index == index">
                                     <el-form-item v-if="form.tabs_theme == '4'" label="上传图片">
                                         <upload v-model="row.img" :limit="1" size="40" styles="2"></upload>
                                     </el-form-item>
@@ -174,10 +174,8 @@ onBeforeMount(() => {
         }, 1000);
     });
 });
-
-const active_index = ref(0);
 const tabs_list_click = (item: any, index: number) => {
-    active_index.value = index;
+    form.value.tabs_active_index = index;
 };
 // 选项卡设置
 const tabs_list_remove = (index: number) => {
diff --git a/src/views/layout/components/main/default/article-tabs.ts b/src/views/layout/components/main/default/article-tabs.ts
index 6e0b4666..6837c197 100644
--- a/src/views/layout/components/main/default/article-tabs.ts
+++ b/src/views/layout/components/main/default/article-tabs.ts
@@ -26,6 +26,7 @@ interface DefaultArticleTabs {
         article_theme: string;
         article_carousel_col: string;
         tabs_list: articleTabsList[];
+        tabs_active_index: number;
         field_show: string[];
     };
     style: {
@@ -72,6 +73,7 @@ const defaultArticleTabs: DefaultArticleTabs = {
             { id: '5', title: '测试四', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
             { id: '6', title: '测试五', desc: '简介', data_type: '0', category_ids: [], data_ids: '', number: 4, order_by_type: '0', order_by_rule: '0', is_cover: '1', data_list: [], data_auto_list: [] },
         ],
+        tabs_active_index: 0,
         field_show: ['0', '1'],
     },
     style: {
diff --git a/src/views/layout/components/main/default/goods-tabs.ts b/src/views/layout/components/main/default/goods-tabs.ts
index c3d0146f..daf68ad8 100644
--- a/src/views/layout/components/main/default/goods-tabs.ts
+++ b/src/views/layout/components/main/default/goods-tabs.ts
@@ -21,6 +21,7 @@ interface DefaultProductList {
         theme: string;
         carousel_col: number;
         tabs_list: articleTabsList[];
+        tabs_active_index: number;
         is_show: string[];
         is_shop_show: string;
         is_price_solo: string;
@@ -81,6 +82,7 @@ const defaultProductList: DefaultProductList = {
             { id: '3', title: '测试二', img: [], desc: '简介', data_type: '0', category_ids: [], brand_ids: [], data_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', data_list: [], data_auto_list: [] },
             { id: '4', title: '测试三', img: [], desc: '简介', data_type: '0', category_ids: [], brand_ids: [], data_ids: [], number: 4, order_by_type: '0', order_by_rule: '0', data_list: [], data_auto_list: [] },
         ],
+        tabs_active_index: 0,
         is_show: ['title', 'plugins_view_icon', 'price', 'sales_count', 'original_price'],
         is_shop_show: '1',
         is_price_solo: '1',