|
|
@@ -420,7 +420,7 @@ export default {
|
|
|
this.$nextTick(() => {
|
|
|
this.getCourseList().then(_ => {
|
|
|
this.getFileIdId();
|
|
|
- this.$refs.messageAreaRef.getData().then(res => {
|
|
|
+ this.$refs.messageAreaRef.getData(tagList?tagList.dialogTagList:[]).then(res => {
|
|
|
if (tagList) {
|
|
|
this.$refs.messageAreaRef.changeAnalysisName(
|
|
|
tagList.dialogTagList,
|
|
|
@@ -732,10 +732,12 @@ export default {
|
|
|
let canvas = document.createElement("canvas");
|
|
|
let ctx = canvas.getContext("2d");
|
|
|
canvas.width = 600 * window.devicePixelRatio;
|
|
|
- canvas.height = 150 * window.devicePixelRatio;
|
|
|
+ canvas.height = 200 * window.devicePixelRatio;
|
|
|
// 缩放绘图上下文
|
|
|
ctx.scale(1, 1);
|
|
|
+
|
|
|
let canvasWidth = canvas.width;
|
|
|
+ let canvasWidth2 = canvasWidth - 20;
|
|
|
let canvasHeight = canvas.height;
|
|
|
ctx.imageSmoothingEnabled = false;
|
|
|
ctx.lineWidth = 1;
|
|
|
@@ -746,7 +748,7 @@ export default {
|
|
|
const fontSize = 14; //字体大小
|
|
|
|
|
|
ctx.fillStyle = teacherColor;
|
|
|
- this.drawRoundedRect(ctx, 0, canvasHeight - 20, 20, 15, 5);
|
|
|
+ this.drawRoundedRect(ctx, 0, canvasHeight - 20, 20, 15, 4);
|
|
|
// ctx.fillRect(0, canvasHeight - 20, 25, 20);
|
|
|
ctx.fillStyle = "black";
|
|
|
ctx.font = `${fontSize}px serif`;
|
|
|
@@ -754,21 +756,20 @@ export default {
|
|
|
|
|
|
ctx.fillStyle = studentColor;
|
|
|
// ctx.fillRect(100, canvasHeight - 20, 25, 20);
|
|
|
- this.drawRoundedRect(ctx, 100, canvasHeight - 20, 20, 15, 5);
|
|
|
+ this.drawRoundedRect(ctx, 100, canvasHeight - 20, 20, 15, 4);
|
|
|
ctx.fillStyle = "black";
|
|
|
ctx.font = `${fontSize}px serif`;
|
|
|
ctx.fillText("学生", 128, canvasHeight - 7);
|
|
|
let sum = data.data.reduce((pre, cur) => (pre += cur.value), 0);
|
|
|
-
|
|
|
// 当前x位置的起始点
|
|
|
- let currentX = 0;
|
|
|
+ let currentX = 10;
|
|
|
// 计算并绘制每个区域
|
|
|
data.data.forEach(i => {
|
|
|
const segmentWidth = parseFloat(
|
|
|
- (i.value / (sum / canvasWidth)).toFixed(2)
|
|
|
+ (i.value / (sum / canvasWidth2)).toFixed(2)
|
|
|
);
|
|
|
ctx.fillStyle = i.type == 0 ? teacherColor : studentColor;
|
|
|
- ctx.fillRect(currentX, 20, segmentWidth, canvasHeight - 60);
|
|
|
+ ctx.fillRect(currentX, 20, segmentWidth, canvasHeight - 100);
|
|
|
|
|
|
// 更新x位置
|
|
|
currentX += segmentWidth;
|
|
|
@@ -780,19 +781,45 @@ export default {
|
|
|
|
|
|
data.breakpoint.forEach(i => {
|
|
|
const breakpointPo = parseFloat(
|
|
|
- (i / (sum / canvasWidth)).toFixed(2)
|
|
|
+ (i / (sum / canvasWidth2)).toFixed(2)
|
|
|
);
|
|
|
ctx.beginPath();
|
|
|
- ctx.moveTo(breakpointPo, 0);
|
|
|
- ctx.lineTo(breakpointPo, canvasHeight - 20);
|
|
|
+ ctx.moveTo(breakpointPo, 10);
|
|
|
+ ctx.lineTo(breakpointPo, canvasHeight - 70);
|
|
|
ctx.stroke();
|
|
|
});
|
|
|
|
|
|
+ let interval = parseFloat((300 / (sum / canvasWidth2)).toFixed(2));
|
|
|
+ //绘制竖线
|
|
|
+ for (let i = 0; i < canvasWidth2; i += interval) {
|
|
|
+ ctx.beginPath();
|
|
|
+ ctx.strokeStyle = "#BFBFBF";
|
|
|
+ ctx.moveTo(i == 0 ? 10 : i, canvasHeight - 70);
|
|
|
+ ctx.lineTo(i == 0 ? 10 : i, canvasHeight - 55);
|
|
|
+ ctx.stroke();
|
|
|
+ ctx.fillStyle = "#868686";
|
|
|
+ let timeLabel = (((i / canvasWidth2) * sum) / 60).toFixed(0); // 时间标识计算
|
|
|
+ ctx.font = `${fontSize}px serif`;
|
|
|
+ if (i == 0) {
|
|
|
+ ctx.fillText(`${timeLabel}min`, i + 10, canvasHeight - 40);
|
|
|
+ } else if (i + interval > canvasWidth2) {
|
|
|
+ ctx.fillText(`${timeLabel}min`, i - 20, canvasHeight - 40);
|
|
|
+ } else {
|
|
|
+ ctx.fillText(`${timeLabel}min`, i - 15, canvasHeight - 40);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ ctx.beginPath();
|
|
|
+ ctx.strokeStyle = "#BFBFBF";
|
|
|
+ ctx.moveTo(10, canvasHeight - 55);
|
|
|
+ ctx.lineTo(canvasWidth2 + 10, canvasHeight - 55);
|
|
|
+ ctx.stroke();
|
|
|
+
|
|
|
// 将 canvas 转换为 base64 格式的图片地址
|
|
|
const base64Image = canvas.toDataURL("image/png");
|
|
|
resolve(base64Image);
|
|
|
} catch (e) {
|
|
|
- console.log(e)
|
|
|
+ console.log(e);
|
|
|
resolve("#");
|
|
|
}
|
|
|
});
|
|
|
@@ -1147,6 +1174,28 @@ export default {
|
|
|
//保存词频词汇分析
|
|
|
saveWordFrequency({ _sentence = 0, _words = 0 }) {
|
|
|
this.$refs.messageAreaRef.saveWordFrequency({ _sentence, _words });
|
|
|
+ },
|
|
|
+ formatTime(seconds) {
|
|
|
+ let h = Math.floor(seconds / 3600); // 小时
|
|
|
+ let m = Math.floor((seconds % 3600) / 60); // 分钟
|
|
|
+ let s = Math.floor(seconds % 60); // 秒数
|
|
|
+
|
|
|
+ // 格式化为两位数
|
|
|
+ let formattedTime;
|
|
|
+ if (h > 0) {
|
|
|
+ // 如果有小时部分，格式化为 hh:mm:ss
|
|
|
+ formattedTime = `${h
|
|
|
+ .toString()
|
|
|
+ .padStart(2, "0")}:${m
|
|
|
+ .toString()
|
|
|
+ .padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
|
|
|
+ } else {
|
|
|
+ // 否则，格式化为 mm:ss
|
|
|
+ formattedTime = `${m
|
|
|
+ .toString()
|
|
|
+ .padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
|
|
|
+ }
|
|
|
+ return formattedTime;
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
SanHQin
