Свойство Undefined Alarm после мутации в Vue

Question

, поэтому у меня возникла проблема после изменения массива с обновленными объектами. Чтобы дать перспективу, у меня есть v-for цикл по отфильтрованному списку заданий. Отфильтрованный ключ основан на статусе. По сути, я могу нажать на название статуса, и оно отображает только те задания, которые соответствуют этому ключу. У меня также есть возможность обновить несколько заданий одновременно, используя флажок. Как только я отправляю массив обновленных Объектов (заданий) и пытаюсь щелкнуть по статусу, для которого я обновил задания, я получаю сигнал тревоги, сообщающий, что property last_name не определено, даже если это ...

Итак, вот список состояний, по которому я зацикливаюсь

<ul v-for="workflow in allWorkflows" :key="workflow.id" v-if="workflow.id === selectedWorkflowID">
   <li v-for="status in workflow.statuses" :key="status.id" :value="status.status"  @click="changeEngagementKey(status.status)" :class="{ active: engagementFilterKey === status.status }">
      <span class="text-muted">{{ capitalize(status.status) }}</span>
   </li>
</ul>

Вот список выполняемых обязательств

<tbody>
  <tr v-for="engagement in filteredEngagements" :key="engagement.id" v-if="engagement.workflow_id === selectedWorkflowID">
    <th scope="row"><input type="checkbox" :value="engagement.id" v-model="checkedEngagements.engagements"></th>
    <th>{{ engagement.client.last_name}}, {{ engagement.client.first_name}} & {{ engagement.client.spouse_first_name}}</th>
    <td>{{ engagement.status }}</td>
    <td>{{ engagement.assigned_to }}</td>
    <td>{{ engagement.return_type }}</td>
    <td>{{ engagement.year }}</td>
  </tr>
</tbody>

Это вычисленное свойство для отфильтрованных заданий

filteredEngagements () {
  return this.allEngagements.filter((engagement) => engagement.status === this.engagementFilterKey)
    .filter( engagement => {
      return !this.searchEngagement || engagement.client.last_name.toLowerCase().indexOf(this.searchEngagement.toLowerCase()) >= 0 });
    },

И это совершенная мутация

updateCheckedEngagements(state, updatedEngagements = []) {
 const ids = updatedEngagements.map(engagement => engagement.id)
  state.engagements = state.engagements.map(engagement => {
  const matchedIndex = ids.indexOf(engagement.id)
  if(matchedIndex !== -1) {
  return{
    ...updatedEngagements[matchedIndex] 
  } 
 }
   return engagement
 })
},

Еще одна вещь, которую нужно добавить, если я обновлю страницу, будильник исчезнет, ​​и я смогу щелкнуть по статусу без проблем.

Это точная строка, с которой я столкнулся. Это как-то связано с тем, что client является вложенным объектом ...

 <th>{{ engagement.client.last_name}}, {{ engagement.client.first_name}} & {{ engagement.client.spouse_first_name}}</th> 

Нужна помощь, пожалуйста! заранее спасибо