Merge pull request 'xbx' (#93) from xbx into master

Reviewed-on: http://git.luyuan.tk/luyuan/beelink/pulls/93

src/components/LivePlaying.vue

@@ -8,7 +8,6 @@
     width: 797px;
     height: 449px;
     border-radius: 17px;
-    background-color: #0f0;
     overflow: hidden;
     >video{
         width: 100%;

src/types/trtc-js-sdk.d.ts

@@ -1,4 +1,6 @@
 declare module 'trtc-js-sdk' {
     export function createClient(info: any): any
     export function createStream(info: any): any
+    export function checkSystemRequirements(): any
+    export function isScreenShareSupported(): any
 }

src/views/regime/Liveing.vue

@@ -4,7 +4,7 @@
         <div class="top">
         <div class="left">直播页面</div>
         <div class="right">
-            <img src="@/static/images/liveshare.png" alt="" @click="qiehuan()" />
+            <img src="@/static/images/liveshare.png" alt="" @click="fenxiang()" />
             <img src="@/static/images/liveend.png" alt="" @click="visible = true" />
         </div>
         </div>
@@ -30,8 +30,8 @@
                 </div>
                 </div>
             </div>
-            <div class="others" v-for="(item, index) in roominfo.studentlist" :key="index">
+            <div class="others">
-                <div :id="'s-' + item.memberid" class="othersitem">
+                <div :id="'s-' + item.memberid" class="othersitem" v-for="(item, index) in roominfo.studentlist" :key="index">
                     <div class="watcher"></div>
                     <div class="name">{{item.name}}</div>
                 <!-- <img src="" alt="" /> -->
@@ -51,11 +51,7 @@
                 <div class="name">asdsada</div>
                 <img src="" alt="" />
                 </div> -->
-                 <div class="othersitem" id="s-52">
+                
-                    <div class="watcher"></div>
-                    <div class="name">测试</div>
-                    <!-- <img src="" alt="" /> -->
-                </div> 
                
             </div>
         </div>
@@ -219,11 +215,15 @@ export default defineComponent({
         const roominfo = ref<any>([]);
         console.log(useRoute())
         const id = useRoute().query.id;
-            
+        TRTC.checkSystemRequirements().then((result: any) => {
+            if(!result) {
+                message.error("您的浏览器不支持视频通话，请下载新版chrome浏览器")
+            }
+        })
         async function qiehuan(){
             // 1 屏幕分享 2 摄像头
             client.unpublish(localStream)
-            localStream = type ? TRTC.createStream({ userid: store.state.userinfo.memberid, audio: true, screen: true }) : TRTC.createStream({ userId: 10, audio: true, video: true });
+            localStream = type ? TRTC.createStream({ userid: store.state.userinfo.memberid, audio: true, screen: true }) : TRTC.createStream({ userId: 10, audio: false, video: true });
             type = !type;
             localStream.initialize().then(()=>{
                 client
@@ -232,38 +232,13 @@ export default defineComponent({
                     console.error('本地流发布失败 ' + error);
                 })
                 .then(() => {
-                    const el = document.querySelector("#local_stream");
+                    
-                    if(el){
-                        el.innerHTML = ""
-                    }
                     localStream.play('local_stream');
                     console.log('本地流发布成功');
                 });
             });
             
         }
-        async function pingmu(){
-            localStream = TRTC.createStream({ userid: store.state.userinfo.memberid, audio: true, screen: true });
-            const id = localStream.getId();
-            await localStream
-            .initialize()
-            .catch((error: string) => {
-                console.error('初始化本地流失败 ' + error);
-            })
-            .then(() => {
-                console.log('初始化本地流成功');
-                client
-                .publish(localStream)
-                .catch((error: string) => {
-                    console.error('本地流发布失败 ' + error);
-                })
-                .then(() => {
-                    localStream.play('local_stream');
-                    console.log('本地流发布成功');
-                    console.log(id , 123)
-                });
-            });
-        }
         async function shexiang(){
             localStream = TRTC.createStream({ userId: store.state.userinfo.memberid, audio: true, video: true });
             const id = localStream.getId();
@@ -280,12 +255,58 @@ export default defineComponent({
                     console.error('本地流发布失败 ' + error);
                 })
                 .then(() => {
+                    const el = document.querySelector("#local_stream");
+                    if(el){
+                        el.innerHTML = ""
+                    }
                     localStream.play('local_stream');
                     console.log('本地流发布成功');
                     console.log(id, 123)
                 });
             });
         }
+
+        async function pingmu(){
+            const result = await TRTC.checkSystemRequirements()
+            console.log(result,11111)
+            if(!result) {
+                message.error("您的浏览器不支持屏幕分享，请下载新版chrome");
+                shexiang()
+                return ;
+            }
+            
+            localStream = TRTC.createStream({ userid: store.state.userinfo.memberid, audio: true, screen: true });
+            const id = localStream.getId();
+            await localStream
+            .initialize()
+            .catch((error: string) => {
+                console.error('初始化本地流失败 ' + error);
+                message.error("请选择分享的内容")
+                
+                setTimeout(()=>{
+                    pingmu()
+                }, 1000)
+            })
+            .then(() => {
+                console.log('初始化本地流成功');
+                client
+                .publish(localStream)
+                .catch((error: string) => {
+                    console.log('本地流发布失败 ' + error);
+                    
+                })
+                .then(() => {
+                    const el = document.querySelector("#local_stream");
+                    if(el){
+                        el.innerHTML = ""
+                    }
+                    localStream.play('local_stream');
+                    console.log('本地流发布成功');
+                    console.log(id , 123)
+                });
+            });
+        }
+        
         async function init(fun: any, userSig: string): Promise<void>{
             console.log(userSig)
             const el = document.querySelector("#local_stream");
@@ -317,7 +338,7 @@ export default defineComponent({
                 remoteStream.play('s-' + remoteStream.userId_);
             });
             client
-            .join({ roomId: roominfo.value.roomid })
+            .join({ roomId: 12 })
             .catch((error: string) => {
                 console.error('进房失败 ' + error);
             })
@@ -333,12 +354,16 @@ export default defineComponent({
             await client.unpublish(localStream).then(() => {
                 // 关闭屏幕分享流
                 console.log("关闭")
-                client.leave().then(() => {
+                // client.leave().then(() => {
-                // leaving room success
+                // // leaving room success
-                    console.log("关闭成功")
+                //     console.log("关闭成功")
-                }).catch((error: string) => {
+                // }).catch((error: string) => {
-                    console.error('leaving room failed: ' + error);
+                //     console.error('leaving room failed: ' + error);
-                });
+                // });
+                const el = document.querySelector("#local_stream");
+                if(el){
+                    el.innerHTML = ""
+                }
             });
             statie ? await shexiang() : await pingmu();
             statie = !statie;
@@ -356,9 +381,15 @@ export default defineComponent({
         }
 
         onMounted(async ()=>{
-            userSing = await usersig(store.state.userinfo.memberid);
+            const si = setInterval(async ()=>{
+                if(store.state.userinfo.memberid != 0 && store.state.userinfo.memberid){
+                    clearInterval(si);
+                    userSing = await usersig(store.state.userinfo.memberid);
+                    init(pingmu, userSing);
+                   
+                }
+            })
             
-            init(pingmu, userSing);
         })
      
         return{