thirdparty
/
CybroAddons
mirror of https://github.com/CybroOdoo/CybroAddons.git
4
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Aug 29: [FIX] Bug Fixed 'pos_chatter'

pull/338/merge
Risvana Cybro 2 months ago
parent
adc2afc7c3
commit
6781cbb227
10 changed files with 313 additions and 148 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      pos_chatter/__init__.py
  2. 41
      pos_chatter/controllers/systray.py
  3. 1
      pos_chatter/models/__init__.py
  4. 29
      pos_chatter/models/mail_message.py
  5. BIN
      pos_chatter/static/description/assets/screenshots/1.png
  6. BIN
      pos_chatter/static/description/assets/screenshots/2.png
  7. 2
      pos_chatter/static/description/index.html
  8. 307
      pos_chatter/static/src/js/pos_msg_view.js
  9. 69
      pos_chatter/static/src/js/pos_systray_icon.js
  10. 7
      pos_chatter/static/src/xml/pos_systray_icon.xml

1
pos_chatter/__init__.py
View File

@ -19,3 +19,4 @@
# If not, see <http://www.gnu.org/licenses/>. # If not, see <http://www.gnu.org/licenses/>.
################################################################################ ################################################################################
from . import controllers from . import controllers
from . import models

41
pos_chatter/controllers/systray.py
View File

@ -38,21 +38,31 @@ class SystrayController(http.Controller):
@http.route('/pos_systray/message_data', auth='public', type='json') @http.route('/pos_systray/message_data', auth='public', type='json')
def get_data_pos_systray(self): def get_data_pos_systray(self):
""" channels = request.env['discuss.channel'].search([])
Summary: partner_id = request.env.user.partner_id.id
Getting data to the Message chatter list.
Return: data = []
it contains details about chatter list. for mail_channel in channels:
""" if partner_id in mail_channel.channel_partner_ids.ids:
return [{'id': mail_channel_id.id, message = request.env['mail.message'].search(
'type': mail_channel_id.channel_type, [('model', '=', 'discuss.channel'),
'name': mail_channel_id.name, ('res_id', '=', mail_channel.id)],
'message_body': request.env['mail.message'].search( limit=1, order="id desc"
[('model', '=', 'discuss.channel'), )
('res_id', '=', mail_channel_id.id)], limit=1).body messages = request.env['mail.message'].search_count(
} for mail_channel_id in request.env['discuss.channel'].search([]) [('model', '=', 'discuss.channel'),
for partner_id in mail_channel_id.channel_partner_ids ('res_id', '=', mail_channel.id),
if partner_id.id == request.env.user.partner_id.id] ('is_read', '=', False)]
)
data.append({
'message_id': message.id,
'id': mail_channel.id,
'type': mail_channel.channel_type,
'name': mail_channel.name,
'message_body': message.body if message else "",
'count': messages
})
return data
@http.route('/pos_systray/chat_message', auth='public', type='json') @http.route('/pos_systray/chat_message', auth='public', type='json')
def get_data_chat_box(self, **kw): def get_data_chat_box(self, **kw):
@ -105,6 +115,7 @@ class SystrayController(http.Controller):
'model': 'discuss.channel', 'model': 'discuss.channel',
'res_id': int(data['res_id']), 'res_id': int(data['res_id']),
'message_type': 'comment', 'message_type': 'comment',
'is_read': True,
'author_id': request.env.user.partner_id.id 'author_id': request.env.user.partner_id.id
}) })
return True return True

1
pos_chatter/models/__init__.py
View File

@ -0,0 +1 @@
from . import mail_message

29
pos_chatter/models/mail_message.py
View File

@ -0,0 +1,29 @@
from odoo import models, fields , api
class MailMessage(models.Model):
_inherit = "mail.message"
is_read = fields.Boolean(string="Read", default=False)
@api.model
def compute_read_message(self, datas):
print(datas)
try:
messages = self.env['mail.message'].search([
('model', '=', 'discuss.channel'),
('res_id', '=', datas),
('is_read', '=', False)
])
for message in messages:
if message.is_read is False:
message.write({'is_read': True})
print(f"Marked messages as read: {message.ids}")
else:
print("No unread messages found.")
except Exception as e:
print(f"An error occurred: {str(e)}")

BIN
pos_chatter/static/description/assets/screenshots/1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 106 KiB

After

Width:  |  Height:  |  Size: 130 KiB

BIN
pos_chatter/static/description/assets/screenshots/2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 122 KiB

2
pos_chatter/static/description/index.html
View File

@ -161,7 +161,7 @@
<div class="px-3"> <div class="px-3">
<h4 class="mt-2" <h4 class="mt-2"
style=" font-weight:600 !important; color:#282F33 !important; font-size:1.3rem !important"> style=" font-weight:600 !important; color:#282F33 !important; font-size:1.3rem !important">
Chat list.</h4> Chat list with unread message counts.</h4>
</div> </div>
</div> </div>
</div> </div>

307
pos_chatter/static/src/js/pos_msg_view.js
View File

@ -1,87 +1,126 @@
/** @odoo-module **/ /** @odoo-module **/
import { jsonrpc } from "@web/core/network/rpc_service"; import { jsonrpc } from "@web/core/network/rpc_service";
const { mount,xml, onMounted, useState, useRef} = owl; const { mount, xml, onMounted, useState, useRef } = owl;
import { ChatMsgView } from "./pos_chat_view" import { ChatMsgView } from "./pos_chat_view";
export class PosMsgView extends owl.Component { export class PosMsgView extends owl.Component {
setup(){ setup() {
super.setup() super.setup();
this.root = useRef("root") this.root = useRef("root");
onMounted(this.render_msg_view) onMounted(this.render_msg_view);
this.MsgWindow = new ChatMsgView(); this.MsgWindow = new ChatMsgView();
this.state = useState({ this.state = useState({
'data': {} data: [],
counts: {
all: 0,
chat: 0,
channels: 0
}
}); });
} }
/** for getting all chat list */
render_msg_view(data){ /** Fetch all chat messages */
var self = this render_msg_view() {
jsonrpc('/pos_systray/message_data',).then(function(data){ const self = this;
var message_list = [] jsonrpc("/pos_systray/message_data").then((data) => {
var messages = data const message_list = data.map((message) => {
$(messages).each(function(message){
const htmlString = messages[message].message_body;
const parser = new DOMParser(); const parser = new DOMParser();
const parsedHtml = parser.parseFromString(htmlString, 'text/html'); const parsedHtml = parser.parseFromString(message.message_body, "text/html");
const plainText = parsedHtml.documentElement.textContent; let plainText = parsedHtml.documentElement.textContent;
message_list.push({
'id': messages[message].id, // Format SMS failure messages
'type': messages[message].type, if (message.type === 'sms_failure') {
'name': messages[message].name, plainText = `SMS Failure: Contact\nAn error occurred when sending an SMS\nAug 18`;
'message_body': plainText }
})
return {
id: message.id,
type: message.type,
name: message.name,
message_body: plainText,
count: message.count || 0,
};
}); });
self.state.data = message_list
}) // Calculate counts for each category
const counts = {
chat: message_list.filter(m => m.type === 'chat').reduce((sum, msg) => sum + msg.count, 0),
all: message_list.filter(m => m.type === 'channel').reduce((sum, msg) => sum + msg.count, 0),
channels: message_list.reduce((sum, msg) => sum + msg.count, 0),
};
self.state.data = message_list;
self.state.counts = counts;
}).catch((error) => {
console.error("Error fetching messages:", error);
alert("Failed to load messages. Please try again.");
});
} }
/** for click function for navbar*/ /** Toggle visibility between All, Chat, and Channels */
_onClickAllMessage(){ toggleView(activeButtonId, activeSectionId) {
this.root.el.querySelector('#all_message').style.display = "block" ["all_message", "all_chat", "all_channels"].forEach((id) => {
this.root.el.querySelector('#all_chat').style.display = "none" const element = this.root.el.querySelector(`#${id}`);
this.root.el.querySelector('#all_channels').style.display = "none" if (element) {
this.root.el.querySelector('#all_message_button').style.color = "#000" element.style.display = id === activeSectionId ? "block" : "none";
this.root.el.querySelector('#all_chat_button').style.color = "#9c9a97" }
this.root.el.querySelector('#all_channels_button').style.color = "#9c9a97" });
["all_message_button", "all_chat_button", "all_channels_button"].forEach((id) => {
const element = this.root.el.querySelector(`#${id}`);
if (element) {
element.style.color = id === activeButtonId ? "#000" : "#9c9a97";
}
});
}
_onClickAllMessage() {
this.toggleView("all_message_button", "all_message");
} }
/** for click function for navbar*/
_onClickAllChannels(){ _onClickAllChannels() {
this.root.el.querySelector('#all_message').style.display = "none" this.toggleView("all_channels_button", "all_channels");
this.root.el.querySelector('#all_chat').style.display = "none"
this.root.el.querySelector('#all_channels').style.display = "block"
this.root.el.querySelector('#all_message_button').style.color = "#9c9a97"
this.root.el.querySelector('#all_chat_button').style.color = "#9c9a97"
this.root.el.querySelector('#all_channels_button').style.color = "#000"
} }
/** for click function for navbar*/
_onClickAllChat(){ _onClickAllChat() {
this.root.el.querySelector('#all_message').style.display = "none" this.toggleView("all_chat_button", "all_chat");
this.root.el.querySelector('#all_chat').style.display = "block"
this.root.el.querySelector('#all_channels').style.display = "none"
this.root.el.querySelector('#all_message_button').style.color = "#9c9a97"
this.root.el.querySelector('#all_chat_button').style.color = "#000"
this.root.el.querySelector('#all_channels_button').style.color = "#9c9a97"
} }
/** On clicking the chat or channel open the corresponding chat view */
_onClickToMessage(ev){ /** Open chat view */
var self = this _onClickToMessage(ev) {
var channel_id = ev.currentTarget.getAttribute("value") const channel_id = ev.currentTarget.getAttribute("value");
this.__owl__.remove() if (!channel_id || isNaN(parseInt(channel_id))) {
if($("#pos_chat_view").length == 0){ console.error("Invalid channel_id:", channel_id);
this.schedule_dropdown = mount(ChatMsgView, document.body, {props: { alert("Cannot open chat: Invalid message ID");
channel_id return;
}})
}else if($("#pos_chat_view").length > 0){
this.schedule_dropdown = mount(ChatMsgView, document.body, {props: {
channel_id
}})
} }
const self = this;
jsonrpc("/web/dataset/call_kw/mail.message/compute_read_message", {
model: "mail.message",
method: "compute_read_message",
args: [parseInt(channel_id)],
kwargs: {}
}).then(() => {
self.__owl__.remove();
self.schedule_dropdown = mount(ChatMsgView, document.body, { props: { channel_id: parseInt(channel_id) } });
}).catch((error) => {
console.error("RPC Error Details:", {
message: error.message,
data: error.data,
type: error.type,
stack: error.stack
});
alert("Failed to load chat. Please try again.");
});
} }
} }
PosMsgView.template = xml`
//template for pos messages list view PosMsgView.template = xml`
<div class="pos_systray_template" t-ref="root" <div class="pos_systray_template" t-ref="root"
style="height:auto;width:350px;background-color:white;position:fixed;right:5px;top:49px;"> style="height:auto;width:350px;background-color:#f3f3f3;position:fixed;right:5px;top:49px;padding:10px;margin: 7px 14px;">
<div style="display:flex;height: 27px;"> <div style="display:flex;height: 27px;position:relative;">
<div style="display:flex;">
<p style="margin-left:10px;cursor: pointer;" id="all_message_button" <p style="margin-left:10px;cursor: pointer;" id="all_message_button"
t-on-click="_onClickAllMessage">All</p> t-on-click="_onClickAllMessage">All</p>
<p style="margin-left:10px;cursor: pointer;color:#9c9a97;" id="all_chat_button" <p style="margin-left:10px;cursor: pointer;color:#9c9a97;" id="all_chat_button"
@ -89,62 +128,96 @@ PosMsgView.template = xml`
<p style="margin-left:10px;cursor: pointer;color:#9c9a97;" id="all_channels_button" <p style="margin-left:10px;cursor: pointer;color:#9c9a97;" id="all_channels_button"
t-on-click="_onClickAllChannels">Channels</p> t-on-click="_onClickAllChannels">Channels</p>
</div> </div>
<hr/> <span t-if="state.counts.all > 0"
<div id="all_message"> style="position:absolute;right:220px;top:-18px;background:#2196F3;color:white;border-radius:50%;
<t t-foreach="state.data" t-as="data" t-key="data['id']"> width:18px;height:18px;font-size:10px;text-align:center;line-height:18px;"
t-esc="state.counts.all"/>
<span t-if="state.counts.chat > 0"
style="position:absolute;right:267px;top:-19px;background:#04AA6D;color:white;border-radius:50%;
width:18px;height:18px;font-size:10px;text-align:center;line-height:18px;"
t-esc="state.counts.chat"/>
<span t-if="state.counts.channels > 0"
style="position:absolute;right:302px;top:-19px;background:#ffeb3b;color:black;border-radius:50%;
width:18px;height:18px;font-size:10px;text-align:center;line-height:18px;"
t-esc="state.counts.channels"/>
</div>
<hr/>
<div id="all_message">
<t t-foreach="state.data" t-as="data" t-key="data.id">
<div style="background-color: #e7f3fe;border-left: 6px solid #2196F3; <div style="background-color: #e7f3fe;border-left: 6px solid #2196F3;
margin-bottom: 15px;padding: 4px 12px;display:flex;cursor:pointer;" t-att-value="data['id']" margin-bottom: 15px;padding: 4px 12px;display:flex;cursor:pointer;position:relative;" t-att-value="data.id"
t-on-click="_onClickToMessage"> t-on-click="_onClickToMessage">
<div style="width:30px"> <div style="width:30px">
<t t-if="data['type'] == 'channel'"> <t t-if="data.type == 'channel'">
<i style="margin:40%" class="fa fa-users"/> <i style="margin:40%" class="fa fa-users"/>
</t> </t>
<t t-else=""> <t t-elif="data.type == 'sms_failure'">
<i style="margin:40%" class="fa fa-user"/> <i style="margin:40%" class="fa fa-exclamation-triangle"/>
</t> </t>
</div> <t t-else="">
<i style="margin:40%" class="fa fa-user"/>
</t>
</div>
<div style="margin-left: 20px;width: 250px"> <div style="margin-left: 20px;width: 250px">
<span t-esc="data['name']"/> <div style="display:flex;justify-content:space-between;">
<br/> <span t-esc="data.name"/>
<small style="color:#9c9a97;" t-raw="data['message_body']"/> <t t-if="data.count > 0">
<span style="background-color:#2196F3;color:white;border-radius:50%;
width:18px;height:18px;font-size:10px;text-align:center;
line-height:18px;" t-esc="data.count"/>
</t>
</div> </div>
<small style="color:#9c9a97; white-space: pre-line;" t-raw="data.message_body"/>
</div>
</div> </div>
</t> </t>
</div> </div>
<div id="all_chat" style="display:none"> <div id="all_chat" style="display:none">
<t t-foreach="state.data" t-as="data" t-key="data['id']"> <t t-foreach="state.data" t-as="data" t-key="data.id">
<t t-if="data['type'] == 'chat'"> <t t-if="data.type == 'chat'">
<div style="background-color: #ddffdd; border-left: 6px solid #04AA6D; <div style="background-color: #ddffdd;border-left: 6px solid #04AA6D;
margin-bottom: 15px;padding: 4px 12px;display:flex;cursor:pointer;" t-att-value="data['id']" margin-bottom: 15px;padding: 4px 12px;display:flex;cursor:pointer;position:relative;" t-att-value="data.id"
t-on-click="_onClickToMessage"> t-on-click="_onClickToMessage">
<div style="width:30px"> <div style="width:30px">
<i style="margin:8px" class="fa fa-user"/> <i style="margin:8px" class="fa fa-user"/>
</div> </div>
<div style="margin-left: 20px;width: 250px"> <div style="margin-left: 20px;width: 250px">
<span t-esc="data['name']"/> <div style="display:flex;justify-content:space-between;">
<br/> <span t-esc="data.name"/>
<small style="color:#9c9a97;" t-raw="data['message_body']"/> <t t-if="data.count > 0">
<span style="background-color:#04AA6D;color:white;border-radius:50%;
width:18px;height:18px;font-size:10px;text-align:center;
line-height:18px;" t-esc="data.count"/>
</t>
</div> </div>
<small style="color:#9c9a97; white-space: pre-line;" t-raw="data.message_body"/>
</div> </div>
</t> </div>
</t> </t>
</div> </t>
<div id="all_channels" style="display:none"> </div>
<t t-foreach="state.data" t-as="data" t-key="data['id']"> <div id="all_channels" style="display:none">
<t t-if="data['type'] == 'channel'"> <t t-foreach="state.data" t-as="data" t-key="data.id">
<div style="background-color: #ffffcc;border-left: 6px solid #ffeb3b; <t t-if="data.type == 'channel'">
margin-bottom: 15px;padding: 4px 12px;display:flex;cursor:pointer;" t-att-value="data['id']" <div style="background-color: #ffffcc;border-left: 6px solid #ffeb3b;
t-on-click="_onClickToMessage"> margin-bottom: 15px;padding: 4px 12px;display:flex;cursor:pointer;position:relative;" t-att-value="data.id"
<div style="width:30px"> t-on-click="_onClickToMessage">
<i style="margin:8px" class="fa fa-users"/> <div style="width:30px">
</div> <i style="margin:8px" class="fa fa-users"/>
<div style="margin-left: 20px;width: 250px"> </div>
<span t-esc="data['name']"/> <div style="margin-left: 20px;width: 250px">
<br/> <div style="display:flex;justify-content:space-between;">
<small style="color:#9c9a97;" t-raw="data['message_body']"/> <span t-esc="data.name"/>
<t t-if="data.count > 0">
<span style="background-color:#ffeb3b;color:black;border-radius:50%;
width:18px;height:18px;font-size:10px;text-align:center;
line-height:18px;" t-esc="data.count"/>
</t>
</div> </div>
<small style="color:#9c9a97; white-space: pre-line;" t-raw="data.message_body"/>
</div> </div>
</t> </div>
</t> </t>
</div> </t>
</div>` </div>
</div>`;

69
pos_chatter/static/src/js/pos_systray_icon.js
View File

@ -1,23 +1,68 @@
/** @odoo-module **/ /** @odoo-module **/
import { Component } from "@odoo/owl"; import { Component, useRef, onWillUnmount, useState } from "@odoo/owl";
import { mount } from "@odoo/owl"; import { mount } from "@odoo/owl";
import { Navbar } from "@point_of_sale/app/navbar/navbar"; import { Navbar } from "@point_of_sale/app/navbar/navbar";
import { patch } from "@web/core/utils/patch"; import { patch } from "@web/core/utils/patch";
import { PosMsgView } from "./pos_msg_view" import { PosMsgView } from "./pos_msg_view";
import { useRef} from "@odoo/owl"; import { jsonrpc } from "@web/core/network/rpc_service";
patch(Navbar.prototype, { patch(Navbar.prototype, {
setup() { setup() {
super.setup(); super.setup();
this.message = useRef('root') this.message = useRef('root');
}, this.state = useState({
onClick(ev) { messageCount: 0,
if($(".pos_systray_template").length == 0){ });
this.schedule_dropdown = mount(PosMsgView, document.body) this.schedule_dropdown = null;
}else if($(".pos_systray_template").length > 0){ this.refreshInterval = null;
this.schedule_dropdown.then(function(res){
res.__owl__.remove() // Initial fetch
}) this.fetchMessageCount();
// Set up interval for refreshing every 5 seconds
this.setupRefreshInterval();
// Clean up interval on component destruction
onWillUnmount(() => {
if (this.refreshInterval) {
clearInterval(this.refreshInterval);
}
});
},
setupRefreshInterval() {
// Refresh every 5 seconds (5000 milliseconds)
this.refreshInterval = setInterval(() => {
this.fetchMessageCount();
}, 5000);
},
fetchMessageCount() {
const self = this;
jsonrpc("/pos_systray/message_data").then((data) => {
const message_list = data.map((message) => ({
id: message.id,
type: message.type,
name: message.name,
message_body: new DOMParser().parseFromString(message.message_body, "text/html").documentElement.textContent,
count: message.count || 0,
}));
const totalCount = message_list.reduce((sum, msg) => sum + msg.count, 0);
self.state.messageCount = totalCount;
}).catch((error) => {
console.error("Failed to fetch message count:", error);
});
},
onClick() {
const systrayElements = document.querySelectorAll(".pos_systray_template");
if (systrayElements.length === 0) {
this.schedule_dropdown = mount(PosMsgView, document.body);
} else if (this.schedule_dropdown) {
this.schedule_dropdown.then((res) => {
res.__owl__.remove();
this.schedule_dropdown = null;
});
} }
}, },
}); });

7
pos_chatter/static/src/xml/pos_systray_icon.xml
View File

@ -6,8 +6,13 @@
<xpath expr="//div[hasclass('status-buttons')]" position="inside"> <xpath expr="//div[hasclass('status-buttons')]" position="inside">
<div class="ticket-button" id="pos_systray_chatter_icon" <div class="ticket-button" id="pos_systray_chatter_icon"
t-att-class="{ highlight: props.isTicketScreenShown }" t-att-class="{ highlight: props.isTicketScreenShown }"
t-on-click="onClick"> t-on-click="onClick" style="cursor: pointer; position: relative;">
<i class="fa fa-comments"/> <i class="fa fa-comments"/>
<!-- Message count badge -->
<t t-if="state.messageCount > 0">
<span style="position: absolute; top: 4px; right: 7px; background: #ff0000; color: white; border-radius: 50%; width: 18px; height: 18px; font-size: 10px; text-align: center; line-height: 18px;"
t-esc="state.messageCount"/>
</t>
</div> </div>
</xpath> </xpath>
</t> </t>

Write Preview
Loading…
Cancel
Save