远程管理接口调试

package.json

@@ -10,7 +10,9 @@
     "type-check": "vue-tsc --noEmit"
   },
   "dependencies": {
+    "@stomp/stompjs": "^7.0.0",
     "axios": "^1.3.3",
+    "crypto-js": "4.2.0",
     "echarts": "^5.4.1",
     "element-plus": "2.3.1",
     "js-cookie": "^3.0.5",
@@ -20,8 +22,7 @@
     "vant": "^4.8.3",
     "vue": "^3.2.45",
     "vue-router": "^4.1.6",
-    "xlsx": "^0.18.5",
+    "xlsx": "^0.18.5"
-    "crypto-js": "4.2.0"
   },
   "devDependencies": {
     "@types/js-cookie": "^3.0.6",

src/views/login/login.vue

@@ -377,7 +377,6 @@ function sliderSuccess() {
     // 存储token 信息
     Session.set('token', data.access_token);
     Session.set('refresh_token', data.refresh_token);
-    console.log(data);
     toHome()
   })
 }

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

@@ -23,12 +23,15 @@
 
         </div>
         <div class="btn-box">
-					<el-button class="start-btn" color="#F80000" @click="getTableData(!isStart)">{{ isStart ? '终止' : '开始'
+          <el-button class="start-btn" color="#F80000" @click="getTableData(!isStart)">{{
-					}}</el-button>
+              isStart ? '终止' : '开始'
+            }}
+          </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>
+                       @click="getTableData(false)">人工给药
+            </el-button>
           </div>
         </div>
       </div>
@@ -44,9 +47,12 @@
             <el-button color="#C77000">已连接</el-button>
             <el-button color="#C77000">机器人运行正常</el-button>
           </div>
-					<el-button color="#e0e0e0" @click="backRemote"><el-icon>
+          <el-button color="#e0e0e0" @click="backRemote">
+            <el-icon>
               <Back/>
-						</el-icon> 返回</el-button>
+            </el-icon>
+            返回
+          </el-button>
         </div>
         <div class="monitoring-message">
           <div class="left-box">
@@ -96,17 +102,23 @@
             <el-table-column label="特殊情况人为干预" align="center">
               <template #default="scope">
                 <div class="table-btn-box">
-									<el-button size="small" color="#006080" @click="tableItemPlus(scope)"><el-icon>
+                  <el-button size="small" color="#006080" @click="tableItemPlus(scope)">
+                    <el-icon>
                       <Plus/>
-										</el-icon></el-button>
+                    </el-icon>
+                  </el-button>
                   <el-button size="small" color="#006080" :disabled="scope.row.speed <= 0"
-										@click="tableItemMinus(scope)"><el-icon>
+                             @click="tableItemMinus(scope)">
+                    <el-icon>
                       <Minus/>
-										</el-icon></el-button>
+                    </el-icon>
+                  </el-button>
                   <el-button size="small" color="#006080" @click="tableItemConfirm(scope)"
-										:disabled="tableDataStore[scope.$index].speed === scope.row.speed">确定</el-button>
+                             :disabled="tableDataStore[scope.$index].speed === scope.row.speed">确定
+                  </el-button>
                   <el-button size="small" color="#006080" @click="tableItemCancel(scope)"
-										:disabled="tableDataStore[scope.$index].speed === scope.row.speed">取消</el-button>
+                             :disabled="tableDataStore[scope.$index].speed === scope.row.speed">取消
+                  </el-button>
                 </div>
               </template>
             </el-table-column>
@@ -126,7 +138,9 @@
 				</span>
       </template>
     </el-dialog>
-		<el-dialog v-model="isPatientDialog" title="患者信息" width="40%"><PatientsForm ref="patientsFormRef" type="view" @close="isPatientDialog = false" /></el-dialog>
+    <el-dialog v-model="isPatientDialog" title="患者信息" width="40%">
+      <PatientsForm ref="patientsFormRef" type="view" @close="isPatientDialog = false"/>
+    </el-dialog>
   </div>
 </template>
 
@@ -234,9 +248,11 @@ function initData() {
   getTableData(isAIDose.value);
   try {
     msgLogScrollBottom();
-	} catch (error) { }
+  } catch (error) {
+  }
 
 }
+
 // AIFlagTable 表2秒获取一次
 function getAIFlag() {
   let isRunTimer = true;
@@ -254,6 +270,7 @@ function getAIFlag() {
     }
   }, 2000);
 }
+
 function setTableData(res: any) {
   if (res.data.length > 0) {
     let i = 0;
@@ -261,7 +278,14 @@ function setTableData(res: 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: '正常' });
+        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;
@@ -270,12 +294,20 @@ function setTableData(res: any) {
     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: '正常' });
+      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;
@@ -293,6 +325,7 @@ function getMedicine() {
     }
   }, 2000);
 }
+
 // FeatureTable 表2秒获取一次
 function getChartData() {
   let isRunTimer = true;
@@ -306,8 +339,10 @@ function getChartData() {
   ecgTimer = setInterval(() => {
     try {
       chartDom4.value.updateChart(0, new Date());
-		} catch (error) { }
+    } catch (error) {
+    }
   }, 1000);
+
   function getData() {
     isRunTimer = false;
     post('/getfeature', {database: database.value, start: 0, end: 1}, (res: any) => {
@@ -334,6 +369,7 @@ function getChartData() {
     });
   }
 }
+
 function getFeatureTable() {
   featureTable.value = [];
   post('/getfeature', {database: database.value, start: 1, end: 50}, (res: any) => {
@@ -353,25 +389,31 @@ function getFeatureTable() {
     }
   });
 }
+
 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 });
+        if (!hideDatabase.some(e => e === item.Database)) databaseOptions.value.push({
+          value: item.Database,
+          label: item.Database
+        });
       })
       database.value = databaseOptions.value[0].label;
       initData();
     }
   });
 }
+
 function msgLogScrollBottom() {
   msgLog.value.scrollTo({
     top: msgLog.value.scrollHeight,
     behavior: 'smooth'
   });
 }
+
 function unusualUpDate(msg: string) {
   unusual.value.push(dateFormater('HH:mm:ss') + msg);
   setTimeout(() => {
@@ -381,12 +423,14 @@ function unusualUpDate(msg: string) {
     });
   });
 }
+
 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给药表
@@ -424,6 +468,7 @@ function getTableData(e: boolean) {
     })
   });
 }
+
 function keepFit(designWidth: number, designHeight: number, renderDomId: string) {
   let width = designWidth || 1920,
       height = designHeight || 1010;
@@ -440,6 +485,7 @@ function keepFit(designWidth: number, designHeight: number, renderDomId: string)
     renderDom.style.transform = 'scale(' + scale + ')';
   }
 }
+
 function initScale() {
   let w = 1920,
       h = 1010;
@@ -564,9 +610,11 @@ const tableItemCancel = (e: any) => {
   padding: 10px 0 20px 0;
   transform-origin: top left;
   overflow-y: auto;
+
   .el-button {
     color: white;
   }
+
   .main-box {
     width: 100%;
     height: 100%;
@@ -724,6 +772,7 @@ const tableItemCancel = (e: any) => {
       height: 100%;
       display: flex;
       flex-direction: column;
+
       .top-btn-box {
         width: 100%;
         height: 34px;

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

@@ -33,6 +33,8 @@ 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 {Client} from "@stomp/stompjs";
+import {Session} from "@/utils/storage";
 
 const router = useRouter()
 const remoteStore = useRemoteStore()
@@ -118,6 +120,8 @@ const confirmRemote = (e: RemoteItem) => {
   }, e.index)
   remoteTask.value[e.index] = e // 状态设置为可连接
   remotePartRef.value.initData(e)
+  console.log(e);
+  getSurgeryData(e.patientCode, e.patientName);
 }
 // 连接失败
 const errorRemote = (e: RemoteItem) => {
@@ -140,6 +144,43 @@ const breakRemote = (e: RemoteItem) => {
 const addLogAfter = () => {
   messagePartRef.value.scrollToBottom()
 }
+
+const surgeryClient = new Client({
+  brokerURL: 'ws://localhost:5173/socket.io/admin/rax/SurgeryData',
+  connectHeaders: {
+    access_token: Session.get('token')
+  }
+})
+surgeryClient.activate()
+
+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",
+    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) {
+  surgeryClient.publish({
+    destination: "/front/getSurgeryData",
+    body: JSON.stringify({'status': "stop", db, username})
+  });
+  surgeryClient.unsubscribe("/topic/user/" + username + "/surgeryData");
+}
 </script>
 
 <style lang='scss' scoped>

vite.config.ts

@@ -27,7 +27,13 @@ export default defineConfig({
         ws: true, // 是否启用 WebSocket
         changeOrigin: true, // 是否修改请求头中的 Origin 字段
         rewrite: (path) => path.replace(/^\/api/, ''),
-      }
+      },
+      '/socket.io': {
+        target: 'ws://localhost:9999',
+        ws: true,
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/socket.io/, ''),
+      },
     }
   }
 })