refactor: 优化 SSE 连接及在线用户展示逻辑
This commit is contained in:
@@ -11,9 +11,6 @@ import type {
|
|||||||
MobileUpdateForm,
|
MobileUpdateForm,
|
||||||
EmailUpdateForm,
|
EmailUpdateForm,
|
||||||
OptionItem,
|
OptionItem,
|
||||||
UserEventQueryParams,
|
|
||||||
UserEventItem,
|
|
||||||
LoginDeviceItem,
|
|
||||||
} from "@/types/api";
|
} from "@/types/api";
|
||||||
|
|
||||||
const USER_BASE_URL = "/api/v1/users";
|
const USER_BASE_URL = "/api/v1/users";
|
||||||
|
|||||||
@@ -135,6 +135,13 @@ function createSseConnection(options: UseSseOptions = {}) {
|
|||||||
eventSource.onerror = handleError;
|
eventSource.onerror = handleError;
|
||||||
eventSource.onmessage = handleMessage;
|
eventSource.onmessage = handleMessage;
|
||||||
|
|
||||||
|
// 注册所有已订阅的事件处理器
|
||||||
|
eventHandlers.forEach((_, eventName) => {
|
||||||
|
if (eventName !== "message") {
|
||||||
|
eventSource!.addEventListener(eventName, handleCustomEvent(eventName) as EventListener);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
log("正在建立 SSE 连接...");
|
log("正在建立 SSE 连接...");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -131,16 +131,13 @@
|
|||||||
<div class="flex-x-between">
|
<div class="flex-x-between">
|
||||||
<span class="text-xs font-medium text-[--el-text-color-secondary]">在线用户</span>
|
<span class="text-xs font-medium text-[--el-text-color-secondary]">在线用户</span>
|
||||||
<el-tag
|
<el-tag
|
||||||
|
size="small"
|
||||||
:type="
|
:type="
|
||||||
isConnected ? 'success' : connectionState === 'CONNECTING' ? 'warning' : 'danger'
|
isConnected ? 'success' : connectionState === 'CONNECTING' ? 'warning' : 'danger'
|
||||||
"
|
"
|
||||||
size="small"
|
effect="plain"
|
||||||
|
class="inline-flex"
|
||||||
>
|
>
|
||||||
<el-icon class="mr-1">
|
|
||||||
<Loading v-if="!isConnected && connectionState === 'CONNECTING'" />
|
|
||||||
<CircleCheck v-else-if="isConnected" />
|
|
||||||
<CircleClose v-else />
|
|
||||||
</el-icon>
|
|
||||||
SSE {{ sseStatusText }}
|
SSE {{ sseStatusText }}
|
||||||
</el-tag>
|
</el-tag>
|
||||||
</div>
|
</div>
|
||||||
@@ -390,7 +387,7 @@ import type { VisitStatsDetail, VisitTrendDetail } from "@/types/api";
|
|||||||
import { useUserStore } from "@/store/modules/user";
|
import { useUserStore } from "@/store/modules/user";
|
||||||
import { formatGrowthRate } from "@/utils";
|
import { formatGrowthRate } from "@/utils";
|
||||||
import { useTransition, useDateFormat } from "@vueuse/core";
|
import { useTransition, useDateFormat } from "@vueuse/core";
|
||||||
import { CircleCheck, CircleClose, Loading, Clock, Menu } from "@element-plus/icons-vue";
|
import { Clock, Menu } from "@element-plus/icons-vue";
|
||||||
import { useOnlineCount, useRecentMenus } from "@/composables";
|
import { useOnlineCount, useRecentMenus } from "@/composables";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|||||||
Reference in New Issue
Block a user