liuyu 4 years ago
parent
commit
678399e909
1 changed files with 25 additions and 5 deletions
  1. 25 5
      src/layout/live/detailInfo.vue

+ 25 - 5
src/layout/live/detailInfo.vue

@@ -24,7 +24,7 @@
                 <el-col :span="8" class="btn">
                 <el-col :span="8" class="btn">
                   <span @click="shareon"><i class="iconfont iconfenxiang"></i>分享</span>
                   <span @click="shareon"><i class="iconfont iconfenxiang"></i>分享</span>
                   <span @click="liveon"><i class="iconfont iconshexiangtou"></i>摄像头</span>
                   <span @click="liveon"><i class="iconfont iconshexiangtou"></i>摄像头</span>
-                  <span><i class="iconfont iconmaikefeng"></i>麦克风</span>
+                  <span @click="liveclose">关闭</span>
                 </el-col>
                 </el-col>
               </div>
               </div>
             </el-col>
             </el-col>
@@ -56,12 +56,14 @@ export default {
   data: function() {
   data: function() {
     return {
     return {
       client_: '',
       client_: '',
+      localStream_: '',
       sdkAppId_: '1400380125',
       sdkAppId_: '1400380125',
       cameras: [],
       cameras: [],
       microphones: [],
       microphones: [],
       cameraId: '',
       cameraId: '',
       microphoneId: '',
       microphoneId: '',
       userId_: '1111',
       userId_: '1111',
+      open_: false,
     };
     };
   },
   },
   created() {
   created() {
@@ -89,6 +91,7 @@ export default {
       }
       }
     },
     },
     async liveon() {
     async liveon() {
+      this.open_ = true;
       console.log('8888--' + this.userId_);
       console.log('8888--' + this.userId_);
       if (this.cameraId === '' || this.microphoneId === '') {
       if (this.cameraId === '' || this.microphoneId === '') {
         this.$message({
         this.$message({
@@ -98,18 +101,18 @@ export default {
         return;
         return;
       }
       }
       await this.client_.join({ roomId: this.name, role: 'anchor' });
       await this.client_.join({ roomId: this.name, role: 'anchor' });
-      const localStream_ = await TRTC.createStream({
+      this.localStream_ = await TRTC.createStream({
         audio: true,
         audio: true,
         video: true,
         video: true,
         cameraId: this.cameraId,
         cameraId: this.cameraId,
         microphoneId: this.microphoneId,
         microphoneId: this.microphoneId,
         userId: this.userId_,
         userId: this.userId_,
       });
       });
-      await localStream_.initialize();
+      await this.localStream_.initialize();
       console.log('initialize local stream success');
       console.log('initialize local stream success');
       // publish the local stream
       // publish the local stream
-      await this.client_.publish(localStream_);
-      localStream_.play('main-video');
+      await this.client_.publish(this.localStream_);
+      this.localStream_.play('main-video');
       //$('#mask_main').appendTo($('#player_' + this.localStream_.getId()));
       //$('#mask_main').appendTo($('#player_' + this.localStream_.getId()));
     },
     },
     async shareon() {
     async shareon() {
@@ -141,6 +144,23 @@ export default {
         });
         });
       }
       }
     },
     },
+    async liveclose() {
+      // 关闭视频通话
+      console.log(this.open_);
+      if (this.open_) {
+        const videoTrack = this.localStream_.getVideoTrack();
+        if (videoTrack) {
+          this.localStream_.removeTrack(videoTrack).then(() => {
+            console.log('remove video call success');
+            // 关闭摄像头
+            videoTrack.stop();
+            this.client_.unpublish(localStream).then(() => {
+              // 取消发布本地流成功
+            });
+          });
+        }
+      }
+    },
   },
   },
   computed: {
   computed: {
     ...mapState(['user']),
     ...mapState(['user']),