增加销冠的素材,调整左右侧边距
This commit is contained in:
@@ -22,32 +22,40 @@
|
||||
</view>
|
||||
|
||||
<!-- 标签页 -->
|
||||
<view class="tabs">
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'survey' }"
|
||||
@click="switchTab('survey')">
|
||||
<text>摸底</text>
|
||||
<scroll-view class="tabs-scroll" scroll-x="true" show-scrollbar="false">
|
||||
<view class="tabs">
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'survey' }"
|
||||
@click="switchTab('survey')">
|
||||
<text>摸底</text>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'practice' }"
|
||||
@click="switchTab('practice')">
|
||||
<text>陪练</text>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'battle' }"
|
||||
@click="switchTab('battle')">
|
||||
<text>实战</text>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'quality' }"
|
||||
@click="switchTab('quality')">
|
||||
<text>质检</text>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'material' }"
|
||||
@click="switchTab('material')">
|
||||
<text>素材</text>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'practice' }"
|
||||
@click="switchTab('practice')">
|
||||
<text>陪练</text>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'battle' }"
|
||||
@click="switchTab('battle')">
|
||||
<text>实战</text>
|
||||
</view>
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{ active: activeTab === 'quality' }"
|
||||
@click="switchTab('quality')">
|
||||
<text>质检</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 摸底内容 -->
|
||||
<scroll-view
|
||||
@@ -92,6 +100,17 @@
|
||||
<text class="champion-desc">这里是质检相关的内容展示区域</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 素材内容 -->
|
||||
<scroll-view
|
||||
class="tab-content"
|
||||
scroll-y
|
||||
v-if="activeTab === 'material'">
|
||||
<view class="champion-card">
|
||||
<text class="champion-title">素材</text>
|
||||
<text class="champion-desc">这里是素材相关的内容展示区域</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -141,7 +160,7 @@
|
||||
/* AI功能横幅 */
|
||||
.ai-banner {
|
||||
background-color: #E3F2FD;
|
||||
padding: 24rpx 32rpx;
|
||||
padding: 24rpx 16rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@@ -154,16 +173,22 @@
|
||||
}
|
||||
|
||||
/* 标签页 */
|
||||
.tabs {
|
||||
display: flex;
|
||||
.tabs-scroll {
|
||||
width: 100%;
|
||||
background-color: #FFFFFF;
|
||||
border-bottom: 1px solid #E0E0E0;
|
||||
padding: 0 32rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: inline-flex;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
padding: 24rpx 32rpx;
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.tab-item text {
|
||||
@@ -191,10 +216,13 @@
|
||||
.tab-content {
|
||||
height: calc(100vh - 300rpx);
|
||||
background-color: #F5F5F5;
|
||||
padding: 24rpx 32rpx;
|
||||
padding: 24rpx 16rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.champion-card {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
padding: 32rpx;
|
||||
|
||||
Reference in New Issue
Block a user