<template>
  <el-table-column :label="label" :prop="prop" :min-width="minWidth" :align="align" :fixed="fixed" :width="width">
    <template slot-scope="scope">
      <el-input-number v-model="scope.row[prop]" style="width: 92%;"
                       :disabled="disabled" :min="min" :max="max"  @change="(currentValue,oldValue) => change(currentValue,oldValue,scope.row,scope.$index)"
                       :precision="precision" :controls="false"  @blur="$emit('blur', scope.row)" class="custom-number" :step="step"/>
    </template>
  </el-table-column>
</template>

<script>
export default {
  name: 'InputNumberColumn',
  props: {
    step: {
      type: Number,
      default: 1, // 默认步长为1
    },
    label: {
      type: String,
      default: '',
    },
    prop: {
      type: String,
    },
    minWidth: {
      type: Number,
      default: 150,
    },
    width: {
      type: Number,
    },
    min: {
      type: Number,
      default: 0,
    },
    max: {
      type: Number,
      default: 99999999,
    },
    precision: {
      type: Number,
      default: 0,
    },
    disabled:{
      type: Boolean,
      default: false
    },
    align:{
      type: String,
      default: 'left'
    },
    fixed: {
      type: String,
    },
  },
  methods:{
    change(currentValue, oldValue,row,index){
      this.$emit('change',{currentValue:currentValue,oldValue:oldValue,row:row,index:index})
    },
  }
}
</script>

<style scoped>
.custom-number .el-input{
  margin: 0;
  padding: 0;
}
/*.custom-number .el-input,*/
.custom-number .el-input__inner {
  /*width: 90px !important;*/
  padding-left: 4px !important;
  padding-right: 4px !important;
}
custom-number el-input-number el-input-number--medium is-without-controls{
  padding: 0px;
}
</style>
