import router from '@ohos.router';

@Entry
@Component
struct Page2 {
  @State message: string = '第2层页面';

  build() {
    Scroll() {
      Column({ space: 20 }) {
        Text(this.message)
          .fontSize(30)
          .fontWeight(FontWeight.Bold)
          .fontColor('#F39C12')
        
        Text('点击下方按钮进入第3层')
          .fontSize(18)
          .fontColor('#666666')
        
        Button('前往第3层')
          .width('80%')
          .height(50)
          .backgroundColor('#F39C12')
          .onClick(() => {
            router.pushUrl({
              url: 'pages/Page3'
            });
          })
          
        Button('返回上一层')
          .width('80%')
          .height(50)
          .backgroundColor('#95A5A6')
          .onClick(() => {
            router.back();
          })
          
        this.generateLargeContent()
      }
      .width('100%')
      .padding(20)
    }
    .backgroundColor('#FEF9E7')
  }
  
  @Builder
  generateLargeContent() {
    ForEach(this.getLargeTextArray(), (item: string, index: number) => {
      Text(item)
        .fontSize(14)
        .fontColor('#333333')
        .textAlign(TextAlign.Start)
        .margin({top: 10})
    })
  }
  
  getLargeTextArray(): string[] {
    let arr: string[] = [];
    for (let i = 0; i < 150; i++) {
      arr.push(`这是第2层页面的大量文本内容，用于增加包体积 - 项目${i + 1}：在这一层中，我们继续展示丰富的文本信息和导航功能。应用程序正在逐步深入到更深层级，每一层都有其独特的设计和功能特点。这是第${i + 1}段扩展内容，包含了更多详细信息和技术规格说明。`);
    }
    return arr;
  }
}