fix: 完善架构

.eslintrc.js

@@ -1,9 +1,7 @@
 console.log(
   '\x1B[0;37;44m INFO \x1B[0m',
   '\x1B[0;;34m ' +
-    `${new Date().toLocaleString()}读取了: ${__filename.slice(
-      __dirname.length + 1
-    )}` +
+    `读取了: ${__filename.slice(__dirname.length + 1)}` +
     ' \x1B[0m'
 );
 

.prettierrc.js

@@ -1,9 +1,9 @@
-// console.log(
-//   '\x1B[0;37;44m INFO \x1B[0m',
-//   '\x1B[0;;34m ' +
-//     `读取了: ${__filename.slice(__dirname.length + 1)}` +
-//     ' \x1B[0m'
-// );
+console.log(
+  '\x1B[0;37;44m INFO \x1B[0m',
+  '\x1B[0;;34m ' +
+    `读取了: ${__filename.slice(__dirname.length + 1)}` +
+    ' \x1B[0m'
+);
 
 module.exports = {
   bracketSpacing: true, // 默认为true。即要求：{ foo: bar }；可改为false，即要求{foo: bar}

src/components/Modal/index.vue

@@ -52,8 +52,8 @@ const emits = defineEmits(['close']);
 
 <style lang="scss" scoped>
 .modal-wrap {
-  z-index: 1;
-  background-color: rgba(0, 0, 0, 0.7) !important;
+  z-index: 100;
+  background-color: rgba(0, 0, 0, 0.6) !important;
 
   @extend %maskBg;
   .container {
@@ -62,7 +62,6 @@ const emits = defineEmits(['close']);
     left: 50%;
     box-sizing: border-box;
     padding: 20px;
-    // min-height: 200px;
     width: 320px;
     border-radius: 10px;
     background-color: #fff;
@@ -83,10 +82,9 @@ const emits = defineEmits(['close']);
       @include cross(#ccc, 3px);
     }
     .content {
-      margin-top: 10px;
+      margin: 10px 0;
     }
     .footer {
-      margin-top: 10px;
       .btn {
         width: 280px;
         height: 44px;

src/components/Slider/index.vue

@@ -82,13 +82,11 @@ onMounted(() => {
         const slideList = container.children;
         for (let y = 0; y < slideList.length; y += 1) {
           const slide = slideList[y];
-          console.log(slide, 211);
           if (index === i) {
             res[index] = res[index] || 0;
             res[index] += slide.getBoundingClientRect().width;
           }
         }
-        console.log('endddd');
       }
     });
 
@@ -101,7 +99,6 @@ onMounted(() => {
       }
     });
     widthMap.value = res;
-    console.log(widthMap.value, res, min.value, 33333);
   });
 });
 </script>
@@ -155,7 +152,7 @@ onMounted(() => {
         align-items: center;
         flex-shrink: 0;
         box-sizing: border-box;
-        padding-right: 40px;
+        padding-right: 30px;
         height: 40px;
         .avatar {
           display: flex;

src/hooks/modal/index.vue

@@ -89,9 +89,17 @@ export default defineComponent({
         font-size: 14px;
       }
       &.next {
-        background: linear-gradient(270deg, #929dff 4.71%, #3cfdfd 103.24%),
-          linear-gradient(270deg, #b3acff 4.71%, #3ccffd 103.24%),
-          linear-gradient(270deg, #b3acff 4.71%, #3ccffd 103.24%);
+        background: #fceabb; /* fallback for old browsers */
+        background: -webkit-linear-gradient(
+          to left,
+          #f8b500,
+          #fceabb
+        ); /* Chrome 10-25, Safari 5.1-6 */
+        background: linear-gradient(
+          to left,
+          #f8b500,
+          #fceabb
+        ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
         color: white;
         font-weight: 700;
         font-size: 16px;

src/hooks/use-pull.ts

@@ -51,8 +51,8 @@ export function usePull({
     damuList,
   } = useWs();
 
-  const { flvPlayer, flvVideoEl, startFlvPlay, destroyFlv } = useFlvPlay();
-  const { hlsVideoEl, startHlsPlay, destroyHls } = useHlsPlay();
+  const { flvPlayer, flvVideoEl, startFlvPlay } = useFlvPlay();
+  const { hlsVideoEl, startHlsPlay } = useHlsPlay();
   const stopDrawingArr = ref<any[]>([]);
 
   onUnmounted(() => {

src/hooks/use-push.ts

@@ -244,7 +244,6 @@ export function usePush({ isSRS }: { isSRS: boolean }) {
     if (instance) {
       instance.send({
         msgType: WsMsgTypeEnum.roomNoLive,
-        data: {},
       });
     }
     setTimeout(() => {

src/hooks/use-ws.ts

@@ -724,13 +724,8 @@ export const useWs = () => {
       if (!rtc) return;
       if (data.sender !== getSocketId()) {
         console.log('不是我发的candidate');
-        const candidate = new RTCIceCandidate({
-          sdpMid: data.sdpMid,
-          sdpMLineIndex: data.sdpMLineIndex,
-          candidate: data.candidate,
-        });
         rtc.peerConnection
-          ?.addIceCandidate(candidate)
+          ?.addIceCandidate(data.candidate)
           .then(() => {
             console.log('candidate成功');
           })
@@ -742,7 +737,7 @@ export const useWs = () => {
       }
     });
 
-    // 管理员正在直播
+    // 主播正在直播
     ws.socketIo.on(WsMsgTypeEnum.roomLiving, (data: WsRoomLivingType) => {
       prettierReceiveWsMsg(WsMsgTypeEnum.roomLiving, data);
       roomLiving.value = true;
@@ -760,7 +755,7 @@ export const useWs = () => {
       }
     });
 
-    // 管理员不在直播
+    // 主播不在直播
     ws.socketIo.on(WsMsgTypeEnum.roomNoLive, (data) => {
       prettierReceiveWsMsg(WsMsgTypeEnum.roomNoLive, data);
       roomNoLive.value = true;

src/interface-ws.ts

@@ -41,10 +41,6 @@ export type WsOtherJoinType = IWsFormat<{
   join_socket_id: string;
 }>;
 
-export type WsRoomNoLiveType = IWsFormat<{
-  live_room: ILiveRoom;
-}>;
-
 export type WsStartLiveType = IWsFormat<{
   cover_img: string;
   name: string;
@@ -62,9 +58,9 @@ export type WsLeavedType = IWsFormat<{
   user_info?: IUser;
 }>;
 
-export interface IRoomLiving {
+export type IRoomLiving = IWsFormat<{
   live_room: ILiveRoom;
-}
+}>;
 
 export type WsOfferType = IWsFormat<{
   sdp: any;
@@ -86,9 +82,7 @@ export type WsHeartbeatType = IWsFormat<{
 
 export type WsCandidateType = IWsFormat<{
   live_room_id: number;
-  candidate: string;
-  sdpMid: string | null;
-  sdpMLineIndex: number | null;
+  candidate: RTCIceCandidate;
   receiver: string;
   sender: string;
 }>;

src/interface.ts

@@ -372,84 +372,3 @@ export interface IMessage {
     live_room_id: number;
   };
 }
-
-export interface IOtherJoin {
-  data: {
-    live_room: ILiveRoom;
-    live_room_user_info: IUser;
-    join_user_info?: IUser;
-    join_socket_id: string;
-  };
-}
-
-export interface IRoomNoLive {
-  data: {
-    live_room: ILiveRoom;
-  };
-}
-
-export interface IStartLive {
-  socket_id: string;
-  user_info: IUser;
-  data: any;
-}
-
-export interface IRoomLiving {
-  data: {
-    live_room: ILiveRoom;
-  };
-}
-
-export interface IJoin {
-  socket_id: string;
-  is_anchor: boolean;
-  user_info?: IUser;
-  data: {
-    live?: ILive;
-    live_room: ILiveRoom;
-    anchor_info?: IUser;
-    // track: { audio: number; video: number };
-  };
-}
-
-export interface IOffer {
-  socket_id: string;
-  is_anchor: boolean;
-  user_info?: IUser;
-  data: {
-    sdp: any;
-    sender: string;
-    receiver: string;
-    live_room_id: number;
-  };
-}
-
-export interface IAnswer {
-  sdp: any;
-  sender: string;
-  receiver: string;
-  live_room_id: number;
-}
-export interface IHeartbeat {
-  socket_id: string;
-  is_anchor: boolean;
-  user_info?: IUser;
-  data?: {
-    live_id: number;
-    live_room_id: number;
-  };
-}
-
-export interface ICandidate {
-  socket_id: string;
-  is_anchor: boolean;
-  user_info?: IUser;
-  data: {
-    live_room_id: number;
-    candidate: string;
-    sdpMid: string | null;
-    sdpMLineIndex: number | null;
-    receiver: string;
-    sender: string;
-  };
-}

src/layout/pc/head/index.vue

@@ -395,7 +395,7 @@ function handleStartLive(key: liveTypeEnum) {
   position: fixed;
   top: 0;
   left: 0;
-  z-index: 10;
+  z-index: 50;
   display: flex;
   align-items: center;
   justify-content: space-between;

src/layout/pc/index.vue

@@ -27,9 +27,9 @@ document.body.style.minWidth = '1200px';
     position: fixed;
     top: 0;
     right: 0;
-    z-index: 100;
-    width: 600px;
-    height: 400px;
+    z-index: 50;
+    width: 400px;
+    height: 300px;
     background-color: #ffd700;
     background-image: linear-gradient(239deg, #ffd700 0%, #ffffff 100%);
     opacity: 0.2;

src/layout/pc/modal/index.vue

@@ -6,7 +6,7 @@
     positive-text="OK"
   >
     <p>
-      billd-live开始支持ffmpeg、obs推流，欢迎体验！
+      使用obs/ffmpeg推流到billd-live！
       <b
         class="link"
         @click="openToTarget('https://www.hsslive.cn/article/150')"
@@ -15,13 +15,19 @@
       </b>
     </p>
     <p>
-      billd-live付费课开始预定！299元/人，定金50，付定金后减50，实付249！<b
+      <span class="hot">billd-live付费课火热报名中！</span>
+      <b
         class="link"
         @click="openToTarget('https://www.hsslive.cn/article/151')"
       >
         查看详情
       </b>
     </p>
+    <p>
+      <span class="hot">
+        欢迎有兴趣且有能力的各位参与billd-live贡献，如该项目有收益，将分配给所有参与贡献的人！
+      </span>
+    </p>
   </n-modal>
 </template>
 
@@ -30,8 +36,8 @@ import { openToTarget } from 'billd-utils';
 import { ref } from 'vue';
 
 // const showModal = ref(process.env.NODE_ENV === 'production');
-const showModal = ref(false);
-// const showModal = ref(true);
+// const showModal = ref(false);
+const showModal = ref(true);
 // const showModal = ref(router.currentRoute.value.name === routerName.home);
 </script>
 
@@ -42,4 +48,7 @@ const showModal = ref(false);
   font-weight: 500;
   cursor: pointer;
 }
+.hot {
+  color: red;
+}
 </style>

src/network/webRTC.ts

@@ -1,7 +1,8 @@
 import { getRandomString } from 'billd-utils';
 import browserTool from 'browser-tool';
 
-import { ICandidate, MediaTypeEnum } from '@/interface';
+import { MediaTypeEnum } from '@/interface';
+import { WsCandidateType } from '@/interface-ws';
 import { AppRootState, useAppStore } from '@/store/app';
 import { useNetworkStore } from '@/store/network';
 
@@ -393,12 +394,10 @@ export class WebRTCClass {
         console.log('准备发送candidate', event.candidate.candidate);
         const roomId = this.roomId.split('___')[0];
         const receiver = this.roomId.split('___')[1];
-        networkStore.wsMap.get(roomId)?.send<ICandidate['data']>({
+        networkStore.wsMap.get(roomId)?.send<WsCandidateType['data']>({
           msgType: WsMsgTypeEnum.candidate,
           data: {
-            candidate: event.candidate.candidate,
-            sdpMid: event.candidate.sdpMid,
-            sdpMLineIndex: event.candidate.sdpMLineIndex,
+            candidate: event.candidate,
             sender: networkStore.wsMap.get(roomId)?.socketIo?.id || '',
             receiver,
             live_room_id: Number(roomId),

src/views/home/index.vue

@@ -6,7 +6,7 @@
         <Slider
           v-if="interactionList.length"
           :list="interactionList"
-          :row="3"
+          :row="2"
           :speed="60"
         ></Slider>
       </div>
@@ -315,6 +315,7 @@ function joinRoom(data: { roomId: number; isFlv: boolean }) {
 .home-wrap {
   .play-container {
     position: relative;
+    z-index: 1;
     .bg {
       position: absolute;
       top: 0;

src/views/pushByCanvas/index.vue

@@ -567,7 +567,6 @@ function handleMixedAudio() {
       mixedStream.addTrack(destination.stream.getAudioTracks()[0]);
       mixedStream.addTrack(canvasVideoStream.value!.getVideoTracks()[0]);
       canvasVideoStream.value = mixedStream;
-      console.log('替换了21111');
       return;
     }
     const destination = audioCtx.value.createMediaStreamDestination();

src/views/team/index.vue

@@ -133,6 +133,10 @@ const list = ref([
         label: 'billd-live',
         github: 'https://github.com/galaxy-s10/billd-live',
       },
+      {
+        label: 'billd-live-admin',
+        github: 'https://github.com/galaxy-s10/billd-live-admin',
+      },
       {
         label: 'billd-live-server',
         github: 'https://github.com/galaxy-s10/billd-live-server',