@iiwwfu

Как лучше реализовать на vue такое приложение?

фотография
13fd7caada4c4260b5a014307fb68389.png

Функционал:
1) Добавить упражнение - будет поверх появляться список и с него можно будет добавить упражнение. Соответственно будут фильтроваться только те упражнение, у которых группа мышц будет такая же как и на вкладке активной.
2) Удалить упражнение
3) Добавить/удалить подход
4) Изменять данные о кол-ве раз, весе.

Календарь с помощью moment библиотеки я реализовал. Но так как с vue мало работал, то прошу совету как лучше все организовать, ниже приведу организацию темплейтов:
<calendar>
     ....
     <calendar-day></calendar-day>
     <calendar-day></calendar-day>
     .....
     <!--Форма, которая всплывает при нажатии на день-->
     <modal-form>
     Тут обычный бутстрап tabs. Внутри контейнеров будет
     <exercise>
     Тут будет фотография и сами подходы перечисляться.
     </exercise>
     </modal-form>
</calendar>


Используя vuex, в store будет данные exercises - где будут все упражнения за выбранный месяц. Структура будет с адрес фото, название упражнения и т.д, плюс свойство exercise_data - где будут массивами данные о подходе, кол-ве раз, вес.

При нажатии на день, я в modal-form возьму вычисляемые свойства под каждую группу мышц. И там из общего store с exercises фильтром обойду и выберу все упражнений под выбранный день и под нужную группу мышц для каждой вкладки.

На этом описание закончено. Теперь собственно вопросы.
Я хочу, чтобы пользователь мог удалить, добавить подход, упражнение, изменить данные.
Изменения сохранить в базу, после того, как он нажмет ниже кнопку сохранить. То есть изменил все что хотел, а перед тем как закрыть окно или перейти на другую вкладку он должен сохранить изменения, чтобы не посылать запросы при каждом изменения, а послать один в конце когда уже пользователь сделал все что хотел.

Как во vue лучше добавлять новые подходы. На jquery создавал элемент и append куда нужно. Во вью в основном по данным отрисовываются элементы. Значит при добавлении подхода, найти фильтром из всех упражнений нужный по id и добавить в exercise_data нужного exercise в массив новый элемент, чтобы он сам добавился в форме, так как свойство computed и при изменении данных отрисует новый элемент.
Или же не обходить каждый раз весь exercise и добавить перед кнопкой новый элемент, а вносить изменения уже потом, как пользователь нажмет на сохранить только. Правда как тут лучше это делать, через render функцию?

Для меня пока проблематично как лучше организовать все эти изменения. Просто сделать календарь, вывести упражнения в нужный день и по вкладкам я могу. Я пока не очень представляю как лучше сохранить все изменения, добавления и потом отправить данные на сервер.

Допустим пользователь в одном упражнении сделал изменение в 3 подходе, 4 удалил, потом ещё 2 новых добавил. Потом ещё добавил новое упражнение.
Отслеживать каждый id каждого подхода или просто создать отдельный массив, где хранить id упражнений, которые были изменены и на сервер передать весь их список с вложенными в них данными о подходах и по циклу просто все изменить, не особо вдаваясь какие именно подходы были изменены, просто все подряд обойти и изменить.
И отдельно создать ещё массив где хранить id, новых добавленных упражнений и удаленных упражнений.

И на сервер отправить 3 запроса:
-с id измененных упражнений
- удаленных
- новых
  • Вопрос задан
  • 377 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Вакансии с Моего Круга Все вакансии
Заказы с Фрилансим Все заказы