<template>
  <el-dialog :visible.sync="newIntegral.show" width="800px" center :title="newIntegral.id ? '修改兑换码' : '生成兑换码'">
    <el-form label-width="150px" :model="newIntegral" ref="newIntegral">
      <el-form-item label="名称" prop="name"
        :rules="[{ required: true, message: '请输入名称', trigger: 'blur' }]">
        <el-input v-model="newIntegral.name"/>
      </el-form-item>
      <el-form-item label="商品" prop="goods_id"
        :rules="[{ required: true, message: '请选择商品', trigger: 'change' }]">
        <el-select v-model="newIntegral.goods_id" filterable>
          <el-option v-for="data in goodsList" :key="data.id" :label="`【${data.id}】${data.name}`" :value="data.id"/>
        </el-select>
      </el-form-item>
      <el-form-item label="活动方案">
        <el-select
          v-model="newIntegral.source"
          :popper-class="'refresh-select-multi width-480'"
          style="width: 480px" placeholder="请选择" filterable>
          <el-option
            v-for="(data,index) in classSource"
            :key="index"
            :label="data.name"
            :value="data.type" >
          </el-option>
        </el-select>
      </el-form-item >
      <el-form-item label="数量" prop="num"
        :rules="[{ required: true, message: '请输入数量', trigger: 'blur' }]">
        <el-input-number v-model="newIntegral.num"/>
      </el-form-item>
      <el-form-item label="失效时间" prop="expire_at"
        :rules="[{ required: true, message: '请选择失效时间', trigger: 'change' }]">
        <el-date-picker
          v-model="newIntegral.expire_at"
          type="datetime"
          format="yyyy-MM-dd HH:mm:ss"
          value-format="yyyy-MM-dd HH:mm:ss"
          :picker-options="pickerOptions0"
          placeholder="选择日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="备注" prop="desc"
        :rules="[{ required: true, message: '请填写备注信息', trigger: 'blur' }]">
        <el-input v-model="newIntegral.desc"/>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="newIntegral.show = false">取 消</el-button>
      <el-button type="primary" @click="onAdd">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import {getSourceStudentApi} from "../../service/api";
  export default {
    name: "add",
    data(){
      return {
        pickerOptions0: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;
          }
        },
        classSource:[]
      }
    },
    created(){
      getSourceStudentApi().then(res=>{
        this.classSource = res
      })
    },
    props:[
      'newIntegral',
      "goodsList"
    ],
    methods:{
      reSetForm(){
        this.$refs.newIntegral.resetFields()
      },
      onAdd(){
        this.$refs.newIntegral.validate(ref =>{
          if(ref){
            if(this.newIntegral.id){
              this.$emit('subEdit')
            }else{
              this.$emit('subAdd')
            }
          }
        });
      }
    },
    watch:{
      'newIntegral.show'(value){
        if(value && !this.newIntegral.id){
          this.$nextTick(()=>{
            this.reSetForm()
          })
        }
      }
    }
  }
</script>

<style scoped>

</style>
