From 7f4105bc2f1d4f8562e1cb9776ce49f8be0c98d2 Mon Sep 17 00:00:00 2001
From: yj <2077506045@qq.com>
Date: 星期二, 03 十二月 2024 13:46:37 +0800
Subject: [PATCH] 更新CAQ优化，适配低分辨率设备

---
 src/views/exam/components/QuestionIntelligenceEdit.vue |   76 +++++++++++++++++++++++++++++++++++++-
 1 files changed, 74 insertions(+), 2 deletions(-)

diff --git a/src/views/exam/components/QuestionIntelligenceEdit.vue b/src/views/exam/components/QuestionIntelligenceEdit.vue
index bd1c8c7..bfd84f4 100644
--- a/src/views/exam/components/QuestionIntelligenceEdit.vue
+++ b/src/views/exam/components/QuestionIntelligenceEdit.vue
@@ -1,7 +1,8 @@
 <template>
   <div style="line-height:1.8">
     <div v-if="qType==1" v-loading="qLoading">
-      <div class="q-title" v-html="qLabel+'&nbsp;&nbsp;'+question.title" style="font-size: x-large"/>
+      <div class="q-title" v-if="question.template==='intelligence_title'" @click="showPopup(qLabel+'&nbsp;&nbsp;'+question.title)" v-html="qLabel+'&nbsp;&nbsp;'+question.title" style="font-size: x-large"/>
+      <div class="q-title" v-else v-html="qLabel+'&nbsp;&nbsp;'+question.title" style="font-size: x-large"/>
       <div class="q-content" :hidden="question.template==='intelligence_title'">
         <el-radio-group v-model="answer.content" @change="answer.completed = true">
           <el-radio class="intelligence-el_radio"  v-for="(item, index) in question.items"  :key="item.prefix"  :label="item.prefix" @change="jumpNext" :disabled="answer.readOnly" :style="{display:displayVal}">
@@ -49,6 +50,13 @@
     </div>
     <div v-else>
     </div>
+    <!-- 寮圭獥 -->
+    <div v-if="isPopupVisible" id="content-popup" class="popup" @click="closePopupOnOutsideClick">
+      <div class="popup-content">
+        <span class="close" @click="closePopup">&times;</span>
+        <div v-html="popupHtmlContent" class="popup-html"></div>
+      </div>
+    </div>
   </div>
 
 </template>
@@ -58,7 +66,8 @@
   name: 'QuestionIntelligenceShow',
   data () {
     return {
-      abcValue: { 1: 'A', 2: 'B', 3: 'C', 4: 'D', 5: 'E', 6: 'F' }
+      abcValue: { 1: 'A', 2: 'B', 3: 'C', 4: 'D', 5: 'E', 6: 'F' },
+      isPopupVisible: false
       // abcValue: { '1': 'A', '2': 'B', '3': 'C', '4': 'D', '5': 'E', '6': 'F' }
     }
   },
@@ -96,6 +105,9 @@
       default: 'block'
     }
   },
+  mounted () {
+
+  },
   methods: {
     jumpNext () {
       let _this = this
@@ -106,6 +118,30 @@
       setTimeout(function () {
         _this.$emit('callNextSubject', [_this.order])
       }, 500)
+    },
+    showPopup (content) {
+      this.popupHtmlContent = content
+      this.isPopupVisible = true
+      this.$nextTick(() => {
+        const popupElements = document.querySelectorAll('.popup-html p img')
+        popupElements.forEach(popupElement => {
+          if (popupElement) {
+            if (popupElements.length > 1) {
+              popupElement.style.width = '50%'
+            } else {
+              popupElement.style.width = '100%'
+            }
+          }
+        })
+      })
+    },
+    closePopup () {
+      this.isPopupVisible = false
+    },
+    closePopupOnOutsideClick (event) {
+      if (event.target.id === 'content-popup') {
+        this.closePopup()
+      }
     }
   }
 }
@@ -118,4 +154,40 @@
   .intelligence-el_radio {
     margin-right: 60px;
   }
+
+  .popup {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.8);
+    z-index: 1000;
+  }
+  .popup-content {
+    position: relative;
+    background-color: #fff;
+    padding: 20px;
+    border-radius: 8px;
+    overflow-y: auto;
+  }
+  .close {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    font-size: 24px;
+    color: #000;
+    cursor: pointer;
+  }
+  .thumbnail {
+    margin-bottom: 10px;
+    cursor: pointer;
+  }
+  .popup-html {
+    font-size: 16px;
+    color: #333;
+  }
 </style>

--
Gitblit v1.9.1