This commit is contained in:
2023-08-06 12:37:43 +03:00
parent 3e342e6d19
commit cf627fdb7a
7 changed files with 302 additions and 17 deletions

View File

@@ -30,6 +30,7 @@
clear: both;
}
/**/
.title-profile-cont{
@@ -695,12 +696,13 @@
box-shadow: -1px 4px 10px 0 rgba(198, 199, 203, 0.20), 0 -1px 10px 0 rgba(198, 199, 203, 0.20);
margin-bottom: 20px;
border-radius: 10px;
padding: 20px;
/*padding: 20px;*/
}
.left-part-carrier-card{
width: 70%;
width: calc(70% - 20px);
float: left;
padding: 20px;
}
.first-line-card-carrier{
@@ -725,8 +727,211 @@
}
.from-to-country-container-carrier{
width: 90%;
width: calc(100% - 70px);
margin: auto;
background: #F8F8F8;
box-shadow: -1px 4px 10px 0 rgba(198, 199, 203, 0.20), 0 -1px 10px 0 rgba(198, 199, 203, 0.20);
padding-top: 20px;
padding-bottom: 20px;
padding-left: 35px;
padding-right: 35px;
margin-bottom: 20px;
}
.from-to-country-text.left{
color: #272424;
font-size: 16px;
font-weight: 500;
width: 46%;
/*padding-top: 20px;*/
/*padding-bottom: 20px;*/
/*padding-left: 80px;*/
float: left;
text-align: right;
}
.from-to-country-text.right{
color: #272424;
font-size: 16px;
font-weight: 500;
width: 46%;
/*padding-top: 20px;*/
/*padding-bottom: 20px;*/
/*padding-right: 80px;*/
float: right;
text-align: left;
}
.line_inf_about_moving{
width: 100%;
margin-bottom: 20px;
}
.container_inf_about_moving.second{
margin-bottom: 0;
}
.splitter-from-to-country{
border: 1px solid #FF613A;
width: 20px;
display: inline-block;
/*width: 5%;*/
margin-bottom: 4px;
margin-left: 6px;
}
.container_inf_about_moving{
display: block;
width: 100%;
}
.carrier_inf_moving.left{
width: 50%;
float: left;
text-align: left;
}
.carrier_inf_moving.right{
width: 50%;
float: right;
text-align: right;
}
.splliter-left-right-part-carrier-card{
border: 1px solid #E6E6E6;
height: 100%;
display: inline-block;
transform: rotate(180deg) ;
position: relative;
left: 70%;
}
.inf_carrier{
padding-top: 15px;
display: block;
}
.phones_carrier{
text-decoration: none;
color: #000000;
font-size: 16px;
padding-bottom: 10px;
display: block;
}
.phones_carrier_span{
position: relative;
top: 4px;
background: linear-gradient(99deg, #040404 2%, #f5f5f5 16%, #ffffff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
transition: 200ms;
}
.phones_carrier_span.active{
background: unset;
-webkit-background-clip: unset;
-webkit-text-fill-color: unset;
}
.phones_carrier input{
display: none;
}
.email_carrier{
text-decoration: none;
color: #000000;
font-size: 16px;
padding-bottom: 10px;
display: block;
}
.email_carrier_span{
position: relative;
top: 6px;
background: linear-gradient(99deg, #040404 2%, #f5f5f5 16%, #ffffff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
transition: 200ms;
}
.email_carrier_span.active{
background: unset;
-webkit-background-clip: unset;
-webkit-text-fill-color: unset;
}
.email_carrier input{
display: none;
}
.open_inf_carrier{
font-size: 16px;
font-weight: 500;
color: #272424;
border: 2px solid #FF613A;
padding: 8px 16px;
background: #FFFFFF;
transition: 200ms;
border-radius: 10px;
width: 100%;
}
.open_inf_carrier:hover{
background: #FF613A;
color: #FFFFFF;
}
.open_chat_carrier{
display: none;
}
.open_chat_carrier.active{
display: block;
font-size: 16px;
font-weight: 500;
color: #272424;
border: 2px solid #00a420;
padding: 8px 16px;
background: #FFFFFF;
transition: 200ms;
border-radius: 10px;
width: 100%;
margin-bottom: 10px;
}
.open_chat_carrier:hover{
color: #FFFFFF;
background: #00a420;
}
.inf_carrier_container{
width: calc(30% - 61px);
float: right;
padding: 20px;
border-left: 1px solid #E6E6E6;
}
.title_container_inf_carrier{
font-weight: 500;
font-size: 20px;
color: #272424;
padding-bottom: 10px;
}
.name_carrier{
font-size: 16px;
color: #272424;
font-weight: 400;
position: relative;
top: 11px;
left: 4px;
}
.from-to-city-text{
font-size: 14px;
color: #27242499;
padding-top: 10px;
}

5
static/img/svg/email.svg Normal file
View File

@@ -0,0 +1,5 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Icon &#34;Calendar&#34;">
<path id="Vector" d="M4 7H27M4 7V24C4 24.2652 4.10097 24.5196 4.28069 24.7071C4.46041 24.8946 4.70417 25 4.95833 25H26.0417C26.2958 25 26.5396 24.8946 26.7193 24.7071C26.899 24.5196 27 24.2652 27 24V7M4 7L15.5 18L27 7" stroke="#FF613A" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 445 B

View File

@@ -247,3 +247,23 @@ function sendMessageEnter (e,id_ticket,sender,receiver){
//
}
}
function show_inf_carrier (el) {
event.preventDefault()
let form = el.form
let ph_1 = form[0]
let ph_2 = form[1]
let em_2 = form[2]
let btn_open_chat = form[3]
ph_1.parentElement.children[1].classList.toggle("active");
ph_2.parentElement.children[1].classList.toggle("active");
em_2.parentElement.children[1].classList.toggle("active");
if (el.innerHTML === "Скрыть контакт"){
el.innerHTML = "Открыть контакт"
} else{
el.innerHTML = "Скрыть контакт"
}
btn_open_chat.classList.toggle("active")
}

View File

@@ -396,8 +396,8 @@ function getRoute(){
'route_id': id
}
$.ajax({
headers: { "X-CSRFToken": $('input[name=csrfmiddlewaretoken]').val() },
$.ajax({
headers: {"X-CSRFToken": $('input[name=csrfmiddlewaretoken]').val()},
url: '/ru/routes/edit_route/',
type: "POST",
// async: true,
@@ -406,14 +406,14 @@ function getRoute(){
contentType: false,
// enctype: 'json',
data: JSON.stringify(route_obj),
success: function(data){
success: function (data) {
console.log('data received')
// location.href = '/profile'
document.querySelector(".info_profile").innerHTML = data.html;
},
error: function (data, exception){
error: function (data, exception) {
console.log(101)
}

View File

@@ -1,10 +1,31 @@
{% load static %}
<div>
<div>
<div class="container_inf_about_moving">
<div class="line_inf_about_moving">
<div class="carrier_inf_moving left">
<div>Отправка:</div>
<div class="from-to-city-text">{% if route.arrival_DT %}{{ route.arrival_DT }}{% else %}Неизвестно{% endif %}</div>
</div>
<img>
<div class="carrier_inf_moving right">
<div>Прибытие:</div>
<div class="from-to-city-text">{% if route.departure_DT %}{{ route.departure_DT }}{% else %}Неизвестно{% endif %}</div>
</div>
<div class="clear_both"></div>
</div>
<img>
<div>
<div class="line_inf_about_moving second">
<div class="carrier_inf_moving left">
<div>Отправка:</div>
<div class="from-to-city-text">{% if route.from_city %}{{ route.from_city }}{% else %}Неизвестно{% endif %} / {% if route.from_airport %}{{ route.from_airport }}{% else %}Неизвестно{% endif %}</div>
</div>
<img>
<div class="carrier_inf_moving right">
<div>Прибытие:</div>
<div class="from-to-city-text">{% if route.to_city %}{{ route.to_city }}{% else %}Неизвестно{% endif %} / {% if to.from_airport %}{{ route.to_airport }}{% else %}Неизвестно{% endif %}</div>
</div>
<div class="clear_both"></div>
</div>
</div>

View File

@@ -8,6 +8,10 @@
<script src='{% static "js/jquery_v3_6_4.js" %}'> </script>
<script src='{% static "js/user_profile.js" %}'> </script>
<script src='{% static "js/user_profile(boris).js" %}'> </script>
<link rel="stylesheet" href="{% static 'css/styles.css' %}">
<link rel="stylesheet" href="{% static 'css/styles(boris).css' %}">

View File

@@ -8,20 +8,50 @@
<div class="type_transportation_carrier">
{{ route.get_type_transport_display }}
</div>
<div class="clear_both"></div>
</div>
<div class="from-to-country-container-carrier">
<div>
{{ route.get_from_place_display }}
<div class="from-to-country-text left fl-left txt-al-right">
{% if route.from_country %}{{ route.from_country }}{% else %}Неизвестно{% endif %} / {% if route.from_city %}{{ route.from_city }}{% else %}Неизвестно{% endif %}
</div>
<div></div>
<div>
{{ route.get_to_place_display }}
<div class="splitter-from-to-country"></div>
<div class="from-to-country-text right fl-right txt-al-left">
{% if route.to_country %}{{ route.to_country }}{% else %}Неизвестно{% endif %} / {% if route.to_city %}{{ route.to_city }}{% else %}Неизвестно{% endif %}
</div>
</div>
{% include "small_INCLUDES/carrier_card/inf_about_moving.html" %}
</div>
<div>
{# <div class="splliter-left-right-part-carrier-card"></div>#}
<div class="inf_carrier_container">
<div class="title_container_inf_carrier">Контакты отправителия:</div>
<div>
<img src="{% static "/delete_later/Avatar.png" %}">
<span class="name_carrier">Иванов Иван</span>
</div>
<form>
<div class="inf_carrier">
<a class="phones_carrier" href="tel:+ 6 (666) 666-66-66">
<img src="{% static "/img/svg/phone.svg" %}"/>
<span class="phones_carrier_span">+ 6 (666) 666-66-66</span>
<input name="phone_1" value="+6 29 123123123">
</a>
<a class="phones_carrier" href="tel:+ 6 (666) 666-66-66">
<img src="{% static "/img/svg/phone.svg" %}">
<span class="phones_carrier_span">+ 6 (666) 666-66-66</span>
<input name="phone_2" value="+6 29 123123123">
</a>
<a class="email_carrier" href="mailto:ivanship@gmail.com">
<img src="{% static "/img/svg/email.svg" %}">
<span class="email_carrier_span">ivanship@gmail.com</span>
<input name="email_1" value="+6 29 123123123">
</a>
</div>
<button class="open_chat_carrier" onclick="show_inf_carrier(this)">Открыть чат</button>
<button class="open_inf_carrier" onclick="show_inf_carrier(this)">Открыть контакт</button>
</form>
</div>
<div class="clear_both"></div>
</div>