重构多个组件以优化代码格式和可读性，删除不必要的文件，更新类型定义，添加数据分析路由

src/views/OpenLiveLayout.vue

@@ -121,30 +121,50 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <NLayoutContent v-if="!authInfo?.Code" style="height: 100vh">
-    <NResult status="error" title="无效访问">
+  <NLayoutContent
+    v-if="!authInfo?.Code"
+    style="height: 100vh"
+  >
+    <NResult
+      status="error"
+      title="无效访问"
+    >
       <template #footer>
         请前往
-        <NButton text type="primary" tag="a" href="https://play-live.bilibili.com/details/1698742711771"
-          target="_blank">
+        <NButton
+          text
+          type="primary"
+          tag="a"
+          href="https://play-live.bilibili.com/details/1698742711771"
+          target="_blank"
+        >
           幻星平台 | VTsuru
         </NButton>
         并点击 获取 , 再点击 获取 H5 插件链接来获取可用链接
-        <br />
+        <br>
         或者直接在那个页面用也可以, 虽然并不推荐
       </template>
     </NResult>
   </NLayoutContent>
-  <NLayout v-else style="height: 100vh">
-    <NLayoutHeader style="height: 45px; padding: 5px 15px 5px 15px" bordered>
+  <NLayout
+    v-else
+    style="height: 100vh"
+  >
+    <NLayoutHeader
+      style="height: 45px; padding: 5px 15px 5px 15px"
+      bordered
+    >
       <NPageHeader :subtitle="($route.meta.title as string) ?? ''">
         <template #extra>
           <NSpace align="center">
             <NTag :type="danmakuClient.connected ? 'success' : 'warning'">
               {{ danmakuClient.connected ? `已连接 | ${danmakuClient.authInfo?.anchor_info?.uname}` : '未连接' }}
             </NTag>
-            <NSwitch :default-value="!isDarkMode" @update:value="(value: string & number & boolean) => (themeType = value ? ThemeType.Light : ThemeType.Dark)
-              ">
+            <NSwitch
+              :default-value="!isDarkMode"
+              @update:value="(value: string & number & boolean) => (themeType = value ? ThemeType.Light : ThemeType.Dark)
+              "
+            >
               <template #checked>
                 <NIcon :component="Sunny" />
               </template>
@@ -155,25 +175,59 @@ onUnmounted(() => {
           </NSpace>
         </template>
         <template #title>
-          <NButton text tag="a" @click="$router.push({ name: 'open-live-index', query: $route.query })">
-            <NText strong style="font-size: 1.4rem; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); text-justify: auto">
+          <NButton
+            text
+            tag="a"
+            @click="$router.push({ name: 'open-live-index', query: $route.query })"
+          >
+            <NText
+              strong
+              style="font-size: 1.4rem; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); text-justify: auto"
+            >
               VTSURU | 开放平台
             </NText>
           </NButton>
         </template>
       </NPageHeader>
     </NLayoutHeader>
-    <NLayout has-sider style="height: calc(100vh - 45px - 30px)">
-      <NLayoutSider bordered ref="sider" show-trigger default-collapsed collapse-mode="width" :collapsed-width="64"
-        :width="180" :native-scrollbar="false" style="height: 100%">
+    <NLayout
+      has-sider
+      style="height: calc(100vh - 45px - 30px)"
+    >
+      <NLayoutSider
+        ref="sider"
+        bordered
+        show-trigger
+        default-collapsed
+        collapse-mode="width"
+        :collapsed-width="64"
+        :width="180"
+        :native-scrollbar="false"
+        style="height: 100%"
+      >
         <Transition>
-          <div v-if="danmakuClient.authInfo" style="margin-top: 8px">
-            <NSpace vertical justify="center" align="center">
-              <NAvatar :src="danmakuClient.authInfo?.anchor_info?.uface" :img-props="{ referrerpolicy: 'no-referrer' }"
-                round bordered :style="{
+          <div
+            v-if="danmakuClient.authInfo"
+            style="margin-top: 8px"
+          >
+            <NSpace
+              vertical
+              justify="center"
+              align="center"
+            >
+              <NAvatar
+                :src="danmakuClient.authInfo?.anchor_info?.uface"
+                :img-props="{ referrerpolicy: 'no-referrer' }"
+                round
+                bordered
+                :style="{
                   boxShadow: isDarkMode ? 'rgb(195 192 192 / 35%) 0px 0px 8px' : '0 2px 3px rgba(0, 0, 0, 0.1)',
-                }" />
-              <NEllipsis v-if="width > 100" style="max-width: 100%">
+                }"
+              />
+              <NEllipsis
+                v-if="width > 100"
+                style="max-width: 100%"
+              >
                 <NText strong>
                   {{ danmakuClient.authInfo?.anchor_info?.uname }}
                 </NText>
@@ -181,37 +235,81 @@ onUnmounted(() => {
             </NSpace>
           </div>
         </Transition>
-        <NMenu :default-value="$route.name?.toString()" :collapsed-width="64" :collapsed-icon-size="22"
-          :options="menuOptions" />
+        <NMenu
+          :default-value="$route.name?.toString()"
+          :collapsed-width="64"
+          :collapsed-icon-size="22"
+          :options="menuOptions"
+        />
         <NSpace justify="center">
-          <NText depth="3" v-if="width > 150">
+          <NText
+            v-if="width > 150"
+            depth="3"
+          >
             有更多功能建议请
-            <NButton text type="info" @click="$router.push({ name: 'about' })"> 反馈 </NButton>
+            <NButton
+              text
+              type="info"
+              @click="$router.push({ name: 'about' })"
+            >
+              反馈
+            </NButton>
           </NText>
         </NSpace>
       </NLayoutSider>
-      <NLayoutContent style="height: 100%; padding: 10px" :native-scrollbar="false">
-        <NAlert v-if="danmakuClientError" type="error" title="无法启动弹幕客户端">
+      <NLayoutContent
+        style="height: 100%; padding: 10px"
+        :native-scrollbar="false"
+      >
+        <NAlert
+          v-if="danmakuClientError"
+          type="error"
+          title="无法启动弹幕客户端"
+        >
           {{ danmakuClientError }}
         </NAlert>
-        <RouterView v-if="danmakuClient.authInfo" v-slot="{ Component }">
+        <RouterView
+          v-if="danmakuClient.authInfo"
+          v-slot="{ Component }"
+        >
           <KeepAlive>
-            <component :is="Component" :room-info="danmakuClient.authInfo" :code="authInfo.Code" />
+            <component
+              :is="Component"
+              :room-info="danmakuClient.authInfo"
+              :code="authInfo.Code"
+            />
           </KeepAlive>
         </RouterView>
         <template v-else>
-
-          {{  }}
-          <NAlert type="info" title="正在请求弹幕客户端认证信息...">
+          {{ }}
+          <NAlert
+            type="info"
+            title="正在请求弹幕客户端认证信息..."
+          >
             <NSpin show />
           </NAlert>
         </template>
         <NBackTop />
       </NLayoutContent>
     </NLayout>
-    <NLayoutFooter style="height: 30px" bordered>
-      <NSpace justify="center" align="center" style="height: 100%">
-        <NButton text tag="a" href="/" target="_blank" type="info"> vtsuru.live </NButton>
+    <NLayoutFooter
+      style="height: 30px"
+      bordered
+    >
+      <NSpace
+        justify="center"
+        align="center"
+        style="height: 100%"
+      >
+        <NButton
+          text
+          tag="a"
+          href="/"
+          target="_blank"
+          type="info"
+        >
+          vtsuru.live
+        </NButton>
       </NSpace>
     </NLayoutFooter>
   </NLayout>