fixbug: 修改页面改造bug

pages/active/limited-time/limited-time.vue

@@ -20,26 +20,21 @@
 
         <view class="tab-view">
             <!-- 限时秒杀卡片 -->
-             <view class="tab-card">
-                <view 
-                    class="tab-item" 
-                    :class="{ active: activeTab === index }" 
-                    @click="onActiveTabChange(index)"
-                    v-for="(item, index) in activeTabList" 
-                    :key="index"
-                >
+            <view class="tab-card">
+                <view class="tab-item" :class="{ active: activeTab === index }" @click="onActiveTabChange(index)"
+                    v-for="(item, index) in activeTabList" :key="index">
                     <text class="tab-text">{{ item.name }}</text>
                 </view>
             </view>
             <!-- 限时秒杀标签 -->
-             <view class="tab-list-container">
-            <view class="tab-list" @click="onTab(index)" v-for="(item, index) in tabList" :key="index">
-                <text class="text-28 text-space" :style="{
-                    color: curTab == index ? '#7A35F6' : '#666',
-                }">{{ item.name }}</text>
-                <!-- <view class="line" v-if="curTab == index"></view> -->
+            <view class="tab-list-container">
+                <view class="tab-list" @click="onTab(index)" v-for="(item, index) in tabList" :key="index">
+                    <text class="text-28 text-space" :style="{
+                        color: curTab == index ? '#7A35F6' : '#666',
+                    }">{{ item.name }}</text>
+                    <!-- <view class="line" v-if="curTab == index"></view> -->
+                </view>
             </view>
-             </view>
         </view>
 
         <view class="setting-view">
@@ -135,10 +130,10 @@ export default {
             url().then((res) => {
                 if (res.bizcode === 100) {
                     this.activityId = res.data.activityId;
-                    console.log('获取秒杀当前时间',res.data);
-                    
-                    this.attributes ={
-                       leftTime:  res.data.leftTime || null,
+                    console.log('获取秒杀当前时间', res.data);
+
+                    this.attributes = {
+                        leftTime: res.data.leftTime || null,
                     }
                     this.$nextTick(() => {
                         this.mescroll && this.mescroll.resetUpScroll();
@@ -210,10 +205,10 @@ export default {
                 this.activeTab = index;
                 this.dataList = [];
                 const item = this.activeTabList[index];
-                 this.onGetSeckillCurrent(item.type);
+                this.onGetSeckillCurrent(item.type);
             }
         },
-       
+
         init() {
             this.onGetSeckillCurrent();
             this.cascadeCategory();
@@ -223,7 +218,7 @@ export default {
                 delta: 1, // 返回的页面数，默认为1,返回到上一级
             });
         },
-           onSwiper(index) {
+        onSwiper(index) {
             uni.previewImage({
                 current: index,
                 loop: true,
@@ -257,7 +252,7 @@ export default {
 
                 .u-swiper__wrapper__item__wrapper__image {
                     height: 600rpx !important;
-        border-radius: 0 !important;
+                    border-radius: 0 !important;
                 }
             }
         }
@@ -330,13 +325,14 @@ export default {
 }
 
 .tab-card {
-    width: 100%;
+    width: calc(100% - 64rpx);
     height: 74rpx;
     display: flex;
     align-items: center;
     background-color: #f5f5f5;
     border-radius: 12rpx;
     padding: 0 4rpx;
+    margin: 0 32rpx;
     margin-bottom: 16rpx;
 
     .tab-item {
@@ -372,20 +368,24 @@ export default {
     width: 100%;
     display: flex;
     flex-direction: column;
-    padding: 24rpx 32rpx 0;
+    padding: 24rpx 0 0;
     box-sizing: border-box;
-    background-color: #fff;;
+    background-color: #fff;
+    ;
     overflow-x: auto;
     position: absolute;
     top: 520rpx;
     left: 0;
-.tab-list-container{
-    width: 100%;
-    height: 60rpx;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-}
+
+    .tab-list-container {
+        width: 100%;
+        height: 60rpx;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        overflow-x: auto;
+    }
+
     .tab-list {
         margin-right: 24rpx;
         display: flex;