<template>
  <a-modal
    v-model="dialogVisible"
    @ok="saveDelayInfo"
    @cancel="closeDialog"
    :confirm-loading="loadingStat"
    title="延期信息录入"
    width="60%"
    class="outerDialog custom_dialog">
    <a-form :model="DelayInfo" :rules="rule" :label-col="{span: 8}" :wrapper-col="{span: 15}" ref="DelayInfoForm">
      <a-form-item label="延期材料">
        <upload ref="uploadFile" :url="`/file/insert?bizId=`" :type="3" @uploadOver="removeNewSupervision" />
      </a-form-item>
      <a-form-item label="延期时间" prop="isPdTmTemp">
        <a-date-picker
          v-model:value="DelayInfo.isPdTmTemp"
          format="YYYY-MM-DD"
          type="date"
          placeholder="延期时间"
          :disabled-date="disabledDate"
          style="width: 100%;" />
      </a-form-item>
      <a-form-item label="延期说明" prop="zgDelayEln" >
        <a-textarea v-model:value="DelayInfo.zgDelayEln" :rows="8" maxlength="500" type="textarea"/>
      </a-form-item>
    </a-form>
    <span slot="okText">提交</span>
  </a-modal>
</template>

<script>
import moment from 'moment';
import { hostUrl } from '../../../utils/global_variable';
import request from '../../../utils/gw_ajax_request';
import upload from '../../../widgets/uploadFileWithType';

export default {
  props: ['pblmId', 'row'],
  components: {
    upload,
  },
  data() {
    return {
      moment,
      rule: {
        isPdTmTemp: [{ required: true, message: '延期时间不能为空' }],
        zgDelayEln: [{ required: true, message: '延期说明不能为空' }],
      },
      DelayInfo: {
        id: '',
        isPdTmTemp: null,
        zgDelayEln: '',
      },
      loadingStat: false,
      uuid: '',
      persId: localStorage.getItem('persId'),
      uploadFileUrl: '',
      dialogImageUrl: '',
      dialogVisible: true,
      disabledTime: null,
    };
  },
  computed: {
    hostUrl() {
      return hostUrl;
    },
  },
  mounted() {
    var date = new Date();
    var year = date.getFullYear();
    var month = date.getMonth() + 1;
    if (month > 11) {
      year = year + 1;
      month = 1;
    } else {
      month = month + 1;
    }
    var nextMonthDate = year + '-' + (month > 9 ? month : '0' + month) + '-01';
    if (this.row.zgDate) {
      var zgYear = this.row.zgDate.substring(0, 4);
      var zgMonth = this.row.zgDate.substring(5, 7);
      if (parseInt(zgMonth) > 11) {
        zgYear = parseInt(zgYear) + 1;
        zgMonth = 1;
      } else {
        zgMonth = parseInt(zgMonth) + 1;
      }
      this.DelayInfo.isPdTmTemp = moment(
        zgYear + '-' + (zgMonth > 9 ? zgMonth : '0' + zgMonth) + '-01',
      );
      this.disabledTime = moment(
        zgYear + '-' + (zgMonth > 9 ? zgMonth : '0' + zgMonth) + '-01',
      );
      if (this.DelayInfo.isPdTmTemp < nextMonthDate) {
        this.DelayInfo.isPdTmTemp = moment(nextMonthDate);
        this.disabledTime = moment(nextMonthDate);
      }
    } else {
      this.DelayInfo.isPdTmTemp = moment(nextMonthDate);
      this.disabledTime = moment(nextMonthDate);
    }
  },
  methods: {
    saveDelayInfo() {
      if (!this.DelayInfo.isPdTmTemp) {
        this.$message.warning('延期时间不能为空！');
        return false;
      }
      if (!this.DelayInfo.zgDelayEln) {
        this.$message.warning('延期说明不能为空！');
        return false;
      }
      this.$nextTick(() => {
        this.$refs.uploadFile.submitUpload(this.pblmId);
      });
      console.log(this.DelayInfo);
      this.$emit('saveDelayInfo', this.DelayInfo);
      this.$refs.DelayInfoForm.resetFields();
    },
    closeDialog() {
      this.$emit('closePblmDelayInfoDialog');
    },
    removeNewSupervision(arg) {
      this.$refs.uploadFile.init();
    },
    disabledDate(current) {
      return current && current < moment(this.disabledTime);
    },
  },
};
</script>

<style lang='less' scoped>

</style>
