Kaynağa Gözat

选择题判分试题结构增加客户端状态显示

dengshaobo 6 gün önce
ebeveyn
işleme
2c47e6983f
1 değiştirilmiş dosya ile 49 ekleme ve 1 silme
  1. 49 1
      src/views/exam/question.vue

+ 49 - 1
src/views/exam/question.vue

@@ -1,13 +1,27 @@
 <template>
-  <div class="detail_main">
+  <div class="detail_main ">
     <div class="question_header">
         <div class="item_title">
             <div class="item_step">第一步 | 扫描答案:</div>
             <el-button type="primary"  @click="GotoScan()" :loading="scanLoading" style="width: 88px;">{{scanText}}</el-button>  
             <span class="preview_btn" @click="OpenImage()">预览</span>
             <!-- <el-button style="margin-left: 10px;width: 116px;">引用试题结构</el-button> -->
+
+           
+        </div>
+        <div class="scan_state_content">
+            
+                <span class="scan_state_title"><span>客户端状态</span>:</span> 
+                <span class="scan_state_open" v-if="scanClientConnected">
+                    <i class="iconfont icon_open"></i>已打开</span>
+                <span class="scan_state_close" v-else>
+                    <i class="iconfont icon_close"></i>未打开</span>
+                <span v-if="scanClientConnected" class="scan_state_title" style="color: #999;">(当前客户端版本:{{scanClientVersion}})</span>
+            
         </div>
         <div class="choose_template">
+
+            
             当前模板:
             <span class="template_name">{{currentTemplateName}}  </span>
             <!-- <el-select  v-model="queryParams.start"   placeholder="请选择"  class="select_width" >
@@ -226,6 +240,8 @@ const showScanAnswer=ref(false);//扫描答案预览
 const imageFilesList=ref<any[]>([]);//扫描答案的图片列表
 const scanAnswerLoading=ref(false);//确定扫描答案loading
 const scanClientConnected=ref(false);//扫描客户端的连接状态
+const scanClientVersion=ref('');//客户端版本
+
 // 考试科目 ID
 const examSubjectId = computed(() => {
   return examStore.currentExam?.id
@@ -971,6 +987,7 @@ onMounted(() => {
     scanCommon.init(HandleScanResult);
     scanCommon.watchConnection((isOnline, clientVersion) => {
         scanClientConnected.value = isOnline;
+        scanClientVersion.value=clientVersion; //客户端版本号
         // console.log('扫描客户端连接状态:', isOnline, '版本号:', clientVersion);
     });
     currentTemplateId.value=examStore.currentExam.templateId;
@@ -996,6 +1013,37 @@ onUnmounted(() => {
 </script>
  
 <style lang="scss" scoped>
+
+.scan_state_title
+{
+    font-size: 14px;
+    font-weight: 400;
+    color: #333333;
+}
+
+.scan_state_open
+{   margin-left: 5px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #2BC644;
+     i
+    {
+        margin-right: 5px;
+    }
+}
+
+.scan_state_close
+{
+    font-size: 14px;
+    font-weight: 400;
+    margin-left: 5px;
+    color:#F56C6C;
+    i
+    {
+        margin-right: 5px;
+    }
+    
+}
 .detail_main
 {
     height: 100vh; /* 或 100% */