call-live-sdk1 0.0.9 → 0.0.11

package/dist/call-live-sdk.es.js

@@ -24315,7 +24315,7 @@ const ConfirmDialogWrapper = (props) => {
     getContainer: mergedGetContainer
   }));
 };
-function confirm$1(config2) {
+function confirm(config2) {
   const global2 = globalConfig();
   const container = document.createDocumentFragment();
   let currentConfig = Object.assign(Object.assign({}, config2), {
@@ -25838,23 +25838,23 @@ const PurePanel$b = (props) => {
 };
 const PurePanel$c = withPureRenderTheme(PurePanel$b);
 function modalWarn(props) {
-  return confirm$1(withWarn(props));
+  return confirm(withWarn(props));
 }
 const Modal = Modal$1;
 Modal.useModal = useModal;
 Modal.info = function infoFn(props) {
-  return confirm$1(withInfo(props));
+  return confirm(withInfo(props));
 };
 Modal.success = function successFn(props) {
-  return confirm$1(withSuccess(props));
+  return confirm(withSuccess(props));
 };
 Modal.error = function errorFn(props) {
-  return confirm$1(withError(props));
+  return confirm(withError(props));
 };
 Modal.warning = modalWarn;
 Modal.warn = modalWarn;
 Modal.confirm = function confirmFn(props) {
-  return confirm$1(withConfirm(props));
+  return confirm(withConfirm(props));
 };
 Modal.destroyAll = function destroyAllFn() {
   while (destroyFns.length) {
@@ -82768,7 +82768,7 @@ const useCallStore = create$c()(
       token: "",
       // RTC令牌
       // LoginResponseData 字段
-      nickname: "头痛",
+      nickname: "",
       // 用户昵称
       rtc_userid: "",
       // RTC用户ID
@@ -82947,7 +82947,9 @@ const useCallStore = create$c()(
         nickname,
         token: token2,
         rule,
-        waiting_mode
+        waiting_mode,
+        isVideoEnabled,
+        isAudioEnabled
       } = callConfig;
       if (isUserExists(rtc_userid || "")) {
         console.warn(`本地用户 ${rtc_userid} 已存在，跳过添加`);
@@ -82964,8 +82966,8 @@ const useCallStore = create$c()(
         ...initCallUser,
         // 根据enter_muted配置设置初始音频状态
         // enter_muted: 0-否(音频开启) 1-是(音频关闭/静音)
-        isAudioEnabled: true,
-        isVideoEnabled: false,
+        isAudioEnabled: isAudioEnabled ?? true,
+        isVideoEnabled: isVideoEnabled ?? false,
         joinTime: Date.now(),
         waiting_mode_state: rule === "main" || !waiting_mode ? 0 : 1
         /* WAITING */
@@ -83025,6 +83027,17 @@ const useCallStore = create$c()(
         callCurrentUser: void 0,
         layoutMode: "main_plus_list",
         callUsersCurrentPageRef: 1,
+        callConfig: {
+          ...callConfig,
+          isCall: false,
+          // 连麦是否开启
+          isAudioEnabled: true,
+          // 音频是否开启
+          isScreenEnabled: false,
+          // 屏幕共享是否开启
+          isVideoEnabled: false
+          // 视频是否开启
+        },
         mainCanvasId: callConfig.rule === "main" ? (callConfig == null ? void 0 : callConfig.drawing_board_id) || "" : ""
       });
       if (rtc) {
@@ -85556,9 +85569,6 @@ const tagList = [/* @__PURE__ */ jsxRuntimeExports.jsx(Tag, {
 }, 2), /* @__PURE__ */ jsxRuntimeExports.jsx(Tag, {
   children: "已结束"
 }, 3)];
-const {
-  confirm
-} = Modal;
 const Head = ({
   canvasSetting,
   setCanvasSetting,
@@ -85568,6 +85578,7 @@ const Head = ({
   audioContextRef,
   audioDestinationRef
 }) => {
+  const [modal, contextHolder] = useModal();
   const {
     data: data2,
     run: run2,
@@ -86117,7 +86128,7 @@ const Head = ({
                   disabled: isLive,
                   className: "antSelectSelectionItemColor",
                   onChange: (e3) => {
-                    confirm({
+                    modal.confirm({
                       title: "切换画布设置后，当前画布上的内容和所有数据将被清除，是否确定切换？",
                       icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {}),
                       okText: "确定",
@@ -86175,7 +86186,7 @@ const Head = ({
         loading: rtmpLoading,
         danger: true,
         onClick: () => {
-          confirm({
+          modal.confirm({
             title: "结束直播",
             content: "您即将结束直播并停止推流，是否确认。",
             icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {}),
@@ -86190,7 +86201,7 @@ const Head = ({
       }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
         type: "primary",
         onClick: () => {
-          confirm({
+          modal.confirm({
             title: "开始直播",
             content: "是否确认开始直播，检查麦克风和摄像头状态正常，保证网络稳定。",
             icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {}),
@@ -86248,7 +86259,7 @@ const Head = ({
           children: "当前活动已在其他设备推流中，无法打开当前网页开播设置！"
         })]
       })
-    })]
+    }), contextHolder]
   });
 };
 const Head$1 = React$2.memo(Head, (prevProps, nextProps) => {
@@ -194938,7 +194949,7 @@ class RtcClient {
    * @param {string} userId - 用户ID
    * @param {Function} callback - 回调函数，返回创建结果和设备状态
    */
-  async createLocalStream(userId, callback, renderMode = VideoRenderMode.RENDER_MODE_FIT) {
+  async createLocalStream(userId, callback, { video = true, audio = true, renderMode = VideoRenderMode.RENDER_MODE_FIT }) {
     const devices = await this.getDevices();
     this.devicesSettings = devices.cameraId = devices.videoInputs[0].deviceId;
     this.devicesSettings = devices.microphoneId = devices.audioInputs[0].deviceId;
@@ -194986,24 +194997,26 @@ class RtcClient {
       contentHint: "motion"
       // 屏幕采集场景，流畅度优先
     });
-    if (this.streamOptions.audio && devices.audioInputs.length) {
+    if (this.streamOptions.audio && devices.audioInputs.length && audio) {
       await this.engine.startAudioCapture(this.devicesSettings.microphoneId);
+      await this.engine.publishStream(MediaType$1.AUDIO);
     } else {
       devicesStatus["audio"] = 0;
       this.engine.unpublishStream(MediaType$1.AUDIO);
     }
-    if (this.streamOptions.video && devices.videoInputs.length) {
+    if (this.streamOptions.video && devices.videoInputs.length && video) {
       await this.engine.startVideoCapture(this.devicesSettings.cameraId);
+      await this.engine.setLocalVideoMirrorType(MirrorType.MIRROR_TYPE_RENDER);
+      this.engine.setLocalVideoPlayer(StreamIndex$1.STREAM_INDEX_MAIN, {
+        renderDom: userId,
+        userId,
+        renderMode
+      });
+      await this.engine.publishStream(MediaType$1.VIDEO);
     } else {
       devicesStatus["video"] = 0;
       this.engine.unpublishStream(MediaType$1.VIDEO);
     }
-    await this.engine.setLocalVideoMirrorType(MirrorType.MIRROR_TYPE_RENDER);
-    this.engine.setLocalVideoPlayer(StreamIndex$1.STREAM_INDEX_MAIN, {
-      renderDom: userId,
-      userId,
-      renderMode
-    });
     if (callback) {
       callback({
         code: 0,
@@ -289436,7 +289449,7 @@ const ChatComponent = () => {
     if (res.success) {
       setLoading(false);
       setCurrent(res.data.pagination.current);
-      setInteractionList((list) => [...list, ...res.data.list]);
+      setInteractionList((prevList) => [...prevList, ...res.data.list]);
       if (res.data.list.length < 10 || res.data.list.length === res.data.pagination.total || res.data.list.length + interactionList.length >= res.data.pagination.total) {
         setFinished(true);
       }
@@ -292039,7 +292052,6 @@ const RtcJoomRoom = reactExports.memo(({
     callCurrentUser,
     callUsers,
     callAudioMixing,
-    updateCallConfig,
     leaveRemoteUser,
     joinCallUser,
     updateCallUser,
@@ -292050,7 +292062,27 @@ const RtcJoomRoom = reactExports.memo(({
     handleRemoteUserPublishScreen,
     handleRemoteUserUnpublishScreen,
     getCallConfig
-  } = useCallStore();
+  } = useCallStore((state) => ({
+    callConfig: state.callConfig,
+    rtc: state.rtc,
+    getter: state.getter,
+    setRtc: state.setRtc,
+    mainCanvasId: state.mainCanvasId,
+    callCurrentUser: state.callCurrentUser,
+    callUsers: state.callUsers,
+    callAudioMixing: state.callAudioMixing,
+    updateCallConfig: state.updateCallConfig,
+    leaveRemoteUser: state.leaveRemoteUser,
+    joinCallUser: state.joinCallUser,
+    updateCallUser: state.updateCallUser,
+    leave: state.leave,
+    toggleVideo: state.toggleVideo,
+    toggleAudio: state.toggleAudio,
+    setMainCanvasId: state.setMainCanvasId,
+    handleRemoteUserPublishScreen: state.handleRemoteUserPublishScreen,
+    handleRemoteUserUnpublishScreen: state.handleRemoteUserUnpublishScreen,
+    getCallConfig: state.getCallConfig
+  }));
   const playStatus = reactExports.useRef({});
   const errorMessageCache = reactExports.useRef({});
   const ERROR_DEBOUNCE_TIME = 3e3;
@@ -292123,15 +292155,16 @@ const RtcJoomRoom = reactExports.memo(({
     }
   }, [originalInviteData, handleInviteConfirm, hideInviteConfirm, setInviteLoading]);
   const handleUserPublishStream = reactExports.useCallback(async (stream) => {
-    var _a2, _b, _c2;
-    console.log("handleUserPublishStream");
+    var _a2, _b, _c2, _d2, _e2;
+    console.log("发布流", stream);
     const userId = stream.userId;
     if (stream.mediaType & MediaType$1.VIDEO) {
+      await ((_b = (_a2 = getter().rtc) == null ? void 0 : _a2.engine) == null ? void 0 : _b.subscribeStream(userId, MediaType$1.VIDEO));
       updateCallUser(userId, {
-        isPublishStream: true
+        isVideoEnabled: true
       });
       if (callConfig.rule === "main") {
-        await ((_a2 = getter().rtc) == null ? void 0 : _a2.engine.sendRoomMessage(JSON.stringify({
+        await ((_c2 = getter().rtc) == null ? void 0 : _c2.engine.sendRoomMessage(JSON.stringify({
           type: "users",
           data: {
             users: callUsers.map((user) => ({
@@ -292149,10 +292182,9 @@ const RtcJoomRoom = reactExports.memo(({
     if (stream.mediaType & MediaType$1.AUDIO) {
       const cuser = callUsers.find((user) => user.rtc_userid === callConfig.rtc_userid);
       if ((cuser == null ? void 0 : cuser.waiting_mode_state) !== WaitingModeState.WAITING) {
-        console.log("当前不是等待用户 订阅 音频流", userId);
-        await ((_c2 = (_b = getter().rtc) == null ? void 0 : _b.engine) == null ? void 0 : _c2.subscribeStream(userId, MediaType$1.AUDIO));
+        await ((_e2 = (_d2 = getter().rtc) == null ? void 0 : _d2.engine) == null ? void 0 : _e2.subscribeStream(userId, MediaType$1.AUDIO));
         updateCallUser(userId, {
-          isSubscribeAudio: true
+          isAudioEnabled: true
         });
         if (callConfig.rule === "main") {
           setTimeout(() => {
@@ -292202,7 +292234,7 @@ const RtcJoomRoom = reactExports.memo(({
     });
   };
   const rtcJoin = async () => {
-    var _a2, _b, _c2, _d2;
+    var _a2, _b, _c2;
     const localUser = joinCallUser();
     const {
       rtc_room_id,
@@ -292213,7 +292245,7 @@ const RtcJoomRoom = reactExports.memo(({
       rtc_userid,
       token: token2,
       appid
-    } = callConfig;
+    } = getter().callConfig;
     if (!localUser) {
       staticMethods.error("加入房间失败，本地用户不存在");
       return;
@@ -292228,7 +292260,7 @@ const RtcJoomRoom = reactExports.memo(({
         camera: isVideoEnabled ?? false
       }), {
         // 自动发布本地音视频流
-        isAutoPublish: true,
+        isAutoPublish: false,
         // 自动订阅房间内其他用户的音频流
         isAutoSubscribeAudio: false,
         // 自动订阅房间内其他用户的视频流
@@ -292247,15 +292279,14 @@ const RtcJoomRoom = reactExports.memo(({
           if (code === -1) {
             window.confirm(`创建本地流失败：${msg2}`);
           }
-        }, VideoRenderMode.RENDER_MODE_HIDDEN));
+        }, {
+          video: isVideoEnabled,
+          audio: isAudioEnabled,
+          renderMode: VideoRenderMode.RENDER_MODE_HIDDEN
+        }));
         if (callConfig.rule === "sub" && callConfig.enter_muted) {
           await toggleAudio(false);
-        } else {
-          updateCallConfig({
-            isReady: true
-          });
         }
-        await ((_d2 = getter().rtc) == null ? void 0 : _d2.publishStream());
         if (callConfig.rule === "main") {
           console.log("主播 发布 音视频流 ");
           callAudioMixing();
@@ -292304,14 +292335,25 @@ const RtcJoomRoom = reactExports.memo(({
             video: callConfig.isVideoEnabled ?? false
           },
           handleUserPublishStream,
-          handleUserUnpublishStream: (event) => {
-            var _a2;
+          handleUserUnpublishStream: async (event) => {
+            var _a2, _b, _c2;
+            console.log("取消发布流", event);
             const {
               userId,
               mediaType
             } = event;
             if (mediaType & MediaType$1.VIDEO) {
               (_a2 = getter().rtc) == null ? void 0 : _a2.setRemoteVideoPlayer(userId, void 0);
+              await ((_b = getter().rtc) == null ? void 0 : _b.engine.unsubscribeStream(userId, MediaType$1.VIDEO));
+              updateCallUser(userId, {
+                isVideoEnabled: false
+              });
+            }
+            if (mediaType & MediaType$1.AUDIO) {
+              await ((_c2 = getter().rtc) == null ? void 0 : _c2.engine.unsubscribeStream(userId, MediaType$1.AUDIO));
+              updateCallUser(userId, {
+                isAudioEnabled: false
+              });
             }
           },
           handleUserStartVideoCapture: (event) => {
@@ -292539,10 +292581,10 @@ const RtcJoomRoom = reactExports.memo(({
   }, [callConfig.isCall, callConfig.rtc_room_id, callConfig.rule]);
   reactExports.useEffect(() => {
     const handleAdmittedUser = async () => {
-      var _a2, _b, _c2, _d2, _e2;
+      var _a2, _b, _c2, _d2, _e2, _f2;
       if (!mainCanvasId) {
         try {
-          await ((_a2 = getter().rtc) == null ? void 0 : _a2.createLocalStream(callConfig.rtc_userid, (res) => {
+          await ((_c2 = getter().rtc) == null ? void 0 : _c2.createLocalStream(callConfig.rtc_userid, (res) => {
             const {
               code,
               msg: msg2
@@ -292550,13 +292592,17 @@ const RtcJoomRoom = reactExports.memo(({
             if (code === -1) {
               window.confirm(`创建本地流失败：${msg2}`);
             }
-          }, VideoRenderMode.RENDER_MODE_HIDDEN));
+          }, {
+            video: (_a2 = getter().callConfig) == null ? void 0 : _a2.isVideoEnabled,
+            audio: (_b = getter().callConfig) == null ? void 0 : _b.isAudioEnabled,
+            renderMode: VideoRenderMode.RENDER_MODE_HIDDEN
+          }));
         } catch (error2) {
           console.error("准入 本地流创建失败:", error2);
         }
       } else {
-        await ((_b = getter().rtc) == null ? void 0 : _b.setLocalVideoPlayer(callConfig.rtc_userid, callConfig.rtc_userid, callConfig.rtc_userid, (callCurrentUser == null ? void 0 : callCurrentUser.device) === "mobile" ? VideoRenderMode.RENDER_MODE_HIDDEN : VideoRenderMode.RENDER_MODE_FIT));
-        await ((_c2 = getter().rtc) == null ? void 0 : _c2.setLocalVideoPlayer(callConfig.rtc_userid, callConfig.rtc_userid + "self", callConfig.rtc_userid + "self", VideoRenderMode.RENDER_MODE_FILL));
+        await ((_d2 = getter().rtc) == null ? void 0 : _d2.setLocalVideoPlayer(callConfig.rtc_userid, callConfig.rtc_userid, callConfig.rtc_userid, (callCurrentUser == null ? void 0 : callCurrentUser.device) === "mobile" ? VideoRenderMode.RENDER_MODE_HIDDEN : VideoRenderMode.RENDER_MODE_FIT));
+        await ((_e2 = getter().rtc) == null ? void 0 : _e2.setLocalVideoPlayer(callConfig.rtc_userid, callConfig.rtc_userid + "self", callConfig.rtc_userid + "self", VideoRenderMode.RENDER_MODE_FILL));
         access == null ? void 0 : access();
       }
       callUsers.forEach((user) => {
@@ -292571,13 +292617,7 @@ const RtcJoomRoom = reactExports.memo(({
         toggleAudio(false);
       }
       try {
-        await ((_d2 = getter().rtc) == null ? void 0 : _d2.publishStream());
-        console.log("准入 发布本地流成功");
-      } catch (error2) {
-        console.error("准入 发布本地流失败:", error2);
-      }
-      try {
-        await ((_e2 = getter().rtc) == null ? void 0 : _e2.engine.sendRoomMessage(JSON.stringify({
+        await ((_f2 = getter().rtc) == null ? void 0 : _f2.engine.sendRoomMessage(JSON.stringify({
           type: "change_user",
           data: {
             user: {
@@ -294282,9 +294322,9 @@ const UserVideoContainer = reactExports.memo(({
       minHeight: "120px"
     },
     children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-      className: " h-full relative",
+      className: "w-full h-full relative",
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-        className: " h-full bg-gray-800 flex items-center justify-center",
+        className: "w-full h-full bg-gray-800 flex items-center justify-center",
         children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
           className: "h-full text-gray-400 text-sm",
           id: videoId
@@ -294602,16 +294642,16 @@ const VideoSwipeContainer = reactExports.memo(
       "div",
       {
         ref: containerRef,
-        className: `relative  h-full overflow-hidden ${className}`,
+        className: `relative w-full h-full overflow-hidden ${className}`,
         style: { touchAction: "none" },
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "div",
             {
-              className: "flex  h-full transition-transform duration-300 ease-out",
+              className: "flex w-full h-full transition-transform duration-300 ease-out",
               style: slideContainerStyle,
               children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: " h-full flex-shrink-0 relative", children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-full h-full flex-shrink-0 relative", children: [
                   /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: " h-full", children: /* @__PURE__ */ jsxRuntimeExports.jsx(UserVideoContainer, { user: mainVideoUser, isSelected: true, videoId: mainVideoId }) }),
                   /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute top-4 right-4 w-24 h-32 rounded-lg overflow-hidden shadow-lg border-2 border-white/20 z-10", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                     UserVideoContainer,
@@ -294623,7 +294663,7 @@ const VideoSwipeContainer = reactExports.memo(
                     }
                   ) })
                 ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: " h-full flex-shrink-0 overflow-hidden flex items-center justify-center relative", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full h-full flex-shrink-0 overflow-hidden flex items-center justify-center relative", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                   "div",
                   {
                     className: "w-full",
@@ -294806,7 +294846,6 @@ const MobileLive = reactExports.memo(({ className = "" }) => {
   const { setStatus } = useGuestStore((state) => ({
     setStatus: state.setStatus
   }));
-  useSdkStore((state) => state.callConfig.title);
   const [isBackCamera, setIsBackCamera] = reactExports.useState(false);
   const [showDeviceSettings, setShowDeviceSettings] = reactExports.useState(false);
   const [isDeviceSelected, setIsDeviceSelected] = reactExports.useState({
@@ -295197,294 +295236,301 @@ const LiveDetection = ({
   }, [step2]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
     className: " h-full bg-#818384 flex items-center justify-center",
-    children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-      className: "w-720px h-600px flex items-center justify-between flex-col bg-#fff rounded p-7.5 gap-10",
-      children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        className: "w-full flex justify-between h-10",
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-          className: "text-18px",
-          children: "直播设备检测"
-        }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-          className: "cursor-pointer text-16px",
-          onClick: () => setShowHome(true),
-          children: "跳过检测"
-        })]
-      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        className: " flex-1 px-20",
+    children: /* @__PURE__ */ jsxRuntimeExports.jsx(ConfigProvider$1, {
+      theme: {
+        token: {
+          colorPrimary: "#6672fc"
+        }
+      },
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+        className: "w-720px h-600px flex items-center justify-between flex-col bg-#fff rounded p-7.5 gap-10",
         children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-          className: "mb-10",
+          className: "w-full flex justify-between h-10",
+          children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+            className: "text-18px",
+            children: "直播设备检测"
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+            className: "cursor-pointer text-16px",
+            onClick: () => setShowHome(true),
+            children: "跳过检测"
+          })]
+        }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+          className: " flex-1 px-20",
           children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: " flex justify-between items-center text-14px",
+            className: "mb-10",
             children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: "w-20 h-20 border border-#dfe1e5 border-solid rounded-full flex items-center justify-center relative",
-              style: {
-                lineHeight: 1
-              },
-              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("svg", {
-                className: "icon",
-                viewBox: "0 0 1024 1024",
-                version: "1.1",
-                xmlns: "http://www.w3.org/2000/svg",
-                width: "34",
-                height: "34",
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", {
-                  d: "M544 896h127.936a31.968 31.968 0 1 1 0 64H352.064a31.968 31.968 0 1 1 0-64H480V766.56C300.576 750.4 160 599.616 160 416c0-194.4 157.6-352 352-352s352 157.6 352 352c0 183.616-140.576 334.4-320 350.56V896z m-32-192a288 288 0 1 0 0-576 288 288 0 0 0 0 576z m0-96a192 192 0 1 1 0-384 192 192 0 0 1 0 384z m0-64a128 128 0 1 0 0-256 128 128 0 0 0 0 256z",
-                  fill: "#000000",
-                  "p-id": "8460"
+              className: " flex justify-between items-center text-14px",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                className: "w-20 h-20 border border-#dfe1e5 border-solid rounded-full flex items-center justify-center relative",
+                style: {
+                  lineHeight: 1
+                },
+                children: [/* @__PURE__ */ jsxRuntimeExports.jsx("svg", {
+                  className: "icon",
+                  viewBox: "0 0 1024 1024",
+                  version: "1.1",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  width: "34",
+                  height: "34",
+                  children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", {
+                    d: "M544 896h127.936a31.968 31.968 0 1 1 0 64H352.064a31.968 31.968 0 1 1 0-64H480V766.56C300.576 750.4 160 599.616 160 416c0-194.4 157.6-352 352-352s352 157.6 352 352c0 183.616-140.576 334.4-320 350.56V896z m-32-192a288 288 0 1 0 0-576 288 288 0 0 0 0 576z m0-96a192 192 0 1 1 0-384 192 192 0 0 1 0 384z m0-64a128 128 0 1 0 0-256 128 128 0 0 0 0 256z",
+                    fill: "#000000",
+                    "p-id": "8460"
+                  })
+                }), deviceState.camera === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {
+                  className: "absolute text-#ff4d4f bottom-15px right-15px text-19px"
+                }), deviceState.camera === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$o, {
+                  className: "absolute text-#52c41a bottom-15px right-15px text-19px"
+                })]
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "w-94px h-1 bg-#eee"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                className: "w-20 h-20 border border-#dfe1e5 border-solid rounded-full flex items-center justify-center relative",
+                style: {
+                  lineHeight: 1
+                },
+                children: [/* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1h, {
+                  className: `text-30px ${step2 >= 1 ? "text-#000" : "text-#ccc"}`
+                }), deviceState.microphone === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {
+                  className: "absolute text-#ff4d4f bottom-15px right-15px text-19px"
+                }), deviceState.microphone === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$o, {
+                  className: "absolute text-#52c41a bottom-15px right-15px text-19px"
+                })]
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "w-94px h-1 bg-#eee"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "w-20 h-20 border border-#dfe1e5 border-solid rounded-full flex items-center justify-center",
+                style: {
+                  lineHeight: 1
+                },
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$n, {
+                  className: `text-30px ${step2 >= 2 ? "text-#000" : "text-#ccc"}`
                 })
-              }), deviceState.camera === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {
-                className: "absolute text-#ff4d4f bottom-15px right-15px text-19px"
-              }), deviceState.camera === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$o, {
-                className: "absolute text-#52c41a bottom-15px right-15px text-19px"
               })]
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "w-94px h-1 bg-#eee"
             }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: "w-20 h-20 border border-#dfe1e5 border-solid rounded-full flex items-center justify-center relative",
-              style: {
-                lineHeight: 1
-              },
-              children: [/* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1h, {
-                className: `text-30px ${step2 >= 1 ? "text-#000" : "text-#ccc"}`
-              }), deviceState.microphone === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$1r, {
-                className: "absolute text-#ff4d4f bottom-15px right-15px text-19px"
-              }), deviceState.microphone === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$o, {
-                className: "absolute text-#52c41a bottom-15px right-15px text-19px"
+              className: " flex justify-between items-center mt-4 text-14px text-#000",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "w-20 flex items-center justify-center",
+                style: {
+                  lineHeight: 1
+                },
+                children: "摄像头"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: `w-20 flex items-center justify-center ${step2 >= 1 ? "" : "text-#ccc"}`,
+                style: {
+                  lineHeight: 1
+                },
+                children: "麦克风"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: `w-20 flex items-center justify-center ${step2 >= 2 ? "" : "text-#ccc"}`,
+                style: {
+                  lineHeight: 1
+                },
+                children: "检测结果"
               })]
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "w-94px h-1 bg-#eee"
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "w-20 h-20 border border-#dfe1e5 border-solid rounded-full flex items-center justify-center",
-              style: {
-                lineHeight: 1
+            })]
+          }), step2 === 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
+              label: "选择摄像头",
+              labelCol: {
+                span: 4
               },
-              children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$n, {
-                className: `text-30px ${step2 >= 2 ? "text-#000" : "text-#ccc"}`
+              colon: false,
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
+                onChange: async (deviceId) => {
+                  await previewCamera(deviceId);
+                },
+                placeholder: "请选择摄像头",
+                options: videoDevices
+              })
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
+              label: " ",
+              labelCol: {
+                span: 4
+              },
+              colon: false,
+              wrapperCol: {
+                span: 20
+              },
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx("video", {
+                id: "previewCameraVideo",
+                className: "w-180px aspect-video block bg-black",
+                controls: false
               })
             })]
-          }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: " flex justify-between items-center mt-4 text-14px text-#000",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "w-20 flex items-center justify-center",
-              style: {
-                lineHeight: 1
+          }), step2 === 1 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
+              label: "选择麦克风",
+              labelCol: {
+                span: 4
               },
-              children: "摄像头"
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: `w-20 flex items-center justify-center ${step2 >= 1 ? "" : "text-#ccc"}`,
-              style: {
-                lineHeight: 1
+              colon: false,
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
+                onChange: async (deviceId) => {
+                  await previewMicrophone(deviceId);
+                },
+                placeholder: "请选择麦克风",
+                options: audioDevices
+              })
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
+              label: " ",
+              labelCol: {
+                span: 4
               },
-              children: "麦克风"
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: `w-20 flex items-center justify-center ${step2 >= 2 ? "" : "text-#ccc"}`,
-              style: {
-                lineHeight: 1
+              colon: false,
+              wrapperCol: {
+                span: 20
               },
-              children: "检测结果"
+              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                className: " h-100px flex flex-col",
+                children: [/* @__PURE__ */ jsxRuntimeExports.jsx("canvas", {
+                  id: "volume-canvas",
+                  width: "400",
+                  height: "200",
+                  className: " h-80px"
+                }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                  className: "h-20px",
+                  style: {
+                    lineHeight: "20px"
+                  },
+                  children: "发声后能否看到音量条波动？"
+                })]
+              })
             })]
-          })]
-        }), step2 === 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
-            label: "选择摄像头",
-            labelCol: {
-              span: 4
-            },
-            colon: false,
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
-              onChange: async (deviceId) => {
-                await previewCamera(deviceId);
+          }), step2 === 0 || step2 === 1 ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
+              label: " ",
+              labelCol: {
+                span: 4
               },
-              placeholder: "请选择摄像头",
-              options: videoDevices
-            })
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
-            label: " ",
-            labelCol: {
-              span: 4
-            },
-            colon: false,
-            wrapperCol: {
-              span: 20
-            },
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx("video", {
-              id: "previewCameraVideo",
-              className: "w-180px aspect-video block bg-black",
-              controls: false
-            })
-          })]
-        }), step2 === 1 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
-            label: "选择麦克风",
-            labelCol: {
-              span: 4
-            },
-            colon: false,
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
-              onChange: async (deviceId) => {
-                await previewMicrophone(deviceId);
+              colon: false,
+              wrapperCol: {
+                span: 20
               },
-              placeholder: "请选择麦克风",
-              options: audioDevices
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "text-14px text-#949494 w-full",
+                children: "提示：如果是第一次检测，请打开浏览器访问摄像头和麦克风权限；请确保当前链接安全协议为https"
+              })
             })
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
-            label: " ",
-            labelCol: {
-              span: 4
-            },
-            colon: false,
-            wrapperCol: {
-              span: 20
-            },
-            children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: " h-100px flex flex-col",
-              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("canvas", {
-                id: "volume-canvas",
-                width: "400",
-                height: "200",
-                className: " h-80px"
-              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-                className: "h-20px",
-                style: {
-                  lineHeight: "20px"
-                },
-                children: "发声后能否看到音量条波动？"
+          }) : null, step2 === 2 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+            className: " h-200px flex items-center justify-center flex-col bg-#f5f5f5 text-14px gap-4",
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+              className: "w-250px h-20px flex items-center justify-between",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                children: "摄像头"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                children: [deviceState.camera === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  className: "text-#ff0000",
+                  children: "异常"
+                }), deviceState.camera === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  children: "正常"
+                })]
               })]
-            })
-          })]
-        }), step2 === 0 || step2 === 1 ? /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Form2.Item, {
-            label: " ",
-            labelCol: {
-              span: 4
-            },
-            colon: false,
-            wrapperCol: {
-              span: 20
-            },
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "text-14px text-#949494 w-full",
-              children: "提示：如果是第一次检测，请打开浏览器访问摄像头和麦克风权限；请确保当前链接安全协议为https"
-            })
-          })
-        }) : null, step2 === 2 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-          className: " h-200px flex items-center justify-center flex-col bg-#f5f5f5 text-14px gap-4",
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: "w-250px h-20px flex items-center justify-between",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              children: "摄像头"
             }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              children: [deviceState.camera === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                className: "text-#ff0000",
-                children: "异常"
-              }), deviceState.camera === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                children: "正常"
+              className: "w-250px h-20px flex items-center justify-between",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                children: "麦克风"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                children: [deviceState.microphone === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  className: "text-#ff0000",
+                  children: "异常"
+                }), deviceState.microphone === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  children: "正常"
+                })]
               })]
-            })]
-          }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: "w-250px h-20px flex items-center justify-between",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              children: "麦克风"
             }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              children: [deviceState.microphone === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                className: "text-#ff0000",
-                children: "异常"
-              }), deviceState.microphone === 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                children: "正常"
+              className: "w-250px h-20px flex items-center justify-between",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                children: "网速"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                children: deviceState.onLine ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  children: "正常"
+                }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  className: "text-#ff0000",
+                  children: "异常"
+                })
               })]
-            })]
-          }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: "w-250px h-20px flex items-center justify-between",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              children: "网速"
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              children: deviceState.onLine ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+            }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+              className: "w-250px h-20px flex items-center justify-between",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                children: "浏览器"
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
                 children: "正常"
-              }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                className: "text-#ff0000",
-                children: "异常"
-              })
-            })]
-          }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: "w-250px h-20px flex items-center justify-between",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              children: "浏览器"
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              children: "正常"
+              })]
             })]
           })]
-        })]
-      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        className: " flex items-center gap-3 justify-center",
-        children: [step2 === 0 || step2 === 1 ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
-            onClick: () => {
-              if (step2 === 0) {
-                setDeviceState((old) => {
-                  return {
-                    ...old,
-                    camera: 0
-                  };
-                });
-              }
-              if (step2 === 1) {
-                setDeviceState((old) => {
-                  return {
-                    ...old,
-                    microphone: 0
-                  };
+        }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+          className: " flex items-center gap-3 justify-center",
+          children: [step2 === 0 || step2 === 1 ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
+              onClick: () => {
+                if (step2 === 0) {
+                  setDeviceState((old) => {
+                    return {
+                      ...old,
+                      camera: 0
+                    };
+                  });
+                }
+                if (step2 === 1) {
+                  setDeviceState((old) => {
+                    return {
+                      ...old,
+                      microphone: 0
+                    };
+                  });
+                }
+                setStep((old) => {
+                  return old + 1;
                 });
-              }
-              setStep((old) => {
-                return old + 1;
-              });
-            },
-            children: "看不到"
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
-            type: "primary",
-            onClick: () => {
-              if (step2 === 0) {
-                setDeviceState((old) => {
-                  return {
-                    ...old,
-                    camera: 1
-                  };
+              },
+              children: "看不到"
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
+              type: "primary",
+              onClick: () => {
+                if (step2 === 0) {
+                  setDeviceState((old) => {
+                    return {
+                      ...old,
+                      camera: 1
+                    };
+                  });
+                }
+                if (step2 === 1) {
+                  setDeviceState((old) => {
+                    return {
+                      ...old,
+                      microphone: 1
+                    };
+                  });
+                }
+                setStep((old) => {
+                  return old + 1;
                 });
-              }
-              if (step2 === 1) {
+              },
+              children: "可以看到"
+            })]
+          }) : null, step2 === 2 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
+              onClick: () => {
+                setStep(0);
                 setDeviceState((old) => {
                   return {
                     ...old,
-                    microphone: 1
+                    camera: null,
+                    microphone: null
                   };
                 });
-              }
-              setStep((old) => {
-                return old + 1;
-              });
-            },
-            children: "可以看到"
-          })]
-        }) : null, step2 === 2 && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
-            onClick: () => {
-              setStep(0);
-              setDeviceState((old) => {
-                return {
-                  ...old,
-                  camera: null,
-                  microphone: null
-                };
-              });
-            },
-            children: "重新检测"
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
-            type: "primary",
-            onClick: () => setShowHome(true),
-            children: "去直播"
+              },
+              children: "重新检测"
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
+              type: "primary",
+              onClick: () => setShowHome(true),
+              children: "去直播"
+            })]
           })]
         })]
-      })]
+      })
     })
   });
 };