Владимир Мацуев

можете применить setInterval и в нем вызов к апи, примерно так:

const timerId = setInterval(() => loadFromAPI(), 1000)

в роуте на странице со всем элементами в path должен передаваться id:
path: '/n/:id'
там где происходит переход должно быть что то подобное (переход на страницу с модалками):
button(@click="$router.push('/n/1')" )
в компоненте где модалка должна открыться, нужен обработчик урла и вызов открытия модалки по id:

mounted () {
  const idModal = this.$router.currentRoute.params.id

  if (idModal) {
    this.openModalById(idModal )
  }
}

нужно чтобы родительский компонент управлял видимостью этих компонентов. тоесть в App.vue должна быть логика и в родительском компоненте где роут у вас прописан

background-image позволяет вставить несколько изображении

Для того чтобы был не undefined, необходимо использовать промисы

function getFile(url) {
    return new Promise((resolve, reject) => {
      const xhr = new XMLHttpRequest();
      xhr.open("GET", url);
      xhr.onreadystatechange = () => resolve(xhr.responseText);
      xhr.onerror = () => reject(xhr.statusText);
      xhr.send();
    });
}

getFile(url).then((res) => {
  console.log(res);
});

Также может пригодится конструкция async await

В js много магии происходит с операциями над числами с плавающей точкой

Рекомендую использовать библиотеку bignumber