公共会话切换

src/views/newMap/jointTrainingNew/chatView/chatBox.vue

@@ -37,7 +37,7 @@
           </div>
           <div class="chat-box-footer">
             <div style="width: 400px;font-size: 14px;">{{ userString }}</div>
-            <!--<el-button size="mini" type="primary" class="chat-box-footer-create" @click="goCommonConversation">公共会话</el-button>-->
+            <el-button size="mini" type="primary" class="chat-box-footer-create" @click="goCommonConversation">公共会话</el-button>
             <el-button size="mini" type="primary" class="chat-box-footer-create" :loading="createLoading" @click="createCoversition()">创建群聊</el-button>
           </div>
         </div>
@@ -61,6 +61,7 @@
               :message-list="messageList"
               :simulation-users="simulationUsers"
               :user-role="userRole"
+              :common-conversation="commonConversation"
               @changeMessageList="changeMessageList"
             />
             <div v-if="recordSending" class="chat_record_tip">
@@ -75,9 +76,9 @@
           <div class="chat-box-footer">
             <div class="chat-box-footer-tool" />
             <el-button v-if="isConversitionCreator && isButtonShow" size="mini" type="danger" class="chat-box-footer-quit" :loading="quitLoading" @click="quitConversition()">退出群聊</el-button>
-            <!--<el-button v-if="!commonConversation" class="chat-box-footer-send" size="mini" type="primary" @click="goCommonConversation">公共会话</el-button>-->
+            <el-button v-if="!commonConversation" class="chat-box-footer-send" size="mini" type="primary" @click="goCommonConversation">公共会话</el-button>
-            <!--<el-button v-if="!conversitionId && userRole !== 'AUDIENCE'" class="chat-box-footer-send" size="mini" type="primary" @click="cancelCommonConversation">成员列表</el-button>-->
+            <el-button v-if="!conversitionId && userRole !== 'AUDIENCE'" class="chat-box-footer-send" size="mini" type="primary" @click="cancelCommonConversation">成员列表</el-button>
-            <!--<el-button v-if="conversitionId && commonConversation" class="chat-box-footer-send" size="mini" type="primary" @click="cancelCommonConversation">私有会话</el-button>-->
+            <el-button v-if="conversitionId && commonConversation" class="chat-box-footer-send" size="mini" type="primary" @click="cancelCommonConversation">私有会话</el-button>
             <el-button v-if="isButtonShow" class="chat-box-footer-send" size="mini" type="primary" :disabled="recordSending" @click="startRecording()">发送语音</el-button>
           </div>
         </div>
@@ -126,7 +127,7 @@ export default {
             recordSending:false,
             currentCoversition:{},
             conversitionId: '',
-            commonConversation: true,
+            commonConversation: false,
             seconds:0,
             inter:null,
             recorders: null,
@@ -152,8 +153,12 @@ export default {
             memberIdList: [],
             quitLoading: false,
             conversitionMemberList: [],
+            commonMemberList: [],
+            privateMemberList: [],
             isConversitionCreator: false,
-            messageList: []
+            messageList: [],
+            commonMessageList: [],
+            privateMessageList: []
         };
     },
     computed:{
@@ -178,7 +183,8 @@ export default {
         },
         userRole(val) {
             if (val === 'AUDIENCE') {
-                this.isAudienceInitData();
+                // this.isAudienceInitData();
+                this.goCommonConversation();
             }
         },
         '$store.state.map.mapViewLoadedCount':function(val) {
@@ -208,8 +214,8 @@ export default {
                         memberList.push({memberId:id, connect:false});
                     }
                 });
-                console.log(memberList, val.memberIds);
                 this.conversitionMemberList = memberList;
+                this.privateMemberList = memberList;
             }
         },
         '$store.state.map.activeTrainListChange': function (val) { // 按计划行车的列车列表更新标识
@@ -236,10 +242,12 @@ export default {
             deep: true
         },
         '$store.state.socket.overConversition': function (val) {
-        	if (val.id === this.conversitionId) {
+            if (val.id === this.conversitionId) {
                 this.conversitionId = '';
                 this.conversitionMemberList = [];
+                this.privateMemberList = [];
                 this.messageList = [];
+                this.privateMessageList = [];
             }
         },
         '$store.state.training.memberList': function (val) {
@@ -324,18 +332,6 @@ export default {
         setSetting(data) {
             this.form = data;
         },
-        setCurrentCoversition(coversition) {
-            if (coversition && coversition.id) {
-                this.currentCoversition = coversition;
-                this.headerTitle = coversition.name;
-            } else {
-                this.headerTitle = '';
-            }
-            if (this.recordSending) {
-                this.cancleRecording();
-            }
-            this.$refs.chatContent.scrollTop();
-        },
         setHeadTitle(headerTitle) {
             this.headerTitle = headerTitle;
         },
@@ -346,8 +342,8 @@ export default {
             this.createLoading = true;
             startConversition(this.group, this.memberIdList).then(resp => {
                 this.conversitionId = resp.data.id;
-                // this.conversitionMemberList = resp.data.memberList;
                 this.messageList = [];
+                this.privateMessageList = [];
                 this.userString = '';
                 this.isConversitionCreator = true;
                 this.$message.success('创建会话成功！');
@@ -502,7 +498,9 @@ export default {
             overSimulationConversition(this.group, this.conversitionId).then(resp => {
                 this.conversitionId = '';
                 this.conversitionMemberList = [];
+                this.privateMemberList = [];
                 this.messageList = [];
+                this.privateMessageList = [];
                 this.quitLoading = false;
             }).catch(() => {
                 this.$message.error('退出会话失败！');
@@ -513,8 +511,10 @@ export default {
             this.userString = '';
             this.conversitionId = data.id;
             this.conversitionMemberList = data.memberList;
+            this.commonMemberList = data.memberList;
             this.isConversitionCreator = false;
             this.messageList = [];
+            this.privateMessageList = [];
             if (data.messageList && data.messageList) {
                 data.messageList.forEach(message => {
                     const member = this.memberData[message.memberId];
@@ -523,6 +523,7 @@ export default {
                         message.self = this.$store.state.userId == member.userId;
                     }
                     this.messageList.push(message);
+                    this.privateMessageList.push(message);
                 });
             }
         },
@@ -541,18 +542,43 @@ export default {
         isAudienceInitData() {
             getAllConversition(this.group).then(resp => {
                 if (resp.data && resp.data.length) {
-                    const messageList = [];
+                    const messages = [];
                     resp.data.forEach(conversation => {
+                        (conversation.messageList || []).forEach(message => {
+                            const member = this.memberData[message.memberId];
+                            message.src = `/audio/${message.audioPath}`;
+                            message.members = conversation.memberList;
+                            if (member) {
+                                message.self = this.$store.state.userId == member.userId;
+                            }
+                            messages.push(message);
+                        });
+                        this.commonMessageList = messages.sort(this.sortByMessageTime);
+                        console.log(this.userRole);
                         if (this.userRole == 'AUDIENCE') {
-                            (conversation.messageList || []).forEach(message => {
+                            this.messageList = this.commonMessageList;
-                                const member = this.memberData[message.memberId];
+                            this.conversitionMemberList = [];
-                                message.src = `/audio/${message.audioPath}`;
+                            const temDispatcherList = [];
-                                message.members = conversation.memberList;
+                            const temStationSupervisorList = [];
-                                if (member) {
+                            const temMaintainerList = [];
-                                    message.self = this.$store.state.userId == member.userId;
+                            const temDriverList = [];
+                            this.$store.state.training.memberList.forEach(item =>{
+                                switch (item.type) {
+                                case 'DISPATCHER':
+                                    temDispatcherList.push({memberId: item.id, connect:true });
+                                    break;
+                                case 'STATION_SUPERVISOR':
+                                    temStationSupervisorList.push({memberId: item.id, connect:true });
+                                    break;
+                                case 'MAINTAINER':
+                                    temMaintainerList.push({memberId: item.id, connect:true });
+                                    break;
+                                case 'DRIVER':
+                                    temDriverList.push({memberId: item.id, connect:true });
+                                    break;
                                 }
-                                messageList.push(message);
                             });
+                            this.conversitionMemberList = [...temDispatcherList, ...temStationSupervisorList, ...temMaintainerList, ...temDriverList];
                         } else {
                             const user = this.simulationUsers[this.$store.state.user.id];
                             this.isConversitionCreator = conversation.creatorId == user.memberId;
@@ -567,47 +593,35 @@ export default {
                                         if (member) {
                                             message.self = this.$store.state.userId == member.userId;
                                         }
+                                        this.privateMessageList.push(message);
                                         this.messageList.push(message);
                                     });
                                 }
                             });
                         }
                     });
-                    this.messageList = messageList.sort(this.sortByMessageTime);
                 }
             });
-            this.conversitionMemberList = [];
-            const temDispatcherList = [];
-            const temStationSupervisorList = [];
-            const temMaintainerList = [];
-            const temDriverList = [];
-            this.$store.state.training.memberList.forEach(item =>{
-                switch (item.type) {
-                case 'DISPATCHER':
-                    temDispatcherList.push({memberId: item.id, connect:true });
-                    break;
-                case 'STATION_SUPERVISOR':
-                    temStationSupervisorList.push({memberId: item.id, connect:true });
-                    break;
-                case 'MAINTAINER':
-                    temMaintainerList.push({memberId: item.id, connect:true });
-                    break;
-                case 'DRIVER':
-                    temDriverList.push({memberId: item.id, connect:true });
-                    break;
-                }
-            });
-            this.conversitionMemberList = [...temDispatcherList, ...temStationSupervisorList, ...temMaintainerList, ...temDriverList];
         },
         changeMessageList(data) {
             this.messageList.push(data);
+            this.commonMessageList.push(data);
+            if (this.userRole !== 'AUDIENCE') {
+                this.privateMessageList.push(data);
+            }
+        },
+        goCommonConversation() {
+            !this.commonConversation && this.$refs.chatContent && this.$refs.chatContent.conversationChange();
+            this.commonConversation = true;
+            this.conversitionMemberList = this.commonMemberList;
+            this.messageList = this.commonMemberList;
+        },
+        cancelCommonConversation() {
+            this.commonConversation && this.$refs.chatContent && this.$refs.chatContent.conversationChange();
+            this.commonConversation = false;
+            this.conversitionMemberList = this.privateMemberList;
+            this.messageList = this.privateMessageList;
         }
-        // goCommonConversation() {
-        //     this.commonConversation = true;
-        // },
-        // cancelCommonConversation() {
-        //     this.commonConversation = false;
-        // }
     }
 };
 </script>

src/views/newMap/jointTrainingNew/chatView/chatContent.vue

@@ -93,37 +93,13 @@ export default {
         // this.inintData();
     },
     methods:{
-        inintData() {
-            // if (this.coversition.id) {
-            //     getSimulationContextListNew(this.$route.query.group, this.coversition.id).then(res=>{
-            //         const userId = this.$store.state.user.id;
-            //         const coversitionList = res.data.map(coversition=>{
-            //             coversition.self = false;
-            //             if (coversition.member.userId == userId) {
-            //                 coversition.self = true;
-            //             }
-            //             coversition.src = coversition.isAudio ? `/audio/${coversition.audioPath}` : '';
-            //             coversition.targetUser = coversition.targetMember ? coversition.targetMember : 'All';
-            //             return coversition;
-            //         });
-            //         this.chatContentList = coversitionList;
-            //         this.scrollTop();
-            //     });
-            // }
-            // const coversitionListAll = Object.assign({}, this.$store.state.socket.coversitionList);
-            // const coversitionList = coversitionListAll[this.coversition.id] || [];
-            // // console.log('inintData---coversitionList' + JSON.stringify(this.$store.state.socket.coversitionList[this.coversition.id]));
-            // this.chatContentList = coversitionList;
-        },
         scrollTop() {
             this.$nextTick(function() {
                 const scrollTop = document.querySelector('.chatcontentInner').offsetHeight - document.querySelector('.chatcontentIn').offsetHeight + 30;
                 document.querySelector('.chatcontentIn').scrollTop = scrollTop;
             });
         },
-        // formatTime(time) {
+
-        //     return /\d{2}:\d{2}:\d{2}/.exec(time)[0] || time;
-        // },
         playAllAudio() {
             this.playEachAudio(this.currentAudioList[this.currentAudioIndex]);
         },
@@ -171,6 +147,9 @@ export default {
         playAudio(audioUrl) {
             document.querySelector('#audioPlay').src = audioUrl;
             document.querySelector('#audioPlay').play();
+        },
+        conversationChange() {
+
         }
     }
 };