add chat direct

httpdocs/assets/js/safekat/components/chat.js

@@ -75,7 +75,7 @@ class Chat {
             });
         }
         if (this.chatHistoryBody.length) {
-            this.chatHistoryBody.scrollTop(0,this.chatHistoryBody[0].scrollHeight);
+            this.chatHistoryBody.scrollTop(0, this.chatHistoryBody[0].scrollHeight);
         }
     }
     initDirectMessage() {
@@ -650,9 +650,6 @@ class Chat {
                 <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>
             </div>
         </li>

httpdocs/assets/js/safekat/components/datatables/MessagesDatatable.js

@@ -8,6 +8,8 @@ class MessagesDatatable {
         this.datatablePedidoMessageItem = this.item.find("#tablePedidoMessages")
         this.datatableFacturaMessageItem = this.item.find("#tableFacturaMessages")
         this.datatableOtMessageItem = this.item.find("#tableOtMessages")
+        this.datatableDirectMessageItem = this.item.find("#tableDirectMessages")
+
 
         this.focusTable = this.datatableItem
         this.columnDefs = [
@@ -15,7 +17,7 @@ class MessagesDatatable {
         this.datatableColumns = [
             { data: 'created_at', searchable: true, sortable: true },
             { data: 'updated_at', searchable: true, sortable: true },
-            { data: 'title', name:"chats.title",searchable: true, sortable: true },
+            { data: 'title', name: "chats.title", searchable: true, sortable: true },
             { data: 'message', searchable: false, sortable: true },
             { data: 'creator', searchable: false, sortable: false },
             {
@@ -59,8 +61,8 @@ class MessagesDatatable {
         this.datatable = this.datatableItem.DataTable({
             processing: true,
             order: [[1, 'desc']],
-            columnDefs : this.columnDefs,
-            orderCellsTop : true,
+            columnDefs: this.columnDefs,
+            orderCellsTop: true,
             layout: {
                 topStart: 'pageLength',
                 topEnd: 'search',
@@ -79,8 +81,8 @@ class MessagesDatatable {
         this.datatablePresupuestoMessage = this.datatablePresupuestoMessageItem.DataTable({
             processing: true,
             order: [[1, 'desc']],
-            columnDefs : this.columnDefs,
-            orderCellsTop : true,
+            columnDefs: this.columnDefs,
+            orderCellsTop: true,
             layout: {
                 topStart: 'pageLength',
                 topEnd: 'search',
@@ -97,8 +99,8 @@ class MessagesDatatable {
         });
         this.datatablePedidoMessage = this.datatablePedidoMessageItem.DataTable({
             processing: true,
-            orderCellsTop : true,
-            columnDefs : this.columnDefs,
+            orderCellsTop: true,
+            columnDefs: this.columnDefs,
             order: [[1, 'desc']],
             layout: {
                 topStart: 'pageLength',
@@ -116,8 +118,8 @@ class MessagesDatatable {
         });
         this.datatableFacturaMessage = this.datatableFacturaMessageItem.DataTable({
             processing: true,
-            orderCellsTop : true,
-            columnDefs : this.columnDefs,
+            orderCellsTop: true,
+            columnDefs: this.columnDefs,
             order: [[1, 'desc']],
             layout: {
                 topStart: 'pageLength',
@@ -136,8 +138,8 @@ class MessagesDatatable {
         this.datatableOtMessage = this.datatableOtMessageItem.DataTable({
             processing: true,
             order: [[1, 'desc']],
-            columnDefs : this.columnDefs,
-            orderCellsTop : true,
+            columnDefs: this.columnDefs,
+            orderCellsTop: true,
             layout: {
                 topStart: 'pageLength',
                 topEnd: 'search',
@@ -152,6 +154,25 @@ class MessagesDatatable {
             columns: this.datatableColumns,
             ajax: '/messages/datatable/ots'
         });
+        this.datatableDirectMessage = this.datatableDirectMessageItem.DataTable({
+            processing: true,
+            order: [[1, 'desc']],
+            columnDefs: this.columnDefs,
+            orderCellsTop: true,
+            layout: {
+                topStart: 'pageLength',
+                topEnd: 'search',
+                bottomStart: 'info',
+                bottomEnd: 'paging'
+            },
+            serverSide: true,
+            pageLength: 10,
+            language: {
+                url: "/themes/vuexy/vendor/libs/datatables-sk/plugins/i18n/es-ES.json"
+            },
+            columns: this.datatableColumns,
+            ajax: '/messages/datatable/direct'
+        });
         this.datatablePresupuestoMessageItem.on("keyup", ".datatable-message-filter", (event) => {
             let columnIndex = this.datatableColumns.findIndex((element) => element.data == $(event.currentTarget).attr("name"))
             this.datatablePresupuestoMessage.column(columnIndex).search($(event.currentTarget).val()).draw()
@@ -166,7 +187,11 @@ class MessagesDatatable {
         })
         this.datatableOtMessageItem.on("keyup", ".datatable-message-filter", (event) => {
             let columnIndex = this.datatableColumns.findIndex((element) => element.data == $(event.currentTarget).attr("name"))
-            this.datatableFacturaMessage.column(columnIndex).search($(event.currentTarget).val()).draw()
+            this.datatableOtMessage.column(columnIndex).search($(event.currentTarget).val()).draw()
+        })
+        this.datatableDirectMessageItem.on("keyup", ".datatable-message-filter", (event) => {
+            let columnIndex = this.datatableColumns.findIndex((element) => element.data == $(event.currentTarget).attr("name"))
+            this.datatableDirectMessage.column(columnIndex).search($(event.currentTarget).val()).draw()
         })
 
     }
@@ -197,18 +222,15 @@ class MessagesDatatable {
         }
     }
     handleDropUpError() { }
-    addDropUpItem(user)
-    {
+    addDropUpItem(user) {
         return `
             <li >
                 <a type="button" class="d-flex flex-row justify-content-between align-items-center dropdown-item px-2 gap-2" href="javascript:void(0);"  >
                 <span> ${user.userFullName ?? user.userName} </span>
-                <span class="badge badge-center rounded-pill text-bg-${
-                    user.viewed == 1 ? 'success' : 'danger'
-                }">
-                <i class="ti ti-xs ti-${
-                    user.viewed == 1 ? 'eye-check' : 'eye-off'
-                } "></i>
+                <span class="badge badge-center rounded-pill text-bg-${user.viewed == 1 ? 'success' : 'danger'
+            }">
+                <i class="ti ti-xs ti-${user.viewed == 1 ? 'eye-check' : 'eye-off'
+            } "></i>
                 </span>
                 </a>
             </li>`;

httpdocs/assets/js/safekat/pages/configuracion/messages/messagePage.js

@@ -38,26 +38,30 @@ class MessagePage {
         this.btnSubmitNewDirectMessage.on("click", this.handleSubmitNewMessage.bind(this))
         this.btnSubmitNewDirectMessageCliente.on("click", this.handleSubmitNewMessageClient.bind(this))
 
-        $("#navs-top-align-all-tab").on("click",()=>{
+        $("#navs-top-align-all-tab").on("click", () => {
             this.messageDatatable.datatable.ajax.reload()
             this.messageDatatable.focusTable = this.messageDatatable.datatableItem
         })
-        $("#navs-top-align-presupuestos-tab").on("click",()=>{
+        $("#navs-top-align-presupuestos-tab").on("click", () => {
             this.messageDatatable.datatablePresupuestoMessage.ajax.reload()
             this.messageDatatable.focusTable = this.messageDatatable.datatablePresupuestoMessageItem
         })
-        $("#navs-top-align-pedidos-tab").on("click",()=>{
+        $("#navs-top-align-pedidos-tab").on("click", () => {
             this.messageDatatable.datatablePedidoMessage.ajax.reload()
             this.messageDatatable.focusTable = this.messageDatatable.datatablePedidoMessageItem
         })
-        $("#navs-top-align-facturas-tab").on("click",()=>{
+        $("#navs-top-align-facturas-tab").on("click", () => {
             this.messageDatatable.datatableFacturaMessage.ajax.reload()
             this.messageDatatable.focusTable = this.messageDatatable.datatableFacturaMessageItem
         })
-        $("#navs-top-align-ot-tab").on("click",()=>{
+        $("#navs-top-align-ot-tab").on("click", () => {
             this.messageDatatable.datatableOtMessage.ajax.reload()
             this.messageDatatable.focusTable = this.messageDatatable.datatableOtMessageItem
         })
+        $("#navs-top-align-direct-tab").on("click", () => {
+            this.messageDatatable.datatableDirectMessage.ajax.reload()
+            this.messageDatatable.focusTable = this.messageDatatable.datatableDirectMessageItem
+        })
 
     }
     openNewMessageModal() {
@@ -68,7 +72,7 @@ class MessagePage {
         this.modalNewMessage.toggle()
     }
 
-     handleSubmitNewMessage() {
+    handleSubmitNewMessage() {
         this.btnNewMessage.addClass("loading")
         const ajax = new Ajax("/messages/direct",
             this.getNewMessageDataForm(),
@@ -92,7 +96,7 @@ class MessagePage {
         this.alert.setAsError()
         this.alert.setHeadingTitle(error.message)
     }
-    handleSubmitNewMessageClient(){
+    handleSubmitNewMessageClient() {
         this.btnNewMessage.addClass("loading")
         const ajax = new Ajax("/messages/direct/client",
             this.getNewMessageDataFormClient(),
@@ -101,11 +105,11 @@ class MessagePage {
             this.handleSubmitNewMessageError.bind(this))
         ajax.post()
     }
-    handleSubmitNewMessageClientSuccess(){
-        
+    handleSubmitNewMessageClientSuccess() {
+
     }
-    handleSubmitNewMessageClientError(){
-        
+    handleSubmitNewMessageClientError() {
+
     }
     getNewMessageDataForm() {
         return {