<script setup lang="ts">
  import type {Variant} from "~/types/variant";

  const props = defineProps({
    variant: {type: Object as PropType<Variant>, required: true},
    variantIndex: {type: Number, required: true},
  });
</script>

<template>
  <v-row
      align="start"
  >
    <v-col cols="2">
      <v-row>
        <v-text-field
            v-model.trim="variant.weight"
            label="Gewicht"
            :readonly="true"
        />
      </v-row>
      <v-row>
        <v-text-field
            v-model.trim="variant.ean"
            label="EAN"
            :readonly="true"
        />
      </v-row>
    </v-col>

    <v-col cols="5">
      <v-text-field
          v-model="variant.description"
          label="Bezeichnung"
          :readonly="true"
          hide-details
      />
    </v-col>

    <v-col cols="5">
      <v-text-field
          v-model="variant.ingredients"
          label="Zutaten"
          :readonly="true"
          hide-details
      />
    </v-col>
  </v-row>
</template>

<style scoped>

</style>