From 64d1d5123af609787b860f15a1e3046d0a385711 Mon Sep 17 00:00:00 2001
From: lonewolfyx <877085893@qq.com>
Date: Wed, 4 Feb 2026 16:06:32 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E7=94=9F=E5=91=BD?=
 =?UTF-8?q?=E4=BD=93=E5=BE=81=E3=80=81=E7=94=9F=E5=91=BD=E4=BD=93=E5=BE=81?=
 =?UTF-8?q?=E5=8E=86=E5=8F=B2=E6=9F=A5=E8=AF=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/life.js                               |  41 ++++
 src/api/lifte.js                              |   9 -
 src/layout/components/Sidebar/index.vue       |   1 +
 src/views/life/lishichaxun/index.vue          | 189 ++++++++++++++++++
 src/views/life/tizhenchaxun.vue               |  11 +
 .../index.vue}                                | 166 +++------------
 6 files changed, 269 insertions(+), 148 deletions(-)
 create mode 100644 src/api/life.js
 delete mode 100644 src/api/lifte.js
 create mode 100644 src/views/life/lishichaxun/index.vue
 create mode 100644 src/views/life/tizhenchaxun.vue
 rename src/views/life/{physical_data.vue => tizhenchaxun/index.vue} (50%)

diff --git a/src/api/life.js b/src/api/life.js
new file mode 100644
index 0000000..5669edb
--- /dev/null
+++ b/src/api/life.js
@@ -0,0 +1,41 @@
+// 获取生命体征
+import request from "@/utils/request";
+
+export const getTakeVitalSigns = () => {
+  return request({
+    method: 'post',
+    url: '/system/vitalsigns/getVitalsign'
+  })
+}
+
+// 获取所有房间
+export const getLifeRooms = () => {
+  return request({
+    method: 'post',
+    url: '/system/vitalsigns/equipments'
+  })
+}
+
+// 根据指定房间获取数据
+export const getLifeRealTime = (roomId) => {
+  return request({
+    method: 'post',
+    url: '/system/vitalsigns/latestByEcode',
+    params: {
+      ecode: roomId
+    }
+  })
+}
+
+// 根据指定房间、时间获取数据
+export const getLifeHistory = (roomId, startTime, endTime) => {
+  return request({
+    method: 'post',
+    url: '/system/vitalsigns/byEcodeBetweenTime',
+    params: {
+      ecode: roomId,
+      startTime: startTime,
+      endTime: endTime
+    }
+  })
+}
diff --git a/src/api/lifte.js b/src/api/lifte.js
deleted file mode 100644
index 0d54169..0000000
--- a/src/api/lifte.js
+++ /dev/null
@@ -1,9 +0,0 @@
-// 获取生命体征
-import request from "@/utils/request";
-
-export const getTakeVitalSigns = () => {
-  return request({
-    method: 'post',
-    url: '/system/vitalsigns/getVitalsign'
-  })
-}
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index 51d0839..9cb470d 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -1,6 +1,7 @@
 <template>
     <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
         <logo v-if="showLogo" :collapse="isCollapse" />
+      <div>{{sidebarRouters}}</div>
         <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
             <el-menu
                 :default-active="activeMenu"
diff --git a/src/views/life/lishichaxun/index.vue b/src/views/life/lishichaxun/index.vue
new file mode 100644
index 0000000..2185f1c
--- /dev/null
+++ b/src/views/life/lishichaxun/index.vue
@@ -0,0 +1,189 @@
+<template>
+  <div class="app-container">
+    <div style="margin-bottom: 20px">
+      <span style="font-size: 14px;padding-right: 10px;">默认</span>
+      <el-date-picker
+        v-model="searchDate"
+        end-placeholder="结束日期"
+        range-separator="至"
+        start-placeholder="开始日期"
+        type="datetimerange">
+      </el-date-picker>
+    </div>
+    <p style="font-size: 12px;color: red;">请先选择时间，然后在选择房间后，点击图表查看数据</p>
+    <el-row :gutter="24">
+      <el-col :span="5">
+        <el-tree :data="treeDara" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
+      </el-col>
+      <el-col :span="19">
+        <div id="qushi" style="width: 100%;height: 500px"></div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import * as echarts from "echarts";
+import {getLifeHistory, getLifeRooms} from "@/api/life";
+import dayjs from "dayjs";
+
+export default {
+  name: 'lishichaxun',
+  data() {
+    return {
+      defaultProps: {
+        children: 'children',
+        label: 'room'
+      },
+      treeDara: [],
+      trendMap: {},
+      qushiChart: null,   // echarts 实例
+      qushiOption: null,
+      scheduler: null,
+      searchDate: []
+    }
+  },
+  async mounted() {
+    this.initialEcharts()
+    await this.getQuShiData()
+  },
+  methods: {
+    async getQuShiData() {
+      const {data} = await getLifeRooms()
+      this.treeDara = data
+    },
+    async handleNodeClick(data) {
+      const raw = await getLifeHistory(data.ecode, dayjs(this.searchDate[0]).format('YYYY-MM-DD HH:ss:mm'), dayjs(this.searchDate[1]).format('YYYY-MM-DD HH:ss:mm'));
+      const breathrate = raw.data.map(i => i.breathrate);
+      const heartrate = raw.data.map(i => i.heartrate);
+      const timeList = raw.data.map(i => dayjs(i.recordtime).format('YYYY-MM-DD HH:ss:mm'));
+      console.log('数据请求');
+      this.qushiChart.setOption(this.getEchartsOptions(timeList, breathrate, heartrate));
+      // this.scheduler = setInterval(fetchDataAndRender, 5000);
+    },
+    initialEcharts() {
+      if (this.qushiChart) return
+      const dom = document.getElementById('qushi')
+      this.qushiChart = echarts.init(dom)
+
+      this.qushiOption = this.getEchartsOptions()
+
+      this.qushiChart.setOption(this.qushiOption)
+
+    },
+    getEchartsOptions(timeList = [], breathrate = [], heartrate = []) {
+      return {
+        title: {
+          text: '生命体征历史数据',
+          textStyle: {
+            fontFamily: 'PingFangSC-Medium',
+            fontSize: 14
+          },
+        },
+        color: ['#52A9F1', '#1DD398'],
+        animation: true,
+        tooltip: {
+          trigger: 'axis'
+        },
+        legend: {
+          icon: "roundRect",
+          top: "0",
+          itemWidth: 24,
+          itemHeight: 12,
+          itemGap: 20,
+          textStyle: {
+            color: "#000000",
+            fontWeight: "bold",
+          },
+          data: ['心跳', '呼吸']
+        },
+        grid: {
+          top: '15%',
+          left: '1%',
+          right: '1%',
+          bottom: '0%',
+          containLabel: true
+        },
+        xAxis: [
+          {
+            show: true,
+            type: 'category',
+            boundaryGap: true,
+            data: timeList,
+            axisLabel: {
+              textStyle: {
+                color: "rgba(0,0,0,0.65)",
+              }
+            },
+            axisLine: {
+              lineStyle: {
+                color: "rgba(0,0,0,0.1)"
+              },
+              show: true
+            }
+          }],
+        yAxis: [
+          {
+            type: 'value',
+            // interval:250,    //间隔
+            // axisTick: { show: false },
+            axisLine: {
+              lineStyle: {color: "rgba(0,0,0,0)"}
+            },
+            axisLabel: {
+              textStyle: {color: "rgba(0,0,0,0.65)",}
+            },
+            // 修改分割线的颜色
+            splitLine: {
+              lineStyle: {
+                color: "rgba(0,0,0,0.1)"
+              }
+            }
+          }],
+        series: [
+          {
+            name: '心跳',
+            type: 'line',
+            smooth: true,
+            // data: [235, 429, 528, 324, 338, 453, 231, 326, 411, 118, 256],
+            data: heartrate.length > 0 ? heartrate : [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+            showSymbol: false,
+            lineStyle: {
+              color: '#1DD398',
+              type: 'dotted'
+            },
+            areaStyle: {
+              opacity: 0.3,
+              color: '#1DD398'
+            },
+          },
+          {
+            name: '呼吸',
+            type: 'line',
+            smooth: true,
+            // data: [25, 49, 58, 24, 38, 45, 21, 26, 11, 18, 26],
+            data: breathrate.length > 0 ? breathrate : [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+            showSymbol: false,
+            lineStyle: {
+              color: '#52A9F1',
+            },
+            areaStyle: {
+              opacity: 0.1,
+              color: '#1DD398'
+            },
+          }]
+      }
+    }
+  },
+  destroyed() {
+    clearInterval(this.scheduler)
+  }
+}
+</script>
+
+<style>
+#qushi {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/life/tizhenchaxun.vue b/src/views/life/tizhenchaxun.vue
new file mode 100644
index 0000000..dc18df2
--- /dev/null
+++ b/src/views/life/tizhenchaxun.vue
@@ -0,0 +1,11 @@
+<template>
+
+</template>
+
+<script setup lang="ts">
+
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/life/physical_data.vue b/src/views/life/tizhenchaxun/index.vue
similarity index 50%
rename from src/views/life/physical_data.vue
rename to src/views/life/tizhenchaxun/index.vue
index ba88189..e0d4201 100644
--- a/src/views/life/physical_data.vue
+++ b/src/views/life/tizhenchaxun/index.vue
@@ -13,11 +13,11 @@
 
 <script>
 import * as echarts from "echarts";
-import {getTakeVitalSigns} from "@/api/lifte";
+import {getLifeHistory, getLifeRealTime, getLifeRooms} from "@/api/life";
 import dayjs from "dayjs";
 
 export default {
-  name: 'physical_data',
+  name: 'tizhenchaxun',
   data() {
     return {
       defaultProps: {
@@ -27,7 +27,8 @@ export default {
       treeDara: [],
       trendMap: {},
       qushiChart: null,   // echarts 实例
-      qushiOption: null
+      qushiOption: null,
+      scheduler: null,
     }
   },
   async mounted() {
@@ -36,143 +37,26 @@ export default {
   },
   methods: {
     async getQuShiData() {
-      const {data} = await getTakeVitalSigns()
-
-      this.treeDara = data.map(item => item.equipment)
-        .filter(Boolean)
-        .filter(
-          (eq, index, arr) =>
-            arr.findIndex(e => e.id === eq.id) === index
-        );
-
-      this.trendMap = data.reduce((map, item) => {
-        const eq = item.equipment
-        if (!eq) return map
-
-        const key = `${eq.ecode}`
-
-        if (!map[key]) {
-          map[key] = []
-        }
-
-        map[key].push({
-          breathrate: item.breathrate,
-          heartrate: item.heartrate,
-          recordtime: dayjs(item.recordtime).format('YYYY-MM-DD HH:mm:ss')
-        })
-
-        return map
-      }, {})
-
-      this.handleNodeClick(this.treeDara[0])
-    },
-    getQuShi() {
-      const chart = echarts.init(document.getElementById('qushi'))
-      const option = {
-        title: {
-          text: '生命体征实时监测',
-          textStyle: {
-            fontFamily: 'PingFangSC-Medium',
-            fontSize: 14
-          },
-        },
-        color: ['#52A9F1', '#1DD398'],
-        animation: true,
-        tooltip: {
-          trigger: 'axis'
-        },
-        legend: {
-          icon: "roundRect",
-          top: "0",
-          itemWidth: 24,
-          itemHeight: 12,
-          itemGap: 20,
-          textStyle: {
-            color: "#000000",
-            fontWeight: "bold",
-          },
-          data: ['2022', '2023']
-        },
-        grid: {
-          top: '15%',
-          left: '1%',
-          right: '1%',
-          bottom: '0%',
-          containLabel: true
-        },
-        xAxis: [{
-          show: false,
-          type: 'category',
-          boundaryGap: true,
-          data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
-          axisLabel: {
-            textStyle: {
-              color: "rgba(0,0,0,0.65)",
-            }
-          },
-          // x轴线的颜色为   rgba(255,255,255,.2)
-          axisLine: {
-            lineStyle: {
-              color: "rgba(0,0,0,0.1)"
-            },
-            show: false
-          }
-        }],
-        yAxis: [{
-          type: 'value',
-          // interval:250,    //间隔
-          // axisTick: { show: false },
-          axisLine: {
-            lineStyle: {color: "rgba(0,0,0,0)"}
-          },
-          axisLabel: {
-            textStyle: {color: "rgba(0,0,0,0.65)",}
-          },
-          // 修改分割线的颜色
-          splitLine: {
-            lineStyle: {
-              color: "rgba(0,0,0,0.1)"
-            }
-          }
-        }],
-        series: [{
-          name: '2022',
-          type: 'line',
-          smooth: true,
-
-          data: [25, 49, 58, 24, 38, 45, 21, 26, 11, 18, 26],
-          showSymbol: false,
-          lineStyle: {
-            color: '#1DD398',
-            type: 'dotted'
-          },
-          areaStyle: {
-            opacity: 0.3,
-            color: '#1DD398'
-          },
-        },
-          {
-            name: '2023',
-            type: 'line',
-            smooth: true,
-            data: [25, 49, 58, 24, 38, 45, 21, 26, 11, 18, 26],
-            showSymbol: false,
-            lineStyle: {
-              color: '#52A9F1',
-            },
-            areaStyle: {
-              opacity: 0.1,
-              color: '#1DD398'
-            },
-          }]
-      }
-      chart.setOption(option)
+      const {data} = await getLifeRooms()
+      this.treeDara = data
     },
     handleNodeClick(data) {
-      const raw = this.trendMap[data.ecode] ?? [{breathrate: 0, heartrate: 0}]
-      const breathrate = raw.map(i => i.breathrate)
-      const heartrate = raw.map(i => i.heartrate)
-      this.qushiChart.setOption(this.getEchartsOptions(breathrate, heartrate))
+      if (this.scheduler) {
+        clearInterval(this.scheduler)
+      }
+
+      const fetchDataAndRender = async () => {
+        const raw = await getLifeRealTime(data.ecode);
+        const breathrate = raw.data.map(i => i.breathrate);
+        const heartrate = raw.data.map(i => i.heartrate);
+        const timeList = raw.data.map(i => dayjs(i.recordtime).format('YYYY-MM-DD HH:ss:mm'));
+        console.log('数据请求');
+        this.qushiChart.setOption(this.getEchartsOptions(timeList, breathrate, heartrate));
+      };
+
+      fetchDataAndRender();
+
+      this.scheduler = setInterval(fetchDataAndRender, 5000);
     },
     initialEcharts() {
       if (this.qushiChart) return
@@ -184,7 +68,7 @@ export default {
       this.qushiChart.setOption(this.qushiOption)
 
     },
-    getEchartsOptions(breathrate = [], heartrate = []) {
+    getEchartsOptions(timeList = [], breathrate = [], heartrate = []) {
       return {
         title: {
           text: '生命体征实时监测',
@@ -222,6 +106,7 @@ export default {
             show: true,
             type: 'category',
             boundaryGap: true,
+            data: timeList,
             axisLabel: {
               textStyle: {
                 color: "rgba(0,0,0,0.65)",
@@ -287,6 +172,9 @@ export default {
       }
     }
   },
+  destroyed() {
+    clearInterval(this.scheduler)
+  }
 }
 </script>