<template>
  <h1>{{ type.d }}</h1>
  <div v-for="(column,index) in type.edit_object.columns">
    <div v-if="column.vt=='i4'" :style="{ backgroundColor: index % 2 === 0 ? 'var(--row-color-1)' : 'var(--row-color-2)' }">
      <div style="width:150px;display:inline-block;">{{column.d}}</div>
      <input type="text" v-model="column.value">
      <input type="button" class="button-secondary" style="width:22px;margin:0px;padding:0px;" :click="column.value += 1" value="+" title="trt('Increase_by_1')">
      <input type="button" class="button-secondary" style="width:22px;margin:0px;padding:0px;" :click="column.value -= 1" value="-" title="trt('Decrease_by_1')">
    </div>
    <div v-if="column.vt=='object'" :style="{ backgroundColor: index % 2 === 0 ? 'var(--row-color-1)' : 'var(--row-color-2)' }">
      <div style="width:150px;display:inline-block;">{{column.d}}</div>
      <input type="text">
    </div>
    <div v-if="column.vt=='string'" :style="{ backgroundColor: index % 2 === 0 ? 'var(--row-color-1)' : 'var(--row-color-2)' }">
      <div style="width:150px;display:inline-block;">{{column.d}}</div>
      <input type="text">
    </div>
  </div>
  <div style="display: flex; justify-content: space-between;">
    <div>
      <label><input type="checkbox">trt('Repeat_the_addition_of_the_entry')</label>
    </div>
    <div>
      <div style="display: inline-block;">
        <input type="button" class="button-secondary" value="trt('Apply')">
        <input type="button" class="button-secondary" value="trt('Cancel')">
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "show_object"
}
</script>

<style scoped>

</style>