diff --git a/common/js/common/common.js b/common/js/common/common.js
index f2a16ca0..c8fb02c3 100644
--- a/common/js/common/common.js
+++ b/common/js/common/common.js
@@ -1,3 +1,4 @@
+const app = getApp();
 /**
  * 判断一个对象是否为空。
  *
@@ -107,9 +108,28 @@ export function gradient_handle (color_list, direction, is_return_all = true) {
  * @param {string[], string} path
  * @returns {string}
  */
-export function padding_computer (new_style, scale = 1, is_custom = false) {
+export function padding_computer (new_style, scale = 1, is_custom = false, index) {
     if (!is_custom) {
-        return `padding: ${new_style.padding_top * 2 || 0}rpx ${new_style.padding_right * 2 || 0}rpx ${new_style.padding_bottom * 2 || 0}rpx ${new_style.padding_left * 2 || 0}rpx;`;
+        let padding_top = '';
+        if (index == 0) {
+            // 状态栏高度
+            var bar_height = parseInt(app.globalData.get_system_info('statusBarHeight', 0));
+            // #ifdef MP-TOUTIAO
+            bar_height = 0;
+            // #endif
+            let sticky_top = 0;
+            // #ifdef MP
+            sticky_top = bar_height + 5 + 12;
+            // #endif
+            // #ifdef H5 || MP-TOUTIAO
+            sticky_top = bar_height + 7 + 12;
+            // #endif
+            // #ifdef APP
+            sticky_top = bar_height + 0 + 12;
+            // #endif
+            padding_top = `padding-top:calc(${new_style.padding_top * 2 || 0}rpx + ${sticky_top}px);`;
+        }
+        return `padding: ${new_style.padding_top * 2 || 0}rpx ${new_style.padding_right * 2 || 0}rpx ${new_style.padding_bottom * 2 || 0}rpx ${new_style.padding_left * 2 || 0}rpx;` + padding_top;
     } else {
         return `padding: ${new_style.padding_top * scale || 0}px ${new_style.padding_right * scale || 0}px ${new_style.padding_bottom * scale || 0}px ${new_style.padding_left * scale || 0}px;`;
     }
@@ -135,7 +155,7 @@ export function radius_computer (new_style, scale = 1, is_custom = false) {
     } else {
         return `border-radius: ${new_style.radius_top_left * scale || 0}px ${new_style.radius_top_right * scale || 0}px ${new_style.radius_bottom_right * scale || 0}px ${new_style.radius_bottom_left * scale || 0}px;`;
     }
-    
+
 }
 /**
  * 设置阴影样式
@@ -196,8 +216,8 @@ export function common_styles_computer (new_style) {
     return gradient_computer(new_style) + margin_computer(new_style) + radius_computer(new_style) + box_shadow_computer(new_style) + `overflow:hidden;`;
 }
 
-export function common_img_computer (new_style) {
-    return padding_computer(new_style) + background_computer(new_style) + `overflow:hidden;box-sizing: border-box;`;
+export function common_img_computer (new_style, index) {
+    return padding_computer(new_style, 1, false, index) + background_computer(new_style) + `overflow:hidden;box-sizing: border-box;`;
 }
 /**
  * 生成一个随机数学字符串。
diff --git a/components/diy/article-list.vue b/components/diy/article-list.vue
index fcddb8e7..2df1c799 100644
--- a/components/diy/article-list.vue
+++ b/components/diy/article-list.vue
@@ -80,9 +80,14 @@
             },
             // 关键key
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -239,7 +244,7 @@
                 if (this.propIsCommonStyle) {
                     this.setData({
                         style_container: common_styles_computer(new_style.common_style),
-                        style_img_container: common_img_computer(new_style.common_style),
+                        style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                     });
                 }
             },
diff --git a/components/diy/article-tabs.vue b/components/diy/article-tabs.vue
index defc1ab3..9f613a01 100644
--- a/components/diy/article-tabs.vue
+++ b/components/diy/article-tabs.vue
@@ -49,6 +49,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         components: {
             componentDiyModulesTabsView,
@@ -161,7 +166,7 @@
                 this.setData({
                     article_tabs: new_data,
                     style_container: common_styles_computer(common_style),
-                    style_img_container: common_img_computer(common_style),
+                    style_img_container: common_img_computer(common_style, this.propIndex),
                     tabs_style: new_tabs_style,
                 });
             },
diff --git a/components/diy/auxiliary-blank.vue b/components/diy/auxiliary-blank.vue
index a064ce8c..48c155be 100644
--- a/components/diy/auxiliary-blank.vue
+++ b/components/diy/auxiliary-blank.vue
@@ -17,9 +17,14 @@
                 },
             },
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -44,7 +49,7 @@
                 this.setData({
                     style: `height: ${height * 2}rpx;background: ${line_color || 'transparent'};`,
                     style_container: common_styles_computer(common_style),
-                    style_img_container: common_img_computer(common_style),
+                    style_img_container: common_img_computer(common_style, this.propIndex),
                 });
             },
         },
diff --git a/components/diy/auxiliary-line.vue b/components/diy/auxiliary-line.vue
index e69c6793..b3fa1c14 100644
--- a/components/diy/auxiliary-line.vue
+++ b/components/diy/auxiliary-line.vue
@@ -20,6 +20,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -49,7 +54,7 @@
                 this.setData({
                     style: border_content + border_style,
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
         },
diff --git a/components/diy/carousel.vue b/components/diy/carousel.vue
index 94e2aae2..162847b5 100644
--- a/components/diy/carousel.vue
+++ b/components/diy/carousel.vue
@@ -79,6 +79,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -150,7 +155,7 @@
                     popup_width: block * 16 * 2 + 'rpx', // 视频的宽度，依照16:9比例来算
                     popup_height: block * 9 * 2 + 'rpx',  // 视频的高度
                     style_container: this.propIsCommon ? common_styles_computer(common_style) : '', // 公共样式显示
-                    style_img_container: this.propIsCommon ? common_img_computer(common_style) : '', // 公共样式显示
+                    style_img_container: this.propIsCommon ? common_img_computer(common_style, this.propIndex) : '', // 公共样式显示
                     img_style: radius_computer(new_style), // 图片的设置
                     indicator_style: this.get_indicator_style(new_style), // 指示器的样式
                     dot_style: `bottom: ${ (new_style.indicator_bottom + common_style.margin_bottom + common_style.padding_bottom) * (sys_width / 390) * 2 }rpx;`, // 指示器位置
diff --git a/components/diy/coupon.vue b/components/diy/coupon.vue
index 4b62990f..cf169620 100644
--- a/components/diy/coupon.vue
+++ b/components/diy/coupon.vue
@@ -171,6 +171,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -284,7 +289,7 @@
                         url_3: new_content.theme_5_static_img[0].url,
                     },
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
             // 领取优惠券
diff --git a/components/diy/custom.vue b/components/diy/custom.vue
index a61c17b1..701c48aa 100644
--- a/components/diy/custom.vue
+++ b/components/diy/custom.vue
@@ -2,7 +2,7 @@
     <view :style="style_container + 'height:' + form.height * scale + 'px;'">
         <view class="custom-container wh-auto ht-auto" :style="style_img_container">
             <view class="wh-auto ht-auto pr">
-                <view v-for="(item, index) in form.custom_list" :key="item.id" class="main-content" :style="{ 'left': get_percentage_count(item.location.x, div_width), 'top': get_percentage_count(item.location.y, div_height), 'width': get_percentage_count(item.com_data.com_width, div_width), 'height': get_percentage_count(item.com_data.com_height, div_height), 'z-index': custom_list_length > 0 ? custom_list_length - index : 0 }">
+                <view v-for="(item, index) in form.custom_list" :key="item.id" class="main-content" :style="{ left: get_percentage_count(item.location.x, div_width), top: get_percentage_count(item.location.y, div_height), width: get_percentage_count(item.com_data.com_width, div_width), height: get_percentage_count(item.com_data.com_height, div_height), 'z-index': custom_list_length > 0 ? custom_list_length - index : 0 }">
                     <template v-if="item.key == 'text'">
                         <model-text :propKey="propKey" :propValue="item.com_data" :propScale="scale" :propSourceList="form.data_source_content" @url_event="url_event"></model-text>
                     </template>
@@ -25,92 +25,97 @@
 </template>
 
 <script>
-import { common_styles_computer, common_img_computer, percentage_count } from '@/common/js/common/common.js';
-const app = getApp();
-import modelText from '@/components/diy/modules/custom/model-text.vue';
-import modelLines from '@/components/diy/modules/custom/model-lines.vue';
-import modelImage from '@/components/diy/modules/custom/model-image.vue';
-import modelIcon from '@/components/diy/modules/custom/model-icon.vue';
-import modelPanel from '@/components/diy/modules/custom/model-panel.vue';
-var system = app.globalData.get_system_info(null, null, true);
-var sys_width = app.globalData.window_width_handle(system.windowWidth);
+    import { common_styles_computer, common_img_computer, percentage_count } from '@/common/js/common/common.js';
+    const app = getApp();
+    import modelText from '@/components/diy/modules/custom/model-text.vue';
+    import modelLines from '@/components/diy/modules/custom/model-lines.vue';
+    import modelImage from '@/components/diy/modules/custom/model-image.vue';
+    import modelIcon from '@/components/diy/modules/custom/model-icon.vue';
+    import modelPanel from '@/components/diy/modules/custom/model-panel.vue';
+    var system = app.globalData.get_system_info(null, null, true);
+    var sys_width = app.globalData.window_width_handle(system.windowWidth);
 
-export default {
-    components: {
-        modelText,
-        modelLines,
-        modelImage,
-        modelIcon,
-        modelPanel
-    },
-    props: {
-        propValue: {
-            type: Object,
-            default: () => {
-                return {};
+    export default {
+        components: {
+            modelText,
+            modelLines,
+            modelImage,
+            modelIcon,
+            modelPanel,
+        },
+        props: {
+            propValue: {
+                type: Object,
+                default: () => {
+                    return {};
+                },
+            },
+            propKey: {
+                type: [String, Number],
+                default: '',
+            },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
             },
         },
-        propKey: {
-            type: [String,Number],
-            default: '',
-        },
-    },
-    data() {
-        return {
-            form: {},
-            new_style: {},
-            scale: 1,
-            style_container: '',
-            style_img_container: '',
-            div_width: 0,
-            div_height: 0,
-            custom_list_length: 0,
-        };
-    },
-    computed: {
-        get_percentage_count() {
-            return (num, container_size) => {
-                return num * this.scale + 'px';
+        data() {
+            return {
+                form: {},
+                new_style: {},
+                scale: 1,
+                style_container: '',
+                style_img_container: '',
+                div_width: 0,
+                div_height: 0,
+                custom_list_length: 0,
             };
         },
-    },
-    watch: {
-        propKey(val) {
-            // 初始化
+        computed: {
+            get_percentage_count() {
+                return (num, container_size) => {
+                    return num * this.scale + 'px';
+                };
+            },
+        },
+        watch: {
+            propKey(val) {
+                // 初始化
+                this.init();
+            },
+        },
+        mounted() {
             this.init();
         },
-    },
-    mounted() {
-        this.init();
-    },
-    methods: {
-        percentage_count,
-        init() {
-            const new_form = this.propValue.content;
-            const new_style = this.propValue.style;
-            const { margin_left, margin_right } = new_style.common_style;
-            const width = sys_width - margin_left - margin_right;
-            this.setData({
-                form: new_form,
-                new_style: new_style,
-                div_width: width,
-                scale: width / 390,
-                custom_list_length: new_form.custom_list.length - 1,
-                style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;', // 用于样式显示
-                style_img_container: common_img_computer(new_style.common_style),
-                div_height: new_form.height,
-            });
+        methods: {
+            percentage_count,
+            init() {
+                const new_form = this.propValue.content;
+                const new_style = this.propValue.style;
+                const { margin_left, margin_right } = new_style.common_style;
+                const width = sys_width - margin_left - margin_right;
+                this.setData({
+                    form: new_form,
+                    new_style: new_style,
+                    div_width: width,
+                    scale: width / 390,
+                    custom_list_length: new_form.custom_list.length - 1,
+                    style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;', // 用于样式显示
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
+                    div_height: new_form.height,
+                });
+            },
+            url_event(e) {
+                app.globalData.url_event(e);
+            },
         },
-        url_event(e) {
-            app.globalData.url_event(e);
-        },
-    },
-};
+    };
 </script>
 
 <style scoped lang="scss">
-.main-content {
-    position: absolute;
-    overflow: hidden;
-}
+    .main-content {
+        position: absolute;
+        overflow: hidden;
+    }
 </style>
diff --git a/components/diy/data-magic.vue b/components/diy/data-magic.vue
index 6c136844..bc59d692 100644
--- a/components/diy/data-magic.vue
+++ b/components/diy/data-magic.vue
@@ -89,6 +89,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -146,7 +151,7 @@
                     content_img_radius: radius_computer(new_style.img_radius),
                     data_magic_list: this.get_data_magic_list(new_form.data_magic_list),
                     style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;', // 用于样式显示
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
                 this.$nextTick(() => {
                     const query = uni.createSelectorQuery().in(this);
diff --git a/components/diy/diy.vue b/components/diy/diy.vue
index 3ae0d2ab..fe5283d0 100644
--- a/components/diy/diy.vue
+++ b/components/diy/diy.vue
@@ -16,30 +16,30 @@
                             <view v-for="(item, index) in diy_data" :key="index" :style="'margin-top:' + (['float-window'].includes(item.key) ? '0rpx' : -(item.com_data.style.common_style.floating_up * 2 || 0) + 'rpx;z-index:1;')">
                                 <!-- 基础组件 -->
                                 <template v-if="item.is_enable == '1'">
-                                    <componentDiySearch v-if="item.key == 'search'" :propKey="item.id" :propValue="item.com_data"></componentDiySearch>
-                                    <componentDiyCarousel v-else-if="item.key == 'carousel'" :propKey="item.id" :propValue="item.com_data" @onVideoPlay="video_play"></componentDiyCarousel>
-                                    <componentDiyNavGroup v-else-if="item.key == 'nav-group'" :propKey="item.id" :propValue="item.com_data"></componentDiyNavGroup>
-                                    <componentDiyUserInfo v-else-if="item.key == 'user-info'" :propKey="item.id" :propValue="item.com_data"></componentDiyUserInfo>
-                                    <componentDiyNotice v-else-if="item.key == 'notice'" :propKey="item.id" :propValue="item.com_data"></componentDiyNotice>
-                                    <componentDiyVideo v-else-if="item.key == 'video'" :propKey="item.id" :propValue="item.com_data"></componentDiyVideo>
-                                    <componentDiyArticleList v-else-if="item.key == 'article-list'" :propKey="item.id" :propValue="item.com_data"></componentDiyArticleList>
-                                    <componentDiyArticleTabs v-else-if="item.key == 'article-tabs'" :propKey="item.id" :propValue="item.com_data" :propTop="(!is_immersion_model ? temp_sticky_top : 0) + tabs_height" :propScrollTop="scroll_top" :propCustomNavHeight="!is_immersion_model && is_header_top ? (is_search_alone_row ? 66 + data_alone_row_space : 33) : 0"></componentDiyArticleTabs>
-                                    <componentDiyGoodsTabs v-else-if="item.key == 'goods-tabs'" :ref="'diy_goods_buy' + index" :propIndex="index" :propKey="item.id" :propValue="item.com_data" :propTop="(!is_immersion_model ? temp_sticky_top : 0) + tabs_height" :propScrollTop="scroll_top" :propCustomNavHeight="!is_immersion_model && is_header_top ? (is_search_alone_row ? 66 + data_alone_row_space : 33) : 0" @goods_buy_event="goods_buy_event"></componentDiyGoodsTabs>
+                                    <componentDiySearch v-if="item.key == 'search'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiySearch>
+                                    <componentDiyCarousel v-else-if="item.key == 'carousel'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data" @onVideoPlay="video_play"></componentDiyCarousel>
+                                    <componentDiyNavGroup v-else-if="item.key == 'nav-group'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyNavGroup>
+                                    <componentDiyUserInfo v-else-if="item.key == 'user-info'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyUserInfo>
+                                    <componentDiyNotice v-else-if="item.key == 'notice'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyNotice>
+                                    <componentDiyVideo v-else-if="item.key == 'video'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyVideo>
+                                    <componentDiyArticleList v-else-if="item.key == 'article-list'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyArticleList>
+                                    <componentDiyArticleTabs v-else-if="item.key == 'article-tabs'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data" :propTop="(!is_immersion_model ? temp_sticky_top : 0) + tabs_height" :propScrollTop="scroll_top" :propCustomNavHeight="!is_immersion_model && is_header_top ? (is_search_alone_row ? 66 + data_alone_row_space : 33) : 0"></componentDiyArticleTabs>
+                                    <componentDiyGoodsTabs v-else-if="item.key == 'goods-tabs'" :ref="'diy_goods_buy' + index" :propIndex="item.index" :propDiyIndex="index" :propKey="item.id" :propValue="item.com_data" :propTop="(!is_immersion_model ? temp_sticky_top : 0) + tabs_height" :propScrollTop="scroll_top" :propCustomNavHeight="!is_immersion_model && is_header_top ? (is_search_alone_row ? 66 + data_alone_row_space : 33) : 0" @goods_buy_event="goods_buy_event"></componentDiyGoodsTabs>
 
-                                    <componentDiyGoodsList v-else-if="item.key == 'goods-list'" :ref="'diy_goods_buy' + index" :propIndex="index" :propKey="item.id" :propValue="item.com_data" @goods_buy_event="goods_buy_event"></componentDiyGoodsList>
-                                    <componentDiyDataMagic v-else-if="item.key == 'data-magic'" :propKey="item.id" :propValue="item.com_data"></componentDiyDataMagic>
-                                    <componentDiyCustom v-else-if="item.key == 'custom'" :propKey="item.id" :propValue="item.com_data"></componentDiyCustom>
-                                    <componentDiyImgMagic v-else-if="item.key == 'img-magic'" :propKey="item.id" :propValue="item.com_data"></componentDiyImgMagic>
-                                    <componentDiyHotZone v-else-if="item.key == 'hot-zone'" :propKey="item.id" :propValue="item.com_data"></componentDiyHotZone>
-                                    <componentDiySeckill v-else-if="item.key == 'seckill'" :propKey="item.id" :propValue="item.com_data"></componentDiySeckill>
+                                    <componentDiyGoodsList v-else-if="item.key == 'goods-list'" :ref="'diy_goods_buy' + index" :propIndex="item.index" :propDiyIndex="index" :propKey="item.id" :propValue="item.com_data" @goods_buy_event="goods_buy_event"></componentDiyGoodsList>
+                                    <componentDiyDataMagic v-else-if="item.key == 'data-magic'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyDataMagic>
+                                    <componentDiyCustom v-else-if="item.key == 'custom'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyCustom>
+                                    <componentDiyImgMagic v-else-if="item.key == 'img-magic'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyImgMagic>
+                                    <componentDiyHotZone v-else-if="item.key == 'hot-zone'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyHotZone>
+                                    <componentDiySeckill v-else-if="item.key == 'seckill'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiySeckill>
                                     <!-- 插件 -->
-                                    <componentDiyCoupon v-else-if="item.key == 'coupon'" :propKey="item.id" :propValue="item.com_data"></componentDiyCoupon>
+                                    <componentDiyCoupon v-else-if="item.key == 'coupon'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyCoupon>
                                     <!-- 工具组件 -->
                                     <componentDiyFloatWindow v-else-if="item.key == 'float-window'" :propKey="item.id" :propValue="item.com_data"></componentDiyFloatWindow>
-                                    <componentDiyTitle v-else-if="item.key == 'title'" :propKey="item.id" :propValue="item.com_data"></componentDiyTitle>
-                                    <componentDiyAuxiliaryLine v-else-if="item.key == 'row-line'" :propKey="item.id" :propValue="item.com_data"></componentDiyAuxiliaryLine>
-                                    <componentDiyRichText v-else-if="item.key == 'rich-text'" :propKey="item.id" :propValue="item.com_data"></componentDiyRichText>
-                                    <componentDiyAuxiliaryBlank v-else-if="item.key == 'auxiliary-blank'" :propKey="item.id" :propValue="item.com_data"></componentDiyAuxiliaryBlank>
+                                    <componentDiyTitle v-else-if="item.key == 'title'" :propKey="item.id" :propIndex="item.index" :propValue="item.com_data"></componentDiyTitle>
+                                    <componentDiyAuxiliaryLine v-else-if="item.key == 'row-line'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyAuxiliaryLine>
+                                    <componentDiyRichText v-else-if="item.key == 'rich-text'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyRichText>
+                                    <componentDiyAuxiliaryBlank v-else-if="item.key == 'auxiliary-blank'" :propIndex="item.index" :propKey="item.id" :propValue="item.com_data"></componentDiyAuxiliaryBlank>
                                 </template>
                             </view>
                         </template>
@@ -141,7 +141,7 @@
                 default: '',
             },
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: 0,
             },
         },
@@ -278,34 +278,55 @@
 
             // 初始化
             init() {
+                let header = this.propValue.header;
+                let header_style = header.com_data.style;
+                let diy_data = JSON.parse(JSON.stringify(this.propValue.diy_data));
+                let new_diy_index = 0;
+                let new_diy_data = [];
+                diy_data.forEach((item) => {
+                    // 判断是否是商品列表
+                    if (item.com_name == 'float-window') {
+                        item.index = -1;
+                    } else {
+                        if (new_diy_index == 0) {
+                            // 判断是否开启沉浸模式和是否开启安全距离 如果为true则除了选项卡和选项卡轮播外， 第一个组件则加上安全距离样式的padding_top加上顶部导航的高度和安全距离的高度
+                            // if (header_style.immersive_style == '1' && header_style.general_safe_distance_value == '1') {
+                            if (header_style.immersive_style == '1') {
+                                let new_data = JSON.parse(JSON.stringify(item));
+                                // 顶部导航的高度
+                                let header_top_height = (header.com_data.content.data_alone_row_value.length > 0 ? parseInt(header.com_data.style.data_alone_row_space || 5) : 0) + 33 + (header.com_data.content.data_alone_row_value.length > 0 ? 33 : 0);
+                                new_data.com_data.style.common_style.padding_top = parseInt(new_data.com_data.style.common_style.padding_top) + header_top_height;
+                                item = new_data;
+                            }
+                        }
+                        item.index = new_diy_index;
+                        new_diy_data.push(item);
+                        new_diy_index++;
+                    }
+                });
                 // tabs选项卡数据过滤
                 this.setData({
-                    header_data: this.propValue.header,
+                    header_data: header,
                     footer_data: this.propValue.footer,
-                    diy_data: this.propValue.diy_data,
+                    diy_data: new_diy_data,
                     tabs_data: this.propValue.tabs_data,
-                    page_style: common_styles_computer(this.propValue.header.com_data.style.common_style),
-                    page_img_style: common_img_computer(this.propValue.header.com_data.style.common_style),
+                    page_style: common_styles_computer(header.com_data.style.common_style),
+                    page_img_style: common_img_computer(header.com_data.style.common_style),
                     // 判断顶部导航是否置顶
-                    is_header_top: parseInt(this.propValue.header.com_data.style.up_slide_display) == 1 ? true : false,
+                    is_header_top: parseInt(header.com_data.style.up_slide_display) == 1 ? true : false,
                     temp_sticky_top: this.sticky_top,
-                    temp_header_top: `calc(${this.sticky_top}px + 66rpx + ${parseInt(this.propValue.header.com_data.style.data_alone_row_space || 5) * 2}rpx + ${this.propValue.header.com_data.content.data_alone_row_value.length > 0 ? '66rpx' : '0rpx'});`,
-                    header_top: `calc(${this.sticky_top}px + 66rpx + ${parseInt(this.propValue.header.com_data.style.data_alone_row_space || 5) * 2}rpx + ${this.propValue.header.com_data.content.data_alone_row_value.length > 0 ? '66rpx' : '0rpx'});`,
-                    // temp_header_top: `calc(${this.sticky_top}px + 66rpx + 40rpx + 66rpx);`,
-                    // header_top: `calc(${this.sticky_top}px + 66rpx + 40rpx + 66rpx);`,
+                    temp_header_top: `calc(${this.sticky_top}px + 33px + ${parseInt(header.com_data.content.data_alone_row_value.length > 0 ? header.com_data.style.data_alone_row_space || 5 : 0) * 2}rpx + ${header.com_data.content.data_alone_row_value.length > 0 ? '33px' : '0rpx'});`,
+                    header_top: `calc(${this.sticky_top}px + 33px + ${parseInt(header.com_data.content.data_alone_row_value.length > 0 ? header.com_data.style.data_alone_row_space || 5 : 0) * 2}rpx + ${header.com_data.content.data_alone_row_value.length > 0 ? '33px' : '0rpx'});`,
                     // 顶部导航高度是否变化--------------------------------------------------
-                    is_search_alone_row: this.propValue.header.com_data.content.data_alone_row_value.length > 0 ? true : false,
-                    data_alone_row_space: parseInt(this.propValue.header.com_data.style.data_alone_row_space || 5),
-                    // is_search_alone_row: true,
-                    // data_alone_row_space: 20,
+                    is_search_alone_row: header.com_data.content.data_alone_row_value.length > 0 ? true : false,
+                    data_alone_row_space: parseInt(header.com_data.style.data_alone_row_space || 5),
                 });
                 var client_value = app.globalData.application_client_type();
                 var client_brand = app.globalData.application_client_brand();
                 if (client_value == 'h5' || client_brand == 'devtools') {
-                    
                 }
                 // 缓存数据
-                uni.setStorageSync(this.cache_key + this.tabs_home_id, this.propValue.diy_data);
+                uni.setStorageSync(this.cache_key + this.tabs_home_id, diy_data);
             },
             // 顶部导航沉浸模式回调
             immersion_model_call_back(bool) {
diff --git a/components/diy/goods-list.vue b/components/diy/goods-list.vue
index a3803116..7e4647b4 100644
--- a/components/diy/goods-list.vue
+++ b/components/diy/goods-list.vue
@@ -25,7 +25,7 @@
                             </block>
                             <view v-if="is_show('title') || is_show('simple_desc') || is_show('price') || is_show('original_price') || is_show('sales_count') || is_show('plugins_view_icon') || form.is_shop_show == '1'" class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
                                 <view class="flex-col gap-10 top-title">
-                                    <view v-if="is_show('title') || (['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc'))" class="flex-col" :style="{'gap': new_style.title_simple_desc_spacing * 2 + 'rpx'  }">
+                                    <view v-if="is_show('title') || (['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc'))" class="flex-col" :style="{ gap: new_style.title_simple_desc_spacing * 2 + 'rpx' }">
                                         <view v-if="is_show('title')" :class="text_line" :style="title_style">{{ item.title }}</view>
                                         <view v-if="['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc')" class="text-line-1" :style="simple_desc">{{ item.simple_desc }}</view>
                                     </view>
@@ -118,7 +118,7 @@
                                 </block>
                                 <view v-if="is_show('title') || is_show('simple_desc') || is_show('price') || is_show('plugins_view_icon') || is_show('original_price') || form.is_shop_show == '1'" class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
                                     <view class="flex-col gap-10 top-title">
-                                        <view v-if="is_show('title') || (['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc'))" class="flex-col" :style="{'gap': new_style.title_simple_desc_spacing * 2 + 'rpx'  }">
+                                        <view v-if="is_show('title') || (['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc'))" class="flex-col" :style="{ gap: new_style.title_simple_desc_spacing * 2 + 'rpx' }">
                                             <view v-if="is_show('title')" :class="text_line" :style="title_style">{{ item.title }}</view>
                                             <view v-if="['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc')" class="text-line-1" :style="simple_desc">{{ item.simple_desc }}</view>
                                         </view>
@@ -187,9 +187,14 @@
                 default: true,
             },
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: '',
             },
+            propDiyIndex: {
+                type: Number,
+                default: 0,
+            },
+            // 组件渲染的下标
             propIndex: {
                 type: Number,
                 default: 0,
@@ -246,7 +251,7 @@
             isEmpty,
             init() {
                 const new_form = this.propValue.content;
-                const new_style = this.propValue.style
+                const new_style = this.propValue.style;
                 let new_list = [];
                 // 指定商品并且指定商品数组不为空
                 if (!isEmpty(new_form.data_list) && new_form.data_type == '0') {
@@ -282,7 +287,7 @@
                     show_content: ['0', '1', '2'].includes(new_form.theme), // 显示除标题外的其他区域
                     text_line: this.get_text_line(new_form), // 超过多少行隐藏
                     style_container: this.propIsCommonStyle ? common_styles_computer(new_style.common_style) : '', // 公共样式
-                    style_img_container: this.propIsCommonStyle ? common_img_computer(new_style.common_style) : '', // 图片样式
+                    style_img_container: this.propIsCommonStyle ? common_img_computer(new_style.common_style, this.propIndex) : '', // 图片样式
                     // 内容样式设置
                     title_style: this.trends_config(new_style, 'title', 'title', new_form.theme),
                     price_style: this.trends_config(new_style, 'price'),
@@ -454,7 +459,7 @@
                     let is_success_tips = this.propIsCartParaCurve ? 0 : 1;
                     this.$emit(
                         'goods_buy_event',
-                        this.propIndex,
+                        this.propDiyIndex,
                         goods,
                         {
                             buy_event_type: 'cart',
diff --git a/components/diy/goods-tabs.vue b/components/diy/goods-tabs.vue
index f0569d98..440e2a56 100644
--- a/components/diy/goods-tabs.vue
+++ b/components/diy/goods-tabs.vue
@@ -3,7 +3,7 @@
         <view class="ou" :style="style_img_container">
             <componentDiyModulesTabsView :propValue="goods_tabs" :propIsTop="top_up == '1'" :propTop="propTop" :propStyle="tabs_style + 'padding-bottom:24rpx;'" :propCustomNavHeight="propCustomNavHeight * 2 + 'rpx'" :propTabsBackground="tabs_background" @onTabsTap="tabs_click_event"></componentDiyModulesTabsView>
             <view class="oh">
-                <componentGoodsList ref="diy_goods_list" :propKey="diy_key" :propIndex="propIndex" :propValue="goods_tabs" :propIsCommonStyle="false" @goods_buy_event="goods_buy_event"></componentGoodsList>
+                <componentGoodsList ref="diy_goods_list" :propKey="diy_key" :propIndex="propDiyIndex" :propValue="goods_tabs" :propIsCommonStyle="false" @goods_buy_event="goods_buy_event"></componentGoodsList>
             </view>
         </view>
     </view>
@@ -48,9 +48,14 @@
                 default: false,
             },
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: '',
             },
+            propDiyIndex: {
+                type: Number,
+                default: 0,
+            },
+            // 组件渲染的下标
             propIndex: {
                 type: Number,
                 default: 0,
@@ -156,7 +161,7 @@
                 this.setData({
                     goods_tabs: new_data,
                     style_container: common_styles_computer(common_style),
-                    style_img_container: common_img_computer(common_style),
+                    style_img_container: common_img_computer(common_style, this.propIndex),
                     tabs_style: new_tabs_style,
                 });
             },
diff --git a/components/diy/header.vue b/components/diy/header.vue
index cb650f3c..9d9ef840 100644
--- a/components/diy/header.vue
+++ b/components/diy/header.vue
@@ -10,7 +10,7 @@
                         <view class="model-top flex-1 mt-1">
                             <view class="roll pr z-i">
                                 <view class="model-head pr padding-left-main padding-right-main" style="box-sizing: border-box">
-                                    <view class="flex-col" :style="'gap:' + form.style.data_alone_row_space * 2 + 'rpx;'">
+                                    <view class="flex-col" :style="'gap:' + data_alone_row_space">
                                         <view class="model-head-content flex-row align-c jc-sb gap-16 wh-auto pr" :style="header_style">
                                             <view v-if="!is_tabbar_pages" class="z-i dis-inline-block margin-top-xs" @tap="top_nav_left_back_event">
                                                 <iconfont name="icon-arrow-left" size="40rpx" propContainerDisplay="flex" :color="form.style.left_back_btn_color || '#333'"></iconfont>
@@ -72,13 +72,13 @@
         </view>
         <block v-if="!is_immersion_model">
             <view v-if="!is_positon_realative" class="nav-seat" :style="top_content_style">
-                <view :style="'height:' + (is_search_alone_row || is_icon_alone_row ? 'calc(132rpx + ' + data_alone_row_space * 2 + 'rpx);' : '66rpx;')"></view>
+                <view :style="'height:' + (is_search_alone_row || is_icon_alone_row ? 'calc(132rpx + ' + data_alone_row_space + ');' : '66rpx;')"></view>
             </view>
         </block>
         <!-- #ifndef H5 || MP-TOUTIAO -->
         <view v-if="is_positon_realative" class="wh-auto pf top-0 left-0 right-0" :style="roll_style">
             <view :style="top_content_style">
-                <view :style="'height:' + (is_search_alone_row || is_icon_alone_row ? 'calc(132rpx + ' + data_alone_row_space * 2 + 'rpx);' : '66rpx;')"></view>
+                <view :style="'height:' + (is_search_alone_row || is_icon_alone_row ? 'calc(132rpx + ' + data_alone_row_space + ');' : '66rpx;')"></view>
             </view>
         </view>
         <!-- #endif -->
@@ -108,7 +108,7 @@
                 default: 0,
             },
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: '',
             },
         },
@@ -140,11 +140,9 @@
                 // 顶部背景样式类别
                 header_background_type: 'color_image',
                 // #ifdef MP
-                sticky_top: bar_height + 5,
                 header_top: bar_height + 5 + 12 + 33,
                 // #endif
                 // #ifdef H5 || MP-TOUTIAO
-                sticky_top: bar_height + 7 + 12,
                 header_top: bar_height + 7 + 12 + 33,
                 // #endif
                 // #ifdef APP
@@ -159,7 +157,7 @@
                 // 判断header的查询是否独行
                 is_search_alone_row: false,
                 is_icon_alone_row: false,
-                data_alone_row_space: 0,
+                data_alone_row_space: '0rpx',
             };
         },
         watch: {
@@ -227,7 +225,7 @@
                     header_style: menu_button_info,
                     header_background_type: header_background_type,
                     is_immersion_model: header_background_type !== 'color_image' && immersive_style == '1',
-                    data_alone_row_space: new_style.data_alone_row_space,
+                    data_alone_row_space: new_style.data_alone_row_space * 2 + 'rpx',
                     is_search_alone_row: new_content.data_alone_row_value && new_content.data_alone_row_value.includes('search'),
                     is_icon_alone_row: new_content.data_alone_row_value && new_content.data_alone_row_value.includes('icon'),
                 });
diff --git a/components/diy/hot-zone.vue b/components/diy/hot-zone.vue
index 4a3c7dc7..16bdac96 100644
--- a/components/diy/hot-zone.vue
+++ b/components/diy/hot-zone.vue
@@ -23,6 +23,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -62,7 +67,7 @@
                     img_height: new_content.hot.img_height || 1,
                     hot_data: new_content.hot.data || [],
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
             // 图片加载完成 获取宽高
diff --git a/components/diy/img-magic.vue b/components/diy/img-magic.vue
index a476e794..4ee38cb1 100644
--- a/components/diy/img-magic.vue
+++ b/components/diy/img-magic.vue
@@ -53,6 +53,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -116,7 +121,7 @@
                     img_outer_spacing: new_style.image_spacing * 2 + 'rpx',
                     content_img_radius: radius_computer(new_style),
                     style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;',
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                     img_fit: fit,
                 });
 
diff --git a/components/diy/nav-group.vue b/components/diy/nav-group.vue
index 1af52e18..19b109f1 100644
--- a/components/diy/nav-group.vue
+++ b/components/diy/nav-group.vue
@@ -49,6 +49,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -85,7 +90,7 @@
                     form: new_content,
                     new_style: new_style,
                     style_container: common_styles_computer(new_style.common_style), // 用于样式显示
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                     img_style: radius_computer(new_style), // 图片的设置
                     text_style: `font-size: ${new_style.title_size * 2 || 24}rpx; color: ${new_style.title_color || '#000'};`, // 标题的样式
                     indicator_style: this.get_indicator_style(new_style), // 指示器的样式
diff --git a/components/diy/notice.vue b/components/diy/notice.vue
index 500752be..8f561f8d 100644
--- a/components/diy/notice.vue
+++ b/components/diy/notice.vue
@@ -73,6 +73,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -155,7 +160,7 @@
                     direction_type: direction,
                     interval_list: new_interval_list,
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
             // 跳转链接
diff --git a/components/diy/rich-text.vue b/components/diy/rich-text.vue
index d991366d..3264df39 100644
--- a/components/diy/rich-text.vue
+++ b/components/diy/rich-text.vue
@@ -19,6 +19,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -44,7 +49,7 @@
                 this.setData({
                     content: new_content.html,
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
         },
diff --git a/components/diy/search.vue b/components/diy/search.vue
index e7b2e9f6..cfcc9e7a 100644
--- a/components/diy/search.vue
+++ b/components/diy/search.vue
@@ -63,6 +63,11 @@ export default {
             type: [String,Number],
             default: '',
         },
+        // 组件渲染的下标
+        propIndex: {
+            type: Number,
+            default: 1000000,
+        },
     },
     data() {
         return {
@@ -98,7 +103,7 @@ export default {
                 new_style: new_style,
                 style: this.get_style(new_style), // 内部样式
                 style_container: this.propIsPageSettings ? '' : common_styles_computer(common_style), // 全局样式
-                style_img_container: this.propIsPageSettings ? '' : common_img_computer(common_style),
+                style_img_container: this.propIsPageSettings ? '' : common_img_computer(common_style, this.propIndex),
                 search_button_radius: radius_computer(search_button_radius), // 按钮圆角
                 box_style: this.get_box_style(new_style, new_form), // 搜索框设置
                 search_box_style: `border: 1px solid ${new_style.search_border == '#fff' ? '#eee' : new_style.search_border};`,
diff --git a/components/diy/seckill.vue b/components/diy/seckill.vue
index 8f8f8488..5bbd852a 100644
--- a/components/diy/seckill.vue
+++ b/components/diy/seckill.vue
@@ -190,6 +190,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -296,7 +301,7 @@
                     seckill_head_style: this.get_seckill_head_style(new_style, '1'),
                     seckill_head_img_style: this.get_seckill_head_style(new_style, '2'),
                     style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;',
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                     content_outer_spacing: new_style.content_outer_spacing + 'px',
                     content_outer_spacing_magin: new_style.content_outer_spacing * 2 + 'rpx',
                     content_radius: radius_computer(new_style.shop_radius),
diff --git a/components/diy/title.vue b/components/diy/title.vue
index 90e6cf0b..9c77d11d 100644
--- a/components/diy/title.vue
+++ b/components/diy/title.vue
@@ -47,6 +47,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -113,7 +118,7 @@
                     title_style: `color:${title_color}; font-size: ${title_size * 2}rpx; ${common_styles}`,
                     subtitle_style: this.get_subtitle_style(), // 副标题样式设置
                     style_container: common_styles_computer(common_style), // 通用样式区
-                    style_img_container: common_img_computer(common_style),
+                    style_img_container: common_img_computer(common_style, this.propIndex),
                 });
             },
             // 副标题样式设置
diff --git a/components/diy/user-info.vue b/components/diy/user-info.vue
index 5acfbf53..0e54a1da 100644
--- a/components/diy/user-info.vue
+++ b/components/diy/user-info.vue
@@ -44,6 +44,11 @@
                 type: [String,Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -146,7 +151,7 @@
                     stats_name_style: 'color:' + temp_base_data.stats_name_color + ';' + 'font-size:' + temp_base_data.stats_name_size * 2 + 'rpx;' + 'font-weight:' + temp_base_data.stats_name_weight + ';',
                     stats_number_style: 'color:' + temp_base_data.stats_number_color + ';' + 'font-size:' + temp_base_data.stats_number_size * 2 + 'rpx;' + 'font-weight:' + temp_base_data.stats_number_weight + ';',
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
             // 跳转链接
diff --git a/components/diy/video.vue b/components/diy/video.vue
index b790353e..302e8805 100644
--- a/components/diy/video.vue
+++ b/components/diy/video.vue
@@ -18,9 +18,14 @@
                 default: () => ({}),
             },
             propKey: {
-                type: [String,Number],
+                type: [String, Number],
                 default: '',
             },
+            // 组件渲染的下标
+            propIndex: {
+                type: Number,
+                default: 1000000,
+            },
         },
         data() {
             return {
@@ -51,7 +56,7 @@
                     video_img: new_content.video_img.length > 0 ? new_content.video_img[0].url : '',
                     video: new_content.video.length > 0 ? new_content.video[0].url : '',
                     style_container: common_styles_computer(new_style.common_style),
-                    style_img_container: common_img_computer(new_style.common_style),
+                    style_img_container: common_img_computer(new_style.common_style, this.propIndex),
                 });
             },
             // 获取视频高度