fix/qg-146: Тестовый вариант модального окна #182
Conversation
DaemonFoen
force-pushed
the
qg-146/programm-exercise-view
branch
from
81d6373
to
4b101c5
Compare
| @@ -8,8 +8,11 @@ import pro.azhidkov.platform.spring.http.hxRedirect | |||
| import pro.azhidkov.platform.spring.mvc.modelAndView | |||
| import pro.qyoga.app.platform.ResponseEntityExt | |||
| import pro.qyoga.app.platform.notFound | |||
| import pro.qyoga.app.therapist.therapy.exercises.EditExercisePageController.ExerciseStepProcessor.processSteps | |||
There was a problem hiding this comment.
Первым делом, надо ребейзнуть ветку на актуальный мастер
| import pro.qyoga.core.therapy.exercises.ExercisesService | ||
| import pro.qyoga.core.therapy.exercises.dtos.ExerciseSummaryDto | ||
| import pro.qyoga.core.therapy.exercises.model.ExerciseStep |
There was a problem hiding this comment.
Вторым делом - написать тест на эндпоинт модалки, чтобы koverVerify проходил
| @@ -3,6 +3,22 @@ | |||
| <head> | |||
| <div th:replace="~{fragments/header.html}"></div> | |||
| <title th:text="${program?.title ?: 'Новая программа'}">Новая программа</title> | |||
| <style> | |||
There was a problem hiding this comment.
Кажется, это стоит утащить в exercise-model.html
| @@ -26,7 +42,9 @@ <h1 class="mt-4 pb-2 mb-3 border-bottom" th:text="${program?.title ?: 'Нова | |||
| document.addEventListener('alpine:init', () => { | |||
| Alpine.data('programForm', () => ({ | |||
| exercises: initialExercises, | |||
|
|
|||
| loadPage() { | |||
There was a problem hiding this comment.
Как пример обходится без кастомных скриптов? Подозреваю, благодаря data-bs-toggle="modal" - сделай так же, пожалуйста.
| exerciseId | ||
| ) | ||
|
|
||
| return modelAndView("therapist/therapy/exercises/exercise-modal") { |
There was a problem hiding this comment.
Тут надо возвращать фрагмент с html-ем модалки, без заголовка и т.д.
| <input accept="image/*" | ||
| class="form-control d-none" | ||
| th:disabled="${true}" | ||
| th:id="|stepImageInput${iterStat.index}|" | ||
| th:name="|stepImage${iterStat.index}|" | ||
| type="file"/> |
| </div> | ||
| <div class="row align-items-center px-3 mb-3"> | ||
| <div class="col-sm-2 mb-3 text-center mx-auto"> | ||
| <label class="align-items-center" |
There was a problem hiding this comment.
label тоже надо выкинуть, но изображение оставить и засунуть в <p> с описанием
| <div class="col-sm-10 form-floating gx-2"> | ||
| <textarea class="form-control" | ||
| placeholder="Глубоко вдохните..." | ||
| readonly | ||
| required | ||
| style="height: 15rem" | ||
| th:disabled="${true}" | ||
| th:name="|steps[${iterStat.index}].description|">[[${step.description}]]</textarea> | ||
| <label th:for="|steps[${iterStat.index}].description|">Описание шага</label> | ||
| </div> |
There was a problem hiding this comment.
Заменить на <p> с картинкой и описанием.
| object ExerciseStepProcessor { | ||
| const val NO_IMAGE = "/img/no-image.png" | ||
| fun processSteps( | ||
| steps: List<ExerciseStep>?, | ||
| exerciseId: Long | ||
| ): List<ProcessingExerciseStep> { | ||
| return if (steps.isNullOrEmpty()) { | ||
| listOf(ProcessingExerciseStep("", NO_IMAGE)) | ||
| } else { | ||
| steps.mapIndexed { idx, step -> | ||
| val imageUrl = | ||
| step.imageId?.let { "/therapist/exercises/$exerciseId/step-images/$idx" } | ||
| ?: NO_IMAGE | ||
| ProcessingExerciseStep(description = step.description, imageUrl = imageUrl) | ||
| } | ||
| } | ||
| } | ||
| } |
There was a problem hiding this comment.
Чёт у меня такое ощущение, что это всё добро вместе с ProcessingExerciseStep можно выкинуть.
Ты передаёшь упражнение в темплейт, там бежишь по exercise.steps, там у тебя есть step.description для описания и exercise.id + each:idx для формирования урла картинки.
Либо, надо сформировать отдельную View-модель с ExerciseView + ExerciseStepView, которая уже целиком содержит все полностью отформатированные данные (имя типа, длительность, урл картинки) и сборку этой модели перенести в конструкторы соответствующих классов
| <section class="container px-4"> | ||
| <h1 class="mt-4 pb-2 mb-3 border-bottom" | ||
| th:text="${exercise?.title ?: 'Новое упражнение'}">Новое упражнение</h1> | ||
| <form class="mt-4" |
| </head> | ||
| <body class="sb-nav-fixed"> | ||
|
|
||
| <div class="modal-body"> |
There was a problem hiding this comment.
Надо отцентировать модалку на мобилках:
Чеклист