update 活动移至首页

main
wwl 2024-03-15 18:21:22 +08:00
parent 2b0a5953ce
commit dc55deda6f
4 changed files with 100 additions and 27 deletions

View File

@ -359,7 +359,6 @@ function SpPage (props, ref) {
"--nav-height": `${gNavbarH}px`,
"--status-bar-height": `${gStatusBarHeight}px`,
"--area-bottom-height": `${gAreaH}rpx`,
"$page-ipx-footer-height": `${gAreaH}px`,
})}
ref={wrapRef}
>

View File

@ -183,6 +183,44 @@ page {
height: 100%;
}
}
.item-btns {
display: flex;
flex-direction: column;
align-items: flex-start;
position: absolute;
left: 66px;
bottom: 170px;
z-index: 10;
// justify-content: flex-start;
.item-tit {
font-size: 42px;
font-weight: bold;
margin-bottom: 36px;
color: #fff;
}
.item-btn {
// width: 180px;
// height: 56px;
padding: 30px 70px 30px 90px;
color: #fff;
font-size: 28px;
border-radius: 10px;
background-color: #00000085;
border-width: 2px;
border-style: solid;
border-color: #fff;
display: flex;
justify-content: center;
align-items: center;
font-size: 22px;
line-height: 1;
.icon-my {
font-size: 28px;
font-weight: bold;
margin-left: 16px;
}
}
}
}
.shop-box {
height: 520px;

View File

@ -103,7 +103,8 @@ const initialState = {
},
],
goodList: [],
recommend: []
recommend: [],
activeInfo: {}
}
function Home () {
@ -238,6 +239,12 @@ function Home () {
}
const getSwiperList = async () => {
const { status, activity_info = {}, total_count } = await api.user.registrationActivity({ activity_id: 1 })
const activeSwiper = activity_info.pics.map(item => ({
type: 'image',
src: item,
goods: []
}))
const res = await api.shop.homeSwiperList({ page: 1, pageSize: 999 })
const list = res?.list?.map((item) => {
return {
@ -258,8 +265,13 @@ function Home () {
}
}) || []
setState((draft) => {
draft.swiperList = list
draft.swiperList = [...activeSwiper, ...list]
draft.goodList = list[0].goods || []
draft.activeInfo = {
...activity_info,
total_count,
status
}
})
}
@ -353,6 +365,7 @@ function Home () {
const deltaX = clientX - startX
if (Math.abs(deltaY) < 50) return
console.log("🚀 ~ deltaY:", deltaY)
if (deltaY > 0) {
// 下滑操作
setState((draft) => {
@ -367,6 +380,7 @@ function Home () {
}, 500)
}
} else if (deltaY < 0) {
if (currentIndex === 0) return
// 上滑操作
setState((draft) => {
draft.showBottom = true
@ -396,7 +410,17 @@ function Home () {
})
}
const { activeInfo = {}, currentIndex } = state
const handleApply = () => {
let url = '/pages/recommend/detail?id='
if (activeInfo.total_count) {
url = `/pages/recommend/status?id=`
}
Taro.navigateTo({
url: url + activeInfo.activity_id
})
}
return (
<SpPage
className='page-index'
@ -507,15 +531,23 @@ function Home () {
</SwiperItem>
))}
</Swiper>
{!isUpOperation && <View className="item-img-box">
<View className="item-img-txt"> </View>
<Image className="item-img" height="62" src={require('../assets/i-sou.gif')} isShowMenuByLongpress={false} lazyLoad isNew={false} />
</View>}
{!isUpOperation && <View className='spot-pagination'>
{swiperList.map((_, index) => (
<View key={index} className={'spot-pagination-bullet ' + ((state.currentIndex == index) ? 'spot-pagination-bullet-active' : "")} style={{ width: 1 / state.length * 100 + '%' }}></View>
))}
</View>}
{!isUpOperation && <>
{currentIndex === 0 ? <View className="item-btns">
<View className="item-tit">{activeInfo.activity_name}</View>
{activeInfo.end_time * 1000 >= Date.now() && <View className="item-btn" onClick={handleApply}>
<View className="item-btn-txt">{activeInfo.total_count ? '已报名' : '活动申请'}</View>
</View>}
</View> :
<View className="item-img-box">
<View className="item-img-txt"> </View>
<Image className="item-img" height="62" src={require('../assets/i-sou.gif')} isShowMenuByLongpress={false} lazyLoad isNew={false} />
</View>}
<View className='spot-pagination'>
{swiperList.map((_, index) => (
<View key={index} className={'spot-pagination-bullet ' + ((state.currentIndex == index) ? 'spot-pagination-bullet-active' : "")} style={{ width: 1 / state.length * 100 + '%' }}></View>
))}
</View>
</>}
{isUpOperation && <View className="icon-kf">
<SpChat><SpImage height="62" src='index/kf.png' isShowMenuByLongpress={false} lazyLoad isNew /></SpChat>
</View>}

View File

@ -96,17 +96,17 @@ export default class RecommendList extends Component {
// this.setState({
// list: []
// })
// setTimeout(() => {
// // this.nextPage()
// // Taro.hideLoading()
// this.setState({
// page: {
// isLoading: false
// }
// })
// }, 200)
setTimeout(() => {
// this.nextPage()
// Taro.hideLoading()
this.setState({
page: {
isLoading: false
}
})
}, 300)
// this.praiseNum()
this.getActiveDetail()
// this.getActiveDetail()
}
onShareAppMessage () {
@ -642,7 +642,7 @@ export default class RecommendList extends Component {
const height = windowWidth * 9 / 17
return (
<SpPage renderFooter={<SpTabbar />} loading={page.isLoading} className='has-nav' title="" isBlack isTop>
<SpPage renderFooter={<SpTabbar />} loading={page.isLoading} className='has-nav' title="" isBlack >
<View className='page-recommend-list'>
{false && <>
<View className='recommend-list__toolbar'>
@ -777,7 +777,9 @@ export default class RecommendList extends Component {
)}
</ScrollView>
</>}
{/* {page.isLoading ? <Loading></Loading> :
{/* 鞋床故事 */}
{page.isLoading ? <Loading></Loading> :
<View className="recommend-content">
<Video
id="recommend-video"
@ -817,8 +819,10 @@ export default class RecommendList extends Component {
<SpImage height={height * 2} width={windowWidth * 2} mode="aspectFill" src='recommend/09.jpg' isShowMenuByLongpress={false} lazyLoad isNew />
</View>
</View>
} */}
{page.isLoading ? <Loading></Loading> :
}
{/* 活动部分 */}
{/* {page.isLoading ? <Loading></Loading> :
<View className="active-content">
<Swiper
className={classNames('swiper')}
@ -880,7 +884,7 @@ export default class RecommendList extends Component {
))}
</View>
</View>
}
} */}
<BackToTop show={showBackToTop} onClick={this.scrollBackToTop} />
</View>