模拟日历选座场景，买票或者住宿软件都有选座的情景

// xxx.ets 
@Entry 
@Component 
struct GridExample { 
  @State Number: String[] = ['1', '2', '3', '4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30'] 
  scroller: Scroller = new Scroller() 
  @State num1:number[]= [] 
  @State StartColor :string= '#ff90e25d' 
  @State color:string ='#0xF9CF93' 
  
  build() { 
    Column({ space: 6 }) { 
      Grid() { 
          ForEach(this.Number, (day: string,index1:number) => { 
            GridItem() { 
              Column(){ 
                Stack(){ 
                  Text(day) 
                    .zIndex(999) 
                    .fontSize(16) 
                    .fontColor(Color.Black) 
                      // .backgroundColor('0xF9CF93') 
                    .backgroundColor(this.color) 
                    .width('100%') 
                    .height('100%') 
                    .textAlign(TextAlign.Center) 
                    // 为当前组件添加颜色叠加效果，入参为叠加的颜色。 
                    .colorBlend(false?this.StartColor:this.StartColor) 
                    .clip(true) 
                    .borderRadius(10) 
                    .onClick(()=>{ 
                      // 点击添加索引到一个数组里面判断 
                      if(this.num1.length<2){ 
                        this.num1.push(index1) 
                      }else { 
                        this.num1.shift() 
                        this.num1.push(index1) 
                      } 
                      console.info(JSON.stringify(this.num1) ) 
                    }) 
                  if(index1===this.num1[0] || index1 ===this.num1[1] ){ 
                    Text() 
                      .fontSize(16) 
                      .fontColor(Color.Black) 
                      .backgroundColor(Color.Green) 
                      .width('100%') 
                      .height('100%') 
                      .textAlign(TextAlign.Center) 
                      .colorBlend(false?this.StartColor:this.StartColor) 
                      .clip(true) 
                      .borderRadius(10) 
                      .width('100%').margin({ top: 0}) 
                      .position({}) 
                  }else if(this.num1[0] < index1  &&  index1 <this.num1[1] || this.num1[0] > index1  &&  index1 >this.num1[1] ){ 
                    Text() 
                      .fontSize(16) 
                      .textAlign(TextAlign.Center) 
                      .backgroundColor('#ffd01f89') 
                      .clip(true) 
                      .borderRadius(10) 
                      .width('100%') 
                      .height('100%') 
                      .position({}) 
                  } 
                } 
              } 
            } 
          }, (day: string) => day) 
      } 
      .columnsTemplate('1fr 1fr 1fr 1fr 1fr') 
      .rowsTemplate('1fr 1fr 1fr 1fr 1fr 1fr') 
      .columnsGap(10) 
      .rowsGap(10) 
      .width('90%') 
      .backgroundColor(0xFAEEE0) 
      .height(500) 
    }.width('100%').margin({ top: 5 }) 
  } 
}