0xD34F

each val, index in [ ... ]
  li
    a(class=index == 0 ? 'active' : '')

UPD. https://codepen.io/anon/pen/PrMmBx?editors=1100

const merge = (...arrs) => [...arrs
  .flat()
  .reduce((acc, n) => {
    const { name: k, value: v } = n;
    const obj = acc.set(k, acc.get(k) || {...n}).get(k);
    obj.value = +v === v ? v : obj.value;
    return acc;
  }, new Map)
  .values()
];

const third = merge(first, second);

https://codepen.io/anon/pen/aeoYXY

Что знаем и что хотим узнать:

const sourceKey = 'population';
const sourceVal = 2870528;
const targetKey = 'name';

Узнаём:

const [ val ] = jp.query(cities, `$[?(@.${sourceKey} == ${sourceVal})].${targetKey}`);

Одно непонятно - зачем тут jsonpath? Без него проще:

const val = (cities.find(n => n[sourceKey] === sourceVal) || {})[targetKey];

Потому что

'use strict';

https://developer.mozilla.org/ru/docs/Web/JavaScri...

Может кто то знает как решить эту проблему?

Это не проблема. Всё так, как и должно быть.

mounted: {
  submit: () => {

methods: {
  submit() {
    ...

Когда как:

By default null and undefined are subtypes of all other types.

<...>

However, when using the --strictNullChecks flag, null and undefined are only assignable to any and their respective types

<table>
  <thead>
    <tr>
      <th v-for="day in nameOfDays">{{ day }}</th>
    </tr>
  </thead>
  <tbody>
    <tr v-for="week in getCalendar">
      <td v-for="day in week" class="day">{{ day }}</td>
    </tr>
  </tbody>
</table>

.day:hover {
  background: red;
  color: white;
}

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

как числа которые относятся к прошлому и будущему месяцу сделать серыми а не черными в отличии чисел нынешнего месяца?

<tr v-for="(week, i) in getCalendar">
  <td v-for="day in week" :class="classes(i, day)">{{ day }}</td>
</tr>

methods: {
  classes(week, day) {
    return [
      'day',
      ((!week && day > 7) || (week > 2 && day < 7)) && 'other-month',
    ];
  },
  ...

.other-month {
  ...

:disabled="currentPage === 0"

Ну и какой в этом смысл? 0 - это январь, что, нельзя переключаться на предыдущий год? Уберите.

if(this.currentPage % 11 == 0){

Да ну? Так вы будете с февраля переключаться на декабрь. Проверяйте, что номер текущего месяца меньше нуля.

if(this.currentPage+1 % 11 == 0){

И это тоже работает не так, как вам кажется. Во-первых - чтобы получить нулевой остаток от деления, currentPage должен быть равен 10, т.е., после октября у вас будет идти январь. А во-вторых - приоритет операторов, погуглите что это такое. Реально тут вычисляется остаток от деления единицы на одиннадцать, а не суммы, т.е. (учитывая, что currentPage не должен быть отрицательным) условие никогда не будет истинным. Проверяйте, что номер текущего месяца превышает максимальный (декабрь, 11).

this.currentPage == 11;

this.currentPage == 0;

Кто-то неспособен различить операторы присваивания и сравнения.

подскажите пожалуйста что я неправильно делаю

Да всё правильно делаете - не зная язык, пытаетесь осваивать фреймворк.

Синусы, косинусы, перевод из градусов в радианы. Например.

Элементы output - вместо id назначьте им класс.

document.addEventListener('change', function(e) {
  if (e.target.type === 'radio') {
    e.target.closest('form').querySelector('.output').textContent = e.target.value;
  }
});

const duplicates = Array
  .from(arr.reduce((acc, n) => acc.set(n.id, acc.has(n.id)), new Map))
  .reduce((acc, n) => (n[1] && acc.push(n[0]), acc), []);

// или

const duplicates = arr.reduce((acc, { id }) => (
  (acc[1][id] = -~acc[1][id]) === 2 && acc[0].push(id),
  acc
), [ [], {} ])[0];

// или

const duplicates = [...arr
  .reduce((acc, n) => (acc[+acc[0].has(n.id)].add(n.id), acc), [ new Set, new Set ])
  .pop()
];

// или

const duplicates = arr
  .map(n => n.id)
  .filter((n, i, a) => i !== a.indexOf(n))
  .filter((n, i, a) => i === a.indexOf(n));

// или

const duplicates = arr.reduce((acc, { id: n }, i, a) => (
  !acc.includes(n) && i !== a.findIndex(m => m.id === n) && acc.push(n),
  acc
), []);

Определяем класс, задающий другой цвет:

.active
  background-color: #77b97e
  color: #fff

  &:hover
    background-color: #99db8f

Переключаем этот класс:

document.addEventListener('click', ({ target: { classList: cl } }) =>
  cl.contains('calendar__mounth-day') && cl.toggle('active')
);

ИЛИ

Без js. Исправляем разметку - делаем значения атрибутов id у чекбоксов и for у label'ов такими, чтобы клик по label'у переключал состояние чекбокса. Т.е., одинаковыми для пары из чекбокса и соответствующего ему label'а, уникальными для каждой из пар.

Затем раскрашиваем label'ы, являющиеся соседями отмеченных чекбоксов:

.calendar__mounth-list input:checked + label
  background-color: #77b97e
  color: #fff

  &:hover
    background-color: #99db8f

Элементам board.Stages добавляете булевы свойства show.

По клику переключаете их значения:

<ui-icon
  iconSet="ico-moon"
  data-icon="i-more"
  @click="stage.show = !stage.show"
>

Список показываете если true:

<div
  class="opportunity-board__list"
  v-show="stage.show"
>

А зачем + перед number? Может его стоит, ну не знаю, убрать?

А чо, сделать её параметром fetchSuccess'а - нет, никак?

s-switch(@switch="switch")

Круто. А вы в курсе, что switch - это ключевое слово? Переименуйте обработчик. Ну или пишите this.switch.

использовать слот