TRI-293: add customer-form + adaptive

This commit is contained in:
2024-12-18 18:41:45 +03:00
parent e56d29c322
commit 6044b302bb
26 changed files with 1243 additions and 17 deletions

View File

@@ -0,0 +1,200 @@
{% load static %}
{% load i18n %}
{% trans "300" as maxLetterLength %}
{% if owner_type == 'customer' %}
{% trans "Заполните форму, чтобы отправить посылку" as p_title %}
{% elif owner_type == 'mover' %}
{% trans "Заполните форму, чтобы перевезти посылку" as p_title %}
{% endif %}
<link rel="stylesheet" href="{% static 'css/ion.rangeSlider.min.css' %}">
<link rel="stylesheet" href="{% static 'css/create_poster.css' %}">
<div hidden>
csrfmiddlewaretoken: eoN2nLYYo46PpDIhi82dmTFASHH4ONiBdEQOz1jQNyUpsHJ4RrvcmFwfnM45TNtl
type_transport: road
from_address_point: 59613
from_address_point_txt: Москаленки / Россия
to_address_point: 2824
to_address_point_txt: Берлар / Бельгия
departure_DT: 17.12.2024 23:04
arrival_DT: 29.12.2024 20:04
from_place: other
to_place: other
cargo_type: parcel
weight: 500
phone: 2604195
extra_phone: test
receive_msg_by_email: on
owner_type: customer
hiddenTime: 16 декабря 2024 г. 23:04
</div>
<div class="poster">
<h1 class="poster__title">{{ p_title }}</h1>
<form class="poster__form"
name="new_route"
method="post"
id="new_route"
>
{% csrf_token %}
{#from-to#}
<div class="poster__row poster__row--from-to">
<div class="poster__col">
<label for="from" class="poster__label " required>
{% translate "Откуда забрать посылку" %}
</label>
<input type="text" name="from" id="from" class="locate" placeholder="{% translate "Укажите город" %}">
</div>
<div class="poster__col">
<label for="to" class="poster__label " required>
{% translate "Куда доставить посылку" %}
</label>
<input type="text" name="to" id="to" class="locate" placeholder="{% translate "Укажите город" %}">
</div>
</div>
{#cargo-type#}
<div class="poster__row poster__row--cargo">
<div class="poster__col col-12">
<label class="poster__label col-12" required>
{% translate "Выберите кого (что) вы можете перевезти:" %}
</label>
<div class="poster__grid">
{% for item in form.fields.cargo_type.choices %}
<div class="cargo">
<input
class="cargo__inp"
type="radio"
name="cargo_type"
id="cargo_type_{{ forloop.counter }}"
required
value="{{ item.0 }}"
{% if item.checked %}
checked="checked"
{% endif %}
/>
<label class="cargo__label"
for="cargo_type_{{ forloop.counter }}">
<span>{{ item.1 }}</span>
</label>
</div>
{% endfor %}
</div>
</div>
</div>
{#date-poster#}
<div class="poster__row poster__row--date">
<div class="poster__col">
<label from="date-to" required class="poster__label col-12 ">
{% translate "Дата доставки посылки" %}
</label>
<input type="text" name="date-to" class="poster__date date">
</div>
<div class="poster__col"></div>
</div>
{#type-transport#}
<div class="poster__row poster__row--transport">
<div class="poster__col col-12">
<label for="type_transport" class="poster__label col-12" required>
{% translate "Каким способом Вы хотите отправить?" %}
</label>
{% for item in form.fields.type_transport.choices %}
<div class="cargo cargo--inline">
<input
class="cargo__inp"
type="radio"
name="type_transport"
id="type_transport_{{ forloop.counter }}"
value="{{ item.0 }}"
{% if form.initial.type_transport == item.0 %}
checked="checked"
{% endif %}
>
<label class="cargo__label"
for="type_transport_{{ forloop.counter }}">
<span>{{ item.1 }}</span>
</label>
</div>
{% endfor %}
<div class="poster__errors">
</div>
<div class="poster__info">
{% translate "Обязательно учитывайте Правила и особенности перевозки выбранным Вами видом транспорта" %}
</div>
</div>
</div>
{#phone#}
<div class="poster__row poster__row--phone">
<div class="poster__col col-12">
<label for="phone" class="col-12">
{% translate "Контактный номер телефона, по которому с Вами могут связаться перевозчики" %}
</label>
<input class="col-12 col-xl-6" type="tel" placeholder="{% translate "Укажите телефон" %}">
<div class="poster__info">
{% translate "Если вы оставите это поле пустым - перевозчики смогут только написать вам в личные сообщения на нашем сайте TripWB.com" %}
</div>
</div>
</div>
{#description#}
<div class="poster__row poster__row--description">
<div class="poster__col col-12">
<label for="description" class="col-12">
{% translate "Примечание (необязательно)" %}
</label>
<textarea
name="description"
id="description"
maxlength="{{ maxLetterLength }}"
placeholder="{% translate "Если желаете, то здесь можно указать важную информацию, например: вес, габариты посылки, количество попутчиков и т.д.)" %}"
></textarea>
<div class="poster__area-descr">
<span class="js-letter-count">0</span>
{% translate "из" %}
{{ maxLetterLength }}
{% translate "символов" %}
</div>
</div>
</div>
{#distribution#}
<div class="poster__row poster__row--distribution">
<div class="cargo cargo--info">
<input type="checkbox"
name="receive_msg_by_email"
class="cargo__inp"
{% if form.initial.receive_msg_by_email == True %}
checked="checked"
{% endif %}
id="id_receive_msg_by_email">
<label class="cargo__label" for="id_receive_msg_by_email">
{% translate "Хочу получать уведомления на E-mail о появлении перевозчика по моим критериям" %}
</label>
</div>
{% if not errors_off and form.errors and form.errors.receive_msg_by_email %}
{{ form.errors.receive_msg_by_email }}
{% endif %}
</div>
<button type="submit"
class="btn btn--primary col-12"
onclick="sendRoute(this,
{% if route.id %}{{ route.id }}{% endif %})"
>
{% translate "Разместить объявление" %}
</button>
</form>
</div>