import { MeetingItemModel,ItemModel } from '../model/ItemModel'
import { BasicConstant } from '@itcast/basic'
@Preview
@Component
export struct ItemComp {
  item: MeetingItemModel = new MeetingItemModel({} as ItemModel)
  @State timeColor:ResourceStr=$r('app.color.ee432f')
  @State status:string=''
  aboutToAppear(): void {
    this.getMeetingStatus()
  }

  build() {
    Column() {
      Text().height(1).width('100%')
      if(this.item.count==0)
      {
        Text(this.item.begin_date.substring(0, 4)
          + "年"
          + this.item.begin_date.substring(5, 7)
          + "月").fontSize(14).fontColor($r('app.color.333333')).height(35)
      }
      RelativeContainer()
      {
          Text().width(23).backgroundColor(this.timeColor).borderRadius(5).height('100%')
        RelativeContainer(){


           Column()
           {
             Text(this.item.title) .maxLines(2).fontSize(15).fontColor(Color.Black).textAlign(TextAlign.Start)
               .textOverflow({ overflow: TextOverflow.Ellipsis }).id('title').width('100%')
             RelativeContainer()
             {

               Stack()
               {

                 Image(BasicConstant.urlHtml+this.item.liveimg).width('100%').height(162)
                   .objectFit(ImageFit.Fill)
                 if(this.status!=''&&this.status!='已结束'&&this.status!='回访中')
                 {
                   Image($r('app.media.bofang')).width(40).height(40)
                 }

               }
               if(this.status!='')
               {
                 Text(this.status) .fontSize(13).margin({top:5,right:5})
                   .fontColor(Color.White).padding({left:10,right:10,top:1,bottom:1})
                   .alignRules({
                     right: { anchor: "__container__", align: HorizontalAlign.End }
                   })
                   .border({ width:1, color:Color.White })
                   .borderRadius(30)
               }




             }

             .height(162).backgroundColor(Color.Orange)
             .margin({top:10,right:5}).clip(true).id('rr')

             Row(){
               Image($r('app.media.meetingtime')).width(13).height(13)
               Text(this.getTime(this.item.begin_date,this.item.end_date)).fontSize(14)
                 .fontColor($r('app.color.999999')).margin({left:10})
               Blank()
               Image($r('app.media.meetinglocation')).width(15).height(15)
               Text(this.item.location).fontSize(14)
                 .fontColor($r('app.color.999999')).margin({left:10})
             }
             .width('100%')
             .margin({top:6})
           }.height(247).justifyContent(FlexAlign.Center).margin({left:20,right:5})


          }
          .height('100%').clip(true)
        .margin({left:20,right:5}).backgroundColor(Color.White)
        Text(this.item.begin_date.substring(8,10)).width(20).height(20) .alignRules({

          bottom: { anchor: "__container__", align:VerticalAlign.Center}
        })
          .margin({left:10})
          .fontSize(14)
          .fontColor(this.timeColor)
          .textAlign(TextAlign.Center)
          .backgroundColor(Color.White)
          .borderRadius(20)

      }.width('100%').height(247).clip(true).
      backgroundColor(Color.White).borderRadius(5)



    }.backgroundColor($r('app.color.e4e4e4'))
    .width('100%').padding({left:10,right:10,bottom:20}).clip(true)

  }

  getTime(str1:string, str2:string) {
  if (str1.substring(0, 10)==(str2.substring(0, 10))) {
  return str1.replaceAll("-", ".").substring(0, 10).toString();
}
return str1.replaceAll("-", ".").substring(0, 10)+"-"+str2.replaceAll("-", ".").substring(0, 10)

}
  getMeetingStatus()
  {
    if(this.item.count%4==0)
    {
      this.timeColor=$r('app.color.ee432f')
    }
    else if(this.item.count%4==1)
    {
      this.timeColor=$r('app.color.f9b928')
    }
    else if(this.item.count%4==2)
    {
      this.timeColor=$r('app.color.63ccc7')
    }
    else
    {
      this.timeColor=$r('app.color.99d750')
    }

    if('1'==this.item.status)
    {
      this.status='预告'
    }
    else if('2'==this.item.status)
    {
      this.status='直播中'
    }
    else if('3'==this.item.status)
    {
      this.status='已结束'
    }
    else if('4'==this.item.status)
    {
      this.status='回放中'
    }
    else
    {
      this.status=''
    }
  }
}