hrms-edm/Services/client/src/components/FileIcon.vue

<script setup lang="ts">
import { useFileInfoStore } from '@/stores/file-info-data'

const { mimeFileMapping } = useFileInfoStore()

defineProps<{ fileMimeType: string | undefined; size: string }>()

function getIcon(mimeType: string) {
  if (mimeFileMapping.hasOwnProperty(mimeType)) {
    return mimeFileMapping[mimeType].icon
  } else {
    return 'mdi-file-question-outline'
  }
}
function getColor(mimeType: string) {
  if (mimeFileMapping.hasOwnProperty(mimeType)) {
    return mimeFileMapping[mimeType].color
  } else {
    return 'blue-11'
  }
}
function getSize(s: string) {
  if (s === 'preview') {
    return '6em'
  }
  if (s === 'list') {
    return '2em'
  }
}
</script>

<template>
  <q-icon
    :name="fileMimeType && getIcon(fileMimeType)"
    :color="fileMimeType && getColor(fileMimeType)"
    :size="getSize(size)"
  />
</template>