// 日期选择器
@ComponentV2
export struct YtDatePicker{
  @Once @Param selectedDate: Date = new Date();
  @Param linearInfo: LinearGradientOptions = {
    colors: [['#ACF4EB', 0.01], ['#D3F9FF', 0.2] ],
    angle: 150
  }
  @Param needCancel: boolean = false;

  @Event selectDateBack: (date?: Date) => void = (date?: Date) => {
    console.log("选择的日期" + date?.toLocaleString())
  }

  build() {
    Column({space: 15}){
      Row(){
        Text(this.needCancel ? "取消" : "今天")
          .fontColor(Color.Black)
          .fontSize(this.needCancel ? 16 : 18 )
          .fontWeight(this.needCancel ? 500 : 700)
          .onClick(() => {
            if(this.needCancel) {
              this.selectDateBack()
            } else {
              this.selectedDate = new Date()
            }
          })
        Text("确认")
          .fontSize(16)
          .fontWeight(500)
          .borderRadius(32)
          .fontColor(Color.Black)
          // .linearGradient(this.linearInfo)
          .padding({ left: 16, right: 16, top: 4, bottom: 4})
          .onClick(() => {
            this.selectDateBack(this.selectedDate)
          })
      }
      .width("100%")
      .justifyContent(FlexAlign.SpaceBetween)
      .padding({ left: 16, right: 16, top: 16, bottom: 16})


      Stack({alignContent: Alignment.Center}){
        Row()
          .width("100%")
          .height(55)
          .borderRadius(8)
          .linearGradient(this.linearInfo)

        DatePicker({
          // end: new Date(),
          selected: this.selectedDate,
        })
          .selectedTextStyle({
            color: Color.Black,
          })
          .onDateChange((date: Date) => {
            this.selectedDate = date
          })
          .textStyle({
            color: Color.Black,
          })
      }
      .padding({ left: 13, right: 13})
    }
    .width("100%")
    .borderRadius({topLeft: 12, topRight: 12})
    .padding({ top: 20, bottom: 20 })
    .backgroundColor(Color.White)
    .shadow({
      radius: 10,
      type: ShadowType.COLOR,
      color: Color.Black
    })
  }
}