update

src/views/live/student/index.vue

@@ -35,16 +35,20 @@
         </div>
         <div v-show="connect" class="student-parent">
           <div v-show="roomInfo.video_mode === 1 || remoteStreamType === 1" id="student"></div>
+
           <template v-if="remoteStreamType !== 1">
             <template v-if="roomInfo.video_mode === 1">
-              <el-button type="danger" @click="handsDown">
+              <el-button v-show="invite" type="danger" @click="handsDown">
                 <svg-icon icon-class="hang-up" /> 挂断
               </el-button>
             </template>
             <template v-else>
               <div class="student-audio">
-                <el-avatar icon="el-icon-user" :src="roomInfo.teacher_image_url" />
-                <el-button type="danger" circle @click="handsDown">
+                <el-avatar
+                  icon="el-icon-user"
+                  :src="invite ? roomInfo.teacher_image_url : inviteImageURL"
+                />
+                <el-button v-show="invite" type="danger" circle @click="handsDown">
                   <svg-icon icon-class="hang-up" />
                 </el-button>
               </div>
@@ -163,6 +167,8 @@ export default {
       room_user_id: this.$route.query.room_user_id,
       // 已连接
       connect: false,
+      invite: false,
+      inviteImageURL: '',
       // 等待接通
       callLoading: false,
       dialogVisibleMaterial: false,

src/views/live/student/live.js

@@ -167,6 +167,7 @@ export function initListener(vue) {
     console.log('监听通知移除流事件');
     vue.connect = false;
     vue.remoteStreamType = -1;
+    vue.inviteImageURL = '';
   });
 
   // 停止订阅流
@@ -183,11 +184,18 @@ export function initListener(vue) {
   rtc.on('inviteUp', uid => {
     console.log('监听自己被邀请事件', uid);
     vue.callLoading = true;
+    vue.invite = true;
   });
 
   rtc.on('mcDown', () => {
     closeVideo('picture');
     vue.connect = false;
+    vue.invite = false;
+  });
+
+  rtc.on('videoModeChange', data => {
+    console.log('连麦音视频模式更新成功监听回调', data.settings.video_mode);
+    vue.roomInfo.video_mode = data.settings.video_mode;
   });
 
   rtc.on('createLocalStream', () => {
@@ -249,5 +257,9 @@ export function initListener(vue) {
     if (data.type === 'handsDown-load' && data.uid === vue.room_user_id) {
       vue.callLoading = false;
     }
+
+    if (data.type === 'inviteImage') {
+      vue.inviteImageURL = data.imageURL;
+    }
   });
 }

src/views/live/teacher/index.vue

@@ -374,15 +374,16 @@ export default {
       GetLiveRoomInfo({ task_id: this.task_id })
         .then(({ video_mode }) => {
           let uid = student.room_user_id;
+          let imageURL = student.student_image_url;
           if (video_mode === mode) {
-            common.invite(uid);
+            common.invite(uid, imageURL);
           } else {
             common.roomUpdate({
               video_mode: mode,
               roomUpdateSuccess: data => {
                 console.log(data, '连麦音视频模式更新请求成功！');
                 this.roomInfo.video_mode = mode;
-                common.invite(uid);
+                common.invite(uid, imageURL);
               },
               roomUpdateFailed: data => {
                 this.callLoading = false;

src/views/live/teacher/live.js

@@ -1,5 +1,5 @@
 import { Message } from 'element-ui';
-import { rtc, publishStream, createLocalStream } from '@/views/live/common';
+import { rtc, publishStream, createLocalStream, sendPublishMessage } from '@/views/live/common';
 export {
   initSDK,
   downloadWebSDK,
@@ -297,11 +297,15 @@ export function liveRecord(status) {
  * 老师端发起邀请，邀请学生上麦。（举手模式）
  * @param {String} uid 被邀请用户id
  */
-export function invite(uid) {
+export function invite(uid, imageURL) {
   rtc.invite({
     uid: uid,
     success: function (str) {
       console.log('邀请上麦成功', str);
+      sendPublishMessage({
+        type: 'inviteImage',
+        imageURL
+      });
     },
     fail: function (data) {
       console.log(data);