0xD34F

Можно сделать фильтр:

filters: {
  shorten: (val, words = 2) => val.split(' ').slice(0, words).join(' '),
},

<div>{{ text | shorten }}</div>
<div>{{ text | shorten(5) }}</div>

Экземпляр компонента не пересоздаётся при смене страницы, так что хук created не вызывается, метод loadCustomers соответственно, тоже.

Надо установить слежение за изменениями страницы, например так:

watch: {
  '$route.query.page'() {
    this.loadCustomers();
  },
},

Или так (в этом случае вызывать в created метод loadCustomers не надо):

watch: {
  '$route.query.page': {
    immediate: true,
    handler: 'loadCustomers',
  },
},

Так?

Что-то вы переусложнили, всё гораздо проще:

if (coord.every((n, i) => n === coordinates[i])) {
  placemark.balloon.open();
}

Но вообще, надо переписывать - у вас там обработчик события clickAddress назначается несколько раз, хотя достаточно и одного (да и в целом - многословно как-то). Например, так:

const placemarks = elem.find('.map-balloonContent').get().map(n => createPlacemark({
  coord: $(n).data('coord'),
  content: $(n).html(),
}));
placemarks.forEach(n => myMap.geoObjects.add(n));
placemarks[0].balloon.open();

elem.on('clickAddress', function(e, coord) {
  placemarks.find(n => n.geometry.getCoordinates().every((m, i) => m === coord[i])).balloon.open();
});

function getWinCount(team) {
  const el = Array
    .from(document.querySelectorAll('.table-item__name'))
    .find(n => n.textContent === team);

  return el ? +el.closest('tr').children[3].textContent : null;
}


const wins = getWinCount('Уфа');

UPD. Вынесено из комментариев:

Мой браузер не поддерживает ES-2015

На будущее: о таких вещах следует говорить сразу.

Будет работать в IE11:

function getWinCount(team) {
  var el = null;

  [].concat.apply([], document.querySelectorAll('.table-item__name')).forEach(function(n) {
    if (!el && n.textContent === team) {
      el = n;
    }
  });

  if (!el) {
    return null;
  }

  do {
    el = el.parentNode;
  } while (el.tagName !== 'TR');

  return +el.children[3].textContent;
}

Индекс неправильный. Нужное вам значение передаётся первым параметром в each:

$('.container').find('h2, h3').each(function(i) {

Его и используйте:

text = $('.select-list li a').eq(i).text();

не надо код, подскажите алгоритм

Думаю, это уже не актуально - раз вы опубликовали собственный вариант. Так что просто код:

function shorten(val) {
  if (val <= 10000) {
    return val.toString();
  }

  const thousands = val / 1000;
  const rounded = Math.round(thousands);
  const deviation = Math.sign(thousands - rounded);

  return `${[ '≈', '', '>' ][deviation + 1]}${rounded} т.`;
}

Ну и откуда тогда должна браться цена, если селект с ценой отсутствует? Можете подставлять случайное значение - как, подойдёт такой ответ? Нет? Тогда дополняйте вопрос.

UPD.

Цена завернута в див price prc-new

ОК, тогда замените

$('[name="variant"] option:checked').data('price')

на

$('.price.prc-new span').text()

если я правильно вас понял...

$('input').on('input', function() {
  $(this).val((i, v) => Math.max(this.min, Math.min(this.max, v)));
});

или

document.querySelector('input').addEventListener('input', ({ target: t }) => {
  t.value = Math.max(t.min, Math.min(t.max, t.value));
});

$('.price').text((i, text) => {
  const [ price, currency ] = text.split(' ');
  return `${(+price).toLocaleString()} ${currency}`;
});

// или

document.querySelectorAll('.price').forEach(n => {
  n.textContent = n.textContent.replace(/\d(?=(\d{3})+\D)/g, '$& ');
});

Ну или (что желательно), перед выводом пропускайте цену через toLocaleString.

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

function toggleClasses(block) {
  const info = block.querySelector('.infoWrapper');
  block.classList.toggle('marginBottom10');
  block.classList.toggle('marginBottom120');
  info.classList.toggle('displayNone');
  info.classList.toggle('displayBlock');
}

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

document.addEventListener('click', function(e) {
  const block = e.target.closest('.blockSvg');
  if (block) {
    const prevBlock = document.querySelector('.blockSvg.marginBottom120');
    if (prevBlock && prevBlock !== block) {
      toggleClasses(prevBlock);
    }

    toggleClasses(block);
  }
});

В результате, объём кода сократился на два порядка.

Ну и конечно, надо перевёрстывать, потому что вот это вот "подправляем положение блоков" - позорище какое-то.

vue.config.js:

module.exports = {
  chainWebpack: config => {
    config
      .plugin('html')
      .tap(args => {
        args[0].minify.removeAttributeQuotes = false;
        return args;
      })
  }
};

Всё работает. Просто вы сначала изменяете globalCompositeOperation, а затем рисуете картинку - естественно, что не видно ничего, всё становится прозрачным, рисовать текст после этого уже бессмысленно. Поменяйте порядок действий - сначала рисование картинки, затем изменение globalCompositeOperation. Как-то так.

.container :nth-child(5n),
.container :nth-child(5n-1),
.container :nth-child(5n-2) {
  ...
}

Слушать событие dragend, выполнять обратное геокодирование:

<div>{{ address }}</div>
<div ref="map"></div>

data: () => ({
  coords: [ ... ],
  address: '',
}),
mounted() {
  ymaps.ready(() => {
    const map = new ymaps.Map(this.$refs.map, { ... });

    const marker = new ymaps.Placemark(this.coords, {}, {
      draggable: true,
    });

    marker.events.add('dragend', e => {
      this.coords = e.get('target').geometry.getCoordinates();
    });

    map.geoObjects.add(marker);

    this.$watch('coords', {
      immediate: true,
      handler(coords) {
        ymaps.geocode(coords).then(r => {
          this.address = r.geoObjects.get(0).properties.get('name');
        });
      },
    });
  });
},

В каких элементах и на сколько надо ограничить длину текста:

const className = 'dop_atr';
const maxlen = 250;

Чтобы все элементы обрабатывались индивидуально, вместо строки можно передавать в метод text функцию - вызывается для каждого элемента набора, принимает текущее текстовое содержимое элемента и возвращает новое:

$(`.${className}`).text((i, text) => {
  return text[maxlen] ? `${text.substring(0, maxlen)}...` : text;
});

Или, можно отказаться от jquery:

for (const n of document.getElementsByClassName(className)) {
  n.innerText = n.innerText.slice(0, maxlen) + (n.innerText.charAt(maxlen) && '...');
}

// или

document.querySelectorAll(`.${className}`).forEach(function(n) {
  n.textContent = n.textContent.replace(this, '$1...');
}, RegExp(`(.{${maxlen}}).+`));