mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2025-01-19 14:54:00 +08:00
feat: 增加终端的网络延迟显示
This commit is contained in:
parent
6fb1e690aa
commit
750a2a445e
@ -18,9 +18,17 @@
|
|||||||
>
|
>
|
||||||
<template #label>
|
<template #label>
|
||||||
<span class="custom-tabs-label">
|
<span class="custom-tabs-label">
|
||||||
<el-icon style="margin-top: 1px" color="#67C23A" v-if="item.status === 'online'">
|
<span
|
||||||
|
v-if="item.status === 'online'"
|
||||||
|
:style="`color: ${
|
||||||
|
item.latency < 100 ? '#69db7c' : item.latency < 300 ? '#f59f00' : '#d9480f'
|
||||||
|
}; display: inline-flex; align-items: center`"
|
||||||
|
>
|
||||||
|
<span> {{ item.latency }} ms </span>
|
||||||
|
<el-icon>
|
||||||
<circleCheck />
|
<circleCheck />
|
||||||
</el-icon>
|
</el-icon>
|
||||||
|
</span>
|
||||||
<el-button
|
<el-button
|
||||||
v-if="item.status === 'closed'"
|
v-if="item.status === 'closed'"
|
||||||
icon="Refresh"
|
icon="Refresh"
|
||||||
@ -328,6 +336,7 @@ const onConnTerminal = async (title: string, wsID: number, isLocal?: boolean) =>
|
|||||||
title: title,
|
title: title,
|
||||||
wsID: wsID,
|
wsID: wsID,
|
||||||
status: res.data ? 'online' : 'closed',
|
status: res.data ? 'online' : 'closed',
|
||||||
|
latency: 0,
|
||||||
});
|
});
|
||||||
terminalValue.value = tabIndex;
|
terminalValue.value = tabIndex;
|
||||||
if (!res.data && isLocal) {
|
if (!res.data && isLocal) {
|
||||||
@ -348,6 +357,7 @@ function syncTerminal() {
|
|||||||
for (const terminal of terminalTabs.value) {
|
for (const terminal of terminalTabs.value) {
|
||||||
if (ctx && ctx.refs[`t-${terminal.index}`][0]) {
|
if (ctx && ctx.refs[`t-${terminal.index}`][0]) {
|
||||||
terminal.status = ctx.refs[`t-${terminal.index}`][0].isWsOpen() ? 'online' : 'closed';
|
terminal.status = ctx.refs[`t-${terminal.index}`][0].isWsOpen() ? 'online' : 'closed';
|
||||||
|
terminal.latency = ctx.refs[`t-${terminal.index}`][0].getLatency();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -35,6 +35,7 @@ const termReady = ref(false);
|
|||||||
const terminalSocket = ref<WebSocket>();
|
const terminalSocket = ref<WebSocket>();
|
||||||
const term = ref<Terminal>();
|
const term = ref<Terminal>();
|
||||||
const heartbeatTimer = ref<number>();
|
const heartbeatTimer = ref<number>();
|
||||||
|
const latency = ref(0);
|
||||||
|
|
||||||
const readyWatcher = watch(
|
const readyWatcher = watch(
|
||||||
() => webSocketReady.value && termReady.value,
|
() => webSocketReady.value && termReady.value,
|
||||||
@ -61,7 +62,7 @@ const onWSReceive = (message: MessageEvent) => {
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case 'heartbeat': {
|
case 'heartbeat': {
|
||||||
console.debug('latency', new Date().getTime() - wsMsg.timestamp, 'ms');
|
latency.value = new Date().getTime() - wsMsg.timestamp;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -225,6 +226,7 @@ defineExpose({
|
|||||||
onClose,
|
onClose,
|
||||||
isWsOpen,
|
isWsOpen,
|
||||||
onSendMsg,
|
onSendMsg,
|
||||||
|
getLatency: () => latency.value,
|
||||||
});
|
});
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
|
Loading…
Reference in New Issue
Block a user