修改评价账号页面访问的交互逻辑以及 评价管理步骤条的状态展示

src/components/ReviewManagementDetailSideBar.vue

@@ -16,7 +16,8 @@
           @click="HandleChangeStep(stepItm)"
         >
           <div class="step_header_title">
-            <span class="step_num">{{ stepItm.stepNum }}</span>
+            <i  v-if="stepItm.isFinish" class="hjx-dui iconfont"></i>
+            <span v-else class="step_num">{{ stepItm.stepNum }}</span>
             <span class="step_title">{{stepItm.title}}</span>
           </div>
 
@@ -35,7 +36,7 @@
 
 
 <script setup lang="ts">
-import { onMounted, ref,inject } from 'vue';
+import { onMounted, ref,inject, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import backIcon from '@/assets/icon/left_back_arrow_.png'
 import router from '@/router';
@@ -46,24 +47,27 @@ const evaluationManageData = inject('commonStepData')
 const route = useRoute()
 
 const currentActiveStep = ref(1)
-const stepMsgs = ref([
+const stepMsgs = computed(()=>[
   {
     stepNum:1,
     title:'评价数据',
     desc:'评价覆盖的年级、班级、对应科目基础信息',
     route:'evaluationData',
+    isFinish:evaluationManageData.isFinishEvaluationData,
   },
   {
     stepNum:2,
     title:'授课关系',
     desc:'年级、班级、科目匹配对应的任课教师',
     route:'teachingRelationship',
+    isFinish:evaluationManageData.isFinishTeachingRelationship,
   },
   {
     stepNum:3,
     title:'问卷模版',
     desc:'为不同科目选定适配的评价问卷模板',
     route:'questionnaireTemplate',
+    isFinish:evaluationManageData.isFinishQuestionnaireTemplate,
   },
   {
     stepNum:4,
@@ -71,32 +75,47 @@ const stepMsgs = ref([
     desc:'批量生成对应数量的学生评价登录账号',
     route:'reviewAccount',
     childrenRoute:[
-      'generateReviewCode'
-    ]
+      'generateReviewCode',
+    ],
+    isFinish:evaluationManageData.isFinishReviewAccount,
+    isGenerateReviewCode:evaluationManageData.isGenerateReviewCode,  //是否已生成评价码
   },
   {
     stepNum:5,
     title:'参数设置',
     desc:'统一配置本次评价任务的评分分值规则',
     route:'parameterSetting',
+    isFinish:evaluationManageData.isFinishParameterSetting,
   },
   {
     stepNum:6,
     title:'评价进度',
     desc:'实时查看学生完成评价的填报进度',
     route:'evaluationProgress',
+    isFinish:evaluationManageData.isFinishEvaluationProgress,
   },
   {
     stepNum:7,
     title:'生成分析',
     desc:'汇总数据并生成、发布评价分析报告',
     route:'generateAnalysis',
+    isFinish:evaluationManageData.isFinsihGenerateAnalysis,
+
   },
 ])
 
 const HandleChangeStep=(currentStep)=>{
   currentActiveStep.value = currentStep.stepNum
-  router.push(`${currentStep.route}?id=${route.query.id}`)
+  if(currentStep.stepNum  === 4){
+    if(currentStep.isGenerateReviewCode){
+      // 已经生成评价码，跳转到评价码生成页面
+      router.push(`generateReviewCode?id=${route.query.id}`)
+    }else{
+      router.push(`${currentStep.route}?id=${route.query.id}`)
+    }
+  }else{
+    router.push(`${currentStep.route}?id=${route.query.id}`)
+  }
 }
 
 
@@ -161,6 +180,12 @@ onMounted(()=>{
           padding:3px 8px;
           border-radius: 10px 0 0 0;
 
+          .hjx-dui{
+            color:#15bc83;
+            margin:0 5px;
+          }
+
+
           .step_num{
             display: flex;
             align-items: center;
@@ -218,6 +243,10 @@ onMounted(()=>{
 
             background-color: #2E64FA;
             color: white;
+
+           
+
+
           }
           .step_num{
             background-color: white;

src/layout/components/AppMain.vue

@@ -33,8 +33,19 @@ export default {
 
   // 评价管理 的 步骤公共信息 下发
   const evaluationManageStepData  = reactive({
-    evaluationManageDetailName:'',
-    isHeadTeacherInvolved:null
+    evaluationManageDetailName:'',  // 评价管理任务名称
+    isHeadTeacherInvolved:null,    //班主任是否参与评价
+    isGenerateAccountByGender:null,  // 是否按男女生成评价账号
+    isGenerateReviewCode:null,  //是否已生成评价码
+    
+    // 各个步骤的完成状态
+    isFinishEvaluationData:null,  // 评价数据是否完成
+    isFinishTeachingRelationship:null, // 授课关系是否完成
+    isFinishQuestionnaireTemplate:null,  //问卷模板是否完成
+    isFinishReviewAccount:null,  //评价账号是否完成
+    isFinishParameterSetting:null,   //参数设置是否完成
+    isFinishEvaluationProgress:null, //评价进度是否完成
+    isFinsihGenerateAnalysis:null,  //生成分析是否完成
   })
   provide('commonStepData', evaluationManageStepData);
 

src/views/reviewManagement/ReviewManagementDetail.vue

@@ -17,6 +17,7 @@ import Step2Component from './stepComponent/step2Component/Step2Component.vue';
 import Step3Component from './stepComponent/step3Component/Step3Component.vue';
 import Step4Component from './stepComponent/step4Component/Step4Component.vue';
 import GenerateReviewCode from './stepComponent/step4Component/GenerateReviewCode.vue';
+import Step5Component from './stepComponent/step5Component/Step5Component.vue';
 
 const evaluationManageData = inject('commonStepData');
 
@@ -37,7 +38,7 @@ const curentComponent = computed(()=>{
     case 'generateReviewCode':
       return GenerateReviewCode
     case 'parameterSetting':
-      break
+      return Step5Component
     case 'evaluationProgress':
       break
     case 'generateAnalysis':
@@ -54,6 +55,15 @@ const GetEvaluationTaskDetail = async ()=>{
     if(res?.code === 200){
       evaluationManageData.evaluationManageDetailName = res.data.evaluationName
       evaluationManageData.isHeadTeacherInvolved = Boolean(res.data.classMasterStatus)
+      evaluationManageData.isGenerateAccountByGender = Boolean(res.data.genderStatus)
+      evaluationManageData.isGenerateReviewCode = Boolean(res.data.evaluationCodeStatus)
+      evaluationManageData.isFinishEvaluationData = Boolean(res.data.evaluationDataStatus)
+      evaluationManageData.isFinishTeachingRelationship = Boolean(res.data.teachingRelationStatus)
+      evaluationManageData.isFinishQuestionnaireTemplate = Boolean(res.data.assessmentTemplateStatus)
+      evaluationManageData.isFinishReviewAccount = Boolean(res.data.evaluationAccountStatus)
+      evaluationManageData.isFinishParameterSetting = Boolean(res.data.paramSetupStatus)
+      evaluationManageData.isFinishEvaluationProgress = Boolean(res.data.evaluationProgressStatus)
+      evaluationManageData.isFinsihGenerateAnalysis = Boolean(res.data.analysisStatus)
     }
 }
 

src/views/reviewManagement/stepComponent/step4Component/GenerateReviewCode.vue

@@ -9,18 +9,23 @@
                     <el-button class="button_refresh">导出PDF</el-button>
                     <el-button class="button_refresh">导出Excel</el-button>
                     <el-button class="button_border" @click="GoToReviewAccountConfig">重新生成</el-button>
-                    <el-button class="button_background">完成</el-button>
+                    <el-button class="button_background" @click="FinishReviewAccount">完成</el-button>
                 </div>
             </div>
         </div>
         <div class="page_jg_20"></div>
         <Table 
-            :currentPage="1" 
-            :pageSize="20"  
+            :currentPage="currentPage" 
+            :pageSize="pageSize"  
             :tableData="tableData" 
             :tableColumns="generateCodeTableColumns" 
-            :total-num="0"
-        ></Table>
+            :totalNum="totalNum"
+            @paginationChange="HandlePaginationChange"
+        >
+            <template #num="{row,currentIndex}">
+                {{ currentIndex + pageSize * (currentPage - 1) }}
+            </template>
+        </Table>
     </div>
 </template>   
 
@@ -49,47 +54,76 @@ const GoToReviewAccountConfig = ()=>{
    router.push(`reviewAccount?id=${route.query.id}`)
 }
 
-const tableData = ref([])
 
-// 生成评价账号 
+// 1. 生成评价账号 
 const GenerateReviewCode = async ()=>{
-    let reviewAccountOptionData =  JSON.parse(sessionStorage.getItem('reviewAccountOptionData') || '{}')
-    let res = await generateReviewCodeListApi(reviewAccountOptionData)
-
-    if(res.data){
-        ElMessage.success(res?.data)
-
-        // 待完善
-
+    let paramsStr = sessionStorage.getItem('reviewAccountOptionData')
+    let reviewAccountOptionData =  JSON.parse(paramsStr || '{}')
+    if(paramsStr){
+        // 有生成评价码的传参 _需要生成评价码
+        let res = undefined
+        try{
+            res = await generateReviewCodeListApi(reviewAccountOptionData)
+        }catch{}
+        if(res?.code == 200){
+            sessionStorage.removeItem('reviewAccountOptionData')   // 评价码生成后清除传参
+            sessionStorage.removeItem('reviewAccountMsg') // 评价码生成成功，配置状态的旧数据 不再需要保留
+            return true
+        }else{
+            return false
+        }
+    }else{
+        // 没有生成评价码的传参 _不需要生成评价码
+        return true
     }
 }
 
+
+// .2. 评价码数据获取 
+const tableData = ref([])
+const currentPage = ref(1)
+const pageSize = ref(20)
+const totalNum = ref(0)
+// 获取评价码
 const GetReviewCode = async ()=>{
     // 获取评价码信息
     let params = {
         evaluationId: route.query.id,
-        pageNum: 1,
-        pageSize: 20
+        pageNum: currentPage.value,
+        pageSize: pageSize.value
     }
     let res = await getReviewAccountListApi(params)
     if(res?.code == 200){
-        ElMessage.success(res?.msg)
-
         const {codeDataList} = res.data
-
         tableData.value = codeDataList.records
+        totalNum.value = codeDataList.total
     }
 }
-
-onMounted(async ()=>{
-    await GenerateReviewCode()
-
+// 表格分页切换
+const HandlePaginationChange = async (params)=>{
+    const {type,val} = params
+    if(type == 'currentPage'){
+        currentPage.value = val
+    }
    await GetReviewCode()
+}
 
-})
+// 3. 完成评价账号
+const FinishReviewAccount = async()=>{
+    let res = await finishReviewAccountApi(route.query.id)
+    if(res?.code == 200){
+        ElMessage.success(res?.msg)
+    }
+}
 
-onUnmounted(()=>{
-    sessionStorage.removeItem('reviewAccountOptionData')
+onMounted(async ()=>{
+    let generateFlag = await GenerateReviewCode()
+    if(generateFlag){  // 这一步成功 才执行下一步
+       await GetReviewCode()
+    }else{
+        // 评价码生成失败 返回配置页
+        router.push(`reviewAccount?id=${route.query.id}`)
+    }
 })
 </script>
 

src/views/reviewManagement/stepComponent/step4Component/Step4Component.vue

@@ -1,9 +1,9 @@
 <template>
-    <div class="page_item step_3_content page_search end_item">
+    <div class="page_item   end_item">
         <div class="page_search">
             <div class="search_content">
                 <div class="content_left">
-                    <el-checkbox v-model="isGenerateByGender"  
+                    <el-checkbox v-model="evaluationManageData.isGenerateAccountByGender"  
                         @change="(val)=>GenerateAccountByGenderOrNot(val)" >
                         按男女生成
                     </el-checkbox>
@@ -82,7 +82,7 @@
 
 
             <template #footerRight="{formRef}">
-                <div v-if="!isGenerateByGender" class="batch_num">
+                <div v-if="!evaluationManageData.isGenerateAccountByGender" class="batch_num">
                     <span>数量：<el-input  type="number"  v-model="batchAccountNum"   placeholder="请输入"/></span>
                 </div>
                 <div v-else class="group_batch_num">
@@ -98,7 +98,7 @@
 
 
 <script setup lang="ts">
-import { onMounted, ref } from 'vue';
+import { onMounted, inject,ref } from 'vue';
 
 import { useRoute,useRouter } from 'vue-router';
 
@@ -114,7 +114,10 @@ import { ElMessage } from 'element-plus';
 const route = useRoute()
 const router = useRouter()
 
-const isGenerateByGender = ref(false)  //按男女生成
+// evaluationManageData.isGenerateAccountByGender // //按男女生成
+const evaluationManageData = inject('commonStepData')
+
+
 
 // 1. 评价账号数据 渲染 及 操作
 // 评价账号原始数据
@@ -308,7 +311,7 @@ const SaveBatchEditForm = (params:any)=>{
                         tableData.value[index] = {}
                     }
                     // 当前年级下  某个班级 的行赋值
-                    if(isGenerateByGender.value){
+                    if(evaluationManageData.isGenerateAccountByGender){
                         // 按男女生成
                         tableData.value[index][`num_${gradeId}`] = Number(batchMaleNum.value) + Number(batchFemaleNum.value)
                         tableData.value[index][`male_${gradeId}`] = batchMaleNum.value
@@ -379,8 +382,13 @@ const ClearReviewAccount = ()=>{
 
 // 4. 生成评价码页面
 const GoToGenerateCodePage = ()=>{
-
-    
+    // 跳转到生成评价码页面前要临时存储 当前页面的所有数据
+    let reviewAccountMsg = {
+        originReviewAccount:originReviewAccount.value,
+        batchEditGradeList:batchEditGradeList.value,
+        tableColumns:tableColumns.value,
+        tableData:tableData.value
+    }
 
     let accounts = batchEditGradeList.value?.map(grade=>{
         let gradeId =  grade.evaluationGradeId
@@ -403,17 +411,31 @@ const GoToGenerateCodePage = ()=>{
 
     let params = {
         evaluationId: route.query.id,
-        genderStatus: isGenerateByGender ?  1 : 0, 
+        genderStatus: evaluationManageData.isGenerateAccountByGender ?  1 : 0, 
         accounts
     }
+
+    // 存储当前整个页面的内容——防止生成评价码失败后，不能继续延用 配置状态的旧数据
+    sessionStorage.setItem('reviewAccountMsg',JSON.stringify(reviewAccountMsg))
+    // 存储生成评价码需要的参数
     sessionStorage.setItem('reviewAccountOptionData',JSON.stringify(params))
     router.push(`generateReviewCode?id=${route.query.id}`)
 }
 
 
 onMounted(async ()=>{
-    await GetReviewAccountList()
-
+    let reviewAccountMsg = sessionStorage.getItem('reviewAccountMsg')
+    // 如果有缓存，说明是从生成评价码失败页面跳过来的
+    if(reviewAccountMsg){
+        let objMsg = JSON.parse(reviewAccountMsg || '{}')
+        originReviewAccount.value = objMsg.originReviewAccount
+        batchEditGradeList.value = objMsg.batchEditGradeList
+        tableColumns.value  = objMsg.tableColumns
+        tableData.value  = objMsg.tableData
+        sessionStorage.removeItem('reviewAccountMsg')  //获取完后清空数据
+    }else{
+        await GetReviewAccountList()
+    }
 })
 
 </script>

src/views/reviewManagement/stepComponent/step4Component/table.ts

@@ -9,7 +9,7 @@ export const generateCodeTableColumns = ref([
         fixed: '',
         align: 'center',
         minWdth: '', 
-        custom: false,
+        custom: true,
         hidden: false,
     },
     {