fixed mcp queue to use websockets

resources/views/app/patient/partials/mcp-queue.blade.php

@@ -21,17 +21,12 @@
         window.queueComponent = new Vue({
             el: '#queueComponent',
             data: {
-                items: []
-            },
-            mounted: function() {
-                let self = this;
-                this.refresh();
-                window.setInterval(function() {
-                    self.refresh();
-                }, 15000); // once in 15 seconds
+                items: [],
+                socketClient: null,
             },
             methods: {
                 refresh: function() {
+                    console.log("Refreshing");
                     let self = this;
                     $.get('/patients-in-queue', function(_data) {
                         self.items = _data;
@@ -54,6 +49,33 @@
                         }
                     }, 'json');
                 }
+            },
+            mounted:function(){
+                let self = this;
+                self.refresh();
+                window.setInterval(function() {
+                    self.refresh();
+                }, 15000); // once in 15 seconds
+                let socket = new SockJS("{{ config('app.backend_ws_url') }}");
+                self.socketClient = Stomp.over(socket);
+                self.socketClient.connect({}, (frame) => {
+
+                    self.socketClient.send("/app/register", {},     // register self
+                        JSON.stringify({
+                            sessionKey: '{{$performer->session_key}}'
+                        })
+                    );
+
+                    self.socketClient.subscribe("/user/topic/newMcpRequest", function(message) {
+                        console.log("Received new mcp request: ", message);
+                        self.refresh();
+                    }); 
+
+                    self.socketClient.subscribe("/user/topic/removeMcpRequest", function(message) {
+                        console.log("An mcp request has been removedxxxx: ", message);
+                        self.refresh();
+                    });
+                });
             }
         });
     })();

resources/views/layouts/template.blade.php

@@ -310,24 +310,26 @@
                 })
             );
 
-            window.socketClient.subscribe("/user/topic/newMcpRequest", function(message) {
-                console.log("Received new mcp request: ", message);
-                //TODO: Update the mcp queue on the DOM
-            }); // once in 15 seconds
-
-            window.socketClient.subscribe("/user/topic/removeMcpRequest", function(message) {
-                console.log("An mcp request has been removed: ", message);
-                //TODO: Update the mcp queue on the DOM
-            });
-
             window.socketClient.subscribe("/user/topic/myCurrentProClientWork", function(message) {
                 console.log("You have a client pro work: ", message);
                 $.get('/current-work', function(_data) {
                     $('.current-work').html(_data);
-                    initFastLoad($('.current-work'));
+                    //initFastLoad($('.current-work'));
+                    fastReload();
+                });
+            });
+
+            window.socketClient.subscribe("/user/topic/killMyCurrentProClientWork", function(message) {
+                console.log("You have killed your current pro client work: ", message);
+                $.get('/current-work', function(_data) {
+                    $('.current-work').html(_data);
+                    //initFastLoad($('.current-work'));
+                    fastReload();
                 });
             });
 
+            
+
         });
     </script>
 </body>