feat:chat

This commit is contained in:
amazuecos
2024-09-26 13:11:01 +00:00
parent c5a5f01fa0
commit bdc5b0c442
2 changed files with 59 additions and 29 deletions

View File

@ -70,23 +70,28 @@ class Chat {
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() {
@ -136,6 +141,7 @@ class Chat {
_handleGetChatListSuccess(data) {
Object.values(data).map(row => {
this.chatList.append(this._getContact(row))
this.chatList.find(`#chat_${row.name}`).on("click", (event) => {
$(".chat-contact-list-item").removeClass("active")
$(event.currentTarget).parent().addClass("active")
@ -207,6 +213,8 @@ class Chat {
${row.display}
</p>
</div>
${row.unreadMessages ? `<span
class="badge badge-center rounded-pill bg-primary messages-unread-contact">${row.unreadMessages}</span>` : ""}
</a>
</li>
`
@ -267,7 +275,15 @@ class Chat {
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,
@ -297,6 +313,7 @@ class Chat {
_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,
@ -318,15 +335,16 @@ class Chat {
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()
this.chatHistory.empty()
})
}
_handleListContactsError(err) {
@ -366,6 +384,12 @@ class Chat {
_handleGetSingleContactError(err) {
}
_sendMessageInternalPressKey(e){
if ( e.which == 13 ) {
e.preventDefault();
this._sendMessageInternal()
}
}
_sendMessageInternal() {
let messageText = this.messageInput.val()
@ -387,6 +411,7 @@ class Chat {
}
_sendMessageInternalSuccess(message) {
this.messageInput.val("")
this.chatHistory.empty()
this._handleGetSingleContact(this.receiverId)
}
_sendMessageInternalError(err) {
@ -413,7 +438,7 @@ class Chat {
</p>
</div>
${contact.unreadMessages ? `<span
class="badge badge-center rounded-pill bg-primary">${contact.unreadMessages}</span>` : ""}
class="badge badge-center rounded-pill bg-primary messages-unread-contact">${contact.unreadMessages}</span>` : ""}
</a>
</li>
`
@ -437,15 +462,30 @@ export const showNotificationMessages = (dom) => {
null,
null,
(data) => {
let totalMessages = 0
dom.empty()
$("#chat-notification-number").text(data.totalMessages ?? 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) => {
console.log(e)
let numberOfMessages = 0
e.messages.forEach(m => {
m.viewed == "1" ? numberOfMessages++ : null
});
totalMessages+= numberOfMessages
let numberOfMessages = e.unreadMessages
if(numberOfMessages > 0){
dom.append(
`
@ -465,18 +505,12 @@ export const showNotificationMessages = (dom) => {
}
})
data?.chatFacturas?.map((e) => {
console.log(e)
let numberOfMessages = 0
e.messages.forEach(m => {
m.viewed == "1" ? numberOfMessages++ : null
});
totalMessages+= numberOfMessages
let numberOfMessages = e.unreadMessages
if(numberOfMessages > 0){
dom.append(
`
<li class="">
<a href="/presupuestos/cosidotapablanda/edit/${e.facturaId}" class="d-flex align-items-center flex-grow">
<a href="/facturas/edit/${e.facturaId}" 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>
@ -491,19 +525,12 @@ export const showNotificationMessages = (dom) => {
}
})
data?.chatPedidos?.map((e) => {
console.log(e)
let numberOfMessages = 0
e.messages.forEach(m => {
m.viewed == "1" ? numberOfMessages++ : null
});
$("#chat-notification-number").text(numberOfMessages)
totalMessages+= numberOfMessages
let numberOfMessages = e.unreadMessages
if(numberOfMessages > 0){
dom.append(
`
<li class="">
<a href="/presupuestos/cosidotapablanda/edit/${e.pedidoId}" class="d-flex align-items-center flex-grow">
<a href="/pedidos/edit/${e.pedidoId}" 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>
@ -517,7 +544,7 @@ export const showNotificationMessages = (dom) => {
)
}
})
$("#chat-notification-number").text(totalMessages)
},
(err) => { }
)

View File

@ -1,3 +1,6 @@
import {showNotificationMessages} from "../components/chat.js";
showNotificationMessages($("#chat-notification-list"))
showNotificationMessages($("#chat-notification-list"))
$("#message-notification-dropdown").on("click",(e) => {
showNotificationMessages($("#chat-notification-list"))
})