mitri4
/
proekton.com
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 Commits
1 Branch
0 Tags
51 MiB
 
 
 
 
 
 
Tag: Branch: Tree: 8e14a97885
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '8e14a97885'
${ noResults }
proekton.com/chat/templates/chat_contractor.html

475 lines
16 KiB
Raw Blame History

{% extends 'partials/base.html' %}
{% load staticfiles %}
{% block content %}
{% include 'partials/header.html' %}
<div class="container mainScore">
<div class="row">
<div class="col-lg-12 allProjects">
<h1>Чат</h1>
</div>
<div class="btnReadyBlock disTab">
<div class="triangle1"></div>
<div class="col-lg-6 col-lg-offset-3 tabsChat">
<div class="profileTabs2">
<ul class="nav nav-tabs nav-justified">
<li role="presentation" class="active">
<a href="#tab1" data-toggle="tab">Личные</a>
</li>
<li role="presentation">
<a href="#tab2" data-toggle="tab">Заказчики</a>
</li>
<li role="presentation">
<a href="#tab3" data-toggle="tab">Исполнители</a>
</li>
</ul>
</div>
</div>
</div>
<div class="tab-content">
<div class="chatBlock disTab tab-pane fade in active" id="tab1">
<div class="col-lg-3 wrMessages">
<div class="messageBlock box-sizing disTab">
<p>Контакты</p>
{% for contact in contractor_contacts %}
<div class="message messd">
<div class="imgMess">
<img src="{% static 'img/mess.png' %}" alt="mess-image">
</div>
<p class="nameMess">
<a href="#">{{ contact.recipent_id__first_name }} {{ contact.recipent_id__last_name }}</a>
</p>
<a href="javascript:void(0)" class="conMess">Контакты</a>
<span>0</span>
<a href="javascript:void(0)" class="deleteMess">
Удалить контакт
</a>
</div>
{% endfor %}
</div>
</div>
<div class="col-lg-6 commChat">
<div class="col-lg-12 insetCommChat">
<div class="topCommChat">
<p class="nameCommChat">
Иванов Петр Иванович
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo.
</p>
</div>
<div class="col-lg-12 insetCommChat youChat">
<div class="topCommChat">
<p class="nameCommChat greenNCC">
Вы
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo.
</p>
</div>
<textarea id="chat" class="box-sizing"></textarea>
<div class="bunChat">
<div class="setChat box-sizing">
<p>Прикрепить файл</p>
<span>
Не более 10 файлов с общим объемом 500мб
</span>
</div>
<a href="javascript:void(0)">отправить</a>
</div>
</div>
<div class="col-lg-3 wrChat1">
<div class="messageBlock box-sizing disTab">
<p>Контакты</p>
<div class="message">
<div class="imgMess">
<img src="img/mess.png" alt="mess-image">
</div>
<p class="nameMess">
<a href="#">Иванов Петр Иванович</a>
</p>
<a href="javascript:void(0)" class="conMess">Контакты</a>
</div>
</div>
<div class="col-lg-12 startChat">
<div class="insetSC1">
Начало:
<span>Срок сдачи:</span>
</div>
<div class="insetSC2">
13.0.2016
<span>13.0.2016</span>
</div>
</div>
<div class="col-lg-12 documentsChat">
<p>Входящие документы</p>
<ul>
<li>
Архитерурное 2.jpg
<span>7мб</span>
<div></div>
</li>
<li>
Архитерурное 2.jpg
<span>7мб</span>
<div></div>
</li>
<li>
Архитерурное 2.jpg
<span>7мб</span>
<div></div>
</li>
</ul>
<a href="javascript:void(0)">
Распечатать с помощью ресурса
</a>
</div>
<div class="textAreaBlock2 box-sizing disTab">
<p>Для заметок</p>
<textarea id="chat2"></textarea>
<a href="javascript:void()">сохранить</a>
</div>
<div class="closeChat closeChat1">
<a href="javascript:void(0)">
Закрыть проект<br>и оставить отзыв
</a>
</div>
<div class="closeChat closeChat2">
<a href="javascript:void(0)">
Закрыть проект<br>и оставить отзыв
</a>
</div>
</div>
</div>
<div class="chatBlock disTab tab-pane fade" id="tab2">
<div class="col-lg-3 wrMessages">
<div class="messageBlock box-sizing disTab">
<p>Заказы</p>
{% for order in orders %}
<div class="orderBlock box-sizing order-block" data-id="{{ order.id }}">
<span class="dimovChat"></span>
<p class="titleOB">
{{ order }}
</p>
<div class="hideOBB">
<p class="pOB">
<span>Испонитель:</span> {{ request.user.get_full_name }}
</p>
{# <ul class="listChat1">#}
{# <li>Иванов Петр Иванович</li>#}
{# <li>Сергей Пенкин</li>#}
{# <li>Александ Смирнов</li>#}
{# <li>Иванов Петр</li>#}
{# </ul>#}
<p class="pOB">
<span>Чаты:</span> Иванов, Петров, Пенкин
</p>
<a href="javascript:void(0)" class="linkChat11">
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
Полное описание заказа
</a>
</div>
</div>
{% endfor%}
</div>
</div>
<div class="col-lg-6 commChat">
{% for msg in chat_messages %}
<div class="col-lg-12 insetCommChat {% if msg.sender.pk == request.user.pk %}youChat{% endif %}">
<div class="topCommChat">
<p class="nameCommChat {% if msg.sender.pk == request.user.pk %}greenNCC{% endif %}">{{ msg.sender.get_full_name }}</p>
<span>{{ msg.created }}</span>
</div>
<p class="textCommChat">{{ msg }}</p>
</div>
{% endfor %}
<textarea id="chat" class="box-sizing"></textarea>
<div class="bunChat">
<div class="setChat box-sizing">
<p>Прикрепить файл</p>
<span>
Не более 10 файлов с общим объемом 500мб
</span>
</div>
<a href="javascript:void(0)">отправить</a>
</div>
</div>
<div class="col-lg-3 wrTAB">
<div class="textAreaBlock2 box-sizing disTab">
<p>Для заметок</p>
<textarea id="chat2" ></textarea>
<a href="javascript:void()">сохранить</a>
</div>
<div class="linkChatB box-sizing disTab">
<a href="javascript:void(0)">предложить проект</a>
</div>
</div>
</div>
<div class="chatBlock disTab tab-pane fade" id="tab3">
<div class="col-lg-3 wrMessages">
<div class="messageBlock box-sizing disTab">
<p>Заказы</p>
<div class="orderBlock box-sizing orAct">
<span class="dimovChat"></span>
<p class="titleOB">
Дизай-проект квартиры на набережной 200 m2
</p>
<div class="hideOBB disTab">
<p class="pOB">
<span>Заказчик:</span> Группа Икс
</p>
<ul class="listChat1">
<li>Иванов Петр Иванович</li>
<li>Сергей Пенкин</li>
</ul>
<a href="javascript:void(0)" class="linkChat11">
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
Полное описание заказа
</a>
</div>
</div>
<div class="orderBlock box-sizing">
<span class="dimovChat"></span>
<p class="titleOB">
Дизай-проект квартиры на набережной 200 m2
</p>
<div class="hideOBB disTab">
<p class="pOB">
<span>Заказчик:</span> Группа Икс
</p>
<ul class="listChat1">
<li>Иванов Петр Иванович</li>
<li>Сергей Пенкин</li>
</ul>
<a href="javascript:void(0)" class="linkChat11">
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
Полное описание заказа
</a>
</div>
</div>
<div class="orderBlock box-sizing">
<span class="dimovChat"></span>
<p class="titleOB">
Дизай-проект квартиры на набережной 200 m2
</p>
<div class="hideOBB disTab">
<p class="pOB">
<span>Заказчик:</span> Группа Икс
</p>
<ul class="listChat1">
<li>Иванов Петр Иванович</li>
<li>Сергей Пенкин</li>
</ul>
<a href="javascript:void(0)" class="linkChat11">
<span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
Полное описание заказа
</a>
</div>
</div>
</div>
</div>
<div class="col-lg-6 commChat">
<div class="col-lg-12 insetCommChat">
<div class="topCommChat">
<p class="nameCommChat">
Иванов Петр Иванович
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>
</div>
<div class="col-lg-12 insetCommChat youChat">
<div class="topCommChat">
<p class="nameCommChat greenNCC">
Вы
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
<div class="col-lg-12 insetCommChat">
<div class="topCommChat">
<p class="nameCommChat">
Иванов Петр Иванович
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo.
</p>
</div>
<div class="col-lg-12 insetCommChat youChat">
<div class="topCommChat">
<p class="nameCommChat greenNCC">
Вы
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo.
</p>
</div>
<div class="col-lg-12 insetCommChat youChat">
<div class="topCommChat">
<p class="nameCommChat greenNCC">
Вы
</p>
<span>
13.0.2016 / 21:05
</span>
</div>
<p class="textCommChat">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
</div>
<textarea id="chat" class="box-sizing"></textarea>
<div class="bunChat">
<div class="setChat box-sizing">
<p>Прикрепить файл</p>
<span>
Не более 10 файлов с общим объемом 500мб
</span>
</div>
<a href="javascript:void(0)">отправить</a>
</div>
</div>
<div class="col-lg-3 wrstepschat">
<p>Этапы работы</p>
<div class="stepssBlock box-sizing disTab">
<p class="titleStepss">1 / Согласование условий</p>
<p class="textStepss">
Обсуджение задания и условий выполнения работы. Подтверждение заказа исполнителем.
</p>
</div>
<div class="numberStepp box-sizing">
<div class="insetNumStepp">
<p class="titleNumStepp">
<span>Этап 1</span>Название этапа
</p>
<p class="textNumStepp">
Результаты этапа: Готовый чертеж 1
</p>
<div>
<p>до 16.03.2015</p>
<span>30 000 <i class="fa fa-rub"></i></span>
</div>
</div>
</div>
<div class="numberStepp box-sizing">
<div class="insetNumStepp">
<p class="titleNumStepp">
<span>Этап 2</span>Название этапа
</p>
<p class="textNumStepp">
Результаты этапа: Готовый чертеж 1
</p>
<div>
<p>до 16.03.2015</p>
<span>30 000 <i class="fa fa-rub"></i></span>
</div>
</div>
</div>
<div class="textAreaBlock2 FFD box-sizing disTab">
<a href="javascript:void()">согласовать</a>
</div>
<div class="stepssBlock box-sizing disTab">
<p class="titleStepss">2 / Резервирование</p>
<p class="textStepss">
Резервирование заказчиком суммы оплаты по заказ. Деньги перечисляются и хранятся на сайте.
</p>
<ul>
<li>Сумма еще не зарезервирована</li>
<li>Сумма за этап1, Зарезервирована</li>
</ul>
</div>
<div class="stepssBlock box-sizing disTab">
<p class="titleStepss">3 / Выполнение работы</p>
<p class="textStepss">
Процесс выполнения задания в заказе до получения заказчиком итогового результата работы.
</p>
</div>
</div>
</div>
</div>
{% include 'partials/footer.html' %}
</div>
</div>
{% endblock %}
{% block js_block %}
<script type="text/javascript">
$(function(){
var socket = new SocketHandler();
var form = document.getElementById('message_form');
$('.order-block').on('click',function(){
var orderId = $(this).attr('data-id');
});
});
window.onload = function(){
{# form.onsubmit = function(e){#}
{# e.preventDefault();#}
{# console.log('submit click');#}
{# socket.send_message(form);#}
{# }#}
};
var SocketHandler = function(){
var url = 'ws://127.0.0.1:8888/chat';
var sock = new WebSocket(url);
var intervalId;
sock.onopen = function(){
console.log("Start connect");
intervalId = setInterval(function(){sock.send('{"dummy": 1}');}, 150000);
};
sock.onmessage = function(event){
console.log(event.data);
message = JSON.parse(event.data);
var inbox = document.getElementById('message_chat');
inbox.innerHTML += '<h2>' + message.msg + '</h2>';
};
this.send_message = function(form){
var elements = form.elements;
var data = {};
var i=0;
for(var i; i< elements.length; i++){
if (elements[i].name == 'message') {
data[elements[i].name] = elements[i].value;
}
}
sock.send(JSON.stringify(data));
var textareaMessage = document.getElementById("message");
textareaMessage.value = "";
}
}
</script>
{% endblock %}