添加生成评价码/查询评价码接口调用

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

@@ -15,10 +15,10 @@
         </div>
         <div class="page_jg_20"></div>
         <Table 
-            :current-page="1" 
-            :page-size="20"  
-            :table-data="[]" 
-            :table-columns="generateCodeTableColumns" 
+            :currentPage="1" 
+            :pageSize="20"  
+            :tableData="tableData" 
+            :tableColumns="generateCodeTableColumns" 
             :total-num="0"
         ></Table>
     </div>
@@ -26,6 +26,7 @@
 
 
 <script setup lang="ts">
+import { onUnmounted, ref } from 'vue';
 
 import { useRoute,useRouter } from 'vue-router';
 
@@ -36,9 +37,10 @@ import { searchList } from './formSearchGroup';
 import { generateCodeTableColumns } from './table';
 
 import {
-    generateReviewCodeListApi,finishReviewAccountApi,
+    generateReviewCodeListApi,finishReviewAccountApi,getReviewAccountListApi
 } from '@/api/step4Component'
 import { onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
 
 
 const router = useRouter()
@@ -47,8 +49,47 @@ const GoToReviewAccountConfig = ()=>{
    router.push(`reviewAccount?id=${route.query.id}`)
 }
 
-onMounted(()=>{
+const tableData = ref([])
 
+// 生成评价账号 
+const GenerateReviewCode = async ()=>{
+    let reviewAccountOptionData =  JSON.parse(sessionStorage.getItem('reviewAccountOptionData') || '{}')
+    let res = await generateReviewCodeListApi(reviewAccountOptionData)
+
+    if(res.data){
+        ElMessage.success(res?.data)
+
+        // 待完善
+
+    }
+}
+
+const GetReviewCode = async ()=>{
+    // 获取评价码信息
+    let params = {
+        evaluationId: route.query.id,
+        pageNum: 1,
+        pageSize: 20
+    }
+    let res = await getReviewAccountListApi(params)
+    if(res?.code == 200){
+        ElMessage.success(res?.msg)
+
+        const {codeDataList} = res.data
+
+        tableData.value = codeDataList.records
+    }
+}
+
+onMounted(async ()=>{
+    await GenerateReviewCode()
+
+   await GetReviewCode()
+
+})
+
+onUnmounted(()=>{
+    sessionStorage.removeItem('reviewAccountOptionData')
 })
 </script>
 

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

@@ -9,11 +9,11 @@
                     </el-checkbox>
                 </div>
                 <div class="content_right">
-                    <el-button  class="delete_button_border_no_bg" @click="">全部清空</el-button>
+                    <el-button  class="delete_button_border_no_bg" @click="ClearReviewAccount">全部清空</el-button>
                     <el-button  class="button_border" @click="OpenBatchEditForm">批量编辑</el-button>
                     <el-button  class="button_refresh" @click="">批量导出</el-button>
                     <el-button  class="button_refresh" @click="">批量导入</el-button>
-                    <el-button  class="button_background" @click="">生成评价码</el-button>
+                    <el-button  class="button_background" @click="GoToGenerateCodePage">生成评价码</el-button>
                 </div>
             </div>
         </div>
@@ -56,8 +56,8 @@
 
             <template #form_pre>
                 <ul class="grade_form_item">
-                    <li v-for="grade in batchEditGradeList" :key="grade.gradeId">
-                        <div class="grade_name">{{ grade.gradeName }}</div>
+                    <li v-for="grade in batchEditGradeList" :key="grade.evaluationGradeId">
+                        <div class="grade_name">{{ grade.evaluationGradeName }}</div>
                         <div class="class_list">
                             <el-checkbox
                                 v-model="grade.isSelectAll"
@@ -100,33 +100,33 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
 
-import { useRoute } from 'vue-router';
+import { useRoute,useRouter } from 'vue-router';
 
 import Table from '@/baseComponents/Table.vue';
-import {tableColumns} from './table'
 import FormDialog from '@/baseComponents/FormDialog.vue';
 
 import {
-    getReviewAccountListApi,generateReviewCodeListApi,finishReviewAccountApi,
+    getReviewAccountListApi,
 } from '@/api/step4Component'
 import { ElMessage } from 'element-plus';
 
 
 const route = useRoute()
+const router = useRouter()
 
 const isGenerateByGender = ref(false)  //按男女生成
 
+// 1. 评价账号数据 渲染 及 操作
 // 评价账号原始数据
 const originReviewAccount = ref({})
 // 渲染到表格中的评价账号数据
 const tableData = ref([]);
-// 表头初始赋值 和 表行初始赋值
+const tableColumns = ref([])
+// 表头初始赋值 和 表行初始赋值 以及 批量编辑弹窗变量赋值
 const GetReviewAccountList = async ()=>{
     let params = {
         evaluationId: route.query.id,
-        // "evaluationGradeId": 0,
-        // "evaluationClassId": 0,
-        // "gender": 0,
+       
         pageNum: 1,
         pageSize: 20
     }
@@ -137,6 +137,21 @@ const GetReviewAccountList = async ()=>{
         let gradeMsg = res.data?.dataList || {}
         originReviewAccount.value = gradeMsg || {}
 
+        // 批量编辑弹窗变量赋值
+        batchEditGradeList.value = Object.values(gradeMsg).map(item=>{
+            return {
+                ...item,
+                isSelectAll:false,
+                selectedClassList:[],
+                classList:item.classData.map(classItm=>{
+                    return {
+                        label: classItm.evaluationClassName, 
+                        value: classItm.id 
+                    }
+                })
+            }
+        })
+
         //表头赋值
         tableColumns.value = Object.values(gradeMsg)?.map(grade=>{
             let gradeId =   grade.evaluationGradeId
@@ -198,7 +213,7 @@ const GetReviewAccountList = async ()=>{
                 tableData.value[index][`grade_${gradeId}`] = gradeName
                 tableData.value[index][`class_${gradeId}`] = {
                     className:classItm.evaluationClassName,
-                    classId:classItm.evaluationClassId,
+                    classId:classItm.id,
                 }
                 tableData.value[index][`num_${gradeId}`] = classItm.evaluationCount
                 tableData.value[index][`male_${gradeId}`] = classItm.boyCount
@@ -207,7 +222,6 @@ const GetReviewAccountList = async ()=>{
         })
     }
 }
-
 // 打开/关闭 按男女生成
 const GenerateAccountByGenderOrNot = (val)=>{
     if(val){
@@ -235,83 +249,35 @@ const GenerateAccountByGenderOrNot = (val)=>{
 }
 
 
-
-// * 批量编辑弹窗操作
+// 2. 批量编辑弹窗操作
 const batchEditFormVisible = ref(false)
 const batchEditFormLoading = ref(false)
 const batchAccountNum = ref()  //批量的所有数据
 const batchFemaleNum = ref()  //批量的女性数据
 const batchMaleNum = ref()  //批量的男性数据
-// 生成批量编辑弹窗模拟数据
-const batchEditGradeList = ref([
-    {
-        gradeName: '七年级',
-        gradeId: '1',
-        classList: [
-            // 第一行 6 个
-            { label: '英语A2班', value: '7_1' },
-            { label: '英语A2班', value: '7_2' },
-            { label: '英语A2班', value: '7_3' },
-            { label: '英语A2班', value: '7_4' },
-            { label: '英语A2班', value: '7_5' },
-            { label: '英语A2班', value: '7_6' },
-            // 第二行 4 个
-            { label: '英语A2班', value: '7_7' },
-            { label: '英语A2班', value: '7_8' },
-            { label: '英语A2班', value: '7_9' },
-            { label: '英语A2班', value: '7_10' }
-        ],
-        selectedClassList:[],
-        isSelectAll:false
-
-    },
-    {
-        gradeName: '八年级',
-        gradeId: '2',
-        classList: [
-            // 第一行 6 个
-            { label: '英语A2班', value: '8_1' },
-            { label: '英语A2班', value: '8_2' },
-            { label: '英语A2班', value: '8_3' },
-            { label: '英语A2班', value: '8_4' },
-            { label: '英语A2班', value: '8_5' },
-            { label: '英语A2班', value: '8_6' },
-            // 第二行 4 个
-            { label: '英语A2班', value: '8_7' },
-            { label: '英语A2班', value: '8_8' },
-            { label: '英语A2班', value: '8_9' },
-            { label: '英语A2班', value: '8_10' }
-        ],
-        selectedClassList:[],
-        isSelectAll:false
-    },
-    {
-        gradeName: '九年级',
-        gradeId: '3',
-        classList: [
-            // 第一行 6 个
-            { label: '英语A2班', value: '9_1' },
-            { label: '英语A2班', value: '9_2' },
-            { label: '英语A2班', value: '9_3' },
-            { label: '英语A2班', value: '9_4' },
-            { label: '英语A2班', value: '9_5' },
-            { label: '英语A2班', value: '9_6' },
-            // 第二行 4 个
-            { label: '英语A2班', value: '9_7' },
-            { label: '英语A2班', value: '9_8' },
-            { label: '英语A2班', value: '9_9' },
-            { label: '英语A2班', value: '9_10' }
-        ],
-        selectedClassList:[],
-        isSelectAll:false
-    }
-]);
+interface  batchEditGradeItm {
+    evaluationGradeName: string,
+    evaluationGradeId: string,
+    classList: {label: string, value: string }[],
+    selectedClassList:string[],
+    isSelectAll:boolean,
+}
+// 批量编辑 弹窗数据
+const batchEditGradeList = ref<batchEditGradeItm[]>([]);
 // 关闭批量编辑弹窗
 const CloseBatchEditForm = ()=>{
     batchEditFormVisible.value = false
     batchAccountNum.value = null
     batchMaleNum.value = null
     batchFemaleNum.value = null
+    // 清除 批量弹窗编辑 的批量选中数据
+    batchEditGradeList.value = batchEditGradeList.value.map(item=>{
+        return {
+            ...item,
+            selectedClassList:[],
+            isSelectAll:false
+        }
+    })
 }
 // 打开批量编辑弹窗
 const OpenBatchEditForm = ()=>{
@@ -320,17 +286,44 @@ const OpenBatchEditForm = ()=>{
 
 // 保存批量编辑配置 —— 
 const SaveBatchEditForm = (params:any)=>{
-    const {formData,formRef} = params
     const batchData = batchEditGradeList.value.map(item=>{
         return {
-            gradeName: item.gradeName,
-            gradeId: item.gradeId,
+            gradeName: item.evaluationGradeName,
+            gradeId: item.evaluationGradeId,
             selectedClassList:item.selectedClassList
         }
+    })?.filter(item=>{return item.selectedClassList?.length > 0})
+
+    // 选中的值赋值
+    batchEditGradeList.value.map(grade=>{
+        let gradeId =  grade.evaluationGradeId
+        let classDataList = grade.classData
+        let changeAim = batchData.find(itm=>itm.gradeId == gradeId)
+        // 有需要批量修改的 年级
+        if(changeAim){
+            classDataList.map((classItm,index)=>{
+                // 有需要批量修改的 班级
+                if(changeAim.selectedClassList.find(classId=>classId == classItm.id )){
+                    if(typeof tableData.value[index] !== 'object'){
+                        tableData.value[index] = {}
+                    }
+                    // 当前年级下  某个班级 的行赋值
+                    if(isGenerateByGender.value){
+                        // 按男女生成
+                        tableData.value[index][`num_${gradeId}`] = Number(batchMaleNum.value) + Number(batchFemaleNum.value)
+                        tableData.value[index][`male_${gradeId}`] = batchMaleNum.value
+                        tableData.value[index][`female_${gradeId}`] = batchFemaleNum.value
+                    }else{
+                        // 按总人数生成
+                        tableData.value[index][`num_${gradeId}`] = batchAccountNum.value
+                        tableData.value[index][`male_${gradeId}`] = Math.floor(batchAccountNum.value / 2)
+                        tableData.value[index][`female_${gradeId}`] = Math.ceil(batchAccountNum.value / 2)
+                    }
+                }
+            })      
+        }
     })
-    console.log('选中的批量数据--',batchData)
-    console.log('选中的批量数据-账号数量-',batchAccountNum)
-    // CloseBatchEditForm()
+    CloseBatchEditForm()
 }
 
 // 年级全选/全不选
@@ -338,7 +331,7 @@ const HandleGradeSelectAllOrNot = (grade,val)=>{
     if(val){
         // 全选
         batchEditGradeList.value = batchEditGradeList.value.map(item=>{
-            if(item.gradeId == grade.gradeId){
+            if(item.evaluationGradeId == grade.evaluationGradeId){
                 item.selectedClassList = item.classList.map(classItm=>{
                     return classItm.value
                 })
@@ -348,7 +341,7 @@ const HandleGradeSelectAllOrNot = (grade,val)=>{
     }else{{
         // 全不选
          batchEditGradeList.value = batchEditGradeList.value.map(item=>{
-            if(item.gradeId == grade.gradeId){
+            if(item.evaluationGradeId == grade.evaluationGradeId){
                 item.selectedClassList = []
             }
             return item
@@ -359,13 +352,64 @@ const HandleGradeSelectAllOrNot = (grade,val)=>{
 // 年级下 班级选择的变更
 const HandleGradeClassSelectChange = (grade,val)=>{
     batchEditGradeList.value = batchEditGradeList.value.map(item=>{
-        if(item.gradeId == grade.gradeId){
+        if(item.evaluationGradeId == grade.evaluationGradeId){
             item.isSelectAll = grade.selectedClassList?.length === grade.classList?.length && grade.selectedClassList?.length !==0 ? true : false
         }
         return item
     })
 }
 
+// 3. 清空配置的评价账号数据
+const ClearReviewAccount = ()=>{
+    batchEditGradeList.value?.map(grade=>{
+        let gradeId =  grade.evaluationGradeId
+        let classDataList = grade.classData
+        classDataList.map((classItm,index)=>{
+            if(typeof tableData.value[index] !== 'object'){
+                tableData.value[index] = {}
+            }
+            // 当前年级下的行赋值
+            tableData.value[index][`num_${gradeId}`] = null
+            tableData.value[index][`male_${gradeId}`] = null
+            tableData.value[index][`female_${gradeId}`] = null
+        })        
+    })
+}
+
+
+// 4. 生成评价码页面
+const GoToGenerateCodePage = ()=>{
+
+    
+
+    let accounts = batchEditGradeList.value?.map(grade=>{
+        let gradeId =  grade.evaluationGradeId
+        let classDataList = grade.classData
+
+        return classDataList.map((classItm,index)=>{
+            if(typeof tableData.value[index] !== 'object'){
+                tableData.value[index] = {}
+            }
+            return {
+                id:tableData.value[index][`class_${gradeId}`].classId,
+                evaluationGradeName: tableData.value[index][`grade_${gradeId}`],
+                evaluationDataClassName: tableData.value[index][`class_${gradeId}`]?.className,
+                evaluationCount: tableData.value[index][`num_${gradeId}`],
+                boyCount: tableData.value[index][`male_${gradeId}`],
+                girlCount: tableData.value[index][`female_${gradeId}`]
+            }
+        })        
+    })?.flat() || []
+
+    let params = {
+        evaluationId: route.query.id,
+        genderStatus: isGenerateByGender ?  1 : 0, 
+        accounts
+    }
+    sessionStorage.setItem('reviewAccountOptionData',JSON.stringify(params))
+    router.push(`generateReviewCode?id=${route.query.id}`)
+}
+
 
 onMounted(async ()=>{
     await GetReviewAccountList()

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

@@ -13,7 +13,7 @@ export const generateCodeTableColumns = ref([
         hidden: false,
     },
     {
-        name: 'grade',
+        name: 'evaluationGradeName',
         label: '年级',
         width: '120',
         fixed: '',
@@ -23,7 +23,7 @@ export const generateCodeTableColumns = ref([
         hidden: false,
     },
     {
-        name: 'class',
+        name: 'evaluationClassName',
         label: '班级',
         width: '120',
         fixed: '',
@@ -33,7 +33,7 @@ export const generateCodeTableColumns = ref([
         hidden: false,
     },
     {
-        name: 'gender',
+        name: 'genderName',
         label: '性别',
         width: '120',
         fixed: '',
@@ -43,7 +43,7 @@ export const generateCodeTableColumns = ref([
         hidden: false,
     },
     {
-        name: 'code',
+        name: 'evaluationCode',
         label: '评价码',
         width: '120',
         fixed: '',
@@ -53,13 +53,13 @@ export const generateCodeTableColumns = ref([
         hidden: false,
     },
     {
-        name: 'login_method',
+        name: 'requestUrl',
         label: '登入方式：浏览器输入网址',
         width: '400',
         fixed: '',
         align: 'center',
         minWdth: '',
-        custom: true,  
+        custom: false,  
         hidden: false,
     }
 ])