import { BuilderHeader } from "./BuilderHeader";


// 日期选择器
@Component
export struct DiaryDatePicker {
  @State selectedDate: Date = new Date();

  private linearInfo: LinearGradientOptions = {
    colors: [['#EAF3F2',1]],
    angle: 150
  }

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

  }

  build() {
    Column(){
      Column(){

      }.layoutWeight(1)
      .width('100%')
      .backgroundColor(Color.Transparent)
      Row(){
        BuilderHeader({
          leftTitle:'取消',
          centerTitle:"选择日期",
          rightTitle:"确定",
          leftClick:()=>{
            this.selectedDate = new Date()
            this.back()
          },
          rightClick:()=>{
            this.selectDateBack(this.selectedDate)
          }
        })

      }.width("100%")
      .backgroundColor(Color.White)
      .padding({top:19,left:16,right:16})
      .borderRadius({topLeft:20,topRight:20})
      Stack({alignContent: Alignment.Center}){
        Row()
          .width("100%")
          .height(50)
          .borderRadius(12)
          .linearGradient(this.linearInfo)

        DatePicker({
          start:new Date(),
          end:new Date('2100-01-01'),
          selected: this.selectedDate,
        })
          .selectedTextStyle({
            color: '#498552',
            font: {size:22}
          })
          .textStyle({
            color:'#3A3A3A',
            font: {size:18}
          })
          .onDateChange((date: Date) => {
            this.selectedDate = date
          })

      }
      .backgroundColor(Color.White)
      .layoutWeight(1)
      .padding({ left: 12, right: 12})
    }
    .width("100%")
    .height('100%')
    .borderRadius(12)
  }
}
/**
 *    Row(){
 Text("取消")
 .fontSize(18)
 .fontWeight(500)
 .fontColor('#206D43')
 .onClick(() => {

 })
 Text('选择日期')
 Text("确定")
 .fontSize(16)
 .fontWeight(500)
 .borderRadius(32)
 .backgroundColor('#206D43')
 // .linearGradient(this.linearInfo)
 .padding({ left: 16, right: 16, top: 4, bottom: 4})
 .onClick(() => {

 })
 }
 .width("100%")
 .justifyContent(FlexAlign.SpaceBetween)
 .padding({ left: 16, right: 16, top: 16, bottom: 16})
 .backgroundColor(Color.White)
 .borderRadius({topLeft:20,topRight:20})
 */