远程管理接口调试

2025-08-23 20:44:58 +08:00 · 2024-03-16 12:00:13 +08:00 · 2024-03-16 12:00:13 +08:00 · 9186e1a01b
parent c962e9f5fe
commit 9186e1a01b
5 changed files with 881 additions and 785 deletions
--- a/package.json
+++ b/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",
-    "crypto-js": "4.2.0"
+    "xlsx": "^0.18.5"
  },
  "devDependencies": {
    "@types/js-cookie": "^3.0.6",
--- a/src/views/login/login.vue
+++ b/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()
  })
 }
--- a/src/views/remote-manage/remote-control.vue
+++ b/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>
+          <el-button class="start-btn" color="#F80000" @click="getTableData(!isStart)">{{
+              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;
--- a/src/views/remote-manage/remote-manage.vue
+++ b/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>
--- a/vite.config.ts
+++ b/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/, ''),
+      },
    }
  }
 })