import { hdHttp, HdResponse, BasicConstant, BaseBean, HdLoadingDialog,
  TimestampUtil,
  preferenceStore,
  ChangeUtil} from '@itcast/basic'
import { BusinessError } from '@kit.BasicServicesKit';
import promptAction from '@ohos.promptAction';
import { HdNav ,DatePickerDialog} from '@itcast/basic';
import { componentUtils, LengthMetrics, router } from '@kit.ArkUI';
import { HMRouter, HMRouterMgr } from '@hadss/hmrouter';
import { HashMap } from '@kit.ArkTS';
import { DateListBean } from '../model/StopOutPatientListModel'
import { PerfactInputSheet } from '@itcast/basic/src/main/ets/Views/PerfactInputSheet';


@HMRouter({ pageUrl: 'ReleaseOutpatient' })
@Component
export struct ReleaseOutpatient {

  @State noteText: string =preferenceStore.getItemString('ReleaseOutpatient')
  @State uuid: string = ''
  @State reasonIndex: number = -1
  reasonOptions: string[] = ['出差', '休假', '临时安排', '其他']
  controller:TextAreaController = new TextAreaController();
  @State date_list_normal: DateListBean[] = [{ param1: '', param2: '' }]
  @State date_list_temp: DateListBean[] = [{ param1: '', param2: '' }]
  @State tmp_list: DateListBean[] = []
  @State private datePickerType: 'start' | 'end' = 'start'
  @State private datePickerIndex: number = 0
  @State selected:string=TimestampUtil.getToday()
  @State timePeriodOptions: string[] = ['上午', '下午', '晚上', '全天']
  @State showTimePeriodDropdown: number = -1 // 当前下拉的index，-1为无
  dialog: CustomDialogController = new CustomDialogController({
    builder: HdLoadingDialog({ message: '加载中...' }),
    customStyle: true,
    alignment: DialogAlignment.Center
  })
  private datePickerDialog!: CustomDialogController;
  addStopOutPatient() {
    this.dialog.open()
    const hashMap: HashMap<string, Object> = new HashMap();
    hashMap.set('type',this.reasonIndex+1+'')
    hashMap.set('note',this.noteText)
    hashMap.set('date_list', this.reasonIndex === 2 ? this.date_list_temp : this.date_list_normal)
    hdHttp.httpReqObject<string>(BasicConstant.addStopOutPatient,hashMap).then(async (res: HdResponse<string>) => {
      this.dialog.close()
      let json:BaseBean = JSON.parse(res+'') as BaseBean;
      if(json.code == '200') {
        HMRouterMgr.pop()
      } else {
        promptAction.showToast({ message: json.message })
      }
    }).catch((err: BusinessError) => {

      console.info(`Response fails: ${err}`);
    })

  }

  private dialogPublish!:CustomDialogController;

  initDialog() {
    this.dialogPublish = new CustomDialogController({
      builder:PerfactInputSheets({
        controller:this.dialogPublish,
        reasonOptions:this.reasonOptions[this.reasonIndex],
        noteText:this.noteText,
        date_list:this.reasonIndex === 2 ? this.date_list_temp : this.date_list_normal,
        inputCallBack:()=>{
          this.addStopOutPatient()

          // HMRouterMgr.pop()


        }
      }),
      keyboardAvoidDistance: LengthMetrics.vp(0), // 设置弹窗底部与键盘顶部间距（单位：vp）
      alignment: DialogAlignment.Center,
      customStyle: true,
      autoCancel: false,
      backgroundColor: ('rgba(0,0,0,0.5)'),
      height: '100%'
    })
  }
  private initDatePickerDialog() {
    this.datePickerDialog = new CustomDialogController({
      builder: DatePickerDialog({
        controller:this.datePickerDialog,
        title:'选择开始日期',
        dateOptions:  {
          start: new Date('1930-01-01'),
          end: new Date('2100-01-01'),
          selected: new Date(this.selected),
        },
        dateSelected:(date:string) => {
          let isTemp = this.reasonIndex === 2
          this.tmp_list = isTemp ? [...this.date_list_temp] : [...this.date_list_normal]


          if (this.datePickerType === 'start') {
            if (date < TimestampUtil.getToday()|| date > this.tmp_list[this.datePickerIndex].param2&&this.tmp_list[this.datePickerIndex].param2!='') {
              if (date < TimestampUtil.getToday())
              {
                promptAction.showToast({ message: '不能发布过期时间' });
              }
             else
             {
               promptAction.showToast({ message: '结束时间不能早于开始日期' });
             }
              this.tmp_list[this.datePickerIndex].param1 = ''
            } else {
              let list = isTemp ? this.date_list_temp : this.date_list_normal
              let isDuplicate = list.some((item, idx) => idx != this.datePickerIndex && item.param2 == this.tmp_list[this.datePickerIndex].param2 && item.param1 == date);
              if (isDuplicate) {
                promptAction.showToast({ message: '已存在相同停诊时间' });
                this.tmp_list[this.datePickerIndex].param1 = ''
              }
              else
              {
                this.tmp_list[this.datePickerIndex].param1 = date
              }


            }

          } else {
            // 选择开始日期时校验
            let list = isTemp ? this.date_list_temp : this.date_list_normal
            let isDuplicate = list.some((item, idx) => idx != this.datePickerIndex && item.param1 == this.tmp_list[this.datePickerIndex].param1 && item.param2 == date);
            if (isDuplicate) {
              promptAction.showToast({ message: '已存在相同停诊时间' });
              this.tmp_list[this.datePickerIndex].param2 = ''
            } else {
              if (date < TimestampUtil.getToday() || date < this.tmp_list[this.datePickerIndex].param1) {
                promptAction.showToast({ message: '不能发布过期时间' });
                this.tmp_list[this.datePickerIndex].param2 = ''
              } else {
                this.tmp_list[this.datePickerIndex].param2 = date
              }
            }
          }
          if(isTemp) {
            this.date_list_temp = this.tmp_list
          } else {
            this.date_list_normal = this.tmp_list
          }
        }
      }),
      alignment: DialogAlignment.Bottom,
      customStyle: true,
      autoCancel: false,
      backgroundColor: ('rgba(0,0,0,0.5)'),
      height: '100%'
    });
  }
  private custom!:CustomDialogController;
  initDialogcustom() {
    this.custom = new CustomDialogController({
      builder:PerfactInputSheet({
        controller:this.custom,
        inputTitle:'提示',
        okText:'保存',
        needcancelCallBack:true,
        okColor:$r('app.color.top_title'),
        inputPlaceholder:'您有未发布的内容，是否保存？',
        style:'2',
        inputCallBack:(input: string,title:string)=>{
          if(title=='needcancelCallBack')
          {
            preferenceStore.setItemString('ReleaseOutpatient','')
          }
          else
          {
            preferenceStore.setItemString('ReleaseOutpatient',this.noteText)
          }

          HMRouterMgr.pop()


        }
      }),
      alignment: DialogAlignment.Center,
      customStyle: true,
      autoCancel: false,
      backgroundColor: ('rgba(0,0,0,0.5)'),
      height: '100%'
    })
  }

  aboutToAppear(): void {
    this.initDatePickerDialog()
    this.initDialog()
    this.initDialogcustom()
  }

  build() {
    Column() {
      HdNav({ title: '发布停诊', showRightIcon: false, hasBorder: true, isLeftAction:true,leftItemAction:()=>{
        if(this.noteText.trim()!='')
        {
          this.custom.open()
        }
       else
       {
         HMRouterMgr.pop()
       }

      } })
      Column()
      {
        Text('停诊原因 *').fontSize(17).fontColor($r('app.color.top_title')).padding(10).width('100%').textAlign(TextAlign.Start)
        Row() {
          ForEach(this.reasonOptions, (item: string, index: number) => {
            Row() {
              Text(item)
                .fontSize(16)
                .fontColor(this.reasonIndex === index ?  $r('app.color.top_title') : $r('app.color.999999'))
                .height(42)
                .layoutWeight(1)
                .textAlign(TextAlign.Center)
                .backgroundImageSize(ImageSize.Contain)
                .backgroundImagePosition(Alignment.Center)
                .backgroundImage(this.reasonIndex === index ? $r('app.media.check_true') : undefined)
                .borderColor(this.reasonIndex === index ? Color.Transparent : $r('app.color.999999') )
                .borderWidth(1)
                .borderRadius(4)
                .margin({ right: 10 })
                .onClick(() => {
                   this.reasonIndex = index
                })
            }.layoutWeight(1)
          })
        }.padding({ left: 10}).width('100%')
        Row()
        {
          Text('停诊时间 *').fontSize(17).fontColor($r('app.color.top_title')).padding(10).width('100%').textAlign(TextAlign.Start).layoutWeight(1)
          Text() {
            Span("+").fontColor($r('app.color.top_title'))
            Span("再次添加").fontColor($r('app.color.common_gray_03'))
          }.fontSize(16)
          .visibility((this.reasonIndex === 2 ? this.date_list_temp.length : this.date_list_normal.length) < 3 ? Visibility.Visible : Visibility.None)
          .onClick(() => {
            let list = this.reasonIndex === 2 ? this.date_list_temp : this.date_list_normal
            let hasempty = list.some((item, idx) => item.param1 == '' || item.param2 == '');
            if(hasempty) {
              promptAction.showToast({ message: '请选择停诊时间' });
            } else {
              if(this.reasonIndex === 2) {
                this.date_list_temp = [...this.date_list_temp, { param1: '', param2: '' }]
              } else {
                this.date_list_normal = [...this.date_list_normal, { param1: '', param2: '' }]
              }
            }
          })
        }

        .margin({ left: 10, right: 10 }).width('100%')

        Column() {
          ForEach(this.reasonIndex === 2 ? this.date_list_temp : this.date_list_normal, (item: DateListBean, index: number) => {
            Row() {
              Text(item.param1 ? item.param1 : '选择开始日期')
                .fontSize(16)
                .fontColor(item.param1 ? $r('app.color.common_gray_03') : $r('app.color.999999'))
                .height(42)
                .textAlign(TextAlign.Center)
                .borderColor($r('app.color.999999'))
                .layoutWeight(1)
                .borderWidth(1)
                .borderRadius(4)
                .onClick(() => {
                  if(this.reasonIndex < 0) {
                    promptAction.showToast({ message: '请先选择停诊原因' });
                    return;
                  }
                  this.datePickerType = 'start'
                  this.datePickerIndex = index
                  this.selected = item.param1 ? item.param1 : TimestampUtil.getToday()
                  this.datePickerDialog.open()
                })
              Text('至')
                .fontSize(16)
                .fontColor($r('app.color.999999'))
                .textAlign(TextAlign.Center)
                .visibility(this.reasonIndex === 2?Visibility.Hidden:Visibility.Visible)
                .margin({left:10,right:10})
              // 临时安排特殊处理
              if (this.reasonIndex === 2) {
                // 下拉选择时段
                Column() {
                  Text(item.param2 ? item.param2 : '请选择时段')
                    .id(`id_${index}`)
                    .fontSize(16)
                    .fontColor(item.param2 ? $r('app.color.common_gray_03') : $r('app.color.999999'))
                    .height(42)
                    .textAlign(TextAlign.Center)
                    .borderColor($r('app.color.999999'))
                    .borderWidth(1)
                    .width('100%')
                    .textAlign(TextAlign.Center)
                    .borderRadius(4)
                    .onClick(() => {
                      if(this.reasonIndex < 0) {
                        promptAction.showToast({ message: '请先选择停诊原因' });
                        return;
                      }
                        this.showTimePeriodDropdown = index
                    })
                }.layoutWeight(1)

              } else {
                Text(item.param2 ? item.param2 : '选择结束日期')
                  .fontSize(16)
                  .fontColor(item.param2 ? $r('app.color.common_gray_03') : $r('app.color.999999'))
                  .height(42)
                  .layoutWeight(1)
                  .textAlign(TextAlign.Center)
                  .borderColor($r('app.color.999999'))
                  .borderWidth(1)
                  .borderRadius(4)
                  .onClick(() => {
                    if(this.reasonIndex < 0) {
                      promptAction.showToast({ message: '请先选择停诊原因' });
                      return;
                    }
                    this.datePickerType = 'end'
                    this.datePickerIndex = index
                    this.selected = item.param2 ? item.param2 : TimestampUtil.getToday()
                    this.datePickerDialog.open()
                  })
              }
              Image($r('app.media.delete_notice')).width(17).height(17).margin({left:10})
                .visibility(index > 0 && (this.reasonIndex === 2 ? this.date_list_temp.length : this.date_list_normal.length) > 1 ? Visibility.Visible : Visibility.Hidden)
                .onClick(() => {
                  if (index > 0 && (this.reasonIndex === 2 ? this.date_list_temp.length : this.date_list_normal.length) > 1) {
                    if(this.reasonIndex === 2) {
                      let newList = [...this.date_list_temp]
                      newList.splice(index, 1)
                      this.date_list_temp = newList
                    } else {
                      let newList = [...this.date_list_normal]
                      newList.splice(index, 1)
                      this.date_list_normal = newList
                    }
                  }
                })
            }
            .padding({ left: 10, bottom: 10, right: 10 }).width('100%')
          })
        }
        .zIndex(200)


        Text('备注').fontSize(17).fontColor($r('app.color.top_title')).padding(10).width('100%').textAlign(TextAlign.Start)
        TextArea({ placeholder: '您可以在这里填写想告诉患者的停诊补充信息，最多填写300个字哦～', text: $$this.noteText })
          .fontColor($r('app.color.common_gray_03'))
          .height(100)
          .textAlign(TextAlign.Start)
          .zIndex(100)
          .fontSize(14).padding(9).margin({left:10,right:10,bottom:10})
          .backgroundColor($r('app.color.home_gray')).borderRadius(8)
      } .backgroundColor($r('app.color.white'))
      Blank()
      Column()
      {
        Text('确定发布').height(42).width(168).fontSize(17)
          .backgroundColor($r('app.color.top_title'))
          .fontColor($r('app.color.white'))
          .textAlign(TextAlign.Center)
          .borderRadius(4)
          .margin({top:8})
      }
      .width('100%')
      .height(57)
      .backgroundColor(Color.White)
      .onClick(() => {
        if(this.reasonIndex < 0) {
          promptAction.showToast({ message: '请先选择停诊原因' });
          return;
        }
        let list = this.reasonIndex === 2 ? this.date_list_temp : this.date_list_normal
        let hasempty = list.some((item, idx) => item.param1 == '' || item.param2 == '');
        if(hasempty) {
          promptAction.showToast({ message: '请选择停诊时间' });
          return
        }
        this.dialogPublish.open()

      })

      // 悬浮下拉菜单
        Column() {
          ForEach(this.timePeriodOptions, (period: string, pidx: number) => {
            Text(period)
              .width('100%')
              .textAlign(TextAlign.Center)
              .height(50)
              .fontSize(16)
              .fontColor($r('app.color.common_gray_03'))
              .padding(8)
              .onClick(() => {
                let newList = [...this.date_list_temp]
                let isDuplicate = this.date_list_temp.some((item, idx) => idx != this.datePickerIndex && item.param1 == this.tmp_list[this.datePickerIndex].param1 && item.param2 == period);
                if (isDuplicate) {
                  promptAction.showToast({ message: '已存在相同停诊时间' });
                  newList[this.showTimePeriodDropdown]. param2= ''
                } else {
                  newList[this.showTimePeriodDropdown]. param2= period
                }
                this.date_list_temp = newList
                this.showTimePeriodDropdown = -1
              })
          })
        }
        .zIndex(999)
        .clip(false)
        .backgroundColor(Color.White)
        .borderColor($r('app.color.999999'))
        .borderWidth(1)
        .borderRadius(4)
        .visibility(this.showTimePeriodDropdown == -1 ? Visibility.None:Visibility.Visible)
        .width(px2vp(ChangeUtil.getColunmWidth(`id_${this.showTimePeriodDropdown}`)))
        .position({
          x: px2vp(ChangeUtil.getColumnX(`id_${this.showTimePeriodDropdown}`)),
          y: px2vp(ChangeUtil.getColumnY(`id_${this.showTimePeriodDropdown}`))
        })
    }
    .width('100%')
    .height('100%')
    .backgroundColor($r('app.color.home_gray'))
  }


}



@CustomDialog
export struct PerfactInputSheets {
  controller:CustomDialogController;

  @Prop inputTitle:string = '公告内容';
  @Prop inputPlaceholder:string = ''

  // 添加回调函数属性
  @State okColor:ResourceStr=$r('app.color.top_title')
  @State cancelColor:ResourceStr='#333333'
  @State okText:ResourceStr='确定发布'
  @State cancelText:ResourceStr='返回修改'
  @State reasonOptions:string=''
  @State noteText:string=''

  @State date_list: DateListBean[] = []
  private inputCallBack: () => void = () => {};
  @State needcancelCallBack:boolean=false
  // 修改构造函数
  constructor(controller: CustomDialogController, inputCallBack: () => void) {
    super();
    this.controller = controller;
    this.inputCallBack = inputCallBack;
  }

  build() {

      Row(){
        Column() {
          Text(this.inputTitle)
            .fontSize(18)
            .padding(20)
            .width('100%')
            .textAlign(TextAlign.Center)
            .fontColor('#444444')


          Text('停诊原因：' + this.reasonOptions)
            .fontSize(14)
            .fontColor('#444444')
            .backgroundColor(Color.White)
            .padding({ left: 10, right: 10 })
            .width('79%')

          Row() {
            Text('停诊时间：')
              .fontColor('#444444')
              .fontSize(14)
            Text(this.date_list[0].param1 + ' 至 ' + this.date_list[0].param2)
              .fontColor($r('app.color.common_gray_03')).padding({ left: 3 })
              .fontSize(14)
          }.margin({ top: 10 }).padding({ left: 10, right: 10 })
          .width('79%')
          if (this.date_list.length > 1) {
            Row() {
              Text('停诊时间：')
                .fontColor('#444444')
                .fontSize(14)
                .visibility(Visibility.Hidden)
              Text(this.date_list[1].param1 + " 至 " + this.date_list[1].param2)
                .fontColor('#444444').padding({ left: 3 })
                .fontSize(14)
            }.margin({ top: 10 }).padding({ left: 10, right: 10 })
            .width('79%')
          }

          if (this.date_list.length > 2) {
            Row() {
              Text('停诊时间：')
                .fontColor('#444444')
                .fontSize(14)
                .visibility(Visibility.Hidden)
              Text(this.date_list[2].param1 + " 至 " + this.date_list[2].param2)
                .fontColor('#444444').padding({ left: 3 })
                .fontSize(14)
            }
            .width('79%')
            .margin({ top: 10 }).padding({ left: 10, right: 10 })
          }

            Row() {
              Text()
              {
                Span('备').fontColor('#444444')
                Span('备注').fontColor(Color.Transparent)
                Span('注：').fontColor('#444444')
              }
                .fontColor('#444444')
                .fontSize(14)

              Text(this.noteText)
                .fontColor('#444444').padding({ left: 3 })
                .fontSize(14)
                .textAlign(TextAlign.Start)
                .layoutWeight(1)
            }.margin({ top: 10 }).padding({ left: 10, right: 10 })
            .alignItems(VerticalAlign.Top)
            .width('79%')
          .visibility(this.noteText?Visibility.Visible:Visibility.None)

          Text().width(20).height(20)
          Row() {
            Text('停诊时间：')
              .fontColor('#444444')
              .fontSize(14)
              .visibility(Visibility.Hidden)
            Text(TimestampUtil.getTodayChinese()+'由医生本人发布')
              .fontColor($r('app.color.common_gray_03')).padding({ left: 3 })
              .fontSize(14)
          }
          .margin({ top: 10 }).padding({ left: 10, right: 10 })
            Text('').height(1).width('100%')
              .backgroundColor($r('app.color.home_gray')).margin({ top: 10 })
            Row() {
              Text(this.cancelText)
                .fontSize(15)
                .fontColor(this.cancelColor)
                .textAlign(TextAlign.Center)

                .height(30)
                .layoutWeight(1)
                .onClick(() => {

                  this.controller.close()
                })
              Text('').height(30).width(1)
                .backgroundColor($r('app.color.home_gray'))
              Text(this.okText)
                .textAlign(TextAlign.Center)
                .fontColor(this.okColor)
                .fontSize(15)
                .onClick(() => {

                  this.controller.close()
                  this.inputCallBack();
                })

                .height(30)
                .layoutWeight(1)


            }.margin({ top: 10, bottom: 10 }).width('100%')
          }

        .width('80%').backgroundColor(Color.White)
      }.borderRadius(24)

  }
}