getCategory

• Функция для получения конфигурации для категории

Пример использования:

BARSBEAUTYBUSINESSEDUCATIONENTERTAINMENTEVENTFOODINFOMEDICINEMISCMUSICNONESHELTERSHOPPINGSIGHTSEEINGSPORTTRANSPORT

<script setup lang="ts">
    import { getCategory } from './getCategory';
    import { CategoryItem } from './CategoryItem';

    import { ref, onMounted, shallowRef } from 'vue';

    import { ItemCategoryModel } from '@/gql/graphql';

    const selectedCategory = ref('BARS');
    const categoryItem = shallowRef<CategoryItem>(getCategory('BARS'));

    const loadCategory = () => {
        categoryItem.value = getCategory(selectedCategory.value);
    };

    onMounted(loadCategory);

</script>

<template>
    <div class="category-preview">
        <select
            v-model="selectedCategory"
            class="category-preview__select"
            @change="loadCategory"
        >
            <option
                v-for="(value, key) in ItemCategoryModel"
                :key="key"
                :value="value"
            >
                {{ value }}
            </option>
        </select>
        <div
            v-if="categoryItem"
            class="category-preview__icon"
            :style="{ backgroundColor: categoryItem.color }"
        >
            <component
                :is="categoryItem.icon"
                height="28"
                width="28"
            />
        </div>
    </div>
</template>

interface CategoryItem {
    color: string;
    value: ItemCategoryModel;
    locale: string;
    icon: Component;
}