|
@@ -5,7 +5,7 @@ import { View, Text, ScrollView } from '@tarojs/components';
|
|
|
import { observer, inject } from 'mobx-react';
|
|
|
import './index.less';
|
|
|
import TopNavBar from '@src/components/TopNavBar/index';
|
|
|
-import Taro, { useDidHide } from '@tarojs/taro';
|
|
|
+import Taro, { useDidHide, useLoad } from '@tarojs/taro';
|
|
|
import BookConfigPuP from '@src/components/bookConfigPup';
|
|
|
import { BookStore } from '@src/store/book';
|
|
|
import useApi from '@src/Hook/useApi';
|
|
@@ -35,6 +35,7 @@ const BookArticle: React.FC<BookArticleProps> = ({ store }) => {
|
|
|
const [isLoad, setIsLoad] = useState(false)
|
|
|
const { bookStore, indexStore, modalStore } = store
|
|
|
const [showPay, setShowPay] = useState(false)//需要付费展示
|
|
|
+ const [showVip, setShowVip] = useState(false)//是否展示vip支付
|
|
|
const { openBookData } = bookStore
|
|
|
const [bookConfig, setBookConfig] = useState<Config>({ size: 'pre_21', off_on: true, bg: 'bg_b', lh: 'lh_72' });
|
|
|
const [pup, setPup] = useState(false);
|
|
@@ -43,31 +44,35 @@ const BookArticle: React.FC<BookArticleProps> = ({ store }) => {
|
|
|
const newReadLogIdRef = useRef("");
|
|
|
const readLogInterval = useRef<NodeJS.Timeout>()
|
|
|
const [payType, setPayType] = useState<"shubi" | "vip">("shubi")
|
|
|
+
|
|
|
+
|
|
|
// 页面显示的操作请求
|
|
|
useEffect(() => {
|
|
|
// ComponentDidMount
|
|
|
- try {
|
|
|
- Taro.getStorage({
|
|
|
- key: 'bookConfig',
|
|
|
- success: (res) => {
|
|
|
- setBookConfig(JSON.parse(res.data));
|
|
|
- },
|
|
|
- fail: () => {
|
|
|
- setConfig({ size: 'pre_21', off_on: true, bg: 'bg_b', lh: 'lh_72' });
|
|
|
- }
|
|
|
- });
|
|
|
- } catch (e) {
|
|
|
- console.error('Error loading book config:', e);
|
|
|
+ if (openBookData?.bookId) {
|
|
|
+ try {
|
|
|
+ Taro.getStorage({
|
|
|
+ key: 'bookConfig',
|
|
|
+ success: (res) => {
|
|
|
+ setBookConfig(JSON.parse(res.data));
|
|
|
+ },
|
|
|
+ fail: () => {
|
|
|
+ setConfig({ size: 'pre_21', off_on: true, bg: 'bg_b', lh: 'lh_72' });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } catch (e) {
|
|
|
+ console.error('Error loading book config:', e);
|
|
|
+ }
|
|
|
+ onReport()
|
|
|
+ //假如存在阅读记录获取对应章节的条数
|
|
|
+ let readLogId = getReadLog(openBookData?.bookId)
|
|
|
+ getBookContent({ pageNum: 1, pageSize: readLogId ? Number(readLogId?.split('-')[1]) : 2 }).then(res => {
|
|
|
+ //继续阅读时跳转到上次阅读的段落
|
|
|
+ console.log("上次阅读到readLogId", readLogId)
|
|
|
+ setCurrentScrollId(readLogId)
|
|
|
+ })
|
|
|
}
|
|
|
- onReport()
|
|
|
- //假如存在阅读记录获取对应章节的条数
|
|
|
- let readLogId = getReadLog(openBookData?.bookId)
|
|
|
- getBookContent({ pageNum: 1, pageSize: readLogId ? Number(readLogId?.split('-')[1]) : 2 }).then(res => {
|
|
|
- //继续阅读时跳转到上次阅读的段落
|
|
|
- console.log("上次阅读到readLogId", readLogId)
|
|
|
- setCurrentScrollId(readLogId)
|
|
|
- })
|
|
|
- }, []);
|
|
|
+ }, [openBookData?.bookId]);
|
|
|
// 上报阅读
|
|
|
const onReport = () => {
|
|
|
let scene = indexStore.scene
|
|
@@ -157,6 +162,7 @@ const BookArticle: React.FC<BookArticleProps> = ({ store }) => {
|
|
|
backgroundColor: bookConfig.off_on ? '#fff' : '#111'
|
|
|
});
|
|
|
}, [bookConfig.off_on]);
|
|
|
+ // 下拉加载
|
|
|
const onLoad = async () => {
|
|
|
if (openBookData?.contentData) {
|
|
|
let { size, current, total, records } = openBookData.contentData
|
|
@@ -237,14 +243,15 @@ const BookArticle: React.FC<BookArticleProps> = ({ store }) => {
|
|
|
<View onClick={togglePup}>
|
|
|
{
|
|
|
openBookData?.contentData?.records?.map(item => {
|
|
|
- let needPay = item.needPay
|
|
|
- let isPay = item.isPay
|
|
|
- let showText = true
|
|
|
+ let needPay = item.needPay //是否付费解锁
|
|
|
+ let showText = true //是否显示内容
|
|
|
let arr = item.paragraphInfo.content?.match(/[^\n]*\n?/g);
|
|
|
- if (needPay && !isPay) {
|
|
|
+ // 是否需要付费
|
|
|
+ if (needPay) {
|
|
|
showText = false
|
|
|
if (!showPay) {
|
|
|
setShowPay(true)
|
|
|
+ setShowVip(item.vipFree)
|
|
|
}
|
|
|
}
|
|
|
return showText ? <View
|
|
@@ -264,10 +271,10 @@ const BookArticle: React.FC<BookArticleProps> = ({ store }) => {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
- {showPay && <View>
|
|
|
+ {showPay && <View className='pay_btns'>
|
|
|
<View className='text-with-lines' >剩余内容需付费解锁</View>
|
|
|
<IosShowPay>
|
|
|
- <View className='vip_btn' onClick={(e) => { payBtn(e, "vip") }}>开通会员,本书免费读</View>
|
|
|
+ {showVip && <View className='vip_btn' onClick={(e) => { payBtn(e, "vip") }}>开通会员,本书免费读</View>}
|
|
|
<View className='shubi_btn' onClick={(e) => { payBtn(e, "shubi") }}>购买本章</View>
|
|
|
</IosShowPay>
|
|
|
</View>}
|