<template>
  <el-dialog title="视频预约" :visible="true" width="600px" append-to-body :close-on-click-modal="false"
             @close="handleClose">
    <div class="dialog-content dialog-office-batch">
      <div class="pt-8">
        <el-form ref="ruleFormVideoReservation"
                 :model="videoReservationObj"
                 :rules="rulesRule"
                 label-width="130px">
          <el-row :gutter="50">
            <el-col :span="23">
              <el-form-item label="开始时间" prop="bookingTime">
                <el-date-picker
                    v-model="videoReservationObj.bookingTime"
                    type="datetime"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    placeholder="请选择"
                    :picker-options="pickerOptions"
                    class="width100">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>

      </div>

    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose()">取消</el-button>
      <el-button type="primary" @click="handleSubmit()">立即预约</el-button>
    </span>
  </el-dialog>
</template>

<script>
import videoTelephone from "@/services/videoTelephone";
export default {
  name: "videoReservationDialog",
  props: {
    eventDialog: {
      type: Object,
      default: () => {
        return {}
      },
    },
  },
  data() {
    return{
      pickerOptions: {
        disabledDate(time) {
          const today = new Date();
          const start = new Date(today.getFullYear(), today.getMonth(), today.getDate());
          return time.getTime() < start.getTime();
        }
      },
      videoReservationObj: {
        bookingTime: '',
        id: '', // 案件ID
      },
      rulesRule: {
        bookingTime: [
          {required: true, message: '请选择', trigger: 'change',},
        ],
      },
    }
  },
  mounted() {
    // console.log(1231)
    this.videoReservationObj = this.eventDialog;
  },
  methods: {
    handleClose() {
      this.$emit('update:eventDialog', null)
    },
    handleSubmit() {
      if(!this.$clickThrottle()) { return }//防止重复点击
      this.$refs.ruleFormVideoReservation.validate((valid) => {
        if (valid) {
          videoTelephone.videoTelephoneModify(this.videoReservationObj).then(res => {
            this.$parent.getList()
            this.handleClose()
            this.$message.success("操作成功");
          })
        }
      })
    }
  }
}
</script>

<style scoped>

</style>