优化细节

src/user/help/index.tsx

@@ -1,23 +1,22 @@
 import {useEffect, useState} from "react";
 import {CmsArticle} from "@/api/cms/cmsArticle/model";
 import {listCmsArticle} from "@/api/cms/cmsArticle";
-import {Collapse} from '@nutui/nutui-react-taro'
+import {Collapse, Image, SearchBar} from '@nutui/nutui-react-taro'
 import {ArrowDown} from '@nutui/icons-react-taro'
+import {CmsNavigation} from "@/api/cms/cmsNavigation/model";
+import {listCmsNavigation} from "@/api/cms/cmsNavigation";
+
 
 const Helper = () => {
   const [list, setList] = useState<CmsArticle[]>([])
+  const [navigation, setNavigation] = useState<CmsNavigation>()
 
-  const [category, setCategory] = useState();
-  const getData = () => {
-    fetch("https://storage.360buyimg.com/nutui/3x/new-categoryData.js")
-      .then((response) => response.json())
-      .then((res) => {
-        setCategory(res.categoryInfo.category)
-      })
-      .catch((err) => console.log("Oh, error", err));
-  };
-
-  const reload = () => {
+  const reload = async () => {
+    const navs = await listCmsNavigation({model: 'help', parentId: 0});
+    if (navs.length > 0) {
+      const nav = navs[0];
+      setNavigation(nav);
+    }
     listCmsArticle({model: 'help'}).then(res => {
       setList(res)
     }).catch(error => {
@@ -26,13 +25,35 @@ const Helper = () => {
   }
 
   useEffect(() => {
-    reload()
-    getData();
+    reload().then()
   }, []);
 
   return (
     <>
-      {/*<Category category={category} showSecondLevelQuickNav={true}></Category>*/}
+      <SearchBar shape="round" maxLength={5} className={'mt-2'} />
+      {navigation && (
+        <Image
+          src={navigation.icon}
+          mode={'scaleToFill'}
+          className={'mt-2 mb-4 w-full'}
+          height={120}
+          lazyLoad={false}
+        />
+      )}
+      {list.map((item, index) => (
+        <Collapse defaultActiveName={['1', '2']} expandIcon={<ArrowDown/>}>
+          <Collapse.Item
+            title={
+              <div className={'flex items-center'}>
+                <div className={'text-sm'}>{item.title}</div>
+              </div>
+            }
+            name={`${index}`}
+          >
+            <div className={'text-sm'}>{item.comments}</div>
+          </Collapse.Item>
+        </Collapse>
+      ))}
     </>
   );
 };