How make different request in Vuetify Chip

I would like to make different API call for each chip. Let me explain I currently have 4 vuetify chips and I would like for example in the chip 'ideal', get the url of this axios request: '/lnk/plant/plants?plant_id='+this.plantActive.id+'&link=ideal' and for bad chip replace ideal with bad and so on. In fact, to make things clearer, I would like the correct request to appear in the current chip.

Here is my code currently:

<template>
    <v-row>
        <v-col cols="5" lg="8" md="6" sm="5">
                <v-chip-group v-model="selectedChip" mandatory active-class="white--text">
                    <v-chip v-for="(chip, i) in chips" :key="i" :value="chip" :class="`${colorChip(chip)} ${colorTextChip(chip)}`" :disabled="chip == 'empty'" large style="height: 46px;font-size: 28px;">
                        {{ $t(`permatheque.plantAssociations.${chip}`) }}
                    </v-chip>
                </v-chip-group>
        </v-col>
        <v-container style="max-width: 100%; height: 420px;" class="overflow-y-auto scrollbar-hidden card-association">
        <v-col v-for="prop in Object.keys(plantAssociations)" :key="prop" cols="6" lg="2" md="4" sm="6" class="mb-6" @click="console.log(prop)">
            <v-card width="180" height="150">
                <v-card-text>
                    <p class="text-h6 text--primary">{{ prop }}</p>
                    <p>{{ plantAssociations[prop].plant_associated[0].name }}</p>
                </v-card-text>
            </v-card>
        </v-col>
        </v-container>
    </v-row>
</template>

<script>
    import { mapGetters } from "vuex";
    export default {
        props: {
        },
        data: () => ({
            selectedChip: 'ideal',
            chips: [
                'ideal',
                'good',
                'mediocre',
                'bad'
            ],
        }),
        computed: {
            console: () => console,
            ...mapGetters({
                plantAssociations: 'permatheque/getPlantAssociations',
                plantActive: 'permatheque/getPlant'
            }),
            
        },
        methods: {

            async getAssociatedPlant() {
                this.$axios.$get('/lnk/plant/plants?plant_id='+this.plantActive.id+'&link=good')
                .then(response => {
                    this.$store.commit('permatheque/setPlantAssociations', response)
                    console.log(this.plantAssociations)
                }).catch(error => {
                    console.log(error)
                });         
                
            },
            
            colorTextChip(chip) {
                if (chip == 'empty') return 'transparent--text';
                return 'white--text';
            },
            colorChip(chip) {
                if (chip == 'empty') return "emptyChip";
                else if (chip == this.selectedChip) return "selectedChip";
                return "defaultChip";
            },

        },
        mounted() {
            this.getAssociatedPlant()

        }
    }
</script>

Updated 2022-01-14 13:25:48Z by

Updated 2022-01-14 13:08:39Z by PierroTH