ppt

src/views/Student/components/answerTheResult.vue

@@ -20,7 +20,6 @@
 				<div>正确答案</div>
 				<span style="color: #03ae2b">{{ choiceQuestionAnswer }}</span>
 			</div>
-
 			<span class="atr_d_line" v-if="props.unsubmittedStudents && props.unsubmittedStudents?.length > 0"></span>
 
 			<div class="no_submit" v-if="props.unsubmittedStudents && props.unsubmittedStudents?.length > 0">
@@ -44,6 +43,31 @@
 					{{ student.name ?? "" }}
 				</div>
 			</div>
+
+      <span class="atr_d_line" v-if="props.workArray && props.workArray?.length > 0"></span>
+
+      <div class="is_submit" v-if="props.workArray && props.workArray?.length > 0">
+				<div>已提交人员</div>
+				<img
+					@click="showIsSubmitDetail = !showIsSubmitDetail"
+					:class="{ is_submit_active: !showIsSubmitDetail }"
+					src="../../../assets/img/arrow_up.png"
+				/>
+			</div>
+
+			<div
+				class="is_submitList"
+				v-if="props.workArray && props.workArray?.length > 0"
+				:class="{ is_submitList_active: showIsSubmitDetail }"
+			>
+				<div
+					v-for="(student, idx) in props.workArray"
+					:key="student.id ?? idx"
+          @click="emit('openWorkModal', student)"
+				>
+					{{ student.name ?? "" }}
+				</div>
+			</div>
 		</div>
 
 		<div
@@ -56,11 +80,11 @@
 			"
 		>
 
-		<div class="atr_t45a_title">
+		<!-- <div class="atr_t45a_title" >
 			<span>{{ workIndex+1 }}、{{ choiceQuestionListData[workIndex].type=='1'?'单选题':'多选题' }}：</span>
 			<span>{{ choiceQuestionListData[workIndex].teststitle }}</span>
       <img @click="previewImage(choiceQuestionListData[workIndex].timuList[0].src)" :src="choiceQuestionListData[workIndex].timuList[0].src" v-if="choiceQuestionListData[workIndex].timuList.length>0">
-		</div>
+		</div> -->
 
 			<template
 				v-for="(op, idx) in choiceQuestionListData[workIndex].choiceUser"
@@ -136,7 +160,8 @@ const props = withDefaults(defineProps<Props>(), {
 })
 
 const emit = defineEmits<{
-  (e: 'openChoiceQuestionDetail', v: number): void
+  (e: 'openChoiceQuestionDetail', v: number): void,
+  (e: 'openWorkModal', v:any):void
 }>()
 
 
@@ -194,6 +219,7 @@ const workIndex = ref<number>(0)
 
 // 是否显示未提交人员
 const showNoSubmitDetail = ref<boolean>(false)
+const showIsSubmitDetail = ref<boolean>(false)
 
 // 作业详细
 const workDetail = ref<any>({})
@@ -459,11 +485,52 @@ defineExpose({
 				font-size: 14px;
 				font-weight: 500;
 				border-radius: 10px;
+        white-space: nowrap;
 			}
 		}
 		.no_submitList_active {
 			flex-wrap: wrap;
 		}
+
+    .is_submit {
+			width: 100%;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			font-size: 14px;
+			font-weight: 500;
+			margin-bottom: 20px;
+			.is_submit_active {
+				transform: rotate(180deg);
+			}
+			& > img {
+				cursor: pointer;
+			}
+		}
+
+		.is_submitList {
+			width: 100%;
+			display: flex;
+			align-items: center;
+			flex-wrap: nowrap;
+			overflow: hidden;
+			gap: 10px;
+			& > div {
+				padding: 5px 10px;
+				background: #fff;
+				color: #2F80ED;
+				font-size: 14px;
+				font-weight: 500;
+				border-radius: 10px;
+        white-space: nowrap;
+        box-sizing: border-box;
+        border: solid 1px #2F80ED;
+        cursor: pointer;
+			}
+		}
+		.is_submitList_active {
+			flex-wrap: wrap;
+		}
 	}
 
 	.atr_type45Area {

src/views/Student/components/choiceQuestionDetailDialog.vue

@@ -95,7 +95,6 @@
             <div>{{ lookWorkData.name }}</div>
           </div>
           <div class="c_t15_wd_content">
-            workId
             <span>{{ lookWorkData.content.answer }}</span>
             <div
               class="c_t15_wd_c_imageList"
@@ -423,8 +422,8 @@ const setEchartsArea1 = () => {
         axisLabel: {
           color: 'rgba(0, 0, 0, 0.9)',
           fontWeight: 600,
-          fontSize: 18,
-          lineHeight: 24,
+          fontSize: 17,
+          lineHeight: 20,
           interval: 0,
           formatter: function(value: any, idx: number) {
             // 如果是字符串且格式为JSON（图片），则解析处理
@@ -437,6 +436,22 @@ const setEchartsArea1 = () => {
               }
               catch (e) {
                 // 非JSON字符串，直接返回
+                // 如果文本文字超过8个字，换行
+                if (typeof value === 'string') {
+                  let displayValue = value
+                  if (value.length > 20) {
+                    displayValue = value.substr(0, 20) + '...'
+                  }
+                  // 8个字换行
+                  let output = ''
+                  for (let i = 0; i < displayValue.length; i += 8) {
+                    output += displayValue.substr(i, 8)
+                    if (i + 8 < displayValue.length) {
+                      output += '\n'
+                    }
+                  }
+                  return output
+                }
                 return value
               }
               return value
@@ -544,6 +559,7 @@ const setEchartsArea1 = () => {
 watch(
   () => props.showData,
   (newVal, oldVal) => {
+    console.log('发生变化,showData')
     if (
       newVal &&
       newVal.choiceQuestionListData[newVal.workIndex] &&
@@ -566,7 +582,26 @@ watch(
       myChart.value = null
     }
   },
-  { immediate: true }
+  { immediate: true, deep: true }
+)
+
+// 监听作业变化
+watch(
+  () => props.showData?.choiceQuestionListData,
+  (newVal) => {
+    console.log('choiceQuestionListData变化了')
+    if (
+      (newVal || newVal === 0) &&
+      props.showData.workDetail &&
+      props.showData.workDetail.type === '45'
+    ) {
+      setEchartsArea1()
+    }
+    else {
+      myChart.value = null
+    }
+  },
+  { deep: true }
 )
 
 // 监听作业变化
@@ -574,7 +609,7 @@ watch(
   () => props.showData?.workIndex,
   (newVal) => {
     if (
-      newVal &&
+      (newVal || newVal === 0) &&
       props.showData.workDetail &&
       props.showData.workDetail.type === '45'
     ) {
@@ -754,7 +789,7 @@ onUnmounted(() => {
         width: 100%;
         height: auto;
         display: grid;
-        grid-template-columns: repeat(4, 1fr);
+        grid-template-columns: repeat(3, 1fr);
         gap: 20px;
         margin-top: 40px;
 
@@ -810,8 +845,7 @@ onUnmounted(() => {
       }
       .c_t15_workDetail {
         width: 100%;
-        flex: 1;
-        min-height: 400px;
+        height: auto;
         margin-top: 40px;
         box-shadow: 4px 4px 14px 0px rgba(252, 207, 0, 0.5);
         box-sizing: border-box;
@@ -957,8 +991,7 @@ onUnmounted(() => {
       }
       .c_t72_workDetail {
         width: 100%;
-        flex: 1;
-        min-height: 400px;
+        height: auto;
         margin-top: 40px;
         box-shadow: 4px 4px 14px 0px rgba(252, 207, 0, 0.5);
         box-sizing: border-box;
@@ -1143,8 +1176,7 @@ onUnmounted(() => {
       }
       .c_t73_workDetail {
         width: 100%;
-        flex: 1;
-        min-height: 400px;
+        height: auto;
         margin-top: 40px;
         box-shadow: 4px 4px 14px 0px rgba(252, 207, 0, 0.5);
         box-sizing: border-box;

src/views/Student/index.vue

@@ -89,7 +89,7 @@
           <ScreenSlideList :style="{ width: isFullscreen ? '100%' : slideWidth2 * canvasScale + 'px', height: isFullscreen ? '100%' : slideHeight2 * canvasScale + 'px', margin: '0 auto' }" :slideWidth="isFullscreen ? slideWidth * canvasScale : slideWidth2 * canvasScale" :slideHeight="isFullscreen ? slideHeight * canvasScale : slideHeight2 * canvasScale"
             :animationIndex="0" :turnSlideToId="() => { }" :manualExitFullscreen="() => { }"  :slideIndex="slideIndex" v-show="!choiceQuestionDetailDialogOpenList.includes(slideIndex)"/>
 
-          <choiceQuestionDetailDialog v-if="choiceQuestionDetailDialogOpenList.includes(slideIndex)" @changeWorkIndex="changeWorkIndex" v-model:visible="choiceQuestionDetailDialogOpenList" :showData="answerTheResultRef" :slideIndex="slideIndex" :workIndex="0" :style="{ width: isFullscreen ? '100%' : slideWidth2 * canvasScale + 'px', height: isFullscreen ? '100%' : slideHeight2 * canvasScale + 'px', margin: '0 auto' }" :slideWidth="isFullscreen ? slideWidth * canvasScale : slideWidth2 * canvasScale" :slideHeight="isFullscreen ? slideHeight * canvasScale : slideHeight2 * canvasScale"/>
+          <choiceQuestionDetailDialog v-if="choiceQuestionDetailDialogOpenList.includes(slideIndex)" :workArray="workArray" @changeWorkIndex="changeWorkIndex" v-model:visible="choiceQuestionDetailDialogOpenList" :showData="answerTheResultRef" :slideIndex="slideIndex" :workIndex="0" :style="{ width: isFullscreen ? '100%' : slideWidth2 * canvasScale + 'px', height: isFullscreen ? '100%' : slideHeight2 * canvasScale + 'px', margin: '0 auto' }" :slideWidth="isFullscreen ? slideWidth * canvasScale : slideWidth2 * canvasScale" :slideHeight="isFullscreen ? slideHeight * canvasScale : slideHeight2 * canvasScale"/>
 
 
           <div class="slide-bottom" v-if="!isFullscreen">
@@ -249,8 +249,8 @@
         <!-- 回答结果内容 -->
         <div v-show="!workPanelCollapsed && rightPanelMode === 'homework'" class="panel-content">
           <div v-if="workLoading" class="homework-loading">正在加载作业...</div>
-          <answerTheResult :toolType="toolType" :workId="workId" :workArray="workArray" :unsubmittedStudents="unsubmittedStudents" :slideIndex="slideIndex" v-else ref="answerTheResultRef" @openChoiceQuestionDetail="openChoiceQuestionDetail" />
-          <div class="homework-title">已提交</div>
+          <answerTheResult :toolType="toolType" :workId="workId" :workArray="workArray" :unsubmittedStudents="unsubmittedStudents" :slideIndex="slideIndex" v-else ref="answerTheResultRef" @openChoiceQuestionDetail="openChoiceQuestionDetail" @openWorkModal="openWorkModal"/>
+          <!--<div class="homework-title">已提交</div>
           <div v-if="workLoading" class="homework-loading">正在加载作业...</div>
           <div v-else>
             <div v-if="workArray && workArray.length" class="homework-grid">
@@ -261,7 +261,7 @@
             <div class="homework-empty" v-else>
               暂无作业提交
             </div>
-          </div>
+          </div>--!>
           
        
           <!--<div v-if="unsubmittedStudents && unsubmittedStudents.length > 0" class="homework-title" style="margin-top: 20px;">未提交</div>
@@ -2149,10 +2149,9 @@ const openChoiceQuestionDetail = (index:number) => {
   if (!choiceQuestionDetailDialogOpenList.value.includes(index)) {
     choiceQuestionDetailDialogOpenList.value.push(index)
   }
-
-  // else {
-  //   choiceQuestionDetailDialogOpenList.value = choiceQuestionDetailDialogOpenList.value.filter(i => i !== index)
-  // }
+  else {
+    choiceQuestionDetailDialogOpenList.value = choiceQuestionDetailDialogOpenList.value.filter(i => i !== index)
+  }
 }
 
 onMounted(() => {