From 9f12357390ddad7534f85a0b549f317c11c202ae Mon Sep 17 00:00:00 2001
From: lonewolfyx <877085893@qq.com>
Date: Mon, 2 Feb 2026 11:08:44 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20add=20=E7=94=9F=E5=91=BD=E4=BD=93?=
 =?UTF-8?q?=E5=BE=81=E7=9B=91=E6=B5=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                     |   2 +
 src/api/lifte.js                 |   9 +
 src/views/life/physical_data.vue | 298 +++++++++++++++++++++++++++++++
 vue.config.js                    |  82 ++++-----
 4 files changed, 351 insertions(+), 40 deletions(-)
 create mode 100644 src/api/lifte.js
 create mode 100644 src/views/life/physical_data.vue

diff --git a/package.json b/package.json
index ef20f7e..fbc0516 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
     "axios": "0.24.0",
     "clipboard": "2.0.8",
     "core-js": "3.25.3",
+    "dayjs": "^1.11.19",
     "echarts": "5.4.0",
     "element-ui": "2.15.13",
     "file-saver": "2.0.5",
@@ -62,6 +63,7 @@
     "vue": "2.6.12",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
+    "vue-echarts": "^8.0.1",
     "vue-meta": "2.4.0",
     "vue-router": "3.4.9",
     "vue-video-player": "^5.0.2",
diff --git a/src/api/lifte.js b/src/api/lifte.js
new file mode 100644
index 0000000..0d54169
--- /dev/null
+++ b/src/api/lifte.js
@@ -0,0 +1,9 @@
+// 获取生命体征
+import request from "@/utils/request";
+
+export const getTakeVitalSigns = () => {
+  return request({
+    method: 'post',
+    url: '/system/vitalsigns/getVitalsign'
+  })
+}
diff --git a/src/views/life/physical_data.vue b/src/views/life/physical_data.vue
new file mode 100644
index 0000000..ba88189
--- /dev/null
+++ b/src/views/life/physical_data.vue
@@ -0,0 +1,298 @@
+<template>
+  <div class="app-container">
+    <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 {getTakeVitalSigns} from "@/api/lifte";
+import dayjs from "dayjs";
+
+export default {
+  name: 'physical_data',
+  data() {
+    return {
+      defaultProps: {
+        children: 'children',
+        label: 'room'
+      },
+      treeDara: [],
+      trendMap: {},
+      qushiChart: null,   // echarts 实例
+      qushiOption: null
+    }
+  },
+  async mounted() {
+    this.initialEcharts()
+    await this.getQuShiData()
+  },
+  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)
+    },
+    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))
+    },
+    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(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,
+            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'
+            },
+          }]
+      }
+    }
+  },
+}
+</script>
+
+<style>
+#qushi {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/vue.config.js b/vue.config.js
index 86f5399..ab4e3d8 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -39,12 +39,14 @@ module.exports = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
         // target: `http://192.168.0.180:8099`,
-        target: `http://192.168.0.151:8099`,     //服务器
+        // target: `http://192.168.0.151:8099`,     //服务器
         // target: `http://192.168.3.10:8099`,        //耗子
         // target: `http://106.15.139.36:8099`,
-        
+
         // target: `http://120.79.202.7:443`,
-        // target: `http://100.100.10.216:8099`, 
+        // target: `http://100.100.10.216:8099`,
+        // target: 'http://106.15.139.36:18090',
+        target: 'http://127.0.0.1:18098',
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''
@@ -56,7 +58,7 @@ module.exports = {
   css: {
     loaderOptions: {
       sass: {
-        sassOptions: { outputStyle: "expanded" }
+        sassOptions: {outputStyle: "expanded"}
       }
     }
   },
@@ -125,44 +127,44 @@ module.exports = {
       .end()
 
     config.when(process.env.NODE_ENV !== 'development', config => {
-          config
-            .plugin('ScriptExtHtmlWebpackPlugin')
-            .after('html')
-            .use('script-ext-html-webpack-plugin', [{
-            // `runtime` must same as runtimeChunk name. default is `runtime`
-              inline: /runtime\..*\.js$/
-            }])
-            .end()
+      config
+        .plugin('ScriptExtHtmlWebpackPlugin')
+        .after('html')
+        .use('script-ext-html-webpack-plugin', [{
+          // `runtime` must same as runtimeChunk name. default is `runtime`
+          inline: /runtime\..*\.js$/
+        }])
+        .end()
 
-          config.optimization.splitChunks({
-            chunks: 'all',
-            cacheGroups: {
-              libs: {
-                name: 'chunk-libs',
-                test: /[\\/]node_modules[\\/]/,
-                priority: 10,
-                chunks: 'initial' // only package third parties that are initially dependent
-              },
-              elementUI: {
-                name: 'chunk-elementUI', // split elementUI into a single package
-                test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
-                priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app
-              },
-              commons: {
-                name: 'chunk-commons',
-                test: resolve('src/components'), // can customize your rules
-                minChunks: 3, //  minimum common number
-                priority: 5,
-                reuseExistingChunk: true
-              }
-            }
-          })
-
-          config.optimization.runtimeChunk('single'),
-          {
-             from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
-             to: './' //到根目录下
+      config.optimization.splitChunks({
+        chunks: 'all',
+        cacheGroups: {
+          libs: {
+            name: 'chunk-libs',
+            test: /[\\/]node_modules[\\/]/,
+            priority: 10,
+            chunks: 'initial' // only package third parties that are initially dependent
+          },
+          elementUI: {
+            name: 'chunk-elementUI', // split elementUI into a single package
+            test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
+            priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app
+          },
+          commons: {
+            name: 'chunk-commons',
+            test: resolve('src/components'), // can customize your rules
+            minChunks: 3, //  minimum common number
+            priority: 5,
+            reuseExistingChunk: true
           }
+        }
+      })
+
+      config.optimization.runtimeChunk('single'),
+        {
+          from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
+          to: './' //到根目录下
+        }
     })
   }
 }

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 2/2] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E7=94=9F?=
 =?UTF-8?q?=E5=91=BD=E4=BD=93=E5=BE=81=E3=80=81=E7=94=9F=E5=91=BD=E4=BD=93?=
 =?UTF-8?q?=E5=BE=81=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>