web socket แจ้งหลัง clone เสร็จ

src/modules/02_organization/views/main.vue

@@ -178,7 +178,9 @@ watch(
  * ดึงข้อมูลโครงสร้างและรายการประวัติโครงสร้าง
  */
 onMounted(async () => {
-  store.typeOrganizational = "current";
+  const type = localStorage.getItem('org_type') ?? "current";
+  store.typeOrganizational = type;
+  localStorage.removeItem('org_type');
   await Promise.all([fetchOrganizationActive(), fetchHistory()]);
 });
 </script>

src/stores/socket.ts

@@ -1,11 +1,10 @@
 import { defineStore } from "pinia";
 import { Notify } from "quasar";
-
 import { io, Socket } from "socket.io-client";
 
 import config from "@/app.config";
 import { getToken } from "@/plugins/auth";
-
+import { useOrganizational } from "@/modules/02_organization/store/organizational";
 interface sockeBackup {
   message: string;
   success?: boolean;
@@ -13,6 +12,7 @@ interface sockeBackup {
 
 export const useSocketStore = defineStore("socket", () => {
   let socket: Socket;
+  const storeOrg = useOrganizational();
 
   async function init() {
     socket = io(new URL(config.API.socket).origin, {
@@ -23,6 +23,24 @@ export const useSocketStore = defineStore("socket", () => {
       let body: sockeBackup = JSON.parse(payload);
       notifyStatus(body.message, body.success);
     });
+
+    socket.on("send-create-draft-org", (payload) => {
+      let body: sockeBackup = JSON.parse(payload);
+      if (body.message == "ระบบกำลังทำการสร้างแบบร่างโครงสร้างหน่วยงาน") {
+        notifyStatus(body.message, body.success);
+      } else {
+        notifyStatusOrg("draft", body.message, body.success);
+      }
+    });
+
+    socket.on("send-publish-org", (payload) => {
+      let body: sockeBackup = JSON.parse(payload);
+      if (body.message == "ระบบกำลังทำการเผยแพร่โครงสร้างหน่วยงาน") {
+        notifyStatus(body.message, body.success);
+      } else {
+        notifyStatusOrg("current", body.message, body.success);
+      }
+    });
   }
 
   function notifyStatus(message: string, success?: boolean) {
@@ -42,6 +60,53 @@ export const useSocketStore = defineStore("socket", () => {
     });
   }
 
+  function fnStyleNotiOrg() {
+    if (document.getElementById("notify-link-style")) return;
+    const style = document.createElement("style");
+    style.id = "notify-link-style";
+    style.textContent = `
+    .notify-link {
+      padding: 4px 8px;
+      border-radius: 4px;
+      text-decoration: none;
+      color: #fff;
+      border: 1px solid #fff;
+      transition: all 0.3s;
+      cursor: pointer;
+      margin:0 0 0 5px;
+    }
+    .notify-link:hover {
+      background-color: #ffffff;
+      color: #21BA45;
+    }
+  `;
+    document.head.appendChild(style);
+  }
+  (window as any).resetOrgPage = (type: string) => {
+    localStorage.setItem("org_type", type);
+    window.location.reload();
+  };
+  function notifyStatusOrg(type: string, message: string, success?: boolean) {
+    fnStyleNotiOrg();
+    Notify.create({
+      message: `${message} <a href="#" onclick="window.resetOrgPage('${type}')" class="notify-link">${
+        type == "draft" ? "ไปยังแบบร่าง" : "ไปยังปัจจุบัน"
+      }</a>`,
+      html: true,
+      group: false,
+      type: success === undefined || success ? "positive" : "negative",
+      position: "top",
+      timeout: 0,
+      actions: [
+        {
+          icon: "close",
+          color: "white",
+          round: true,
+        },
+      ],
+    });
+  }
+
   init();
 
   return {};