Toggle navigation
Toggle navigation
This project
Loading...
Sign in
developOne
/
harmonyPool
Go to a project
Toggle navigation
Projects
Groups
Snippets
Help
Toggle navigation pinning
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Network
Create a new issue
Builds
Commits
Authored by
liyubing
2024-06-06 18:24:37 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
113a3889e514b2b9157e3763c3fe582124d89816
113a3889
1 parent
fcc4d58a
feat:
1)优化和整理首页底导和顶导航的业务逻辑
Show whitespace changes
Inline
Side-by-side
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
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)}`);
...
...
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
...
...
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
...
...
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"
...
...
Please
register
or
login
to post a comment