Как управлять жизненым циклом структуры JSON во VUE.JS

Есть таблица, которая заполняется данными с сервера. В таблице, на каждой строке есть кнопка глаза для получения расширенной информации о строке (появляется дополнительное всплывающей окно с информацией). В том числе там есть информация что не отображается в таблице.

Проблема в следующем. Когда я прописываю ключи, которые лежат не глубоко, то все отображается отлично (например <v-text-field v-model="lookedItem.id" label="Номер"></v-text-field>).

Стоит мне написать путь к объекту поглубже, таблица пропадает после обновления страницы (например <v-text-field v-model="lookedItem.cfg.amount.currency" label="Номер"></v-text-field>).

Мои предположения. Я заметил структура которая копируется {{lookedItem}}, после перезагрузки пропадает (структура с сервера все так же приходит {{arrayGetGroup}}). Возможно проблема в жизненном цикле и стоить подумать о размещение функции в computed + mutations . Так же есть версия что сама структура сделана неудачно и ее надо будет перелопатить и только тогда получиться отображать в доп окне. Подскажите, направление в котором действовать, пожалуйста.

Таблица

<template>
   <div>
  <v-data-table
    :headers="headers"
    :items="arrayGetGroup"
    :items-per-page="10"
    sort-by="calories"
    class="elevation-1"
  >
   <template v-slot:top>
      <v-toolbar app color="primary">
        <v-divider
          class="mx-4"
          inset
          vertical
        ></v-divider>
        <v-spacer></v-spacer>
        <v-dialog v-model="dialog_item" max-width="750px">
          <v-card>
            <v-card-text>
              <v-container>
                <v-row>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="lookedItem.id" label="Номер"></v-text-field>
                  </v-col>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="lookedItem.lookedItem.cfg.amount.currency" label="Данные"></v-text-field>
                  </v-col>
                </v-row>
              </v-container>
            </v-card-text>
            <v-card-actions>
              <v-spacer></v-spacer>
              <v-btn color="blue darken-1" text @click="close">Закрыть</v-btn>
            </v-card-actions>
          </v-card>
        </v-dialog>
      </v-toolbar>
    </template>
    <template v-slot:item.action="{ item }">
      <v-icon
        medium
        class="mr-2"
        @click="lookItem(item)"
      >
        {{ icons.mdiEye }}
      </v-icon>
    </template>
  </v-data-table>
        <v-card-actions>
        </v-card-actions>
  </div>
</template>

Скрипт

<script>
import axios from 'axios'
import {  mdiEye } from '@mdi/js'

let qGetGroups = {};
let dGetGroups = 'getG';

  export default {
    data: () => ({
        icons: { mdiEye },
        dialog_item: false,
        arrayGetGroups:[],
        arrayDel:[],
        value: [],
        headers: [
          {
            text: 'Тест',
            align: 'left',
            sortable: false,
            value: 'id',
          },
          { text: 'Сумма',  value: '' },
          { text: 'Вал',    value: 'cfg.amount.currency'},
          { text: 'Дата',   value: 'created' },
        ],
        lookedItem: {},
    }),

      methods: {
        close () {
          this.dialog_item = false
        },
        lookItem (item) {
          this.lookedItem = Object.assign({}, item)
          this.dialog_item = true
        }
      },

      mounted() {
        axios.post(cURL,
      {
        request_type: qGetGroups,
        request: sGetGroups
      })
      .then(response => (this.arrayGetGroup = response.data.response))
  },
  }
</script>

Структура

{
"data": {
"status": 0,
"response": [
{
"id": "1",
"owner": "l",
"status": "NEW",
"cfg": {
"count": 1,
"accept": [
"false"
],
"amount": {
"currency": "R",
"min": 1,
"max": "10"
},
"sender": {
"bank": {
"Agt": {
"type": "Ot",
"value": "5555",
"name": [
"вязь"
],
"currency": "R",
"addr": {
"country": "RU"
}
},
"Acct": {
"type": "Ot",
"value": "331"
},
"AgtAcct": {
"type": "Ot",
"value": "301"
}
},
"client": {
"name": [
"Рог"
],
"Acct": {
"type": "Ot",
"value": "331"
}
}
},
"recipient": {
"bank": {
"Agt": {
"type": "Othr",
"value": "04",
"name": [
"вязь"
],
"currency": "R",
"addr": {
"country": "RU"
}
},
"Acct": {
"type": "Ot",
"value": "331"
},
"AgtAcct": {
"type": "Ot",
"value": "301"
}
},
"client": {
"name": [
"Cor"
],
"Acct": {
"type": "Ot",
"value": "331"
}
}
}
}