Files
ACORE/templates/partials/task-create-modal.html
T

56 lines
4.9 KiB
HTML

{% load i18n %}
{% trans 'Ответственный' as l_resp %}{% trans '+ Добавить ответственного' as p_resp %}{% trans 'Соисполнители' as l_co %}{% trans '+ Добавить соисполнителя' as p_co %}{% trans 'Наблюдатели' as l_obs %}{% trans '+ Добавить наблюдателя' as p_obs %}
<div id="task-create-modal" role="dialog" aria-modal="true" aria-labelledby="task-create-modal-title"
style="display:none; position:fixed; inset:0; z-index:80; background:rgba(0,0,0,0.4); align-items:flex-start; justify-content:center; padding:1.5rem 1rem; overflow-y:auto;"
onclick="if(event.target===this) taskCreateClose()">
<div style="background:var(--color-card); border-radius:0.75rem; border:1px solid var(--color-border); box-shadow:0 20px 60px rgb(0 0 0/0.2); width:100%; max-width:40rem; margin:auto;">
<form id="task-create-form" hx-post="/tasks/" hx-target="#main-content" hx-indicator="#loader, find .btn-label-loading" hx-disabled-elt="find button[type=submit]">
{% csrf_token %}
<div style="padding:1rem 1.25rem; border-bottom:1px solid var(--color-border); display:flex; align-items:flex-start; justify-content:space-between; gap:0.75rem;">
<div>
<div id="task-create-modal-title" style="font-size:1rem; font-weight:600; color:var(--color-foreground);">{% trans "Новая задача" %}</div>
<p style="font-size:0.75rem; color:var(--color-muted-foreground); margin-top:0.25rem;">{% trans "Назначьте ответственного, соисполнителей и срок." %}</p>
</div>
<button type="button" class="btn btn-ghost btn-icon" onclick="taskCreateClose()" aria-label="{% trans 'Закрыть' %}">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
</button>
</div>
{% if form_error %}
<div style="margin:0.75rem 1.25rem 0; padding:0.5rem 0.75rem; border-radius:0.5rem; background:hsl(0 70% 96%); border:1px solid hsl(0 70% 85%); color:hsl(0 55% 35%); font-size:0.8125rem;">
{{ form_error }}
</div>
{% endif %}
<div style="padding:1.25rem; display:flex; flex-direction:column; gap:0.875rem;">
<input type="text" name="title" required maxlength="250" placeholder="{% trans 'Название задачи' %}" class="input" style="width:100%; font-weight:500;">
<textarea name="description" placeholder="{% trans 'Описание задачи (необязательно)...' %}"
style="width:100%; min-height:5rem; resize:vertical; background:var(--color-card); border:1px solid var(--color-input); border-radius:var(--radius); padding:0.4375rem 0.75rem; font-size:0.875rem; color:var(--color-foreground); font-family:var(--font-sans); outline:none; box-sizing:border-box;"></textarea>
<div style="display:flex; flex-direction:column; gap:0.875rem;">
{% include 'partials/people-picker-field.html' with label=l_resp field_name='responsible' options=employee_options selected_ids=preselect_responsible_ids placeholder=p_resp %}
{% include 'partials/people-picker-field.html' with label=l_co field_name='co_executors' options=employee_options selected_ids=empty_ids placeholder=p_co %}
{% include 'partials/people-picker-field.html' with label=l_obs field_name='observers' options=employee_options selected_ids=empty_ids placeholder=p_obs %}
</div>
<div style="display:flex; align-items:center; gap:0.75rem; flex-wrap:wrap;">
<select name="priority" class="input" style="width:auto; font-size:0.8125rem;">
{% for value, label in priorities %}
<option value="{{ value }}" {% if value == 'medium' %}selected{% endif %}>{{ label }}</option>
{% endfor %}
</select>
<input type="date" name="due_date" class="input" style="width:auto; font-size:0.8125rem;">
</div>
</div>
<div style="padding:0.875rem 1.25rem; border-top:1px solid var(--color-border); display:flex; justify-content:flex-end; gap:0.5rem;">
<button type="button" class="btn btn-secondary" style="border:1px solid var(--color-border);" onclick="taskCreateClose()">{% trans "Отмена" %}</button>
<button type="submit" class="btn btn-primary">
{% trans "Создать задачу" %}
<span class="btn-label-loading htmx-indicator">{% trans "Создание…" %}</span>
</button>
</div>
</form>
</div>
</div>