|
|
@@ -0,0 +1,228 @@
|
|
|
+<template>
|
|
|
+<div class="select_class">
|
|
|
+
|
|
|
+ <div class="message_title">
|
|
|
+ 请选择参加考试的班级,再点击确认按钮
|
|
|
+ </div>
|
|
|
+ <div class="class_type">
|
|
|
+ <div class="right_user_tab">
|
|
|
+ <!-- 按考场 1 按班级 2 -->
|
|
|
+ <div class="tab_system_user" :class="activeName == 1?'select_cur':''" @click="ChangeClassType(1)">
|
|
|
+ 行政班
|
|
|
+ </div>
|
|
|
+ <div class="tab_temporay_user" :class="activeName == 2?'select_cur':''" @click="ChangeClassType(2)">
|
|
|
+ 教学班
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="page_jg_20">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="class_list" >
|
|
|
+ <div class="list_item" :class="selectedIds.includes(item.classId) ? 'list_item_cur' : ''" v-for="(item,index) in tableData" @click="SelectClass(item)">
|
|
|
+ <span>
|
|
|
+ {{ item.className }}{{ item.className.includes('班') ? '' : '班' }}
|
|
|
+ </span>
|
|
|
+ <span>
|
|
|
+ {{item.userTotal}}人
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="class_button">
|
|
|
+ <el-button type="primary" :loading="loading" @click="HandleSubmit">确定</el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+</div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" setup>
|
|
|
+import { ref, reactive, computed, watch,onMounted } from 'vue'
|
|
|
+import type { ElTableColumn, FormInstance, FormRules } from 'element-plus'
|
|
|
+import { ElMessage,ElTable } from 'element-plus'
|
|
|
+import { useRouter,useRoute} from 'vue-router'
|
|
|
+const router = useRouter()
|
|
|
+// 1. 确保导入接口函数，请根据实际路径调整
|
|
|
+import { getClassList,useClassList } from '@/api/exam'
|
|
|
+import { useExamStore } from '@/store/exam'
|
|
|
+
|
|
|
+
|
|
|
+const route = useRoute()
|
|
|
+// 实例化 Store
|
|
|
+const examStore = useExamStore()
|
|
|
+
|
|
|
+//定义用于存储下拉菜单选项的响应式数据
|
|
|
+const tableData=ref<any[]>([]);
|
|
|
+
|
|
|
+const selectedIds=ref<any[]>([]);//选中的班级id列表
|
|
|
+
|
|
|
+const loading=ref(false);//加载状态
|
|
|
+const activeName=ref(1);//1-行政班 2-教学班
|
|
|
+
|
|
|
+// 考试科目 ID
|
|
|
+const examSubjectId = computed(() => {
|
|
|
+ // 替换为: return makeTemplateStore.examTempDetail?.id
|
|
|
+ return examStore.currentExam?.id
|
|
|
+})//计算属性
|
|
|
+
|
|
|
+//切换班级类型
|
|
|
+const ChangeClassType=async(type:number)=>{
|
|
|
+ activeName.value=type;
|
|
|
+ GetClassList();
|
|
|
+}
|
|
|
+
|
|
|
+// 选中班级id
|
|
|
+const SelectClass=(item:any)=>{
|
|
|
+
|
|
|
+ const index = selectedIds.value.indexOf(item.classId)
|
|
|
+ if (index > -1) {
|
|
|
+ selectedIds.value.splice(index, 1)
|
|
|
+ } else {
|
|
|
+ selectedIds.value.push(item.classId)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(()=>{
|
|
|
+ GetClassList();
|
|
|
+})
|
|
|
+
|
|
|
+// 获取班级列表
|
|
|
+const GetClassList=async()=>{
|
|
|
+ const params={
|
|
|
+ examSubjectId:examSubjectId.value,
|
|
|
+ schoolId:0,
|
|
|
+ };
|
|
|
+ const res:any = await getClassList(params);
|
|
|
+ console.log("打印获取的结果",res)
|
|
|
+ if(res.code==200 && res.data)
|
|
|
+ {
|
|
|
+ tableData.value=res.data.adminClasses;
|
|
|
+ console.log("打印formData",tableData.value)
|
|
|
+ // selectedId.value=tableData.value[0].classId;
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+// 确定按钮
|
|
|
+const HandleSubmit= () => {
|
|
|
+ console.log("确定选择模板")
|
|
|
+
|
|
|
+ console.log("examSubjectId",examSubjectId.value)
|
|
|
+ if(selectedIds.value.length==0)
|
|
|
+ {
|
|
|
+ ElMessage.error("请至少选择一个班级!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ const params={
|
|
|
+ examSubjectId:examSubjectId.value,
|
|
|
+ classIds:selectedIds.value,
|
|
|
+ reuse:Number(route.query.reuse) || 0,//是否是重新使用名单 0-否 1-是
|
|
|
+ schoolId:0,//学校id
|
|
|
+ };
|
|
|
+ loading.value=true;
|
|
|
+ useClassList(params).then((res:any)=>{
|
|
|
+ loading.value=false;
|
|
|
+ if(res.code==200)
|
|
|
+ {
|
|
|
+ ElMessage.success("操作成功!");
|
|
|
+
|
|
|
+ router.push({
|
|
|
+ name: 'scanList',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ else
|
|
|
+ {
|
|
|
+ ElMessage.error(res.msg || "操作失败!");
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.select_class
|
|
|
+{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 5px 5px 5px 5px;
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .message_title
|
|
|
+ {
|
|
|
+ font-weight: 550;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333333;
|
|
|
+
|
|
|
+ }
|
|
|
+ .class_type
|
|
|
+ {
|
|
|
+ width: 100%;
|
|
|
+ .right_user_tab
|
|
|
+ {
|
|
|
+ width:124px;
|
|
|
+ margin-left: 0px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .class_list
|
|
|
+ {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ gap: 20px;
|
|
|
+ height: calc(100% - 160px);
|
|
|
+ overflow-y: auto;
|
|
|
+ .list_item
|
|
|
+ {
|
|
|
+ width:154px;
|
|
|
+ height:60px;
|
|
|
+ border-radius: 8px 8px 8px 8px;
|
|
|
+ border: 1px solid #E0E0E0;
|
|
|
+ line-height: 60px;
|
|
|
+ padding-left: 20px;
|
|
|
+ padding-right: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333333;
|
|
|
+
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .list_item_cur
|
|
|
+ {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #2E64FA;
|
|
|
+ background: rgba(46,100,250,0.1);
|
|
|
+ border: 1px solid #2E64FA;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .class_button
|
|
|
+ {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ height: 60px;
|
|
|
+
|
|
|
+ padding-top: 20px;
|
|
|
+ .el-button
|
|
|
+ {
|
|
|
+ width: 200px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
