fix: 优化

README.md

@@ -238,7 +238,7 @@ pnpm run dev
 
 ## 常见问题
 
-[https://live.hsslive.cn/about/faq](https://live.hsslive.cn/about/faq)
+[https://live.hsslive.cn/doc/faq](https://live.hsslive.cn/doc/faq)
 
 ## 环境配置
 

src/App.vue

@@ -26,7 +26,7 @@ import { fetchSettingsList } from '@/api/settings';
 import { THEME_COLOR, appBuildInfo } from '@/constant';
 import { useCheckUpdate } from '@/hooks/use-common';
 import { loginMessage } from '@/hooks/use-login';
-import { usePiniaCacheStore } from '@/store/cache';
+import { useCacheStore } from '@/store/cache';
 import { useUserStore } from '@/store/user';
 import { getHostnameUrl } from '@/utils';
 import { getLastBuildDate, setLastBuildDate } from '@/utils/localStorage/app';
@@ -40,7 +40,7 @@ import { initAdsbygoogle } from './utils/google-ad';
 
 const { checkUpdate } = useCheckUpdate();
 const appStore = useAppStore();
-const cacheStore = usePiniaCacheStore();
+const cacheStore = useCacheStore();
 const userStore = useUserStore();
 const route = useRoute();
 

src/components/PayCourse/index.vue

@@ -30,6 +30,7 @@ const show = ref(true);
   right: 10px;
   bottom: 10px;
   z-index: 999;
+  overflow: hidden;
   border-radius: 10px;
   cursor: pointer;
   img {

src/components/VideoControls/index.vue

@@ -201,7 +201,7 @@ import { onMounted, onUnmounted } from 'vue';
 import { handleTip } from '@/hooks/use-common';
 import { LiveLineEnum, LiveRenderEnum } from '@/interface';
 import { AppRootState, useAppStore } from '@/store/app';
-import { usePiniaCacheStore } from '@/store/cache';
+import { useCacheStore } from '@/store/cache';
 import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
 
 const props = withDefaults(
@@ -219,7 +219,7 @@ const emits = defineEmits([
   'pictureInPicture',
 ]);
 
-const cacheStore = usePiniaCacheStore();
+const cacheStore = useCacheStore();
 const appStore = useAppStore();
 
 const debounceRefresh = debounce(() => {

src/constant.ts

@@ -1,7 +1,6 @@
 import { MediaTypeEnum } from '@/interface';
 import { prodDomain } from '@/spec-config';
-
-import { LiveRoomTypeEnum } from './types/ILiveRoom';
+import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
 
 export const QQ_CLIENT_ID = `101958191`;
 export const QQ_OAUTH_URL = `https://graph.qq.com/oauth2.0`;
@@ -16,6 +15,12 @@ export const QRCODE_LOGIN_URI = `https://live.${prodDomain}/qrcodeLogin`;
 
 export const AUTHOR_GITHUB = `https://github.com/galaxy-s10`;
 
+export const AUTHOR_INFO = {
+  github: 'https://github.com/galaxy-s10',
+  wechat: 'shuisheng9905',
+  qq: '2274751790',
+};
+
 export const appBuildInfo =
   // @ts-ignore
   process.env.BilldHtmlWebpackPlugin as BilldHtmlWebpackPluginLog;

src/hooks/use-play.ts

@@ -8,7 +8,7 @@ import { onMounted, onUnmounted, ref, watch } from 'vue';
 
 import { SRS_CB_URL_PARAMS } from '@/constant';
 import { useAppStore } from '@/store/app';
-import { usePiniaCacheStore } from '@/store/cache';
+import { useCacheStore } from '@/store/cache';
 import { useUserStore } from '@/store/user';
 import { createVideo } from '@/utils';
 
@@ -93,7 +93,7 @@ export function useFullScreen(video) {
 }
 
 export function useFlvPlay() {
-  const cacheStore = usePiniaCacheStore();
+  const cacheStore = useCacheStore();
   const appStore = useAppStore();
   // const flvPlayer = ref<flvJs.Player>();
   const flvPlayer = ref<mpegts.Player>();
@@ -250,7 +250,7 @@ export function useFlvPlay() {
 }
 
 export function useHlsPlay() {
-  const cacheStore = usePiniaCacheStore();
+  const cacheStore = useCacheStore();
   const appStore = useAppStore();
   const hlsPlayer = ref<Player>();
   const hlsVideoEl = ref<HTMLVideoElement>();

src/hooks/use-pull.ts

@@ -13,7 +13,7 @@ import {
   WsMessageMsgIsFileEnum,
 } from '@/interface';
 import { useAppStore } from '@/store/app';
-import { usePiniaCacheStore } from '@/store/cache';
+import { useCacheStore } from '@/store/cache';
 import { useNetworkStore } from '@/store/network';
 import {
   ILiveRoom,
@@ -26,7 +26,7 @@ import { videoFullBox, videoToCanvas } from '@/utils';
 export function usePull() {
   const route = useRoute();
   const networkStore = useNetworkStore();
-  const cacheStore = usePiniaCacheStore();
+  const cacheStore = useCacheStore();
   const appStore = useAppStore();
   const danmuStr = ref('');
   const roomId = ref('');

src/layout/pc/head/index.vue

@@ -103,36 +103,17 @@
           <template #list>
             <div class="list">
               <a
+                v-for="(item, index) in docList"
+                :key="index"
+                :href="item.url"
                 class="item"
-                @click="handleTip"
-              >
-                <div class="txt">{{ t('layout.guide') }}</div>
-              </a>
-              <a
-                class="item"
-                :href="COMMON_URL.apifox"
-                @click.prevent="openToTarget(COMMON_URL.apifox)"
-              >
-                <div class="txt">{{ t('layout.apiDoc') }}</div>
-                <VPIconExternalLink class="icon"></VPIconExternalLink>
-              </a>
-              <a
-                class="item"
-                :href="COMMON_URL.bilibiliCollectiondetail"
-                @click.prevent="
-                  openToTarget(COMMON_URL.bilibiliCollectiondetail)
-                "
-              >
-                <div class="txt">{{ t('layout.bilibiliTutorial') }}</div>
-                <VPIconExternalLink class="icon"></VPIconExternalLink>
-              </a>
-              <a
-                class="item"
-                :href="COMMON_URL.payCoursesArticle"
-                @click.prevent="openToTarget(COMMON_URL.payCoursesArticle)"
+                @click.prevent="handleJump(item)"
               >
-                <div class="txt">{{ t('layout.vipCourses') }}</div>
-                <VPIconExternalLink class="icon"></VPIconExternalLink>
+                <div class="txt">{{ t(item.label) }}</div>
+                <VPIconExternalLink
+                  class="icon"
+                  v-if="item.url"
+                ></VPIconExternalLink>
               </a>
             </div>
           </template>
@@ -152,7 +133,7 @@
             <div class="list">
               <div class="title">{{ t('layout.resource') }}</div>
               <a
-                v-for="(item, index) in resource"
+                v-for="(item, index) in resourceList"
                 :key="index"
                 :href="item.url"
                 class="item"
@@ -196,15 +177,11 @@
           <template #list>
             <div class="list">
               <a
-                v-for="(item, index) in about"
+                v-for="(item, index) in aboutList"
                 :key="index"
                 class="item"
                 :href="item.url"
-                @click.prevent="
-                  item.routerName
-                    ? router.push({ name: item.routerName })
-                    : openToTarget(item.url)
-                "
+                @click.prevent="handleJump(item)"
               >
                 <div class="txt">{{ t(item.label) }}</div>
                 <VPIconExternalLink
@@ -407,7 +384,7 @@
         >
           <template #btn>
             <div class="btn">
-              {{ localeMap[locale] }}
+              {{ localeList.find((v) => v.value === cacheStore.locale)?.label }}
               <VPIconChevronDown class="icon"></VPIconChevronDown>
             </div>
           </template>
@@ -415,12 +392,12 @@
             <div class="list">
               <a
                 class="item"
-                v-for="(item, index) in localeMap"
+                v-for="(item, index) in localeList"
                 :key="index"
-                :class="{ active: item === localeMap[locale] }"
-                @click="locale = index"
+                :class="{ active: item.value === cacheStore.locale }"
+                @click="changeLocale(item)"
               >
-                <div class="txt">{{ item }}</div>
+                <div class="txt">{{ item.label }}</div>
               </a>
             </div>
           </template>
@@ -445,6 +422,7 @@ import { handleTip } from '@/hooks/use-common';
 import { loginTip } from '@/hooks/use-login';
 import { routerName } from '@/router';
 import { useAppStore } from '@/store/app';
+import { useCacheStore } from '@/store/cache';
 import { useUserStore } from '@/store/user';
 import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
 
@@ -452,19 +430,41 @@ const { t, locale } = useI18n();
 const router = useRouter();
 const userStore = useUserStore();
 const appStore = useAppStore();
+const cacheStore = useCacheStore();
 const githubStar = ref('');
 
-const localeMap = {
-  zh: '中文',
-  en: 'English',
-};
+const localeList = [
+  { label: '中文', value: 'zh' },
+  { label: 'English', value: 'en' },
+];
 
-const about = ref([
+const docList = ref([
+  {
+    label: 'layout.guide',
+    routerName: routerName.guide,
+    url: '',
+  },
+  {
+    label: 'layout.apiDoc',
+    routerName: routerName.api,
+    url: '',
+  },
   {
     label: 'layout.faq',
     routerName: routerName.faq,
     url: '',
   },
+  {
+    label: 'layout.vipCourses',
+    url: COMMON_URL.payCoursesArticle,
+  },
+  {
+    label: 'layout.bilibiliTutorial',
+    url: COMMON_URL.bilibiliCollectiondetail,
+  },
+]);
+
+const aboutList = ref([
   {
     label: 'layout.team',
     routerName: routerName.team,
@@ -476,13 +476,13 @@ const about = ref([
     url: '',
   },
   {
-    label: 'layout.officialGroup',
-    routerName: routerName.group,
+    label: 'layout.sponsor',
+    routerName: routerName.sponsors,
     url: '',
   },
   {
-    label: 'layout.sponsor',
-    routerName: routerName.sponsors,
+    label: 'layout.officialGroup',
+    routerName: routerName.group,
     url: '',
   },
   {
@@ -492,7 +492,7 @@ const about = ref([
   },
 ]);
 
-const resource = ref([
+const resourceList = ref([
   {
     label: 'billd-live',
     url: 'https://github.com/galaxy-s10/billd-live',
@@ -596,6 +596,11 @@ async function initSigninStatus() {
   }
 }
 
+function changeLocale(item) {
+  locale.value = item.value;
+  cacheStore.locale = item.value;
+}
+
 function handleLogout() {
   userStore.logout();
   setTimeout(() => {
@@ -604,7 +609,9 @@ function handleLogout() {
 }
 
 function handleJump(item) {
-  if (item.url) {
+  if (item.routerName) {
+    router.push({ name: item.routerName });
+  } else if (item.url) {
     openToTarget(item.url);
   } else {
     handleTip();
@@ -612,6 +619,7 @@ function handleJump(item) {
 }
 
 onMounted(() => {
+  locale.value = cacheStore.locale;
   githubStar.value =
     'https://img.shields.io/github/stars/galaxy-s10/billd-live?label=Star&logo=GitHub&labelColor=white&logoColor=black&style=social&cacheSeconds=3600';
 });
@@ -727,6 +735,7 @@ function handleWebsiteJump() {
         color: black;
         text-decoration: none;
         cursor: pointer;
+        &.active,
         &:hover {
           color: $theme-color-gold;
         }

src/layout/pc/index.vue

@@ -7,12 +7,6 @@
     </router-view>
     <SidebarCpt></SidebarCpt>
     <LoginModal v-if="appStore.showLoginModal"></LoginModal>
-    <!-- <img
-      class="pay-course"
-      src="@/assets/img/pay-course.webp"
-      alt=""
-      @click="openToTarget(COMMON_URL.payCoursesArticle)"
-    /> -->
     <PayCourse></PayCourse>
   </div>
 </template>

src/router/index.ts

@@ -23,6 +23,9 @@ export const mobileRouterName = {
 export const routerName = {
   home: 'home',
   about: 'about',
+  doc: 'doc',
+  api: 'api',
+  guide: 'guide',
   area: 'area',
   areaDetail: 'areaDetail',
   rank: 'rank',
@@ -81,11 +84,6 @@ export const defaultRoutes: RouteRecordRaw[] = [
             path: 'group',
             component: () => import('@/views/about/group/index.vue'),
           },
-          {
-            name: routerName.faq,
-            path: 'faq',
-            component: () => import('@/views/about/faq/index.vue'),
-          },
           {
             name: routerName.team,
             path: 'team',
@@ -101,11 +99,37 @@ export const defaultRoutes: RouteRecordRaw[] = [
             path: 'author',
             component: () => import('@/views/about/author/index.vue'),
           },
+        ],
+      },
+      {
+        name: routerName.doc,
+        path: '/doc',
+        children: [
+          {
+            name: routerName.faq,
+            path: 'faq',
+            component: () => import('@/views/doc/faq/index.vue'),
+          },
+          {
+            name: routerName.ad,
+            path: 'ad',
+            component: () => import('@/views/doc/ad/index.vue'),
+          },
+          {
+            name: routerName.api,
+            path: 'api',
+            component: () => import('@/views/doc/api/index.vue'),
+          },
+          {
+            name: routerName.guide,
+            path: 'guide',
+            component: () => import('@/views/doc/guide/index.vue'),
+          },
           {
             name: routerName.pushStreamDifferent,
             path: 'pushStreamDifferent',
             component: () =>
-              import('@/views/about/pushStreamDifferent/index.vue'),
+              import('@/views/doc/pushStreamDifferent/index.vue'),
           },
         ],
       },
@@ -154,13 +178,12 @@ export const defaultRoutes: RouteRecordRaw[] = [
       {
         name: routerName.sponsors,
         path: '/sponsors',
-        component: () => import('@/views/doc/sponsors/index.vue'),
+        component: () => import('@/views/sponsors/index.vue'),
       },
       {
         name: routerName.privatizationDeployment,
         path: '/privatizationDeployment',
-        component: () =>
-          import('@/views/doc/privatizationDeployment/index.vue'),
+        component: () => import('@/views/privatizationDeployment/index.vue'),
       },
       {
         name: routerName.support,
@@ -194,11 +217,6 @@ export const defaultRoutes: RouteRecordRaw[] = [
         component: () =>
           import('@/views/videoTools/frameScreenshot/webcodec/index.vue'),
       },
-      {
-        name: routerName.ad,
-        path: '/ad',
-        component: () => import('@/views/doc/ad/index.vue'),
-      },
       {
         name: routerName.pull,
         path: '/pull/:roomId',

src/store/cache/index.ts

@@ -4,17 +4,19 @@ import { lsKeyPrefix } from '@/constant';
 import { AppRootState } from '@/store/app';
 
 export type PiniaCacheRootState = {
+  locale: string;
   muted: boolean;
   volume: number;
   'resource-list': AppRootState['allTrack'];
 };
 
-export const usePiniaCacheStore = defineStore(`${lsKeyPrefix}pinia-cache`, {
+export const useCacheStore = defineStore(`${lsKeyPrefix}pinia-cache`, {
   persist: {
     key: `${lsKeyPrefix}pinia-cache`,
   },
   state: (): PiniaCacheRootState => {
     return {
+      locale: 'zh',
       muted: true,
       volume: 80,
       'resource-list': [],

src/views/about/author/index.vue

@@ -4,17 +4,21 @@
     <p class="desc">主业前端开发，兴趣使然，故业余时间开发了billd-live。</p>
     <div class="hr"></div>
     <div class="info">
-      <div class="title">微信</div>
+      <div class="title">微信二维码</div>
       <img
         src="@/assets/img/my-wechat.webp"
         alt=""
         class="my-wechat"
       />
+      <p>微信号：{{ AUTHOR_INFO.wechat }}</p>
+      <p>qq号：{{ AUTHOR_INFO.qq }}</p>
     </div>
   </div>
 </template>
 
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+import { AUTHOR_INFO } from '@/constant';
+</script>
 
 <style lang="scss" scoped>
 .author-wrap {

src/views/about/group/index.vue

@@ -99,26 +99,28 @@
       </p>
       <p>2. 闲聊勿扰。</p>
     </div>
-    <h1 class="title">🚀 作者微信</h1>
-
+    <h1 class="title">🚀 联系作者</h1>
+    <div>微信二维码：</div>
     <img
       src="@/assets/img/my-wechat.webp"
       alt=""
-      class="my-wechat"
+      style="width: 300px"
     />
+    <p>微信号：{{ AUTHOR_INFO.wechat }}</p>
+    <p>qq号：{{ AUTHOR_INFO.qq }}</p>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { openToTarget } from 'billd-utils';
 
-import { COMMON_URL } from '@/constant';
+import { AUTHOR_INFO, COMMON_URL } from '@/constant';
 import { getHostnameUrl } from '@/utils';
 </script>
 
 <style lang="scss" scoped>
 .group-wrap {
-  padding: 0 10px;
+  padding: 0 20px 10px;
   p {
     margin: 4px 0;
   }
@@ -135,8 +137,5 @@ import { getHostnameUrl } from '@/utils';
   .wechat-group {
     height: 500px;
   }
-  .my-wechat {
-    height: 500px;
-  }
 }
 </style>

src/views/doc/api/index.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class="api-doc-wrap">
+    <p>
+      接口文档：<a
+        :href="COMMON_URL.apifox"
+        class="link"
+        @click.prevent="openToTarget(COMMON_URL.apifox)"
+        >apifox</a
+      >
+    </p>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { openToTarget } from 'billd-utils';
+
+import { COMMON_URL } from '@/constant';
+</script>
+
+<style lang="scss" scoped>
+.api-doc-wrap {
+  padding: 0 20px 10px;
+  .link {
+    color: $theme-color-gold;
+    text-decoration: none;
+    cursor: pointer;
+  }
+}
+</style>

src/views/about/faq/index.vue → src/views/doc/faq/index.vue

@@ -46,7 +46,7 @@
           <p>
             billd-live 是由
             <a
-              :href="AUTHOR_GITHUB"
+              :href="AUTHOR_INFO.github"
               target="_blank"
               class="link"
             >
@@ -118,7 +118,7 @@
 <script lang="ts" setup>
 import { openToTarget } from 'billd-utils';
 
-import { AUTHOR_GITHUB, COMMON_URL } from '@/constant';
+import { AUTHOR_INFO, COMMON_URL } from '@/constant';
 </script>
 
 <style lang="scss" scoped>

src/views/doc/guide/index.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="guide-wrap">
+    <p>敬请期待！</p>
+  </div>
+</template>
+
+<script lang="ts" setup></script>
+
+<style lang="scss" scoped>
+.guide-wrap {
+  padding: 0 20px 10px;
+  .link {
+    color: $theme-color-gold;
+    text-decoration: none;
+    cursor: pointer;
+  }
+}
+</style>

src/views/doc/privatizationDeployment/index copy.vue

@@ -1,158 +0,0 @@
-<template>
-  <div class="privatizationDeployment-wrap">
-    <div class="content">
-      <h1 class="title">私有化部署</h1>
-      <div class="desc">
-        欢迎使用billd-live，在使用billd-live时，请遵循billd-live的
-        <span
-          class="link"
-          @click="
-            openToTarget(
-              'https://github.com/galaxy-s10/billd-live/blob/master/LICENSE'
-            )
-          "
-        >
-          开源协议
-        </span>
-        ，注明作者版权。
-      </div>
-      <div class="list">
-        <div class="hr"></div>
-        <div class="item">
-          <h2>简介</h2>
-          <p>目前核心实现：</p>
-          <ol>
-            <li>服务器自建SRS直播。</li>
-            <li>服务器自建WebRTC会议。</li>
-            <li>接入第三方腾讯云云直播。</li>
-            <li>直播PK互动。</li>
-            <li>转推到第三方直播（b站、虎牙）。</li>
-          </ol>
-        </div>
-        <div class="hr"></div>
-        <div class="item">
-          <h2>远程协助</h2>
-          <p>如果在部署期间遇到问题，可以联系作者获取远程协助（付费）。</p>
-        </div>
-        <div class="hr"></div>
-        <div class="item">
-          <h2>定制服务</h2>
-          <p>
-            billd-live作为开源项目，不可能满足所有需求。但提供定制服务（付费），如有需要请联系作者。
-          </p>
-        </div>
-        <div class="hr"></div>
-        <div class="item">
-          <h2>收费标准</h2>
-          <p>1.咨询费用：每小时50-100元。</p>
-          <p>2.开发费用：每小时150-300元。</p>
-        </div>
-        <div class="hr"></div>
-        <div class="item">
-          <h2>联系方式</h2>
-          <p>添加时请备注: 私有化部署+用途</p>
-          <p>微信号: shuisheng9905</p>
-          <p>qq号: 2274751790</p>
-        </div>
-      </div>
-    </div>
-    <div class="aside">
-      <div class="title">本页目录</div>
-      <div class="item">简介</div>
-      <div class="item">远程协助</div>
-      <div class="item">定制服务</div>
-      <div class="item">收费标准</div>
-      <div class="item">联系方式</div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { openToTarget } from 'billd-utils';
-</script>
-
-<style lang="scss" scoped>
-.privatizationDeployment-wrap {
-  display: flex;
-  box-sizing: border-box;
-  margin: 0 auto;
-  padding-top: 50px;
-  width: 960px;
-  color: rgb(33, 53, 71);
-
-  .content {
-    flex: 1;
-    font-size: 16px;
-    .title {
-      margin: 0;
-      margin-bottom: 60px;
-      font-weight: 500;
-      font-size: 40px;
-    }
-    .hr {
-      margin: 60px 0 20px 0;
-      width: 100%;
-      height: 1px;
-      background-color: #e7e7e7;
-    }
-
-    .link {
-      color: $theme-color-gold;
-      text-decoration: none;
-      font-weight: 500;
-      cursor: pointer;
-    }
-    .list {
-      h2 {
-        font-weight: 600;
-      }
-
-      .item {
-        font-size: 16px;
-        &.sponsors {
-          h3 {
-            margin-top: 50px;
-            text-align: center;
-          }
-          .list {
-            display: flex;
-            flex-wrap: wrap;
-            justify-content: space-evenly;
-          }
-          .bg {
-            display: flex;
-            align-items: center;
-            flex-shrink: 0;
-            justify-content: center;
-            box-sizing: border-box;
-            margin-bottom: 5px;
-            border-radius: 4px;
-            background-color: #f9f9f9;
-            cursor: pointer;
-          }
-        }
-      }
-    }
-  }
-  .aside {
-    padding-left: 90px;
-    width: 150px;
-
-    .title {
-      margin-bottom: 8px;
-      color: rgb(33, 53, 71);
-      font-weight: 700;
-      font-size: 12px;
-    }
-    .item {
-      margin-bottom: 8px;
-      color: rgba(60, 60, 60, 0.7);
-      font-size: 13px;
-      cursor: pointer;
-      &:hover {
-        color: #213547;
-      }
-    }
-  }
-}
-</style>

src/views/about/pushStreamDifferent/index.vue → src/views/doc/pushStreamDifferent/index.vue

@@ -9,19 +9,22 @@
           <p>
             推流到服务器，由服务器的SRS进行转发（RTMP、FLV、HLS、WebRTC等）。
           </p>
-          <p>优点：不同客户端都能拉流；缺点：对服务器带宽要求高。</p>
+          <p>优点：不同客户端都能拉流。</p>
+          <p>缺点：对服务器带宽要求高。</p>
         </div>
         <div class="hr"></div>
         <div class="item">
           <h2>WebRTC直播</h2>
           <p>原生WebRTC一对多。</p>
-          <p>优点：延迟低。缺点：对客户端上传带宽要求高。</p>
+          <p>优点：延迟低。</p>
+          <p>缺点：对客户端上传带宽要求高。</p>
         </div>
         <div class="hr"></div>
         <div class="item">
           <h2>WebRTC会议</h2>
           <p>原生WebRTC多对多。</p>
-          <p>优点：延迟低。缺点：对客户端上传带宽要求高。</p>
+          <p>优点：延迟低。</p>
+          <p>缺点：对客户端上传带宽要求高。</p>
         </div>
         <div class="hr"></div>
         <div class="item">
@@ -29,8 +32,9 @@
           <p>
             类似bilibili的web直播间实现，浏览器录制直播画面，并上传到服务器进行推流。
           </p>
+          <p>优点：兼容性对比webRTC好。</p>
           <p>
-            优点：兼容性对比webRTC好；缺点：延迟高，且对网络要求严格，并且也需要后端和音视频相关部门的支持。
+            缺点：延迟高，且对网络要求严格，并且也需要后端和音视频相关部门的支持。
           </p>
         </div>
         <div class="hr"></div>
@@ -47,12 +51,14 @@
           <p>
             推流到腾讯云云直播，由腾讯云进行转发（RTMP、FLV、HLS、WebRTC等）。
           </p>
-          <p>优点：腾讯云云直播自带CDN；缺点：收费。</p>
+          <p>优点：腾讯云云直播自带CDN。</p>
+          <p>缺点：收费。</p>
         </div>
         <div class="item">
           <h2>腾讯云打PK</h2>
           <p>在打PK直播的基础上，将SRS替换成腾讯云云直播。</p>
-          <p>优点：腾讯云云直播自带CDN；缺点：收费。</p>
+          <p>优点：腾讯云云直播自带CDN。</p>
+          <p>缺点：收费。</p>
         </div>
       </div>
     </div>

src/views/h5/room/index.vue

@@ -297,14 +297,14 @@ import {
 } from '@/interface';
 import router, { mobileRouterName } from '@/router';
 import { useAppStore } from '@/store/app';
-import { usePiniaCacheStore } from '@/store/cache';
+import { useCacheStore } from '@/store/cache';
 import { useUserStore } from '@/store/user';
 import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
 import { IUser } from '@/types/IUser';
 import { formatTimeHour } from '@/utils';
 
 const route = useRoute();
-const cacheStore = usePiniaCacheStore();
+const cacheStore = useCacheStore();
 const appStore = useAppStore();
 const userStore = useUserStore();
 

src/views/home/index.vue

@@ -468,7 +468,7 @@ async function getLiveRoomList() {
       orderName: 'created_at',
       orderBy: 'desc',
       childOrderName: 'priority,name',
-      childOrderBy: 'desc,asc',
+      childOrderBy: 'asc,asc',
       // status: 0,
       // is_show: 0,
       // cdn: 0,

src/views/my/index.vue

@@ -9,12 +9,14 @@
         :border="!userStore.userInfo?.avatar?.length"
       ></Avatar>
     </div>
-    <div class="username">用户昵称：{{ userStore.userInfo?.username }}</div>
-    <div class="username">
+    <div>用户昵称：{{ userStore.userInfo?.username }}</div>
+    <div>
       用户角色：{{
         userStore.userInfo?.roles?.map((item) => item.role_name).join(',')
       }}
     </div>
+    <div>注册时间：{{ userStore.userInfo?.created_at }}</div>
+
     <br />
     <div class="pull-url">
       <span
@@ -46,6 +48,9 @@
             userStore.userInfo?.live_rooms?.[0]?.areas?.[0]?.name || '暂无分区'
           }}
         </div>
+        <div>
+          开通时间：{{ userStore.userInfo?.live_rooms?.[0]?.created_at }}
+        </div>
 
         <div
           v-if="

src/views/doc/privatizationDeployment/index.vue → src/views/privatizationDeployment/index.vue

@@ -66,19 +66,20 @@
   <n-modal v-model:show="showContach">
     <n-card
       style="width: 400px"
-      title="联系方式"
+      title="联系作者"
       role="dialog"
       closable
       @close="showContach = false"
     >
       <div>
-        <div>微信：</div>
+        <div>微信二维码：</div>
         <img
           src="@/assets/img/my-wechat.webp"
           alt=""
           style="width: 300px"
         />
-        <div>qq：2274751790</div>
+        <p>微信号：{{ AUTHOR_INFO.wechat }}</p>
+        <p>qq号：{{ AUTHOR_INFO.qq }}</p>
         <p>添加时请备注：私有化部署+用途</p>
       </div>
     </n-card>
@@ -90,7 +91,7 @@ import { openToTarget } from 'billd-utils';
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
-import { COMMON_URL } from '@/constant';
+import { AUTHOR_INFO, COMMON_URL } from '@/constant';
 import { routerName } from '@/router';
 
 const router = useRouter();
@@ -393,7 +394,6 @@ const detail = ref({
 });
 
 function handleClick(item) {
-  console.log(item);
   if (item.type === 'link') {
     openToTarget(item.link);
   } else if (item.type === 'push') {
@@ -555,6 +555,7 @@ function handleClick(item) {
         text-align: center;
         font-size: 16px;
         cursor: pointer;
+        transition: all 00.3s ease;
         &:hover {
           background-color: $theme-color-gold;
           color: white;

src/views/push/index.vue

@@ -510,7 +510,7 @@ import {
   WsMessageMsgIsVerifyEnum,
 } from '@/interface';
 import { AppRootState, useAppStore } from '@/store/app';
-import { usePiniaCacheStore } from '@/store/cache';
+import { useCacheStore } from '@/store/cache';
 import { useNetworkStore } from '@/store/network';
 import { useUserStore } from '@/store/user';
 import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
@@ -538,7 +538,7 @@ const route = useRoute();
 const userStore = useUserStore();
 const appStore = useAppStore();
 const networkStore = useNetworkStore();
-const cacheStore = usePiniaCacheStore();
+const cacheStore = useCacheStore();
 const {
   maxBitrate,
   maxFramerate,

src/views/user/index.vue

@@ -12,13 +12,11 @@
         :border="!userInfo?.avatar?.length"
       ></Avatar>
     </div>
-    <div class="username">用户昵称：{{ userInfo?.username }}</div>
-    <div
-      class="username"
-      v-if="userStore.userInfo"
-    >
+    <div>用户昵称：{{ userInfo?.username }}</div>
+    <div>
       用户角色：{{ userInfo?.roles?.map((item) => item.role_name).join(',') }}
     </div>
+    <div>注册时间：{{ userInfo?.created_at }}</div>
     <br />
     <div class="pull-url">
       <span
@@ -54,6 +52,7 @@
             userInfo.live_rooms[0]?.areas?.[0]?.name || '暂无分区'
           }}
         </div>
+        <div>开通时间：{{ userInfo?.live_rooms?.[0]?.created_at }}</div>
       </div>
     </div>
   </div>