|
@@ -3,6 +3,7 @@ import { observer, inject } from 'mobx-react';
|
|
|
import { useDidHide, useDidShow } from '@tarojs/taro';
|
|
|
//==========components组件引用========================
|
|
|
import TopNavBar from '@src/components/TopNavBar';
|
|
|
+import ScrollViewHoc from '@src/components/ScrollView';
|
|
|
import { Store } from '@src/app';
|
|
|
import useApi from '@src/Hook/useApi';
|
|
|
import BannerBox from '@src/components/PupPetry/BannerBox'
|
|
@@ -12,6 +13,8 @@ import BookHead from '@src/components/PupPetry/BookHead';
|
|
|
import BookHotTabs from '@src/components/PupPetry/BookHotTabs';
|
|
|
import BookboxColumnSmall from '@src/components/PupPetry/BookBox/BookboxColumnSmall';
|
|
|
import BookboxRowMiddle from '@src/components/PupPetry/BookBox/BookboxRowMiddle';
|
|
|
+import BookboxColumnBig from '@src/components/PupPetry/BookBox/BookboxColumnBig';
|
|
|
+
|
|
|
|
|
|
|
|
|
interface Props {
|
|
@@ -30,7 +33,7 @@ const Index: React.FC<Props> = ({ store }) => {
|
|
|
return obj[item.componentType] = { ...item, eq: index }
|
|
|
})
|
|
|
return obj
|
|
|
- }, [indexComponents, pageShow, bookStore.workDirection,indexStore.isLogin])
|
|
|
+ }, [indexComponents, pageShow, bookStore.workDirection, indexStore.isLogin])
|
|
|
// 页面显示请求数据
|
|
|
useEffect(() => {
|
|
|
if (pageShow) {
|
|
@@ -52,7 +55,7 @@ const Index: React.FC<Props> = ({ store }) => {
|
|
|
});
|
|
|
// 处理首页展示的组件的请求
|
|
|
const indexCompontent = () => {
|
|
|
- console.log("indexConfig",indexConfig)
|
|
|
+ console.log("indexConfig", indexConfig)
|
|
|
// 小程序的组件配置
|
|
|
Object.keys(indexConfig)?.forEach(key => {
|
|
|
switch (key) {
|
|
@@ -65,6 +68,30 @@ const Index: React.FC<Props> = ({ store }) => {
|
|
|
case "hot_category"://热门分类
|
|
|
getHotCategory()
|
|
|
break;
|
|
|
+ {/* 重磅新书 new_books*/ }
|
|
|
+ case "new_books":
|
|
|
+ getNewBooks()
|
|
|
+ break;
|
|
|
+ {/* 热门推荐 hot_rec*/ }
|
|
|
+ case "hot_rec":
|
|
|
+ getHotRec()
|
|
|
+ break;
|
|
|
+ {/* 口碑佳作 best_reviews*/ }
|
|
|
+ case "best_reviews":
|
|
|
+ getBestReviews()
|
|
|
+ break;
|
|
|
+ {/* 经典热书 classic_books*/ }
|
|
|
+ case "classic_books":
|
|
|
+ getClassicBooks()
|
|
|
+ break;
|
|
|
+ {/* 必看好书 best_books*/ }
|
|
|
+ case "best_books":
|
|
|
+ getBestBooks()
|
|
|
+ break;
|
|
|
+ {/* 猜你喜欢 guess_like*/ }
|
|
|
+ case "guess_like":
|
|
|
+ getGuessLike({ pageSize: 20, pageNum: 1 })
|
|
|
+ break;
|
|
|
}
|
|
|
})
|
|
|
}
|
|
@@ -91,42 +118,173 @@ const Index: React.FC<Props> = ({ store }) => {
|
|
|
const getToDayHotBooks = () => {
|
|
|
indexComponents?.hot_books(bookStore.workDirection)
|
|
|
}
|
|
|
- return <View style={{ display: "flex", flexFlow: 'column' }}>
|
|
|
- {/* 轮播 */}
|
|
|
- {indexConfig['banners'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
- <BannerBox data={indexStore?.indexBanners || []} />
|
|
|
- </View>}
|
|
|
- {/* 今日热门 */}
|
|
|
- {indexConfig['hot_books'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
- <BookHead showBtn={indexStore?.indexHotBooks?.showRightButton} title={indexStore?.indexHotBooks?.name || "今日热书"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
- Taro.navigateTo({ url: `/pages/indexMore/index?title=今日热书&dataName=indexHotBooks` })
|
|
|
- }}></BookHead>
|
|
|
- <View ><BookboxRowMiddle {...indexStore?.indexHotBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.[0]} /></View>
|
|
|
- <View className='w row'>
|
|
|
- {
|
|
|
- indexStore?.indexHotBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
- if (index > 0 && index < 5) {
|
|
|
+ // 重磅新书
|
|
|
+ const getNewBooks = () => {
|
|
|
+ indexComponents?.new_books(bookStore.workDirection)
|
|
|
+ }
|
|
|
+ // 经典
|
|
|
+ const getClassicBooks = () => {
|
|
|
+ indexComponents?.classic_books(bookStore.workDirection)
|
|
|
+ }
|
|
|
+ // 口碑
|
|
|
+ const getBestReviews = () => {
|
|
|
+ indexComponents?.best_reviews(bookStore.workDirection)
|
|
|
+ }
|
|
|
+ // 热门推荐
|
|
|
+ const getHotRec = () => {
|
|
|
+ indexComponents?.hot_rec(bookStore.workDirection)
|
|
|
+ }
|
|
|
+ // 必看
|
|
|
+ const getBestBooks = () => {
|
|
|
+ indexComponents?.best_books(bookStore.workDirection)
|
|
|
+ }
|
|
|
+ // 猜喜欢
|
|
|
+ const getGuessLike = (page) => {
|
|
|
+ indexComponents?.guess_like({ workDirection: bookStore.workDirection, ...page })
|
|
|
+ }
|
|
|
+ //下来加载
|
|
|
+ const load = async () => {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ let { size, total, records } = indexStore?.indexGuessLike?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]
|
|
|
+ let pageSize = size + 20
|
|
|
+ if (records?.length >= total) {
|
|
|
+ Taro.showToast({
|
|
|
+ title: '没有更多了~~',
|
|
|
+ duration: 2000,
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ reject()
|
|
|
+ return
|
|
|
+ } else {
|
|
|
+ getGuessLike({ pageSize, pageNum: 1 })
|
|
|
+ resolve(true)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return <ScrollViewHoc load={load} filterClassName='.searchTs' navHeight={indexStore.navHeight}>
|
|
|
+ <View style={{ display: "flex", flexFlow: 'column' }}>
|
|
|
+ {/* 轮播 */}
|
|
|
+ {indexConfig['banners'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BannerBox data={indexStore?.indexBanners || []} />
|
|
|
+ </View>}
|
|
|
+ {/* 今日热门 */}
|
|
|
+ {indexConfig['hot_books'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexHotBooks?.showRightButton} title={indexStore?.indexHotBooks?.name || "今日热书"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
+ Taro.navigateTo({ url: `/pages/indexMore/index?title=今日热书&dataName=indexHotBooks` })
|
|
|
+ }}></BookHead>
|
|
|
+ <View ><BookboxRowMiddle {...indexStore?.indexHotBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.[0]} /></View>
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexHotBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
+ if (index > 0 && index < 5) {
|
|
|
+ return <View key={index}><BookboxColumnSmall {...item} /></View>
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 热门分类 */}
|
|
|
+ {indexConfig['hot_category'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexHotCategory?.showRightButton} title={indexStore?.indexHotCategory?.name || "热门分类"} fitTitle="全部分类" imgUrl={require('../../icon/right.png')} fitOnBack={() => { Taro.switchTab({ url: '/pages/classify/index' }) }} />
|
|
|
+ <BookHotTabs hotValue={indexStore?.indexHotCategory?.bookCategoryList || []} onBack={(value) => {
|
|
|
+ getHotBooks(value)
|
|
|
+ }} />
|
|
|
+ <View className='w row4'>
|
|
|
+ {
|
|
|
+ bookStore?.bookList?.records?.map((item, index) => {
|
|
|
return <View key={index}><BookboxColumnSmall {...item} /></View>
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- </View>
|
|
|
- </View>}
|
|
|
- {/* 热门分类 */}
|
|
|
- {indexConfig['hot_category'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
- <BookHead showBtn={indexStore?.indexHotCategory?.showRightButton} title={indexStore?.indexHotCategory?.name || "热门分类"} fitTitle="全部分类" imgUrl={require('../../icon/right.png')} fitOnBack={() => { Taro.switchTab({ url: '/pages/classify/index' }) }} />
|
|
|
- <BookHotTabs hotValue={indexStore?.indexHotCategory?.bookCategoryList || []} onBack={(value) => {
|
|
|
- getHotBooks(value)
|
|
|
- }} />
|
|
|
- <View className='w row4'>
|
|
|
- {
|
|
|
- bookStore?.bookList?.records?.map((item, index) => {
|
|
|
- return <View key={index}><BookboxColumnSmall {...item} /></View>
|
|
|
- })
|
|
|
- }
|
|
|
- </View>
|
|
|
- </View>}
|
|
|
- </View>
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 重磅新书 new_books*/}
|
|
|
+ {indexConfig['new_books'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexNewBooks?.showRightButton} title={indexStore?.indexNewBooks?.name || "重磅新书"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
+ Taro.navigateTo({ url: `/pages/indexMore/index?title=重磅新书&dataName=indexNewBooks` })
|
|
|
+ }} />
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexNewBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
+ if (index < 3) {
|
|
|
+ return <View key={index}><BookboxColumnBig {...item} /></View>
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 热门推荐 hot_rec*/}
|
|
|
+ {indexConfig['hot_rec'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexHotRec?.showRightButton} title={indexStore?.indexHotRec?.name || "热门推荐"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
+ Taro.navigateTo({ url: `/pages/indexMore/index?title=热门推荐&dataName=indexHotRec` })
|
|
|
+ }} />
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexHotRec?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
+ if (index < 3) {
|
|
|
+ return <View key={index}><BookboxRowMiddle {...item} /></View>
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 口碑佳作 best_reviews*/}
|
|
|
+ {indexConfig['best_reviews'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexBestReviews?.showRightButton} title={indexStore?.indexBestReviews?.name || "口碑佳作"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
+ Taro.navigateTo({ url: `/pages/indexMore/index?title=口碑佳作&dataName=indexBestReviews` })
|
|
|
+ }} />
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexBestReviews?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
+ if (index < 4) {
|
|
|
+ return <View key={index}><BookboxColumnSmall {...item} /></View>
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 经典热书 classic_books*/}
|
|
|
+ {indexConfig['classic_books'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexClassicBooks?.showRightButton} title={indexStore?.indexClassicBooks?.name || "经典热书"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
+ Taro.navigateTo({ url: `/pages/indexMore/index?title=经典热书&dataName=indexClassicBooks` })
|
|
|
+ }} />
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexClassicBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
+ if (index < 8) {
|
|
|
+ return <View key={index}><BookboxColumnSmall {...item} /></View>
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 必看好书 best_books*/}
|
|
|
+ {indexConfig['best_books'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexBestBooks?.showRightButton} title={indexStore?.indexBestBooks?.name || "必看好书"} fitTitle="更多" imgUrl={require('../../icon/right.png')} fitOnBack={() => {
|
|
|
+ Taro.navigateTo({ url: `/pages/indexMore/index?title=必看好书&dataName=indexBestBooks` })
|
|
|
+ }} />
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexBestBooks?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.map((item, index) => {
|
|
|
+ if (index < 3) {
|
|
|
+ return <View key={index}><BookboxRowMiddle {...item} /></View>
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ {/* 猜你喜欢 guess_like*/}
|
|
|
+ {indexConfig['guess_like'] && <View style={{ order: indexConfig['banners'].eq }}>
|
|
|
+ <BookHead showBtn={indexStore?.indexGuessLike?.showRightButton} title={indexStore?.indexGuessLike?.name || "猜你喜欢"} />
|
|
|
+ <View className='w row'>
|
|
|
+ {
|
|
|
+ indexStore?.indexGuessLike?.[app?.appInfo?.appCategory === 1 ? "longBookInfoAppVOS" : "shortBookInfoAppVOS"]?.records?.map((item, index) => {
|
|
|
+ return <View key={index}><BookboxRowMiddle {...item} /></View>
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>}
|
|
|
+ </View>
|
|
|
+ </ScrollViewHoc>
|
|
|
};
|
|
|
export default TopNavBar(inject('store')(observer(Index)), {
|
|
|
tab: true,
|