<template>
  <el-dialog
    v-if="dialogShow"
    title="仓位信息"
    append-to-body
    :visible.sync="dialogVisible"
    :before-close="handleClose"
    width="1100px"
    destroy-on-close
    @close="close"
  >
    <el-form ref="form3" :model="formMst" :rules="rules" size="mini" label-width="130px">
      <el-row>
        <el-col :span="8">
          <el-form-item label="所属库区:">
            <el-cascader
              placeholder="所属库区"
              :options="sects"
              :props="{ checkStrictly: true }"
              clearable
              style="width: 210px"
              class="filter-item"
              @change="sectQueryChange"
            />
          </el-form-item>
        </el-col>

       <!-- <el-col :span="8">
          <el-form-item label="仓位前缀:">
            <el-input v-model="formMst.prefix" placeholder="如：91、B21、C31等" size="mini" style="width: 210px" />
          </el-form-item>
        </el-col>-->

        <el-col :span="8">
          <el-form-item label="生成数量:">
            <el-input-number :precision="0" :step="1" :min="1" :max="90000" v-model="formMst.num" size="mini" :controls="false" style="width: 210px" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="20" style="border: 1px solid white">
          <span />
        </el-col>
        <el-col :span="4">
          <span>
            <el-button icon="el-icon-check" size="mini" type="primary" :loading="loadingBut" @click="oneCreate">保存</el-button>
            <el-button icon="el-icon-close" size="mini" type="info" @click="close">关闭</el-button>
          </span>
        </el-col>
      </el-row>
    </el-form>

  </el-dialog>
</template>

<script>

import CRUD, { crud } from '@crud/crud'
import crudStructattr from '@/views/wms/basedata/structattr/structattr'

export default {
  name: 'SunShowDialog',
  mixins: [crud()],
  props: {
    dialogShow: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      formMst: {
        stor_id: '',
        sect_id: '',
        prefix: '',
        num: 0
      },
      sects: [],
      dialogVisible: false,
      loadingBut: false
    }
  },
  watch: {
    dialogShow: {
      handler(newValue, oldValue) {
        this.dialogVisible = newValue
      }
    }
  },
  methods: {
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done()
        })
        .catch(_ => {
        })
    },
    close() {
      this.$refs['form3'].resetFields()
      this.$emit('update:dialogShow', false)
    },
    sectQueryChange(val) {
      if (val.length === 1) {
        this.formMst.stor_id = val[0]
        this.formMst.sect_id = ''
      }
      if (val.length === 0) {
        this.formMst.sect_id = ''
        this.formMst.stor_id = ''
      }
      if (val.length === 2) {
        this.formMst.stor_id = val[0]
        this.formMst.sect_id = val[1]
      }
    },
    oneCreate() {
      if (this.formMst.sect_id === '') {
        return this.crud.notify('库区不能为空', CRUD.NOTIFICATION_TYPE.INFO)
      }

      if (this.formMst.num === '') {
        return this.crud.notify('数量不能为空', CRUD.NOTIFICATION_TYPE.INFO)
      }
      this.loadingBut = true
      crudStructattr.oneCreate(this.formMst).then(res => {
        this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
        this.close()
        this.crud.toQuery()
        this.loadingBut = false
      }).catch(() => {
        this.loadingBut = false
      })
    },
    blurQuery() {
      this.loadingBut = true
      crudStructattr.blurQuery({ 'prefix': this.formMst.prefix }).then(res => {
        this.crud.notify('可使用此前缀!', CRUD.NOTIFICATION_TYPE.SUCCESS)
        this.loadingBut = false
      }).catch(() => {
        this.loadingBut = false
      })
    }
  }
}
</script>

<style scoped>

</style>
