web-dev/labs/lab-6/app/templates/courses/new.html

{% extends 'base.html' %}

{% block content %}
    <div class="container mt-5 mb-5">
        <h2 class="my-3 text-center text-uppercase">Создание курса</h2>

        <div class="review-form-card mt-4">
            <form method="POST" action="{{ url_for('courses.create') }}" enctype="multipart/form-data">
                <input type="hidden" name="author_id" value="{{ current_user.id }}">
                <div class="mb-3 row">
                    <div class="col-md-6 d-flex flex-column">
                        <div class="mb-3">
                            <label for="name">Название</label>
                            <input class="form-control" type="text" name="name" id="name" value="{{ course.name or '' }}" placeholder="Введите название курса">
                        </div>
                        <div class="mb-3">
                            <label for="category">Категория</label>
                            <select class="form-select" name="category_id" id="category">
                                {% for category in categories %}
                                    <option {% if course.category_id == category.id | string %}selected{% endif %} value="{{ category.id }}">{{ category.name }}</option>
                                {% endfor %}
                            </select>
                        </div>
                        <div class="mb-3">
                            <label for="teachers">Преподаватели</label>
                            <select class="form-select" name="teachers_ids" id="teachers" multiple>
                                {% for user in users %}
                                    <option value="{{ user.id }}" {% if user.id == current_user.id or course.author_id == user.id | string %}selected{% endif %}>{{ user.full_name }}</option>
                                {% endfor %}
                            </select>
                        </div>
                        <div class="mb-3 d-flex flex-column flex-grow-1">
                            <label for="short_description">Краткое описание</label>
                            <textarea class="form-control flex-grow-1" name="short_desc" id="short_description" cols="30" rows="5" placeholder="Краткое описание курса...">{{ course.short_desc or '' }}</textarea>
                        </div>
                    </div>
                    <div class="col-md-6 d-flex flex-column">
                        <div class="mb-3">
                            <label for="background_img">Фоновое изображение</label>
                            <input class="form-control" type="file" name="background_img" id="background_img" accept="image/*">
                        </div>
                        <div class="mb-3 background-preview p-3 rounded d-flex align-items-center justify-content-center">
                            <img src="#" class="img-fluid d-none" alt="">
                            <label for="background_img" class="btn-primary-red" style="cursor:pointer;">
                                <i class="fas fa-image me-1"></i>Выбрать изображение
                            </label>
                        </div>
                    </div>
                </div>

                <div class="mb-3">
                    <label for="full_description">Полное описание</label>
                    <textarea class="form-control" name="full_desc" id="full_description" cols="30" rows="10" placeholder="Подробное описание курса...">{{ course.full_desc or '' }}</textarea>
                </div>

                <div class="mb-3 text-center">
                    <button type="submit" class="btn-primary-red" style="padding: 0.75rem 2.5rem;">
                        <i class="fas fa-save me-1"></i>Сохранить
                    </button>
                </div>
            </form>
        </div>
    </div>
{% endblock %}