0.0.280 upd confirm_remove button

static/css/mobile_styles.css

@@ -2,7 +2,7 @@
 
 @media (max-width: 1280px){
 
-    button#remove_route{
+    .remove_route{
         width: 100%;
         text-align: center;
     }

static/css/styles.css

@@ -1874,13 +1874,18 @@ button#edit_route {
 }
 
 
-button#remove_route {
+.remove_route {
   height: 44px;
   width: 285px;
   color: rgba(39, 36, 36, 0.60);
 }
+.remove_route.hide{
+    display: none;
+}
+
+
 button.confirm_remove{
-    width: 49.5%;
+    width: 48.5%;
     border: 1px solid #ff0000a8;
     border-radius: 10px;
     color: #ff0000a8;
@@ -1890,6 +1895,7 @@ button.confirm_remove{
     /*padding: 5px 0px 5px 0px;*/
     font-size: 16px;
     height: 44px;
+    display: none;
 }
 
 button.cancel_remove{
@@ -1902,9 +1908,14 @@ button.cancel_remove{
     /*padding: 5px 0px 5px 0px;*/
     font-size: 16px;
     height: 44px;
+    display: none;
 
 }
 
+button.cancel_remove.show, button.confirm_remove.show{
+    display: inline-block;
+}
+
 
 /*Static_pages*/
 #title_static{

static/js/user_profile.js

@@ -146,9 +146,8 @@
 
 
 
-function removeRoute(el) {
-    let data = el.currentTarget.closest('.carrier-card');
-    let remove_item = data.dataset.numberOfRoute
+function removeRoute(el,route_id ) {
+    let remove_item = route_id
     let remove_data = {}
     let name_route = 'route_id'
     remove_data[name_route] = remove_item
@@ -176,7 +175,7 @@ function removeRoute(el) {
             // el.classList.add('selected')
 
             //updating the url without reloading
-            window.history.pushState(null, null, '/ru/profile/page/change_profile/')
+            window.history.pushState(null, null, '/ru/profile/page/my_routes/')
 
             middleWareJS()
         },
@@ -189,46 +188,42 @@ function removeRoute(el) {
 
 }
 
-function cancelRemove() {
-    let parent_cancel_button = document.querySelector('.button_remove_route')
-    let cancel_button = document.querySelector('.cancel_remove')
-    parent_cancel_button.removeChild(cancel_button)
+function cancelRemove(route_id) {
+        let confirm_remove = document.getElementById('confirm_remove_'+ route_id);
+        let cancel_remove = document.getElementById('cancel_remove_'+ route_id);
 
-    let remove_button = document.querySelector('.confirm_remove');
-    remove_button.classList.remove('confirm_remove');
-    remove_button.innerText = 'Удалить';
-    remove_button.setAttribute("id", "remove_route");
+            confirm_remove.classList.remove('show');
+            cancel_remove.classList.remove('show');
 
-    remove_button.removeEventListener('click', removeRoute);
+            let remove_btn = document.getElementById('remove_route_'+route_id);
+            remove_btn.classList.remove('hide');
 
 
+
+    // let parent_cancel_button = document.querySelector('.button_remove_route')
+    // let cancel_button = document.querySelector('.cancel_remove')
+    // parent_cancel_button.removeChild(cancel_button)
+    //
+    // let remove_button = document.querySelector('.confirm_remove');
+    // remove_button.classList.remove('confirm_remove');
+    // remove_button.innerText = 'Удалить';
+    // remove_button.setAttribute("id", "remove_route");
+    //
+    // remove_button.removeEventListener('click', removeRoute);
 }
 
 
-function confirmRemove(el) {
+function confirmRemove(el, route_id) {
 
-    el.setAttribute("id", "select-remove");
-    let btn = document.querySelector("#select-remove");
-
-    if (!btn.classList.contains('confirm_remove')) {
-        btn.classList.add('confirm_remove');
-        btn.innerText = 'Подтвердить удаление';
-        btn.addEventListener('click', removeRoute, { once: true });
-
-        let cancel_button = document.createElement('button');
-        cancel_button.className = "cancel_remove";
-        cancel_button.innerText = "Отменить удаление";
-        cancel_button.addEventListener('click', cancelRemove)
-
-
-        let place = btn.closest(".button_remove_route");
-        place.insertBefore(cancel_button, btn.nextSibling);
-
-        btn.removeAttribute( "select-remove");
+        let confirm_remove = document.getElementById('confirm_remove_'+ route_id);
+        let cancel_remove = document.getElementById('cancel_remove_'+ route_id);
+            confirm_remove.classList.add('show');
+            cancel_remove.classList.add('show');
 
+        let remove_btn = document.getElementById('remove_route_'+route_id);
+        remove_btn.classList.add('hide');
 
     }
-}
 
 function loader_place_ins_boris (el,type=null){
     if (el && !window.location.href.includes("profile")){

templates/widgets/w_route_info.html

@@ -85,12 +85,29 @@
                             {% translate "Редактировать" %}
                     </button>
                 </div>
+
                 <div class="button_remove_route">
                      <button
-                             onclick="confirmRemove(this)"
-                            id="remove_route">
+                             onclick="confirmRemove(this, {{ route.id }})"
+                             class="remove_route"
+                             id="remove_route_{{ route.id }}">
                             {% translate "Удалить" %}
                     </button>
+
+                    <button
+                            onclick="removeRoute(this,{{ route.id }},{once: true})"
+                            class="confirm_remove"
+                            id="confirm_remove_{{ route.id }}">
+                        {% translate "Подтвердить удаление" %}
+                    </button>
+
+                    <button
+                            onclick="cancelRemove({{ route.id }})"
+                            class="cancel_remove"
+                            id="cancel_remove_{{ route.id }}">
+                        {% translate "Отменить удаление" %}
+                    </button>
+
                 </div>
             </div>
             {% if route.owner != user %}