fix: 为所有交互元素添加.stop阻止事件冒泡

修复弹窗内点击子元素时触发外层弹窗关闭的问题，给所有绑定了点击事件的DOM元素添加@click.stop，同时新增clickContent方法处理弹窗内点击逻辑

src/views/Student/components/choiceQuestionDetailDialog.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="choiceQuestionDetailDialog">
-    <div class="content" :style="{
+    <div class="content" @click="clickContent(true)" :style="{
       width: slideWidth + 'px',
       height: slideHeight + 'px',
     }">
-      <span v-show="false" class="closeIcon" @click="closeSlideIndex()">
+      <span v-show="false" class="closeIcon" @click.stop="closeSlideIndex()">
         <img src="../../../assets/img/close.png" />
       </span>
 
@@ -20,7 +20,7 @@
                 v-if="props.showData.unsubmittedStudents.length > 0">/{{ props.showData.workArray.length +
                   props.showData.unsubmittedStudents.length
                 }}</span></div>
-            <span v-if="props.showData.unsubmittedStudents.length > 0" @click="viewUnsubmittedStudents()">{{
+            <span v-if="props.showData.unsubmittedStudents.length > 0" @click.stop="viewUnsubmittedStudents()">{{
               lang.ssViewSubmitStatus2 }}</span>
           </div>
           <!--<span class="c_t45_t_btn" :class="{'c_t45_t_btn_noActive': props.showData.workIndex <= 0}" @click="changeWorkIndex(0)">{{ lang.ssPrevQ }}</span>-->
@@ -31,7 +31,7 @@
           " v-if="props.showData.choiceQuestionListData[props.showData.workIndex] &&
             props.showData.choiceQuestionListData[props.showData.workIndex]
               .timuList.length > 0
-          " @click="previewImageToolRef.previewImage(props.showData.choiceQuestionListData[props.showData.workIndex]
+          " @click.stop="previewImageToolRef.previewImage(props.showData.choiceQuestionListData[props.showData.workIndex]
             .timuList[0].src)" />
         <!-- <span class="c_t45_type" v-if="
           props.showData.choiceQuestionListData[props.showData.workIndex]
@@ -60,7 +60,7 @@
               </svg>{{ lang.ssAnalysis }}
             </div>
             <div class="ai_refresh" :class="{ 'disabled': currentAnalysis && currentAnalysis.loading }"
-              @click="aiAnalysisRefresh45()">
+              @click.stop="aiAnalysisRefresh45()">
               {{ lang.ssAIGenerate }}
               <svg viewBox="0 0 1024 1024" width="200" height="200">
                 <path
@@ -82,7 +82,7 @@
           </div>
         </div>
         <div class="cq_changeBtn" v-if="props.showData.choiceQuestionListData.length > 1">
-          <div :class="{ cq_cb_disabled: props.showData.workIndex <= 0 }" @click="changeWorkIndex(0)">
+          <div :class="{ cq_cb_disabled: props.showData.workIndex <= 0 }" @click.stop="changeWorkIndex(0)">
             <svg style="transform: rotate(-90deg);" viewBox="0 0 1024 1024" version="1.1" width="200" height="200">
               <path
                 d="M512 330.666667c14.933333 0 29.866667 4.266667 40.533333 14.933333l277.33333399 234.666667c27.733333 23.466667 29.866667 64 8.53333301 89.6-23.466667 27.733333-64 29.866667-89.6 8.53333299L512 477.866667l-236.8 200.53333299c-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333299-23.466667-27.733333-19.19999999-68.266667 8.53333301-89.6l277.33333399-234.666667c10.666667-10.666667 25.6-14.933333 40.533333-14.933333z"
@@ -91,7 +91,7 @@
           </div>
           <span>{{ props.showData.workIndex + 1 }}/{{ props.showData.choiceQuestionListData.length }}</span>
           <div :class="{ cq_cb_disabled: props.showData.workIndex >= props.showData.choiceQuestionListData.length - 1 }"
-            @click="changeWorkIndex(1)">
+            @click.stop="changeWorkIndex(1)">
             <svg style="transform: rotate(90deg);" viewBox="0 0 1024 1024" version="1.1" width="200" height="200">
               <path
                 d="M512 330.666667c14.933333 0 29.866667 4.266667 40.533333 14.933333l277.33333399 234.666667c27.733333 23.466667 29.866667 64 8.53333301 89.6-23.466667 27.733333-64 29.866667-89.6 8.53333299L512 477.866667l-236.8 200.53333299c-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333299-23.466667-27.733333-19.19999999-68.266667 8.53333301-89.6l277.33333399-234.666667c10.666667-10.666667 25.6-14.933333 40.533333-14.933333z"
@@ -113,7 +113,7 @@
                 v-if="props.showData.unsubmittedStudents.length > 0">/{{ props.showData.workArray.length +
                   props.showData.unsubmittedStudents.length
                 }}</span></div>
-            <span v-if="props.showData.unsubmittedStudents.length > 0" @click="viewUnsubmittedStudents()">{{
+            <span v-if="props.showData.unsubmittedStudents.length > 0" @click.stop="viewUnsubmittedStudents()">{{
               lang.ssViewSubmitStatus2 }}</span>
           </div>
           <!--<span class="c_t45_t_btn" :class="{'c_t45_t_btn_noActive': props.showData.workIndex <= 0}" @click="changeWorkIndex(0)">{{ lang.ssPrevQ }}</span>-->
@@ -124,7 +124,7 @@
           " v-if="props.showData.choiceQuestionListData[props.showData.workIndex] &&
             props.showData.choiceQuestionListData[props.showData.workIndex]
               .timuList.length > 0
-          " @click="previewImageToolRef.previewImage(props.showData.choiceQuestionListData[props.showData.workIndex]
+          " @click.stop="previewImageToolRef.previewImage(props.showData.choiceQuestionListData[props.showData.workIndex]
             .timuList[0].src)" />
         <!-- <span class="c_t45_type" v-if="
           props.showData.choiceQuestionListData[props.showData.workIndex]
@@ -153,7 +153,7 @@
               </svg>{{ lang.ssAnalysis }}
             </div>
             <div class="ai_refresh" :class="{ 'disabled': currentAnalysis && currentAnalysis.loading }"
-              @click="aiAnalysisRefresh78()">
+              @click.stop="aiAnalysisRefresh78()">
               {{ lang.ssAIGenerate }}
               <svg viewBox="0 0 1024 1024" width="200" height="200">
                 <path
@@ -175,7 +175,7 @@
           </div>
         </div>
         <div class="cq_changeBtn" v-if="props.showData.choiceQuestionListData.length > 1">
-          <div :class="{ cq_cb_disabled: props.showData.workIndex <= 0 }" @click="changeWorkIndex(0)">
+          <div :class="{ cq_cb_disabled: props.showData.workIndex <= 0 }" @click.stop="changeWorkIndex(0)">
             <svg style="transform: rotate(-90deg);" viewBox="0 0 1024 1024" version="1.1" width="200" height="200">
               <path
                 d="M512 330.666667c14.933333 0 29.866667 4.266667 40.533333 14.933333l277.33333399 234.666667c27.733333 23.466667 29.866667 64 8.53333301 89.6-23.466667 27.733333-64 29.866667-89.6 8.53333299L512 477.866667l-236.8 200.53333299c-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333299-23.466667-27.733333-19.19999999-68.266667 8.53333301-89.6l277.33333399-234.666667c10.666667-10.666667 25.6-14.933333 40.533333-14.933333z"
@@ -184,7 +184,7 @@
           </div>
           <span>{{ props.showData.workIndex + 1 }}/{{ props.showData.choiceQuestionListData.length }}</span>
           <div :class="{ cq_cb_disabled: props.showData.workIndex >= props.showData.choiceQuestionListData.length - 1 }"
-            @click="changeWorkIndex(1)">
+            @click.stop="changeWorkIndex(1)">
             <svg style="transform: rotate(90deg);" viewBox="0 0 1024 1024" version="1.1" width="200" height="200">
               <path
                 d="M512 330.666667c14.933333 0 29.866667 4.266667 40.533333 14.933333l277.33333399 234.666667c27.733333 23.466667 29.866667 64 8.53333301 89.6-23.466667 27.733333-64 29.866667-89.6 8.53333299L512 477.866667l-236.8 200.53333299c-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333299-23.466667-27.733333-19.19999999-68.266667 8.53333301-89.6l277.33333399-234.666667c10.666667-10.666667 25.6-14.933333 40.533333-14.933333z"
@@ -199,7 +199,7 @@
         <div class="c_t15_title">{{ workDetail.json.answerQ }}</div>
         <span class="c_t15_type">{{ lang.ssQATest }}</span>
         <div class="c_t15_content" v-show="!lookWorkData">
-          <div class="c_t15_c_item" v-for="item in processedWorkArray" :key="item.id" @click="lookWork(item.id)">
+          <div class="c_t15_c_item" v-for="item in processedWorkArray" :key="item.id" @click.stop="lookWork(item.id)">
             <div class="c_t15_c_i_top">
               <span>S</span>
               <div>{{ item.name }}</div>
@@ -211,7 +211,7 @@
         </div>
 
         <div class="aiAnalysis" style="margin-top:1rem ;"
-          v-if="processedWorkArray.length > 0 && lookWorkData === null && workDetail.type === '15'">
+          v-if="processedWorkArray.length > 0 && lookWorkData === null && workDetail.type === '15'" @click.stop="clickContent(false)">
           <div class="ai_header">
             <div class="ai_title">
               <svg viewBox="0 0 1024 1024" width="200" height="200">
@@ -224,7 +224,7 @@
               </svg>{{ lang.ssAnalysis }}
             </div>
             <div class="ai_refresh" :class="{ 'disabled': currentAnalysis && currentAnalysis.loading }"
-              @click="aiAnalysisRefresh15()">
+              @click.stop="aiAnalysisRefresh15()">
               {{ lang.ssAIGenerate }}
               <svg viewBox="0 0 1024 1024" width="200" height="200">
                 <path
@@ -240,7 +240,7 @@
           <div class="ai_echartsData" v-if="currentAnalysis && currentAnalysis.json.keyword">
             <div class="title">{{ lang.ssKeyword }}：</div>
             <span v-for="(item, index) in currentAnalysis.json.keyword" :key="index">{{ item }}</span>
-            <div class="btn" @click="openEchatsDialog()">{{ lang.ssViewKeywordCloud }}</div>
+            <div class="btn" @click.stop="openEchatsDialog()">{{ lang.ssViewKeywordCloud }}</div>
           </div>
           <div class="generatingContent" v-if="currentAnalysis && currentAnalysis.generatingContent">{{
             lang.ssGeneratingContent }}...</div>
@@ -249,9 +249,9 @@
         </div>
 
 
-        <div class="c_t15_workDetail" v-if="lookWorkData">
+        <div class="c_t15_workDetail" v-if="lookWorkData" @click.stop="clickContent(false)">
           <div class="c_t15_wd_top">
-            <img src="../../../assets/img/arrow_left.png" @click="lookWork('')" />
+            <img src="../../../assets/img/arrow_left.png" @click.stop="lookWork('')" />
             <span>S</span>
             <div>{{ lookWorkData.name }}</div>
           </div>
@@ -259,7 +259,7 @@
             <span v-html="lookWorkData.content.answer"></span>
             <div class="c_t15_wd_c_imageList" v-if="lookWorkData.content.fileList.length > 0">
               <img v-for="item in lookWorkData.content.fileList" :src="item.url" :key="item.uploadTime"
-                @click="lookImage(item.url)" />
+                @click.stop="lookImage(item.url)" />
             </div>
           </div>
         </div>
@@ -270,7 +270,7 @@
         <div class="c_t15_title">{{ workDetail.json.answerQ }}</div>
         <span class="c_t15_type">{{ lang.ssPhoto }}</span>
         <div class="c_t15_content" v-show="!lookWorkData">
-          <div class="c_t15_c_item" v-for="item in processedWorkArray" :key="item.id" @click="item.content && item.content.fileList.length > 0 ? lookWork(item.id) : ''">
+          <div class="c_t15_c_item" v-for="item in processedWorkArray" :key="item.id" @click.stop="item.content && item.content.fileList.length > 0 ? lookWork(item.id) : ''">
             <div class="c_t15_c_i_top">
               <span>S</span>
               <div>{{ item.name }}</div>
@@ -284,21 +284,21 @@
           </div>
         </div>
 
-        <div class="c_t79_workDetail" v-if="lookWorkData">
+        <div class="c_t79_workDetail" v-if="lookWorkData" @click.stop="clickContent(false)">
           <div class="c_t79_wd_top">
-            <img src="../../../assets/img/arrow_left.png" @click="lookWork('')" />
+            <img src="../../../assets/img/arrow_left.png" @click.stop="lookWork('')" />
             <span>S</span>
             <div>{{ lookWorkData.name }}</div>
           </div>
           <div class="c_t79_wd_content">
-            <img :src="lookWorkData.content.fileList[lookWorkIndex].url" @click="lookImage(lookWorkData.content.fileList[lookWorkIndex].url)" />
+            <img :src="lookWorkData.content.fileList[lookWorkIndex].url" @click.stop="lookImage(lookWorkData.content.fileList[lookWorkIndex].url)" />
           </div>
           <!-- <div class="nextAndUpBtn" v-if="lookWorkData.content.fileList.length>1">
             <span :class="{no_active:lookWorkIndex==0}" @click="changelookWorkIndex(0)">{{ lang.ssPrevP }}</span>
             <span :class="{no_active:lookWorkData.content.fileList.length-1<=lookWorkIndex}"  @click="changelookWorkIndex(1)">{{ lang.ssNextP }}</span>
           </div> -->
           <div class="cq_changeBtn" v-if="lookWorkData.content.fileList.length > 1">
-            <div :class="{ cq_cb_disabled: lookWorkIndex <= 0 }" @click="changelookWorkIndex(0)">
+            <div :class="{ cq_cb_disabled: lookWorkIndex <= 0 }" @click.stop="changelookWorkIndex(0)">
               <svg style="transform: rotate(-90deg);" viewBox="0 0 1024 1024" version="1.1" width="200" height="200">
                 <path
                   d="M512 330.666667c14.933333 0 29.866667 4.266667 40.533333 14.933333l277.33333399 234.666667c27.733333 23.466667 29.866667 64 8.53333301 89.6-23.466667 27.733333-64 29.866667-89.6 8.53333299L512 477.866667l-236.8 200.53333299c-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333299-23.466667-27.733333-19.19999999-68.266667 8.53333301-89.6l277.33333399-234.666667c10.666667-10.666667 25.6-14.933333 40.533333-14.933333z"
@@ -307,7 +307,7 @@
             </div>
             <span>{{ lookWorkIndex + 1 }}/{{ lookWorkData.content.fileList.length }}</span>
             <div :class="{ cq_cb_disabled: lookWorkIndex >= lookWorkData.content.fileList.length - 1 }"
-              @click="changelookWorkIndex(1)">
+              @click.stop="changelookWorkIndex(1)">
               <svg style="transform: rotate(90deg);" viewBox="0 0 1024 1024" version="1.1" width="200" height="200">
                 <path
                   d="M512 330.666667c14.933333 0 29.866667 4.266667 40.533333 14.933333l277.33333399 234.666667c27.733333 23.466667 29.866667 64 8.53333301 89.6-23.466667 27.733333-64 29.866667-89.6 8.53333299L512 477.866667l-236.8 200.53333299c-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333299-23.466667-27.733333-19.19999999-68.266667 8.53333301-89.6l277.33333399-234.666667c10.666667-10.666667 25.6-14.933333 40.533333-14.933333z"
@@ -323,7 +323,7 @@
         <div class="c_t72_title">{{ lang.ssAiApp }}</div>
         <span class="c_t72_type">{{ lang.ssAiApp }}</span>
         <div class="c_t72_content" v-show="!lookWorkData">
-          <div class="c_t72_c_item" v-for="item in processedWorkArray" :key="item.id" @click="lookWork(item.id)">
+          <div class="c_t72_c_item" v-for="item in processedWorkArray" :key="item.id" @click.stop="lookWork(item.id)">
             <div class="c_t72_c_i_top">
               <span>S</span>
               <div>{{ item.name }}</div>
@@ -332,7 +332,7 @@
         </div>
 
         <div class="aiAnalysis" style="margin-top:1rem ;"
-          v-if="processedWorkArray.length > 0 && lookWorkData === null && props.showData.toolType === 72">
+          v-if="processedWorkArray.length > 0 && lookWorkData === null && props.showData.toolType === 72" @click.stop="clickContent(false)">
           <div class="ai_header">
             <div class="ai_title">
               <svg viewBox="0 0 1024 1024" width="200" height="200">
@@ -345,7 +345,7 @@
               </svg>{{ lang.ssAnalysis }}
             </div>
             <div class="ai_refresh" :class="{ 'disabled': currentAnalysis && currentAnalysis.loading }"
-              @click="aiAnalysisRefresh72()">
+              @click.stop="aiAnalysisRefresh72()">
               {{ lang.ssAIGenerate }}
               <svg viewBox="0 0 1024 1024" width="200" height="200">
                 <path
@@ -362,9 +362,9 @@
           </div>
         </div>
 
-        <div class="c_t72_workDetail" v-if="lookWorkData">
+        <div class="c_t72_workDetail" v-if="lookWorkData" @click.stop="clickContent(false)">
           <div class="c_t72_wd_top">
-            <img src="../../../assets/img/arrow_left.png" @click="lookWork('')" />
+            <img src="../../../assets/img/arrow_left.png" @click.stop="lookWork('')" />
             <span>S</span>
             <div>{{ lookWorkData.name }}</div>
           </div>
@@ -397,7 +397,7 @@
                           {{ item.type }}
                         </div>
                         <div class="na_m_i_content">
-                          <img @click="lookImage(item3)" style="height: 100px;width: auto;cursor: pointer;" :src="item3" />
+                          <img @click.stop="lookImage(item3)" style="height: 100px;width: auto;cursor: pointer;" :src="item3" />
                         </div>
                       </div>
                     </template>
@@ -414,7 +414,7 @@
         <div class="c_t73_title">{{ lang.ssPageImage }}</div>
         <span class="c_t73_type">{{ lang.ssHPage }}</span>
         <div class="c_t73_content" v-show="!lookWorkData">
-          <div class="c_t73_c_item" v-for="item in processedWorkArray" :key="item.id" @click="lookWork(item.id)">
+          <div class="c_t73_c_item" v-for="item in processedWorkArray" :key="item.id" @click.stop="lookWork(item.id)">
             <div class="c_t73_c_i_top">
               <span>S</span>
               <div>{{ item.name }}</div>
@@ -425,9 +425,9 @@
           </div>
         </div>
 
-        <div class="c_t73_workDetail" v-if="lookWorkData">
+        <div class="c_t73_workDetail" v-if="lookWorkData" @click.stop="clickContent(false)">
           <div class="c_t73_wd_top">
-            <img src="../../../assets/img/arrow_left.png" @click="lookWork('')" />
+            <img src="../../../assets/img/arrow_left.png" @click.stop="lookWork('')" />
             <span>S</span>
             <div>{{ lookWorkData.name }}</div>
           </div>
@@ -1488,6 +1488,13 @@ const saveAnalysis = () => {
 }
 
 
+// 点击边框
+const clickContent = (flag: boolean) =>{
+  if(flag && lookWorkDetail.value && workDetail.value?.type !== '45' && workDetail.value?.type !== '78'){
+    lookWork('')
+  }
+}
+
 // 监听 props.showData.workDetail.id 变化
 watch(
   () => props.showData?.workDetail,
@@ -1501,9 +1508,6 @@ watch(
 
 
 
-// onMounted(()=>{
-//   getAnalysis()
-// })
 
 // 组件卸载时清理ECharts实例
 onUnmounted(() => {