疾病文章列表

src/api/illness.ts

@@ -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")
+  },
+}

src/app.config.ts

@@ -86,6 +86,8 @@ export default defineAppConfig({
         'profession/profession',
         'health/health',  // 健康
         'videoFull/videoFull',  // 资源id 视频全屏
+        'illness/list/list',
+        'illness/info/info',
         'illness/article/article'
       ]
     },

src/pages/preview/illness/list/list.config.ts

@@ -0,0 +1,4 @@
+export default definePageConfig({
+  navigationBarTitleText: '',
+  onReachBottomDistance: 30
+})

src/pages/preview/illness/list/list.module.scss

@@ -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;
+}
+

src/pages/preview/illness/list/list.tsx

@@ -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