Răsfoiți Sursa

修改页面的进度展示和倒计时展示逻辑

lm 1 săptămână în urmă
părinte
comite
72943a2b32

+ 13 - 3
src/utils/dateTransform.ts

@@ -67,11 +67,17 @@ export function TimeToSecond(time){
     let seconds = splitArr[2]
     return seconds + minute * 60 + hour * 60 * 60
 }
+interface CountDownItm {
+    day?:string |number
+    hours?:string | number
+    minutes?:string | number
+    abort:boolean
+}
 
 // 倒计时
 export const useTimeCountDown = ()=>{
     const intervalFlag = ref()
-    const deadlineCountDown = ref()
+    const deadlineCountDown = ref<CountDownItm>()
     // 开始倒计时
     // 截止时间 deadlineTime
     //  timeInterval  倒计时时间间隔
@@ -84,9 +90,12 @@ export const useTimeCountDown = ()=>{
             let sectionTime = timestamp - currentTimestamp
             if(sectionTime > 0){
                 console.log('计时器----')
-                deadlineCountDown.value =  {...TimestampToDate(sectionTime)}
+                deadlineCountDown.value =  {
+                    ...TimestampToDate(sectionTime),
+                    abort:false
+                }
             }else{
-                deadlineCountDown.value = {}
+                deadlineCountDown.value = {abort:true}
                 clearInterval(intervalFlag.value)
                 intervalFlag.value = null
             }
@@ -95,6 +104,7 @@ export const useTimeCountDown = ()=>{
 
     // 销毁倒计时
     const DestoryInterval = ()=>{
+        console.log('销毁倒计时')
         clearInterval(intervalFlag.value)
         intervalFlag.value = null
     }

+ 57 - 32
src/views/questionnaireCommit/QuestionnaireCommit.vue

@@ -5,29 +5,31 @@
                 <el-icon class="img"><ArrowLeftBold /></el-icon>
                 返回
             </el-button>
-
-                <!-- 待完善 -->
-                <!-- 如该任务勾选了所有单科统一模板后,则会出现"整卷填写”和“按题填写”的页面,默认按照整卷填写 -->
-                <TabSearch tabType="box" 
-                    :disabled="QuestionnaireModeDisabled"
-                    :defaultTabKey="defaultQuestionnaireMode" :tabList="[
-                    {
-                        label:'整卷填写',
-                        key:'full',
-                    },
-                    {
-                        label:'按题填写',
-                        key:'split',
-                    }]" 
-                    @tabChange="HandleQuestionnaireModeChange"
-                />
-
-                <div class="info_tip">
-                    <span class="process_tip">总进度:{{ questionnaireProgress }}</span>
-                    <span class="time_tip">
-                        <img :src="redTimeIcon" alt="">
-                        剩余时间:{{ deadlineCountDown?.day + '天' + deadlineCountDown?.hours + '时' + deadlineCountDown?.minutes + '分'  }}</span>
-                </div>
+            <!-- 如该任务勾选了所有单科统一模板后,则会出现"整卷填写”和“按题填写”的页面,默认按照整卷填写 -->
+            <TabSearch v-if="isUnifyTemplate" tabType="box" 
+                :disabled="QuestionnaireModeDisabled"
+                :defaultTabKey="defaultQuestionnaireMode" :tabList="[
+                {
+                    label:'整卷填写',
+                    key:'full',
+                },
+                {
+                    label:'按题填写',
+                    key:'split',
+                }]" 
+                @tabChange="HandleQuestionnaireModeChange"
+            />
+
+            <div class="info_tip">
+                <span class="process_tip">总进度:{{ questionnaireProgress }}</span>
+                <span class="time_tip">
+                    <img :src="redTimeIcon" alt="">
+                    {{ 
+                        deadlineCountDown?.abort ? '已结束' : 
+                        `剩余时间:${deadlineCountDown?.day}天${deadlineCountDown?.hours}时${deadlineCountDown?.minutes}分` 
+                    }}
+                </span>
+            </div>
         </div>
 
         <div class="page_jg_20"> </div>
@@ -185,7 +187,7 @@
 
 
 <script setup lang="ts">
-import { ref,onMounted, reactive, computed,watch } from 'vue';
+import { ref,onMounted, reactive, computed,watch, nextTick } from 'vue';
 import { useRouter } from 'vue-router';
 import { ElMessage } from 'element-plus';
 
@@ -213,7 +215,6 @@ import redTimeIcon from '@/assets/icon/red_time_icon.svg'
 import finishIcon from '@/assets/studentQuestionnaire/select_icon.png'
 
 
-
 interface TeacherItm {
     id: string|number
     evaluationClassName: string     //班级
@@ -225,10 +226,14 @@ interface TeacherItm {
 
 }
 
-
-
 const router = useRouter()
 
+// 是否 所有单科统一模板
+const isUnifyTemplate = computed(()=>{
+    // 统一模板状态,0-否(未勾选),1-是(已勾选)
+    let unifyTemplateStatus = JSON.parse(localStorage.getItem('userInfo') || '{}')?.evaluationBO?.unifyTemplateStatus
+    return unifyTemplateStatus ? true : false
+})
 
 // 倒计时相关参数
 const { 
@@ -253,13 +258,27 @@ const teacherList = ref<TeacherItm[]>([])
 const isCurrentQuestionnaireTaskFinish = ref(false) //true  false
 
 // 问卷填写截止时间
-// const deadlineTime = ref('2026-07-28 12:30:00')
-const deadlineTime = computed(()=>{
-    return questionaireMsg.value.deadlineTime
-})
+const deadlineTime = ref('')
+
+
 // 每个问卷的进度
 const questionnaireProgress= computed(()=>{
-    return questionaireMsg.value.progress
+    if(defaultQuestionnaireMode.value == 'full'){
+        return questionaireMsg.value?.progress
+    }else if(defaultQuestionnaireMode.value == 'split'){
+        let totalQuestion = questionaireMsg.value?.questionData || []
+        let finishLength = 0
+        totalQuestion.map(item=>{
+            if(IsSplitQuestionnaireFinish(item.studentAnswerStatus)){
+                finishLength += 1
+            }
+        })
+        if(totalQuestion?.length > 0){
+            return Math.floor((finishLength / totalQuestion.length) * 100) + '%'
+        }else{
+            return '0%'
+        }
+    }
 })
 
 
@@ -771,6 +790,12 @@ const ReloadPageData = async ()=>{
     await GetFullQuestionnaireData()
 }
 
+watch(()=>questionaireMsg?.value?.deadlineTime,async (newVal)=>{
+    deadlineTime.value = newVal
+    await nextTick()
+    HandleTimeDeadline()
+})
+
 onMounted( async ()=>{
     await ReloadPageData()
 })