141 lines
5.3 KiB
HTML
141 lines
5.3 KiB
HTML
{% set chatrooms = __SELF__.chatrooms %}
|
|
|
|
<!-- Chat ============================================================ -->
|
|
<section class="chat">
|
|
<div class="auto_container">
|
|
<div class="chat_wrap">
|
|
{% if chatrooms is empty %}
|
|
<div class="empty_area">
|
|
<div class="chat_wall">
|
|
<div class="chat_wall_img">
|
|
<img src="{{ 'assets/images/big_logo.png'|theme }}" alt="logo">
|
|
</div>
|
|
<div class="chat_wall_text">
|
|
{{ 'auth.messages_no'|_ }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="chat_burger">
|
|
<svg viewBox="0 0 32 32" fill="#003197" xmlns="http://www.w3.org/2000/svg">
|
|
<g data-name="menu " id="menu_">
|
|
<path d="M29,6H3A1,1,0,0,0,3,8H29a1,1,0,0,0,0-2Z" />
|
|
<path d="M3,17H16a1,1,0,0,0,0-2H3a1,1,0,0,0,0,2Z" />
|
|
<path d="M25,24H3a1,1,0,0,0,0,2H25a1,1,0,0,0,0-2Z" />
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
<div class="chat_box">
|
|
<div class="chat_people">
|
|
|
|
{% for chatroom in chatrooms %}
|
|
<a href="#" class="person" style="display: block;"
|
|
data-request="onChatroom"
|
|
data-request-data="chatroom_id: {{chatroom.id}}"
|
|
data-request-success="showMessages(data)"
|
|
data-id="{{ chatroom.id}}"
|
|
data-partner-id="{{ chatroom.message_partner.id }}"
|
|
>
|
|
<div class="person_name">
|
|
|
|
{% if chatroom.message_partner.name or chatroom.message_partner.surname %}
|
|
{{chatroom.message_partner.name}} {{chatroom.message_partner.surname}}
|
|
{% else %}
|
|
{{chatroom.message_partner.email}}
|
|
{% endif %}
|
|
|
|
|
|
</div>
|
|
<div class="person_message">
|
|
{{chatroom.last_message.message}}
|
|
</div>
|
|
{% if chatroom.count_unread_messages %}
|
|
<div class="chat_alert">
|
|
{{chatroom.count_unread_messages}}
|
|
</div>
|
|
{% endif %}
|
|
<button type="button" class="delete" onclick="event.stopPropagation(); deleteChat({{ chatroom.id }})">
|
|
<img src="{{ 'assets/images/svg/trash.svg'|theme }}" alt="delete-icon">
|
|
</button>
|
|
</a>
|
|
{% endfor %}
|
|
|
|
</div>
|
|
<div class="chat_area" id="chatroom">
|
|
|
|
<!-- chat_area -->
|
|
|
|
<div class="chat_wall">
|
|
<div class="chat_wall_img">
|
|
<img src="{{'assets/images/big_logo.png'|theme}}" alt="logo">
|
|
</div>
|
|
<div class="chat_wall_text">
|
|
{{'account.choose_chat'|_}}
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Chat end ======================================================== -->
|
|
|
|
<!--Delete modal ========================================================= -->
|
|
<div class="modal" id="delete-modal">
|
|
<div class="modal_inner">
|
|
<form data-request="onDeleteChat">
|
|
<h2 class="modal_title">
|
|
{{ 'auth.messages_modal_question'|_ }}
|
|
</h2>
|
|
<input type="hidden" value="" name="chatroom_id">
|
|
<div class="modal_btn-box">
|
|
<button class="reset-form" type="reset">
|
|
{{ 'auth.modal_no'|_ }}
|
|
</button>
|
|
<button class="accept-form" type="submit">
|
|
{{ 'auth.modal_yes'|_ }}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<!--Delete modal end ===================================================== -->
|
|
|
|
{% put scripts %}
|
|
<script>
|
|
function showMessages(data) {
|
|
|
|
$('#chatroom').html(data.chat_area);
|
|
|
|
var bottom= $('.chat_area-inner').height()+$('.chat_area-inner').prop('scrollHeight');
|
|
$('.chat_area-inner').scrollTop(bottom);
|
|
|
|
$('.unread-messages-count').text('');
|
|
}
|
|
</script>
|
|
<script>
|
|
$(window).on('load', function() {
|
|
var params = window
|
|
.location
|
|
.search
|
|
.replace('?','')
|
|
.split('&')
|
|
.reduce(
|
|
function(p,e){
|
|
var a = e.split('=');
|
|
p[ decodeURIComponent(a[0])] = decodeURIComponent(a[1]);
|
|
return p;
|
|
},
|
|
{}
|
|
);
|
|
|
|
if(params['seller_id']) {
|
|
$('.chat_people').find(`a[data-partner-id="${params['seller_id']}"]`)
|
|
.click()
|
|
}
|
|
})
|
|
</script>
|
|
{% endput %}
|