<!--
     有效期编辑
    @Author:laiyh
    @Date:  2020-08-03
-->
<template>
  <el-form ref="termValidForm" :model="form" inline>
    <el-form-item>
      <dg-radio v-model="form.type" label="1" call-off>长期</dg-radio>
      <dg-radio v-model="form.type"  label="2" call-off>自选</dg-radio>
      <dg-date-picker
        v-model="form.activeTime"
        type="date"
        placeholder="选择日期"
        value-format="yyyy-MM-dd"
        style="display: inline-block; width: 180px"
        :picker-options="pickerOptions1"
        :disabled="!form.type || form.type == '1'"
      >
      </dg-date-picker>
    </el-form-item>
    <div v-footer>
      <dg-button @click="handleClose">取消</dg-button>
      <dg-button type="primary" @click="handlSave">保存</dg-button>
    </div>
  </el-form>
</template>

<script>
export default {
  name: 'term-validity',
  // 接收父页面传过来的属性
  props: {
    operatorRow: {
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  // 页面数据绑定
  data() {
    return {
      form: {
          type: "",
          activeTime: ""
      },
      // 有效期只能选择当前日期 及往后日期
      pickerOptions1: {
        disabledDate: function (time) {
          return time.getTime() < Date.now() - 8.64e7;
        }
      }
    };
  },
  // 计算属性
  computed: {},
  // 方法
  methods: {
    handleClose() {
      this.$emit('close');
    },
    handlSave() {
      const that = this;
      const { activeTime, type } = this.form;
      let time = "长期"
      if (type && type == '2') {
        if (!activeTime) {
          that.$message({ type: 'warning', message: '请选择失效日期！' });
          return;
        }
        time = activeTime;
      } 
        that.$emit('success', {...this.operatorRow, activeTime: time});

    }
  },
  // 创建组件时调用
  created() {
    if (this.operatorRow.activeTime == '长期') {
      this.form.type = '1';
      this.form.activeTime= '';
    } else {
      this.form.type = '2';
      this.form.activeTime = this.operatorRow.activeTime;
    }
  }
};
</script>

<style scoped></style>
