Vuejs unread messages?

Question

Vue.js

How to find out if the interlocutor has our dialogue open with him, so as not to assign the unread status to the message sent to him if he has the same dialogue open?

if (this.dialogSelect > 0){
    window.Echo.private('chat.' + this.dialogSelect)
        .listen('DialogMessage',({data,user_id}) => {
            this.messages.push({
                avatar: this.userAuth.avatar,
                fullname: this.userAuth.fullname,
                user_id: this.userAuth.id,
                replay: data
            });
            $('.contact-list__items[data-id="'+this.dialogSelect+'"]').find('.typing').removeClass('active');
            $('.chat--messages__wrapper').scrollTop($('.chat--messages__wrapper').prop('scrollHeight'));
        })
        .listenForWhisper('typing', (e) => {
            console.log(e);
            $('.contact-list__items[data-id="'+this.dialogSelect+'"]').find('.typing').addClass('active');

            if (this.typingTimer) clearTimeout(this.typingTimer);

            this.typingTimer = setTimeout(() => {
                $('.contact-list__items[data-id="'+this.dialogSelect+'"]').find('.typing').removeClass('active');
            }, 2000);
        });
}

Answer 1

In any case, assign the status Not sent, Delivered, Read. here you need a server and technology to update data without a WebSocket, LongPooling request.