jssz-meeting-component 1.2.0 → 1.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.js +1244 -1072
- package/dist/index.umd.js +1 -1
- package/dist/src/components/meeting.vue.d.ts.map +1 -1
- package/dist/src/internal/meeting-header.vue.d.ts.map +1 -1
- package/dist/src/utils/eventBus.d.ts +2 -0
- package/dist/src/utils/eventBus.d.ts.map +1 -1
- package/dist/src/utils/meeting-message-handlers.d.ts.map +1 -1
- package/dist/src/utils/srtc.d.ts.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -20339,7 +20339,7 @@ const MEETING_BROADCAST_TOPIC = "/meeting";
|
|
|
20339
20339
|
const MEETING_SERVER_TOPIC = "/meeting/server";
|
|
20340
20340
|
const DEFAULT_MQTT_PATH = "/mqtt";
|
|
20341
20341
|
const DEFAULT_REQUEST_TIMEOUT_MS = 15e3;
|
|
20342
|
-
const MQTT_CLIENT_INSTANCE_STORAGE_KEY = "JS_MQTT_CLIENT_INSTANCE_ID";
|
|
20342
|
+
const MQTT_CLIENT_INSTANCE_STORAGE_KEY$1 = "JS_MQTT_CLIENT_INSTANCE_ID";
|
|
20343
20343
|
let runtimeContext = null;
|
|
20344
20344
|
let offBroadcastMessage = null;
|
|
20345
20345
|
let offResponseMessage = null;
|
|
@@ -20422,12 +20422,12 @@ function buildResponseTopic(currentDevice) {
|
|
|
20422
20422
|
}
|
|
20423
20423
|
function getBrowserMqttInstanceId() {
|
|
20424
20424
|
try {
|
|
20425
|
-
const cached = sessionStorage.getItem(MQTT_CLIENT_INSTANCE_STORAGE_KEY);
|
|
20425
|
+
const cached = sessionStorage.getItem(MQTT_CLIENT_INSTANCE_STORAGE_KEY$1);
|
|
20426
20426
|
if (cached) {
|
|
20427
20427
|
return cached;
|
|
20428
20428
|
}
|
|
20429
20429
|
const nextId = typeof crypto !== "undefined" && typeof crypto.randomUUID === "function" ? crypto.randomUUID().replace(/-/g, "").slice(0, 12) : Math.random().toString(36).slice(2, 14);
|
|
20430
|
-
sessionStorage.setItem(MQTT_CLIENT_INSTANCE_STORAGE_KEY, nextId);
|
|
20430
|
+
sessionStorage.setItem(MQTT_CLIENT_INSTANCE_STORAGE_KEY$1, nextId);
|
|
20431
20431
|
return nextId;
|
|
20432
20432
|
} catch {
|
|
20433
20433
|
return Math.random().toString(36).slice(2, 14);
|
|
@@ -36514,6 +36514,12 @@ function getCurrentMeetingTabId() {
|
|
|
36514
36514
|
}
|
|
36515
36515
|
return tabId;
|
|
36516
36516
|
}
|
|
36517
|
+
function setMeetingTabIdForWindow(targetWindow, tabId) {
|
|
36518
|
+
targetWindow.sessionStorage.setItem(TAB_ID_KEY, tabId);
|
|
36519
|
+
}
|
|
36520
|
+
function createMeetingTabId() {
|
|
36521
|
+
return createTabId();
|
|
36522
|
+
}
|
|
36517
36523
|
function getActiveMeetingOwner() {
|
|
36518
36524
|
try {
|
|
36519
36525
|
const raw = localStorage.getItem(ACTIVE_MEETING_OWNER_KEY);
|
|
@@ -37895,8 +37901,45 @@ async function joinRoom() {
|
|
|
37895
37901
|
const meetingInfo = JSON.parse(
|
|
37896
37902
|
sessionStorage.getItem("JS_MEETING_INFO") || "{}"
|
|
37897
37903
|
);
|
|
37898
|
-
|
|
37899
|
-
|
|
37904
|
+
try {
|
|
37905
|
+
await srtc.join(meetingInfo.meetingToken);
|
|
37906
|
+
await afterJoin();
|
|
37907
|
+
} catch (error) {
|
|
37908
|
+
await handleJoinRoomFailure(meetingInfo, error);
|
|
37909
|
+
throw error;
|
|
37910
|
+
}
|
|
37911
|
+
}
|
|
37912
|
+
async function handleJoinRoomFailure(meetingInfo, error) {
|
|
37913
|
+
console.error("加入 SRTC 频道失败", error);
|
|
37914
|
+
stopNetworkQualityMonitor();
|
|
37915
|
+
await cleanupSessionMediaState();
|
|
37916
|
+
if (meetingInfo == null ? void 0 : meetingInfo.meetingId) {
|
|
37917
|
+
try {
|
|
37918
|
+
await getMeetingLeave({
|
|
37919
|
+
meetingId: meetingInfo.meetingId,
|
|
37920
|
+
memberId: getUserId()
|
|
37921
|
+
});
|
|
37922
|
+
} catch (leaveError) {
|
|
37923
|
+
console.error("SDK 入频道失败后的离会补偿失败", leaveError);
|
|
37924
|
+
}
|
|
37925
|
+
}
|
|
37926
|
+
meetingStore$1.clearMembers();
|
|
37927
|
+
try {
|
|
37928
|
+
sessionStorage.removeItem(SELF_MEDIA_PREFS_KEY);
|
|
37929
|
+
} catch (_2) {
|
|
37930
|
+
}
|
|
37931
|
+
clearActiveMeetingOwnership(
|
|
37932
|
+
meetingInfo == null ? void 0 : meetingInfo.meetingId,
|
|
37933
|
+
getCurrentMeetingTabId()
|
|
37934
|
+
);
|
|
37935
|
+
sessionStorage.removeItem("JS_MEETING_INFO");
|
|
37936
|
+
sessionStorage.removeItem("joinTime");
|
|
37937
|
+
joinTime.value = 0;
|
|
37938
|
+
setCallStatus("end");
|
|
37939
|
+
closeMeeting();
|
|
37940
|
+
closeCall();
|
|
37941
|
+
logoutRoomAction();
|
|
37942
|
+
showNotification("加入音视频频道失败,已自动退出,请稍后重试", "error", 6e3);
|
|
37900
37943
|
}
|
|
37901
37944
|
async function afterJoin() {
|
|
37902
37945
|
const _joinTime = sessionStorage.getItem("joinTime");
|
|
@@ -38760,6 +38803,14 @@ function handleMeetingEvent(event, data) {
|
|
|
38760
38803
|
case "2018":
|
|
38761
38804
|
emitter.emit("injuryReport", data);
|
|
38762
38805
|
break;
|
|
38806
|
+
case "2020":
|
|
38807
|
+
console.log("2020", data);
|
|
38808
|
+
emitter.emit("onlineMember", data);
|
|
38809
|
+
break;
|
|
38810
|
+
case "2099":
|
|
38811
|
+
console.log("2099", data);
|
|
38812
|
+
emitter.emit("meetingEnd", data);
|
|
38813
|
+
break;
|
|
38763
38814
|
}
|
|
38764
38815
|
}
|
|
38765
38816
|
function installMeetingMessageHandlers() {
|
|
@@ -41478,584 +41529,499 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
|
|
|
41478
41529
|
}
|
|
41479
41530
|
});
|
|
41480
41531
|
const JSCall = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-e1585009"]]);
|
|
41481
|
-
const
|
|
41482
|
-
const
|
|
41483
|
-
const
|
|
41484
|
-
|
|
41485
|
-
|
|
41486
|
-
|
|
41487
|
-
|
|
41488
|
-
|
|
41489
|
-
|
|
41490
|
-
|
|
41491
|
-
|
|
41492
|
-
|
|
41493
|
-
|
|
41494
|
-
|
|
41495
|
-
|
|
41496
|
-
|
|
41497
|
-
|
|
41498
|
-
|
|
41499
|
-
const themeClass = computed(() => `theme-${props.theme || "dark"}`);
|
|
41500
|
-
ref(false);
|
|
41501
|
-
const handleCloseClick = async () => {
|
|
41502
|
-
showCloseConfirm.value = !showCloseConfirm.value;
|
|
41503
|
-
};
|
|
41504
|
-
const handleEndMeeting = () => {
|
|
41505
|
-
showCloseConfirm.value = false;
|
|
41506
|
-
emit("onChange", RoomModalSelectType.endClick);
|
|
41507
|
-
};
|
|
41508
|
-
const handleLeaveMeeting = () => {
|
|
41509
|
-
showCloseConfirm.value = false;
|
|
41510
|
-
emit("onChange", RoomModalSelectType.leaveClick);
|
|
41511
|
-
};
|
|
41512
|
-
return (_ctx, _cache) => {
|
|
41513
|
-
return openBlock(), createElementBlock("div", {
|
|
41514
|
-
class: normalizeClass(["js-dialog-header", themeClass.value])
|
|
41515
|
-
}, [
|
|
41516
|
-
createElementVNode("div", _hoisted_1$n, toDisplayString(meetingInfo.value.meetingName), 1),
|
|
41517
|
-
createElementVNode("div", _hoisted_2$l, [
|
|
41518
|
-
createElementVNode("div", {
|
|
41519
|
-
title: "最小化",
|
|
41520
|
-
onClick: _cache[0] || (_cache[0] = ($event) => emit("onChange", unref(RoomModalSelectType).minimizeClick))
|
|
41521
|
-
}, [
|
|
41522
|
-
createVNode(SvgIcon, {
|
|
41523
|
-
name: "MinimizeIcon",
|
|
41524
|
-
size: 16
|
|
41525
|
-
})
|
|
41526
|
-
]),
|
|
41527
|
-
createElementVNode("div", {
|
|
41528
|
-
ref_key: "closeRef",
|
|
41529
|
-
ref: closeRef,
|
|
41530
|
-
title: "关闭",
|
|
41531
|
-
onClick: handleCloseClick
|
|
41532
|
-
}, [
|
|
41533
|
-
createVNode(SvgIcon, {
|
|
41534
|
-
name: "CloseIcon",
|
|
41535
|
-
size: 17
|
|
41536
|
-
})
|
|
41537
|
-
], 512)
|
|
41538
|
-
]),
|
|
41539
|
-
createVNode(SmartPopup, {
|
|
41540
|
-
visible: showCloseConfirm.value,
|
|
41541
|
-
"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => showCloseConfirm.value = $event),
|
|
41542
|
-
trigger: closeRef.value,
|
|
41543
|
-
gap: 10
|
|
41544
|
-
}, {
|
|
41545
|
-
default: withCtx(() => [
|
|
41546
|
-
createElementVNode("div", {
|
|
41547
|
-
class: normalizeClass(["close-confirm-dropdown", themeClass.value])
|
|
41548
|
-
}, [
|
|
41549
|
-
unref(meState2).roleType == "1" ? (openBlock(), createElementBlock("div", {
|
|
41550
|
-
key: 0,
|
|
41551
|
-
class: "close-confirm-option danger",
|
|
41552
|
-
onClick: withModifiers(handleEndMeeting, ["stop"])
|
|
41553
|
-
}, " 结束会议 ")) : createCommentVNode("", true),
|
|
41554
|
-
createElementVNode("div", {
|
|
41555
|
-
class: "close-confirm-option simple",
|
|
41556
|
-
onClick: withModifiers(handleLeaveMeeting, ["stop"])
|
|
41557
|
-
}, " 离开会议 "),
|
|
41558
|
-
createElementVNode("div", {
|
|
41559
|
-
class: "close-confirm-option simple",
|
|
41560
|
-
onClick: _cache[1] || (_cache[1] = ($event) => showCloseConfirm.value = false)
|
|
41561
|
-
}, " 取消 ")
|
|
41562
|
-
], 2)
|
|
41563
|
-
]),
|
|
41564
|
-
_: 1
|
|
41565
|
-
}, 8, ["visible", "trigger"])
|
|
41566
|
-
], 2);
|
|
41567
|
-
};
|
|
41532
|
+
const HANDOFF_SOURCE_TAB_ID_KEY = "JS_MEETING_MQTT_HANDOFF_SOURCE_TAB_ID";
|
|
41533
|
+
const HANDOFF_TARGET_TAB_ID_KEY = "JS_MEETING_MQTT_HANDOFF_TARGET_TAB_ID";
|
|
41534
|
+
const HANDOFF_ID_KEY = "JS_MEETING_MQTT_HANDOFF_ID";
|
|
41535
|
+
const RECONNECT_SIGNAL_KEY = "JS_MEETING_MQTT_RECONNECT_SIGNAL";
|
|
41536
|
+
const TARGET_HEARTBEAT_KEY = "JS_MEETING_MQTT_HANDOFF_HEARTBEAT";
|
|
41537
|
+
const TARGET_TAB_STATUS_KEY = "JS_MEETING_NEW_TAB_STATUS";
|
|
41538
|
+
const TARGET_HEARTBEAT_INTERVAL_MS = 1e3;
|
|
41539
|
+
const RECONNECT_CHECK_DELAY_MS = 1500;
|
|
41540
|
+
const TARGET_TAB_STATUS_CLOSED = 0;
|
|
41541
|
+
const TARGET_TAB_STATUS_OPEN = 1;
|
|
41542
|
+
let installed = false;
|
|
41543
|
+
let closeSignalSent = false;
|
|
41544
|
+
let heartbeatTimer = null;
|
|
41545
|
+
let lastHandledReconnectSignalTs = 0;
|
|
41546
|
+
let leaveRequestSent = false;
|
|
41547
|
+
function createRandomId() {
|
|
41548
|
+
if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
|
|
41549
|
+
return crypto.randomUUID().replace(/-/g, "").slice(0, 12);
|
|
41568
41550
|
}
|
|
41569
|
-
|
|
41570
|
-
|
|
41571
|
-
|
|
41572
|
-
|
|
41573
|
-
|
|
41574
|
-
|
|
41575
|
-
|
|
41576
|
-
|
|
41577
|
-
|
|
41578
|
-
|
|
41579
|
-
|
|
41580
|
-
|
|
41581
|
-
|
|
41582
|
-
|
|
41583
|
-
|
|
41584
|
-
|
|
41585
|
-
|
|
41586
|
-
|
|
41587
|
-
}
|
|
41588
|
-
|
|
41589
|
-
|
|
41590
|
-
|
|
41591
|
-
|
|
41592
|
-
const
|
|
41593
|
-
const
|
|
41594
|
-
const
|
|
41595
|
-
|
|
41596
|
-
|
|
41597
|
-
|
|
41598
|
-
|
|
41599
|
-
|
|
41600
|
-
|
|
41601
|
-
|
|
41602
|
-
|
|
41603
|
-
|
|
41604
|
-
|
|
41605
|
-
|
|
41606
|
-
|
|
41607
|
-
|
|
41608
|
-
|
|
41609
|
-
|
|
41610
|
-
const
|
|
41611
|
-
|
|
41612
|
-
|
|
41613
|
-
const _hoisted_31$1 = { class: "popup-item-value" };
|
|
41614
|
-
const _hoisted_32$1 = {
|
|
41615
|
-
key: 1,
|
|
41616
|
-
class: "popup-empty"
|
|
41617
|
-
};
|
|
41618
|
-
const _sfc_main$o = /* @__PURE__ */ defineComponent({
|
|
41619
|
-
__name: "NetworkQualitySignal",
|
|
41620
|
-
props: {
|
|
41621
|
-
theme: { default: "dark" },
|
|
41622
|
-
size: { default: "default" },
|
|
41623
|
-
showText: { type: Boolean, default: false }
|
|
41624
|
-
},
|
|
41625
|
-
setup(__props) {
|
|
41626
|
-
const props = __props;
|
|
41627
|
-
const triggerRef = ref(null);
|
|
41628
|
-
const showPopup = ref(false);
|
|
41629
|
-
const advancedOpen = ref(false);
|
|
41630
|
-
const collapsedSections = ref({});
|
|
41631
|
-
const advancedDetails = ref();
|
|
41632
|
-
let detailTimer = null;
|
|
41633
|
-
const themeClass = computed(() => `theme-${props.theme}`);
|
|
41634
|
-
function formatValue(value, suffix = "", digits = 0) {
|
|
41635
|
-
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
41636
|
-
return `${value.toFixed(digits)}${suffix}`;
|
|
41637
|
-
}
|
|
41638
|
-
function formatMetricNumber(value, suffix = "", digits = 0) {
|
|
41639
|
-
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
41640
|
-
return `${value.toFixed(digits)}${suffix}`;
|
|
41641
|
-
}
|
|
41642
|
-
function formatBytes(value) {
|
|
41643
|
-
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
41644
|
-
if (value >= 1024 * 1024) return `${(value / (1024 * 1024)).toFixed(2)} MB`;
|
|
41645
|
-
if (value >= 1024) return `${(value / 1024).toFixed(1)} KB`;
|
|
41646
|
-
return `${value.toFixed(0)} B`;
|
|
41647
|
-
}
|
|
41648
|
-
function formatDimension(width, height) {
|
|
41649
|
-
if (!width || !height) return "--";
|
|
41650
|
-
return `${width} x ${height}`;
|
|
41651
|
-
}
|
|
41652
|
-
function formatLossRate(value) {
|
|
41653
|
-
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
41654
|
-
return `${value.toFixed(1)}%`;
|
|
41655
|
-
}
|
|
41656
|
-
function formatMos(value) {
|
|
41657
|
-
if (typeof value !== "number" || value <= 0 || Number.isNaN(value)) return "--";
|
|
41658
|
-
return value.toFixed(1);
|
|
41551
|
+
return Math.random().toString(36).slice(2, 14);
|
|
41552
|
+
}
|
|
41553
|
+
function safeSessionStorageGetItem(key) {
|
|
41554
|
+
try {
|
|
41555
|
+
return sessionStorage.getItem(key);
|
|
41556
|
+
} catch {
|
|
41557
|
+
return null;
|
|
41558
|
+
}
|
|
41559
|
+
}
|
|
41560
|
+
function safeLocalStorageSetItem(key, value) {
|
|
41561
|
+
try {
|
|
41562
|
+
localStorage.setItem(key, value);
|
|
41563
|
+
} catch {
|
|
41564
|
+
}
|
|
41565
|
+
}
|
|
41566
|
+
function safeLocalStorageGetItem(key) {
|
|
41567
|
+
try {
|
|
41568
|
+
return localStorage.getItem(key);
|
|
41569
|
+
} catch {
|
|
41570
|
+
return null;
|
|
41571
|
+
}
|
|
41572
|
+
}
|
|
41573
|
+
function getMeetingMqttHandoffContext() {
|
|
41574
|
+
const sourceTabId = safeSessionStorageGetItem(HANDOFF_SOURCE_TAB_ID_KEY) || "";
|
|
41575
|
+
const targetTabId = safeSessionStorageGetItem(HANDOFF_TARGET_TAB_ID_KEY) || "";
|
|
41576
|
+
const handoffId = safeSessionStorageGetItem(HANDOFF_ID_KEY) || "";
|
|
41577
|
+
if (!sourceTabId || !targetTabId || !handoffId) {
|
|
41578
|
+
return null;
|
|
41579
|
+
}
|
|
41580
|
+
return {
|
|
41581
|
+
sourceTabId,
|
|
41582
|
+
targetTabId,
|
|
41583
|
+
handoffId
|
|
41584
|
+
};
|
|
41585
|
+
}
|
|
41586
|
+
function readTargetHeartbeat() {
|
|
41587
|
+
const raw = safeLocalStorageGetItem(TARGET_HEARTBEAT_KEY);
|
|
41588
|
+
if (!raw) {
|
|
41589
|
+
return null;
|
|
41590
|
+
}
|
|
41591
|
+
try {
|
|
41592
|
+
const parsed = JSON.parse(raw);
|
|
41593
|
+
if (!(parsed == null ? void 0 : parsed.targetTabId) || !(parsed == null ? void 0 : parsed.handoffId) || !(parsed == null ? void 0 : parsed.ts)) {
|
|
41594
|
+
return null;
|
|
41659
41595
|
}
|
|
41660
|
-
|
|
41661
|
-
|
|
41662
|
-
|
|
41663
|
-
|
|
41664
|
-
|
|
41665
|
-
|
|
41666
|
-
|
|
41667
|
-
|
|
41668
|
-
|
|
41669
|
-
|
|
41670
|
-
|
|
41671
|
-
|
|
41672
|
-
|
|
41673
|
-
|
|
41674
|
-
|
|
41675
|
-
|
|
41676
|
-
|
|
41677
|
-
|
|
41678
|
-
|
|
41679
|
-
|
|
41680
|
-
|
|
41681
|
-
|
|
41682
|
-
|
|
41683
|
-
|
|
41684
|
-
|
|
41685
|
-
|
|
41686
|
-
|
|
41687
|
-
|
|
41688
|
-
}
|
|
41689
|
-
|
|
41690
|
-
|
|
41691
|
-
|
|
41692
|
-
|
|
41693
|
-
|
|
41596
|
+
return {
|
|
41597
|
+
targetTabId: parsed.targetTabId,
|
|
41598
|
+
handoffId: parsed.handoffId,
|
|
41599
|
+
ts: Number(parsed.ts)
|
|
41600
|
+
};
|
|
41601
|
+
} catch {
|
|
41602
|
+
return null;
|
|
41603
|
+
}
|
|
41604
|
+
}
|
|
41605
|
+
function writeTargetHeartbeat(context) {
|
|
41606
|
+
safeLocalStorageSetItem(
|
|
41607
|
+
TARGET_HEARTBEAT_KEY,
|
|
41608
|
+
JSON.stringify({
|
|
41609
|
+
targetTabId: context.targetTabId,
|
|
41610
|
+
handoffId: context.handoffId,
|
|
41611
|
+
ts: Date.now()
|
|
41612
|
+
})
|
|
41613
|
+
);
|
|
41614
|
+
}
|
|
41615
|
+
function writeTargetTabStatus(status, context) {
|
|
41616
|
+
safeLocalStorageSetItem(
|
|
41617
|
+
TARGET_TAB_STATUS_KEY,
|
|
41618
|
+
JSON.stringify({
|
|
41619
|
+
sourceTabId: context.sourceTabId,
|
|
41620
|
+
targetTabId: context.targetTabId,
|
|
41621
|
+
handoffId: context.handoffId,
|
|
41622
|
+
status,
|
|
41623
|
+
ts: Date.now()
|
|
41624
|
+
})
|
|
41625
|
+
);
|
|
41626
|
+
}
|
|
41627
|
+
function sendReconnectSignal(context) {
|
|
41628
|
+
if (closeSignalSent) {
|
|
41629
|
+
return;
|
|
41630
|
+
}
|
|
41631
|
+
closeSignalSent = true;
|
|
41632
|
+
console.warn("[MQTT_HANDOFF] 目标页关闭,通知来源页恢复 MQTT", {
|
|
41633
|
+
sourceTabId: context.sourceTabId,
|
|
41634
|
+
targetTabId: context.targetTabId,
|
|
41635
|
+
handoffId: context.handoffId
|
|
41636
|
+
});
|
|
41637
|
+
safeLocalStorageSetItem(
|
|
41638
|
+
RECONNECT_SIGNAL_KEY,
|
|
41639
|
+
JSON.stringify({
|
|
41640
|
+
...context,
|
|
41641
|
+
ts: Date.now()
|
|
41642
|
+
})
|
|
41643
|
+
);
|
|
41644
|
+
}
|
|
41645
|
+
function stopTargetHeartbeat() {
|
|
41646
|
+
if (heartbeatTimer) {
|
|
41647
|
+
clearInterval(heartbeatTimer);
|
|
41648
|
+
heartbeatTimer = null;
|
|
41649
|
+
}
|
|
41650
|
+
}
|
|
41651
|
+
function startTargetHeartbeat() {
|
|
41652
|
+
const context = getMeetingMqttHandoffContext();
|
|
41653
|
+
if (!context) {
|
|
41654
|
+
return;
|
|
41655
|
+
}
|
|
41656
|
+
const currentTabId = getCurrentMeetingTabId();
|
|
41657
|
+
if (currentTabId !== context.targetTabId) {
|
|
41658
|
+
return;
|
|
41659
|
+
}
|
|
41660
|
+
closeSignalSent = false;
|
|
41661
|
+
console.info("[MQTT_HANDOFF] 目标页心跳已启动", {
|
|
41662
|
+
sourceTabId: context.sourceTabId,
|
|
41663
|
+
targetTabId: context.targetTabId,
|
|
41664
|
+
handoffId: context.handoffId
|
|
41665
|
+
});
|
|
41666
|
+
writeTargetTabStatus(TARGET_TAB_STATUS_OPEN, context);
|
|
41667
|
+
writeTargetHeartbeat(context);
|
|
41668
|
+
stopTargetHeartbeat();
|
|
41669
|
+
heartbeatTimer = setInterval(() => {
|
|
41670
|
+
writeTargetHeartbeat(context);
|
|
41671
|
+
}, TARGET_HEARTBEAT_INTERVAL_MS);
|
|
41672
|
+
}
|
|
41673
|
+
function notifySourceTabForReconnect() {
|
|
41674
|
+
const context = getMeetingMqttHandoffContext();
|
|
41675
|
+
if (!context) {
|
|
41676
|
+
return;
|
|
41677
|
+
}
|
|
41678
|
+
const currentTabId = getCurrentMeetingTabId();
|
|
41679
|
+
if (currentTabId !== context.targetTabId) {
|
|
41680
|
+
return;
|
|
41681
|
+
}
|
|
41682
|
+
sendReconnectSignal(context);
|
|
41683
|
+
}
|
|
41684
|
+
function shouldWarnBeforeUnload() {
|
|
41685
|
+
const context = getMeetingMqttHandoffContext();
|
|
41686
|
+
if (!context) {
|
|
41687
|
+
return false;
|
|
41688
|
+
}
|
|
41689
|
+
const currentTabId = getCurrentMeetingTabId();
|
|
41690
|
+
return currentTabId === context.targetTabId;
|
|
41691
|
+
}
|
|
41692
|
+
function buildMeetingLeavePayload() {
|
|
41693
|
+
try {
|
|
41694
|
+
const meetingInfo = JSON.parse(sessionStorage.getItem("JS_MEETING_INFO") || "{}");
|
|
41695
|
+
const meetingId = String((meetingInfo == null ? void 0 : meetingInfo.meetingId) || "").trim();
|
|
41696
|
+
const memberId = String(getUserId() || "").trim();
|
|
41697
|
+
if (!meetingId || !memberId) {
|
|
41698
|
+
return null;
|
|
41694
41699
|
}
|
|
41695
|
-
|
|
41696
|
-
|
|
41700
|
+
return { meetingId, memberId, force: true };
|
|
41701
|
+
} catch {
|
|
41702
|
+
return null;
|
|
41703
|
+
}
|
|
41704
|
+
}
|
|
41705
|
+
function sendMeetingLeaveOnClose() {
|
|
41706
|
+
if (leaveRequestSent) {
|
|
41707
|
+
return;
|
|
41708
|
+
}
|
|
41709
|
+
const payload = buildMeetingLeavePayload();
|
|
41710
|
+
if (!payload) {
|
|
41711
|
+
return;
|
|
41712
|
+
}
|
|
41713
|
+
leaveRequestSent = true;
|
|
41714
|
+
const body = JSON.stringify(payload);
|
|
41715
|
+
const token = getSdkToken();
|
|
41716
|
+
const authHeader = token ? { Authorization: `Bearer ${token}` } : {};
|
|
41717
|
+
const requestUrl = "/meeting/api/v2/meeting/leave";
|
|
41718
|
+
try {
|
|
41719
|
+
fetch(requestUrl, {
|
|
41720
|
+
method: "POST",
|
|
41721
|
+
headers: {
|
|
41722
|
+
"Content-Type": "application/json",
|
|
41723
|
+
Accept: "application/json, text/plain, */*",
|
|
41724
|
+
"X-Requested-With": "XMLHttpRequest",
|
|
41725
|
+
...authHeader
|
|
41726
|
+
},
|
|
41727
|
+
body,
|
|
41728
|
+
keepalive: true,
|
|
41729
|
+
credentials: "same-origin"
|
|
41730
|
+
}).catch(() => {
|
|
41731
|
+
});
|
|
41732
|
+
console.warn("[MQTT_HANDOFF] 页面关闭触发离会请求(keepalive)", payload);
|
|
41733
|
+
} catch {
|
|
41734
|
+
}
|
|
41735
|
+
try {
|
|
41736
|
+
if (typeof navigator !== "undefined" && typeof navigator.sendBeacon === "function") {
|
|
41737
|
+
const beaconData = new Blob([body], { type: "application/json" });
|
|
41738
|
+
const sent = navigator.sendBeacon(requestUrl, beaconData);
|
|
41739
|
+
console.warn("[MQTT_HANDOFF] 页面关闭触发离会请求(beacon)", {
|
|
41740
|
+
...payload,
|
|
41741
|
+
sent
|
|
41742
|
+
});
|
|
41697
41743
|
}
|
|
41698
|
-
|
|
41699
|
-
|
|
41744
|
+
} catch {
|
|
41745
|
+
}
|
|
41746
|
+
}
|
|
41747
|
+
function shouldReconnectForSignal(signal) {
|
|
41748
|
+
const currentTabId = getCurrentMeetingTabId();
|
|
41749
|
+
if (!signal.sourceTabId || signal.sourceTabId !== currentTabId) {
|
|
41750
|
+
return false;
|
|
41751
|
+
}
|
|
41752
|
+
const latestHeartbeat = readTargetHeartbeat();
|
|
41753
|
+
if (!latestHeartbeat) {
|
|
41754
|
+
return true;
|
|
41755
|
+
}
|
|
41756
|
+
if (latestHeartbeat.targetTabId !== signal.targetTabId) {
|
|
41757
|
+
return true;
|
|
41758
|
+
}
|
|
41759
|
+
if (latestHeartbeat.handoffId !== signal.handoffId) {
|
|
41760
|
+
return true;
|
|
41761
|
+
}
|
|
41762
|
+
return latestHeartbeat.ts <= signal.ts;
|
|
41763
|
+
}
|
|
41764
|
+
function createMeetingMqttHandoffId() {
|
|
41765
|
+
return `mqtt_handoff_${Date.now()}_${createRandomId()}`;
|
|
41766
|
+
}
|
|
41767
|
+
function setMeetingMqttHandoffForWindow(targetWindow, context) {
|
|
41768
|
+
targetWindow.sessionStorage.setItem(
|
|
41769
|
+
HANDOFF_SOURCE_TAB_ID_KEY,
|
|
41770
|
+
context.sourceTabId
|
|
41771
|
+
);
|
|
41772
|
+
targetWindow.sessionStorage.setItem(
|
|
41773
|
+
HANDOFF_TARGET_TAB_ID_KEY,
|
|
41774
|
+
context.targetTabId
|
|
41775
|
+
);
|
|
41776
|
+
targetWindow.sessionStorage.setItem(HANDOFF_ID_KEY, context.handoffId);
|
|
41777
|
+
}
|
|
41778
|
+
function installMeetingMqttHandoffBridge(onReconnectRequested) {
|
|
41779
|
+
if (installed || typeof window === "undefined") {
|
|
41780
|
+
return;
|
|
41781
|
+
}
|
|
41782
|
+
installed = true;
|
|
41783
|
+
startTargetHeartbeat();
|
|
41784
|
+
window.addEventListener("storage", (event) => {
|
|
41785
|
+
if (event.key !== RECONNECT_SIGNAL_KEY || !event.newValue) {
|
|
41786
|
+
return;
|
|
41700
41787
|
}
|
|
41701
|
-
|
|
41702
|
-
|
|
41788
|
+
let signal = null;
|
|
41789
|
+
try {
|
|
41790
|
+
signal = JSON.parse(event.newValue);
|
|
41791
|
+
} catch {
|
|
41792
|
+
return;
|
|
41703
41793
|
}
|
|
41704
|
-
|
|
41705
|
-
|
|
41706
|
-
detailSections.value.map((section) => [section.key, false])
|
|
41707
|
-
);
|
|
41794
|
+
if (!(signal == null ? void 0 : signal.sourceTabId) || !signal.targetTabId || !signal.handoffId) {
|
|
41795
|
+
return;
|
|
41708
41796
|
}
|
|
41709
|
-
|
|
41710
|
-
|
|
41711
|
-
|
|
41712
|
-
);
|
|
41797
|
+
const signalTs = Number(signal.ts);
|
|
41798
|
+
if (!signalTs || signalTs <= lastHandledReconnectSignalTs) {
|
|
41799
|
+
return;
|
|
41713
41800
|
}
|
|
41714
|
-
|
|
41715
|
-
|
|
41716
|
-
|
|
41801
|
+
lastHandledReconnectSignalTs = signalTs;
|
|
41802
|
+
console.warn("[MQTT_HANDOFF] 收到 MQTT 恢复信号,等待确认目标页是否真的关闭", {
|
|
41803
|
+
sourceTabId: signal.sourceTabId,
|
|
41804
|
+
targetTabId: signal.targetTabId,
|
|
41805
|
+
handoffId: signal.handoffId,
|
|
41806
|
+
signalTs
|
|
41807
|
+
});
|
|
41808
|
+
window.setTimeout(() => {
|
|
41809
|
+
if (!shouldReconnectForSignal(signal)) {
|
|
41810
|
+
console.info("[MQTT_HANDOFF] 忽略 MQTT 恢复,本次更像是目标页刷新/重载", {
|
|
41811
|
+
sourceTabId: signal.sourceTabId,
|
|
41812
|
+
targetTabId: signal.targetTabId,
|
|
41813
|
+
handoffId: signal.handoffId
|
|
41814
|
+
});
|
|
41717
41815
|
return;
|
|
41718
41816
|
}
|
|
41719
|
-
|
|
41720
|
-
|
|
41721
|
-
|
|
41722
|
-
|
|
41723
|
-
|
|
41724
|
-
|
|
41725
|
-
|
|
41726
|
-
|
|
41727
|
-
|
|
41728
|
-
|
|
41729
|
-
|
|
41730
|
-
collapsedSections.value = nextState;
|
|
41731
|
-
}
|
|
41732
|
-
const activeBars = computed(() => {
|
|
41733
|
-
if (networkQualityState.isOffline || networkQualityState.isStale) {
|
|
41734
|
-
return 0;
|
|
41735
|
-
}
|
|
41736
|
-
return getNetworkSignalBars(networkQualityState.level);
|
|
41737
|
-
});
|
|
41738
|
-
const allSectionsExpanded = computed(() => {
|
|
41739
|
-
if (!detailSections.value.length) return true;
|
|
41740
|
-
return detailSections.value.every((section) => !isSectionCollapsed(section.key));
|
|
41741
|
-
});
|
|
41742
|
-
const reasonText = computed(() => {
|
|
41743
|
-
if (!networkQualityState.reasons.length) return "";
|
|
41744
|
-
return `可能原因:${networkQualityState.reasons.join("、")}`;
|
|
41745
|
-
});
|
|
41746
|
-
const qualityItems = computed(() => [
|
|
41747
|
-
{ label: "总体质量", value: networkQualityState.label },
|
|
41748
|
-
{ label: "上行质量", value: networkQualityState.uplink },
|
|
41749
|
-
{ label: "下行质量", value: networkQualityState.downlink },
|
|
41750
|
-
{ label: "MOS", value: formatMos(networkQualityState.mos) },
|
|
41751
|
-
{ label: "最近更新", value: formatUpdatedAt(networkQualityState.updatedAt) },
|
|
41752
|
-
{
|
|
41753
|
-
label: "数据状态",
|
|
41754
|
-
value: networkQualityState.isStale ? "已过期" : "实时"
|
|
41755
|
-
}
|
|
41756
|
-
]);
|
|
41757
|
-
const overviewItems = computed(() => {
|
|
41758
|
-
const stats = networkQualityState.stats;
|
|
41759
|
-
return [
|
|
41760
|
-
{ label: "上行 RTT", value: formatValue(stats == null ? void 0 : stats.rtt_up, " ms") },
|
|
41761
|
-
{ label: "下行 RTT", value: formatValue(stats == null ? void 0 : stats.rtt_down, " ms") },
|
|
41762
|
-
{ label: "上行码率", value: formatValue(stats == null ? void 0 : stats.bitrate_up, " kb/s") },
|
|
41763
|
-
{ label: "下行码率", value: formatValue(stats == null ? void 0 : stats.bitrate_down, " kb/s") },
|
|
41764
|
-
{ label: "上行丢包率", value: formatLossRate(stats == null ? void 0 : stats.lossrate_up) },
|
|
41765
|
-
{ label: "下行丢包率", value: formatLossRate(stats == null ? void 0 : stats.lossrate_down) },
|
|
41766
|
-
{
|
|
41767
|
-
label: "可用上行带宽",
|
|
41768
|
-
value: formatValue(stats == null ? void 0 : stats.available_outgoing_bitrate, " kb/s")
|
|
41769
|
-
},
|
|
41770
|
-
{
|
|
41771
|
-
label: "可用下行带宽",
|
|
41772
|
-
value: formatValue(stats == null ? void 0 : stats.available_incoming_bitrate, " kb/s")
|
|
41773
|
-
}
|
|
41774
|
-
];
|
|
41775
|
-
});
|
|
41776
|
-
function createAudioSendCard(item, index) {
|
|
41777
|
-
const stats = (item == null ? void 0 : item.stats) || {};
|
|
41778
|
-
return {
|
|
41779
|
-
title: `本地音频 ${index + 1}`,
|
|
41780
|
-
subtitle: (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.streamId) || "发送轨道",
|
|
41781
|
-
items: [
|
|
41782
|
-
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
41783
|
-
{ label: "音频电平", value: formatMetricNumber(item == null ? void 0 : item.db, " dBFS", 1) },
|
|
41784
|
-
{ label: "已发包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsSent) },
|
|
41785
|
-
{ label: "已发字节", value: formatBytes(stats == null ? void 0 : stats.bytesSent) },
|
|
41786
|
-
{ label: "远端丢包", value: formatMetricNumber(stats == null ? void 0 : stats.packetsLost) },
|
|
41787
|
-
{ label: "往返时延", value: formatMetricNumber(stats == null ? void 0 : stats.roundTripTime, " ms") },
|
|
41788
|
-
{ label: "远端抖动", value: formatMetricNumber(stats == null ? void 0 : stats.jitter, " ms") },
|
|
41789
|
-
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
41790
|
-
]
|
|
41791
|
-
};
|
|
41792
|
-
}
|
|
41793
|
-
function createVideoSendCard(item, index) {
|
|
41794
|
-
const stats = (item == null ? void 0 : item.stats) || {};
|
|
41795
|
-
return {
|
|
41796
|
-
title: `本地视频 ${index + 1}`,
|
|
41797
|
-
subtitle: (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.rid) || (stats == null ? void 0 : stats.streamId) || "发送轨道",
|
|
41798
|
-
items: [
|
|
41799
|
-
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
41800
|
-
{ label: "分辨率", value: formatDimension((item == null ? void 0 : item.width) || (stats == null ? void 0 : stats.frameWidth), (item == null ? void 0 : item.height) || (stats == null ? void 0 : stats.frameHeight)) },
|
|
41801
|
-
{ label: "帧率", value: formatMetricNumber((item == null ? void 0 : item.fps) || (stats == null ? void 0 : stats.framesPerSecond), " fps") },
|
|
41802
|
-
{ label: "已发帧数", value: formatMetricNumber(stats == null ? void 0 : stats.framesSent) },
|
|
41803
|
-
{ label: "目标码率", value: formatMetricNumber(stats == null ? void 0 : stats.targetBitrate, " bps") },
|
|
41804
|
-
{ label: "FIR/PLI/NACK", value: `${formatMetricNumber(stats == null ? void 0 : stats.firCount)}/${formatMetricNumber(stats == null ? void 0 : stats.pliCount)}/${formatMetricNumber(stats == null ? void 0 : stats.nackCount)}` },
|
|
41805
|
-
{ label: "重传包数", value: formatMetricNumber(stats == null ? void 0 : stats.retransmittedPacketsSent) },
|
|
41806
|
-
{ label: "受限原因", value: formatReason(stats == null ? void 0 : stats.qualityLimitationReason) },
|
|
41807
|
-
{ label: "分辨率变化", value: formatMetricNumber(stats == null ? void 0 : stats.qualityLimitationResolutionChanges) },
|
|
41808
|
-
{ label: "往返时延", value: formatMetricNumber(stats == null ? void 0 : stats.roundTripTime, " ms") },
|
|
41809
|
-
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
41810
|
-
]
|
|
41811
|
-
};
|
|
41817
|
+
console.warn("[MQTT_HANDOFF] 确认目标页已关闭,准备恢复来源页 MQTT", {
|
|
41818
|
+
sourceTabId: signal.sourceTabId,
|
|
41819
|
+
targetTabId: signal.targetTabId,
|
|
41820
|
+
handoffId: signal.handoffId
|
|
41821
|
+
});
|
|
41822
|
+
void onReconnectRequested();
|
|
41823
|
+
}, RECONNECT_CHECK_DELAY_MS);
|
|
41824
|
+
});
|
|
41825
|
+
window.addEventListener("beforeunload", (event) => {
|
|
41826
|
+
if (!shouldWarnBeforeUnload()) {
|
|
41827
|
+
return;
|
|
41812
41828
|
}
|
|
41813
|
-
|
|
41814
|
-
|
|
41815
|
-
|
|
41816
|
-
|
|
41817
|
-
|
|
41818
|
-
|
|
41819
|
-
|
|
41820
|
-
|
|
41821
|
-
|
|
41822
|
-
{ label: "已收字节", value: formatBytes(stats == null ? void 0 : stats.bytesReceived) },
|
|
41823
|
-
{ label: "丢包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsLost) },
|
|
41824
|
-
{ label: "网络抖动", value: formatMetricNumber(stats == null ? void 0 : stats.jitter, " ms") },
|
|
41825
|
-
{ label: "缓冲均值", value: formatMetricNumber(stats == null ? void 0 : stats.jitterBufferAvgDelay, " ms") },
|
|
41826
|
-
{ label: "隐藏事件", value: formatMetricNumber(stats == null ? void 0 : stats.concealmentEvents) },
|
|
41827
|
-
{ label: "静音隐藏", value: formatMetricNumber(stats == null ? void 0 : stats.silentConcealmentEvents) },
|
|
41828
|
-
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
41829
|
-
]
|
|
41830
|
-
};
|
|
41829
|
+
event.preventDefault();
|
|
41830
|
+
event.returnValue = "";
|
|
41831
|
+
});
|
|
41832
|
+
window.addEventListener("pagehide", (event) => {
|
|
41833
|
+
const context = getMeetingMqttHandoffContext();
|
|
41834
|
+
const shouldHandleTargetTabClose = !!context && getCurrentMeetingTabId() === context.targetTabId;
|
|
41835
|
+
if (shouldHandleTargetTabClose && context) {
|
|
41836
|
+
writeTargetTabStatus(TARGET_TAB_STATUS_CLOSED, context);
|
|
41837
|
+
sendMeetingLeaveOnClose();
|
|
41831
41838
|
}
|
|
41832
|
-
|
|
41833
|
-
|
|
41834
|
-
|
|
41835
|
-
return {
|
|
41836
|
-
title: `远端视频 ${index + 1}`,
|
|
41837
|
-
subtitle: memberName || (item == null ? void 0 : item.uid) || (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.mimeType) || "接收轨道",
|
|
41838
|
-
items: [
|
|
41839
|
-
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
41840
|
-
{ label: "分辨率", value: formatDimension((item == null ? void 0 : item.width) || (stats == null ? void 0 : stats.frameWidth), (item == null ? void 0 : item.height) || (stats == null ? void 0 : stats.frameHeight)) },
|
|
41841
|
-
{ label: "帧率", value: formatMetricNumber((item == null ? void 0 : item.fps) || (stats == null ? void 0 : stats.framesPerSecond), " fps") },
|
|
41842
|
-
{ label: "已收包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsReceived) },
|
|
41843
|
-
{ label: "已收字节", value: formatBytes(stats == null ? void 0 : stats.bytesReceived) },
|
|
41844
|
-
{ label: "丢包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsLost) },
|
|
41845
|
-
{ label: "接收/解码帧", value: `${formatMetricNumber(stats == null ? void 0 : stats.framesReceived)}/${formatMetricNumber(stats == null ? void 0 : stats.framesDecoded)}` },
|
|
41846
|
-
{ label: "丢帧数", value: formatMetricNumber(stats == null ? void 0 : stats.framesDropped) },
|
|
41847
|
-
{ label: "FIR/PLI/NACK", value: `${formatMetricNumber(stats == null ? void 0 : stats.firCount)}/${formatMetricNumber(stats == null ? void 0 : stats.pliCount)}/${formatMetricNumber(stats == null ? void 0 : stats.nackCount)}` },
|
|
41848
|
-
{ label: "缓冲均值", value: formatMetricNumber(stats == null ? void 0 : stats.jitterBufferAvgDelay, " ms") },
|
|
41849
|
-
{ label: "解码器", value: formatReason(stats == null ? void 0 : stats.decoderImplementation) },
|
|
41850
|
-
{ label: "MIME", value: formatReason(stats == null ? void 0 : stats.mimeType) },
|
|
41851
|
-
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
41852
|
-
]
|
|
41853
|
-
};
|
|
41839
|
+
stopTargetHeartbeat();
|
|
41840
|
+
if (event.persisted) {
|
|
41841
|
+
return;
|
|
41854
41842
|
}
|
|
41855
|
-
|
|
41856
|
-
|
|
41857
|
-
|
|
41858
|
-
|
|
41859
|
-
|
|
41860
|
-
|
|
41861
|
-
|
|
41862
|
-
|
|
41863
|
-
|
|
41864
|
-
|
|
41865
|
-
|
|
41866
|
-
|
|
41867
|
-
|
|
41868
|
-
|
|
41869
|
-
|
|
41870
|
-
|
|
41871
|
-
|
|
41872
|
-
|
|
41873
|
-
{
|
|
41874
|
-
key: "remote-video",
|
|
41875
|
-
title: "远端视频接收",
|
|
41876
|
-
cards: ((details == null ? void 0 : details.remote_videos) || []).map(createVideoRecvCard)
|
|
41877
|
-
}
|
|
41878
|
-
];
|
|
41843
|
+
notifySourceTabForReconnect();
|
|
41844
|
+
});
|
|
41845
|
+
}
|
|
41846
|
+
const _hoisted_1$n = { class: "js-dialog-header-title" };
|
|
41847
|
+
const _hoisted_2$l = { class: "js-dialog-header-actions" };
|
|
41848
|
+
const MQTT_CLIENT_INSTANCE_STORAGE_KEY = "JS_MQTT_CLIENT_INSTANCE_ID";
|
|
41849
|
+
const _sfc_main$p = /* @__PURE__ */ defineComponent({
|
|
41850
|
+
__name: "meeting-header",
|
|
41851
|
+
props: {
|
|
41852
|
+
theme: {},
|
|
41853
|
+
isMaximized: { type: Boolean }
|
|
41854
|
+
},
|
|
41855
|
+
emits: ["onChange"],
|
|
41856
|
+
setup(__props, { emit: __emit }) {
|
|
41857
|
+
const props = __props;
|
|
41858
|
+
const { meState: meState2 } = storeToRefs(useMeetingStore());
|
|
41859
|
+
const meetingInfo = computed(() => {
|
|
41860
|
+
return JSON.parse(sessionStorage.getItem("JS_MEETING_INFO") || "{}");
|
|
41879
41861
|
});
|
|
41880
|
-
|
|
41881
|
-
|
|
41882
|
-
|
|
41883
|
-
|
|
41884
|
-
|
|
41885
|
-
|
|
41862
|
+
const emit = __emit;
|
|
41863
|
+
const closeRef = ref(null);
|
|
41864
|
+
const showCloseConfirm = ref(false);
|
|
41865
|
+
const SESSION_STORAGE_KEYS_TO_CLONE = [
|
|
41866
|
+
"JS_MEETING_INFO",
|
|
41867
|
+
"JS_SDK_TOKEN",
|
|
41868
|
+
"JS_SDK_TOKEN_EXPIRY",
|
|
41869
|
+
"JS_USER_ID",
|
|
41870
|
+
"JS_USER_NAME",
|
|
41871
|
+
"JS_SELF_MEDIA_PREFS",
|
|
41872
|
+
"JS_SERVER_TIMESTAMP",
|
|
41873
|
+
"joinTime",
|
|
41874
|
+
"JS_INCOMING_CALL_INFO",
|
|
41875
|
+
"isSosActive"
|
|
41876
|
+
];
|
|
41877
|
+
const themeClass = computed(() => `theme-${props.theme || "dark"}`);
|
|
41878
|
+
const hasOpenedNewTab = ref(false);
|
|
41879
|
+
const getNewTabFlagFromLocation = () => {
|
|
41880
|
+
if (typeof window === "undefined") return false;
|
|
41881
|
+
const searchParams = new URLSearchParams(window.location.search || "");
|
|
41882
|
+
if (searchParams.get("newTab") === "true") return true;
|
|
41883
|
+
const hash = window.location.hash || "";
|
|
41884
|
+
const hashQueryIndex = hash.indexOf("?");
|
|
41885
|
+
if (hashQueryIndex === -1) return false;
|
|
41886
|
+
const hashQuery = hash.slice(hashQueryIndex + 1);
|
|
41887
|
+
const hashParams = new URLSearchParams(hashQuery);
|
|
41888
|
+
return hashParams.get("newTab") === "true";
|
|
41889
|
+
};
|
|
41890
|
+
const showOpenNewTabButton = computed(() => {
|
|
41891
|
+
if (hasOpenedNewTab.value) return false;
|
|
41892
|
+
return !getNewTabFlagFromLocation();
|
|
41893
|
+
});
|
|
41894
|
+
const createMqttInstanceId = () => {
|
|
41895
|
+
if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
|
|
41896
|
+
return crypto.randomUUID().replace(/-/g, "").slice(0, 12);
|
|
41897
|
+
}
|
|
41898
|
+
return Math.random().toString(36).slice(2, 14);
|
|
41899
|
+
};
|
|
41900
|
+
const copySessionToNewTab = (targetWindow) => {
|
|
41901
|
+
SESSION_STORAGE_KEYS_TO_CLONE.forEach((key) => {
|
|
41902
|
+
const value = sessionStorage.getItem(key);
|
|
41903
|
+
if (value === null) {
|
|
41904
|
+
targetWindow.sessionStorage.removeItem(key);
|
|
41905
|
+
return;
|
|
41886
41906
|
}
|
|
41907
|
+
targetWindow.sessionStorage.setItem(key, value);
|
|
41908
|
+
});
|
|
41909
|
+
};
|
|
41910
|
+
const handleOpenNewTab = async () => {
|
|
41911
|
+
var _a25;
|
|
41912
|
+
hasOpenedNewTab.value = true;
|
|
41913
|
+
const currentMeetingId = (_a25 = meetingInfo.value) == null ? void 0 : _a25.meetingId;
|
|
41914
|
+
const newTab = window.open("", "_blank");
|
|
41915
|
+
if (!newTab) {
|
|
41916
|
+
hasOpenedNewTab.value = false;
|
|
41917
|
+
showNotification("打开新标签页失败,请允许弹窗权限。", "warning", 5e3);
|
|
41887
41918
|
return;
|
|
41888
41919
|
}
|
|
41889
|
-
|
|
41890
|
-
|
|
41891
|
-
|
|
41892
|
-
|
|
41893
|
-
|
|
41894
|
-
|
|
41895
|
-
|
|
41896
|
-
|
|
41897
|
-
|
|
41898
|
-
|
|
41899
|
-
|
|
41900
|
-
|
|
41901
|
-
|
|
41920
|
+
try {
|
|
41921
|
+
const sourceTabId = getCurrentMeetingTabId();
|
|
41922
|
+
const nextTabId = createMeetingTabId();
|
|
41923
|
+
const handoffId = createMeetingMqttHandoffId();
|
|
41924
|
+
copySessionToNewTab(newTab);
|
|
41925
|
+
setMeetingMqttHandoffForWindow(newTab, {
|
|
41926
|
+
sourceTabId,
|
|
41927
|
+
targetTabId: nextTabId,
|
|
41928
|
+
handoffId
|
|
41929
|
+
});
|
|
41930
|
+
newTab.sessionStorage.setItem(
|
|
41931
|
+
MQTT_CLIENT_INSTANCE_STORAGE_KEY,
|
|
41932
|
+
createMqttInstanceId()
|
|
41933
|
+
);
|
|
41934
|
+
setMeetingTabIdForWindow(newTab, nextTabId);
|
|
41935
|
+
if (currentMeetingId) {
|
|
41936
|
+
claimActiveMeetingOwnership(currentMeetingId, nextTabId);
|
|
41937
|
+
}
|
|
41938
|
+
let url = window.location.href;
|
|
41939
|
+
if (url.includes("home") || url.includes("surveillance")) {
|
|
41940
|
+
url = url.replace("home", "command");
|
|
41941
|
+
url = url.replace("surveillance", "command");
|
|
41942
|
+
}
|
|
41943
|
+
newTab.location.replace(url + "?newTab=true");
|
|
41944
|
+
resetMeetingMQTT();
|
|
41945
|
+
await logoutRoomAction();
|
|
41946
|
+
closeMeeting();
|
|
41947
|
+
} catch (error) {
|
|
41948
|
+
hasOpenedNewTab.value = false;
|
|
41949
|
+
console.error("Failed to open meeting in a new tab:", error);
|
|
41950
|
+
showNotification("New tab initialized with a fallback page open.", "warning", 5e3);
|
|
41902
41951
|
}
|
|
41903
|
-
}
|
|
41904
|
-
|
|
41905
|
-
|
|
41906
|
-
|
|
41907
|
-
|
|
41908
|
-
|
|
41909
|
-
|
|
41910
|
-
|
|
41911
|
-
)
|
|
41912
|
-
|
|
41913
|
-
|
|
41914
|
-
}
|
|
41952
|
+
};
|
|
41953
|
+
const handleCloseClick = async () => {
|
|
41954
|
+
showCloseConfirm.value = !showCloseConfirm.value;
|
|
41955
|
+
};
|
|
41956
|
+
const handleEndMeeting = () => {
|
|
41957
|
+
showCloseConfirm.value = false;
|
|
41958
|
+
emit("onChange", RoomModalSelectType.endClick);
|
|
41959
|
+
};
|
|
41960
|
+
const handleLeaveMeeting = () => {
|
|
41961
|
+
showCloseConfirm.value = false;
|
|
41962
|
+
emit("onChange", RoomModalSelectType.leaveClick);
|
|
41963
|
+
};
|
|
41915
41964
|
return (_ctx, _cache) => {
|
|
41916
41965
|
return openBlock(), createElementBlock("div", {
|
|
41917
|
-
class: normalizeClass(["
|
|
41966
|
+
class: normalizeClass(["js-dialog-header", themeClass.value])
|
|
41918
41967
|
}, [
|
|
41919
|
-
createElementVNode("
|
|
41920
|
-
|
|
41921
|
-
|
|
41922
|
-
|
|
41923
|
-
|
|
41924
|
-
|
|
41925
|
-
|
|
41926
|
-
|
|
41927
|
-
|
|
41928
|
-
|
|
41929
|
-
|
|
41930
|
-
|
|
41931
|
-
|
|
41932
|
-
|
|
41933
|
-
(
|
|
41934
|
-
|
|
41935
|
-
|
|
41936
|
-
|
|
41937
|
-
|
|
41938
|
-
})
|
|
41968
|
+
createElementVNode("div", _hoisted_1$n, toDisplayString(meetingInfo.value.meetingName), 1),
|
|
41969
|
+
createElementVNode("div", _hoisted_2$l, [
|
|
41970
|
+
showOpenNewTabButton.value ? (openBlock(), createElementBlock("div", {
|
|
41971
|
+
key: 0,
|
|
41972
|
+
title: "新打开标签页",
|
|
41973
|
+
onClick: handleOpenNewTab
|
|
41974
|
+
}, [
|
|
41975
|
+
createVNode(SvgIcon, {
|
|
41976
|
+
name: "OpenNewTabIcon",
|
|
41977
|
+
size: 16
|
|
41978
|
+
})
|
|
41979
|
+
])) : createCommentVNode("", true),
|
|
41980
|
+
createElementVNode("div", {
|
|
41981
|
+
title: "最小化",
|
|
41982
|
+
onClick: _cache[0] || (_cache[0] = ($event) => emit("onChange", unref(RoomModalSelectType).minimizeClick))
|
|
41983
|
+
}, [
|
|
41984
|
+
createVNode(SvgIcon, {
|
|
41985
|
+
name: "MinimizeIcon",
|
|
41986
|
+
size: 16
|
|
41987
|
+
})
|
|
41939
41988
|
]),
|
|
41940
|
-
|
|
41941
|
-
|
|
41989
|
+
createElementVNode("div", {
|
|
41990
|
+
ref_key: "closeRef",
|
|
41991
|
+
ref: closeRef,
|
|
41992
|
+
title: "关闭",
|
|
41993
|
+
onClick: handleCloseClick
|
|
41994
|
+
}, [
|
|
41995
|
+
createVNode(SvgIcon, {
|
|
41996
|
+
name: "CloseIcon",
|
|
41997
|
+
size: 17
|
|
41998
|
+
})
|
|
41999
|
+
], 512)
|
|
42000
|
+
]),
|
|
41942
42001
|
createVNode(SmartPopup, {
|
|
41943
|
-
visible:
|
|
41944
|
-
"onUpdate:visible": _cache[
|
|
41945
|
-
trigger:
|
|
41946
|
-
gap:
|
|
42002
|
+
visible: showCloseConfirm.value,
|
|
42003
|
+
"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => showCloseConfirm.value = $event),
|
|
42004
|
+
trigger: closeRef.value,
|
|
42005
|
+
gap: 10
|
|
41947
42006
|
}, {
|
|
41948
42007
|
default: withCtx(() => [
|
|
41949
|
-
createElementVNode("div",
|
|
41950
|
-
|
|
41951
|
-
|
|
41952
|
-
|
|
41953
|
-
createElementVNode("div", _hoisted_5$f, [
|
|
41954
|
-
_cache[4] || (_cache[4] = createElementVNode("div", { class: "popup-title" }, "网络详情", -1)),
|
|
41955
|
-
createElementVNode("div", _hoisted_6$e, [
|
|
41956
|
-
createElementVNode("button", {
|
|
41957
|
-
type: "button",
|
|
41958
|
-
class: "advanced-toggle",
|
|
41959
|
-
onClick: _cache[1] || (_cache[1] = withModifiers(($event) => advancedOpen.value = !advancedOpen.value, ["stop"]))
|
|
41960
|
-
}, toDisplayString(advancedOpen.value ? "关闭高级模式" : "打开高级模式"), 1),
|
|
41961
|
-
createElementVNode("div", {
|
|
41962
|
-
class: normalizeClass(["popup-status", `is-${unref(networkQualityState).level}`])
|
|
41963
|
-
}, toDisplayString(unref(networkQualityState).label), 3)
|
|
41964
|
-
])
|
|
41965
|
-
]),
|
|
41966
|
-
createElementVNode("div", _hoisted_7$d, toDisplayString(unref(networkQualityState).summary), 1),
|
|
41967
|
-
reasonText.value ? (openBlock(), createElementBlock("div", _hoisted_8$c, toDisplayString(reasonText.value), 1)) : createCommentVNode("", true),
|
|
41968
|
-
createElementVNode("div", _hoisted_9$a, [
|
|
41969
|
-
_cache[5] || (_cache[5] = createElementVNode("div", { class: "popup-section-title" }, "质量概览", -1)),
|
|
41970
|
-
createElementVNode("div", _hoisted_10$a, [
|
|
41971
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(qualityItems.value, (item) => {
|
|
41972
|
-
return openBlock(), createElementBlock("div", {
|
|
41973
|
-
key: item.label,
|
|
41974
|
-
class: "popup-item"
|
|
41975
|
-
}, [
|
|
41976
|
-
createElementVNode("div", _hoisted_11$9, toDisplayString(item.label), 1),
|
|
41977
|
-
createElementVNode("div", _hoisted_12$9, toDisplayString(item.value), 1)
|
|
41978
|
-
]);
|
|
41979
|
-
}), 128))
|
|
41980
|
-
])
|
|
41981
|
-
]),
|
|
41982
|
-
createElementVNode("div", _hoisted_13$7, [
|
|
41983
|
-
_cache[6] || (_cache[6] = createElementVNode("div", { class: "popup-section-title" }, "网络指标", -1)),
|
|
41984
|
-
createElementVNode("div", _hoisted_14$6, [
|
|
41985
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(overviewItems.value, (item) => {
|
|
41986
|
-
return openBlock(), createElementBlock("div", {
|
|
41987
|
-
key: item.label,
|
|
41988
|
-
class: "popup-item"
|
|
41989
|
-
}, [
|
|
41990
|
-
createElementVNode("div", _hoisted_15$5, toDisplayString(item.label), 1),
|
|
41991
|
-
createElementVNode("div", _hoisted_16$5, toDisplayString(item.value), 1)
|
|
41992
|
-
]);
|
|
41993
|
-
}), 128))
|
|
41994
|
-
])
|
|
41995
|
-
])
|
|
41996
|
-
], 2),
|
|
41997
|
-
advancedOpen.value ? (openBlock(), createElementBlock("div", {
|
|
42008
|
+
createElementVNode("div", {
|
|
42009
|
+
class: normalizeClass(["close-confirm-dropdown", themeClass.value])
|
|
42010
|
+
}, [
|
|
42011
|
+
unref(meState2).roleType == "1" ? (openBlock(), createElementBlock("div", {
|
|
41998
42012
|
key: 0,
|
|
41999
|
-
class:
|
|
42000
|
-
onClick:
|
|
42001
|
-
|
|
42002
|
-
|
|
42003
|
-
|
|
42004
|
-
|
|
42005
|
-
|
|
42006
|
-
|
|
42007
|
-
|
|
42008
|
-
|
|
42009
|
-
|
|
42010
|
-
|
|
42011
|
-
])
|
|
42012
|
-
]),
|
|
42013
|
-
createElementVNode("div", _hoisted_19$4, [
|
|
42014
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(detailSections.value, (section) => {
|
|
42015
|
-
return openBlock(), createElementBlock("div", {
|
|
42016
|
-
key: section.key,
|
|
42017
|
-
class: "popup-section"
|
|
42018
|
-
}, [
|
|
42019
|
-
createElementVNode("button", {
|
|
42020
|
-
type: "button",
|
|
42021
|
-
class: normalizeClass(["detail-section-toggle", { collapsed: isSectionCollapsed(section.key) }]),
|
|
42022
|
-
onClick: ($event) => toggleSection(section.key)
|
|
42023
|
-
}, [
|
|
42024
|
-
createElementVNode("span", _hoisted_21$2, [
|
|
42025
|
-
createElementVNode("span", _hoisted_22$2, toDisplayString(section.title), 1),
|
|
42026
|
-
createElementVNode("span", _hoisted_23$2, "(" + toDisplayString(section.cards.length) + ")", 1)
|
|
42027
|
-
]),
|
|
42028
|
-
createElementVNode("span", _hoisted_24$2, toDisplayString(isSectionCollapsed(section.key) ? "展开" : "收起"), 1)
|
|
42029
|
-
], 10, _hoisted_20$4),
|
|
42030
|
-
!isSectionCollapsed(section.key) && section.cards.length ? (openBlock(), createElementBlock("div", _hoisted_25$2, [
|
|
42031
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(section.cards, (card) => {
|
|
42032
|
-
return openBlock(), createElementBlock("div", {
|
|
42033
|
-
key: card.title,
|
|
42034
|
-
class: "metric-card"
|
|
42035
|
-
}, [
|
|
42036
|
-
createElementVNode("div", _hoisted_26$2, [
|
|
42037
|
-
createElementVNode("div", _hoisted_27$2, toDisplayString(card.title), 1),
|
|
42038
|
-
createElementVNode("div", _hoisted_28$2, toDisplayString(card.subtitle), 1)
|
|
42039
|
-
]),
|
|
42040
|
-
createElementVNode("div", _hoisted_29$2, [
|
|
42041
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(card.items, (item) => {
|
|
42042
|
-
return openBlock(), createElementBlock("div", {
|
|
42043
|
-
key: `${card.title}-${item.label}`,
|
|
42044
|
-
class: "metric-card-item"
|
|
42045
|
-
}, [
|
|
42046
|
-
createElementVNode("div", _hoisted_30$2, toDisplayString(item.label), 1),
|
|
42047
|
-
createElementVNode("div", _hoisted_31$1, toDisplayString(item.value), 1)
|
|
42048
|
-
]);
|
|
42049
|
-
}), 128))
|
|
42050
|
-
])
|
|
42051
|
-
]);
|
|
42052
|
-
}), 128))
|
|
42053
|
-
])) : !isSectionCollapsed(section.key) ? (openBlock(), createElementBlock("div", _hoisted_32$1, "暂无数据")) : createCommentVNode("", true)
|
|
42054
|
-
]);
|
|
42055
|
-
}), 128))
|
|
42056
|
-
])
|
|
42057
|
-
], 2)) : createCommentVNode("", true)
|
|
42058
|
-
])
|
|
42013
|
+
class: "close-confirm-option danger",
|
|
42014
|
+
onClick: withModifiers(handleEndMeeting, ["stop"])
|
|
42015
|
+
}, " 结束会议 ")) : createCommentVNode("", true),
|
|
42016
|
+
createElementVNode("div", {
|
|
42017
|
+
class: "close-confirm-option simple",
|
|
42018
|
+
onClick: withModifiers(handleLeaveMeeting, ["stop"])
|
|
42019
|
+
}, " 离开会议 "),
|
|
42020
|
+
createElementVNode("div", {
|
|
42021
|
+
class: "close-confirm-option simple",
|
|
42022
|
+
onClick: _cache[1] || (_cache[1] = ($event) => showCloseConfirm.value = false)
|
|
42023
|
+
}, " 取消 ")
|
|
42024
|
+
], 2)
|
|
42059
42025
|
]),
|
|
42060
42026
|
_: 1
|
|
42061
42027
|
}, 8, ["visible", "trigger"])
|
|
@@ -42063,193 +42029,689 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
|
|
|
42063
42029
|
};
|
|
42064
42030
|
}
|
|
42065
42031
|
});
|
|
42066
|
-
const
|
|
42067
|
-
const _hoisted_1$
|
|
42068
|
-
const
|
|
42069
|
-
|
|
42032
|
+
const MeetingHeader = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-2299cd2f"]]);
|
|
42033
|
+
const _hoisted_1$m = ["title"];
|
|
42034
|
+
const _hoisted_2$k = {
|
|
42035
|
+
class: "signal-bars",
|
|
42036
|
+
"aria-hidden": "true"
|
|
42037
|
+
};
|
|
42038
|
+
const _hoisted_3$k = {
|
|
42039
|
+
key: 0,
|
|
42040
|
+
class: "signal-text"
|
|
42041
|
+
};
|
|
42042
|
+
const _hoisted_4$i = { class: "network-quality-popup-shell" };
|
|
42043
|
+
const _hoisted_5$f = { class: "popup-header" };
|
|
42044
|
+
const _hoisted_6$e = { class: "popup-header-actions" };
|
|
42045
|
+
const _hoisted_7$d = { class: "popup-summary" };
|
|
42046
|
+
const _hoisted_8$c = {
|
|
42047
|
+
key: 0,
|
|
42048
|
+
class: "popup-reasons"
|
|
42049
|
+
};
|
|
42050
|
+
const _hoisted_9$a = { class: "popup-section" };
|
|
42051
|
+
const _hoisted_10$a = { class: "popup-grid" };
|
|
42052
|
+
const _hoisted_11$9 = { class: "popup-item-label" };
|
|
42053
|
+
const _hoisted_12$9 = { class: "popup-item-value" };
|
|
42054
|
+
const _hoisted_13$7 = { class: "popup-section" };
|
|
42055
|
+
const _hoisted_14$6 = { class: "popup-grid" };
|
|
42056
|
+
const _hoisted_15$5 = { class: "popup-item-label" };
|
|
42057
|
+
const _hoisted_16$5 = { class: "popup-item-value" };
|
|
42058
|
+
const _hoisted_17$4 = { class: "popup-header" };
|
|
42059
|
+
const _hoisted_18$4 = { class: "popup-header-actions" };
|
|
42060
|
+
const _hoisted_19$4 = { class: "popup-section-container" };
|
|
42061
|
+
const _hoisted_20$4 = ["onClick"];
|
|
42062
|
+
const _hoisted_21$2 = { class: "detail-section-main" };
|
|
42063
|
+
const _hoisted_22$2 = { class: "popup-section-title" };
|
|
42064
|
+
const _hoisted_23$2 = { class: "popup-section-count" };
|
|
42065
|
+
const _hoisted_24$2 = { class: "detail-section-icon" };
|
|
42066
|
+
const _hoisted_25$2 = {
|
|
42067
|
+
key: 0,
|
|
42068
|
+
class: "metric-card-list"
|
|
42069
|
+
};
|
|
42070
|
+
const _hoisted_26$2 = { class: "metric-card-header" };
|
|
42071
|
+
const _hoisted_27$2 = { class: "metric-card-title" };
|
|
42072
|
+
const _hoisted_28$2 = { class: "metric-card-subtitle" };
|
|
42073
|
+
const _hoisted_29$2 = { class: "metric-card-grid" };
|
|
42074
|
+
const _hoisted_30$2 = { class: "popup-item-label" };
|
|
42075
|
+
const _hoisted_31$1 = { class: "popup-item-value" };
|
|
42076
|
+
const _hoisted_32$1 = {
|
|
42077
|
+
key: 1,
|
|
42078
|
+
class: "popup-empty"
|
|
42079
|
+
};
|
|
42080
|
+
const _sfc_main$o = /* @__PURE__ */ defineComponent({
|
|
42081
|
+
__name: "NetworkQualitySignal",
|
|
42070
42082
|
props: {
|
|
42071
|
-
theme: { default: "dark" }
|
|
42083
|
+
theme: { default: "dark" },
|
|
42084
|
+
size: { default: "default" },
|
|
42085
|
+
showText: { type: Boolean, default: false }
|
|
42072
42086
|
},
|
|
42073
42087
|
setup(__props) {
|
|
42074
42088
|
const props = __props;
|
|
42089
|
+
const triggerRef = ref(null);
|
|
42090
|
+
const showPopup = ref(false);
|
|
42091
|
+
const advancedOpen = ref(false);
|
|
42092
|
+
const collapsedSections = ref({});
|
|
42093
|
+
const advancedDetails = ref();
|
|
42094
|
+
let detailTimer = null;
|
|
42075
42095
|
const themeClass = computed(() => `theme-${props.theme}`);
|
|
42076
|
-
|
|
42077
|
-
if (
|
|
42078
|
-
|
|
42079
|
-
|
|
42080
|
-
|
|
42081
|
-
|
|
42082
|
-
|
|
42083
|
-
|
|
42084
|
-
|
|
42085
|
-
|
|
42086
|
-
|
|
42087
|
-
|
|
42088
|
-
|
|
42089
|
-
|
|
42090
|
-
|
|
42091
|
-
|
|
42092
|
-
|
|
42093
|
-
|
|
42094
|
-
|
|
42095
|
-
|
|
42096
|
-
|
|
42097
|
-
|
|
42098
|
-
|
|
42099
|
-
|
|
42100
|
-
|
|
42101
|
-
|
|
42102
|
-
|
|
42103
|
-
|
|
42104
|
-
const
|
|
42105
|
-
const
|
|
42106
|
-
|
|
42107
|
-
|
|
42108
|
-
}
|
|
42109
|
-
|
|
42110
|
-
|
|
42111
|
-
|
|
42112
|
-
|
|
42113
|
-
|
|
42114
|
-
const _hoisted_12$8 = ["disabled", "onClick"];
|
|
42115
|
-
const _sfc_main$m = /* @__PURE__ */ defineComponent({
|
|
42116
|
-
__name: "meeting-content",
|
|
42117
|
-
props: {
|
|
42118
|
-
layout: { default: "grid-9" },
|
|
42119
|
-
isFullscreen: { type: Boolean },
|
|
42120
|
-
joinTime: { default: 0 },
|
|
42121
|
-
theme: { default: "dark" }
|
|
42122
|
-
},
|
|
42123
|
-
emits: ["layout-change", "toggle-fullscreen"],
|
|
42124
|
-
setup(__props, { emit: __emit }) {
|
|
42125
|
-
const speakingUserName = ref("");
|
|
42126
|
-
emitter.on("speakingUserName", (name2) => {
|
|
42127
|
-
speakingUserName.value = name2;
|
|
42128
|
-
});
|
|
42129
|
-
const props = __props;
|
|
42130
|
-
const userId = getUserId();
|
|
42131
|
-
const joinTimeObj = ref("");
|
|
42132
|
-
const speakerId = ref(null);
|
|
42133
|
-
const lastGridLayout = ref("grid-9");
|
|
42134
|
-
const getUserName2 = (user) => {
|
|
42135
|
-
var _a25, _b25, _c2;
|
|
42136
|
-
return ((_a25 = user == null ? void 0 : user.member) == null ? void 0 : _a25.memberId) == userId ? `(我)${(_b25 = user == null ? void 0 : user.member) == null ? void 0 : _b25.name}` : ((_c2 = user == null ? void 0 : user.member) == null ? void 0 : _c2.name) || "未知用户";
|
|
42137
|
-
};
|
|
42138
|
-
const layoutClass = computed(() => `layout-${props.layout}`);
|
|
42139
|
-
const allJoinedMembers = computed(() => {
|
|
42140
|
-
return members.value.filter((user) => (user == null ? void 0 : user.joinStaus) == "1");
|
|
42141
|
-
});
|
|
42142
|
-
const speakerUser = computed(() => {
|
|
42143
|
-
if (!speakerId.value) return allJoinedMembers.value[0];
|
|
42144
|
-
return allJoinedMembers.value.find(
|
|
42145
|
-
(user) => {
|
|
42146
|
-
var _a25;
|
|
42147
|
-
return ((_a25 = user == null ? void 0 : user.member) == null ? void 0 : _a25.memberId) === speakerId.value;
|
|
42148
|
-
}
|
|
42149
|
-
) || allJoinedMembers.value[0];
|
|
42150
|
-
});
|
|
42151
|
-
const preferredRemoteVideoFocusId = computed(() => {
|
|
42152
|
-
var _a25, _b25;
|
|
42153
|
-
if (props.layout !== "speaker") return null;
|
|
42154
|
-
const focusedUid = (_b25 = (_a25 = speakerUser.value) == null ? void 0 : _a25.member) == null ? void 0 : _b25.memberId;
|
|
42155
|
-
return focusedUid && focusedUid !== userId ? focusedUid : null;
|
|
42156
|
-
});
|
|
42157
|
-
const filteredMembers = computed(() => {
|
|
42158
|
-
return allJoinedMembers.value;
|
|
42159
|
-
});
|
|
42160
|
-
const setSpeaker = (user) => {
|
|
42096
|
+
function formatValue(value, suffix = "", digits = 0) {
|
|
42097
|
+
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
42098
|
+
return `${value.toFixed(digits)}${suffix}`;
|
|
42099
|
+
}
|
|
42100
|
+
function formatMetricNumber(value, suffix = "", digits = 0) {
|
|
42101
|
+
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
42102
|
+
return `${value.toFixed(digits)}${suffix}`;
|
|
42103
|
+
}
|
|
42104
|
+
function formatBytes(value) {
|
|
42105
|
+
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
42106
|
+
if (value >= 1024 * 1024) return `${(value / (1024 * 1024)).toFixed(2)} MB`;
|
|
42107
|
+
if (value >= 1024) return `${(value / 1024).toFixed(1)} KB`;
|
|
42108
|
+
return `${value.toFixed(0)} B`;
|
|
42109
|
+
}
|
|
42110
|
+
function formatDimension(width, height) {
|
|
42111
|
+
if (!width || !height) return "--";
|
|
42112
|
+
return `${width} x ${height}`;
|
|
42113
|
+
}
|
|
42114
|
+
function formatLossRate(value) {
|
|
42115
|
+
if (typeof value !== "number" || Number.isNaN(value)) return "--";
|
|
42116
|
+
return `${value.toFixed(1)}%`;
|
|
42117
|
+
}
|
|
42118
|
+
function formatMos(value) {
|
|
42119
|
+
if (typeof value !== "number" || value <= 0 || Number.isNaN(value)) return "--";
|
|
42120
|
+
return value.toFixed(1);
|
|
42121
|
+
}
|
|
42122
|
+
function formatUpdatedAt(timestamp) {
|
|
42123
|
+
if (!timestamp) return "--";
|
|
42124
|
+
const date = new Date(timestamp);
|
|
42125
|
+
const hh = String(date.getHours()).padStart(2, "0");
|
|
42126
|
+
const mm = String(date.getMinutes()).padStart(2, "0");
|
|
42127
|
+
const ss = String(date.getSeconds()).padStart(2, "0");
|
|
42128
|
+
return `${hh}:${mm}:${ss}`;
|
|
42129
|
+
}
|
|
42130
|
+
function formatReason(value) {
|
|
42131
|
+
return value || "--";
|
|
42132
|
+
}
|
|
42133
|
+
function getMemberNameById(memberId) {
|
|
42161
42134
|
var _a25;
|
|
42162
|
-
|
|
42163
|
-
|
|
42164
|
-
|
|
42135
|
+
if (!memberId) return "";
|
|
42136
|
+
const matched = members.value.find(
|
|
42137
|
+
(member) => {
|
|
42138
|
+
var _a26;
|
|
42139
|
+
return ((_a26 = member == null ? void 0 : member.member) == null ? void 0 : _a26.memberId) === String(memberId);
|
|
42140
|
+
}
|
|
42141
|
+
);
|
|
42142
|
+
return ((_a25 = matched == null ? void 0 : matched.member) == null ? void 0 : _a25.name) || "";
|
|
42143
|
+
}
|
|
42144
|
+
function startDetailRefresh() {
|
|
42145
|
+
stopDetailRefresh();
|
|
42146
|
+
refreshAdvancedDetails();
|
|
42147
|
+
detailTimer = window.setInterval(() => {
|
|
42148
|
+
refreshAdvancedDetails();
|
|
42149
|
+
}, 2e3);
|
|
42150
|
+
}
|
|
42151
|
+
function stopDetailRefresh() {
|
|
42152
|
+
if (detailTimer !== null) {
|
|
42153
|
+
window.clearInterval(detailTimer);
|
|
42154
|
+
detailTimer = null;
|
|
42165
42155
|
}
|
|
42166
|
-
}
|
|
42167
|
-
|
|
42168
|
-
|
|
42169
|
-
|
|
42156
|
+
}
|
|
42157
|
+
function refreshAdvancedDetails() {
|
|
42158
|
+
advancedDetails.value = readNetworkQualityMetricDetails();
|
|
42159
|
+
}
|
|
42160
|
+
function isSectionCollapsed(key) {
|
|
42161
|
+
return collapsedSections.value[key] ?? false;
|
|
42162
|
+
}
|
|
42163
|
+
function toggleSection(key) {
|
|
42164
|
+
collapsedSections.value[key] = !isSectionCollapsed(key);
|
|
42165
|
+
}
|
|
42166
|
+
function expandAllSections() {
|
|
42167
|
+
collapsedSections.value = Object.fromEntries(
|
|
42168
|
+
detailSections.value.map((section) => [section.key, false])
|
|
42169
|
+
);
|
|
42170
|
+
}
|
|
42171
|
+
function collapseAllSections() {
|
|
42172
|
+
collapsedSections.value = Object.fromEntries(
|
|
42173
|
+
detailSections.value.map((section) => [section.key, true])
|
|
42174
|
+
);
|
|
42175
|
+
}
|
|
42176
|
+
function toggleAllSections() {
|
|
42177
|
+
if (allSectionsExpanded.value) {
|
|
42178
|
+
collapseAllSections();
|
|
42179
|
+
return;
|
|
42170
42180
|
}
|
|
42171
|
-
|
|
42172
|
-
|
|
42173
|
-
|
|
42174
|
-
const
|
|
42175
|
-
|
|
42176
|
-
|
|
42177
|
-
|
|
42178
|
-
|
|
42179
|
-
emit("toggle-fullscreen");
|
|
42180
|
-
};
|
|
42181
|
-
const emit = __emit;
|
|
42182
|
-
let timer = null;
|
|
42183
|
-
watch(
|
|
42184
|
-
() => props.layout,
|
|
42185
|
-
(layout) => {
|
|
42186
|
-
if (layout !== "speaker") {
|
|
42187
|
-
lastGridLayout.value = layout;
|
|
42188
|
-
}
|
|
42189
|
-
},
|
|
42190
|
-
{ immediate: true }
|
|
42191
|
-
);
|
|
42192
|
-
watch(
|
|
42193
|
-
() => props.joinTime,
|
|
42194
|
-
() => {
|
|
42195
|
-
if (timer) {
|
|
42196
|
-
clearInterval(timer);
|
|
42197
|
-
timer = null;
|
|
42198
|
-
}
|
|
42199
|
-
if (props.joinTime) {
|
|
42200
|
-
timer = setInterval(() => {
|
|
42201
|
-
const now = +/* @__PURE__ */ new Date();
|
|
42202
|
-
joinTimeObj.value = formatDuringObject((now - props.joinTime) / 1e3);
|
|
42203
|
-
}, 1e3);
|
|
42181
|
+
expandAllSections();
|
|
42182
|
+
}
|
|
42183
|
+
function syncSectionCollapse(preserveExisting = true) {
|
|
42184
|
+
const nextState = {};
|
|
42185
|
+
for (const section of detailSections.value) {
|
|
42186
|
+
if (preserveExisting && section.key in collapsedSections.value) {
|
|
42187
|
+
nextState[section.key] = collapsedSections.value[section.key];
|
|
42188
|
+
continue;
|
|
42204
42189
|
}
|
|
42205
|
-
|
|
42206
|
-
{
|
|
42207
|
-
immediate: true
|
|
42190
|
+
nextState[section.key] = false;
|
|
42208
42191
|
}
|
|
42209
|
-
|
|
42210
|
-
|
|
42211
|
-
|
|
42212
|
-
|
|
42213
|
-
|
|
42214
|
-
}, 100);
|
|
42215
|
-
});
|
|
42216
|
-
watch(
|
|
42217
|
-
() => members.value.length,
|
|
42218
|
-
async (len, prevLen) => {
|
|
42219
|
-
if (!len || len === prevLen) return;
|
|
42220
|
-
await nextTick();
|
|
42221
|
-
setTimeout(() => mountTracks(), 0);
|
|
42222
|
-
},
|
|
42223
|
-
{ flush: "post" }
|
|
42224
|
-
);
|
|
42225
|
-
watch(
|
|
42226
|
-
preferredRemoteVideoFocusId,
|
|
42227
|
-
(focusedUid) => {
|
|
42228
|
-
void setPreferredRemoteVideoFocus(focusedUid);
|
|
42229
|
-
},
|
|
42230
|
-
{ immediate: true }
|
|
42231
|
-
);
|
|
42232
|
-
onUnmounted(() => {
|
|
42233
|
-
void setPreferredRemoteVideoFocus(null);
|
|
42234
|
-
if (timer) {
|
|
42235
|
-
clearInterval(timer);
|
|
42236
|
-
timer = null;
|
|
42192
|
+
collapsedSections.value = nextState;
|
|
42193
|
+
}
|
|
42194
|
+
const activeBars = computed(() => {
|
|
42195
|
+
if (networkQualityState.isOffline || networkQualityState.isStale) {
|
|
42196
|
+
return 0;
|
|
42237
42197
|
}
|
|
42198
|
+
return getNetworkSignalBars(networkQualityState.level);
|
|
42238
42199
|
});
|
|
42239
|
-
|
|
42240
|
-
|
|
42241
|
-
|
|
42242
|
-
|
|
42243
|
-
|
|
42244
|
-
|
|
42245
|
-
|
|
42246
|
-
|
|
42247
|
-
|
|
42248
|
-
|
|
42249
|
-
|
|
42250
|
-
|
|
42251
|
-
|
|
42252
|
-
|
|
42200
|
+
const allSectionsExpanded = computed(() => {
|
|
42201
|
+
if (!detailSections.value.length) return true;
|
|
42202
|
+
return detailSections.value.every((section) => !isSectionCollapsed(section.key));
|
|
42203
|
+
});
|
|
42204
|
+
const reasonText = computed(() => {
|
|
42205
|
+
if (!networkQualityState.reasons.length) return "";
|
|
42206
|
+
return `可能原因:${networkQualityState.reasons.join("、")}`;
|
|
42207
|
+
});
|
|
42208
|
+
const qualityItems = computed(() => [
|
|
42209
|
+
{ label: "总体质量", value: networkQualityState.label },
|
|
42210
|
+
{ label: "上行质量", value: networkQualityState.uplink },
|
|
42211
|
+
{ label: "下行质量", value: networkQualityState.downlink },
|
|
42212
|
+
{ label: "MOS", value: formatMos(networkQualityState.mos) },
|
|
42213
|
+
{ label: "最近更新", value: formatUpdatedAt(networkQualityState.updatedAt) },
|
|
42214
|
+
{
|
|
42215
|
+
label: "数据状态",
|
|
42216
|
+
value: networkQualityState.isStale ? "已过期" : "实时"
|
|
42217
|
+
}
|
|
42218
|
+
]);
|
|
42219
|
+
const overviewItems = computed(() => {
|
|
42220
|
+
const stats = networkQualityState.stats;
|
|
42221
|
+
return [
|
|
42222
|
+
{ label: "上行 RTT", value: formatValue(stats == null ? void 0 : stats.rtt_up, " ms") },
|
|
42223
|
+
{ label: "下行 RTT", value: formatValue(stats == null ? void 0 : stats.rtt_down, " ms") },
|
|
42224
|
+
{ label: "上行码率", value: formatValue(stats == null ? void 0 : stats.bitrate_up, " kb/s") },
|
|
42225
|
+
{ label: "下行码率", value: formatValue(stats == null ? void 0 : stats.bitrate_down, " kb/s") },
|
|
42226
|
+
{ label: "上行丢包率", value: formatLossRate(stats == null ? void 0 : stats.lossrate_up) },
|
|
42227
|
+
{ label: "下行丢包率", value: formatLossRate(stats == null ? void 0 : stats.lossrate_down) },
|
|
42228
|
+
{
|
|
42229
|
+
label: "可用上行带宽",
|
|
42230
|
+
value: formatValue(stats == null ? void 0 : stats.available_outgoing_bitrate, " kb/s")
|
|
42231
|
+
},
|
|
42232
|
+
{
|
|
42233
|
+
label: "可用下行带宽",
|
|
42234
|
+
value: formatValue(stats == null ? void 0 : stats.available_incoming_bitrate, " kb/s")
|
|
42235
|
+
}
|
|
42236
|
+
];
|
|
42237
|
+
});
|
|
42238
|
+
function createAudioSendCard(item, index) {
|
|
42239
|
+
const stats = (item == null ? void 0 : item.stats) || {};
|
|
42240
|
+
return {
|
|
42241
|
+
title: `本地音频 ${index + 1}`,
|
|
42242
|
+
subtitle: (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.streamId) || "发送轨道",
|
|
42243
|
+
items: [
|
|
42244
|
+
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
42245
|
+
{ label: "音频电平", value: formatMetricNumber(item == null ? void 0 : item.db, " dBFS", 1) },
|
|
42246
|
+
{ label: "已发包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsSent) },
|
|
42247
|
+
{ label: "已发字节", value: formatBytes(stats == null ? void 0 : stats.bytesSent) },
|
|
42248
|
+
{ label: "远端丢包", value: formatMetricNumber(stats == null ? void 0 : stats.packetsLost) },
|
|
42249
|
+
{ label: "往返时延", value: formatMetricNumber(stats == null ? void 0 : stats.roundTripTime, " ms") },
|
|
42250
|
+
{ label: "远端抖动", value: formatMetricNumber(stats == null ? void 0 : stats.jitter, " ms") },
|
|
42251
|
+
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
42252
|
+
]
|
|
42253
|
+
};
|
|
42254
|
+
}
|
|
42255
|
+
function createVideoSendCard(item, index) {
|
|
42256
|
+
const stats = (item == null ? void 0 : item.stats) || {};
|
|
42257
|
+
return {
|
|
42258
|
+
title: `本地视频 ${index + 1}`,
|
|
42259
|
+
subtitle: (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.rid) || (stats == null ? void 0 : stats.streamId) || "发送轨道",
|
|
42260
|
+
items: [
|
|
42261
|
+
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
42262
|
+
{ label: "分辨率", value: formatDimension((item == null ? void 0 : item.width) || (stats == null ? void 0 : stats.frameWidth), (item == null ? void 0 : item.height) || (stats == null ? void 0 : stats.frameHeight)) },
|
|
42263
|
+
{ label: "帧率", value: formatMetricNumber((item == null ? void 0 : item.fps) || (stats == null ? void 0 : stats.framesPerSecond), " fps") },
|
|
42264
|
+
{ label: "已发帧数", value: formatMetricNumber(stats == null ? void 0 : stats.framesSent) },
|
|
42265
|
+
{ label: "目标码率", value: formatMetricNumber(stats == null ? void 0 : stats.targetBitrate, " bps") },
|
|
42266
|
+
{ label: "FIR/PLI/NACK", value: `${formatMetricNumber(stats == null ? void 0 : stats.firCount)}/${formatMetricNumber(stats == null ? void 0 : stats.pliCount)}/${formatMetricNumber(stats == null ? void 0 : stats.nackCount)}` },
|
|
42267
|
+
{ label: "重传包数", value: formatMetricNumber(stats == null ? void 0 : stats.retransmittedPacketsSent) },
|
|
42268
|
+
{ label: "受限原因", value: formatReason(stats == null ? void 0 : stats.qualityLimitationReason) },
|
|
42269
|
+
{ label: "分辨率变化", value: formatMetricNumber(stats == null ? void 0 : stats.qualityLimitationResolutionChanges) },
|
|
42270
|
+
{ label: "往返时延", value: formatMetricNumber(stats == null ? void 0 : stats.roundTripTime, " ms") },
|
|
42271
|
+
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
42272
|
+
]
|
|
42273
|
+
};
|
|
42274
|
+
}
|
|
42275
|
+
function createAudioRecvCard(item, index) {
|
|
42276
|
+
const stats = (item == null ? void 0 : item.stats) || {};
|
|
42277
|
+
return {
|
|
42278
|
+
title: `远端音频 ${index + 1}`,
|
|
42279
|
+
subtitle: (item == null ? void 0 : item.uid) || (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.streamId) || "接收轨道",
|
|
42280
|
+
items: [
|
|
42281
|
+
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
42282
|
+
{ label: "音频电平", value: formatMetricNumber(item == null ? void 0 : item.db, " dBFS", 1) },
|
|
42283
|
+
{ label: "已收包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsReceived) },
|
|
42284
|
+
{ label: "已收字节", value: formatBytes(stats == null ? void 0 : stats.bytesReceived) },
|
|
42285
|
+
{ label: "丢包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsLost) },
|
|
42286
|
+
{ label: "网络抖动", value: formatMetricNumber(stats == null ? void 0 : stats.jitter, " ms") },
|
|
42287
|
+
{ label: "缓冲均值", value: formatMetricNumber(stats == null ? void 0 : stats.jitterBufferAvgDelay, " ms") },
|
|
42288
|
+
{ label: "隐藏事件", value: formatMetricNumber(stats == null ? void 0 : stats.concealmentEvents) },
|
|
42289
|
+
{ label: "静音隐藏", value: formatMetricNumber(stats == null ? void 0 : stats.silentConcealmentEvents) },
|
|
42290
|
+
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
42291
|
+
]
|
|
42292
|
+
};
|
|
42293
|
+
}
|
|
42294
|
+
function createVideoRecvCard(item, index) {
|
|
42295
|
+
const stats = (item == null ? void 0 : item.stats) || {};
|
|
42296
|
+
const memberName = getMemberNameById(item == null ? void 0 : item.uid);
|
|
42297
|
+
return {
|
|
42298
|
+
title: `远端视频 ${index + 1}`,
|
|
42299
|
+
subtitle: memberName || (item == null ? void 0 : item.uid) || (item == null ? void 0 : item.desc) || (stats == null ? void 0 : stats.mimeType) || "接收轨道",
|
|
42300
|
+
items: [
|
|
42301
|
+
{ label: "实时码率", value: formatMetricNumber(item == null ? void 0 : item.bitrate, " kb/s") },
|
|
42302
|
+
{ label: "分辨率", value: formatDimension((item == null ? void 0 : item.width) || (stats == null ? void 0 : stats.frameWidth), (item == null ? void 0 : item.height) || (stats == null ? void 0 : stats.frameHeight)) },
|
|
42303
|
+
{ label: "帧率", value: formatMetricNumber((item == null ? void 0 : item.fps) || (stats == null ? void 0 : stats.framesPerSecond), " fps") },
|
|
42304
|
+
{ label: "已收包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsReceived) },
|
|
42305
|
+
{ label: "已收字节", value: formatBytes(stats == null ? void 0 : stats.bytesReceived) },
|
|
42306
|
+
{ label: "丢包数", value: formatMetricNumber(stats == null ? void 0 : stats.packetsLost) },
|
|
42307
|
+
{ label: "接收/解码帧", value: `${formatMetricNumber(stats == null ? void 0 : stats.framesReceived)}/${formatMetricNumber(stats == null ? void 0 : stats.framesDecoded)}` },
|
|
42308
|
+
{ label: "丢帧数", value: formatMetricNumber(stats == null ? void 0 : stats.framesDropped) },
|
|
42309
|
+
{ label: "FIR/PLI/NACK", value: `${formatMetricNumber(stats == null ? void 0 : stats.firCount)}/${formatMetricNumber(stats == null ? void 0 : stats.pliCount)}/${formatMetricNumber(stats == null ? void 0 : stats.nackCount)}` },
|
|
42310
|
+
{ label: "缓冲均值", value: formatMetricNumber(stats == null ? void 0 : stats.jitterBufferAvgDelay, " ms") },
|
|
42311
|
+
{ label: "解码器", value: formatReason(stats == null ? void 0 : stats.decoderImplementation) },
|
|
42312
|
+
{ label: "MIME", value: formatReason(stats == null ? void 0 : stats.mimeType) },
|
|
42313
|
+
{ label: "采样时间", value: formatUpdatedAt(stats == null ? void 0 : stats.timestamp) }
|
|
42314
|
+
]
|
|
42315
|
+
};
|
|
42316
|
+
}
|
|
42317
|
+
const detailSections = computed(() => {
|
|
42318
|
+
const details = advancedDetails.value;
|
|
42319
|
+
return [
|
|
42320
|
+
{
|
|
42321
|
+
key: "local-audio",
|
|
42322
|
+
title: "本地音频发送",
|
|
42323
|
+
cards: ((details == null ? void 0 : details.local_audios) || []).map(createAudioSendCard)
|
|
42324
|
+
},
|
|
42325
|
+
{
|
|
42326
|
+
key: "local-video",
|
|
42327
|
+
title: "本地视频发送",
|
|
42328
|
+
cards: ((details == null ? void 0 : details.local_videos) || []).map(createVideoSendCard)
|
|
42329
|
+
},
|
|
42330
|
+
{
|
|
42331
|
+
key: "remote-audio",
|
|
42332
|
+
title: "远端音频接收",
|
|
42333
|
+
cards: ((details == null ? void 0 : details.remote_audios) || []).map(createAudioRecvCard)
|
|
42334
|
+
},
|
|
42335
|
+
{
|
|
42336
|
+
key: "remote-video",
|
|
42337
|
+
title: "远端视频接收",
|
|
42338
|
+
cards: ((details == null ? void 0 : details.remote_videos) || []).map(createVideoRecvCard)
|
|
42339
|
+
}
|
|
42340
|
+
];
|
|
42341
|
+
});
|
|
42342
|
+
watch(showPopup, (visible) => {
|
|
42343
|
+
if (visible) {
|
|
42344
|
+
refreshNetworkQualitySnapshot(false);
|
|
42345
|
+
if (advancedOpen.value) {
|
|
42346
|
+
syncSectionCollapse();
|
|
42347
|
+
startDetailRefresh();
|
|
42348
|
+
}
|
|
42349
|
+
return;
|
|
42350
|
+
}
|
|
42351
|
+
stopDetailRefresh();
|
|
42352
|
+
advancedOpen.value = false;
|
|
42353
|
+
collapsedSections.value = {};
|
|
42354
|
+
advancedDetails.value = void 0;
|
|
42355
|
+
});
|
|
42356
|
+
watch(advancedOpen, (open2) => {
|
|
42357
|
+
if (!showPopup.value) return;
|
|
42358
|
+
if (open2) {
|
|
42359
|
+
syncSectionCollapse(false);
|
|
42360
|
+
startDetailRefresh();
|
|
42361
|
+
} else {
|
|
42362
|
+
stopDetailRefresh();
|
|
42363
|
+
advancedDetails.value = void 0;
|
|
42364
|
+
}
|
|
42365
|
+
});
|
|
42366
|
+
watch(
|
|
42367
|
+
detailSections,
|
|
42368
|
+
() => {
|
|
42369
|
+
if (!advancedOpen.value) return;
|
|
42370
|
+
syncSectionCollapse();
|
|
42371
|
+
},
|
|
42372
|
+
{ deep: true }
|
|
42373
|
+
);
|
|
42374
|
+
onUnmounted(() => {
|
|
42375
|
+
stopDetailRefresh();
|
|
42376
|
+
});
|
|
42377
|
+
return (_ctx, _cache) => {
|
|
42378
|
+
return openBlock(), createElementBlock("div", {
|
|
42379
|
+
class: normalizeClass(["network-quality-signal", [`size-${_ctx.size}`]])
|
|
42380
|
+
}, [
|
|
42381
|
+
createElementVNode("button", {
|
|
42382
|
+
ref_key: "triggerRef",
|
|
42383
|
+
ref: triggerRef,
|
|
42384
|
+
type: "button",
|
|
42385
|
+
class: normalizeClass(["network-quality-trigger", [
|
|
42386
|
+
`is-${unref(networkQualityState).level}`,
|
|
42387
|
+
{
|
|
42388
|
+
"is-alert": unref(networkQualityState).isOffline || unref(networkQualityState).isStale
|
|
42389
|
+
}
|
|
42390
|
+
]]),
|
|
42391
|
+
title: unref(networkQualityState).summary,
|
|
42392
|
+
onClick: _cache[0] || (_cache[0] = ($event) => showPopup.value = !showPopup.value)
|
|
42393
|
+
}, [
|
|
42394
|
+
createElementVNode("span", _hoisted_2$k, [
|
|
42395
|
+
(openBlock(), createElementBlock(Fragment, null, renderList(4, (index) => {
|
|
42396
|
+
return createElementVNode("span", {
|
|
42397
|
+
key: index,
|
|
42398
|
+
class: normalizeClass(["signal-bar", { active: index <= activeBars.value }])
|
|
42399
|
+
}, null, 2);
|
|
42400
|
+
}), 64))
|
|
42401
|
+
]),
|
|
42402
|
+
_ctx.showText ? (openBlock(), createElementBlock("span", _hoisted_3$k, toDisplayString(unref(networkQualityState).label), 1)) : createCommentVNode("", true)
|
|
42403
|
+
], 10, _hoisted_1$m),
|
|
42404
|
+
createVNode(SmartPopup, {
|
|
42405
|
+
visible: showPopup.value,
|
|
42406
|
+
"onUpdate:visible": _cache[3] || (_cache[3] = ($event) => showPopup.value = $event),
|
|
42407
|
+
trigger: triggerRef.value,
|
|
42408
|
+
gap: 12
|
|
42409
|
+
}, {
|
|
42410
|
+
default: withCtx(() => [
|
|
42411
|
+
createElementVNode("div", _hoisted_4$i, [
|
|
42412
|
+
createElementVNode("div", {
|
|
42413
|
+
class: normalizeClass(["network-quality-popup network-quality-main", themeClass.value])
|
|
42414
|
+
}, [
|
|
42415
|
+
createElementVNode("div", _hoisted_5$f, [
|
|
42416
|
+
_cache[4] || (_cache[4] = createElementVNode("div", { class: "popup-title" }, "网络详情", -1)),
|
|
42417
|
+
createElementVNode("div", _hoisted_6$e, [
|
|
42418
|
+
createElementVNode("button", {
|
|
42419
|
+
type: "button",
|
|
42420
|
+
class: "advanced-toggle",
|
|
42421
|
+
onClick: _cache[1] || (_cache[1] = withModifiers(($event) => advancedOpen.value = !advancedOpen.value, ["stop"]))
|
|
42422
|
+
}, toDisplayString(advancedOpen.value ? "关闭高级模式" : "打开高级模式"), 1),
|
|
42423
|
+
createElementVNode("div", {
|
|
42424
|
+
class: normalizeClass(["popup-status", `is-${unref(networkQualityState).level}`])
|
|
42425
|
+
}, toDisplayString(unref(networkQualityState).label), 3)
|
|
42426
|
+
])
|
|
42427
|
+
]),
|
|
42428
|
+
createElementVNode("div", _hoisted_7$d, toDisplayString(unref(networkQualityState).summary), 1),
|
|
42429
|
+
reasonText.value ? (openBlock(), createElementBlock("div", _hoisted_8$c, toDisplayString(reasonText.value), 1)) : createCommentVNode("", true),
|
|
42430
|
+
createElementVNode("div", _hoisted_9$a, [
|
|
42431
|
+
_cache[5] || (_cache[5] = createElementVNode("div", { class: "popup-section-title" }, "质量概览", -1)),
|
|
42432
|
+
createElementVNode("div", _hoisted_10$a, [
|
|
42433
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(qualityItems.value, (item) => {
|
|
42434
|
+
return openBlock(), createElementBlock("div", {
|
|
42435
|
+
key: item.label,
|
|
42436
|
+
class: "popup-item"
|
|
42437
|
+
}, [
|
|
42438
|
+
createElementVNode("div", _hoisted_11$9, toDisplayString(item.label), 1),
|
|
42439
|
+
createElementVNode("div", _hoisted_12$9, toDisplayString(item.value), 1)
|
|
42440
|
+
]);
|
|
42441
|
+
}), 128))
|
|
42442
|
+
])
|
|
42443
|
+
]),
|
|
42444
|
+
createElementVNode("div", _hoisted_13$7, [
|
|
42445
|
+
_cache[6] || (_cache[6] = createElementVNode("div", { class: "popup-section-title" }, "网络指标", -1)),
|
|
42446
|
+
createElementVNode("div", _hoisted_14$6, [
|
|
42447
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(overviewItems.value, (item) => {
|
|
42448
|
+
return openBlock(), createElementBlock("div", {
|
|
42449
|
+
key: item.label,
|
|
42450
|
+
class: "popup-item"
|
|
42451
|
+
}, [
|
|
42452
|
+
createElementVNode("div", _hoisted_15$5, toDisplayString(item.label), 1),
|
|
42453
|
+
createElementVNode("div", _hoisted_16$5, toDisplayString(item.value), 1)
|
|
42454
|
+
]);
|
|
42455
|
+
}), 128))
|
|
42456
|
+
])
|
|
42457
|
+
])
|
|
42458
|
+
], 2),
|
|
42459
|
+
advancedOpen.value ? (openBlock(), createElementBlock("div", {
|
|
42460
|
+
key: 0,
|
|
42461
|
+
class: normalizeClass(["network-quality-popup network-quality-advanced", themeClass.value]),
|
|
42462
|
+
onClick: _cache[2] || (_cache[2] = withModifiers(() => {
|
|
42463
|
+
}, ["stop"]))
|
|
42464
|
+
}, [
|
|
42465
|
+
createElementVNode("div", _hoisted_17$4, [
|
|
42466
|
+
_cache[7] || (_cache[7] = createElementVNode("div", { class: "popup-title" }, "高级模式", -1)),
|
|
42467
|
+
createElementVNode("div", _hoisted_18$4, [
|
|
42468
|
+
createElementVNode("button", {
|
|
42469
|
+
type: "button",
|
|
42470
|
+
class: "advanced-mini-btn",
|
|
42471
|
+
onClick: toggleAllSections
|
|
42472
|
+
}, toDisplayString(allSectionsExpanded.value ? "全部收起" : "全部展开"), 1)
|
|
42473
|
+
])
|
|
42474
|
+
]),
|
|
42475
|
+
createElementVNode("div", _hoisted_19$4, [
|
|
42476
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(detailSections.value, (section) => {
|
|
42477
|
+
return openBlock(), createElementBlock("div", {
|
|
42478
|
+
key: section.key,
|
|
42479
|
+
class: "popup-section"
|
|
42480
|
+
}, [
|
|
42481
|
+
createElementVNode("button", {
|
|
42482
|
+
type: "button",
|
|
42483
|
+
class: normalizeClass(["detail-section-toggle", { collapsed: isSectionCollapsed(section.key) }]),
|
|
42484
|
+
onClick: ($event) => toggleSection(section.key)
|
|
42485
|
+
}, [
|
|
42486
|
+
createElementVNode("span", _hoisted_21$2, [
|
|
42487
|
+
createElementVNode("span", _hoisted_22$2, toDisplayString(section.title), 1),
|
|
42488
|
+
createElementVNode("span", _hoisted_23$2, "(" + toDisplayString(section.cards.length) + ")", 1)
|
|
42489
|
+
]),
|
|
42490
|
+
createElementVNode("span", _hoisted_24$2, toDisplayString(isSectionCollapsed(section.key) ? "展开" : "收起"), 1)
|
|
42491
|
+
], 10, _hoisted_20$4),
|
|
42492
|
+
!isSectionCollapsed(section.key) && section.cards.length ? (openBlock(), createElementBlock("div", _hoisted_25$2, [
|
|
42493
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(section.cards, (card) => {
|
|
42494
|
+
return openBlock(), createElementBlock("div", {
|
|
42495
|
+
key: card.title,
|
|
42496
|
+
class: "metric-card"
|
|
42497
|
+
}, [
|
|
42498
|
+
createElementVNode("div", _hoisted_26$2, [
|
|
42499
|
+
createElementVNode("div", _hoisted_27$2, toDisplayString(card.title), 1),
|
|
42500
|
+
createElementVNode("div", _hoisted_28$2, toDisplayString(card.subtitle), 1)
|
|
42501
|
+
]),
|
|
42502
|
+
createElementVNode("div", _hoisted_29$2, [
|
|
42503
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(card.items, (item) => {
|
|
42504
|
+
return openBlock(), createElementBlock("div", {
|
|
42505
|
+
key: `${card.title}-${item.label}`,
|
|
42506
|
+
class: "metric-card-item"
|
|
42507
|
+
}, [
|
|
42508
|
+
createElementVNode("div", _hoisted_30$2, toDisplayString(item.label), 1),
|
|
42509
|
+
createElementVNode("div", _hoisted_31$1, toDisplayString(item.value), 1)
|
|
42510
|
+
]);
|
|
42511
|
+
}), 128))
|
|
42512
|
+
])
|
|
42513
|
+
]);
|
|
42514
|
+
}), 128))
|
|
42515
|
+
])) : !isSectionCollapsed(section.key) ? (openBlock(), createElementBlock("div", _hoisted_32$1, "暂无数据")) : createCommentVNode("", true)
|
|
42516
|
+
]);
|
|
42517
|
+
}), 128))
|
|
42518
|
+
])
|
|
42519
|
+
], 2)) : createCommentVNode("", true)
|
|
42520
|
+
])
|
|
42521
|
+
]),
|
|
42522
|
+
_: 1
|
|
42523
|
+
}, 8, ["visible", "trigger"])
|
|
42524
|
+
], 2);
|
|
42525
|
+
};
|
|
42526
|
+
}
|
|
42527
|
+
});
|
|
42528
|
+
const NetworkQualitySignal = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-3378006f"]]);
|
|
42529
|
+
const _hoisted_1$l = { class: "network-copy" };
|
|
42530
|
+
const _sfc_main$n = /* @__PURE__ */ defineComponent({
|
|
42531
|
+
__name: "netWorkStatus",
|
|
42532
|
+
props: {
|
|
42533
|
+
theme: { default: "dark" }
|
|
42534
|
+
},
|
|
42535
|
+
setup(__props) {
|
|
42536
|
+
const props = __props;
|
|
42537
|
+
const themeClass = computed(() => `theme-${props.theme}`);
|
|
42538
|
+
const displayLabel = computed(() => {
|
|
42539
|
+
if (networkQualityState.isStale) {
|
|
42540
|
+
return "网络检测中";
|
|
42541
|
+
}
|
|
42542
|
+
return networkQualityState.label;
|
|
42543
|
+
});
|
|
42544
|
+
return (_ctx, _cache) => {
|
|
42545
|
+
return openBlock(), createElementBlock("div", {
|
|
42546
|
+
class: normalizeClass(["network-situation", themeClass.value])
|
|
42547
|
+
}, [
|
|
42548
|
+
createVNode(NetworkQualitySignal, {
|
|
42549
|
+
theme: _ctx.theme,
|
|
42550
|
+
size: "compact"
|
|
42551
|
+
}, null, 8, ["theme"]),
|
|
42552
|
+
createElementVNode("div", _hoisted_1$l, [
|
|
42553
|
+
createElementVNode("span", {
|
|
42554
|
+
class: normalizeClass(["network-label", `is-${unref(networkQualityState).level}`])
|
|
42555
|
+
}, toDisplayString(displayLabel.value), 3)
|
|
42556
|
+
])
|
|
42557
|
+
], 2);
|
|
42558
|
+
};
|
|
42559
|
+
}
|
|
42560
|
+
});
|
|
42561
|
+
const NetWorkStatus = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__scopeId", "data-v-565d8abd"]]);
|
|
42562
|
+
const _hoisted_1$k = { class: "js-dialog-content-inner" };
|
|
42563
|
+
const _hoisted_2$j = { class: "js-dialog-content-inner-left" };
|
|
42564
|
+
const _hoisted_3$j = { class: "js-dialog-content-inner-right" };
|
|
42565
|
+
const _hoisted_4$h = { class: "grid-layout" };
|
|
42566
|
+
const _hoisted_5$e = ["onClick"];
|
|
42567
|
+
const _hoisted_6$d = {
|
|
42568
|
+
key: 0,
|
|
42569
|
+
class: "host-tag"
|
|
42570
|
+
};
|
|
42571
|
+
const _hoisted_7$c = ["id"];
|
|
42572
|
+
const _hoisted_8$b = { class: "avatar-container" };
|
|
42573
|
+
const _hoisted_9$9 = { class: "video-loading-overlay" };
|
|
42574
|
+
const _hoisted_10$9 = { class: "video-loading-text" };
|
|
42575
|
+
const _hoisted_11$8 = { class: "video-loading-overlay failed" };
|
|
42576
|
+
const _hoisted_12$8 = ["disabled", "onClick"];
|
|
42577
|
+
const _sfc_main$m = /* @__PURE__ */ defineComponent({
|
|
42578
|
+
__name: "meeting-content",
|
|
42579
|
+
props: {
|
|
42580
|
+
layout: { default: "grid-9" },
|
|
42581
|
+
isFullscreen: { type: Boolean },
|
|
42582
|
+
joinTime: { default: 0 },
|
|
42583
|
+
theme: { default: "dark" }
|
|
42584
|
+
},
|
|
42585
|
+
emits: ["layout-change", "toggle-fullscreen"],
|
|
42586
|
+
setup(__props, { emit: __emit }) {
|
|
42587
|
+
const speakingUserName = ref("");
|
|
42588
|
+
emitter.on("speakingUserName", (name2) => {
|
|
42589
|
+
speakingUserName.value = name2;
|
|
42590
|
+
});
|
|
42591
|
+
const props = __props;
|
|
42592
|
+
const userId = getUserId();
|
|
42593
|
+
const joinTimeObj = ref("");
|
|
42594
|
+
const speakerId = ref(null);
|
|
42595
|
+
const lastGridLayout = ref("grid-9");
|
|
42596
|
+
const getUserName2 = (user) => {
|
|
42597
|
+
var _a25, _b25, _c2;
|
|
42598
|
+
return ((_a25 = user == null ? void 0 : user.member) == null ? void 0 : _a25.memberId) == userId ? `(我)${(_b25 = user == null ? void 0 : user.member) == null ? void 0 : _b25.name}` : ((_c2 = user == null ? void 0 : user.member) == null ? void 0 : _c2.name) || "未知用户";
|
|
42599
|
+
};
|
|
42600
|
+
const layoutClass = computed(() => `layout-${props.layout}`);
|
|
42601
|
+
const allJoinedMembers = computed(() => {
|
|
42602
|
+
return members.value.filter((user) => (user == null ? void 0 : user.joinStaus) == "1");
|
|
42603
|
+
});
|
|
42604
|
+
const speakerUser = computed(() => {
|
|
42605
|
+
if (!speakerId.value) return allJoinedMembers.value[0];
|
|
42606
|
+
return allJoinedMembers.value.find(
|
|
42607
|
+
(user) => {
|
|
42608
|
+
var _a25;
|
|
42609
|
+
return ((_a25 = user == null ? void 0 : user.member) == null ? void 0 : _a25.memberId) === speakerId.value;
|
|
42610
|
+
}
|
|
42611
|
+
) || allJoinedMembers.value[0];
|
|
42612
|
+
});
|
|
42613
|
+
const preferredRemoteVideoFocusId = computed(() => {
|
|
42614
|
+
var _a25, _b25;
|
|
42615
|
+
if (props.layout !== "speaker") return null;
|
|
42616
|
+
const focusedUid = (_b25 = (_a25 = speakerUser.value) == null ? void 0 : _a25.member) == null ? void 0 : _b25.memberId;
|
|
42617
|
+
return focusedUid && focusedUid !== userId ? focusedUid : null;
|
|
42618
|
+
});
|
|
42619
|
+
const filteredMembers = computed(() => {
|
|
42620
|
+
return allJoinedMembers.value;
|
|
42621
|
+
});
|
|
42622
|
+
const setSpeaker = (user) => {
|
|
42623
|
+
var _a25;
|
|
42624
|
+
speakerId.value = (_a25 = user == null ? void 0 : user.member) == null ? void 0 : _a25.memberId;
|
|
42625
|
+
if (props.layout !== "speaker") {
|
|
42626
|
+
emit("layout-change", "speaker");
|
|
42627
|
+
}
|
|
42628
|
+
};
|
|
42629
|
+
const clearSpeaker = () => {
|
|
42630
|
+
if (props.layout === "speaker") {
|
|
42631
|
+
emit("layout-change", lastGridLayout.value);
|
|
42632
|
+
}
|
|
42633
|
+
};
|
|
42634
|
+
const handleRetryVideo = async (user) => {
|
|
42635
|
+
var _a25;
|
|
42636
|
+
const memberId = (_a25 = user == null ? void 0 : user.member) == null ? void 0 : _a25.memberId;
|
|
42637
|
+
if (!memberId || memberId === userId || (user == null ? void 0 : user.videoRetrying)) return;
|
|
42638
|
+
await retryRemoteVideoSubscription(memberId);
|
|
42639
|
+
};
|
|
42640
|
+
const handleFullscreenClick = () => {
|
|
42641
|
+
emit("toggle-fullscreen");
|
|
42642
|
+
};
|
|
42643
|
+
const emit = __emit;
|
|
42644
|
+
let timer = null;
|
|
42645
|
+
watch(
|
|
42646
|
+
() => props.layout,
|
|
42647
|
+
(layout) => {
|
|
42648
|
+
if (layout !== "speaker") {
|
|
42649
|
+
lastGridLayout.value = layout;
|
|
42650
|
+
}
|
|
42651
|
+
},
|
|
42652
|
+
{ immediate: true }
|
|
42653
|
+
);
|
|
42654
|
+
watch(
|
|
42655
|
+
() => props.joinTime,
|
|
42656
|
+
() => {
|
|
42657
|
+
if (timer) {
|
|
42658
|
+
clearInterval(timer);
|
|
42659
|
+
timer = null;
|
|
42660
|
+
}
|
|
42661
|
+
if (props.joinTime) {
|
|
42662
|
+
timer = setInterval(() => {
|
|
42663
|
+
const now = +/* @__PURE__ */ new Date();
|
|
42664
|
+
joinTimeObj.value = formatDuringObject((now - props.joinTime) / 1e3);
|
|
42665
|
+
}, 1e3);
|
|
42666
|
+
}
|
|
42667
|
+
},
|
|
42668
|
+
{
|
|
42669
|
+
immediate: true
|
|
42670
|
+
}
|
|
42671
|
+
);
|
|
42672
|
+
onMounted(async () => {
|
|
42673
|
+
await nextTick();
|
|
42674
|
+
setTimeout(() => {
|
|
42675
|
+
mountTracks();
|
|
42676
|
+
}, 100);
|
|
42677
|
+
});
|
|
42678
|
+
watch(
|
|
42679
|
+
() => members.value.length,
|
|
42680
|
+
async (len, prevLen) => {
|
|
42681
|
+
if (!len || len === prevLen) return;
|
|
42682
|
+
await nextTick();
|
|
42683
|
+
setTimeout(() => mountTracks(), 0);
|
|
42684
|
+
},
|
|
42685
|
+
{ flush: "post" }
|
|
42686
|
+
);
|
|
42687
|
+
watch(
|
|
42688
|
+
preferredRemoteVideoFocusId,
|
|
42689
|
+
(focusedUid) => {
|
|
42690
|
+
void setPreferredRemoteVideoFocus(focusedUid);
|
|
42691
|
+
},
|
|
42692
|
+
{ immediate: true }
|
|
42693
|
+
);
|
|
42694
|
+
onUnmounted(() => {
|
|
42695
|
+
void setPreferredRemoteVideoFocus(null);
|
|
42696
|
+
if (timer) {
|
|
42697
|
+
clearInterval(timer);
|
|
42698
|
+
timer = null;
|
|
42699
|
+
}
|
|
42700
|
+
});
|
|
42701
|
+
return (_ctx, _cache) => {
|
|
42702
|
+
return openBlock(), createElementBlock(Fragment, null, [
|
|
42703
|
+
createElementVNode("div", _hoisted_1$k, [
|
|
42704
|
+
createElementVNode("div", _hoisted_2$j, [
|
|
42705
|
+
createVNode(NetWorkStatus, { theme: _ctx.theme }, null, 8, ["theme"]),
|
|
42706
|
+
createElementVNode("span", null, "正在讲话:" + toDisplayString(speakingUserName.value || "无"), 1)
|
|
42707
|
+
]),
|
|
42708
|
+
createElementVNode("div", _hoisted_3$j, [
|
|
42709
|
+
createElementVNode("span", null, toDisplayString(joinTimeObj.value), 1),
|
|
42710
|
+
createVNode(SvgIcon, {
|
|
42711
|
+
name: _ctx.isFullscreen ? "NoFullscreenIcon" : "FullscreenIcon",
|
|
42712
|
+
class: "icon-inactive",
|
|
42713
|
+
onClick: handleFullscreenClick
|
|
42714
|
+
}, null, 8, ["name"])
|
|
42253
42715
|
])
|
|
42254
42716
|
]),
|
|
42255
42717
|
createElementVNode("div", {
|
|
@@ -44829,23 +45291,26 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
|
|
|
44829
45291
|
await nextTick();
|
|
44830
45292
|
mountTracks();
|
|
44831
45293
|
};
|
|
44832
|
-
const
|
|
44833
|
-
|
|
44834
|
-
if (
|
|
44835
|
-
|
|
44836
|
-
|
|
44837
|
-
)
|
|
44838
|
-
|
|
44839
|
-
|
|
44840
|
-
|
|
44841
|
-
|
|
44842
|
-
|
|
44843
|
-
|
|
44844
|
-
|
|
44845
|
-
document.exitFullscreen()
|
|
44846
|
-
|
|
44847
|
-
});
|
|
45294
|
+
const fullscreenOperationBusy = ref(false);
|
|
45295
|
+
const handleFullscreen = async () => {
|
|
45296
|
+
if (fullscreenOperationBusy.value) return;
|
|
45297
|
+
fullscreenOperationBusy.value = true;
|
|
45298
|
+
try {
|
|
45299
|
+
if (!document.fullscreenElement) {
|
|
45300
|
+
const fullscreenRoot = document.querySelector(
|
|
45301
|
+
".js-dialog-overlay"
|
|
45302
|
+
);
|
|
45303
|
+
if (!fullscreenRoot) return;
|
|
45304
|
+
await fullscreenRoot.requestFullscreen();
|
|
45305
|
+
isFullscreen.value = true;
|
|
45306
|
+
} else {
|
|
45307
|
+
await document.exitFullscreen();
|
|
45308
|
+
isFullscreen.value = false;
|
|
44848
45309
|
}
|
|
45310
|
+
} catch {
|
|
45311
|
+
isFullscreen.value = !!document.fullscreenElement;
|
|
45312
|
+
} finally {
|
|
45313
|
+
fullscreenOperationBusy.value = false;
|
|
44849
45314
|
}
|
|
44850
45315
|
};
|
|
44851
45316
|
const handleInvite = (arr) => {
|
|
@@ -44931,6 +45396,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
|
|
|
44931
45396
|
});
|
|
44932
45397
|
};
|
|
44933
45398
|
const leaveMeeting = () => {
|
|
45399
|
+
console.log(111111111111111);
|
|
44934
45400
|
getLoading().show();
|
|
44935
45401
|
const meetingInfo = JSON.parse(
|
|
44936
45402
|
sessionStorage.getItem("JS_MEETING_INFO") || "{}"
|
|
@@ -45074,7 +45540,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
|
|
|
45074
45540
|
};
|
|
45075
45541
|
}
|
|
45076
45542
|
});
|
|
45077
|
-
const JSMeeting = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-
|
|
45543
|
+
const JSMeeting = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-9fde748a"]]);
|
|
45078
45544
|
const _hoisted_1$8 = { class: "modal" };
|
|
45079
45545
|
const _hoisted_2$8 = { class: "modal-header" };
|
|
45080
45546
|
const _hoisted_3$8 = { class: "tab-header" };
|
|
@@ -46981,333 +47447,39 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
46981
47447
|
style: { "color": "#2f86ff" }
|
|
46982
47448
|
})
|
|
46983
47449
|
]),
|
|
46984
|
-
createElementVNode("div", _hoisted_30, [
|
|
46985
|
-
withDirectives(createElementVNode("input", {
|
|
46986
|
-
"onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => microphoneVolume.value = $event),
|
|
46987
|
-
type: "range",
|
|
46988
|
-
min: "0",
|
|
46989
|
-
max: "100",
|
|
46990
|
-
class: "volume-slider",
|
|
46991
|
-
style: normalizeStyle(`background: linear-gradient(to right, #2f86ff ${microphoneVolume.value}%, rgba(255, 255, 255, 0.08) ${microphoneVolume.value}%)`)
|
|
46992
|
-
}, null, 4), [
|
|
46993
|
-
[vModelText, microphoneVolume.value]
|
|
46994
|
-
])
|
|
46995
|
-
])
|
|
46996
|
-
])
|
|
46997
|
-
])
|
|
46998
|
-
]))
|
|
46999
|
-
])
|
|
47000
|
-
])
|
|
47001
|
-
])), [
|
|
47002
|
-
[_directive_draggable, { handle: ".header" }]
|
|
47003
|
-
])
|
|
47004
|
-
], 2)) : createCommentVNode("", true);
|
|
47005
|
-
};
|
|
47006
|
-
}
|
|
47007
|
-
});
|
|
47008
|
-
const JSSettings = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-27234687"]]);
|
|
47009
|
-
function scheduleJoinRoom() {
|
|
47010
|
-
setTimeout(() => {
|
|
47011
|
-
try {
|
|
47012
|
-
joinRoom();
|
|
47013
|
-
} catch (error) {
|
|
47014
|
-
console.error("恢复后无法加入通话/会议", error);
|
|
47015
|
-
}
|
|
47016
|
-
}, 1e3);
|
|
47017
|
-
}
|
|
47018
|
-
const HANDOFF_SOURCE_TAB_ID_KEY = "JS_MEETING_MQTT_HANDOFF_SOURCE_TAB_ID";
|
|
47019
|
-
const HANDOFF_TARGET_TAB_ID_KEY = "JS_MEETING_MQTT_HANDOFF_TARGET_TAB_ID";
|
|
47020
|
-
const HANDOFF_ID_KEY = "JS_MEETING_MQTT_HANDOFF_ID";
|
|
47021
|
-
const RECONNECT_SIGNAL_KEY = "JS_MEETING_MQTT_RECONNECT_SIGNAL";
|
|
47022
|
-
const TARGET_HEARTBEAT_KEY = "JS_MEETING_MQTT_HANDOFF_HEARTBEAT";
|
|
47023
|
-
const TARGET_TAB_STATUS_KEY = "JS_MEETING_NEW_TAB_STATUS";
|
|
47024
|
-
const TARGET_HEARTBEAT_INTERVAL_MS = 1e3;
|
|
47025
|
-
const RECONNECT_CHECK_DELAY_MS = 1500;
|
|
47026
|
-
const TARGET_TAB_STATUS_CLOSED = 0;
|
|
47027
|
-
const TARGET_TAB_STATUS_OPEN = 1;
|
|
47028
|
-
let installed = false;
|
|
47029
|
-
let closeSignalSent = false;
|
|
47030
|
-
let heartbeatTimer = null;
|
|
47031
|
-
let lastHandledReconnectSignalTs = 0;
|
|
47032
|
-
let leaveRequestSent = false;
|
|
47033
|
-
function safeSessionStorageGetItem(key) {
|
|
47034
|
-
try {
|
|
47035
|
-
return sessionStorage.getItem(key);
|
|
47036
|
-
} catch {
|
|
47037
|
-
return null;
|
|
47038
|
-
}
|
|
47039
|
-
}
|
|
47040
|
-
function safeLocalStorageSetItem(key, value) {
|
|
47041
|
-
try {
|
|
47042
|
-
localStorage.setItem(key, value);
|
|
47043
|
-
} catch {
|
|
47044
|
-
}
|
|
47045
|
-
}
|
|
47046
|
-
function safeLocalStorageGetItem(key) {
|
|
47047
|
-
try {
|
|
47048
|
-
return localStorage.getItem(key);
|
|
47049
|
-
} catch {
|
|
47050
|
-
return null;
|
|
47051
|
-
}
|
|
47052
|
-
}
|
|
47053
|
-
function getMeetingMqttHandoffContext() {
|
|
47054
|
-
const sourceTabId = safeSessionStorageGetItem(HANDOFF_SOURCE_TAB_ID_KEY) || "";
|
|
47055
|
-
const targetTabId = safeSessionStorageGetItem(HANDOFF_TARGET_TAB_ID_KEY) || "";
|
|
47056
|
-
const handoffId = safeSessionStorageGetItem(HANDOFF_ID_KEY) || "";
|
|
47057
|
-
if (!sourceTabId || !targetTabId || !handoffId) {
|
|
47058
|
-
return null;
|
|
47059
|
-
}
|
|
47060
|
-
return {
|
|
47061
|
-
sourceTabId,
|
|
47062
|
-
targetTabId,
|
|
47063
|
-
handoffId
|
|
47064
|
-
};
|
|
47065
|
-
}
|
|
47066
|
-
function readTargetHeartbeat() {
|
|
47067
|
-
const raw = safeLocalStorageGetItem(TARGET_HEARTBEAT_KEY);
|
|
47068
|
-
if (!raw) {
|
|
47069
|
-
return null;
|
|
47070
|
-
}
|
|
47071
|
-
try {
|
|
47072
|
-
const parsed = JSON.parse(raw);
|
|
47073
|
-
if (!(parsed == null ? void 0 : parsed.targetTabId) || !(parsed == null ? void 0 : parsed.handoffId) || !(parsed == null ? void 0 : parsed.ts)) {
|
|
47074
|
-
return null;
|
|
47075
|
-
}
|
|
47076
|
-
return {
|
|
47077
|
-
targetTabId: parsed.targetTabId,
|
|
47078
|
-
handoffId: parsed.handoffId,
|
|
47079
|
-
ts: Number(parsed.ts)
|
|
47450
|
+
createElementVNode("div", _hoisted_30, [
|
|
47451
|
+
withDirectives(createElementVNode("input", {
|
|
47452
|
+
"onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => microphoneVolume.value = $event),
|
|
47453
|
+
type: "range",
|
|
47454
|
+
min: "0",
|
|
47455
|
+
max: "100",
|
|
47456
|
+
class: "volume-slider",
|
|
47457
|
+
style: normalizeStyle(`background: linear-gradient(to right, #2f86ff ${microphoneVolume.value}%, rgba(255, 255, 255, 0.08) ${microphoneVolume.value}%)`)
|
|
47458
|
+
}, null, 4), [
|
|
47459
|
+
[vModelText, microphoneVolume.value]
|
|
47460
|
+
])
|
|
47461
|
+
])
|
|
47462
|
+
])
|
|
47463
|
+
])
|
|
47464
|
+
]))
|
|
47465
|
+
])
|
|
47466
|
+
])
|
|
47467
|
+
])), [
|
|
47468
|
+
[_directive_draggable, { handle: ".header" }]
|
|
47469
|
+
])
|
|
47470
|
+
], 2)) : createCommentVNode("", true);
|
|
47080
47471
|
};
|
|
47081
|
-
} catch {
|
|
47082
|
-
return null;
|
|
47083
|
-
}
|
|
47084
|
-
}
|
|
47085
|
-
function writeTargetHeartbeat(context) {
|
|
47086
|
-
safeLocalStorageSetItem(
|
|
47087
|
-
TARGET_HEARTBEAT_KEY,
|
|
47088
|
-
JSON.stringify({
|
|
47089
|
-
targetTabId: context.targetTabId,
|
|
47090
|
-
handoffId: context.handoffId,
|
|
47091
|
-
ts: Date.now()
|
|
47092
|
-
})
|
|
47093
|
-
);
|
|
47094
|
-
}
|
|
47095
|
-
function writeTargetTabStatus(status, context) {
|
|
47096
|
-
safeLocalStorageSetItem(
|
|
47097
|
-
TARGET_TAB_STATUS_KEY,
|
|
47098
|
-
JSON.stringify({
|
|
47099
|
-
sourceTabId: context.sourceTabId,
|
|
47100
|
-
targetTabId: context.targetTabId,
|
|
47101
|
-
handoffId: context.handoffId,
|
|
47102
|
-
status,
|
|
47103
|
-
ts: Date.now()
|
|
47104
|
-
})
|
|
47105
|
-
);
|
|
47106
|
-
}
|
|
47107
|
-
function sendReconnectSignal(context) {
|
|
47108
|
-
if (closeSignalSent) {
|
|
47109
|
-
return;
|
|
47110
|
-
}
|
|
47111
|
-
closeSignalSent = true;
|
|
47112
|
-
console.warn("[MQTT_HANDOFF] 目标页关闭,通知来源页恢复 MQTT", {
|
|
47113
|
-
sourceTabId: context.sourceTabId,
|
|
47114
|
-
targetTabId: context.targetTabId,
|
|
47115
|
-
handoffId: context.handoffId
|
|
47116
|
-
});
|
|
47117
|
-
safeLocalStorageSetItem(
|
|
47118
|
-
RECONNECT_SIGNAL_KEY,
|
|
47119
|
-
JSON.stringify({
|
|
47120
|
-
...context,
|
|
47121
|
-
ts: Date.now()
|
|
47122
|
-
})
|
|
47123
|
-
);
|
|
47124
|
-
}
|
|
47125
|
-
function stopTargetHeartbeat() {
|
|
47126
|
-
if (heartbeatTimer) {
|
|
47127
|
-
clearInterval(heartbeatTimer);
|
|
47128
|
-
heartbeatTimer = null;
|
|
47129
|
-
}
|
|
47130
|
-
}
|
|
47131
|
-
function startTargetHeartbeat() {
|
|
47132
|
-
const context = getMeetingMqttHandoffContext();
|
|
47133
|
-
if (!context) {
|
|
47134
|
-
return;
|
|
47135
|
-
}
|
|
47136
|
-
const currentTabId = getCurrentMeetingTabId();
|
|
47137
|
-
if (currentTabId !== context.targetTabId) {
|
|
47138
|
-
return;
|
|
47139
|
-
}
|
|
47140
|
-
closeSignalSent = false;
|
|
47141
|
-
console.info("[MQTT_HANDOFF] 目标页心跳已启动", {
|
|
47142
|
-
sourceTabId: context.sourceTabId,
|
|
47143
|
-
targetTabId: context.targetTabId,
|
|
47144
|
-
handoffId: context.handoffId
|
|
47145
|
-
});
|
|
47146
|
-
writeTargetTabStatus(TARGET_TAB_STATUS_OPEN, context);
|
|
47147
|
-
writeTargetHeartbeat(context);
|
|
47148
|
-
stopTargetHeartbeat();
|
|
47149
|
-
heartbeatTimer = setInterval(() => {
|
|
47150
|
-
writeTargetHeartbeat(context);
|
|
47151
|
-
}, TARGET_HEARTBEAT_INTERVAL_MS);
|
|
47152
|
-
}
|
|
47153
|
-
function notifySourceTabForReconnect() {
|
|
47154
|
-
const context = getMeetingMqttHandoffContext();
|
|
47155
|
-
if (!context) {
|
|
47156
|
-
return;
|
|
47157
|
-
}
|
|
47158
|
-
const currentTabId = getCurrentMeetingTabId();
|
|
47159
|
-
if (currentTabId !== context.targetTabId) {
|
|
47160
|
-
return;
|
|
47161
|
-
}
|
|
47162
|
-
sendReconnectSignal(context);
|
|
47163
|
-
}
|
|
47164
|
-
function shouldWarnBeforeUnload() {
|
|
47165
|
-
const context = getMeetingMqttHandoffContext();
|
|
47166
|
-
if (!context) {
|
|
47167
|
-
return false;
|
|
47168
|
-
}
|
|
47169
|
-
const currentTabId = getCurrentMeetingTabId();
|
|
47170
|
-
return currentTabId === context.targetTabId;
|
|
47171
|
-
}
|
|
47172
|
-
function buildMeetingLeavePayload() {
|
|
47173
|
-
try {
|
|
47174
|
-
const meetingInfo = JSON.parse(sessionStorage.getItem("JS_MEETING_INFO") || "{}");
|
|
47175
|
-
const meetingId = String((meetingInfo == null ? void 0 : meetingInfo.meetingId) || "").trim();
|
|
47176
|
-
const memberId = String(getUserId() || "").trim();
|
|
47177
|
-
if (!meetingId || !memberId) {
|
|
47178
|
-
return null;
|
|
47179
|
-
}
|
|
47180
|
-
return { meetingId, memberId, force: true };
|
|
47181
|
-
} catch {
|
|
47182
|
-
return null;
|
|
47183
|
-
}
|
|
47184
|
-
}
|
|
47185
|
-
function sendMeetingLeaveOnClose() {
|
|
47186
|
-
if (leaveRequestSent) {
|
|
47187
|
-
return;
|
|
47188
47472
|
}
|
|
47189
|
-
|
|
47190
|
-
|
|
47191
|
-
|
|
47192
|
-
|
|
47193
|
-
leaveRequestSent = true;
|
|
47194
|
-
const body = JSON.stringify(payload);
|
|
47195
|
-
const token = getSdkToken();
|
|
47196
|
-
const authHeader = token ? { Authorization: `Bearer ${token}` } : {};
|
|
47197
|
-
const requestUrl = "/meeting/api/v2/meeting/leave";
|
|
47198
|
-
try {
|
|
47199
|
-
fetch(requestUrl, {
|
|
47200
|
-
method: "POST",
|
|
47201
|
-
headers: {
|
|
47202
|
-
"Content-Type": "application/json",
|
|
47203
|
-
Accept: "application/json, text/plain, */*",
|
|
47204
|
-
"X-Requested-With": "XMLHttpRequest",
|
|
47205
|
-
...authHeader
|
|
47206
|
-
},
|
|
47207
|
-
body,
|
|
47208
|
-
keepalive: true,
|
|
47209
|
-
credentials: "same-origin"
|
|
47210
|
-
}).catch(() => {
|
|
47211
|
-
});
|
|
47212
|
-
console.warn("[MQTT_HANDOFF] 页面关闭触发离会请求(keepalive)", payload);
|
|
47213
|
-
} catch {
|
|
47214
|
-
}
|
|
47215
|
-
try {
|
|
47216
|
-
if (typeof navigator !== "undefined" && typeof navigator.sendBeacon === "function") {
|
|
47217
|
-
const beaconData = new Blob([body], { type: "application/json" });
|
|
47218
|
-
const sent = navigator.sendBeacon(requestUrl, beaconData);
|
|
47219
|
-
console.warn("[MQTT_HANDOFF] 页面关闭触发离会请求(beacon)", {
|
|
47220
|
-
...payload,
|
|
47221
|
-
sent
|
|
47222
|
-
});
|
|
47223
|
-
}
|
|
47224
|
-
} catch {
|
|
47225
|
-
}
|
|
47226
|
-
}
|
|
47227
|
-
function shouldReconnectForSignal(signal) {
|
|
47228
|
-
const currentTabId = getCurrentMeetingTabId();
|
|
47229
|
-
if (!signal.sourceTabId || signal.sourceTabId !== currentTabId) {
|
|
47230
|
-
return false;
|
|
47231
|
-
}
|
|
47232
|
-
const latestHeartbeat = readTargetHeartbeat();
|
|
47233
|
-
if (!latestHeartbeat) {
|
|
47234
|
-
return true;
|
|
47235
|
-
}
|
|
47236
|
-
if (latestHeartbeat.targetTabId !== signal.targetTabId) {
|
|
47237
|
-
return true;
|
|
47238
|
-
}
|
|
47239
|
-
if (latestHeartbeat.handoffId !== signal.handoffId) {
|
|
47240
|
-
return true;
|
|
47241
|
-
}
|
|
47242
|
-
return latestHeartbeat.ts <= signal.ts;
|
|
47243
|
-
}
|
|
47244
|
-
function installMeetingMqttHandoffBridge(onReconnectRequested) {
|
|
47245
|
-
if (installed || typeof window === "undefined") {
|
|
47246
|
-
return;
|
|
47247
|
-
}
|
|
47248
|
-
installed = true;
|
|
47249
|
-
startTargetHeartbeat();
|
|
47250
|
-
window.addEventListener("storage", (event) => {
|
|
47251
|
-
if (event.key !== RECONNECT_SIGNAL_KEY || !event.newValue) {
|
|
47252
|
-
return;
|
|
47253
|
-
}
|
|
47254
|
-
let signal = null;
|
|
47473
|
+
});
|
|
47474
|
+
const JSSettings = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-27234687"]]);
|
|
47475
|
+
function scheduleJoinRoom() {
|
|
47476
|
+
setTimeout(() => {
|
|
47255
47477
|
try {
|
|
47256
|
-
|
|
47257
|
-
} catch {
|
|
47258
|
-
|
|
47259
|
-
}
|
|
47260
|
-
if (!(signal == null ? void 0 : signal.sourceTabId) || !signal.targetTabId || !signal.handoffId) {
|
|
47261
|
-
return;
|
|
47262
|
-
}
|
|
47263
|
-
const signalTs = Number(signal.ts);
|
|
47264
|
-
if (!signalTs || signalTs <= lastHandledReconnectSignalTs) {
|
|
47265
|
-
return;
|
|
47266
|
-
}
|
|
47267
|
-
lastHandledReconnectSignalTs = signalTs;
|
|
47268
|
-
console.warn("[MQTT_HANDOFF] 收到 MQTT 恢复信号,等待确认目标页是否真的关闭", {
|
|
47269
|
-
sourceTabId: signal.sourceTabId,
|
|
47270
|
-
targetTabId: signal.targetTabId,
|
|
47271
|
-
handoffId: signal.handoffId,
|
|
47272
|
-
signalTs
|
|
47273
|
-
});
|
|
47274
|
-
window.setTimeout(() => {
|
|
47275
|
-
if (!shouldReconnectForSignal(signal)) {
|
|
47276
|
-
console.info("[MQTT_HANDOFF] 忽略 MQTT 恢复,本次更像是目标页刷新/重载", {
|
|
47277
|
-
sourceTabId: signal.sourceTabId,
|
|
47278
|
-
targetTabId: signal.targetTabId,
|
|
47279
|
-
handoffId: signal.handoffId
|
|
47280
|
-
});
|
|
47281
|
-
return;
|
|
47282
|
-
}
|
|
47283
|
-
console.warn("[MQTT_HANDOFF] 确认目标页已关闭,准备恢复来源页 MQTT", {
|
|
47284
|
-
sourceTabId: signal.sourceTabId,
|
|
47285
|
-
targetTabId: signal.targetTabId,
|
|
47286
|
-
handoffId: signal.handoffId
|
|
47287
|
-
});
|
|
47288
|
-
void onReconnectRequested();
|
|
47289
|
-
}, RECONNECT_CHECK_DELAY_MS);
|
|
47290
|
-
});
|
|
47291
|
-
window.addEventListener("beforeunload", (event) => {
|
|
47292
|
-
if (!shouldWarnBeforeUnload()) {
|
|
47293
|
-
return;
|
|
47294
|
-
}
|
|
47295
|
-
event.preventDefault();
|
|
47296
|
-
event.returnValue = "";
|
|
47297
|
-
});
|
|
47298
|
-
window.addEventListener("pagehide", (event) => {
|
|
47299
|
-
const context = getMeetingMqttHandoffContext();
|
|
47300
|
-
const shouldHandleTargetTabClose = !!context && getCurrentMeetingTabId() === context.targetTabId;
|
|
47301
|
-
if (shouldHandleTargetTabClose && context) {
|
|
47302
|
-
writeTargetTabStatus(TARGET_TAB_STATUS_CLOSED, context);
|
|
47303
|
-
sendMeetingLeaveOnClose();
|
|
47304
|
-
}
|
|
47305
|
-
stopTargetHeartbeat();
|
|
47306
|
-
if (event.persisted) {
|
|
47307
|
-
return;
|
|
47478
|
+
joinRoom();
|
|
47479
|
+
} catch (error) {
|
|
47480
|
+
console.error("恢复后无法加入通话/会议", error);
|
|
47308
47481
|
}
|
|
47309
|
-
|
|
47310
|
-
});
|
|
47482
|
+
}, 1e3);
|
|
47311
47483
|
}
|
|
47312
47484
|
let authToken = null;
|
|
47313
47485
|
async function restoreMeetingMqttConnection() {
|