web_dist/src/App.vue

<template>
  <router-view />
  <SocketDialog v-if="socketErrDialog" />
  <progress-bar />
  <CyDialogV2 />
  <BackgroundTask />
</template>

<script setup lang="jsx">
import { setCallback, socketErrDialog } from "@/utils/websocket";
import { ElMessageBox, ElNotification } from "element-plus";
import sleep from "@/utils/sleep";
import SocketDialog from "@/components/xiao-chan/websocket/SocketDialog.vue";
import router from "@/router";
import ProgressBar from "@/components/xiao-chan/progress-bar/ProgressBar.vue";
import { formatDateToStr } from "@/utils/moment-utils";
import { ElLink } from "element-plus";
import { CyMessageBox } from "@/utils/cy-message-box";
import { useProgressBarStore } from "@/pinia/progress-bar-store";
import { useUserStore } from "@/pinia/user-store";
import { useSystemStore } from "@/pinia/system-store";
import useChangeToken from "@/utils/cy-use/useChangeToken";
import CyDialogV2 from "@/components/cy/CyDialog/index.vue";
import BackgroundTask from "@/layout/HeaderV2/BackgroundTask.vue";
import { useYfGroupStore } from "@/pinia/use-yf-group";
import { setupAutoLogoutOnClose } from "@/utils/auto-logout-on-close";

const progressBarStore = useProgressBarStore();
const systemStore = useSystemStore();

useChangeToken();

progressBarStore.initialize({
  title: "数据上传",
  isOpen: false,
  abnormalClosing: false,
});

function avatarNotification(data) {
  const message = (
    <div>
      <div>科室： {data.deptName}</div>
      <div>{data.msg}</div>
    </div>
  );

  ElNotification({
    icon: (
      <img
        src={data.avatar}
        style={{ width: "32px", height: "32px", borderRadius: "16px" }}
        alt=""
      />
    ),
    title: data.title,
    message: message,
    dangerouslyUseHTMLString: true,
    duration: 0,
  });
}

function checkTheCallbacks({ data, isAdd }) {
  const message = (
    <table style="width: 100%">
      <tbody>
        <tr>
          <td style="padding-right: 8px">患者:</td>
          <td>{data.patientName}</td>
        </tr>
        <tr>
          <td style="padding-right: 8px">检查名称:</td>
          <td>{data.reqName}</td>
        </tr>
        <tr>
          <td style="padding-right: 8px"> 报告时间:</td>
          <td>{formatDateToStr(data.reportTime)}</td>
        </tr>
        <tr>
          <td colspan="2" style="text-ali">
            <ElLink
              type="primary"
              target="_blank"
              href={`http://172.16.32.122:8099/mReport?REQUISITIONID=${data.reqNo}`}
            >
              查看图像
            </ElLink>
          </td>
        </tr>
      </tbody>
    </table>
  );

  ElNotification({
    title: isAdd ? "检查结果返回" : "修改检查结果",
    message: message,
    dangerouslyUseHTMLString: true,
    type: "success",
    position: "bottom-right",
    duration: 0,
  });
}

// function systemNotification(data) {
//   if (data.count) {
//     systemStore.addUnreadMessageCount(data.count);
//   }
//
//   if (data.refreshDelay) {
//     sleep(data.refreshDelay).then(() => {
//       location.reload();
//     });
//   }
//
//   if (data?.donTDisplay) {
//     return;
//   }
//
//   ElNotification({
//     title: data.title ?? "新消息",
//     message: h(
//       "pre",
//       {
//         class: "message_pre",
//       },
//       data.message
//     ),
//     dangerouslyUseHTMLString: true,
//     type: data.type ?? "warning",
//     duration: 0,
//     position: 'bottom - right',
//   });
// }

let currentNotification;
function systemNotification(data) {
  if (data.count) {
    systemStore.addUnreadMessageCount(data.count);
  }

  if (data.refreshDelay) {
    sleep(data.refreshDelay).then(() => {
      location.reload();
    });
  }

  if (data?.donTDisplay) {
    return;
  }

  if (currentNotification) {
    currentNotification.close();
  }

  currentNotification = ElNotification({
    title: data.title?? "新消息",
    message: h(
        "pre",
        {
          class: "message_pre",
        },
        data.message
    ),
    dangerouslyUseHTMLString: true,
    type: data.type?? "warning",
    duration: 0,
    position: 'bottom - right'
  });
}


onMounted(() => {
  useYfGroupStore().init();
  setCallback("refreshToken", data => {
    useUserStore().setToken(data.token);
  });

  setCallback("sidSingle", async () => {
    localStorage.clear();
    await router.push("/login");
    await ElMessageBox.alert(
      "您的账号已在其他地方登陆，如需修改密码请在个人中心中修改。",
      "提示",
      {
        type: "warning",
      }
    );
  });

  setCallback("criticalValue", data => {
    CyMessageBox.confirm({
      title: "患者危急值",
      message: data.message,
      type: "error",
      confirmButtonText: "前往处理",
      cancelButtonText: "关闭",
    })
      .then(() => {
        router.push(`/inpatient/zhuYuanYiSheng/criticalValue?id=${data.id}`);
      })
      .catch(() => {});
  });

  setCallback("systemNotification", systemNotification);
  setCallback("checkTheCallbacks", checkTheCallbacks);
  setCallback("avatarNotification", avatarNotification);

  // 设置浏览器关闭时自动退出账号
  const cleanupAutoLogout = setupAutoLogoutOnClose();
  
  // 组件卸载时清理事件监听器
  onUnmounted(cleanupAutoLogout);
});
</script>

<style lang="scss">
.message_pre {
  font-weight: normal;
  margin: 0;
  font-size: 14px;
  line-height: 1;
  white-space: pre-wrap;
}
</style>