修改疾病分类数据为空展示和页面高度计算

src/app.tsx

@@ -50,6 +50,7 @@ function App(props) {
         safeArea,
         isIos,
         textBarHeight,
+        pageHeight: screenHeight - statusBarHeight - textBarHeight - (screenHeight - (safeArea?.bottom || 0)),
         menu: Taro.getMenuButtonBoundingClientRect(),
       }
     }

src/components/tabs/tabs.tsx

@@ -1,4 +1,4 @@
-import {FC, useEffect, useState} from "react";
+import {CSSProperties, FC, useEffect, useState} from "react";
 import './tabs.scss'
 import {ScrollView, View} from "@tarojs/components";
 import Taro from "@tarojs/taro";
@@ -22,6 +22,7 @@ interface TabsProps {
   height?: number | string
   onChange?: (data: OnChangOpt) => void
   backMode?: boolean // 块级模式
+  style?: CSSProperties
 }
 
 const Tabs: FC<TabsProps> = (opt) => {
@@ -49,7 +50,7 @@ const Tabs: FC<TabsProps> = (opt) => {
 
 
   return (
-    <View className={`tabs ${opt.backMode ? 'tabsBack' : ''}`} style={{height: opt.height}}>
+    <View className={`tabs ${opt.backMode ? 'tabsBack' : ''}`} style={{height: opt.height, ...opt.style}}>
       <ScrollView scrollX scrollLeft={left} scrollWithAnimation showScrollbar={false} style={{height: opt.height}}>
         <View className={'tabs-scroll ' + (opt.tabList.length < 5 ? 'justify-around' : '')}>
           {opt.tabList.map((d, index) => <View

src/pages/my/my.tsx

@@ -39,6 +39,8 @@ const My: FC = () => {
   const [navbarOpacity, setNavbarOpacity] = useState('0')
   const navbarHeight = globalData.statusBarHeight + globalData.textBarHeight;
 
+  console.log(globalData)
+
   Taro.useDidShow(() => {
     token && userApi.companyList().then(res => {
       setCompanyList(res as Company[])

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

@@ -1,14 +1,3 @@
-.scrollView {
-  height: auto !important;
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  width: 100%;
-  margin: auto;
-}
-
 .firstOrder {
   width: 260rpx;
   height: 100%;

src/pages/preview/illness/sort/sort.tsx

@@ -1,13 +1,13 @@
-import {ScrollView, Image, Swiper, SwiperItem, View} from "@tarojs/components";
+import {ScrollView, Swiper, SwiperItem, View} from "@tarojs/components";
-import {CSSProperties, FC, useEffect, useMemo, useState} from "react";
+import {FC, useEffect, useMemo, useState} from "react";
 import {Category, HomeApi} from "@/api";
 import Taro from "@tarojs/taro";
 import styles from './sort.module.scss'
 import Tabs, {TabList} from "@/components/tabs/tabs";
 import {illnessApi} from "@/api/illness";
 import Empty from "@/components/empty/empty";
-import leftArrow from "@/static/img/leftArrow.png"
 import Spin from "@/components/spinner";
+import NavigationBar from "@/components/navigationBar/navigationBar";
 
 const prefix = 'SORT'
 const Sort: FC = () => {
@@ -18,11 +18,9 @@ const Sort: FC = () => {
   const [enable, setEnable] = useState(true)
   const [loading, setLoading] = useState(false)
   const globalData = Taro.getApp().globalData
-  const menu = Taro.getMenuButtonBoundingClientRect()
 
   async function getData() {
     try {
-
       const res = await HomeApi.category(3)
       setData(res)
       if (res.length) {
@@ -46,13 +44,6 @@ const Sort: FC = () => {
     }))
   }, [data])
 
-  const headerStyles: CSSProperties = {
-    paddingTop: globalData.statusBarHeight + 'px',
-    display: 'flex',
-    alignItems: "center",
-    width: menu.left - 10 + 'px',
-  }
-
   function firstIdChange(id: number) {
     setFirstId(id)
     const resource_category = data.find(d => d.id === id)?.resource_category
@@ -82,69 +73,66 @@ const Sort: FC = () => {
     setSecondId(firstData?.resource_category?.[0]?.id)
   }
 
+  const SecondLevel = (category: Category) => {
+    if (!category.resource_category?.length) {
+      return (<Empty name='暂无二级分类'/>)
+    } else {
+      return (
+        <View className='flex' style={{height: `${globalData.pageHeight}px`}}>
+          <ScrollView scrollY className={styles.firstOrder} enhanced showScrollbar={false}>
+            {
+              category.resource_category?.map(d => <View
+                id={`${prefix}-${d.id}`}
+                key={d.id}
+                onClick={() => setSecondId(d.id)}
+                className={secondId === d.id && styles.select}>
+                {d.name}
+              </View>)
+            }
+          </ScrollView>
+          <ScrollView
+            enhanced
+            showScrollbar={false}
+            scrollY
+            className={styles.tree}
+            scrollWithAnimation>
+            {
+              loading ? <Spin enable={loading}/> : <>
+                {
+                  list.length ?
+                    list.map(d => <View className={styles.list} onClick={() => jump(d.id)}>{d.name}</View>)
+                    : <Empty name='暂无数据'/>
+                }
+              </>
+            }
+          </ScrollView>
+        </View>
+      )
+    }
+  }
+
   return (
     <View>
+      <NavigationBar leftNode={<Tabs
+        tabList={getTabList}
+        current={firstId}
+        style={{paddingBottom: '5px'}}
+        onChange={(data) => firstIdChange(data.tab?.value as number)}
+      />}/>
       <Spin enable={enable} overlay/>
-      <View style={headerStyles}>
+      {
-        <View
+        data.length > 0 ? <Swiper
-          className="flex flex-column align-center justify-center"
+            style={{height: `${globalData.pageHeight}px`}}
-          style={{width:globalData.textBarHeight+'px', height: globalData.textBarHeight+'px'}}
+            onChange={swiperChange}
-          onClick={() => Taro.navigateBack()}>
+            current={data.findIndex(d => d.id === firstId)}>
-          <Image
+            {
-            src={leftArrow}
+              data.map(d => <SwiperItem key={d.id}>
-            mode='widthFix'
+                {SecondLevel(d)}
-            className={styles.back}
+              </SwiperItem>)
-          />
+            }
-        </View>
+          </Swiper>
-        <View className="flex">
+          : <Empty name='暂无疾病分类'/>
-          <Tabs
+      }
-            tabList={getTabList}
-            current={firstId}
-            onChange={(data) => firstIdChange(data.tab?.value as number)}
-          />
-          <View className="flex-1" />
-        </View>
-      </View>
-
-
-      <Swiper
-        onChange={swiperChange}
-        className={styles.scrollView}
-        current={data.findIndex(d => d.id === firstId)}
-        style={{top: `${globalData.statusBarHeight + 59}px`}}>
-        {
-          data.map(d => <SwiperItem key={d.id} className='flex'>
-            <ScrollView scrollY className={styles.firstOrder} enhanced showScrollbar={false}>
-              {
-                d.resource_category?.map(d => <View
-                  id={`${prefix}-${d.id}`}
-                  key={d.id}
-                  onClick={() => setSecondId(d.id)}
-                  className={secondId === d.id && styles.select}>
-                  {d.name}
-                </View>)
-              }
-            </ScrollView>
-
-            <ScrollView
-              enhanced
-              showScrollbar={false}
-              scrollY
-              className={styles.tree}
-              scrollWithAnimation>
-              {
-                loading ? <Spin enable={loading}/> : <>
-                  {
-                    list.length ?
-                      list.map(d => <View className={styles.list} onClick={() => jump(d.id)}>{d.name}</View>)
-                      : <Empty name='暂无数据'/>
-                  }
-                </>
-              }
-            </ScrollView>
-          </SwiperItem>)
-        }
-      </Swiper>
     </View>
   )
 }