commit
1b675daa75
@ -0,0 +1,15 @@ |
||||
import {request} from "@/api/request"; |
||||
|
||||
|
||||
export const illnessApi = { |
||||
/** 疾病列表 */ |
||||
list(id:number,page: number , page_size: number) { |
||||
return request<{ |
||||
list: any[], |
||||
total: number, |
||||
}>(`/home/v1/illness/list?page=${page}&page_size=${page_size}&id=${id}` , "GET") |
||||
}, |
||||
articleInfo(id: number ) { |
||||
return request<{ content: string }>(`/home/v1/article/${id}` , "GET") |
||||
}, |
||||
} |
@ -0,0 +1,4 @@ |
||||
export default definePageConfig({ |
||||
navigationBarTitleText: '', |
||||
onReachBottomDistance: 30 |
||||
}) |
@ -0,0 +1,34 @@ |
||||
page{ |
||||
background-color: #fff !important; |
||||
} |
||||
.box { |
||||
display: flex; |
||||
margin-bottom: 20rpx; |
||||
background-color: #fff; |
||||
border-radius: 16rpx; |
||||
box-sizing: border-box; |
||||
} |
||||
.image{ |
||||
width: 128rpx; |
||||
height:128rpx; |
||||
background-color: pink; |
||||
border-radius: 8rpx; |
||||
} |
||||
.rightBox{ |
||||
padding-left: 24rpx; |
||||
box-sizing: border-box; |
||||
flex: 1; |
||||
} |
||||
.desc{ |
||||
font-size: 24rpx; |
||||
font-weight: 500; |
||||
color: #909795; |
||||
line-height: 34rpx; |
||||
display: -webkit-box; |
||||
word-break: break-all; |
||||
text-overflow: ellipsis; |
||||
overflow: hidden; |
||||
-webkit-box-orient:vertical; |
||||
-webkit-line-clamp:2; |
||||
} |
||||
|
@ -0,0 +1,66 @@ |
||||
import {FC, useCallback, useEffect, useState} from "react"; |
||||
import {Image, View} from "@tarojs/components"; |
||||
import {brandApi, BrandRecord} from "@/api"; |
||||
import styles from './list.module.scss' |
||||
import Taro, {useReachBottom} from "@tarojs/taro"; |
||||
import Empty from "@/components/empty/empty"; |
||||
import Collapse from "@/components/collapse/collapse"; |
||||
import {illnessApi} from "@/api/illness"; |
||||
import {apis} from "@tarojs/plugin-platform-h5/dist/dist/definition.json"; |
||||
import setNavigationBarTitle = apis.setNavigationBarTitle; |
||||
|
||||
const BrandList: FC = () => { |
||||
const [page, setPage] = useState(1) |
||||
const [brands, setBrands] = useState<any[]>([]) |
||||
const [total, setTotal] = useState(0) |
||||
|
||||
useEffect(() => { |
||||
getData() |
||||
}, [page]) |
||||
|
||||
const getData = useCallback(async () => { |
||||
try { |
||||
const data = await illnessApi.list(22,1, 100) |
||||
setTotal(data.total) |
||||
setBrands([ |
||||
...data.list |
||||
]) |
||||
Taro.setNavigationBarTitle({title: data.list?.[0].resourceCategories?.[0]?.name ?? '文章列表'}) |
||||
} catch (e) { |
||||
} |
||||
}, [page]) |
||||
|
||||
|
||||
useReachBottom(useCallback(() => { |
||||
if (brands?.length < total) { |
||||
setPage(page + 1) |
||||
} |
||||
}, [total, brands])) |
||||
|
||||
|
||||
return ( |
||||
<View className='p-2'> |
||||
{ |
||||
brands.length && |
||||
brands.map((d) => |
||||
<View className={styles.box} > |
||||
<View className={styles.rightBox}> |
||||
<Collapse title={d.name} children={ |
||||
<> |
||||
{ |
||||
d.articles?.map((d) => |
||||
<View onClick={() => {Taro.navigateTo({url: `/pages/preview/illness/article/article?id=${d.id}`})}} className='mt-2 font-28 ml-5'>{d.title}</View> |
||||
|
||||
) |
||||
} |
||||
</> |
||||
}></Collapse> |
||||
</View> |
||||
</View> |
||||
) |
||||
} |
||||
</View> |
||||
) |
||||
} |
||||
|
||||
export default BrandList |
Loading…
Reference in new issue