Как выбрать элементы на странице Vue js и сохранить их в store?

Суть задачи такова: "Пользователь должен выбрать 1 рейс туда и 1 обратно, которые ему подходят и нажать на кнопку 'Go to booking' для перехода на экран с оформлением бронирования". (Использую в проекте Vuex и router)

Рейсы на странице на данный момент отображаются следующим образом: (п.с. найденные рейсы приходят с fetch запроса от api, перебираются и выводятся на странице)

Код шаблона если нужно:

   <template>
       <div style="text-align: center">
          <div v-if="all.data">
             <h1>Найденные рейсы:</h1>
             <div v-for="da of all.data.flights_to" :key="da.id" class="flight" v-on:click="status = true" v-bind:class="{checked : status}">         
                <p>Номер рейса: {{da.flights_code}}</p>
                <p>Дата и время отправления: {{da.from.date + " " + da.from.time}}</p>
                <p>Время прибытия: {{da.to.time}}</p>
                <p>Общая стоимость: {{da.cost * psgrs}}</p>
    
             </div>
         <div v-if="all.data.flights_back[0]">
            <h2>Рейсы обратно:</h2>
            <div v-for="da of all.data.flights_back" :key="da.id" class="flight" v-on:click="status = true" v-bind:class="{checked : status}">
               <p>Номер рейса: {{da.flights_code}}</p>
               <p>Дата и время отправления: {{da.from.date + " " + da.from.time}}</p>
               <p>Время прибытия: {{da.to.time}}</p>
               <p>Общая стоимость: {{da.cost * psgrs}}</p>
            </div>
         </div>
         <router-link
            tag="button"
            class="btn btn-danger"
            to="#"
         >Go to booking</router-link>
      </div>
      <div v-else>No results</div>
   </div>
</template>

<script>
import {mapGetters} from "vuex";
export default {
   name: 'Flights',
   computed: mapGetters(['all', 'psgrs']),   
}
</script>

<style lang="scss">
   .flight{
      border: 3px solid #ccc;
      width: 400px;
      
      margin: 0 auto 20px auto;
   }
</style>

Вижу это примерно так: при нажатии на блок, добавляется класс изменяющий цвет рамки(например на красный) и вызывается метод, который отправляет данные с выбранного рейса в action во vuex, эти данные сохраняются в localStorage, записываются эти данные в state и на странице, на которую попадаем при нажатии на 'Go to booking', эти рейсы выводятся из state.

Вот только как нам добавлять класс именно к нужному рейсу после нажатия и как сохранить все эти данные, чтобы потом отправить в action и вывести на другой странице... Не понимаю.

Я тут новенький, извиняюсь если что-то некорректно написал, Vue только изучаю