developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
yuzhilin
c8955c68 1 parent e6127b79

tab数据处理

Inline Side-by-side
Showing 3 changed files with 74 additions and 327 deletions
@@ -13,15 +13,14 @@ const LOCAL_CHANNEL: string = '地方频道' @@ -13,15 +13,14 @@ const LOCAL_CHANNEL: string = '地方频道'
13 struct ChannelDialog { 13 struct ChannelDialog {
14 @State indexSettingTabIndex: number = 1 14 @State indexSettingTabIndex: number = 1
15 @State isEditIng: boolean = false 15 @State isEditIng: boolean = false
16 - @Link currentTopNavSelectedIndex : number  
17 - @Link myChannelList: Array<TopNavDTO>  
18 - @Link moreChannelList: Array<TopNavDTO>  
19 - @Link localChannelList: Array<TopNavDTO>  
20 - @Link indexSettingArray: Array<string>  
21 - @Link topNavList: Array<TopNavDTO> 16 + @Link currentTopNavSelectedIndex: number
  17 + @Link myChannelList: TopNavDTO[]
  18 + @Link moreChannelList: TopNavDTO[]
  19 + @Link localChannelList: TopNavDTO[]
  20 + @Link indexSettingArray: string[]
  21 + controller?: CustomDialogController
22 myChannelItemEditHandle = (index: number): void => { 22 myChannelItemEditHandle = (index: number): void => {
23 let item = this.myChannelList.splice(index, 1)[0] 23 let item = this.myChannelList.splice(index, 1)[0]
24 - console.info(`itemitemitem${JSON.stringify(item)}`)  
25 if (item.moreChannel === '1') { 24 if (item.moreChannel === '1') {
26 this.moreChannelList.unshift(item) 25 this.moreChannelList.unshift(item)
27 } 26 }
@@ -29,7 +28,6 @@ struct ChannelDialog { @@ -29,7 +28,6 @@ struct ChannelDialog {
29 this.localChannelList.unshift(item) 28 this.localChannelList.unshift(item)
30 } 29 }
31 } 30 }
32 - controller?: CustomDialogController  
33 31
34 build() { 32 build() {
35 Column() { 33 Column() {
@@ -108,7 +106,7 @@ struct ChannelDialog { @@ -108,7 +106,7 @@ struct ChannelDialog {
108 Row() { 106 Row() {
109 Text(item.name) 107 Text(item.name)
110 .fontSize(14) 108 .fontSize(14)
111 - .fontColor( this.currentTopNavSelectedIndex === index ? '#ED2800' : (item.homeChannel === '1' ? '#999999' : '#222222')) 109 + .fontColor(this.currentTopNavSelectedIndex === index ? '#ED2800' : (item.homeChannel === '1' ? '#999999' : '#222222'))
112 110
113 if (this.isEditIng && item.myChannel !== '1') { 111 if (this.isEditIng && item.myChannel !== '1') {
114 Image($r('app.media.icon_audio_close')) 112 Image($r('app.media.icon_audio_close'))
@@ -122,10 +120,11 @@ struct ChannelDialog { @@ -122,10 +120,11 @@ struct ChannelDialog {
122 .backgroundColor(item.homeChannel === '1' ? '#F5F5F5' : '') 120 .backgroundColor(item.homeChannel === '1' ? '#F5F5F5' : '')
123 .onClick(() => { 121 .onClick(() => {
124 if (this.isEditIng) { 122 if (this.isEditIng) {
125 - if(item.myChannel !== '1'){ 123 + if (item.myChannel !== '1') {
126 this.myChannelItemEditHandle(index) 124 this.myChannelItemEditHandle(index)
127 } 125 }
128 - }else{ 126 + } else {
  127 + this.currentTopNavSelectedIndex = index
129 this.controller?.close() 128 this.controller?.close()
130 } 129 }
131 }) 130 })
@@ -234,306 +233,35 @@ struct ChannelDialog { @@ -234,306 +233,35 @@ struct ChannelDialog {
234 .padding(16) 233 .padding(16)
235 .backgroundColor('#ffffff') 234 .backgroundColor('#ffffff')
236 } 235 }
237 -  
238 - onTopNavigationDataUpdated() {  
239 - }  
240 } 236 }
241 237
242 -@Entry  
243 @Component 238 @Component
244 struct ChannelSubscriptionLayout { 239 struct ChannelSubscriptionLayout {
  240 + @State indexSettingArray: string [] = ['推荐', '热点']
245 //当前选中的频道 241 //当前选中的频道
246 - @Prop currentTopNavSelectedIndex?: number; 242 + @Link currentTopNavSelectedIndex: number;
  243 + @Link myChannelList: TopNavDTO []
  244 + @Link moreChannelList: TopNavDTO []
  245 + @Link localChannelList: TopNavDTO []
247 246
248 - @State indexSettingArray: Array<string> = ['推荐', '热点']  
249 - @State myChannelList: Array<TopNavDTO> = [  
250 - // {  
251 - // channelId: 0,  
252 - // channelStyle: 1,  
253 - // channelType: 1,  
254 - // defaultPermitted: 1,  
255 - // delPermitted: 1,  
256 - // fontCColor: '#000000',  
257 - // fontColor: '#000000',  
258 - // headlinesOn: 0,  
259 - // homeChannel: '1',  
260 - // iconCUrl: '',  
261 - // iconCUrlSize: '',  
262 - // iconUrl: '',  
263 - // iconUrlSize: '',  
264 - // localChannel: '',  
265 - // moreChannel: '',  
266 - // movePermitted: 0,  
267 - // myChannel: '1',  
268 - // name: '推荐',  
269 - // num: 0,  
270 - // pageId: 21212,  
271 - // pageType: '',  
272 - // underlineCColor: ''  
273 - // },  
274 - // {  
275 - // channelId: 1,  
276 - // channelStyle: 1,  
277 - // channelType: 1,  
278 - // defaultPermitted: 1,  
279 - // delPermitted: 1,  
280 - // fontCColor: '#000000',  
281 - // fontColor: '#000000',  
282 - // headlinesOn: 0,  
283 - // homeChannel: '1',  
284 - // iconCUrl: '',  
285 - // iconCUrlSize: '',  
286 - // iconUrl: '',  
287 - // iconUrlSize: '',  
288 - // localChannel: '',  
289 - // moreChannel: '',  
290 - // movePermitted: 0,  
291 - // myChannel: '1',  
292 - // name: '热点',  
293 - // num: 0,  
294 - // pageId: 21212,  
295 - // pageType: '',  
296 - // underlineCColor: ''  
297 - // },  
298 - // {  
299 - // channelId: 2,  
300 - // channelStyle: 1,  
301 - // channelType: 1,  
302 - // defaultPermitted: 1,  
303 - // delPermitted: 1,  
304 - // fontCColor: '#000000',  
305 - // fontColor: '#000000',  
306 - // headlinesOn: 0,  
307 - // homeChannel: '',  
308 - // iconCUrl: '',  
309 - // iconCUrlSize: '',  
310 - // iconUrl: '',  
311 - // iconUrlSize: '',  
312 - // localChannel: '',  
313 - // moreChannel: '',  
314 - // movePermitted: 0,  
315 - // myChannel: '1',  
316 - // name: '视频',  
317 - // num: 0,  
318 - // pageId: 21212,  
319 - // pageType: '',  
320 - // underlineCColor: ''  
321 - // },  
322 - // {  
323 - // channelId: 3,  
324 - // channelStyle: 1,  
325 - // channelType: 1,  
326 - // defaultPermitted: 1,  
327 - // delPermitted: 1,  
328 - // fontCColor: '#000000',  
329 - // fontColor: '#000000',  
330 - // headlinesOn: 0,  
331 - // homeChannel: '',  
332 - // iconCUrl: '',  
333 - // iconCUrlSize: '',  
334 - // iconUrl: '',  
335 - // iconUrlSize: '',  
336 - // localChannel: '',  
337 - // moreChannel: '',  
338 - // movePermitted: 0,  
339 - // myChannel: '1',  
340 - // name: '云课堂',  
341 - // num: 0,  
342 - // pageId: 21212,  
343 - // pageType: '',  
344 - // underlineCColor: ''  
345 - // },  
346 - ]  
347 - @State moreChannelList: Array<TopNavDTO> = [  
348 - // {  
349 - // channelId: 4,  
350 - // channelStyle: 1,  
351 - // channelType: 1,  
352 - // defaultPermitted: 1,  
353 - // delPermitted: 1,  
354 - // fontCColor: '#000000',  
355 - // fontColor: '#000000',  
356 - // headlinesOn: 0,  
357 - // homeChannel: '',  
358 - // iconCUrl: '',  
359 - // iconCUrlSize: '',  
360 - // iconUrl: '',  
361 - // iconUrlSize: '',  
362 - // localChannel: '',  
363 - // moreChannel: '1',  
364 - // movePermitted: 0,  
365 - // myChannel: '',  
366 - // name: '房产',  
367 - // num: 0,  
368 - // pageId: 21212,  
369 - // pageType: '',  
370 - // underlineCColor: ''  
371 - // },  
372 - // {  
373 - // channelId: 5,  
374 - // channelStyle: 1,  
375 - // channelType: 1,  
376 - // defaultPermitted: 1,  
377 - // delPermitted: 1,  
378 - // fontCColor: '#000000',  
379 - // fontColor: '#000000',  
380 - // headlinesOn: 0,  
381 - // homeChannel: '',  
382 - // iconCUrl: '',  
383 - // iconCUrlSize: '',  
384 - // iconUrl: '',  
385 - // iconUrlSize: '',  
386 - // localChannel: '',  
387 - // moreChannel: '1',  
388 - // movePermitted: 0,  
389 - // myChannel: '',  
390 - // name: '生态',  
391 - // num: 0,  
392 - // pageId: 21212,  
393 - // pageType: '',  
394 - // underlineCColor: ''  
395 - // },  
396 - // {  
397 - // channelId: 6,  
398 - // channelStyle: 1,  
399 - // channelType: 1,  
400 - // defaultPermitted: 1,  
401 - // delPermitted: 1,  
402 - // fontCColor: '#000000',  
403 - // fontColor: '#000000',  
404 - // headlinesOn: 0,  
405 - // homeChannel: '',  
406 - // iconCUrl: '',  
407 - // iconCUrlSize: '',  
408 - // iconUrl: '',  
409 - // iconUrlSize: '',  
410 - // localChannel: '',  
411 - // moreChannel: '1',  
412 - // movePermitted: 0,  
413 - // myChannel: '',  
414 - // name: '健康',  
415 - // num: 0,  
416 - // pageId: 21212,  
417 - // pageType: '',  
418 - // underlineCColor: ''  
419 - // }  
420 - ]  
421 - @State localChannelList: Array<TopNavDTO> = [  
422 - // {  
423 - // channelId: 7,  
424 - // channelStyle: 1,  
425 - // channelType: 1,  
426 - // defaultPermitted: 1,  
427 - // delPermitted: 1,  
428 - // fontCColor: '#000000',  
429 - // fontColor: '#000000',  
430 - // headlinesOn: 0,  
431 - // homeChannel: '',  
432 - // iconCUrl: '',  
433 - // iconCUrlSize: '',  
434 - // iconUrl: '',  
435 - // iconUrlSize: '',  
436 - // localChannel: '1',  
437 - // moreChannel: '',  
438 - // movePermitted: 0,  
439 - // myChannel: '',  
440 - // name: '北京',  
441 - // num: 0,  
442 - // pageId: 21212,  
443 - // pageType: '',  
444 - // underlineCColor: ''  
445 - // },  
446 - // {  
447 - // channelId: 8,  
448 - // channelStyle: 1,  
449 - // channelType: 1,  
450 - // defaultPermitted: 1,  
451 - // delPermitted: 1,  
452 - // fontCColor: '#000000',  
453 - // fontColor: '#000000',  
454 - // headlinesOn: 0,  
455 - // homeChannel: '',  
456 - // iconCUrl: '',  
457 - // iconCUrlSize: '',  
458 - // iconUrl: '',  
459 - // iconUrlSize: '',  
460 - // localChannel: '1',  
461 - // moreChannel: '',  
462 - // movePermitted: 0,  
463 - // myChannel: '',  
464 - // name: '上海',  
465 - // num: 0,  
466 - // pageId: 21212,  
467 - // pageType: '',  
468 - // underlineCColor: ''  
469 - // },  
470 - // {  
471 - // channelId: 9,  
472 - // channelStyle: 1,  
473 - // channelType: 1,  
474 - // defaultPermitted: 1,  
475 - // delPermitted: 1,  
476 - // fontCColor: '#000000',  
477 - // fontColor: '#000000',  
478 - // headlinesOn: 0,  
479 - // homeChannel: '',  
480 - // iconCUrl: '',  
481 - // iconCUrlSize: '',  
482 - // iconUrl: '',  
483 - // iconUrlSize: '',  
484 - // localChannel: '1',  
485 - // moreChannel: '',  
486 - // movePermitted: 0,  
487 - // myChannel: '',  
488 - // name: '江苏',  
489 - // num: 0,  
490 - // pageId: 21212,  
491 - // pageType: '',  
492 - // underlineCColor: ''  
493 - // }  
494 - ]  
495 - // 顶导数据  
496 - @State topNavList: TopNavDTO[] = []  
497 dialogController: CustomDialogController | null = new CustomDialogController({ 247 dialogController: CustomDialogController | null = new CustomDialogController({
498 builder: ChannelDialog({ 248 builder: ChannelDialog({
499 - currentTopNavSelectedIndex:this.currentTopNavSelectedIndex,  
500 - indexSettingArray: this.indexSettingArray,  
501 - topNavList: this.topNavList,  
502 - myChannelList: this.myChannelList,  
503 - moreChannelList: this.moreChannelList,  
504 - localChannelList: this.localChannelList, 249 + currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
  250 + indexSettingArray: $indexSettingArray,
  251 + myChannelList: $myChannelList,
  252 + moreChannelList: $moreChannelList,
  253 + localChannelList: $localChannelList
505 }), 254 }),
506 - cancel: this.exitApp,  
507 alignment: DialogAlignment.TopEnd, 255 alignment: DialogAlignment.TopEnd,
508 customStyle: true, 256 customStyle: true,
509 }) 257 })
510 - aboutToAppear() {  
511 - this.topNavList.forEach((item,index)=>{  
512 - if(item.myChannel === '1'){  
513 - this.myChannelList.push(item)  
514 - }  
515 - if(item.moreChannel === '1'){  
516 - this.moreChannelList.push(item)  
517 - }  
518 - if(item.localChannel === '1'){  
519 - this.localChannelList.push(item)  
520 - }  
521 - })  
522 - }  
523 - aboutToDisappear() {  
524 - this.dialogController = null // 将dialogController置空  
525 - }  
526 258
527 - onCancel() {  
528 - console.info('Callback when the first button is clicked')  
529 - } 259 + aboutToAppear() {
530 260
531 - onAccept() {  
532 - console.info('Callback when the second button is clicked')  
533 } 261 }
534 262
535 - exitApp() {  
536 - console.info('Click the callback in the blank area') 263 + aboutToDisappear() {
  264 + this.dialogController = null // 将dialogController置空
537 } 265 }
538 266
539 build() { 267 build() {
@@ -101,6 +101,7 @@ export struct PageComponent { @@ -101,6 +101,7 @@ export struct PageComponent {
101 } 101 }
102 102
103 onChange() { 103 onChange() {
  104 + Logger.info(TAG, `onChangezz id: ${this.pageId} , ${this.channelId} , ${this.navIndex} , navIndex: ${this.currentTopNavSelectedIndex}`);
104 if (this.navIndex === this.currentTopNavSelectedIndex) { 105 if (this.navIndex === this.currentTopNavSelectedIndex) {
105 this.getData(); 106 this.getData();
106 } 107 }
@@ -17,46 +17,63 @@ export struct TopNavigationComponent { @@ -17,46 +17,63 @@ export struct TopNavigationComponent {
17 // 顶导数据 17 // 顶导数据
18 @State @Watch('onTopNavigationDataUpdated') topNavList: TopNavDTO[] = [] 18 @State @Watch('onTopNavigationDataUpdated') topNavList: TopNavDTO[] = []
19 @State compList: LazyDataSource<CompDTO> = new LazyDataSource(); 19 @State compList: LazyDataSource<CompDTO> = new LazyDataSource();
20 - @State handledTopNavList: TopNavDTO[] = [] 20 + //我的频道id缓存列表
  21 + @State channelIds: number[] = []
  22 + // 我的频道列表
  23 + @State myChannelList: TopNavDTO[] = []
  24 + // 更多频道列表
  25 + @State moreChannelList: TopNavDTO[] = []
  26 + // 地方频道列表
  27 + @State localChannelList: TopNavDTO[] = []
21 readonly MAX_LINE: number = 1; 28 readonly MAX_LINE: number = 1;
22 29
23 topNavListHandle() { 30 topNavListHandle() {
24 let defaultMyChannelList: TopNavDTO[] = [] 31 let defaultMyChannelList: TopNavDTO[] = []
25 - this.handledTopNavList = [...this.topNavList]  
26 - this.handledTopNavList.sort((a, b) => { 32 + let handledTopNavList = [...this.topNavList]
  33 + handledTopNavList.sort((a, b) => {
27 return a.num - b.num; 34 return a.num - b.num;
28 }); 35 });
29 - Logger.info(TAG, `aboutToAppear this.handledTopNavListsort : ${JSON.stringify(this.handledTopNavList)}`);  
30 - for (let i = 0; i < this.handledTopNavList.length; i++) {  
31 - if (this.handledTopNavList[i].defaultPermitted === 0 || this.handledTopNavList[i].movePermitted === 0 || this.handledTopNavList[i].delPermitted === 0 || this.handledTopNavList[i].headlinesOn === 1) {  
32 - defaultMyChannelList.push(this.handledTopNavList.splice(i, 1)[0]); 36 + handledTopNavList.forEach(item => {
  37 + if (item.defaultPermitted === 1 || item.movePermitted === 0 || item.delPermitted === 0 || item.headlinesOn === 1) {
  38 + defaultMyChannelList.push(item);
33 } 39 }
34 - } 40 + })
  41 + defaultMyChannelList.forEach(item => {
  42 + item.myChannel = '1'
  43 + if (item.defaultPermitted === 1) {
  44 + item.homeChannel = '1'
  45 + }
  46 + let index = handledTopNavList.findIndex(_item => _item.channelId === item.channelId)
  47 + if (index !== -1) {
  48 + handledTopNavList.splice(index, 1)
  49 + }
  50 + })
35 51
36 - Logger.info(TAG, `aboutToAppear defaultMyChannelListsort : ${JSON.stringify(defaultMyChannelList)}`); 52 + handledTopNavList.unshift(...defaultMyChannelList)
  53 + handledTopNavList.forEach((item, index) => {
  54 + if (item.channelType === 2) {
  55 + item.localChannel = '1'
  56 + }
  57 + if (index >= 11) {
  58 + if (item.channelType === 1) {
  59 + item.moreChannel = '1'
  60 + }
  61 + } else {
  62 + if (item.channelType === 1 && item.myChannel !== '1') {
  63 + item.moreChannel = '1'
  64 + }
  65 + }
37 66
38 - for (const element of defaultMyChannelList) {  
39 - element.myChannel = '1'  
40 - if (element.defaultPermitted === 1) {  
41 - element.homeChannel = '1' 67 + if (item.myChannel === '1') {
  68 + this.myChannelList.push(item)
42 } 69 }
43 - }  
44 - this.handledTopNavList.unshift(...defaultMyChannelList)  
45 - for (let i = 0; i < this.handledTopNavList.length; i++) {  
46 - if(this.handledTopNavList[i].channelType === 2){  
47 - this.handledTopNavList[i].localChannel = '1' 70 + if (item.moreChannel === '1') {
  71 + this.moreChannelList.push(item)
48 } 72 }
49 - if(i>=11){  
50 - if(this.handledTopNavList[i].channelType === 1){  
51 - this.handledTopNavList[i].moreChannel = '1'  
52 - }  
53 - }else{  
54 - if(this.handledTopNavList[i].channelType === 1 && this.handledTopNavList[i].myChannel !== '1'){  
55 - this.handledTopNavList[i].moreChannel = '1'  
56 - } 73 + if (item.localChannel === '1') {
  74 + this.localChannelList.push(item)
57 } 75 }
58 - }  
59 - console.info(`handledTopNavList:${JSON.stringify(this.handledTopNavList)}`) 76 + })
60 } 77 }
61 78
62 build() { 79 build() {
@@ -150,7 +167,7 @@ export struct TopNavigationComponent { @@ -150,7 +167,7 @@ export struct TopNavigationComponent {
150 Stack({ alignContent: Alignment.TopEnd }) { 167 Stack({ alignContent: Alignment.TopEnd }) {
151 168
152 Tabs() { 169 Tabs() {
153 - ForEach(this.handledTopNavList, (navItem: TopNavDTO, index: number) => { 170 + ForEach(this.myChannelList, (navItem: TopNavDTO, index: number) => {
154 TabContent() { 171 TabContent() {
155 PageComponent({ 172 PageComponent({
156 currentTopNavSelectedIndex: $currentTopNavSelectedIndex, 173 currentTopNavSelectedIndex: $currentTopNavSelectedIndex,
@@ -171,8 +188,10 @@ export struct TopNavigationComponent { @@ -171,8 +188,10 @@ export struct TopNavigationComponent {
171 }) 188 })
172 189
173 ChannelSubscriptionLayout({ 190 ChannelSubscriptionLayout({
174 - topNavList: this.handledTopNavList,  
175 - currentTopNavSelectedIndex: this.currentTopNavSelectedIndex 191 + myChannelList: $myChannelList,
  192 + moreChannelList: $moreChannelList,
  193 + localChannelList: $localChannelList,
  194 + currentTopNavSelectedIndex: $currentTopNavSelectedIndex
176 }) 195 })
177 } 196 }
178 197
@@ -208,7 +227,6 @@ export struct TopNavigationComponent { @@ -208,7 +227,6 @@ export struct TopNavigationComponent {
208 bottom: $r('app.float.top_tab_item_padding_bottom') 227 bottom: $r('app.float.top_tab_item_padding_bottom')
209 }) 228 })
210 .id(`col_tabBar${index}`) 229 .id(`col_tabBar${index}`)
211 -  
212 } 230 }
213 231
214 aboutToAppear() { 232 aboutToAppear() {