|
|
@@ -14,7 +14,10 @@
|
|
|
<div class="left-top-box">
|
|
|
<div class="text-content">
|
|
|
<p>课程开课率</p>
|
|
|
- <p>50%</p>
|
|
|
+ <div>
|
|
|
+ <p>{{ njCourseConfigProgress }}</p>
|
|
|
+ <span>%</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 进度条 -->
|
|
|
@@ -31,7 +34,10 @@
|
|
|
<div class="middle-top-box">
|
|
|
<div class="middle-content">
|
|
|
<p>互动完成率</p>
|
|
|
- <p>68%</p>
|
|
|
+ <div>
|
|
|
+ <p>{{ njCourseProgress }}</p>
|
|
|
+ <span>%</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="middle-bottom-box">
|
|
|
@@ -47,7 +53,7 @@
|
|
|
<div class="right-top-box">
|
|
|
<div class="right-content">
|
|
|
<p>AI问答次数</p>
|
|
|
- <p>172</p>
|
|
|
+ <p>{{ aiCount }}</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 评语 -->
|
|
|
@@ -81,34 +87,32 @@ const goBack = () => {
|
|
|
};
|
|
|
|
|
|
// 课程开课率进度条数据
|
|
|
-const progressData = ref([
|
|
|
- { id: 1, desc: "01 AI初体验", percentage: 50 },
|
|
|
- { id: 2, desc: "02 AI发展历史", percentage: 65 },
|
|
|
- { id: 3, desc: "03 AI与机器人", percentage: 40 },
|
|
|
- { id: 4, desc: "04 AI的超级大脑", percentage: 75 },
|
|
|
- { id: 5, desc: "05 AI的智能应用", percentage: 60 },
|
|
|
- { id: 6, desc: "06 AI的数据表征与感知智能", percentage: 80 },
|
|
|
- { id: 7, desc: "07 AI如何学习", percentage: 45 },
|
|
|
- { id: 8, desc: "08 AI伦理安全", percentage: 0 },
|
|
|
-]);
|
|
|
-
|
|
|
+const progressData = ref([]);
|
|
|
// 互动完成率进度条数据
|
|
|
-const interactionData = ref([
|
|
|
- { id: 1, desc: "01 AI初体验", percentage: 50 },
|
|
|
- { id: 2, desc: "02 AI发展历史", percentage: 65 },
|
|
|
- { id: 3, desc: "03 AI与机器人", percentage: 40 },
|
|
|
- { id: 4, desc: "04 AI的超级大脑", percentage: 75 },
|
|
|
- { id: 5, desc: "05 AI的智能应用", percentage: 60 },
|
|
|
- { id: 6, desc: "06 AI的数据表征与感知智能", percentage: 80 },
|
|
|
- { id: 7, desc: "07 AI如何学习", percentage: 45 },
|
|
|
- { id: 8, desc: "08 AI伦理安全", percentage: 0 },
|
|
|
-]);
|
|
|
-
|
|
|
+const interactionData = ref([]);
|
|
|
+// 定义需要绑定的三个数据
|
|
|
+const aiCount = ref(0);
|
|
|
+const njCourseConfigProgress = ref(0);
|
|
|
+const njCourseProgress = ref(0);
|
|
|
// 获取进度
|
|
|
onMounted(async()=>{
|
|
|
try {
|
|
|
- const res = await getReport({ "brpNjld": "1" });
|
|
|
+ const res = await getReport({ "brpNjId": "1" });
|
|
|
console.log(res);
|
|
|
+ // 赋值三个数据
|
|
|
+ aiCount.value = res.aiCount;
|
|
|
+ njCourseConfigProgress.value = res.njCourseConfigProgress;
|
|
|
+ njCourseProgress.value = res.njCourseProgress;
|
|
|
+ // 课程开课率数据
|
|
|
+ progressData.value = res.reportCourseConfigProgressList.map(item=>({
|
|
|
+ desc: item.kcflName,
|
|
|
+ percentage: item.progress
|
|
|
+ }))
|
|
|
+ // 互动完成率数据
|
|
|
+ interactionData.value = res.reportCourseProgressList.map(item=>({
|
|
|
+ desc: item.kcflName,
|
|
|
+ percentage: item.progress
|
|
|
+ }))
|
|
|
} catch (error) {
|
|
|
console.error('获取进度失败:', error);
|
|
|
}
|
|
|
@@ -185,14 +189,31 @@ onMounted(async()=>{
|
|
|
.text-content {
|
|
|
text-align: center;
|
|
|
color: #ff4d00;
|
|
|
-}
|
|
|
+ font-weight: 600;
|
|
|
|
|
|
+}
|
|
|
.middle-content {
|
|
|
+ font-weight: 600;
|
|
|
text-align: center;
|
|
|
color: #009b03;
|
|
|
}
|
|
|
+.text-content > div, .middle-content > div {
|
|
|
+ display: flex;
|
|
|
+ align-items: baseline;
|
|
|
+}
|
|
|
+.text-content > div > p,
|
|
|
+.middle-content > div > p {
|
|
|
+ font-size: rpx(30);
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+.text-content > div > span,
|
|
|
+.middle-content > div > span {
|
|
|
+ font-size: rpx(25);
|
|
|
+}
|
|
|
|
|
|
.right-content {
|
|
|
+ font-weight: 600;
|
|
|
text-align: center;
|
|
|
color: #4316ff;
|
|
|
}
|
|
|
@@ -204,14 +225,13 @@ onMounted(async()=>{
|
|
|
padding: 0;
|
|
|
}
|
|
|
|
|
|
-.text-content p:first-child,
|
|
|
-.middle-content p:first-child,
|
|
|
+.text-content p,
|
|
|
+.middle-content p,
|
|
|
.right-content p:first-child {
|
|
|
font-size: rpx(10);
|
|
|
}
|
|
|
|
|
|
-.text-content p:nth-child(2),
|
|
|
-.middle-content p:nth-child(2),
|
|
|
+
|
|
|
.right-content p:nth-child(2) {
|
|
|
font-size: rpx(30);
|
|
|
font-weight: 600;
|