From 9c71d96bad37e81ece769f8eb9a4c3c766393b3c Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期三, 03 七月 2024 17:45:11 +0800
Subject: [PATCH] fix:修改socket
---
src/views/folder/index.vue | 37 ++++++++++++++++++++++++++++++-------
src/hooks/useWebScoket.js | 9 +++++----
2 files changed, 35 insertions(+), 11 deletions(-)
diff --git a/src/hooks/useWebScoket.js b/src/hooks/useWebScoket.js
index 5f3da78..bfa22e2 100644
--- a/src/hooks/useWebScoket.js
+++ b/src/hooks/useWebScoket.js
@@ -54,7 +54,7 @@
status.value = SocketStatus.Connected;
error.value = null;
startHeartBeat();
- if(connectCallBack) {
+ if (connectCallBack) {
connectCallBack();
}
};
@@ -172,11 +172,12 @@
};
onBeforeUnmount(() => {
- if (status.value === SocketStatus.Connected || status.value === SocketStatus.Connecting) {
- disconnect();
- }
+ disconnect();
});
+ window.addEventListener('unload', () => {
+ disconnect();
+ });
return {
status,
message,
diff --git a/src/views/folder/index.vue b/src/views/folder/index.vue
index 4b8ea61..d0b4d08 100644
--- a/src/views/folder/index.vue
+++ b/src/views/folder/index.vue
@@ -65,26 +65,37 @@
</div>
<!-- image鏌ョ湅 -->
- <div class="image-container" v-show="imageViewer">
+ <div class="image-container" v-show="imageViewer">
<el-image-viewer :url-list="imageList" @close="closeViewer"></el-image-viewer>
- </div>
+ </div>
- <!-- 瑙嗛鏌ョ湅 -->
- <div class="video-container">
+ <!-- 瑙嗛鏌ョ湅 -->
+ <div class="video-container">
- </div>
+ </div>
</div>
</template>
<script setup>
-import { ref } from 'vue';
+import { ref, onMounted } from 'vue';
+import { storeToRefs } from 'pinia';
import { Close } from '@element-plus/icons-vue';
import NormalHeader from '@/components/NormalHeader/index.vue';
import { Search } from '@element-plus/icons-vue';
import { getFileList } from '@/api/modules/file.js';
import PDFViewer from '@/components/PDFViewer/index.vue';
+import { useUserStore } from '@/store/index.js';
+import useWebScoket from '@/hooks/useWebScoket.js';
+
+const userStore = useUserStore();
+const { userInfo } = storeToRefs(userStore);
+const { status, message, error, connect, disconnect, sendMessage } = useWebScoket({
+ url: 'ws://192.168.3.64:8000/websocket/' + userInfo.value.id,
+ heartBeatData: 'ping'
+});
+
const fileType = {
'img': {
@@ -92,12 +103,14 @@
handle: (item) => {
console.log(item);
imageViewer.value = true;
+ sendMessage({ id: userInfo.value.id, command: 'startRecordTime' });
}
},
'video': {
iconPath: '/static/icons/file_type_video.png',
handle: (item) => {
console.log(item);
+ sendMessage({ id: userInfo.value.id, command: 'startRecordTime' });
}
},
'pdf': {
@@ -105,6 +118,7 @@
handle: (item) => {
console.log(item);
pdfViewer.value = true;
+ sendMessage({ id: userInfo.value.id, command: 'startRecordTime' });
}
},
};
@@ -151,13 +165,15 @@
const checkRow = (item) => {
fileType[item.type] && fileType[item.type].handle(item);
+
};
const closeViewer = () => {
pdfViewer.value = false;
imageViewer.value = false;
videoViewer.value = false;
-}
+ sendMessage({ id: userInfo.value.id, command: 'endRecordTime' });
+};
const getData = () => {
getFileList().then(res => {
@@ -166,6 +182,11 @@
};
getData();
+// -----------------------------------鐢熷懡鍛ㄦ湡
+onMounted(() => {
+ // 杩炴帴webscoket
+ connect();
+});
</script>
<style lang="scss" scoped>
@@ -191,11 +212,13 @@
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
+
.close-btn {
position: absolute;
top: 2px;
right: 30px;
z-index: 9999999;
+
:deep(.el-button) {
width: fit-content;
height: fit-content;
--
Gitblit v1.8.0