<template>
  <el-dialog title="修改库存" :visible.sync="show" width="390px" :before-close="close" append-to-body>
    <div v-loading="loading" class="text-center">
      <!-- <span class="mr20">库存数量：</span><el-radio v-model="calculate" :label="true">增加</el-radio>
      <el-radio v-model="calculate" :label="false">减少</el-radio> -->
      <div class="pt20">
        <el-select v-model="calculate" placeholder="请选择" style="width:90px;" class="prepend-select">
          <el-option label="增加" :value="1"></el-option>
          <el-option label="减少" :value="2"></el-option>
        </el-select>
        <el-input-number placeholder="请输入调整库存数" controls-position="right" :precision="0" :min="0" :max="max" v-model="count" class="w200 block-center insert-input" size="small" @blur="checkCalc"></el-input-number>
      </div>
      <div class="mt20">
        <span class="mr20">目标库存：</span>
        <el-input-number :disabled="true" :precision="0" controls-position="right" :min="0" :value="stock" class="w200 inline-block" size="small" />
      </div>
      <slot></slot>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="close">取消</el-button>
      <el-button type="primary" :loading="loading" @click="submit">确认</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  name: 'AdjustStock',
  props: {
    totalCount: {
      type: Number,
      default: 0
    },
    show: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      loading: false,
      count: 0,
      calculate: 1 // int	1: 增加; 2: 减少
    };
  },
  methods: {
    checkCalc() {
      if (this.calculate == 2) {
        if (this.count > this.totalCount) {
          this.count = this.totalCount;
          this.$tips({ type: 'warning', message: '输入数量不能大于总数' });
        }
      }
    },
    close() {
      this.loading = false;
      this.$emit('update:show', false);
      this.count = 0;
      this.calculate = 1;
    },
    submit() {
      if (this.calculate == 2) {
        if (this.count > this.totalCount) {
          this.count = this.totalCount;
          this.$tips({ type: 'warning', message: '输入数量不能大于总数' });
          return;
        }
      }
      if(this.count <= 0) {
        this.$tips({ type: 'warning', message: '调整值不正确' });
        return;
      }
      let params = {
        optType: this.calculate || 1, // 是	int	1: 增加; 2: 减少
        count: this.count // 是	int	增加或者减少数量
      };
      this.$emit('handleSubmit', params);
    }
  },
  computed: {
    max() {
      return this.calculate == 1 ? 100000 : this.totalCount;
    },
    stock() {
      const num = this.calculate == 1 ? parseInt(this.totalCount) + parseInt(this.count) : parseInt(this.totalCount) - parseInt(this.count);
      return num;
    },
  },
  watch: {
    calculate(val) {
      this.count = 0;
    }
  }
};
</script>

<style lang="scss" scoped>
.prepend-select /deep/ {
  .el-input__inner {
    box-shadow: none !important;
    border-color: #c4c6cf !important;
    border-right: none !important;
    border-radius: 2px 0 0 2px;
  }
}
.insert-input /deep/ {
  .el-input__inner {
    border-radius: 0 2px 2px 0;
  }
}
</style>