<template>
  <div>
    <v-icon v-if="column.pk" color="warning" x-small class="mr-1">
      mdi-key-variant
    </v-icon>
    <v-icon v-else-if="uiDatatypeIcon" small class="mr-1">
      {{ uiDatatypeIcon }}
    </v-icon>

    <v-icon v-else-if="isForeignKey" color="purple" small class="mr-1">
      mdi-link-variant
    </v-icon>

    <span v-else-if="isInt" class="font-weight-bold mr-1" style="font-size: 15px">#</span>
    <!--    <v-icon color="grey" class="mr-1" v-if="isInt">mdi-numeric</v-icon>-->
    <v-icon v-else-if="isFloat" color="grey" class="mr-1 mt-n1">
      mdi-decimal
    </v-icon>
    <v-icon v-else-if="isDate" color="grey" small class="mr-1">
      mdi-calendar
    </v-icon>
    <v-icon v-else-if="isDateTime" color="grey" small class="mr-1">
      mdi-calendar-clock
    </v-icon>
    <v-icon v-else-if="isSet" color="grey" small class="mr-1">
      mdi-checkbox-multiple-marked
    </v-icon>
    <v-icon v-else-if="isEnum" color="grey" small class="mr-1">
      mdi-radiobox-marked
    </v-icon>
    <v-icon v-else-if="isBoolean" color="grey" small class="mr-1">
      mdi-check-box-outline
    </v-icon>
    <v-icon v-else-if="isString" color="grey" class="">
      mdi-alpha-a
    </v-icon>
    <v-icon v-else-if="isTextArea" color="grey" small class="mr-1">
      mdi-card-text-outline
    </v-icon>
  </div>
</template>

<script>
import cell from '@/components/project/spreadsheet/mixins/cell'

export default {
  name: 'FieldsMenuItem',
  mixins: [cell],
  props: {
    sqlUi: [Object, Function],
    column: Object
  }
}
</script>

<style scoped>

</style>
