|
|
@@ -16,6 +16,8 @@
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
+
|
|
|
+ <div :hidden="noShow">
|
|
|
<div class="bran_wrap margin-bottom">
|
|
|
<img
|
|
|
src="http://img.shuimuai.com/report_ brain_coefficient.png"
|
|
|
@@ -364,9 +366,15 @@
|
|
|
</van-tabs>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ </div>
|
|
|
|
|
|
- <van-toast id="van-toast"/>
|
|
|
+ <div v-if="noShow" class="boxVer margin-top-xl">
|
|
|
+ <img src="https://img.shuimuai.com/time_short.png" class="margin-bottom-xl" style="width: 73px;height: 83px;">
|
|
|
+ <view class="conclution margin-top-xl">数据传输异常,水母星球AI数据系统无法进行训练分析,艾米正在紧急联系星球指挥官。</view>
|
|
|
+ </div>
|
|
|
|
|
|
+ <van-toast id="van-toast"/>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -381,7 +389,7 @@ import util, {
|
|
|
getRadarChartOption,
|
|
|
timestampToTimeS,
|
|
|
} from "../../utils/index";
|
|
|
-import {gameDetail} from "../../requests/game";
|
|
|
+import { gameDetail } from "../../requests/game";
|
|
|
import game_store from "../../store/game";
|
|
|
import Toast from "../../../static/vant/toast/toast";
|
|
|
|
|
|
@@ -507,7 +515,9 @@ export default {
|
|
|
data_section: 4,
|
|
|
//数据集合
|
|
|
data_lines: [],
|
|
|
-
|
|
|
+ // 是否时间太短
|
|
|
+ show: true, // 报告
|
|
|
+ noShow:false
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -524,19 +534,36 @@ export default {
|
|
|
(res) => {
|
|
|
Toast.clear();
|
|
|
let $res = res.data;
|
|
|
+ console.log($res.data);
|
|
|
+
|
|
|
$this.record = $res.data;
|
|
|
|
|
|
// console.log("成绩记录数据", $res.data.interfereArr);
|
|
|
// console.log("数据长度：", $res.data.line);
|
|
|
|
|
|
+ if ($res.data.line.length==0) {
|
|
|
+ $this.show = false
|
|
|
+ $this.noShow = true
|
|
|
+ } else {
|
|
|
+ $this.show = true
|
|
|
+ $this.noShow = false
|
|
|
+
|
|
|
+ }
|
|
|
|
|
|
- // 平均专注力大字
|
|
|
- $this.record["att_average_big"] = parseInt($this.record["att_average"]);
|
|
|
+ // 平均专注力大字
|
|
|
+ $this.record["att_average_big"] = parseInt(
|
|
|
+ $this.record["att_average"]
|
|
|
+ );
|
|
|
// 平均专注力小字
|
|
|
- $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("."));
|
|
|
+ $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(
|
|
|
@@ -544,7 +571,7 @@ export default {
|
|
|
);
|
|
|
let $options = getHightPieChartOption(
|
|
|
$this.record.height,
|
|
|
- $this.record.total,
|
|
|
+ $this.record.total
|
|
|
);
|
|
|
hight_att_pie_charts.setOption($options);
|
|
|
|
|
|
@@ -568,51 +595,62 @@ export default {
|
|
|
$this.record.level_time4 = formatSeconds($this.record.level[4]);
|
|
|
|
|
|
// 时间总数
|
|
|
- let all_time = 0
|
|
|
- for(let i = 0;i < 5; i++){
|
|
|
- all_time += $this.record.level[i]
|
|
|
+ let all_time = 0;
|
|
|
+ for (let i = 0; i < 5; i++) {
|
|
|
+ all_time += $this.record.level[i];
|
|
|
}
|
|
|
|
|
|
// 比例
|
|
|
- $this.record.level_ratio0 = Math.round((($this.record.level[0] / all_time)*100)*100)/100;
|
|
|
- $this.record.level_ratio1 = Math.round((($this.record.level[1] / all_time)*100)*100)/100;
|
|
|
- $this.record.level_ratio2 = Math.round((($this.record.level[2] / all_time)*100)*100)/100;
|
|
|
- $this.record.level_ratio3 = Math.round((($this.record.level[3] / all_time)*100)*100)/100;
|
|
|
- $this.record.level_ratio4 = Math.round((($this.record.level[4] / all_time)*100)*100)/100;
|
|
|
-
|
|
|
+ $this.record.level_ratio0 =
|
|
|
+ Math.round($this.record.level[0] / all_time * 100 * 100) / 100;
|
|
|
+ $this.record.level_ratio1 =
|
|
|
+ Math.round($this.record.level[1] / all_time * 100 * 100) / 100;
|
|
|
+ $this.record.level_ratio2 =
|
|
|
+ Math.round($this.record.level[2] / all_time * 100 * 100) / 100;
|
|
|
+ $this.record.level_ratio3 =
|
|
|
+ Math.round($this.record.level[3] / all_time * 100 * 100) / 100;
|
|
|
+ $this.record.level_ratio4 =
|
|
|
+ Math.round($this.record.level[4] / all_time * 100 * 100) / 100;
|
|
|
+
|
|
|
let $pie_option = getPieChartsOption($pie_data);
|
|
|
$pie_charts.setOption($pie_option);
|
|
|
|
|
|
-
|
|
|
//5分钟阶段
|
|
|
let $min = 2 * 60;
|
|
|
$this.is_cut = $play_time > $min;
|
|
|
- console.log($this.is_cut)
|
|
|
+ console.log($this.is_cut);
|
|
|
if ($this.is_cut) {
|
|
|
//截断得数量
|
|
|
- $this.data_section = Math.ceil(
|
|
|
- $play_time / $min
|
|
|
- );
|
|
|
+ $this.data_section = Math.ceil($play_time / $min);
|
|
|
let $e = {
|
|
|
mp: {
|
|
|
detail: {
|
|
|
- name: 0
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- this.changeMin($e)
|
|
|
- this.changeABMin($e)
|
|
|
- this.changeDTMin($e)
|
|
|
+ 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)
|
|
|
+ $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)
|
|
|
+ $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_dt($this.record.delta, $this.record.theta);
|
|
|
}
|
|
|
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
(err) => {
|
|
|
Toast.fail("错误代码：" + res.code + "，联系客服");
|
|
|
@@ -621,12 +659,21 @@ export default {
|
|
|
}, 800);
|
|
|
},
|
|
|
get_game_line($line_data, $line_med_data, $line_amp_data) {
|
|
|
- let $option = util.getLineOption($line_data, $line_med_data, $line_amp_data);
|
|
|
+ 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 = {};
|
|
|
- $option = util.getABOption($line_alphaL, $line_alphaH, $line_betaL, $line_betaH);
|
|
|
+ $option = util.getABOption(
|
|
|
+ $line_alphaL,
|
|
|
+ $line_alphaH,
|
|
|
+ $line_betaL,
|
|
|
+ $line_betaH
|
|
|
+ );
|
|
|
alpha_beta_charts.setOption($option);
|
|
|
},
|
|
|
get_game_dt($line_delta, $line_theta) {
|
|
|
@@ -644,37 +691,37 @@ export default {
|
|
|
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 $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)
|
|
|
+ $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 $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)
|
|
|
+ $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 $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)
|
|
|
+ $this.get_game_dt(delta, theta);
|
|
|
},
|
|
|
},
|
|
|
mounted() {
|
|
|
@@ -757,7 +804,7 @@ image.boy {
|
|
|
display: flex;
|
|
|
color: #222222;
|
|
|
box-sizing: border-box;
|
|
|
- justify-content: space-between
|
|
|
+ justify-content: space-between;
|
|
|
}
|
|
|
|
|
|
.user_info .box_wrap_left {
|
|
|
@@ -824,7 +871,7 @@ image.boy {
|
|
|
overflow: hidden;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- margin-left: 3px
|
|
|
+ margin-left: 3px;
|
|
|
}
|
|
|
|
|
|
.margin-tb .margin_left .left_content {
|
|
|
@@ -836,13 +883,13 @@ image.boy {
|
|
|
color: #676767;
|
|
|
z-index: 999;
|
|
|
margin-top: -100px;
|
|
|
- margin-left: 5px
|
|
|
+ margin-left: 5px;
|
|
|
}
|
|
|
|
|
|
.margin-tb .margin_left .left_content .left_num {
|
|
|
font-size: 18px;
|
|
|
font-weight: 900;
|
|
|
- margin-bottom: -3px
|
|
|
+ margin-bottom: -3px;
|
|
|
}
|
|
|
|
|
|
.margin-tb .margin_left .left_content .left_text {
|
|
|
@@ -860,7 +907,7 @@ image.boy {
|
|
|
|
|
|
.margin-tb .textLil {
|
|
|
font-size: 6px;
|
|
|
- margin-left: 2px
|
|
|
+ margin-left: 2px;
|
|
|
}
|
|
|
|
|
|
.margin-tb .margin_right {
|
|
|
@@ -905,10 +952,9 @@ image.boy {
|
|
|
.margin-tb .detail .detail_num {
|
|
|
font-size: 15px;
|
|
|
font-weight: 800;
|
|
|
- margin-bottom: 1px
|
|
|
+ margin-bottom: 1px;
|
|
|
}
|
|
|
|
|
|
-
|
|
|
/* 小标题 */
|
|
|
.bar {
|
|
|
width: 100%;
|
|
|
@@ -934,7 +980,7 @@ image.boy {
|
|
|
color: #6c6c6c;
|
|
|
box-sizing: border-box;
|
|
|
line-height: 25px;
|
|
|
- margin-bottom: 28px
|
|
|
+ margin-bottom: 28px;
|
|
|
}
|
|
|
|
|
|
.conclution_title {
|
|
|
@@ -991,7 +1037,7 @@ image.boy {
|
|
|
height: 95px;
|
|
|
background: #f3f3f3;
|
|
|
margin-top: 10px;
|
|
|
- margin-left: -7px
|
|
|
+ margin-left: -7px;
|
|
|
/*border-radius: 10px;*/
|
|
|
/*box-shadow: 0px 6px 11px #dadada;*/
|
|
|
}
|
|
|
@@ -1003,7 +1049,7 @@ image.boy {
|
|
|
display: flex;
|
|
|
padding: 0 16px;
|
|
|
box-sizing: border-box;
|
|
|
- margin-bottom: 30px
|
|
|
+ margin-bottom: 30px;
|
|
|
}
|
|
|
|
|
|
.sheet .left,
|
|
|
@@ -1027,8 +1073,8 @@ image.boy {
|
|
|
.divide_line {
|
|
|
width: 360px;
|
|
|
height: 1px;
|
|
|
- background: #E5E5E5;
|
|
|
- margin: 0 auto
|
|
|
+ background: #e5e5e5;
|
|
|
+ margin: 0 auto;
|
|
|
}
|
|
|
|
|
|
/* 专注力干扰看板 */
|
|
|
@@ -1235,8 +1281,7 @@ image.boy {
|
|
|
font-size: 10px;
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
- width: 270px
|
|
|
-
|
|
|
+ width: 270px;
|
|
|
}
|
|
|
|
|
|
/*点图*/
|
|
|
@@ -1249,38 +1294,38 @@ image.boy {
|
|
|
}
|
|
|
|
|
|
.dot-Att {
|
|
|
- background: #FAB615;
|
|
|
+ background: #fab615;
|
|
|
}
|
|
|
|
|
|
.dot-Med {
|
|
|
- background: #40FF31;
|
|
|
+ background: #40ff31;
|
|
|
}
|
|
|
|
|
|
.dot-Amp {
|
|
|
- background: #D4327A;
|
|
|
+ background: #d4327a;
|
|
|
}
|
|
|
|
|
|
/* .dot-Alpha {
|
|
|
background: #FF9107;
|
|
|
} */
|
|
|
.dot-Theta {
|
|
|
- background: #FFE838;
|
|
|
+ background: #ffe838;
|
|
|
}
|
|
|
|
|
|
.dot-Low-Alpha {
|
|
|
- background: #38FF49;
|
|
|
+ background: #38ff49;
|
|
|
}
|
|
|
|
|
|
.dot-High-Alpha {
|
|
|
- background: #00AD0E;
|
|
|
+ background: #00ad0e;
|
|
|
}
|
|
|
|
|
|
.dot-Low-Beta {
|
|
|
- background: #0060F1;
|
|
|
+ background: #0060f1;
|
|
|
}
|
|
|
|
|
|
.dot-High-Beta {
|
|
|
- background: #00CCFF;
|
|
|
+ background: #00ccff;
|
|
|
}
|
|
|
|
|
|
/* .dot-Beta {
|
|
|
@@ -1288,7 +1333,7 @@ image.boy {
|
|
|
} */
|
|
|
|
|
|
.dot-Delta {
|
|
|
- background: #FF77B3;
|
|
|
+ background: #ff77b3;
|
|
|
}
|
|
|
|
|
|
/* 节标题 */
|
|
|
@@ -1325,6 +1370,16 @@ image.boy {
|
|
|
align-items: flex-start;
|
|
|
}
|
|
|
|
|
|
+.boxVer {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 500px;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 20px;
|
|
|
+}
|
|
|
+
|
|
|
.flexBoxLand {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -1390,5 +1445,4 @@ image.boy {
|
|
|
.left_text {
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
-
|
|
|
</style>
|
Foystor