<template>
  <div>
    <Modal v-model="preparationModal" :mask-closable=false width="400">
      <p slot="header">
        填写存放信息
      </p>
      <Form id="edit-form" ref="formObj" :model="formObj" :rules="ruleValidate" :label-width="70">
        <Form-item label="存储期限（天）" prop="timeLimit">
          <!--<Date-picker-->
          <!--v-model="formObj.timeLimit"-->
          <!--type="date"-->
          <!--placeholder="请选择存储期限"-->
          <!--style="width: 100%;"-->
          <!--:editable="false"-->
          <!--@on-change="_sampleDeliveryTimeChange"-->
          <!--/>-->
          <Input
            type="number"
            v-model="formObj.timeLimit"
            name="timeLimit"
            @keydown.native="channelInputLimit"
            placeholder="请输入存储期限"
            clearable
          />
        </Form-item>
        <Form-item label="存储位置" prop="position">
          <Input
            v-model="formObj.position"
            name="position"
            placeholder="请输入存储位置"
            clearable
          />
        </Form-item>

        <Form-item label="留样数量" prop="quantity">
          <Input
            type="number"
            @keydown.native="channelInputLimit"
            v-model="formObj.quantity"
            name="quantity"
            placeholder="请输入留样数量"
            clearable
          />
        </Form-item>

        <Form-item label="单位" prop="unit">
          <Input
            v-model="formObj.unit"
            name="unit"
            placeholder="请输入留样数量单位"
            clearable
          />
        </Form-item>
      </Form>
      <div slot="footer">
        <modal-footer ref="footerModal" :footer="footerList" @on-result-change="_footerResult" />
      </div>
    </Modal>
  </div>
</template>

<script>
import { drugSampleKeep } from '../../api'
const defVal = {
  timeLimit: '',
  quantity: '',
  unit: '',
  storageLocation: '#01'
}
export default {
  name: 'PreparationManageEdit',
  data() {
    return {
      id: '',
      formObj: defVal,
      ruleValidate: {
        timeLimit: [
          { required: true, message: '存储期限不能为空!', trigger: 'blur' }
        ],
        storageLocation: [
          { required: true, message: '存储位置不能为空!', trigger: 'blur' }
        ]
      },
      preparationModal: false,
      footerList: [
        { id: '', name: '取消', type: '' },
        { id: '', name: '保存', type: 'primary' }
      ],
      producerList: [],
      selectIds: []
    }
  },
  methods: {
    _open(ids) {
      this.preparationModal = true
      this.selectIds = ids
      this.$refs.formObj.resetFields()
      this.formObj = Object.assign({}, defVal)
      this._hideLoading()
    },
    _footerResult(name) {
      switch (name) {
        case '取消':
          this._cancel()
          break
        case '保存':
          this._ok()
          break
      }
    },
    channelInputLimit(e) {
      const key = e.key
      // 不允许输入'e'和'.'
      if (key === 'e' || key === '.') {
        e.returnValue = false
        return false
      }
      return true
    },
    _ok() {
      this.$refs.formObj.validate(valid => {
        if (valid) {
          const data = this.$serialize('edit-form')
          this._save(data)
        } else {
          this.$Message.error('表单验证失败')
          this._hideLoading()
        }
      })
    },
    _cancel() {
      this.preparationModal = false
    },
    _resultChange(msg) {
      this.preparationModal = false
      this.$Message.success(msg)
      this.$emit('on-result-change')
    },
    _hideLoading() {
      this.$refs.footerModal._hideLoading()
    },
    // 添加、编辑保存
    async _save(data) {
      // 添加
      const result = await drugSampleKeep.saveKeepInfo({
        ids: this.selectIds,
        obj: data
      })
      if (result) {
        this._resultChange('保存成功!')
      }
      this._hideLoading()
    }
    // async _save(data) {
    //   // 添加
    //   if (this.$string(this.id).isEmpty()) {
    //     const result = await sampleLibrary.add(data)
    //     this._resultChange(result, '添加成功')
    //   } else {
    //     // 编辑
    //     const result = await sampleLibrary.edit({
    //       id: this.formObj.id,
    //       obj: data
    //     })
    //     this._resultChange(result, '编辑成功')
    //   }
    // }
  }
}
</script>

<style scoped>
</style>
