mirror of
https://git.imnavajas.es/jjimenez/safekat.git
synced 2025-07-25 22:52:08 +00:00
717 lines
26 KiB
JavaScript
717 lines
26 KiB
JavaScript
import Ajax from '../components/ajax.js'
|
|
|
|
|
|
|
|
class Chat {
|
|
constructor(domItem) {
|
|
this.domItem = domItem
|
|
this.chatList = this.domItem.find("#chat-list")
|
|
this.chatHistory = this.domItem.find("#chat-conversation")
|
|
this.modelId = this.domItem.data("id")
|
|
this.chatHistoryBody = this.domItem.find(".chat-history-body")
|
|
this.sendBtnMessageDepartment = this.domItem.find("#send-msg-btn-deparment")
|
|
this.sendBtnMessageInternal = this.domItem.find("#send-msg-btn-internal")
|
|
this.chatSidebarLeftUserAbout = this.domItem.find('.chat-sidebar-left-user-about'),
|
|
this.messageInput = this.domItem.find(".message-input")
|
|
this.sideBar = this.domItem.find(".sidebar-body")
|
|
this.chatDeparmentId = undefined
|
|
this.searchInput = this.domItem.find(".chat-search-input")
|
|
this.headers = {}
|
|
|
|
this.chatContactsBody = this.domItem.find('.app-chat-contacts .sidebar-body')
|
|
this.chatContactListItems = [].slice.call(
|
|
document.querySelectorAll('.chat-contact-list-item:not(.chat-contact-list-item-title)')
|
|
)
|
|
}
|
|
init() {
|
|
|
|
if (this.searchInput.length) {
|
|
this.searchInput.on('keyup', () => {
|
|
const searchValue = this.searchInput.val(),
|
|
chatListItem0 = this.domItem.find('.chat-list-item-0'),
|
|
contactListItem0 = this.domItem.find('.contact-list-item-0'),
|
|
searchChatListItems = this.domItem.find('#chat-list li:not(.chat-contact-list-item-title)'),
|
|
searchContactListItems = this.domItem.find('#contact-list li:not(.chat-contact-list-item-title)');
|
|
|
|
// Buscar en chats
|
|
const chatListItemsCount = this._searchChatContacts(searchChatListItems, searchValue);
|
|
// Mostrar u ocultar mensaje de "No se encontraron resultados" en chats
|
|
if (chatListItem0.length) {
|
|
chatListItem0.toggleClass('d-none', chatListItemsCount === 0);
|
|
}
|
|
|
|
// Buscar en contactos
|
|
const contactListItemsCount = this._searchChatContacts(searchContactListItems, searchValue);
|
|
// Mostrar u ocultar mensaje de "No se encontraron resultados" en contactos
|
|
if (contactListItem0.length) {
|
|
contactListItem0.toggleClass('d-none', contactListItemsCount === 0);
|
|
}
|
|
});
|
|
}
|
|
|
|
this.sendBtnMessageDepartment.addClass("d-none")
|
|
this.sendBtnMessageInternal.addClass("d-none")
|
|
if (this.chatContactsBody[0]) {
|
|
this.scrollbarContacts = new PerfectScrollbar(this.chatContactsBody[0], {
|
|
wheelPropagation: false,
|
|
suppressScrollX: true,
|
|
});
|
|
}
|
|
|
|
if (this.chatHistoryBody[0]) {
|
|
this.scrollbarChatHistory = new PerfectScrollbar(this.chatHistoryBody[0], {
|
|
wheelPropagation: false,
|
|
suppressScrollX: true,
|
|
|
|
});
|
|
}
|
|
}
|
|
initGeneral() {
|
|
this.chatType = "general"
|
|
this._handleGetChatList()
|
|
this.sendBtnMessageDepartment.on("click", this._sendMessage.bind(this))
|
|
|
|
|
|
}
|
|
initPresupuesto() {
|
|
this.chatType = "presupuesto"
|
|
this._handleGetChatList()
|
|
this.sendBtnMessageDepartment.on("click", this._sendMessage.bind(this))
|
|
this.messageInput.on("keypress", this._sendMessagePressKey.bind(this))
|
|
|
|
|
|
}
|
|
initPedido() {
|
|
this.chatType = "pedido"
|
|
this._handleGetChatList()
|
|
this.sendBtnMessageDepartment.on("click", this._sendMessage.bind(this))
|
|
this.messageInput.on("keypress", this._sendMessagePressKey.bind(this))
|
|
|
|
}
|
|
initFactura() {
|
|
this.chatType = "factura"
|
|
this._handleGetChatList()
|
|
this.sendBtnMessageDepartment.on("click", this._sendMessage.bind(this))
|
|
this.messageInput.on("keypress", this._sendMessagePressKey.bind(this))
|
|
|
|
}
|
|
initContacts() {
|
|
this.chatType = "internal"
|
|
|
|
}
|
|
|
|
_searchChatContacts(searchListItems, searchValue) {
|
|
let searchListItemsCount = 0;
|
|
searchListItems.each(function () {
|
|
const searchListItemText = $(this).text().toLowerCase();
|
|
const matchesSearch = searchListItemText.indexOf(searchValue) !== -1;
|
|
|
|
$(this).toggleClass('d-flex', matchesSearch);
|
|
$(this).toggleClass('d-none', !matchesSearch);
|
|
|
|
if (matchesSearch) {
|
|
searchListItemsCount++;
|
|
}
|
|
});
|
|
|
|
return searchListItemsCount;
|
|
}
|
|
_setBtnInternal() {
|
|
this.sendBtnMessageInternal.removeClass("d-none")
|
|
this.sendBtnMessageDepartment.addClass("d-none")
|
|
}
|
|
_setBtnDeparment() {
|
|
this.sendBtnMessageDepartment.removeClass("d-none")
|
|
this.sendBtnMessageInternal.addClass("d-none")
|
|
}
|
|
/**============================================
|
|
* PRESUPUESTOS
|
|
*=============================================**/
|
|
_handleGetChatList(event) {
|
|
let ajax = new Ajax(
|
|
"/chat/departments",
|
|
null,
|
|
null,
|
|
this._handleGetChatListSuccess.bind(this),
|
|
this._handleGetChatListError.bind(this),
|
|
|
|
|
|
);
|
|
ajax.get();
|
|
}
|
|
_handleGetChatListSuccess(data) {
|
|
Object.values(data).map(row => {
|
|
this.chatList.append(this._getContact(row))
|
|
this.chatDeparmentId = row.id
|
|
this._getChatTotalMessages(row.name)
|
|
this.chatList.find(`#chat_${row.name}`).on("click", (event) => {
|
|
$(".chat-contact-list-item").removeClass("active")
|
|
$(event.currentTarget).parent().addClass("active")
|
|
this.chatDeparmentId = this.chatList.find(`#chat_${row.name}`).data("id")
|
|
this.domItem.find(".chat-history-header div.chat-contact-info h6").text(row.display)
|
|
this.domItem.find(".chat-history-header div.chat-contact-info small.user-status").text(row.display)
|
|
this._getChatMessage()
|
|
this._getChatTotalMessages(row.name)
|
|
this._getChatDeparmentUsers()
|
|
})
|
|
|
|
})
|
|
this.chatList.find(`#chat__produccion`).trigger("click");
|
|
}
|
|
_handleGetChatListError(error) {
|
|
console.error(error)
|
|
}
|
|
_getChatDeparmentUsers() {
|
|
this.domItem.find("#chat-header-users").empty()
|
|
this.domItem.find("#chat-header-dropdown-users").removeClass("d-none")
|
|
let ajax = new Ajax(
|
|
`/chat/department/${this.chatDeparmentId}/users`,
|
|
null,
|
|
null,
|
|
this._getChatDeparmentUsersSuccess.bind(this),
|
|
this._getChatDeparmentUsersError.bind(this),
|
|
|
|
)
|
|
ajax.get()
|
|
}
|
|
_getChatDeparmentUsersSuccess(deparmentUsers) {
|
|
deparmentUsers.map((user) => {
|
|
this.domItem.find("#chat-header-users").append(
|
|
`
|
|
<li class="chat-contact-list-item p-1">
|
|
<a class="d-flex align-items-center py-1"
|
|
id="chat-contact-list-item-${user.id}">
|
|
<div class="avatar d-block flex-shrink-0">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">
|
|
${user?.first_name?.charAt(0) ?? "?"
|
|
+ user?.last_name?.charAt(0) ?? "?"}</span>
|
|
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">${user?.first_name ?? "" + " " +
|
|
user?.last_name ?? ""}</h6>
|
|
<p class="chat-contact-status text-muted text-truncate mb-0">
|
|
${user.username}
|
|
</p>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
|
|
`
|
|
)
|
|
})
|
|
}
|
|
_getChatDeparmentUsersError(err) { }
|
|
|
|
_getContact(row) {
|
|
let chat = `
|
|
<li class="chat-contact-list-item">
|
|
<a class="d-flex align-items-center" id="chat_${row.name}" data-id="${row.id}">
|
|
<div class="flex-shrink-0 avatar">
|
|
<span class="avatar-initial rounded-circle bg-label-success">${row.display.charAt(0)}</span>
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">${row.display}</h6>
|
|
<p class="chat-contact-status text-muted text-truncate mb-0">
|
|
${row.display}
|
|
</p>
|
|
</div>
|
|
<span class="badge badge-center rounded-pill bg-danger messages-unread-contact">${row.totalMessages ?? 0}</span>
|
|
</a>
|
|
</li>
|
|
`
|
|
return chat
|
|
}
|
|
_getChatTotalMessages(row_name) {
|
|
let ajax = new Ajax(
|
|
`/chat/department/${this.chatType}/${this.chatDeparmentId}/${this.modelId}`,
|
|
null,
|
|
null,
|
|
(data) => {
|
|
this.chatList.find(`#chat_${row_name} .messages-unread-contact`).text(data.count)
|
|
},
|
|
null
|
|
|
|
|
|
);
|
|
ajax.get();
|
|
}
|
|
_getChatDepartmentMessageCount()
|
|
{
|
|
let ajax = new Ajax(
|
|
`/chat/department/count/${this.chatType}/${this.chatDeparmentId}/${this.modelId}`,
|
|
null,
|
|
null,
|
|
this._getChatDepartmentMessageCountSuccess.bind(this),
|
|
this._getChatDepartmentMessageCountError.bind(this),
|
|
|
|
|
|
);
|
|
ajax.get();
|
|
}
|
|
_getChatDepartmentMessageCountSuccess(data){
|
|
this.domItem.find(`chat_${data.name}`).find(".messages-unread-contact").text(data.count)
|
|
}
|
|
_getChatDepartmentMessageCountError(){}
|
|
|
|
_getChatMessage() {
|
|
let ajax = new Ajax(
|
|
`/chat/department/${this.chatType}/${this.chatDeparmentId}/${this.modelId}`,
|
|
null,
|
|
null,
|
|
this._getChatMessageSuccess.bind(this),
|
|
this._getChatMessageError.bind(this),
|
|
|
|
|
|
);
|
|
ajax.get();
|
|
}
|
|
_getChatMessageSuccess(data) {
|
|
this.chatHistory.empty()
|
|
this._setBtnDeparment()
|
|
if (data.messages) {
|
|
data.messages.map((m) => {
|
|
this._addChatMessage(m)
|
|
})
|
|
}
|
|
}
|
|
_getChatMessageError(err) {
|
|
console.log(err)
|
|
|
|
}
|
|
_addChatMessage(chatMessage, pos = "left") {
|
|
let chatItem = `
|
|
<li class="chat-message chat-message-${chatMessage.pos}">
|
|
<div class="d-flex overflow-hidden">
|
|
<div class="chat-message-wrapper flex-grow-1">
|
|
|
|
<div class="chat-message-text">
|
|
<p class="mb-0">${chatMessage?.message}</p>
|
|
</div>
|
|
<div class="text-end text-muted mt-1">
|
|
<div class="text-start text-muted mt-1">
|
|
<i class="ti me-1"></i>
|
|
<small>${chatMessage?.user?.first_name + " " + chatMessage?.user?.last_name}</small>
|
|
</div>
|
|
<i class="ti ti-checks ti-xs me-1 text-success"></i>
|
|
<small>${chatMessage.created_at}</small>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="user-avatar flex-shrink-0 ms-3">
|
|
<div class="avatar avatar-sm">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">${chatMessage?.user?.first_name.charAt(0) + chatMessage?.user?.last_name.charAt(0)}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
`
|
|
this.chatHistory.append(chatItem)
|
|
return chatItem
|
|
}
|
|
_sendMessagePressKey(e) {
|
|
if (e.which == 13) {
|
|
e.preventDefault();
|
|
this._sendMessage()
|
|
}
|
|
|
|
}
|
|
_sendMessage() {
|
|
|
|
let messageText = this.messageInput.val()
|
|
const body = {
|
|
message: messageText,
|
|
chat_department_id: this.chatDeparmentId,
|
|
user: this.userId,
|
|
model_id: this.modelId
|
|
}
|
|
if (messageText) {
|
|
let ajax = new Ajax(
|
|
`/chat/message/${this.chatType}`,
|
|
body,
|
|
null,
|
|
this._sendMessageSuccess.bind(this),
|
|
this._sendMessageError.bind(this),
|
|
|
|
);
|
|
ajax.post();
|
|
}
|
|
}
|
|
_sendMessageSuccess(data) {
|
|
this.messageInput.val("")
|
|
this._getChatMessage(this.chatDeparmentId)
|
|
}
|
|
_sendMessageError(err) {
|
|
console.error(err)
|
|
}
|
|
_handleListContacts() {
|
|
this.sideBar.find("#contact-list").removeClass("d-none")
|
|
this.sendBtnMessageInternal.on("click", this._sendMessageInternal.bind(this))
|
|
this.sendBtnMessageInternal.on("keypress", this._sendMessageInternalPressKey.bind(this))
|
|
let ajax = new Ajax(
|
|
"/chat/contacts",
|
|
null,
|
|
null,
|
|
this._handleListContactsSuccess.bind(this),
|
|
this._handleListContactsError.bind(this)
|
|
|
|
)
|
|
ajax.get()
|
|
|
|
}
|
|
_handleListContactsSuccess(contacts) {
|
|
try {
|
|
|
|
if (contacts.length) {
|
|
|
|
contacts.map((c, index) => {
|
|
this._addContactToList(c)
|
|
|
|
});
|
|
} else {
|
|
this.sideBar.find("#contact-list").addClass("d-none")
|
|
}
|
|
this.sideBar.find(".contact-chat").on("click", (e) => {
|
|
// $(e.currentTarget).find(".messages-unread-contact").empty()
|
|
$(".contact-chat").parent().removeClass("active")
|
|
$(".chat-contact-list-item").removeClass("active")
|
|
this.chatHistory.empty()
|
|
this.domItem.find("#chat-header-dropdown-users").addClass("d-none")
|
|
let userId = $(e.currentTarget).data("id")
|
|
$(e.currentTarget).parent().addClass('active')
|
|
this.receiverId = userId
|
|
this._handleGetSingleContact(userId)
|
|
this._setBtnInternal()
|
|
})
|
|
} catch (error) {
|
|
|
|
} finally {
|
|
this.domItem.find(`#chat-contact-list-item-${contacts[0].id}`).click()
|
|
|
|
}
|
|
}
|
|
_handleListContactsError(err) {
|
|
console.error(err)
|
|
}
|
|
_handleGetSingleContact(userId) {
|
|
let ajax = new Ajax(
|
|
`/chat/contacts/${userId}`,
|
|
null,
|
|
null,
|
|
this._handleGetSingleContactSuccess.bind(this),
|
|
this._handleGetSingleContactError.bind(this),
|
|
)
|
|
ajax.get()
|
|
}
|
|
|
|
_handleGetSingleContactSuccess(contact) {
|
|
this.domItem.find(".chat-history-header div.chat-contact-info h6").text([contact.first_name, contact.last_name].join(" "))
|
|
this.domItem.find(".chat-history-header div.chat-contact-info small.user-status").text(contact.username)
|
|
let ajax = new Ajax(
|
|
`/chat/contact/${contact.id}/messages`,
|
|
null,
|
|
null,
|
|
this._handleGetSingleContactMessagesSuccess.bind(this),
|
|
this._handleGetSingleContactMessagesError.bind(this)
|
|
)
|
|
ajax.get()
|
|
}
|
|
_handleGetSingleContactMessagesSuccess(data) {
|
|
try {
|
|
|
|
|
|
if (data) {
|
|
data.map((m) => {
|
|
this._addChatMessage(m)
|
|
})
|
|
}
|
|
} catch (error) {
|
|
|
|
} finally {
|
|
// console.log(this.chatHistoryBody[0].scrollTop)
|
|
this.scrollbarChatHistory.update()
|
|
this.chatHistoryBody[0].scrollTop = this.scrollbarChatHistory.containerHeight
|
|
}
|
|
}
|
|
_handleGetSingleContactMessagesError(err) { }
|
|
|
|
_handleGetSingleContactError(err) {
|
|
|
|
}
|
|
_sendMessageInternalPressKey(e) {
|
|
if (e.which == 13) {
|
|
e.preventDefault();
|
|
this._sendMessageInternal()
|
|
}
|
|
}
|
|
_sendMessageInternal() {
|
|
let messageText = this.messageInput.val()
|
|
const body = {
|
|
message: messageText,
|
|
receiver_id: this.receiverId,
|
|
}
|
|
if (messageText) {
|
|
let ajax = new Ajax(
|
|
`/chat/message/internal`,
|
|
body,
|
|
null,
|
|
this._sendMessageInternalSuccess.bind(this),
|
|
this._sendMessageInternalError.bind(this),
|
|
|
|
);
|
|
ajax.post();
|
|
}
|
|
}
|
|
_sendMessageInternalSuccess(message) {
|
|
this.messageInput.val("")
|
|
this.chatHistory.empty()
|
|
this._handleGetSingleContact(this.receiverId)
|
|
}
|
|
_sendMessageInternalError(err) {
|
|
console.error(err)
|
|
}
|
|
_addContactToList(contact) {
|
|
|
|
let contactItem =
|
|
`
|
|
<li class="chat-contact-list-item">
|
|
<a class="d-flex align-items-center contact-chat" data-id="${contact.id}"
|
|
id="chat-contact-list-item-${contact.id}">
|
|
<div class="avatar d-block flex-shrink-0">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">
|
|
${contact?.first_name?.charAt(0) ?? "?"
|
|
+ contact?.last_name?.charAt(0) ?? "?"}</span>
|
|
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">${contact?.first_name ?? "" + " " +
|
|
contact?.last_name ?? ""}</h6>
|
|
<p class="chat-contact-status text-muted text-truncate mb-0">
|
|
${contact?.cliente_id ? "[CLIENTE]" : ""}${contact.username}
|
|
</p>
|
|
</div>
|
|
${contact.unreadMessages ? `<span
|
|
class="badge badge-center rounded-pill bg-danger messages-unread-contact">${contact.unreadMessages}</span>` : ""}
|
|
</a>
|
|
</li>
|
|
`
|
|
|
|
if (contact.first_name || contact.last_name) {
|
|
this.sideBar.find("#contact-list").append(contactItem)
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
export const showNotificationMessages = (dom) => {
|
|
let ajax = new Ajax(
|
|
'/chat/notifications',
|
|
null,
|
|
null,
|
|
(data) => {
|
|
dom.empty()
|
|
$("#chat-notification-number")
|
|
if (data.totalMessages > 0) {
|
|
$("#chat-notification-number").removeClass("d-none")
|
|
$("#chat-notification-number").text(data.totalMessages ?? 0)
|
|
} else {
|
|
$("#chat-notification-number").addClass("d-none")
|
|
$("#chat-notification-number").text(0)
|
|
}
|
|
data?.internals?.map((e) => {
|
|
let numberOfMessages = e.unreadMessages
|
|
if (numberOfMessages > 0) {
|
|
dom.append(
|
|
`
|
|
<li class="mb-2">
|
|
<a href="${e.uri}" class="d-flex align-items-center flex-grow">
|
|
<div class="avatar d-block flex-shrink-0">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">${e.avatar}</span>
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">[${e.title}] ${e.chatDisplay}</h6>
|
|
</div>
|
|
<span class="badge badge-center rounded-pill bg-primary p-1">${numberOfMessages}</span>
|
|
</a>
|
|
</li>
|
|
`
|
|
)
|
|
}
|
|
})
|
|
data?.chatPresupuestos?.map((e) => {
|
|
let numberOfMessages = e.unreadMessages
|
|
if (numberOfMessages > 0) {
|
|
dom.append(
|
|
`
|
|
<li class="">
|
|
<a href="${e.uri}" class="d-flex align-items-center flex-grow">
|
|
<div class="avatar d-block flex-shrink-0">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">${e.presupuestoId}</span>
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">[${e.title}] ${e.chatDisplay}</h6>
|
|
</div>
|
|
<span class="badge badge-center rounded-pill bg-primary">${numberOfMessages}</span>
|
|
</a>
|
|
</li>
|
|
`
|
|
)
|
|
}
|
|
})
|
|
data?.chatFacturas?.map((e) => {
|
|
let numberOfMessages = e.unreadMessages
|
|
if (numberOfMessages > 0) {
|
|
dom.append(
|
|
`
|
|
<li class="">
|
|
<a href="${e.uri}" class="d-flex align-items-center flex-grow">
|
|
<div class="avatar d-block flex-shrink-0">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">${e.facturaId}</span>
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">[${e.title}] ${e.chatDisplay}</h6>
|
|
</div>
|
|
<span class="badge badge-center rounded-pill bg-primary">${numberOfMessages}</span>
|
|
</a>
|
|
</li>
|
|
`
|
|
)
|
|
}
|
|
})
|
|
data?.chatPedidos?.map((e) => {
|
|
let numberOfMessages = e.unreadMessages
|
|
if (numberOfMessages > 0) {
|
|
dom.append(
|
|
`
|
|
<li class="">
|
|
<a href="${e.uri}" class="d-flex align-items-center flex-grow">
|
|
<div class="avatar d-block flex-shrink-0">
|
|
<span class="avatar-initial rounded-circle bg-label-primary">${e.pedidoId}</span>
|
|
</div>
|
|
<div class="chat-contact-info flex-grow-1 ms-2">
|
|
<h6 class="chat-contact-name text-truncate m-0">[${e.title}] ${e.chatDisplay}</h6>
|
|
</div>
|
|
<span class="badge badge-center rounded-pill bg-primary">${numberOfMessages}</span>
|
|
</a>
|
|
</li>
|
|
`
|
|
)
|
|
}
|
|
})
|
|
|
|
},
|
|
(err) => { }
|
|
)
|
|
ajax.get()
|
|
}
|
|
export default Chat
|
|
|
|
|
|
// // Seleccionar elementos del DOM
|
|
// const chatContactsBody = document.querySelector('.app-chat-contacts .sidebar-body'),
|
|
// chatContactListItems = [].slice.call(
|
|
// document.querySelectorAll('.chat-contact-list-item:not(.chat-contact-list-item-title)')
|
|
// ),
|
|
// chatHistoryBody = document.querySelector('.chat-history-body'),
|
|
// chatSidebarLeftUserAbout = document.querySelector('.chat-sidebar-left-user-about'),
|
|
// messageInput = document.querySelector('.message-input'),
|
|
// searchInput = document.querySelector('.chat-search-input'),
|
|
// sendMsgBtn = document.querySelector('.send-msg-btn'); // Seleccionar el botón de envío de mensaje
|
|
|
|
// // Inicializar PerfectScrollbar
|
|
// if (chatContactsBody) {
|
|
// new PerfectScrollbar(chatContactsBody, {
|
|
// wheelPropagation: false,
|
|
// suppressScrollX: true
|
|
// });
|
|
// }
|
|
|
|
// if (chatHistoryBody) {
|
|
// new PerfectScrollbar(chatHistoryBody, {
|
|
// wheelPropagation: false,
|
|
// suppressScrollX: true
|
|
// });
|
|
// }
|
|
|
|
// // Función para desplazar el scroll al final
|
|
// function scrollToBottom() {
|
|
// if (chatHistoryBody) {
|
|
// chatHistoryBody.scrollTo(0, chatHistoryBody.scrollHeight);
|
|
// }
|
|
// }
|
|
// scrollToBottom();
|
|
|
|
// // Seleccionar chat o contacto
|
|
|
|
|
|
// // Filtrar chats
|
|
// if (searchInput) {
|
|
// searchInput.addEventListener('keyup', e => {
|
|
// const searchValue = e.currentTarget.value.toLowerCase(),
|
|
// chatListItem0 = document.querySelector('.chat-list-item-0'),
|
|
// contactListItem0 = document.querySelector('.contact-list-item-0'),
|
|
// searchChatListItems = [].slice.call(
|
|
// document.querySelectorAll('#chat-list li:not(.chat-contact-list-item-title)')
|
|
// ),
|
|
// searchContactListItems = [].slice.call(
|
|
// document.querySelectorAll('#contact-list li:not(.chat-contact-list-item-title)')
|
|
// );
|
|
|
|
// // Buscar en chats
|
|
// const chatListItemsCount = searchChatContacts(searchChatListItems, searchValue);
|
|
// // Mostrar u ocultar mensaje de "No se encontraron resultados" en chats
|
|
// if (chatListItem0) {
|
|
// chatListItem0.classList.toggle('d-none', chatListItemsCount !== 0);
|
|
// }
|
|
|
|
// // Buscar en contactos
|
|
// const contactListItemsCount = searchChatContacts(searchContactListItems, searchValue);
|
|
// // Mostrar u ocultar mensaje de "No se encontraron resultados" en contactos
|
|
// if (contactListItem0) {
|
|
// contactListItem0.classList.toggle('d-none', contactListItemsCount !== 0);
|
|
// }
|
|
// });
|
|
// }
|
|
|
|
// // Función para buscar en chats y contactos
|
|
// function searchChatContacts(searchListItems, searchValue) {
|
|
// let searchListItemsCount = 0;
|
|
// searchListItems.forEach(searchListItem => {
|
|
// const searchListItemText = searchListItem.textContent.toLowerCase();
|
|
// const matchesSearch = searchListItemText.indexOf(searchValue) !== -1;
|
|
|
|
// searchListItem.classList.toggle('d-flex', matchesSearch);
|
|
// searchListItem.classList.toggle('d-none', !matchesSearch);
|
|
|
|
// if (matchesSearch) {
|
|
// searchListItemsCount++;
|
|
// }
|
|
// });
|
|
|
|
// return searchListItemsCount;
|
|
// }
|
|
|
|
// // // Enviar mensaje
|
|
// // if (sendMsgBtn) {
|
|
// // sendMsgBtn.addEventListener('click', e => {
|
|
// // e.preventDefault();
|
|
// // if (messageInput.value) {
|
|
// // const renderMsg = document.createElement('div');
|
|
// // renderMsg.className = 'chat-message-text mt-2';
|
|
// // renderMsg.innerHTML = `<p class="mb-0">${messageInput.value}</p>`;
|
|
// // const lastChatMessageWrapper = document.querySelector('li:last-child .chat-message-wrapper');
|
|
// // if (lastChatMessageWrapper) {
|
|
// // lastChatMessageWrapper.appendChild(renderMsg);
|
|
// // }
|
|
// // messageInput.value = '';
|
|
// // scrollToBottom();
|
|
// // }
|
|
// // });
|
|
// // }
|