liangxin/xdd-uniapp-new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat：体验项目详情

Browse Source
This commit is contained in:
linxi
2026-03-15 16:21:45 +08:00
parent 605cd4f054
commit ad70e3afed
4 changed files with 753 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pkg_product/views/sojoumStore.vue
+185 -17
View File
@@ -82,19 +82,22 @@
</view>
</view>
</view>
<view class="top-tab acea-row row-middle row-center">
<view
v-for="(item, index) in tabList"
:key="index"
:class="item.isShow ? '' : 'hide'"
class="tab"
@click="changeTab(item.value)"
>
<view :class="activeIndex === item.value ? 'active' : ''" class="tab-item">
{{ item.text }}
<view class="top-tab">
<scroll-view scroll-x class="tab-scroll" :show-scrollbar="false">
<view class="tab-list">
<view
v-for="(item, index) in tabList"
:key="index"
:class="item.isShow ? '' : 'hide'"
class="tab"
@click="changeTab(item.value)"
>
<view :class="activeIndex === item.value ? 'active' : ''" class="tab-item">
{{ item.text }}
</view>
</view>
</view>
<!-- <view v-show="activeIndex === index" class="btLine"></view> -->
</view>
</scroll-view>
</view>
<view>
<view
@@ -315,6 +318,35 @@
店主还没有上传内容哦~
</view>
</view>
<!-- 体验店 -->
<view v-if="activeIndex === 5" class="v12-pa-3" style="background: #F5F5F5;">
<view class="experience-list">
<view v-for="(item, index) in experienceStoreList" :key="index" class="experience-item" @click="goExperienceStoreDetail(item)">
<view class="img-box">
<image :src="item.cover" mode="aspectFill" class="cover-img"></image>
<view class="location-tag" v-if="item.cityName">
<u-icon :name="webUrl + '/home/icon-location.png'" size="18" color="#fff"></u-icon>
<text class="city-name">{{ item.cityName }}</text>
</view>
</view>
<view class="info-box">
<view class="v12-font-32 v12-font-bold t-one">{{ item.name }}</view>
<view class="v12-font-26 v12-dark1-text t-one">{{ item.intro }}</view>
<view class="bottom-row">
<view class="v12-font-20 v12-font-bold">
营业时间:{{ item.serviceTime }}~{{ item.serviceEndTime }}
</view>
<view class="btn-check">
查看
</view>
</view>
</view>
</view>
</view>
<view v-if="experienceStoreList.length === 0" class="tab-no-data">
店主还没有上传内容哦~
</view>
</view>
</view>
<!-- 分享 -->
<u-popup
@@ -353,7 +385,8 @@ import {
postTravelShare,
getJiaLouProductList,
getJiaLouStewardList,
getJiaLouNewsList
getJiaLouNewsList,
getExperienceStoreList
} from '@/api/qianxian'
import {getUrlParam} from '@/utils/common.js'
import imgBox from '@/components/imageTypeSet/imagebox.vue'
@@ -375,6 +408,7 @@ export default {
tabList: [
{ text: '团购', value: 3, isShow: true },
{ text: '管家', value: 4, isShow: true },
{ text: '体验店', value: 5, isShow: true },
{ text: '资讯', value: 0, isShow: true },
{ text: '文化', value: 1, isShow: true },
{ text: '资质', value: 2, isShow: true }
@@ -392,7 +426,9 @@ export default {
jiaLouProductArr: [],
// 管家列表
jiaLouStewardArr: [
]
],
// 体验店列表
experienceStoreList: []
}
},
onPageScroll(e) {
@@ -423,6 +459,9 @@ export default {
if (newVal === 4) {
this.getJiaLouStewardList()
}
if (newVal === 5) {
this.getExperienceStoreList()
}
}
}
},
@@ -443,7 +482,14 @@ export default {
videoEnd() {
this.swiperAutoplay = true;
},
// 跳转管家详情
goExperienceStoreDetail(item) {
const query = []
const id = item.merId || item.id || ''
query.push('experienceMerchantId=' + encodeURIComponent(id))
uni.navigateTo({
url: '/pkg_product/views/experienceProjectDetail?' + query.join('&')
})
},
goHousekeeperDetail(item) {
uni.navigateTo({
url: '/pkg_product/views/housekeeperDetail?id=' + item.id
@@ -467,6 +513,23 @@ export default {
uni.hideLoading()
})
},
getExperienceStoreList() {
uni.showLoading({
title: '加载中',
mask: true
})
const params = {
travelMerchantId: this.store.id,
// experienceStoreCategoryId: null // Optional if category filtering is needed
}
getExperienceStoreList(params).then(res => {
if (res.status === 200) {
this.experienceStoreList = res.data.records || []
}
}).finally(() => {
uni.hideLoading()
})
},
getJiaLouProductList() {
uni.showLoading({
title: '加载中',
@@ -855,7 +918,8 @@ export default {
align-items: center;
padding: 20rpx;
border-top: 1px solid #f1f1f1;
font-size: 16px;
font-size: 22rpxl;
font-weight: bold;
.time {
flex: 1;
color: #333;
@@ -1018,24 +1082,128 @@ export default {
color:#A6AAB3;
font-size:28rpx;
}
.experience-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.experience-item {
width: 335rpx;
background: #fff;
border-radius: 16rpx;
overflow: hidden;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.05);
.img-box {
position: relative;
width: 100%;
height: 335rpx;
.cover-img {
width: 100%;
height: 100%;
}
.location-tag {
position: absolute;
bottom: 10rpx;
left: 10rpx;
display: flex;
align-items: center;
// background: rgba(0,0,0,0.5);
// padding: 4rpx 10rpx;
// border-radius: 20rpx;
.city-name {
color: #fff;
font-size: 20rpx;
margin-left: 4rpx;
}
}
}
.info-box {
padding: 16rpx;
.name {
font-size: 28rpx;
font-weight: bold;
color: #333;
margin-bottom: 8rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.intro {
font-size: 22rpx;
color: #999;
margin-bottom: 16rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.bottom-row {
display: flex;
justify-content: space-between;
align-items: center;
.time {
font-size: 20rpx;
color: #666;
}
.btn-check {
background: #C52733;
color: #fff;
font-size: 24rpx;
padding: 4rpx 16rpx;
border-radius: 20rpx;
}
}
}
}
}
.top-tab {
padding-bottom: 30rpx;
padding-top: 30rpx;
background: #fff;
.tab-scroll {
width: 100%;
white-space: nowrap;
.tab-list {
display: inline-flex;
padding: 0 30rpx;
}
}
.tab {
display: inline-block;
width: fit-content;
margin-right: 20rpx;
&:last-child {
margin-right: 0;
}
.tab-item {
height: 52rpx;
padding: 0 30rpx;
border-radius: 26rpx 0 0 26rpx;
border-radius: 26rpx;
font-size: 32rpx;
line-height: 52rpx;
font-weight: bold;
&.active {
color: #fff;
background: linear-gradient(90deg, #C52733 0%, rgba(211,92,101,0.91) 54%, rgba(255,255,255,0.62) 100%);
}
}
&.hide {
display: none;
}