0xD34F

<input @input="onInput">

onInput({ target }) {
  const
    val = target.value,
    newVal = `${Math.min(9, Math.max(0, val.slice(-1) | 0))}`;

  if (val !== newVal) {
    target.value = newVal;
    target.dispatchEvent(new Event('input'));
  }
},

https://jsfiddle.net/0gocpeLh/

Кому и какие классы будем добавлять:

const containerSelector = '.container';
const buttonSelector = 'button';
const activeContainerClass = 'btn-active';
const activeButtonClass = 'active';

Как будем добавлять:

$(document).on('click', buttonSelector, function(e) {
  const $button = $(this).toggleClass(activeButtonClass);
  $button
    .closest(containerSelector)
    .toggleClass(activeContainerClass, $button.hasClass(activeButtonClass))
    .find(buttonSelector)
    .not($button)
    .removeClass(activeButtonClass);
});

Или, к чёрту jquery:

document.addEventListener('click', e => {
  const button = e.target.closest(buttonSelector);
  if (button) {
    const container = button.closest(containerSelector);
    container.querySelectorAll(buttonSelector).forEach(n => {
      n.classList[n === button ? 'toggle' : 'remove'](activeButtonClass);
    });
    container.classList.toggle(
      activeContainerClass,
      button.classList.contains(activeButtonClass)
    );
  }
});

$('#btn__AddEmployee').click(function() {
  const checked = $(this).prev().prop('checked');

  $('#table__Employee tbody').append(`
    <tr>
      <td>
        <input type="checkbox" ${checked ? 'checked="checked"' : ''}>
      </td>
    </tr>
  `);
});

или

document.querySelector('#btn__AddEmployee').addEventListener('click', e => {
  const input = document.createElement('input');
  input.type = 'checkbox';
  input.checked = e.target.previousElementSibling.checked;

  document
    .querySelector('#table__Employee tbody')
    .insertRow()
    .insertCell()
    .append(input);
});

[attr.aria-valuenow]="skill.percent"

Коротко:

const count = matrix.flat().reduce((acc, n) => (acc[n] = -~acc[n], acc), {});

Длинно:

const count = {};

for (const row of matrix) {
  for (const n of row) {
    if (!count.hasOwnProperty(n)) {
      count[n] = 0;
    }

    count[n]++;
  }
}

Где ошибся?

Да везде.

Корневой элемент может быть только один - так что v-for там использовать нельзя. Форма внутри элемента с v-for - зачем вам несколько форм? Вручную создали разметку для элементов формы - хотя вот она-то должна генерироваться с помощью v-for на основе массива с данными.

https://jsfiddle.net/Lp1b7do9/

document.querySelector('.selectTime').addEventListener('change', function() {
  const values = Array.from(this.querySelectorAll('select'), n => n.value);
  values[0] = `${-~values[0] % 24}`;

  document.querySelector('куда там вам надо записать время').innerText = values
    .map(n => n.padStart(2, 0))
    .join(':');
});

https://jsfiddle.net/7nqhzj9y/

const getAndDel = (obj, ...keys) =>
  keys.reduce((acc, n) => (
    acc[n] = obj[n],
    delete obj[n],
    acc
  ), {});

const obj1 = { a: 1, b: 2, c: 3, d: 4 };
const obj2 = getAndDel(obj1, 'a', 'b');
const obj3 = getAndDel(obj1, 'c');

console.log(obj1); // {d: 4}
console.log(obj2); // {a: 1, b: 2}
console.log(obj3); // {c: 3}

переменные окружения

появляется ошибка в консоли <...> Functions are not valid as a React child.

Видимо, вы пытаетесь рендерить сумму как-то так: {this.countPrice}. А надо {this.countPrice()}. Ну или сделайте countPrice геттером.

Почему price у вас строки? Должны быть числа.

Расчёта суммы - почему возвращаете результат map'а? Это же массив. Переписываем:

countPrice = () => {
  return this.state.productsList.reduce((acc, n) => acc + n.price, 0);
}

if(axis === "x")
    ctx.moveTo((position + x0), yMax);
    ctx.lineTo((position + x0), (y0 - dec));
    ctx.stroke();
if(axis === "y")
    ctx.moveTo(x0, (yMax - position));
    ctx.lineTo(xMax, (yMax - position));
    ctx.stroke();

JS вам не Python. Фигурные скобки где?

this.insertAdjacentHTML('afterend', `
  <select>${arr.map(n => `
    <option value="${n.value}" ${n.selected ? 'selected' : ''}>
      ${n.text}
    </option>`).join('')}
  </select>
`);

или

const select = document.createElement('select');
arr.forEach(n => select.appendChild(Object.assign(document.createElement('option'), n)));
this.insertAdjacentElement('afterend', select);

или

const select = document.createElement('select');
select.append(...arr.map(n => new Option(n.text, n.value, false, n.selected)));
this.after(select);

или

const select = document.createElement('select');
for (const n of arr) {
  const option = document.createElement('option');
  option.textContent = n.text;
  option.setAttribute('value', n.value);
  if (n.selected) {
    option.attributes.setNamedItem(document.createAttribute('selected'));
  }
  select.insertBefore(option, null);
}
this.parentNode.insertBefore(select, this.nextElementSibling);

Очевидно же, вместо some использовать every:

computed: {
  activeFilters() {
    return this.filters.filter(n => n.active);
  },
  filteredItems() {
    return this.items.filter(n => this.activeFilters.every(f => n[f.name]));
  },
},

array_walk_recursive($arr, function(&$val, $key) {
  $val = trim($val);
});

const getWidths = data =>
  [].concat(data || []).reduce((acc, n) => {
    if (n.hasOwnProperty('width')) {
      acc.push(n.width);
    }
    acc.push(...getWidths(n.columns));
    return acc;
  }, []);

https://jsfiddle.net/jf0hsm6c/

Вторым параметром передавайте объект с данными, в котором надо будет указать свойство class:

return h('div', {
  class: здесь строка с классами, или объект, или массив
}, [
  ...

Ну и вообще - нелишним будет почитать вот это.

function getDatesIntervalStr(dates) {
  const dateParts = d => ({ year: d.year(), month: d.format('MMMM') });
  const start = dateParts(dates[0]);
  const end = dateParts(dates[dates.length - 1]);

  if (start.year !== end.year) {
    return `${start.month} ${start.year} - ${end.month} ${end.year}`;
  } else if (start.month !== end.month) {
    return `${start.month} - ${end.month} ${end.year}`;
  } else {
    return `${end.month} - ${end.year}`;
  }
}

Вариант раз - запоминаем выделенные ячейки:

data: () => ({
  selected: [],
}),
methods: {
  key: (x, y) => `${y}.${x}`,
  select({ buttons, target: { dataset: { key } } }) {
    if (buttons) {
      const index = this.selected.indexOf(key);
      if (index !== -1) {
        this.selected.splice(index, 1);
      } else {
        this.selected.push(key);
      }
    }
  },
},

<table>
  <tr v-for="y in 10">
    <td
      v-for="x in 10"
      @mousedown="select"
      @mouseover="select"
      :data-key="key(x, y)"
      :class="{ selected: selected.includes(key(x, y)) }"
    >{{ key(x, y) }}</td>
  </tr>
</table>

Вариант два - храним состояния всех ячеек:

data: () => ({
  items: [...Array(10)].map(() => Array(10).fill(false)),
}),
methods: {
  select(row, index, e) {
    if (e.buttons) {
      this.$set(row, index, !row[index]);
    }
  },
},

<table>
  <tr v-for="(row, y) in items">
    <td
      v-for="(cell, x) in row"
      @mousedown="select(row, x, $event)"
      @mouseover="select(row, x, $event)"
      :class="{ selected: cell }"
    >{{ y + 1 }}.{{ x + 1 }}</td>
  </tr>
</table>

const output = data
  .map(n => `
    <div>
      <h2>${n.univ} (${n.sotr.length})</h2>
      <ul>${n.sotr.map(m => `
        <li>
          <h3>${m.name}</h3>
          <h3>${m.grade}</h3>
        </li>`).join('')}
      </ul>
    </div>`)
  .join('');