init

config/dev.env.js

@@ -4,5 +4,5 @@ var prodEnv = require('./prod.env')
 module.exports = merge(prodEnv, {
   NODE_ENV: '"development"',
   // REQUEST_URI: "'https://testapi.shuimuai.com/'"
-  REQUEST_URI: "'https://api.shuimuai.com/'"
+  REQUEST_URI: "'https://testapi.shuimuai.com/'"
 })

src/App.vue

@@ -7,8 +7,8 @@ export default {
   },
   //外发
   onShow(options){
-      let query = options.query.other
       console.log('进入小程序了',options)
+      let query = options.query.other
       // 有无参数
       if(query){
         console.log('外发给你')

src/pages/index/index.vue

@@ -191,7 +191,7 @@ export default {
   onHide() {},
   onLoad($option) {
     if (process.env.NODE_ENV == "development") {
-      // wx.setStorageSync("token", "ZbNv-hpdpmxk895iqUrEwe4kCJjEWCJD");
+      wx.setStorageSync("token", "ZbNv-hpdpmxk895iqUrEwe4kCJjEWCJD");
     }
 
     if (game_store.getters.getGameStatus() == 1) {

src/pages/report/index.vue

@@ -53,7 +53,9 @@
           />
         </view>
         <view class="left_content">
-          <view class="left_num">{{ record.height_absorbed }}<text class="textLil text-gray">%</text></view>
+          <view class="left_num">{{ record.height_absorbed }}
+            <text class="textLil text-gray">%</text>
+          </view>
           <view class="left_text">高专注力<br/>&emsp;占比</view>
         </view>
       </view>
@@ -64,7 +66,9 @@
           <view>专注力维持区间</view>
         </view>
         <view class="detail">
-          <view class="detail_num">{{ record.interfere }}<text class="textLil text-gray">次</text></view>
+          <view class="detail_num">{{ record.interfere }}
+            <text class="textLil text-gray">次</text>
+          </view>
           <view>受干扰次数</view>
         </view>
         <view class="detail">
@@ -72,14 +76,18 @@
           <view>专注力最大爆发值</view>
         </view>
         <view class="detail">
-          <view class="detail_num">{{ record.start }}<text class="textLil text-gray">秒</text></view>
+          <view class="detail_num">{{ record.start }}
+            <text class="textLil text-gray">秒</text>
+          </view>
           <view>专注力启动时长</view>
         </view>
       </view>
 
       <!-- 平均专注力 -->
       <view class="margin_right ">
-        <view class="right_num">{{ record.att_average_big }}<text class="text-sm">{{ record.att_average_lil }}</text></view>
+        <view class="right_num">{{ record.att_average_big }}
+          <text class="text-sm">{{ record.att_average_lil }}</text>
+        </view>
         <view class="right_text">平均专注力</view>
       </view>
 
@@ -130,19 +138,19 @@
         <view class="title">专注力数值曲线</view>
       </view>
       <view class="label">
-          <view>
-            <view class="dot dot-Att"></view>
-            <text class="name">Att(专注度)</text>
-          </view>
-          <view>
-            <view class="dot dot-Med"></view>
-            <text class="name">Med(放松度)</text>
-          </view>
-         <view>
-            <view class="dot dot-Amp"></view>
-            <text class="name">Amp(和谐度)</text>
-          </view>
+        <view>
+          <view class="dot dot-Att"></view>
+          <text class="name">Att(专注度)</text>
         </view>
+        <view>
+          <view class="dot dot-Med"></view>
+          <text class="name">Med(放松度)</text>
+        </view>
+        <view>
+          <view class="dot dot-Amp"></view>
+          <text class="name">Amp(和谐度)</text>
+        </view>
+      </view>
     </view>
 
     <view class="chart chart_line">
@@ -159,12 +167,12 @@
       <van-tabs
         :active="0"
         color="#6858C4"
-        type="card"
         @change="changeMin"
+        :swipe-threshold="4"
       >
         <van-tab
           :name="index"
-          :title="(5*index)+'-'+(5*(index+1)) + '分钟'"
+          :title="(2*index)+'-'+(2*(index+1)) + '分钟'"
           v-for="(section,index) in data_section"
           :key="index"
         ></van-tab>
@@ -242,9 +250,27 @@
           canvasId="demo-canvas-a1"
         />
       </view>
+      <view
+        class="section_container"
+        v-if="is_cut"
+      >
+        <van-tabs
+          :active="0"
+          color="#6858C4"
+          @change="changeABMin"
+          :swipe-threshold="4"
+        >
+          <van-tab
+            :name="index"
+            :title="(2*index)+'-'+(2*(index+1)) + '分钟'"
+            v-for="(section,index) in data_section"
+            :key="index"
+          ></van-tab>
+        </van-tabs>
+      </view>
     </view>
     <!-- Delta/theta脑波变化曲线图 -->
-    <view class="absorbed_change "> 
+    <view class="absorbed_change ">
       <view class="bar">
         <view class="interfere_title_wrap">
           <view class="line"></view>
@@ -269,6 +295,25 @@
           canvasId="demo-canvas-a2"
         />
       </view>
+      <view
+        class="section_container"
+        v-if="is_cut"
+      >
+        <van-tabs
+          :active="0"
+          color="#6858C4"
+          @change="changeDTMin"
+          :swipe-threshold="4"
+
+        >
+          <van-tab
+            :name="index"
+            :title="(2*index)+'-'+(2*(index+1)) + '分钟'"
+            v-for="(section,index) in data_section"
+            :key="index"
+          ></van-tab>
+        </van-tabs>
+      </view>
     </view>
 
     <van-toast id="van-toast"/>
@@ -442,6 +487,7 @@ export default {
             $this.record["att_average_string"] = $this.record["att_average"].toString();
             $this.record["att_average_lil"] = $this.record["att_average_string"].substring($this.record["att_average_string"].indexOf("."));
 
+            let $play_time = $this.record.play_time;
             $this.record.play_time = formatSeconds($this.record.play_time);
             $this.record.start_time = timestampToTimeS($this.record.start_time);
             $this.record.height_absorbed = Math.ceil(
@@ -469,22 +515,32 @@ export default {
             $pie_charts.setOption($pie_option);
 
             //5分钟阶段
-            let $five_min = 5 * 60;
-            $this.is_cut = $this.record.play_time > $five_min;
+            let $min = 2 * 60;
+            $this.is_cut = $play_time > $min;
+            console.log($this.is_cut)
             if ($this.is_cut) {
               //截断得数量
               $this.data_section = Math.ceil(
-                $this.record.play_time / $five_min
+                $play_time / $min
               );
+              let $e = {
+                mp: {
+                  detail: {
+                    name: 0
+                  }
+                }
+              }
+              this.changeMin($e)
+              this.changeABMin($e)
+              this.changeDTMin($e)
+            } else {
+              //处理 专注度 和  放松度的值
+              $this.get_game_line($this.record.line, $this.record.line_med, $this.record.amp)
+              // 处理 alpha beta
+              $this.get_game_ab($this.record.low_alpha, $this.record.high_alpha, $this.record.low_beta, $this.record.high_beta)
+              // // 处理 delta theta
+              $this.get_game_dt($this.record.delta, $this.record.theta)
             }
-            //处理 专注度 和  放松度的值
-            $this.get_game_line($this.record.line, $this.record.line_med, $this.record.amp)
-            // 处理 alpha beta
-            console.log($this.record.alpha, $this.record.theta)
-            $this.get_game_ab($this.record.low_alpha, $this.record.high_alpha, $this.record.low_beta, $this.record.high_beta)
-            // // 处理 delta theta
-            console.log($this.record.beta, $this.record.delta)
-            $this.get_game_dt($this.record.delta, $this.record.theta)
 
 
           },
@@ -495,32 +551,8 @@ export default {
       }, 800);
     },
     get_game_line($line_data, $line_med_data, $line_amp_data) {
-      let $option = {};
-      setTimeout(() => {
-        if ($this.is_cut) {
-          //需要截断数据
-          let $more_than_count = $line_data.length % $this.data_section;
-          let i = 0;
-          //根据多出来的数 删除结尾得数量
-          for (i = 0; i < $more_than_count; i++) {
-            $line_data.pop();
-          }
-
-          $this.data_lines = [];
-          //获取每一组得数据长度
-          let $item_len = $line_data.length / $this.data_section;
-          for (i = 0; i < $this.data_section; i++) {
-            $this.data_lines.push(
-              $line_data.slice(i * $item_len, (i + 1) * $item_len)
-            );
-          }
-
-          $option = util.getLineOption($this.data_lines[0], $line_med_data, $line_amp_data);
-        } else {
-          $option = util.getLineOption($line_data, $line_med_data, $line_amp_data);
-        }
-        att_charts.setOption($option);
-      }, 800);
+      let $option = util.getLineOption($line_data, $line_med_data, $line_amp_data);
+      att_charts.setOption($option);
     },
     get_game_ab($line_alphaL, $line_alphaH, $line_betaL, $line_betaH) {
       let $option = {};
@@ -540,8 +572,39 @@ export default {
     //  切换时间查看线 数据
     changeMin($e) {
       let $index = $e.mp.detail.name;
-      let $option = util.getLineOption($this.data_lines[$index], [0]);
-      att_charts.setOption($option);
+      // 0-2  2-4  4-6
+      // 0    1    2
+      let $start = $index * 120
+      let $end = ($index + 1) * 120
+      let $line_data = $this.record.line.slice($start, $end);
+      let $med_data = $this.record.line_med.slice($start, $end);
+      let $amp_data = $this.record.amp.slice($start, $end);
+      $this.get_game_line($line_data, $med_data, $amp_data)
+    },
+    //  切换时间查看线 数据
+    changeABMin($e) {
+      let $index = $e.mp.detail.name;
+      // 0-2  2-4  4-6
+      // 0    1    2
+      let $start = $index * 120
+      let $end = ($index + 1) * 120
+      console.log($start, $end)
+      let low_alpha = $this.record.low_alpha.slice($start, $end);
+      let high_alpha = $this.record.high_alpha.slice($start, $end);
+      let low_beta = $this.record.low_beta.slice($start, $end);
+      let high_beta = $this.record.high_beta.slice($start, $end);
+      $this.get_game_ab(low_alpha, high_alpha, low_beta, high_beta)
+    },
+    //  切换时间查看线 数据
+    changeDTMin($e) {
+      let $index = $e.mp.detail.name;
+      // 0-2  2-4  4-6
+      // 0    1    2
+      let $start = $index * 120
+      let $end = ($index + 1) * 120
+      let delta = $this.record.delta.slice($start, $end);
+      let theta = $this.record.theta.slice($start, $end);
+      $this.get_game_dt(delta, theta)
     },
   },
   mounted() {
@@ -691,9 +754,9 @@ image.boy {
   justify-content: center;
   align-items: center;
   color: #676767;
-  z-index:999;
+  z-index: 999;
   margin-top: -100px;
-  margin-left:5px
+  margin-left: 5px
 }
 
 .margin-tb .margin_left .left_content .left_num {
@@ -825,7 +888,7 @@ image.boy {
   border-radius: 10px;
 }
 
-.chart_line{
+.chart_line {
   /* box-shadow: 0px 6px 11px #dadada; */
   background: #f3f3f3;
 }
@@ -880,7 +943,7 @@ image.boy {
   box-shadow: 0px 6px 11px #dadada;
 }
 
-.divide_line{
+.divide_line {
   width: 360px;
   height: 1px;
   background: #E5E5E5;
@@ -1086,12 +1149,12 @@ image.boy {
   font-size: 10px;
 }
 
-.label_up{
+.label_up {
   color: #9a95b7;
   font-size: 10px;
   display: flex;
   flex-wrap: wrap;
-  width:270px
+  width: 270px
 
 }
 
@@ -1107,9 +1170,11 @@ image.boy {
 .dot-Att {
   background: #FAB615;
 }
+
 .dot-Med {
   background: #40FF31;
 }
+
 .dot-Amp {
   background: #D4327A;
 }
@@ -1121,21 +1186,22 @@ image.boy {
   background: #FFE838;
 }
 
-.dot-Low-Alpha{
+.dot-Low-Alpha {
   background: #38FF49;
 }
 
-.dot-High-Alpha{
+.dot-High-Alpha {
   background: #00AD0E;
 }
 
-.dot-Low-Beta{
+.dot-Low-Beta {
   background: #0060F1;
 }
 
-.dot-High-Beta{
+.dot-High-Beta {
   background: #00CCFF;
 }
+
 /* .dot-Beta {
   background: #00CCFF;
 } */

src/pages/start/index.vue

@@ -130,11 +130,28 @@
             <view class="line"></view>
             <view class="title">大脑状态</view>
           </view>
+          <view class="label">
+            <view>
+              <view class="dot dot-orange"></view>
+              <view class="name">Att(专注度)</view>
+            </view>
+            <view>
+              <view class="dot dot-med"></view>
+              <view class="name">Med(放松度)</view>
+            </view>
+            <view>
+              <view class="dot dot-amp"></view>
+              <view class="name">Amp (和谐度)</view>
+            </view>
+          </view>
+        </view>
+        <view class="chart">
+          <mpvue-echarts
+            :echarts="echarts"
+            :onInit="attCharts"
+            canvasId="canvasId-demo1"
+          />
         </view>
-        <!--        <view class="chart">-->
-        <canvas canvas-id="lineCanvas" class="chart"></canvas>
-        <!--        </view>-->
-
       </view>
 
       <view class="chart_view_second margin-tb-xl">
@@ -143,10 +160,61 @@
             <view class="line"></view>
             <view class="title">基本脑波</view>
           </view>
+          <view class="label">
+            <van-row>
+              <van-col span="8">
+                <view>
+                  <view class="dot dot-delta"></view>
+                  <view class="name">Delta</view>
+                </view>
+              </van-col>
+
+              <van-col span="8">
+                <view>
+                  <view class="dot dot-theta"></view>
+                  <view class="name">Theta</view>
+                </view>
+              </van-col>
+
+              <van-col span="8">
+                <view>
+                  <view class="dot dot-low-beta"></view>
+                  <view class="name">Low_Beta</view>
+                </view>
+              </van-col>
+
+              <van-col span="8">
+                <view>
+                  <view class="dot dot-high-beta"></view>
+                  <view class="name">High_Beta</view>
+                </view>
+              </van-col>
+
+              <van-col span="8">
+                <view>
+                  <view class="dot dot-low-alpha"></view>
+                  <view class="name">Low_Alpha</view>
+                </view>
+              </van-col>
+
+              <van-col span="8">
+                <view>
+                  <view class="dot dot-high-alpah"></view>
+                  <view class="name">High_Alpha</view>
+                </view>
+              </van-col>
+            </van-row>
+
+
+          </view>
+        </view>
+        <view class="chart">
+          <mpvue-echarts
+            :echarts="echarts"
+            :onInit="medCharts"
+            canvasId="canvasId-demo2"
+          />
         </view>
-        <!--        <view class="chart">-->
-        <canvas canvas-id="areaCanvas" class="chart"></canvas>
-        <!--        </view>-->
       </view>
     </div>
 
@@ -163,21 +231,55 @@ import bluetooth from "../../utils/bluetooth";
 import game_store from "@/store/game";
 import Toast from "../../../static/vant/toast/toast";
 import {gameAddLine, gameEnd} from "../../requests/game";
-import wxCharts from "@/utils/wxcharts";
+import mpvueEcharts from "mpvue-echarts";
+import echarts from "../../../static/echarts.min";
 
 var att_charts, med_charts, $this;
 
+// 大脑图表初始化
+function initAttChart(canvas, width, height) {
+  att_charts = echarts.init(canvas, null, {
+    width: width,
+    height: height,
+  });
+  canvas.setChart(att_charts);
+
+  let option = {}; // ECharts 配置项
+
+  att_charts.setOption(option);
+  return att_charts; // 返回 chart 后可以自动绑定触摸操作
+}
+
+// 我的设备图表初始化
+function initMedChart(canvas, width, height) {
+  med_charts = echarts.init(canvas, null, {
+    width: width,
+    height: height,
+  });
+  canvas.setChart(med_charts);
+
+  let option = {}; // ECharts 配置项
+
+  med_charts.setOption(option);
+  return med_charts; // 返回 chart 后可以自动绑定触摸操作
+}
+
 export default {
   name: "index_container",
+  components: {
+    mpvueEcharts,
+  },
   data() {
     return {
+      // 折线图
+      echarts,
+      attCharts: initAttChart,
+      medCharts: initMedChart,
       // 使用类型 1次数 2时间 0未选择
       mode: 0,
 
       timeData: {},
-      mode_item: {
-        name: ""
-      },
+      mode_item: {},
       device_power: 100,
 
       user_info: {},
@@ -366,9 +468,11 @@ export default {
         $this.med_list = [];
         $this.amp_list = [];
         $this.delta_list = [];
-        $this.alpha_list = [];
         $this.theta_list = [];
-        $this.beta_list = [];
+        $this.low_alphas = [];
+        $this.high_alphas = [];
+        $this.low_betas = [];
+        $this.high_betas = [];
         //游戏结束重置游戏卡卷类型时间和卡卷类型
         wx.removeStorageSync("over_play_time");
         game_store.setters.setMode(0);
@@ -413,7 +517,6 @@ export default {
       $this.high_alphas.push($data['high_alpha']);
       $this.low_betas.push($data['low_beta']);
       $this.high_betas.push($data['high_beta']);
-      $this.cates.push("");
 
       if ($this.att_list.length > 15) {
         $this.att_list.shift();
@@ -425,7 +528,6 @@ export default {
         $this.high_alphas.shift();
         $this.low_betas.shift();
         $this.high_betas.shift();
-        $this.cates.shift()
       }
 
       $this.attList.push($data["att"]);
@@ -454,10 +556,19 @@ export default {
       let $hide_status = game_store.getters.getHideStatus();
       if (!$hide_status) {
         //通过专注放松度 画图
-        $this.charts($this.cates, $this.att_list, $this.med_list, $this.amp_list)
+        let $option = util.getLineOption($this.att_list, $this.med_list, $this.amp_list);
+        att_charts.setOption($option);
 
         //通过基本脑波发送数据
-        $this.areacharts($this.cates, $this.delta_list, $this.theta_list, $this.low_alphas, $this.high_alphas, $this.low_betas, $this.high_betas)
+        let $base_option = util.getBaseOption(
+          $this.delta_list,
+          $this.theta_list,
+          $this.low_alphas,
+          $this.high_alphas,
+          $this.low_betas,
+          $this.high_betas
+        );
+        med_charts.setOption($base_option);
       }
     },
     //计算游玩时间
@@ -487,113 +598,12 @@ export default {
       $this.mode_item = {};
       $this.mode_item = mode_list[$this.mode - 1];
     },
-    charts(cates, atts, meds, amps) {
-      new wxCharts({
-        canvasId: "lineCanvas",
-        type: "line",
-        width: 360,
-        height: 250,
-        legend: true,
-        background: "#302D43",
-        dataLabel: false,
-        categories: cates,
-        dataPointShape: false,
-        yAxis: {
-          min: 0,
-          max: 100,
-          fontColor: "#FFFFFF",
-        },
-        xAxis: {
-          disableGrid: false,
-          gridColor: "#302D43"
-        },
-        series: [{
-          name: "Att(专注度)",
-          color: "#FFB400",
-          data: atts,
-        },
-          {
-            name: "Med(放松度)",
-            color: "#40FF31",
-            data: meds,
-          },
-
-          {
-            name: "AMP(和谐度)",
-            color: "#D4327A",
-            data: amps,
-          },
-        ],
-        extra: {
-          lineStyle: "curve",
-          legendTextColor: "#FFFFFF"
-        },
-        animation: false
-      });
-    },
-    areacharts(cates, deltas, thetas, low_alphas, high_alphas, low_betas, high_betas) {
-      new wxCharts({
-        canvasId: "areaCanvas",
-        type: "line",
-        width: 360,
-        height: 250,
-        legend: true,
-        background: "#302D43",
-        dataLabel: false,
-        categories: cates,
-        dataPointShape: false,
-        yAxis: {
-          min: 0,
-          max: 100,
-          // fontColor: "#302D43",
-          fontColor: "#FFFFFF",
-        },
-        xAxis: {
-          disableGrid: false,
-          gridColor: "#302D43"
-        },
-        series: [
-          {
-            name: "Delta",
-            color: "#FF77B3",
-            data: deltas,
-          },
-          {
-            name: "Theta",
-            color: "#FFE838",
-            data: thetas,
-          },
-          {
-            name: "low_betas",
-            color: "#0060F1",
-            data: low_betas,
-          },
-          {
-            name: "high_betas",
-            color: "#00CCFF",
-            data: high_betas,
-          },
-          {
-            name: "low_alphas",
-            color: "#38FF49",
-            data: low_alphas,
-          },
-          {
-            name: "high_alphas",
-            color: "#00AD0E",
-            data: high_alphas,
-          },
-        ],
-        extra: {
-          lineStyle: "curve",
-          legendTextColor: "#FFFFFF"
-        },
-        animation: false
-      });
-    },
+    RandDomNum() {
+      $this.online_att = Math.round(Math.random() * 100);
+      $this.online_med = Math.round(Math.random() * 100);
+    }
   },
   mounted() {
-    // $this.charts(["","","","","",],[10,20,30,40,50],[11,21,31,41,51],[12,22,33,44,55])
     $this._deviceId = game_store.getters.getDeviceId();
     $this._serviceId = game_store.getters.getServiceId();
     $this._characteristicId = game_store.getters.getCharacterId();
@@ -685,7 +695,7 @@ export default {
   );
   background-color: #46425e;
   padding: 5px;
-  height: 925px;
+  height: 850px;
 }
 
 .game_panel {
@@ -763,6 +773,7 @@ export default {
 }
 
 .label {
+  width: 250px;
   color: #9a95b7;
   font-size: 10px;
 }
@@ -861,7 +872,7 @@ export default {
 
 .chart {
   width: 360px;
-  height: 250px;
+  height: 193px;
   background: #302d43;
   opacity: 0.6;
   border-radius: 10px;
@@ -894,6 +905,7 @@ export default {
 .circle_text {
   width: 100%;
   padding-bottom: 50px;
+  padding-bottom: 50px;
 
 }
 
@@ -918,4 +930,29 @@ export default {
   font-weight: 400;
   color: #FFFFFF;
 }
+
+.dot-delta {
+  background-color: #FF77B3;
+}
+
+.dot-theta {
+  background-color: #FFE838;
+}
+
+.dot-low-beta {
+  background-color: #0060F1;
+}
+
+.dot-high-beta {
+  background-color: #00CCFF;
+}
+
+.dot-low-alpha {
+  background-color: #38FF49;
+}
+
+.dot-high-alpah {
+  background-color: #00AD0E;
+}
 </style>
+

src/pages/start/main.json

@@ -6,6 +6,8 @@
     "van-popup": "../../static/vant/popup/index",
     "van-dialog": "../../static/vant/dialog/index",
     "van-circle": "../../static/vant/circle/index",
+    "van-tabs": "../../static/vant/tabs/index",
+    "van-tab": "../../static/vant/tab/index",
     "van-notify": "../../static/vant/notify/index"
   }
 }

src/utils/bluetooth.js

@@ -310,11 +310,12 @@ export default {
             game_store.setters.setPlayedTime($this.played_time)
             $this.played_time_text = that.formatPlaySeconds($this.played_time);
             $this.do_datas($data);
-            if ($this.played_time_text.indexOf(":00") != -1) {
+            if ($this.played_time_text.indexOf(":00") != -1 || $this.played_time_text.indexOf(":30") != -1) {
               $this.post_data();
             }
           }
           if ($this.played_time == 0) {
+            $this.post_data();
             //判断是否隐藏 隐藏则不绘画
             that.shutdownSendControl();
             let $hide_status = game_store.getters.getHideStatus();

src/utils/index.js

@@ -315,7 +315,7 @@ function getABOption(lineData_alphaL, lineData_alphaH, lineData_betaL, lineData_
 
 
 // delta theta
-function getDTOption(lineData_att, lineData_med) {
+function getDTOption(delta, theta) {
   const that = this;
   var option = {
     color: ["#FF77B3", "#FFE838"],
@@ -395,14 +395,14 @@ function getDTOption(lineData_att, lineData_med) {
         symbol: "none", //取消折点圆圈
         type: "line",
         smooth: true,
-        data: lineData_att,
+        data: delta,
       },
       {
         name: "Theta",
         symbol: "none", //取消折点圆圈
         type: "line",
         smooth: true,
-        data: lineData_med,
+        data: theta,
       },
     ],
     animation: false,
@@ -411,12 +411,12 @@ function getDTOption(lineData_att, lineData_med) {
 }
 
 // 基本脑波图
-function getBaseOption(delta, theta, alpha, beta) {
+function getBaseOption(delta, theta, low_beta, high_beta, low_alpha, high_alpha) {
   const that = this;
   var option = {
-    color: ["#00ccff", "#0cda2e", "#f8a117", "#d1d310"],
+    color: ["#FF77B3", "#FFE838", "#0060F1", "#00CCFF", "#38FF49", "#00AD0E"],
     legend: {
-      data: ["Delta", "Theta", "Alpha", "Beta"],
+      data: ["Delta", "Theta", "Low_Beta", "High_Beta","Low_Alpha", "High_Alpha",],
       left: "center",
       bottom: 20,
       icon: "circle",
@@ -496,18 +496,32 @@ function getBaseOption(delta, theta, alpha, beta) {
         data: theta,
       },
       {
-        name: "Alpha",
+        name: "Low_Beta",
+        symbol: "none", //取消折点圆圈
+        type: "line",
+        smooth: true,
+        data: low_beta,
+      },
+      {
+        name: "High_Beta",
         symbol: "none", //取消折点圆圈
         type: "line",
         smooth: true,
-        data: alpha,
+        data: high_beta,
       },
       {
-        name: "Beta",
+        name: "Low_Alpha",
         symbol: "none", //取消折点圆圈
         type: "line",
         smooth: true,
-        data: beta,
+        data: low_alpha,
+      },
+      {
+        name: "High_Alpha",
+        symbol: "none", //取消折点圆圈
+        type: "line",
+        smooth: true,
+        data: high_alpha,
       },
     ],
     animation: false,
@@ -596,7 +610,7 @@ export function getHightPieChartOption($params, $total) {
       silent: true,
       name: "访问来源",
       type: "pie",
-      radius: ["58%","85%"],
+      radius: ["58%", "85%"],
       labelLine: {
         show: false,
       },
@@ -644,9 +658,9 @@ export function getRadarChartOption($params) {
         },
       },
       indicator: [{
-          name: "专注力平均指数",
-          max: 100
-        },
+        name: "专注力平均指数",
+        max: 100
+      },
         {
           name: "专注力广度指数",
           max: 100