|
|
@@ -4,7 +4,6 @@ import * as echarts from 'echarts';
|
|
|
import {inject} from "vue-demi";
|
|
|
import useApis from "@/apis";
|
|
|
import {type EChartsType} from "echarts";
|
|
|
-import {ElMessage} from "element-plus";
|
|
|
const props = defineProps<{
|
|
|
assignmentId:number,
|
|
|
splitNumber:number,
|
|
|
@@ -16,7 +15,7 @@ let productData = [];
|
|
|
let cursorData = [];
|
|
|
let processData = [];
|
|
|
let noData = ref(false)
|
|
|
-
|
|
|
+let versionIndex = inject('currentVersionIndex') satisfies Ref<number>
|
|
|
watch(currentEngagement,()=>{
|
|
|
noData.value = false
|
|
|
setTimeout(()=>{
|
|
|
@@ -27,8 +26,20 @@ watch(currentEngagement,()=>{
|
|
|
myChart = echarts.init(chartDom);
|
|
|
}
|
|
|
getCanvasData(myChart);
|
|
|
+
|
|
|
},0)
|
|
|
});
|
|
|
+
|
|
|
+watch(versionIndex,()=>{
|
|
|
+ let chartDom = document.getElementById('edit-canvas');
|
|
|
+ if (!chartDom)return;
|
|
|
+ let myChart = echarts.getInstanceByDom(chartDom);
|
|
|
+ if (!myChart){
|
|
|
+ myChart = echarts.init(chartDom);
|
|
|
+ }
|
|
|
+ getCanvasData(myChart);
|
|
|
+})
|
|
|
+
|
|
|
const loadingStatus = inject('loadingStatus') as Ref<{
|
|
|
edit:boolean,
|
|
|
pause:boolean,
|
|
|
@@ -40,7 +51,6 @@ function formatTimeWithMilliseconds(stamp:number ){
|
|
|
const hours = date.getHours().toString().padStart(2, '0');
|
|
|
const minutes = date.getMinutes().toString().padStart(2, '0');
|
|
|
const seconds = date.getSeconds().toString().padStart(2, '0');
|
|
|
- const milliseconds = date.getMilliseconds().toString().padStart(3, '0');
|
|
|
return `${hours}:${minutes}:${seconds}`;
|
|
|
}
|
|
|
function getCanvasData(chart:EChartsType){
|
|
|
@@ -52,14 +62,20 @@ function getCanvasData(chart:EChartsType){
|
|
|
let assignmentId = currentEngagement.value.assignmentId;
|
|
|
chart.showLoading({text:'加载中'});
|
|
|
loadingStatus.value.edit = true;
|
|
|
- apis.getBehaviorRecordAll(studentId,assignmentId)
|
|
|
+ apis.selectBehaviorRecordVersions(studentId,assignmentId)
|
|
|
.then((res:any) => {
|
|
|
- if (res && res.data && res.data.code === 200){
|
|
|
- let rowData = res.data.data.events as any[];
|
|
|
+ if (res && res.data && res.data.code === 200 && res.data.data && res.data.data.versions&& res.data.data.versions[versionIndex.value]){
|
|
|
+ let rowData = res.data.data.versions[versionIndex.value]?.events satisfies any[];
|
|
|
console.log("行为数据",rowData);
|
|
|
- cursorData.length=0;
|
|
|
- productData.length = 0;
|
|
|
- processData.length = 0;
|
|
|
+
|
|
|
+ let clock = new Date(0);
|
|
|
+ clock.setHours(clock.getHours() + 16);
|
|
|
+ clock.setFullYear(2025)
|
|
|
+ clock.setMonth(6)
|
|
|
+ clock.setDate(26);
|
|
|
+ cursorData = [[clock,0]]
|
|
|
+ productData = [[clock,0]]
|
|
|
+ processData = [[clock,0] ]
|
|
|
let processCount = 0;
|
|
|
let zeroCount =0;
|
|
|
if (!rowData){
|
|
|
@@ -93,7 +109,9 @@ function getCanvasData(chart:EChartsType){
|
|
|
}
|
|
|
let clock = new Date(startStamp);
|
|
|
clock.setHours(clock.getHours() + 16);
|
|
|
-
|
|
|
+ clock.setFullYear(2025)
|
|
|
+ clock.setMonth(6)
|
|
|
+ clock.setDate(26);
|
|
|
cursorData.push([clock,Math.min(item.retain+1,item.docLength)])
|
|
|
productData.push([clock,item.docLength])
|
|
|
let temp = 0;
|
|
|
@@ -127,7 +145,12 @@ function getCanvasData(chart:EChartsType){
|
|
|
show: true,
|
|
|
type: "line",
|
|
|
},
|
|
|
- splitNumber: props.splitNumber
|
|
|
+ splitNumber: props.splitNumber,
|
|
|
+ axisLabel:{
|
|
|
+ formatter: function(value) {
|
|
|
+ return formatTimeWithMilliseconds(value);
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value',
|
|
|
@@ -144,7 +167,9 @@ function getCanvasData(chart:EChartsType){
|
|
|
type: 'slider',
|
|
|
labelFormatter: function (value) {
|
|
|
return formatTimeWithMilliseconds(value);
|
|
|
- }
|
|
|
+ },
|
|
|
+ left:60,
|
|
|
+ right:60
|
|
|
},
|
|
|
],
|
|
|
legend:{},
|
|
|
@@ -186,194 +211,12 @@ function getCanvasData(chart:EChartsType){
|
|
|
chart.hideLoading();
|
|
|
loadingStatus.value.edit = false;
|
|
|
}
|
|
|
+ else{
|
|
|
+ noData.value = true
|
|
|
+ loadingStatus.value.edit = false
|
|
|
+ chart.hideLoading()
|
|
|
+ }
|
|
|
})
|
|
|
- //测试用数据
|
|
|
-
|
|
|
- // productData = [[new Date('2025-07-26 00:0:20'),0],
|
|
|
- // [new Date('2025-07-26 00:0:40'),15],
|
|
|
- // [new Date('2025-07-26 00:1:0'),15],
|
|
|
- // [new Date('2025-07-26 00:1:20'),17],
|
|
|
- // [new Date('2025-07-26 00:1:40'),21],
|
|
|
- // [new Date('2025-07-26 00:2:0'),39],
|
|
|
- // [new Date('2025-07-26 00:2:20'),49],
|
|
|
- // [new Date('2025-07-26 00:2:40'),61],
|
|
|
- // [new Date('2025-07-26 00:3:0'),71],
|
|
|
- // [new Date('2025-07-26 00:3:20'),89],
|
|
|
- // [new Date('2025-07-26 00:3:40'),103],
|
|
|
- // [new Date('2025-07-26 00:4:0'),109],
|
|
|
- // [new Date('2025-07-26 00:4:20'),109],
|
|
|
- // [new Date('2025-07-26 00:4:40'),128],
|
|
|
- // [new Date('2025-07-26 00:5:0'),143],
|
|
|
- // [new Date('2025-07-26 00:5:20'),143],
|
|
|
- // [new Date('2025-07-26 00:5:40'),145],
|
|
|
- // [new Date('2025-07-26 00:6:0'),160],
|
|
|
- // [new Date('2025-07-26 00:6:20'),177],
|
|
|
- // [new Date('2025-07-26 00:6:40'),177],
|
|
|
- // [new Date('2025-07-26 00:7:0'),196],
|
|
|
- // [new Date('2025-07-26 00:7:20'),199],
|
|
|
- // [new Date('2025-07-26 00:7:40'),204],
|
|
|
- // [new Date('2025-07-26 00:8:0'),209],
|
|
|
- // [new Date('2025-07-26 00:8:20'),213],
|
|
|
- // [new Date('2025-07-26 00:8:40'),229],
|
|
|
- // [new Date('2025-07-26 00:9:0'),245],
|
|
|
- // [new Date('2025-07-26 00:9:20'),250],
|
|
|
- // [new Date('2025-07-26 00:9:40'),250],
|
|
|
- // [new Date('2025-07-26 00:10:0'),265],
|
|
|
- // [new Date('2025-07-26 00:10:20'),266],
|
|
|
- // [new Date('2025-07-26 00:10:40'),282],
|
|
|
- // [new Date('2025-07-26 00:11:0'),291],
|
|
|
- // [new Date('2025-07-26 00:11:20'),308],
|
|
|
- // [new Date('2025-07-26 00:11:40'),322],
|
|
|
- // [new Date('2025-07-26 00:12:0'),335],
|
|
|
- // [new Date('2025-07-26 00:12:20'),343],
|
|
|
- // [new Date('2025-07-26 00:12:40'),350],
|
|
|
- // [new Date('2025-07-26 00:13:0'),354],
|
|
|
- // [new Date('2025-07-26 00:13:20'),367],
|
|
|
- // [new Date('2025-07-26 00:13:40'),386],
|
|
|
- // [new Date('2025-07-26 00:14:0'),392],
|
|
|
- // [new Date('2025-07-26 00:14:20'),411],
|
|
|
- // [new Date('2025-07-26 00:14:40'),414],
|
|
|
- // [new Date('2025-07-26 00:15:0'),431],
|
|
|
- // [new Date('2025-07-26 00:15:20'),437],
|
|
|
- // [new Date('2025-07-26 00:15:40'),450],
|
|
|
- // [new Date('2025-07-26 00:16:0'),453],
|
|
|
- // [new Date('2025-07-26 00:16:20'),468],
|
|
|
- // [new Date('2025-07-26 00:16:40'),469],
|
|
|
- // [new Date('2025-07-26 00:17:0'),486],
|
|
|
- // [new Date('2025-07-26 00:17:20'),486],
|
|
|
- // [new Date('2025-07-26 00:17:40'),501],
|
|
|
- // [new Date('2025-07-26 00:18:0'),508],
|
|
|
- // [new Date('2025-07-26 00:18:20'),515],
|
|
|
- // [new Date('2025-07-26 00:18:40'),523],
|
|
|
- // [new Date('2025-07-26 00:19:0'),524],
|
|
|
- // [new Date('2025-07-26 00:19:20'),529],
|
|
|
- // [new Date('2025-07-26 00:19:40'),536],
|
|
|
- // [new Date('2025-07-26 00:20:0'),554],
|
|
|
- // [new Date('2025-07-26 00:20:20'),563],
|
|
|
- // [new Date('2025-07-26 00:20:40'),570],
|
|
|
- // [new Date('2025-07-26 00:21:0'),589],
|
|
|
- // [new Date('2025-07-26 00:21:20'),600],
|
|
|
- // [new Date('2025-07-26 00:21:40'),602],
|
|
|
- // [new Date('2025-07-26 00:22:0'),602],
|
|
|
- // [new Date('2025-07-26 00:22:20'),618],
|
|
|
- // [new Date('2025-07-26 00:22:40'),620],
|
|
|
- // [new Date('2025-07-26 00:23:0'),636],
|
|
|
- // [new Date('2025-07-26 00:23:20'),650],
|
|
|
- // [new Date('2025-07-26 00:23:40'),653],
|
|
|
- // [new Date('2025-07-26 00:24:0'),668],
|
|
|
- // [new Date('2025-07-26 00:24:20'),670],
|
|
|
- // [new Date('2025-07-26 00:24:40'),680],
|
|
|
- // [new Date('2025-07-26 00:25:0'),680],
|
|
|
- // [new Date('2025-07-26 00:25:20'),695],
|
|
|
- // [new Date('2025-07-26 00:25:40'),709],
|
|
|
- // [new Date('2025-07-26 00:26:0'),714],
|
|
|
- // [new Date('2025-07-26 00:26:20'),714],
|
|
|
- // [new Date('2025-07-26 00:26:40'),729],
|
|
|
- // [new Date('2025-07-26 00:27:0'),743],
|
|
|
- // [new Date('2025-07-26 00:27:20'),747],
|
|
|
- // [new Date('2025-07-26 00:27:40'),764],
|
|
|
- // [new Date('2025-07-26 00:28:0'),783],
|
|
|
- // [new Date('2025-07-26 00:28:20'),792],
|
|
|
- // [new Date('2025-07-26 00:28:40'),806],
|
|
|
- // [new Date('2025-07-26 00:29:0'),817],
|
|
|
- // [new Date('2025-07-26 00:29:20'),823],
|
|
|
- // [new Date('2025-07-26 00:29:40'),837],
|
|
|
- // [new Date('2025-07-26 00:30:0'),854],];
|
|
|
- // cursorData = [[new Date('2025-07-26 00:0:20'),0],
|
|
|
- // [new Date('2025-07-26 00:0:40'),15],
|
|
|
- // [new Date('2025-07-26 00:1:0'),15],
|
|
|
- // [new Date('2025-07-26 00:1:20'),17],
|
|
|
- // [new Date('2025-07-26 00:1:40'),21],
|
|
|
- // [new Date('2025-07-26 00:2:0'),39],
|
|
|
- // [new Date('2025-07-26 00:2:20'),49],
|
|
|
- // [new Date('2025-07-26 00:2:40'),61],
|
|
|
- // [new Date('2025-07-26 00:3:0'),71],
|
|
|
- // [new Date('2025-07-26 00:3:20'),89],
|
|
|
- // [new Date('2025-07-26 00:3:40'),103],
|
|
|
- // [new Date('2025-07-26 00:4:0'),109],
|
|
|
- // [new Date('2025-07-26 00:4:20'),109],
|
|
|
- // [new Date('2025-07-26 00:4:40'),128],
|
|
|
- // [new Date('2025-07-26 00:5:0'),143],
|
|
|
- // [new Date('2025-07-26 00:5:20'),143],
|
|
|
- // [new Date('2025-07-26 00:5:40'),145],
|
|
|
- // [new Date('2025-07-26 00:6:0'),160],
|
|
|
- // [new Date('2025-07-26 00:6:20'),177],
|
|
|
- // [new Date('2025-07-26 00:6:40'),177],
|
|
|
- // [new Date('2025-07-26 00:7:0'),196],
|
|
|
- // [new Date('2025-07-26 00:7:20'),199],
|
|
|
- // [new Date('2025-07-26 00:7:40'),204],
|
|
|
- // [new Date('2025-07-26 00:7:41'),150],
|
|
|
- // [new Date('2025-07-26 00:7:59'),158],
|
|
|
- // [new Date('2025-07-26 00:8:0'),212],
|
|
|
- // [new Date('2025-07-26 00:8:20'),213],
|
|
|
- // [new Date('2025-07-26 00:8:40'),229],
|
|
|
- // [new Date('2025-07-26 00:9:0'),245],
|
|
|
- // [new Date('2025-07-26 00:9:20'),250],
|
|
|
- // [new Date('2025-07-26 00:9:40'),250],
|
|
|
- // [new Date('2025-07-26 00:10:0'),265],
|
|
|
- // [new Date('2025-07-26 00:10:20'),266],
|
|
|
- // [new Date('2025-07-26 00:10:40'),282],
|
|
|
- // [new Date('2025-07-26 00:11:0'),291],
|
|
|
- // [new Date('2025-07-26 00:11:20'),308],
|
|
|
- // [new Date('2025-07-26 00:11:40'),322],
|
|
|
- // [new Date('2025-07-26 00:12:0'),335],
|
|
|
- // [new Date('2025-07-26 00:12:20'),343],
|
|
|
- // [new Date('2025-07-26 00:12:40'),350],
|
|
|
- // [new Date('2025-07-26 00:13:0'),354],
|
|
|
- // [new Date('2025-07-26 00:13:20'),367],
|
|
|
- // [new Date('2025-07-26 00:13:40'),386],
|
|
|
- // [new Date('2025-07-26 00:14:0'),392],
|
|
|
- // [new Date('2025-07-26 00:14:20'),411],
|
|
|
- // [new Date('2025-07-26 00:14:40'),414],
|
|
|
- // [new Date('2025-07-26 00:15:0'),431],
|
|
|
- // [new Date('2025-07-26 00:15:20'),437],
|
|
|
- // [new Date('2025-07-26 00:15:40'),450],
|
|
|
- // [new Date('2025-07-26 00:16:0'),453],
|
|
|
- // [new Date('2025-07-26 00:16:20'),468],
|
|
|
- // [new Date('2025-07-26 00:16:40'),469],
|
|
|
- // [new Date('2025-07-26 00:17:0'),486],
|
|
|
- // [new Date('2025-07-26 00:17:20'),486],
|
|
|
- // [new Date('2025-07-26 00:17:40'),501],
|
|
|
- // [new Date('2025-07-26 00:18:0'),508],
|
|
|
- // [new Date('2025-07-26 00:18:20'),515],
|
|
|
- // [new Date('2025-07-26 00:18:40'),523],
|
|
|
- // [new Date('2025-07-26 00:19:0'),524],
|
|
|
- // [new Date('2025-07-26 00:19:20'),529],
|
|
|
- // [new Date('2025-07-26 00:19:40'),536],
|
|
|
- // [new Date('2025-07-26 00:20:0'),554],
|
|
|
- // [new Date('2025-07-26 00:20:20'),563],
|
|
|
- // [new Date('2025-07-26 00:20:40'),570],
|
|
|
- // [new Date('2025-07-26 00:21:0'),589],
|
|
|
- // [new Date('2025-07-26 00:21:20'),600],
|
|
|
- // [new Date('2025-07-26 00:21:40'),602],
|
|
|
- // [new Date('2025-07-26 00:22:0'),602],
|
|
|
- // [new Date('2025-07-26 00:22:20'),618],
|
|
|
- // [new Date('2025-07-26 00:22:40'),620],
|
|
|
- // [new Date('2025-07-26 00:23:0'),636],
|
|
|
- // [new Date('2025-07-26 00:23:20'),650],
|
|
|
- // [new Date('2025-07-26 00:23:40'),653],
|
|
|
- // [new Date('2025-07-26 00:24:0'),668],
|
|
|
- // [new Date('2025-07-26 00:24:20'),670],
|
|
|
- // [new Date('2025-07-26 00:24:40'),680],
|
|
|
- // [new Date('2025-07-26 00:25:0'),680],
|
|
|
- // [new Date('2025-07-26 00:25:20'),695],
|
|
|
- // [new Date('2025-07-26 00:25:40'),709],
|
|
|
- // [new Date('2025-07-26 00:26:0'),714],
|
|
|
- // [new Date('2025-07-26 00:26:20'),714],
|
|
|
- // [new Date('2025-07-26 00:26:21'),500],
|
|
|
- // [new Date('2025-07-26 00:26:30'),515],
|
|
|
- // [new Date('2025-07-26 00:26:39'),515],
|
|
|
- // [new Date('2025-07-26 00:26:40'),729],
|
|
|
- // [new Date('2025-07-26 00:27:0'),743],
|
|
|
- // [new Date('2025-07-26 00:27:20'),747],
|
|
|
- // [new Date('2025-07-26 00:27:40'),764],
|
|
|
- // [new Date('2025-07-26 00:28:0'),783],
|
|
|
- // [new Date('2025-07-26 00:28:20'),792],
|
|
|
- // [new Date('2025-07-26 00:28:40'),806],
|
|
|
- // [new Date('2025-07-26 00:29:0'),817],
|
|
|
- // [new Date('2025-07-26 00:29:20'),823],
|
|
|
- // [new Date('2025-07-26 00:29:40'),837],
|
|
|
- // [new Date('2025-07-26 00:30:0'),854],];
|
|
|
}
|
|
|
|
|
|
onMounted(()=>{
|