Implement chat logic in vue

luckydiamond/src/assets/js/chat/ChatLogic.js

@@ -40,7 +40,6 @@ export function SendMessageToChat(message) {
     try {
         const data = {
             SpUserName: GetCookie("SpUserName"),
-            SearchToken: GetCookie("SearchToken"),
             Message: message
         };
 

luckydiamond/src/components/ChatComponent.vue

@@ -49,14 +49,6 @@ export default {
   },
   methods: {
     ClaimDatamsg(msg) {
-      const MsgUser = {
-        id: this.id + 1,
-        msg: msg[0],
-        username: msg[1],
-        icon: msg[2]
-      }
-
-      this.array.push(MsgUser)
 
       SendMessageToChat(msg[0]);
 
@@ -67,15 +59,22 @@ export default {
   },
   mounted() {
     eventBus.on('dataChat', (dataFromServer) => {
+      try {
+      // Attempt to parse the JSON string
+      const dataObject = JSON.parse(dataFromServer);
+      let imageUrl = "https://avatar.spworlds.ru/face/55/" + dataObject.SpUserName;
+
       const MsgUser = {
         id: this.id + 1,
-        msg: dataFromServer,
+        msg: dataObject.Message,
-        username: dataFromServer,
+        username: dataObject.SpUserName,
-        icon: dataFromServer
+        icon: imageUrl
-      }
+      };
 
-      this.array.push(MsgUser)
+      this.array.push(MsgUser);
-      console.log(dataFromServer)
+    } catch (error) {
+      console.error('Error parsing JSON data:', error);
+    }
     })
   }
 }

luckydiamond/src/components/HeaderComponent.vue

@@ -1,7 +1,6 @@
 
 <script>
 import "@/assets/css/ComponentsStyles/header.css";
-// import { GetAuthCodeFromCurrentPath } from '@/assets/js/authentication/LoggingMiddleware.js';
 import { LogIn } from "@/assets/js/authentication/AuthService.js";
 import { GetCurrentMoney } from "@/assets/js/rest/RestMethods.js";
 import {