0xD34F

data: () => ({
  items: [ 'hello, world!!', 'fuck the world', 'fuck everything' ],
  focused: null,
}),

<div v-for="(n, i) in items">
  <input @focus="focused = i" @blur="focused = null">
  <span v-show="focused === i" v-text="n"></span>
</div>

https://jsfiddle.net/5sxkjatg/

запрос_1()
  .then(результат_1 => Promise
    .all(результат_1.map(запрос_2))
    .then(результат_2 => результат_1.map((значение_1, i) => ({
      значение_1: значение_1,
      значение_2: результат_2[i],
    })))
  )
  .then(console.log)

Надо сделать объект - ключами будут языки, значениями массивы дней недели:

const getDayName = (day, lang) => (({
  en: [ 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' ],
  ru: [ 'Воскресенье', 'Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Суббота' ],
})[lang] || [])[day - (7 * Math.floor(day / 7))];


getDayName(5, 'en') // 'Friday'
getDayName(7, 'ru') // 'Воскресенье'
getDayName(-19, 'ru') // 'Вторник'
getDayName(4, 'fr') // undefined

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

const getDayName = (day, lang) =>
  new Date(2001, 0, ((day % 7) + 7) % 7).toLocaleString(lang, { weekday: 'long' });


getDayName(4, 'fr') // 'jeudi'
getDayName(36, 'de') // 'Montag'

// можно посмотреть количество ключей
const isEmpty = x => !Object.keys(x || {}).length;

// или перебирать свойства, пока не встретится собственное
function isEmpty(x) {
  for (const k in x) if (x.hasOwnProperty(k)) {
    return false;
  }

  return true;
}

isEmpty() // true
isEmpty(null) // true
isEmpty(666) // true
isEmpty('') // true
isEmpty([]) // true
isEmpty({}) // true

isEmpty([ 187 ]) // false
isEmpty({ xxx: 69 }) // false
isEmpty('hello, world!!') // false

onDragEnd={e => console.log(e.get('target').geometry.getCoordinates())}

Если результат выполнения commit нужен, тогда так:

await Promise.all([ one(), query().then(commit) ])

Если не нужен:

await Promise.all([ one(), query().then(r => (commit(), r)) ])

const data = Array.from(
  document.querySelectorAll('.bigDiv'),
  n => Array.from(n.querySelectorAll('.smallDiv'), m => m.innerText)
);

или

const data = [];

for (const n of document.getElementsByClassName('bigDiv')) {
  const row = data[data.length] = [];

  for (const m of n.children) {
    row[row.length] = m.innerHTML;
  }
}

или

const data = Array.prototype.reduce.call(
  document.getElementsByClassName('smallDiv'),
  (acc, n) => (
    n.previousElementSibling || acc.push([]),
    acc[~-acc.length].push(n.textContent),
    acc
  ),
  []
);

Во-первых, интерполяция с атрибутами не работает, привязка значений осуществляется иначе.

Во-вторых - трогать $root НЕ НАДО. Хотите использовать внешнее значение - передавайте его в компонент как параметр или доставайте из хранилища.

Сделать точки по умолчанию прозрачными, а при hover'е - какой там вам нужен цвет. Например.

у одного пять букв в названии, у другого три

освойте js, и подобные вопросы перестанут вас волновать

Пусть modalOpen будет не boolean, а число - индекс открытого окна.

Или, вместо состояния открытости окон храните данные для них - а окно будет одно. Данные есть - окно показывается.

.hidden {
  display: none;
}

const checkbox = document.querySelector('.block50 input');
const block = document.querySelector('.block83');
const onChange = e => block.classList.toggle('hidden', !e.target.checked);
checkbox.addEventListener('change', onChange);

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

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

Добавляем класс элементу:

<div class="block83 hidden">

Или отправляем ему событие change, чтобы обработчик сработал и класс добавил:

checkbox.dispatchEvent(new Event('change'));

UPD. Наконец-то дождались, теперь js тут использовать не обязательно:

body:not(:has(.block50 :checked)) .block83 {
  display: none;
}

document.querySelector('#myselect').addEventListener('change', function(e) {
  const select = this;
  // или
  // const select = e.target;
  // const select = e.currentTarget;

  const [ option ] = select.selectedOptions;
  // или
  // const option = select[select.selectedIndex];
  // const option = select.querySelector(`[value="${select.value}"]`);
  // const option = select.querySelector('option:checked');
  // const option = [...select.options].find(n => n.selected);

  const forAttr = option.getAttribute('for');
  // или
  // const forAttr = option.attributes.for.value;

  document.querySelector('#mydiv').innerText = `Вес брутто*: ${forAttr}`;
});

Где...

Здесь.

...или как

Изучить js, хоть немного - тогда переписать самостоятельно труда не составит.

Данные - вместо объекта сделайте массив, так будет проще работать.

Когда данные получили - сохраните их (ну типа переменная какая-то, чтобы они у вас всегда были под рукой).

Сделайте функцию, которая будет выводить список товаров - но не весь, а те, что ей будут переданы.

Сделайте функцию, которая будет осуществлять фильтрацию - получает значения из фильтров, отбирает соответствующие элементы из массива, результат передаёт в функцию вывода товаров.

На блок с фильтрами вешаете функцию фильтрации в качестве обработчика событий, возникающих после взаимодействия пользователя с фильтрами.

Всё.

Добавьте + перед .float. Чтобы стало так:

main .nav #open:hover + .float {

Добавьте после строки с slideDown:

if (!$('.work-album-item:hidden').length) {
  $(this).hide();
}

// или

$(this).toggle(!!$('.work-album-item:hidden').length);

body {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

footer {
  flex: 1;
}

вместо

setValue(prevValue => prevValue + number);

пусть будет

setValue(prevValue => (prevValue + number).slice(0, 3));

Promise
  .all([...img].map(n => new Promise(r => n.complete ? r() : n.onload = r)))
  .then(() => img.forEach(n => n.style.position = 'absolute'));