<template>
  <el-dialog
		:visible.sync="isOpenDialog"
		:close-on-click-modal="false"
		:modal-append-to-body='false'
    title="添加日期"
		@close="cancelHandle"
		custom-class="dialog"
		center
		width="560px"
		v-dialogDrag>
			<div class="dialog-main">
				<el-form
				ref="diaForm"
				label-position="left"
				hide-required-asterisk
				label-width="80px"
				:model="formData"
				:rules="formRules">
				
          <el-form-item label="日期类型" prop="dateType">
            <el-radio-group v-model="formData.dateType">
              <el-radio :label="1">过去日期</el-radio>
              <el-radio :label="2">未来日期</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="期数" prop="value" v-if="formData.dateType===1">
            <el-input
              type="number"
              placeholder="请输入期数"
              :min="1"
              v-model="formData.value"
              @input="filterInput(formData.value)"
              style="width:80%"
            ></el-input>
          </el-form-item>
          <el-form-item label="截止日期" prop="endDate" v-if="formData.dateType===2">
            <el-date-picker
              v-model="formData.endDate"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="请输入截止日期"
              :picker-options="{
                disabledDate(time) {
                  return time.getTime() < latestDate;
                }
              }"
              style="width:80%"
            />
          </el-form-item>
				</el-form>
			</div>
			<div class="dia-bot">
				<el-button type="primary" style="margin-right:20px" @click="saveHandle">保存</el-button>
				<el-button type="primary" plain @click="cancelHandle">取消</el-button>
			</div>
		</el-dialog>
</template>
<script>
import * as sheetInterface from '@/api/modules/sheetApi.js';
export default {
  props: {
    isOpenDialog: {
      type: Boolean
    },
  },
  watch: {
    isOpenDialog(nval) {
      if(nval) {
        this.latestDate =  Math.max(...this.$parent.dateArr.map(_ => new Date(_).getTime()));
      }
    }
  },
  data() {
    return {
      formData: {
        dateType: 1,
        endDate: '',
        value: ''
      },
      formRules: {
        endDate: [
          { required: true, message: '截止日期不能为空', trigger: 'blur' }
        ],
        value: [
          { required: true, message: '期数不能为空', trigger: 'blur' }
        ]
      },
      latestDate: ''
    }
  },
  methods:{
    cancelHandle() {
      this.formData = {
        dateType: 1,
        endDate: '',
        value: ''
      }
      this.$emit('update:isOpenDialog',false)
    },

    //过滤负数
    filterInput(val) {
      this.formData.value=val.replace(/[^\.\d]/g,'');
    },

    async saveHandle() {
      await this.$refs.diaForm.validate();

      let dateArr = this.$parent.dateArr.map(_ => new Date(_));
      
      let earliestDate = this.$moment(Math.min(...dateArr)).format('YYYY-MM-DD');
      let latestDate  = this.$moment(Math.max(...dateArr)).format('YYYY-MM-DD');
      
      let res = this.formData.dateType === 1
        ? await sheetInterface.getCustomPastData({
          EdbInfoIdList: this.$parent.config.data.map(_ => _.EdbInfoId),
          Num: Number(this.formData.value),
          EndDate: earliestDate
        })
        : await sheetInterface.getCustomFutureData({
          EdbInfoIdList: this.$parent.config.data.map(_ => _.EdbInfoId),
          DateType: 2,
          StartDate: latestDate,
          EndDate: this.formData.endDate
        })

      if(res.Ret !== 200) return
      this.$message.success('添加成功');
      this.$emit('success',{ type: this.formData.dateType===1?'past':'future',data: res.Data})
      this.cancelHandle()
    }
  },
}
</script>
<style scoped lang='scss'>
.dialog-main {
  padding-left: 50px;
}
.dia-bot {
		margin: 52px 0 30px;
		display: flex;
		justify-content: center;

	}
</style>
