0.0.131 search routes

RoutesApp/js_views.py

@@ -279,7 +279,7 @@ def find_routes_ajax(request):
 
 
         if routes_Dict['routes']:
-            html = render_to_string('blocks/b_search_routes.html', routes_Dict, request=request)
+            html = render_to_string('v2/blocks/b_search_routes_result.html', routes_Dict, request=request)
         else:
             html = render_to_string('templates_js_translate/not_found_find_routes.html', routes_Dict, request=request)
 

static/v2/css/blocks/b_filter_routes.css

@@ -5,6 +5,7 @@
     background: #FFFFFF;
 
     border-radius: 10px;
+    height: fit-content;
     .title{
         font-size: var(--form-title-font-size);
         font-weight: 700;

static/v2/css/pages/p_search_route_results.css

@@ -10,5 +10,6 @@
 .routes_content_part{
     margin-top: 50px;
     display: grid;
-    grid-template-columns: 30% calc(100% - 30%);
+    grid-template-columns: 30% calc(100% - 30% - 41px);
+    gap: 41px;
 }

static/v2/css/widgets/w_route_card.css

@@ -392,7 +392,7 @@
             justify-content: center;
             text-align: unset;
         }
-        &:not(&.inactive){
+        &:not(&.inactive) and &:not(&.unhovered){
             &:hover{
                 background: var(--route-btn-hover-bg);
                 .route_btn_title{color: var(--route-btn-hover-text-color);}
@@ -455,4 +455,20 @@
         font-size: var(--route-number-font-size);
         margin-top: var(--route-number-margin-top);
     }
+    .respond_route_cont{
+        display: grid;
+        grid-template-columns: calc(100% - 47px) 37px;
+        gap: 10px;
+    }
+    .chat_btn{
+        padding: 6.5px;
+        background: #FF613A;
+        border-radius: 10px;
+        img{
+            display: block;
+            height: 24px;
+            width: 24px;
+            filter: invert(1);
+        }
+    }
 }

static/v2/js/blocks/b_search_routes.js

@@ -9,7 +9,10 @@ function searchRoutes (form) {
         data: formData,
         data_type: 'formData',
         success: function (res) {
+            if (!res.html) return;
+            let $parent = $('.routes_search_results')[0]
 
+            $parent.innerHTML = res.html;
         }
     })
 

static/v2/js/twb.js

@@ -0,0 +1,3 @@
+function sleep(ms) {
+    return new Promise(resolve => setTimeout(resolve, ms));
+}

static/v2/js/widgets/w_route_card.js

@@ -114,4 +114,15 @@ function highlightRoute(el) {
     });
 
     request.ajaxRequest()
+}
+
+function respondBtnClickEvent(el) {
+    if (!el) return;
+    let $parent = el.closest(".route_card_owner_info")
+    let $responde_cont = $parent.querySelector(".respond_route_cont")
+
+    $(el).fadeOut(500);
+    sleep(500).then(() => {
+        $($responde_cont).fadeIn(500);
+    })
 }

templates/v2/blocks/b_my_routes.html

@@ -3,6 +3,6 @@
 
 <div class="b_my_routes">
     {% for route in routes %}
-        {% include 'v2/widgets/w_customer_route_card.html' with route=route %}
+        {% include 'v2/widgets/w_route_card.html' with route=route %}
     {% endfor %}
 </div>

templates/v2/blocks/b_search_routes_result.html

@@ -0,0 +1,6 @@
+{% load static %}
+{% load i18n %}
+
+{% for route in routes %}
+    {% include "v2/widgets/w_route_card_for_search.html" %}
+{% endfor %}

templates/v2/content_widgets/w_route_card/route_card_actions_container.html

@@ -0,0 +1,39 @@
+{% load static %}
+{% load i18n %}
+
+<div class="route_card_actions_container">
+    <div class="delete_route" onclick="deleteRoute(this)">{% trans "Удалить" %}</div>
+    <div class="right_part_action_btns">
+        <div class="route_btn" data-actions_count="{{ remains_route_rising_count }}" data-action="raise" onclick="raiseRoute(this)">
+            <div class="route_btn_title">{% trans "Поднять" %}</div>
+            <div class="route_btn_data">Осталось поднятий: {{ remains_route_rising_count }}</div>
+        </div>
+        <div class="route_btn" data-actions_count="{{ remains_route_highlight_count }}" data-action="highlight" onclick="highlightRoute(this)">
+            <div class="route_btn_title">{% trans "Выделить цветом" %}</div>
+            <div class="route_btn_data">Осталось выделений: {{ remains_route_highlight_count }}</div>
+        </div>
+        <div class="route_btn solid" data-action="change" onclick="changeRoute(this)">
+            <div class="route_btn_title">{% trans "Редактировать" %}</div>
+        </div>
+    </div>
+</div>
+<div class="route_btn phone mobile inactive" style="--route-btn-width: auto;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;--route-btn-margin: 20.5px 0 0 0;">
+    <img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
+    <div class="route_btn_title big">{{ route.phone }}</div>
+</div>
+<div class="route_card_actions_container mobile">
+    <div class="route_btn solid" style="--route-btn-width: auto;" data-action="change" onclick="changeRoute(this)">
+        <div class="route_btn_title">{% trans "Редактировать" %}</div>
+    </div>
+    <div class="container_actions_mobile">
+        <div class="route_btn" data-actions_count="{{ remains_route_rising_count }}" style="--route-btn-height: fit-content;--route-btn-width: auto;" data-action="raise" onclick="raiseRoute(this)">
+            <div class="route_btn_title">{% trans "Поднять" %}</div>
+            <div class="route_btn_data">Осталось поднятий: {{ remains_route_rising_count }}</div>
+        </div>
+        <div class="route_btn" data-actions_count="{{ remains_route_highlight_count }}" style="--route-btn-height: fit-content;--route-btn-width: auto;" data-action="highlight" onclick="highlightRoute(this)">
+            <div class="route_btn_title">{% trans "Выделить цветом" %}</div>
+            <div class="route_btn_data">Осталось выделений: {{ remains_route_highlight_count }}</div>
+        </div>
+    </div>
+    <div class="delete_route" onclick="deleteRoute(this)">{% trans "Удалить" %}</div>
+</div>

templates/v2/content_widgets/w_route_card/route_card_info_data.html

@@ -0,0 +1,50 @@
+{% load static %}
+{% load i18n %}
+
+<div class="route_card_info_data">
+    <img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
+    <img class="route_card_owner_avatar" src="{% if route.owner.user_profile.avatar %}{{ route.owner.user_profile.avatar.url }}{% endif %}">
+    <div class="route_card_owner_info">
+        <div class="route_card_info_left_part">
+            <div class="card_owner_name">{{ route.owner }}</div>
+            <div class="card_splitter"></div>
+            <div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
+            <div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
+        </div>
+        <div class="route_btn phone inactive" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;">
+            <img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
+            <div class="route_btn_title big">{{ route.phone }}</div>
+        </div>
+    </div>
+    <div class="route_card_text_container">
+        {% if route.comment %}
+            {{ route.comment|linebreaksbr }}
+        {% else %}
+            {% trans "Комментарий отсутствует" %}
+        {% endif %}
+    </div>
+    <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
+</div>
+<div class="route_card_info_data mobile">
+    <img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
+    <img class="route_card_owner_avatar" src="{{ route.owner.user_profile.avatar.url }}">
+    <div class="route_card_owner_info">
+        <div class="route_card_info_left_part">
+            <div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
+            <div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
+        </div>
+        <div class="route_btn phone inactive" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;">
+            <img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
+            <div class="route_btn_title big">{{ route.phone }}</div>
+        </div>
+    </div>
+    <div class="card_owner_name">{{ route.owner }}</div>
+    <div class="route_card_text_container">
+        {% if route.comment %}
+            {{ route.comment|linebreaksbr }}
+        {% else %}
+            {% trans "Комментарий отсутствует" %}
+        {% endif %}
+    </div>
+    <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
+</div>

templates/v2/content_widgets/w_route_card/route_card_info_data_for_search.html

@@ -0,0 +1,54 @@
+{% load static %}
+{% load i18n %}
+
+<div class="route_card_info_data">
+    <img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
+    <img class="route_card_owner_avatar" src="{% if route.owner.user_profile.avatar %}{{ route.owner.user_profile.avatar.url }}{% endif %}">
+    <div class="route_card_owner_info">
+        <div class="route_card_info_left_part">
+            <div class="card_owner_name">{{ route.owner }}</div>
+            <div class="card_splitter"></div>
+            <div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
+            <div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
+        </div>
+        <div class="respond_route_cont" style="display: none;">
+            <div class="route_btn phone unhovered" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;">
+                <img src="{% static "v2/icons/widgets/w_route_card/phone.svg" %}" alt="">
+                <div class="route_btn_title big">{{ route.phone|truncatechars:20 }}</div>
+            </div>
+            <div class="chat_btn">
+                <img src="{% static "v2/icons/widgets/w_route_card/chat.png" %}" alt="">
+            </div>
+        </div>
+        <div class="route_btn solid" onclick="respondBtnClickEvent(this)" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 38.5px;">
+            <div class="route_btn_title big">{% trans "Откликнуться" %}</div>
+        </div>
+    </div>
+    <div class="route_card_text_container">
+        {% if route.comment %}
+            {{ route.comment|linebreaksbr }}
+        {% else %}
+            {% trans "Комментарий отсутствует" %}
+        {% endif %}
+    </div>
+    <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
+</div>
+<div class="route_card_info_data mobile">
+    <img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
+    <img class="route_card_owner_avatar" src="{{ route.owner.user_profile.avatar.url }}">
+    <div class="route_card_owner_info">
+        <div class="route_card_info_left_part">
+            <div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
+            <div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
+        </div>
+    </div>
+    <div class="card_owner_name">{{ route.owner }}</div>
+    <div class="route_card_text_container">
+        {% if route.comment %}
+            {{ route.comment|linebreaksbr }}
+        {% else %}
+            {% trans "Комментарий отсутствует" %}
+        {% endif %}
+    </div>
+    <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
+</div>

templates/v2/content_widgets/w_route_card/route_card_route_data.html

@@ -0,0 +1,129 @@
+{% load static %}
+{% load i18n %}
+
+<div class="route_card_route_data">
+    <div class="from_to_place_data">
+        <div class="label departure_from">{% trans "Забрать из:" %}</div>
+        <div class="place">
+            <div class="country">
+                <img src="{{ route.from_city.country.flag.url }}" alt="">
+                <div class="country_code">{{ route.from_city.country.code }}</div>
+            </div>
+            <div class="place_title">
+                {{ route.from_city.name }}/{{ route.from_city.country.name }}
+            </div>
+        </div>
+        {% if route.owner_type == 'mover' %}
+            <div class="route_date_data" style="--route-date-data-justify: left;--route-date-data-margin: 10px 0 0 0;">
+                {% trans "Отправка:" %}
+                <div class="date_data_value">{{ route.departure_DT|date:'d F Y' }}</div>
+            </div>
+        {% endif %}
+    </div>
+    <div class="route_way_data">
+        <div class="route_transport">
+            <div class="route_transport_name">{{ route.get_type_transport_display }}</div>
+            {% if route.type_transport == '' %}
+                <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
+                <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
+            {% elif route.type_transport == 'road' %}
+                <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
+            {% elif route.type_transport == 'avia' %}
+                <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
+            {% endif %}
+        </div>
+        <div class="way_progress_line_container">
+            <div class="way_progress_round"></div>
+            <div class="way_progress_line"></div>
+            <div class="way_progress_arrows_line"></div>
+            <div class="way_progress_round"></div>
+        </div>
+        {% if route.owner_type == 'customer' %}
+            <div class="route_date_data">
+                {% trans "Дата доставки:" %}
+                <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
+            </div>
+        {% endif %}
+    </div>
+    <div class="from_to_place_data">
+        <div class="label arrival_to">{% trans "Доставить в:" %}</div>
+        <div class="place">
+            <div class="country">
+                <img src="{{ route.to_city.country.flag.url }}" alt="">
+                <div class="country_code">{{ route.to_city.country.code }}</div>
+            </div>
+            <div class="place_title">
+                {{ route.to_city.name }}/{{ route.to_city.country.name }}
+            </div>
+        </div>
+        {% if route.owner_type == 'mover' %}
+            <div class="route_date_data" style="--route-date-data-justify: right;--route-date-data-margin: 10px 0 0 0;">
+                {% trans "Прибытие:" %}
+                <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
+            </div>
+        {% endif %}
+    </div>
+</div>
+<div class="route_card_route_data mobile">
+    <div class="way_progress_line_container mobile">
+        <div class="way_progress_round"></div>
+        <div class="way_progress_line"></div>
+        <div class="way_progress_arrows_line"></div>
+        <div class="way_progress_round"></div>
+    </div>
+    <div class="right_part_route_card">
+        <div class="from_to_place_data">
+            <div class="label departure_from">{% trans "Забрать из:" %}</div>
+            <div class="place">
+                <div class="country">
+                    <img src="{{ route.from_city.country.flag.url }}" alt="">
+                    <div class="country_code">{{ route.from_city.country.code }}</div>
+                </div>
+                <div class="place_title">
+                    {{ route.from_city.name }}/{{ route.from_city.country.name }}
+                </div>
+            </div>
+        </div>
+        <div class="route_way_data">
+            <div class="route_transport">
+                <div class="route_transport_name">{{ route.get_type_transport_display }}</div>
+                {% if route.type_transport == '' %}
+                    <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
+                    <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
+                {% elif route.type_transport == 'road' %}
+                    <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
+                {% elif route.type_transport == 'avia' %}
+                    <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
+                {% endif %}
+            </div>
+            <div class="route_date_splitter"></div>
+            {% if route.owner_type == 'customer' %}
+                <div class="route_date_data">
+                    {% trans "Дата доставки:" %}
+                    <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
+                </div>
+            {% else %}
+                <div class="route_date_data">
+                    {% trans "Отправка:" %}
+                    <div class="date_data_value">{{ route.departure_DT|date:'d F Y' }}</div>
+                </div>
+                <div class="route_date_data">
+                    {% trans "Прибытие:" %}
+                    <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
+                </div>
+            {% endif %}
+        </div>
+        <div class="from_to_place_data">
+            <div class="label arrival_to">{% trans "Доставить в:" %}</div>
+            <div class="place">
+                <div class="country">
+                    <img src="{{ route.to_city.country.flag.url }}" alt="">
+                    <div class="country_code">{{ route.to_city.country.code }}</div>
+                </div>
+                <div class="place_title">
+                    {{ route.to_city.name }}/{{ route.to_city.country.name }}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

templates/v2/pages/p_search_route_results.html

@@ -7,10 +7,12 @@
     <link rel="stylesheet" href="{% static "v2/css/widgets/w_select_country.css" %}">
     <link rel="stylesheet" href="{% static "v2/css/widgets/w_datarangepicker.css" %}">
     <link rel="stylesheet" href="{% static "v2/css/pages/p_search_route_results.css" %}">
+    <link rel="stylesheet" href="{% static "v2/css/widgets/w_route_card.css" %}">
     <script src="{% static "v2/js/forms.js" %}"></script>
     <script src="{% static "v2/js/widgets/w_select_country.js" %}"></script>
     <script src="{% static "v2/js/widgets/w_daterangepicker.js" %}"></script>
     <script src="{% static "v2/js/blocks/b_search_routes.js" %}"></script>
+    <script src="{% static "v2/js/widgets/w_route_card.js" %}"></script>
 {% endblock %}
 
 {% block content %}
@@ -18,8 +20,6 @@
     {% include 'v2/blocks/b_search_routes.html' %}
     <div class="routes_content_part">
         {% include "v2/blocks/b_filter_routes.html" %}
-        <div>
-
-        </div>
+        <div class="routes_search_results"></div>
     </div>
 {% endblock %}

templates/v2/widgets/w_customer_route_card.html

@@ -1,214 +0,0 @@
-{% load i18n %}
-{% load static %}
-
-<div class="w_customer_route_card w_route_card" data-route_id="{{ route.id }}" data-owner_type="{{ route.owner_type }}">
-    <div class="route_card_info_data">
-        <img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
-        <img class="route_card_owner_avatar" src="{{ route.owner.user_profile.avatar.url }}">
-        <div class="route_card_owner_info">
-            <div class="route_card_info_left_part">
-                <div class="card_owner_name">{{ route.owner }}</div>
-                <div class="card_splitter"></div>
-                <div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
-                <div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
-            </div>
-            <div class="route_btn phone inactive" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;">
-                <img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
-                <div class="route_btn_title big">{{ route.phone }}</div>
-            </div>
-        </div>
-        <div class="route_card_text_container">
-            {% if route.comment %}
-            	{{ route.comment|linebreaksbr }}
-            {% else %}
-                {% trans "Комментарий отсутствует" %}
-            {% endif %}
-        </div>
-        <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
-    </div>
-    <div class="route_card_info_data mobile">
-        <img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
-        <img class="route_card_owner_avatar" src="{{ route.owner.user_profile.avatar.url }}">
-        <div class="route_card_owner_info">
-            <div class="route_card_info_left_part">
-                <div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
-                <div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
-            </div>
-            <div class="route_btn phone inactive" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;">
-                <img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
-                <div class="route_btn_title big">{{ route.phone }}</div>
-            </div>
-        </div>
-        <div class="card_owner_name">{{ route.owner }}</div>
-        <div class="route_card_text_container">
-            {% if route.comment %}
-            	{{ route.comment|linebreaksbr }}
-            {% else %}
-                {% trans "Комментарий отсутствует" %}
-            {% endif %}
-        </div>
-        <div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
-    </div>
-    <div class="route_card_route_data">
-        <div class="from_to_place_data">
-            <div class="label departure_from">{% trans "Забрать из:" %}</div>
-            <div class="place">
-                <div class="country">
-                    <img src="{{ route.from_city.country.flag.url }}" alt="">
-                    <div class="country_code">{{ route.from_city.country.code }}</div>
-                </div>
-                <div class="place_title">
-                    {{ route.from_city.name }}/{{ route.from_city.country.name }}
-                </div>
-            </div>
-            {% if route.owner_type == 'mover' %}
-                <div class="route_date_data" style="--route-date-data-justify: left;--route-date-data-margin: 10px 0 0 0;">
-                    {% trans "Отправка:" %}
-                    <div class="date_data_value">{{ route.departure_DT|date:'d F Y' }}</div>
-                </div>
-            {% endif %}
-        </div>
-        <div class="route_way_data">
-            <div class="route_transport">
-                <div class="route_transport_name">{{ route.get_type_transport_display }}</div>
-                {% if route.type_transport == '' %}
-                    <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
-                    <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
-                {% elif route.type_transport == 'road' %}
-                    <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
-                {% elif route.type_transport == 'avia' %}
-                    <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
-                {% endif %}
-            </div>
-            <div class="way_progress_line_container">
-                <div class="way_progress_round"></div>
-                <div class="way_progress_line"></div>
-                <div class="way_progress_arrows_line"></div>
-                <div class="way_progress_round"></div>
-            </div>
-            {% if route.owner_type == 'customer' %}
-                <div class="route_date_data">
-                    {% trans "Дата доставки:" %}
-                    <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
-                </div>
-            {% endif %}
-        </div>
-        <div class="from_to_place_data">
-            <div class="label arrival_to">{% trans "Доставить в:" %}</div>
-            <div class="place">
-                <div class="country">
-                    <img src="{{ route.to_city.country.flag.url }}" alt="">
-                    <div class="country_code">{{ route.to_city.country.code }}</div>
-                </div>
-                <div class="place_title">
-                    {{ route.to_city.name }}/{{ route.to_city.country.name }}
-                </div>
-            </div>
-            {% if route.owner_type == 'mover' %}
-                <div class="route_date_data" style="--route-date-data-justify: right;--route-date-data-margin: 10px 0 0 0;">
-                    {% trans "Прибытие:" %}
-                    <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
-                </div>
-            {% endif %}
-        </div>
-    </div>
-    <div class="route_card_route_data mobile">
-        <div class="way_progress_line_container mobile">
-            <div class="way_progress_round"></div>
-            <div class="way_progress_line"></div>
-            <div class="way_progress_arrows_line"></div>
-            <div class="way_progress_round"></div>
-        </div>
-        <div class="right_part_route_card">
-            <div class="from_to_place_data">
-                <div class="label departure_from">{% trans "Забрать из:" %}</div>
-                <div class="place">
-                    <div class="country">
-                        <img src="{{ route.from_city.country.flag.url }}" alt="">
-                        <div class="country_code">{{ route.from_city.country.code }}</div>
-                    </div>
-                    <div class="place_title">
-                        {{ route.from_city.name }}/{{ route.from_city.country.name }}
-                    </div>
-                </div>
-            </div>
-            <div class="route_way_data">
-                <div class="route_transport">
-                    <div class="route_transport_name">{{ route.get_type_transport_display }}</div>
-                    {% if route.type_transport == '' %}
-                        <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
-                        <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
-                    {% elif route.type_transport == 'road' %}
-                        <img src="{% static "v2/icons/widgets/w_route_card/car.svg" %}" alt="">
-                    {% elif route.type_transport == 'avia' %}
-                        <img src="{% static "v2/icons/widgets/w_route_card/plane.svg" %}" alt="">
-                    {% endif %}
-                </div>
-                <div class="route_date_splitter"></div>
-                {% if route.owner_type == 'customer' %}
-                    <div class="route_date_data">
-                        {% trans "Дата доставки:" %}
-                        <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
-                    </div>
-                {% else %}
-                    <div class="route_date_data">
-                        {% trans "Отправка:" %}
-                        <div class="date_data_value">{{ route.departure_DT|date:'d F Y' }}</div>
-                    </div>
-                    <div class="route_date_data">
-                        {% trans "Прибытие:" %}
-                        <div class="date_data_value">{{ route.arrival_DT|date:'d F Y' }}</div>
-                    </div>
-                {% endif %}
-            </div>
-            <div class="from_to_place_data">
-                <div class="label arrival_to">{% trans "Доставить в:" %}</div>
-                <div class="place">
-                    <div class="country">
-                        <img src="{{ route.to_city.country.flag.url }}" alt="">
-                        <div class="country_code">{{ route.to_city.country.code }}</div>
-                    </div>
-                    <div class="place_title">
-                        {{ route.to_city.name }}/{{ route.to_city.country.name }}
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div class="route_card_actions_container">
-        <div class="delete_route" onclick="deleteRoute(this)">{% trans "Удалить" %}</div>
-        <div class="right_part_action_btns">
-            <div class="route_btn" data-actions_count="{{ remains_route_rising_count }}" data-action="raise" onclick="raiseRoute(this)">
-                <div class="route_btn_title">{% trans "Поднять" %}</div>
-                <div class="route_btn_data">Осталось поднятий: {{ remains_route_rising_count }}</div>
-            </div>
-            <div class="route_btn" data-actions_count="{{ remains_route_highlight_count }}" data-action="highlight" onclick="highlightRoute(this)">
-                <div class="route_btn_title">{% trans "Выделить цветом" %}</div>
-                <div class="route_btn_data">Осталось выделений: {{ remains_route_highlight_count }}</div>
-            </div>
-            <div class="route_btn solid" data-action="change" onclick="changeRoute(this)">
-                <div class="route_btn_title">{% trans "Редактировать" %}</div>
-            </div>
-        </div>
-    </div>
-    <div class="route_btn phone mobile inactive" style="--route-btn-width: auto;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;--route-btn-margin: 20.5px 0 0 0;">
-        <img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
-        <div class="route_btn_title big">{{ route.phone }}</div>
-    </div>
-    <div class="route_card_actions_container mobile">
-        <div class="route_btn solid" style="--route-btn-width: auto;" data-action="change" onclick="changeRoute(this)">
-            <div class="route_btn_title">{% trans "Редактировать" %}</div>
-        </div>
-        <div class="container_actions_mobile">
-            <div class="route_btn" data-actions_count="{{ remains_route_rising_count }}" style="--route-btn-height: fit-content;--route-btn-width: auto;" data-action="raise" onclick="raiseRoute(this)">
-                <div class="route_btn_title">{% trans "Поднять" %}</div>
-                <div class="route_btn_data">Осталось поднятий: {{ remains_route_rising_count }}</div>
-            </div>
-            <div class="route_btn" data-actions_count="{{ remains_route_highlight_count }}" style="--route-btn-height: fit-content;--route-btn-width: auto;" data-action="highlight" onclick="highlightRoute(this)">
-                <div class="route_btn_title">{% trans "Выделить цветом" %}</div>
-                <div class="route_btn_data">Осталось выделений: {{ remains_route_highlight_count }}</div>
-            </div>
-        </div>
-        <div class="delete_route" onclick="deleteRoute(this)">{% trans "Удалить" %}</div>
-    </div>
-</div>

templates/v2/widgets/w_route_card.html

@@ -0,0 +1,8 @@
+{% load i18n %}
+{% load static %}
+
+<div class="w_customer_route_card w_route_card" data-route_id="{{ route.id }}" data-owner_type="{{ route.owner_type }}">
+    {% include 'v2/content_widgets/w_route_card/route_card_info_data.html' %}
+    {% include 'v2/content_widgets/w_route_card/route_card_route_data.html' %}
+    {% include 'v2/content_widgets/w_route_card/route_card_actions_container.html' %}
+</div>

templates/v2/widgets/w_route_card_for_search.html

@@ -0,0 +1,8 @@
+{% load i18n %}
+{% load static %}
+
+<div class="w_customer_route_card w_route_card" data-route_id="{{ route.id }}" data-owner_type="{{ route.owner_type }}">
+    {% include 'v2/content_widgets/w_route_card/route_card_info_data_for_search.html' %}
+    {% include 'v2/content_widgets/w_route_card/route_card_route_data.html' %}
+
+</div>