<template>
  <div class="app-content" style="height:330px;overflow:auto;">
    <a-spin :spinning="loading" style="width: 100%;height: 100%;">
      <a-form-model ref="formRef" :model="formData" :rules="formRules" class="from-table">
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div class="required">申报年度</div>
          </a-col>
          <a-col :span="6">
            <a-form-model-item ref="year" prop="year">
              <base-select v-model="formData.year" :type="8" :width="160" />
            </a-form-model-item>
          </a-col>
          <a-col :span="4" class="bg-gray">
            <div class="required">申报批次</div>
          </a-col>
          <a-col :span="8">
            <a-form-model-item ref="batch" prop="batch">
              <base-select v-model="formData.batch" :type="10" :width="160" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div class="required">项目申报时间</div>
          </a-col>
          <a-col :span="18">
            <a-form-model-item ref="reportRange" prop="reportRange">
              <a-range-picker v-model="formData.reportRange" show-time format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" @change="reportDateChange" :placeholder="['开始时间', '结束时间']" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div class="required">州市级及以下单位上报时间</div>
          </a-col>
          <a-col :span="18">
            <a-form-model-item ref="unitRange" prop="unitRange">
              <a-range-picker v-model="formData.unitRange" show-time format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" @change="unitDateChange" :placeholder="['开始时间', '结束时间']" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div class="required">州市级行政单位审核时间</div>
          </a-col>
          <a-col :span="18">
            <a-form-model-item ref="prefectureRange" prop="prefectureRange">
              <a-range-picker v-model="formData.prefectureRange" show-time format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" @change="prefectureDateChange" :placeholder="['开始时间', '结束时间']" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div class="required">省直单位上报时间</div>
          </a-col>
          <a-col :span="18">
            <a-form-model-item ref="provinceRange" prop="provinceRange">
              <a-range-picker v-model="formData.provinceRange" show-time format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" @change="provinceDateChange" :placeholder="['开始时间', '结束时间']" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div class="required">专家审核时间</div>
          </a-col>
          <a-col :span="18">
            <a-form-model-item ref="expertRange" prop="expertRange">
              <a-range-picker v-model="formData.expertRange" show-time format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" @change="expertDateChange" :placeholder="['开始时间', '结束时间']" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6" class="bg-gray">
            <div>备注</div>
          </a-col>
          <a-col :span="18">
            <a-form-model-item ref="remark" prop="remark">
              <a-input v-model="formData.remark" style="width:450px" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col style="text-align: center;width:100%;">
            <a-button type="primary" style="width:68px;" @click="submit">提交</a-button>
          </a-col>
        </a-row>
      </a-form-model>
    </a-spin>
  </div>
</template>

<script>
import { getType } from '@/views/utils/auth'
import { isEmptyParams, checkDateRange } from '@/views/utils/common'
import moment from 'moment'
import baseSelect from '@/views/components/common/baseSelect'

export default {
  name: "batchEdit",
  components: {
    baseSelect
  },
  data () {
    return {
      formData: {
        id: null,
        year: moment().format('YYYY'),
        batch: '1',
        reportStart: '',
        reportEnd: '',
        auditStart: '',
        auditEnd: '',
        expertStart: '',
        expertEnd: '',
        remark: '',
        reportRange: [],
        unitRange: [],
        prefectureRange: [],
        provinceRange: [],
        expertRange: [],
        projType: getType()
      },
      formRules: {
        id: [{ required: false }],
        year: { required: true, message: '请输入申报年度' },
        batch: { required: true, message: '请输入申报批次' },
        reportRange: [{ required: true, validator: checkDateRange, trigger: 'blur' }],
        unitRange: [{ required: true, validator: checkDateRange, trigger: 'blur' }],
        prefectureRange: [{ required: true, validator: checkDateRange, trigger: 'blur' }],
        provinceRange: [{ required: true, validator: checkDateRange, trigger: 'blur' }],
        expertRange: [{ required: true, validator: checkDateRange, trigger: 'blur' }],
        remark: [{ required: false }]
      },
      loading: false,
    }
  },
  props: {
    value: {
      type: String,
      default: () => {
        return null
      }
    },
  },
  created () {
    if (this.value) {
      this.loading = true
      this.getBatchById()
    }
  },
  methods: {
    moment,
    getBatchById () {
      this.$api.batch.getBatchById({ id: this.value }).then(({ data = {} }) => {
        if (data) {
          this.formData.id = data.id
          this.formData.year = data.year + ''
          this.formData.projType = data.projType
          this.formData.reportStart = data.reportStart
          this.formData.reportEnd = data.reportEnd
          this.formData.auditStart = data.auditStart
          this.formData.auditEnd = data.auditEnd
          this.formData.expertStart = data.expertStart
          this.formData.expertEnd = data.expertEnd
          this.formData.remark = data.remark
          this.formData.reportRange = [data.reportStart, data.reportEnd]
          this.formData.unitRange = [data.unitStart, data.unitEnd]
          this.formData.prefectureRange = [data.prefectureStart, data.prefectureEnd]
          this.formData.provinceRange = [data.provinceStart, data.provinceEnd]
          this.formData.expertRange = [data.expertStart, data.expertEnd]
        }
        this.loading = false
      }).catch(() => { this.loading = false })
    },
    submit () {
      this.$refs.formRef.validate(valid => {
        if (valid) {
          this.loading = true
          let pars = isEmptyParams(this.formData)
          if (this.value) {
            this.$api.batch.updateBatch({ ...pars }).then(({ data }) => {
              if (data) {
                this.$message.success('修改成功！')
                this.$emit('close', 'edit')
              }
            }).catch(() => { this.loading = false })
          } else {
            this.$api.batch.addBatch({ ...pars }).then(({ data }) => {
              if (data) {
                this.$message.success('添加成功！')
                this.$emit('close', 'edit')
              }
            }).catch(() => { this.loading = false })
          }
        }
      })
    },
    //起止日期选择处理
    reportDateChange (dates, dateStrings) {
      if (dateStrings[0] != '' && dateStrings[1] != '') {
        this.formData.reportStart = dateStrings[0]
        this.formData.reportEnd = dateStrings[1]
      }
    },
    unitDateChange (dates, dateStrings) {
      if (dateStrings[0] != '' && dateStrings[1] != '') {
        this.formData.unitStart = dateStrings[0]
        this.formData.unitEnd = dateStrings[1]
      }
    },
    prefectureDateChange (dates, dateStrings) {
      if (dateStrings[0] != '' && dateStrings[1] != '') {
        this.formData.prefectureStart = dateStrings[0]
        this.formData.prefectureEnd = dateStrings[1]
      }
    },
    provinceDateChange (dates, dateStrings) {
      if (dateStrings[0] != '' && dateStrings[1] != '') {
        this.formData.provinceStart = dateStrings[0]
        this.formData.provinceEnd = dateStrings[1]
      }
    },
    expertDateChange (dates, dateStrings) {
      if (dateStrings[0] != '' && dateStrings[1] != '') {
        this.formData.expertStart = dateStrings[0]
        this.formData.expertEnd = dateStrings[1]
      }
    },
  }
}
</script>