jiazhipeng
4 months ago
8 changed files with 109 additions and 534 deletions
@ -0,0 +1,100 @@ |
|||||
|
<template> |
||||
|
<view class="custom-tab-bar"> |
||||
|
<view class="tab-item" v-for="(item,i) in tabBarList" :key="i" @click="switchTab(i)"> |
||||
|
<text :style="{ 'color': currentTab === i?item.selectColor:'#fff' }">{{ item.text }}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
props: { |
||||
|
currentTab: { |
||||
|
type: Number, |
||||
|
default: 0 |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
tabBarList: [ |
||||
|
{ |
||||
|
"pagePath": "pages/map/map", |
||||
|
"selectColor": "#00FF00", |
||||
|
"text": "首页" |
||||
|
}, |
||||
|
{ |
||||
|
"pagePath": "pages/coupon/coupon", |
||||
|
"selectColor": "#00FF00", |
||||
|
"text": "阅读体" |
||||
|
}, |
||||
|
{ |
||||
|
"pagePath": "pages/index/index", |
||||
|
"selectColor": "#00FF00", |
||||
|
"text": "有感商店" |
||||
|
}, |
||||
|
{ |
||||
|
"pagePath": "pages/cart/cart", |
||||
|
"selectColor": "#00FF00", |
||||
|
"text": "智能体" |
||||
|
}, |
||||
|
{ |
||||
|
"pagePath": "pages/user/user", |
||||
|
"selectColor": "#00FF00", |
||||
|
"text": "iSoul" |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
}; |
||||
|
}, |
||||
|
onLoad() { |
||||
|
this.getCurrentTab(); |
||||
|
}, |
||||
|
methods: { |
||||
|
getCurrentTab() { |
||||
|
const pages = getCurrentPages(); |
||||
|
const currentPage = pages[pages.length - 1]; |
||||
|
const currentPath = currentPage.route; |
||||
|
tabBarList.forEach((item, index) => { |
||||
|
if (item.pagePath === currentPath) { |
||||
|
this.currentTab = index; |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
switchTab(index) { |
||||
|
if (this.currentTab === index) return; |
||||
|
uni.switchTab({ |
||||
|
url: '/' + tabBarList[index].pagePath |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.custom-tab-bar { |
||||
|
position: fixed; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
display: flex; |
||||
|
justify-content: space-around; |
||||
|
align-items: center; |
||||
|
height: 123rpx; |
||||
|
z-index: 30; |
||||
|
background: #989898; |
||||
|
} |
||||
|
|
||||
|
.tab-item { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
flex: 1; |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.tab-item text { |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -1,58 +0,0 @@ |
|||||
<template> |
|
||||
<view> |
|
||||
<view class="searchBox flex-between"> |
|
||||
<view class="inputBox"> |
|
||||
<img src="https://static.ticket.sz-trip.com/taihu/images/scenic/searchGray.png" alt=""> |
|
||||
<view> |
|
||||
搜索你想要的产品 |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="btn"> |
|
||||
搜索 |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
</script> |
|
||||
|
|
||||
<style scoped lang="scss"> |
|
||||
.searchBox{ |
|
||||
width: 697rpx; |
|
||||
height: 67rpx; |
|
||||
background: rgba(242, 242, 242, .7); |
|
||||
border-radius: 33rpx; |
|
||||
margin: auto; |
|
||||
padding: 0 7rpx 0 29rpx; |
|
||||
box-sizing: border-box; |
|
||||
|
|
||||
.inputBox{ |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
font-size: 31rpx; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: 400; |
|
||||
color: #999999; |
|
||||
|
|
||||
img{ |
|
||||
width: 28rpx; |
|
||||
height: 30rpx; |
|
||||
margin-right: 19rpx; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn{ |
|
||||
width: 107rpx; |
|
||||
height: 53rpx; |
|
||||
background: #00D7ED; |
|
||||
border-radius: 27rpx; |
|
||||
text-align: center; |
|
||||
line-height: 53rpx; |
|
||||
font-size: 28rpx; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: 400; |
|
||||
color: #FFFFFF; |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,101 +0,0 @@ |
|||||
<template> |
|
||||
<div class="title-header-box search" :style="{height:`${height}px`}"> |
|
||||
<div class="title-header" |
|
||||
:style="{height:`${height}px`,top:`${height+padHeight}px`,backgroundColor:bgColor || '#FFFFFF'}"> |
|
||||
<div class="search-box" :style="{backgroundColor:bgColor ? '#F2F2F2' : '#F2F2F2'}"> |
|
||||
<img src="https://static.ticket.sz-trip.com/taizhou/images/search.png" alt=""> |
|
||||
<input type="text" class="input" placeholder="请输入想要的产品或服务" v-model="keywords" @confirm="search" /> |
|
||||
<div class="btn" @click="search()">搜索</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
name: "SearchHeader", |
|
||||
props: ['bgColor'], |
|
||||
data() { |
|
||||
return { |
|
||||
keywords: '', |
|
||||
padHeight: 0, |
|
||||
height: 88, |
|
||||
} |
|
||||
}, |
|
||||
methods: { |
|
||||
search() { |
|
||||
uni.$emit('search', { |
|
||||
keywords: this.keywords |
|
||||
}) |
|
||||
}, |
|
||||
}, |
|
||||
created() { |
|
||||
// #ifdef MP-WEIXIN |
|
||||
let systemInfo = uni.getSystemInfoSync(), |
|
||||
rect = uni.getMenuButtonBoundingClientRect(); |
|
||||
this.height = (rect.top - systemInfo.statusBarHeight) * 2 + rect.height |
|
||||
this.padHeight = systemInfo.statusBarHeight |
|
||||
// #endif |
|
||||
|
|
||||
// #ifdef APP-PLUS |
|
||||
let systemInfo = uni.getSystemInfoSync() |
|
||||
this.height = systemInfo.statusBarHeight*1.5 |
|
||||
this.padHeight = systemInfo.statusBarHeight |
|
||||
// #endif |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style scoped> |
|
||||
.title-header-box { |
|
||||
padding: 16rpx 0; |
|
||||
} |
|
||||
|
|
||||
.title-header { |
|
||||
padding: 16rpx 0; |
|
||||
width: 100%; |
|
||||
position: fixed; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
top: 0; |
|
||||
margin: auto; |
|
||||
z-index: 1000; |
|
||||
} |
|
||||
|
|
||||
.search-box { |
|
||||
width: 697rpx; |
|
||||
height: 68rpx; |
|
||||
margin: 0 auto; |
|
||||
border-radius: 60rpx; |
|
||||
padding: 6rpx 7rpx 6rpx 26rpx; |
|
||||
font-size: 26rpx; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
box-sizing: border-box; |
|
||||
background: #F2F2F2; |
|
||||
} |
|
||||
|
|
||||
.search-box img { |
|
||||
width: 28rpx; |
|
||||
height: 30rpx; |
|
||||
} |
|
||||
|
|
||||
.search-box .input { |
|
||||
flex: 1; |
|
||||
border: none; |
|
||||
outline: none; |
|
||||
background: none; |
|
||||
color: #000000; |
|
||||
margin: 0 20rpx; |
|
||||
background-color: #F2F2F2; |
|
||||
} |
|
||||
|
|
||||
.search-box .btn { |
|
||||
/* background-color: #FFC825; */ |
|
||||
border-radius: 27rpx; |
|
||||
font-size: 28rpx; |
|
||||
color: #FFFFFF; |
|
||||
padding: 10rpx 26rpx; |
|
||||
background-color: #00AAFF; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,99 +0,0 @@ |
|||||
<template> |
|
||||
<view class="title-header-box" :style="{height:`${height+padHeight}px`}"> |
|
||||
<view class="title-header" :style="{paddingTop:`${padHeight}px`,height:`${height}px`}"> |
|
||||
<view class="left" @click="goBack" v-if="title !== '太湖'"><i class="iconfont"></i></view> |
|
||||
<view class="center">{{title ? title.substr(0,10) : '太湖'}}</view> |
|
||||
<view class="right"></view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
name: "SearchHeader", |
|
||||
props: ['title', 'icon'], |
|
||||
watch: { |
|
||||
'title'(newVal, oldVal) { |
|
||||
this.title = newVal |
|
||||
} |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
keywords: '', |
|
||||
padHeight: 0, |
|
||||
height: 88 |
|
||||
} |
|
||||
}, |
|
||||
methods: { |
|
||||
search() { |
|
||||
uni.$emit('search', { |
|
||||
keywords: this.keywords |
|
||||
}) |
|
||||
}, |
|
||||
}, |
|
||||
created() { |
|
||||
let systemInfo = uni.getSystemInfoSync(), |
|
||||
rect = uni.getMenuButtonBoundingClientRect(); |
|
||||
let height = (rect.top - systemInfo.statusBarHeight) * 2 + rect.height |
|
||||
this.height = height |
|
||||
this.padHeight = systemInfo.statusBarHeight |
|
||||
this.right = (systemInfo.screenWidth - rect.right) + rect.width |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style scoped> |
|
||||
.title-header-box { |
|
||||
background-color: #F8F8F8; |
|
||||
color: #000000; |
|
||||
} |
|
||||
|
|
||||
.title-header { |
|
||||
/* background-color: #FFC825; */ |
|
||||
background: white; |
|
||||
display: flex; |
|
||||
justify-content: center; |
|
||||
align-items: center; |
|
||||
height: 88rpx; |
|
||||
position: fixed; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
top: 0; |
|
||||
z-index: 1000; |
|
||||
padding-top: 40rpx; |
|
||||
} |
|
||||
|
|
||||
.title-header .left { |
|
||||
padding-left: 30rpx; |
|
||||
width: 58rpx; |
|
||||
display: flex; |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
} |
|
||||
|
|
||||
.title-header .search-box { |
|
||||
width: 502rpx; |
|
||||
height: 58rpx; |
|
||||
border-radius: 29rpx; |
|
||||
background: #F0F0F0; |
|
||||
padding: 0 26rpx; |
|
||||
font-size: 26rpx; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
} |
|
||||
|
|
||||
.title-header .search-box .iconfont { |
|
||||
flex-shrink: 0; |
|
||||
color: #999999; |
|
||||
font-size: 30rpx; |
|
||||
margin-right: 10; |
|
||||
} |
|
||||
|
|
||||
.title-header .search-box .input { |
|
||||
flex: 1; |
|
||||
border: none; |
|
||||
outline: none; |
|
||||
background: none; |
|
||||
color: #666; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,260 +0,0 @@ |
|||||
<template> |
|
||||
<view class="bg" :style="{backgroundColor:bgColor || '#F5F5F5'}"> |
|
||||
<view class="titles">为您推荐</view> |
|
||||
<view class="goodBox" v-if="type == 0 && (list && list.length>0)"> |
|
||||
<view> |
|
||||
<view class="goodItem" v-for="(item,index) in leftList" :key="item.id" @click="gotoDetail(item.id)"> |
|
||||
<image :src="showImg(item.image)" mode="widthFix"></image> |
|
||||
<view class="goodContent"> |
|
||||
<view class="title"> |
|
||||
{{item.title}} |
|
||||
</view> |
|
||||
<view class="tags" v-if="item.label"> |
|
||||
<view v-for="(tagItem,tagIndex) in item.label.split(',').slice(0,2)" :key="tagIndex" class="text-overflow"> |
|
||||
{{tagItem}} |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="price">{{showPrice(item.price)}}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view> |
|
||||
<view class="goodItem" v-for="(item,index) in rightList" :key="item.id" @click="gotoDetail(item.id)"> |
|
||||
<image :src="showImg(item.image)" mode="widthFix"></image> |
|
||||
<view class="goodContent"> |
|
||||
<view class="title"> |
|
||||
{{item.title}} |
|
||||
</view> |
|
||||
<view class="tags" v-if="item.label"> |
|
||||
<view v-for="(tagItem,tagIndex) in item.label.split(',').slice(0,2)" :key="tagIndex" class="text-overflow"> |
|
||||
{{tagItem}} |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="price">{{showPrice(item.price)}}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="goodBox" v-if="type == 1 && (list && list.length>0)"> |
|
||||
<view> |
|
||||
<view class="goodItem" v-for="(item,index) in leftList" :key="item.id" @click="gotoDetail(item.goods.id)"> |
|
||||
<image :src="showImg(item.goods.image)" mode="widthFix"></image> |
|
||||
<view class="goodContent"> |
|
||||
<view class="title"> |
|
||||
{{item.goods.title}} |
|
||||
</view> |
|
||||
<view class="tags" v-if="item.goods.label"> |
|
||||
<view v-for="(tagItem,tagIndex) in item.goods.goods_new_tag.split(',').slice(0,2)" :key="tagIndex" class="text-overflow"> |
|
||||
{{tagItem}} |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="price">{{showPrice(item.goods.price)}}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view> |
|
||||
<view class="goodItem" v-for="(item,index) in rightList" :key="item.id" @click="gotoDetail(item.goods.id)"> |
|
||||
<image :src="showImg(item.goods.image)" mode="widthFix"></image> |
|
||||
<view class="goodContent"> |
|
||||
<view class="title"> |
|
||||
{{item.goods.title}} |
|
||||
</view> |
|
||||
<view class="tags" v-if="item.goods.label"> |
|
||||
<view v-for="(tagItem,tagIndex) in item.goods.goods_new_tag.split(',').slice(0,2)" :key="tagIndex" class="text-overflow"> |
|
||||
{{tagItem}} |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="price">{{showPrice(item.goods.price)}}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="finished-text" v-if="finished">没有更多数据了</view> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import Base from "@/components/Base"; |
|
||||
export default{ |
|
||||
extends: Base, |
|
||||
// type:0,scenic_type_id:1景点,5酒店11民宿12美食;type:1,文创特产,tag_id:6=邮寄,7=自提 |
|
||||
props: ['scenic_type_id','tag_id','type','bgColor','exclude_id'], |
|
||||
data(){ |
|
||||
return { |
|
||||
list: [], |
|
||||
leftList: [], |
|
||||
rightList: [], |
|
||||
finished: false |
|
||||
} |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.getList() |
|
||||
}, |
|
||||
methods: { |
|
||||
getList(){ |
|
||||
if(this.type == 0){ |
|
||||
this.Post({ |
|
||||
method: 'POST', |
|
||||
scenic_type_id: this.scenic_type_id, |
|
||||
exclude_id: this.exclude_id, |
|
||||
offset: this.list.length, |
|
||||
limit: 6 |
|
||||
},'/api/scenic/getScenicByType').then(res => { |
|
||||
res.data.forEach((item,index)=>{ |
|
||||
if(index%2 == 0){ |
|
||||
this.leftList.push(item) |
|
||||
}else{ |
|
||||
this.rightList.push(item) |
|
||||
} |
|
||||
}) |
|
||||
this.list = [...this.list, ...res.data]; |
|
||||
if (res.data.length < 6) { |
|
||||
this.finished = true |
|
||||
} |
|
||||
}) |
|
||||
}else{ |
|
||||
this.Post({ |
|
||||
method: 'POST', |
|
||||
type_id: 5, |
|
||||
exclude_id: this.exclude_id, |
|
||||
offset: this.list.length, |
|
||||
limit: 6, |
|
||||
tag_id: this.tag_id |
|
||||
},'/api/tag/getGoodsByTagId').then(res => { |
|
||||
res.data.forEach((item,index)=>{ |
|
||||
if(index%2 == 0){ |
|
||||
this.leftList.push(item) |
|
||||
}else{ |
|
||||
this.rightList.push(item) |
|
||||
} |
|
||||
}) |
|
||||
this.list = [...this.list, ...res.data]; |
|
||||
if (res.data.length < 6) { |
|
||||
this.finished = true |
|
||||
} |
|
||||
}) |
|
||||
} |
|
||||
}, |
|
||||
gotoDetail(id){ |
|
||||
if(this.scenic_type_id == 1){ |
|
||||
uni.navigateTo({ |
|
||||
url: '/subPackages/details/scenicDetails?id='+id |
|
||||
}) |
|
||||
}else if(this.scenic_type_id == 5){ |
|
||||
uni.navigateTo({ |
|
||||
url: '/subPackages1/hotel/hotelDetails?id='+id |
|
||||
}) |
|
||||
}else if(this.scenic_type_id == 11){ |
|
||||
|
|
||||
}else if(this.scenic_type_id == 12){ |
|
||||
uni.navigateTo({ |
|
||||
url: '/subPackages/details/eateryDetails?id='+id |
|
||||
}) |
|
||||
}else if(this.tag_id == 6){ |
|
||||
uni.navigateTo({ |
|
||||
url: '/subPackages/details/goodDetails?type=1&id='+id |
|
||||
}) |
|
||||
}else if(this.tag_id == 7){ |
|
||||
uni.navigateTo({ |
|
||||
url: '/subPackages/details/goodDetails?type=0&id='+id |
|
||||
}) |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
onReachBottom() { |
|
||||
setTimeout(() => { |
|
||||
if (!this.finished) this.getList() |
|
||||
},1000) |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style scoped lang="scss"> |
|
||||
.bg{ |
|
||||
padding: 0 27rpx; |
|
||||
box-sizing: border-box; |
|
||||
} |
|
||||
.titles{ |
|
||||
font-size: 36rpx; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: 500; |
|
||||
color: #000000; |
|
||||
margin-bottom: 30rpx; |
|
||||
} |
|
||||
.goodBox{ |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
|
|
||||
.goodItem{ |
|
||||
margin-bottom: 28rpx; |
|
||||
|
|
||||
image{ |
|
||||
width: 340rpx; |
|
||||
border-radius: 20rpx 20rpx 0px 0px; |
|
||||
box-shadow: 0px 0px 41rpx 0px rgba(51,51,51,0.1); |
|
||||
display: block; |
|
||||
} |
|
||||
|
|
||||
.goodContent{ |
|
||||
width: 340rpx; |
|
||||
height: 150rpx; |
|
||||
background: #FFFFFF; |
|
||||
border-radius: 0 0 20rpx 20rpx; |
|
||||
padding: 13rpx; |
|
||||
box-sizing: border-box; |
|
||||
box-shadow: 0px 0px 20rpx 0px rgba(51,51,51,0.1); |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
justify-content: space-between; |
|
||||
|
|
||||
.title{ |
|
||||
width: 286rpx; |
|
||||
font-size: 27rpx; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: 500; |
|
||||
color: #000000; |
|
||||
overflow-x: hidden; |
|
||||
overflow-y: inherit; |
|
||||
white-space: nowrap; |
|
||||
} |
|
||||
|
|
||||
.tags{ |
|
||||
display: flex; |
|
||||
|
|
||||
view{ |
|
||||
max-width: 115rpx; |
|
||||
padding: 0 10rpx; |
|
||||
height: 30rpx; |
|
||||
border: 1rpx solid #00D7ED; |
|
||||
border-radius: 7rpx; |
|
||||
font-size: 23rpx; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: 400; |
|
||||
color: #00D7ED; |
|
||||
text-align: center; |
|
||||
line-height: 30rpx; |
|
||||
margin-right: 12rpx; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.price{ |
|
||||
font-size: 32rpx; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: 500; |
|
||||
color: #FF2D3B; |
|
||||
text-align: right; |
|
||||
} |
|
||||
.price::before{ |
|
||||
content: "￥"; |
|
||||
font-size: 20rpx; |
|
||||
} |
|
||||
.price::after{ |
|
||||
content: "起"; |
|
||||
font-size: 20rpx; |
|
||||
color: #8D8D8D; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,12 +0,0 @@ |
|||||
diff a/components/recommend.vue b/components/recommend.vue (rejected hunks) |
|
||||
@@ -142,9 +142,7 @@ |
|
||||
url: '/subPackages/details/scenicDetails?id='+id |
|
||||
}) |
|
||||
}else if(this.scenic_type_id == 5){ |
|
||||
- uni.navigateTo({ |
|
||||
- url: '/subPackages1/hotel/hotelDetails?id='+id |
|
||||
- }) |
|
||||
+ |
|
||||
}else if(this.scenic_type_id == 11){ |
|
||||
|
|
||||
}else if(this.scenic_type_id == 12){ |
|
||||
Loading…
Reference in new issue