diff --git a/src/api/home.ts b/src/api/home.ts index da8a404..e6ef81c 100644 --- a/src/api/home.ts +++ b/src/api/home.ts @@ -62,6 +62,9 @@ export const HomeApi = { }, /** 疾病知识 */ illness(page: number, page_size: number) { - return request('/home/v1/article/illness_list', "GET", {page, page_size}) + return request<{ list: Illness[], total: number }>('/home/v1/article/illness_list', "GET", {page, page_size}) + }, + category(type: number) { + return request('/home/v1/category/index/info?type=' + type, "GET") } } diff --git a/src/api/public.ts b/src/api/public.ts index 8337e6d..b8c363a 100644 --- a/src/api/public.ts +++ b/src/api/public.ts @@ -6,6 +6,7 @@ export interface Category { parent_chain: string parent_id: number sort: number + resource_category?: Category[] } interface CategoryList { diff --git a/src/app.config.ts b/src/app.config.ts index 4435b93..24cfbcc 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -86,7 +86,8 @@ export default defineAppConfig({ 'profession/profession', 'health/health', // 健康 'videoFull/videoFull', // 资源id 视频全屏 - 'illness/article/article' + 'illness/article/article', + 'illness/sort/sort' ] }, ], diff --git a/src/pages/home/components/feature.tsx b/src/pages/home/components/feature.tsx index 0ab46de..9f1a6f0 100644 --- a/src/pages/home/components/feature.tsx +++ b/src/pages/home/components/feature.tsx @@ -11,7 +11,7 @@ const Feature: FC = () => { {url: '/pages/preview/brand/list/list', image: article, text: '品牌'}, {url: '/pages/preview/health/health', image: health, text: '健康管理'}, {url: '/pages/preview/profession/profession', image: profession, text: '专业技能'}, - {url: '', image: illness, text: '疾病知识'}, + {url: '/pages/preview/illness/sort/sort', image: illness, text: '疾病知识'}, ] function jump(url) { diff --git a/src/pages/home/components/feature_recommended.tsx b/src/pages/home/components/feature_recommended.tsx index 3250dc8..d74dcd6 100644 --- a/src/pages/home/components/feature_recommended.tsx +++ b/src/pages/home/components/feature_recommended.tsx @@ -42,7 +42,12 @@ const FeatureRecommended: FC = () => { detailsUrl: '/pages/preview/videoFull/videoFull', data: [] }, - {title: "疾病知识TOP3", url: '', detailsUrl: '', data: []}, + { + title: "疾病知识TOP3", + url: '/pages/preview/illness/sort/sort', + detailsUrl: '/pages/preview/illness/article/article', + data: [] + }, ]) /** 品牌 */ @@ -94,17 +99,29 @@ const FeatureRecommended: FC = () => { } /** 疾病 */ - async function getIllness() { - const res = await HomeApi.illness(1, 3) - console.log(res) + async function getIllness(): Promise { + try { + const res = await HomeApi.illness(1, 3) + return res.list.map(d => ({ + id: d.id, + imageUrl: '', + description: d.content, + title: d.title, + path: `?id=${d.id}` + })) + } catch (e) { + } + return [] } useEffect(() => { - Promise.all([getBrand(), getHealth(), getKill(), getIllness()]).then(([brand, health, kill]) => { + Promise.all([getBrand(), getHealth(), getKill(), getIllness()]).then(([brand, health, kill, illness]) => { const oldData: Data[] = JSON.parse(JSON.stringify(data)) oldData[0].data = brand oldData[1].data = health oldData[2].data = kill + console.log(illness) + oldData[3].data = illness setData(oldData) }) }, []) diff --git a/src/pages/preview/illness/sort/sort.config.ts b/src/pages/preview/illness/sort/sort.config.ts new file mode 100644 index 0000000..b7d09ab --- /dev/null +++ b/src/pages/preview/illness/sort/sort.config.ts @@ -0,0 +1,3 @@ +export default definePageConfig({ + navigationBarTitleText: '疾病知识', +}) diff --git a/src/pages/preview/illness/sort/sort.module.scss b/src/pages/preview/illness/sort/sort.module.scss new file mode 100644 index 0000000..c0c2030 --- /dev/null +++ b/src/pages/preview/illness/sort/sort.module.scss @@ -0,0 +1,71 @@ +.firstOrder { + width: 300rpx; + height: calc(100vh - env(safe-area-inset-bottom)); + + View { + width: 100%; + text-align: center; + min-height: 100rpx; + color: #323635; + display: flex; + align-items: center; + padding: 10rpx; + box-sizing: border-box; + justify-content: center; + } +} + +/** 选中 */ +.select { + color: #45D4A8 !important; + font-weight: bold; + position: relative; + transition: all 200ms; + + &:after { + content: ''; + display: block; + width: 8rpx; + height: 60rpx; + background: #45D4A8; + position: absolute; + left: 0; + top: 0; + bottom: 0; + margin: auto; + border-radius: 10rpx; + } +} + +.tree { + padding: 0 15rpx; + background: #fff; + box-sizing: border-box; + height: calc(100vh - env(safe-area-inset-bottom)); +} + +.name { + font-size: 32rpx; + font-weight: bold; + color: #323635; + padding: 40rpx 0 40rpx 15rpx; +} + +.secondaryBox { + display: flex; + flex-wrap: wrap; + align-items: flex-start; +} + +.secondary { + width: 50%; + padding: 0 15rpx; + box-sizing: border-box; + color: #323635; + text-align: center; + line-height: 60rpx; + background: #F5F8F7; + border-radius: 8rpx; + margin-bottom: 20rpx; + background-clip: content-box; +} diff --git a/src/pages/preview/illness/sort/sort.tsx b/src/pages/preview/illness/sort/sort.tsx new file mode 100644 index 0000000..c4e9781 --- /dev/null +++ b/src/pages/preview/illness/sort/sort.tsx @@ -0,0 +1,71 @@ +import {ScrollView, View} from "@tarojs/components"; +import {FC, useState} from "react"; +import {Category, HomeApi} from "@/api"; +import Taro from "@tarojs/taro"; +import styles from './sort.module.scss' + +const prefix = 'SORT' +const Sort: FC = () => { + const [data, setData] = useState([]) + const [select, setSelect] = useState(null) + + async function getData() { + const res = await HomeApi.category(3) + setData(res) + if (res.length) { + setSelect(`${prefix}-${res[0].id}`) + } + } + + function jump(id: number) { + console.log(id) + } + + Taro.useLoad(getData) + + return ( + + + { + data.map(d => setSelect(`${prefix}-${d.id}`)} + className={`${select === `${prefix}-${d.id}` && styles.select}`}> + {d.name} + ) + } + + + + { + data.map(d => + {d.name} + + { + d.resource_category?.map(c => jump(d.id)} + key={d.id} + className={styles.secondary}> + {c.name} + ) + } + + + ) + } + + + ) +} + +export default Sort diff --git a/src/static/img/first.png b/src/static/img/first.png index 7aa1044..0883799 100644 Binary files a/src/static/img/first.png and b/src/static/img/first.png differ diff --git a/src/static/img/second.png b/src/static/img/second.png index a225843..1db9813 100644 Binary files a/src/static/img/second.png and b/src/static/img/second.png differ diff --git a/src/static/img/third.png b/src/static/img/third.png index 8226ada..71cefe9 100644 Binary files a/src/static/img/third.png and b/src/static/img/third.png differ diff --git a/types/home.d.ts b/types/home.d.ts index b9b4c4e..8a43aaf 100644 --- a/types/home.d.ts +++ b/types/home.d.ts @@ -5,7 +5,7 @@ interface Health { url_path: string resource: Resource /** 播放量 */ - video_view:number + video_view: number } interface Brand { @@ -28,3 +28,10 @@ interface Kill { title: string url_path: string } + +interface Illness { + id: number + content: string + title: string + thumb:string +}