feat:

1)处理首页新闻tab的顶导数据源；2）处理顶导存在电子报和播报左右切换回归问题

feat:
1)处理首页新闻tab的顶导数据源；2）处理顶导存在电子报和播报左右切换回归问题
liyubing
Commit 2fe43facd4b61bd4d883820b715651464e5be019 2fe43fac 1 parent 3163e86f
Showing 4 changed files with 161 additions and 103 deletions
sight_harmony/features/wdBean/src/main/ets/bean/navigation/TopNavDTO.ets
sight_harmony/features/wdComponent/src/main/ets/components/page/ChannelSubscriptionLayout.ets
sight_harmony/features/wdComponent/src/main/ets/components/page/TopNavigationComponentNew.ets
sight_harmony/products/phone/src/main/ets/pages/view/BottomNavigationComponent.ets
--- a/sight_harmony/features/wdBean/src/main/ets/bean/navigation/TopNavDTO.ets
View file @2fe43fa
+++ b/sight_harmony/features/wdBean/src/main/ets/bean/navigation/TopNavDTO.ets
View file @2fe43fa
@@ -2,26 +2,26 @@
  * 顶导
  */
 export class TopNavDTO {
-  channelId: number = 0;
-  channelStyle: number = 0;
+  channelId: number = 0; //频道id
+  channelStyle: number = 0; //频道样式；1-沉浸式;2-信息流
   channelType: number = 0; // 频道样式；1-沉浸式;2-信息流;3-特殊频道（跳转指定页面的，如版面）
-  defaultPermitted: number = 0;
-  delPermitted: number = 0;
+  defaultPermitted: number = 0; //允许设置为默认首页 0:否, 1:是;【首页设置频道】
+  delPermitted: number = 0; //允许删除 0:否, 1:是；【撤销属性】
   fontCColor: string = ''; // 频道展示样式颜色（选中状态)
   fontColor: string = ''; // 频道展示样式颜色（未选中状态)
-  headlinesOn: number = 0;
-  homeChannel: string = '';
-  iconUrlSize: string = '';
-  iconCUrlSize: string = '';
+  headlinesOn: number = 0; //头条标识 0:否, 1:是；【是否头条=是的频道，固定排序在第一位，且不可移出/移动】
+  homeChannel: string = ''; //必须 是否首页设置；0否，1是
+  iconUrlSize: string = '';  // 选中图片的大小
+  iconCUrlSize: string = ''; // 未选中图片的大小
   iconUrl: string = ''; // 频道图片展示样式图片相对地址（未选中状态)
-  iconCUrl: string = ''; //频道图片展示样式图片相对地址（选中状态
-  localChannel: string = '';
-  moreChannel: string = '';
-  movePermitted: number = 0;
-  myChannel: string = '';
-  name: string = '';
-  num: number = 0;
-  pageId: number = 0;
+  iconCUrl: string = ''; //频道图片展示样式图片相对地址（选中状态）
+  localChannel: string = ''; // 必须 是否地方频道栏目；0否，1是
+  moreChannel: string = ''; // 必须 是否更多栏目；0否，1是
+  movePermitted: number = 0; //允许移动 0:否, 1:是；【位置属性】
+  myChannel: string = '';// 必须 是否我的栏目；0否，1是
+  name: string = ''; //频道名称
+  num: number = 0; //首页设置根据这个排序20230828
+  pageId: number = 0;  //频道关联页面id
   pageType: string = '';
   underlineCColor: string = ''; // 选中下划线颜色
 }
--- a/sight_harmony/features/wdComponent/src/main/ets/components/page/ChannelSubscriptionLayout.ets
View file @2fe43fa
+++ b/sight_harmony/features/wdComponent/src/main/ets/components/page/ChannelSubscriptionLayout.ets
View file @2fe43fa
@@ -12,8 +12,7 @@ const MORE_CHANNEL: string = '更多频道'
 const LOCAL_CHANNEL: string = '地方频道'
 const TAG: string = 'ChannelSubscriptionLayout'
-
-// @Entry
+export { ChannelSubscriptionLayout }
 @Component
 struct ChannelSubscriptionLayout {
   @State indexSettingArray: string [] = ['推荐', '热点']
@@ -41,7 +40,9 @@ struct ChannelSubscriptionLayout {
   aboutToAppear() {
     this.currentTopNavSelectedItem = this.myChannelList[this.currentTopNavSelectedIndex]
     this.myChannelList.forEach(item => {
-      this.channelIds.push(item.channelId)
+      if(item != undefined && item.channelId != undefined){
+        this.channelIds.push(item.channelId)
+      }
     })
   }
@@ -222,7 +223,6 @@ struct ChannelSubscriptionLayout {
       .padding({ bottom: 10 })
       List() {
-
         ListItem() {
           Row() {
             Text(INDEX_SETTING_TITLE)
@@ -515,4 +515,3 @@ struct ChannelSubscriptionLayout {
   }
 }
-export { ChannelSubscriptionLayout }
--- a/sight_harmony/features/wdComponent/src/main/ets/components/page/TopNavigationComponentNew.ets
View file @2fe43fa
+++ b/sight_harmony/features/wdComponent/src/main/ets/components/page/TopNavigationComponentNew.ets
View file @2fe43fa
@@ -11,6 +11,9 @@ import { channelSkeleton } from '../skeleton/channelSkeleton';
 import { ParamType, TrackConstants, Tracking, TrackingButton } from 'wdTracking/Index';
 import DailyPaperTopicModel from '../../model/DailyPaperTopicModel';
 import { CompUtils } from '../../utils/CompUtils';
+import ChannelViewModel from '../../viewmodel/ChannelViewModel';
+import { JSON } from '@kit.ArkTS';
+import text from '@ohos.graphics.text';
 const TAG = 'TopNavigationComponent';
@@ -25,22 +28,28 @@ export struct TopNavigationComponentNew {
   private topRectHeight: string = AppStorage.get<number>('topSafeHeight') + 'px';
   private pageName: string = ''
   private pageId: number = 0
+  readonly MAX_LINE: number = 1; // 顶部tab text最大行数
   private swiperController: SwiperController = new SwiperController()
   private listScroller: Scroller = new Scroller()
   /**
    *  首页 底导 某个tab 对象
    */
   navItem: BottomNavDTO = {} as BottomNavDTO
+  // 背景色
   @Consume barBackgroundColor: Color
-
+  // 首页当前正在哪个tab的索引值
   @Link _currentNavIndex?: number;
+  // 记录首页底部tab 的索引值
+  @State bottomNavIndex: number = 0
   // 顶导当前选中/焦点下标
   @State @Watch('updateCurrentTopNavSelectedIndex') currentTopNavSelectedIndex: number = 0;
   // 顶导数据
   @State @Watch('onTopNavigationDataUpdated') topNavList: TopNavDTO[] = []
+  //
   @State indexSettingChannelId: number = AppStorage.get<number>('indexSettingChannelId') || 2002
   //本地缓存频道id列表
   @State storageChannelIds: string = AppStorage.get<string>('channelIds') || ''
+  // 首页设置的频道信息数组
   @State homeChannelList: TopNavDTO[] = []
   // 我的频道列表
   @State myChannelList: TopNavDTO[] = []
@@ -48,18 +57,14 @@ export struct TopNavigationComponentNew {
   @State moreChannelList: TopNavDTO[] = []
   // 地方频道列表
   @State localChannelList: TopNavDTO[] = []
-  readonly MAX_LINE: number = 1;
   @ObjectLink @Watch('onAssignChannelChange') assignChannel: AssignChannelParam
   // 底导传递过来的自动刷新通知
   @Prop @Watch('onAutoRefresh') autoRefresh: number = 0
   // 传递给page的自动刷新通知
   @State autoRefresh2Page: number = 0
-  // 当前底导index
-  @State bottomNavIndex: number = 0
   @State animationDuration: number = 0
   @State indicatorLeftMargin: number = 0
   @State indicatorWidth: number = 0
-
   @State isClickMorningEveningPaper: boolean = false
   build() {
@@ -70,7 +75,7 @@ export struct TopNavigationComponentNew {
         Swiper(this.swiperController) {
           ForEach(CompUtils.isNews(this.navItem) ? this.myChannelList : this.topNavList,
             (navItem: TopNavDTO, index: number) => {
-              if (CompUtils.isRMH(this.navItem) && navItem.channelType === 3) {
+              if (CompUtils.isRMH(this.navItem) && this.isSpecialChannel(navItem)) {
                 // 人民号 -- 关注tab
                 PeopleShipMainComponent({
                   currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
@@ -79,7 +84,7 @@ export struct TopNavigationComponentNew {
                   channelId: navItem?.channelId + '',
                   autoRefresh: this.autoRefresh2Page
                 })
-              } else
+              } else {
                 if (!this.isBroadcast(navItem) && !this.isLayout(navItem)) {
                   PageComponent({
                     currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
@@ -89,7 +94,9 @@ export struct TopNavigationComponentNew {
                     autoRefresh: this.autoRefresh2Page
                   })
                 } else {
-                channelSkeleton()
+                  channelSkeleton()
+                  //Text('特殊频道').fontColor(Color.Red).fontSize(20).width('100%').height('100%')
+                }
               }
             })
         }
@@ -114,22 +121,55 @@ export struct TopNavigationComponentNew {
             ProcessUtils.gotoBroadcastPage(this.myChannelList[index].pageId)
             let nextIndex = this.currentTopNavSelectedIndex > index ? index - 1 : index + 1
             if (nextIndex < this.myChannelList.length) {
-              this.changePage(nextIndex)
+              // 电子报和播报 相邻
+              if (this.isLayoutByIndex(nextIndex)) {
+                nextIndex = this.currentTopNavSelectedIndex > index ? nextIndex - 1 : nextIndex + 1
+                if (nextIndex < this.myChannelList.length) {
+                  this.changePage(nextIndex)
+                } else {
+                  this.changePage(curIndex)
+                }
+
+              } else {
+                this.changePage(nextIndex)
+              }
+            } else {
+              // 极左极右有特殊频道，用旧值
+              this.changePage(curIndex)
             }
           } else if (this.isLayoutByIndex(index)) {
+            // 跳转到电子报页面
             ProcessUtils.gotoENewsPaper()
+            // 特殊频道遇到则跳转到下一个
             let nextIndex = this.currentTopNavSelectedIndex > index ? index - 1 : index + 1
+
+            Logger.info(TAG, `电子报 :${nextIndex} ${this.myChannelList.length}`);
             if (nextIndex < this.myChannelList.length) {
-              this.changePage(nextIndex)
+
+              // 电子报和播报 相邻
+              if (this.isBroadcastByIndex(nextIndex)) {
+                nextIndex = this.currentTopNavSelectedIndex > index ? nextIndex - 1 : nextIndex + 1
+                if (nextIndex < this.myChannelList.length) {
+                  this.changePage(nextIndex)
+                } else {
+                  this.changePage(curIndex)
+                }
+
+              } else {
+                this.changePage(nextIndex)
+              }
+
+            } else {
+              // 极左极右有特殊频道，用旧值
+              this.changePage(curIndex)
             }
           } else {
-            this.currentTopNavSelectedIndex = index;
-            this.changePage(this.currentTopNavSelectedIndex)
+            this.changePage(index)
           }
         })
-        // .onAnimationEnd((index: number)=>{
-        //   Logger.info(TAG, `onAnimationEnd ${index}`);
-        // })
+        .onAnimationEnd((index: number) => {
+          Logger.info(TAG, `onAnimationEnd ${index}`);
+        })
         .onChange((index) => {
           Logger.info(TAG, `onChange index : ${index}`);
         })
@@ -141,10 +181,14 @@ export struct TopNavigationComponentNew {
     .margin({ top: this.topRectHeight })
   }
+  /**
+   * 新闻tab 头部
+   */
   @Builder
   topBar() {
     Column() {
       Row() {
+
         FirstTabTopSearchComponent()
         Image($r('app.media.icon_ren_min_ri_bao'))
@@ -173,19 +217,12 @@ export struct TopNavigationComponentNew {
         .width(124)
         .onClick(() => {
           //防止多次点击
-          if(!this.isClickMorningEveningPaper) {
+          if (!this.isClickMorningEveningPaper) {
             this.isClickMorningEveningPaper = true;
             let c = setInterval(() => {
               this.isClickMorningEveningPaper = false
             }, 1000);
-            // 早晚报埋点
-            const params: ParamType = {
-              "pageName": this.pageName,
-              "pageId": this.pageId,
-            }
-            Tracking.event("morning_evening_news_click", params)
-
             this.clickMorningEveningPaper()
           }
         })
@@ -282,6 +319,11 @@ export struct TopNavigationComponentNew {
     }
   }
+  /**
+   *  顶部导航栏
+   * @param item
+   * @param index
+   */
   @Builder
   tabBarBuilder(item: TopNavDTO, index: number) {
     Column() {
@@ -411,7 +453,8 @@ export struct TopNavigationComponentNew {
         item.myChannel = '1'
       }
       //频道分类
-      if (item.name !== '播报') { //暂时隐藏播报
+      //TODO 暂时隐藏播报
+      if (item.name !== '播报') {
         if (item.myChannel === '1') {
           _myChannelList.push(item)
         }
@@ -451,28 +494,46 @@ export struct TopNavigationComponentNew {
     }
   }
+  /**
+   *  频道是播报
+   * @param item
+   * @returns
+   */
   private isBroadcast(item?: TopNavDTO): boolean {
-    // TODO 用id channelId = '2066'
-    return item?.name === '播报'
+    return item?.channelId === 2066
   }
+  /**
+   * 频道是电子报
+   * @param item
+   * @returns
+   */
   private isLayout(item?: TopNavDTO): boolean {
-    // TODO 用id channelId = '2006'
-    return item?.name === '版面'
+    return item?.channelId === 2006
   }
+  /**
+   * 检测播报
+   * @param index
+   * @returns
+   */
   private isBroadcastByIndex(index: number): boolean {
     let item = this._currentNavIndex === 0 ? this.myChannelList[index] : this.topNavList[index]
     return this.isBroadcast(item)
   }
+  /**
+   *  检测电子报
+   * @param index
+   * @returns
+   */
   private isLayoutByIndex(index: number): boolean {
     let item = this._currentNavIndex === 0 ? this.myChannelList[index] : this.topNavList[index]
     return this.isLayout(item)
   }
   private isSpecialChannel(item?: TopNavDTO) {
-    // 版面、播报，可以用这个判断
+    // 版面、播报、关注，可以用这个判断
     return item?.channelType === 3
   }
@@ -481,7 +542,8 @@ export struct TopNavigationComponentNew {
     this.topNavListHandle()
     this.changePage(this.currentTopNavSelectedIndex)
-    console.log('XY', '----TopNavigation-------aboutToAppear'+this.navItem.name)
+    console.log('XY', '----TopNavigation-------aboutToAppear' + this.navItem.name)
+    this.getTopNavList(this.navItem.id)
   }
   onTopNavigationDataUpdated() {
@@ -489,14 +551,16 @@ export struct TopNavigationComponentNew {
       `onTopNavigationDataUpdated currentTopNavIndex: ${this.currentTopNavSelectedIndex},topNavList.length:${this.topNavList.length}`);
   }
+  /**
+   *
+   */
   updateCurrentTopNavSelectedIndex() {
-    Logger.info(TAG, `this.navItem 埋点参数topStyle: ${this.navItem.topStyle}`);
-    // 顶部tab埋点
     if (CompUtils.isNews(this.navItem)) {
       const tab = this.myChannelList[this.currentTopNavSelectedIndex]
-      Logger.info(TAG, `新闻tab埋点: ${JSON.stringify(tab)}`);
+      //Logger.info(TAG, `新闻tab埋点: ${JSON.stringify(tab)}`);
+      // 埋点
       const params: ParamType = {
         "pageName": tab.name,
         "tabName": tab.name,
@@ -507,6 +571,7 @@ export struct TopNavigationComponentNew {
       const tab = this.topNavList[this.currentTopNavSelectedIndex]
       Logger.info(TAG, `人民号tab埋点: ${JSON.stringify(tab)}`);
+      // 埋点
       const params: ParamType = {
         "pageName": tab.name,
         "tabName": tab.name,
@@ -516,12 +581,15 @@ export struct TopNavigationComponentNew {
     }
   }
+  /**
+   * 自动刷新方法
+   */
   onAutoRefresh() {
     if (this.bottomNavIndex != this._currentNavIndex) {
       return
     }
     // 通知page刷新
-    this.autoRefresh2Page++
+    this.doAutoRefresh()
   }
   private doAutoRefresh() {
@@ -616,49 +684,34 @@ export struct TopNavigationComponentNew {
     return null
   }
-  // private getTextInfo(index: number): Record<string, number> {
-  //   let strJson = getInspectorByKey(index.toString())
-  //   try {
-  //     let obj: Record<string, string> = JSON.parse(strJson)
-  //     let rectInfo: number[][] = JSON.parse('[' + obj.$rect + ']')
-  //     return { 'left': px2vp(rectInfo[0][0]), 'width': px2vp(rectInfo[1][0] - rectInfo[0][0]) }
-  //   } catch (error) {
-  //     return { 'left': 0, 'width': 0 }
-  //   }
+  //
+  // private startAnimateTo(duration: number, leftMargin: number, width: number) {
+  //   animateTo({
+  //     duration: duration, // 动画时长
+  //     curve: Curve.Linear, // 动画曲线
+  //     iterations: 1, // 播放次数
+  //     playMode: PlayMode.Normal, // 动画模式
+  //     onFinish: () => {
+  //       console.info('play end')
+  //     }
+  //   }, () => {
+  //     this.indicatorLeftMargin = leftMargin
+  //     this.indicatorWidth = width
+  //   })
   // }
-  // private getCurrentIndicatorInfo(index: number, event: TabsAnimationEvent): Record<string, number> {
-  //   let nextIndex = index
-  //   if (index > 0 && event.currentOffset > 0) {
-  //     nextIndex--
-  //   } else if (index < 3 && event.currentOffset < 0) {
-  //     nextIndex++
-  //   }
-  //   let indexInfo = this.getTextInfo(index)
-  //   let nextIndexInfo = this.getTextInfo(nextIndex)
-  //   let swipeRatio = Math.abs(event.currentOffset / this.tabsWidth)
-  //   let currentIndex = swipeRatio > 0.5 ? nextIndex : index // 页面滑动超过一半，tabBar切换到下一页。
-  //   let currentLeft = indexInfo.left + (nextIndexInfo.left - indexInfo.left) * swipeRatio
-  //   let currentWidth = indexInfo.width + (nextIndexInfo.width - indexInfo.width) * swipeRatio
-  //   return { 'index': currentIndex, 'left': currentLeft, 'width': currentWidth }
-  // }
+  /**
+   *  进入早晚报专题
+   */
+  clickMorningEveningPaper() {
-  private startAnimateTo(duration: number, leftMargin: number, width: number) {
-    animateTo({
-      duration: duration, // 动画时长
-      curve: Curve.Linear, // 动画曲线
-      iterations: 1, // 播放次数
-      playMode: PlayMode.Normal, // 动画模式
-      onFinish: () => {
-        console.info('play end')
-      }
-    }, () => {
-      this.indicatorLeftMargin = leftMargin
-      this.indicatorWidth = width
-    })
-  }
+    // 早晚报埋点
+    const params: ParamType = {
+      "pageName": this.pageName,
+      "pageId": this.pageId,
+    }
+    Tracking.event("morning_evening_news_click", params)
-  clickMorningEveningPaper() {
     if (NetworkUtil.isNetConnected()) {
       DailyPaperTopicModel.getDailyPaperTopic().then(dailyPaperTopicBean => {
         if (dailyPaperTopicBean && dailyPaperTopicBean.id > 0) {
@@ -676,4 +729,14 @@ export struct TopNavigationComponentNew {
       ToastUtils.showToast('网络出小差了，请检查网络后重试', 1000)
     }
   }
+
+  //请求顶导数据
+  async getTopNavList(id: number) {
+    let bottomNavDetail = await ChannelViewModel.getBottomNavDetailData(id)
+    let topNavList = bottomNavDetail?.topNavChannelList || []
+    for (let topNav of topNavList) {
+      console.debug(TAG, 'getTopNavList=>' + JSON.stringify(topNav))
+
+    }
+  }
 }
--- a/sight_harmony/products/phone/src/main/ets/pages/view/BottomNavigationComponent.ets
View file @2fe43fa
+++ b/sight_harmony/products/phone/src/main/ets/pages/view/BottomNavigationComponent.ets
View file @2fe43fa
@@ -36,7 +36,7 @@ export struct BottomNavigationComponent {
   @State topSafeHeight: number = AppStorage.get<number>('topSafeHeight') || 0
   @State @Watch('onBottomNavigationDataUpdated') bottomNavList: BottomNavDTO[] = [] // 底导/顶导全部数据
   @State currentNavIndex: number = BottomNavi.NEWS; // 底导当前选中/焦点下标
-  @State topNavList: TopNavDTO[] = []
+ // @State topNavList: TopNavDTO[] = []
   // 底导TabsController
   private navController: TabsController = new TabsController();
   readonly ASPECT_RATIO_1_1: number = 1 / 1; // 底导图片宽高比
@@ -52,8 +52,7 @@ export struct BottomNavigationComponent {
   @State assignChannel: AssignChannelParam = new AssignChannelParam()
   // 自动刷新触发（双击tab自动刷新）
   @State autoRefresh: number = 0
-  // 顶导数据，从接口获取 TODO 顶导业务逻辑没看懂，暂时不替换顶导list。频道管理数据待梳理
- // @State topNavMap: Record<string, TopNavDTO[]> = {}
+
   async aboutToAppear() {
     Logger.info(TAG, `aboutToAppear currentNavIndex: ${this.currentNavIndex}`);
@@ -239,11 +238,7 @@ export struct BottomNavigationComponent {
     // 请求顶导数据(参数）：
   }
-  //请求顶导数据
-  async getTopNavList(id: number) {
-    let bottomNavDetail = await ChannelViewModel.getBottomNavDetailData(id)
-    this.topNavList = bottomNavDetail?.topNavChannelList || []
-  }
+
   onBottomNavigationDataUpdated() {
     Logger.error('yyyy', 'onBottomNavigationDataUpdated ' + JSON.stringify(this.bottomNavList))
@@ -366,7 +361,8 @@ export struct BottomNavigationComponent {
             item.pageName = 'MY';
             break;
           default:
-            item.pageName = 'NEWS'; break;
+            item.pageName = 'NEWS';
+            break;
         }
       })
       this.bottomNavList = list