Vue JS - обновление того же свойства в массиве объектов с помощью переключателей

Question

У меня есть такой сценарий

Группа участников сможет выбрать другое лечение, или руководитель группы сможет выбрать конкретное лечение для конкретного пользователя.Примерно так:

В этом случае, когда я выберу на экране радиокнопку ' Одинаково для всех", я получу только одну группу радиокнопок.Когда я, например, выбираю «Вариант один», я хотел бы обновить « selectedOption » для всех лиц со значением из этой опции.

В случае, если я выбрал « КаждыйУчастник другой 'будет отображать группы переключателей столько же, сколько пользователи, и в этом случае он работает.Для каждого человека я могу получить разные варианты.

Может ли кто-нибудь помочь мне в достижении сценария «Единый для всех»?Thx

Вот пример кода и коробки https://codesandbox.io/s/myl7j2jpp9?fontsize=14

---

<template>
      <div>
        <div v-if="persons.length > 1">
          <div class="custom-control custom-radio">
            <input
              type="radio"
              id="same"
              name="customRadio"
              class="custom-control-input"
              v-model="condition"
              value="same"
            >
            <label class="custom-control-label" for="same">Same for all</label>
          </div>
          <div class="custom-control custom-radio">
            <input
              type="radio"
              id="different"
              name="customRadio"
              class="custom-control-input"
              v-model="condition"
              value="different"
            >
            <label class="custom-control-label" for="different">Every participant different</label>
          </div>
        </div>

        <div v-for="(person, index) in filteredPersons" :key="index" class="container">
          <div class="row">
            <div class="col-sm-8">
              <div class="card options">
                <div class="card-body">
                  <div class="custom-control custom-radio">
                    <input
                      type="radio"
                      :id="'customRadio0' + index"
                      :name="'customRadio2' + index"
                      class="custom-control-input"
                      v-model="person.selectedOption"
                      :value="'Option 1'"
                    >
                    <label class="custom-control-label" :for="'customRadio0' + index">Option one</label>
                  </div>
                  <div class="custom-control custom-radio">
                    <input
                      type="radio"
                      :id="'customRadio1' + index"
                      :name="'customRadio2' + index"
                      class="custom-control-input"
                      v-model="person.selectedOption"
                      :value="'Option 2'"
                    >
                    <label class="custom-control-label" :for="'customRadio1' + index">Option 2</label>
                  </div>
                  <div class="custom-control custom-radio">
                    <input
                      type="radio"
                      :id="'customRadio2' + index"
                      :name="'customRadio2' + index"
                      class="custom-control-input"
                      v-model="person.selectedOption"
                      :value="'Option 3'"
                    >
                    <label class="custom-control-label" :for="'customRadio2' + index">Option 3</label>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </template>


    <script>
        export default {
          data: function() {
            return {
              condition: "same",
              persons: [
                { name: "Denver", surname: "Lawson", selectedOption: "" },
                { name: "Kenneth", surname: "Ivie", selectedOption: "" }
              ]
            };
          },
          computed: {
            filteredPersons: function() {
              if (this.condition === "same") {
                return this.persons.slice(0, 1);
              } else {
                return this.persons;
              }
            }
          },
          methods: {}
        };
        </script>