recipes/vue3/src/components/inputs/GlobalSearchDialog.vue

<template>
    <v-dialog width="90%" max-width="800px" activator="parent" v-model="dialog" location="id_dialog_anchor">
        <template v-slot:activator="{ props }">
            <slot name="activator">
                <v-btn v-bind="props" size="small" density="default" variant="outlined"><i class="fas fa-search mr-1"></i> Search</v-btn>
            </slot>
        </template>

        <template v-slot:default="{ isActive }">
            <v-card>
                <v-card-text class="pb-0">
                    <v-text-field
                        v-model="search_query"
                        autofocus
                        clearable
                        placeholder="Search"
                        prepend-inner-icon="fas fa-search"
                        variant="solo"
                    ></v-text-field>
                </v-card-text>
                <v-divider></v-divider>
                <v-card-text>

                    <v-card :variant="cardVariant(index)" v-for="(item, index) in search_results" hover class="mt-1" @click="selected_result = index">
                        <v-card-title @click="goToSelectedRecipe()">
                            <v-avatar v-if="item.image" :image="item.image"></v-avatar>
                            <v-icon :icon="item.icon" v-if="item.icon"></v-icon>
                            {{ item.name }}
                        </v-card-title>
                    </v-card>
                </v-card-text>
            </v-card>

        </template>
    </v-dialog>
</template>

<script lang="ts">

import {defineComponent} from 'vue'
import {FlatRecipe, SearchResult} from "@/types/SearchTypes";
import {Recipe} from "@/openapi";

export default defineComponent({
    name: "GlobalSearchDialog",
    props: {},
    data() {
        return {
            dialog: false,
            recipes: [] as Recipe[],
            flat_recipes: [] as Array<FlatRecipe>,
            search_query: null,
            selected_result: 0,
        }
    },
    computed: {
        search_results: function () {
            let search_results = [] as Array<SearchResult>

            if (this.search_query != '' && this.search_query != null) {
                search_results.push({name: this.search_query, icon: 'fas fa-search', suffix: 'Advanced Search'} as SearchResult)

                this.flat_recipes.filter(fr => fr.name.toLowerCase().includes(this.search_query.toLowerCase())).slice(0, 10).forEach(r => {
                    search_results.push({name: r.name, image: r.image, recipe_id: r.id} as SearchResult)
                })
            } else {
                search_results.push({name: 'Recent 1', icon: 'fas fa-history',} as SearchResult)
                search_results.push({name: 'Recent 2', icon: 'fas fa-history',} as SearchResult)
                search_results.push({name: 'Recent 3', icon: 'fas fa-history',} as SearchResult)

                this.flat_recipes.slice(0, 5).forEach(r => {
                    search_results.push({name: r.name, image: r.image, recipe_id: r.id} as SearchResult)
                })
            }

            return search_results
        }
    },
    mounted() {
        window.addEventListener('keydown', (e) => {
            if (e.key == 'ArrowUp') {
                this.selected_result = Math.max(0, this.selected_result - 1)
            }
            if (e.key == 'ArrowDown') {
                this.selected_result = Math.min(this.search_results.length, this.selected_result + 1)
            }
            if (e.key == 'Enter') {
                this.goToSelectedRecipe()
            }
        })

        this.flat_recipes = [{"id":692,"name":"Bouillon papardelle et bolognaise","image":"/media/recipes/0d6b8758-d9a4-4366-bb0a-5917c379cdf8_692.jpeg"},{"id":693,"name":"Pandoro","image":"/media/recipes/8cddf7b6-3cd8-40be-bdc6-cd790c3aa4ea_693.jpeg"},{"id":694,"name":"torta fresca","image":"/media/recipes/53937e26-7353-4753-b9e4-eb68c1044600_694.jpeg"},{"id":695,"name":"aïoli","image":"/media/recipes/10757a7c-6328-45c7-85eb-ca1ca7f3b62e_695.jpeg"},{"id":696,"name":"Aioli senza uovo","image":"/media/recipes/b780c990-ece8-46cd-a995-5da39f74c98a_696.jpeg"},{"id":697,"name":"Anelli di calamari con ricotta e grana padano","image":"/media/recipes/f658a0aa-0188-47ef-9ca2-7c9c9e694a61_697.jpeg"},{"id":698,"name":"Arrosto al forno di manzo","image":"/media/recipes/408afeae-f7b9-492d-a804-951d30f6f4ed_698.jpeg"},{"id":699,"name":"Asparagi bianchi, zabaione al passito e crumble di prosciutto","image":"/media/recipes/8b16e2a8-47fc-4e88-b4c5-4967a430dcef_699.jpeg"},{"id":700,"name":"Avocado al forno","image":"/media/recipes/b108f51f-f2fb-41b6-8ed9-48a7665bbdbe_700.jpeg"},{"id":701,"name":"Baccalà alla potentina","image":"/media/recipes/6c009d14-e864-4487-badb-7cd87d9ebed4_701.jpeg"},{"id":702,"name":"Baccalà alla vicentina","image":"/media/recipes/7da6916b-1ac9-4342-9948-cd9ca669a0e4_702.jpeg"},{"id":703,"name":"Baccalà Pil Pil","image":"/media/recipes/45a241b0-3837-4e8e-bdac-8ba116ae0093_703.jpeg"},{"id":704,"name":"Bagna cauda","image":"/media/recipes/787109fc-3c79-4ff3-a313-043ef4df5f03_704.jpeg"},{"id":705,"name":"Bavarese al cioccolato bianco e lavanda","image":"/media/recipes/e58e530a-307c-4472-b2a4-99f12dd31058_705.jpeg"},{"id":706,"name":"Bavarese Al Mango","image":"/media/recipes/80f1fa3d-a75d-46c0-a309-165a88caad66_706.jpeg"},{"id":707,"name":"Bavarese di ricotta con sorpresa di ribes","image":"/media/recipes/6337a148-a726-45f9-adce-a0c6a0089fdc_707.jpeg"},{"id":708,"name":"Besciamella","image":"/media/recipes/2ad13bf4-4e77-4a85-b3b1-ebae720f8c11_708.jpeg"},{"id":709,"name":"Besciamella senza glutine","image":"/media/recipes/fa8337e7-bfd5-4b27-8c4e-8fd3895f0790_709.jpeg"},{"id":710,"name":"Beurre Blanche","image":"/media/recipes/54338d37-55c6-4575-82cf-130de5eabcab_710.jpeg"},{"id":711,"name":"Biscotti con scaglie di cioccolato","image":"/media/recipes/558a2ea8-e981-42e8-a545-465de2ed232f_711.jpeg"},{"id":712,"name":"Biscotti dita di strega per Halloween","image":"/media/recipes/12b82a9c-de2d-4ead-bdfe-81bfd12fbae7_712.jpeg"},{"id":713,"name":"Biscotti Salati","image":"/media/recipes/8c6556c0-655c-47fd-87de-533f03da82cf_713.jpeg"},{"id":714,"name":"Biscotti Sani","image":"/media/recipes/38c7c6fc-45ef-43f8-bae5-02a4895b2239_714.jpeg"},{"id":715,"name":"Blanquette de veau à l'ancienne","image":"/media/recipes/fde3f9dc-1b22-4d1e-bb63-a976b565c2d2_715.jpeg"},{"id":716,"name":"Bocconi di rana pescatrice con verdurine","image":null},{"id":717,"name":"Borsh","image":"/media/recipes/89f3fe84-fc58-484d-9d50-07dfcbdb632c_717.jpeg"},{"id":718,"name":"BRACIOLE DI MAIALE AL CAFFÈ CON CREMOSA SALSA WHISKY","image":"/media/recipes/36fb19ce-1016-4b44-b7f1-c35f6cd676ac_718.jpeg"},{"id":719,"name":"Branzino al cartoccio","image":"/media/recipes/badc559b-251d-4b1c-a068-59d93987dc9f_719.jpeg"},{"id":720,"name":"Branzino al sale: la ricetta per fare la spigola in crosta di sale","image":"/media/recipes/dd0c0c59-6863-412e-961b-0ff6a063e61f_720.jpeg"},{"id":721,"name":"Brodetto di pesce","image":"/media/recipes/73a81f9f-9847-4095-99eb-48b2c29a1276_721.jpeg"},{"id":722,"name":"BRODO DI BUCCIA DI ZUCCA","image":null},{"id":723,"name":"BRODO DI CALDARROSTE","image":null},{"id":724,"name":"Brodo di carne","image":"/media/recipes/3619edc1-cdb6-4606-b21e-b9ad1fc98bcc_724.jpeg"},{"id":725,"name":"Brodo di gallina (o pollo)","image":"/media/recipes/cdf58c22-0609-499d-b05d-b24b233af8fa_725.jpeg"},{"id":726,"name":"BRODO DI GAMBERI ROSSI DI MAZARA","image":null},{"id":727,"name":"BRODO DI MINESTRONE","image":null},{"id":728,"name":"Brodo di pesce","image":null},{"id":729,"name":"Brownies al cacao","image":"/media/recipes/a17cff8c-14ef-4e08-8cd9-39ce58668834_729.jpeg"},{"id":730,"name":"Burger di fagioli rucola e feta","image":"/media/recipes/ae17c961-1465-4f66-99c6-96a7e59094f2_730.jpeg"},{"id":731,"name":"burrata e pomodori","image":null},{"id":732,"name":"Caesar salad","image":"/media/recipes/c9e6a8c0-89a0-43c6-8724-abfa4084122a_732.jpeg"},{"id":733,"name":"Calamari ripieni di ricotta e catalogna","image":"/media/recipes/fe2899c5-c328-4fd5-99cb-f75c3fb36933_733.jpeg"},{"id":734,"name":"Calamari su vellutata di zucchine e patate","image":null},{"id":735,"name":"Calamaro ripieno, ricetta classica","image":"/media/recipes/6d119095-47bd-4f65-951b-902d9fa95c50_735.jpeg"},{"id":736,"name":"Canederli knödel","image":null},{"id":737,"name":"CANNOLI DI PANDORO TIRAMISU","image":"/media/recipes/c2c6adbf-705e-44df-a09c-0298cd9ad86e_737.jpeg"},{"id":738,"name":"Capesante con arancia e salsa di avocado","image":"/media/recipes/b9b4be96-7833-44b6-8ab3-fedce28ca54e_738.jpeg"},{"id":739,"name":"CAPESANTE CON PURÈ DI ZUCCA ALL’ARANCIA","image":"/media/recipes/a45279ff-15dd-4966-b431-a7d5d3a246b2_739.jpeg"},{"id":740,"name":"Caponata di melanzane, delizia agrodolce","image":"/media/recipes/b45e5ea3-38f4-4d3a-9781-8c98ef084d5f_740.jpeg"},{"id":741,"name":"Caponata senza glutine","image":"/media/recipes/a4f104fb-6a98-4d40-a603-ca68bb542036_741.jpeg"},{"id":742,"name":"Cappelli delle streghe","image":"/media/recipes/9c6c2c9d-a9c4-43c4-8e14-6be8d5bbd3aa_742.jpeg"},{"id":743,"name":"CARAMELLO SALATO","image":"/media/recipes/5eb2e5b4-764f-459d-a8e6-ddd816476ded_743.jpeg"},{"id":744,"name":"Carbonara di seppie","image":"/media/recipes/6cb0b40d-ecec-4a79-916f-d079ea6ed8a3_744.jpeg"},{"id":745,"name":"Carpaccio di manzo","image":"/media/recipes/ecd93c0e-4e4f-4ea0-a1c9-99dbe34499bd_745.jpeg"},{"id":746,"name":"Carpaccio di tonno","image":"/media/recipes/2f662b1f-bdd4-44b5-8446-ee60a305b854_746.jpeg"},{"id":747,"name":"Caviale di melanzane - Babaganoush","image":"/media/recipes/e8f2130e-6804-4e44-9add-7be5e6ad9da8_747.jpeg"},{"id":748,"name":"Cavolfiore fritto","image":"/media/recipes/a226ca44-bd1d-4bc9-a888-71e76a0f2e9f_748.jpeg"},{"id":749,"name":"Cavolo rosso in padella - Ricetta con foto il Cuore in Pentola","image":"/media/recipes/2cf160f5-0765-412a-a852-00781b55ba4c_749.jpeg"},{"id":750,"name":"Cernia in crosta di pane","image":"/media/recipes/11fbc1a8-9e1c-4cf6-9a9f-c33ccfebf19c_750.jpeg"},{"id":751,"name":"Ceviche peruviano","image":"/media/recipes/792ddb97-5722-47ce-9719-2c76221083fd_751.jpeg"},{"id":752,"name":"Cheesecake ai mirtilli","image":"/media/recipes/7999bab8-8354-4770-b799-5a2e1fe38cc1_752.jpeg"},{"id":753,"name":"Cheesecake al limone","image":"/media/recipes/56bd4bfb-aea9-44b0-ac5c-cea96f1302de_753.jpeg"},{"id":754,"name":"Chicken Caesar salad","image":"/media/recipes/274baa02-d43b-4110-b551-1fdc427f91a6_754.jpeg"},{"id":755,"name":"Chicken Rub","image":"/media/recipes/29d88539-e829-4741-93de-5a3887507894_755.jpeg"},{"id":756,"name":"Chimichurri","image":"/media/recipes/b8739ed4-45d6-4c5e-97e2-2aff41fa21ca_756.jpeg"},{"id":757,"name":"Chiokapic","image":null},{"id":758,"name":"Chips di pecorino","image":"/media/recipes/bc554049-0829-47f4-945d-140819330b7c_758.jpeg"},{"id":759,"name":"Chocolate Mousse and Cherry Gelee Spheres","image":"/media/recipes/967b125b-e684-41a4-9c87-9178b478c8a1_759.jpeg"},{"id":760,"name":"Cialde corallo","image":"/media/recipes/445a37f0-30c1-4be6-b33e-04eb015613d2_760.jpeg"},{"id":761,"name":"Cialdine di Parmigiano Reggiano Dop","image":"/media/recipes/0ed29884-9442-4f65-8f12-ed4290af84da_761.jpeg"},{"id":762,"name":"Cipolla In Agrodolce","image":"/media/recipes/91945c9f-38ab-4c62-86d8-fd163acd2205_762.jpeg"},{"id":763,"name":"cipolla scura al forno","image":"/media/recipes/6ed4beeb-e7a0-4b2e-bb1b-9cbf9b22797e_763.jpeg"},{"id":764,"name":"Cipolle pickle","image":"/media/recipes/afe45843-19a4-46c7-bfa3-39465a2d05f7_764.jpeg"},{"id":765,"name":"Cipolle ripiene al forno","image":"/media/recipes/8971989c-cb48-45f4-8548-87dc15c88dfa_765.jpeg"},{"id":766,"name":"Clam Chowder","image":"/media/recipes/64184aaa-3e54-4775-8275-e8061057491c_766.jpeg"},{"id":767,"name":"COME FARE LA RICOTTA","image":"/media/recipes/7056d293-ef25-4b34-accf-760b0721acf1_767.jpeg"},{"id":768,"name":"Come fare lo zabaione all’arancia","image":"/media/recipes/ab310566-3313-4793-bc10-b4742bf61f23_768.jpeg"},{"id":769,"name":"Come fare una crema al limone favolosa: solo se hai il Bimby ti viene così! - RicettaSprint.it","image":"/media/recipes/fba51b0f-baba-48ff-a9c3-1a49aed453ac_769.jpeg"},{"id":770,"name":"Composta Di Mele","image":"/media/recipes/907ac797-acc3-4c5a-92fd-fcd5fc5e59f0_770.jpeg"},{"id":771,"name":"Condimento per pesce crudo","image":null},{"id":772,"name":"Confettura di cipolle di Tropea","image":"/media/recipes/4b761bb0-e0fd-48c2-81ee-1395f9cf0050_772.jpeg"},{"id":773,"name":"CONSOMMÉ","image":"/media/recipes/73f030a7-c7fa-45e2-aa21-b581be1aeccd_773.jpeg"},{"id":774,"name":"COPPA DI CHEESECAKE AL CAFFE'","image":"/media/recipes/fdc4c993-24d1-4dd9-aef7-d2c99b8fd3b2_774.jpeg"},{"id":775,"name":"Costolette Di Maiale","image":"/media/recipes/1d1f6ea0-9a1d-40f4-93d6-5040e2d28612_775.jpeg"},{"id":776,"name":"Cotolette alla Kiev","image":null},{"id":777,"name":"Cous cous","image":"/media/recipes/3683b6c7-9425-405a-a6fc-d27b77249ae0_777.jpeg"},{"id":778,"name":"Cozze alla marinara","image":"/media/recipes/1c8c19c1-f676-4416-9b41-ae6ca08d4335_778.jpeg"},{"id":779,"name":"Cozze in salsa di vino bianco e panna","image":"/media/recipes/8785e650-5bb3-4484-a331-39b43ecc12dc_779.jpeg"},{"id":780,"name":"Crema Al Limone","image":"/media/recipes/e64cfb70-b872-41f8-ba41-03a6e6ec02b5_780.jpeg"},{"id":781,"name":"Crema al mascarpone","image":"/media/recipes/d846bee4-9a39-4862-8ca9-671654a67359_781.jpeg"},{"id":782,"name":"CREMA ALL’ARANCIA CON LATTE DI MANDORLA","image":"/media/recipes/5cc47568-6757-4458-8e20-22c70bc05219_782.jpeg"},{"id":783,"name":"Crema di avocado","image":"/media/recipes/23d9e92b-3dd7-469e-bc80-afe9ecc63778_783.jpeg"},{"id":784,"name":"Crema di Parmigiano","image":"/media/recipes/40959769-6d34-41a3-b24e-3668ed5983a9_784.jpeg"},{"id":785,"name":"Crema di pesche con amaretti e gelatina di mango e Amaretto: ricetta gourmet","image":"/media/recipes/a74ccf6c-d093-453d-b806-714843a6c7bd_785.jpeg"},{"id":786,"name":"Crema di zucca (Vellutata di zucca): la Ricetta perfetta, veloce e squisita!","image":"/media/recipes/c7169739-e302-4852-8cce-d9f5cfa5a888_786.jpeg"},{"id":787,"name":"Crema pasticcera","image":null},{"id":788,"name":"Crema pasticcera smart","image":"/media/recipes/87a2692f-fc16-48b3-aca7-4cfef47e1153_788.jpeg"},{"id":789,"name":"Crema pasticciera","image":"/media/recipes/7b588438-a55c-4aa0-af91-d2144fa6fb0f_789.jpeg"},{"id":790,"name":"Crema ricotta e cannella","image":"/media/recipes/4d16c137-4cb2-4adf-a5a5-41ffda0d57ae_790.jpeg"},{"id":791,"name":"Creme brulèe","image":"/media/recipes/b93d1836-6858-4932-8b4a-101cbcb0edad_791.jpeg"},{"id":792,"name":"Creme Caramel","image":"/media/recipes/5101d036-ff70-415e-a342-a3c0e6205360_792.jpeg"},{"id":793,"name":"Crepe con farina di ceci","image":"/media/recipes/db534250-60b2-49cd-b9a1-68d56b25336a_793.jpeg"},{"id":794,"name":"Crepes","image":"/media/recipes/fcae3996-523b-4451-b746-dad5103e2950_794.jpeg"},{"id":795,"name":"Crepes funghi e besciamella","image":"/media/recipes/006e11c6-18fc-4f3c-a128-c25cd120bba4_795.jpeg"},{"id":796,"name":"Crescenza di anacardi","image":"/media/recipes/5d001ed7-011d-4de1-9819-2a795ddc07c9_796.jpeg"},{"id":797,"name":"Crespelle di ceci con zucca, spinaci e funghi","image":"/media/recipes/8a4a5e57-5a31-4f25-8312-867680779d67_797.jpeg"},{"id":798,"name":"Crocche Di Gamberi","image":"/media/recipes/93fdbd4e-443c-4d88-8f23-d7f91a0ef4b7_798.jpeg"},{"id":799,"name":"Croissant","image":"/media/recipes/f9baacf0-5741-4d07-965d-cb0d70a73d1b_799.jpeg"},{"id":800,"name":"Crostata al limone","image":"/media/recipes/0370f191-8acd-415a-8a2c-435112be3475_800.jpeg"},{"id":801,"name":"CROSTATA CREMA LATTE ALL'ARANCIA dolce ripieno cremoso","image":"/media/recipes/779cd11c-04b4-4143-8e5d-3fd01bda0456_801.jpeg"},{"id":802,"name":"Cruditè al curry","image":"/media/recipes/944e4891-3cb5-4519-a0ed-e752f7fe3f02_802.jpeg"},{"id":803,"name":"Crumble","image":"/media/recipes/4c3b9406-c96d-4f98-8c9f-6b1cd0d89c5a_803.jpeg"},{"id":804,"name":"crumble salato","image":"/media/recipes/1f1eb6dc-6e2d-44f8-990b-1cbfa61cb016_804.jpeg"},{"id":805,"name":"Crystal bread","image":"/media/recipes/a35eb442-de29-4765-9ca5-ec20a7a77561_805.jpeg"},{"id":806,"name":"Curry di ceci la ricetta indiana da preparare in meno di mezz'ora - RicettaSprint.it","image":"/media/recipes/3344395c-57ef-4f07-9a65-b4092d3cc647_806.jpeg"},{"id":807,"name":"Dado Vegetale","image":"/media/recipes/1808c9fa-7217-4125-8135-3042e9feee09_807.jpeg"},{"id":808,"name":"Dahl di lenticchie in vasocottura","image":"/media/recipes/8a397e3a-ab6f-4f52-91ef-483b123e7a43_808.jpeg"},{"id":809,"name":"daurade mariné à la bière de monaco et zeste d'orange","image":"/media/recipes/65d6c891-7ef5-4378-af85-698b77bc62a0_809.jpeg"},{"id":810,"name":"DESSERT CON SFOGLIATINE E CREMA AL MASCARPONE","image":"/media/recipes/3bd4a094-ad17-4882-8857-dad322d9a411_810.jpeg"},{"id":811,"name":"Dolce all'arancia","image":"/media/recipes/35d02eab-3c40-48dd-9b6e-2a5d5ac4c2aa_811.jpeg"},{"id":812,"name":"dolce di fichi","image":"/media/recipes/707a5f3d-2c64-4bfc-b74a-1999021af845_812.jpeg"},{"id":813,"name":"Dolcetti all'arancia","image":"/media/recipes/d0213969-e984-4122-b3f9-73e68696a068_813.jpeg"},{"id":814,"name":"epaule d'agneau confite aux épices","image":null},{"id":815,"name":"Banana Shape Chia-Joghurt","image":"/media/recipes/d837cfad-c00a-425b-bfc7-259ab9a62213_815.jpeg"},{"id":816,"name":"Kakao-Bananen-Muffins","image":"/media/recipes/5ea7b754-9e97-4643-9aa9-c9dfbf672718_816.jpeg"},{"id":817,"name":"Pfannkuchen mit Erdbeer-Rhabarber-Marmelade","image":null},{"id":818,"name":"Hähnchenstreifen mit Salat","image":"/media/recipes/47ab7cf7-869f-4fcb-8b7a-045b1652fcd8_818.jpeg"},{"id":819,"name":"Buntes Pfannen Gemüse mit Hähnchenbrust im Arizona-Pfeffer","image":"/media/recipes/a87918f2-e1f1-4ad1-8eab-63910607d3d2_819.jpeg"},{"id":820,"name":"Curryhähnchen","image":"/media/recipes/8969d24d-2cba-4eb6-b52c-28171898fc9b_820.jpeg"},{"id":823,"name":"Pfannkuchen mit Erdbeer-Rhabarber-Marmelade","image":null},{"id":827,"name":"Banana Shape Chia-Joghurt","image":"/media/recipes/44770e04-f612-4815-a9fc-34ed34f74f90_827.jpeg"},{"id":828,"name":"Kakao-Bananen-Muffins","image":"/media/recipes/1fb40962-a4be-4340-aed5-46a8b8f9759a_828.jpeg"},{"id":829,"name":"Pfannkuchen mit Erdbeer-Rhabarber-Marmelade","image":"/media/recipes/5be1ac0a-ec27-491d-8036-a587baa0af9e_829.jpeg"},{"id":830,"name":"Hähnchenstreifen mit Salat","image":"/media/recipes/a5154f95-e8fc-4d0a-9aeb-eeea2f11d467_830.jpeg"},{"id":831,"name":"Buntes Pfannen Gemüse mit Hähnchenbrust im Arizona-Pfeffer","image":"/media/recipes/a353361c-5f6d-436a-9c58-13c8a693648b_831.jpeg"},{"id":832,"name":"Curryhähnchen","image":"/media/recipes/64c71c90-763a-4e21-8ce7-ff7fe68c838a_832.jpeg"},{"id":833,"name":"Roggenbrot","image":null},{"id":834,"name":"Gemüselasagne","image":"/media/recipes/d71f2d09-0cdc-4dd1-af29-deb775aa2c1c_834.png"},{"id":835,"name":"Gebackene Auberginen","image":"/media/recipes/dc1923c6-4460-466b-ad6f-01f4aedafed0_835.jpeg"},{"id":836,"name":"Zucchini-Möhren-Puffer","image":"/media/recipes/21317e29-c001-4dcb-a35b-cf6d9b695228_836.png"},{"id":837,"name":"Mini-Apfelstrudel mit Filoteig","image":"/media/recipes/b37edfc3-38f1-4898-9ef0-c82568d9313e_837.jpeg"},{"id":838,"name":"Frischer Mangosalat","image":"/media/recipes/5d2e42cb-36e1-4bc5-bd0b-f2f025308e6d_838.png"},{"id":839,"name":"Zucchini-Paprika-Möhren-Frittata mit Hüttenkäse und Tomaten","image":"/media/recipes/426ce931-a3c2-4960-964d-3dded90fabde_839.png"},{"id":840,"name":"Hasselback-Kartoffeln","image":"/media/recipes/f0aaff88-ff33-4eae-b061-35088c43b000_840.png"},{"id":841,"name":"Pizzateig (Flammkuchenteig)","image":null},{"id":842,"name":"Chicorée Rollladen Auflauf","image":null},{"id":843,"name":"Gemüsepfanne","image":"/media/recipes/756bf85c-6779-4f35-86ce-46c21fd33515_843.jpeg"},{"id":844,"name":"Ohne Mehl: Rezept für leckere Zucchini-Muffins mit Chili und Feta","image":"/media/recipes/de7a7ab4-9290-4663-b273-e46eb29a9d2b_844.jpeg"},{"id":845,"name":"Cremige Maissuppe","image":"/media/recipes/7c7cf8de-e267-41b7-b4f5-24311a8a9f81_845.jpeg"},{"id":846,"name":"Kathis Dunkle Cookies","image":null},{"id":847,"name":"Grillpizza","image":null},{"id":848,"name":"Italienischer Nudelsalat","image":null},{"id":849,"name":"Kathis Apfelkuchen","image":"/media/recipes/6af46aab-3b1d-4248-85f1-c23a90535ae7_849.png"},{"id":850,"name":"Nussecken","image":null},{"id":851,"name":"Stollen","image":"/media/recipes/baf56916-0c4c-43d4-a1df-35ccbed4b968_851.jpeg"},{"id":852,"name":"Wok","image":"/media/recipes/993a134c-3169-4167-9869-d394deff820e_852.png"},{"id":853,"name":"Pancake (Mini-Spieße)","image":"/media/recipes/30dc3b68-02a9-45c0-810e-6131c4c73390_853.png"},{"id":854,"name":"Kassler in Blätterteig","image":null},{"id":855,"name":"Baklava","image":"/media/recipes/a1676f57-1f6b-4f51-97e0-0636f1d02846_855.png"},{"id":856,"name":"Bohneneintopf","image":"/media/recipes/5332b2d7-c0f2-4668-a3a8-1580ab11a9b1_856.png"},{"id":857,"name":"Galette Frangipane (Französischer Blätterteig Kuchen)","image":"/media/recipes/a6ee2ea4-be46-4aee-a991-0c331df8f04f_857.png"},{"id":858,"name":"Giotto-Torte","image":"/media/recipes/685308bf-bdb8-4ab5-8d09-3c1e7a838332_858.png"},{"id":859,"name":"Spaghetti mit Feigen und Ziegenkäse","image":"/media/recipes/a7d5c79f-1f69-41ad-ab2e-458ed2004f7b_859.png"},{"id":860,"name":"Ipanema","image":"/media/recipes/40d16559-2e9d-4194-b67d-22283bf9dd2a_860.png"},{"id":861,"name":"Mai Tai","image":"/media/recipes/5451bfbe-85e3-4d03-ae30-956700584ca7_861.png"},{"id":862,"name":"Wikingertopf","image":"/media/recipes/dca630a5-afb7-4fa8-81b5-77f86fc2428b_862.png"},{"id":863,"name":"Tequila Sunrise","image":"/media/recipes/21f2af27-26ea-4788-b68f-cf4ef3203851_863.png"},{"id":864,"name":"Hurricane","image":"/media/recipes/00b8d5a1-bae3-432b-a06d-0aa8e45bdc67_864.png"},{"id":865,"name":"Sauerkraut-Kasseler-Pfanne mit Schupfnudeln","image":"/media/recipes/864ea5ce-41c8-418b-b8c8-c49a9b6c5ac5_865.png"},{"id":866,"name":"Putenkeulen","image":null},{"id":867,"name":"Mojito","image":"/media/recipes/22f7eeba-b703-4ffc-ae01-c9d0972407bd_867.png"},{"id":868,"name":"Apfelschichtkuchen","image":null},{"id":869,"name":"Lachs in Honigglasur mit Mango-Avocado-Salsa","image":"/media/recipes/4fc03c1c-4e28-4af6-bc4e-49a6a737f262_869.png"},{"id":870,"name":"Spinat-Curry mit Erdnüssen","image":"/media/recipes/46cfa7d6-fdba-433c-af58-f729664ab695_870.png"},{"id":871,"name":"Hüttenkäsetaler","image":"/media/recipes/5b9705c6-b6ce-4be4-a410-20dcea6e6df4_871.png"},{"id":872,"name":"White Russian","image":"/media/recipes/edbdb8e5-89e2-447a-8d74-5738192a1554_872.png"},{"id":873,"name":"Risotto mit Pfifferlingen, Zucchini, Serranoschinken und Pecorino","image":"/media/recipes/3da66d20-2e8e-485f-8e96-90d0288f56e7_873.png"},{"id":874,"name":"Gelbe Sauce","image":null},{"id":875,"name":"Tortellini-Spinat-Auflauf","image":"/media/recipes/c2b19498-6184-4a5c-808f-8a4a2c95bbe5_875.png"},{"id":876,"name":"Hähnchen-Gnocchi-Pfanne mit Möhren","image":"/media/recipes/048ef8c5-79cd-4fb2-8f1d-aa88e3673ccf_876.png"},{"id":877,"name":"Jans Linsen Curry","image":"/media/recipes/3024760b-b4c7-43ed-883d-703ebe5b0c85_877.png"},{"id":878,"name":"Schweinefilet in Curry-Sahne","image":"/media/recipes/b5931db8-83bc-4251-8e19-8049d0894852_878.png"},{"id":879,"name":"Griechischer Salat","image":null},{"id":880,"name":"Vegetarische Frikadellen","image":"/media/recipes/96c0e256-f1f5-4ff8-818d-d3e5172f4d3c_880.png"},{"id":881,"name":"Caipirinha","image":"/media/recipes/1a687b10-ce9f-4e72-ad52-43887958f7ed_881.png"},{"id":882,"name":"Cannelloni mit Spinat-Ricotta","image":"/media/recipes/78a460f5-9b7f-46ef-ae10-055303fac321_882.png"},{"id":883,"name":"Gnocchi-Gemüseauflauf mit Hackfleischsoße","image":"/media/recipes/36f70dbd-8842-4a71-9f52-eba3ab191372_883.png"},{"id":884,"name":"Rotkäppchenkuchen","image":"/media/recipes/3d00d269-7fa6-4c0e-973f-8d9bd923d736_884.png"},{"id":885,"name":"Lachs-Spinat-Lasagne Rezept","image":"/media/recipes/2015705d-7e2d-4479-a3b3-07c86046865a_885.png"},{"id":886,"name":"Lasagne mit Mozzarella und Parmaschinken","image":null},{"id":887,"name":"Rote Bete Carpaccio mit Rucola und Ziegenkäse","image":"/media/recipes/ba34d5b9-8318-400a-938c-4f15973e8691_887.png"},{"id":888,"name":"Ofenpfannkuchen mit Gemüse & Feta","image":"/media/recipes/a565f6b7-ed67-4e67-a1fe-0124b3472cb4_888.png"},{"id":889,"name":"Vegetarische Linsen-Lasagne","image":"/media/recipes/04442d72-bc16-4d97-a7eb-f15c107e884a_889.png"},{"id":890,"name":"Saure Bohnen Eintopf","image":"/media/recipes/5d97dc85-634b-4d2c-b377-2d3912a0f1a1_890.png"},{"id":891,"name":"Crepesteig","image":"/media/recipes/a6f8b5f0-59d3-4f91-98c9-ef51acfeacc5_891.png"},{"id":892,"name":"Gefüllte Auberginen","image":"/media/recipes/0a6c9751-f84c-444f-963f-d56475b036b4_892.png"},{"id":893,"name":"Moscow Mule","image":"/media/recipes/c128a6eb-1199-4713-9761-8592af87e904_893.png"},{"id":894,"name":"Bunte Kichererbsenpfanne","image":"/media/recipes/397c566c-e111-4b4e-9333-c40b5250a871_894.png"},{"id":895,"name":"Vegetarischer Nudel-Spinat-Auflauf mit Rote Beten","image":"/media/recipes/b173738f-9d1f-447a-885c-d147fae5ecc6_895.png"},{"id":896,"name":"Raclette","image":"/media/recipes/faf7c6e4-4417-407e-a0d2-af3a81cfea22_896.png"},{"id":897,"name":"Vegetarische Spinat-Lasagne al forno","image":"/media/recipes/80c163de-cd85-4a2a-80b5-0155ee27b514_897.png"},{"id":898,"name":"Pina Colada","image":"/media/recipes/c4294b1d-537b-4523-b888-120fd049e57c_898.png"},{"id":899,"name":"Obazda","image":"/media/recipes/712c3f5b-7f18-47c1-b1e0-e920522bbec9_899.png"},{"id":900,"name":"Kleine Röllchen ganz groß: Zucchini-Rollen mit Ricotta-Basilikum-Creme","image":"/media/recipes/81d58226-ee86-4f8f-b05b-c09f4f9e1b0c_900.png"},{"id":901,"name":"Samasa Blätterteig Taschen","image":null},{"id":902,"name":"Kürbissuppe","image":"/media/recipes/3cb77b90-58d8-48c7-acd3-5cdd95a51b9d_902.png"},{"id":903,"name":"Asia-Gemüse mit geröstetem Sesam","image":"/media/recipes/6675feec-93bc-4fe4-9ca9-6879f7292926_903.png"},{"id":904,"name":"KERNIGER ROTE-BETE-SALAT AUS DEM THERMOMIX®","image":"/media/recipes/8889597e-1287-461e-8c71-d87e99cdeb5b_904.png"},{"id":905,"name":"Teigtaschen mit Spinat-Feta-Füllung","image":null},{"id":906,"name":"Marzipan-Torte","image":"/media/recipes/4e9708b6-68ea-471d-b564-4bb47ba590ef_906.png"},{"id":907,"name":"Kohlrabi in Parmesan-Kräuter-Panade","image":"/media/recipes/e41cb627-4b1d-4dd7-9cd2-42b37ecbd847_907.png"},{"id":908,"name":"Avocado-Tomaten Salsa zu Red Snapper","image":"/media/recipes/fbd199a0-b7dd-4bcc-b85d-e6dcfc897684_908.png"},{"id":909,"name":"Spießbraten","image":"/media/recipes/f21927be-28e9-4202-bbcd-0ae231d171de_909.png"},{"id":910,"name":"Knusprige Putenröllchen","image":"/media/recipes/8e549715-8d33-4e08-977f-4967d5429d6c_910.png"},{"id":911,"name":"Geröstete Kürbiskerne","image":"/media/recipes/301ac254-0285-44d1-a644-5bbd540c6dce_911.png"},{"id":912,"name":"Magaretenplätzchen","image":null},{"id":913,"name":"Bayerische Semmelknödel","image":null},{"id":914,"name":"Gebratene Nudeln mit Gemüse, asiatisch","image":"/media/recipes/bd2fb72f-6c90-4e25-a5fa-4f634e005bf7_914.png"},{"id":915,"name":"Schnelle Asia-Gemüsepfanne","image":"/media/recipes/921d8abf-ced5-4f74-9675-4ed7d77fa36e_915.png"},{"id":916,"name":"Westfälische Quarkspeise","image":"/media/recipes/330b1965-b485-4793-945b-f5b5df75da03_916.jpeg"},{"id":917,"name":"Weckmann (Hefeteig)","image":"/media/recipes/8bcfdf78-7537-48fb-8342-e5e7db97a65c_917.png"},{"id":918,"name":"Helgas Wirsingeintopf","image":null},{"id":919,"name":"Linsen-Mangold-Curry","image":"/media/recipes/42f25786-d04e-4c26-a5b0-94e86b6c0443_919.png"},{"id":920,"name":"Vegane Brokkoli-Käse-Suppe mit Möhren","image":"/media/recipes/3081f1b5-c760-42e0-a591-be3bcbd65f1e_920.png"},{"id":921,"name":"Vegetarisches Linsen-Chili mit Reis","image":"/media/recipes/113ea81c-4545-4bc2-b1e1-1f83c98af9d3_921.png"},{"id":922,"name":"Nudelauflauf mit Hähnchen und Spinat","image":"/media/recipes/cc8892ac-1d86-47e4-aa3f-09154fc6e3c2_922.jpeg"},{"id":923,"name":"Rote-Bete-Burger - vegan mit Guacamole und Röstzwiebeln","image":"/media/recipes/d2084a00-d5c4-496c-9a24-75abc10bd819_923.png"},{"id":924,"name":"Spaghetti mit Bacon, Frühlingszwiebeln, Tomaten Sahne-Sauce","image":"/media/recipes/ca0873c1-2471-4cc2-81a0-d8011d7502ab_924.png"},{"id":925,"name":"Obstboden","image":null},{"id":926,"name":"Chili con Carne","image":"/media/recipes/c7bfdb56-060e-42ec-aa28-ebf160be9207_926.png"},{"id":927,"name":"Toskanischer Filet-Topf","image":"/media/recipes/971f89d7-5e59-4e84-ba91-842e24505047_927.jpeg"},{"id":928,"name":"Rigatoni mit Tomaten-Sahne-Sauce","image":"/media/recipes/acfac122-a708-4a92-9703-6697693c7a61_928.png"},{"id":929,"name":"Kathis Lasagne","image":null},{"id":930,"name":"Pfirsichkuchen von Petra","image":"/media/recipes/e9deab2e-8d32-49b0-b694-25079eab8337_930.jpeg"},{"id":931,"name":"Brombeerkuchen","image":null},{"id":932,"name":"Lauchcremesuppe","image":null},{"id":933,"name":"Käse Lauch Suppe","image":"/media/recipes/4d820ccc-6448-4e7c-96a1-87650b1e024c_933.png"},{"id":934,"name":"Bergische Waffeln","image":"/media/recipes/61947425-6425-4017-94af-43e024c42a13_934.png"},{"id":935,"name":"Cannelloni della Nonna","image":"/media/recipes/f8e7a450-73ae-49f7-b739-f05e749d5b75_935.png"},{"id":936,"name":"Salatdressing a la Mama","image":null},{"id":937,"name":"Apfel-Zimt-Kuchen","image":"/media/recipes/c9c46e8a-16c8-498b-a5cf-10c57f61de5c_937.png"},{"id":938,"name":"Zucchini Hackfleischauflauf","image":"/media/recipes/876f9332-987d-4b6b-957b-d7e008ed9d8e_938.png"},{"id":939,"name":"Helga's Kartoffelsalat","image":"/media/recipes/57fd53e0-2929-46ef-8c0d-c3e7f48f8cfa_939.png"},{"id":940,"name":"Kalbsschnitzel gratiniert","image":null},{"id":941,"name":"Sauerteig Anstellgut","image":null},{"id":942,"name":"Nuss Marzipan Kranz Striezel","image":"/media/recipes/cde8edb0-42f1-4b77-ac11-b54b333ddc28_942.png"},{"id":943,"name":"Erdbeer Tiramisu","image":"/media/recipes/ee305c0d-b26d-4533-9534-1254980eb9a4_943.png"},{"id":944,"name":"Burger","image":"/media/recipes/92c4cd5a-6338-4ad9-86e4-4e9301431a4b_944.png"},{"id":945,"name":"Roggenbrot","image":"/media/recipes/9256a1e1-c5a9-4ca7-abcb-348b1065a0fa_945.png"},{"id":946,"name":"Baguette","image":"/media/recipes/7131d1d7-bc91-48e6-9751-5a0dbfa9bf78_946.png"},{"id":947,"name":"Risotto mit grünem Spargel","image":null},{"id":948,"name":"Zwiebelkuchen","image":"/media/recipes/05e8647e-7f72-43b8-91ae-14a3997d69bd_948.png"},{"id":949,"name":"Pita Brot","image":"/media/recipes/139e0e7f-6bcf-4dfb-85f1-0ca9f241bd3c_949.png"},{"id":950,"name":"Goldstulle süßes Brot","image":"/media/recipes/09db927d-404e-4745-9d96-ddaa0a5d166c_950.png"},{"id":951,"name":"Gyros Spieß","image":"/media/recipes/cc007e6e-8af9-4d0f-af7e-653b918ec469_951.png"},{"id":952,"name":"Rote-Linsen-Salat mit Ziegenkäse im Speckmantel","image":"/media/recipes/eeee7734-1816-4537-bd0c-415b7c30d7c5_952.png"},{"id":953,"name":"Parmigiana di Melanzane","image":"/media/recipes/0e65921a-b1cb-4079-b8eb-47cfa8c799a3_953.png"},{"id":954,"name":"Zucchini-Ricotta-Puffer mit buntem Tomatensalat","image":"/media/recipes/7ed7d8a8-9c72-4317-aee2-1ca25963a82f_954.jpeg"},{"id":955,"name":"Vegetarische Zucchini-Karotten-Puffer","image":"/media/recipes/6ff8491b-339a-4061-b41f-3dee6b4fa050_955.jpeg"},{"id":956,"name":"Naan Brot","image":"/media/recipes/5f3a3be0-eeb8-4e27-b4b4-3af53df3961b_956.jpeg"},{"id":957,"name":"Mit Quinoa gefüllte Zucchini mit einem Walnuss-Ziegenkäse-Topping","image":"/media/recipes/f3caf38c-71e8-4ee4-8fa3-a612185d8556_957.png"},{"id":958,"name":"Indisches Rotes Linsen Dal","image":"/media/recipes/8c7219b6-c502-416c-a06c-ae871791742a_958.jpeg"},{"id":959,"name":"Tomatenreis mit mediterranem Gemüse","image":"/media/recipes/d0148376-8149-4f2a-990b-decf8a1b5d08_959.jpeg"},{"id":960,"name":"Schoko - Souffle","image":null},{"id":961,"name":"Veganer Bohnenburger","image":"/media/recipes/d2e85ce2-0bc2-4b2f-b903-b05f82833f38_961.jpeg"},{"id":962,"name":"Quiche","image":null},{"id":963,"name":"Süßkartoffel Taler vom Grill","image":"/media/recipes/4e350b18-48f3-4fc9-baae-b1abc44dd843_963.png"},{"id":964,"name":"Risotto mit getrockneten Tomaten und Rucola dazu Ziegenkäse","image":"/media/recipes/4be37e30-1d00-43ca-80dd-f2f3567f78c7_964.jpeg"},{"id":965,"name":"Maiseintopf","image":null},{"id":966,"name":"Eintopf mit Lamm und Auberginen","image":"/media/recipes/116b4329-7220-4e25-93bd-a7d4967ca6bf_966.jpeg"},{"id":967,"name":"Schoko-Soufflé","image":"/media/recipes/56076670-e2bc-4106-94fd-d19910032417_967.jpeg"},{"id":968,"name":"Nudelauflauf mit Parmesanstreuseln","image":"/media/recipes/264105ac-1ad1-4aac-8fa7-7f1ce153a0ba_968.jpeg"},{"id":969,"name":"Quinoa Powersalat mit Tomaten und Avocado","image":"/media/recipes/6de99697-9c82-44d3-8b8a-c96b7188aa19_969.jpeg"},{"id":970,"name":"Gemüsepfanne","image":"/media/recipes/10e0baf3-2956-4b08-81af-a51ffe3ae08b_970.jpeg"}]
    },
    methods: {
        cardVariant(index: number) {
            if (this.selected_result == index) {
                return 'tonal'
            } else {
                return 'elevated'
            }
        },
        goToSelectedRecipe() {
            let test = this.search_results[this.selected_result]
            if (test.recipe_id != null) {
                this.$router.push({name: 'view_recipe', params: {'id': test.recipe_id}})
            }
        }
    },
})
</script>


<style scoped>

</style>