fix: 优化

package.json

@@ -53,7 +53,7 @@
     "md-editor-v3": "^4.21.3",
     "mp4box": "^0.5.2",
     "mpegts.js": "^1.7.3",
-    "naive-ui": "^2.34.4",
+    "naive-ui": "^2.40.2",
     "pinia": "^2.0.33",
     "pinia-plugin-persistedstate": "^3.2.0",
     "qiniu-js": "^3.4.2",

pnpm-lock.yaml

@@ -57,8 +57,8 @@ importers:
         specifier: ^1.7.3
         version: 1.7.3
       naive-ui:
-        specifier: ^2.34.4
-        version: 2.34.4(vue@3.3.4)
+        specifier: ^2.40.2
+        version: 2.40.2(vue@3.3.4)
       pinia:
         specifier: ^2.0.33
         version: 2.0.33(typescript@5.1.6)(vue@3.3.4)
@@ -1053,13 +1053,13 @@ packages:
     resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==}
     engines: {node: '>=12'}
 
-  '@css-render/plugin-bem@0.15.12':
-    resolution: {integrity: sha512-Lq2jSOZn+wYQtsyaFj6QRz2EzAnd3iW5fZeHO1WSXQdVYwvwGX0ZiH3X2JQgtgYLT1yeGtrwrqJdNdMEUD2xTw==}
+  '@css-render/plugin-bem@0.15.14':
+    resolution: {integrity: sha512-QK513CJ7yEQxm/P3EwsI+d+ha8kSOcjGvD6SevM41neEMxdULE+18iuQK6tEChAWMOQNQPLG/Rw3Khb69r5neg==}
     peerDependencies:
-      css-render: ~0.15.12
+      css-render: ~0.15.14
 
-  '@css-render/vue3-ssr@0.15.12':
-    resolution: {integrity: sha512-AQLGhhaE0F+rwybRCkKUdzBdTEM/5PZBYy+fSYe1T9z9+yxMuV/k7ZRqa4M69X+EI1W8pa4kc9Iq2VjQkZx4rg==}
+  '@css-render/vue3-ssr@0.15.14':
+    resolution: {integrity: sha512-//8027GSbxE9n3QlD73xFY6z4ZbHbvrOVB7AO6hsmrEzGbg+h2A09HboUyDgu+xsmj7JnvJD39Irt+2D0+iV8g==}
     peerDependencies:
       vue: ^3.0.11
 
@@ -1876,17 +1876,17 @@ packages:
   '@types/json5@0.0.29':
     resolution: {integrity: sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==}
 
-  '@types/katex@0.14.0':
-    resolution: {integrity: sha512-+2FW2CcT0K3P+JMR8YG846bmDwplKUTsWgT2ENwdQ1UdVfRk3GQrh6Mi4sTopy30gI8Uau5CEqHTDZ6YvWIUPA==}
+  '@types/katex@0.16.7':
+    resolution: {integrity: sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==}
 
   '@types/linkify-it@5.0.0':
     resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
 
-  '@types/lodash-es@4.17.7':
-    resolution: {integrity: sha512-z0ptr6UI10VlU6l5MYhGwS4mC8DZyYer2mCoyysZtSF7p26zOX8UpbrV0YpNYLGS8K4PUFIyEr62IMFFjveSiQ==}
+  '@types/lodash-es@4.17.12':
+    resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}
 
-  '@types/lodash@4.14.194':
-    resolution: {integrity: sha512-r22s9tAS7imvBt2lyHC9B8AGwWnXaYb1tY09oyLkXDs4vArpYJzw09nj8MLx5VfciBPGIb+ZwG0ssYnEPJxn/g==}
+  '@types/lodash@4.17.13':
+    resolution: {integrity: sha512-lfx+dftrEZcdBPczf9d0Qv0x+j/rfNCMuC6OcfXmO8gkfeNAY88PgKUbvG56whcN23gc27yenwF6oJZXGFpYxg==}
 
   '@types/markdown-it@14.1.2':
     resolution: {integrity: sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==}
@@ -3034,8 +3034,8 @@ packages:
     peerDependencies:
       postcss: ^8.4
 
-  css-render@0.15.12:
-    resolution: {integrity: sha512-eWzS66patiGkTTik+ipO9qNGZ+uNuGyTmnz6/+EJIiFg8+3yZRpnMwgFo8YdXhQRsiePzehnusrxVvugNjXzbw==}
+  css-render@0.15.14:
+    resolution: {integrity: sha512-9nF4PdUle+5ta4W5SyZdLCCmFd37uVimSjg1evcTqKJCyvCEEj12WKzOSBNak6r4im4J4iYXKH1OWpUV5LBYFg==}
 
   css-select@4.3.0:
     resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==}
@@ -3097,6 +3097,9 @@ packages:
   csstype@3.1.2:
     resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==}
 
+  csstype@3.1.3:
+    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
+
   cz-conventional-changelog@3.3.0:
     resolution: {integrity: sha512-U466fIzU5U22eES5lTNiNbZ+d8dfcHcssH4o7QsdWaCcRs/feIPCxKYSWkYBNs5mny7MvEfwpTLWjvbm94hecw==}
     engines: {node: '>= 10'}
@@ -3117,14 +3120,13 @@ packages:
     resolution: {integrity: sha512-Jy/tj3ldjZJo63sVAvg6LHt2mHvl4V6AgRAmNDtLdm7faqtsx+aJG42rsyCo9JCoRVKwPFzKlIPx3DIibwSIaQ==}
     engines: {node: '>=12'}
 
-  date-fns-tz@1.3.8:
-    resolution: {integrity: sha512-qwNXUFtMHTTU6CFSFjoJ80W8Fzzp24LntbjFFBgL/faqds4e5mo9mftoRLgr3Vi1trISsg4awSpYVsOQCRnapQ==}
+  date-fns-tz@3.2.0:
+    resolution: {integrity: sha512-sg8HqoTEulcbbbVXeg84u5UnlsQa8GS5QXMqjjYIhS4abEVVKIUwe0/l/UhrZdKaL/W5eWZNlbTeEIiOXTcsBQ==}
     peerDependencies:
-      date-fns: '>=2.0.0'
+      date-fns: ^3.0.0 || ^4.0.0
 
-  date-fns@2.30.0:
-    resolution: {integrity: sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==}
-    engines: {node: '>=0.11'}
+  date-fns@3.6.0:
+    resolution: {integrity: sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==}
 
   date-format@4.0.14:
     resolution: {integrity: sha512-39BOQLs9ZjKh0/patS9nrT8wc3ioX3/eA/zgbKNopnF2wCqJEoxywwwElATYvRsXdnOxA/OQeQoFZ3rFjVajhg==}
@@ -5065,8 +5067,8 @@ packages:
   mz@2.7.0:
     resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
 
-  naive-ui@2.34.4:
-    resolution: {integrity: sha512-aPG8PDfhSzIzn/jSC9y3Jb3Pe2wHJ7F0cFV1EWlbImSrZECeUmoc+fIcOSWbizoztkKfaUAeKwYdMl09MKkj1g==}
+  naive-ui@2.40.2:
+    resolution: {integrity: sha512-iOpk9/SdAxOPnbFDiN9c0N6vzRJiyC+xgs8rqeaulLvxg0ix39xA3noordy9wyq0YUbqS3ID6jPdld/kW4KSEg==}
     peerDependencies:
       vue: ^3.0.0
 
@@ -6222,8 +6224,8 @@ packages:
   sdp@3.2.0:
     resolution: {integrity: sha512-d7wDPgDV3DDiqulJjKiV2865wKsJ34YI+NDREbm+FySq6WuKOikwyNQcm+doLAZ1O6ltdO0SeKle2xMpN3Brgw==}
 
-  seemly@0.3.6:
-    resolution: {integrity: sha512-lEV5VB8BUKTo/AfktXJcy+JeXns26ylbMkIUco8CYREsQijuz4mrXres2Q+vMLdwkuLxJdIPQ8IlCIxLYm71Yw==}
+  seemly@0.3.9:
+    resolution: {integrity: sha512-bMLcaEqhIViiPbaumjLN8t1y+JpD/N8SiyYOyp0i0W6RgdyLWboIsUWAbZojF//JyerxPZR5Tgda+x3Pdne75A==}
 
   select-hose@2.0.0:
     resolution: {integrity: sha512-mEugaLK+YfkijB4fx0e6kImuJdCIt2LxCRcbEYPqRGCs4F2ogyfZU5IAZRdjCP8JPq2AtdNoC/Dux63d9Kiryg==}
@@ -7031,8 +7033,8 @@ packages:
   vue@3.3.4:
     resolution: {integrity: sha512-VTyEYn3yvIeY1Py0WaYGZsXnz3y5UnGi62GjVEqvEGPl6nxbOrCXbVOTQWBEJUqAyTUk2uJ5JLVnYJ6ZzGbrSw==}
 
-  vueuc@0.4.51:
-    resolution: {integrity: sha512-pLiMChM4f+W8czlIClGvGBYo656lc2Y0/mXFSCydcSmnCR1izlKPGMgiYBGjbY9FDkFG8a2HEVz7t0DNzBWbDw==}
+  vueuc@0.4.64:
+    resolution: {integrity: sha512-wlJQj7fIwKK2pOEoOq4Aro8JdPOGpX8aWQhV8YkTW9OgWD2uj2O8ANzvSsIGjx7LTOc7QbS7sXdxHi6XvRnHPA==}
     peerDependencies:
       vue: ^3.0.11
 
@@ -8505,11 +8507,11 @@ snapshots:
     dependencies:
       '@jridgewell/trace-mapping': 0.3.9
 
-  '@css-render/plugin-bem@0.15.12(css-render@0.15.12)':
+  '@css-render/plugin-bem@0.15.14(css-render@0.15.14)':
     dependencies:
-      css-render: 0.15.12
+      css-render: 0.15.14
 
-  '@css-render/vue3-ssr@0.15.12(vue@3.3.4)':
+  '@css-render/vue3-ssr@0.15.14(vue@3.3.4)':
     dependencies:
       vue: 3.3.4
 
@@ -9189,15 +9191,15 @@ snapshots:
 
   '@types/json5@0.0.29': {}
 
-  '@types/katex@0.14.0': {}
+  '@types/katex@0.16.7': {}
 
   '@types/linkify-it@5.0.0': {}
 
-  '@types/lodash-es@4.17.7':
+  '@types/lodash-es@4.17.12':
     dependencies:
-      '@types/lodash': 4.14.194
+      '@types/lodash': 4.17.13
 
-  '@types/lodash@4.14.194': {}
+  '@types/lodash@4.17.13': {}
 
   '@types/markdown-it@14.1.2':
     dependencies:
@@ -10637,7 +10639,7 @@ snapshots:
     dependencies:
       postcss: 8.4.21
 
-  css-render@0.15.12:
+  css-render@0.15.14:
     dependencies:
       '@emotion/hash': 0.8.0
       csstype: 3.0.11
@@ -10726,6 +10728,8 @@ snapshots:
 
   csstype@3.1.2: {}
 
+  csstype@3.1.3: {}
+
   cz-conventional-changelog@3.3.0(@swc/core@1.3.84):
     dependencies:
       chalk: 2.4.2
@@ -10762,13 +10766,11 @@ snapshots:
       whatwg-url: 11.0.0
     optional: true
 
-  date-fns-tz@1.3.8(date-fns@2.30.0):
+  date-fns-tz@3.2.0(date-fns@3.6.0):
     dependencies:
-      date-fns: 2.30.0
+      date-fns: 3.6.0
 
-  date-fns@2.30.0:
-    dependencies:
-      '@babel/runtime': 7.22.6
+  date-fns@3.6.0: {}
 
   date-format@4.0.14: {}
 
@@ -12903,27 +12905,28 @@ snapshots:
       object-assign: 4.1.1
       thenify-all: 1.6.0
 
-  naive-ui@2.34.4(vue@3.3.4):
+  naive-ui@2.40.2(vue@3.3.4):
     dependencies:
-      '@css-render/plugin-bem': 0.15.12(css-render@0.15.12)
-      '@css-render/vue3-ssr': 0.15.12(vue@3.3.4)
-      '@types/katex': 0.14.0
-      '@types/lodash': 4.14.194
-      '@types/lodash-es': 4.17.7
+      '@css-render/plugin-bem': 0.15.14(css-render@0.15.14)
+      '@css-render/vue3-ssr': 0.15.14(vue@3.3.4)
+      '@types/katex': 0.16.7
+      '@types/lodash': 4.17.13
+      '@types/lodash-es': 4.17.12
       async-validator: 4.2.5
-      css-render: 0.15.12
-      date-fns: 2.30.0
-      date-fns-tz: 1.3.8(date-fns@2.30.0)
+      css-render: 0.15.14
+      csstype: 3.1.3
+      date-fns: 3.6.0
+      date-fns-tz: 3.2.0(date-fns@3.6.0)
       evtd: 0.2.4
       highlight.js: 11.8.0
       lodash: 4.17.21
       lodash-es: 4.17.21
-      seemly: 0.3.6
+      seemly: 0.3.9
       treemate: 0.3.11
       vdirs: 0.1.8(vue@3.3.4)
       vooks: 0.2.12(vue@3.3.4)
       vue: 3.3.4
-      vueuc: 0.4.51(vue@3.3.4)
+      vueuc: 0.4.64(vue@3.3.4)
 
   nan@2.17.0:
     optional: true
@@ -14107,7 +14110,7 @@ snapshots:
 
   sdp@3.2.0: {}
 
-  seemly@0.3.6: {}
+  seemly@0.3.9: {}
 
   select-hose@2.0.0: {}
 
@@ -15012,13 +15015,13 @@ snapshots:
       '@vue/server-renderer': 3.3.4(vue@3.3.4)
       '@vue/shared': 3.3.4
 
-  vueuc@0.4.51(vue@3.3.4):
+  vueuc@0.4.64(vue@3.3.4):
     dependencies:
-      '@css-render/vue3-ssr': 0.15.12(vue@3.3.4)
+      '@css-render/vue3-ssr': 0.15.14(vue@3.3.4)
       '@juggle/resize-observer': 3.4.0
-      css-render: 0.15.12
+      css-render: 0.15.14
       evtd: 0.2.4
-      seemly: 0.3.6
+      seemly: 0.3.9
       vdirs: 0.1.8(vue@3.3.4)
       vooks: 0.2.12(vue@3.3.4)
       vue: 3.3.4

src/App.vue

@@ -1,12 +1,14 @@
 <template>
   <n-config-provider :theme-overrides="themeOverrides">
-    <n-dialog-provider>
-      <router-view></router-view>
-      <HomeModal
-        :show="showModal"
-        :content="modalContent"
-      ></HomeModal>
-    </n-dialog-provider>
+    <n-message-provider :max="3">
+      <n-modal-provider>
+        <n-dialog-provider>
+          <router-view></router-view>
+          <NaiveModal />
+          <NaiveMessage />
+        </n-dialog-provider>
+      </n-modal-provider>
+    </n-message-provider>
   </n-config-provider>
 </template>
 
@@ -19,32 +21,27 @@ export default {
 <script lang="ts" setup>
 import { isMobile } from 'billd-utils';
 import { GlobalThemeOverrides, NConfigProvider } from 'naive-ui';
-import { onMounted, ref, watch } from 'vue';
-import { useRoute } from 'vue-router';
+import { onMounted } from 'vue';
 
+import { fetchAreaList } from '@/api/area';
+import { fetchGlobalMsgMyList } from '@/api/globalMsg';
+import NaiveMessage from '@/components/NaiveMessage/index.vue';
+import NaiveModal from '@/components/NaiveModal/index.vue';
 import { THEME_COLOR, appBuildInfo } from '@/constant';
 import { useCheckUpdate } from '@/hooks/use-common';
 import { useGoogleAd } from '@/hooks/use-google-ad';
 import { loginMessage } from '@/hooks/use-login';
+import { useAppStore } from '@/store/app';
 import { useCacheStore } from '@/store/cache';
 import { useUserStore } from '@/store/user';
 import { getHostnameUrl } from '@/utils';
 import { getLastBuildDate, setLastBuildDate } from '@/utils/localStorage/app';
 import { getToken } from '@/utils/localStorage/user';
 
-import { fetchAreaList } from './api/area';
-import { fetchGlobalMsgMyList } from './api/globalMsg';
-import { useTip } from './hooks/use-tip';
-import { useAppStore } from './store/app';
-
 const { checkUpdate } = useCheckUpdate();
 const appStore = useAppStore();
 const cacheStore = useCacheStore();
 const userStore = useUserStore();
-const route = useRoute();
-
-const showModal = ref(false);
-const modalContent = ref('2');
 
 const themeOverrides: GlobalThemeOverrides = {
   common: {
@@ -53,19 +50,8 @@ const themeOverrides: GlobalThemeOverrides = {
   },
 };
 
-watch(
-  () => userStore.userInfo,
-  (newval) => {
-    if (newval) {
-      handleGlobalMsgMyList();
-    }
-  },
-  {
-    immediate: true,
-  }
-);
-
 onMounted(() => {
+  handleGlobalMsgMyList();
   useGoogleAd();
   initGlobalData();
   checkUpdate({
@@ -97,16 +83,18 @@ onMounted(() => {
 });
 
 async function handleGlobalMsgMyList() {
-  const res = await fetchGlobalMsgMyList({});
+  const res = await fetchGlobalMsgMyList({
+    orderName: 'priority',
+    orderBy: 'desc',
+  });
   if (res.code === 200) {
-    const data = res.data.rows[0];
-    if (data) {
-      useTip({
-        content: data.content!,
-        hiddenCancel: true,
-        hiddenClose: true,
+    res.data.rows.forEach((item) => {
+      window.$modal.create({
+        title: '提示',
+        preset: 'dialog',
+        content: item.content || '',
       });
-    }
+    });
   }
 }
 

src/api/globalMsg.ts

@@ -1,17 +1,8 @@
-import { IGlobalMsg, IPaging } from '@/interface';
+import { IGlobalMsg, IList, IPaging } from '@/interface';
 import request from '@/utils/request';
 
-export function fetchGlobalMsgList(params) {
-  return request.get('/global_msg/list', {
-    params,
-  });
-}
-
-export function fetchGlobalMsgMyList(params) {
+export function fetchGlobalMsgMyList(params: IList<IGlobalMsg>) {
   return request.get<IPaging<IGlobalMsg>>('/global_msg/my_list', {
     params,
   });
 }
-export function fetchGlobalMsgCreate(data) {
-  return request.post('/global_msg/create', data);
-}

src/api/liveRoom.ts

@@ -1,4 +1,4 @@
-import { IList, IPaging } from '@/interface';
+import { IList, IPaging, IPushRes } from '@/interface';
 import { ILiveRoom } from '@/types/ILiveRoom';
 import request from '@/utils/request';
 
@@ -19,10 +19,7 @@ export function fetchVerifyPkKey(data: { liveRoomId: number; key }) {
 }
 
 export function fetchUpdateLiveRoomKey() {
-  return request.instance({
-    url: '/live_room/update_key',
-    method: 'put',
-  });
+  return request.put<IPushRes>('/live_room/update_key');
 }
 
 export function fetchUpdateMyLiveRoom(data: ILiveRoom) {

src/components/FullLoading/index.ts

@@ -1,6 +1,6 @@
 import { ComponentPublicInstance, StyleValue, createApp } from 'vue';
 
-import main from './main.vue';
+import main from '@/components/FullLoading/main.vue';
 
 const initInstance = (option: IOption) => {
   // 这里就是与vue2最大的区别了,在vue2的时候,我们只需instance.$mount()便能得到节点,现在不行

src/components/HomeModal/index.vue

@@ -1,51 +0,0 @@
-<template>
-  <n-modal
-    v-model:show="showModal"
-    title="公告"
-    preset="dialog"
-    positive-text="OK"
-  >
-    <p>{{ content }}</p>
-  </n-modal>
-</template>
-
-<script lang="ts" setup>
-import { onMounted, ref, watch } from 'vue';
-
-const props = withDefaults(
-  defineProps<{
-    show?: boolean;
-    content: string;
-  }>(),
-  {
-    show: () => {
-      return false;
-    },
-    content: '',
-  }
-);
-const showModal = ref(false);
-
-watch(
-  () => props.show,
-  () => {
-    showModal.value = props.show;
-  }
-);
-
-onMounted(() => {
-  showModal.value = props.show;
-});
-</script>
-
-<style lang="scss" scoped>
-.link {
-  color: $theme-color-gold;
-  text-decoration: none;
-  font-weight: 500;
-  cursor: pointer;
-}
-.hot {
-  color: red;
-}
-</style>

src/components/LoginModal/index.vue

@@ -142,7 +142,7 @@
           >
             <img
               class="logo"
-              src="@/assets/img/qq_logo.webp"
+              src="@/assets/img/qq_logo.png"
             />
           </div>
           <div
@@ -151,7 +151,7 @@
           >
             <img
               class="logo"
-              src="@/assets/img/github_logo.webp"
+              src="@/assets/img/github_logo.png"
             />
           </div>
         </div>

src/components/Message/content/index.vue

@@ -1,18 +0,0 @@
-<template>
-  <div></div>
-</template>
-
-<script lang="ts">
-import { useMessage } from 'naive-ui';
-import { defineComponent } from 'vue';
-
-export default defineComponent({
-  components: {},
-  setup() {
-    // @ts-ignore
-    window.$message = useMessage();
-  },
-});
-</script>
-
-<style lang="scss" scoped></style>

src/components/Message/index.vue

@@ -1,19 +0,0 @@
-<template>
-  <NMessageProvider :max="3">
-    <ContentCpt></ContentCpt>
-  </NMessageProvider>
-</template>
-
-<script lang="ts">
-export default {
-  name: 'naiveuiMessage',
-};
-</script>
-
-<script lang="ts" setup>
-import { NMessageProvider } from 'naive-ui';
-
-import ContentCpt from './content/index.vue';
-</script>
-
-<style lang="scss" scoped></style>

src/components/NaiveMessage/index.vue

@@ -0,0 +1,17 @@
+<template>
+  <div></div>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'naiveuiMessage',
+};
+</script>
+
+<script lang="ts" setup>
+import { useMessage } from 'naive-ui';
+
+window.$message = useMessage();
+</script>
+
+<style lang="scss" scoped></style>

src/components/NaiveModal/index.vue

@@ -0,0 +1,17 @@
+<template>
+  <div></div>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'naiveuiModal',
+};
+</script>
+
+<script lang="ts" setup>
+import { useModal } from 'naive-ui';
+
+window.$modal = useModal();
+</script>
+
+<style lang="scss" scoped></style>

src/components/VideoControls/index.vue

@@ -84,7 +84,7 @@
               <div
                 class="iten"
                 :class="{ active: appStore.liveLine === item }"
-                v-for="item in LiveLineEnum"
+                v-for="item in lineList"
                 :key="item"
                 @click="changeLiveLine(item)"
               >
@@ -196,20 +196,24 @@ import {
   VolumeMuteOutline,
 } from '@vicons/ionicons5';
 import { debounce, isSafari } from 'billd-utils';
-import { onMounted, onUnmounted } from 'vue';
+import { onMounted, onUnmounted, ref } from 'vue';
 
 import { handleTip } from '@/hooks/use-common';
 import { LiveLineEnum, LiveRenderEnum } from '@/interface';
 import { AppRootState, useAppStore } from '@/store/app';
 import { useCacheStore } from '@/store/cache';
-import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
+import { ILiveRoom, LiveRoomTypeEnum } from '@/types/ILiveRoom';
 
 const props = withDefaults(
   defineProps<{
+    liveLineList?: string[];
+    liveRoom: ILiveRoom;
     resolution?: string;
     control?: AppRootState['videoControls'];
   }>(),
-  {}
+  {
+    liveRoom: undefined,
+  }
 );
 
 const emits = defineEmits([
@@ -222,12 +226,21 @@ const emits = defineEmits([
 const cacheStore = useCacheStore();
 const appStore = useAppStore();
 
+const lineList = ref<any[]>([]);
+
 const debounceRefresh = debounce(() => {
   emits('refresh');
 }, 500);
 
 onMounted(() => {
   window.addEventListener('keydown', handleKeydown);
+  if (props.liveLineList) {
+    lineList.value = props.liveLineList;
+  } else {
+    Object.keys(LiveLineEnum).forEach((v) => {
+      lineList.value.push(v);
+    });
+  }
 });
 
 onUnmounted(() => {
@@ -265,8 +278,7 @@ function handlePageFull() {
 }
 
 function changeLiveLine(item: LiveLineEnum) {
-  const type = appStore.liveRoomInfo?.type;
-  if (type === undefined) return;
+  const type = props.liveRoom.type!;
   if (item === LiveLineEnum['rtmp-rtc']) {
     if (
       [

src/directives/index.ts

@@ -1,6 +1,6 @@
 import { App } from 'vue';
 
-import { directiveLoading } from './loading';
+import { directiveLoading } from '@/directives/loading';
 
 export default function registerDirectives(app: App) {
   app.directive('loading', directiveLoading);

src/hooks/loginModal/index.vue

@@ -1,61 +0,0 @@
-<template>
-  <div
-    v-if="show"
-    class="useTip-wrap"
-  >
-    <Modal
-      :title="title"
-      :mask-closable="maskClosable"
-      @close="show = !show"
-    >
-      <div class="container">
-        <img
-          class="qq-logo"
-          src="@/assets/img/qq-logo.webp"
-          alt=""
-          @click="handleQQlogin"
-        />
-        <div>qq登录</div>
-      </div>
-
-      <template #footer></template>
-    </Modal>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent, ref } from 'vue';
-
-import { useQQLogin } from '@/hooks/use-login';
-
-export default defineComponent({
-  name: 'loginModal',
-  setup() {
-    const title = ref('登录');
-    const show = ref(false);
-    const maskClosable = ref(true);
-    function handleQQlogin() {
-      show.value = !show.value;
-      useQQLogin({ exp: 24 });
-    }
-    return {
-      title,
-      show,
-      maskClosable,
-      handleQQlogin,
-    };
-  },
-});
-</script>
-
-<style lang="scss" scoped>
-.useTip-wrap {
-  .container {
-    text-align: center;
-    .qq-logo {
-      cursor: pointer;
-      width: 60px;
-    }
-  }
-}
-</style>

src/hooks/use-common.ts

@@ -1,9 +1,8 @@
 import { windowReload } from 'billd-utils';
 
+import { useTip } from '@/hooks/use-tip';
 import { getLastBuildDate } from '@/utils/localStorage/app';
 
-import { useTip } from './use-tip';
-
 export function handleTip() {
   window.$message.info('敬请期待！');
 }

src/hooks/use-login.ts

@@ -1,5 +1,4 @@
 import { hrefToTarget, isMobile } from 'billd-utils';
-import { createApp } from 'vue';
 
 import { fetchQQLogin } from '@/api/qqUser';
 import { fullLoading } from '@/components/FullLoading';
@@ -10,7 +9,6 @@ import {
   QQ_REDIRECT_URI,
   WECHAT_REDIRECT_URI,
 } from '@/constant';
-import LoginModalCpt from '@/hooks/loginModal/index.vue';
 import { PlatformEnum } from '@/interface';
 import { WECHAT_GZH_APPID, WECHAT_GZH_OAUTH_URL } from '@/spec-config';
 import { useAppStore } from '@/store/app';
@@ -18,14 +16,6 @@ import { useUserStore } from '@/store/user';
 import { clearThirdLoginInfo, setThirdLoginInfo } from '@/utils/cookie';
 import { getToken } from '@/utils/localStorage/user';
 
-const app = createApp(LoginModalCpt);
-const container = document.createElement('div');
-// @ts-ignore
-const instance: ComponentPublicInstance<InstanceType<typeof LoginModalCpt>> =
-  app.mount(container);
-
-document.body.appendChild(container);
-
 const POSTMESSAGE_TYPE = [PlatformEnum.qqLogin];
 
 export async function handleQQLogin(e) {
@@ -60,13 +50,11 @@ export async function handleQQLogin(e) {
   return flag;
 }
 
-export function loginTip(show = false) {
+export function loginTip() {
   const token = getToken();
-  instance.show = show;
   const appStore = useAppStore();
   if (!token) {
     window.$message.warning('请先登录！');
-    // instance.show = true;
     appStore.showLoginModal = true;
     return false;
   }

src/hooks/use-pull.ts

@@ -4,12 +4,16 @@ import { useRoute } from 'vue-router';
 
 import { URL_QUERY } from '@/constant';
 import { useFlvPlay, useHlsPlay } from '@/hooks/use-play';
+import { useTip } from '@/hooks/use-tip';
 import { useWebsocket } from '@/hooks/use-websocket';
+import { useWebRtcLive } from '@/hooks/webrtc/live';
+import { useWebRtcMeetingOne } from '@/hooks/webrtc/meetingOne';
 import { useWebRtcRtmpToRtc } from '@/hooks/webrtc/rtmpToRtc';
 import {
   DanmuMsgTypeEnum,
   LiveLineEnum,
   LiveRenderEnum,
+  SwitchEnum,
   WsMessageIsFileEnum,
 } from '@/interface';
 import { useAppStore } from '@/store/app';
@@ -28,10 +32,6 @@ import {
   videoToCanvas,
 } from '@/utils';
 
-import { useTip } from './use-tip';
-import { useWebRtcLive } from './webrtc/live';
-import { useWebRtcMeetingOne } from './webrtc/meetingOne';
-
 export function usePull() {
   const route = useRoute();
   const networkStore = useNetworkStore();
@@ -56,7 +56,6 @@ export function usePull() {
     mySocketId,
     initWs,
     roomLiving,
-    anchorInfo,
     liveUserList,
     damuList,
     sendDanmuTxt,
@@ -400,18 +399,10 @@ export function usePull() {
 
   function handlePlay(data: ILiveRoom) {
     roomLiving.value = true;
-    flvurl.value = [
-      LiveRoomTypeEnum.tencent_css,
-      LiveRoomTypeEnum.tencent_css_pk,
-    ].includes(data.type!)
-      ? data.cdn_flv_url!
-      : data.flv_url!;
-    hlsurl.value = [
-      LiveRoomTypeEnum.tencent_css,
-      LiveRoomTypeEnum.tencent_css_pk,
-    ].includes(data.type!)
-      ? data.cdn_hls_url!
-      : data.hls_url!;
+    flvurl.value =
+      data.cdn === SwitchEnum.yes ? data.pull_cdn_flv_url! : data.pull_flv_url!;
+    hlsurl.value =
+      data.cdn === SwitchEnum.yes ? data.pull_cdn_hls_url! : data.pull_hls_url!;
     function play() {
       if (appStore.liveLine === LiveLineEnum.flv) {
         handleFlvPlay();
@@ -580,6 +571,5 @@ export function usePull() {
     liveUserList,
     danmuStr,
     liveRoomInfo,
-    anchorInfo,
   };
 }

src/hooks/use-upload.ts

@@ -129,7 +129,7 @@ export async function useUploadServer({
       let flag = false;
       timer.value = setInterval(async () => {
         try {
-          const { code, data, message } = await fetchUploadProgress({
+          const { code, data, msg } = await fetchUploadProgress({
             hash,
             prefix,
             ext,
@@ -145,7 +145,7 @@ export async function useUploadServer({
             }
           } else {
             clearInterval(timer.value);
-            console.error(code, data, message);
+            console.error(code, data, msg);
           }
         } catch (error) {
           console.error(error);

src/hooks/use-websocket.ts

@@ -29,7 +29,6 @@ import { useAppStore } from '@/store/app';
 import { useNetworkStore } from '@/store/network';
 import { useUserStore } from '@/store/user';
 import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
-import { IUser } from '@/types/IUser';
 import {
   WsAnswerType,
   WsBatchSendOffer,
@@ -89,7 +88,6 @@ export const useWebsocket = () => {
   const roomLiving = ref(false);
   const isAnchor = ref(false);
   const isBilibili = ref(false);
-  const anchorInfo = ref<IUser>();
   const canvasVideoStream = ref<MediaStream>();
   const userStream = ref<MediaStream>();
   const lastCoverImg = ref('');
@@ -976,7 +974,6 @@ export const useWebsocket = () => {
     canvasVideoStream,
     lastCoverImg,
     roomLiving,
-    anchorInfo,
     liveUserList,
     damuList,
     currentMaxFramerate,

src/hooks/webrtc/forwardAll.ts

@@ -87,7 +87,7 @@ export const useForwardAll = () => {
           }
           const answerRes = await fetchRtcV1Publish({
             sdp: offerSdp.sdp!,
-            streamurl: `${myLiveRoom.rtmp_url!}?${
+            streamurl: `${myLiveRoom.pull_rtmp_url!}?${
               SRS_CB_URL_QUERY.publishKey
             }=${myLiveRoom.key!}&${SRS_CB_URL_QUERY.publishType}=${
               isPk.value ? LiveRoomTypeEnum.pk : LiveRoomTypeEnum.forward_all

src/hooks/webrtc/forwardBilibili.ts

@@ -91,7 +91,7 @@ export const useForwardBilibili = () => {
           }
           const answerRes = await fetchRtcV1Publish({
             sdp: offerSdp.sdp!,
-            streamurl: `${myLiveRoom.rtmp_url!}?${
+            streamurl: `${myLiveRoom.pull_rtmp_url!}?${
               SRS_CB_URL_QUERY.publishKey
             }=${myLiveRoom.key!}&${SRS_CB_URL_QUERY.publishType}=${
               isPk.value

src/hooks/webrtc/forwardHuya.ts

@@ -87,7 +87,7 @@ export const useForwardHuya = () => {
           }
           const answerRes = await fetchRtcV1Publish({
             sdp: offerSdp.sdp!,
-            streamurl: `${myLiveRoom.rtmp_url!}?${
+            streamurl: `${myLiveRoom.pull_rtmp_url!}?${
               SRS_CB_URL_QUERY.publishKey
             }=${myLiveRoom.key!}&${SRS_CB_URL_QUERY.publishType}=${
               isPk.value ? LiveRoomTypeEnum.pk : LiveRoomTypeEnum.forward_huya

src/hooks/webrtc/rtmpToRtc.ts

@@ -108,7 +108,7 @@ export const useWebRtcRtmpToRtc = () => {
           );
           // const answerRes = await fetchRtcV1Play({
           //   sdp: offerSdp.sdp!,
-          //   streamurl: `${myLiveRoom.rtmp_url!}`,
+          //   streamurl: `${myLiveRoom.pull_rtmp_url!}`,
           // });
           // if (answerRes.data.code !== 0) {
           //   console.error('/rtc/v1/play/拿不到sdp');

src/hooks/webrtc/srs.ts

@@ -92,7 +92,7 @@ export const useWebRtcSrs = () => {
           }
           const answerRes = await fetchRtcV1Publish({
             sdp: offerSdp.sdp!,
-            streamurl: `${myLiveRoom.rtmp_url!}?${
+            streamurl: `${myLiveRoom.pull_rtmp_url!}?${
               SRS_CB_URL_QUERY.publishKey
             }=${myLiveRoom.key!}&${SRS_CB_URL_QUERY.publishType}=${
               isPk.value ? LiveRoomTypeEnum.pk : LiveRoomTypeEnum.srs

src/interface.ts

@@ -1,9 +1,5 @@
-import {
-  ILiveRoom,
-  LiveRoomIsShowEnum,
-  LiveRoomStatusEnum,
-} from './types/ILiveRoom';
-import { IUser } from './types/IUser';
+import { ILiveRoom, LiveRoomStatusEnum } from '@/types/ILiveRoom';
+import { IUser } from '@/types/IUser';
 
 export interface IBilibiliLiveUserRecommend {
   roomid: number;
@@ -308,13 +304,18 @@ export interface ILoginRecord {
 }
 
 export enum GlobalMsgTypeEnum {
-  system,
+  user = 'user',
+  system = 'system',
+  activity = 'activity',
 }
 
 export interface IGlobalMsg {
   id?: number;
   user_id?: number;
+  client_ip?: string;
   type?: GlobalMsgTypeEnum;
+  show?: SwitchEnum;
+  priority?: number;
   content?: string;
   remark?: string;
 
@@ -324,7 +325,6 @@ export interface IGlobalMsg {
   updated_at?: string;
   deleted_at?: string;
 }
-
 export interface ISigninStatistics {
   id?: number;
   user_id?: number;
@@ -561,17 +561,6 @@ export enum GoodsTypeEnum {
   qypShop = 'qypShop',
 }
 
-export interface ISettings {
-  id?: number;
-  key?: string;
-  value?: string;
-  desc?: string;
-  type?: string;
-  created_at?: string;
-  updated_at?: string;
-  deleted_at?: string;
-}
-
 export interface IGoods {
   id?: number;
   type?: GoodsTypeEnum;
@@ -660,7 +649,7 @@ export interface IArea {
   priority?: number;
   area_live_rooms?: IAreaLiveRoom[];
   live_rooms?: ILiveRoom[];
-  live_room_is_show?: LiveRoomIsShowEnum;
+  live_room_is_show?: SwitchEnum;
   live_room_status?: LiveRoomStatusEnum;
   created_at?: string;
   updated_at?: string;
@@ -698,21 +687,35 @@ export interface ISrsPublishStream {
 
 export type ILive = {
   id?: number;
-
-  socket_id?: string;
+  /** 直播平台 */
+  platform?: LivePlatformEnum;
+  /** 直播流名称 */
+  stream_name?: string;
+  /** 直播流id */
+  stream_id?: string;
+  /** 用户id */
+  user_id?: number;
+  /** 直播间id */
   live_room_id?: number;
-  /** 1开启;2关闭 */
-  track_video?: number;
-  /** 1开启;2关闭 */
-  track_audio?: number;
+  /** 备注 */
+  remark?: string;
+
+  /** 直播间信息 */
+  live_room?: ILiveRoom;
+  /** 用户信息 */
+  user?: IUser;
 
   created_at?: string;
   updated_at?: string;
   deleted_at?: string;
-} & ISrsPublishStream & {
-    /** 直播间信息 */
-    live_room?: ILiveRoom;
-  };
+};
+
+/** 直播平台 */
+export enum LivePlatformEnum {
+  rtc,
+  srs,
+  tencentcloud_css,
+}
 
 export enum MediaTypeEnum {
   camera,
@@ -760,3 +763,21 @@ export interface ICredential {
   requestId: string;
   startTime: number;
 }
+
+export enum SwitchEnum {
+  yes,
+  no,
+}
+
+export interface IStreamKey {
+  rtmp_url: string;
+  obs_server: string;
+  obs_stream_key: string;
+  webrtc_url: string;
+  srt_url: string;
+}
+
+export interface IPushRes {
+  srsPushRes: IStreamKey;
+  cdnPushRes: IStreamKey;
+}

src/layout/pc/head/index.vue

@@ -981,7 +981,9 @@ function handleWebsiteJump() {
       }
       .qqlogin {
         margin-right: 20px;
-
+        .btn {
+          cursor: pointer;
+        }
         .list {
           padding: 10px 0;
           width: 90px;

src/main.ts

@@ -8,7 +8,6 @@ import VueLazyLoad from 'vue-lazyload';
 
 import lazyErrorPng from '@/assets/img/lazy_error.png';
 import lazyLoadingPng from '@/assets/img/lazy_loading.png';
-import Message from '@/components/Message/index.vue';
 import registerDirectives from '@/directives';
 import { i18n } from '@/hooks/use-i18n';
 import router from '@/router';
@@ -28,9 +27,4 @@ app.use(VueLazyLoad, {
   attempt: 2,
 });
 
-const message = createApp(Message);
-const messageEle = document.createElement('div');
-const appEl = document.getElementById('app');
-appEl?.appendChild(messageEle);
-message.mount(messageEle);
 app.mount('#app');

src/types/ILiveRoom.ts

@@ -1,14 +1,6 @@
-import { IArea, ILive, IUserLiveRoom } from '@/interface';
+import { IArea, ILive, SwitchEnum } from '@/interface';
 import { IUser } from '@/types/IUser';
 
-/** 是否使用cdn */
-export enum LiveRoomUseCDNEnum {
-  /** 使用cdn */
-  yes,
-  /** 不使用cdn */
-  no,
-}
-
 /** 直播间类型 */
 export enum LiveRoomTypeEnum {
   /** 系统推流 */
@@ -55,86 +47,6 @@ export enum LiveRoomStatusEnum {
   disable,
 }
 
-/** 直播间是否显示 */
-export enum LiveRoomIsShowEnum {
-  /** 显示 */
-  yes,
-  /** 不显示 */
-  no,
-}
-
-/** 直播间是否开启聊天 */
-export enum LiveRoomOpenChatEnum {
-  yes,
-  no,
-}
-
-/** 游客能否发言 */
-export enum LiveRoomTouristSendMsgEnum {
-  yes,
-  no,
-}
-
-/** 是否显示弹窗广告 */
-export enum LiveRoomIsShowAdEnum {
-  yes,
-  no,
-}
-
-/** 关闭房间 */
-export enum LiveRoomIsCloseEnum {
-  yes,
-  no,
-}
-
-/** 开启红包 */
-export enum LiveRoomIsShowRedbagEnum {
-  yes,
-  no,
-}
-
-/** 开启签到 */
-export enum LiveRoomIsShowSigninEnum {
-  yes,
-  no,
-}
-
-/** 开启手机看直播 */
-export enum LiveRoomIsShowPhoneLiveEnum {
-  yes,
-  no,
-}
-
-/** 是否显示直播间在线人数 */
-export enum LiveRoomIsShowLiveUserNumsEnum {
-  yes,
-  no,
-}
-
-/** 是否开启聊天审核 */
-export enum LiveRoomMsgVerifyEnum {
-  yes,
-  no,
-}
-
-/** 是否直播间视频底部的广告图 */
-export enum LiveRoomIsShowLiveVideoBottomImgEnum {
-  yes,
-  no,
-}
-
-/** 是否显示公众号二维码 */
-export enum LiveRoomIsShowOfficialAccountEnum {
-  yes,
-  no,
-}
-
-/** 是否开启转盘抽奖 */
-export enum LiveRoomIsShowTurntableEnum {
-  yes,
-  no,
-}
-
 /** 提醒游客登录 */
 export enum LiveRoomTipTouristLoginEnum {
   /** 关闭，即不提醒游客登录 */
@@ -152,9 +64,7 @@ export interface ILiveRoom {
   /** 直播间简介 */
   desc?: string;
   /** 是否使用cdn */
-  cdn?: LiveRoomUseCDNEnum;
-  /** 拉流是否需要鉴权 */
-  pull_is_should_auth?: LiveRoomPullIsShouldAuthEnum;
+  cdn?: SwitchEnum;
   /** 权重 */
   priority?: number;
   /** 推流秘钥 */
@@ -168,15 +78,15 @@ export interface ILiveRoom {
   /** 直播间状态 */
   status?: LiveRoomStatusEnum;
   /** 直播间是否显示 */
-  is_show?: LiveRoomIsShowEnum;
+  is_show?: SwitchEnum;
   /** 直播间是否开启聊天 */
-  open_chat?: LiveRoomOpenChatEnum;
+  open_chat?: SwitchEnum;
   /** 提醒游客登录 */
   tip_tourist_login?: LiveRoomTipTouristLoginEnum;
   /** 提醒游客登录间隔 */
   tip_tourist_login_delay?: number;
   /** 游客能否发言 */
-  tourist_send_msg?: LiveRoomTouristSendMsgEnum;
+  tourist_send_msg?: SwitchEnum;
   /** 聊天关键词过滤 */
   keyword_filter_msg?: string;
   /** 用户名关键词过滤 */
@@ -187,30 +97,16 @@ export interface ILiveRoom {
   newuser_send_msg_delay?: number;
   /** 房间密码 */
   room_pwd?: string;
-  /** 显示弹窗广告 */
-  is_show_ad?: LiveRoomIsShowAdEnum;
-  /** 弹窗广告图片 */
-  ad_img_url?: string;
   /** 关闭房间 */
-  is_close?: LiveRoomIsCloseEnum;
+  is_close?: SwitchEnum;
   /** 关闭房间描述 */
   is_close_desc?: string;
   /** 发送消息间隔(秒) */
   send_msg_throttle?: number;
-  /** 公众号二维码 */
-  official_account_img_url?: string;
-  /** 是否显示公众号二维码 */
-  is_show_official_account?: LiveRoomIsShowOfficialAccountEnum;
-  /** 是否开启转盘抽奖 */
-  is_show_turntable?: LiveRoomIsShowTurntableEnum;
-  /** 是否开启红包 */
-  is_show_redbag?: LiveRoomIsShowRedbagEnum;
   /** 是否开启签到 */
-  is_show_signin?: LiveRoomIsShowSigninEnum;
+  is_show_signin?: SwitchEnum;
   /** 是否开启手机看直播 */
-  is_show_phone_live?: LiveRoomIsShowPhoneLiveEnum;
-  /** 每天转盘抽奖次数 */
-  turntable_num?: number;
+  is_show_phone_live?: SwitchEnum;
   /** 公告 */
   announcement_msg?: string;
   /** 通知 */
@@ -218,43 +114,45 @@ export interface ILiveRoom {
   /** 系统消息 */
   system_msg?: string;
   /** 显示直播间在线人数 */
-  is_show_live_user_nums?: LiveRoomIsShowLiveUserNumsEnum;
+  is_show_live_user_nums?: SwitchEnum;
   /** 设置直播间最低在线人数 */
   mock_live_user_nums_min?: number;
   /** 设置直播间最高在线人数 */
   mock_live_user_nums_max?: number;
   /** 直播间最在线人数刷新间隔 */
   mock_live_user_nums_refresh_delay?: number;
-  /** 聊天审核 */
-  msg_verify?: LiveRoomMsgVerifyEnum;
-  /** 是否直播间视频底部的广告图 */
-  is_show_live_video_bottom_img?: LiveRoomIsShowLiveVideoBottomImgEnum;
-  /** 直播间视频底部的广告图 */
-  live_video_bottom_img?: string;
-  rtmp_url?: string;
-  flv_url?: string;
-  hls_url?: string;
-  webrtc_url?: string;
+  /** 聊天消息审核 */
+  msg_verify?: SwitchEnum;
+
+  pull_rtmp_url?: string;
+  pull_flv_url?: string;
+  pull_hls_url?: string;
+  pull_webrtc_url?: string;
+
+  pull_cdn_rtmp_url?: string;
+  pull_cdn_flv_url?: string;
+  pull_cdn_hls_url?: string;
+  pull_cdn_webrtc_url?: string;
+
   push_rtmp_url?: string;
   push_obs_server?: string;
   push_obs_stream_key?: string;
   push_webrtc_url?: string;
   push_srt_url?: string;
-  cdn_rtmp_url?: string;
-  cdn_flv_url?: string;
-  cdn_hls_url?: string;
-  cdn_webrtc_url?: string;
-  cdn_push_rtmp_url?: string;
-  cdn_push_obs_server?: string;
-  cdn_push_obs_stream_key?: string;
-  cdn_push_webrtc_url?: string;
-  cdn_push_srt_url?: string;
+
+  push_cdn_rtmp_url?: string;
+  push_cdn_obs_server?: string;
+  push_cdn_obs_stream_key?: string;
+  push_cdn_webrtc_url?: string;
+  push_cdn_srt_url?: string;
+
   forward_bilibili_url?: string;
   forward_douyu_url?: string;
   forward_huya_url?: string;
   forward_douyin_url?: string;
   forward_kuaishou_url?: string;
   forward_xiaohongshu_url?: string;
+
   /** 直播间备注 */
   remark?: string;
 
@@ -268,12 +166,8 @@ export interface ILiveRoom {
   areas?: IArea[];
   /** 直播信息 */
   live?: ILive;
-  user_live_room?: IUserLiveRoom & { user: IUser };
-
-  /** 是否假直播间，1是，2否 */
-  is_fake?: number;
 
-  exclude_key?: boolean;
+  is_fake?: SwitchEnum;
 
   created_at?: string;
   updated_at?: string;

src/types/IUser.ts

@@ -1,6 +1,5 @@
 import { IAuth, IRole, IWallet } from '@/interface';
-
-import { ILiveRoom } from './ILiveRoom';
+import { ILiveRoom } from '@/types/ILiveRoom';
 
 export interface IQqUser {
   id?: number;

src/types/shims-vue.d.ts

@@ -10,5 +10,6 @@ declare module '*.png';
 
 interface Window {
   $message: import('naive-ui/es/message/src/MessageProvider').MessageApiInjection;
+  $modal: import('naive-ui/es/modal/src/ModalProvider').ModalApiInjection;
   TXLivePusher: any;
 }

src/utils/request.ts

@@ -8,7 +8,7 @@ export interface MyAxiosPromise<T = any>
   extends Promise<{
     code: number;
     data: T;
-    message: string;
+    msg: string;
   }> {}
 
 interface MyAxiosInstance extends Axios {
@@ -66,25 +66,25 @@ class MyAxios {
             return Promise.reject(error.message);
           }
           if (statusCode === 400) {
-            console.error(errorResponseData.message);
-            window.$message.error(errorResponseData.message);
+            console.error(errorResponseData.msg);
+            window.$message.error(errorResponseData.msg);
             return Promise.reject(errorResponseData);
           }
           if (statusCode === 401) {
-            console.error(errorResponseData.message);
-            window.$message.error(errorResponseData.message);
+            console.error(errorResponseData.msg);
+            window.$message.error(errorResponseData.msg);
             const userStore = useUserStore();
             userStore.logout();
             return Promise.reject(errorResponseData);
           }
           if (statusCode === 403) {
-            console.error(errorResponseData.message);
-            window.$message.error(errorResponseData.message);
+            console.error(errorResponseData.msg);
+            window.$message.error(errorResponseData.msg);
             return Promise.reject(errorResponseData);
           }
           if (statusCode === 404) {
-            console.error(errorResponseData.message);
-            window.$message.error(errorResponseData.message);
+            console.error(errorResponseData.msg);
+            window.$message.error(errorResponseData.msg);
             return Promise.reject(errorResponseData);
           }
           if (statusCode === 500) {

src/views/area/id/index.vue

@@ -27,11 +27,6 @@
           class="cover"
           v-lazy:background-image="item?.cover_img || item?.users?.[0]?.avatar"
         >
-          <PullAuthTip
-            v-if="
-              item?.pull_is_should_auth === LiveRoomPullIsShouldAuthEnum.yes
-            "
-          ></PullAuthTip>
           <div
             v-if="item?.live"
             class="living-ico"
@@ -40,7 +35,7 @@
           </div>
           <div
             v-if="
-              item?.cdn === LiveRoomUseCDNEnum.yes ||
+              item?.cdn === SwitchEnum.yes ||
               [
                 LiveRoomTypeEnum.tencent_css,
                 LiveRoomTypeEnum.tencent_css_pk,
@@ -65,14 +60,9 @@ import { useRoute } from 'vue-router';
 
 import { fetchLiveRoomList } from '@/api/area';
 import LongList from '@/components/LongList/index.vue';
+import { SwitchEnum } from '@/interface';
 import router, { routerName } from '@/router';
-import {
-  ILiveRoom,
-  LiveRoomIsShowEnum,
-  LiveRoomPullIsShouldAuthEnum,
-  LiveRoomTypeEnum,
-  LiveRoomUseCDNEnum,
-} from '@/types/ILiveRoom';
+import { ILiveRoom, LiveRoomTypeEnum } from '@/types/ILiveRoom';
 
 const liveRoomList = ref<ILiveRoom[]>([]);
 const route = useRoute();
@@ -145,7 +135,7 @@ async function getData() {
     pageParams.nowPage += 1;
     const res = await fetchLiveRoomList({
       id: Number(route.params.id),
-      live_room_is_show: LiveRoomIsShowEnum.yes,
+      live_room_is_show: SwitchEnum.yes,
       nowPage: pageParams.nowPage,
       pageSize: pageParams.pageSize,
     });

src/views/h5/area/index.vue

@@ -20,11 +20,6 @@
             class="cover"
             v-lazy:background-image="iten?.cover_img || iten?.users?.[0].avatar"
           >
-            <PullAuthTip
-              v-if="
-                iten?.pull_is_should_auth === LiveRoomPullIsShouldAuthEnum.yes
-              "
-            ></PullAuthTip>
             <div
               v-if="iten?.live"
               class="living-ico"
@@ -33,7 +28,7 @@
             </div>
             <div
               v-if="
-                iten?.cdn === LiveRoomUseCDNEnum.yes ||
+                iten?.cdn === SwitchEnum.yes ||
                 [
                   LiveRoomTypeEnum.tencent_css,
                   LiveRoomTypeEnum.tencent_css_pk,
@@ -54,21 +49,14 @@
 
 <script lang="ts" setup>
 import { onMounted, reactive, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
 import { fetchLiveRoomList } from '@/api/area';
 import LongList from '@/components/LongList/index.vue';
+import { SwitchEnum } from '@/interface';
 import router, { routerName } from '@/router';
-import {
-  ILiveRoom,
-  LiveRoomIsShowEnum,
-  LiveRoomPullIsShouldAuthEnum,
-  LiveRoomTypeEnum,
-  LiveRoomUseCDNEnum,
-} from '@/types/ILiveRoom';
-
-const { t } = useI18n();
+import { ILiveRoom, LiveRoomTypeEnum } from '@/types/ILiveRoom';
+
 const route = useRoute();
 
 const liveRoomList = ref<ILiveRoom[]>([]);
@@ -125,7 +113,7 @@ async function getData() {
     status.value = 'loading';
     const res = await fetchLiveRoomList({
       id: Number(route.params.id),
-      is_show: LiveRoomIsShowEnum.yes,
+      is_show: SwitchEnum.yes,
       ...pageParams,
     });
     if (res.code === 200) {

src/views/h5/index.vue

@@ -39,11 +39,6 @@
               class="cover"
               v-lazy:background-image="iten?.cover_img || iten?.user?.avatar"
             >
-              <PullAuthTip
-                v-if="
-                  iten?.pull_is_should_auth === LiveRoomPullIsShouldAuthEnum.yes
-                "
-              ></PullAuthTip>
               <div
                 v-if="iten?.live"
                 class="living-ico"
@@ -52,7 +47,7 @@
               </div>
               <div
                 v-if="
-                  iten?.cdn === LiveRoomUseCDNEnum.yes ||
+                  iten?.cdn === SwitchEnum.yes ||
                   [
                     LiveRoomTypeEnum.tencent_css,
                     LiveRoomTypeEnum.tencent_css_pk,
@@ -85,16 +80,13 @@ import { useI18n } from 'vue-i18n';
 
 import { fetchAreaLiveRoomList } from '@/api/area';
 import { COMMON_URL } from '@/constant';
-import { IArea } from '@/interface';
+import { IArea, SwitchEnum } from '@/interface';
 import router, { mobileRouterName, routerName } from '@/router';
 import { useAppStore } from '@/store/app';
 import {
   ILiveRoom,
-  LiveRoomIsShowEnum,
-  LiveRoomPullIsShouldAuthEnum,
   LiveRoomStatusEnum,
   LiveRoomTypeEnum,
-  LiveRoomUseCDNEnum,
 } from '@/types/ILiveRoom';
 
 const appStore = useAppStore();
@@ -121,10 +113,10 @@ const currentSwiper = ref(swiperList.value[0]);
 async function getLiveRoomList() {
   try {
     const res = await fetchAreaLiveRoomList({
-      is_show: LiveRoomIsShowEnum.yes,
+      is_show: SwitchEnum.yes,
       status: LiveRoomStatusEnum.normal,
       // is_fake: 2,
-      // cdn: LiveRoomUseCDNEnum.yes,
+      // cdn: SwitchEnum.yes,
       // id: 2,
       orderName: 'priority',
       orderBy: 'desc',

src/views/h5/room/index.vue

@@ -2,10 +2,11 @@
   <div class="h5-room-wrap">
     <div class="head">
       <div class="left">
-        <div
-          class="avatar"
-          v-lazy:background-image="anchorInfo?.avatar"
-        ></div>
+        <Avatar
+          :url="anchorInfo?.avatar"
+          :name="anchorInfo?.username"
+          :size="40"
+        ></Avatar>
         <div class="username">
           {{ anchorInfo?.username }}
         </div>
@@ -29,7 +30,7 @@
     >
       <div
         class="cover"
-        v-lazy:background-image="appStore.liveRoomInfo?.cover_img"
+        v-lazy:background-image="liveRoomInfo?.cover_img"
       ></div>
       <div
         v-if="!roomLiving"
@@ -42,7 +43,7 @@
         ref="remoteVideoRef"
       ></div>
       <div
-        v-if="showPlayBtn && roomLiving && appStore.liveRoomInfo"
+        v-if="showPlayBtn"
         class="tip-btn"
         @click="startPull"
       >
@@ -54,6 +55,7 @@
         @refresh="handleRefresh"
         @full-screen="handleFullScreen"
         @picture-in-picture="hanldePictureInPicture"
+        :liveRoom="liveRoomInfo"
         :control="{
           line: true,
           fullMode: true,
@@ -147,11 +149,9 @@
             class="liveRoomInfo-wrap"
             :style="{ height: containerHeight + 'px' }"
           >
-            <div>名称：{{ appStore.liveRoomInfo?.name }}</div>
-            <div>简介：{{ appStore.liveRoomInfo?.desc }}</div>
-            <div>
-              分区：{{ appStore.liveRoomInfo?.areas?.[0]?.name || '暂无分区' }}
-            </div>
+            <div>名称：{{ liveRoomInfo?.name }}</div>
+            <div>简介：{{ liveRoomInfo?.desc }}</div>
+            <div>分区：{{ liveRoomInfo?.areas?.[0]?.name || '暂无分区' }}</div>
           </div>
         </n-tab-pane>
         <n-tab-pane
@@ -168,10 +168,11 @@
               class="item"
             >
               <div class="info">
-                <div
-                  class="avatar"
-                  v-lazy:background-image="item.value.user_avatar"
-                ></div>
+                <Avatar
+                  :url="item.value.user_avatar"
+                  :name="item.value.user_username"
+                  :size="25"
+                ></Avatar>
                 <div class="username">
                   {{ item.value.user_username }}
                 </div>
@@ -288,6 +289,7 @@ import router, { mobileRouterName } from '@/router';
 import { useAppStore } from '@/store/app';
 import { useCacheStore } from '@/store/cache';
 import { useUserStore } from '@/store/user';
+import { ILiveRoom } from '@/types/ILiveRoom';
 import { IUser } from '@/types/IUser';
 import { formatTimeHour } from '@/utils';
 
@@ -299,12 +301,14 @@ const userStore = useUserStore();
 const bottomRef = ref<HTMLDivElement>();
 const danmuListRef = ref<HTMLDivElement>();
 const showEmoji = ref(false);
+const showPlayBtn = ref(true);
 
+const liveRoomInfo = ref<ILiveRoom>();
 const anchorInfo = ref<IUser>();
 const containerHeight = ref(0);
 const videoWrapHeight = ref(0);
 const remoteVideoRef = ref<HTMLDivElement>();
-const roomId = ref(route.params.roomId as string);
+const roomId = ref();
 const loopGetLiveUserTimer = ref();
 
 const {
@@ -317,7 +321,6 @@ const {
   closeRtc,
   closeWs,
   liveUserList,
-  showPlayBtn,
   videoLoading,
   damuList,
   danmuStr,
@@ -338,11 +341,12 @@ onMounted(async () => {
   setTimeout(() => {
     scrollTo(0, 0);
   }, 100);
-  if (!Number(roomId.value)) {
-    return;
-  }
+
+  roomId.value = route.params.roomId as string;
   initPull({ roomId: roomId.value, autolay: true });
-  showPlayBtn.value = true;
+  await handleFindLiveRoomInfo();
+  if (!liveRoomInfo.value) return;
+  handleRefresh();
   videoWrapRef.value = remoteVideoRef.value;
   videoWrapHeight.value =
     document.documentElement.clientWidth / appStore.videoRatio;
@@ -365,6 +369,15 @@ onMounted(async () => {
   initRtcReceive();
 });
 
+watch(
+  () => roomLiving.value,
+  (newval) => {
+    if (newval) {
+      showPlayBtn.value = false;
+    }
+  }
+);
+
 function handleSendDanmu() {
   sendDanmuTxt(danmuStr.value);
   danmuStr.value = '';
@@ -381,7 +394,7 @@ async function handleHistoryMsg() {
   try {
     const res = await fetchGetWsMessageList({
       nowPage: 1,
-      pageSize: appStore.liveRoomInfo?.history_msg_total || 10,
+      pageSize: liveRoomInfo.value?.history_msg_total || 10,
       orderName: 'created_at',
       orderBy: 'desc',
       live_room_id: Number(roomId.value),
@@ -393,14 +406,14 @@ async function handleHistoryMsg() {
         damuList.value.unshift(v);
       });
       if (
-        appStore.liveRoomInfo?.system_msg &&
-        appStore.liveRoomInfo?.system_msg !== ''
+        liveRoomInfo.value?.system_msg &&
+        liveRoomInfo.value?.system_msg !== ''
       ) {
         damuList.value.push({
           send_msg_time: +new Date(),
           live_room_id: Number(roomId.value),
           id: -1,
-          content: appStore.liveRoomInfo?.system_msg,
+          content: liveRoomInfo.value?.system_msg,
           content_type: WsMessageContentTypeEnum.txt,
           msg_type: DanmuMsgTypeEnum.system,
         });
@@ -459,8 +472,8 @@ function handleScrollTop() {
 }
 
 function handleRefresh() {
-  if (appStore.liveRoomInfo) {
-    handlePlay(appStore.liveRoomInfo);
+  if (liveRoomInfo.value) {
+    handlePlay(liveRoomInfo.value);
   }
 }
 
@@ -476,12 +489,12 @@ async function handleFindLiveRoomInfo() {
     const res = await fetchFindLiveRoom(Number(roomId.value));
     if (res.code === 200) {
       if (res.data) {
-        appStore.liveRoomInfo = res.data;
-        anchorInfo.value = res.data.user_live_room?.user;
+        liveRoomInfo.value = res.data;
+        anchorInfo.value = res.data.users?.[0];
         if (res.data.live) {
           roomLiving.value = true;
         } else {
-          videoLoading.value = false;
+          roomLiving.value = false;
         }
       }
     }
@@ -491,9 +504,9 @@ async function handleFindLiveRoomInfo() {
 }
 
 function startPull() {
-  cacheStore.muted = false;
   showPlayBtn.value = false;
-  handlePlay(appStore.liveRoomInfo!);
+  cacheStore.muted = false;
+  handlePlay(liveRoomInfo.value!);
 }
 </script>
 
@@ -514,13 +527,7 @@ function startPull() {
     .left {
       display: flex;
       align-items: center;
-      .avatar {
-        width: 40px;
-        height: 40px;
-        border-radius: 50%;
 
-        @extend %containBg;
-      }
       .username {
         margin-left: 10px;
       }
@@ -728,15 +735,9 @@ function startPull() {
         display: flex;
         align-items: center;
         cursor: pointer;
-        .avatar {
-          margin-right: 5px;
-          width: 25px;
-          height: 25px;
-          border-radius: 50%;
 
-          @extend %containBg;
-        }
         .username {
+          margin-left: 10px;
           color: white;
         }
       }
@@ -783,7 +784,7 @@ function startPull() {
       width: 20px;
       height: 20px;
 
-      @include setBackground('@/assets/img/msg-face.webp');
+      @include setBackground('@/assets/img/msg-face.png');
     }
     .ipt {
       display: block;

src/views/home/index.vue

@@ -43,13 +43,7 @@
           @click="showJoinBtn = !showJoinBtn"
         >
           <div
-            v-if="
-              appStore.liveRoomInfo?.cdn === LiveRoomUseCDNEnum.yes &&
-              [
-                LiveRoomTypeEnum.tencent_css,
-                LiveRoomTypeEnum.tencent_css_pk,
-              ].includes(appStore.liveRoomInfo!.type!)
-            "
+            v-if="currentLive?.live_room?.cdn === SwitchEnum.yes"
             class="cdn-ico"
           >
             <div class="txt">CDN</div>
@@ -59,16 +53,15 @@
             class="cover"
             :style="{
               backgroundImage: `url(${
-                appStore.liveRoomInfo?.cover_img ||
-                appStore.liveRoomInfo?.users?.[0]?.avatar
+                currentLive?.live_room?.cover_img || currentLive?.user?.avatar
               })`,
             }"
           ></div>
           <div
-            v-if="appStore.liveRoomInfo?.flv_url"
+            v-if="currentLive?.live_room"
             ref="remoteVideoRef"
           ></div>
-          <template v-if="appStore.liveRoomInfo">
+          <template v-if="currentLive?.live_room">
             <div class="video-controls">
               <VideoControls
                 :resolution="videoResolution"
@@ -76,6 +69,8 @@
                 :control="{
                   line: true,
                 }"
+                :liveRoom="currentLive?.live_room"
+                :liveLineList="[LiveLineEnum.flv, LiveLineEnum.hls]"
               ></VideoControls>
             </div>
 
@@ -87,7 +82,7 @@
             >
               <div
                 class="btn"
-                @click="joinRoom(appStore.liveRoomInfo)"
+                @click="joinRoom(currentLive?.live_room, 2)"
               >
                 进入直播
               </div>
@@ -104,32 +99,19 @@
               :key="index"
               :class="{
                 item: 1,
-                active: item.live_room?.id === appStore.liveRoomInfo?.id,
+                active: item.live_room?.id === currentLive?.live_room?.id,
               }"
               :style="{
                 backgroundImage: `url(${
-                  item.live_room?.cover_img ||
-                  item.live_room?.users?.[0]?.avatar
+                  item.live_room?.cover_img || item.user?.avatar
                 })`,
               }"
-              @click="changeLiveRoom(item)"
+              @click="changeLive(item)"
             >
-              <PullAuthTip
-                v-if="
-                  item.live_room?.pull_is_should_auth ===
-                  LiveRoomPullIsShouldAuthEnum.yes
-                "
-              ></PullAuthTip>
               <div class="hidden">
                 <div
                   class="cdn-ico"
-                  v-if="
-                    item?.live_room?.cdn === LiveRoomUseCDNEnum.yes &&
-                    [
-                      LiveRoomTypeEnum.tencent_css,
-                      LiveRoomTypeEnum.tencent_css_pk,
-                    ].includes(item.live_room!.type!)
-                  "
+                  v-if="item?.live_room?.cdn === SwitchEnum.yes"
                 >
                   <div class="txt">CDN</div>
                 </div>
@@ -138,11 +120,11 @@
                 class="border"
                 :style="{
                   opacity:
-                    item.live_room?.id === appStore.liveRoomInfo?.id ? 1 : 0,
+                    item.live_room?.id === currentLive?.live_room?.id ? 1 : 0,
                 }"
               ></div>
               <div
-                v-if="item.live_room?.id === appStore.liveRoomInfo?.id"
+                v-if="item.live_room?.id === currentLive?.live_room?.id"
                 class="triangle"
               ></div>
               <div class="txt">{{ item.live_room?.name }}</div>
@@ -162,39 +144,26 @@
         <div class="title">{{ t('home.recommendLive') }}</div>
         <div class="live-room-list">
           <div
-            v-for="(iten, indey) in otherLiveRoomList"
+            v-for="(item, indey) in otherLiveRoomList"
             :key="indey"
             class="live-room"
-            @click="joinRoom(iten.live_room)"
+            @click="joinRoom(item.live_room, 2)"
           >
             <div
               class="cover"
               v-lazy:background-image="
-                iten?.live_room?.cover_img ||
-                iten?.live_room?.users?.[0]?.avatar
+                item?.live_room?.cover_img || item?.user?.avatar
               "
             >
-              <PullAuthTip
-                v-if="
-                  iten.live_room?.pull_is_should_auth ===
-                  LiveRoomPullIsShouldAuthEnum.yes
-                "
-              ></PullAuthTip>
               <div
-                v-if="
-                  iten?.live_room?.cdn === LiveRoomUseCDNEnum.yes &&
-                  [
-                    LiveRoomTypeEnum.tencent_css,
-                    LiveRoomTypeEnum.tencent_css_pk,
-                  ].includes(iten.live_room!.type!)
-                "
+                v-if="item?.live_room?.cdn === SwitchEnum.yes"
                 class="cdn-ico"
               >
                 <div class="txt">CDN</div>
               </div>
-              <div class="txt">{{ iten?.live_room?.users?.[0].username }}</div>
+              <div class="txt">{{ item?.live_room?.users?.[0].username }}</div>
             </div>
-            <div class="desc">{{ iten?.live_room?.name }}</div>
+            <div class="desc">{{ item?.live_room?.name }}</div>
           </div>
           <div
             v-if="!otherLiveRoomList.length"
@@ -204,6 +173,7 @@
           </div>
         </div>
       </div>
+
       <div class="area-item">
         <div class="title">{{ t('home.bilibiliLive') }}</div>
         <div class="live-room-list">
@@ -211,29 +181,14 @@
             v-for="(iten, indey) in bilibiliLiveRoomList"
             :key="indey"
             class="live-room"
-            @click="joinRoom(iten.live_room)"
+            @click="joinRoom(iten.live_room, 1)"
           >
             <div
               class="cover"
-              v-lazy:background-image="
-                iten?.live_room?.cover_img ||
-                iten?.live_room?.users?.[0]?.avatar
-              "
+              v-lazy:background-image="iten?.live_room?.cover_img"
             >
-              <PullAuthTip
-                v-if="
-                  iten.live_room?.pull_is_should_auth ===
-                  LiveRoomPullIsShouldAuthEnum.yes
-                "
-              ></PullAuthTip>
               <div
-                v-if="
-                  iten?.live_room?.cdn === LiveRoomUseCDNEnum.yes &&
-                  [
-                    LiveRoomTypeEnum.tencent_css,
-                    LiveRoomTypeEnum.tencent_css_pk,
-                  ].includes(iten.live_room!.type!)
-                "
+                v-if="iten?.live_room?.cdn === SwitchEnum.yes"
                 class="cdn-ico"
               >
                 <div class="txt">CDN</div>
@@ -293,15 +248,10 @@ import { fetchLiveBilibiliGetUserRecommend } from '@/api/bilibili';
 import { fetchLiveList } from '@/api/live';
 import { sliderList, URL_QUERY } from '@/constant';
 import { usePull } from '@/hooks/use-pull';
-import { ILive, LiveLineEnum } from '@/interface';
+import { ILive, LiveLineEnum, SwitchEnum } from '@/interface';
 import { routerName } from '@/router';
 import { useAppStore } from '@/store/app';
-import {
-  ILiveRoom,
-  LiveRoomPullIsShouldAuthEnum,
-  LiveRoomTypeEnum,
-  LiveRoomUseCDNEnum,
-} from '@/types/ILiveRoom';
+import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
 
 const router = useRouter();
 const appStore = useAppStore();
@@ -314,6 +264,7 @@ const configVideo = ref();
 // const configVideo = ref(
 //   'https://www.xdyun.com/resldmnqcom/ldq_website/all_ldy/cloudphone_xdyun_ldy_mobile/mobile/assets/xd-video-6c9bcd.mp4'
 // );
+const currentLive = ref<ILive>();
 const topLiveRoomList = ref<ILive[]>([]);
 const otherLiveRoomList = ref<ILive[]>([]);
 const bilibiliLiveRoomList = ref<ILive[]>([]);
@@ -328,7 +279,6 @@ const { t } = useI18n();
 const {
   videoWrapRef,
   videoLoading,
-  roomLiving,
   videoResolution,
   handleStopDrawing,
   handlePlay,
@@ -394,7 +344,6 @@ async function handleBilibilData() {
             id: item.roomid,
             name: item.title,
             cover_img: item.cover,
-            is_bilibili: 1,
           },
         };
       });
@@ -419,21 +368,22 @@ function handleSlideList() {
 }
 
 function handleRefresh() {
-  playLive(appStore.liveRoomInfo!);
+  if (currentLive.value) {
+    playLive(currentLive.value);
+  }
 }
 
-function playLive(item: ILiveRoom) {
+function playLive(item: ILive) {
   handleStopDrawing();
   canvasRef.value?.childNodes?.forEach((item) => {
     item.remove();
   });
-  // roomLiving.value = true;
-  appStore.liveRoomInfo = item;
-  handlePlay(item);
+  currentLive.value = item;
+  handlePlay(item.live_room!);
 }
 
-function changeLiveRoom(item: ILive) {
-  if (item.id === appStore.liveRoomInfo?.id) return;
+function changeLive(item: ILive) {
+  if (item.id === currentLive.value?.id) return;
   if (
     ![
       LiveRoomTypeEnum.wertc_live,
@@ -443,7 +393,7 @@ function changeLiveRoom(item: ILive) {
   ) {
     appStore.liveLine = LiveLineEnum.hls;
   }
-  playLive(item.live_room!);
+  playLive(item);
 }
 
 async function getLiveRoomList() {
@@ -463,8 +413,7 @@ async function getLiveRoomList() {
       topLiveRoomList.value = res.data.rows.slice(0, topNums.value);
       otherLiveRoomList.value = res.data.rows.slice(topNums.value);
       if (res.data.total) {
-        roomLiving.value = true;
-        appStore.liveRoomInfo = topLiveRoomList.value[0].live_room;
+        changeLive(topLiveRoomList.value[0]);
       }
     }
   } catch (error) {
@@ -472,11 +421,11 @@ async function getLiveRoomList() {
   }
 }
 
-function joinRoom(data) {
+function joinRoom(data, isBilibili) {
   const url = router.resolve({
     name: routerName.pull,
     params: { roomId: data.id },
-    query: { [URL_QUERY.isBilibili]: data.is_bilibili },
+    query: { [URL_QUERY.isBilibili]: isBilibili },
   });
   openToTarget(url.href);
 }

src/views/my/index.vue

@@ -138,14 +138,14 @@
               <div>
                 <span>
                   RTMP推流地址（CDN）：{{
-                    userStore.userInfo?.live_rooms?.[0]?.cdn_push_rtmp_url!
+                    userStore.userInfo?.live_rooms?.[0]?.push_cdn_rtmp_url!
                   }}，
                 </span>
                 <span
                   class="link"
                   @click="
                     handleCopy(
-                      userStore.userInfo?.live_rooms?.[0]?.cdn_push_rtmp_url!
+                      userStore.userInfo?.live_rooms?.[0]?.push_cdn_rtmp_url!
                     )
                   "
                 >
@@ -155,14 +155,14 @@
               <div>
                 <span>
                   OBS服务器（CDN）：{{
-                    userStore.userInfo?.live_rooms?.[0]?.cdn_push_obs_server!
+                    userStore.userInfo?.live_rooms?.[0]?.push_cdn_obs_server!
                   }}，
                 </span>
                 <span
                   class="link"
                   @click="
                     handleCopy(
-                      userStore.userInfo?.live_rooms?.[0]?.cdn_push_obs_server!
+                      userStore.userInfo?.live_rooms?.[0]?.push_cdn_obs_server!
                     )
                   "
                 >
@@ -173,7 +173,7 @@
                 <span>
                   OBS推流码（CDN）：{{
                     userStore.userInfo?.live_rooms?.[0]
-                      ?.cdn_push_obs_stream_key!
+                      ?.push_cdn_obs_stream_key!
                   }}，
                 </span>
                 <span
@@ -181,7 +181,7 @@
                   @click="
                     handleCopy(
                       userStore.userInfo?.live_rooms?.[0]
-                        ?.cdn_push_obs_stream_key!
+                        ?.push_cdn_obs_stream_key!
                     )
                   "
                 >
@@ -491,25 +491,25 @@ async function handleUpdateKey() {
     const res = await fetchUpdateLiveRoomKey();
     if (res.code === 200 && userStore.userInfo?.live_rooms?.[0]) {
       userStore.userInfo.live_rooms[0].push_obs_server =
-        res.data.srsPushRes.push_obs_server;
+        res.data.srsPushRes.obs_server;
       userStore.userInfo.live_rooms[0].push_obs_stream_key =
-        res.data.srsPushRes.push_obs_stream_key;
+        res.data.srsPushRes.obs_stream_key;
       userStore.userInfo.live_rooms[0].push_rtmp_url =
-        res.data.srsPushRes.push_rtmp_url;
+        res.data.srsPushRes.rtmp_url;
       userStore.userInfo.live_rooms[0].push_srt_url =
-        res.data.srsPushRes.push_srt_url;
+        res.data.srsPushRes.srt_url;
       userStore.userInfo.live_rooms[0].push_webrtc_url =
-        res.data.srsPushRes.push_webrtc_url;
-      userStore.userInfo.live_rooms[0].cdn_push_obs_server =
-        res.data.cdnPushRes.push_obs_server;
-      userStore.userInfo.live_rooms[0].cdn_push_obs_stream_key =
-        res.data.cdnPushRes.push_obs_stream_key;
-      userStore.userInfo.live_rooms[0].cdn_push_rtmp_url =
-        res.data.cdnPushRes.push_rtmp_url;
-      userStore.userInfo.live_rooms[0].cdn_push_srt_url =
-        res.data.cdnPushRes.push_srt_url;
-      userStore.userInfo.live_rooms[0].cdn_push_webrtc_url =
-        res.data.cdnPushRes.push_webrtc_url;
+        res.data.srsPushRes.webrtc_url;
+      userStore.userInfo.live_rooms[0].push_cdn_obs_server =
+        res.data.cdnPushRes.obs_server;
+      userStore.userInfo.live_rooms[0].push_cdn_obs_stream_key =
+        res.data.cdnPushRes.obs_stream_key;
+      userStore.userInfo.live_rooms[0].push_cdn_rtmp_url =
+        res.data.cdnPushRes.rtmp_url;
+      userStore.userInfo.live_rooms[0].push_cdn_srt_url =
+        res.data.cdnPushRes.srt_url;
+      userStore.userInfo.live_rooms[0].push_cdn_webrtc_url =
+        res.data.cdnPushRes.webrtc_url;
     }
   } catch (error) {
     console.error(error);

src/views/pull/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div
     class="pull-wrap"
-    v-if="!appStore.liveRoomInfo"
+    v-if="!liveRoomInfo"
   >
     暂无该直播间
   </div>
@@ -32,18 +32,17 @@
         class="head"
       >
         <div class="info">
-          <div
-            class="avatar"
-            :style="{
-              backgroundImage: `url(${anchorInfo?.avatar})`,
-            }"
+          <Avatar
+            :url="anchorInfo?.avatar"
+            :name="anchorInfo?.username"
+            :size="55"
             @click="
               router.push({
                 name: routerName.my,
                 params: { userId: anchorInfo?.id },
               })
             "
-          ></div>
+          ></Avatar>
           <div class="detail">
             <div class="top">
               <div class="name">{{ anchorInfo?.username }}</div>
@@ -52,9 +51,7 @@
                 <div class="f-right">666</div>
               </div>
               <span v-if="NODE_ENV === 'development'">
-                {{ liveRoomTypeEnumMap[appStore.liveRoomInfo?.type!] }}：{{
-                  mySocketId
-                }}
+                {{ liveRoomTypeEnumMap[liveRoomInfo?.type!] }}：{{ mySocketId }}
               </span>
               <div
                 class="rtc-info"
@@ -63,7 +60,7 @@
                     LiveRoomTypeEnum.wertc_live,
                     LiveRoomTypeEnum.wertc_meeting_one,
                     LiveRoomTypeEnum.wertc_meeting_two,
-                  ].includes(appStore.liveRoomInfo?.type!)
+                  ].includes(liveRoomInfo?.type!)
                 "
               >
                 <div class="item">延迟：{{ rtcRtt || '-' }}</div>
@@ -76,10 +73,10 @@
             <div class="bottom">
               <div
                 class="desc"
-                v-if="appStore.liveRoomInfo?.desc?.length"
+                v-if="liveRoomInfo?.desc?.length"
               >
                 <FloatTip
-                  :txt="appStore.liveRoomInfo?.desc"
+                  :txt="liveRoomInfo?.desc"
                   :max-len="20"
                 ></FloatTip>
               </div>
@@ -88,11 +85,11 @@
                 @click="
                   router.push({
                     name: routerName.area,
-                    query: { id: appStore.liveRoomInfo?.areas?.[0]?.id },
+                    query: { id: liveRoomInfo?.areas?.[0]?.id },
                   })
                 "
               >
-                {{ appStore.liveRoomInfo?.areas?.[0]?.name }}
+                {{ liveRoomInfo?.areas?.[0]?.name }}
               </span>
             </div>
           </div>
@@ -148,7 +145,7 @@
           class="cover"
           :style="{
             backgroundImage: `url(${
-              appStore.liveRoomInfo?.cover_img || anchorInfo?.avatar
+              liveRoomInfo?.cover_img || anchorInfo?.avatar
             })`,
           }"
         ></div>
@@ -164,6 +161,7 @@
             @full-screen="handleFullScreen"
             @picture-in-picture="hanldePictureInPicture"
             :control="appStore.videoControls"
+            :liveRoom="liveRoomInfo"
           ></VideoControls>
         </div>
       </div>
@@ -236,10 +234,11 @@
             class="item"
           >
             <div class="info">
-              <div
-                class="avatar"
-                v-lazy:background-image="item.value.user_avatar"
-              ></div>
+              <Avatar
+                :url="item.value.user_avatar"
+                :name="item.value.user_username"
+                :size="25"
+              ></Avatar>
               <div class="username">
                 {{ item.value.user_username }}
               </div>
@@ -264,52 +263,38 @@
             </div>
           </template>
           <template v-if="item.msg_type === DanmuMsgTypeEnum.danmu">
-            <span class="time"
-              >[{{ formatTimeHour(item.send_msg_time!) }}]</span
-            >
             <span class="name">
               <Dropdown
                 trigger="hover"
                 positon="left"
               >
                 <template #btn>
-                  <span>{{ item.username }}</span>
+                  <span class="time">
+                    [{{ formatTimeHour(item.send_msg_time!) }}]
+                  </span>
+                  <span class="username">{{ item.username }}</span>
+                  <span class="role">
+                    [{{ item.user?.roles?.map((v) => v.role_name).join() }}]
+                  </span>
                 </template>
                 <template #list>
                   <div class="list">
                     <div class="item">{{ item.username }}</div>
                     <div
                       class="item operator"
-                      @click="
-                        handleDisableSpeakingUser({
-                          userId: item.user?.id,
-                        })
-                      "
-                    >
-                      禁言该用户
-                    </div>
-                    <div
-                      class="item operator"
-                      @click="
-                        handleRestoreSpeakingUser({
-                          userId: item.user?.id,
-                        })
-                      "
+                      @click="handleDisableSpeakingUser()"
                     >
-                      解除禁言该用户
+                      禁言
                     </div>
                     <div
                       class="item operator"
-                      @click="handleKickUser"
+                      @click="handleCancelDisableSpeakingUser()"
                     >
-                      踢掉该用户
+                      解除禁言
                     </div>
                   </div>
                 </template>
               </Dropdown>
-              <span>
-                [{{ item.user?.roles?.map((v) => v.role_name).join() }}]
-              </span>
             </span>
             <span>：</span>
             <span
@@ -345,13 +330,11 @@
       >
         <div
           class="disableSpeaking"
-          v-if="appStore.disableSpeaking.get(appStore.liveRoomInfo?.id!)"
+          v-if="appStore.disableSpeaking.get(liveRoomInfo?.id!)"
         >
           <div class="bg"></div>
           <span class="txt">
-            你被禁言了（{{
-              appStore.disableSpeaking.get(appStore.liveRoomInfo?.id!)
-            }}）
+            你被禁言了（{{ appStore.disableSpeaking.get(liveRoomInfo?.id!) }}）
           </span>
         </div>
         <div class="control">
@@ -426,7 +409,6 @@
 </template>
 
 <script lang="ts" setup>
-import { getRandomString, openToTarget } from 'billd-utils';
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
@@ -469,9 +451,8 @@ import { QINIU_KODO } from '@/spec-config';
 import { useAppStore } from '@/store/app';
 import { useNetworkStore } from '@/store/network';
 import { useUserStore } from '@/store/user';
-import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
+import { ILiveRoom, LiveRoomTypeEnum } from '@/types/ILiveRoom';
 import { IUser } from '@/types/IUser';
-import { WsDisableSpeakingType, WsMsgTypeEnum } from '@/types/websocket';
 import { formatMoney, formatTimeHour } from '@/utils';
 import { NODE_ENV } from 'script/constant';
 
@@ -484,6 +465,7 @@ const networkStore = useNetworkStore();
 const { t } = useI18n();
 
 const roomId = ref('');
+const liveRoomInfo = ref<ILiveRoom>();
 const anchorInfo = ref<IUser>();
 const configBg = ref();
 const configVideo = ref();
@@ -577,7 +559,8 @@ onMounted(async () => {
   }
   initRoomId(roomId.value);
   await handleFindLiveRoomInfo();
-  if (!appStore.liveRoomInfo) return;
+  if (!liveRoomInfo.value) return;
+  handleRefresh();
   appStore.videoControls.fps = true;
   appStore.videoControls.fullMode = true;
   appStore.videoControls.kbs = true;
@@ -626,12 +609,12 @@ async function handleFindLiveRoomInfo() {
     const res = await fetchFindLiveRoom(Number(roomId.value));
     if (res.code === 200) {
       if (res.data) {
-        appStore.liveRoomInfo = res.data;
-        anchorInfo.value = res.data.user_live_room?.user;
+        liveRoomInfo.value = res.data;
+        anchorInfo.value = res.data?.users?.[0];
         if (res.data.live) {
           roomLiving.value = true;
         } else {
-          videoLoading.value = false;
+          roomLiving.value = false;
         }
         if (isBilibili.value) {
           handleBilibil();
@@ -663,10 +646,10 @@ async function handleBilibil() {
     avatar: roomInfo?.data?.data?.user_cover,
     username: roomInfo?.data?.data?.title,
   };
-  appStore.liveRoomInfo = {
+  liveRoomInfo.value = {
     type: LiveRoomTypeEnum.system,
-    flv_url: flv?.data?.data?.durl?.[0].url,
-    hls_url: hls?.data?.data?.durl?.[0].url,
+    pull_flv_url: flv?.data?.data?.durl?.[0].url,
+    pull_hls_url: hls?.data?.data?.durl?.[0].url,
     areas: [{ name: roomInfo?.data?.data?.area_name }],
     desc: roomInfo?.data?.data?.description,
   };
@@ -727,7 +710,7 @@ async function handleHistoryMsg() {
   try {
     const res = await fetchGetWsMessageList({
       nowPage: 1,
-      pageSize: appStore.liveRoomInfo?.history_msg_total || 10,
+      pageSize: liveRoomInfo.value?.history_msg_total || 10,
       orderName: 'created_at',
       orderBy: 'desc',
       live_room_id: Number(roomId.value),
@@ -739,14 +722,14 @@ async function handleHistoryMsg() {
         damuList.value.unshift(v);
       });
       if (
-        appStore.liveRoomInfo?.system_msg &&
-        appStore.liveRoomInfo?.system_msg !== ''
+        liveRoomInfo.value?.system_msg &&
+        liveRoomInfo.value?.system_msg !== ''
       ) {
         damuList.value.push({
           send_msg_time: +new Date(),
           live_room_id: Number(roomId.value),
           id: -1,
-          content: appStore.liveRoomInfo.system_msg,
+          content: liveRoomInfo.value.system_msg,
           content_type: WsMessageContentTypeEnum.txt,
           msg_type: DanmuMsgTypeEnum.system,
         });
@@ -767,7 +750,7 @@ watch(
 );
 
 watch(
-  () => appStore.liveRoomInfo,
+  () => liveRoomInfo.value,
   (newval) => {
     if (newval) {
       getBg();
@@ -784,68 +767,18 @@ watch(
  * 主播开播了，可以禁言所有看自己直播的用户
  * 使用redis存储记录，key是主播直播间id，value是禁言用户id
  */
-function handleDisableSpeakingUser({
-  socketId,
-  userId,
-}: {
-  socketId?;
-  userId;
-}) {
+function handleDisableSpeakingUser() {
   console.log('handleDisableSpeakingUser');
-  const instance = networkStore.wsMap.get(roomId.value);
-  if (instance) {
-    instance.send<WsDisableSpeakingType['data']>({
-      requestId: getRandomString(8),
-      msgType: WsMsgTypeEnum.disableSpeaking,
-      data: {
-        socket_id: socketId,
-        user_id: userId,
-        live_room_id: Number(roomId.value),
-        duration: 60 * 5,
-      },
-    });
-  }
 }
 
-function handleRestoreSpeakingUser({
-  socketId,
-  userId,
-}: {
-  socketId?;
-  userId;
-}) {
-  console.log('handleRestoreSpeakingUser');
-  const instance = networkStore.wsMap.get(roomId.value);
-  if (instance) {
-    instance.send<WsDisableSpeakingType['data']>({
-      requestId: getRandomString(8),
-      msgType: WsMsgTypeEnum.disableSpeaking,
-      data: {
-        socket_id: socketId,
-        user_id: userId,
-        live_room_id: Number(roomId.value),
-        restore: true,
-      },
-    });
-  }
-}
-
-function jumpProfile(userId: number) {
-  const url = router.resolve({
-    name: routerName.my,
-    params: { userId },
-  });
-  openToTarget(url.href);
-}
-
-function handleKickUser() {
-  console.log('handleKickUser');
+function handleCancelDisableSpeakingUser() {
+  console.log('handleCancelDisableSpeakingUser');
 }
 
 function getBg() {
   try {
     const reg = /.+\.mp4$/g;
-    const url = appStore.liveRoomInfo?.bg_img;
+    const url = liveRoomInfo.value?.bg_img;
     if (url) {
       if (reg.exec(url)) {
         configVideo.value = url;
@@ -865,12 +798,6 @@ function handlePushStr(str) {
 }
 
 function handleEmoji() {
-  if (!loginTip()) {
-    return;
-  }
-  if (!commentAuthTip()) {
-    return;
-  }
   showEmoji.value = !showEmoji.value;
 }
 
@@ -950,8 +877,8 @@ async function hanldePictureInPicture() {
 }
 
 function handleRefresh() {
-  if (appStore.liveRoomInfo) {
-    handlePlay(appStore.liveRoomInfo);
+  if (liveRoomInfo.value) {
+    handlePlay(liveRoomInfo.value);
   }
 }
 
@@ -1083,19 +1010,12 @@ function handleScrollTop() {
         align-items: center;
         text-align: initial;
 
-        .avatar {
-          margin-right: 20px;
-          width: 50px;
-          height: 50px;
-          border-radius: 50%;
-          cursor: pointer;
-
-          @extend %containBg;
-        }
         .detail {
+          margin-left: 15px;
+
           .top {
             display: flex;
-            margin-bottom: 10px;
+            margin-bottom: 5px;
 
             .follow {
               display: flex;
@@ -1343,21 +1263,15 @@ function handleScrollTop() {
           display: flex;
           align-items: center;
           justify-content: space-between;
-          margin-bottom: 10px;
+          margin-bottom: 5px;
           font-size: 12px;
           .info {
             display: flex;
             align-items: center;
             cursor: pointer;
-            .avatar {
-              margin-right: 10px;
-              width: 25px;
-              height: 25px;
-              border-radius: 50%;
 
-              @extend %containBg;
-            }
             .username {
+              margin-left: 10px;
               color: black;
             }
           }
@@ -1485,10 +1399,10 @@ function handleScrollTop() {
             opacity: 0;
           }
           &.face {
-            @include setBackground('@/assets/img/msg-face.webp');
+            @include setBackground('@/assets/img/msg-face.png');
           }
           &.img {
-            @include setBackground('@/assets/img/msg-img.webp');
+            @include setBackground('@/assets/img/msg-img.png');
           }
         }
       }

src/views/push/index.vue

@@ -2926,10 +2926,10 @@ function handleStartMedia(item: { type: MediaTypeEnum; txt: string }) {
               opacity: 0;
             }
             &.face {
-              @include setBackground('@/assets/img/msg-face.webp');
+              @include setBackground('@/assets/img/msg-face.png');
             }
             &.img {
-              @include setBackground('@/assets/img/msg-img.webp');
+              @include setBackground('@/assets/img/msg-img.png');
             }
           }
         }

src/views/rank/index.vue

@@ -137,10 +137,10 @@ import { fetchLiveRoomList } from '@/api/liveRoom';
 import { fetchSigninList } from '@/api/signin';
 import { fetchUserList } from '@/api/user';
 import { fetchWalletList } from '@/api/wallet';
-import { RankTypeEnum } from '@/interface';
+import { RankTypeEnum, SwitchEnum } from '@/interface';
 import router, { routerName } from '@/router';
 import { useUserStore } from '@/store/user';
-import { ILiveRoom, LiveRoomIsShowEnum } from '@/types/ILiveRoom';
+import { ILiveRoom } from '@/types/ILiveRoom';
 import { formatMoney } from '@/utils';
 
 const userStore = useUserStore();
@@ -315,7 +315,7 @@ async function getLiveRoomList() {
   try {
     loading.value = true;
     const res = await fetchLiveRoomList({
-      is_show: LiveRoomIsShowEnum.yes,
+      is_show: SwitchEnum.yes,
       orderName: 'updated_at',
       orderBy: 'desc',
       ...pageParams,

src/views/shop/index.vue

@@ -141,7 +141,6 @@ function handleStatus() {
 }
 
 function handleBuy(item: IGoods) {
-  console.log('i', item);
   if (item.price! <= 0) {
     window.$message.info('该商品是免费的，不需要购买！');
     return;

test/test.ts

@@ -0,0 +1,21 @@
+let a = {
+  srsPushRes: {
+    rtmp_url:
+      'rtmp://srs-push.hsslive.cn/livestream/roomId___101?roomid=101&pushtype=8&pushkey=iU2c3WWDfOgGFRrHT0xJSZlitgHZE1&userid=101',
+    obs_server: 'rtmp://srs-push.hsslive.cn/livestream/roomId___101',
+    obs_stream_key:
+      '?roomid=101&pushtype=2&pushkey=iU2c3WWDfOgGFRrHT0xJSZlitgHZE1&userid=101',
+    webrtc_url: '',
+    srt_url: '',
+  },
+  cdnPushRes: {
+    rtmp_url:
+      'rtmp://push.hsslive.cn/livestream/roomId___101?txSecret=d91001aded456341d48e08a70032e3bd&txTime=674E7079&roomid=101&pushtype=8&pushkey=iU2c3WWDfOgGFRrHT0xJSZlitgHZE1&userid=101',
+    obs_server: 'rtmp://push.hsslive.cn/livestream/',
+    obs_stream_key:
+      'roomId___101?txSecret=d91001aded456341d48e08a70032e3bd&txTime=674E7079&roomid=101&pushtype=8&pushkey=iU2c3WWDfOgGFRrHT0xJSZlitgHZE1&userid=101',
+    webrtc_url:
+      'webrtc://push.hsslive.cn/livestream/roomId___101?txSecret=d91001aded456341d48e08a70032e3bd&txTime=674E7079&roomid=101&pushtype=8&pushkey=iU2c3WWDfOgGFRrHT0xJSZlitgHZE1&userid=101',
+    srt_url: '',
+  },
+};