handle Onclick event from Vue to Vuex - html

Question

I'm switching from vue to vuex and I'm having trouble implementing an onclick event. I'm using bootstrap collapse to create 3 div. Each div has a button to show the collapsible elements inside. With vue I'm taking the data from an api request. I want every single button to open its parent div. Currently every button open all the three divs. When using vue I simply wrote this:
methods:{
//set expand to true foreach player card,
//set open to true foreach plus button
playerCardCollapse(index) {
this.teams = this.teams.map((item, i) => {
item.expanded = !item.expanded
item.open = !item.open
if (i !== index) {
item.expanded = false
item.open = false
}
return item
})
},
},
This is my template:
<!-- Container Card -->
<div v-for="(team, i) in teams" :key="i" class="col-6">
<div class="row mb-2 team-default align-items-center" style="height:106px;">
<div class="col-2 section">
<img class="rounded-circle" :src="team.team_img" style="border:2px solid #fff;box-shadow: 0 2px 31px 0 rgba(0, 0, 0, 0.23);">
</div>
<div class="col section team end">
<p class="intestazione">Team Name:</p>
<p class="result">{{team.team_name}}</p>
</div>
<div class="col-2 section end">
<button type="button" class="btnProfile" data-bs-toggle="collapse" data-bs-target="#profile-row" :aria-expanded="team.expanded" aria-controls="profile-row" #click.prevent="playerCardCollapse(i)">
<div class="plus-icon" :class="{open: team.open}"></div>
</button>
</div>
</div>
<!-- Collapsed -->
<div v-if="team.player.length>0">
<div class="collapse show" :class="{show: team.expanded}">
<div v-for="(p, j) in team.player" :key="j" class="row team-default mt-2 mb-3" id="profile-row">
<div class="col-2 section">
<div class="player-img-container">
<img class="rounded-circle player-img" :src="p.profilePic">
<img class="rounded-circle flag-img" src="https://picsum.photos/31/31">
</div>
</div>
<div class="col section team end">
<p class="intestazione">Team {{p.role}}</p>
<p class="result">{{p.name}}</p>
</div>
<div class="col-4 section end">
<button class="btnProfile-cta">Visualizza Profilo</button>
</div>
</div>
</div>
</div>
</div>
But with vuex I don't know how to implement this playerCardCollapse().
Hope someone could help (I don't know if you need more code snippets)