save

src/App.vue

@@ -15,7 +15,7 @@
         <v-footer></v-footer>
       </div>
     </el-container>
-    <chat :showChat="showChat" :currentUser="{}"></chat>
+    <chat :showChat="showChat" :currentChat="currentChat"></chat>
   </div>
 </template>
 <script>
@@ -30,7 +30,7 @@ import {
   ssoLogin,
   bindDragHeader
 } from "./utils/utils.js";
-import { mapActions, mapGetters } from "vuex";
+import { mapActions, mapGetters, mapState } from "vuex";
 import { getInnerLoginUrl } from "./utils/index";
 let vm = null;
 export default {
@@ -46,10 +46,13 @@ export default {
       userName: "",
 			authList: [],
 			systemType: 0,
-      showChat:true
     };
   },
   computed: {
+    ...mapState({
+      showChat: 'showChat',
+      currentChat: 'currentChat',
+    }),
     ...mapGetters(["_token"])
   },
   created() {

src/components/IM/chat.scss

@@ -49,6 +49,7 @@
           }
         }
         .msg-content {
+          height: 400px;
           background: #F0F2F5;
           word-break: break-all;
           overflow: scroll;
@@ -303,7 +304,7 @@
           }
           .cr{
             color: #ffffff;
-            .mid-text, .live-notice, .time-box, .diagnosis-box{
+            .mid-text, .live-notice, .time-box, .diagnosis-box, .suggession-box{
               background: #449284;
               .time{
                 color: #ffffff;

src/components/IM/chat.vue

@@ -12,10 +12,10 @@
               <span class="dep">&nbsp;内科</span>
             </div>
             <div class="c-header-edit">
-            <span class="edit-img">
+            <span class="edit-img" @click="overFn">
               <img src="../../assets/image/IM/im_close.png" alt />
             </span>
-              <span class="edit-img">
+              <span class="edit-img" @click="closeChat">
   <img src="../../assets/image/IM/im_close2.png" alt />
             </span>
               <span class="edit-img">
@@ -197,14 +197,17 @@
         <el-button size="small" type="primary" @click="sendLinkMsg">确 定</el-button>
       </div>
     </el-dialog>
+    <alert ref="alert"></alert>
   </div>
 </template>
 <script>
 import BreadCrumb from "@/components/breadcrumb.vue";
+import alert from "@/components/common/alert.vue";
 import diagnosisLive from "./diagnosis-live";
 import { doUpload, getFilePath } from "@/utils/qiniu-util";
 import { openLoading, closeLoading, betaHandle } from "@/utils/utils";
 import { getPicaKFAccid, getPhomeDemain } from "@/utils";
+import {mapState} from "vuex";
 const CONTAINER_HEIGHT = 700;
 let forwardMsgIntervalId = null,
   continueIntervalId = null,
@@ -215,18 +218,14 @@ let _this = null;
 export default {
   components: {
     BreadCrumb,
-    diagnosisLive
+    diagnosisLive,
+    alert
   },
   props: {
     showChat: {
       type: Boolean,
       default: false,
     },
-    currentUser: {
-      type: Object,
-      default: {},
-    }
-
   },
   data() {
     return {
@@ -273,6 +272,9 @@ export default {
   },
 
   computed: {
+    ...mapState({
+      currentChat: 'currentChat',
+    }),
     canSend() {
       return !!this.sendText;
     }
@@ -296,28 +298,16 @@ export default {
     // 监听到有变化，就缓存一下
     sendText(newText) {
       cacheMap[this.currentSession.id] = newText || "";
+    },
+    currentChat (newVal, oldVal) {
+      if(newVal !== oldVal && newVal.imTeamId){
+        this.chatInit();
+      }
     }
   },
 
   created() {
-    _this = this;
-    this.picakfAccId = getPicaKFAccid();
-    this.tid = this.$route.query.tid || '3868439091';
-    this.getFiveContentList();
-    autoCompletionIntervalId && clearInterval(autoCompletionIntervalId);
-    autoCompletionIntervalId = setInterval(() => {
-      this.autoCompletionInterval();
-    }, 2000);
-
-    // 监听键盘的回车按键（回车时发送消息，并阻止其在textarea中的回车换行行为）
-    document.onkeydown = function(ev) {
-      var event = ev || event;
-      if (event.keyCode == 13) {
-        _this.sendTextMsg();
-        event.preventDefault();
-      }
-    };
-    this.getMembersList(); // 获取群聊成员信息
+
   },
 
   mounted() {
@@ -330,6 +320,28 @@ export default {
   },
 
   methods: {
+    chatInit () {
+      _this = this;
+      this.picakfAccId = getPicaKFAccid();
+      const {imTeamId} = this.currentChat;
+      this.tid = imTeamId || '3853944746';
+      console.log('--this.currentChat', this.currentChat);
+      this.getFiveContentList();
+      autoCompletionIntervalId && clearInterval(autoCompletionIntervalId);
+      autoCompletionIntervalId = setInterval(() => {
+        this.autoCompletionInterval();
+      }, 2000);
+
+      // 监听键盘的回车按键（回车时发送消息，并阻止其在textarea中的回车换行行为）
+      document.onkeydown = function(ev) {
+        var event = ev || event;
+        if (event.keyCode == 13) {
+          _this.sendTextMsg();
+          event.preventDefault();
+        }
+      };
+      this.getMembersList(); // 获取群聊成员信息
+    },
     // 含有敏感信息的消息，自行补全提示文案
     // 每30秒监测敏感信息
     autoCompletionInterval() {
@@ -890,6 +902,62 @@ export default {
       return betaHandle(val);
     },
 
+    closeChat () {
+      window.rtc.leave();
+      this.clearSession();
+      this.$store.commit('updateShowChat', false);
+      this.$store.commit('updateCurrentChat', {});
+    },
+
+    clearSession() {
+      sessionStorage.removeItem("TIME_askTime");
+      sessionStorage.removeItem("TIME_answerTime");
+      sessionStorage.removeItem("TIME_useTime");
+      sessionStorage.removeItem("TIME_loseTime");
+    },
+
+    // 结束会话
+    overFn() {
+      this.$refs.alert
+        .init({
+          cancleTxt: "取消",
+          confirmTxt: "我知道了",
+          title: `确定要结束会话么？`,
+        })
+        .then(() => {
+          this.out();
+        })
+        .catch((err) => {});
+    },
+    out() {
+      const {diagnoseLogId} = this.currentChat;
+      let url = `/diagnose/admin/diagnose/endCall/${diagnoseLogId}`;
+      let params = {};
+      this.POST(url, params)
+        .then((res) => {
+          if (res.code == "000000") {
+            this.closeChat();
+          } else {
+            this.$refs.alert
+              .init({
+                confirmTxt: "我知道了",
+                title: `操作失败,请稍后重试`,
+              })
+              .then(() => {})
+              .catch((err) => {});
+          }
+        })
+        .catch(() => {
+          this.$refs.alert
+            .init({
+              confirmTxt: "我知道了",
+              title: `操作失败,请稍后重试`,
+            })
+            .then(() => {})
+            .catch((err) => {});
+        });
+    },
+
   },
 
   beforeDestroy() {

src/components/IM/diagnosis-live.vue

@@ -39,11 +39,11 @@
         </div>
       </div>
       <div class="vedio-man">
-        <p class="man-img">
-          <img :src="im_man1" alt />
+        <p class="man-img" @click="toggleVol">
+          <img :src="isMuted ? im_man2: im_man1" alt />
         </p>
         <p class="man-txt">
-          已接入
+          {{isMuted ? '已静音' : '已接入'}}
         </p>
       </div>
     </div>
@@ -109,11 +109,12 @@ export default {
       memberList: [],
       tid: "", // 群id
       diagnoseLogId: "", //问诊id
+      isMuted: false
     };
   },
   created() {
-    this.tid = this.$route.query.tid || "3868439091";
-    this.diagnoseLogId = this.$route.query.diagnoseLogId || "38";
+    this.tid = this.$route.query.tid || "3853944746";
+    this.diagnoseLogId = this.$route.query.diagnoseLogId || "35";
     // openLoading(this);
     this.init();
   },
@@ -145,9 +146,14 @@ export default {
         });
       }
     },
-    // 设置item
-    setItem(data, item) {
-      item.timeleft = 0;
+    toggleVol () {
+      if(this.isMuted){
+        this.rtc.unmuteLocalAudio();
+      }else{
+        this.rtc.muteLocalAudio();
+      }
+      this.isMuted = !this.isMuted;
+
     },
     // 主动呼叫
     drivingCall(data) {
@@ -288,6 +294,7 @@ export default {
         vueInstance: this,
       };
       this.rtc = new RtcClient(obj);
+      window.rtc = this.rtc;
       this.$nextTick(() => {
         this.$refs.alert
           .init({

src/components/common/diagnoseAdvice.vue

@@ -8,13 +8,10 @@
     <div class="center">
      <span>诊断建议</span> <el-input rows="10" type="textarea" v-model="formData.advice" placeholder="请输入内容"></el-input>
     </div>
-    <el-form>
-    <el-form-item label="系统录音/录像">
-    <el-form-item >
-      <el-link href="" target="_blank"> .mp4</el-link>
-    </el-form-item>
-  </el-form-item>
-    </el-form>
+    <div class="record">
+      <span>录音/录像</span>
+      <el-link href="" target="_blank">___________ .mp4</el-link>
+      </div>
     <div class="footer">
        <el-button type="primary" style="height:35px">提交保存</el-button>
     </div>
@@ -40,11 +37,12 @@ export default {
 <style lang="scss" scoped>
   .diagnoseAdvice{
     position: absolute;
-    top: 20px;
+    top: 125px;
     right: 20px;
     z-index: 1000;
     width: 500px;
     height: 600px;
+    padding: 5px 5px 5px 6px;
     background: #ffffff;
     box-shadow: 10px 10px 50px 0px #d9d9d9;
     overflow: hidden;
@@ -90,11 +88,16 @@ export default {
         }
       }
     }
+    .record{
+      padding-left: 28px;
+      margin-top: 45px;
+    }
     .footer{
       position: absolute;
       width: 500px;
       height: 50px;
       bottom: 0;
+      left: 0;
       text-align: center;
       margin-top: 5px;
       display: flex;

src/components/common/inquirylist.vue

@@ -42,7 +42,7 @@
               </div>
             </div>
             <div class="inquiryroom">
-              <div class="goroom"><span v-if="nomor">进入诊室</span><span v-else>正在呼叫医助，进入诊室</span> </div>
+              <div class="goroom"><span v-if="nomor" @click="openChat">进入诊室</span><span v-else>正在呼叫医助，进入诊室</span> </div>
               <div class="suggest" @click="showAdvice()">诊断建议 <div class="writesuggest" v-if="inquiry.write">未写</div></div>
             </div>
           </el-card>
@@ -54,6 +54,7 @@
 
 <script>
 import DiagnoseAdvice from '@/components/common/diagnoseAdvice.vue'
+import { mapState } from "vuex";
 export default {
   components:{
     DiagnoseAdvice
@@ -86,6 +87,9 @@ export default {
   created() {
   },
   computed:{
+    ...mapState({
+      showChat: 'showChat',
+    }),
     diagnoseType() {
       switch(this.item.diagnoseType) {
         case 1:
@@ -148,6 +152,21 @@ export default {
     },
     showAdvice() {
       this.showAdvices = true
+    },
+    openChat () {
+      if(this.showChat){
+        this.$message({
+          message: '不可同时进入多个诊室，请先退出已进入的诊室，再试。',
+          type: "warning",
+          duration:1000
+        });
+        return false;
+      }
+      const i = this.item;
+      if(i.imTeamId){
+        this.$store.commit('updateShowChat', true);
+        this.$store.commit('updateCurrentChat', i);
+      }
     }
   }
 }

src/store/module/socket.js

 // ES6 import
+import store from '../';
 import io from 'socket.io-client';
 
 export default {
@@ -14,7 +15,6 @@ export default {
           loginUserNum: `diagnose_list_socket_888`
         }
       });
-      console.log('-=-=-=-=',socket)
       commit('SET_SOCKET', socket);
       commit('SET_IOLISTION');
     },
@@ -40,6 +40,16 @@ export default {
       });
       state.socketClient.on("diagnose_push_event", (socket) => {
         console.log('diagnose_push_event---', socket);
+        const {list, countRespList} = socket;
+        store.commit('updateCurrentDiagList', list);
+        store.commit('updateCurrentCalList', countRespList);
+      });
+      state.socketClient.on("diagnose_call_push_event", (socket) => {
+        console.log('diagnose_call_push_event---', socket);
+        const l = store.noticeList;
+        l.push(socket);
+        store.commit('updateNoticeList', l);
+
       });
       state.socketClient.on('ping', function () {
         console.log('[E] 心跳请求已发出 →', true);

src/store/mutations/index.js

+export default {
+  updateCurrentDiagList(state, obj) {
+    state.currentDiagList = obj;
+  },
+  updateCurrentCalList(state, obj) {
+    state.currentCalList = obj;
+  },
+  updateCurrentChat(state, obj) {
+    state.currentChat = obj;
+  },
+  updateShowChat(state, obj) {
+    state.showChat = obj;
+  },
+  updateNoticeList(state, obj) {
+    state.noticeList = obj;
+  },
+};

src/store/state.js

 /* 内存数据状态 */
 
 export default {
+  currentDiagList:[],
+  currentCalList:{},
+  currentChat: {},
+  noticeList: [],
+  showChat:false
 };

src/views/IM/diagnosis-admin/workbench.vue

@@ -20,23 +20,18 @@
         <!-- tab栏 -->
       <div id="radio">
       <el-radio-group v-model="tabPosition" style="margin-bottom: 30px;" >
-      <el-radio-button label="all">全部(0)</el-radio-button>
-      <el-radio-button label="abnormal">异常(0)</el-radio-button>
-      <el-radio-button label="consultation">问诊中(0)</el-radio-button>
-      <el-radio-button label="Notstarted">未开始(0)</el-radio-button>
-      <el-radio-button label="Hasended">已结束(0)</el-radio-button>
-      <el-radio-button label="Cancelled">已取消(0)</el-radio-button>
+      <el-radio-button label="all">全部({{currentCalList}})</el-radio-button>
+      <el-radio-button label="abnormal">异常({{currentCalList}})</el-radio-button>
+      <el-radio-button label="consultation">问诊中({{currentCalList}})</el-radio-button>
+      <el-radio-button label="Notstarted">未开始({{currentCalList}})</el-radio-button>
+      <el-radio-button label="Hasended">已结束({{currentCalList}})</el-radio-button>
+      <el-radio-button label="Cancelled">已取消({{currentCalList}})</el-radio-button>
       </el-radio-group>
-      <el-row :gutter="25">
-        <el-col style="margin-bottom: 20px;" :span="8" v-for="item in 9 " :key="item">
-            <div class="grid-content bg-purple">
-                <div class="for">
-                  <inquiryList-component></inquiryList-component>
-                </div>
-             </div>
-         </el-col>
-      </el-row>
-
+      <div class="forbox">
+        <div class="for" v-for="(item, index) in currentDiagList" :key="'for'+index">
+          <inquiryList-component :item="item"></inquiryList-component>
+        </div>
+      </div>
       </div>
       <el-row type="flex" justify="end" >
         <el-pagination
@@ -56,22 +51,55 @@
 </template>
 
 <script>
+import { mapState } from "vuex";
 import InquiryListComponent from '../../../components/common/inquirylist.vue';
-console.log('---InquiryList', InquiryListComponent);
 export default {
   components: {
     InquiryListComponent
+  },
+  computed:{
+    ...mapState({
+      currentDiagList: 'currentDiagList',
+      currentCalList: 'currentCalList'
+    }),
   },
    data(){
      return {
        tabPosition:"all",
        value1:Date.now(),
        currentPage4:0,
-       showChat: true
+       showChat: true,
+       list: [
+          {
+            "appointBeginTime": "2021-07-29T05:28:57.396Z",
+            "appointEndTime": "2021-07-29T05:28:57.396Z",
+            "department": "内科",
+            "departmentId": 3876,
+            "diagnoseLogId": 3876,
+            "diagnoseType": 1,
+            "doctorCallKfStatus": 1,
+            "doctorCallTime": "",
+            "doctorId": 0,
+            "doctorMobile": "16789987665",
+            "doctorName": "孙思邈",
+            "doctorTrtcEntryStatus": 1,
+            "imStatus": 0,
+            "imTeamId": "3853944746",
+            "returnStatus": 1,
+            "roomId": "string",
+            "sort": 0,
+            "status": 0,
+            "userCallKfStatus": 0,
+            "userCallTime": "",
+            "userId": 0,
+            "userMobile": "12343123233",
+            "userName": "孙思邈",
+            "userTrtcEntryStatus": 0
+          }
+        ]
      }
    },
    created(){
-       console.log(this);
    },
    methods:{
      handleSizeChange(){
@@ -91,12 +119,16 @@ export default {
         }
     }
 }
-.for{
-    width: 100%;
-    height: 200px;
-    background: #ccc;
-}
 
+
+.forbox{
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  .for{
+    display: flex;
+  }
+}
 </style>
 <style lang="scss" scoped>
 .diagnosis-list-content {