Merge branch 'feat' into test

src/api/health-user.js

@@ -7,7 +7,8 @@ export const APIHealthUser = {
   deletePerson, // 删除人员信息
   getHomeData, //今日体征感知
   getHisData, //体征历史数据
-  getCalendar //体征历史数据日历
+  getCalendar, //体征历史数据日历
+  getReportData //洞悉
 };
 export default APIHealthUser;
 function addPerson(params) {
@@ -68,3 +69,10 @@ function getCalendar(data) {
     params: data
   });
 }
+function getReportData(params) {
+  return request({
+    url: `/api/HealthyData/GetReportData`,
+    method: 'post',
+    data: params
+  });
+}

src/views/insight/index.vue

@@ -89,16 +89,16 @@
       </div>
       <div class="Chat signChart" id="signChart"></div>
     </div>
-    <div class="grid" v-if="signList[signActive].grid">
+    <div class="grid">
       <div
         class="gridItem"
-        :class="{ minItem: signGrid.length % 3 == 0 }"
+        v-show="signActive != 2"
         :style="`background:${item.color};`"
-        v-for="(item, index) in signGrid"
+        v-for="(item, index) in signDaysList"
         :key="index"
       >
         <div class="time">
-          <span class="number">5</span>
+          <span class="number">{{ item.day }}</span>
           <span>天</span>
         </div>
         <div class="title">{{ item.name }}</div>
@@ -110,17 +110,21 @@
       <div class="result">
         <div class="wrapBox">
           <div class="text">
-            <div class="left"><p>总步数：285</p></div>
+            <div class="left">
+              <p>总步数：{{ stepsData.total || '--' }}</p>
+            </div>
             <div class="right">
-              <img :src="upImg" alt="" />
-              <span>923</span>
+              <img :src="stepsData.lastStepTotalCompare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(stepsData.lastStepTotalCompare) || '--' }}</span>
             </div>
           </div>
           <div class="text">
-            <div class="left"><p>平均步数：285</p></div>
+            <div class="left">
+              <p>平均步数：{{ stepsData.avg || '--' }}</p>
+            </div>
             <div class="right">
-              <img :src="downImg" alt="" />
-              <span>923</span>
+              <img :src="stepsData.lastStepAvgCompare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(stepsData.lastStepAvgCompare) || '--' }}</span>
             </div>
           </div>
         </div>
@@ -132,17 +136,21 @@
       <div class="result">
         <div class="wrapBox">
           <div class="text">
-            <div class="left"><p>总消耗：285</p></div>
+            <div class="left">
+              <p>总消耗：{{ calorieData.total || '--' }}</p>
+            </div>
             <div class="right">
-              <img :src="upImg" alt="" />
-              <span>923</span>
+              <img :src="calorieData.lastCalorieTotalCompare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(calorieData.lastCalorieTotalCompare) || '--' }}</span>
             </div>
           </div>
           <div class="text">
-            <div class="left"><p>平均消耗：285</p></div>
+            <div class="left">
+              <p>平均消耗：{{ calorieData.avg || '--' }}</p>
+            </div>
             <div class="right">
-              <img :src="downImg" alt="" />
-              <span>923</span>
+              <img :src="calorieData.lastCalorieAvgCompare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(calorieData.avg) || '--' }}</span>
             </div>
           </div>
         </div>
@@ -158,6 +166,7 @@ import ToastService from '@/services/toast-service';
 import { /* EmotionModel, */ PsyBaseUrl } from '@/config/models';
 import axios from 'axios';
 import EchartBox from '@/components/EchartBox';
+import APIHealthUser from '@/api/health-user';
 export default {
   components: {
     DateSwitch,
@@ -283,7 +292,11 @@ export default {
       currentEmoName: '', //当前情绪名称
       emotionList: [],
       weekAndMonthSeries: null,
-      emoType: '1'
+      emoType: '1',
+      signData: {},
+      signDaysList: [],
+      stepsData: {},
+      calorieData: {}
     };
   },
   created() {
@@ -307,9 +320,10 @@ export default {
     },
     signActive(val) {
       console.log(val);
-      /*  this.$nextTick(() => {
-        this.initSignChart();
-      }); */
+      this.$nextTick(() => {
+        /* this.initSignChart(); */
+        this.initData();
+      });
     }
   },
   computed: {
@@ -890,6 +904,7 @@ export default {
       /* if (!this.emotionChart) {
         this.emotionChart = this.$echarts.init(document.getElementById('emotionChart'));
       } */
+      
       if (!this.signChart) {
         this.signChart = this.$echarts.init(document.getElementById('signChart'));
       }
@@ -942,147 +957,26 @@ export default {
 
       this.emotionChart.setOption(option);
     },
-    initSignChart() {
+    async initSignChart() {
       let option = this.getOption();
-
+      let data = await this.getReportData();
       if (this.signActive == 0) {
         //测试
-        let data = [
-          {
-            time: '5.11',
-            value: 50
-          },
-          {
-            time: '5.12',
-            value: 60
-          },
-          {
-            time: '5.13',
-            value: 70
-          },
-          {
-            time: '5.14',
-            value: 80
-          },
-          {
-            time: '5.15',
-            value: 120
-          },
-          {
-            time: '5.16',
-            value: 130
-          },
-          {
-            time: '5.17',
-            value: 150
-          }
-        ];
-
-        this.formateHeartRateData(option, data);
+        this.formateHeartRateData(option, data.day);
         this.signChart.setOption(option);
       } else if (this.signActive == 1) {
         //测试
-        let data = [
-          {
-            time: '5.11',
-            value: 36
-          },
-          {
-            time: '5.12',
-            value: 38
-          },
-          {
-            time: '5.13',
-            value: 37
-          },
-          {
-            time: '5.14',
-            value: 36
-          },
-          {
-            time: '5.15',
-            value: 38
-          },
-          {
-            time: '5.16',
-            value: 37
-          },
-          {
-            time: '5.17',
-            value: 39
-          }
-        ];
-        this.formateTemperatureData(option, data);
+        this.formateTemperatureData(option, data.day);
         this.signChart.setOption(option);
       } else if (this.signActive == 2) {
         option = this.getOption(false);
         let option2 = this.getOption(false);
+        let data2 = await this.getReportData(3);
+        this.stepsData = { ...data };
+        this.calorieData = { ...data2 };
 
-        //测试
-        let data = [
-          {
-            time: '5.11',
-            value: 36
-          },
-          {
-            time: '5.12',
-            value: 38
-          },
-          {
-            time: '5.13',
-            value: 37
-          },
-          {
-            time: '5.14',
-            value: 36
-          },
-          {
-            time: '5.15',
-            value: 38
-          },
-          {
-            time: '5.16',
-            value: 37
-          },
-          {
-            time: '5.17',
-            value: 39
-          }
-        ];
-        //测试
-        let data2 = [
-          {
-            time: '5.11',
-            value: 36
-          },
-          {
-            time: '5.12',
-            value: 38
-          },
-          {
-            time: '5.13',
-            value: 37
-          },
-          {
-            time: '5.14',
-            value: 36
-          },
-          {
-            time: '5.15',
-            value: 38
-          },
-          {
-            time: '5.16',
-            value: 37
-          },
-          {
-            time: '5.17',
-            value: 39
-          }
-        ];
-
-        this.formateStepData(option, data);
-        this.formateCalorieData(option2, data2);
+        this.formateStepData(option, data.day);
+        this.formateCalorieData(option2, data2.day);
 
         this.stepChart.setOption(option);
         this.calorieChart.setOption(option2);
@@ -1145,23 +1039,25 @@ export default {
         }
       });
       data.forEach(item => {
-        xdata.push(item.time);
+        xdata.push(item.date);
         fill.push({
           value: max - item.value,
           label: {
             show: false
           },
           itemStyle: {
-            color: this.formateHeartRateColor(item.value)
+            borderWidth: 3,
+            borderColor: this.calcColorByEvaluate(item.evaluate)
           }
         });
         ydata.push({
           value: item.value,
           label: {
-            show: true
+            show: false
           },
           itemStyle: {
-            color: this.formateHeartRateColor(item.value)
+            borderWidth: 3,
+            borderColor: this.calcColorByEvaluate(item.evaluate)
           }
         });
       });
@@ -1209,23 +1105,25 @@ export default {
         }
       });
       data.forEach(item => {
-        xdata.push(item.time);
+        xdata.push(item.date);
         fill.push({
           value: max - item.value,
           label: {
             show: false
           },
           itemStyle: {
-            color: this.formateTemperatureColor(item.value)
+            borderWidth: 3,
+            borderColor: this.calcColorByEvaluate(item.evaluate)
           }
         });
         ydata.push({
           value: item.value,
           label: {
-            show: true
+            show: false
           },
           itemStyle: {
-            color: this.formateTemperatureColor(item.value)
+            borderWidth: 3,
+            borderColor: this.calcColorByEvaluate(item.evaluate)
           }
         });
       });
@@ -1248,14 +1146,15 @@ export default {
       let xdata = [];
       let ydata = [];
       data.forEach(item => {
-        xdata.push(item.time);
+        xdata.push(item.date);
         ydata.push({
           value: item.value,
           label: {
             show: true
           },
           itemStyle: {
-            color: this.formateTemperatureColor(item.value)
+            borderWidth: 3,
+            borderColor: this.calcColorByEvaluate(item.evaluate)
           }
         });
       });
@@ -1268,14 +1167,15 @@ export default {
       let xdata = [];
       let ydata = [];
       data.forEach(item => {
-        xdata.push(item.time);
+        xdata.push(item.date);
         ydata.push({
           value: item.value,
           label: {
             show: true
           },
           itemStyle: {
-            color: this.formateTemperatureColor(item.value)
+            borderWidth: 3,
+            borderColor: this.calcColorByEvaluate(item.evaluate)
           }
         });
       });
@@ -1284,9 +1184,11 @@ export default {
       // 隐藏y轴
       option.yAxis.show = false;
     },
-    getOption(point = true) {
+    getOption(/* point = true */) {
       let option = {
         grid: {
+          show: true,
+          borderWidth: 0,
           top: '10%',
           left: '10%',
           right: '10%',
@@ -1299,34 +1201,86 @@ export default {
           },
           axisTick: {
             show: false
+          },
+          splitLine: {
+            show: false,
+            lineStyle: {
+              color: '#ddd',
+              width: 4
+            }
+          },
+          axisLabel: {
+            show: true,
+            fontSize: 12,
+            showMinLabel: true, //显示最小值
+            showMaxLabel: true, //显示最大值
+            marginBottom: 10 // 调整标签与轴线的距离
           }
         },
         yAxis: {
-          type: 'value'
+          type: 'value',
+          boundaryGap: ['5%', '5%'],
+          nameTextStyle: {
+            fontSize: 13
+          },
+          alignTicks: false,
+          axisTick: {
+            show: false
+          },
+          axisLabel: {
+            show: true,
+            fontSize: 13
+          },
+          splitLine: {
+            show: false,
+            lineStyle: {
+              color: '#ddd',
+              width: 1
+            }
+          }
         },
-        series: [
+        dataZoom: [
           {
-            type: 'bar',
-            barMaxWidth: 15,
-            stack: 'value',
-            stackStrategy: 'all',
-            animation: false,
-            label: {
-              show: true,
-              width: 15,
-              height: 15,
-              backgroundColor: '#fff',
-              borderRadius: 50,
-              borderWidth: 3,
-              borderColor: 'inherit',
-              verticalAlign: 'middle',
-              position: 'insideTop',
-              formatter: function () {
-                return '';
-              }
+            start: 0,
+            end: 100,
+            textStyle: {
+              color: '#FFF',
+              fontSize: 14
             },
+            show: true,
+            height: 20,
+            bottom: 8,
+            handleStyle: {
+              borderWidth: 4,
+              borderCap: 'square'
+            }
+          }
+        ],
+        tooltip: {
+          trigger: 'axis',
+          textStyle: {
+            fontSize: 16,
+            align: 'center'
+          },
+          formatter: function (params) {
+            return params[0].marker + params[0].name + '</br>' + params[0].value;
+          }
+        },
+        series: [
+          {
+            type: 'line',
+            padding: 10,
+            smooth: true,
+            symbol: 'circle',
+            symbolSize: 10,
             itemStyle: {
-              borderRadius: [0, 0, 12, 12]
+              color: '#fff',
+              borderWidth: 4
+            },
+            lineStyle: {
+              width: 6,
+              type: 'solid',
+              color: '#189b3b'
             }
           },
           {
@@ -1336,13 +1290,14 @@ export default {
             stackStrategy: 'all',
             animation: false,
             itemStyle: {
-              borderRadius: [12, 12, 0, 0]
+              borderRadius: [12, 12, 0, 0],
+              show: false
             }
           }
         ]
       };
 
-      if (!point) {
+      /* if (!point) {
         option.series = [
           {
             type: 'bar',
@@ -1357,7 +1312,7 @@ export default {
             }
           }
         ];
-      }
+      } */
 
       return option;
     },
@@ -1384,6 +1339,65 @@ export default {
           name: name
         }
       });
+    },
+    // 根据等级计算颜色
+    calcColorByEvaluate(value) {
+      let color = '';
+      const intValue = Number(value);
+      switch (intValue) {
+        case 1:
+          // 偏高
+          color = '#ff5f8b';
+          break;
+        case 2:
+          // 正常
+          color = '#189b3b';
+          break;
+        case 3:
+          // 偏低
+          color = '#2ea7e0';
+          break;
+        default:
+          color = '#189b3b';
+          break;
+      }
+      return color;
+    },
+    // 获取体征历史数据
+    getReportData(value) {
+      let reqBody = {
+        personId: this.$store.getters.personId,
+        dateType: 1,
+        healthyType: value || this.signActive,
+        startTime: '2024-01-28',
+        endTime: '2024-02-03'
+      };
+      return new Promise(resolve => {
+        APIHealthUser.getReportData(reqBody).then(res => {
+          if (res.data.data.day) {
+            res.data.data.day = res.data.data.day.map(item => {
+              item.date = this.$dayjs(item.date).format('MM-DD');
+              return item;
+            });
+          }
+          this.signData = { ...res.data.data };
+
+          if (this.signActive === 1) {
+            this.signDaysList = [
+              { day: res.data.data.normal, name: '正常', color: '#189b3b' },
+              { day: res.data.data.fever, name: '偏高', color: '#ff5f8b' }
+              /*  { day: res.data.data.low, name: '偏低', color: '#2ea7e0' } */
+            ];
+          } else {
+            this.signDaysList = [
+              { day: res.data.data.normal, name: '正常', color: '#189b3b' },
+              { day: res.data.data.high, name: '偏高', color: '#ff5f8b' },
+              { day: res.data.data.low, name: '偏低', color: '#2ea7e0' }
+            ];
+          }
+          resolve(res.data.data);
+        });
+      });
     }
   }
 };
@@ -1475,7 +1489,7 @@ export default {
   .ChatBox {
     overflow: hidden;
     width: calc(100vw - 60px);
-    height: 600px;
+    height: 650px;
     border: 2px solid #cdf348;
     border-radius: 70px;
     margin-top: 30px;
@@ -1484,7 +1498,7 @@ export default {
     }
     .legendBox {
       width: 100%;
-      height: 150px;
+      height: 100px;
       display: flex;
       justify-content: flex-end;
       align-items: center;

src/views/today/signsDetails.vue

@@ -572,11 +572,6 @@ export default {
           data: this.xAxisData
         },
         dataZoom: [
-          /*  {
-                            type: "inside",
-                            start: 0,
-                            end: 100,
-                        }, */
           {
             start: 0,
             end: 100,