Merge branch 'refs/heads/dev'

# Conflicts:
#	src/views/login/login.vue
#	src/views/remote-manage/part/remote-dialog.vue

package.json

@@ -12,7 +12,7 @@
   "dependencies": {
     "@stomp/stompjs": "^7.0.0",
     "axios": "^1.3.3",
-    "crypto-js": "4.2.0",
+    "crypto-js": "^4.2.0",
     "echarts": "^5.4.1",
     "element-plus": "2.3.1",
     "js-cookie": "^3.0.5",

src/api/daily-plan.ts

@@ -0,0 +1,57 @@
+import request from "@/utils/request";
+
+const addDailyPlanUrl = "/admin/dailyPlan/saveOrUpdate";
+const getDailyPlanListUrl = "/admin/dailyPlan/getListByDate";
+const deleteByIdUrl = "/admin/dailyPlan/deleteById";
+const getPlanDateListUrl = "/admin/dailyPlan/getPlanDateList";
+const getTodoCountByDateUrl = "/admin/dailyPlan/getTodoCountByDate";
+
+export function saveOrUpdate(param: any) {
+	return new Promise((resolve, reject) => {
+		request.postForm(addDailyPlanUrl, param).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	})
+}
+
+export function getDailyPlanList(date: string) {
+	return new Promise((resolve, reject) => {
+		request.postForm(getDailyPlanListUrl, {date}).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	})
+}
+
+export function deleteById(id: string) {
+	return new Promise((resolve, reject) => {
+		request.postForm(deleteByIdUrl, {id}).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	})
+}
+
+export function getPlanDateList(startDate: string, endDate: string) {
+	return new Promise((resolve, reject) => {
+		request.postForm(getPlanDateListUrl, {startDate, endDate}).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	})
+}
+
+export function getTodoCountByDate(date: string) {
+	return new Promise((resolve, reject) => {
+		request.postForm(getTodoCountByDateUrl, {date}).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	});
+}

src/api/log-manage.ts

@@ -1,6 +1,7 @@
 import request, {CommonHeaderEnum} from "@/utils/request";
 
 const getMonthlyLogCountUrl = '/admin/log/getMonthlyLogCount'
+const getPageUrl = "/admin/log/page";
 
 export function getMonthlyLogCount(startTime: string, endTime: string) {
 	return new Promise(resolve => {
@@ -19,3 +20,13 @@ export function getMonthlyLogCount(startTime: string, endTime: string) {
 		})
 	})
 }
+
+export function getPage(current: number, size: number) {
+	return new Promise((resolve, reject) => {
+		request.get(getPageUrl + `?current=${current}&size=${size}`).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	})
+}

src/api/patient.ts

@@ -0,0 +1,17 @@
+import request from "@/utils/request";
+
+const patientInfoUrl = "/admin/medicine/getPatientInfo";
+
+export function getPatientInfo(name: string, id: string, date: string) {
+	return new Promise((resolve, reject) => {
+		request.postForm(patientInfoUrl, {
+			patientName: name,
+			idNum: id,
+			date: date
+		}).then((res: any) => {
+			resolve(res.data);
+		}).catch(error => {
+			reject(error);
+		});
+	});
+}

src/components/system-logs.vue

@@ -1,22 +1,27 @@
 <template>
     <el-timeline>
-        <el-timeline-item v-for="(item, index) in activities" :key="index" :timestamp="item.time">
-            {{ item.title + '-' + item.ip }}
+        <el-timeline-item v-for="(item, index) in activities" :key="index" :timestamp="item.createTime">
+            {{ item.title + '-' + item.remoteAddr }}
         </el-timeline-item>
     </el-timeline>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { dateFormater } from '@/utils/date-util';
+import {onMounted, ref} from 'vue'
+import * as logManageApi from "@/api/log-manage";
 
-const activities: any = []
+const activities = ref([] as any);
 
-while (activities.length < 10) {
-    activities.push({
-        time: dateFormater('yyyy-MM-dd HH:mm:ss'),
-        title: '登录成功',
-        ip: '127.0.0.1'
+onMounted(function () {
+	getLogList();
+});
+
+function getLogList() {
+	logManageApi.getPage(0, 100).then((res: any) => {
+		if (res.code == 0) {
+			activities.value = res.data.records;
+			console.log(activities.value)
+		}
 	})
 }
 </script>

src/router/index.ts

@@ -1,16 +1,21 @@
-import { createRouter, createWebHistory } from 'vue-router'
-import { useLoginStore } from '@/stores/user-info-store'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { constantRoute } from './routes'
+import {createRouter, createWebHistory} from 'vue-router'
+import {useLoginStore} from '@/stores/user-info-store'
+import {ElMessage} from 'element-plus'
+import {constantRoute} from './routes'
+import {decrypt, decryption, encrypt, encryption, isBase64} from "@/utils/other";
 
 const router = createRouter({
 	history: createWebHistory(import.meta.env.BASE_URL),
 	routes: constantRoute,
+	stringifyQuery: stringifyQuery,
+	parseQuery: parseQuery,
 })
 
+const kk = "raxipnenttlewe";
+
 router.beforeEach((to, from, next) => {
 	const loginInfo = useLoginStore().getlogin()
-    const isLogin = loginInfo.isLogin
+//    const isLogin = loginInfo.isLogin
 	// 普通用户
 	const commonUser = [
 		'/login',
@@ -49,8 +54,8 @@ router.beforeEach((to, from, next) => {
 		'/logs-manage/logs-manage'
 	]
 	const isViewRoute = () => {
-        let release = false
-        switch (loginInfo.permissions) {
+		let release = true
+		/*switch (loginInfo.permissions) {
               case '超级管理员':
                   release = true
                   break;
@@ -65,18 +70,31 @@ router.beforeEach((to, from, next) => {
                   break;
               default:
                   break;
-        }
+          }*/
 		return release
 	}
-    if(to.fullPath ==='/login') {
+	if (to.fullPath === '/login') {
 		next()
 		return
 	}
-    if (!isLogin) next('/login') // 重定向登录页
-    else if(!isViewRoute()) {
+	/*if (!isLogin) next('/login') // 重定向登录页
+  else */
+	if (!isViewRoute()) {
 		ElMessage.error('无权访问！')
 		next(from.fullPath)
-    }else next()
+	} else next()
 });
 
+function stringifyQuery(query: any) {
+	return btoa(encrypt(JSON.stringify(query), kk));
+}
+
+function parseQuery(query: any) {
+	if (isBase64(query)) {
+		return JSON.parse(decrypt(atob(query), kk));
+	} else {
+		return query;
+	}
+}
+
 export default router

src/router/routes.ts

@@ -1,6 +1,6 @@
 export const constantRoute=[
 
-    { path: '/:pathMatch(.*)*', name: 'not-found', redirect: '/home' },
+    { path: '/:pathMatch(.*)*', name: 'not-found', redirect: '/login' },
     {
         path: '/login',
         name: '登录',
@@ -8,7 +8,7 @@ export const constantRoute=[
     },
     {
         path: '/',
-        redirect: '/home',
+        redirect: '/login',
         component: () => import('@/views/index.vue'),
         children: [
             {

src/stores/remote-ws-store.ts

@@ -0,0 +1,214 @@
+import {defineStore} from "pinia";
+import {Session} from "@/utils/storage";
+
+const vitalUrl = "ws://localhost:5173/socket.io/admin/rax/vitalSignsMedicine?token=" + Session.getToken()
+const medicineUrl = "ws://localhost:5173/socket.io/admin/rax/addMedicine?token=" + Session.getToken()
+const chatUrl = "ws://localhost:5173/socket.io/admin/rax/chatRoom?token=" + Session.getToken()
+
+export const useRemoteWsStore = defineStore("remoteWs", {
+	state: () => {
+		return {
+			patient: {} as any,
+			remoteTasks: [] as any,
+			remoteTasksCap: 10,
+			currentTaskIndex: 0,
+			varMedicine: ["丙泊酚", "舒芬太尼", "瑞芬太尼", "顺阿曲库胺"],
+			fixedMedicine: ["尼卡地平", "艾司洛尔", "麻黄素", "阿托品"],
+			exceptionType: ["BIS_except", "DBP_except", "EtCO2_except", "HR_except", "SBP_except", "ST_except"],
+			exceptionMsg: {
+				"BIS_except": "脑电双频指数异常", "DBP_except": "舒张压异常", "EtCO2_except": "呼气末二氧化碳异常",
+				"HR_except": "心率异常", "SBP_except": "收缩压异常", "ST_except": "ST异常"
+			},
+		}
+	},
+	actions: {
+		initRemoteTask() {
+			if (this.remoteTasks.length <= 0) {
+				for (let i = 0; i < 10; i++) {
+					this.remoteTasks.push({
+						isRemote: false,
+						isException: false,
+						taskName: "",
+						server: "",
+						serverun: "",
+						serverps: "",
+						patient: "",
+						patientId: "",
+						date: "",
+						log: [],
+						index: i
+					})
+				}
+			}
+			return this.remoteTasks
+		},
+		resetRemoteTask(i: number) {
+			this.remoteTasks[i] = Object.assign(this.remoteTasks[i], {
+				isRemote: false,
+				isException: false,
+				taskName: "",
+				server: "",
+				serverun: "",
+				serverps: "",
+				patient: "",
+				patientId: "",
+				date: "",
+				log: [],
+				index: i,
+				message: []
+			})
+		},
+		getActiveRemoteTask() {
+			for (let i = 0; i < this.remoteTasks.length; i++) {
+				if (this.remoteTasks[i].isRemote) return i
+			}
+		},
+		setRemoteLog(log: any, i: number) {
+			this.remoteTasks[i].log.push(log)
+		},
+		createConnect(name: string, id: string, date: string) {
+			if (!this.patient[name + id + date]) {
+				const vitalWS = new WebSocket(vitalUrl)
+				const medicineWS = new WebSocket(medicineUrl)
+				const chatWS = new WebSocket(chatUrl)
+				vitalWS.onopen = function () {
+					vitalWS.send(JSON.stringify({
+						patientName: name,
+						idNum: id,
+						date: date
+					}))
+				}
+				medicineWS.onopen = function () {
+					medicineWS.send(JSON.stringify({
+						patientName: name,
+						idNum: id,
+						date: date
+					}))
+				}
+				chatWS.onopen = function () {
+					chatWS.send(JSON.stringify({
+						patientName: name,
+						idNum: id,
+						date: date
+					}))
+				}
+				this.patient[name + id + date] = {
+					vitalWS,
+					medicineWS,
+					chatWS
+				}
+			}
+		},
+		disconnect(name: string, id: string, date: string) {
+			const patient: any = this.patient[name + id + date]
+			if (patient) {
+				patient.vitalWS.close()
+				patient.medicineWS.close()
+				patient.chatWS.close()
+				delete this.patient[name + id + date]
+			}
+		},
+		subscribeVital(name: string, id: string, date: string, cb: any) {
+			const patient: any = this.patient[name + id + date]
+			if (patient) {
+				patient.vitalWS.onmessage = cb
+				patient.vitalCB = cb
+			} else {
+				cb({
+					status: 1,
+					msg: "已断开连接"
+				})
+			}
+		},
+		unsubscribeVital(name: string, id: string, date: string) {
+			const patient: any = this.patient[name + id + date]
+			if (patient && patient.vitalWS) {
+				patient.vitalWS.onmessage = undefined;
+				patient.vitalCB = undefined;
+			}
+		},
+		sendMsg(name: string, id: string, date: string, msg: string, cb: any) {
+			const patient: any = this.patient[name + id + date]
+			if (patient) {
+				const params = {
+					patientName: name,
+					idNum: id,
+					date: date,
+					msg
+				}
+				patient.chatWS.send(JSON.stringify(params))
+				cb({
+					status: 0
+				})
+			} else {
+				cb({
+					status: 1,
+					msg: "已断开连接"
+				})
+			}
+		},
+		subscribeChat(name: string, id: string, date: string, cb: any) {
+			const patient: any = this.patient[name + id + date]
+			if (patient) {
+				patient.chatCB = cb
+				patient.chatWS.onmessage = cb
+			} else {
+				cb({
+					status: 1,
+					msg: "已断开连接"
+				})
+			}
+		},
+		unsubscribeChat(name: string, id: string, date: string) {
+			const patient: any = this.patient[name + id + date]
+			patient.chatCB = undefined;
+			patient.chatWS.onmessage = undefined;
+		},
+		sendMedicine(args: {
+			name: string,
+			id: string,
+			date: string,
+			flag: string,
+			medicine: string,
+			value: string
+		}, cb: any) {
+			const patient: any = this.patient[args.name + args.id + args.date]
+			if (patient) {
+				const params = {
+					patientName: args.name,
+					idNum: args.id,
+					date: args.date,
+					flag: args.flag,
+					medicine: args.medicine,
+					value: args.value
+				}
+				patient.medicineWS.send(JSON.stringify(params))
+				cb({
+					status: 0
+				})
+			} else {
+				cb({
+					status: 1,
+					msg: "已断开连接"
+				})
+			}
+		},
+		subscribeMedicine(name: string, id: string, date: string, cb: any) {
+			const patient = this.patient[name + id + date]
+			if (patient) {
+				patient.medicineCB = cb
+				patient.medicineWS.onmessage = cb
+			} else {
+				cb({
+					status: 1,
+					msg: "已断开连接"
+				})
+			}
+		},
+		unsubscribeMedicine(name: string, id: string, date: string) {
+			const patient: any = this.patient[name + id + date]
+			patient.medicineCB = undefined;
+			patient.medicineWS.onmessage = undefined;
+		}
+	}
+})

src/stores/user-info-store.ts

@@ -4,7 +4,6 @@ export const useLoginStore = defineStore('login', {
   state: () => {
     return {
       login: {
-        isLogin: false,
         account: '',
         name: '',
         /**
@@ -13,7 +12,6 @@ export const useLoginStore = defineStore('login', {
          * 医院中级管理员： 首页、患者管理、远程管理
          * 医院普通用户： 首页、患者管理
          */
-        permissions: '',
         hospital: ''
       } as any
     }

src/utils/date-util.ts

@@ -46,18 +46,31 @@ export function getMonthDays(time: any) {
  * 获取当前日期的周几  i:1,2,3,4,5,6,7
  * @returns
  */
-export function getFirstDayOfWeek(date: Date, i: number) {
+export function getFirstDayOfWeek(date: string | Date | number, i: number) {
+	let temp: any;
+	if (!(date instanceof Date)) {
+		if (typeof date == "number") {
+			temp = new Date(date);
+		} else {
+			const s = date.replace(/-/g, "/");
+			temp = new Date(s);
+		}
+	} else {
+		temp = new Date(date.getTime())
+	}
 	if (i < 1 || i > 7) {
 		return null;
 	}
-    const day = date.getDay() || 7;
-    return new Date(date.getFullYear(), date.getMonth(), date.getDate() + i - day);
+	const day = temp.getDay() || 7;
+	return new Date(temp.getFullYear(), temp.getMonth(), temp.getDate() + i - day);
 }
+
 /**
  * 获取当前日期是周几
  * @returns
  */
 const weekArray = ['周天', '周一', '周二', '周三', '周四', '周五', '周六'];
+
 export function getCurrentDate(date: any) {
 	let myDate = new Date();
 	if (date) {
@@ -79,12 +92,15 @@ export function getCurrentDate(date: any) {
  */
 export function getDays(date: any, days: number) {
 	if (date) {
+		let temp: any;
 		if (!(date instanceof Date)) {
 			date = date.replace(/-/g, '/');
-            date = new Date(date);
+			temp = new Date(date);
+		} else {
+			temp = new Date(date.getTime());
 		}
 
-        const time = date.setDate(date.getDate() + days); // 天数
+		const time = temp.setDate(temp.getDate() + days);
 		return new Date(time);
 	}
 }

src/utils/other.ts

@@ -7,7 +7,7 @@ import * as CryptoJS from 'crypto-js';
 export function encryption(src: string, keyWord: string) {
 	const key = CryptoJS.enc.Utf8.parse(keyWord);
 	// 加密
-    let encrypted = CryptoJS.AES.encrypt(src, key, {
+	const encrypted = CryptoJS.AES.encrypt(src, key, {
 		iv: key,
 		mode: CryptoJS.mode.CBC,
 		padding: CryptoJS.pad.Pkcs7,
@@ -17,13 +17,14 @@ export function encryption(src: string, keyWord: string) {
 
 /**
  *  解密
- * @param {*} params 参数列表
  * @returns 明文
+ * @param src
+ * @param keyWord
  */
 export function decryption(src: string, keyWord: string) {
-    const key = CryptoJS.enc.Utf8.parse(keyWord);
+	const key = keyWord;
 	// 解密逻辑
-    let decryptd = CryptoJS.AES.decrypt(src, key, {
+	const decryptd = CryptoJS.AES.decrypt(src, key, {
 		iv: key,
 		mode: CryptoJS.mode.CBC,
 		padding: CryptoJS.pad.Pkcs7,
@@ -31,3 +32,20 @@ export function decryption(src: string, keyWord: string) {
 
 	return decryptd.toString(CryptoJS.enc.Utf8);
 }
+
+export function encrypt(src: string, key: string) {
+	return CryptoJS.AES.encrypt(src, key).toString()
+}
+
+export function decrypt(src: string, key: string) {
+	return CryptoJS.AES.decrypt(src, key).toString(CryptoJS.enc.Utf8)
+}
+
+export function isBase64(s: string) {
+	if (s == "" || s.trim() == "") return false;
+	try {
+		return window.btoa(window.atob(s)) == s;
+	} catch (e) {
+		return false;
+	}
+}

src/views/home/index.vue

@@ -5,7 +5,8 @@
 				<div class="message-box">
 					<el-carousel height="32px" direction="vertical" indicator-position="none" autoplay>
 						<el-carousel-item v-for="(item, index) in messages" :key="'message-' + index">
-                            <p class="text-row-1" style="line-height: 32px;" :class="{'is-link': item.link}" @click="() => {item.link && router.push(item.link)}">【{{ item.type }}】 {{ item.content }}</p>
+							<p class="text-row-1" style="line-height: 32px;" :class="{'is-link': item.link}"
+								 @click="() => {item.link && router.push(item.link)}">【{{ item.type }}】 {{ item.content }}</p>
 						</el-carousel-item>
 					</el-carousel>
 				</div>
@@ -16,7 +17,7 @@
 					</div>
 					<div class="header-item">
 						<el-icon class="text1-color" style="font-size: 26px;margin-right: 20px;">
-                            <Calendar />
+							<Calendar/>
 						</el-icon>
 						<div>
 							<p class="text1-color f14">待办任务</p>
@@ -26,22 +27,22 @@
 				</div>
 				<div class="echart-box">
 					<div class="echart-item">
-                        <NumberChart />
+						<NumberChart/>
 					</div>
 					<div class="echart-item">
-                        <NumberPieChart />
+						<NumberPieChart/>
 					</div>
 					<div class="echart-item">
-                        <TimeChart />
+						<TimeChart/>
 					</div>
 					<div class="echart-item">
-                        <TimeBarChart />
+						<TimeBarChart/>
 					</div>
 				</div>
 			</div>
 			<div class="right-content">
 				<div class="week-calendar">
-                    <WeekCalendar />
+					<WeekCalendar/>
 				</div>
 				<div class="system-logs">
 					<div class="title">
@@ -49,7 +50,7 @@
 						<span class="f14" style="cursor: pointer;" @click="router.push('./logs-manage/logs-manage')">更多</span>
 					</div>
 					<div class="content">
-                        <SystemLogs />
+						<SystemLogs/>
 					</div>
 				</div>
 			</div>
@@ -58,15 +59,17 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { useRouter } from 'vue-router'
-import { useLoginStore } from '@/stores/user-info-store'
+import {onMounted, ref} from 'vue'
+import {useRouter} from 'vue-router'
+import {useLoginStore} from '@/stores/user-info-store'
 import NumberChart from "./number-chart.vue";
 import NumberPieChart from "./number-pie-chart.vue";
 import TimeChart from "./time-chart.vue";
 import TimeBarChart from "./time-bar-chart.vue";
 import WeekCalendar from "./week-calendar.vue";
 import SystemLogs from "@/components/system-logs.vue";
+import * as dailyPlanApi from "@/api/daily-plan";
+import {dateFormater} from "@/utils/date-util";
 
 
 const router = useRouter()
@@ -75,8 +78,28 @@ const userInfo = useLoginStore().getlogin()
 const messages = ref([] as any)
 const total = ref(0) // 日历添加的记录提醒统计
 
-messages.value.push({type: '通知', content: '测试测试测试测试测试测试测试测试测试测试', link: '/system-manage/system-home'})
-messages.value.push({type: '公告', content: '公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试'})
+messages.value.push({
+	type: '通知',
+	content: '测试测试测试测试测试测试测试测试测试测试',
+	link: '/system-manage/system-home'
+})
+messages.value.push({
+	type: '公告',
+	content: '公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试公告测试'
+})
+
+onMounted(() => {
+	getTodoCount();
+})
+
+function getTodoCount() {
+	dailyPlanApi.getTodoCountByDate(dateFormater("yyyy-MM-dd", new Date())).then((res: any) => {
+		if (res.code == 0) {
+			total.value = res.data;
+		}
+	});
+}
+
 </script>
 
 <style lang='scss' scoped>
@@ -100,6 +123,7 @@ messages.value.push({type: '公告', content: '公告测试公告测试公告测
 	.left-content {
 		width: calc(100% - 350px);
 		height: 100%;
+
 		.message-box {
 			height: 34px;
 			background: #f8f8f8;
@@ -107,11 +131,13 @@ messages.value.push({type: '公告', content: '公告测试公告测试公告测
 			padding: 0 30px;
 			border: 1px solid $border1-color;
 			margin-bottom: 20px;
+
 			.is-link {
 				cursor: pointer;
 				color: $main-color;
 			}
 		}
+
 		.header-box {
 			width: 100%;
 			height: 90px;
@@ -130,7 +156,7 @@ messages.value.push({type: '公告', content: '公告测试公告测试公告测
 				flex-direction: column;
 				justify-content: center;
 
-                &~.header-item {
+				& ~ .header-item {
 					width: 40%;
 					flex-direction: row;
 					justify-content: flex-start;
@@ -158,6 +184,7 @@ messages.value.push({type: '公告', content: '公告测试公告测试公告测
 				&:nth-child(even) {
 					width: 40%;
 				}
+
 				&:nth-child(n + 3) {
 					margin-top: 20px;
 				}
@@ -168,10 +195,12 @@ messages.value.push({type: '公告', content: '公告测试公告测试公告测
 	.right-content {
 		width: 330px;
 		height: 100%;
+
 		.week-calendar {
 			width: 100%;
 			height: 50%;
 		}
+
 		.system-logs {
 			width: 100%;
 			height: calc(50% - 20px);

src/views/home/record-form.vue

@@ -5,124 +5,142 @@
 		</el-form-item>
 		<el-form-item label="类型" prop="type">
 			<el-select v-model="formData.type" placeholder="请选择类型">
-                <el-option v-for="item in typeOption" :key="item.value" :label="item.label" :value="item.value" />
+				<el-option v-for="item in typeOption" :key="item.value" :label="item.label" :value="item.value"/>
 			</el-select>
 		</el-form-item>
-        <el-form-item label="状态" prop="state" placeholder="请选择状态">
-            <el-select v-model="formData.state">
-                <el-option v-for="item in stateOption" :key="item.value" :label="item.label" :value="item.value" />
+		<el-form-item label="状态" prop="status" placeholder="请选择状态">
+			<el-select v-model="formData.status">
+				<el-option v-for="item in stateOption" :key="item.value" :label="item.label" :value="item.value"/>
 			</el-select>
 		</el-form-item>
 		<el-row>
 			<el-col :span="12">
 				<el-form-item label="日期" prop="date">
-                    <el-date-picker v-model="formData.date" type="date" placeholder="请输入日期" />
+					<el-date-picker v-model="formData.date" type="date" placeholder="请输入日期"/>
 				</el-form-item>
 			</el-col>
 			<el-col :span="12">
 				<el-form-item label="时间" prop="time">
-                    <el-time-picker v-model="formData.time" placeholder="请输入时间" />
+					<el-time-picker v-model="formData.time" placeholder="请输入时间"/>
 				</el-form-item>
 			</el-col>
 		</el-row>
 		<el-form-item label="内容" prop="content">
 			<el-input v-model="formData.content" type="textarea" :rows="10" placeholder="请输入内容"></el-input>
 		</el-form-item>
-        <div style="text-align: right;" >
-            <el-button v-if="formData.isSaveBtn" class="f18" type="primary" @click="saveData">保存</el-button>
-            <el-button v-if="formData.isRemoveBtn" class="f18" @click="removeData">删除</el-button>
+		<div style="text-align: right;">
+			<el-button v-if="isSaveBtn" class="f18" type="primary" @click="saveData">保存</el-button>
+			<el-button v-if="isRemoveBtn" class="f18" @click="removeData">删除</el-button>
 		</div>
 	</el-form>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-
-const emit = defineEmits(['close', 'saveData'])
+import {onMounted, reactive, ref} from 'vue'
+import {ElMessage, ElMessageBox} from 'element-plus'
+import {dateFormater} from "@/utils/date-util";
+import * as dailyPlanApi from "@/api/daily-plan";
 
+const emit = defineEmits(['close', 'saveData', "removeEvent"])
+defineExpose({
+	resetData
+})
 const typeOption = [
-    { label: '手术', value: '手术' },
-    { label: '会议', value: '会议' },
+	{label: '手术', value: '手术'},
+	{label: '会议', value: '会议'},
 ]
 const stateOption = [
-    { label: '已处理', value: '已处理' },
-    { label: '未处理', value: '未处理' },
+	{label: '已处理', value: '已处理'},
+	{label: '未处理', value: '未处理'},
 ]
 const rules = reactive({
 	title: [
-        { required: true, message: '请输入标题', trigger: 'blur' },
+		{required: true, message: '请输入标题', trigger: 'blur'},
 	],
 	type: [
-        { required: true, message: '请选择类型', trigger: 'blur' },
+		{required: true, message: '请选择类型', trigger: 'blur'},
 	],
-    state: [
-        { required: true, message: '请选择状态', trigger: 'blur' },
+	status: [
+		{required: true, message: '请选择状态', trigger: 'blur'},
 	],
 	date: [
-        { required: true, message: '请输入日期', trigger: 'blur' },
+		{required: true, message: '请输入日期', trigger: 'blur'},
 	],
 	time: [
-        { required: true, message: '请输入时间', trigger: 'blur' },
+		{required: true, message: '请输入时间', trigger: 'blur'},
 	],
 	content: [
-        { required: true, message: '请输入内容', trigger: 'blur' },
+		{required: true, message: '请输入内容', trigger: 'blur'},
 	]
 })
-
 const formRef = ref()
 const formData = ref({
 	id: '',
 	title: '',
 	type: '',
-    state: '',
+	status: '',
 	date: '',
 	time: '',
 	content: '',
-    isSaveBtn: true,
-    isRemoveBtn: true
 })
-
+const isSaveBtn = ref(true);
+const isRemoveBtn = ref(true);
 
 onMounted(() => {
 	formData.value = {
 		id: '',
 		title: '',
 		type: '',
-        state: '',
+		status: '',
 		date: '',
 		time: '',
 		content: '',
-        isSaveBtn: true,
-        isRemoveBtn: true
 	}
 })
 
-defineExpose({
-    formData,
-    resetData,
-})
 function close() {
 	emit('close')
 }
-function resetData() {
+
+function resetData(hasRmBtn: boolean, date?: string, form?: any) {
 	formRef.value.resetFields()
+	if (form) {
+		const tempForm = Object.assign({}, form);
+		const planDate = new Date(tempForm.date + " " + tempForm.time);
+		tempForm.date = planDate;
+		tempForm.time = planDate;
+		formData.value = tempForm;
+	} else {
 		Object.assign(formData.value, {
 			id: '',
 			title: '',
 			type: '',
-        state: '',
-        date: '',
+			status: '',
+			date: date ? date : '',
 			time: '',
 			content: ''
 		})
+	}
+	isRemoveBtn.value = hasRmBtn;
 }
-const saveData = async () => {
-    await formRef.value.validate((valid: any, fields: any) => {
+
+const saveData = () => {
+	formRef.value.validate((valid: any, fields: any) => {
 		if (valid) {
-            ElMessage.success('保存成功！')
-            emit('saveData', formData.value)
-            close()
+			const form = JSON.parse(JSON.stringify(formData.value));
+			form.time = dateFormater("HH:mm:ss", new Date(form.time));
+			form.date = dateFormater("yyyy-MM-dd", new Date(form.date));
+			dailyPlanApi.saveOrUpdate(form).then((res: any) => {
+				if (res.code == 0) {
+					ElMessage.success('保存成功！');
+					emit('saveData', form);
+					close();
+				} else {
+					ElMessage.error(res.msg);
+				}
+			}).catch(error => {
+				ElMessage.error("服务端异常");
+			})
 		} else {
 			// console.log('error submit!', fields)
 		}
@@ -138,9 +156,18 @@ const removeData = () => {
 			draggable: true
 		}
 	).then(() => {
-        ElMessage.success('删除成功！')
-        close()
-    }).catch(() => { })
+		dailyPlanApi.deleteById(formData.value.id).then((res: any) => {
+			if (res.code == 0) {
+				ElMessage.success('删除成功！');
+				close();
+				emit("removeEvent");
+			} else {
+				ElMessage.error(res.msg);
+			}
+		});
+	}).catch(() => {
+		ElMessage.error("服务器异常");
+	})
 }
 </script>
 

src/views/home/week-calendar.vue

@@ -1,28 +1,33 @@
 <template>
 	<div class="week-calendar-part">
 		<div class="header-box">
-            <el-icon @click="setWeek('up')">
-                <ArrowLeft />
+			<el-icon @click="minusWeek()">
+				<ArrowLeft/>
 			</el-icon>
 			<div class="date-block">
-                <span @click="handleOpen">{{ formatDate(month) }}</span>
-                <el-date-picker ref="datePicker" popper-class="week-calendar-picker" class="month-date-pick" v-model="month"
-                    type="month" @change="setWeek()" />
+				<span @click="handleDatePickerOpen">{{ getMonthTitle() }}</span>
+				<el-date-picker ref="datePickerRef"
+												popper-class="week-calendar-picker"
+												class="month-date-pick"
+												v-model="month"
+												type="month"
+												@change="setMonthWeek()"/>
 			</div>
-            <el-icon @click="setWeek('down')">
-                <ArrowRight />
+			<el-icon @click="addWeek()">
+				<ArrowRight/>
 			</el-icon>
 		</div>
 		<div class="week-box">
 			<table>
 				<tr class="text1-color">
-                    <th v-for="item in weekEn" :key="item">{{ item }}</th>
+					<th v-for="item in weekCn" :key="item">{{ item }}</th>
 				</tr>
 				<tr v-if="week.length > 0" class="">
-                    <td v-for="item in week" :key="item" :class="{
-                        'record-mark': recordWeek.some((r: any) => dateFormater('yyyy-MM-dd', r.date) === dateFormater('yyyy-MM-dd', item)),
-                        'active': dateFormater('yyyy-MM-dd', item) === dateFormater('yyyy-MM-dd', currentDate)
-                    }">
+					<td v-for="item in week" :key="item"
+							:class="{
+								'record-mark': recordWeek.some((r: any) => r == dateFormater('yyyy-MM-dd', item)),
+								'active':
+								dateFormater('yyyy-MM-dd', item) == dateFormater('yyyy-MM-dd', currentDate)}">
                         <span :class="{
                             'text2-color': item.getDate() > week[6].getDate()
                         }" @click="setDate(item)">{{ dateFormater('dd', item) }}</span>
@@ -32,115 +37,130 @@
 		</div>
 		<el-button text icon="Plus" style="width: 100%;margin-bottom: 5px;" @click="addRecord()">新建</el-button>
 		<div class="record-box ">
-            <el-empty v-if="record.length < 1" :description="dateFormater('MM月dd日', currentDate) + '没有任何记录'" style="padding: 0;" />
+			<el-empty v-if="record.length < 1" :description="dateFormater('MM月dd日', currentDate) + '没有任何记录'"
+								style="padding: 0;"/>
 			<div class="record-item" v-for="(item, index) in record" :key="'record-' + index" @click="viewRecord(item)">
 				<div class="icon-box">
 					<i class="icon-RectangleCopy"></i>
 				</div>
 				<div class="text-box">
 					<p class="main-color" style="font-weight: 600;cursor: pointer;">{{
-                        item.title }}</p>
-                    <p p class=" text2-color font14">{{ dateFormater('yyyy-MM-dd HH:mm:ss', item.time) }}</p>
+							item.title
+						}}</p>
+					<p p class=" text2-color font14">{{ item.date + " " + item.time }}</p>
 				</div>
 				<el-icon class="remove-icon" @click.stop="remoteRecord(item, index)">
-                    <Close />
+					<Close/>
 				</el-icon>
 			</div>
 		</div>
 
 		<el-dialog v-model="isRecordDialog" title="详情">
-            <RecordForm ref="recordFormRef" @close="isRecordDialog = false" @saveData="saveData" />
+			<RecordForm ref="recordFormRef" @remove-event="planRemoveEvent" @close="isRecordDialog = false"
+									@saveData="saveData"/>
 		</el-dialog>
 	</div>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
+import {onMounted, ref} from 'vue'
 import RecordForm from './record-form.vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { dateFormater, getFirstDayOfWeek, getDays } from '@/utils/date-util'
+import {ElMessage, ElMessageBox} from 'element-plus'
+import {dateFormater, getDays, getFirstDayOfWeek} from '@/utils/date-util'
+import * as dailyPlanApi from "@/api/daily-plan";
 
+const monthCn = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二'];
+const weekCn = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
+const datePickerRef = ref();
+const recordFormRef = ref();
+const isRecordDialog = ref(false);
+const month = ref(new Date());
+const week = ref([] as any);
+const recordWeek = ref([] as any);
+const record = ref([] as any);
+const currentDate = ref<Date>(new Date());
 
-const monthEn = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二']
-const weekEn = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
+onMounted(init)
 
-const datePicker = ref()
-const recordFormRef = ref()
-const isRecordDialog = ref(false)
-const month = ref(new Date())
-const week = ref([] as any)
-const recordWeek = ref([] as any)
-const record = ref([] as any)
-const currentDate = ref<Date>(new Date())
-
-setWeek()
-
-function formatDate(date: any) {
-    return monthEn[new Date(date).getMonth()] + '月 ' + new Date(date).getFullYear()
+function init() {
+	setMonthWeek();
 }
+
+function getMonthTitle() {
+	return monthCn[new Date(month.value).getMonth()] + '月 ' + new Date(month.value).getFullYear();
+}
+
+function addWeek() {
+	const date: any = getDays(month.value, 7);
+	month.value = date;
+	setWeek(date);
+}
+
+function minusWeek() {
+	const date: any = getDays(month.value, -7);
+	month.value = date;
+	setWeek(date);
+}
+
+function setMonthWeek() {
+	setWeek(month.value);
+	setDate(month.value);
+}
+
 /**
  * 设置周
  * @param type
  * 获取一周的数据，然后给每天打 record-mark 标记
  */
-function setWeek(type?: 'up' | 'down') {
-    const date = (type && getDays(month.value, type === 'up' ? -7 : 7)) || month.value
-    currentDate.value = date
-    const e = date
-    week.value = []
-    recordWeek.value = []
-    recordWeek.value = [
-        {
-            id: '1',
-            title: '月度会议',
-            type: '',
-            state: '',
-            date: getFirstDayOfWeek(e, 1),
-            time: getFirstDayOfWeek(e, 1),
-            content: '测试测试'
-        },
-        {
-            id: '2',
-            title: '手术提醒',
-            type: '',
-            state: '',
-            date: getFirstDayOfWeek(e, 4),
-            time: getFirstDayOfWeek(e, 4),
-            content: '测试测试'
-        }
-    ]
-    // 定时器等待动画执行
+function setWeek(date: any) {
+	week.value = [];
 	setTimeout(() => {
 		for (let i = 0; i < 7; i++) {
-            week.value.push(getFirstDayOfWeek(date, i + 1))
+			week.value.push(getFirstDayOfWeek(date, i + 1));
 		}
+		getWeekPlanList(week.value[0], week.value[6]);
 	}, 0)
-    setDate(currentDate.value)
 }
 
-const handleOpen = () => {
-    datePicker.value.handleOpen()
+function getWeekPlanList(startDate: any, endDate: any) {
+	recordWeek.value = [];
+	dailyPlanApi.getPlanDateList(dateFormater("yyyy-MM-dd", startDate),
+		dateFormater("yyyy-MM-dd", endDate)).then((res: any) => {
+		if (res.code == 0) {
+			recordWeek.value = res.data;
+		}
+	});
 }
+
+const handleDatePickerOpen = () => {
+	datePickerRef.value.handleOpen();
+}
+
 function setDate(e: Date) {
 	currentDate.value = e
-    record.value = recordWeek.value.filter((r: any) => dateFormater('yyyy-MM-dd', r.date) === dateFormater('yyyy-MM-dd', e))
+	getWeekPlanList(week.value[0], week.value[6]);
+	getDatePlanList();
 }
+
+function getDatePlanList() {
+	dailyPlanApi.getDailyPlanList(dateFormater("yyyy-MM-dd", currentDate.value)).then((res: any) => {
+		if (res.code == 0) {
+			record.value = res.data;
+		}
+	});
+}
+
 const addRecord = () => {
 	const e = currentDate.value || new Date()
 	isRecordDialog.value = true
 	setTimeout(() => {
-        recordFormRef.value.resetData()
-        recordFormRef.value.formData.date = e
-        recordFormRef.value.formData.isRemoveBtn = false
+		recordFormRef.value.resetData(false, dateFormater("yyyy-MM-dd", e));
 	}, 0)
 }
 const viewRecord = (e: any) => {
 	isRecordDialog.value = true
 	setTimeout(() => {
-        recordFormRef.value.resetData()
-        recordFormRef.value.formData = Object.assign({}, recordFormRef.value.formData, e)
-        recordFormRef.value.formData.isRemoveBtn = true
-        // console.log(recordFormRef.value.formData)
+		recordFormRef.value.resetData(true, null, e);
 	}, 0)
 }
 const remoteRecord = (item: any, index: number) => {
@@ -153,14 +173,24 @@ const remoteRecord = (item: any, index: number) => {
 			draggable: true
 		}
 	).then(() => {
-        ElMessage.success('删除成功！')
-        recordWeek.value = recordWeek.value.filter((r: any) => r.id !== item.id)
-        setDate(item.date)
-    }).catch(() => { })
+		dailyPlanApi.deleteById(item.id).then((res: any) => {
+			if (res.code == 0) {
+				ElMessage.success('删除成功！');
+				setDate(item.date);
+			} else {
+				ElMessage.error(res.msg);
+			}
+		}).catch(err => {
+			ElMessage.error("服务器异常");
+		})
+	})
 }
 const saveData = (e: any) => {
-    recordWeek.value.push(e)
-    setDate(e.date)
+	setDate(new Date(e.date));
+}
+
+const planRemoveEvent = () => {
+	setDate(currentDate.value)
 }
 </script>
 
@@ -184,7 +214,7 @@ const saveData = (e: any) => {
 		.date-block {
 			position: relative;
 
-            &>span {
+			& > span {
 				cursor: pointer;
 			}
 

src/views/index.vue

@@ -107,7 +107,12 @@ switch (userInfo.permissions) {
 		menus.push({label: '患者管理', path: '/patients-manage', icon: 'icon-renyuanguanli'})
 		break;
 	default:
-    break;
+		menus.push({label: '首页', path: '/home', icon: 'icon-shouye'})
+		menus.push({label: '权限管理', path: '/permissions-manage', icon: 'icon-users'})
+		menus.push({label: '患者管理', path: '/patients-manage', icon: 'icon-renyuanguanli'})
+		menus.push({label: '远程管理', path: '/remote-manage', icon: 'icon-anquanbaozhang'})
+		menus.push({label: '后台管理', path: '/system-manage', icon: 'icon-houtaiguanli'})
+		menus.push({label: '系统管理', path: '/logs-manage', icon: 'icon-setting'})
 }
 
 const isShowUserInfoDrawer = ref(false)

src/views/login/login.vue

@@ -314,12 +314,11 @@ const sendCode = () => {
 }
 const login = async (type: string) => {
 	//加载效果:开始加载
-  loading.value=true;
-  const obj = loginParams.value
-  if (!currentHospital.value) {
+	loading.value = true;
+	/*if (!currentHospital.value) {
 		ElMessage.warning('请在右上角选择院区')
 		return
-  }
+	}*/
 	//加载效果:开始加载
 	loading.value = true;
 	//保证全部表单正常再发请求
@@ -353,10 +352,14 @@ function sliderSuccess() {
       loading.value = false
     } else {
 // 存储token 信息
-      Session.set('token', data.access_token);
-      Session.set('refresh_token', data.refresh_token);
 			console.log(data)
-      toHome()
+			ElNotification({
+					type: 'success',
+					message: '欢迎回来',
+					title: `HI,${getTime()}好`
+				});
+			loginPost(data)
+			router.push('/home')
 		}
 	})
 }
@@ -365,38 +368,12 @@ function sliderClose() {
 	loading.value = false
 }
 
-const toHome = () => {
-
-  ElNotification({
-    type: 'success',
-    message: '欢迎回来',
-    title: `HI,${getTime()}好`
-  });
-
-  const getPermissions = () => {
-    let permissions = '普通用户'
-    switch (loginParams.value.account) {
-
-      case 'admin':
-        permissions = '超级管理员'
-        break;
-      case 'dev1':
-        permissions = '高级管理员'
-        break;
-      case 'dev2':
-        permissions = '中级管理员'
-        break;
-      default:
-        break;
-    }
-    return permissions
-  }
-  useLoginStore().setlogin('isLogin', true)
-  useLoginStore().setlogin('account', loginParams.value.account)
-  useLoginStore().setlogin('name', loginParams.value.name || '暂未设置姓名')
-  useLoginStore().setlogin('hospital', currentHospital.value)
-  useLoginStore().setlogin('permissions', getPermissions())
-  router.push('/home')
+const loginPost = (data: any) => {
+	Session.set('token', data.access_token);
+	Session.set('refresh_token', data.refresh_token);
+	useLoginStore().setlogin('account', data.username)
+	console.log(data)
+	useLoginStore().setlogin('name', data.user_info.name || '暂未设置姓名')
 }
 
 </script>

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

@@ -5,61 +5,128 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, ref } from 'vue';
+import {onMounted, ref} from 'vue';
 import * as echarts from 'echarts';
-import { dateFormater } from '@/utils/date-util';
+import {dateFormater} from '@/utils/date-util';
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 const chartDom = ref();
+const props = withDefaults(defineProps<{ names?: string[] }>(), {
+  names: ['CH1', 'CH2']
+});
+defineExpose({
+  updateChartData
+});
+const emit = defineEmits(["exceptionEvent"]);
+let chart: any;
+const color = ['#00AAB7', '#C77000'];
+const xData = [] as any[]; // x时间轴
+const series = [] as any[];
+let currentNode: any;
+const remoteWsStore = useRemoteWsStore();
 
-interface Props {
-	names?: string[];
-	chartData: any[];
-}
-
-const props = withDefaults(defineProps<Props>(), {
-	names: () => ['CH1', 'CH2'],
-	chartData: () => [] as any[],
+onMounted(() => {
+  chartInit();
 });
 
-// const emit = defineEmits(['updateData']);
-
-let chart: any;
-const names = props.names; // 类型名称
-const color = ['#00AAB7', '#C77000'];
-let xData = [] as any[]; // x时间轴
-let series = [] as any[];
-
-// 更新图表
-function updateChart(num: number, time?: string) {
+function updateChartData(data: any) {
+  if (data) {
+    if (currentNode && currentNode.Time == data.Time) {
+      return;
+    } else {
+      currentNode = data;
+    }
     xData.shift();
-	xData.push(dateFormater('HH:mm:ss', time));
-	// const values = [] as number[];
-	series.forEach((item, index) => {
-		item.data.shift();
-		// item.data.push(index === 0 ? num - 0.2 : index === 2 ? num + 0.2 : num);
-		// item.data.push(index === 0 ? -Math.floor(Math.random() * 50 + 40) : Math.floor(Math.random() * 50 + 40));
-		item.data.push(Math.floor(Math.random() * 160 + -80));
-		// values.push(item.data[item.data.length - 1]);
-	});
-	// emit('updateData', values); // 传值
+    xData.push(dateFormater("HH:mm:ss", data.Time ? data.Time - 8 * 60 * 60 * 1000 : ""));
+    series.forEach(serie => {
+      serie.data.shift();
+      serie.data.push(data[serie] ? data[serie] : 0);
+      if (data[serie.name + '_except']) {
+        emit("exceptionEvent", remoteWsStore.exceptionMsg[serie.name + '_except']);
+      }
+    })
     chart.setOption({
       xAxis: {
         data: xData,
       },
+      series
+    });
+  }
+}
+
+// 图表初始化
+function chartInit() {
+  chart = echarts.init(chartDom.value as HTMLElement);
+  chart.clear();
+  getXData();
+  getSeries();
+  const option = {
+    color: color,
+    tooltip: {
+      trigger: 'axis',
+      formatter: (params: any) => {
+        let str = params[0].axisValue;
+        str += `<br>`;
+        props.names.forEach((item, index) => {
+          str += params[index].marker;
+          str += params[index].seriesName + ' ';
+          str += `${params[index].value} HZ`;
+          str += index === 0 ? '<br>' : '';
+        });
+        return str;
+      },
+    },
+    grid: {
+      left: 1,
+      right: 20,
+      bottom: 5,
+      top: 20,
+      containLabel: true,
+    },
+    xAxis: {
+      show: true,
+      type: 'category',
+      boundaryGap: false,
+      axisLine: {show: false, lineStyle: {color: '#006080'}},
+      axisTick: {show: false},
+      axisLabel: {show: false},
+      splitLine: {show: true, lineStyle: {color: '#D4E8F0', width: 1, type: 'solid'}},
+      data: xData,
+    },
+    yAxis: {
+      show: true,
+      type: 'value',
+      min: function (value: any) {
+        return value.min - 40
+      },
+      max: function (value: any) {
+        return value.max + 40
+      },
+      axisLabel: {
+        formatter: `{value} HZ`
+      },
+      axisLine: {show: false, lineStyle: {color: '#006080'}},
+      splitLine: {lineStyle: {color: '#D4E8F0', width: 1, type: 'solid'}},
+    },
     series,
+  };
+  chart.setOption(option);
+  chart.resize();
+  window.addEventListener('resize', () => {
+    chart.resize();
   });
 }
-// 格式化数据
-function formatterData() {
-	xData = [];
-	series = [];
+
+function getXData() {
   for (let i = 0; i < 50; i++) {
-		if (props.chartData[i]) xData.push(dateFormater('HH:mm:ss', props.chartData[i].Time || props.chartData[i].TIME));
-		else xData.unshift(0);
+    xData.push(0);
   }
-	names.forEach((item, index) => {
-		const obj = {
-			name: item,
+}
+
+function getSeries() {
+  props.names.forEach((name, index) => {
+    const serie = {
+      name,
       type: 'line',
       symbol: 'none',
       lineStyle: {
@@ -87,97 +154,14 @@ function formatterData() {
         ]),
         width: 1,
       },
-			data: [] as number[],
+      data: [],
     };
     for (let i = 0; i < 50; i++) {
-			if (props.chartData[i]) {
-				const num = props.chartData[i].ST;
-				// obj.data.push(index === 0 ? num - 0.2 : index === 2 ? num + 0.2 : num);
-				// obj.data.push(index === 0 ? -Math.floor(Math.random() * 50 + 40) : Math.floor(Math.random() * 50 + 40));
-				obj.data.push(Math.floor(Math.random() * 160 + -80));
-			} else obj.data.unshift(0);
+      serie.data.push(0);
     }
-		series.push(obj);
+    series.push(serie);
   });
 }
-// 渲染图表 父组件调用
-function chartSet() {
-	formatterData();
-	if (chart) chart.setOption({
-		xAxis: {
-			data: xData,
-		},
-		series,
-	});
-}
-// 图表初始化
-function chartInit() {
-	chart = echarts.init(chartDom.value as HTMLElement);
-	chart.clear();
-	const option = {
-		color: color,
-		tooltip: {
-			trigger: 'axis',
-			formatter: (params: any) => {
-				let str = params[0].axisValue;
-				str += `<br>`;
-				names.forEach((item, index) => {
-					str += params[index].marker;
-					str += params[index].seriesName + ' ';
-					str += `${params[index].value} HZ`;
-					str += index === 0 ? '<br>' : '';
-				});
-				return str;
-			},
-		},
-		grid: {
-			left: 1,
-			right: 20,
-			bottom: 5,
-			top: 20,
-			containLabel: true,
-		},
-		xAxis: {
-			show: true,
-			type: 'category',
-			boundaryGap: false,
-			axisLine: { show: false, lineStyle: { color: '#006080' } },
-			axisTick: { show: false },
-			axisLabel: { show: false },
-			splitLine: { show: true, lineStyle: { color: '#D4E8F0', width: 1, type: 'solid' } },
-			data: xData,
-		},
-		yAxis: {
-			show: true,
-			type: 'value',
-			min: function (value: any) {
-				return value.min - 40
-			},
-			max: function (value: any) {
-				return value.max + 40
-			},
-			axisLabel: {
-				formatter: `{value} HZ`
-			},
-			axisLine: { show: false, lineStyle: { color: '#006080' } },
-			splitLine: { lineStyle: { color: '#D4E8F0', width: 1, type: 'solid' } },
-		},
-		series,
-	};
-	chart.setOption(option);
-	chart.resize();
-	window.addEventListener('resize', () => {
-		chart.resize();
-	});
-}
-
-onMounted(() => {
-	chartInit();
-});
-defineExpose({
-	updateChart,
-	chartSet
-});
 </script>
 
 <style lang="scss" scoped>

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

@@ -5,102 +5,73 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, ref } from 'vue';
+import {onMounted, ref} from 'vue';
 import * as echarts from 'echarts';
-import { dateFormater } from '@/utils/date-util';
+import {dateFormater} from '@/utils/date-util';
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 const chartDom = ref();
+const props = withDefaults(defineProps<{
+	names: string[]
+}>(), {
+	names: ['BIS', 'HR']
+});
+defineExpose({
+	updateChartData
+});
+const emit = defineEmits(["exceptionEvent"]);
+let chart: any;
+const xData: any = [];
+const series: any = [];
+const legendData: any = [];
+const colors = ['#00AAB7', '#C77000'];
+let currentNode: any;
+const remoteWsStore = useRemoteWsStore();
 
-interface Props {
-	names: string[];
-	chartData: any[];
-}
-
-const props = withDefaults(defineProps<Props>(), {
-	names: () => ['BIS', 'HR'],
-	chartData: () => [] as any[],
+onMounted(() => {
+	chartInit();
 });
 
-// const emit = defineEmits(['updateData']);
-
-let chart: any;
-const names = props.names; // 类型名称
-const color = ['#00AAB7', '#C77000'];
-let legendData = [] as any[];
-let xData = [] as any[]; // x时间轴
-let series = [] as any[];
-
-
-// 更新图表
-function updateChart(ary: number[], time?: string) {
+function updateChartData(data: any) {
+  if (data) {
+    if (currentNode && currentNode.Time == data.Time) {
+      return;
+    } else {
+      currentNode = data;
+    }
     xData.shift();
-	xData.push(dateFormater('HH:mm:ss', time));
-	// const values: number[] = [];
-	series.forEach((item, index) => {
-		item.data.shift();
-		item.data.push(ary[index]);
-		// values.push(item.data[item.data.length - 1]);
-	});
-	// emit('updateData', [values]); // 传值
+    xData.push(dateFormater("HH:mm:ss", data.Time ? data.Time - 8 * 60 * 60 * 1000 : ''));
+    series.forEach(serie => {
+      serie.data.shift();
+      serie.data.push(data[serie.name]);
+      if (data[serie.name + '_except']) {
+        emit("exceptionEvent", remoteWsStore.exceptionMsg[serie.name + '_except']);
+      }
+    })
     chart.setOption({
       xAxis: {
         data: xData,
       },
       series,
-	});
-}
-// 格式化数据
-function formatterData() {
-	legendData = [];
-	xData = [];
-	series = [];
-	for (let i = 0; i < 10; i++) {
-		if (props.chartData[i]) xData.push(dateFormater('HH:mm:ss', props.chartData[i].Time || props.chartData[i].TIME));
-		else xData.unshift(0);
+    })
   }
-	names.forEach((item, index) => {
-		const obj = {
-			name: item,
-			type: 'line',
-			symbol: 'none',
-			smooth: true,
-			data: [] as number[],
-		};
-		for (let i = 0; i < 10; i++) {
-			if (props.chartData[i]) obj.data.push(props.chartData[i][item]);
-			else obj.data.unshift(0);
-		}
-		legendData.push({
-			name: item,
-			textStyle: { color: color[index] },
-		});
-		series.push(obj);
-	});
 }
-// 渲染图表 父组件调用
-function chartSet() {
-	formatterData();
-	if (chart) chart.setOption({
-		xAxis: {
-			data: xData,
-		},
-		series,
-	});
-}
-// 图表初始化
+
 function chartInit() {
 	chart = echarts.init(chartDom.value as HTMLElement);
 	chart.clear();
-	formatterData();
-	const option : any = {
-		color,
+	getSeries();
+	getXData();
+	getLegendData();
+	const option: any = {
+		color: colors,
 		tooltip: {
 			trigger: 'axis',
 			formatter: (params: any) => {
 				let str = '';
 				str += params[0].axisValue;
 				str += '<br>';
-				names.forEach((item, index) => {
+				props.names.forEach((item, index) => {
 					str += params[index].marker;
 					str += params[index].seriesName + ' ';
 					switch (item) {
@@ -145,7 +116,7 @@ function chartInit() {
 				lineHeight: 30,
 			},
 			formatter: (params: string) => {
-				const index = names.findIndex((item) => item === params);
+				const index = props.names.findIndex((item) => item === params);
 				let str = params + ' ';
 				switch (params) {
 					case 'BIS':
@@ -171,7 +142,7 @@ function chartInit() {
 				}
 				return str;
 			},
-			data: legendData,
+			data: legendData
 		},
 		grid: {
 			left: 5,
@@ -184,21 +155,22 @@ function chartInit() {
 			show: true,
 			type: 'category',
 			boundaryGap: false,
-			data: xData,
-			axisLine: { lineStyle: { color: '#006080' } }
+			data: [],
+			axisLine: {lineStyle: {color: '#006080'}}
 		},
 		yAxis: {
 			show: true,
 			type: 'value',
 			axisLabel: {
-				formatter: `{value} ${names[0] === 'BIS' ? '次/分' : names[0] === 'SBP' ? 'mmHg' : ''}`
+				formatter: `{value} ${props.names[0] === 'BIS' ? '次/分' : props.names[0] === 'SBP' ? 'mmHg' : ''}`
 			},
-			axisLine: { show: true, lineStyle: { color: '#006080' } },
-			splitLine: { lineStyle: { color: '#C0C4CC', width: 1, type: 'dashed' } },
+			axisLine: {show: true, lineStyle: {color: '#006080'}},
+			splitLine: {lineStyle: {color: '#C0C4CC', width: 1, type: 'dashed'}},
 		},
 		series,
 	};
-	if(names[0] !== 'BIS') {
+	if (props.names[0] !== 'BIS'
+	) {
 		option.yAxis.max = (value: any) => value.max + 20;
 	}
 	chart.setOption(option);
@@ -208,13 +180,36 @@ function chartInit() {
 	});
 }
 
-onMounted(() => {
-	chartInit();
-});
-defineExpose({
-	updateChart,
-	chartSet
-});
+function getSeries() {
+	props.names.forEach(name => {
+		const serie = {
+			name,
+			type: 'line',
+			symbol: 'none',
+			smooth: true,
+			data: [] as number[],
+		};
+		for (let i = 0; i < 10; i++) {
+			serie.data.push(0);
+		}
+		series.push(serie)
+	});
+}
+
+function getXData() {
+	for (let i = 0; i < 10; i++) {
+		xData.push(0);
+	}
+}
+
+function getLegendData() {
+	props.names.forEach((name, index) => {
+		legendData.push({
+			name,
+			textStyle: {color: colors[index]},
+		});
+	});
+}
 </script>
 
 <style lang="scss" scoped>

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

@@ -2,9 +2,9 @@
 	<div class="message-item-part">
 		<div class="tag-index">{{ index + 1 }}</div>
 		<ul ref="listRef">
-      <li v-for="(item, index) in logs" :key="index">
-        <span>{{ dateFormater('HH:mm:ss', item.time) }}</span>
-        <span>{{ item.title }}</span>
+			<li v-for="(item, i) in remoteWsStore.remoteTasks[index]?.log || []" :key="i">
+				<span>{{ dateFormater('yyyy-MM-dd HH:mm:ss', item.time) }}</span>
+				<span>{{ item.taskName }}</span>
 				<span>{{ item.state }}</span>
 			</li>
 		</ul>
@@ -12,33 +12,23 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import type { RemoteLogItem, RemoteItem } from '@/utils/public-interface'
-import { useRemoteStore } from '@/stores/remote-info-store'
-import { dateFormater } from '@/utils/date-util'
+import {ref} from 'vue';
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
+import {dateFormater} from "@/utils/date-util";
 
-interface Props {
+const remoteWsStore = useRemoteWsStore();
+const props = withDefaults(defineProps<{
 		index: number
-  logs: Array<RemoteLogItem>
-}
-const props = withDefaults(defineProps<Props>(), {
-  index: () => 0,
-  logs: () => [] as Array<RemoteLogItem>
-})
-
+	}>(),
+	{
+		index: () => 0
+	})
 const listRef = ref()
-const remoteTasks: any = ref([] as Array<RemoteItem>)
 
 defineExpose({
-  scrollToBottom,
+	scrollToBottom
 })
 
-remoteTasks.value = useRemoteStore().remoteTasks
-// 监听 useRemoteStore() 值变化
-// useRemoteStore().$subscribe((mutation: any, state: any) => {
-//   console.log(mutation, state)
-// })
-
 function scrollToBottom() {
 	setTimeout(() => {
 		listRef.value.scrollTo({

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

@@ -5,10 +5,10 @@
 		</div>
 		<div ref="listRef" class="content">
 			<el-timeline>
-        <el-timeline-item v-for="(item, index) in remoteStore.currentRemote.log || []" :key="index"
+				<el-timeline-item v-for="(item, index) in remoteWsStore.remoteTasks[remoteWsStore.currentTaskIndex]?.log || []" :key="index"
 													:timestamp="dateFormater('yyyy-MM-dd HH:mm:ss', item.time)"
 													:class="{ 'alarm': item.state === '连接失败' || item.state === '异常' }">
-          {{ item.title + ' ' + item.state }}
+					{{ item.taskName + ' ' + item.state }}
 				</el-timeline-item>
 			</el-timeline>
 		</div>
@@ -16,10 +16,9 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import type { RemoteLogItem, RemoteItem } from '@/utils/public-interface'
-import { useRemoteStore } from '@/stores/remote-info-store'
-import { dateFormater } from '@/utils/date-util'
+import {ref} from 'vue'
+import {dateFormater} from '@/utils/date-util'
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 
 defineExpose({
@@ -27,12 +26,11 @@ defineExpose({
 	scrollToBottom
 })
 
-const remoteStore = useRemoteStore()
+const remoteWsStore = useRemoteWsStore()
 const listRef = ref()
 
-function setData(e: RemoteLogItem, index: number) {
-  remoteStore.setRemoteLog(e, index)
-  remoteStore.$patch({currentRemote: remoteStore.remoteTasks[index]})
+function setData(e: any, index: number) {
+	remoteWsStore.setRemoteLog(e, index)
 }
 
 function scrollToBottom() {

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

@@ -5,13 +5,23 @@
       <div class="info">
         <h3>连接云服务器</h3>
         <br>
-                <p><strong>云服务器连接状态：{{ patientInfo.isRemote ? '已连接' : '未连接' }}</strong></p>
-                <p>输入用户名：{{ patientInfo.serverUser }}</p>
+        <p>云服务器连接状态：{{ patientInfo.isRemote ? '已连接' : '未连接' }}</p>
+        <!-- <p>输入用户名：{{ patientInfo.serverun }}</p>
         <p>密码：*********</p>
-                <br>
-                <p class="input-box"><span>输入病人姓名：</span><el-input v-model="patientInfo.patientName"></el-input></p>
-                <p class="input-box"><span>输入病人住院号：</span><el-input v-model="patientInfo.patientCode"></el-input></p>
-                
+        <br>-->
+        <p class="input-box"><span>输入病人姓名：</span>
+          <el-input v-model="patientInfo.patient"></el-input>
+        </p>
+        <p class="input-box"><span>输入病人身份证号：</span>
+          <el-input v-model="patientInfo.patientId"></el-input>
+        </p>
+        <p class="input-box"><span>请选择手术时间：</span>
+          <el-date-picker
+            v-model="patientInfo.date"
+            type="date"
+            placeholder="请选择日期"
+          />
+        </p>
       </div>
     </div>
     <div class="btn-box">
@@ -23,43 +33,53 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { useRouter } from 'vue-router'
-import { useRemoteStore } from '@/stores/remote-info-store';
-import type { RemoteItem } from '@/utils/public-interface';
-
-const router = useRouter()
+import {ref} from 'vue'
+import {ElMessage} from 'element-plus'
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
+import {dateFormater} from "@/utils/date-util";
 
 const emit = defineEmits(['confirmRemote', 'errorRemote', 'breakRemote'])
 
 const dialogVisible = ref(false)
-const patientInfo = ref({} as RemoteItem)
+const patientInfo = ref({} as any)
+const remoteWsStore = useRemoteWsStore();
 
 defineExpose({
   open,
   close,
 })
-onMounted(() => {
 
-})
-
-function open(e: RemoteItem) {
-    patientInfo.value = JSON.parse(JSON.stringify(e))
+function open(e: number) {
+  patientInfo.value = remoteWsStore.remoteTasks[e]
   dialogVisible.value = true
 }
+
 function close() {
   dialogVisible.value = false
 }
 
 const confirmRemote = () => {
-    if(patientInfo.value.patientCode) {
+  if (patientInfo.value.patientId && patientInfo.value.patient) {
     ElMessage.success('连接成功！')
     patientInfo.value.isRemote = true
-        patientInfo.value.title = '远程控制' + (patientInfo.value.index + 1)
+    patientInfo.value.taskName = '远程控制' + (patientInfo.value.index + 1)
+    patientInfo.value.date = dateFormater("yyyy-MM-dd", patientInfo.value.date)
+    unsubscribeLastTask();
+    remoteWsStore.$patch({currentTaskIndex: patientInfo.value.index})
+    remoteWsStore.setRemoteLog({
+      time: new Date(),
+      taskName: patientInfo.value.taskName,
+      state: '连接成功',
+      type: "normal"
+    }, remoteWsStore.currentTaskIndex)
     emit('confirmRemote', patientInfo.value)
     close()
-    }else{
+  } else {
+    remoteWsStore.setRemoteLog({
+      time: new Date(),
+      taskName: patientInfo.value.taskName,
+      state: '连接失败'
+    }, patientInfo.value.index)
     ElMessage.error('连接失败！')
     emit('errorRemote', patientInfo.value)
   }
@@ -70,6 +90,14 @@ const breakRemote = () => {
   close()
 }
 
+const unsubscribeLastTask = () => {
+  const lastTaskIndex = remoteWsStore.currentTaskIndex;
+  const lastTask: any = remoteWsStore.remoteTasks[lastTaskIndex];
+  if (lastTask) {
+    remoteWsStore.unsubscribeVital(lastTask.patient, lastTask.patientId, lastTask.date);
+  }
+}
+
 </script>
 
 <style lang='scss' scoped>
@@ -116,6 +144,7 @@ const breakRemote = () => {
         }
     }
 }
+
 .btn-box {
     display: flex;
     justify-content: center;

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

@@ -1,22 +1,23 @@
 <template>
 	<div class="remote-item-part">
 		<div class="title">
-      <span>{{ remoteTask.title || '远程控制' }}</span>
+			<span>{{ remoteTask.taskName || '远程控制' }}</span>
 		</div>
 		<div class="content mini" :class="{ 'is-total': remoteTask.isRemote }">
 			<div class="left-box">
 				<div class="info-box">
 					<div class="row-item">
 						<span class="label">病人名称</span>
-            <span class="input-value">{{ patientInfo.name }}</span>
+						<span class="input-value">{{ remoteTask.patient }}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">住院号</span>
-            <span class="input-value">{{ patientInfo.code }}</span>
+						<span class="input-value">{{ remoteTask.patientId }}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">手术时间</span>
-            <span class="input-value">{{ patientInfo.time && dateFormater('yyyy-MM-dd HH:mm:ss', patientInfo.time)
+						<span class="input-value">{{
+								remoteTask.date
 							}}</span>
 					</div>
 					<div class="row-item">
@@ -25,11 +26,11 @@
 						<span class="tag-value" :class="{ 'alarm': patientInfo.state }">异常</span>
 					</div>
 				</div>
-        <div class="row-item" :class="{ 'alarm': patientInfo.BIS < 40 || patientInfo.BIS > 60 }">
+				<div class="row-item" :class="{ 'alarm': patientInfo.BIS_except }">
 					<span class="label">BIS</span>
 					<span class="value">{{ patientInfo.BIS }}</span>
 				</div>
-        <div class="row-item" :class="{ 'alarm': patientInfo.SBP < 90 || patientInfo.SBP > 120 }">
+				<div class="row-item" :class="{ 'alarm': patientInfo.SBP_except }">
 					<span class="label">SBP</span>
 					<span class="value">{{ patientInfo.SBP }}<span class="unit">mmHg</span></span>
 				</div>
@@ -37,11 +38,11 @@
 					<span class="label">SPO2</span>
 					<span class="value">{{ patientInfo.SPO2 }}</span>
 				</div>
-        <div class="row-item yellow" :class="{ 'alarm': patientInfo.DBP < 60 || patientInfo.DBP > 90 }">
+				<div class="row-item yellow" :class="{ 'alarm': patientInfo.DBP_except }">
 					<span class="label">DBP</span>
 					<span class="value">{{ patientInfo.DBP }}<span class="unit">mmHg</span></span>
 				</div>
-        <div class="row-item yellow" :class="{ 'alarm': patientInfo.HR < 50 || patientInfo.HR > 80 }">
+				<div class="row-item yellow" :class="{ 'alarm': patientInfo.HR_except }">
 					<span class="label">HR</span>
 					<span class="value">{{ patientInfo.HR }}<span class="unit">次/分</span></span>
 				</div>
@@ -58,65 +59,56 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, onBeforeUnmount, reactive, ref, toRefs, watch } from 'vue'
-import type { RemoteItem, PatientInfoItem, RemoteLogItem } from '@/utils/public-interface'
-import { useRemoteStore } from '@/stores/remote-info-store'
-import { dateFormater } from '@/utils/date-util'
-import { setRemoteLog } from '@/static-data/core'
+import {onMounted, onUnmounted, ref} from 'vue'
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
-interface Props {
-  index: number
-}
-const props = withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<{ index: number }>(), {
 	index: () => 0
 })
-
 const emit = defineEmits(['addLogAfter'])
-
-const remoteStore = useRemoteStore()
-const remoteTask = remoteStore.remoteTasks[props.index]
-let timer = 0
-const patientInfo = ref({} as PatientInfoItem)
+const remoteWsStore = useRemoteWsStore();
+const remoteTask = ref(remoteWsStore.remoteTasks[props.index]);
+const patientInfo = ref({} as any)
 
 onMounted(() => {
-  clearInterval(timer)
 	// 连接成功执行查询
-  if (remoteTask.isRemote) {
-    timer = setInterval(() => {
+	if (remoteTask.value.isRemote) {
 		initData()
-    }, 2000)
 	}
 })
-onBeforeUnmount(() => {
-  // 页面卸载后清楚定时器
-  clearInterval(timer)
+onUnmounted(() => {
+	remoteWsStore.unsubscribeVital(remoteTask.value.patient, remoteTask.value.patientId, remoteTask.value.date);
 })
 
 function initData() {
-  remoteTask.dataAlarm = false
-  const obj = {
-    name: remoteTask.patientName,
-    code: '',
-    time: new Date(),
-    state: false,
-    BIS: Number((Math.random() * 100).toFixed(2)),
-    SBP: Number((Math.random() * 100).toFixed(2)),
-    SPO2: Number((Math.random() * 100).toFixed(2)),
-    DBP: Number((Math.random() * 100).toFixed(2)),
-    HR: Number((Math.random() * 100).toFixed(2)),
-    TEMP: Number((Math.random() * 100).toFixed(2))
-  }
-  setRemoteLog(obj, (title: string, size: string) => {
-    obj.state = true
-    remoteTask.dataAlarm = true
-    remoteStore.setRemoteLog({
-      time: new Date(),
-      title,
-      state: '异常'
-    }, props.index)
-  })
-  Object.assign(patientInfo.value, obj)
+	subscribeVital();
+}
+
+function subscribeVital() {
+	remoteWsStore.subscribeVital(remoteTask.value.patient, remoteTask.value.patientId, remoteTask.value.date, (res: any) => {
+		const data = JSON.parse(res.data);
+		if (data.vitalSignsList && data.vitalSignsList.length > 0) {
+			Object.assign(patientInfo.value, data.vitalSignsList[0]);
+			patientInfo.value.state = (patientInfo.value.BIS_except || patientInfo.value.SBP_except ||
+				patientInfo.value.DBP_except || patientInfo.value.HR_except);
+      setLog(patientInfo.value, props.index)
       emit('addLogAfter', props.index)
+		}
+	})
+}
+
+function setLog(data: any, index: number) {
+  remoteWsStore.exceptionType.forEach((item: any) => {
+    if (data[item]) {
+      const msg: any = remoteWsStore.exceptionMsg[item];
+      remoteWsStore.setRemoteLog({
+        state: msg,
+        taskName: remoteTask.value.taskName,
+        time: new Date(),
+        type: "exception"
+      }, index);
+    }
+  })
 }
 
 </script>

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

@@ -1,8 +1,8 @@
 <template>
 	<div class="remote-part">
 		<div class="title">
-            <span>{{ remoteItem?.title || '远程控制' }}</span>
-            <el-button v-if="remoteItem" class="break-btn" @click="breakRemote">断开连接</el-button>
+			<span>{{ remoteItem?.taskName || '远程控制' }}</span>
+			<el-button v-if="remoteItem?.taskName" class="break-btn" @click="breakRemote">断开连接</el-button>
 		</div>
 		<!-- 小分辨率 -->
 		<div v-if="mediaMini800" class="content mini" :class="{'is-total': remoteItem?.isRemote}">
@@ -10,15 +10,17 @@
 				<div class="info-box">
 					<div class="row-item">
 						<span class="label">病人名称</span>
-                        <span class="input-value">{{ patientInfo.name }}</span>
+						<span class="input-value">{{ remoteItem.patient }}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">住院号</span>
-                        <span class="input-value">{{ patientInfo.code }}</span>
+						<span class="input-value">{{ remoteItem.patientId }}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">手术时间</span>
-                        <span class="input-value">{{ patientInfo.time && dateFormater('yyyy-MM-dd HH:mm:ss', patientInfo.time) }}</span>
+						<span class="input-value">{{
+								remoteItem.date
+							}}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">手术状态</span>
@@ -26,11 +28,11 @@
 						<span class="tag-value" :class="{'alarm': patientInfo.state}">异常</span>
 					</div>
 				</div>
-                <div class="row-item" :class="{'alarm': patientInfo.BIS < 40 || patientInfo.BIS > 60}">
+				<div class="row-item" :class="{'alarm': patientInfo.BIS_except}">
 					<span class="label">BIS</span>
 					<span class="value">{{ patientInfo.BIS }}</span>
 				</div>
-                <div class="row-item" :class="{'alarm': patientInfo.SBP < 90 || patientInfo.SBP > 120}">
+				<div class="row-item" :class="{'alarm': patientInfo.SBP_except}">
 					<span class="label">SBP</span>
 					<span class="value">{{ patientInfo.SBP }}<span class="unit">mmHg</span></span>
 				</div>
@@ -38,11 +40,11 @@
 					<span class="label">SPO2</span>
 					<span class="value">{{ patientInfo.SPO2 }}</span>
 				</div>
-                <div class="row-item yellow" :class="{'alarm': patientInfo.DBP < 60 || patientInfo.DBP > 90}">
+				<div class="row-item yellow" :class="{'alarm': patientInfo.DBP_except}">
 					<span class="label">DBP</span>
 					<span class="value">{{ patientInfo.DBP }}<span class="unit">mmHg</span></span>
 				</div>
-                <div class="row-item yellow" :class="{'alarm': patientInfo.HR < 50 || patientInfo.HR > 80}">
+				<div class="row-item yellow" :class="{'alarm': patientInfo.HR_except}">
 					<span class="label">HR</span>
 					<span class="value">{{ patientInfo.HR }}<span class="unit">次/分</span></span>
 				</div>
@@ -60,18 +62,18 @@
 				<div class="info-box">
 					<div class="row-item">
 						<span class="label">病人名称</span>
-                        <span class="input-value">{{ patientInfo.name }}</span>
+						<span class="input-value">{{ remoteItem.patient }}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">住院号</span>
-                        <span class="input-value">{{ patientInfo.code }}</span>
+						<span class="input-value">{{ remoteItem.patientId }}</span>
 					</div>
 				</div>
-                <div class="row-item" :class="{'alarm': patientInfo.BIS < 40 || patientInfo.BIS > 60}">
+				<div class="row-item" :class="{'alarm': patientInfo.BIS_except}">
 					<span class="label">BIS</span>
 					<span class="value">{{ patientInfo.BIS }}</span>
 				</div>
-                <div class="row-item" :class="{'alarm': patientInfo.SBP < 90 || patientInfo.SBP > 120}">
+				<div class="row-item" :class="{'alarm': patientInfo.SBP_except}">
 					<span class="label">SBP</span>
 					<span class="value">{{ patientInfo.SBP }}<span class="unit">mmHg</span></span>
 				</div>
@@ -87,7 +89,9 @@
 				<div class="info-box">
 					<div class="row-item">
 						<span class="label">手术时间</span>
-                        <span class="input-value">{{ patientInfo.time && dateFormater('yyyy-MM-dd HH:mm:ss', patientInfo.time) }}</span>
+						<span class="input-value">{{
+								remoteItem.date
+							}}</span>
 					</div>
 					<div class="row-item">
 						<span class="label">手术状态</span>
@@ -95,11 +99,11 @@
 						<span class="tag-value" :class="{'alarm': patientInfo.state}">异常</span>
 					</div>
 				</div>
-                <div class="row-item" :class="{'alarm': patientInfo.DBP < 60 || patientInfo.DBP > 90}">
+				<div class="row-item" :class="{'alarm': patientInfo.DBP_except}">
 					<span class="label">DBP</span>
 					<span class="value">{{ patientInfo.DBP }}<span class="unit">mmHg</span></span>
 				</div>
-                <div class="row-item" :class="{'alarm': patientInfo.HR < 50 || patientInfo.HR > 80}">
+				<div class="row-item" :class="{'alarm': patientInfo.HR_except}">
 					<span class="label">HR</span>
 					<span class="value">{{ patientInfo.HR }}<span class="unit">次/分</span></span>
 				</div>
@@ -113,78 +117,81 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, onBeforeUnmount, reactive, ref, toRefs, watch } from 'vue'
-import { dateFormater } from '@/utils/date-util'
-import { useRemoteStore } from '@/stores/remote-info-store';
-import type { RemoteItem, PatientInfoItem } from '@/utils/public-interface'
-import { setRemoteLog } from '@/static-data/core'
+import {onUnmounted, ref} from 'vue'
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 const emit = defineEmits(['addLogAfter', 'breakRemote'])
-
-const remoteStore = useRemoteStore()
-let timer = 0
 const mediaMini800 = ref(false)
-const remoteItem = ref<RemoteItem>({} as RemoteItem)
-const patientInfo = ref({} as PatientInfoItem)
-
-initData(remoteStore.currentRemote)
+const remoteItem = ref({} as any)
+const patientInfo = ref({} as any)
+const remoteWsStore = useRemoteWsStore()
 
 defineExpose({
-    initData
-})
-
-onBeforeUnmount(() => {
-  // 页面卸载后清楚定时器
-  clearInterval(timer)
-})
+	initData, showData
+});
 
 window.addEventListener('resize', () => {
 	mediaMini800.value = Boolean(window.innerWidth < 801)
 });
 
-function initData(e?: RemoteItem) {
-    const obj = e || {} as RemoteItem
-    remoteItem.value = obj
-    patientInfo.value.state = obj.dataAlarm
-    patientInfo.value.name = obj.patientName || ''
-    patientInfo.value.code = 'XXXXXX'
-    clearInterval(timer)
-    if(!patientInfo.value.name) return
-    timer = setInterval(() => {
+onUnmounted(() => {
+	remoteWsStore.unsubscribeVital(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date);
+})
+
+function showData(i: number) {
+	const lastTaskIndex = remoteWsStore.currentTaskIndex;
+	const lastTask: any = remoteWsStore.remoteTasks[lastTaskIndex];
+	if (lastTask) {
+		remoteWsStore.unsubscribeVital(lastTask.patient, lastTask.patientId, lastTask.date);
+	}
+	remoteWsStore.currentTaskIndex = i
+	remoteItem.value = remoteWsStore.remoteTasks[remoteWsStore.currentTaskIndex]
+	getData()
+}
+
+function initData() {
+	remoteItem.value = remoteWsStore.remoteTasks[remoteWsStore.currentTaskIndex]
+	remoteWsStore.createConnect(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date)
 	getData()
-    }, 2000)
 }
 
 function getData() {
-  remoteItem.value.dataAlarm = false
-  const obj = {
-    state: false,
-    BIS: Math.ceil(Math.random() * 100), 
-    SBP: Math.ceil(Math.random() * 100), 
-    SPO2: Math.ceil(Math.random() * 100), 
-    DBP: Math.ceil(Math.random() * 100), 
-    HR: Math.ceil(Math.random() * 100), 
-    TEMP: Math.ceil(Math.random() * 100),
-  } as PatientInfoItem
-  patientInfo.value.time = new Date()
-  setRemoteLog(obj, (title: string, size: string) => {
-    obj.state = true
-    remoteItem.value.dataAlarm = true
-    remoteStore.setRemoteLog({
-      time: new Date(),
-      title,
-      state: '异常'
-    }, remoteItem.value.index)
-  })
-  remoteStore.setRemoteDataAlarm(remoteItem.value.dataAlarm, remoteItem.value.index)
-  remoteStore.$patch({currentRemote: remoteStore.remoteTasks[remoteItem.value.index]})
-  Object.assign(patientInfo.value, obj)
+	remoteWsStore.unsubscribeVital(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date);
+	remoteWsStore.subscribeVital(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date, (res: any) => {
+		if (res && res.data) {
+			const data = JSON.parse(res.data);
+			if (data.vitalSignsList && data.vitalSignsList.length > 0) {
+				Object.assign(patientInfo.value, data.vitalSignsList[0]);
+				patientInfo.value.state = (patientInfo.value.BIS_except || patientInfo.value.SBP_except ||
+					patientInfo.value.DBP_except || patientInfo.value.HR_except);
+				setLog(patientInfo.value)
 				emit('addLogAfter')
+			}
+		}
+	})
+}
+
+function setLog(data: any) {
+	remoteWsStore.exceptionType.forEach((item: any) => {
+		if (data[item]) {
+			const msg: any = remoteWsStore.exceptionMsg[item];
+			remoteWsStore.setRemoteLog({
+				state: msg,
+				taskName: remoteItem.value.taskName,
+				time: new Date(),
+				type: "exception"
+			}, remoteWsStore.currentTaskIndex);
+		}
+	})
 }
 
 const breakRemote = () => {
-    remoteItem.value.isRemote = false
-    emit('breakRemote', remoteItem.value)
+	remoteWsStore.disconnect(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date)
+	remoteWsStore.resetRemoteTask(remoteWsStore.currentTaskIndex)
+	if (remoteWsStore.getActiveRemoteTask()) {
+		showData(remoteWsStore.getActiveRemoteTask())
+	}
+	emit('breakRemote')
 }
 
 </script>
@@ -205,18 +212,21 @@ const breakRemote = () => {
 		font-weight: 600;
 		color: white;
 		background: $main-color;
+
 		.break-btn {
 			position: absolute;
 			top: 4px;
 			right: 20px;
 		}
 	}
+
 	.content {
 		width: 100%;
 		height: calc(100% - 40px);
 		padding: 20px 50px;
 		display: flex;
 		justify-content: space-between;
+
 		.common-box {
 			width: 30%;
 			height: 100%;
@@ -225,6 +235,7 @@ const breakRemote = () => {
 			justify-content: space-evenly;
 			align-items: center;
 		}
+
 		.left-box {
 			@extend .common-box;
 
@@ -232,23 +243,29 @@ const breakRemote = () => {
 				background: $main-color;
 			}
 		}
+
 		.center-box {
 			@extend .common-box;
+
 			img {
 				max-width: 100%;
 				max-height: 100%;
 			}
 		}
+
 		.right-box {
 			@extend .common-box;
+
 			.label {
 				background: $main-color;
 			}
 		}
+
 		.row-item {
 			width: 100%;
 			display: flex;
 			justify-content: space-between;
+
 			.label {
 				flex-shrink: 0;
 				width: 100%;
@@ -260,16 +277,20 @@ const breakRemote = () => {
 				border-radius: 5px;
 			}
 		}
+
 		.info-box, .row-item .value {
 			display: none;
 		}
+
 		&.is-total {
 			.info-box, .row-item .value {
 				display: block;
 			}
+
 			.label {
 				width: calc(50% - 10px);
 			}
+
 			.value {
 				width: 50%;
 				height: 40px;
@@ -282,31 +303,38 @@ const breakRemote = () => {
 				font-size: 22px;
 				line-height: 40px;
 				font-weight: 600;
+
 				.unit {
 					font-size: 16px;
 					font-family: 400;
 				}
 			}
+
 			.right-box .value {
 				color: $main-color;
 				border-color: $main-color;
 			}
+
 			.row-item.alarm {
 				.label {
 					background: red !important;
 				}
+
 				.value {
 					color: red !important;
 					border-color: red !important;
 				}
 			}
+
 			.info-box {
 				width: 100%;
+
 				.row-item {
 					padding: 10px 0;
 					height: 40px;
 					justify-content: flex-start;
 					align-items: center;
+
 					.label {
 						width: 70px;
 						height: 20px;
@@ -317,6 +345,7 @@ const breakRemote = () => {
 						font-weight: 600;
 						text-align: left;
 					}
+
 					.input-value {
 						width: 100%;
 						height: 21px;
@@ -325,6 +354,7 @@ const breakRemote = () => {
 						color: $main-color;
 						border-bottom: 1px solid $border2-color;
 					}
+
 					.tag-value {
 						margin-left: 30px;
 						padding: 0 20px;
@@ -335,9 +365,11 @@ const breakRemote = () => {
 						font-weight: 600;
 						background: $border2-color;
 						border-radius: 8px;
+
 						&.normal {
 							background: $main-color;
 						}
+
 						&.alarm {
 							background: red;
 						}
@@ -345,26 +377,32 @@ const breakRemote = () => {
 				}
 			}
 		}
+
 		&.mini {
 			padding: 20px;
+
 			.left-box {
 				width: 240px;
 			}
+
 			.center-box {
 				width: calc(100% - 250px);
 			}
+
 			&.is-total {
 				.left-box {
 					.info-box {
 						display: block;
 						flex-shrink: 0;
 					}
+
 					.row-item.yellow {
 						.label {
 							background: $main-color;
 						}
+
 						.value {
-                            color:$main-color;
+							color: $main-color;
 							border-color: $main-color;
 						}
 					}

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

@@ -2,16 +2,17 @@
 	<div class="remote-box" id="screenBox">
 		<div class="main-box">
 			<div class="left-box">
-        <h3>{{ useRemoteStore().getCurrentRemote().title }}</h3>
+				<h3>{{ currentRemote.taskName }}</h3>
 				<chart-line ref="chartDom1" class="chart-line" :names="['BIS', 'HR']"
-                    :chartData="featureTable"></chart-line>
+										@exception-event="vitalExcepEvent"></chart-line>
 				<chart-line ref="chartDom2" class="chart-line" :names="['SBP', 'DBP']"
-                    :chartData="featureTable"></chart-line>
+										@exception-event="vitalExcepEvent"></chart-line>
 				<chart-line ref="chartDom3" class="chart-line" :names="['SPO2', 'TEMP']"
-                    :chartData="featureTable"></chart-line>
-        <chart-ecg ref="chartDom4" class="chart-ecg" :chartData="featureTable"></chart-ecg>
-
+										@exception-event="vitalExcepEvent"></chart-line>
+				<chart-ecg ref="chartDom4" class="chart-ecg" :name="['CH1', 'CH2']"
+									 @exception-event="vitalExcepEvent"></chart-ecg>
 			</div>
+
 			<div class="center-box">
 				<div class="body-box">
 					<div class="body-img">
@@ -20,21 +21,18 @@
 						<img class="heart-img" :class="{ 'shake_1': heartAlarm }"
 								 :src="heartAlarm ? imgHeartAlarm : imgHeart">
 					</div>
-
 				</div>
 				<div class="btn-box">
-          <el-button class="start-btn" color="#F80000" @click="getTableData(!isStart)">{{
-              isStart ? '终止' : '开始'
-            }}
+					<el-button class="start-btn" color="#F80000" @click="startAI">
+						开始
 					</el-button>
 					<div class="right-btn-box">
-            <el-button :class="{ 'active': isAIDose }" size="small" @click="getTableData(true)">AI给药</el-button>
-            <el-button :class="{ 'active': !isAIDose }" size="small"
-                       @click="getTableData(false)">人工给药
-            </el-button>
+						<el-button :class="{ 'active': isAIDose }" size="small" @click="">AI给药</el-button>
+						<el-button :class="{ 'active': !isAIDose }" size="small">人工给药</el-button>
 					</div>
 				</div>
 			</div>
+
 			<div class="right-box">
 				<div class="top-btn-box">
 					<div class="top-left-btn-box">
@@ -57,7 +55,7 @@
 				<div class="monitoring-message">
 					<div class="left-box">
 						<span class="unusual-title">异常信息</span>
-            <ul ref="unusualMsg" class="unusual-box">
+						<ul ref="unusualMsgRef" class="unusual-box">
 							<li v-for="item in unusual" :key="item">{{ item }}</li>
 						</ul>
 					</div>
@@ -79,8 +77,8 @@
 						<div class="message-box">
 							<ul ref="msgLog" class="message-log">
 								<li v-for="(item, index) in mssageList" :key="'msg-log-' + index"
-                    :class="{ 'align-right': item.user === userName }">
-                  <span>{{ item.msg }}</span>
+										:class="{ 'align-right': item.createName == userName }">
+									<span>{{ item.content }}</span>
 								</li>
 							</ul>
 							<div class="send-box">
@@ -92,7 +90,7 @@
 				</div>
 				<!-- table1 -->
 				<div class="table-box">
-          <el-table :data="tableData" height="100%" style="width: 100%">
+					<el-table :data="varTableData" height="100%" style="width: 100%">
 						<el-table-column prop="num" label="票号" width="40" align="center"/>
 						<el-table-column prop="name" label="药物名称" align="center"/>
 						<el-table-column prop="speed" label="速度(ml/h)" width="120">
@@ -128,11 +126,11 @@
 											<Minus/>
 										</el-icon>
 									</el-button>
-                  <el-button size="small" color="#006080" @click="tableItemConfirm(scope)"
-                             :disabled="tableDataStore[scope.$index].speed === scope.row.speed">确定
+									<!--									<el-button size="small" color="#006080" @click="tableItemConfirm(scope)"
+                                               :disabled="tableDataStore[scope.$index].speed === scope.row.speed">确定-->
+									<el-button size="small" color="#006080" @click="tableItemConfirm(scope, varTableData)">确定
 									</el-button>
-                  <el-button size="small" color="#006080" @click="tableItemCancel(scope)"
-                             :disabled="tableDataStore[scope.$index].speed === scope.row.speed">取消
+									<el-button size="small" color="#006080" @click="tableItemCancel(scope, varTableData)">取消
 									</el-button>
 								</div>
 							</template>
@@ -141,7 +139,7 @@
 				</div>
 				<!-- table2 -->
 				<div class="table-box">
-          <el-table :data="tableData" height="100%" style="width: 100%">
+					<el-table :data="fixedTableData" height="100%" style="width: 100%">
 						<el-table-column prop="num" label="票号" width="40" align="center"/>
 						<el-table-column prop="name" label="药物名称" align="center"/>
 						<el-table-column prop="speed" label="速度(ml/h)" width="100"/>
@@ -163,11 +161,9 @@
 											<Minus/>
 										</el-icon>
 									</el-button>
-                  <el-button size="small" color="#006080" @click="tableItemConfirm(scope)"
-                             :disabled="tableDataStore[scope.$index].speed === scope.row.speed">确定
+									<el-button size="small" color="#006080" @click="tableItemConfirm(scope, fixedTableData)">确定
 									</el-button>
-                  <el-button size="small" color="#006080" @click="tableItemCancel(scope)"
-                             :disabled="tableDataStore[scope.$index].speed === scope.row.speed">取消
+									<el-button size="small" color="#006080" @click="tableItemCancel(scope, fixedTableData)">取消
 									</el-button>
 								</div>
 							</template>
@@ -195,12 +191,10 @@
 </template>
 
 <script lang="ts" setup>
-import {onMounted, ref, reactive, onBeforeUnmount} from 'vue';
-import {useRouter, useRoute} from 'vue-router'
-import {ElMessageBox, ElMessage} from 'element-plus';
-import {useRemoteStore} from '@/stores/remote-info-store'
+import {onMounted, onUnmounted, reactive, ref} from 'vue';
+import {useRouter} from 'vue-router'
+import {ElMessage} from 'element-plus';
 import {dateFormater} from '@/utils/date-util';
-import {post} from "@/utils/request";
 import chartLine from './chart/chart-line.vue';
 import chartEcg from './chart/chart-ecg.vue';
 import PatientsForm from '@/views/patients-manage/form/patients-form.vue'
@@ -208,10 +202,12 @@ import imgLung from '@/assets/imgs/lung.png';
 import imgHeart from '@/assets/imgs/heart.png';
 import imgLungAlarm from '@/assets/imgs/lung_alarm.png';
 import imgHeartAlarm from '@/assets/imgs/heart_alarm.png';
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
+import {useLoginStore} from "@/stores/user-info-store";
+import {getPatientInfo} from "@/api/patient";
 
 
 const router = useRouter()
-const route = useRoute()
 
 const medicineCustom: any[] = [
 	{name: '丙泊酚', plus: 0.5, total: 50},
@@ -223,12 +219,10 @@ const medicineCustom: any[] = [
 	{name: '麻黄素', plus: 1, total: 100},
 	{name: '阿托品', plus: 1, total: 100},
 	{name: '罗库溴铵', plus: 0.1, total: 10}
-];
-let featureTimer = 0;
-let ecgTimer = 0;
-let aiFlagTimer = 0;
-let medicineTimer = 0;
-const currentRemote = useRemoteStore().getCurrentRemote()
+]
+const remoteWsStore = useRemoteWsStore()
+const currentRemote = ref(remoteWsStore.remoteTasks[remoteWsStore.currentTaskIndex])
+const userInfo = useLoginStore()
 
 const chartDom1 = ref(),
 	chartDom2 = ref(),
@@ -236,294 +230,197 @@ const chartDom1 = ref(),
 	chartDom4 = ref(),
 	liveVideo = ref(),
 	msgLog = ref(),
-    unusualMsg = ref(),
-    patientsFormRef = ref();
+	unusualMsgRef = ref(),
+	patientsFormRef = ref()
 
 const isPatientDialog = ref(false)
-const database = ref('');
-const databaseOptions = ref([] as { value: string, label: string }[]);
-const messageSum = ref(10);
-const userName = ref('admin');
+const database = ref('')
+const databaseOptions = ref([] as { value: string, label: string }[])
+const messageSum = ref(10)
+const userName = ref(userInfo.login.name)
 const setDatabaseDialog = ref(false);
 const featureTable = ref([] as any[]);
 let chartNowData = reactive({ID: 0});
 const lungAlarm = ref(false); // 肺部警告
 const heartAlarm = ref(false); // 心脏警告
-const isStart = ref(false); // 是否开始
 const isAIDose = ref(false); // 是否AI给药
 const isVideoPlay = ref(false); // 视频是否播放
 const videoSrc = ref('https://www.runoob.com/try/demo_source/mov_bbb.mp4');
 const mssageList = ref([] as any);
 const msgVal = ref('');
 const unusual = ref([] as any);
-const tableData = ref([] as any[]);
-const tableDataStore = ref([] as any[]);
-const table1SpeedVal = ref('')
+const fixedTableData = ref([] as any[]);
+const varTableData = ref([] as any[]);
+const table1SpeedVal = ref('');
+let currentAIMedicine: any;
+let currentDocMedicine: any;
+const medicineSpeedTemp: any = {};
 
-getDatabases();
 onMounted(() => {
-  if (currentRemote.isRemote) {
-
-  } else {
-    router.replace('/remote-manage/remote-manage')
-    return
+	if (!currentRemote.value.isRemote) {
+		router.replace('/remote-manage/remote-manage');
+		return;
 	}
 	msgLogScrollBottom();
-  getChartData(); // 定时任务
-  getAIFlag(); // 定时任务
-  getMedicine(); // 定时任务
 	initScale();
-
+	subscribeWS();
+//	setTableData();
 });
-// 页面卸载前清除定时器
-onBeforeUnmount(() => {
-  clearInterval(featureTimer)
-  clearInterval(ecgTimer)
-  clearInterval(aiFlagTimer)
-  clearInterval(medicineTimer)
+
+onUnmounted(() => {
+	remoteWsStore.unsubscribeChat(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date);
+	remoteWsStore.unsubscribeMedicine(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date);
+	remoteWsStore.unsubscribeVital(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date);
 })
 
+function subscribeWS() {
+	remoteWsStore.subscribeVital(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date,
+		function (res: any) {
+			const data = JSON.parse(res.data);
+			chartDom1.value.updateChartData(data.vitalSignsList[0]);
+			chartDom2.value.updateChartData(data.vitalSignsList[0]);
+			chartDom3.value.updateChartData(data.vitalSignsList[0]);
+			chartDom4.value.updateChartData(data.vitalSignsList[0]);
+			updateMedicineTable(data.aiMedicineList[0], data.docMedicineList[0]);
+		})
+
+	remoteWsStore.subscribeChat(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date,
+		function (res: any) {
+			mssageList.value.push(JSON.parse(res.data));
+		})
+
+	remoteWsStore.subscribeMedicine(currentRemote.value.patient, currentRemote.value.patientId, currentRemote.value.date,
+		function (res: any) {
+			const data = JSON.parse(res.data);
+			if (data.status != 1) {
+				if (data.medicine) {
+					if (varTableData.value[data.medicine]) varTableData.value[data.medicine] = medicineSpeedTemp[data.medicine];
+					if (fixedTableData.value[data.medicine]) fixedTableData.value[data.medicine] = medicineSpeedTemp[data.medicine];
+				}
+			} else {
+				ElMessage.error(data.msg)
+			}
+		})
+}
+
 function initData() {
 	lungAlarm.value = false;
 	heartAlarm.value = false;
-  isStart.value = false;
 	isAIDose.value = false;
 	unusual.value = [];
 	mssageList.value = [];
-  tableData.value = [];
-  tableDataStore.value = [];
-  const currentRemote = useRemoteStore().getCurrentRemote() // 当前远程连接
-
-  getFeatureTable();
-  getMssageLog();
-  getTableData(isAIDose.value);
+	fixedTableData.value = [];
+	varTableData.value = [];
+	featureTable.value = [];
 	try {
 		msgLogScrollBottom();
 	} catch (error) {
 	}
-
 }
 
-// AIFlagTable 表2秒获取一次
-function getAIFlag() {
-  let isRunTimer = true;
-  clearInterval(aiFlagTimer);
-  aiFlagTimer = setInterval(() => {
-    if (isRunTimer) {
-      isRunTimer = false;
-      post('/getaiflag', {database: database.value, start: 0, end: 1}, (res: any) => {
-        if (res.status === 200 && res.data.length > 0) {
-          const flag = Boolean(res.data[0].Flag);
-          if (isAIDose.value !== flag) getTableData(Boolean(res.data[0].Flag));
-        }
-        isRunTimer = true;
-      });
-    }
-  }, 2000);
-}
-
-function setTableData(res: any) {
-  if (res.data.length > 0) {
-    let i = 0;
-    const ary: any = [];
-    for (let key in res.data[0]) {
-      if (key !== 'ID' && key !== 'Phase' && key !== 'Time' && key !== 'TIME') {
-        i++;
-        ary.push({
-          Phase: res.data[0].Phase,
-          num: i,
-          name: key,
-          speed: res.data[0][key],
-          total: medicineCustom.find(o => o.name === key)?.total,
-          state: '正常'
-        });
-      }
-    }
-    tableData.value = ary;
-
+function updateMedicineTable(aiMedicine: any, doctorMedicine: any) {
+	if (aiMedicine) {
+		delete aiMedicine._id;
+		delete aiMedicine.Time;
+		if (currentAIMedicine && currentAIMedicine.Time == aiMedicine.Time) {
 		} else {
-    const defaultMedicine: string[] = ['丙泊酚', '舒芬太尼', '瑞芬太尼', '顺阿曲库胺', '尼卡地平', '艾司洛尔', '麻黄素', '阿托品'];
-    const ary: any = [];
-    defaultMedicine.forEach((item, index) => {
-      ary.push({
-        Phase: 1,
-        num: index + 1,
-        name: item,
-        speed: 0,
-        total: medicineCustom.find(o => o.name === item)?.total,
-        state: '正常'
-      });
-    });
-    tableData.value = ary;
-  }
-  tableDataStore.value = JSON.parse(JSON.stringify(tableData.value));
-}
-
-// AIMedicineTable、DoctorMedicineTable 表2秒获取一次
-function getMedicine() {
-  let isRunTimer = true;
-  clearInterval(medicineTimer);
-  medicineTimer = setInterval(() => {
-    if (isRunTimer && JSON.stringify(tableDataStore) === JSON.stringify(tableData) && isAIDose.value) {
-      isRunTimer = false;
-      const url = isAIDose.value ? '/getaimedicine' : '/getdoctormedicine';
-      post(url, {database: database.value, start: 0, end: 1}, (res: any) => {
-        if (res.status === 200) {
-          setTableData(res);
-        }
-        isRunTimer = true;
-      });
-    }
-  }, 2000);
-}
-
-// FeatureTable 表2秒获取一次
-function getChartData() {
-  let isRunTimer = true;
-  clearInterval(featureTimer);
-  clearInterval(ecgTimer);
-  featureTimer = setInterval(() => {
-    if (isRunTimer) {
-      getData()
-    }
-  }, 2000);
-  ecgTimer = setInterval(() => {
-    try {
-      chartDom4.value.updateChart(0, new Date());
-    } catch (error) {
-    }
-  }, 1000);
-
-  function getData() {
-    isRunTimer = false;
-    post('/getfeature', {database: database.value, start: 0, end: 1}, (res: any) => {
-      const obj = (res.data && res.data[0]) || {};
-      if (obj.ID !== chartNowData.ID) {
-        chartNowData = obj;
-        const isHR = obj.HR >= 50 && obj.HR <= 80;
-        const isSBP = obj.SBP >= 90 && obj.SBP <= 120;
-        const isDBP = obj.DBP >= 60 && obj.DBP <= 90;
-        // const isST = obj.ST >= -0.2 && obj.ST <= 0.2;
-        if (!isHR) unusualUpDate('心率异常');
-        if (!isSBP) unusualUpDate('收缩压异常');
-        if (!isDBP) unusualUpDate('舒张异常');
-        // if (!isST) unusualUpDate('心电图ST段变异度异常');
-        lungAlarm.value = Boolean(!isSBP || !isDBP);
-        // heartAlarm.value = Boolean(!isHR || !isST);
-        heartAlarm.value = Boolean(!isHR);
-        chartDom1.value.updateChart([obj.BIS, obj.HR], obj.Time || obj.TIME);
-        chartDom2.value.updateChart([obj.SBP, obj.DBP], obj.Time || obj.TIME);
-        chartDom3.value.updateChart([obj.SPO2, obj.TEMP], obj.Time || obj.TIME);
-        // chartDom4.value.updateChart(obj.ST, obj.Time || obj.TIME);
-      }
-      isRunTimer = true;
-    });
-  }
-}
-
-function getFeatureTable() {
-  featureTable.value = [];
-  post('/getfeature', {database: database.value, start: 1, end: 50}, (res: any) => {
-    if (res.status === 200) {
-      featureTable.value = res.data.reverse();
-      setTimeout(() => {
-        chartDom1.value.chartSet();
-        chartDom2.value.chartSet();
-        chartDom3.value.chartSet();
-        chartDom4.value.chartSet();
-      }, 0);
-    } else {
-      ElMessage({
-        message: res.message,
-        type: 'error',
-      });
-    }
-  });
-}
-
-function getDatabases() {
-  post('/getdatabases', {}, (res: any) => {
-    if (res.status === 200) {
-      databaseOptions.value = [];
-      const hideDatabase = ['information_schema', 'mysql', 'performance_schema', '北工大412824200020002000', '数据模拟412824200020002000'];
-      res.data.forEach((item: any, index: number) => {
-        if (!hideDatabase.some(e => e === item.Database)) databaseOptions.value.push({
-          value: item.Database,
-          label: item.Database
-        });
+			currentAIMedicine = aiMedicine;
+			const keys = Object.keys(aiMedicine);
+			keys.forEach(key => {
+				medicineSpeedTemp[key] = aiMedicine[key];
 			})
-      database.value = databaseOptions.value[0].label;
-      initData();
+			if (varTableData.value.length > 0) {
+				varTableData.value.forEach((medicine: any) => {
+					medicine.speed = aiMedicine[medicine.name];
+				})
+				fixedTableData.value.forEach((medicine: any) => {
+					medicine.speed = aiMedicine[medicine.name];
+				})
+			} else {
+				const varTable: any = [];
+				const fixedTable: any = [];
+				keys.forEach(key => {
+					const medicine = {
+						Phase: 0,
+						name: key,
+						speed: aiMedicine[key],
+						total: 0,
+						state: "正常"
 					}
+					if (remoteWsStore.varMedicine.includes(key)) {
+						varTable.push(medicine);
+					} else {
+						fixedTable.push(medicine);
+					}
+				})
+				varTableData.value = varTable;
+				fixedTableData.value = fixedTable;
+			}
+		}
+	}
+
+	if (doctorMedicine) {
+		delete doctorMedicine._id;
+		delete doctorMedicine.Time;
+		if (currentDocMedicine && currentDocMedicine.Time == doctorMedicine.Time) {
+		} else {
+			currentDocMedicine = doctorMedicine;
+			const keys = Object.keys(doctorMedicine);
+			keys.forEach(key => {
+				medicineSpeedTemp[key] = doctorMedicine[key];
+			})
+
+			if (varTableData.value.length > 0) {
+				varTableData.value.forEach((medicine: any) => {
+					medicine.speed = doctorMedicine[medicine.name];
 				});
+				fixedTableData.value.forEach((medicine: any) => {
+					medicine.speed = doctorMedicine[medicine.name];
+				})
+			} else {
+				const varTable: any = [];
+				const fixedTable: any = [];
+				keys.forEach(key => {
+					const medicine = {
+						Phase: 0,
+						name: key,
+						speed: aiMedicine[key],
+						total: 0,
+						state: "正常"
+					}
+					if (remoteWsStore.varMedicine.includes(key)) {
+						varTable.push(medicine);
+					} else {
+						fixedTable.push(medicine);
+					}
+				})
+				varTableData.value = varTable;
+				fixedTableData.value = fixedTable;
+			}
+		}
+	}
 }
 
-function msgLogScrollBottom() {
-  msgLog.value.scrollTo({
-    top: msgLog.value.scrollHeight,
-    behavior: 'smooth'
-  });
+function vitalExcepEvent(data: any) {
+	logUpdate(data)
 }
 
-function unusualUpDate(msg: string) {
+function logUpdate(msg: string) {
 	unusual.value.push(dateFormater('HH:mm:ss') + msg);
 	setTimeout(() => {
-    unusualMsg.value.scrollTo({
-      top: unusualMsg.value.scrollHeight,
+		unusualMsgRef.value.scrollTo({
+			top: unusualMsgRef.value.scrollHeight,
 			behavior: 'smooth'
 		});
 	});
 }
 
-function getMssageLog() {
-  mssageList.value.push({user: 'admin', msg: '请您把治疗单和药品给我'});
-  mssageList.value.push({user: 'nurse', msg: '好的'});
-  mssageList.value.push({user: 'admin', msg: '请您把治疗单和药品给我'});
-  mssageList.value.push({user: 'nurse', msg: '好的'});
-}
-
-function getTableData(e: boolean) {
-  if (tableData.value.length > 0 && e === isAIDose.value) return;
-  // 人工转ai 人工给药数据插到ai给药表
-  let promise = () => {
-    return new Promise((resolve, reject) => {
-      if (e && tableDataStore.value.length > 0) {
-        let key = `Phase`;
-        let value = `${tableDataStore.value[0].Phase}`;
-        tableDataStore.value.forEach(item => {
-          key += `, ${item.name}`;
-          value += `, ${item.speed}`;
-        });
-        post('/addaimedicine', {database: database.value, key, value}, (res: any) => {
-          if (res.status === 200) {
-            tableDataStore.value = JSON.parse(JSON.stringify(tableData.value));
-          }
-          resolve(true)
-        });
-      } else {
-        resolve(false)
-      }
-    })
-  }
-  promise().then((e: any) => {
-    isStart.value = e;
-    isAIDose.value = e;
-    const url = e ? '/getaimedicine' : '/getdoctormedicine';
-    post(url, {database: database.value, start: 0, end: 1}, (res: any) => {
-      if (res.status === 200) {
-        setTableData(res);
-      }
-    });
-    post('/addaiflag', {database: database.value, flag: e ? 1 : 0}, (res: any) => {
-      // console.log(res.status);
-    })
-  });
-}
-
 // table 速度选择
 function table1SpeedCommand(e: any) {
 	table1SpeedVal.value = e
 }
+
+
 function keepFit(designWidth: number, designHeight: number, renderDomId: string) {
 	let width = designWidth || 1920,
 		height = designHeight || 1010;
@@ -557,7 +454,12 @@ const setDatabase = () => {
 	initData();
 	setDatabaseDialog.value = false;
 };
+
 const viewPatientInfo = () => {
+	getPatientInfo(currentRemote.value.patient, currentRemote.value.patientId,
+		currentRemote.value.date).then(res => {
+		console.log(res)
+	})
 	isPatientDialog.value = true;
 	setTimeout(() => {
 		patientsFormRef.value.resetData()
@@ -579,7 +481,7 @@ const viewPatientInfo = () => {
 	}, 0)
 }
 const backRemote = () => {
-  router.back()
+	router.back();
 }
 const playPause = () => {
 	if (liveVideo.value.paused) {
@@ -592,68 +494,67 @@ const playPause = () => {
 }
 const sendMsg = () => {
 	if (msgVal.value.trim() == '') return;
-  mssageList.value.push({user: userName.value, msg: msgVal.value});
+	remoteWsStore.sendMsg(currentRemote.value.patient, currentRemote.value.patientId,
+		currentRemote.value.date, msgVal.value, function (res: any) {
+			if (res.code == 1) {
+				ElMessage.error(res.msg)
+			}
+		})
 	msgVal.value = '';
 	setTimeout(() => {
 		msgLogScrollBottom()
 	}, 0);
-};
+}
+
+function msgLogScrollBottom() {
+	msgLog.value.scrollTo({
+		top: msgLog.value.scrollHeight,
+		behavior: 'smooth'
+	});
+}
+
 const tableItemPlus = (e: any) => {
 	const obj = medicineCustom.find(item => item.name === e.row.name) || {plus: 1};
 	e.row.speed += obj.plus;
 	e.row.speed = Number(e.row.speed.toFixed(2));
-};
+}
+
 const tableItemMinus = (e: any) => {
 	const obj = medicineCustom.find(item => item.name === e.row.name) || {plus: 1};
 	if (!isAIDose.value && e.row.speed - obj.plus <= 0) return;
 	e.row.speed -= obj.plus;
 	if (e.row.speed < 0) e.row.speed = 0;
 	else e.row.speed = Number(e.row.speed.toFixed(2));
-};
-const tableItemConfirm = (e: any) => {
-  tableDataStore.value[e.$index].speed = e.row.speed;
-  if (tableData.value.length < 1) return;
-  let key = `Phase`;
-  let value = `${tableData.value[0].Phase}`;
-  tableData.value.forEach(item => {
-    key += `, ${item.name}`;
-    value += `, ${item.speed}`;
-  });
-  post(isAIDose.value ? '/addaimedicine' : '/adddoctormedicine', {database: database.value, key, value}, (res: any) => {
-    if (res.status === 200) {
-      tableDataStore.value = JSON.parse(JSON.stringify(tableData.value));
-      ElMessage({
-        message: '保存成功！',
-        type: 'success',
-      });
-      // 如果是ai药量表保存后同时在人工表中插入ai药量表数据
-      if (isAIDose.value) {
-        post('/adddoctormedicine', {database: database.value, key, value}, (res: any) => {
-          if (res.status === 200) {
-            ElMessage({
-              message: '保存成功！',
-              type: 'success',
-            });
-            getTableData(false); // 保存成功后切换为人工给药
-          } else {
-            ElMessage({
-              message: JSON.stringify(res),
-              type: 'error',
-            });
+}
+
+const tableItemConfirm = (e: any, tableData: any) => {
+	if (tableData.length < 1) return;
+	const params = {
+		name: currentRemote.value.patient,
+		id: currentRemote.value.patientId,
+		date: currentRemote.value.date,
+		flag: "1",
+		medicine: e.row.name,
+		value: e.row.speed
 	}
+	remoteWsStore.sendMedicine(params, function () {
 	});
-      }
-    } else {
-      ElMessage({
-        message: JSON.stringify(res),
-        type: 'error',
-      });
-    }
-  });
-};
+}
+
 const tableItemCancel = (e: any) => {
-  e.row.speed = tableDataStore.value[e.$index].speed;
-};
+	e.row.speed = medicineSpeedTemp[e.row.name];
+}
+
+function startAI() {
+	const params = {
+		name: currentRemote.value.patient,
+		id: currentRemote.value.patientId,
+		date: currentRemote.value.date,
+		flag: "0",
+	}
+	remoteWsStore.sendMedicine(params, function () {
+	});
+}
 
 </script>
 

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

@@ -1,11 +1,5 @@
 <template>
 	<div class="remote-manage-page">
-		<button @click="getSurgeryData">123</button>
-		<button @click="disconnectSurgeryData">断开</button>
-		<button @click="sendMsg">发送消息</button>
-		<button @click="closeChat">关闭消息</button>
-		<button @click="addMedicine">给药</button>
-		<button @click="closeAddMedicineWS">关闭给药</button>
 		<div class="header-box">
 			<div class="thumbnail" @click="viewThumbnail">
 				<el-icon>
@@ -14,9 +8,9 @@
 				<span>缩略图</span>
 			</div>
 			<div class="task-btn-item" v-for="(item, index) in remoteTask" :key="'task-' + index"
-					 :class="{ 'connecting': item.patientName || item.patientCode, 'alarm': item.dataAlarm }"
-					 @click="editTask(item, index)" @dblclick="toRemoteControl(item, index)">
-				<span>{{ item.title || ('新建任务' + (index + 1)) }}</span>
+					 :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">
@@ -32,268 +26,72 @@
 </template>
 
 <script lang='ts' setup>
-import {ref} from 'vue'
+import {onMounted, ref} from 'vue'
 import {useRouter} from 'vue-router'
-import {useRemoteStore} from '@/stores/remote-info-store'
-import type {RemoteItem} from '@/utils/public-interface'
 import RemoteDialog from './part/remote-dialog.vue'
 import RemotePart from './part/remote-part.vue'
 import MessagePart from './part/message-part.vue'
-import {Session} from "@/utils/storage";
+import {useRemoteWsStore} from "@/stores/remote-ws-store";
 
 const router = useRouter()
-const remoteStore = useRemoteStore()
-
 const remotePartRef = ref()
 const messagePartRef = ref()
 const remoteDialogRef = ref()
-const remoteTask = ref([] as Array<RemoteItem>)
+const remoteTask = ref([] as Array<any>)
+const remoteWsStore = useRemoteWsStore();
 
-initRemoteTask()
-
-function resetRemoteTaskItem(e: RemoteItem) {
-	Object.assign(remoteTask.value[e.index], {
-		isRemote: false,
-		dataAlarm: false,
-		title: '',
-		serverUser: '',
-		patientName: '',
-		patientCode: '',
-		index: e.index,
-	})
-}
+onMounted(() => {
+	initRemoteTask()
+})
 
 function initRemoteTask() {
-	remoteTask.value = remoteStore.remoteTasks
-	if (remoteTask.value.length < 1) {
-		while (remoteTask.value.length < 10) {
-			const obj = {
-				isRemote: false, // 连接状态
-				dataAlarm: false, // 异常状态
-				title: '',
-				serverUser: '', // 服务器用户名
-				patientName: '', // 病人名称
-				patientCode: '', // 病人身份证
-				index: remoteTask.value.length,
-				log: []
-			}
-			if (remoteTask.value.length < 3) {
-				obj.isRemote = true
-				obj.title = '远程控制' + (remoteTask.value.length + 1)
-				obj.serverUser = 'root'
-				obj.patientName = '测试' + (remoteTask.value.length + 1)
-			}
-			if (remoteTask.value.length == 1) obj.dataAlarm = true
-			remoteTask.value.push(obj)
-		}
-		remoteStore.setRemoteTasks(remoteTask.value)
-		if (!remoteStore.currentRemote.index) {
-			remoteStore.$patch({currentRemote: remoteTask.value[0]})
-		}
-	}
+	remoteTask.value = remoteWsStore.initRemoteTask()
+	remotePartRef.value.showData(remoteWsStore.currentTaskIndex);
 }
 
 const viewThumbnail = () => {
 	router.push({
-		path: '/remote-manage/remote-thumbnail'
+		path: '/remote-manage/remote-thumbnail',
+		query: {
+		}
 	})
 }
 // 打开任务连接弹窗
-const editTask = (item: RemoteItem, index: number) => {
-	item.index = index
+const editTask = (item: any) => {
 	// 如果当前任务是已连接状态则直接渲染content 否则打开弹窗
 	if (item.isRemote) {
-		confirmRemote(item)
+		remotePartRef.value.showData(item.index)
 	} else {
-		remoteDialogRef.value.open(item)
+		remoteDialogRef.value.open(item.index)
 	}
 }
 // 跳转到远程控制
-const toRemoteControl = (item: RemoteItem, index: number) => {
+const toRemoteControl = (item: any) => {
 	// 如果当前任务是已连接状态则跳转，否则打开弹窗
 	if (item.isRemote) {
 		router.push('/remote-manage/remote-control')
 	} else {
-		editTask(item, index)
+		remoteDialogRef.value.open(item.index)
 	}
 }
 // 连接成功
-const confirmRemote = (e: RemoteItem) => {
-	messagePartRef.value.setData({
-		time: new Date(),
-		title: e.title,
-		state: '连接成功'
-	}, e.index)
-	remoteTask.value[e.index] = e // 状态设置为可连接
-	remotePartRef.value.initData(e)
-	console.log(e);
-	getSurgeryData();
+const confirmRemote = () => {
+	messagePartRef.value.scrollToBottom()
+	// 状态设置为可连接
+	remotePartRef.value.initData()
 }
 // 连接失败
-const errorRemote = (e: RemoteItem) => {
-	messagePartRef.value.setData({
-		time: new Date(),
-		title: e.title,
-		state: '连接失败'
-	}, e.index)
+const errorRemote = () => {
+	messagePartRef.value.scrollToBottom()
 }
 // 断开连接
-const breakRemote = (e: RemoteItem) => {
-	resetRemoteTaskItem(e)
-	remotePartRef.value.initData()
-	messagePartRef.value.setData({
-		time: new Date(),
-		title: e.title,
-		state: '断开连接'
-	}, e.index)
-//	disconnectSurgeryData("", "1")
+const breakRemote = () => {
+	messagePartRef.value.scrollToBottom()
 }
 const addLogAfter = () => {
 	messagePartRef.value.scrollToBottom()
 }
 
-const ws = new WebSocket("ws://localhost:5173/socket.io/admin/rax/vitalSignsMedicine?token=" + Session.getToken());
-
-function getSurgeryData() {
-	const params = {
-		patientName: "1111111",
-		idNum: "123567890",
-		date: "20230505"
-	}
-	ws.send(JSON.stringify(params))
-}
-
-function disconnectSurgeryData() {
-	ws.close();
-}
-
-ws.onmessage = function (e) {
-	console.log(e)
-}
-
-const chatws = new WebSocket("ws://localhost:5173/socket.io/admin/rax/chatRoom?token=" + Session.getToken());
-
-function sendMsg() {
-	const params = {
-		patientName: "1111111",
-		idNum: "123567890",
-		date: "20230505",
-		msg: "测试消息"
-	}
-	chatws.send(JSON.stringify(params))
-}
-
-chatws.onmessage = function (e) {
-	console.log(e)
-}
-
-function closeChat() {
-	chatws.close()
-}
-
-const addMedicineWS = new WebSocket("ws://localhost:5173/socket.io/admin/rax/addMedicine?token=" + Session.getToken())
-
-function addMedicine() {
-	const params = {
-		patientName: "1111111",
-		idNum: "123567890",
-		date: "20230505",
-		flag: "2",
-		medicine: "丙泊酚",
-		value: "1"
-	}
-	addMedicineWS.send(JSON.stringify(params))
-}
-
-addMedicineWS.onmessage = function (e) {
-	console.log(e)
-}
-
-function closeAddMedicineWS() {
-	addMedicineWS.close()
-}
-
-/*const surgeryClient = new Client({
-  brokerURL: 'ws://localhost:5173/socket.io/admin/rax/SurgeryData',
-  connectHeaders: {
-    token: Session.get('token')
-  },
-  reconnectDelay: 5000,
-  heartbeatIncoming: 60000,
-  heartbeatOutgoing: 60000
-})
-surgeryClient.activate()
-
-surgeryClient.onConnect = (data: any) => {
-  console.log("connect", data);
-}
-
-surgeryClient.onWebSocketError = (error) => {
-  console.log('Error with websocket', error)
-};
-
-surgeryClient.onStompError = (frame) => {
-  console.log('Broker reported error: ' + frame.headers['message'])
-  console.log('Additional details: ' + frame.body)
-};
-
-function getSurgeryData(username: string, db: string) {
-  console.log(username, db);
-  surgeryClient.publish({
-    destination: "/front/getSurgeryData",
-    headers: {
-      token: Session.get('token')
-    },
-    body: JSON.stringify({status: "start", db})
-  });
-  const account = "admin";
-  surgeryClient.subscribe('/topic/user/' + account + ":" + db + '/surgeryData', (data: any) => {
-    console.log(data);
-  })
-}*/
-
-/*function disconnectSurgeryData(username: string, db: string) {
-  const account = "admin";
-  surgeryClient.unsubscribe("/topic/user/" + account + ":" + db + "/surgeryData");
-}
-
-const chatClient = new Client({
-  brokerURL: 'ws://localhost:5173/socket.io/admin/rax/chat',
-  connectHeaders: {
-    token: Session.get('token')
-  },
-  reconnectDelay: 5000,
-  heartbeatIncoming: 60000,
-  heartbeatOutgoing: 60000
-})
-chatClient.activate()
-
-const patientName = '111'
-const idNum = '111'
-const date = '20230505'
-
-function sendChatMessage() {
-  const message = {
-    patientName: patientName,
-    idNum: idNum,
-    date: date,
-    msg: '测试消息'
-  }
-  chatClient.publish({
-    destination: '/front/sendMessage',
-    headers: {
-      token: Session.get('token')
-    },
-    body: JSON.stringify(message)
-  })
-}*/
-
-/*chatClient.onConnect = () => {
-  chatClient.subscribe('/topic/user/' + patientName + idNum + date + '/chatroomMessage', (data: any) => {
-    console.log(data)
-  })
-}*/
-
 </script>
 
 <style lang='scss' scoped>

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

@@ -3,19 +3,21 @@
 		<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>
+					<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>
+						<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" :logs="item.log" :index="item.index"></MessageItemPart>
+						<MessageItemPart ref="messageItemPartRef" :index="item.index"></MessageItemPart>
 					</div>
 				</div>
 			</div>
@@ -24,29 +26,24 @@
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { useRemoteStore } from '@/stores/remote-info-store'
-import type { RemoteItem } from '@/utils/public-interface'
-import RemoteItemPart from './part/remote-item-part.vue'
-import MessageItemPart from './part/message-item-part.vue'
+import {onMounted, 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";
 
-const route = useRoute()
-const router = useRouter()
+const route = useRoute();
+const router = useRouter();
+const messageItemPartRef = ref();
+const remoteTask = ref([] as any);
+const remoteWsStore = useRemoteWsStore();
 
-const messageItemPartRef = ref()
-const remoteTask = ref([] as Array<RemoteItem>)
-
-remoteTask.value = useRemoteStore().getRemoteTasks()
-
-// 路由初始化后执行
-router.isReady().then(() => {
-  console.log(route)
+onMounted(() => {
+	remoteTask.value = remoteWsStore.remoteTasks;
 })
 
-const openRemote = (params: RemoteItem) => {
-  useRemoteStore().setCurrentRemote(params)
-  router.push('/remote-manage/remote-manage')
+const openRemote = (params: any) => {
+	router.push('/remote-manage/remote-manage');
 }
 const addLogAfter = (index: number) => {
 	messageItemPartRef.value[index].scrollToBottom()