Как автоматически пересчитывать время начала и окончания в строках таблицы с помощью JavaScript при получении данных из базы через Laravel?

Оффтоп javascript
1

Помогите решить задачу с динамическим расчетом времени в таблице

У меня есть таблица с мероприятиями, где каждая строка содержит данные из базы данных. Основная информация включает:

  • Название мероприятия
  • Продолжительность в минутах

Мне нужно добавить два столбца: Время начала и Время завершения. Логика должна работать так:

Для первой строки:

начальное_время = стартовое_время_события
время_окончания = начальное_время + продолжительность

Для остальных строк:

for (каждая_строка) {
    время_начала = время_окончания_предыдущей_строки
    время_завершения = время_начала + текущая_продолжительность
}

Итоговая таблица должна выглядеть примерно так:

Начало | Конец | Длительность
10:00  | 10:30 | 30 мин
10:30  | 11:15 | 45 мин
11:15  | 12:00 | 45 мин

Важный момент: таблица может сортироваться пользователем (используется jQuery Sortable), и при каждом изменении порядка строк нужно автоматически пересчитывать все времена.

Стек: Laravel + MySQL. Начальное время события хранится в базе данных.

Как better организовать такую функциональность на стороне клиента?

2

Почему бы не рассчитать всё во время рендеринга таблицы? Вытаскивай данные из Laravel, рассчитывай времена на сервере и отправляй готовые результаты. Для сортировки просто сделай простую функцию, которая будет пересчитывать времена в DOM. Какое время старта используешь для первого события?

3

Держи время старта в data-атрибуте первой строки, потом просто пробегай по всем tr. Берешь длительность из ячейки, добавляешь к предыдущему времени окончания и записываешь в DOM. Только правильно работай с Date или используй moment.js для сложения времени. На sortable повесь callback, который вызывает пересчет - тогда при перетаскивании все само обновится. У меня так работает уже несколько лет без проблем.