<template>
  <a-modal
    centered
    class="inventoryCheckAddModal-modal"
    :footer="null"
    :maskClosable="false"
    :closable="false"
    title="新增盘点单"
    v-model="isShow"
    @cancel="isShow=false"
    :width="600">
    <a-spin :spinning="spinning" tip="Loading...">
      <div>
        <div class="inventoryCheckAddModal-con">
          <h3>全盘盘点</h3>
          <p>全盘是指所有有过入库记录的产品都参与盘点</p>
          <p>确定创建新的盘点单吗？</p>
          <p v-show="isShowWarehouse">
            仓库：<warehouse
              style="width:200px;"
              v-model="form.warehouseSn"
              isPermission
              id="inventoryCheckAddModal-warehouseSn"
              placeholder="请选择仓库"
            />
          </p>
        </div>
        <div class="btn-cont">
          <a-button id="inventoryCheckAddModal-back" @click="isShow = false" style="margin-right: 15px;">取消</a-button>
          <a-button type="primary" id="inventoryCheckAddModal-save" @click="handleSave">确定</a-button>
        </div>
      </div>
    </a-spin>
  </a-modal>
</template>

<script>
import { commonMixin } from '@/utils/mixin'
import { checkWarehouseSave } from '@/api/checkWarehouse'
import warehouse from '@/views/common/chooseWarehouse.js'
export default {
  name: 'ProductInfoDetailModal',
  mixins: [commonMixin],
  components: { warehouse },
  props: {
    openModal: { //  弹框显示状态
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      spinning: false,
      form: { warehouseSn: undefined }, // 仓库sn
      isShow: this.openModal //  是否打开弹框
    }
  },
  methods: {
    // 确定
    handleSave () {
      if (this.isShowWarehouse && !this.form.warehouseSn) {
        this.$message.error('请选择仓库')
        return
      }
      this.spinning = true
      checkWarehouseSave(this.form).then(res => {
        this.spinning = false
        if (res.status == 200) {
          this.$message.success('盘点单新增成功')
          this.$emit('ok', res.data)
          this.isShow = false
        }
      })
    }
  },
  watch: {
    //  父页面传过来的弹框状态
    openModal (newValue, oldValue) {
      this.isShow = newValue
    },
    //  重定义的弹框状态
    isShow (newValue, oldValue) {
      if (!newValue) {
        this.form.warehouseSn = undefined
        this.$emit('close')
      } else {
        // 默认仓库
        const defWareHouse = this.$store.state.app.defWarehouse
        this.form.warehouseSn = this.isShowWarehouse ? undefined : (defWareHouse ? defWareHouse.warehouseSn : undefined)
      }
    }
  }
}
</script>

<style lang="less">
  .inventoryCheckAddModal-modal{
    .ant-modal-body {
      padding: 30px 40px 24px;
    }
    .inventoryCheckAddModal-con{
      text-align: center;
      h3{
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 25px;
      }
    }
    .btn-cont {
      text-align: center;
      margin: 35px 0 10px;
    }
  }
</style>
