品牌列表加上拉加载,及样式调整

main
一杯沧海 1 year ago
parent f04e74c325
commit 45a4a70246
  1. 4
      src/pages/home/components/feature_recommended.tsx
  2. 13
      src/pages/preview/brand/article/article.tsx
  3. 29
      src/pages/preview/brand/list/list.tsx
  4. 4
      src/pages/preview/illness/article/article.tsx

@ -110,7 +110,7 @@ const FeatureRecommended: FC = () => {
return res.list.map<DataContent>(d => ({
id: d.id,
imageUrl: '',
description: d.content,
description: d.content?.replace(/[^\u4e00-\u9fa5]/gi,"") ?? '暂无描述',
title: d.title,
path: `?id=${d.id}`
}))
@ -155,7 +155,7 @@ const FeatureRecommended: FC = () => {
</View>
<View className={styles.featureText}>
<View className='text-ellipsis text-secondary'>{c.title}</View>
<View className='font-26 mt-1 text-muted text-ellipsis'>{c.description}</View>
<View className='font-26 mt-1 text-muted text-ellipsis'>{c.description || '暂无描述'}</View>
</View>
</View>)
}

@ -1,16 +1,18 @@
import {FC, useEffect, useState} from "react";
import {FC, useEffect, useMemo, useState} from "react";
import {Image, Text, View} from "@tarojs/components";
import Taro, {useRouter} from "@tarojs/taro";
import {ArticleRecord, brandApi} from "@/api";
import styles from "@/pages/preview/illness/article/article.module.scss";
import down from "@/static/img/doubleDown.png";
import {Profile} from "@/store";
import {parse} from "@/utils/marked/marked";
const article:FC = () => {
const {token,empty} = Profile.useContainer()
const {token,} = Profile.useContainer()
const {id} = useRouter().params as unknown as { id: number}
const [articleInfo,setArticleInfo] = useState<ArticleRecord>()
const { children } = useMemo(() => parse(articleInfo?.content || ''), [articleInfo])
useEffect(() => {
getData()
}, [id])
@ -24,10 +26,11 @@ const article:FC = () => {
}
}
function helloWorld() {
const html = articleInfo?.content;
return (
<>
<View style={{padding:'10px',height:!token ? Taro.getWindowInfo().windowHeight-60+'px' : 'auto',overflow:!token ? 'hidden':'auto'}} dangerouslySetInnerHTML={{ __html: html! }}></View>
<View style={{padding:'10px',height:!token ? Taro.getWindowInfo().windowHeight-60+'px' : 'auto',overflow:!token ? 'hidden':'auto'}}>
{ children }
</View>
{
!token &&
<View className={styles.fixedBox}>
@ -35,7 +38,7 @@ const article:FC = () => {
<View className={styles['fixedBox-inner-icon']}>
<Image src={down}></Image>
</View>
<View className={styles['fixedBox-inner-box']} onClick={empty}>
<View className={styles['fixedBox-inner-box']} onClick={()=>{Taro.navigateTo({url: '/pages/login/login'})}}>
<Text></Text>
</View>
</View>

@ -9,14 +9,30 @@ const BrandList: FC = () => {
const [page, setPage] = useState(1)
const [brands, setBrands] = useState<BrandRecord[]>([])
const [total, setTotal] = useState(0)
const [text, setText] = useState('')
useEffect(() => {
Taro.showLoading({
title: '加载中',
mask: true
})
setTimeout(function () {
Taro.hideLoading()
}, 650)
getData()
}, [page])
const getData = useCallback(async () => {
try {
setText('加载中..')
const res = await brandApi.list(page, 10)
if(page === 1){
if(res.list.length < 10) {
setText('没有更多了~')
}else{
setText('上拉加载更多~')
}
}
setTotal(res.total)
setBrands([
...brands,
@ -34,22 +50,27 @@ const BrandList: FC = () => {
useReachBottom(useCallback(() => {
if (brands?.length < total) {
setPage(page + 1)
}else{
setText('没有更多了~')
}
}, [total, brands]))
return (
<View className='p-2'>
<View className='p-2' style={{display:text?'block':'none'}}>
{
brands.length ? brands.map((d) =>
<View onClick={() => jumpInfo(d.id)} className={styles.box} key={d.id}>
brands.length ?
<>
{ brands.map((d) => <View onClick={() => jumpInfo(d.id)} className={styles.box} key={d.id}>
<Image src={d.logo} mode='aspectFill' className={styles.image}/>
<View className={styles.rightBox}>
<View className='font-weight mb-2 font-28'>{d.name}</View>
<View className={styles.desc}>{d.graphic_introduction}</View>
</View>
</View>)
: <Empty name='空空如也'/>
}
<View style={{width:'750rpx',textAlign:'center',color:'#ccc'}} className="font-28 mt-3">{text}</View>
</>: <Empty name='空空如也'/>
}
</View>
)

@ -63,14 +63,14 @@ const article:FC = () => {
<View className={styles['fixedBox-inner-icon']}>
<Image src={down}></Image>
</View>
<View className={styles['fixedBox-inner-box']} onClick={empty}>
<View className={styles['fixedBox-inner-box']} onClick={ ()=> Taro.navigateTo({url: '/pages/login/login'})}>
<Text></Text>
</View>
</View>
</View>
}
<PageContainer show={show} round={true} overlay={true} overlayStyle={'background:rgba(0,0,0,0.3)'} >
<PageContainer onClickOverlay={()=>{ setShow(false)}} show={show} round={true} overlay={true} overlayStyle={'background:rgba(0,0,0,0.3)'} >
<View className="px-3 py-5">
{headings.length > 0 &&
headings.map((d) =>

Loading…
Cancel
Save