Skip to content

飞
飞鹤小程序
Commit 7a31a967 authored by 王炽's avatar 王炽
Browse files
Options

555555

parent cb0bbb35
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 328 additions and 413 deletions
pages/xingmaLab/xingmaLab.less
View file @ 7a31a967
This diff is collapsed.
pages/xingmaLab/xingmaLab.vue
View file @ 7a31a967
...@@ -11,37 +11,9 @@ ...@@ -11,37 +11,9 @@
<view class="nav-right"></view> <view class="nav-right"></view>
</view> </view>
<!-- Tab切换区域 -->
<view class="tab-container">
<view
class="tab-item"
:class="{ active: activeTab === 'cangguang' }"
@click="switchTab('cangguang')"
>
<image
class="tab-icon"
:src="activeTab === 'cangguang' ? '../../static/xingmaLab/1001/tab_cangguang.png' : '../../static/xingmaLab/1001/tab_cangguang.png'"
mode="aspectFit"
/>
<text class="tab-text">藏馆</text>
</view>
<view
class="tab-item"
:class="{ active: activeTab === 'wodecangguan' }"
@click="switchTab('wodecangguan')"
>
<image
class="tab-icon"
:src="activeTab === 'wodecangguan' ? '../../static/xingmaLab/1001/tab_wodecangguan.png' : '../../static/xingmaLab/1001/tab_wodecangguan.png'"
mode="aspectFit"
/>
<text class="tab-text">我的藏馆</text>
</view>
</view>
<!-- 第二层：内容区域 --> <!-- 第二层：内容区域 -->
<view class="content-area"> <view class="content-area">
<!-- 藏馆tab内容 - 单列瀑布流 --> <!-- 藏馆内容 - 单列瀑布流 -->
<view v-if="activeTab === 'cangguang'" class="cangguang-content"> <view v-if="activeTab === 'cangguang'" class="cangguang-content">
<view class="waterfall-list single-column"> <view class="waterfall-list single-column">
<view <view
...@@ -71,7 +43,7 @@ ...@@ -71,7 +43,7 @@
</view> </view>
</view> </view>
<!-- 我的藏馆tab内容 - 双切页两列瀑布流 --> <!-- 我的藏馆内容 - 双切页两列瀑布流 -->
<view v-if="activeTab === 'wodecangguan'" class="wodecangguan-content"> <view v-if="activeTab === 'wodecangguan'" class="wodecangguan-content">
<!-- 切页tab --> <!-- 切页tab -->
<view class="sub-tab-container"> <view class="sub-tab-container">
...@@ -91,11 +63,11 @@ ...@@ -91,11 +63,11 @@
</view> </view>
</view> </view>
<!-- 我的藏品列表 --> <!-- 我的藏品列表 - 使用与藏馆相同的数据 -->
<view v-if="activeSubTab === 'collections'" class="sub-tab-content"> <view v-if="activeSubTab === 'collections'" class="sub-tab-content">
<view class="waterfall-list two-column"> <view class="waterfall-list two-column">
<view <view
v-for="(item, index) in collectionsList" v-for="(item, index) in cangguangList"
:key="index" :key="index"
class="waterfall-item" class="waterfall-item"
@click="handleItemClick(item)" @click="handleItemClick(item)"
...@@ -146,17 +118,22 @@ ...@@ -146,17 +118,22 @@
<!-- 底部导航 --> <!-- 底部导航 -->
<view class="bottom-navigation"> <view class="bottom-navigation">
<view class="bottom-nav-item"> <view class="bottom-nav-item1" :class="{ active: activeTab === 'cangguang' }" @click="handleBottomNavClick('cangguang')">
<image class="bottom-nav-icon" src="../../static/xingmaLab/1001/tab_cangguang.png" mode="aspectFit" /> <image
<text class="bottom-nav-text">星妈会藏馆</text> class="bottom-nav-icon1"
:src="activeTab === 'cangguang' ? '../../static/xingmaLab/1001/tab_cangguang_selected.png' : '../../static/xingmaLab/1001/tab_cangguang_normal.png'"
mode="aspectFit"
/>
</view> </view>
<view class="bottom-nav-item publish"> <view class="bottom-nav-item2">
<image class="publish-icon" src="../../static/xingmaLab/1001/tab_fabu.png" mode="aspectFit" /> <image class="publish-icon" src="../../static/xingmaLab/1001/tab_fabu.png" @click="handleBottomNavFabu" mode="aspectFit" />
<text class="publish-text">发布</text>
</view> </view>
<view class="bottom-nav-item active"> <view class="bottom-nav-item3" :class="{ active: activeTab === 'wodecangguan' }" @click="handleBottomNavClick('wodecangguan')">
<image class="bottom-nav-icon" src="../../static/xingmaLab/1001/tab_wodecangguan.png" mode="aspectFit" /> <image
<text class="bottom-nav-text">我的藏品</text> class="bottom-nav-icon3"
:src="activeTab === 'wodecangguan' ? '../../static/xingmaLab/1001/tab_wodecangguan_selected.png' : '../../static/xingmaLab/1001/tab_wodecangguan_normal.png'"
mode="aspectFit"
/>
</view> </view>
</view> </view>
</view> </view>
...@@ -174,57 +151,29 @@ defineOptions({ ...@@ -174,57 +151,29 @@ defineOptions({
const activeTab = ref('cangguang') const activeTab = ref('cangguang')
const activeSubTab = ref('collections') const activeSubTab = ref('collections')
// 藏馆列表数据 // 藏馆列表数据 - 统一的数据源
const cangguangList = ref([ const cangguangList = ref([
{ {
image: '../../static/xingmaLab/1001/placeholder1.jpg', // image: '../../static/xingmaLab/1001/placeholder1.jpg',
title: '宝宝是否发育迟缓',
id: 'No.123456789',
creator: '鹤小飞'
},
{
image: '../../static/xingmaLab/1001/placeholder2.jpg',
title: '萌宝来袭,欢乐加倍',
id: 'No.123456789',
creator: '鹤小飞'
},
{
image: '../../static/xingmaLab/1001/placeholder3.jpg',
title: '宝宝能量补给站!',
id: 'No.123456789',
creator: '鹤小飞'
},
{
image: '../../static/xingmaLab/1001/placeholder4.jpg',
title: '快来用星妈会小程序',
id: 'No.123456789',
creator: '鹤小飞'
}
])
// 我的藏品列表数据
const collectionsList = ref([
{
image: '../../static/xingmaLab/1001/placeholder1.jpg',
title: '宝宝是否发育迟缓', title: '宝宝是否发育迟缓',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞', creator: '鹤小飞',
badge: '精选推荐' badge: '精选推荐'
}, },
{ {
image: '../../static/xingmaLab/1001/placeholder2.jpg', // image: '../../static/xingmaLab/1001/placeholder2.jpg',
title: '萌宝来袭,欢乐加倍', title: '萌宝来袭,欢乐加倍',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞' creator: '鹤小飞'
}, },
{ {
image: '../../static/xingmaLab/1001/placeholder3.jpg', // image: '../../static/xingmaLab/1001/placeholder3.jpg',
title: '宝宝能量补给站!', title: '宝宝能量补给站!',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞' creator: '鹤小飞'
}, },
{ {
image: '../../static/xingmaLab/1001/placeholder4.jpg', // image: '../../static/xingmaLab/1001/placeholder4.jpg',
title: '快来用星妈会小程序', title: '快来用星妈会小程序',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞' creator: '鹤小飞'
...@@ -234,19 +183,19 @@ const collectionsList = ref([ ...@@ -234,19 +183,19 @@ const collectionsList = ref([
// 我的收藏列表数据 // 我的收藏列表数据
const favoritesList = ref([ const favoritesList = ref([
{ {
image: '../../static/xingmaLab/1001/placeholder1.jpg', // image: '../../static/xingmaLab/1001/placeholder1.jpg',
title: '宝宝是否发育迟缓', title: '宝宝是否发育迟缓',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞' creator: '鹤小飞'
}, },
{ {
image: '../../static/xingmaLab/1001/placeholder2.jpg', // image: '../../static/xingmaLab/1001/placeholder2.jpg',
title: '萌宝来袭,欢乐加倍', title: '萌宝来袭,欢乐加倍',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞' creator: '鹤小飞'
}, },
{ {
image: '../../static/xingmaLab/1001/placeholder3.jpg', // image: '../../static/xingmaLab/1001/placeholder3.jpg',
title: '宝宝能量补给站!', title: '宝宝能量补给站!',
id: 'No.123456789', id: 'No.123456789',
creator: '鹤小飞' creator: '鹤小飞'
...@@ -261,7 +210,10 @@ const favoritesList = ref([ ...@@ -261,7 +210,10 @@ const favoritesList = ref([
// 方法 // 方法
const handleBack = () => { const handleBack = () => {
uni.navigateBack() jump({
type: JumpType.INNER,
url: "/pages/index/index"
})
} }
const switchTab = (tab) => { const switchTab = (tab) => {
...@@ -275,6 +227,22 @@ const switchSubTab = (subTab) => { ...@@ -275,6 +227,22 @@ const switchSubTab = (subTab) => {
activeSubTab.value = subTab activeSubTab.value = subTab
} }
const handleBottomNavFabu = () => {
console.log('点击了发布')
}
// 底部导航点击处理
const handleBottomNavClick = (navType) => {
if (navType === 'cangguang') {
// 点击"星妈会藏馆"时，切换到藏馆tab，展示单列列表
activeTab.value = 'cangguang'
} else if (navType === 'wodecangguan') {
// 点击"我的藏品"时，切换到我的藏馆tab，默认展示我的藏品
activeTab.value = 'wodecangguan'
activeSubTab.value = 'collections'
}
}
const handleItemClick = (item) => { const handleItemClick = (item) => {
console.log('点击了项目:', item) console.log('点击了项目:', item)
// 这里可以添加跳转逻辑 // 这里可以添加跳转逻辑
......
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