<template>
  <div>
    <Modal v-model="chemicalStockOutModal" :mask-closable="false">
      <p slot="header">
        仪器一键出库
      </p>
      <div>
        <Form id="storage-form-storeOut" ref="formObj" :model="formObj" :rules="ruleValidate" :label-width="80">
          <Form-item label="领用人" prop="applyer">
            <Input v-model="formObj.applyer" name="applyer" disabled="true" /></Input>
          </Form-item>
          <Form-item label="领用时间" prop="applyDate">
            <Date-picker
              v-model="formObj.applyDate"
              type="datetime"
              placeholder="领用时间"
              style="width: 100%;"
              @on-change="_timeChange"
            />
            <input name="applyDate" type="hidden">
          </Form-item>
          <Form-item label="发放人" prop="grantName">
            <Select v-model="formObj.grantName" filterable style="width:100%" @on-change="_selectChange">
              <Option v-for="item in salesmanList" :key="item" :value="item">
                {{ item }}
              </Option>
            </Select>
          </Form-item>
          <Form-item label="仪器性能" prop="performance">
            <Input v-model="formObj.performance" name="performance" placeholder="请输入仪器性能" value="正常" /></Input>
          </Form-item>
          <Form-item label="备注" prop="remark">
            <Input v-model="formObj.remark" name="remark" placeholder="请输入备注" /></Input>
          </Form-item>
        </Form>
      </div>
      <div slot="footer">
        <Button type="ghost" style="margin-left: 8px" @click="_cancel">
          取消
        </Button>
        <Button type="primary" @click="_ok">
          提交
        </Button>
      </div>
    </Modal>
  </div>
</template>
<script>
import global from '../../../../api/config'
import { equipDeliveryOrder } from '../../../../api'
const defVal = {
  applyer: '',
  applyDate: new Date(),
  grantName: '',
  performance: '正常',
  remark: ''
}

export default {
  components: {},
  data() {
    return {
      id: '',
      formObj: defVal,
      chemicalStockOutModal: false,
      orderId: '',
      ruleValidate: {
        grantName: [
          { required: true, trigger: 'change', message: '发放人不能为空' }
        ]
      },
      selectList: [],
      departmentList: [],
      salesmanList: [],
      salesmanListTemp: [],
      equip: {}
    }
  },
  methods: {
    _selectChange(data) {
      this.formObj.grantName = data
    },
    _resultChange(msg) {
      this.formObj = defVal
      this.chemicalStockOutModal = false
      this.$Message.success(msg)
      this.$emit('on-result-change')
    },
    _ok() {
      this.$refs.formObj.validate(valid => {
        if (valid) {
          const data = this.$serialize('storage-form-storeOut')
          data.orderId = this.orderId
          data.applyer = this.formObj.applyer
          data.applyDate = this.$dateformat(
            this.formObj.applyDate,
            'yyyy-mm-dd HH:MM:SS'
          )
          data.grantName = this.formObj.grantName
          data.performance = this.formObj.performance
          data.remark = this.formObj.remark
          this._save(data)
          // this.$store
          //   .dispatch('LmsEquipOutInStorage/deliveryDirectOut', data)
          //   .then(() => {
          //     this._resultChange('出库成功!')
          //   })
        } else {
          this.$Message.error('表单验证失败!')
        }
      })
    },

    _save: async function(data) {
      const result = await equipDeliveryOrder.outStock(data)
      if (result) {
        this._resultChange('出库成功!')
      }
    },

    _cancel() {
      this.chemicalStockOutModal = false
    },
    _open(data) {
      this.formObj.remark = ''
      this.orderId = data.id
      this.equip = data
      this.chemicalStockOutModal = true
      this.$refs.formObj.resetFields()
      this.formObj.applyer = data.applyer
      $('input[name=applyDate]').val(
        this.$dateformat(new Date(), 'yyyy-mm-dd HH:MM:SS')
      )
      this.remark = ''
      this.salesmanList = []
      this._getUser()
      this._getSalesmanList()
    },
    _getUser() {
      const user = global.getUserInfo()
      this.formObj.grantName = user.realname
    },
    // 人员列表
    _getSalesmanList() {
      // this.$store.dispatch('LmsMarshalManage/userPage').then(() => {
      //   const salesmanList = this.$store.state.LmsMarshalManage.userPage.records
      //   const salesmanListTemp = []
      //   for (let i = 0; i < salesmanList.length; i++) {
      //     salesmanListTemp.push(salesmanList[i].realname)
      //   }
      //   if (salesmanListTemp.indexOf(this.formObj.grantName) === -1) {
      //     salesmanListTemp.push(global.getUserInfo().realname)
      //   }
      //   this.salesmanList = salesmanListTemp
      //   this.salesmanListTemp = this.salesmanList
      // })
    },
    // 出库时间
    _timeChange(data) {
      $('input[name="applyDate"]').val(data)
    }
  }
}
</script>
