<template>
  <div class="text-xs-center">
    <el-input
      ref="inp"
      v-model="inputText"
      :disabled="couldNotEdit || name == ''"
      size="small"
      @input="changeValue"
      class="table_in_input"
    ></el-input>
  </div>
</template>

<script>
import helper from "@/services/helper";
export default {
  props: {
    item: {
      type: String,
      default: ""
    },
    header: {
      type: String,
      default: ""
    },
    id: {
      type: String,
      default: ""
    },
    name: {
      type: String,
      default: ""
    },
    rowId: {
      type: Number,
      default: 0
    },
    couldNotEdit: {
      type: Boolean,
      default: false
    }
  },
  data: () => ({
    inputText: ""
  }),
  mounted() {
    this.inputText = this.item;
  },
  methods: {
    changeValue() {
      this.$emit("changeInputValue", {
        rowId: this.rowId,
        header: this.header,
        inputValue: this.inputText,
        id: this.id
      });
    }
  }
};
</script>
<style scoped>
.text-xs-center {
  height: 32px;
}

.table_in_input {
  text-align: center;
  font-size: 14px;
}
</style>
<style>
.text-xs-center input {
  width: 100%;
  background-color: #f7f8f9;
  border-radius: 4px;
}
.text-xs-center .el-input.is-disabled .el-input__inner {
  color: #70747C;
}
</style>