import { IBestToast, Pet, RDBMapper, RelationalStoreUtils, Test, YTCalendarPicker } from "basic";
import dayjs from "dayjs";
import { ClockTaskApi, InsertClockParam } from "../api/ClockTaskApi";
import { GetRemindParams, RemindApi, RemindItem, RemindItemClass } from "../api/RemindApi";
import { ButtonCom } from "../components/maincomponent/ButtonCom";
import { NullBuilder } from "../components/NullCom";

@Component
export struct ThirdView {
  @State remindList:RemindItem[]=[]
  @State dataList:string[]=[]
  @StorageProp('OAIDD')
  odid:string=""

  async getRemindList(params:GetRemindParams){
    const arr=await RemindApi.getRemindList(params)
    this.remindList=arr.records as RemindItem[]
  }
  async getRed(yearMonth:string){
    this.dataList=await RemindApi.getRed(yearMonth,this.odid)
  }


  aboutToAppear(): void {
    const date=dayjs(new Date()).format('YYYY-MM-DD')
    this.getRemindList({page:1,pageSizes:20,remindDate:date})
    const yearMonth=dayjs(new Date()).format('YYYY-MM')
    this.getRed(yearMonth)
  }
  async insertClockLog(vm:InsertClockParam){
    if(vm.plantsId==0||vm.itemId==0||vm.clockDate==""||vm.clockTime==""){
      IBestToast.show({
        message:"请检查打卡项或打卡植物日期"
      })
      return
    }

    if(dayjs(vm.clockDate+" "+vm.clockTime).valueOf()>dayjs(new Date()).valueOf()){
      IBestToast.show({
        message:"打卡不得超过当前时间"
      })
      return
    }
    const params:InsertClockParam={
      plantsId:vm.plantsId,
      itemId:vm.itemId,
      clockDate:vm.clockDate+" 00:00:00",
      clockTime:vm.clockDate+" "+vm.clockTime+":00"
    }
    await ClockTaskApi.insertClockLog(params).then((res)=>{
      if(res==true){
        IBestToast.show({
          message:'打卡成功'
        })
      }
    })
  }


  build() {
    Column({space:20}){
      YTCalendarPicker({
        onClickItem:(date: Date)=>{
          const stringDate=dayjs(date).format('YYYY-MM-DD')
          this.getRemindList({page:1,pageSizes:20,remindDate:stringDate})
        },
        updateRed:(year:string,month:string)=>{
          if(month.length==1){
            month="0"+month
          }
          const date=year+"-"+month
          this.getRed(date)
        },
        dateList:this.dataList
      })
      if(this.remindList.length==0){
        NullBuilder()
      }else {

        List({ space: 16 }) {
          ForEach(this.remindList, (item: RemindItem, index: number) => {
            ListItem() {
              Row() {
                Column() {
                  Image(item.plantsPicture).width(55).height(79)
                }
                .width(70)
                .height(90)
                .justifyContent(FlexAlign.Center)
                .alignItems(HorizontalAlign.Center)
                .borderRadius(20)
                .backgroundColor('#E8EBF0')
                .margin({ right: 9 })

                Column({ space: 11 }) {
                  Text(item.plantsName).fontColor('#333333')
                  Row({ space: 5 }) {
                    Image(item.itemIcon).width(15).height(15)
                    Text(item.itemName).fontColor('#333333').fontSize(12)
                  }

                  Row({ space: 5 }) {
                    Image($r("app.media.main_icon_remindDesc")).width(15).height(15)
                    Text(item.remindTime.slice(0, 5)).fontColor('#333333').fontSize(12)
                  }
                }.justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Start)

                Blank()
                ButtonCom({
                  text: "养护打卡",
                  isShowBuilder: () => {
                    // this.isShowMaintenanceBuilder=true
                    //直接打卡
                    this.insertClockLog({
                      itemId: item.itemId,
                      plantsId: item.plantsId,
                      clockDate: dayjs(new Date()).format('YYYY-MM-DD'),
                      clockTime: dayjs(new Date()).format('HH:mm')
                    })
                  }
                })
              }
              .width('100%')
              .height(115)
              .backgroundColor('#fff')
              .justifyContent(FlexAlign.Center)
              .alignItems(VerticalAlign.Center)
              .borderRadius(12)
              .padding({
                left: 17,
                top: 17,
                right: 20,
                bottom: 17
              })
            }
          })
        }.width('100%')
      }

    }.height('100%')
    .padding({top:44,left:16,right:16})
    .justifyContent(FlexAlign.Start)
    .backgroundColor('#EAF3F2')


  }
}