1、视频中问题弹框选中样式和结果判断

src/components/videopage/DialogComponents.vue

@@ -221,10 +221,15 @@ const handleCloseQuestionDialog = () => {
 // 提交答案
 const handleSubmitAnswer = () => {
   if (props.currentQuestion.ccQuestOption && props.currentQuestion.ccQuestOption.length > 0 && !selectedOption.value) {
-    ElMessage.warning('请选择一个选项')
+    ElMessage.warning('请选择一个选项!')
     return
   }
-  emits('submitAnswer', { selectedOption: selectedOption.value })
+  if (selectedOption.value === props.currentQuestion.ccAnswer) {
+    ElMessage.success('恭喜回答正确!')
+  }else{
+    ElMessage.warning('回答错误!')
+  }
+  emits('submitAnswer', selectedOption.value === props.currentQuestion.ccAnswer)
   selectedOption.value = null
 }
 
@@ -772,26 +777,59 @@ $text-color: #483d8b; // 文本颜色：靛蓝色
   align-items: center;
   background-color: white;
   box-shadow: 0 rpx(2) rpx(5) rgba($primary-color, 0.05);
+  cursor: pointer; // 鼠标指针变为手型
+  
+  // 确保整个区域可点击
+  &:active {
+    transform: translateY(0);
+  }
+
+  ::v-deep(.el-radio) {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+  }
 
   ::v-deep(.el-radio__label) {
     color: $text-color;
     margin-left: rpx(8);
     flex: 1;
     text-align: left;
-    // 增大字体大小
     font-size: rpx(12);
   }
 
-  // 选中时的样式变化
-  .el-radio__input.is-checked + .el-radio__label {
-    font-weight: bold;
-    color: $accent-color;
+  // 增强选中时的样式变化
+  ::v-deep(.el-radio__input.is-checked) {
+    + .el-radio__label {
+      font-weight: bold;
+      color: $accent-color;
+    }
+    
+    // 修改选中的radio样式
+    .el-radio__inner {
+      border-color: $accent-color;
+      background-color: $accent-color;
+    }
+    
+    .el-radio__inner::after {
+      background-color: white;
+    }
   }
 
+  // 增强悬浮效果
   &:hover {
-    background-color: rgba($primary-color, 0.05);
-    border-color: rgba($primary-color, 0.5);
+    background-color: rgba($primary-color, 0.15);
+    border-color: rgba($primary-color, 0.7);
     transform: translateY(-rpx(1));
+    box-shadow: 0 rpx(4) rpx(10) rgba($primary-color, 0.15);
+  }
+  
+  // 增强选中时的整体样式
+  &:has(.el-radio__input.is-checked) {
+    background-color: rgba($primary-color, 0.1);
+    border-color: $accent-color;
+    box-shadow: 0 rpx(3) rpx(8) rgba($accent-color, 0.2);
   }
 }
 

src/views/programming/Interface.vue

@@ -316,7 +316,8 @@ const closeQuestionDialog = () => {
 }
 
 // 提交答案
-const handleSubmitAnswer = ({ selectedOption }) => {
+const handleSubmitAnswer = ({ result }) => {
+  console.log("提交答案:",result)
   questionDialogVisible.value = false
 }
 
@@ -450,7 +451,6 @@ const handleSaveProgress = async (type, progress) => {
     saveProgressData.brpCourseId = course.value.id;
   }
   try {
-    debugger
     await saveRecordBlockly(saveProgressData)
   } catch (error) {
     console.error(`保存${type}进度失败:`, error)