desc:首页搜索 滚动

+{
+  "code": "0",
+  "data": [
+    "习语",
+    "党史学习",
+    "高考倒计时"
+  ],
+  "message": "Success",
+  "success": true,
+  "timestamp": 1712562841885
+}

@@ -5,6 +5,7 @@ import { BottomNavDTO } from '../../repository/bean/BottomNavDTO';
 import { UIUtils } from '../../repository/UIUtils';
 import { UIUtils } from '../../repository/UIUtils';
 import { MinePageComponent } from './MinePageComponent';
 import { MinePageComponent } from './MinePageComponent';
 import PageViewModel from '../../viewmodel/PageViewModel';
 import PageViewModel from '../../viewmodel/PageViewModel';
+import { FirstTabTopComponent } from './FirstTabTopComponent';
 
 
 const TAG = 'BottomNavigationComponent';
 const TAG = 'BottomNavigationComponent';
 
 
@@ -51,6 +52,9 @@ export struct BottomNavigationComponent {
               // 我的页面组件数据列表
               // 我的页面组件数据列表
               MinePageComponent()
               MinePageComponent()
             } else {
             } else {
+              if(index === 0 ){
+                FirstTabTopComponent()
+              }
               TopNavigationComponent({ topNavList: navItem.topNavChannelList })
               TopNavigationComponent({ topNavList: navItem.topNavChannelList })
             }
             }
           }
           }

+import SearcherAboutDataModel from '../../model/SearcherAboutDataModel'
+/**
+ * 首页顶部搜索导航栏
+ * 竖向滚动实现方案
+ * 方案一 使用动画 + 定时器
+ * 方案二 使用容器组件Swiper（当前）
+ */
+const TAG = "FirstTabTopComponent"
+@Component
+export struct FirstTabTopComponent{
+  @State searchTextData :string[] = []
+  private swiperController: SwiperController = new SwiperController()
+
+  aboutToAppear(){
+    this.getSearchHint()
+  }
+
+  getSearchHint(){
+    SearcherAboutDataModel.getSearchHintData(getContext(this)).then((value)=>{
+      if(value!=null){
+        this.searchTextData = value
+      }
+    }).catch((err:Error)=>{
+      console.log(TAG,JSON.stringify(err))
+    })
+  }
+
+  build(){
+    Column(){
+        Row(){
+          Row(){
+            Image($r('app.media.search_icon'))
+              .objectFit(ImageFit.Cover)
+              .height('23lpx')
+              .width('23lpx')
+              .margin({right:'13lpx'})
+              .interpolation(ImageInterpolation.Medium)
+
+            if(this.searchTextData!=null && this.searchTextData.length>0){
+              Swiper(this.swiperController) {
+                ForEach(this.searchTextData, (item: string, index: number ) => {
+                  Text(item)
+                    .fontWeight('400lpx')
+                    .fontSize('25lpx')
+                    .fontColor($r('app.color.color_666666'))
+                    .lineHeight('35lpx')
+                    .textAlign(TextAlign.Start)
+                    .maxLines(1)
+                    .textOverflow({ overflow: TextOverflow.Clip})
+                })
+              }
+              .loop(true)
+              .autoPlay(true)
+              .interval(3000)
+              .indicator(false)
+              .vertical(true)
+            }
+          }.width('257lpx')
+          .height('61lpx')
+          .padding({left:'31lpx'})
+          .backgroundImage($r('app.media.top_search_bg'))
+          .backgroundImageSize(ImageSize.Cover)
+          .alignItems(VerticalAlign.Center)
+
+          Image($r('app.media.top_title_bg'))
+            .objectFit(ImageFit.Auto)
+            .height('58lpx')
+            .width('152lpx')
+            .interpolation(ImageInterpolation.Medium)
+
+          Row(){
+            Text("早晚报")
+          }.backgroundImage($r('app.media.top_right_bg'))
+          .justifyContent(FlexAlign.Center)
+          .backgroundImageSize(ImageSize.Cover)
+          .width('257lpx')
+          .height('61lpx')
+        }.width('100%')
+      .justifyContent(FlexAlign.SpaceBetween)
+    }.height('73lpx')
+    .width('100%')
+    .justifyContent(FlexAlign.End)
+    .backgroundColor($r('app.color.white'))
+  }
+
+}

+
+import { Logger, ResourcesUtils } from 'wdKit';
+import { ResponseDTO, WDHttp } from 'wdNetwork';
+import HashMap from '@ohos.util.HashMap';
+import { HttpUrlUtils } from '../network/HttpUrlUtils';
+const TAG = "SearcherAboutDataModel"
+
+/**
+ * 我的页面 所有数据 获取封装类
+ */
+class SearcherAboutDataModel{
+  private static instance: SearcherAboutDataModel;
+
+  private constructor() { }
+
+  /**
+   * 单例模式
+   * @returns
+   */
+  public static getInstance(): SearcherAboutDataModel {
+    if (!SearcherAboutDataModel.instance) {
+      SearcherAboutDataModel.instance = new SearcherAboutDataModel();
+    }
+    return SearcherAboutDataModel.instance;
+  }
+
+  /**
+   * 首页 搜索提示滚动内容
+   */
+  getSearchHintData(context: Context): Promise<string[]> {
+    return new Promise<string[]>((success, error) => {
+      Logger.info(TAG, `getSearchHintData start`);
+      this.fetchSearchHintData().then((navResDTO: ResponseDTO<string[]>) => {
+        if (!navResDTO || navResDTO.code != 0) {
+          success(this.getSearchHintDataLocal(context))
+          return
+        }
+        Logger.info(TAG, "getSearchHintData then,SearchHintDataResDTO.timeStamp:" + navResDTO.timestamp);
+        let navigationBean = navResDTO.data as string[]
+        success(navigationBean);
+      }).catch((err: Error) => {
+        Logger.error(TAG, `fetchSearchHintData catch, error.name : ${err.name},  error.message:${err.message}`);
+        success(this.getSearchHintDataLocal(context))
+      })
+    })
+  }
+
+  fetchSearchHintData() {
+    let url = HttpUrlUtils.getSearchHintDataUrl()
+    let headers: HashMap<string, string> = HttpUrlUtils.getYcgCommonHeaders();
+    return WDHttp.get<ResponseDTO<string[]>>(url, headers)
+  };
+
+  async getSearchHintDataLocal(context: Context): Promise<string[]> {
+    Logger.info(TAG, `getSearchHintDataLocal start`);
+    let compRes: ResponseDTO<string[]> | null = await ResourcesUtils.getResourcesJson<ResponseDTO<string[]>>('search_hint_data.json' ,context);
+    if (!compRes || !compRes.data) {
+      Logger.info(TAG, `getSearchHintDataLocal compRes  is empty`);
+      return []
+    }
+    Logger.info(TAG, `getSearchHintDataLocal compRes : ${JSON.stringify(compRes)}`);
+    return compRes.data
+  }
+
+
+
+}
+
+const searcherAboutDataModel = SearcherAboutDataModel.getInstance()
+export default searcherAboutDataModel as SearcherAboutDataModel

@@ -116,6 +116,11 @@ export class HttpUrlUtils {
    */
    */
   static readonly APPOINTMENT_OPERATION_STATUS_PATH: string = "/api/live-center-message/zh/c/live/subscribe";
   static readonly APPOINTMENT_OPERATION_STATUS_PATH: string = "/api/live-center-message/zh/c/live/subscribe";
 
 
+  /**
+   * 首页 搜索提示
+   */
+  static readonly SEARCH_HINT_DATA_PATH: string = "/api/rmrb-search-api/zh/c/hints";
+
   private static hostUrl: string = HttpUrlUtils.HOST_UAT;
   private static hostUrl: string = HttpUrlUtils.HOST_UAT;
 
 
   static getCommonHeaders(): HashMap<string, string> {
   static getCommonHeaders(): HashMap<string, string> {
@@ -298,6 +303,11 @@ export class HttpUrlUtils {
     return url
     return url
   }
   }
 
 
+  static getSearchHintDataUrl() {
+    let url = HttpUrlUtils.HOST_SIT + HttpUrlUtils.SEARCH_HINT_DATA_PATH
+    return url
+  }
+
 
 
   /**
   /**
    * 点赞操作
    * 点赞操作