Skip to content

飞
飞鹤小程序
Commit 8c075670 authored by spc's avatar spc
Browse files
Options

Merge branch 'xingmaLab20250820' of http://gitlab2.dui88.com/fh/20250528_FHQ1... 

Merge branch 'xingmaLab20250820' of http://gitlab2.dui88.com/fh/20250528_FHQ1 into xingmaLab20250820
parents a6a13af2 3abdf8d1
Hide whitespace changes
Inline Side-by-side
Showing with 48 additions and 162 deletions
pages/xingmaLab/xingmaLab.less
View file @ 8c075670
// 星妈Lab页面样式 // 星妈Lab页面样式
.xingma-lab-container { .xingma-lab-container {
min-height: 100vh; // min-height: 100vh;
background-color: #fff; background-color: #fff;
position: relative; position: relative;
padding-bottom: 200rpx; // 为底部导航留出空间 padding-bottom: 200rpx; // 为底部导航留出空间
overflow: visible;
// height: 100vh;
// 第一层：顶部导航 // 第一层：顶部导航
.top-navigation { .top-navigation {
...@@ -15,6 +18,7 @@ ...@@ -15,6 +18,7 @@
position: sticky; position: sticky;
z-index: 100; z-index: 100;
top: 0; top: 0;
overflow: visible;
.nav-left { .nav-left {
width: 60rpx; width: 60rpx;
...@@ -49,14 +53,16 @@ ...@@ -49,14 +53,16 @@
// 第二层：内容区域 // 第二层：内容区域
.content-area { .content-area {
height:100%; height: 78vh;
overflow: visible;
// flex: 1; // flex: 1;
// padding: 20rpx;
// 藏馆内容 - 单列瀑布流 // 藏馆内容 - 单列瀑布流
.cangguang-content { .cangguang-content {
position: relative; position: relative;
height:1624rpx; height: 78vh;
// overflow: auto;
// height:1624rpx;
.banner_content{ .banner_content{
margin-top: 20rpx; margin-top: 20rpx;
margin-left: 22.5rpx; margin-left: 22.5rpx;
...@@ -193,6 +199,9 @@ ...@@ -193,6 +199,9 @@
// 我的藏馆内容 // 我的藏馆内容
.wodecangguan-content { .wodecangguan-content {
overflow: visible;
height: 77.8vh;
width: 100%;
.sub-tab-container { .sub-tab-container {
display: flex; display: flex;
background-color: #ffffff; background-color: #ffffff;
...@@ -225,16 +234,22 @@ ...@@ -225,16 +234,22 @@
} }
} }
.sub-tab-content { .wodecangpin-content {
padding-left:12rpx; padding-left:12rpx;
height: 72vh;
width: 100%;
overflow: visible;
.waterfall-list1 { .waterfall-list1 {
position: absolute; position: absolute;
display: grid; // display: grid;
// flex-wrap: wrap; // flex-wrap: wrap;
// grid-template-columns: 1fr 1fr; // grid-template-columns: 1fr 1fr;
gap: 12rpx; gap: 12rpx;
// height: 1624rpx;
// padding: 0 12rpx; // padding: 0 12rpx;
width:360rpx;
height: 72vh;
width:100%;
.waterfall-item { .waterfall-item {
background-color: #ffffff; background-color: #ffffff;
...@@ -267,7 +282,7 @@ ...@@ -267,7 +282,7 @@
width: 212rpx; width: 212rpx;
height: 44rpx; height: 44rpx;
border-radius: 0rpx 12rpx 0rpx 0rpx; border-radius: 0rpx 12rpx 0rpx 0rpx;
bottom: 10rpx; bottom: 8rpx;
left: 0; left: 0;
.badge-num { .badge-num {
position: absolute; position: absolute;
...@@ -345,122 +360,6 @@ ...@@ -345,122 +360,6 @@
} }
.waterfall-list2 {
display: grid;
// flex-wrap: wrap;
// grid-template-columns: 1fr 1fr;
gap: 12rpx;
// padding: 0 12rpx;
width:360rpx;
margin-left: 372rpx;
.waterfall-item {
background-color: #ffffff;
// border-radius: 16rpx;
overflow: hidden;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
position: relative;
width: 360rpx;
height: auto;
transition: transform 0.3s ease, box-shadow 0.3s ease;
// &:active {
// transform: scale(0.98);
// box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.15);
// }
.item-up-content{
position: relative;
width: 100%;
height: auto;
.item-image {
width: 100%;
height: auto;
background-color: #f0f0f0;
}
.item-num {
position: absolute;
background-color: #fde0a5;
width: 212rpx;
height: 44rpx;
border-radius: 0rpx 12rpx 0rpx 0rpx;
bottom: 10rpx;
left: 0;
.badge-num {
position: absolute;
color: #b27c1e;
font-size: 24rpx;
width: 100%;
text-align: center;
top: 50%;
transform: translateY(-50%);
line-height: 1;
}
}
.item-badge {
position: absolute;
background-color: #d3a358;
width: 114rpx;
height: 48rpx;
border-radius: 12rpx 0rpx;
top: 0;
left: 0;
.badge-text {
position: absolute;
color: #ffffff;
font-size: 24rpx;
left: 10rpx;
top: 8rpx;
}
}
}
.item-info {
padding: 16rpx;
.item-title {
font-size: 28rpx;
font-weight: bold;
color: #333333;
line-height: 1.4;
margin-bottom: 12rpx;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.item-meta {
display: flex;
justify-content: space-between;
align-items: center;
.creator-info {
display: flex;
align-items: center;
gap: 6rpx;
.creator-name {
font-size: 22rpx;
color: #666666;
}
.star-icon {
font-size: 18rpx;
color: #ffd700;
}
}
}
}
}
}
} }
} }
} }
......
pages/xingmaLab/xingmaLab.vue
View file @ 8c075670
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<!-- 第二层：内容区域 --> <!-- 第二层：内容区域 -->
<view class="content-area"> <view class="content-area">
<!-- 藏馆内容 - 单列瀑布流 --> <!-- 藏馆内容 - 单列瀑布流 -->
<scroll-view v-if="activeTab === 'cangguang'" class="cangguang-content" scroll-y="true" @scrolltolower="handleScroll"> <scroll-view v-if="activeTab === 'cangguang'" scroll-y="true" class="cangguang-content" @scrolltolower="handleScroll">
<view class="banner_content"> <view class="banner_content">
<image class="banner_img" src="../../static/xingmaLab/1001/bannerImg0.png" mode="aspectFill" /> <image class="banner_img" src="../../static/xingmaLab/1001/bannerImg0.png" mode="aspectFill" />
</view> </view>
...@@ -70,10 +70,14 @@ ...@@ -70,10 +70,14 @@
</view> </view>
<!-- 我的藏品列表 - 使用与藏馆相同的数据 --> <!-- 我的藏品列表 - 使用与藏馆相同的数据 -->
<view v-if="activeSubTab === 'collections'" class="sub-tab-content"> <view v-if="activeSubTab === 'collections'" class="wodecangpin-content">
<view class="waterfall-list1"> <scroll-view
class="waterfall-list1"
scroll-y="true"
@scrolltolower="handleScrollToLower"
>
<view <view
v-for="(item, index) in shoucangList[0]" v-for="(item, index) in shoucangList"
:key="index" :key="index"
class="waterfall-item" class="waterfall-item"
@click="handleItemClick(item)" @click="handleItemClick(item)"
...@@ -98,39 +102,12 @@ ...@@ -98,39 +102,12 @@
</view> </view>
</view> </view>
</view> </view>
</view> </scroll-view>
<view class="waterfall-list2">
<view
v-for="(item, index) in shoucangList[1]"
:key="index"
class="waterfall-item"
@click="handleItemClick(item)"
>
<view class="item-up-content">
<image class="item-image" :src="item.imgUrl" mode="widthFix" />
<view class="item-num">
<text class="badge-num">NO.{{ item.bizNo }}</text>
</view>
<view v-if="item.badge" class="item-badge">
<text class="badge-text">精选推荐</text>
</view>
</view>
<view class="item-info">
<text class="item-title">{{ item.content }}</text>
<view class="item-meta">
<view class="creator-info">
<text class="creator-name">{{ item.nickname }}</text>
<text class="star-icon">⭐</text>
</view>
</view>
</view>
</view>
</view>
</view> </view>
<!-- 我的收藏列表 --> <!-- 我的收藏列表 -->
<view v-if="activeSubTab === 'favorites'" class="sub-tab-content"> <!-- <view v-if="activeSubTab === 'favorites'" class="sub-tab-content">
<view class="waterfall-list"> <view class="waterfall-list">
<view <view
v-for="(item, index) in favoritesList" v-for="(item, index) in favoritesList"
...@@ -151,7 +128,7 @@ ...@@ -151,7 +128,7 @@
</view> </view>
</view> </view>
</view> </view>
</view> </view> -->
</view> </view>
</view> </view>
...@@ -175,7 +152,7 @@ ...@@ -175,7 +152,7 @@
/> />
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
...@@ -205,7 +182,17 @@ const shoucangList = ref([]); ...@@ -205,7 +182,17 @@ const shoucangList = ref([]);
const handleScroll = (e) => { const handleScroll = (e) => {
console.log('以移动到底部'); console.log('以移动到底部');
cangguangList.value = cangguangList.value.concat(data.data.list); // cangguangList.value = cangguangList.value.concat(data.data.list);
cangguangList.value = data.data.list.concat(data.data.list);
}
const handleScroll1 = (e) => {
console.log('e.scrollTop=',e);
}
const handleScrollToLower = () => {
console.log('已到底部');
} }
onMounted(async () => { onMounted(async () => {
...@@ -222,7 +209,7 @@ onMounted(async () => { ...@@ -222,7 +209,7 @@ onMounted(async () => {
cangguangList.value = data.data.list; cangguangList.value = data.data.list;
shoucangList.value = convertDobuleList(data.data.list); shoucangList.value = cangguangList.value;//convertDobuleList(data.data.list);
}) })
const convertDobuleList = (list) => { const convertDobuleList = (list) => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment