框架:Vue + AntDesign
Form表单中有三个字段 ,开始时间(Ant的时间选择器)、时间间隔(输入框,格式为:xxHxxMIN,例:1H30MIN,表示1小时30分钟)、结束时间(Ant的时间选择器)

  • 计算开始 / 结束时间
calcStartEndTime() {
	let startTime = this.form.getFieldValue('formStartTime')
    let endTime = this.form.getFieldValue('formEndTime')
    let estTime = this.form.getFieldValue('formEstTime')
    if (startTime || endTime) {
      // 拆分预估时长
      let estHourTime = 0
      let estMinuteTime = 0
      let estMinuteTimeTemp = estTime
      // 取 hour
      if (estTime.includes('H')) {
        let estTimeArr = estTime.split('H')
        estHourTime = Number(estTimeArr[0])
        if (estTimeArr.length > 1) {
          estMinuteTimeTemp = estTimeArr[1]
        } else {
          estMinuteTimeTemp = ''
        }
      }
      // 取 minute
      if (estMinuteTimeTemp) {
        estMinuteTime = Number(estMinuteTimeTemp.split('MIN')[0])
      }
      // 开始时间存在 => 计算结束时间
      if (startTime) {
        // 做一次转换,否则在使用 startTime.add()时会修改 startTime对象本身
        startTime = moment(startTime.format())
        // 计算得出结束时间
        let formEndTime = startTime.add({hours: estHourTime ,minutes: estMinuteTime})
        this.form.setFieldsValue({formEndTime})
      } else {
        // 结束时间存在 => 计算开始时间
        endTime = moment(endTime.format())
        let formStartTime = endTime.subtract({hours: estHourTime ,minutes: estMinuteTime})
        this.form.setFieldsValue({formStartTime})
      }
    } else {
      this.$message.info('请设置开始时间,将自动计算结束时间')
    }
}
  • 计算时间间隔
calcEstTime() {
    let startTime = this.form.getFieldValue('formStartTime')
    let endTime = this.form.getFieldValue('formEndTime')
    if (startTime && endTime) {
      let diffTime = endTime.diff(startTime)
      if (diffTime <= 0) {
        // 跨天 => 看着 startTime时间点比 endTime时间点晚,时间间隔就是(开始时间-24:00)+(00:00-结束时间)
        let diffTime1 = moment('24:00', 'HH:mm').diff(startTime)
        let diffTime2 = endTime.diff(moment('00:00', 'HH:mm'))
        diffTime = diffTime1 + diffTime2
      }
      let sumMinutes = diffTime / 1000 / 60
      let hours = Math.floor(sumMinutes / 60)
      let minutes = Math.floor(sumMinutes - hours * 60)
      let formEstTime = hours > 0 ? `${hours}H` : ''
      formEstTime += minutes > 0 ? `${minutes}MIN` : ''
      this.form.setFieldsValue({formEstTime})
    } else {
      this.$message.info('请设置开始时间和结束时间,将自动计算预估时长')
    }
}
Logo

前往低代码交流专区

更多推荐