@tencentcloud/roomkit-web-vue3
Version:
<h1 align="center"> TUIRoomKit</h1> Conference (TUIRoomKit) is a product suitable for multi-person audio and video conversation scenarios such as business meetings, webinars, and online education. By integrating this product, you can add room management,
196 lines (195 loc) • 6.89 kB
JavaScript
import { ref, reactive, computed } from "vue";
import { TUIErrorCode, TUIRequestCallbackType } from "@tencentcloud/tuiroom-engine-js";
import { IconOffStage, IconDenyOnStage, IconOnStage, TUIToast, TOAST_TYPE, IconInviteOnStage } from "@tencentcloud/uikit-base-component-vue3";
import { useI18n } from "../../../../locales/index.mjs";
import "../../../../services/main.mjs";
import { roomService } from "../../../../services/roomService.mjs";
import "../../../../utils/environment.mjs";
import "mitt";
import "../../../../services/manager/roomActionManager.mjs";
import "@tencentcloud/tui-core";
import { MESSAGE_DURATION } from "../../../../constants/message.mjs";
import useUserState from "../index.mjs";
import { UserAction } from "../../../type/User.mjs";
import useRoomEngine from "../../../../hooks/useRoomEngine.mjs";
const { t } = useI18n();
const roomEngine = useRoomEngine();
const invitingUserOnSeatRequestObj = ref({});
function useInviteUserOnSeat(userInfo) {
const { onSeatUserList } = useUserState();
const invitingCurrentUserOnSeatRequest = computed(() => {
return invitingUserOnSeatRequestObj.value[userInfo.userId];
});
async function toggleInviteUserOnSeat() {
var _a, _b;
if (invitingCurrentUserOnSeatRequest.value) {
await ((_a = roomEngine.instance) == null ? void 0 : _a.cancelRequest({
requestId: invitingCurrentUserOnSeatRequest.value.requestId
}));
delete invitingUserOnSeatRequestObj.value[userInfo.userId];
} else {
if (onSeatUserList.value.length === roomService.roomStore.maxSeatCount) {
TUIToast({
type: TOAST_TYPE.WARNING,
message: `${t("The stage is full")}`,
duration: MESSAGE_DURATION.NORMAL
});
return;
}
const request = await ((_b = roomEngine.instance) == null ? void 0 : _b.takeUserOnSeatByAdmin({
seatIndex: -1,
userId: userInfo.userId,
timeout: 60,
requestCallback: (callbackInfo) => {
const { requestCallbackType, code } = callbackInfo;
delete invitingUserOnSeatRequestObj.value[userInfo.userId];
switch (requestCallbackType) {
case TUIRequestCallbackType.kRequestAccepted:
TUIToast({
type: TOAST_TYPE.SUCCESS,
message: `${userInfo.displayName} ${t("accepted the invitation to the stage")}`,
duration: MESSAGE_DURATION.NORMAL
});
break;
case TUIRequestCallbackType.kRequestRejected:
TUIToast({
type: TOAST_TYPE.WARNING,
message: `${userInfo.displayName} ${t("declined the invitation to the stage")}`,
duration: MESSAGE_DURATION.NORMAL
});
break;
case TUIRequestCallbackType.kRequestTimeout:
TUIToast({
type: TOAST_TYPE.WARNING,
message: t(
"The invitation to sb to go on stage has timed out",
{
name: userInfo.displayName
}
),
duration: MESSAGE_DURATION.NORMAL
});
break;
case TUIRequestCallbackType.kRequestError:
if (code === TUIErrorCode.ERR_REQUEST_ID_REPEAT) {
TUIToast({
type: TOAST_TYPE.WARNING,
message: t(
"This member has already received the same request, please try again later"
),
duration: MESSAGE_DURATION.NORMAL
});
}
break;
}
}
}));
if (request && request.requestId) {
invitingUserOnSeatRequestObj.value[userInfo.userId] = request;
}
}
}
const inviteUserOnSeat = reactive({
key: UserAction.InviteOnSeatAction,
icon: computed(
() => invitingCurrentUserOnSeatRequest.value ? IconDenyOnStage : IconInviteOnStage
),
label: computed(
() => invitingCurrentUserOnSeatRequest.value ? t("Cancel stage") : t("Invite stage")
),
handler: toggleInviteUserOnSeat
});
return inviteUserOnSeat;
}
function useAgreeUserOnSeat(userInfo) {
const { seatApplicationRequestList } = useUserState();
const onSeatRequest = computed(() => {
return seatApplicationRequestList.value.find(
(request) => request.userId === userInfo.userId
);
});
const agreeUserOnSeat = reactive({
key: UserAction.AgreeOnSeatAction,
icon: IconOnStage,
label: t("Agree to the stage"),
handler: async () => {
var _a;
if (onSeatRequest.value) {
try {
await ((_a = roomEngine.instance) == null ? void 0 : _a.responseRemoteRequest({
requestId: onSeatRequest.value.requestId,
agree: true
}));
} catch (error) {
if (error.code === TUIErrorCode.ERR_ALL_SEAT_OCCUPIED) {
TUIToast({
type: TOAST_TYPE.WARNING,
message: t("The stage is full")
});
} else {
console.error("Failure to response a user request", error);
}
}
}
}
});
return agreeUserOnSeat;
}
function useDenyUserOnSeat(userInfo) {
const { seatApplicationRequestList } = useUserState();
const onSeatRequest = computed(() => {
return seatApplicationRequestList.value.find(
(request) => request.userId === userInfo.userId
);
});
const denyUserOnSeat = reactive({
key: UserAction.DenyOnSeatAction,
icon: IconDenyOnStage,
label: t("Refuse stage"),
handler: async () => {
var _a;
if (onSeatRequest.value) {
try {
await ((_a = roomEngine.instance) == null ? void 0 : _a.responseRemoteRequest({
requestId: onSeatRequest.value.requestId,
agree: false
}));
} catch (error) {
console.error("Failure to response a user request", error);
}
}
}
});
return denyUserOnSeat;
}
function useKickUserOffSeat(userInfo) {
async function kickUserOffSeatByAdmin(userInfo2) {
var _a;
await ((_a = roomEngine.instance) == null ? void 0 : _a.kickUserOffSeatByAdmin({
seatIndex: -1,
userId: userInfo2.userId
}));
}
const kickUserOffSeat = reactive({
key: UserAction.KickOffSeatAction,
icon: IconOffStage,
label: t("Step down"),
handler: () => kickUserOffSeatByAdmin(userInfo)
});
return kickUserOffSeat;
}
function useSeatAction(userInfo) {
return {
inviteUserOnSeat: useInviteUserOnSeat(userInfo),
agreeUserOnSeat: useAgreeUserOnSeat(userInfo),
denyUserOnSeat: useDenyUserOnSeat(userInfo),
kickUserOffSeat: useKickUserOffSeat(userInfo)
};
}
export {
useSeatAction as default,
useAgreeUserOnSeat,
useDenyUserOnSeat,
useInviteUserOnSeat,
useKickUserOffSeat
};