diff --git a/ci4/app/Views/themes/vuexy/form/mensajes/mensajeria.js b/ci4/app/Views/themes/vuexy/form/mensajes/mensajeria.js
index 4e7667b8..31454324 100644
--- a/ci4/app/Views/themes/vuexy/form/mensajes/mensajeria.js
+++ b/ci4/app/Views/themes/vuexy/form/mensajes/mensajeria.js
@@ -15,14 +15,16 @@ const chatContactsBody = $('.app-chat-contacts .sidebar-body'),
if (chatContactsBody.length) {
new PerfectScrollbar(chatContactsBody[0], {
wheelPropagation: false,
- suppressScrollX: true
+ suppressScrollX: true,
+ scrollingThreshold : 200,
});
}
if (chatHistoryBody.length) {
- new PerfectScrollbar(chatHistoryBody[0], {
+ new PerfectScrollbar(document.querySelector('.chat-history-body'), {
wheelPropagation: false,
- suppressScrollX: true
+ suppressScrollX: true,
+ scrollingThreshold : 200,
});
}
diff --git a/httpdocs/assets/js/safekat/components/chat.js b/httpdocs/assets/js/safekat/components/chat.js
index 490bb50c..e0de09bf 100644
--- a/httpdocs/assets/js/safekat/components/chat.js
+++ b/httpdocs/assets/js/safekat/components/chat.js
@@ -68,12 +68,16 @@ class Chat {
}
if (this.chatHistoryBody[0]) {
+ console.log("History body");
this.scrollbarChatHistory = new PerfectScrollbar(this.chatHistoryBody[0], {
wheelPropagation: false,
suppressScrollX: true,
});
}
+ if (this.chatHistoryBody.length) {
+ this.chatHistoryBody.scrollTop(0,this.chatHistoryBody[0].scrollHeight);
+ }
}
initDirectMessage() {
@@ -148,7 +152,7 @@ class Chat {
this._handleGetChatList()
this.sendBtnMessageDepartment.on("click", this._sendMessage.bind(this))
this.sendBtnMessageDepartmentClient.on("click", this._sendMessage.bind(this))
-
+ this.scrollbarChatHistory.update()
this.messageInput.on("keypress", this._sendMessagePressKey.bind(this))
this.initSelectClient()
// setInterval(this._getChatMessage.bind(this), 10000)
diff --git a/httpdocs/themes/vuexy/vendor/css/pages/app-chat.css b/httpdocs/themes/vuexy/vendor/css/pages/app-chat.css
index e1d82c36..9f352452 100644
--- a/httpdocs/themes/vuexy/vendor/css/pages/app-chat.css
+++ b/httpdocs/themes/vuexy/vendor/css/pages/app-chat.css
@@ -1,13 +1,13 @@
.app-chat {
position: relative;
- height: calc(100vh - 11.5rem) !important;
+ height: calc(75vh - 11.5rem) !important;
}
a.send-msg-btn {
color: white
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat {
- height: calc(100vh - 20rem - 2.2rem) !important;
+ height: calc(75vh - 20rem - 2.2rem) !important;
}
}
@media (max-width: 992px) {
@@ -28,14 +28,14 @@ a.send-msg-btn {
.app-chat .app-chat-contacts {
position: absolute;
left: calc(-21rem - 1rem);
- height: calc(100vh - 11.5rem);
+ height: calc(75vh - 11.5rem);
width: 21rem;
flex-basis: 21rem;
transition: all 0.25s ease;
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-contacts {
- height: calc(100vh - 20rem - 2.2rem);
+ height: calc(75vh - 20rem - 2.2rem);
}
}
@media (min-width: 992px) {
@@ -47,17 +47,17 @@ a.send-msg-btn {
left: 0rem;
}
.app-chat .app-chat-contacts .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 3.9rem);
- height: calc(calc(100vh - 11.5rem) - 3.5rem);
+ height: calc(calc(75vh - 11.5rem) - 3.9rem);
+ height: calc(calc(75vh - 11.5rem) - 3.5rem);
}
@media (min-width: 992px) {
.layout-horizontal .app-chat .app-chat-contacts .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 5rem + calc(2.2rem / 2));
+ height: calc(calc(75vh - 11.5rem) - 5rem + calc(2.2rem / 2));
}
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-contacts .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 5rem - 2.2rem);
+ height: calc(calc(75vh - 11.5rem) - 5rem - 2.2rem);
}
}
@@ -90,14 +90,14 @@ a.send-msg-btn {
top: 0;
left: calc(-21rem - 1rem);
width: 21rem;
- height: calc(100vh - 11.5rem);
+ height: calc(75vh - 11.5rem);
opacity: 0;
z-index: 5;
transition: all 0.25s ease;
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-sidebar-left {
- height: calc(100vh - 20rem - 2.2rem);
+ height: calc(75vh - 20rem - 2.2rem);
}
}
.app-chat .app-chat-sidebar-left.show {
@@ -105,21 +105,21 @@ a.send-msg-btn {
opacity: 1;
}
.app-chat .app-chat-sidebar-left .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 11.5rem);
+ height: calc(calc(75vh - 11.5rem) - 11.5rem);
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-sidebar-left .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 10.9rem - 2.2rem);
+ height: calc(calc(75vh - 11.5rem) - 10.9rem - 2.2rem);
}
}
.app-chat .app-chat-history {
position: relative;
- height: calc(100vh - 11.5rem);
+ height: calc(75vh - 11.5rem);
transition: all 0.25s ease;
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-history {
- height: calc(100vh - 20rem - 2.2rem);
+ height: calc(75vh - 20rem - 2.2rem);
}
}
.app-chat .app-chat-history .chat-history-header {
@@ -129,13 +129,13 @@ a.send-msg-btn {
margin-bottom: 0.1rem;
}
.app-chat .app-chat-history .chat-history-body {
- height: calc(100vh - 20.5rem);
+ height: calc(75vh - 20.5rem);
padding: 2rem 1.5rem;
overflow: hidden;
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-history .chat-history-body {
- height: calc(100vh - 20.5rem - 2.2rem);
+ height: calc(75vh - 20.5rem - 2.2rem);
}
}
.app-chat .app-chat-history .chat-history-body .chat-history .chat-message {
@@ -175,14 +175,14 @@ a.send-msg-btn {
top: 0;
right: calc(-21rem - 1rem);
width: 21rem;
- height: calc(100vh - 11.5rem);
+ height: calc(75vh - 11.5rem);
opacity: 0;
z-index: 5;
transition: all 0.25s ease;
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-sidebar-right {
- height: calc(100vh - 20rem - 2.2rem);
+ height: calc(75vh - 20rem - 2.2rem);
}
}
.app-chat .app-chat-sidebar-right.show {
@@ -190,11 +190,11 @@ a.send-msg-btn {
right: 0;
}
.app-chat .app-chat-sidebar-right .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 11.75rem);
+ height: calc(calc(75vh - 11.5rem) - 11.75rem);
}
@media (min-width: 1200px) {
.layout-horizontal .app-chat .app-chat-sidebar-right .sidebar-body {
- height: calc(calc(100vh - 11.5rem) - 11.1rem - 2.2rem);
+ height: calc(calc(75vh - 11.5rem) - 11.1rem - 2.2rem);
}
}