HarmonyOS 鸿蒙Next 多级tabs嵌套问题：二级tab滑到头不能继续滑动一级tab

可以通过PanGesture结合TabsController的changeIndex方法实现一二级tab切换问题。给二级Tabs第一个页面和最后一个页面添加PanGesture事件，判断滑动方向，然后根据滑动方向，使用changeIndex来切换对应的一级Tabs页签。

[@Entry](/user/Entry) 
[@Component](/user/Component) 
struct TestTabWithTab { 
 [@State](/user/State) currentIndex: number = 1; 
 [@State](/user/State) subCurrentIndex: number = 0; 
 private fontColor: string = '#182431'; 
 private selectedFontColor: string = '#007DFF'; 
 private controller: TabsController = new TabsController(); 
 private subController: TabsController = new TabsController(); 
 private panOptionLeft: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Left }); 
 private panOptionRight: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Right }); 

 [@Builder](/user/Builder) 
 tabBuilder(index: number, name: string) { 
   Column() { 
     Text(name) 
       .fontColor(this.currentIndex === index ? this.selectedFontColor : this.fontColor) 
       .fontSize(16) 
       .fontWeight(this.currentIndex === index ? 500 : 400) 
       .lineHeight(22) 
       .margin({ top: 17, bottom: 7 }) 
     Divider() 
       .strokeWidth(2) 
       .color('#007DFF') 
       .opacity(this.currentIndex === index ? 1 : 0) 
   }.width('100%') 
 } 

 [@Builder](/user/Builder) 
 subTabBuilder(index: number, name: string) { 
   Column() { 
     Text(name) 
       .fontColor(this.subCurrentIndex === index ? this.selectedFontColor : this.fontColor) 
       .fontSize(16) 
       .fontWeight(this.subCurrentIndex === index ? 500 : 400) 
       .lineHeight(22) 
       .margin({ top: 17, bottom: 7 }) 
     Divider() 
       .strokeWidth(2) 
       .color('#007DFF') 
       .opacity(this.subCurrentIndex === index ? 1 : 0) 
   }.width('100%') 
 } 

 build() { 
   Column() { 
     // 一级Tab 
     Tabs({ barPosition: BarPosition.Start, index: this.currentIndex, controller: this.controller }) { 
       TabContent() { 
         Column() { 
           Text('首页内容') 
         } 
         .width('100%') 
         .height('100%') 
         .backgroundColor('#ffb554d7') 
         .justifyContent(FlexAlign.Center) 
         .alignItems(HorizontalAlign.Center) 
       }.tabBar(this.tabBuilder(0, '首页')) 

       TabContent() { 
         Column() { 
           // 二级Tab 
           Tabs({ barPosition: BarPosition.Start, controller: this.subController }) { 
             TabContent() { 
               Column().width('100%').height('100%').backgroundColor('#00CB87') 
             }.tabBar(this.subTabBuilder(0, 'green')) 
             .gesture( 
               PanGesture(this.panOptionRight) 
                 .onActionEnd(() => { 
                   this.controller.changeIndex(0) 
                 }) 
             ) 

             TabContent() { 
               Column().width('100%').height('100%').backgroundColor('#007DFF') 
             }.tabBar(this.subTabBuilder(1, 'blue')) 

             TabContent() { 
               Column().width('100%').height('100%').backgroundColor('#FFBF00') 
             }.tabBar(this.subTabBuilder(2, 'yellow')) 

             TabContent() { 
               Column().width('100%').height('100%').backgroundColor('#E67C92') 
             }.tabBar(this.subTabBuilder(3, 'pink')) 
             .gesture( 
               PanGesture(this.panOptionLeft) 
                 .onActionEnd(() => { 
                   this.controller.changeIndex(2) 
                 }) 
             ) 
           } 
           .vertical(false) 
           .barMode(BarMode.Fixed) 
           .barWidth(360) 
           .barHeight(56) 
           .animationDuration(400) 
           .onChange((index: number) => { 
             this.subCurrentIndex = index; 
           }) 
           .width(360) 
           .backgroundColor('#F1F3F5') 
         } 
         .width('100%').height('100%').backgroundColor('#00CB87') 
       }.tabBar(this.tabBuilder(1, '详情')) 

       TabContent() { 
         Column() { 
           Text('我的内容') 
         } 
         .width('100%') 
         .height('100%') 
         .backgroundColor('#ffc19757') 
         .justifyContent(FlexAlign.Center) 
         .alignItems(HorizontalAlign.Center) 
       }.tabBar(this.tabBuilder(2, '我的')) 

     } 
     .vertical(false) 
     .barMode(BarMode.Fixed) 
     .barWidth(360) 
     .barHeight(56) 
     .animationDuration(400) 
     .onChange((index: number) => { 
       this.currentIndex = index 
     }) 
     .width(360) 
     .height(296) 
     .backgroundColor('#F1F3F5') 
   }.width('100%') 
 } 
}