<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="餐券类型名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
              <a-input v-model="model.name" placeholder="请输入餐券类型名称"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item
                    :labelCol="labelCol"
                    :wrapperCol="wrapperCol"
                    label="自动发放"
                    prop="automaticGrant">
              <a-switch checkedChildren="开启" unCheckedChildren="禁用" v-model="model.automaticGrant"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item
                    :labelCol="labelCol"
                    :wrapperCol="wrapperCol"
                    label="启用"
                    prop="status">
              <a-switch checkedChildren="开启" unCheckedChildren="禁用" v-model="model.status"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="开始时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="startTime">
<!--              <j-date placeholder="请选择开始时间" v-model="model.startTime"  style="width: 100%" />-->
              <a-time-picker format="HH:mm" :minuteStep="5" v-model="model.startTime" @change="onChange" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="结束时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="endTime">
<!--              <j-date placeholder="请选择结束时间" v-model="model.endTime"  style="width: 100%" />-->
              <a-time-picker format="HH:mm" :minuteStep="5" v-model="model.endTime" @change="onChange" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import moment from 'moment';

  export default {
      name: 'BusMealCouponForm',
      components: {},
      props: {
          //表单禁用
          disabled: {
              type: Boolean,
              default: false,
              required: false
          }
      },
      data() {
          return {
              model: {},
              labelCol: {
                  xs: {span: 24},
                  sm: {span: 5},
              },
              wrapperCol: {
                  xs: {span: 24},
                  sm: {span: 16},
              },
              confirmLoading: false,
              validatorRules: {
                  name: [
                      {required: true, message: '请输入餐券名称!'},
                  ],
              },
              url: {
                  add: "/business/busMealCoupon/add",
                  edit: "/business/busMealCoupon/edit",
                  queryById: "/business/busMealCoupon/queryById"
              }
          }
      },
      computed: {
          formDisabled() {
              return this.disabled
          },
      },
      created() {
          //备份model原始值
          this.modelDefault = JSON.parse(JSON.stringify(this.model));
      },
      methods: {
          moment,
          add() {
              this.edit(this.modelDefault);
          },
          edit(record) {
              this.model = Object.assign({}, record);
              this.visible = true;
              if (this.model.status == 0) {
                  this.model.status = true;
              } else {
                  this.model.status = false;
              }

              if (this.model.automaticGrant == 0) {
                  this.model.automaticGrant = true;
              } else {
                  this.model.automaticGrant = false;
              }

              if (!this.model.id) {
                  // this.model.startTime = moment('06:00', "HH:mm")
                  // this.model.endTime = moment("09:00", "HH:mm")
              }else{
                  this.model.startTime = moment(record.startTime, "HH:mm")
                  this.model.endTime = moment(record.endTime, "HH:mm")
              }
          },
          submitForm() {
              const that = this;
              // 触发表单验证
              console.log(that.model)
              this.$refs.form.validate(valid => {
                  if (valid) {
                      that.confirmLoading = true;
                      let httpurl = '';
                      let method = '';
                      if (!this.model.id) {
                          httpurl += this.url.add;
                          method = 'post';
                          var info = JSON.parse(localStorage.getItem("storeInfo"));
                          this.model.hotelId = info.id;
                      } else {
                          httpurl += this.url.edit;
                          method = 'put';
                      }
                      let data = { ...that.model }
                      if (this.model.status) {
                          data.status = 0;
                      } else {
                          data.status = 1;
                      }
                      if (this.model.automaticGrant) {
                          data.automaticGrant = 0;
                      } else {
                          data.automaticGrant = 1;
                      }
                      data.startTime = this.model.startTime.format("HH:mm:ss")
                      data.endTime = this.model.endTime.format("HH:mm:ss")
                      httpAction(httpurl, data, method).then((res) => {
                          if (res.success) {
                              that.$message.success(res.message);
                              that.$emit('ok');
                          } else {
                              that.$message.warning(res.message);
                          }
                      }).finally(() => {
                          that.confirmLoading = false;
                      })
                  }

              })
          },
          onChange() {

          }
      }
  }
</script>
