Merge branch 'feat' into test

src/views/insight/index.vue

@@ -57,13 +57,24 @@
       </div>
     </div>
     <!-- bmi显示/输入 TODO待接口-->
-    <!-- <div class="bmi" v-show="signActive == 2">
-      <p>身高:<span>170</span>cm</p>
-      <p>体重:<span>60</span>kg</p>
-      <p>BMI:<span>24.5</span></p>
+    <div class="bmi" v-show="signActive == 2">
+      <p>身高:<span>{{ bmi.height }}</span>cm</p>
+      <p>体重:<span>{{ bmi.weight }}</span>kg</p>
+      <p>BMI:<span>{{ bmi.value }}</span></p>
       <p>{{ bmi.result }}</p>
-      <van-button size="mini">更新</van-button>
-    </div> -->
+      <van-button size="mini" @click="onUpdateBmi">更新</van-button>
+    </div>
+    <van-dialog v-model="bmi.isBmiShow" title="请输入身高和体重" confirm-button-color="#179b3b" cancel-button-text="关闭"
+      show-cancel-button @confirm="onConfirmBmi">
+      <div class="bmiDialog">
+        <van-cell-group>
+          <van-field v-model="bmi.height" label="身高：" type="number" maxlength="3" placeholder="请输入身高" border
+            input-align="left" />
+          <van-field v-model="bmi.weight" label="体重：" type="number" maxlength="3" placeholder="请输入体重" border
+            input-align="left" />
+        </van-cell-group>
+      </div>
+    </van-dialog>
     <div class="title-out">
       <span>{{ signsChartTitle }}</span>
     </div>
@@ -98,8 +109,8 @@
               <p>总步数：{{ stepsData.total || '--' }}</p>
             </div>
             <div class="right">
-              <img :src="stepsData.lastStepTotalCompare > 0 ? upImg : downImg" alt="" />
-              <span>{{ Math.abs(stepsData.lastStepTotalCompare) || '--' }}</span>
+              <img :src="stepsData.compare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(stepsData.compare) || '--' }}</span>
             </div>
           </div>
           <div class="text">
@@ -107,8 +118,8 @@
               <p>平均步数：{{ stepsData.avg || '--' }}</p>
             </div>
             <div class="right">
-              <img :src="stepsData.lastStepAvgCompare > 0 ? upImg : downImg" alt="" />
-              <span>{{ Math.abs(stepsData.lastStepAvgCompare) || '--' }}</span>
+              <img :src="stepsData.compare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(stepsData.compare) || '--' }}</span>
             </div>
           </div>
         </div>
@@ -124,8 +135,8 @@
               <p>总消耗：{{ calorieData.total || '--' }}</p>
             </div>
             <div class="right">
-              <img :src="calorieData.lastCalorieTotalCompare > 0 ? upImg : downImg" alt="" />
-              <span>{{ Math.abs(calorieData.lastCalorieTotalCompare) || '--' }}</span>
+              <img :src="calorieData.compare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(calorieData.compare) || '--' }}</span>
             </div>
           </div>
           <div class="text">
@@ -133,8 +144,8 @@
               <p>平均消耗：{{ calorieData.avg || '--' }}</p>
             </div>
             <div class="right">
-              <img :src="calorieData.lastCalorieAvgCompare > 0 ? upImg : downImg" alt="" />
-              <span>{{ Math.abs(calorieData.avg) || '--' }}</span>
+              <img :src="calorieData.compare > 0 ? upImg : downImg" alt="" />
+              <span>{{ Math.abs(calorieData.compare) || '--' }}</span>
             </div>
           </div>
         </div>
@@ -252,7 +263,8 @@ export default {
         height: '170',
         weight: '57',
         value: '24.5',
-        result: '肥胖'
+        result: '肥胖',
+        isBmiShow: false,
       },
       upImg: require('@/assets/today/icons/up.png'),
       downImg: require('@/assets/today/icons/down.png'),
@@ -284,7 +296,8 @@ export default {
       signData: {},
       signDaysList: [],
       stepsData: {},
-      calorieData: {}
+      calorieData: {},
+
     };
   },
   created() {
@@ -718,6 +731,7 @@ export default {
                 value: [index, item.MinValue, item.MaxValue]
               };
             });
+            console.log("this.weekAndMonData", this.weekAndMonData);
             // x轴显示数据
             if (this.currentDays === 0) {
               // 显示今天数据
@@ -928,10 +942,6 @@ export default {
     },
     initData() {
       //初始化图表
-      /* if (!this.emotionChart) {
-        this.emotionChart = this.$echarts.init(document.getElementById('emotionChart'));
-      } */
-
       if (!this.signChart) {
         this.signChart = this.$echarts.init(document.getElementById('signChart'));
       }
@@ -942,7 +952,6 @@ export default {
         this.calorieChart = this.$echarts.init(document.getElementById('calorieChart'));
       }
       //渲染图表
-      /* this.initEmotionChart(); */
       this.initSignChart();
     },
     initEmotionChart() {
@@ -990,24 +999,25 @@ export default {
       let data = await this.getReportData('', this.date.start, this.date.end);
       if (this.signActive == 0) {
         //测试
-        this.formateHeartRateData(option, data.day);
+        this.formateHeartRateData(option, data.days);
         this.signChart.setOption(option);
       } else if (this.signActive == 1) {
         //测试
-        this.formateTemperatureData(option, data.day);
+        this.formateTemperatureData(option, data.days);
         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.date.start, this.date.end);
-        this.stepsData = { ...data };
-        this.calorieData = { ...data2 };
+        this.stepsData = { ...data.stepTotal, ...data.stepAvg };
+        this.calorieData = { ...data2.calorieTotal, ...data2.calorieAvg };
 
-        this.formateStepData(option, data.day);
-        this.formateCalorieData(option2, data2.day);
+        this.formateStepData(option, data.days);
+        this.formateCalorieData(option2, data2.days);
 
         this.stepChart.setOption(option);
         this.calorieChart.setOption(option2);
+        console.log("this.calorieData", this.calorieData);
       }
     },
     formateEmotionData(option, data) {
@@ -1060,24 +1070,11 @@ export default {
       let xdata = [];
       let ydata = [];
       let fill = [];
-      let max = 0;
-      data.forEach(item => {
-        if (item.value > max) {
-          max = item.value || '--';
-        }
-      });
-      data.forEach(item => {
-        xdata.push(item.date);
-        fill.push({
-          value: max - item.value || '--',
-          label: {
-            show: false
-          },
-          itemStyle: {
-            borderWidth: 3,
-            borderColor: this.calcColorByEvaluate(item.evaluate)
-          }
-        });
+      data.forEach((item) => {
+        xdata.push(item.key);
+        /* fill.push({
+          value: [index, Number(item.valueMax) || '--', Number(item.valueMin) || '--'],
+        }); */
         ydata.push({
           value: item.value || '--',
           label: {
@@ -1085,13 +1082,47 @@ export default {
           },
           itemStyle: {
             borderWidth: 3,
-            borderColor: this.calcColorByEvaluate(item.evaluate)
+            borderColor: this.calcColorByEvaluate(item.level)
           }
-        });
+        },
+        );
       });
+      fill = data.map((item, index) => {
+        return {
+          value: [index, item.valueMin || '--', item.valueMax || '--']
+        };
+      })
       option.xAxis.data = xdata;
       option.series[0].data = ydata;
-      /* option.series[1].data = fill; */
+      option.series[1].data = fill;
+      option[0] =
+        option.tooltip = {
+          trigger: 'axis',
+          textStyle: {
+            fontSize: 16
+          },
+          formatter: function (params) {
+            return (
+              /*  params[0].marker + */
+              '平均值:' +
+              params[0].name +
+              '--' +
+              params[0].value +
+              '</br>' +
+              /* params[1].marker + */
+              '最大值:' +
+              params[1].name +
+              '--' +
+              params[1].value[2] +
+              '</br>' +
+              /* params[1].marker + */
+              '最小值:' +
+              params[1].name +
+              '--' +
+              params[1].value[1]
+            );
+          }
+        };
       // 规定最小值
       option.yAxis.min = 40;
       // 规定最大值
@@ -1113,15 +1144,6 @@ export default {
         ]
       };
     },
-    formateHeartRateColor(value) {
-      if (value > 120) {
-        return this.heartRateMap.get('偏高');
-      } else if (value >= 60) {
-        return this.heartRateMap.get('正常');
-      } else {
-        return this.heartRateMap.get('偏低');
-      }
-    },
     formateTemperatureData(option, data) {
       let xdata = [];
       let ydata = [];
@@ -1133,17 +1155,8 @@ export default {
         }
       });
       data.forEach(item => {
-        xdata.push(item.date);
-        fill.push({
-          value: max - item.value || '--',
-          label: {
-            show: false
-          },
-          itemStyle: {
-            borderWidth: 3,
-            borderColor: this.calcColorByEvaluate(item.evaluate)
-          }
-        });
+        xdata.push(item.key);
+
         ydata.push({
           value: item.value || '--',
           label: {
@@ -1151,10 +1164,15 @@ export default {
           },
           itemStyle: {
             borderWidth: 3,
-            borderColor: this.calcColorByEvaluate(item.evaluate)
+            borderColor: this.calcColorByEvaluate(item.level)
           }
         });
       });
+      fill = data.map((item, index) => {
+        return {
+          value: [index, item.valueMin || '--', item.valueMax || '--']
+        };
+      })
       option.xAxis.data = xdata;
       option.series[0].data = ydata;
       option.series[0].markLine = {
@@ -1175,24 +1193,46 @@ export default {
           },
         ],
       }
+      option.series[1].data = fill;
+      option[0] =
+        option.tooltip = {
+          trigger: 'axis',
+          textStyle: {
+            fontSize: 16
+          },
+          formatter: function (params) {
+            return (
+              /*  params[0].marker + */
+              '平均值:' +
+              params[0].name +
+              '--' +
+              params[0].value +
+              '</br>' +
+              /* params[1].marker + */
+              '最大值:' +
+              params[1].name +
+              '--' +
+              params[1].value[2] +
+              '</br>' +
+              /* params[1].marker + */
+              '最小值:' +
+              params[1].name +
+              '--' +
+              params[1].value[1]
+            );
+          }
+        };
       /* option.series[1].data = fill; */
       // 规定最小值
       option.yAxis.min = 34.5;
       // 规定最大值
       option.yAxis.max = 42.5;
     },
-    formateTemperatureColor(value) {
-      if (value > 38) {
-        return this.temperatureMap.get('发烧');
-      } else {
-        return this.temperatureMap.get('正常');
-      }
-    },
     formateStepData(option, data) {
       let xdata = [];
       let ydata = [];
       data.forEach(item => {
-        xdata.push(item.date);
+        xdata.push(item.key);
         ydata.push({
           value: item.value,
           label: {
@@ -1200,7 +1240,7 @@ export default {
           },
           itemStyle: {
             borderWidth: 3,
-            borderColor: this.calcColorByEvaluate(item.evaluate)
+            borderColor: this.calcColorByEvaluate(item.level)
           }
         });
       });
@@ -1213,7 +1253,7 @@ export default {
       let xdata = [];
       let ydata = [];
       data.forEach(item => {
-        xdata.push(item.date);
+        xdata.push(item.key);
         ydata.push({
           value: item.value,
           label: {
@@ -1221,7 +1261,7 @@ export default {
           },
           itemStyle: {
             borderWidth: 3,
-            borderColor: this.calcColorByEvaluate(item.evaluate)
+            borderColor: this.calcColorByEvaluate(item.level)
           }
         });
       });
@@ -1231,6 +1271,77 @@ export default {
       option.yAxis.show = false;
     },
     getOption(/* point = true */) {
+      let that = this;
+      let chartSeries = [];
+      if (this.signActive === 0 || this.signActive === 1) {
+        chartSeries = [
+          {
+            name: '平均值',
+            type: 'scatter',
+            symbolSize: 14,
+          },
+          {
+            name: '',
+            type: 'custom',
+            renderItem: function (params, api) {
+              let categoryIndex = api.value(0);
+              let end = (api.coord([categoryIndex, api.value(1)]));
+              let start = (api.coord([categoryIndex, api.value(2)]));
+              let width = 16;
+              let rectShape = that.$echarts.graphic.clipRectByRect(
+                {
+                  x: start[0] - width / 2,
+                  y: start[1],
+                  width: 16,
+                  height: end[1] - start[1]
+                },
+                {
+                  x: params.coordSys.x,
+                  y: params.coordSys.y,
+                  width: params.coordSys.width,
+                  height: params.coordSys.height
+                }
+              );
+              if (rectShape) {
+                rectShape.r = [20];
+              }
+              return (
+                rectShape && {
+                  type: 'rect',
+                  shape: rectShape,
+                  style: api.style()
+                }
+              );
+            },
+            itemStyle: {
+              opacity: 0.8
+            },
+            encode: {
+              y: [1, 2],
+              x: 0
+            }
+          },
+        ]
+      } else {
+        chartSeries = [
+          {
+            type: 'line',
+            padding: 10,
+            smooth: true,
+            symbol: 'circle',
+            symbolSize: 10,
+            itemStyle: {
+              color: '#fff',
+              borderWidth: 4
+            },
+            lineStyle: {
+              width: 6,
+              type: 'solid',
+              color: '#189b3b'
+            }
+          },
+        ]
+      }
       let option = {
         grid: {
           show: true,
@@ -1309,39 +1420,10 @@ export default {
             align: 'center'
           },
           formatter: function (params) {
-            console.log("params", params);
             return params[0].marker + params[0].name + '</br>' + params[0].value;
           }
         },
-        series: [
-          {
-            type: 'line',
-            padding: 10,
-            smooth: true,
-            symbol: 'circle',
-            symbolSize: 10,
-            itemStyle: {
-              color: '#fff',
-              borderWidth: 4
-            },
-            lineStyle: {
-              width: 6,
-              type: 'solid',
-              color: '#189b3b'
-            }
-          },
-          /* {
-            type: 'bar',
-            barMaxWidth: 15,
-            stack: 'value',
-            stackStrategy: 'all',
-            animation: false,
-            itemStyle: {
-              borderRadius: [12, 12, 0, 0],
-              show: false
-            }
-          } */
-        ]
+        series: chartSeries
       };
 
       /* if (!point) {
@@ -1394,15 +1476,19 @@ export default {
       let color = '';
       const intValue = Number(value);
       switch (intValue) {
-        case 1:
+        case 2:
           // 偏高
           color = '#ff5f8b';
           break;
-        case 2:
+        case 1:
           // 正常
           color = '#189b3b';
           break;
-        case 3:
+        case 99:
+          // 正常
+          color = '#189b3b';
+          break;
+        case 0:
           // 偏低
           color = '#2ea7e0';
           break;
@@ -1424,9 +1510,9 @@ export default {
       };
       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');
+          if (res.data.data.days) {
+            res.data.data.days = res.data.data.days.map(item => {
+              item.key = this.$dayjs(item.key).format('MM-DD');
               return item;
             });
           }
@@ -1434,20 +1520,41 @@ export default {
 
           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.normalDay.normalDay, name: '正常', color: '#189b3b'
+              },
+              { day: res.data.data.highDay.highDay, name: '偏高', color: '#ff5f8b' }
               /*  { day: res.data.data.low, name: '偏低', color: '#2ea7e0' } */
             ];
+          } else if (this.signActive === 0) {
+            this.signDaysList = [
+              {
+                day: res.data.data.normalDay
+                  .normalDay, name: '正常', color: '#189b3b'
+              },
+              { day: res.data.data.highDay.highDay, name: '偏高', color: '#ff5f8b' },
+              { day: res.data.data.lowDay.lowDay, 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' }
+              {
+                day: res.data.data.normalDay, name: '正常', color: '#189b3b'
+              },
+              { day: res.data.data.highDay, name: '偏高', color: '#ff5f8b' },
+              { day: res.data.data.lowDay, name: '偏低', color: '#2ea7e0' }
             ];
           }
           resolve(res.data.data);
         });
       });
+    },
+    // 更新bmi
+    onUpdateBmi() {
+      // 打开输入弹窗
+      this.bmi.isBmiShow = true;
+    },
+    onConfirmBmi() {
+
     }
   }
 };
@@ -1519,7 +1626,7 @@ export default {
 
     .van-button {
       padding: 5px 10px;
-      margin-left: 50px;
+      margin-left: 10px;
       font-size: 12px;
       color: #fff;
       border-radius: 30px;
@@ -1527,6 +1634,15 @@ export default {
     }
   }
 
+  .bmiDialog {
+    padding: 40px 60px;
+    @include center();
+
+    .van-cell .van-field {
+      margin: 20px 0 !important;
+    }
+  }
+
   .label {
     font-size: 36px;
     font-weight: bold;

src/views/optimize/index.vue

@@ -4,7 +4,7 @@
     <!-- 专家介绍 -->
     <div class="expert-box">
       <van-swipe indicator-color="white">
-        <van-swipe-item v-for="(item, index) in expertImages" :key="index">
+        <van-swipe-item v-for="(item, index) in expertImages" :key="index" @click="onNavigation(item)">
           <img v-lazy="item.cover" />
         </van-swipe-item>
       </van-swipe>
@@ -189,6 +189,12 @@ export default {
         this.expertImages = data;
         console.log("this.expertImages", this.expertImages);
       })
+    },
+    onNavigation(item) {
+      console.log("轮播图", item);
+      if (item.href) {
+        window.location.href = item.href
+      }
     }
   }
 };

src/views/today/signsDetails.vue

@@ -1,23 +1,13 @@
 <template>
   <div class="psychological-container">
-    <van-nav-bar
-      title="体征监测"
-      @click-left="onNavBack"
-      right-text="历史"
-      @click-right="onHistory"
-      left-text="返回"
-      left-arrow
-    >
+    <van-nav-bar title="体征监测" @click-left="onNavBack" right-text="历史" @click-right="onHistory" left-text="返回"
+      left-arrow>
     </van-nav-bar>
     <div class="tab-bar">
       <div class="date-tab-con">
         <div class="date-tab-list">
-          <div
-            :class="['date-tab-item', { active: current === index, notClick: false }]"
-            @click="onTabClick(item.value, index)"
-            v-for="(item, index) in dateList"
-            :key="index"
-          >
+          <div :class="['date-tab-item', { active: current === index, notClick: false }]"
+            @click="onTabClick(item.value, index)" v-for="(item, index) in dateList" :key="index">
             <img :src="tabImgUrl" alt v-if="index == 3" />
             <span>{{ item.text }}</span>
             <img class="more" :src="selectDownImg" alt v-if="index == 3" />
@@ -59,30 +49,13 @@
         </div>
         <!-- 日历 -->
 
-        <van-dialog
-          class="calenddar-dialog"
-          v-model="calendarDialogShow"
-          :show-confirm-button="false"
-          :show-cancle-button="false"
-          :close-on-click-overlay="true"
-          ref="calenddarDialog"
-        >
+        <van-dialog class="calenddar-dialog" v-model="calendarDialogShow" :show-confirm-button="false"
+          :show-cancle-button="false" :close-on-click-overlay="true" ref="calenddarDialog">
           <template #default>
             <div class="calendar" ref="calendarCon">
-              <van-calendar
-                v-model="calendarShow"
-                :min-date="minDate"
-                :max-date="maxDate"
-                :default-date="defaultDate"
-                :round="false"
-                :poppable="false"
-                color="#179b3b"
-                :show-confirm="false"
-                :show-title="false"
-                :show-subtitle="false"
-                :formatter="formatter"
-                @select="onSelect"
-              />
+              <van-calendar v-model="calendarShow" :min-date="minDate" :max-date="maxDate" :default-date="defaultDate"
+                :round="false" :poppable="false" color="#179b3b" :show-confirm="false" :show-title="false"
+                :show-subtitle="false" :formatter="formatter" @select="onSelect" />
             </div>
           </template>
         </van-dialog>
@@ -120,16 +93,9 @@
         <!-- 非7天30天显示 -->
         <div class="circle-con" v-show="current === 0">
           <div class="out-circle">
-            <van-circle
-              v-model="currentCircle"
-              layer-color="#f1f0ff"
-              :rate="circleRate"
-              :speed="100"
-              clockwise
-              :color="calcColorByTypeAndValue(this.healthyType, this.resultLevel, 2)"
-              stroke-linecap="butt"
-              stroke-width="120"
-            >
+            <van-circle v-model="currentCircle" layer-color="#f1f0ff" :rate="circleRate" :speed="100" clockwise
+              :color="calcColorByTypeAndValue(this.healthyType, this.resultLevel, 2)" stroke-linecap="butt"
+              stroke-width="120">
               <template #default>
                 <div class="circle-text">
                   <p class="left">{{ todayValue || '--' }}</p>
@@ -138,22 +104,15 @@
               </template>
             </van-circle>
 
-            <div
-              class="circle-white"
-              :style="{
-                borderColor: calcColorByTypeAndValue(this.healthyType, this.resultLevel, 2)
-              }"
-            ></div>
+            <div class="circle-white" :style="{
+      borderColor: calcColorByTypeAndValue(this.healthyType, this.resultLevel, 2)
+    }"></div>
           </div>
           <div class="progress">
-            <div
-              class="progress-circle"
-              :style="{
-                borderColor: calcColorByTypeAndValue(this.healthyType, this.resultLevel, 2),
-                left: this.progressCircle
-              }"
-              v-show="todayValue != ''"
-            ></div>
+            <div class="progress-circle" :style="{
+      borderColor: calcColorByTypeAndValue(this.healthyType, this.resultLevel, 2),
+      left: this.progressCircle
+    }" v-show="todayValue != ''"></div>
             <div class="state-item" v-for="(item, index) in statesList" :key="index">
               <div :class="['state-line', item.state]" :style="{ backgroundColor: item.color }"></div>
               <div class="state-text">
@@ -166,12 +125,8 @@
 
         <div class="statistics" v-show="psyCurrent !== 2">
           <div class="list">
-            <div
-              class="item"
-              v-for="(item, index) in statisticsList"
-              :key="index"
-              :style="{ backgroundColor: item.bgColor }"
-            >
+            <div class="item" v-for="(item, index) in statisticsList" :key="index"
+              :style="{ backgroundColor: item.bgColor }">
               <div class="top">
                 <span>{{ item.label || '--' }}</span>
               </div>
@@ -189,8 +144,7 @@
         <div class="tip">
           <img class="img" src="@/assets/today/icons/2_25.png" />
           <p>
-            <span>温馨提示：</span
-            >检测数据仅供参考，<span>不可做医疗诊断和治疗依据</span>，在运动、工作等场景会影响健康检测。
+            <span>温馨提示：</span>检测数据仅供参考，<span>不可做医疗诊断和治疗依据</span>，在运动、工作等场景会影响健康检测。
           </p>
         </div>
       </div>
@@ -199,12 +153,8 @@
       <div class="psy-tab-bar">
         <div class="psy-tab-con">
           <div class="psy-tab-list">
-            <div
-              :class="['psy-tab-item', { active: psyCurrent === index, notClick: false }]"
-              @click="onPsyTabClick(item, index)"
-              v-for="(item, index) in psyList"
-              :key="index"
-            >
+            <div :class="['psy-tab-item', { active: psyCurrent === index, notClick: false }]"
+              @click="onPsyTabClick(item, index)" v-for="(item, index) in psyList" :key="index">
               <span>{{ item.text }}</span>
             </div>
           </div>
@@ -215,15 +165,8 @@
       <div class="bottom">
         <div class="echart-container">
           <div class="echart">
-            <EchartBox
-              echartId="charts"
-              :outTitle="emoLegend.outTitle"
-              rightRowType="in-line-block"
-              height="200"
-              width="200"
-              :legend="emoLegend"
-              :options="defaultOptions"
-            ></EchartBox>
+            <EchartBox echartId="charts" :outTitle="emoLegend.outTitle" rightRowType="in-line-block" height="200"
+              width="200" :legend="emoLegend" :options="defaultOptions"></EchartBox>
           </div>
         </div>
 
@@ -250,9 +193,7 @@
                 {{ result }}
               </p>
 
-              <span class="font-28"
-                ><!-- 继续保持积极乐观，培养健康的生活习惯，预防消极事件对情绪带来的不良影响。 -->{{ advice }}</span
-              >
+              <span class="font-28"><!-- 继续保持积极乐观，培养健康的生活习惯，预防消极事件对情绪带来的不良影响。 -->{{ advice }}</span>
             </div>
 
             <!--  <div class="friendly-reminder" v-if="emoType === 2">
@@ -272,12 +213,8 @@
             <div class="title">
               <span class="title-text">{{ surveyTitle }}</span>
               <div class="mood-list" v-if="emotionList.length > 0">
-                <div
-                  class="item"
-                  v-for="(item, index) in emotionList"
-                  :key="index"
-                  :style="{ backgroundColor: item.color }"
-                >
+                <div class="item" v-for="(item, index) in emotionList" :key="index"
+                  :style="{ backgroundColor: item.color }">
                   <p>
                     <span class="day">{{ item.days }}</span>
                     <span class="day-text">天</span>
@@ -303,7 +240,9 @@
     <van-popup v-model="isPopup">
       <div class="popup">
         <div class="item science-tips first" v-if="emoType === 2">
-          <div class="tips"><h5>小科普</h5></div>
+          <div class="tips">
+            <h5>小科普</h5>
+          </div>
           <p>
             抑郁症是一抑郁种心理疾病，严重时可发展为精神障碍。然而当我们体会到了痛苦、悲伤、和郁闷等负面情绪，并不意味着我们就是抑郁症。日常的短时的喜、怒、哀、乐，都是正常的情绪变化，然而长期的低落情绪、兴趣缺失等可能会让我们有抑郁的风险。
           </p>
@@ -321,8 +260,8 @@
     </van-popup>
   </div>
 </template>
-    
-    <script>
+
+<script>
 import { Signsmodel } from '@/config/models';
 import EchartBox from '@/components/EchartBox';
 import ToastService from '@/services/toast-service';
@@ -719,7 +658,7 @@ export default {
       } else {
         today =
           this.$dayjs(this.selectDate || this.defaultDate).format('YYYY-MM-DD') ===
-          this.$dayjs(new Date()).format('YYYY-MM-DD')
+            this.$dayjs(new Date()).format('YYYY-MM-DD')
             ? '今天'
             : '';
       }
@@ -733,7 +672,7 @@ export default {
       } else {
         today =
           this.$dayjs(this.selectDate || this.defaultDate).format('YYYY-MM-DD') ===
-          this.$dayjs(new Date()).format('YYYY-MM-DD')
+            this.$dayjs(new Date()).format('YYYY-MM-DD')
             ? '今天'
             : '';
       }
@@ -1030,23 +969,23 @@ export default {
           // 中间折线图
           this.emotionData = data.chartDatas
             ? data.chartDatas.map(item => {
-                return {
-                  value: item.value || '--',
-                  itemStyle: {
-                    color: this.currentDays !== 0 && this.healthyType !== 2 ? this.calcResultColor(item.level) : '#fff',
-                    borderColor: this.calcResultColor(item.level),
-                    borderWidth: 3
-                  }
-                };
-              })
+              return {
+                value: item.value || '--',
+                itemStyle: {
+                  color: this.currentDays !== 0 && this.healthyType !== 2 ? this.calcResultColor(item.level) : '#fff',
+                  borderColor: this.calcResultColor(item.level),
+                  borderWidth: 3
+                }
+              };
+            })
             : [];
           // 7天 和 30天柱形图显示
           this.weekAndMonData = data.chartDatas
             ? data.chartDatas.map((item, index) => {
-                return {
-                  value: [index, item.valueMin || '--', item.valueMax || '--']
-                };
-              })
+              return {
+                value: [index, item.valueMin || '--', item.valueMax || '--']
+              };
+            })
             : [];
           console.log('this.weekAndMonData', this.weekAndMonData);
           if (this.currentDays === 0) {
@@ -1255,7 +1194,7 @@ export default {
       this.currentDays = 0;
       this.getSignsData(selectDate);
     },
-    onClose() {},
+    onClose() { },
     // 点击日期选择
     onTabClick(value, index) {
       this.current = index;
@@ -1411,8 +1350,8 @@ export default {
   }
 };
 </script>
-    
-  <style lang="scss">
+
+<style lang="scss">
 .calendar {
   height: 800px;
 
@@ -1423,10 +1362,12 @@ export default {
     .van-calendar__header {
       display: none;
     }
+
     .van-calendar__days {
       display: grid;
       grid-template-columns: repeat(7, 1fr);
     }
+
     .van-calendar__days .van-calendar__day {
       width: 27px;
       height: 27px;
@@ -1472,7 +1413,6 @@ export default {
   }
 }
 </style>
-    <style scoped lang="scss">
+<style scoped lang="scss">
 @import './scss/emotion-details.scss';
-</style>
-    
+</style>