远程管理错误修复

src/views/index.vue

@@ -22,13 +22,13 @@
                     <Search/>
                   </el-icon>
                 </el-button>-->
-        <el-button text @click="userStore.showHomeMsg=true">
+<!--        <el-button text @click="userStore.showHomeMsg=true">
           <el-badge is-dot>
             <el-icon>
               <Bell/>
             </el-icon>
           </el-badge>
-        </el-button>
+        </el-button>-->
         <el-button text @click="toggleFullscreen">
           <el-icon>
             <FullScreen/>

src/views/remote-manage/part/remote-part.vue

@@ -156,6 +156,10 @@ function showData(i: any) {
     remoteWsStore.setCurrentTaskIndex(i)
     currentIndex = remoteWsStore.getCurrentTaskIndex()
     remoteItem.value = remoteWsStore.getRemoteTask()[currentIndex]
+    currentException = {}
+    if (remoteItem.value && remoteItem.value.patient) {
+        remoteWsStore.createVital(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date, currentIndex)
+    }
     getData()
 }
 

src/views/remote-manage/remote-control.vue

@@ -271,6 +271,12 @@ onUnmounted(() => {
     // remoteWsStore.unsubscribeMedicine(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date, index);
     remoteWsStore.unsubscribeVital(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date, currentIndex);
     remoteWsStore.disconnectChat(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date, currentIndex)
+    if (!router.currentRoute.value.path.startsWith("/remote-manage/")) {
+        const tasks: any = remoteWsStore.getRemoteTask()
+        tasks.forEach((task: any) => {
+            remoteWsStore.disconnect(task.patient, task.patientId, task.date, task.index)
+        })
+    }
 })
 
 function subscribeWS() {

src/views/remote-manage/remote-manage.vue

@@ -1,37 +1,37 @@
 <template>
-	<div class="remote-manage-page">
-		<div class="header-box">
-			<div class="thumbnail" @click="viewThumbnail">
-				<el-icon>
-					<Menu />
-				</el-icon>
-				<span>缩略图</span>
-			</div>
-			<div class="task-btn-item" v-for="(item, index) in remoteWsStore.remoteTasks" :key="'task-' + index"
-				:class="{ 'connecting': item.patient || item.patientId, 'alarm': item.isException }"
-				@click="editTask(item)" @dblclick="toRemoteControl(item)">
-				<span>{{ item.taskName || ('新建任务' + (index + 1)) }}</span>
-			</div>
-		</div>
-		<div class="content-box">
-			<div class="remote-box">
-				<RemotePart ref="remotePartRef" @addLogAfter="addLogAfter" @breakRemote="breakRemote" />
-			</div>
-			<div class="message-box">
-				<MessagePart ref="messagePartRef" />
-			</div>
-		</div>
-	</div>
-	<RemoteDialog ref="remoteDialogRef" @confirmRemote="confirmRemote" @errorRemote="errorRemote" />
+    <div class="remote-manage-page">
+        <div class="header-box">
+            <div class="thumbnail" @click="viewThumbnail">
+                <el-icon>
+                    <Menu/>
+                </el-icon>
+                <span>缩略图</span>
+            </div>
+            <div class="task-btn-item" v-for="(item, index) in remoteWsStore.remoteTasks" :key="'task-' + index"
+                 :class="{ 'connecting': item.patient || item.patientId, 'alarm': item.isException }"
+                 @click="editTask(item)" @dblclick="toRemoteControl(item)">
+                <span>{{ item.taskName || ('新建任务' + (index + 1)) }}</span>
+            </div>
+        </div>
+        <div class="content-box">
+            <div class="remote-box">
+                <RemotePart ref="remotePartRef" @addLogAfter="addLogAfter" @breakRemote="breakRemote"/>
+            </div>
+            <div class="message-box">
+                <MessagePart ref="messagePartRef"/>
+            </div>
+        </div>
+    </div>
+    <RemoteDialog ref="remoteDialogRef" @confirmRemote="confirmRemote" @errorRemote="errorRemote"/>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, ref } from 'vue'
-import { useRouter } from 'vue-router'
+import {onMounted, onUnmounted, ref} from 'vue'
+import {useRouter} from 'vue-router'
 import RemoteDialog from './part/remote-dialog.vue'
 import RemotePart from './part/remote-part.vue'
 import MessagePart from './part/message-part.vue'
-import { useRemoteWsStore } from "@/stores/remote-ws-store";
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 const router = useRouter()
 const remotePartRef = ref()
@@ -40,179 +40,187 @@ const remoteDialogRef = ref()
 const remoteWsStore = useRemoteWsStore();
 
 onMounted(() => {
-	initRemoteTask()
+    initRemoteTask()
+})
+
+onUnmounted(() => {
+    if (!router.currentRoute.value.path.startsWith("/remote-manage/")) {
+        const tasks: any = remoteWsStore.getRemoteTask()
+        tasks.forEach((task: any) => {
+            remoteWsStore.disconnect(task.patient, task.patientId, task.date, task.index)
+        })
+    }
 })
 
 function initRemoteTask() {
-	remoteWsStore.initRemoteTask()
-	remotePartRef.value.showData(remoteWsStore.getCurrentTaskIndex());
+    remoteWsStore.initRemoteTask()
+    remotePartRef.value.showData(remoteWsStore.getCurrentTaskIndex());
 }
 
 const viewThumbnail = () => {
-	router.push({
-		path: '/remote-manage/remote-thumbnail',
-		query: {
-		}
-	})
+    router.push({
+        path: '/remote-manage/remote-thumbnail',
+        query: {}
+    })
 }
 // 打开任务连接弹窗
 const editTask = (item: any) => {
-	// 如果当前任务是已连接状态则直接渲染content 否则打开弹窗
-	if (item.isRemote) {
-		remotePartRef.value.showData(item.index)
-	} else {
-		remoteDialogRef.value.open(item.index)
-	}
+    // 如果当前任务是已连接状态则直接渲染content 否则打开弹窗
+    if (item.isRemote) {
+        remotePartRef.value.showData(item.index)
+    } else {
+        remoteDialogRef.value.open(item.index)
+    }
 }
 // 跳转到远程查看
 const toRemoteControl = (item: any) => {
-	// 如果当前任务是已连接状态则跳转，否则打开弹窗
-	if (item.isRemote) {
-		remoteWsStore.setCurrentTaskIndex(item.index)
-		router.push('/remote-manage/remote-control')
-	} else {
-		remoteDialogRef.value.open(item.index)
-	}
+    // 如果当前任务是已连接状态则跳转，否则打开弹窗
+    if (item.isRemote) {
+        remoteWsStore.setCurrentTaskIndex(item.index)
+        router.push('/remote-manage/remote-control')
+    } else {
+        remoteDialogRef.value.open(item.index)
+    }
 }
 // 连接成功
 const confirmRemote = () => {
-	messagePartRef.value.scrollToBottom()
-	// 状态设置为可连接
-	remotePartRef.value.initData()
+    messagePartRef.value.scrollToBottom()
+    // 状态设置为可连接
+    remotePartRef.value.initData()
 }
 // 连接失败
 const errorRemote = () => {
-	messagePartRef.value.scrollToBottom()
+    messagePartRef.value.scrollToBottom()
 }
 // 断开连接
 const breakRemote = () => {
-	messagePartRef.value.scrollToBottom()
+    messagePartRef.value.scrollToBottom()
 }
 const addLogAfter = () => {
-	messagePartRef.value.scrollToBottom()
+    messagePartRef.value.scrollToBottom()
 }
 
 </script>
 
 <style lang='scss' scoped>
 .remote-manage-page {
-	width: 100%;
-	height: 100%;
-	padding-top: 15px;
-	overflow-y: auto;
-	overflow-x: hidden;
+    width: 100%;
+    height: 100%;
+    padding-top: 15px;
+    overflow-y: auto;
+    overflow-x: hidden;
 
-	.header-box {
-		position: relative;
-		width: 100%;
-		min-height: 180px;
-		background: white;
-		padding: 0 30px;
-		display: flex;
-		flex-wrap: wrap;
+    .header-box {
+        position: relative;
+        width: 100%;
+        min-height: 180px;
+        background: white;
+        padding: 0 30px;
+        display: flex;
+        flex-wrap: wrap;
 
-		.thumbnail {
-			cursor: pointer;
-			position: absolute;
-			width: 70px;
-			height: 70px;
-			top: 0;
-			right: 0;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			background: #f8b300;
-			border-top-left-radius: 35px;
-			border-bottom-left-radius: 35px;
-			box-shadow: -3px 3px 5px 0 rgba(black, .2);
-			font-size: 20px;
-			color: white;
-			transition: all .1s;
+        .thumbnail {
+            cursor: pointer;
+            position: absolute;
+            width: 70px;
+            height: 70px;
+            top: 0;
+            right: 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            background: #f8b300;
+            border-top-left-radius: 35px;
+            border-bottom-left-radius: 35px;
+            box-shadow: -3px 3px 5px 0 rgba(black, .2);
+            font-size: 20px;
+            color: white;
+            transition: all .1s;
 
-			.el-icon {
-				font-size: 1.4em;
-			}
+            .el-icon {
+                font-size: 1.4em;
+            }
 
-			&>span {
-				display: none;
-				margin-left: 5px;
-				line-height: 1;
-				white-space: nowrap;
-			}
+            & > span {
+                display: none;
+                margin-left: 5px;
+                line-height: 1;
+                white-space: nowrap;
+            }
 
-			&:hover {
-				width: 160px;
-				transition: all .3s;
+            &:hover {
+                width: 160px;
+                transition: all .3s;
 
-				&>span {
-					display: block;
-				}
-			}
-		}
+                & > span {
+                    display: block;
+                }
+            }
+        }
 
-		.task-btn-item {
-			cursor: pointer;
-			flex-grow: 1;
-			width: 17%;
-			min-width: 200px;
-			height: 70px;
-			margin: 10px 20px;
-			border: 2px solid $main-color;
-			color: $main-color;
-			border-radius: 5px;
-			font-size: 20px;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			transition: all .6s;
+        .task-btn-item {
+            cursor: pointer;
+            flex-grow: 1;
+            width: 17%;
+            min-width: 200px;
+            height: 70px;
+            margin: 10px 20px;
+            border: 2px solid $main-color;
+            color: $main-color;
+            border-radius: 5px;
+            font-size: 20px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            transition: all .6s;
 
-			&:hover {
-				background: rgba($main-color, .1);
-				transition: all .6s;
-			}
+            &:hover {
+                background: rgba($main-color, .1);
+                transition: all .6s;
+            }
 
-			&.connecting {
-				background: $main-color;
-				color: white;
+            &.connecting {
+                background: $main-color;
+                color: white;
 
-				&:hover {
-					background: rgba($main-color, .8);
-				}
-			}
+                &:hover {
+                    background: rgba($main-color, .8);
+                }
+            }
 
-			&.alarm {
-				background: #f80000;
-				border-color: #f80000;
-				color: white;
+            &.alarm {
+                background: #f80000;
+                border-color: #f80000;
+                color: white;
 
-				&:hover {
-					background: rgba(#f80000, .8);
-				}
-			}
-		}
-	}
+                &:hover {
+                    background: rgba(#f80000, .8);
+                }
+            }
+        }
+    }
 
-	.content-box {
-		width: 100%;
-		height: calc(100% - 195px);
-		min-height: 600px;
-		margin-top: 15px;
-		background: white;
-		padding: 20px 50px;
-		display: flex;
-		justify-content: space-between;
+    .content-box {
+        width: 100%;
+        height: calc(100% - 195px);
+        min-height: 600px;
+        margin-top: 15px;
+        background: white;
+        padding: 20px 50px;
+        display: flex;
+        justify-content: space-between;
 
-		.remote-box {
-			width: calc(100% - 370px);
-			flex-grow: 1;
-			height: 100%;
-		}
+        .remote-box {
+            width: calc(100% - 370px);
+            flex-grow: 1;
+            height: 100%;
+        }
 
-		.message-box {
-			width: 350px;
-			height: 100%;
-			margin-left: 20px;
-		}
-	}
+        .message-box {
+            width: 350px;
+            height: 100%;
+            margin-left: 20px;
+        }
+    }
 }
 </style>

src/views/remote-manage/remote-thumbnail.vue

@@ -1,36 +1,40 @@
 <template>
-  <el-scrollbar style="width: 100%;height: 100%;">
-    <div class="remote-thumbnail-page">
-      <div class="remote-box row1">
-        <div class="remote-item" v-for="item in remoteTask.slice(0, 4)" :key="item.title" @click="openRemote(item)">
-          <RemoteItemPart :ref="'remoteItemPartRef' + item.index" :index="item.index" @addLogAfter="addLogAfter">
-          </RemoteItemPart>
+    <el-scrollbar style="width: 100%;height: 100%;">
+        <div class="remote-thumbnail-page">
+            <div class="remote-box row1">
+                <div class="remote-item" v-for="item in remoteTask.slice(0, 4)" :key="item.title"
+                     @click="openRemote(item)">
+                    <RemoteItemPart :ref="'remoteItemPartRef' + item.index" :index="item.index"
+                                    @addLogAfter="addLogAfter">
+                    </RemoteItemPart>
+                </div>
+            </div>
+            <div class="remote-box row2">
+                <div class="left-box">
+                    <div class="remote-item" v-for="item in remoteTask.slice(4)" :key="item.title"
+                         @click="openRemote(item)">
+                        <RemoteItemPart :ref="'remoteItemPartRef' + item.index" :index="item.index"
+                                        @addLogAfter="addLogAfter">
+                        </RemoteItemPart>
+                    </div>
+                </div>
+                <div class="right-box">
+                    <div class="message-title">异常信息</div>
+                    <div class="message-item" v-for="item in remoteTask" :key="'message-item' + item">
+                        <MessageItemPart ref="messageItemPartRef" :index="item.index"></MessageItemPart>
+                    </div>
+                </div>
+            </div>
         </div>
-      </div>
-      <div class="remote-box row2">
-        <div class="left-box">
-          <div class="remote-item" v-for="item in remoteTask.slice(4)" :key="item.title" @click="openRemote(item)">
-            <RemoteItemPart :ref="'remoteItemPartRef' + item.index" :index="item.index" @addLogAfter="addLogAfter">
-            </RemoteItemPart>
-          </div>
-        </div>
-        <div class="right-box">
-          <div class="message-title">异常信息</div>
-          <div class="message-item" v-for="item in remoteTask" :key="'message-item' + item">
-            <MessageItemPart ref="messageItemPartRef" :index="item.index"></MessageItemPart>
-          </div>
-        </div>
-      </div>
-    </div>
-  </el-scrollbar>
+    </el-scrollbar>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, ref } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
+import {onMounted, onUnmounted, ref} from 'vue';
+import {useRoute, useRouter} from 'vue-router';
 import RemoteItemPart from './part/remote-item-part.vue';
 import MessageItemPart from './part/message-item-part.vue';
-import { useRemoteWsStore } from "@/stores/remote-ws-store";
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 const route = useRoute();
 const router = useRouter();
@@ -39,15 +43,24 @@ const remoteTask = ref([] as any);
 const remoteWsStore = useRemoteWsStore();
 
 onMounted(() => {
-  remoteTask.value = remoteWsStore.getRemoteTask();
+    remoteTask.value = remoteWsStore.getRemoteTask();
+})
+
+onUnmounted(() => {
+    if (!router.currentRoute.value.path.startsWith("/remote-manage/")) {
+        const tasks: any = remoteWsStore.getRemoteTask()
+        tasks.forEach((task: any) => {
+            remoteWsStore.disconnect(task.patient, task.patientId, task.date, task.index)
+        })
+    }
 })
 
 const openRemote = (params: any) => {
-  remoteWsStore.setCurrentTaskIndex(params.index)
-  router.push('/remote-manage/remote-manage');
+    remoteWsStore.setCurrentTaskIndex(params.index)
+    router.push('/remote-manage/remote-manage');
 }
 const addLogAfter = (index: number) => {
-  messageItemPartRef.value[index].scrollToBottom()
+    messageItemPartRef.value[index].scrollToBottom()
 }
 
 </script>
@@ -56,66 +69,66 @@ const addLogAfter = (index: number) => {
 $size: 20px;
 
 .remote-thumbnail-page {
-  width: 100%;
-  height: 1010px;
-  overflow: auto;
-
-  .remote-box {
     width: 100%;
-    height: 33.33%;
-    display: flex;
+    height: 1010px;
+    overflow: auto;
 
-    .remote-item {
-      width: 25%;
-      height: 100%;
-      padding: $size*0.2;
-    }
-
-    &.row2 {
-      height: 66.67%;
-
-      .left-box {
-        width: 75%;
-        height: 100%;
+    .remote-box {
+        width: 100%;
+        height: 33.33%;
         display: flex;
-        flex-wrap: wrap;
 
         .remote-item {
-          width: 33.33%;
-          height: 50%;
-        }
-      }
-
-      .right-box {
-        position: relative;
-        width: 25%;
-        height: 100%;
-        padding: $size*0.1;
-        padding-top: $size*0.2 + $size;
-        display: flex;
-        flex-wrap: wrap;
-
-        .message-title {
-          position: absolute;
-          height: $size;
-          top: $size*0.2;
-          left: $size*0.2;
-          right: $size*0.2;
-          background-color: $red;
-          text-align: center;
-          font-size: $size*0.7;
-          line-height: $size;
-          color: white;
-          font-weight: 600;
+            width: 25%;
+            height: 100%;
+            padding: $size*0.2;
         }
 
-        .message-item {
-          width: 50%;
-          height: 20%;
-          padding: $size*0.2;
+        &.row2 {
+            height: 66.67%;
+
+            .left-box {
+                width: 75%;
+                height: 100%;
+                display: flex;
+                flex-wrap: wrap;
+
+                .remote-item {
+                    width: 33.33%;
+                    height: 50%;
+                }
+            }
+
+            .right-box {
+                position: relative;
+                width: 25%;
+                height: 100%;
+                padding: $size*0.1;
+                padding-top: $size*0.2 + $size;
+                display: flex;
+                flex-wrap: wrap;
+
+                .message-title {
+                    position: absolute;
+                    height: $size;
+                    top: $size*0.2;
+                    left: $size*0.2;
+                    right: $size*0.2;
+                    background-color: $red;
+                    text-align: center;
+                    font-size: $size*0.7;
+                    line-height: $size;
+                    color: white;
+                    font-weight: 600;
+                }
+
+                .message-item {
+                    width: 50%;
+                    height: 20%;
+                    padding: $size*0.2;
+                }
+            }
         }
-      }
     }
-  }
 }
 </style>