feat:

1)优化和整理首页底导和顶导航的业务逻辑

feat:
1)优化和整理首页底导和顶导航的业务逻辑
liyubing
Commit 113a3889e514b2b9157e3763c3fe582124d89816 113a3889 1 parent fcc4d58a
Showing 4 changed files with 71 additions and 43 deletions
sight_harmony/features/wdComponent/src/main/ets/components/page/TopNavigationComponentNew.ets
sight_harmony/features/wdComponent/src/main/ets/utils/CompUtils.ets
sight_harmony/products/phone/src/main/ets/pages/view/BottomNavigationComponent.ets
sight_harmony/products/phone/src/main/ets/pages/view/VideoChannelPage.ets
--- a/sight_harmony/features/wdComponent/src/main/ets/components/page/TopNavigationComponentNew.ets
View file @113a388
+++ b/sight_harmony/features/wdComponent/src/main/ets/components/page/TopNavigationComponentNew.ets
View file @113a388
@@ -11,6 +11,7 @@ import { channelSkeleton } from '../skeleton/channelSkeleton';
 import { TrackConstants, TrackingButton } from 'wdTracking/Index';
 import DailyPaperTopicModel from '../../model/DailyPaperTopicModel'
 import { ParamType, Tracking } from 'wdTracking/Index';
+import { CompUtils } from '../../utils/CompUtils';
 const TAG = 'TopNavigationComponent';
@@ -23,27 +24,16 @@ const storage = LocalStorage.getShared();
 @Component
 export struct TopNavigationComponentNew {
   private topRectHeight: string = AppStorage.get<number>('topSafeHeight') + 'px';
-  /**
-   * @deprecated
-   */
-  private groupId: number = 0
-  /**
-   * @deprecated TODO type判断
-   */
-  private currentBottomNavName: string = ''
   private pageName: string = ''
   private pageId: number = 0
   private swiperController: SwiperController = new SwiperController()
   private listScroller: Scroller = new Scroller()
-  @Consume barBackgroundColor: Color
-  /**
-   * @deprecated
-   */
-  @State bottomSafeHeight: number = AppStorage.get<number>('bottomSafeHeight') || 0
   /**
-   * @deprecated
+   *  首页 底导 某个tab 对象
    */
-  @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
+  navItem: BottomNavDTO = {} as BottomNavDTO
+  @Consume barBackgroundColor: Color
+
   @Link _currentNavIndex?: number;
   // 顶导当前选中/焦点下标
   @State @Watch('updateCurrentTopNavSelectedIndex') currentTopNavSelectedIndex: number = 0;
@@ -70,7 +60,6 @@ export struct TopNavigationComponentNew {
   @State animationDuration: number = 0
   @State indicatorLeftMargin: number = 0
   @State indicatorWidth: number = 0
-  private tabsWidth: number = 0
   build() {
     Column() {
@@ -78,9 +67,10 @@ export struct TopNavigationComponentNew {
       RelativeContainer() {
         this.tabBar()
         Swiper(this.swiperController) {
-          ForEach(this.currentBottomNavName === '新闻' ? this.myChannelList : this.topNavList,
+          ForEach(CompUtils.isNews(this.navItem) ? this.myChannelList : this.topNavList,
             (navItem: TopNavDTO, index: number) => {
-              if (this.currentBottomNavName === '人民号' && navItem.name === '关注') {
+              if (CompUtils.isRMH(this.navItem) && navItem.channelType === 3) {
+                // 人民号 -- 关注tab
                 PeopleShipMainComponent({
                   currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
                   navIndex: index,
@@ -203,8 +193,7 @@ export struct TopNavigationComponentNew {
   @Builder
   tabBar() {
-    // TODO 判断是否新闻tab，修改方法（，_currentNavIndex==0 都不对，需要用type）（用topStyle）
-    if (this.currentBottomNavName === '新闻') {
+    if (CompUtils.isNews(this.navItem)) {
       // 顶部搜索、日报logo、早晚报
       this.topBar()
       ChannelSubscriptionLayout({
@@ -233,13 +222,9 @@ export struct TopNavigationComponentNew {
       .listDirection(Axis.Horizontal)
       .scrollBar(BarState.Off)
       .edgeEffect(EdgeEffect.None)
-      .padding({ left: 8, top:0, right: 0 })
+      .padding({ left: 8, top: 0, right: 0 })
       .height($r('app.float.top_tab_bar_height'))
       .backgroundColor(this.barBackgroundColor)
-      .onAreaChange((oldValue: Area, newValue: Area) => {
-        let width = Number.parseFloat(newValue.width.toString())
-        this.tabsWidth = Number.isNaN(width) ? 0 : width
-      })
       .id('tabList')
       .alignRules({
         'top': { 'anchor': 'topBar', 'align': VerticalAlign.Bottom },
@@ -278,10 +263,6 @@ export struct TopNavigationComponentNew {
       .listDirection(Axis.Horizontal)
       .scrollBar(BarState.Off)
       .edgeEffect(EdgeEffect.None)
-      .onAreaChange((oldValue: Area, newValue: Area) => {
-        let width = Number.parseFloat(newValue.width.toString())
-        this.tabsWidth = Number.isNaN(width) ? 0 : width
-      })
       .height($r('app.float.top_tab_bar_height_common'))
       .backgroundColor(this.barBackgroundColor)
       .id('tabList')
@@ -498,10 +479,9 @@ export struct TopNavigationComponentNew {
   }
   updateCurrentTopNavSelectedIndex() {
-    Logger.info(TAG, `currentTopNavSelectedIndex : ${this.currentTopNavSelectedIndex}、${this.currentBottomNavName}`);
     // 顶部tab埋点
-    if (this.currentBottomNavName === '新闻') {
+    if (CompUtils.isVideo(this.navItem)) {
       const tab = this.myChannelList[this.currentTopNavSelectedIndex]
       Logger.info(TAG, `新闻tab埋点: ${JSON.stringify(tab)}`);
@@ -511,7 +491,7 @@ export struct TopNavigationComponentNew {
         "pageId": tab.pageId,
       }
       Tracking.event("home_page_tab_click ", params)
-    } else if (this.currentBottomNavName === '人民号') {
+    } else if (CompUtils.isRMH(this.navItem)) {
       const tab = this.topNavList[this.currentTopNavSelectedIndex]
       Logger.info(TAG, `人民号tab埋点: ${JSON.stringify(tab)}`);
--- a/sight_harmony/features/wdComponent/src/main/ets/utils/CompUtils.ets
View file @113a388
+++ b/sight_harmony/features/wdComponent/src/main/ets/utils/CompUtils.ets
View file @113a388
@@ -32,6 +32,45 @@ export class CompUtils {
   }
   /**
+   *  是视频tab
+   * @param navItem
+   * @returns
+   */
+  static isVideo(navItem: BottomNavDTO) : boolean{
+    if (navItem == null) {
+      return false;
+
+    }
+    return navItem.topStyle === '13';
+  }
+
+  /**
+   *  是新闻tab
+   * @param navItem
+   * @returns
+   */
+  static isNews(navItem: BottomNavDTO) : boolean{
+    if (navItem == null) {
+      return false;
+
+    }
+    return navItem.topStyle === '11';
+  }
+
+  /**
+   *  是人民号tab
+   * @param navItem
+   * @returns
+   */
+  static isRMH(navItem: BottomNavDTO) : boolean{
+    if (navItem == null) {
+      return false;
+
+    }
+    return navItem.topStyle === '12';
+  }
+
+  /**
    * 获取Label标题
    *
    * @param component 组件bean
--- a/sight_harmony/products/phone/src/main/ets/pages/view/BottomNavigationComponent.ets
View file @113a388
+++ b/sight_harmony/products/phone/src/main/ets/pages/view/BottomNavigationComponent.ets
View file @113a388
@@ -81,7 +81,7 @@ export struct BottomNavigationComponent {
             if (CompUtils.isMine(navItem)) {
               // 我的页面组件数据列表
               MinePageComponent({ isMinePage: this.currentNavIndex === this.bottomNavList.length - 1 })
-            } else if (navItem.name === '视频') {
+            } else if (CompUtils.isVideo(navItem)) {
               // 视频频道，包含视频和直播
               VideoChannelPage({
                 topNavList: navItem.topNavChannelList.filter(item => item.channelId != 2073),
@@ -89,14 +89,14 @@ export struct BottomNavigationComponent {
                 autoRefresh: this.autoRefresh
               })
             } else {
+              // 其它带顶到的页面，如 新闻、人民号、服务
               TopNavigationComponentNew({
-                groupId: navItem.id,
                 topNavList: navItem.topNavChannelList.filter(item => item.channelId != 2073),
                 _currentNavIndex: $currentNavIndex,
                 bottomNavIndex: index,
-                currentBottomNavName: navItem.name,
                 assignChannel: this.assignChannel,
-                autoRefresh: this.autoRefresh
+                autoRefresh: this.autoRefresh,
+                navItem: navItem
               })
             }
           }
@@ -246,7 +246,7 @@ export struct BottomNavigationComponent {
   }
   onBottomNavigationDataUpdated() {
-    Logger.error('yyyy','onBottomNavigationDataUpdated '+JSON.stringify(this.bottomNavList))
+    Logger.error('yyyy', 'onBottomNavigationDataUpdated ' + JSON.stringify(this.bottomNavList))
     // Logger.info(TAG, `onBottomNavigationDataUpdated currentNavIndex: ${this.currentNavIndex},length:${this.bottomNavItemList.length}`);
   }
@@ -353,11 +353,20 @@ export struct BottomNavigationComponent {
       list = list.filter(item => item.name !== '服务');
       list.forEach(item => {
         switch (item.name) {
-          case '新闻': item.pageName = 'NEWS'; break;
-          case '人民号': item.pageName = 'PEOPLE'; break;
-          case '视频': item.pageName = 'VIDEOS'; break;
-          case '我的': item.pageName = 'MY'; break;
-          default : item.pageName = 'NEWS'; break;
+          case '新闻':
+            item.pageName = 'NEWS';
+            break;
+          case '人民号':
+            item.pageName = 'PEOPLE';
+            break;
+          case '视频':
+            item.pageName = 'VIDEOS';
+            break;
+          case '我的':
+            item.pageName = 'MY';
+            break;
+          default:
+            item.pageName = 'NEWS'; break;
         }
       })
       this.bottomNavList = list
--- a/sight_harmony/products/phone/src/main/ets/pages/view/VideoChannelPage.ets
View file @113a388
+++ b/sight_harmony/products/phone/src/main/ets/pages/view/VideoChannelPage.ets
View file @113a388
@@ -58,7 +58,7 @@ export struct VideoChannelPage {
    * TODO:根据顶导配置获取颜色展示效果不对，待确认
    */
   getTopNavFontColor(item: TopNavDTO, index: number): Color | string {
-    if (item.name === '视频' && this.currentBottomNavInfo.name === '视频') {
+    if (item.channelStyle === 1) {
       return this.currentTopNavSelectedIndex === index ? Color.White : '#949494'
     } else {
       return this.currentTopNavSelectedIndex === index ? Color.Black : "#B2B2B2"