|
@@ -227,12 +227,49 @@
|
|
<mpvue-echarts
|
|
<mpvue-echarts
|
|
:echarts="echarts"
|
|
:echarts="echarts"
|
|
:onInit="interfere_charts"
|
|
:onInit="interfere_charts"
|
|
|
|
+ canvasId="demo-canvas-4"
|
|
/>
|
|
/>
|
|
</view>
|
|
</view>
|
|
<view class="interfere_footer">
|
|
<view class="interfere_footer">
|
|
<title class="interfere_footer_logo"></title>专注力干扰
|
|
<title class="interfere_footer_logo"></title>专注力干扰
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
+
|
|
|
|
+ <!-- 调整能力分析 -->
|
|
|
|
+ <view class="adjustment_warp">
|
|
|
|
+ <view class="adjustment_title">
|
|
|
|
+ <img
|
|
|
|
+ src="http://img.shuimuai.com/program_rise_log.png"
|
|
|
|
+ alt=""
|
|
|
|
+ class="adjustment_title_logo"
|
|
|
|
+ >
|
|
|
|
+ <text>调整能力分析</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="adjustment_echarts">
|
|
|
|
+ <mpvue-echarts
|
|
|
|
+ :echarts="echarts"
|
|
|
|
+ :onInit="adjustment_charts"
|
|
|
|
+ canvasId="demo-canvas-5"
|
|
|
|
+ />
|
|
|
|
+ </view>
|
|
|
|
+ <view class="adjustment_footer">
|
|
|
|
+ <view class="adjustment_footer_logo"></view>专注力上升
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <!-- 爆发值和调整时间 -->
|
|
|
|
+ <view class="absorbed_change_footer">
|
|
|
|
+ <view class="footer_text">
|
|
|
|
+ 最大爆发值:
|
|
|
|
+ <text class="footer_text_W">{{ record.burst }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="footer_text">
|
|
|
|
+ 平均调整时间:
|
|
|
|
+ <text class="footer_text_W">{{ record.burstTime}}</text>
|
|
|
|
+ s
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<van-toast id="van-toast" />
|
|
<van-toast id="van-toast" />
|
|
@@ -251,6 +288,8 @@ import util, {
|
|
getRadarChartOption,
|
|
getRadarChartOption,
|
|
timestampToTimeS,
|
|
timestampToTimeS,
|
|
getInterfereChartsOption,
|
|
getInterfereChartsOption,
|
|
|
|
+ interfereAction,
|
|
|
|
+ getAdjustmentChartsOption,
|
|
} from "../../utils/index";
|
|
} from "../../utils/index";
|
|
import { gameDetail, gameLineChart } from "../../requests/game";
|
|
import { gameDetail, gameLineChart } from "../../requests/game";
|
|
import game_store from "../../store/game";
|
|
import game_store from "../../store/game";
|
|
@@ -261,6 +300,7 @@ var att_charts,
|
|
radar_charts,
|
|
radar_charts,
|
|
$pie_charts,
|
|
$pie_charts,
|
|
$interfere_echarts,
|
|
$interfere_echarts,
|
|
|
|
+ $adjustment_echarts,
|
|
$this;
|
|
$this;
|
|
|
|
|
|
// 大脑图表初始化
|
|
// 大脑图表初始化
|
|
@@ -330,12 +370,26 @@ function interfereChart(canvas, width, height) {
|
|
});
|
|
});
|
|
canvas.setChart($interfere_echarts);
|
|
canvas.setChart($interfere_echarts);
|
|
|
|
|
|
- var option = getInterfereChartsOption(true); // ECharts 配置项
|
|
+ var option = getInterfereChartsOption(); // ECharts 配置项
|
|
|
|
|
|
$interfere_echarts.setOption(option);
|
|
$interfere_echarts.setOption(option);
|
|
|
|
|
|
return $interfere_echarts; // 返回 chart 后可以自动绑定触摸操作
|
|
return $interfere_echarts; // 返回 chart 后可以自动绑定触摸操作
|
|
}
|
|
}
|
|
|
|
+// 调整能力表初始化 interfere_echarts
|
|
|
|
+function adjustmentCharts(canvas, width, height) {
|
|
|
|
+ $adjustment_echarts = echarts.init(canvas, null, {
|
|
|
|
+ width: width,
|
|
|
|
+ height: height,
|
|
|
|
+ });
|
|
|
|
+ canvas.setChart($adjustment_echarts);
|
|
|
|
+
|
|
|
|
+ var option = getAdjustmentChartsOption(); // ECharts 配置项
|
|
|
|
+
|
|
|
|
+ $adjustment_echarts.setOption(option);
|
|
|
|
+
|
|
|
|
+ return $adjustment_echarts; // 返回 chart 后可以自动绑定触摸操作
|
|
|
|
+}
|
|
|
|
|
|
export default {
|
|
export default {
|
|
name: "index_container",
|
|
name: "index_container",
|
|
@@ -351,6 +405,7 @@ export default {
|
|
radar_charts: initRadarChart,
|
|
radar_charts: initRadarChart,
|
|
pie_charts: initPieChart,
|
|
pie_charts: initPieChart,
|
|
interfere_charts: interfereChart,
|
|
interfere_charts: interfereChart,
|
|
|
|
+ adjustment_charts: adjustmentCharts,
|
|
|
|
|
|
echarts,
|
|
echarts,
|
|
record: {},
|
|
record: {},
|
|
@@ -363,6 +418,10 @@ export default {
|
|
data_section: 0,
|
|
data_section: 0,
|
|
//数据集合
|
|
//数据集合
|
|
data_lines: [],
|
|
data_lines: [],
|
|
|
|
+ // 干扰值
|
|
|
|
+ interfereData: [],
|
|
|
|
+ // 调整能力值
|
|
|
|
+ adjustmentData: [],
|
|
};
|
|
};
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
@@ -380,10 +439,12 @@ export default {
|
|
Toast.clear();
|
|
Toast.clear();
|
|
let $res = res.data;
|
|
let $res = res.data;
|
|
$this.record = $res.data;
|
|
$this.record = $res.data;
|
|
- console.log("成绩记录参数", $this.record);
|
|
+
|
|
|
|
+ console.log("成绩记录数据", $res.data.interfereArr);
|
|
|
|
+ console.log("数据长度:", $res.data.line);
|
|
|
|
+
|
|
$this.record.play_time = formatSeconds($this.record.play_time);
|
|
$this.record.play_time = formatSeconds($this.record.play_time);
|
|
$this.record.start_time = timestampToTimeS($this.record.start_time);
|
|
$this.record.start_time = timestampToTimeS($this.record.start_time);
|
|
- console.log("训练时间", $this.record.start_time);
|
|
|
|
$this.record.height_absorbed = Math.ceil(
|
|
$this.record.height_absorbed = Math.ceil(
|
|
$this.record.height / $this.record.total * 100
|
|
$this.record.height / $this.record.total * 100
|
|
);
|
|
);
|
|
@@ -417,6 +478,19 @@ export default {
|
|
$this.record.play_time / $five_min
|
|
$this.record.play_time / $five_min
|
|
);
|
|
);
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+ // 干扰值数据传输
|
|
|
|
+ $this.interfereData = interfereAction($res.data.interfereArr);
|
|
|
|
+ let $interfere_option = getInterfereChartsOption(
|
|
|
|
+ $this.interfereData
|
|
|
|
+ );
|
|
|
|
+ $interfere_echarts.setOption($interfere_option);
|
|
|
|
+ // 调整能力数据传输
|
|
|
|
+ $this.adjustmentData = interfereAction($res.data.burstArr);
|
|
|
|
+ let $adjustment_option = getAdjustmentChartsOption(
|
|
|
|
+ $this.adjustmentData
|
|
|
|
+ );
|
|
|
|
+ $adjustment_echarts.setOption($adjustment_option);
|
|
},
|
|
},
|
|
(err) => {
|
|
(err) => {
|
|
Toast.fail("错误代码:" + res.code + ",联系客服");
|
|
Toast.fail("错误代码:" + res.code + ",联系客服");
|
|
@@ -831,7 +905,7 @@ image.boy {
|
|
}
|
|
}
|
|
/* 干扰 echarts */
|
|
/* 干扰 echarts */
|
|
.interfere_echarts {
|
|
.interfere_echarts {
|
|
- margin: 0 auto;
|
|
+ /* margin: 0 auto; */
|
|
width: 360px;
|
|
width: 360px;
|
|
height: 193px;
|
|
height: 193px;
|
|
background: #f3f3f3;
|
|
background: #f3f3f3;
|
|
@@ -850,6 +924,7 @@ image.boy {
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
align-items: center;
|
|
align-items: center;
|
|
|
|
+ margin-top: 10px;
|
|
}
|
|
}
|
|
.interfere_footer .interfere_footer_logo {
|
|
.interfere_footer .interfere_footer_logo {
|
|
display: inline-block;
|
|
display: inline-block;
|
|
@@ -858,4 +933,64 @@ image.boy {
|
|
background-color: #23cc92;
|
|
background-color: #23cc92;
|
|
margin-right: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
|
|
+/* 调整能力 */
|
|
|
|
+.adjustment_warp {
|
|
|
|
+ margin-top: 50px;
|
|
|
|
+}
|
|
|
|
+.adjustment_title {
|
|
|
|
+ display: flex;
|
|
|
|
+ color: #676767;
|
|
|
|
+ font-size: 15px;
|
|
|
|
+ padding-left: 8px;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ margin-bottom: 35px;
|
|
|
|
+}
|
|
|
|
+.adjustment_title .adjustment_title_logo {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 19px;
|
|
|
|
+ height: 19px;
|
|
|
|
+ margin-right: 7px;
|
|
|
|
+}
|
|
|
|
+.adjustment_echarts {
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ width: 360px;
|
|
|
|
+ height: 193px;
|
|
|
|
+ background: #f3f3f3;
|
|
|
|
+ opacity: 0.6;
|
|
|
|
+ box-shadow: 0px 6px 11px #dadada;
|
|
|
|
+}
|
|
|
|
+.adjustment_footer {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 26px;
|
|
|
|
+ font-size: 13px;
|
|
|
|
+ font-family: Microsoft YaHei;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ color: #676767;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ margin-top: 10px;
|
|
|
|
+}
|
|
|
|
+.adjustment_footer .adjustment_footer_logo {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 13px;
|
|
|
|
+ height: 13px;
|
|
|
|
+ background-color: #f3a100;
|
|
|
|
+ margin-right: 5px;
|
|
|
|
+}
|
|
|
|
+/* 爆发值和调整时间 */
|
|
|
|
+.absorbed_change_footer {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-around;
|
|
|
|
+ margin-top: 28px;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.absorbed_change_footer .footer_text {
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ color: #676767;
|
|
|
|
+}
|
|
|
|
+.footer_text_W {
|
|
|
|
+ font-size: 21px;
|
|
|
|
+ font-weight: 600;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|