608 lines
37 KiB
PHP
608 lines
37 KiB
PHP
|
<style>
|
|||
|
|
.chat-cian {
|
|||
|
|
position: fixed;
|
|||
|
|
top: 0;
|
|||
|
|
right: 0;
|
|||
|
|
z-index: 99999;
|
|||
|
|
min-width: 950px;
|
|||
|
|
max-width: 950px;
|
|||
|
|
-webkit-box-shadow: 0px 0px 24px rgba(0,0,0,0.15);
|
|||
|
|
box-shadow: 0px 0px 24px rgba(0,0,0,0.15);
|
|||
|
|
border-radius: 5px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
}
|
|||
|
|
.chat-cian * {
|
|||
|
|
-webkit-box-sizing: border-box;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.chat-block_cian__left_list {
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
min-height: 100%;
|
|||
|
|
/* border-right: 1px solid #DEDEDE;*/
|
|||
|
|
overflow: hidden;
|
|||
|
|
/* width: 0;
|
|||
|
|
min-width: 0;*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.chat-block_cian__left_list {
|
|||
|
|
height: 487px;
|
|||
|
|
overflow-y: auto;
|
|||
|
|
margin-right: 5px;
|
|||
|
|
background-clip: content-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.chat-cian .chat-block__left_item-icon {
|
|||
|
|
overflow:unset;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.chat-cian .chat-block__left_item-icon img {
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
a.message__block_name{
|
|||
|
|
font-weight: 600;
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #73A1FB;
|
|||
|
|
margin-bottom: 5px;
|
|||
|
|
border: none;
|
|||
|
|
background-color: transparent;
|
|||
|
|
|
|||
|
|
cursor: pointer;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.quantity-participant-cian button{
|
|||
|
|
position: relative;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
padding: 3px 15px 6px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.chat-block__top_right-icons .jw__g-button{
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
padding: 3px 15px 6px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*.chat-block_cian__left_list.show {
|
|||
|
|
width: 337px;
|
|||
|
|
min-width: 337px
|
|||
|
|
}*/
|
|||
|
|
</style>
|
|||
|
|
<div id="chat_cian" class="chat-cian hidden" v-show="isShowCian">
|
|||
|
|
<div id="chat-spinner" style="position: absolute;width: 100%;height: 100%;background: white;z-index: 999;opacity: 50%;display: none;">
|
|||
|
|
<div style="display: block;position: absolute;text-align: center;top: 50%;left: calc(50% + 55px);margin-top: -48px;margin-left: -48px;z-index: 10;">
|
|||
|
|
<img src="/images/rocket-spinner.svg" width="96px">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__top">
|
|||
|
|
<div class="chat-block__top_left">
|
|||
|
|
<button class="chat-block__top_left-burger">
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
</button>
|
|||
|
|
<div class="chat-block__top_left-icon">
|
|||
|
|
<img src="/images/chat/chat-icon.png" alt="img" style="display:none">
|
|||
|
|
</div>
|
|||
|
|
<button class="chat-block__top_left-add" style="display:none">
|
|||
|
|
<img src="/images/chat/plus-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<div class="modal-add">
|
|||
|
|
<div class="modal-add__wrapper">
|
|||
|
|
<div class="modal-add__one">
|
|||
|
|
<div class="modal-add__one_input" style="display: none;">
|
|||
|
|
<form action="#">
|
|||
|
|
<input type="text" placeholder="Поиск контакта">
|
|||
|
|
<button class="modal-add__one_input-btn">
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="modal-add__one_btn" id="agencyChatCreate">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/plus-icon-mini.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<span>
|
|||
|
|
Создать чат агентства
|
|||
|
|
</span>
|
|||
|
|
</div>-->
|
|||
|
|
<div class="modal-add__one_btn" id="otherChatCreate">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/plus-icon-mini.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<span>
|
|||
|
|
Создать беседу
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-add__one_list" style="display: none;"></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-add__two">
|
|||
|
|
<form action="#">
|
|||
|
|
<div class="modal-add__two_input">
|
|||
|
|
<input type="text" id="chatGroupName" placeholder="Введите название группы">
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-add__two_list" style="display: none;">
|
|||
|
|
</div>
|
|||
|
|
<button type="button" class="modal-add__two_btn create-agency-channel">
|
|||
|
|
Создать
|
|||
|
|
</button>
|
|||
|
|
<button type="button" class="modal-add__two_btn cancel-add">
|
|||
|
|
Отменить
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__top_right">
|
|||
|
|
<div class="chat-block__top_right-text">
|
|||
|
|
<span class="name-chat-cian">{{ nameGroup }}</span>
|
|||
|
|
<span class="quantity-participant-cian">
|
|||
|
|
<a href="javascript:{}" @click="openObjectCard" class="message__block_name">{{ nameChat }}</a>
|
|||
|
|
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__top_right-icons">
|
|||
|
|
<form class="chat-block__top_right-form" style="display: none;">
|
|||
|
|
<input placeholder="Поиск" type="text" class="search">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
<button class="dots chat-block__top_right-btn dots-modal-show" style="display: none;">
|
|||
|
|
<img src="/images/chat/menu-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<button v-if="!isEmpty(nameChat)" @click="openReqForm" class="jw__g-button">Создать заявку</button>
|
|||
|
|
<button @click="close_cian" class="closed chat-block__top_right-btn">
|
|||
|
|
<img src="/images/chat/close-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<div class="dots-modal">
|
|||
|
|
<button class="dots-modal__btn1">
|
|||
|
|
<span>Данные группы</span>
|
|||
|
|
</button>
|
|||
|
|
<button class="dots-modal__btn2" style="display: none;">
|
|||
|
|
<span>Добавить в группу</span>
|
|||
|
|
</button>
|
|||
|
|
<button class="dots-modal__btn3">
|
|||
|
|
<span>Очистить чат</span>
|
|||
|
|
</button>
|
|||
|
|
<button class="dots-modal__btn4">
|
|||
|
|
<span>Выйти из группы</span>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
<div class="dots-modal__add">
|
|||
|
|
<form action="#">
|
|||
|
|
<!--<div class="dots-modal__add_input">
|
|||
|
|
<input type="text" placeholder="Поиск контакта">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</div>-->
|
|||
|
|
<div class="dots-modal__add_list">
|
|||
|
|
</div>
|
|||
|
|
<button class="dots-modal__add_btn" type="button" onclick="addUsersToChannel(); event.preventDefault(); event.stopPropagation(); return false;">
|
|||
|
|
Добавить
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__wrapper">
|
|||
|
|
<div class="chat-block__left show">
|
|||
|
|
<div class="chat-block__left_wrapper">
|
|||
|
|
<div class="chat-block__left_search" style="display: none;">
|
|||
|
|
<form action="#">
|
|||
|
|
<div class="chat-block__left_search-input">
|
|||
|
|
<input name="search-contact" type="text" placeholder="Поиск контакта">
|
|||
|
|
<button class="chat-block__left_search-icon">
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block_cian__left_list">
|
|||
|
|
<template v-for="(chat, chatId) in chats">
|
|||
|
|
<div @click="open_chat(chatId)" class="chat-block__left_item" :class="{'active': chat.is_active}">
|
|||
|
|
<div class="chat-block__left_item-icon">
|
|||
|
|
<img v-if="chat.offers && chat.offers[0].mainPhoto" :src="chat.offers[0].mainPhoto.miniUrl" alt="img">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="chat-block__left_item-text">
|
|||
|
|
<span class="name ">{{ chat.users[0].name }}</span>
|
|||
|
|
<span class="letter" v-if="chat.offers">{{ chat.offers[0].title }}</span>
|
|||
|
|
<span class="when">{{ chat.chats[0].update_at }}</span>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__left_item-quantity" v-if="chat.new_mes && chat.new_mes > 0">{{ chat.new_mes }}</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__right show">
|
|||
|
|
<div class="chat-block__right_wrapper">
|
|||
|
|
<div class="chat-block__right_field" id="chat-content-cian">
|
|||
|
|
<div v-if="error" style="font-weight: bold;margin: 100px 0;text-align: center;font-size: 20px;">
|
|||
|
|
{{ error_mes }}
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="chat-block__right_field-when">Сегодня</div>-->
|
|||
|
|
|
|||
|
|
<div v-for="mes in listMessage" v-show="!error" class="message">
|
|||
|
|
<div class="message__block">
|
|||
|
|
<button class="message__block_name">{{ mes.userName }}</button>
|
|||
|
|
<span class="message__block_text">{{ mes.content.text }}</span>
|
|||
|
|
<span class="message__block_time">{{ mes.createdAt }}</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__right_bottom">
|
|||
|
|
<div>
|
|||
|
|
<div class="chat-block__right_bottom-textarea">
|
|||
|
|
<button class="attach" style="display: none;">
|
|||
|
|
<img src="/images/chat/paper-clip-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<textarea placeholder="Написать сообщение" v-model="text_mes"></textarea>
|
|||
|
|
<button type="button" class="send" @click="send_mes_cian">
|
|||
|
|
отправить
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="group-data">
|
|||
|
|
<div class="group-data__top">
|
|||
|
|
<table style="width: 100%;">
|
|||
|
|
<tr>
|
|||
|
|
<td style="width: 128px;">
|
|||
|
|
<div class="group-data__top_icon" style="cursor: pointer;">
|
|||
|
|
<img id="chatGroupImage" src="/images/chat/group.png" alt="img">
|
|||
|
|
</div>
|
|||
|
|
</td>
|
|||
|
|
<td>
|
|||
|
|
<div class="group-data__top_text">
|
|||
|
|
<div class="group-data__top_text-name">
|
|||
|
|
<span class="name" id="chatExtInfoName">
|
|||
|
|
Название группы
|
|||
|
|
</span>
|
|||
|
|
<div class="rename-input">
|
|||
|
|
<form action="#">
|
|||
|
|
<input type="text" id="chatGroupNameInput" placeholder="Название группы">
|
|||
|
|
<button class="rename-input__btn" onclick="renameChatGroup(); return false;">
|
|||
|
|
<img src="/images/chat/check-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__top_text-create" id="chatExtInfoDate">
|
|||
|
|
Создана 12.06.2021 15:34
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__top_text-add" style="display: none;">
|
|||
|
|
<button class="add">
|
|||
|
|
<span>
|
|||
|
|
<img src="/images/chat/plus-icon-mini.svg" alt="img">
|
|||
|
|
</span>
|
|||
|
|
<span>Добавить участника</span>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</td>
|
|||
|
|
<td style="width: 25px;">
|
|||
|
|
<button class="group-data__top_rename">
|
|||
|
|
<img src="/images/chat/rename-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</td>
|
|||
|
|
<td style="width: 25px;vertical-align: top;">
|
|||
|
|
<button class="group-data__top_close">
|
|||
|
|
<img src="/images/chat/close-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr id="changeGroupAvatarBlock" style="display: none;">
|
|||
|
|
<td colspan="4" style="padding-top: 10px;">
|
|||
|
|
<input type="text" class="chat-group-avatar-input" id="chatGroupAvatarInput" placeholder="Ссылка на аватар группы">
|
|||
|
|
<button class="change-avatar-input__btn" onclick="changeAvatarForGroup(); return false;">
|
|||
|
|
<img src="/images/chat/check-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</td>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__center">
|
|||
|
|
<div class="group-data__center_title">
|
|||
|
|
Участники группы
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__center_list">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__bottom">
|
|||
|
|
<button class="group-data__bottom_btn" onclick="if (confirm('Удалить беседу безвозвратно?')) {deleteGroup(); return false;}">
|
|||
|
|
<img src="/images/chat/remove-icon_big.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<div class="group-data__bottom_text">
|
|||
|
|
Удалить группу
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>-->
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div id="chat_avito" class="chat-cian hidden" v-show="isShowAvito">
|
|||
|
|
<div id="chat-spinner" style="position: absolute;width: 100%;height: 100%;background: white;z-index: 999;opacity: 50%;display: none;">
|
|||
|
|
<div style="display: block;position: absolute;text-align: center;top: 50%;left: calc(50% + 55px);margin-top: -48px;margin-left: -48px;z-index: 10;">
|
|||
|
|
<img src="/images/rocket-spinner.svg" width="96px">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__top">
|
|||
|
|
<div class="chat-block__top_left">
|
|||
|
|
<button class="chat-block__top_left-burger">
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
<span></span>
|
|||
|
|
</button>
|
|||
|
|
<div class="chat-block__top_left-icon">
|
|||
|
|
<img src="/images/chat/chat-icon.png" alt="img" style="display:none">
|
|||
|
|
</div>
|
|||
|
|
<button class="chat-block__top_left-add" style="display:none">
|
|||
|
|
<img src="/images/chat/plus-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<div class="modal-add">
|
|||
|
|
<div class="modal-add__wrapper">
|
|||
|
|
<div class="modal-add__one">
|
|||
|
|
<div class="modal-add__one_input" style="display: none;">
|
|||
|
|
<form action="#">
|
|||
|
|
<input type="text" placeholder="Поиск контакта">
|
|||
|
|
<button class="modal-add__one_input-btn">
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="modal-add__one_btn" id="agencyChatCreate">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/plus-icon-mini.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<span>
|
|||
|
|
Создать чат агентства
|
|||
|
|
</span>
|
|||
|
|
</div>-->
|
|||
|
|
<!--<div class="modal-add__one_btn" id="otherChatCreate">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/plus-icon-mini.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<span>
|
|||
|
|
Создать беседу
|
|||
|
|
</span>
|
|||
|
|
</div>-->
|
|||
|
|
<div class="modal-add__one_list" style="display: none;"></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-add__two">
|
|||
|
|
<form action="#">
|
|||
|
|
<div class="modal-add__two_input">
|
|||
|
|
<input type="text" placeholder="Введите название группы">
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-add__two_list" style="display: none;">
|
|||
|
|
</div>
|
|||
|
|
<button type="button" class="modal-add__two_btn create-agency-channel">
|
|||
|
|
Создать
|
|||
|
|
</button>
|
|||
|
|
<button type="button" class="modal-add__two_btn cancel-add">
|
|||
|
|
Отменить
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__top_right">
|
|||
|
|
<div class="chat-block__top_right-text">
|
|||
|
|
<span class="name-chat-cian">{{ nameGroup }}</span>
|
|||
|
|
<span class="quantity-participant-cian">
|
|||
|
|
<a href="javascript:{}" @click="openObjectCard" class="message__block_name">{{ nameChat }}</a>
|
|||
|
|
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__top_right-icons">
|
|||
|
|
<form class="chat-block__top_right-form" style="display: none;">
|
|||
|
|
<input placeholder="Поиск" type="text" class="search">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
<button class="dots chat-block__top_right-btn dots-modal-show" style="display: none;">
|
|||
|
|
<img src="/images/chat/menu-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<button v-if="!isEmpty(nameChat)" @click="openReqForm" class="jw__g-button">Создать заявку</button>
|
|||
|
|
<button @click="close_avito" class="closed chat-block__top_right-btn">
|
|||
|
|
<img src="/images/chat/close-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<div class="dots-modal">
|
|||
|
|
<button class="dots-modal__btn1">
|
|||
|
|
<span>Данные группы</span>
|
|||
|
|
</button>
|
|||
|
|
<button class="dots-modal__btn2" style="display: none;">
|
|||
|
|
<span>Добавить в группу</span>
|
|||
|
|
</button>
|
|||
|
|
<button class="dots-modal__btn3">
|
|||
|
|
<span>Очистить чат</span>
|
|||
|
|
</button>
|
|||
|
|
<button class="dots-modal__btn4">
|
|||
|
|
<span>Выйти из группы</span>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
<div class="dots-modal__add">
|
|||
|
|
<form action="#">
|
|||
|
|
<!--<div class="dots-modal__add_input">
|
|||
|
|
<input type="text" placeholder="Поиск контакта">
|
|||
|
|
<button>
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</div>-->
|
|||
|
|
<div class="dots-modal__add_list">
|
|||
|
|
</div>
|
|||
|
|
<button class="dots-modal__add_btn" type="button" onclick="addUsersToChannel(); event.preventDefault(); event.stopPropagation(); return false;">
|
|||
|
|
Добавить
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__wrapper">
|
|||
|
|
<div class="chat-block__left show">
|
|||
|
|
<div class="chat-block__left_wrapper">
|
|||
|
|
<div class="chat-block__left_search" style="display: none;">
|
|||
|
|
<form action="#">
|
|||
|
|
<div class="chat-block__left_search-input">
|
|||
|
|
<input name="search-contact" type="text" placeholder="Поиск контакта">
|
|||
|
|
<button class="chat-block__left_search-icon">
|
|||
|
|
<img src="/images/chat/search-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block_cian__left_list">
|
|||
|
|
<template v-for="(chat, chatId) in chats">
|
|||
|
|
<div @click="open_chat(chatId)" class="chat-block__left_item" :class="{'active': chat.is_active}">
|
|||
|
|
<div class="chat-block__left_item-icon">
|
|||
|
|
<img style="height:45px;" v-if="chat.details.context.value.images.main.img" :src="chat.details.context.value.images.main.img" alt="img">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="chat-block__left_item-text">
|
|||
|
|
<span class="name ">{{ chat.details.users[0].name }}</span>
|
|||
|
|
<span class="letter">{{ chat.details.context.value.title }}</span>
|
|||
|
|
<span class="when">{{ chat.update }}</span>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__left_item-quantity" v-if="chat.new_mess && chat.new_mess > 0">{{ chat.new_mess }}</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__right show">
|
|||
|
|
<div class="chat-block__right_wrapper">
|
|||
|
|
<div class="chat-block__right_field" id="chat-content-avito">
|
|||
|
|
<div v-if="error" style="font-weight: bold;margin: 100px 0;text-align: center;font-size: 20px;">
|
|||
|
|
{{ error_mes }}
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="chat-block__right_field-when">Сегодня</div>-->
|
|||
|
|
|
|||
|
|
<div v-for="mes in listMessage" v-show="!error" class="message">
|
|||
|
|
<div class="message__block">
|
|||
|
|
<button class="message__block_name">{{ mes.userName }}</button>
|
|||
|
|
<span class="message__block_text">{{ mes.details.payload.value.content.text }}</span>
|
|||
|
|
<span class="message__block_time">{{ mes.create }}</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="chat-block__right_bottom">
|
|||
|
|
<div>
|
|||
|
|
<div class="chat-block__right_bottom-textarea">
|
|||
|
|
<button class="attach" style="display: none;">
|
|||
|
|
<img src="/images/chat/paper-clip-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<textarea placeholder="Написать сообщение" v-model="text_mes"></textarea>
|
|||
|
|
<button type="button" class="send" @click="send_mes_cian">
|
|||
|
|
отправить
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="group-data">
|
|||
|
|
<div class="group-data__top">
|
|||
|
|
<table style="width: 100%;">
|
|||
|
|
<tr>
|
|||
|
|
<td style="width: 128px;">
|
|||
|
|
<div class="group-data__top_icon" style="cursor: pointer;">
|
|||
|
|
<img id="chatGroupImage" src="/images/chat/group.png" alt="img">
|
|||
|
|
</div>
|
|||
|
|
</td>
|
|||
|
|
<td>
|
|||
|
|
<div class="group-data__top_text">
|
|||
|
|
<div class="group-data__top_text-name">
|
|||
|
|
<span class="name" id="chatExtInfoName">
|
|||
|
|
Название группы
|
|||
|
|
</span>
|
|||
|
|
<div class="rename-input">
|
|||
|
|
<form action="#">
|
|||
|
|
<input type="text" id="chatGroupNameInput" placeholder="Название группы">
|
|||
|
|
<button class="rename-input__btn" onclick="renameChatGroup(); return false;">
|
|||
|
|
<img src="/images/chat/check-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</form>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__top_text-create" id="chatExtInfoDate">
|
|||
|
|
Создана 12.06.2021 15:34
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__top_text-add" style="display: none;">
|
|||
|
|
<button class="add">
|
|||
|
|
<span>
|
|||
|
|
<img src="/images/chat/plus-icon-mini.svg" alt="img">
|
|||
|
|
</span>
|
|||
|
|
<span>Добавить участника</span>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</td>
|
|||
|
|
<td style="width: 25px;">
|
|||
|
|
<button class="group-data__top_rename">
|
|||
|
|
<img src="/images/chat/rename-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</td>
|
|||
|
|
<td style="width: 25px;vertical-align: top;">
|
|||
|
|
<button class="group-data__top_close">
|
|||
|
|
<img src="/images/chat/close-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr id="changeGroupAvatarBlock" style="display: none;">
|
|||
|
|
<td colspan="4" style="padding-top: 10px;">
|
|||
|
|
<input type="text" class="chat-group-avatar-input" id="chatGroupAvatarInput" placeholder="Ссылка на аватар группы">
|
|||
|
|
<button class="change-avatar-input__btn" onclick="changeAvatarForGroup(); return false;">
|
|||
|
|
<img src="/images/chat/check-icon.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
</td>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__center">
|
|||
|
|
<div class="group-data__center_title">
|
|||
|
|
Участники группы
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__center_list">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="group-data__bottom">
|
|||
|
|
<button class="group-data__bottom_btn" onclick="if (confirm('Удалить беседу безвозвратно?')) {deleteGroup(); return false;}">
|
|||
|
|
<img src="/images/chat/remove-icon_big.svg" alt="img">
|
|||
|
|
</button>
|
|||
|
|
<div class="group-data__bottom_text">
|
|||
|
|
Удалить группу
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>-->
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div id="error_message_chats" class="hidden">
|
|||
|
|
<div v-show="is_show" class="f__modal-bg" style="z-index: 99999;">
|
|||
|
|
<div v-show="is_show" class="f__modal full-modal" style="padding-bottom: 20px; width:560px">
|
|||
|
|
<span class="pseudo-link closer" @click="close"><i class="ti-close"></i></span>
|
|||
|
|
<h3>Ошибка!</h3>
|
|||
|
|
<div style="font-size: 18px; padding-bottom: 15px;">
|
|||
|
|
|
|||
|
|
Cообщения не настроены!
|
|||
|
|
</div>
|
|||
|
|
<div class="video-frame" style="font-size:18px; padding-bottom: 15px;">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<script type="text/javascript" src="/js/vue_scripts/chat_cian_avito_vue.js?<?=filemtime($_SERVER['DOCUMENT_ROOT'].'/js/vue_scripts/chat_cian_avito_vue.js')?>"></script>
|