fix
This commit is contained in:
吴红兵
@@ -1,292 +1,273 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="班级概况"
|
||||
v-model="visible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
width="1400px">
|
||||
<div v-loading="loading">
|
||||
<!-- 基本信息 -->
|
||||
<el-descriptions :column="3" border v-if="detailData" class="mb20">
|
||||
<el-descriptions-item label="班号">{{ detailData.classNo || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级名称">{{ detailData.className || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级规范名称">{{ detailData.classProName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学院">{{ detailData.deptName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任">{{ detailData.teacherRealName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任电话">{{ detailData.teacherTel || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学年份">{{ detailData.grade || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学时间">{{ detailData.enterDate || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级状态">
|
||||
<span>{{ detailData.classStatus === '0' ? '正常' : detailData.classStatus === '1' ? '离校' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="班级人数/原始人数">
|
||||
{{ detailData.stuNum || 0 }}/{{ detailData.preStuNum || 0 }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="流失率">
|
||||
<span>{{ detailData.stuLoseRate ? `${detailData.stuLoseRate}%` : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联院">
|
||||
<span>{{ detailData.isUnion === 1 ? '是' : detailData.isUnion === 0 ? '否' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="门禁规则" :span="3">{{ detailData.ruleName || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-dialog title="班级概况" v-model="visible" :close-on-click-modal="false" draggable width="1400px">
|
||||
<div v-loading="loading">
|
||||
<!-- 基本信息 -->
|
||||
<el-descriptions :column="3" border v-if="detailData" class="mb20">
|
||||
<el-descriptions-item label="班号">{{ detailData.classNo || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级名称">{{ detailData.className || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级规范名称">{{ detailData.classProName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学院">{{ detailData.deptName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任">{{ detailData.teacherRealName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任电话">{{ detailData.teacherTel || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学年份">{{ detailData.grade || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学时间">{{ detailData.enterDate || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级状态">
|
||||
<span>{{ detailData.classStatus === '0' ? '正常' : detailData.classStatus === '1' ? '离校' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="班级人数/原始人数"> {{ detailData.stuNum || 0 }}/{{ detailData.preStuNum || 0 }} </el-descriptions-item>
|
||||
<el-descriptions-item label="流失率">
|
||||
<span>{{ detailData.stuLoseRate ? `${detailData.stuLoseRate}%` : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联院">
|
||||
<span>{{ detailData.isUnion === 1 ? '是' : detailData.isUnion === 0 ? '否' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="门禁规则" :span="3">{{ detailData.ruleName || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<!-- 详细信息 - 使用 tabs 展示六个接口的数据 -->
|
||||
<el-tabs v-model="activeTab" type="border-card">
|
||||
<el-tab-pane label="班级荣誉" name="honor">
|
||||
<el-table :data="honorList" border style="width: 100%" v-loading="honorLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
</el-table>
|
||||
<div v-if="honorList.length === 0 && !honorLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<!-- 详细信息 - 使用 tabs 展示六个接口的数据 -->
|
||||
<el-tabs v-model="activeTab" type="border-card">
|
||||
<el-tab-pane label="班级荣誉" name="honor">
|
||||
<el-table :data="honorList" border style="width: 100%" v-loading="honorLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
</el-table>
|
||||
<div v-if="honorList.length === 0 && !honorLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="班级宣传" name="publicity">
|
||||
<el-table :data="publicityList" border style="width: 100%" v-loading="publicityLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
<el-table-column prop="website" label="网址" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="publicityList.length === 0 && !publicityLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="班级宣传" name="publicity">
|
||||
<el-table :data="publicityList" border style="width: 100%" v-loading="publicityLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
<el-table-column prop="website" label="网址" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="publicityList.length === 0 && !publicityLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="教室分配" name="classroom">
|
||||
<el-table :data="classroomList" border style="width: 100%" v-loading="classroomLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="buildingNo" label="教学楼号" show-overflow-tooltip />
|
||||
<el-table-column prop="roomNo" label="教室号" show-overflow-tooltip />
|
||||
<el-table-column prop="roomName" label="教室名称" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="classroomList.length === 0 && !classroomLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="教室分配" name="classroom">
|
||||
<el-table :data="classroomList" border style="width: 100%" v-loading="classroomLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="buildingNo" label="教学楼号" show-overflow-tooltip />
|
||||
<el-table-column prop="roomNo" label="教室号" show-overflow-tooltip />
|
||||
<el-table-column prop="roomName" label="教室名称" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="classroomList.length === 0 && !classroomLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="学生数量" name="studentNum">
|
||||
<el-table :data="studentNumList" border style="width: 100%" v-loading="studentNumLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip />
|
||||
<el-table-column prop="realName" label="姓名" show-overflow-tooltip />
|
||||
<el-table-column prop="sex" label="性别" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.sex === '1' ? '男' : scope.row.sex === '0' ? '女' : '-' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="电话" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="studentNumList.length === 0 && !studentNumLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="学生数量" name="studentNum">
|
||||
<el-table :data="studentNumList" border style="width: 100%" v-loading="studentNumLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip />
|
||||
<el-table-column prop="realName" label="姓名" show-overflow-tooltip />
|
||||
<el-table-column prop="sex" label="性别" width="80" align="center">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.sex === '1' ? '男' : scope.row.sex === '0' ? '女' : '-' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="电话" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="studentNumList.length === 0 && !studentNumLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="宿舍学生" name="dormStudent">
|
||||
<el-table :data="dormStudentList" border style="width: 100%" v-loading="dormStudentLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="buildingNo" label="楼号" show-overflow-tooltip />
|
||||
<el-table-column prop="roomNo" label="宿舍号" show-overflow-tooltip />
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip />
|
||||
<el-table-column prop="realName" label="姓名" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="dormStudentList.length === 0 && !dormStudentLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="宿舍学生" name="dormStudent">
|
||||
<el-table :data="dormStudentList" border style="width: 100%" v-loading="dormStudentLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="buildingNo" label="楼号" show-overflow-tooltip />
|
||||
<el-table-column prop="roomNo" label="宿舍号" show-overflow-tooltip />
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip />
|
||||
<el-table-column prop="realName" label="姓名" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="dormStudentList.length === 0 && !dormStudentLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="惩罚记录" name="punish">
|
||||
<el-table :data="punishList" border style="width: 100%" v-loading="punishLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip />
|
||||
<el-table-column prop="realName" label="姓名" show-overflow-tooltip />
|
||||
<el-table-column prop="punishType" label="惩罚类型" show-overflow-tooltip />
|
||||
<el-table-column prop="punishReason" label="惩罚原因" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="惩罚时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="punishList.length === 0 && !punishLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">关 闭</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-tab-pane label="惩罚记录" name="punish">
|
||||
<el-table :data="punishList" border style="width: 100%" v-loading="punishLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip />
|
||||
<el-table-column prop="realName" label="姓名" show-overflow-tooltip />
|
||||
<el-table-column prop="punishType" label="惩罚类型" show-overflow-tooltip />
|
||||
<el-table-column prop="punishReason" label="惩罚原因" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="惩罚时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="punishList.length === 0 && !punishLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">关 闭</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="BasicClassDetail">
|
||||
import { ref } from 'vue'
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { queryClassHonorByClassCode } from '/@/api/stuwork/classhonor'
|
||||
import { queryDataByClassCode } from '/@/api/stuwork/classpublicity'
|
||||
import { getClassRoomByClassCode } from '/@/api/stuwork/teachclassroomassign'
|
||||
import { queryStuNumByClassCode } from '/@/api/basic/basicstudent'
|
||||
import { fearchStuNumByClassCode } from '/@/api/stuwork/dormroomstudent'
|
||||
import { queryPunlishNumByClass } from '/@/api/stuwork/stupunlish'
|
||||
import { ref } from 'vue';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { queryClassHonorByClassCode } from '/@/api/stuwork/classhonor';
|
||||
import { queryDataByClassCode } from '/@/api/stuwork/classpublicity';
|
||||
import { getClassRoomByClassCode } from '/@/api/stuwork/teachclassroomassign';
|
||||
import { queryStuNumByClassCode } from '/@/api/basic/basicstudent';
|
||||
import { fearchStuNumByClassCode } from '/@/api/stuwork/dormroomstudent';
|
||||
import { queryPunlishNumByClass } from '/@/api/stuwork/stupunlish';
|
||||
|
||||
// 定义变量内容
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const detailData = ref<any>(null)
|
||||
const activeTab = ref('honor')
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const detailData = ref<any>(null);
|
||||
const activeTab = ref('honor');
|
||||
|
||||
// 六个接口的数据
|
||||
const honorList = ref<any[]>([])
|
||||
const honorLoading = ref(false)
|
||||
const publicityList = ref<any[]>([])
|
||||
const publicityLoading = ref(false)
|
||||
const classroomList = ref<any[]>([])
|
||||
const classroomLoading = ref(false)
|
||||
const studentNumList = ref<any[]>([])
|
||||
const studentNumLoading = ref(false)
|
||||
const dormStudentList = ref<any[]>([])
|
||||
const dormStudentLoading = ref(false)
|
||||
const punishList = ref<any[]>([])
|
||||
const punishLoading = ref(false)
|
||||
const honorList = ref<any[]>([]);
|
||||
const honorLoading = ref(false);
|
||||
const publicityList = ref<any[]>([]);
|
||||
const publicityLoading = ref(false);
|
||||
const classroomList = ref<any[]>([]);
|
||||
const classroomLoading = ref(false);
|
||||
const studentNumList = ref<any[]>([]);
|
||||
const studentNumLoading = ref(false);
|
||||
const dormStudentList = ref<any[]>([]);
|
||||
const dormStudentLoading = ref(false);
|
||||
const punishList = ref<any[]>([]);
|
||||
const punishLoading = ref(false);
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = async (rowData: any) => {
|
||||
visible.value = true
|
||||
detailData.value = rowData || null
|
||||
|
||||
// 如果有班级代码，加载六个接口的数据
|
||||
if (rowData?.classCode) {
|
||||
await loadAllData(rowData.classCode)
|
||||
}
|
||||
}
|
||||
visible.value = true;
|
||||
detailData.value = rowData || null;
|
||||
|
||||
// 如果有班级代码，加载六个接口的数据
|
||||
if (rowData?.classCode) {
|
||||
await loadAllData(rowData.classCode);
|
||||
}
|
||||
};
|
||||
|
||||
// 加载所有六个接口的数据
|
||||
const loadAllData = async (classCode: string) => {
|
||||
loading.value = true
|
||||
|
||||
// 并行加载所有接口数据
|
||||
await Promise.all([
|
||||
loadHonorData(classCode),
|
||||
loadPublicityData(classCode),
|
||||
loadClassroomData(classCode),
|
||||
loadStudentNumData(classCode),
|
||||
loadDormStudentData(classCode),
|
||||
loadPunishData(classCode),
|
||||
])
|
||||
|
||||
loading.value = false
|
||||
}
|
||||
loading.value = true;
|
||||
|
||||
// 并行加载所有接口数据
|
||||
await Promise.all([
|
||||
loadHonorData(classCode),
|
||||
loadPublicityData(classCode),
|
||||
loadClassroomData(classCode),
|
||||
loadStudentNumData(classCode),
|
||||
loadDormStudentData(classCode),
|
||||
loadPunishData(classCode),
|
||||
]);
|
||||
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
// 加载班级荣誉数据
|
||||
const loadHonorData = async (classCode: string) => {
|
||||
honorLoading.value = true
|
||||
try {
|
||||
const res = await queryClassHonorByClassCode(classCode)
|
||||
if (res.data) {
|
||||
honorList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级荣誉失败', err)
|
||||
honorList.value = []
|
||||
} finally {
|
||||
honorLoading.value = false
|
||||
}
|
||||
}
|
||||
honorLoading.value = true;
|
||||
try {
|
||||
const res = await queryClassHonorByClassCode(classCode);
|
||||
if (res.data) {
|
||||
honorList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级荣誉失败', err);
|
||||
honorList.value = [];
|
||||
} finally {
|
||||
honorLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 加载班级宣传数据
|
||||
const loadPublicityData = async (classCode: string) => {
|
||||
publicityLoading.value = true
|
||||
try {
|
||||
const res = await queryDataByClassCode(classCode)
|
||||
if (res.data) {
|
||||
publicityList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级宣传失败', err)
|
||||
publicityList.value = []
|
||||
} finally {
|
||||
publicityLoading.value = false
|
||||
}
|
||||
}
|
||||
publicityLoading.value = true;
|
||||
try {
|
||||
const res = await queryDataByClassCode(classCode);
|
||||
if (res.data) {
|
||||
publicityList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级宣传失败', err);
|
||||
publicityList.value = [];
|
||||
} finally {
|
||||
publicityLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 加载教室分配数据
|
||||
const loadClassroomData = async (classCode: string) => {
|
||||
classroomLoading.value = true
|
||||
try {
|
||||
const res = await getClassRoomByClassCode(classCode)
|
||||
if (res.data) {
|
||||
classroomList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取教室分配失败', err)
|
||||
classroomList.value = []
|
||||
} finally {
|
||||
classroomLoading.value = false
|
||||
}
|
||||
}
|
||||
classroomLoading.value = true;
|
||||
try {
|
||||
const res = await getClassRoomByClassCode(classCode);
|
||||
if (res.data) {
|
||||
classroomList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取教室分配失败', err);
|
||||
classroomList.value = [];
|
||||
} finally {
|
||||
classroomLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 加载学生数量数据
|
||||
const loadStudentNumData = async (classCode: string) => {
|
||||
studentNumLoading.value = true
|
||||
try {
|
||||
const res = await queryStuNumByClassCode({ classCode })
|
||||
if (res.data) {
|
||||
studentNumList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取学生数量失败', err)
|
||||
studentNumList.value = []
|
||||
} finally {
|
||||
studentNumLoading.value = false
|
||||
}
|
||||
}
|
||||
studentNumLoading.value = true;
|
||||
try {
|
||||
const res = await queryStuNumByClassCode({ classCode });
|
||||
if (res.data) {
|
||||
studentNumList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取学生数量失败', err);
|
||||
studentNumList.value = [];
|
||||
} finally {
|
||||
studentNumLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 加载宿舍学生数据
|
||||
const loadDormStudentData = async (classCode: string) => {
|
||||
dormStudentLoading.value = true
|
||||
try {
|
||||
const res = await fearchStuNumByClassCode(classCode)
|
||||
if (res.data) {
|
||||
dormStudentList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取宿舍学生失败', err)
|
||||
dormStudentList.value = []
|
||||
} finally {
|
||||
dormStudentLoading.value = false
|
||||
}
|
||||
}
|
||||
dormStudentLoading.value = true;
|
||||
try {
|
||||
const res = await fearchStuNumByClassCode(classCode);
|
||||
if (res.data) {
|
||||
dormStudentList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取宿舍学生失败', err);
|
||||
dormStudentList.value = [];
|
||||
} finally {
|
||||
dormStudentLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 加载惩罚记录数据
|
||||
const loadPunishData = async (classCode: string) => {
|
||||
punishLoading.value = true
|
||||
try {
|
||||
const res = await queryPunlishNumByClass(classCode)
|
||||
if (res.data) {
|
||||
punishList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取惩罚记录失败', err)
|
||||
punishList.value = []
|
||||
} finally {
|
||||
punishLoading.value = false
|
||||
}
|
||||
}
|
||||
punishLoading.value = true;
|
||||
try {
|
||||
const res = await queryPunlishNumByClass(classCode);
|
||||
if (res.data) {
|
||||
punishList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取惩罚记录失败', err);
|
||||
punishList.value = [];
|
||||
} finally {
|
||||
punishLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 暴露方法给父组件
|
||||
defineExpose({
|
||||
openDialog
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mb20 {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,449 +1,373 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="form.id ? '编辑' : '新增'"
|
||||
v-model="visible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
width="800px">
|
||||
<el-form
|
||||
ref="dataFormRef"
|
||||
:model="form"
|
||||
:rules="dataRules"
|
||||
label-width="120px"
|
||||
:validate-on-rule-change="false"
|
||||
v-loading="loading">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学日期" prop="enterDate">
|
||||
<el-date-picker
|
||||
v-model="form.enterDate"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable width="800px">
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" :validate-on-rule-change="false" v-loading="loading">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学日期" prop="enterDate">
|
||||
<el-date-picker
|
||||
v-model="form.enterDate"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="专业" prop="majorCode">
|
||||
<el-select
|
||||
v-model="form.majorCode"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in majorList"
|
||||
:key="item.majorCode"
|
||||
:label="item.majorName"
|
||||
:value="item.majorCode">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="专业" prop="majorCode">
|
||||
<el-select v-model="form.majorCode" placeholder="请选择" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in majorList" :key="item.majorCode" :label="item.majorName" :value="item.majorCode"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="学院" prop="deptCode">
|
||||
<el-select
|
||||
v-model="form.deptCode"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in deptList"
|
||||
:key="item.deptCode"
|
||||
:label="item.deptName"
|
||||
:value="item.deptCode">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="学院" prop="deptCode">
|
||||
<el-select v-model="form.deptCode" placeholder="请选择" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in deptList" :key="item.deptCode" :label="item.deptName" :value="item.deptCode"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级代码" prop="classCode">
|
||||
<el-input
|
||||
v-model="form.classCode"
|
||||
placeholder="请输入班级代码"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级代码" prop="classCode">
|
||||
<el-input v-model="form.classCode" placeholder="请输入班级代码" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班号" prop="classNo">
|
||||
<el-input
|
||||
v-model="form.classNo"
|
||||
placeholder="自动填充班号"
|
||||
:disabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班号" prop="classNo">
|
||||
<el-input v-model="form.classNo" placeholder="自动填充班号" :disabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级名称" prop="className">
|
||||
<el-input
|
||||
v-model="form.className"
|
||||
placeholder="请输入班级名称"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级名称" prop="className">
|
||||
<el-input v-model="form.className" placeholder="请输入班级名称" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级规范名称" prop="classProName">
|
||||
<el-input
|
||||
v-model="form.classProName"
|
||||
placeholder="自动拼接班级规范名称"
|
||||
:disabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级规范名称" prop="classProName">
|
||||
<el-input v-model="form.classProName" placeholder="自动拼接班级规范名称" :disabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学年份" prop="grade">
|
||||
<el-input
|
||||
v-model="form.grade"
|
||||
placeholder="自动填充入学年份"
|
||||
:disabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学年份" prop="grade">
|
||||
<el-input v-model="form.grade" placeholder="自动填充入学年份" :disabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班主任" prop="teacherNos">
|
||||
<el-select
|
||||
v-model="form.teacherNos"
|
||||
placeholder="请选择班主任"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in teacherList"
|
||||
:key="item.teacherNo"
|
||||
:label="item.realName"
|
||||
:value="item.teacherNo">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班主任" prop="teacherNos">
|
||||
<el-select v-model="form.teacherNos" placeholder="请选择班主任" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in teacherList" :key="item.teacherNo" :label="item.realName" :value="item.teacherNo"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="预计招生人数" prop="preStuNum">
|
||||
<el-input-number
|
||||
v-model="form.preStuNum"
|
||||
:precision="0"
|
||||
:step="1"
|
||||
:min="0"
|
||||
placeholder="请输入预计招生人数"
|
||||
style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="预计招生人数" prop="preStuNum">
|
||||
<el-input-number v-model="form.preStuNum" :precision="0" :step="1" :min="0" placeholder="请输入预计招生人数" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input
|
||||
v-model="form.remark"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
placeholder="请输入备注"
|
||||
maxlength="500"
|
||||
show-word-limit />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :rows="4" placeholder="请输入备注" maxlength="500" show-word-limit />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="BasicClassDialog">
|
||||
import { ref, reactive, nextTick, onMounted, watch, computed } from 'vue'
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getDetail, addObj, putObj, getMajorNameList, getDeptList } from '/@/api/basic/basicclass'
|
||||
import { getTeacherBaseList } from '/@/api/professional/professionaluser/teacherbase'
|
||||
import { ref, reactive, nextTick, onMounted, watch, computed } from 'vue';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getDetail, addObj, putObj, getMajorNameList, getDeptList } from '/@/api/basic/basicclass';
|
||||
import { getTeacherBaseList } from '/@/api/professional/professionaluser/teacherbase';
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const majorList = ref<any[]>([])
|
||||
const deptList = ref<any[]>([])
|
||||
const teacherList = ref<any[]>([])
|
||||
const yearLast = ref('') // 年份后两位
|
||||
const majorName = ref('') // 专业名称
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const majorList = ref<any[]>([]);
|
||||
const deptList = ref<any[]>([]);
|
||||
const teacherList = ref<any[]>([]);
|
||||
const yearLast = ref(''); // 年份后两位
|
||||
const majorName = ref(''); // 专业名称
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
enterDate: '',
|
||||
majorCode: '',
|
||||
deptCode: '',
|
||||
classCode: '',
|
||||
classNo: '',
|
||||
className: '',
|
||||
classProName: '',
|
||||
grade: '',
|
||||
teacherNos: '',
|
||||
preStuNum: 0,
|
||||
remark: ''
|
||||
id: '',
|
||||
enterDate: '',
|
||||
majorCode: '',
|
||||
deptCode: '',
|
||||
classCode: '',
|
||||
classNo: '',
|
||||
className: '',
|
||||
classProName: '',
|
||||
grade: '',
|
||||
teacherNos: '',
|
||||
preStuNum: 0,
|
||||
remark: '',
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({
|
||||
enterDate: [
|
||||
{ required: true, message: '入学日期不能为空', trigger: 'change' }
|
||||
],
|
||||
majorCode: [
|
||||
{ required: true, message: '专业不能为空', trigger: 'change' }
|
||||
],
|
||||
deptCode: [
|
||||
{ required: true, message: '学院不能为空', trigger: 'change' }
|
||||
],
|
||||
classCode: [
|
||||
{ required: true, message: '班级代码不能为空', trigger: 'blur' },
|
||||
{ min: 4, message: '班级代码至少4位（班号取后4位）', trigger: 'blur' }
|
||||
],
|
||||
classNo: [
|
||||
{ required: true, message: '班号不能为空', trigger: 'blur' }
|
||||
],
|
||||
className: [
|
||||
{ required: true, message: '班级名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
classProName: [
|
||||
{ required: true, message: '班级规范名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
grade: [
|
||||
{ required: true, message: '入学年份不能为空', trigger: 'blur' }
|
||||
],
|
||||
teacherNos: [
|
||||
{ required: true, message: '请选择班主任', trigger: 'change' }
|
||||
],
|
||||
preStuNum: [
|
||||
{ required: true, message: '预计招生人数不能为空', trigger: 'blur' }
|
||||
]
|
||||
})
|
||||
enterDate: [{ required: true, message: '入学日期不能为空', trigger: 'change' }],
|
||||
majorCode: [{ required: true, message: '专业不能为空', trigger: 'change' }],
|
||||
deptCode: [{ required: true, message: '学院不能为空', trigger: 'change' }],
|
||||
classCode: [
|
||||
{ required: true, message: '班级代码不能为空', trigger: 'blur' },
|
||||
{ min: 4, message: '班级代码至少4位（班号取后4位）', trigger: 'blur' },
|
||||
],
|
||||
classNo: [{ required: true, message: '班号不能为空', trigger: 'blur' }],
|
||||
className: [{ required: true, message: '班级名称不能为空', trigger: 'blur' }],
|
||||
classProName: [{ required: true, message: '班级规范名称不能为空', trigger: 'blur' }],
|
||||
grade: [{ required: true, message: '入学年份不能为空', trigger: 'blur' }],
|
||||
teacherNos: [{ required: true, message: '请选择班主任', trigger: 'change' }],
|
||||
preStuNum: [{ required: true, message: '预计招生人数不能为空', trigger: 'blur' }],
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (id?: string) => {
|
||||
visible.value = true
|
||||
|
||||
// 重置表单数据
|
||||
Object.assign(form, {
|
||||
id: '',
|
||||
enterDate: '',
|
||||
majorCode: '',
|
||||
deptCode: '',
|
||||
classCode: '',
|
||||
classNo: '',
|
||||
className: '',
|
||||
classProName: '',
|
||||
grade: '',
|
||||
teacherNos: '',
|
||||
preStuNum: 0,
|
||||
remark: ''
|
||||
})
|
||||
|
||||
// 重置辅助变量
|
||||
yearLast.value = ''
|
||||
majorName.value = ''
|
||||
visible.value = true;
|
||||
|
||||
// 清除表单验证状态，不触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 重置表单数据
|
||||
Object.assign(form, {
|
||||
id: '',
|
||||
enterDate: '',
|
||||
majorCode: '',
|
||||
deptCode: '',
|
||||
classCode: '',
|
||||
classNo: '',
|
||||
className: '',
|
||||
classProName: '',
|
||||
grade: '',
|
||||
teacherNos: '',
|
||||
preStuNum: 0,
|
||||
remark: '',
|
||||
});
|
||||
|
||||
// 获取详情
|
||||
if (id) {
|
||||
form.id = id
|
||||
getBasicClassData(id)
|
||||
} else {
|
||||
// 新增时，确保验证状态已清除
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
}
|
||||
// 重置辅助变量
|
||||
yearLast.value = '';
|
||||
majorName.value = '';
|
||||
|
||||
// 清除表单验证状态，不触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 获取详情
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getBasicClassData(id);
|
||||
} else {
|
||||
// 新增时，确保验证状态已清除
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
// 构建提交数据，将班主任工号放到 teacherNo 字段
|
||||
const submitData = {
|
||||
...form,
|
||||
teacherNo: form.teacherNos // 将 teacherNos 的值赋值给 teacherNo
|
||||
};
|
||||
|
||||
if (form.id) {
|
||||
await putObj(submitData);
|
||||
useMessage().success('编辑成功');
|
||||
} else {
|
||||
await addObj(submitData);
|
||||
useMessage().success('新增成功');
|
||||
}
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || (form.id ? '编辑失败' : '新增失败'));
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
// 构建提交数据，将班主任工号放到 teacherNo 字段
|
||||
const submitData = {
|
||||
...form,
|
||||
teacherNo: form.teacherNos, // 将 teacherNos 的值赋值给 teacherNo
|
||||
};
|
||||
|
||||
if (form.id) {
|
||||
await putObj(submitData);
|
||||
useMessage().success('编辑成功');
|
||||
} else {
|
||||
await addObj(submitData);
|
||||
useMessage().success('新增成功');
|
||||
}
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || (form.id ? '编辑失败' : '新增失败'));
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 获取详情
|
||||
const getBasicClassData = async (id: string) => {
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await getDetail(id)
|
||||
if (res.data) {
|
||||
Object.assign(form, {
|
||||
id: res.data.id || '',
|
||||
enterDate: res.data.enterDate || '',
|
||||
majorCode: res.data.majorCode || '',
|
||||
deptCode: res.data.deptCode || '',
|
||||
classCode: res.data.classCode || '',
|
||||
classNo: res.data.classNo || '',
|
||||
className: res.data.className || '',
|
||||
classProName: res.data.classProName || '',
|
||||
grade: res.data.grade || '',
|
||||
teacherNos: res.data.teacherNos || '',
|
||||
preStuNum: res.data.preStuNum || 0,
|
||||
remark: res.data.remark || ''
|
||||
})
|
||||
|
||||
// 设置辅助变量（编辑时不自动填充，保持原有数据）
|
||||
if (res.data.enterDate && res.data.enterDate.length >= 4) {
|
||||
yearLast.value = res.data.enterDate.substring(2, 4)
|
||||
}
|
||||
// 确保专业列表已加载后再设置专业名称
|
||||
if (res.data.majorCode && majorList.value.length > 0) {
|
||||
const major = majorList.value.find(item => item.majorCode === res.data.majorCode)
|
||||
if (major) {
|
||||
majorName.value = major.majorName || ''
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取详情失败', err)
|
||||
useMessage().error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
// 数据加载完成后，清除验证状态，避免触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
}
|
||||
}
|
||||
loading.value = true;
|
||||
try {
|
||||
const res = await getDetail(id);
|
||||
if (res.data) {
|
||||
Object.assign(form, {
|
||||
id: res.data.id || '',
|
||||
enterDate: res.data.enterDate || '',
|
||||
majorCode: res.data.majorCode || '',
|
||||
deptCode: res.data.deptCode || '',
|
||||
classCode: res.data.classCode || '',
|
||||
classNo: res.data.classNo || '',
|
||||
className: res.data.className || '',
|
||||
classProName: res.data.classProName || '',
|
||||
grade: res.data.grade || '',
|
||||
teacherNos: res.data.teacherNos || '',
|
||||
preStuNum: res.data.preStuNum || 0,
|
||||
remark: res.data.remark || '',
|
||||
});
|
||||
|
||||
// 设置辅助变量（编辑时不自动填充，保持原有数据）
|
||||
if (res.data.enterDate && res.data.enterDate.length >= 4) {
|
||||
yearLast.value = res.data.enterDate.substring(2, 4);
|
||||
}
|
||||
// 确保专业列表已加载后再设置专业名称
|
||||
if (res.data.majorCode && majorList.value.length > 0) {
|
||||
const major = majorList.value.find((item) => item.majorCode === res.data.majorCode);
|
||||
if (major) {
|
||||
majorName.value = major.majorName || '';
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取详情失败', err);
|
||||
useMessage().error('获取详情失败');
|
||||
} finally {
|
||||
loading.value = false;
|
||||
// 数据加载完成后，清除验证状态，避免触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// 获取专业列表
|
||||
const getMajorListData = async () => {
|
||||
try {
|
||||
const res = await getMajorNameList()
|
||||
if (res.data) {
|
||||
majorList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取专业列表失败', err)
|
||||
majorList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getMajorNameList();
|
||||
if (res.data) {
|
||||
majorList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取专业列表失败', err);
|
||||
majorList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取学院列表
|
||||
const getDeptListData = async () => {
|
||||
try {
|
||||
const res = await getDeptList()
|
||||
if (res.data) {
|
||||
deptList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取学院列表失败', err)
|
||||
deptList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getDeptList();
|
||||
if (res.data) {
|
||||
deptList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取学院列表失败', err);
|
||||
deptList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取班主任列表
|
||||
const getTeacherListData = async () => {
|
||||
try {
|
||||
const res = await getTeacherBaseList()
|
||||
if (res.data) {
|
||||
teacherList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班主任列表失败', err)
|
||||
teacherList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getTeacherBaseList();
|
||||
if (res.data) {
|
||||
teacherList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班主任列表失败', err);
|
||||
teacherList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 拼接班级规范名称
|
||||
const montageClassProName = () => {
|
||||
// 只在新增模式下自动填充，编辑模式下不覆盖已有数据
|
||||
if (!form.id && yearLast.value && majorName.value) {
|
||||
form.classProName = yearLast.value + majorName.value
|
||||
if (form.classNo) {
|
||||
form.classProName = yearLast.value + majorName.value + '(' + form.classNo + ')'
|
||||
}
|
||||
console.log('classProName', form.classProName)
|
||||
}
|
||||
}
|
||||
// 只在新增模式下自动填充，编辑模式下不覆盖已有数据
|
||||
if (!form.id && yearLast.value && majorName.value) {
|
||||
form.classProName = yearLast.value + majorName.value;
|
||||
if (form.classNo) {
|
||||
form.classProName = yearLast.value + majorName.value + '(' + form.classNo + ')';
|
||||
}
|
||||
console.log('classProName', form.classProName);
|
||||
}
|
||||
};
|
||||
|
||||
// 监听入学日期,取年份后两位
|
||||
watch(() => form.enterDate, (newVal) => {
|
||||
if (newVal && newVal.length >= 4) {
|
||||
console.log('newdate:', newVal)
|
||||
yearLast.value = newVal.substring(2, 4)
|
||||
// 只在新增模式下自动填充入学年份
|
||||
if (!form.id) {
|
||||
form.grade = newVal.substring(0, 4)
|
||||
}
|
||||
montageClassProName()
|
||||
}
|
||||
})
|
||||
watch(
|
||||
() => form.enterDate,
|
||||
(newVal) => {
|
||||
if (newVal && newVal.length >= 4) {
|
||||
console.log('newdate:', newVal);
|
||||
yearLast.value = newVal.substring(2, 4);
|
||||
// 只在新增模式下自动填充入学年份
|
||||
if (!form.id) {
|
||||
form.grade = newVal.substring(0, 4);
|
||||
}
|
||||
montageClassProName();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 监听班级代码,取后四位为班号（班级代码至少4位）
|
||||
watch(() => form.classCode, (newVal) => {
|
||||
if (newVal) {
|
||||
const length = newVal.length
|
||||
if (length >= 4) {
|
||||
// 只在新增模式下自动填充班号，编辑模式下如果班号为空才填充
|
||||
if (!form.id || !form.classNo) {
|
||||
form.classNo = newVal.substring(length - 4, length)
|
||||
montageClassProName()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
watch(
|
||||
() => form.classCode,
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
const length = newVal.length;
|
||||
if (length >= 4) {
|
||||
// 只在新增模式下自动填充班号，编辑模式下如果班号为空才填充
|
||||
if (!form.id || !form.classNo) {
|
||||
form.classNo = newVal.substring(length - 4, length);
|
||||
montageClassProName();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 监听专业代码变化，获取专业名称
|
||||
watch(() => form.majorCode, (newVal) => {
|
||||
if (newVal) {
|
||||
const major = majorList.value.find(item => item.majorCode === newVal)
|
||||
if (major) {
|
||||
majorName.value = major.majorName || ''
|
||||
montageClassProName()
|
||||
}
|
||||
} else {
|
||||
majorName.value = ''
|
||||
montageClassProName()
|
||||
}
|
||||
})
|
||||
watch(
|
||||
() => form.majorCode,
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
const major = majorList.value.find((item) => item.majorCode === newVal);
|
||||
if (major) {
|
||||
majorName.value = major.majorName || '';
|
||||
montageClassProName();
|
||||
}
|
||||
} else {
|
||||
majorName.value = '';
|
||||
montageClassProName();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getMajorListData()
|
||||
getDeptListData()
|
||||
getTeacherListData()
|
||||
})
|
||||
getMajorListData();
|
||||
getDeptListData();
|
||||
getTeacherListData();
|
||||
});
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -1,532 +1,438 @@
|
||||
<template>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="学院" prop="deptCode">
|
||||
<el-select
|
||||
v-model="searchForm.deptCode"
|
||||
placeholder="请选择学院"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 200px"
|
||||
@change="handleDeptChange">
|
||||
<el-option
|
||||
v-for="item in deptList"
|
||||
:key="item.deptCode"
|
||||
:label="item.deptName"
|
||||
:value="item.deptCode">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="班号" prop="classNo">
|
||||
<el-input
|
||||
v-model="searchForm.classNo"
|
||||
placeholder="请输入班号"
|
||||
clearable
|
||||
style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联院" prop="isUnion">
|
||||
<el-select
|
||||
v-model="searchForm.isUnion"
|
||||
placeholder="请选择联院"
|
||||
clearable
|
||||
style="width: 200px">
|
||||
<el-option label="是" value="1" />
|
||||
<el-option label="否" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="流失率" prop="stuLoseRate">
|
||||
<el-input
|
||||
v-model="searchForm.stuLoseRate"
|
||||
placeholder="请输入流失率"
|
||||
clearable
|
||||
style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="入学年份" prop="grade">
|
||||
<el-input
|
||||
v-model="searchForm.grade"
|
||||
placeholder="请输入入学年份"
|
||||
clearable
|
||||
style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="班主任" prop="teacherRealName">
|
||||
<el-input
|
||||
v-model="searchForm.teacherRealName"
|
||||
placeholder="请输入班主任姓名"
|
||||
clearable
|
||||
style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="班级状态" prop="classStatus">
|
||||
<el-select
|
||||
v-model="searchForm.classStatus"
|
||||
placeholder="请选择班级状态"
|
||||
clearable
|
||||
style="width: 200px">
|
||||
<el-option label="正常" value="0" />
|
||||
<el-option label="离校" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="学院" prop="deptCode">
|
||||
<el-select v-model="searchForm.deptCode" placeholder="请选择学院" clearable filterable style="width: 200px" @change="handleDeptChange">
|
||||
<el-option v-for="item in deptList" :key="item.deptCode" :label="item.deptName" :value="item.deptCode"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="班号" prop="classNo">
|
||||
<el-input v-model="searchForm.classNo" placeholder="请输入班号" clearable style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联院" prop="isUnion">
|
||||
<el-select v-model="searchForm.isUnion" placeholder="请选择联院" clearable style="width: 200px">
|
||||
<el-option label="是" value="1" />
|
||||
<el-option label="否" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="流失率" prop="stuLoseRate">
|
||||
<el-input v-model="searchForm.stuLoseRate" placeholder="请输入流失率" clearable style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="入学年份" prop="grade">
|
||||
<el-input v-model="searchForm.grade" placeholder="请输入入学年份" clearable style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="班主任" prop="teacherRealName">
|
||||
<el-input v-model="searchForm.teacherRealName" placeholder="请输入班主任姓名" clearable style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="班级状态" prop="classStatus">
|
||||
<el-select v-model="searchForm.classStatus" placeholder="请选择班级状态" clearable style="width: 200px">
|
||||
<el-option label="正常" value="0" />
|
||||
<el-option label="离校" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Document /></el-icon>
|
||||
班级列表
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<el-button
|
||||
icon="FolderAdd"
|
||||
type="primary"
|
||||
@click="formDialogRef.openDialog()">
|
||||
新增
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="Link"
|
||||
type="success"
|
||||
class="ml10"
|
||||
@click="handleLinkRule">
|
||||
关联门禁规则
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="Download"
|
||||
type="warning"
|
||||
class="ml10"
|
||||
@click="handleExport">
|
||||
导出
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="DocumentAdd"
|
||||
type="info"
|
||||
class="ml10"
|
||||
@click="handleGenerateAssessment">
|
||||
生成考核班级
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
@queryTable="getDataList">
|
||||
<TableColumnControl
|
||||
ref="columnControlRef"
|
||||
:columns="tableColumns"
|
||||
v-model="visibleColumns"
|
||||
trigger-type="default"
|
||||
trigger-circle
|
||||
@change="handleColumnChange"
|
||||
@order-change="handleColumnOrderChange"
|
||||
>
|
||||
<template #trigger>
|
||||
<el-tooltip class="item" effect="dark" content="列设置" placement="top">
|
||||
<el-button circle style="margin-left: 0;">
|
||||
<el-icon><Menu /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</TableColumnControl>
|
||||
</right-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Document /></el-icon>
|
||||
班级列表
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<el-button icon="FolderAdd" type="primary" @click="formDialogRef.openDialog()"> 新增 </el-button>
|
||||
<el-button icon="Link" type="success" class="ml10" @click="handleLinkRule"> 关联门禁规则 </el-button>
|
||||
<el-button icon="Download" type="warning" class="ml10" @click="handleExport"> 导出 </el-button>
|
||||
<el-button icon="DocumentAdd" type="info" class="ml10" @click="handleGenerateAssessment"> 生成考核班级 </el-button>
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" @queryTable="getDataList">
|
||||
<TableColumnControl
|
||||
ref="columnControlRef"
|
||||
:columns="tableColumns"
|
||||
v-model="visibleColumns"
|
||||
trigger-type="default"
|
||||
trigger-circle
|
||||
@change="handleColumnChange"
|
||||
@order-change="handleColumnOrderChange"
|
||||
>
|
||||
<template #trigger>
|
||||
<el-tooltip class="item" effect="dark" content="列设置" placement="top">
|
||||
<el-button circle style="margin-left: 0">
|
||||
<el-icon><Menu /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</TableColumnControl>
|
||||
</right-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table"
|
||||
row-key="id"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #header>
|
||||
<el-icon><List /></el-icon>
|
||||
</template>
|
||||
<template #default="{ $index }">
|
||||
{{ $index + 1 + ((state.pagination?.current || 1) - 1) * (state.pagination?.size || 10) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="col in visibleColumnsSorted"
|
||||
:key="col.prop"
|
||||
:prop="col.prop"
|
||||
:label="col.label"
|
||||
:width="col.width"
|
||||
:min-width="col.minWidth"
|
||||
:show-overflow-tooltip="col.showOverflowTooltip !== false"
|
||||
:align="col.align">
|
||||
<template #header>
|
||||
<el-icon v-if="col.icon"><component :is="col.icon" /></el-icon>
|
||||
<span :style="{ marginLeft: col.icon ? '4px' : '0' }">{{ col.label }}</span>
|
||||
</template>
|
||||
<template #default="scope" v-if="col.prop === 'stuNum'">
|
||||
<el-tag size="small" type="primary" effect="plain">
|
||||
{{ scope.row.stuNum || 0 }}/{{ scope.row.preStuNum || 0 }}
|
||||
</el-tag>
|
||||
</template>
|
||||
<template #default="scope" v-else-if="col.prop === 'classStatus'">
|
||||
<StatusTag
|
||||
:value="scope.row.classStatus"
|
||||
:options="[{ label: '正常', value: '0' }, { label: '离校', value: '1' }]"
|
||||
:type-map="{ '0': { type: 'success', effect: 'light' }, '1': { type: 'warning', effect: 'light' } }"
|
||||
/>
|
||||
</template>
|
||||
<template #default="scope" v-else-if="col.prop === 'stuLoseRate'">
|
||||
<el-tag size="small" type="danger" effect="plain">
|
||||
{{ scope.row.stuLoseRate ? `${scope.row.stuLoseRate}%` : '0%' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" fixed="right" width="260">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
icon="View"
|
||||
link
|
||||
type="primary"
|
||||
@click="handleViewDetail(scope.row)">
|
||||
班级概况
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="Edit"
|
||||
link
|
||||
type="primary"
|
||||
@click="formDialogRef.openDialog(scope.row.id)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="Delete"
|
||||
link
|
||||
type="danger"
|
||||
@click="handleDelete([scope.row.id])">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table"
|
||||
row-key="id"
|
||||
@selection-change="handleSelectionChange"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #header>
|
||||
<el-icon><List /></el-icon>
|
||||
</template>
|
||||
<template #default="{ $index }">
|
||||
{{ $index + 1 + ((state.pagination?.current || 1) - 1) * (state.pagination?.size || 10) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="col in visibleColumnsSorted"
|
||||
:key="col.prop"
|
||||
:prop="col.prop"
|
||||
:label="col.label"
|
||||
:width="col.width"
|
||||
:min-width="col.minWidth"
|
||||
:show-overflow-tooltip="col.showOverflowTooltip !== false"
|
||||
:align="col.align"
|
||||
>
|
||||
<template #header>
|
||||
<el-icon v-if="col.icon"><component :is="col.icon" /></el-icon>
|
||||
<span :style="{ marginLeft: col.icon ? '4px' : '0' }">{{ col.label }}</span>
|
||||
</template>
|
||||
<template #default="scope" v-if="col.prop === 'stuNum'">
|
||||
<el-tag size="small" type="primary" effect="plain"> {{ scope.row.stuNum || 0 }}/{{ scope.row.preStuNum || 0 }} </el-tag>
|
||||
</template>
|
||||
<template #default="scope" v-else-if="col.prop === 'classStatus'">
|
||||
<StatusTag
|
||||
:value="scope.row.classStatus"
|
||||
:options="[
|
||||
{ label: '正常', value: '0' },
|
||||
{ label: '离校', value: '1' },
|
||||
]"
|
||||
:type-map="{ '0': { type: 'success', effect: 'light' }, '1': { type: 'warning', effect: 'light' } }"
|
||||
/>
|
||||
</template>
|
||||
<template #default="scope" v-else-if="col.prop === 'stuLoseRate'">
|
||||
<el-tag size="small" type="danger" effect="plain">
|
||||
{{ scope.row.stuLoseRate ? `${scope.row.stuLoseRate}%` : '0%' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" fixed="right" width="260">
|
||||
<template #default="scope">
|
||||
<el-button icon="View" link type="primary" @click="handleViewDetail(scope.row)"> 班级概况 </el-button>
|
||||
<el-button icon="Edit" link type="primary" @click="formDialogRef.openDialog(scope.row.id)"> 编辑 </el-button>
|
||||
<el-button icon="Delete" link type="danger" @click="handleDelete([scope.row.id])"> 删除 </el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<div class="pagination-wrapper">
|
||||
<pagination
|
||||
@size-change="sizeChangeHandle"
|
||||
@current-change="currentChangeHandle"
|
||||
v-bind="state.pagination" />
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<div class="pagination-wrapper">
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<!-- 编辑、新增 -->
|
||||
<FormDialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<!-- 班级概况详情 -->
|
||||
<DetailDialog ref="detailDialogRef" />
|
||||
|
||||
<!-- 关联门禁规则对话框 -->
|
||||
<el-dialog
|
||||
title="关联门禁规则"
|
||||
v-model="linkRuleDialogVisible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
width="600px">
|
||||
<el-form :model="linkRuleForm" label-width="120px">
|
||||
<el-form-item label="选择规则">
|
||||
<el-select
|
||||
v-model="linkRuleForm.ruleId"
|
||||
placeholder="请选择门禁规则"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in ruleList"
|
||||
:key="item.id"
|
||||
:label="item.ruleName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="linkRuleDialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="confirmLinkRule" :loading="linkRuleLoading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<!-- 编辑、新增 -->
|
||||
<FormDialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||
|
||||
<!-- 班级概况详情 -->
|
||||
<DetailDialog ref="detailDialogRef" />
|
||||
|
||||
<!-- 关联门禁规则对话框 -->
|
||||
<el-dialog title="关联门禁规则" v-model="linkRuleDialogVisible" :close-on-click-modal="false" draggable width="600px">
|
||||
<el-form :model="linkRuleForm" label-width="120px">
|
||||
<el-form-item label="选择规则">
|
||||
<el-select v-model="linkRuleForm.ruleId" placeholder="请选择门禁规则" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in ruleList" :key="item.id" :label="item.ruleName" :value="item.id"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="linkRuleDialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="confirmLinkRule" :loading="linkRuleLoading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="BasicClass">
|
||||
import { ref, reactive, defineAsyncComponent, computed, onMounted } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList, delObj, putObjs, classExportData, getDeptList, getClassListByRole } from "/@/api/basic/basicclass";
|
||||
import { makeExportClassOverviewTask } from "/@/api/stuwork/file";
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
||||
import { fetchList as getRuleList } from "/@/api/stuwork/entrancerule";
|
||||
import TableColumnControl from '/@/components/TableColumnControl/index.vue'
|
||||
import { List, OfficeBuilding, Grid, Document, UserFilled, Phone, User, Lock, CircleCheck, TrendCharts, Setting, Menu, Search } from '@element-plus/icons-vue'
|
||||
import { useTableColumnControl } from '/@/hooks/tableColumn'
|
||||
import { defineAsyncComponent as defineStatusTag } from 'vue'
|
||||
const StatusTag = defineStatusTag(() => import('/@/components/StatusTag/index.vue'))
|
||||
import { ref, reactive, defineAsyncComponent, computed, onMounted } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList, delObj, putObjs, classExportData, getDeptList, getClassListByRole } from '/@/api/basic/basicclass';
|
||||
import { makeExportClassOverviewTask } from '/@/api/stuwork/file';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { fetchList as getRuleList } from '/@/api/stuwork/entrancerule';
|
||||
import TableColumnControl from '/@/components/TableColumnControl/index.vue';
|
||||
import {
|
||||
List,
|
||||
OfficeBuilding,
|
||||
Grid,
|
||||
Document,
|
||||
UserFilled,
|
||||
Phone,
|
||||
User,
|
||||
Lock,
|
||||
CircleCheck,
|
||||
TrendCharts,
|
||||
Setting,
|
||||
Menu,
|
||||
Search,
|
||||
} from '@element-plus/icons-vue';
|
||||
import { useTableColumnControl } from '/@/hooks/tableColumn';
|
||||
import { defineAsyncComponent as defineStatusTag } from 'vue';
|
||||
const StatusTag = defineStatusTag(() => import('/@/components/StatusTag/index.vue'));
|
||||
|
||||
// 引入组件
|
||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
||||
const DetailDialog = defineAsyncComponent(() => import('./detail.vue'));
|
||||
|
||||
// 定义变量内容
|
||||
const route = useRoute()
|
||||
const formDialogRef = ref()
|
||||
const detailDialogRef = ref()
|
||||
const searchFormRef = ref()
|
||||
const columnControlRef = ref()
|
||||
const route = useRoute();
|
||||
const formDialogRef = ref();
|
||||
const detailDialogRef = ref();
|
||||
const searchFormRef = ref();
|
||||
const columnControlRef = ref();
|
||||
// 搜索变量
|
||||
const showSearch = ref(true)
|
||||
const deptList = ref<any[]>([])
|
||||
const classList = ref<any[]>([])
|
||||
const ruleList = ref<any[]>([])
|
||||
const linkRuleDialogVisible = ref(false)
|
||||
const linkRuleLoading = ref(false)
|
||||
const selectedClassCodes = ref<string[]>([])
|
||||
const showSearch = ref(true);
|
||||
const deptList = ref<any[]>([]);
|
||||
const classList = ref<any[]>([]);
|
||||
const ruleList = ref<any[]>([]);
|
||||
const linkRuleDialogVisible = ref(false);
|
||||
const linkRuleLoading = ref(false);
|
||||
const selectedClassCodes = ref<string[]>([]);
|
||||
|
||||
// 表格列配置
|
||||
const tableColumns = [
|
||||
{ prop: 'deptName', label: '学院', icon: OfficeBuilding },
|
||||
{ prop: 'classNo', label: '班号', icon: Grid },
|
||||
{ prop: 'classProName', label: '班级规范名称', icon: Document },
|
||||
{ prop: 'teacherRealName', label: '班主任', icon: UserFilled },
|
||||
{ prop: 'teacherTel', label: '班主任电话号码', icon: Phone },
|
||||
{ prop: 'stuNum', label: '班级人数/原始人数', icon: User },
|
||||
{ prop: 'ruleName', label: '门禁规则', icon: Lock },
|
||||
{ prop: 'classStatus', label: '班级状态', icon: CircleCheck },
|
||||
{ prop: 'stuLoseRate', label: '流失率', icon: TrendCharts }
|
||||
]
|
||||
{ prop: 'deptName', label: '学院', icon: OfficeBuilding },
|
||||
{ prop: 'classNo', label: '班号', icon: Grid },
|
||||
{ prop: 'classProName', label: '班级规范名称', icon: Document },
|
||||
{ prop: 'teacherRealName', label: '班主任', icon: UserFilled },
|
||||
{ prop: 'teacherTel', label: '班主任电话号码', icon: Phone },
|
||||
{ prop: 'stuNum', label: '班级人数/原始人数', icon: User },
|
||||
{ prop: 'ruleName', label: '门禁规则', icon: Lock },
|
||||
{ prop: 'classStatus', label: '班级状态', icon: CircleCheck },
|
||||
{ prop: 'stuLoseRate', label: '流失率', icon: TrendCharts },
|
||||
];
|
||||
|
||||
// 使用表格列控制hook
|
||||
const {
|
||||
visibleColumns,
|
||||
visibleColumnsSorted,
|
||||
checkColumnVisible,
|
||||
handleColumnChange,
|
||||
handleColumnOrderChange
|
||||
} = useTableColumnControl(tableColumns)
|
||||
const { visibleColumns, visibleColumnsSorted, checkColumnVisible, handleColumnChange, handleColumnOrderChange } = useTableColumnControl(tableColumns);
|
||||
|
||||
// 搜索表单
|
||||
const searchForm = reactive({
|
||||
deptCode: '',
|
||||
classNo: '',
|
||||
isUnion: '',
|
||||
stuLoseRate: '',
|
||||
grade: '',
|
||||
teacherRealName: '',
|
||||
classStatus: ''
|
||||
})
|
||||
deptCode: '',
|
||||
classNo: '',
|
||||
isUnion: '',
|
||||
stuLoseRate: '',
|
||||
grade: '',
|
||||
teacherRealName: '',
|
||||
classStatus: '',
|
||||
});
|
||||
|
||||
// 关联门禁规则表单
|
||||
const linkRuleForm = reactive({
|
||||
ruleId: ''
|
||||
})
|
||||
ruleId: '',
|
||||
});
|
||||
|
||||
// 配置 useTable
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: searchForm,
|
||||
pageList: fetchList,
|
||||
props: {
|
||||
item: 'records',
|
||||
totalCount: 'total'
|
||||
},
|
||||
createdIsNeed: true
|
||||
})
|
||||
queryForm: searchForm,
|
||||
pageList: fetchList,
|
||||
props: {
|
||||
item: 'records',
|
||||
totalCount: 'total',
|
||||
},
|
||||
createdIsNeed: true,
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
tableStyle
|
||||
} = useTable(state)
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, tableStyle } = useTable(state);
|
||||
|
||||
// 表格多选
|
||||
const handleSelectionChange = (rows: any[]) => {
|
||||
selectedClassCodes.value = (rows || [])
|
||||
.map((item) => item.classCode)
|
||||
.filter((item) => !!item)
|
||||
}
|
||||
selectedClassCodes.value = (rows || []).map((item) => item.classCode).filter((item) => !!item);
|
||||
};
|
||||
|
||||
// 学院选择变化
|
||||
const handleDeptChange = () => {
|
||||
// 可以根据需要清空班号选择
|
||||
}
|
||||
// 可以根据需要清空班号选择
|
||||
};
|
||||
|
||||
// 查询
|
||||
const handleSearch = () => {
|
||||
getDataList()
|
||||
}
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 重置
|
||||
const handleReset = () => {
|
||||
searchFormRef.value?.resetFields()
|
||||
searchForm.deptCode = ''
|
||||
searchForm.classNo = ''
|
||||
searchForm.isUnion = ''
|
||||
searchForm.stuLoseRate = ''
|
||||
searchForm.grade = ''
|
||||
searchForm.teacherRealName = ''
|
||||
searchForm.classStatus = ''
|
||||
getDataList()
|
||||
}
|
||||
searchFormRef.value?.resetFields();
|
||||
searchForm.deptCode = '';
|
||||
searchForm.classNo = '';
|
||||
searchForm.isUnion = '';
|
||||
searchForm.stuLoseRate = '';
|
||||
searchForm.grade = '';
|
||||
searchForm.teacherRealName = '';
|
||||
searchForm.classStatus = '';
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 删除
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm('确定要删除选中的记录吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
} catch {
|
||||
return
|
||||
}
|
||||
try {
|
||||
await useMessageBox().confirm('确定要删除选中的记录吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
});
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
// 根据API文件，delObj接受单个id，需要循环删除
|
||||
for (const id of ids) {
|
||||
await delObj(id)
|
||||
}
|
||||
useMessage().success('删除成功')
|
||||
getDataList()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '删除失败')
|
||||
}
|
||||
}
|
||||
try {
|
||||
// 根据API文件，delObj接受单个id，需要循环删除
|
||||
for (const id of ids) {
|
||||
await delObj(id);
|
||||
}
|
||||
useMessage().success('删除成功');
|
||||
getDataList();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '删除失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 查看班级概况 - 直接使用表格行数据
|
||||
const handleViewDetail = (row: any) => {
|
||||
if (detailDialogRef.value) {
|
||||
detailDialogRef.value.openDialog(row)
|
||||
}
|
||||
}
|
||||
if (detailDialogRef.value) {
|
||||
detailDialogRef.value.openDialog(row);
|
||||
}
|
||||
};
|
||||
|
||||
// 关联门禁规则
|
||||
const handleLinkRule = () => {
|
||||
if (!selectedClassCodes.value.length) {
|
||||
useMessage().warning('请先勾选要关联的班级')
|
||||
return
|
||||
}
|
||||
linkRuleDialogVisible.value = true
|
||||
linkRuleForm.ruleId = ''
|
||||
// 加载规则列表
|
||||
getRuleListData()
|
||||
}
|
||||
if (!selectedClassCodes.value.length) {
|
||||
useMessage().warning('请先勾选要关联的班级');
|
||||
return;
|
||||
}
|
||||
linkRuleDialogVisible.value = true;
|
||||
linkRuleForm.ruleId = '';
|
||||
// 加载规则列表
|
||||
getRuleListData();
|
||||
};
|
||||
|
||||
// 确认关联门禁规则
|
||||
const confirmLinkRule = async () => {
|
||||
if (!selectedClassCodes.value.length) {
|
||||
useMessage().warning('请先勾选要关联的班级')
|
||||
return
|
||||
}
|
||||
if (!linkRuleForm.ruleId) {
|
||||
useMessage().warning('请选择门禁规则')
|
||||
return
|
||||
}
|
||||
if (!selectedClassCodes.value.length) {
|
||||
useMessage().warning('请先勾选要关联的班级');
|
||||
return;
|
||||
}
|
||||
if (!linkRuleForm.ruleId) {
|
||||
useMessage().warning('请选择门禁规则');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
linkRuleLoading.value = true
|
||||
await putObjs({
|
||||
ruleId: linkRuleForm.ruleId,
|
||||
classCodes: selectedClassCodes.value
|
||||
})
|
||||
useMessage().success('关联成功')
|
||||
linkRuleDialogVisible.value = false
|
||||
getDataList()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '关联失败')
|
||||
} finally {
|
||||
linkRuleLoading.value = false
|
||||
}
|
||||
}
|
||||
try {
|
||||
linkRuleLoading.value = true;
|
||||
await putObjs({
|
||||
ruleId: linkRuleForm.ruleId,
|
||||
classCodes: selectedClassCodes.value,
|
||||
});
|
||||
useMessage().success('关联成功');
|
||||
linkRuleDialogVisible.value = false;
|
||||
getDataList();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '关联失败');
|
||||
} finally {
|
||||
linkRuleLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 导出
|
||||
const handleExport = async () => {
|
||||
try {
|
||||
await makeExportClassOverviewTask(searchForm)
|
||||
useMessage().success('导出任务已创建，请在文件管理中下载')
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导出失败')
|
||||
}
|
||||
}
|
||||
try {
|
||||
await makeExportClassOverviewTask(searchForm);
|
||||
useMessage().success('导出任务已创建，请在文件管理中下载');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导出失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 生成考核班级（占位，待确认接口）
|
||||
const handleGenerateAssessment = () => {
|
||||
useMessage().warning('生成考核班级功能待确认接口后启用')
|
||||
}
|
||||
useMessage().warning('生成考核班级功能待确认接口后启用');
|
||||
};
|
||||
|
||||
// 获取学院列表
|
||||
const getDeptListData = async () => {
|
||||
try {
|
||||
const res = await getDeptList()
|
||||
if (res.data) {
|
||||
deptList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取学院列表失败', err)
|
||||
deptList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getDeptList();
|
||||
if (res.data) {
|
||||
deptList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取学院列表失败', err);
|
||||
deptList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取班号列表
|
||||
const getClassListData = async () => {
|
||||
try {
|
||||
const res = await getClassListByRole()
|
||||
if (res.data) {
|
||||
classList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班号列表失败', err)
|
||||
classList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getClassListByRole();
|
||||
if (res.data) {
|
||||
classList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班号列表失败', err);
|
||||
classList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取门禁规则列表
|
||||
const getRuleListData = async () => {
|
||||
try {
|
||||
const res = await getRuleList({ current: 1, size: 9999 })
|
||||
if (res.data && res.data.records) {
|
||||
ruleList.value = Array.isArray(res.data.records) ? res.data.records : []
|
||||
} else if (Array.isArray(res.data)) {
|
||||
ruleList.value = res.data
|
||||
} else {
|
||||
ruleList.value = []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取门禁规则列表失败', err)
|
||||
ruleList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getRuleList({ current: 1, size: 9999 });
|
||||
if (res.data && res.data.records) {
|
||||
ruleList.value = Array.isArray(res.data.records) ? res.data.records : [];
|
||||
} else if (Array.isArray(res.data)) {
|
||||
ruleList.value = res.data;
|
||||
} else {
|
||||
ruleList.value = [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取门禁规则列表失败', err);
|
||||
ruleList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getDeptListData()
|
||||
getClassListData()
|
||||
})
|
||||
getDeptListData();
|
||||
getClassListData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@@ -1,117 +1,94 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="简单信息维护"
|
||||
v-model="visible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
width="600px">
|
||||
<el-form
|
||||
ref="dataFormRef"
|
||||
:model="form"
|
||||
:rules="dataRules"
|
||||
label-width="120px"
|
||||
:validate-on-rule-change="false"
|
||||
v-loading="loading">
|
||||
<el-form-item label="姓名" prop="realName">
|
||||
<el-input
|
||||
v-model="form.realName"
|
||||
placeholder="请输入姓名"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="曾用名" prop="oldName">
|
||||
<el-input
|
||||
v-model="form.oldName"
|
||||
placeholder="请输入曾用名"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号" prop="idCard">
|
||||
<el-input
|
||||
v-model="form.idCard"
|
||||
placeholder="请输入身份证号"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-dialog title="简单信息维护" v-model="visible" :close-on-click-modal="false" draggable width="600px">
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="120px" :validate-on-rule-change="false" v-loading="loading">
|
||||
<el-form-item label="姓名" prop="realName">
|
||||
<el-input v-model="form.realName" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="曾用名" prop="oldName">
|
||||
<el-input v-model="form.oldName" placeholder="请输入曾用名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号" prop="idCard">
|
||||
<el-input v-model="form.idCard" placeholder="请输入身份证号" clearable />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="SimpleEditDialog">
|
||||
import { ref, reactive, nextTick } from 'vue'
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { updateStuSimpleInfo } from '/@/api/basic/basicstudent'
|
||||
import { ref, reactive, nextTick } from 'vue';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { updateStuSimpleInfo } from '/@/api/basic/basicstudent';
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
realName: '',
|
||||
oldName: '',
|
||||
idCard: ''
|
||||
id: '',
|
||||
realName: '',
|
||||
oldName: '',
|
||||
idCard: '',
|
||||
});
|
||||
|
||||
// 定义校验规则 - 只有姓名和身份证号是必填的，曾用名不是必填
|
||||
const dataRules = ref({
|
||||
realName: [
|
||||
{ required: true, message: '姓名不能为空', trigger: 'blur' }
|
||||
],
|
||||
idCard: [
|
||||
{ required: true, message: '身份证号不能为空', trigger: 'blur' },
|
||||
{ pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '请输入正确的身份证号', trigger: 'blur' }
|
||||
]
|
||||
// oldName 不是必填，不需要验证规则
|
||||
})
|
||||
realName: [{ required: true, message: '姓名不能为空', trigger: 'blur' }],
|
||||
idCard: [
|
||||
{ required: true, message: '身份证号不能为空', trigger: 'blur' },
|
||||
{ pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '请输入正确的身份证号', trigger: 'blur' },
|
||||
],
|
||||
// oldName 不是必填，不需要验证规则
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (rowData: any) => {
|
||||
visible.value = true
|
||||
|
||||
// 重置表单数据
|
||||
Object.assign(form, {
|
||||
id: rowData.id || '',
|
||||
realName: rowData.realName || '',
|
||||
oldName: rowData.oldName || '',
|
||||
idCard: rowData.idCard || ''
|
||||
})
|
||||
visible.value = true;
|
||||
|
||||
// 清除表单验证状态
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 重置表单数据
|
||||
Object.assign(form, {
|
||||
id: rowData.id || '',
|
||||
realName: rowData.realName || '',
|
||||
oldName: rowData.oldName || '',
|
||||
idCard: rowData.idCard || '',
|
||||
});
|
||||
|
||||
// 清除表单验证状态
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
};
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
await updateStuSimpleInfo(form);
|
||||
useMessage().success('更新成功');
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '更新失败');
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
await updateStuSimpleInfo(form);
|
||||
useMessage().success('更新成功');
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '更新失败');
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 暴露方法给父组件
|
||||
defineExpose({
|
||||
openDialog
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,213 +1,194 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="班级概况"
|
||||
v-model="visible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
width="1400px">
|
||||
<div v-loading="loading">
|
||||
<!-- 基本信息 -->
|
||||
<el-descriptions :column="3" border v-if="detailData" class="mb20">
|
||||
<el-descriptions-item label="班号">{{ detailData.classNo || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级名称">{{ detailData.className || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级规范名称">{{ detailData.classProName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学院">{{ detailData.deptName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任">{{ detailData.teacherRealName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任电话">{{ detailData.teacherTel || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学年份">{{ detailData.grade || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学时间">{{ detailData.enterDate || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级状态">
|
||||
<span>{{ detailData.classStatus === '0' ? '正常' : detailData.classStatus === '1' ? '离校' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="班级人数/原始人数">
|
||||
{{ detailData.stuNum || 0 }}/{{ detailData.preStuNum || 0 }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="流失率">
|
||||
<span>{{ detailData.stuLoseRate ? `${detailData.stuLoseRate}%` : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联院">
|
||||
<span>{{ detailData.isUnion === 1 ? '是' : detailData.isUnion === 0 ? '否' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="门禁规则" :span="3">{{ detailData.ruleName || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-dialog title="班级概况" v-model="visible" :close-on-click-modal="false" draggable width="1400px">
|
||||
<div v-loading="loading">
|
||||
<!-- 基本信息 -->
|
||||
<el-descriptions :column="3" border v-if="detailData" class="mb20">
|
||||
<el-descriptions-item label="班号">{{ detailData.classNo || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级名称">{{ detailData.className || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级规范名称">{{ detailData.classProName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学院">{{ detailData.deptName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任">{{ detailData.teacherRealName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班主任电话">{{ detailData.teacherTel || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学年份">{{ detailData.grade || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学时间">{{ detailData.enterDate || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级状态">
|
||||
<span>{{ detailData.classStatus === '0' ? '正常' : detailData.classStatus === '1' ? '离校' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="班级人数/原始人数"> {{ detailData.stuNum || 0 }}/{{ detailData.preStuNum || 0 }} </el-descriptions-item>
|
||||
<el-descriptions-item label="流失率">
|
||||
<span>{{ detailData.stuLoseRate ? `${detailData.stuLoseRate}%` : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="联院">
|
||||
<span>{{ detailData.isUnion === 1 ? '是' : detailData.isUnion === 0 ? '否' : '-' }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="门禁规则" :span="3">{{ detailData.ruleName || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<!-- 详细信息 - 使用 tabs 展示六个接口的数据 -->
|
||||
<el-tabs v-model="activeTab" type="border-card">
|
||||
<el-tab-pane label="班级荣誉" name="honor">
|
||||
<el-table :data="honorList" border style="width: 100%" v-loading="honorLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
</el-table>
|
||||
<div v-if="honorList.length === 0 && !honorLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<!-- 详细信息 - 使用 tabs 展示六个接口的数据 -->
|
||||
<el-tabs v-model="activeTab" type="border-card">
|
||||
<el-tab-pane label="班级荣誉" name="honor">
|
||||
<el-table :data="honorList" border style="width: 100%" v-loading="honorLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
</el-table>
|
||||
<div v-if="honorList.length === 0 && !honorLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="班级宣传" name="publicity">
|
||||
<el-table :data="publicityList" border style="width: 100%" v-loading="publicityLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
<el-table-column prop="website" label="网址" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="publicityList.length === 0 && !publicityLoading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="班级宣传" name="publicity">
|
||||
<el-table :data="publicityList" border style="width: 100%" v-loading="publicityLoading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="author" label="作者" width="120" />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
<el-table-column prop="belong" label="归档级别" width="120" />
|
||||
<el-table-column prop="website" label="网址" show-overflow-tooltip />
|
||||
</el-table>
|
||||
<div v-if="publicityList.length === 0 && !publicityLoading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="数据3" name="data3">
|
||||
<el-table :data="data3List" border style="width: 100%" v-loading="data3Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data3List.length === 0 && !data3Loading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="数据3" name="data3">
|
||||
<el-table :data="data3List" border style="width: 100%" v-loading="data3Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data3List.length === 0 && !data3Loading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="数据4" name="data4">
|
||||
<el-table :data="data4List" border style="width: 100%" v-loading="data4Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data4List.length === 0 && !data4Loading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="数据4" name="data4">
|
||||
<el-table :data="data4List" border style="width: 100%" v-loading="data4Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data4List.length === 0 && !data4Loading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="数据5" name="data5">
|
||||
<el-table :data="data5List" border style="width: 100%" v-loading="data5Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data5List.length === 0 && !data5Loading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="数据5" name="data5">
|
||||
<el-table :data="data5List" border style="width: 100%" v-loading="data5Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data5List.length === 0 && !data5Loading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="数据6" name="data6">
|
||||
<el-table :data="data6List" border style="width: 100%" v-loading="data6Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data6List.length === 0 && !data6Loading" style="text-align: center; padding: 20px; color: #909399;">
|
||||
暂无数据
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">关 闭</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-tab-pane label="数据6" name="data6">
|
||||
<el-table :data="data6List" border style="width: 100%" v-loading="data6Loading">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="更新时间" width="120" />
|
||||
</el-table>
|
||||
<div v-if="data6List.length === 0 && !data6Loading" style="text-align: center; padding: 20px; color: #909399">暂无数据</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">关 闭</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="BasicClassDetail">
|
||||
import { ref, watch } from 'vue'
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { queryClassHonorByClassCode } from '/@/api/stuwork/classhonor'
|
||||
import { queryDataByClassCode } from '/@/api/stuwork/classpublicity'
|
||||
import { ref, watch } from 'vue';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { queryClassHonorByClassCode } from '/@/api/stuwork/classhonor';
|
||||
import { queryDataByClassCode } from '/@/api/stuwork/classpublicity';
|
||||
|
||||
// 定义变量内容
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const detailData = ref<any>(null)
|
||||
const activeTab = ref('honor')
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const detailData = ref<any>(null);
|
||||
const activeTab = ref('honor');
|
||||
|
||||
// 六个接口的数据
|
||||
const honorList = ref<any[]>([])
|
||||
const honorLoading = ref(false)
|
||||
const publicityList = ref<any[]>([])
|
||||
const publicityLoading = ref(false)
|
||||
const data3List = ref<any[]>([])
|
||||
const data3Loading = ref(false)
|
||||
const data4List = ref<any[]>([])
|
||||
const data4Loading = ref(false)
|
||||
const data5List = ref<any[]>([])
|
||||
const data5Loading = ref(false)
|
||||
const data6List = ref<any[]>([])
|
||||
const data6Loading = ref(false)
|
||||
const honorList = ref<any[]>([]);
|
||||
const honorLoading = ref(false);
|
||||
const publicityList = ref<any[]>([]);
|
||||
const publicityLoading = ref(false);
|
||||
const data3List = ref<any[]>([]);
|
||||
const data3Loading = ref(false);
|
||||
const data4List = ref<any[]>([]);
|
||||
const data4Loading = ref(false);
|
||||
const data5List = ref<any[]>([]);
|
||||
const data5Loading = ref(false);
|
||||
const data6List = ref<any[]>([]);
|
||||
const data6Loading = ref(false);
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = async (rowData: any) => {
|
||||
visible.value = true
|
||||
detailData.value = rowData || null
|
||||
|
||||
// 如果有班级代码，加载六个接口的数据
|
||||
if (rowData?.classCode) {
|
||||
await loadAllData(rowData.classCode)
|
||||
}
|
||||
}
|
||||
visible.value = true;
|
||||
detailData.value = rowData || null;
|
||||
|
||||
// 如果有班级代码，加载六个接口的数据
|
||||
if (rowData?.classCode) {
|
||||
await loadAllData(rowData.classCode);
|
||||
}
|
||||
};
|
||||
|
||||
// 加载所有六个接口的数据
|
||||
const loadAllData = async (classCode: string) => {
|
||||
loading.value = true
|
||||
|
||||
// 并行加载所有接口数据
|
||||
await Promise.all([
|
||||
loadHonorData(classCode),
|
||||
loadPublicityData(classCode),
|
||||
// TODO: 添加其他四个接口的加载
|
||||
// loadData3(classCode),
|
||||
// loadData4(classCode),
|
||||
// loadData5(classCode),
|
||||
// loadData6(classCode),
|
||||
])
|
||||
|
||||
loading.value = false
|
||||
}
|
||||
loading.value = true;
|
||||
|
||||
// 并行加载所有接口数据
|
||||
await Promise.all([
|
||||
loadHonorData(classCode),
|
||||
loadPublicityData(classCode),
|
||||
// TODO: 添加其他四个接口的加载
|
||||
// loadData3(classCode),
|
||||
// loadData4(classCode),
|
||||
// loadData5(classCode),
|
||||
// loadData6(classCode),
|
||||
]);
|
||||
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
// 加载班级荣誉数据
|
||||
const loadHonorData = async (classCode: string) => {
|
||||
honorLoading.value = true
|
||||
try {
|
||||
const res = await queryClassHonorByClassCode(classCode)
|
||||
if (res.data) {
|
||||
honorList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级荣誉失败', err)
|
||||
honorList.value = []
|
||||
} finally {
|
||||
honorLoading.value = false
|
||||
}
|
||||
}
|
||||
honorLoading.value = true;
|
||||
try {
|
||||
const res = await queryClassHonorByClassCode(classCode);
|
||||
if (res.data) {
|
||||
honorList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级荣誉失败', err);
|
||||
honorList.value = [];
|
||||
} finally {
|
||||
honorLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 加载班级宣传数据
|
||||
const loadPublicityData = async (classCode: string) => {
|
||||
publicityLoading.value = true
|
||||
try {
|
||||
const res = await queryDataByClassCode(classCode)
|
||||
if (res.data) {
|
||||
publicityList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级宣传失败', err)
|
||||
publicityList.value = []
|
||||
} finally {
|
||||
publicityLoading.value = false
|
||||
}
|
||||
}
|
||||
publicityLoading.value = true;
|
||||
try {
|
||||
const res = await queryDataByClassCode(classCode);
|
||||
if (res.data) {
|
||||
publicityList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err: any) {
|
||||
console.error('获取班级宣传失败', err);
|
||||
publicityList.value = [];
|
||||
} finally {
|
||||
publicityLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 暴露方法给父组件
|
||||
defineExpose({
|
||||
openDialog
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mb20 {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,536 +1,407 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="form.id ? '编辑' : '新增'"
|
||||
v-model="visible"
|
||||
:close-on-click-modal="false"
|
||||
draggable
|
||||
width="900px">
|
||||
<el-form
|
||||
ref="dataFormRef"
|
||||
:model="form"
|
||||
:rules="dataRules"
|
||||
label-width="140px"
|
||||
:validate-on-rule-change="false"
|
||||
v-loading="loading">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="姓名" prop="realName">
|
||||
<el-input
|
||||
v-model="form.realName"
|
||||
placeholder="请输入姓名"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable width="900px">
|
||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="140px" :validate-on-rule-change="false" v-loading="loading">
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="姓名" prop="realName">
|
||||
<el-input v-model="form.realName" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="身份证" prop="idCard">
|
||||
<el-input
|
||||
v-model="form.idCard"
|
||||
placeholder="请输入身份证号"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="身份证" prop="idCard">
|
||||
<el-input v-model="form.idCard" placeholder="请输入身份证号" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-select
|
||||
v-model="form.sex"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
style="width: 100%">
|
||||
<el-option label="男" value="1" />
|
||||
<el-option label="女" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-select v-model="form.sex" placeholder="请选择" clearable style="width: 100%">
|
||||
<el-option label="男" value="1" />
|
||||
<el-option label="女" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="出生日期" prop="birthday">
|
||||
<el-date-picker
|
||||
v-model="form.birthday"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="出生日期" prop="birthday">
|
||||
<el-date-picker
|
||||
v-model="form.birthday"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="户口所在地" prop="householdAddress">
|
||||
<el-input
|
||||
v-model="form.householdAddress"
|
||||
placeholder="请输入户口所在地"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="户口所在地" prop="householdAddress">
|
||||
<el-input v-model="form.householdAddress" placeholder="请输入户口所在地" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级" prop="classCode">
|
||||
<el-select
|
||||
v-model="form.classCode"
|
||||
placeholder="请选择班级"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in classList"
|
||||
:key="item.classCode"
|
||||
:label="item.classNo"
|
||||
:value="item.classCode">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="班级" prop="classCode">
|
||||
<el-select v-model="form.classCode" placeholder="请选择班级" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in classList" :key="item.classCode" :label="item.classNo" :value="item.classCode"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input
|
||||
v-model="form.stuNo"
|
||||
placeholder="请输入学号"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input v-model="form.stuNo" placeholder="请输入学号" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="辩色力" prop="colourSense">
|
||||
<el-select
|
||||
v-model="form.colourSense"
|
||||
placeholder="请选择辩色力"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in eyeStatusList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="辩色力" prop="colourSense">
|
||||
<el-select v-model="form.colourSense" placeholder="请选择辩色力" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in eyeStatusList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="退伍军人" prop="veteran">
|
||||
<el-select
|
||||
v-model="form.veteran"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in veteranStatusList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="退伍军人" prop="veteran">
|
||||
<el-select v-model="form.veteran" placeholder="请选择" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in veteranStatusList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="政治面貌" prop="politicsStatus">
|
||||
<el-select
|
||||
v-model="form.politicsStatus"
|
||||
placeholder="请选择政治面貌"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in politicsStatusList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="政治面貌" prop="politicsStatus">
|
||||
<el-select v-model="form.politicsStatus" placeholder="请选择政治面貌" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in politicsStatusList" :key="item.id" :label="item.name" :value="item.id"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="民族" prop="national">
|
||||
<el-select
|
||||
v-model="form.national"
|
||||
placeholder="请选择民族"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in nationalList"
|
||||
:key="item.nationCode"
|
||||
:label="item.nationName"
|
||||
:value="item.nationCode">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="民族" prop="national">
|
||||
<el-select v-model="form.national" placeholder="请选择民族" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in nationalList" :key="item.nationCode" :label="item.nationName" :value="item.nationCode"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="是否10万以下民族" prop="isLowPopulation">
|
||||
<el-select
|
||||
v-model="form.isLowPopulation"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
style="width: 100%">
|
||||
<el-option label="是" value="1" />
|
||||
<el-option label="否" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="是否10万以下民族" prop="isLowPopulation">
|
||||
<el-select v-model="form.isLowPopulation" placeholder="请选择" clearable style="width: 100%">
|
||||
<el-option label="是" value="1" />
|
||||
<el-option label="否" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="既往病史" prop="medicalHistory">
|
||||
<el-input
|
||||
v-model="form.medicalHistory"
|
||||
placeholder="请输入既往病史"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="既往病史" prop="medicalHistory">
|
||||
<el-input v-model="form.medicalHistory" placeholder="请输入既往病史" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学前文化程度" prop="beforeEducation">
|
||||
<el-select
|
||||
v-model="form.beforeEducation"
|
||||
placeholder="请选择入学前文化程度"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in preSchoolEducationList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学前文化程度" prop="beforeEducation">
|
||||
<el-select v-model="form.beforeEducation" placeholder="请选择入学前文化程度" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in preSchoolEducationList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学前毕业学校" prop="beforeSchool">
|
||||
<el-input
|
||||
v-model="form.beforeSchool"
|
||||
placeholder="请输入入学前毕业学校"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="入学前毕业学校" prop="beforeSchool">
|
||||
<el-input v-model="form.beforeSchool" placeholder="请输入入学前毕业学校" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="毕业学校省市" prop="schoolProvince">
|
||||
<el-select
|
||||
v-model="form.schoolProvince"
|
||||
placeholder="请选择毕业学校省市"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in schoolProvinceList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="毕业学校省市" prop="schoolProvince">
|
||||
<el-select v-model="form.schoolProvince" placeholder="请选择毕业学校省市" clearable filterable style="width: 100%">
|
||||
<el-option v-for="item in schoolProvinceList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="BasicStudentDialog">
|
||||
import { ref, reactive, nextTick, onMounted } from 'vue'
|
||||
import { useMessage } from "/@/hooks/message";
|
||||
import { getObj, addObj, putObj } from '/@/api/basic/basicstudent'
|
||||
import { getClassListByRole } from '/@/api/basic/basicclass'
|
||||
import { getNationalList } from '/@/api/basic/basicnation'
|
||||
import { getPoliticsStatusDict } from '/@/api/basic/basicpoliticsstatusbase'
|
||||
import { queryDictByTypeList } from '/@/api/admin/dict'
|
||||
import { ref, reactive, nextTick, onMounted } from 'vue';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, addObj, putObj } from '/@/api/basic/basicstudent';
|
||||
import { getClassListByRole } from '/@/api/basic/basicclass';
|
||||
import { getNationalList } from '/@/api/basic/basicnation';
|
||||
import { getPoliticsStatusDict } from '/@/api/basic/basicpoliticsstatusbase';
|
||||
import { queryDictByTypeList } from '/@/api/admin/dict';
|
||||
|
||||
const emit = defineEmits(['refresh']);
|
||||
|
||||
// 定义变量内容
|
||||
const dataFormRef = ref();
|
||||
const visible = ref(false)
|
||||
const loading = ref(false)
|
||||
const classList = ref<any[]>([])
|
||||
const nationalList = ref<any[]>([])
|
||||
const politicsStatusList = ref<any[]>([])
|
||||
const eyeStatusList = ref<any[]>([])
|
||||
const veteranStatusList = ref<any[]>([])
|
||||
const preSchoolEducationList = ref<any[]>([])
|
||||
const schoolProvinceList = ref<any[]>([])
|
||||
const visible = ref(false);
|
||||
const loading = ref(false);
|
||||
const classList = ref<any[]>([]);
|
||||
const nationalList = ref<any[]>([]);
|
||||
const politicsStatusList = ref<any[]>([]);
|
||||
const eyeStatusList = ref<any[]>([]);
|
||||
const veteranStatusList = ref<any[]>([]);
|
||||
const preSchoolEducationList = ref<any[]>([]);
|
||||
const schoolProvinceList = ref<any[]>([]);
|
||||
|
||||
// 提交表单数据
|
||||
const form = reactive({
|
||||
id: '',
|
||||
realName: '',
|
||||
idCard: '',
|
||||
sex: '',
|
||||
birthday: '',
|
||||
householdAddress: '',
|
||||
classCode: '',
|
||||
stuNo: '',
|
||||
colourSense: '',
|
||||
veteran: '',
|
||||
politicsStatus: '',
|
||||
national: '',
|
||||
isLowPopulation: '',
|
||||
medicalHistory: '',
|
||||
beforeEducation: '',
|
||||
beforeSchool: '',
|
||||
schoolProvince: ''
|
||||
id: '',
|
||||
realName: '',
|
||||
idCard: '',
|
||||
sex: '',
|
||||
birthday: '',
|
||||
householdAddress: '',
|
||||
classCode: '',
|
||||
stuNo: '',
|
||||
colourSense: '',
|
||||
veteran: '',
|
||||
politicsStatus: '',
|
||||
national: '',
|
||||
isLowPopulation: '',
|
||||
medicalHistory: '',
|
||||
beforeEducation: '',
|
||||
beforeSchool: '',
|
||||
schoolProvince: '',
|
||||
});
|
||||
|
||||
// 定义校验规则 - 除了"是否10万以下民族"外，其他字段都是必填
|
||||
const dataRules = ref({
|
||||
realName: [
|
||||
{ required: true, message: '姓名不能为空', trigger: 'blur' }
|
||||
],
|
||||
idCard: [
|
||||
{ required: true, message: '身份证不能为空', trigger: 'blur' },
|
||||
{ pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '请输入正确的身份证号', trigger: 'blur' }
|
||||
],
|
||||
sex: [
|
||||
{ required: true, message: '性别不能为空', trigger: 'change' }
|
||||
],
|
||||
birthday: [
|
||||
{ required: true, message: '出生日期不能为空', trigger: 'change' }
|
||||
],
|
||||
householdAddress: [
|
||||
{ required: true, message: '户口所在地不能为空', trigger: 'blur' }
|
||||
],
|
||||
classCode: [
|
||||
{ required: true, message: '班级不能为空', trigger: 'change' }
|
||||
],
|
||||
stuNo: [
|
||||
{ required: true, message: '学号不能为空', trigger: 'blur' }
|
||||
],
|
||||
colourSense: [
|
||||
{ required: true, message: '辩色力不能为空', trigger: 'blur' }
|
||||
],
|
||||
veteran: [
|
||||
{ required: true, message: '退伍军人不能为空', trigger: 'change' }
|
||||
],
|
||||
politicsStatus: [
|
||||
{ required: true, message: '政治面貌不能为空', trigger: 'change' }
|
||||
],
|
||||
national: [
|
||||
{ required: true, message: '民族不能为空', trigger: 'change' }
|
||||
],
|
||||
medicalHistory: [
|
||||
{ required: true, message: '既往病史不能为空', trigger: 'blur' }
|
||||
],
|
||||
beforeEducation: [
|
||||
{ required: true, message: '入学前文化程度不能为空', trigger: 'blur' }
|
||||
],
|
||||
beforeSchool: [
|
||||
{ required: true, message: '入学前毕业学校不能为空', trigger: 'blur' }
|
||||
],
|
||||
schoolProvince: [
|
||||
{ required: true, message: '毕业学校省市不能为空', trigger: 'blur' }
|
||||
]
|
||||
// isLowPopulation 不需要必填验证
|
||||
})
|
||||
realName: [{ required: true, message: '姓名不能为空', trigger: 'blur' }],
|
||||
idCard: [
|
||||
{ required: true, message: '身份证不能为空', trigger: 'blur' },
|
||||
{ pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '请输入正确的身份证号', trigger: 'blur' },
|
||||
],
|
||||
sex: [{ required: true, message: '性别不能为空', trigger: 'change' }],
|
||||
birthday: [{ required: true, message: '出生日期不能为空', trigger: 'change' }],
|
||||
householdAddress: [{ required: true, message: '户口所在地不能为空', trigger: 'blur' }],
|
||||
classCode: [{ required: true, message: '班级不能为空', trigger: 'change' }],
|
||||
stuNo: [{ required: true, message: '学号不能为空', trigger: 'blur' }],
|
||||
colourSense: [{ required: true, message: '辩色力不能为空', trigger: 'blur' }],
|
||||
veteran: [{ required: true, message: '退伍军人不能为空', trigger: 'change' }],
|
||||
politicsStatus: [{ required: true, message: '政治面貌不能为空', trigger: 'change' }],
|
||||
national: [{ required: true, message: '民族不能为空', trigger: 'change' }],
|
||||
medicalHistory: [{ required: true, message: '既往病史不能为空', trigger: 'blur' }],
|
||||
beforeEducation: [{ required: true, message: '入学前文化程度不能为空', trigger: 'blur' }],
|
||||
beforeSchool: [{ required: true, message: '入学前毕业学校不能为空', trigger: 'blur' }],
|
||||
schoolProvince: [{ required: true, message: '毕业学校省市不能为空', trigger: 'blur' }],
|
||||
// isLowPopulation 不需要必填验证
|
||||
});
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (id?: string) => {
|
||||
visible.value = true
|
||||
|
||||
// 重置表单数据
|
||||
Object.assign(form, {
|
||||
id: '',
|
||||
realName: '',
|
||||
idCard: '',
|
||||
sex: '',
|
||||
birthday: '',
|
||||
householdAddress: '',
|
||||
classCode: '',
|
||||
stuNo: '',
|
||||
colourSense: '',
|
||||
veteran: '',
|
||||
politicsStatus: '',
|
||||
national: '',
|
||||
isLowPopulation: '',
|
||||
medicalHistory: '',
|
||||
beforeEducation: '',
|
||||
beforeSchool: '',
|
||||
schoolProvince: ''
|
||||
})
|
||||
visible.value = true;
|
||||
|
||||
// 清除表单验证状态，不触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
// 重置表单数据
|
||||
Object.assign(form, {
|
||||
id: '',
|
||||
realName: '',
|
||||
idCard: '',
|
||||
sex: '',
|
||||
birthday: '',
|
||||
householdAddress: '',
|
||||
classCode: '',
|
||||
stuNo: '',
|
||||
colourSense: '',
|
||||
veteran: '',
|
||||
politicsStatus: '',
|
||||
national: '',
|
||||
isLowPopulation: '',
|
||||
medicalHistory: '',
|
||||
beforeEducation: '',
|
||||
beforeSchool: '',
|
||||
schoolProvince: '',
|
||||
});
|
||||
|
||||
// 获取详情
|
||||
if (id) {
|
||||
form.id = id
|
||||
getStudentData(id)
|
||||
} else {
|
||||
// 新增时，确保验证状态已清除
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
}
|
||||
// 清除表单验证状态，不触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
dataFormRef.value?.resetFields();
|
||||
});
|
||||
|
||||
// 获取详情
|
||||
if (id) {
|
||||
form.id = id;
|
||||
getStudentData(id);
|
||||
} else {
|
||||
// 新增时，确保验证状态已清除
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// 提交
|
||||
const onSubmit = async () => {
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
||||
if (!valid) return false;
|
||||
|
||||
try {
|
||||
loading.value = true;
|
||||
if (form.id) {
|
||||
await putObj(form);
|
||||
useMessage().success('编辑成功');
|
||||
} else {
|
||||
await addObj(form);
|
||||
useMessage().success('新增成功');
|
||||
}
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || (form.id ? '编辑失败' : '新增失败'));
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
try {
|
||||
loading.value = true;
|
||||
if (form.id) {
|
||||
await putObj(form);
|
||||
useMessage().success('编辑成功');
|
||||
} else {
|
||||
await addObj(form);
|
||||
useMessage().success('新增成功');
|
||||
}
|
||||
visible.value = false;
|
||||
emit('refresh');
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || (form.id ? '编辑失败' : '新增失败'));
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 获取详情
|
||||
const getStudentData = (id: string) => {
|
||||
loading.value = true
|
||||
getObj(id).then((res: any) => {
|
||||
if (res.data) {
|
||||
Object.assign(form, {
|
||||
id: res.data.id || '',
|
||||
realName: res.data.realName || '',
|
||||
idCard: res.data.idCard || '',
|
||||
sex: res.data.sex || '',
|
||||
birthday: res.data.birthday || '',
|
||||
householdAddress: res.data.householdAddress || '',
|
||||
classCode: res.data.classCode || '',
|
||||
stuNo: res.data.stuNo || '',
|
||||
colourSense: res.data.colourSense || '',
|
||||
veteran: res.data.veteran || '',
|
||||
politicsStatus: res.data.politicsStatus || '',
|
||||
national: res.data.national || '',
|
||||
isLowPopulation: res.data.isLowPopulation || '',
|
||||
medicalHistory: res.data.medicalHistory || '',
|
||||
beforeEducation: res.data.beforeEducation || '',
|
||||
beforeSchool: res.data.beforeSchool || '',
|
||||
schoolProvince: res.data.schoolProvince || ''
|
||||
})
|
||||
}
|
||||
}).catch((err: any) => {
|
||||
console.error('获取详情失败', err)
|
||||
useMessage().error('获取详情失败')
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
// 数据加载完成后，清除验证状态，避免触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
})
|
||||
}
|
||||
loading.value = true;
|
||||
getObj(id)
|
||||
.then((res: any) => {
|
||||
if (res.data) {
|
||||
Object.assign(form, {
|
||||
id: res.data.id || '',
|
||||
realName: res.data.realName || '',
|
||||
idCard: res.data.idCard || '',
|
||||
sex: res.data.sex || '',
|
||||
birthday: res.data.birthday || '',
|
||||
householdAddress: res.data.householdAddress || '',
|
||||
classCode: res.data.classCode || '',
|
||||
stuNo: res.data.stuNo || '',
|
||||
colourSense: res.data.colourSense || '',
|
||||
veteran: res.data.veteran || '',
|
||||
politicsStatus: res.data.politicsStatus || '',
|
||||
national: res.data.national || '',
|
||||
isLowPopulation: res.data.isLowPopulation || '',
|
||||
medicalHistory: res.data.medicalHistory || '',
|
||||
beforeEducation: res.data.beforeEducation || '',
|
||||
beforeSchool: res.data.beforeSchool || '',
|
||||
schoolProvince: res.data.schoolProvince || '',
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((err: any) => {
|
||||
console.error('获取详情失败', err);
|
||||
useMessage().error('获取详情失败');
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
// 数据加载完成后，清除验证状态，避免触发验证
|
||||
nextTick(() => {
|
||||
dataFormRef.value?.clearValidate();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 获取班级列表
|
||||
const getClassListData = async () => {
|
||||
try {
|
||||
const res = await getClassListByRole()
|
||||
if (res.data) {
|
||||
classList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班级列表失败', err)
|
||||
classList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getClassListByRole();
|
||||
if (res.data) {
|
||||
classList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班级列表失败', err);
|
||||
classList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取民族列表
|
||||
const getNationalListData = async () => {
|
||||
try {
|
||||
const res = await getNationalList()
|
||||
if (res.data) {
|
||||
nationalList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取民族列表失败', err)
|
||||
nationalList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getNationalList();
|
||||
if (res.data) {
|
||||
nationalList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取民族列表失败', err);
|
||||
nationalList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取政治面貌列表
|
||||
const getPoliticsStatusListData = async () => {
|
||||
try {
|
||||
const res = await getPoliticsStatusDict()
|
||||
if (res.data) {
|
||||
politicsStatusList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取政治面貌列表失败', err)
|
||||
politicsStatusList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getPoliticsStatusDict();
|
||||
if (res.data) {
|
||||
politicsStatusList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取政治面貌列表失败', err);
|
||||
politicsStatusList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 获取字典数据
|
||||
const getDictData = async () => {
|
||||
try {
|
||||
const dictTypes = ['eye_status', 'veteran_status', 'pre_school_education', 'school_province']
|
||||
const res = await queryDictByTypeList(dictTypes)
|
||||
if (res.data && typeof res.data === 'object') {
|
||||
// 解析返回的字典数据，统一转换为 {label, value} 格式
|
||||
const parseDictList = (dictData: any) => {
|
||||
if (!Array.isArray(dictData)) return []
|
||||
return dictData.map((item: any) => ({
|
||||
label: item.label || item.name || item.dictLabel || '',
|
||||
value: item.value || item.code || item.dictValue || ''
|
||||
})).filter((item: any) => item.label && item.value !== undefined && item.value !== null && item.value !== '')
|
||||
}
|
||||
|
||||
if (res.data.eye_status) {
|
||||
eyeStatusList.value = parseDictList(res.data.eye_status)
|
||||
}
|
||||
if (res.data.veteran_status) {
|
||||
veteranStatusList.value = parseDictList(res.data.veteran_status)
|
||||
}
|
||||
if (res.data.pre_school_education) {
|
||||
preSchoolEducationList.value = parseDictList(res.data.pre_school_education)
|
||||
}
|
||||
if (res.data.school_province) {
|
||||
schoolProvinceList.value = parseDictList(res.data.school_province)
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取字典数据失败', err)
|
||||
eyeStatusList.value = []
|
||||
veteranStatusList.value = []
|
||||
preSchoolEducationList.value = []
|
||||
schoolProvinceList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const dictTypes = ['eye_status', 'veteran_status', 'pre_school_education', 'school_province'];
|
||||
const res = await queryDictByTypeList(dictTypes);
|
||||
if (res.data && typeof res.data === 'object') {
|
||||
// 解析返回的字典数据，统一转换为 {label, value} 格式
|
||||
const parseDictList = (dictData: any) => {
|
||||
if (!Array.isArray(dictData)) return [];
|
||||
return dictData
|
||||
.map((item: any) => ({
|
||||
label: item.label || item.name || item.dictLabel || '',
|
||||
value: item.value || item.code || item.dictValue || '',
|
||||
}))
|
||||
.filter((item: any) => item.label && item.value !== undefined && item.value !== null && item.value !== '');
|
||||
};
|
||||
|
||||
if (res.data.eye_status) {
|
||||
eyeStatusList.value = parseDictList(res.data.eye_status);
|
||||
}
|
||||
if (res.data.veteran_status) {
|
||||
veteranStatusList.value = parseDictList(res.data.veteran_status);
|
||||
}
|
||||
if (res.data.pre_school_education) {
|
||||
preSchoolEducationList.value = parseDictList(res.data.pre_school_education);
|
||||
}
|
||||
if (res.data.school_province) {
|
||||
schoolProvinceList.value = parseDictList(res.data.school_province);
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取字典数据失败', err);
|
||||
eyeStatusList.value = [];
|
||||
veteranStatusList.value = [];
|
||||
preSchoolEducationList.value = [];
|
||||
schoolProvinceList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getClassListData()
|
||||
getNationalListData()
|
||||
getPoliticsStatusListData()
|
||||
getDictData()
|
||||
})
|
||||
getClassListData();
|
||||
getNationalListData();
|
||||
getPoliticsStatusListData();
|
||||
getDictData();
|
||||
});
|
||||
|
||||
// 暴露变量
|
||||
defineExpose({
|
||||
openDialog
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mb20 {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,246 +1,255 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 搜索 -->
|
||||
<el-card shadow="never" class="mb12">
|
||||
<el-form :inline="true" :model="searchForm" ref="searchFormRef" label-width="90px">
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input v-model="searchForm.stuNo" placeholder="请输入学号" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="stuName">
|
||||
<el-input v-model="searchForm.stuName" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证" prop="idCard">
|
||||
<el-input v-model="searchForm.idCard" placeholder="请输入身份证" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="电话" prop="phone">
|
||||
<el-input v-model="searchForm.phone" placeholder="请输入电话" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="家长电话" prop="parentPhone">
|
||||
<el-input v-model="searchForm.parentPhone" placeholder="请输入家长电话" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSearch">
|
||||
<el-icon><Search /></el-icon>
|
||||
查询
|
||||
</el-button>
|
||||
<el-button @click="handleReset">
|
||||
<el-icon><Refresh /></el-icon>
|
||||
重置
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<div class="app-container">
|
||||
<!-- 搜索 -->
|
||||
<el-card shadow="never" class="mb12">
|
||||
<el-form :inline="true" :model="searchForm" ref="searchFormRef" label-width="90px">
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input v-model="searchForm.stuNo" placeholder="请输入学号" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="stuName">
|
||||
<el-input v-model="searchForm.stuName" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证" prop="idCard">
|
||||
<el-input v-model="searchForm.idCard" placeholder="请输入身份证" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="电话" prop="phone">
|
||||
<el-input v-model="searchForm.phone" placeholder="请输入电话" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="家长电话" prop="parentPhone">
|
||||
<el-input v-model="searchForm.parentPhone" placeholder="请输入家长电话" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSearch">
|
||||
<el-icon><Search /></el-icon>
|
||||
查询
|
||||
</el-button>
|
||||
<el-button @click="handleReset">
|
||||
<el-icon><Refresh /></el-icon>
|
||||
重置
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 表格 -->
|
||||
<el-card shadow="never">
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
@sort-change="sortChangeHandle"
|
||||
style="width: 100%;">
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #header>
|
||||
<el-icon><List /></el-icon>
|
||||
<span style="margin-left: 4px;">序号</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deptName" label="学院" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><OfficeBuilding /></el-icon>
|
||||
<span style="margin-left: 4px;">学院</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="majorName" label="专业" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><Briefcase /></el-icon>
|
||||
<span style="margin-left: 4px;">专业</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="className" label="班级" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><Grid /></el-icon>
|
||||
<span style="margin-left: 4px;">班级</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip width="130">
|
||||
<template #header>
|
||||
<el-icon><Document /></el-icon>
|
||||
<span style="margin-left: 4px;">学号</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stuName" label="姓名" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><UserFilled /></el-icon>
|
||||
<span style="margin-left: 4px;">姓名</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="idCard" label="身份证" show-overflow-tooltip width="180">
|
||||
<template #header>
|
||||
<el-icon><CreditCard /></el-icon>
|
||||
<span style="margin-left: 4px;">身份证</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="电话" show-overflow-tooltip width="130">
|
||||
<template #header>
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span style="margin-left: 4px;">电话</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="parentPhone" label="家长电话" show-overflow-tooltip width="140">
|
||||
<template #header>
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span style="margin-left: 4px;">家长电话</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="90" align="center">
|
||||
<template #header>
|
||||
<el-icon><User /></el-icon>
|
||||
<span style="margin-left: 4px;">性别</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<GenderTag :gender="scope.row.gender" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="dormNo" label="宿舍号" show-overflow-tooltip width="120">
|
||||
<template #header>
|
||||
<el-icon><HomeFilled /></el-icon>
|
||||
<span style="margin-left: 4px;">宿舍号</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="teacherName" label="班主任" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><UserFilled /></el-icon>
|
||||
<span style="margin-left: 4px;">班主任</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="teacherPhone" label="班主任电话" show-overflow-tooltip width="140">
|
||||
<template #header>
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span style="margin-left: 4px;">班主任电话</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="schoolRollStatus" label="学籍状态" show-overflow-tooltip width="110" align="center">
|
||||
<template #header>
|
||||
<el-icon><CircleCheck /></el-icon>
|
||||
<span style="margin-left: 4px;">学籍状态</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<StatusTag :status="scope.row.schoolRollStatus" :options="rollStatusOptions" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stuStatus" label="学生状态" show-overflow-tooltip width="110" align="center">
|
||||
<template #header>
|
||||
<el-icon><Tickets /></el-icon>
|
||||
<span style="margin-left: 4px;">学生状态</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<StatusTag :status="scope.row.stuStatus" :options="stuStatusOptions" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="avatarUrl" label="头像" width="120" align="center">
|
||||
<template #header>
|
||||
<el-icon><Picture /></el-icon>
|
||||
<span style="margin-left: 4px;">头像</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-image
|
||||
v-if="scope.row.avatarUrl"
|
||||
:src="scope.row.avatarUrl"
|
||||
:preview-src-list="[scope.row.avatarUrl]"
|
||||
fit="cover"
|
||||
style="width: 60px; height: 60px; border-radius: 6px;" />
|
||||
<el-tag v-else type="info" effect="plain">无</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="120" fixed="right" align="center">
|
||||
<template #header>
|
||||
<el-icon><Setting /></el-icon>
|
||||
<span style="margin-left: 4px;">操作</span>
|
||||
</template>
|
||||
<template #default>
|
||||
<span style="color: #999;">—</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 表格 -->
|
||||
<el-card shadow="never">
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
@sort-change="sortChangeHandle"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #header>
|
||||
<el-icon><List /></el-icon>
|
||||
<span style="margin-left: 4px">序号</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deptName" label="学院" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><OfficeBuilding /></el-icon>
|
||||
<span style="margin-left: 4px">学院</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="majorName" label="专业" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><Briefcase /></el-icon>
|
||||
<span style="margin-left: 4px">专业</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="className" label="班级" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><Grid /></el-icon>
|
||||
<span style="margin-left: 4px">班级</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stuNo" label="学号" show-overflow-tooltip width="130">
|
||||
<template #header>
|
||||
<el-icon><Document /></el-icon>
|
||||
<span style="margin-left: 4px">学号</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stuName" label="姓名" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><UserFilled /></el-icon>
|
||||
<span style="margin-left: 4px">姓名</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="idCard" label="身份证" show-overflow-tooltip width="180">
|
||||
<template #header>
|
||||
<el-icon><CreditCard /></el-icon>
|
||||
<span style="margin-left: 4px">身份证</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="电话" show-overflow-tooltip width="130">
|
||||
<template #header>
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span style="margin-left: 4px">电话</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="parentPhone" label="家长电话" show-overflow-tooltip width="140">
|
||||
<template #header>
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span style="margin-left: 4px">家长电话</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="gender" label="性别" width="90" align="center">
|
||||
<template #header>
|
||||
<el-icon><User /></el-icon>
|
||||
<span style="margin-left: 4px">性别</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<GenderTag :gender="scope.row.gender" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="dormNo" label="宿舍号" show-overflow-tooltip width="120">
|
||||
<template #header>
|
||||
<el-icon><HomeFilled /></el-icon>
|
||||
<span style="margin-left: 4px">宿舍号</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="teacherName" label="班主任" show-overflow-tooltip>
|
||||
<template #header>
|
||||
<el-icon><UserFilled /></el-icon>
|
||||
<span style="margin-left: 4px">班主任</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="teacherPhone" label="班主任电话" show-overflow-tooltip width="140">
|
||||
<template #header>
|
||||
<el-icon><Phone /></el-icon>
|
||||
<span style="margin-left: 4px">班主任电话</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="schoolRollStatus" label="学籍状态" show-overflow-tooltip width="110" align="center">
|
||||
<template #header>
|
||||
<el-icon><CircleCheck /></el-icon>
|
||||
<span style="margin-left: 4px">学籍状态</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<StatusTag :status="scope.row.schoolRollStatus" :options="rollStatusOptions" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stuStatus" label="学生状态" show-overflow-tooltip width="110" align="center">
|
||||
<template #header>
|
||||
<el-icon><Tickets /></el-icon>
|
||||
<span style="margin-left: 4px">学生状态</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<StatusTag :status="scope.row.stuStatus" :options="stuStatusOptions" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="avatarUrl" label="头像" width="120" align="center">
|
||||
<template #header>
|
||||
<el-icon><Picture /></el-icon>
|
||||
<span style="margin-left: 4px">头像</span>
|
||||
</template>
|
||||
<template #default="scope">
|
||||
<el-image
|
||||
v-if="scope.row.avatarUrl"
|
||||
:src="scope.row.avatarUrl"
|
||||
:preview-src-list="[scope.row.avatarUrl]"
|
||||
fit="cover"
|
||||
style="width: 60px; height: 60px; border-radius: 6px"
|
||||
/>
|
||||
<el-tag v-else type="info" effect="plain">无</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="120" fixed="right" align="center">
|
||||
<template #header>
|
||||
<el-icon><Setting /></el-icon>
|
||||
<span style="margin-left: 4px">操作</span>
|
||||
</template>
|
||||
<template #default>
|
||||
<span style="color: #999">—</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="state.total > 0"
|
||||
:total="state.total"
|
||||
v-model:page="state.page"
|
||||
v-model:limit="state.limit"
|
||||
@pagination="getDataList" />
|
||||
</el-card>
|
||||
</div>
|
||||
<pagination v-show="state.total > 0" :total="state.total" v-model:page="state.page" v-model:limit="state.limit" @pagination="getDataList" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="QueryStuindex">
|
||||
import { ref, reactive } from 'vue'
|
||||
import { Search, Refresh, List, OfficeBuilding, Grid, Document, UserFilled, CreditCard, Phone, User, HomeFilled, CircleCheck, Tickets, Setting, Picture, Briefcase } from '@element-plus/icons-vue'
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table'
|
||||
import { queryStuindex } from '/@/api/basic/basicstudent'
|
||||
import GenderTag from '/@/components/GenderTag/index.vue'
|
||||
import StatusTag from '/@/components/StatusTag/index.vue'
|
||||
import { ref, reactive } from 'vue';
|
||||
import {
|
||||
Search,
|
||||
Refresh,
|
||||
List,
|
||||
OfficeBuilding,
|
||||
Grid,
|
||||
Document,
|
||||
UserFilled,
|
||||
CreditCard,
|
||||
Phone,
|
||||
User,
|
||||
HomeFilled,
|
||||
CircleCheck,
|
||||
Tickets,
|
||||
Setting,
|
||||
Picture,
|
||||
Briefcase,
|
||||
} from '@element-plus/icons-vue';
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { queryStuindex } from '/@/api/basic/basicstudent';
|
||||
import GenderTag from '/@/components/GenderTag/index.vue';
|
||||
import StatusTag from '/@/components/StatusTag/index.vue';
|
||||
|
||||
// 搜索表单
|
||||
const searchFormRef = ref()
|
||||
const searchFormRef = ref();
|
||||
const searchForm = reactive({
|
||||
stuNo: '',
|
||||
stuName: '',
|
||||
idCard: '',
|
||||
phone: '',
|
||||
parentPhone: ''
|
||||
})
|
||||
stuNo: '',
|
||||
stuName: '',
|
||||
idCard: '',
|
||||
phone: '',
|
||||
parentPhone: '',
|
||||
});
|
||||
|
||||
// 状态映射（可根据实际字典调整）
|
||||
const rollStatusOptions = [
|
||||
{ value: '0', label: '在籍', type: 'success' },
|
||||
{ value: '1', label: '离校', type: 'warning' },
|
||||
{ value: '2', label: '休学', type: 'info' }
|
||||
]
|
||||
{ value: '0', label: '在籍', type: 'success' },
|
||||
{ value: '1', label: '离校', type: 'warning' },
|
||||
{ value: '2', label: '休学', type: 'info' },
|
||||
];
|
||||
const stuStatusOptions = [
|
||||
{ value: '0', label: '正常', type: 'success' },
|
||||
{ value: '1', label: '预警', type: 'warning' },
|
||||
{ value: '2', label: '异常', type: 'danger' }
|
||||
]
|
||||
{ value: '0', label: '正常', type: 'success' },
|
||||
{ value: '1', label: '预警', type: 'warning' },
|
||||
{ value: '2', label: '异常', type: 'danger' },
|
||||
];
|
||||
|
||||
// 表格配置
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: searchForm,
|
||||
pageList: queryStuindex,
|
||||
props: {
|
||||
item: 'records',
|
||||
totalCount: 'total'
|
||||
},
|
||||
createdIsNeed: true
|
||||
})
|
||||
queryForm: searchForm,
|
||||
pageList: queryStuindex,
|
||||
props: {
|
||||
item: 'records',
|
||||
totalCount: 'total',
|
||||
},
|
||||
createdIsNeed: true,
|
||||
});
|
||||
|
||||
const {
|
||||
getDataList,
|
||||
sortChangeHandle,
|
||||
tableStyle
|
||||
} = useTable(state)
|
||||
const { getDataList, sortChangeHandle, tableStyle } = useTable(state);
|
||||
|
||||
const handleSearch = () => {
|
||||
state.page = 1
|
||||
getDataList()
|
||||
}
|
||||
state.page = 1;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
const handleReset = () => {
|
||||
searchFormRef.value?.resetFields()
|
||||
state.page = 1
|
||||
getDataList()
|
||||
}
|
||||
searchFormRef.value?.resetFields();
|
||||
state.page = 1;
|
||||
getDataList();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-container {
|
||||
padding: 16px;
|
||||
padding: 16px;
|
||||
}
|
||||
.mb12 {
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,270 +1,245 @@
|
||||
<template>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="班级" prop="classCode">
|
||||
<el-select
|
||||
v-model="searchForm.classCode"
|
||||
placeholder="请选择班级"
|
||||
clearable
|
||||
filterable
|
||||
style="width: 200px">
|
||||
<el-option
|
||||
v-for="item in classList"
|
||||
:key="item.classCode"
|
||||
:label="item.classNo"
|
||||
:value="item.classCode">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="班级" prop="classCode">
|
||||
<el-select v-model="searchForm.classCode" placeholder="请选择班级" clearable filterable style="width: 200px">
|
||||
<el-option v-for="item in classList" :key="item.classCode" :label="item.classNo" :value="item.classCode"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" plain icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Document /></el-icon>
|
||||
学生头像列表
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
@queryTable="getDataList">
|
||||
<TableColumnControl
|
||||
ref="columnControlRef"
|
||||
:columns="tableColumns"
|
||||
v-model="visibleColumns"
|
||||
trigger-type="default"
|
||||
trigger-circle
|
||||
@change="handleColumnChange"
|
||||
@order-change="handleColumnOrderChange"
|
||||
>
|
||||
<template #trigger>
|
||||
<el-tooltip class="item" effect="dark" content="列设置" placement="top">
|
||||
<el-button circle style="margin-left: 0;">
|
||||
<el-icon><Menu /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</TableColumnControl>
|
||||
</right-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Document /></el-icon>
|
||||
学生头像列表
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" @queryTable="getDataList">
|
||||
<TableColumnControl
|
||||
ref="columnControlRef"
|
||||
:columns="tableColumns"
|
||||
v-model="visibleColumns"
|
||||
trigger-type="default"
|
||||
trigger-circle
|
||||
@change="handleColumnChange"
|
||||
@order-change="handleColumnOrderChange"
|
||||
>
|
||||
<template #trigger>
|
||||
<el-tooltip class="item" effect="dark" content="列设置" placement="top">
|
||||
<el-button circle style="margin-left: 0">
|
||||
<el-icon><Menu /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</TableColumnControl>
|
||||
</right-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table"
|
||||
@sort-change="sortChangeHandle">
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #header>
|
||||
<el-icon><List /></el-icon>
|
||||
</template>
|
||||
<template #default="{ $index }">
|
||||
{{ $index + 1 + ((state.pagination?.current || 1) - 1) * (state.pagination?.size || 10) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="col in visibleColumnsSorted"
|
||||
:key="col.prop"
|
||||
:prop="col.prop"
|
||||
:label="col.label"
|
||||
:width="col.width"
|
||||
:min-width="col.minWidth"
|
||||
:show-overflow-tooltip="col.showOverflowTooltip !== false"
|
||||
:align="col.align">
|
||||
<template #header>
|
||||
<el-icon v-if="col.icon"><component :is="col.icon" /></el-icon>
|
||||
<span :style="{ marginLeft: col.icon ? '4px' : '0' }">{{ col.label }}</span>
|
||||
</template>
|
||||
<template #default="scope" v-if="col.prop === 'headImg'">
|
||||
<el-image
|
||||
v-if="scope.row.headImg || scope.row.imageUrl || scope.row.qrCode"
|
||||
:src="scope.row.headImg || scope.row.imageUrl || scope.row.qrCode"
|
||||
:preview-src-list="[scope.row.headImg || scope.row.imageUrl || scope.row.qrCode]"
|
||||
fit="cover"
|
||||
style="width: 80px; height: 100px; cursor: pointer;"
|
||||
lazy>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon><Picture /></el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #header>
|
||||
<el-icon><List /></el-icon>
|
||||
</template>
|
||||
<template #default="{ $index }">
|
||||
{{ $index + 1 + ((state.pagination?.current || 1) - 1) * (state.pagination?.size || 10) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="col in visibleColumnsSorted"
|
||||
:key="col.prop"
|
||||
:prop="col.prop"
|
||||
:label="col.label"
|
||||
:width="col.width"
|
||||
:min-width="col.minWidth"
|
||||
:show-overflow-tooltip="col.showOverflowTooltip !== false"
|
||||
:align="col.align"
|
||||
>
|
||||
<template #header>
|
||||
<el-icon v-if="col.icon"><component :is="col.icon" /></el-icon>
|
||||
<span :style="{ marginLeft: col.icon ? '4px' : '0' }">{{ col.label }}</span>
|
||||
</template>
|
||||
<template #default="scope" v-if="col.prop === 'headImg'">
|
||||
<el-image
|
||||
v-if="scope.row.headImg || scope.row.imageUrl || scope.row.qrCode"
|
||||
:src="scope.row.headImg || scope.row.imageUrl || scope.row.qrCode"
|
||||
:preview-src-list="[scope.row.headImg || scope.row.imageUrl || scope.row.qrCode]"
|
||||
fit="cover"
|
||||
style="width: 80px; height: 100px; cursor: pointer"
|
||||
lazy
|
||||
>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon><Picture /></el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<div class="pagination-wrapper">
|
||||
<pagination
|
||||
@size-change="sizeChangeHandle"
|
||||
@current-change="currentChangeHandle"
|
||||
v-bind="state.pagination" />
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<div class="pagination-wrapper">
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="BasicStudentAvatar">
|
||||
import { ref, reactive, computed, onMounted } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
||||
import { fetchList } from "/@/api/basic/basicstudentavatar";
|
||||
import { getClassListByRole } from "/@/api/basic/basicclass";
|
||||
import TableColumnControl from '/@/components/TableColumnControl/index.vue'
|
||||
import { Picture, List, Document, UserFilled, Grid, Menu, Search } from '@element-plus/icons-vue'
|
||||
import { useTableColumnControl } from '/@/hooks/tableColumn'
|
||||
import { ref, reactive, computed, onMounted } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { BasicTableProps, useTable } from '/@/hooks/table';
|
||||
import { fetchList } from '/@/api/basic/basicstudentavatar';
|
||||
import { getClassListByRole } from '/@/api/basic/basicclass';
|
||||
import TableColumnControl from '/@/components/TableColumnControl/index.vue';
|
||||
import { Picture, List, Document, UserFilled, Grid, Menu, Search } from '@element-plus/icons-vue';
|
||||
import { useTableColumnControl } from '/@/hooks/tableColumn';
|
||||
|
||||
// 定义变量内容
|
||||
const route = useRoute()
|
||||
const searchFormRef = ref()
|
||||
const columnControlRef = ref()
|
||||
const showSearch = ref(true)
|
||||
const classList = ref<any[]>([])
|
||||
const route = useRoute();
|
||||
const searchFormRef = ref();
|
||||
const columnControlRef = ref();
|
||||
const showSearch = ref(true);
|
||||
const classList = ref<any[]>([]);
|
||||
|
||||
// 表格列配置
|
||||
const tableColumns = [
|
||||
{ prop: 'stuNo', label: '学号', icon: Document },
|
||||
{ prop: 'realName', label: '姓名', icon: UserFilled },
|
||||
{ prop: 'className', label: '班级', icon: Grid },
|
||||
{ prop: 'headImg', label: '头像', icon: Picture, width: 120 }
|
||||
]
|
||||
{ prop: 'stuNo', label: '学号', icon: Document },
|
||||
{ prop: 'realName', label: '姓名', icon: UserFilled },
|
||||
{ prop: 'className', label: '班级', icon: Grid },
|
||||
{ prop: 'headImg', label: '头像', icon: Picture, width: 120 },
|
||||
];
|
||||
|
||||
// 使用表格列控制hook
|
||||
const {
|
||||
visibleColumns,
|
||||
visibleColumnsSorted,
|
||||
checkColumnVisible,
|
||||
handleColumnChange,
|
||||
handleColumnOrderChange
|
||||
} = useTableColumnControl(tableColumns)
|
||||
const { visibleColumns, visibleColumnsSorted, checkColumnVisible, handleColumnChange, handleColumnOrderChange } = useTableColumnControl(tableColumns);
|
||||
|
||||
// 搜索表单
|
||||
const searchForm = reactive({
|
||||
classCode: ''
|
||||
})
|
||||
classCode: '',
|
||||
});
|
||||
|
||||
// 配置 useTable - 接口返回的数据结构是 { classes: [], students: [] }
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: searchForm,
|
||||
pageList: async (queryParams: any) => {
|
||||
const res = await fetchList(queryParams)
|
||||
// 接口返回的数据结构是 { classes: [], students: [] }
|
||||
// 需要将 students 数组转换为表格数据，并关联班级信息
|
||||
if (res.data && res.data.students) {
|
||||
const students = res.data.students || []
|
||||
const classes = res.data.classes || []
|
||||
const classMap = new Map()
|
||||
classes.forEach((cls: any) => {
|
||||
classMap.set(cls.classCode, cls)
|
||||
})
|
||||
|
||||
// 将学生数据与班级信息合并
|
||||
const dataList = students.map((stu: any) => {
|
||||
const classInfo = classMap.get(stu.classCode)
|
||||
return {
|
||||
...stu,
|
||||
className: classInfo ? classInfo.classNo : stu.className || '',
|
||||
classNo: classInfo ? classInfo.classNo : ''
|
||||
}
|
||||
})
|
||||
|
||||
return {
|
||||
...res,
|
||||
data: {
|
||||
records: dataList,
|
||||
total: dataList.length,
|
||||
current: 1,
|
||||
size: dataList.length,
|
||||
pages: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
return res
|
||||
},
|
||||
props: {
|
||||
item: 'records',
|
||||
totalCount: 'total'
|
||||
},
|
||||
createdIsNeed: true
|
||||
})
|
||||
queryForm: searchForm,
|
||||
pageList: async (queryParams: any) => {
|
||||
const res = await fetchList(queryParams);
|
||||
// 接口返回的数据结构是 { classes: [], students: [] }
|
||||
// 需要将 students 数组转换为表格数据，并关联班级信息
|
||||
if (res.data && res.data.students) {
|
||||
const students = res.data.students || [];
|
||||
const classes = res.data.classes || [];
|
||||
const classMap = new Map();
|
||||
classes.forEach((cls: any) => {
|
||||
classMap.set(cls.classCode, cls);
|
||||
});
|
||||
|
||||
// 将学生数据与班级信息合并
|
||||
const dataList = students.map((stu: any) => {
|
||||
const classInfo = classMap.get(stu.classCode);
|
||||
return {
|
||||
...stu,
|
||||
className: classInfo ? classInfo.classNo : stu.className || '',
|
||||
classNo: classInfo ? classInfo.classNo : '',
|
||||
};
|
||||
});
|
||||
|
||||
return {
|
||||
...res,
|
||||
data: {
|
||||
records: dataList,
|
||||
total: dataList.length,
|
||||
current: 1,
|
||||
size: dataList.length,
|
||||
pages: 1,
|
||||
},
|
||||
};
|
||||
}
|
||||
return res;
|
||||
},
|
||||
props: {
|
||||
item: 'records',
|
||||
totalCount: 'total',
|
||||
},
|
||||
createdIsNeed: true,
|
||||
});
|
||||
|
||||
// table hook
|
||||
const {
|
||||
getDataList,
|
||||
currentChangeHandle,
|
||||
sizeChangeHandle,
|
||||
sortChangeHandle,
|
||||
tableStyle
|
||||
} = useTable(state)
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, tableStyle } = useTable(state);
|
||||
|
||||
// 查询
|
||||
const handleSearch = () => {
|
||||
getDataList()
|
||||
}
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 重置
|
||||
const handleReset = () => {
|
||||
searchFormRef.value?.resetFields()
|
||||
searchForm.classCode = ''
|
||||
getDataList()
|
||||
}
|
||||
searchFormRef.value?.resetFields();
|
||||
searchForm.classCode = '';
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 获取班级列表
|
||||
const getClassListData = async () => {
|
||||
try {
|
||||
const res = await getClassListByRole()
|
||||
if (res.data) {
|
||||
classList.value = Array.isArray(res.data) ? res.data : []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班级列表失败', err)
|
||||
classList.value = []
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await getClassListByRole();
|
||||
if (res.data) {
|
||||
classList.value = Array.isArray(res.data) ? res.data : [];
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('获取班级列表失败', err);
|
||||
classList.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getClassListData()
|
||||
})
|
||||
getClassListData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '/@/assets/styles/modern-page.scss';
|
||||
|
||||
.image-slot {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #f5f7fa;
|
||||
color: #909399;
|
||||
font-size: 30px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #f5f7fa;
|
||||
color: #909399;
|
||||
font-size: 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,502 +1,462 @@
|
||||
<template>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="批次号" prop="batchNo">
|
||||
<el-input
|
||||
v-model="searchForm.batchNo"
|
||||
placeholder="请输入批次号"
|
||||
clearable
|
||||
style="width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input
|
||||
v-model="searchForm.stuNo"
|
||||
placeholder="请输入学号"
|
||||
clearable
|
||||
style="width: 150px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="systemRealName">
|
||||
<el-input
|
||||
v-model="searchForm.systemRealName"
|
||||
placeholder="请输入姓名"
|
||||
clearable
|
||||
style="width: 120px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="异常类型" prop="exceptionType">
|
||||
<el-select
|
||||
v-model="searchForm.exceptionType"
|
||||
placeholder="请选择异常类型"
|
||||
clearable
|
||||
style="width: 150px">
|
||||
<el-option label="姓名不一致" value="1" />
|
||||
<el-option label="身份证不一致" value="2" />
|
||||
<el-option label="学籍号不一致" value="3" />
|
||||
<el-option label="毕业院校不一致" value="4" />
|
||||
<el-option label="系统有学籍无" value="5" />
|
||||
<el-option label="学籍有系统无" value="6" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="复核状态" prop="reviewStatus">
|
||||
<el-select
|
||||
v-model="searchForm.reviewStatus"
|
||||
placeholder="请选择复核状态"
|
||||
clearable
|
||||
style="width: 120px">
|
||||
<el-option label="待复核" value="0" />
|
||||
<el-option label="已复核" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="批次号" prop="batchNo">
|
||||
<el-input v-model="searchForm.batchNo" placeholder="请输入批次号" clearable style="width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input v-model="searchForm.stuNo" placeholder="请输入学号" clearable style="width: 150px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="systemRealName">
|
||||
<el-input v-model="searchForm.systemRealName" placeholder="请输入姓名" clearable style="width: 120px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="异常类型" prop="exceptionType">
|
||||
<el-select v-model="searchForm.exceptionType" placeholder="请选择异常类型" clearable style="width: 150px">
|
||||
<el-option label="姓名不一致" value="1" />
|
||||
<el-option label="身份证不一致" value="2" />
|
||||
<el-option label="学籍号不一致" value="3" />
|
||||
<el-option label="毕业院校不一致" value="4" />
|
||||
<el-option label="系统有学籍无" value="5" />
|
||||
<el-option label="学籍有系统无" value="6" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="复核状态" prop="reviewStatus">
|
||||
<el-select v-model="searchForm.reviewStatus" placeholder="请选择复核状态" clearable style="width: 120px">
|
||||
<el-option label="待复核" value="0" />
|
||||
<el-option label="已复核" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><DocumentChecked /></el-icon>
|
||||
学籍比对异常数据
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<el-upload
|
||||
:show-file-list="false"
|
||||
:before-upload="beforeUpload"
|
||||
:http-request="handleImport"
|
||||
accept=".xlsx,.xls"
|
||||
class="upload-btn">
|
||||
<el-button type="primary" icon="Upload" :loading="importLoading">导入比对</el-button>
|
||||
</el-upload>
|
||||
<el-button type="success" icon="Download" @click="handleDownloadTemplate">下载模板</el-button>
|
||||
<el-button type="warning" icon="Download" @click="handleExport">导出异常</el-button>
|
||||
<el-button type="info" icon="Bell" @click="handleSend" :disabled="!searchForm.batchNo">下发班主任</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
@queryTable="getDataList" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><DocumentChecked /></el-icon>
|
||||
学籍比对异常数据
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<el-upload :show-file-list="false" :before-upload="beforeUpload" :http-request="handleImport" accept=".xlsx,.xls" class="upload-btn">
|
||||
<el-button type="primary" icon="Upload" :loading="importLoading">导入比对</el-button>
|
||||
</el-upload>
|
||||
<el-button type="success" icon="Download" @click="handleDownloadTemplate">下载模板</el-button>
|
||||
<el-button type="warning" icon="Download" @click="handleExport">导出异常</el-button>
|
||||
<el-button type="info" icon="Bell" @click="handleSend" :disabled="!searchForm.batchNo">下发班主任</el-button>
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" @queryTable="getDataList" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- 统计卡片 -->
|
||||
<el-row :gutter="16" class="stat-row">
|
||||
<el-col :span="4">
|
||||
<el-statistic title="总异常数" :value="statistics.total" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="待复核" :value="statistics.pending" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="已复核" :value="statistics.reviewed" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 统计卡片 -->
|
||||
<el-row :gutter="16" class="stat-row">
|
||||
<el-col :span="4">
|
||||
<el-statistic title="总异常数" :value="statistics.total" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="待复核" :value="statistics.pending" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="已复核" :value="statistics.reviewed" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="dataList"
|
||||
v-loading="loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table">
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #default="{ $index }">
|
||||
{{ (page.currentPage - 1) * page.pageSize + $index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="batchNo" label="批次号" width="160" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" width="120" align="center" />
|
||||
<el-table-column label="姓名" width="160" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<span v-if="row.systemRealName">{{ row.systemRealName }}</span>
|
||||
<span v-if="row.systemRealName && row.enrollRealName && row.systemRealName !== row.enrollRealName"
|
||||
class="text-danger">
|
||||
/ {{ row.enrollRealName }}
|
||||
</span>
|
||||
<span v-else-if="row.enrollRealName && !row.systemRealName">{{ row.enrollRealName }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="身份证号" width="200" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<div v-if="row.systemIdCard">系统：{{ row.systemIdCard }}</div>
|
||||
<div v-if="row.enrollIdCard && row.enrollIdCard !== row.systemIdCard" class="text-warning">
|
||||
学籍：{{ row.enrollIdCard }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="学籍号" width="200" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<div v-if="row.systemEnrollNo">系统：{{ row.systemEnrollNo }}</div>
|
||||
<div v-if="row.nationalEnrollNo && row.nationalEnrollNo !== row.systemEnrollNo" class="text-warning">
|
||||
全国：{{ row.nationalEnrollNo }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="className" label="班级" width="150" />
|
||||
<el-table-column prop="classMasterName" label="班主任" width="100" align="center" />
|
||||
<el-table-column prop="exceptionType" label="异常类型" width="140" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="getExceptionTagType(row.exceptionType)" size="small">
|
||||
{{ getExceptionTypeName(row.exceptionType) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="exceptionDesc" label="异常说明" min-width="250" show-overflow-tooltip />
|
||||
<el-table-column prop="reviewStatus" label="复核状态" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.reviewStatus === '1' ? 'success' : 'warning'" size="small">
|
||||
{{ row.reviewStatus === '1' ? '已复核' : '待复核' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="reviewResult" label="复核结果" width="150" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
v-if="row.reviewStatus === '0'"
|
||||
icon="Edit"
|
||||
link
|
||||
type="primary"
|
||||
@click="handleReview(row)">
|
||||
复核
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty>
|
||||
<el-empty description="暂无数据" :image-size="120" />
|
||||
</template>
|
||||
</el-table>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="dataList"
|
||||
v-loading="loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #default="{ $index }">
|
||||
{{ (page.currentPage - 1) * page.pageSize + $index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="batchNo" label="批次号" width="160" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" width="120" align="center" />
|
||||
<el-table-column label="姓名" width="160" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<span v-if="row.systemRealName">{{ row.systemRealName }}</span>
|
||||
<span v-if="row.systemRealName && row.enrollRealName && row.systemRealName !== row.enrollRealName" class="text-danger">
|
||||
/ {{ row.enrollRealName }}
|
||||
</span>
|
||||
<span v-else-if="row.enrollRealName && !row.systemRealName">{{ row.enrollRealName }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="身份证号" width="200" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<div v-if="row.systemIdCard">系统：{{ row.systemIdCard }}</div>
|
||||
<div v-if="row.enrollIdCard && row.enrollIdCard !== row.systemIdCard" class="text-warning">学籍：{{ row.enrollIdCard }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="学籍号" width="200" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<div v-if="row.systemEnrollNo">系统：{{ row.systemEnrollNo }}</div>
|
||||
<div v-if="row.nationalEnrollNo && row.nationalEnrollNo !== row.systemEnrollNo" class="text-warning">
|
||||
全国：{{ row.nationalEnrollNo }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="className" label="班级" width="150" />
|
||||
<el-table-column prop="classMasterName" label="班主任" width="100" align="center" />
|
||||
<el-table-column prop="exceptionType" label="异常类型" width="140" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="getExceptionTagType(row.exceptionType)" size="small">
|
||||
{{ getExceptionTypeName(row.exceptionType) }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="exceptionDesc" label="异常说明" min-width="250" show-overflow-tooltip />
|
||||
<el-table-column prop="reviewStatus" label="复核状态" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.reviewStatus === '1' ? 'success' : 'warning'" size="small">
|
||||
{{ row.reviewStatus === '1' ? '已复核' : '待复核' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="reviewResult" label="复核结果" width="150" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button v-if="row.reviewStatus === '0'" icon="Edit" link type="primary" @click="handleReview(row)"> 复核 </el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty>
|
||||
<el-empty description="暂无数据" :image-size="120" />
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
v-model:current-page="page.currentPage"
|
||||
v-model:page-size="page.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:total="page.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange" />
|
||||
</el-card>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
v-model:current-page="page.currentPage"
|
||||
v-model:page-size="page.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:total="page.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<!-- 复核弹窗 -->
|
||||
<el-dialog
|
||||
v-model="reviewDialogVisible"
|
||||
title="学籍信息复核"
|
||||
width="600px"
|
||||
:close-on-click-modal="false">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="学号">{{ reviewData.stuNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统姓名">{{ reviewData.systemRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学籍姓名">{{ reviewData.enrollRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级">{{ reviewData.className }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统身份证">{{ reviewData.systemIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学籍身份证">{{ reviewData.enrollIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统学籍号">{{ reviewData.systemEnrollNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全国学籍号">{{ reviewData.nationalEnrollNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="异常类型" :span="2">
|
||||
<el-tag :type="getExceptionTagType(reviewData.exceptionType)">
|
||||
{{ getExceptionTypeName(reviewData.exceptionType) }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="异常说明" :span="2">{{ reviewData.exceptionDesc }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-form :model="reviewForm" label-width="80px" class="review-form">
|
||||
<el-form-item label="复核结果">
|
||||
<el-radio-group v-model="reviewForm.reviewResult">
|
||||
<el-radio label="信息无误">信息无误</el-radio>
|
||||
<el-radio label="需修改系统">需修改系统</el-radio>
|
||||
<el-radio label="需修改学籍">需修改学籍</el-radio>
|
||||
<el-radio label="其他问题">其他问题</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="reviewDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitReview" :loading="reviewLoading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<!-- 复核弹窗 -->
|
||||
<el-dialog v-model="reviewDialogVisible" title="学籍信息复核" width="600px" :close-on-click-modal="false">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="学号">{{ reviewData.stuNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统姓名">{{ reviewData.systemRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学籍姓名">{{ reviewData.enrollRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级">{{ reviewData.className }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统身份证">{{ reviewData.systemIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学籍身份证">{{ reviewData.enrollIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统学籍号">{{ reviewData.systemEnrollNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全国学籍号">{{ reviewData.nationalEnrollNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="异常类型" :span="2">
|
||||
<el-tag :type="getExceptionTagType(reviewData.exceptionType)">
|
||||
{{ getExceptionTypeName(reviewData.exceptionType) }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="异常说明" :span="2">{{ reviewData.exceptionDesc }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-form :model="reviewForm" label-width="80px" class="review-form">
|
||||
<el-form-item label="复核结果">
|
||||
<el-radio-group v-model="reviewForm.reviewResult">
|
||||
<el-radio label="信息无误">信息无误</el-radio>
|
||||
<el-radio label="需修改系统">需修改系统</el-radio>
|
||||
<el-radio label="需修改学籍">需修改学籍</el-radio>
|
||||
<el-radio label="其他问题">其他问题</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="reviewDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitReview" :loading="reviewLoading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="EnrollCompare">
|
||||
import { reactive, ref, onMounted, computed } from 'vue'
|
||||
import { fetchList, importData, exportData, sendToClassMaster, submitReview as submitReviewApi, downloadTemplate } from '/@/api/basic/enrollcompare'
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message'
|
||||
import { Search, DocumentChecked, Upload, Download, Bell, Edit } from '@element-plus/icons-vue'
|
||||
import { reactive, ref, onMounted, computed } from 'vue';
|
||||
import { fetchList, importData, exportData, sendToClassMaster, submitReview as submitReviewApi, downloadTemplate } from '/@/api/basic/enrollcompare';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { Search, DocumentChecked, Upload, Download, Bell, Edit } from '@element-plus/icons-vue';
|
||||
|
||||
// 定义变量内容
|
||||
const searchFormRef = ref()
|
||||
const showSearch = ref(true)
|
||||
const loading = ref(false)
|
||||
const importLoading = ref(false)
|
||||
const reviewLoading = ref(false)
|
||||
const dataList = ref<any[]>([])
|
||||
const reviewDialogVisible = ref(false)
|
||||
const reviewData = ref<any>({})
|
||||
const searchFormRef = ref();
|
||||
const showSearch = ref(true);
|
||||
const loading = ref(false);
|
||||
const importLoading = ref(false);
|
||||
const reviewLoading = ref(false);
|
||||
const dataList = ref<any[]>([]);
|
||||
const reviewDialogVisible = ref(false);
|
||||
const reviewData = ref<any>({});
|
||||
const reviewForm = reactive({
|
||||
id: '',
|
||||
reviewResult: '信息无误'
|
||||
})
|
||||
id: '',
|
||||
reviewResult: '信息无误',
|
||||
});
|
||||
|
||||
// 统计数据
|
||||
const statistics = reactive({
|
||||
total: 0,
|
||||
pending: 0,
|
||||
reviewed: 0
|
||||
})
|
||||
total: 0,
|
||||
pending: 0,
|
||||
reviewed: 0,
|
||||
});
|
||||
|
||||
// 分页
|
||||
const page = reactive({
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
total: 0
|
||||
})
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
// 搜索表单
|
||||
const searchForm = reactive({
|
||||
batchNo: '',
|
||||
stuNo: '',
|
||||
systemRealName: '',
|
||||
exceptionType: '',
|
||||
reviewStatus: ''
|
||||
})
|
||||
batchNo: '',
|
||||
stuNo: '',
|
||||
systemRealName: '',
|
||||
exceptionType: '',
|
||||
reviewStatus: '',
|
||||
});
|
||||
|
||||
// 表格样式
|
||||
const tableStyle = {
|
||||
cellStyle: { textAlign: 'center' },
|
||||
headerCellStyle: {
|
||||
textAlign: 'center',
|
||||
background: 'var(--el-table-row-hover-bg-color)',
|
||||
color: 'var(--el-text-color-primary)'
|
||||
}
|
||||
}
|
||||
cellStyle: { textAlign: 'center' },
|
||||
headerCellStyle: {
|
||||
textAlign: 'center',
|
||||
background: 'var(--el-table-row-hover-bg-color)',
|
||||
color: 'var(--el-text-color-primary)',
|
||||
},
|
||||
};
|
||||
|
||||
// 获取异常类型名称
|
||||
const getExceptionTypeName = (type: string) => {
|
||||
const map: Record<string, string> = {
|
||||
'1': '姓名不一致',
|
||||
'2': '身份证不一致',
|
||||
'3': '学籍号不一致',
|
||||
'4': '毕业院校不一致',
|
||||
'5': '系统有学籍无',
|
||||
'6': '学籍有系统无'
|
||||
}
|
||||
return map[type] || type
|
||||
}
|
||||
const map: Record<string, string> = {
|
||||
'1': '姓名不一致',
|
||||
'2': '身份证不一致',
|
||||
'3': '学籍号不一致',
|
||||
'4': '毕业院校不一致',
|
||||
'5': '系统有学籍无',
|
||||
'6': '学籍有系统无',
|
||||
};
|
||||
return map[type] || type;
|
||||
};
|
||||
|
||||
// 获取异常类型标签颜色
|
||||
const getExceptionTagType = (type: string) => {
|
||||
const map: Record<string, string> = {
|
||||
'1': 'danger',
|
||||
'2': 'danger',
|
||||
'3': 'warning',
|
||||
'4': 'info',
|
||||
'5': 'warning',
|
||||
'6': 'warning'
|
||||
}
|
||||
return map[type] || 'info'
|
||||
}
|
||||
const map: Record<string, string> = {
|
||||
'1': 'danger',
|
||||
'2': 'danger',
|
||||
'3': 'warning',
|
||||
'4': 'info',
|
||||
'5': 'warning',
|
||||
'6': 'warning',
|
||||
};
|
||||
return map[type] || 'info';
|
||||
};
|
||||
|
||||
// 查询
|
||||
const handleSearch = () => {
|
||||
page.currentPage = 1
|
||||
getDataList()
|
||||
}
|
||||
page.currentPage = 1;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 重置
|
||||
const handleReset = () => {
|
||||
searchFormRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
searchFormRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 分页
|
||||
const handleSizeChange = (val: number) => {
|
||||
page.pageSize = val
|
||||
getDataList()
|
||||
}
|
||||
page.pageSize = val;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
const handleCurrentChange = (val: number) => {
|
||||
page.currentPage = val
|
||||
getDataList()
|
||||
}
|
||||
page.currentPage = val;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 获取数据列表
|
||||
const getDataList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await fetchList({
|
||||
current: page.currentPage,
|
||||
size: page.pageSize,
|
||||
...searchForm
|
||||
})
|
||||
if (res.data && res.data.records) {
|
||||
dataList.value = res.data.records
|
||||
page.total = res.data.total
|
||||
loading.value = true;
|
||||
try {
|
||||
const res = await fetchList({
|
||||
current: page.currentPage,
|
||||
size: page.pageSize,
|
||||
...searchForm,
|
||||
});
|
||||
if (res.data && res.data.records) {
|
||||
dataList.value = res.data.records;
|
||||
page.total = res.data.total;
|
||||
|
||||
// 计算统计数据
|
||||
statistics.total = res.data.total
|
||||
statistics.pending = dataList.value.filter((item: any) => item.reviewStatus === '0').length
|
||||
statistics.reviewed = dataList.value.filter((item: any) => item.reviewStatus === '1').length
|
||||
} else {
|
||||
dataList.value = []
|
||||
page.total = 0
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '获取数据失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
// 计算统计数据
|
||||
statistics.total = res.data.total;
|
||||
statistics.pending = dataList.value.filter((item: any) => item.reviewStatus === '0').length;
|
||||
statistics.reviewed = dataList.value.filter((item: any) => item.reviewStatus === '1').length;
|
||||
} else {
|
||||
dataList.value = [];
|
||||
page.total = 0;
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '获取数据失败');
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 上传前验证
|
||||
const beforeUpload = (file: File) => {
|
||||
const isExcel = file.name.endsWith('.xlsx') || file.name.endsWith('.xls')
|
||||
if (!isExcel) {
|
||||
useMessage().error('只能上传Excel文件')
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
const isExcel = file.name.endsWith('.xlsx') || file.name.endsWith('.xls');
|
||||
if (!isExcel) {
|
||||
useMessage().error('只能上传Excel文件');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
// 导入比对
|
||||
const handleImport = async (options: any) => {
|
||||
importLoading.value = true
|
||||
try {
|
||||
const res = await importData(options.file)
|
||||
useMessage().success(res.msg || '导入比对成功')
|
||||
// 自动填充批次号
|
||||
if (res.data) {
|
||||
searchForm.batchNo = ''
|
||||
}
|
||||
getDataList()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导入失败')
|
||||
} finally {
|
||||
importLoading.value = false
|
||||
}
|
||||
}
|
||||
importLoading.value = true;
|
||||
try {
|
||||
const res = await importData(options.file);
|
||||
useMessage().success(res.msg || '导入比对成功');
|
||||
// 自动填充批次号
|
||||
if (res.data) {
|
||||
searchForm.batchNo = '';
|
||||
}
|
||||
getDataList();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导入失败');
|
||||
} finally {
|
||||
importLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 下载模板
|
||||
const handleDownloadTemplate = async () => {
|
||||
try {
|
||||
const res = await downloadTemplate()
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.download = '全国学籍导入模板.xlsx'
|
||||
link.click()
|
||||
window.URL.revokeObjectURL(url)
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '下载失败')
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await downloadTemplate();
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = '全国学籍导入模板.xlsx';
|
||||
link.click();
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '下载失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 导出
|
||||
const handleExport = async () => {
|
||||
try {
|
||||
const res = await exportData(searchForm)
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.download = '学籍比对异常数据.xlsx'
|
||||
link.click()
|
||||
window.URL.revokeObjectURL(url)
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导出失败')
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await exportData(searchForm);
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = '学籍比对异常数据.xlsx';
|
||||
link.click();
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导出失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 下发班主任
|
||||
const handleSend = async () => {
|
||||
if (!searchForm.batchNo) {
|
||||
useMessage().warning('请先选择批次号')
|
||||
return
|
||||
}
|
||||
try {
|
||||
await useMessageBox().confirm('确定要将该批次异常数据下发至班主任复核吗？')
|
||||
await sendToClassMaster(searchForm.batchNo)
|
||||
useMessage().success('下发成功')
|
||||
} catch (err: any) {
|
||||
if (err !== 'cancel') {
|
||||
useMessage().error(err.msg || '下发失败')
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!searchForm.batchNo) {
|
||||
useMessage().warning('请先选择批次号');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await useMessageBox().confirm('确定要将该批次异常数据下发至班主任复核吗？');
|
||||
await sendToClassMaster(searchForm.batchNo);
|
||||
useMessage().success('下发成功');
|
||||
} catch (err: any) {
|
||||
if (err !== 'cancel') {
|
||||
useMessage().error(err.msg || '下发失败');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 复核
|
||||
const handleReview = (row: any) => {
|
||||
reviewData.value = row
|
||||
reviewForm.id = row.id
|
||||
reviewForm.reviewResult = '信息无误'
|
||||
reviewDialogVisible.value = true
|
||||
}
|
||||
reviewData.value = row;
|
||||
reviewForm.id = row.id;
|
||||
reviewForm.reviewResult = '信息无误';
|
||||
reviewDialogVisible.value = true;
|
||||
};
|
||||
|
||||
// 提交复核
|
||||
const submitReview = async () => {
|
||||
reviewLoading.value = true
|
||||
try {
|
||||
await submitReviewApi(reviewForm.id, reviewForm.reviewResult)
|
||||
useMessage().success('复核成功')
|
||||
reviewDialogVisible.value = false
|
||||
getDataList()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '复核失败')
|
||||
} finally {
|
||||
reviewLoading.value = false
|
||||
}
|
||||
}
|
||||
reviewLoading.value = true;
|
||||
try {
|
||||
await submitReviewApi(reviewForm.id, reviewForm.reviewResult);
|
||||
useMessage().success('复核成功');
|
||||
reviewDialogVisible.value = false;
|
||||
getDataList();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '复核失败');
|
||||
} finally {
|
||||
reviewLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getDataList()
|
||||
})
|
||||
getDataList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '/@/assets/styles/modern-page.scss';
|
||||
|
||||
.stat-row {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: var(--el-color-danger);
|
||||
color: var(--el-color-danger);
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: var(--el-color-warning);
|
||||
color: var(--el-color-warning);
|
||||
}
|
||||
|
||||
.review-form {
|
||||
margin-top: 16px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,495 +1,450 @@
|
||||
<template>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="批次号" prop="batchNo">
|
||||
<el-input
|
||||
v-model="searchForm.batchNo"
|
||||
placeholder="请输入批次号"
|
||||
clearable
|
||||
style="width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input
|
||||
v-model="searchForm.stuNo"
|
||||
placeholder="请输入学号"
|
||||
clearable
|
||||
style="width: 150px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="systemRealName">
|
||||
<el-input
|
||||
v-model="searchForm.systemRealName"
|
||||
placeholder="请输入姓名"
|
||||
clearable
|
||||
style="width: 120px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="入学年份" prop="enterYear">
|
||||
<el-date-picker
|
||||
v-model="searchForm.enterYear"
|
||||
type="year"
|
||||
placeholder="选择年份"
|
||||
value-format="YYYY"
|
||||
style="width: 120px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否一致" prop="isMatch">
|
||||
<el-select
|
||||
v-model="searchForm.isMatch"
|
||||
placeholder="请选择"
|
||||
clearable
|
||||
style="width: 120px">
|
||||
<el-option label="一致" value="1" />
|
||||
<el-option label="不一致" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="核对状态" prop="verifyStatus">
|
||||
<el-select
|
||||
v-model="searchForm.verifyStatus"
|
||||
placeholder="请选择核对状态"
|
||||
clearable
|
||||
style="width: 120px">
|
||||
<el-option label="待核对" value="0" />
|
||||
<el-option label="已核对" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<div class="modern-page-container">
|
||||
<div class="page-wrapper">
|
||||
<!-- 搜索表单卡片 -->
|
||||
<el-card v-show="showSearch" class="search-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><Search /></el-icon>
|
||||
筛选条件
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form :model="searchForm" ref="searchFormRef" :inline="true" @keyup.enter="handleSearch" class="search-form">
|
||||
<el-form-item label="批次号" prop="batchNo">
|
||||
<el-input v-model="searchForm.batchNo" placeholder="请输入批次号" clearable style="width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="学号" prop="stuNo">
|
||||
<el-input v-model="searchForm.stuNo" placeholder="请输入学号" clearable style="width: 150px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="systemRealName">
|
||||
<el-input v-model="searchForm.systemRealName" placeholder="请输入姓名" clearable style="width: 120px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="入学年份" prop="enterYear">
|
||||
<el-date-picker v-model="searchForm.enterYear" type="year" placeholder="选择年份" value-format="YYYY" style="width: 120px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否一致" prop="isMatch">
|
||||
<el-select v-model="searchForm.isMatch" placeholder="请选择" clearable style="width: 120px">
|
||||
<el-option label="一致" value="1" />
|
||||
<el-option label="不一致" value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="核对状态" prop="verifyStatus">
|
||||
<el-select v-model="searchForm.verifyStatus" placeholder="请选择核对状态" clearable style="width: 120px">
|
||||
<el-option label="待核对" value="0" />
|
||||
<el-option label="已核对" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="Refresh" @click="handleReset">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><User /></el-icon>
|
||||
毕业学生信息核对
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<el-upload
|
||||
:show-file-list="false"
|
||||
:before-upload="beforeUpload"
|
||||
:http-request="handleImport"
|
||||
accept=".xlsx,.xls"
|
||||
class="upload-btn">
|
||||
<el-button type="primary" icon="Upload" :loading="importLoading">导入核对</el-button>
|
||||
</el-upload>
|
||||
<el-button type="success" icon="Download" @click="handleDownloadTemplate">下载模板</el-button>
|
||||
<el-button type="warning" icon="Download" @click="handleExport">导出数据</el-button>
|
||||
<el-button type="info" icon="Bell" @click="handleSend" :disabled="!searchForm.batchNo">下发班主任</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
class="ml10"
|
||||
@queryTable="getDataList" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- 内容卡片 -->
|
||||
<el-card class="content-card" shadow="never">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">
|
||||
<el-icon class="title-icon"><User /></el-icon>
|
||||
毕业学生信息核对
|
||||
</span>
|
||||
<div class="header-actions">
|
||||
<el-upload :show-file-list="false" :before-upload="beforeUpload" :http-request="handleImport" accept=".xlsx,.xls" class="upload-btn">
|
||||
<el-button type="primary" icon="Upload" :loading="importLoading">导入核对</el-button>
|
||||
</el-upload>
|
||||
<el-button type="success" icon="Download" @click="handleDownloadTemplate">下载模板</el-button>
|
||||
<el-button type="warning" icon="Download" @click="handleExport">导出数据</el-button>
|
||||
<el-button type="info" icon="Bell" @click="handleSend" :disabled="!searchForm.batchNo">下发班主任</el-button>
|
||||
<right-toolbar v-model:showSearch="showSearch" class="ml10" @queryTable="getDataList" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- 统计卡片 -->
|
||||
<el-row :gutter="16" class="stat-row">
|
||||
<el-col :span="4">
|
||||
<el-statistic title="总核对数" :value="statistics.total" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="信息一致" :value="statistics.matched">
|
||||
<template #suffix>
|
||||
<span class="text-success">人</span>
|
||||
</template>
|
||||
</el-statistic>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="信息不一致" :value="statistics.mismatched">
|
||||
<template #suffix>
|
||||
<span class="text-danger">人</span>
|
||||
</template>
|
||||
</el-statistic>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="待核对" :value="statistics.pending" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="已核对" :value="statistics.verified" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 统计卡片 -->
|
||||
<el-row :gutter="16" class="stat-row">
|
||||
<el-col :span="4">
|
||||
<el-statistic title="总核对数" :value="statistics.total" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="信息一致" :value="statistics.matched">
|
||||
<template #suffix>
|
||||
<span class="text-success">人</span>
|
||||
</template>
|
||||
</el-statistic>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="信息不一致" :value="statistics.mismatched">
|
||||
<template #suffix>
|
||||
<span class="text-danger">人</span>
|
||||
</template>
|
||||
</el-statistic>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="待核对" :value="statistics.pending" />
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-statistic title="已核对" :value="statistics.verified" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="dataList"
|
||||
v-loading="loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table">
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #default="{ $index }">
|
||||
{{ (page.currentPage - 1) * page.pageSize + $index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="batchNo" label="批次号" width="160" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" width="120" align="center" />
|
||||
<el-table-column label="姓名" width="180" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<span v-if="row.systemRealName">系统：{{ row.systemRealName }}</span>
|
||||
<span v-if="row.systemRealName && row.enrollRealName && row.systemRealName !== row.enrollRealName"
|
||||
class="text-danger">
|
||||
<br />回流：{{ row.enrollRealName }}
|
||||
</span>
|
||||
<span v-else-if="row.enrollRealName && !row.systemRealName">回流：{{ row.enrollRealName }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="身份证号" width="220" align="center">
|
||||
<template #default="{ row }">
|
||||
<div v-if="row.systemIdCard || row.enrollIdCard">
|
||||
<div v-if="row.systemIdCard">系统：{{ row.systemIdCard }}</div>
|
||||
<div v-if="row.enrollIdCard && row.enrollIdCard !== row.systemIdCard" class="text-warning">
|
||||
回流：{{ row.enrollIdCard }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="enrollNo" label="学籍号" width="180" align="center" />
|
||||
<el-table-column prop="className" label="班级" width="150" />
|
||||
<el-table-column prop="classMasterName" label="班主任" width="100" align="center" />
|
||||
<el-table-column prop="enterYear" label="入学年份" width="100" align="center" />
|
||||
<el-table-column prop="isMatch" label="是否一致" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.isMatch === '1' ? 'success' : 'danger'" size="small">
|
||||
{{ row.isMatch === '1' ? '一致' : '不一致' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="verifyStatus" label="核对状态" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.verifyStatus === '1' ? 'success' : 'warning'" size="small">
|
||||
{{ row.verifyStatus === '1' ? '已核对' : '待核对' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="verifyResult" label="核对结果" width="150" show-overflow-tooltip />
|
||||
<el-table-column prop="remarks" label="备注" width="150" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
v-if="row.verifyStatus === '0'"
|
||||
icon="Edit"
|
||||
link
|
||||
type="primary"
|
||||
@click="handleVerify(row)">
|
||||
核对
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty>
|
||||
<el-empty description="暂无数据" :image-size="120" />
|
||||
</template>
|
||||
</el-table>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
:data="dataList"
|
||||
v-loading="loading"
|
||||
stripe
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
class="modern-table"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="70" align="center">
|
||||
<template #default="{ $index }">
|
||||
{{ (page.currentPage - 1) * page.pageSize + $index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="batchNo" label="批次号" width="160" align="center" />
|
||||
<el-table-column prop="stuNo" label="学号" width="120" align="center" />
|
||||
<el-table-column label="姓名" width="180" align="center">
|
||||
<template #default="{ row }">
|
||||
<div>
|
||||
<span v-if="row.systemRealName">系统：{{ row.systemRealName }}</span>
|
||||
<span v-if="row.systemRealName && row.enrollRealName && row.systemRealName !== row.enrollRealName" class="text-danger">
|
||||
<br />回流：{{ row.enrollRealName }}
|
||||
</span>
|
||||
<span v-else-if="row.enrollRealName && !row.systemRealName">回流：{{ row.enrollRealName }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="身份证号" width="220" align="center">
|
||||
<template #default="{ row }">
|
||||
<div v-if="row.systemIdCard || row.enrollIdCard">
|
||||
<div v-if="row.systemIdCard">系统：{{ row.systemIdCard }}</div>
|
||||
<div v-if="row.enrollIdCard && row.enrollIdCard !== row.systemIdCard" class="text-warning">回流：{{ row.enrollIdCard }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="enrollNo" label="学籍号" width="180" align="center" />
|
||||
<el-table-column prop="className" label="班级" width="150" />
|
||||
<el-table-column prop="classMasterName" label="班主任" width="100" align="center" />
|
||||
<el-table-column prop="enterYear" label="入学年份" width="100" align="center" />
|
||||
<el-table-column prop="isMatch" label="是否一致" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.isMatch === '1' ? 'success' : 'danger'" size="small">
|
||||
{{ row.isMatch === '1' ? '一致' : '不一致' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="verifyStatus" label="核对状态" width="100" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.verifyStatus === '1' ? 'success' : 'warning'" size="small">
|
||||
{{ row.verifyStatus === '1' ? '已核对' : '待核对' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="verifyResult" label="核对结果" width="150" show-overflow-tooltip />
|
||||
<el-table-column prop="remarks" label="备注" width="150" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="120" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button v-if="row.verifyStatus === '0'" icon="Edit" link type="primary" @click="handleVerify(row)"> 核对 </el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty>
|
||||
<el-empty description="暂无数据" :image-size="120" />
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
v-model:current-page="page.currentPage"
|
||||
v-model:page-size="page.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:total="page.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange" />
|
||||
</el-card>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
v-model:current-page="page.currentPage"
|
||||
v-model:page-size="page.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:total="page.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<!-- 核对弹窗 -->
|
||||
<el-dialog
|
||||
v-model="verifyDialogVisible"
|
||||
title="毕业学生信息核对"
|
||||
width="600px"
|
||||
:close-on-click-modal="false">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="学号">{{ verifyData.stuNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学年份">{{ verifyData.enterYear }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统姓名">{{ verifyData.systemRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="回流姓名">{{ verifyData.enrollRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统身份证">{{ verifyData.systemIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="回流身份证">{{ verifyData.enrollIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学籍号">{{ verifyData.enrollNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级">{{ verifyData.className }}</el-descriptions-item>
|
||||
<el-descriptions-item label="信息是否一致" :span="2">
|
||||
<el-tag :type="verifyData.isMatch === '1' ? 'success' : 'danger'">
|
||||
{{ verifyData.isMatch === '1' ? '一致' : '不一致' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="verifyData.remarks" label="备注" :span="2">{{ verifyData.remarks }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-form :model="verifyForm" label-width="80px" class="verify-form">
|
||||
<el-form-item label="核对结果">
|
||||
<el-radio-group v-model="verifyForm.verifyResult">
|
||||
<el-radio label="信息无误">信息无误</el-radio>
|
||||
<el-radio label="需修改系统">需修改系统</el-radio>
|
||||
<el-radio label="需修改回流">需修改回流</el-radio>
|
||||
<el-radio label="其他问题">其他问题</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="verifyDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitVerify" :loading="verifyLoading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<!-- 核对弹窗 -->
|
||||
<el-dialog v-model="verifyDialogVisible" title="毕业学生信息核对" width="600px" :close-on-click-modal="false">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="学号">{{ verifyData.stuNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="入学年份">{{ verifyData.enterYear }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统姓名">{{ verifyData.systemRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="回流姓名">{{ verifyData.enrollRealName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统身份证">{{ verifyData.systemIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="回流身份证">{{ verifyData.enrollIdCard }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学籍号">{{ verifyData.enrollNo }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级">{{ verifyData.className }}</el-descriptions-item>
|
||||
<el-descriptions-item label="信息是否一致" :span="2">
|
||||
<el-tag :type="verifyData.isMatch === '1' ? 'success' : 'danger'">
|
||||
{{ verifyData.isMatch === '1' ? '一致' : '不一致' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="verifyData.remarks" label="备注" :span="2">{{ verifyData.remarks }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-form :model="verifyForm" label-width="80px" class="verify-form">
|
||||
<el-form-item label="核对结果">
|
||||
<el-radio-group v-model="verifyForm.verifyResult">
|
||||
<el-radio label="信息无误">信息无误</el-radio>
|
||||
<el-radio label="需修改系统">需修改系统</el-radio>
|
||||
<el-radio label="需修改回流">需修改回流</el-radio>
|
||||
<el-radio label="其他问题">其他问题</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="verifyDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitVerify" :loading="verifyLoading">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="GraduVerify">
|
||||
import { reactive, ref, onMounted } from 'vue'
|
||||
import { fetchList, importData, exportData, sendToClassMaster, submitVerify as submitVerifyApi, downloadTemplate } from '/@/api/basic/graduverify'
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message'
|
||||
import { Search, User, Upload, Download, Bell, Edit } from '@element-plus/icons-vue'
|
||||
import { reactive, ref, onMounted } from 'vue';
|
||||
import { fetchList, importData, exportData, sendToClassMaster, submitVerify as submitVerifyApi, downloadTemplate } from '/@/api/basic/graduverify';
|
||||
import { useMessage, useMessageBox } from '/@/hooks/message';
|
||||
import { Search, User, Upload, Download, Bell, Edit } from '@element-plus/icons-vue';
|
||||
|
||||
// 定义变量内容
|
||||
const searchFormRef = ref()
|
||||
const showSearch = ref(true)
|
||||
const loading = ref(false)
|
||||
const importLoading = ref(false)
|
||||
const verifyLoading = ref(false)
|
||||
const dataList = ref<any[]>([])
|
||||
const verifyDialogVisible = ref(false)
|
||||
const verifyData = ref<any>({})
|
||||
const searchFormRef = ref();
|
||||
const showSearch = ref(true);
|
||||
const loading = ref(false);
|
||||
const importLoading = ref(false);
|
||||
const verifyLoading = ref(false);
|
||||
const dataList = ref<any[]>([]);
|
||||
const verifyDialogVisible = ref(false);
|
||||
const verifyData = ref<any>({});
|
||||
const verifyForm = reactive({
|
||||
id: '',
|
||||
verifyResult: '信息无误'
|
||||
})
|
||||
id: '',
|
||||
verifyResult: '信息无误',
|
||||
});
|
||||
|
||||
// 统计数据
|
||||
const statistics = reactive({
|
||||
total: 0,
|
||||
matched: 0,
|
||||
mismatched: 0,
|
||||
pending: 0,
|
||||
verified: 0
|
||||
})
|
||||
total: 0,
|
||||
matched: 0,
|
||||
mismatched: 0,
|
||||
pending: 0,
|
||||
verified: 0,
|
||||
});
|
||||
|
||||
// 分页
|
||||
const page = reactive({
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
total: 0
|
||||
})
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
// 搜索表单
|
||||
const searchForm = reactive({
|
||||
batchNo: '',
|
||||
stuNo: '',
|
||||
systemRealName: '',
|
||||
enterYear: undefined as number | undefined,
|
||||
isMatch: '',
|
||||
verifyStatus: ''
|
||||
})
|
||||
batchNo: '',
|
||||
stuNo: '',
|
||||
systemRealName: '',
|
||||
enterYear: undefined as number | undefined,
|
||||
isMatch: '',
|
||||
verifyStatus: '',
|
||||
});
|
||||
|
||||
// 表格样式
|
||||
const tableStyle = {
|
||||
cellStyle: { textAlign: 'center' },
|
||||
headerCellStyle: {
|
||||
textAlign: 'center',
|
||||
background: 'var(--el-table-row-hover-bg-color)',
|
||||
color: 'var(--el-text-color-primary)'
|
||||
}
|
||||
}
|
||||
cellStyle: { textAlign: 'center' },
|
||||
headerCellStyle: {
|
||||
textAlign: 'center',
|
||||
background: 'var(--el-table-row-hover-bg-color)',
|
||||
color: 'var(--el-text-color-primary)',
|
||||
},
|
||||
};
|
||||
|
||||
// 查询
|
||||
const handleSearch = () => {
|
||||
page.currentPage = 1
|
||||
getDataList()
|
||||
}
|
||||
page.currentPage = 1;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 重置
|
||||
const handleReset = () => {
|
||||
searchFormRef.value?.resetFields()
|
||||
getDataList()
|
||||
}
|
||||
searchFormRef.value?.resetFields();
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 分页
|
||||
const handleSizeChange = (val: number) => {
|
||||
page.pageSize = val
|
||||
getDataList()
|
||||
}
|
||||
page.pageSize = val;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
const handleCurrentChange = (val: number) => {
|
||||
page.currentPage = val
|
||||
getDataList()
|
||||
}
|
||||
page.currentPage = val;
|
||||
getDataList();
|
||||
};
|
||||
|
||||
// 获取数据列表
|
||||
const getDataList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await fetchList({
|
||||
current: page.currentPage,
|
||||
size: page.pageSize,
|
||||
...searchForm,
|
||||
enterYear: searchForm.enterYear ? parseInt(searchForm.enterYear as any) : undefined
|
||||
})
|
||||
if (res.data && res.data.records) {
|
||||
dataList.value = res.data.records
|
||||
page.total = res.data.total
|
||||
loading.value = true;
|
||||
try {
|
||||
const res = await fetchList({
|
||||
current: page.currentPage,
|
||||
size: page.pageSize,
|
||||
...searchForm,
|
||||
enterYear: searchForm.enterYear ? parseInt(searchForm.enterYear as any) : undefined,
|
||||
});
|
||||
if (res.data && res.data.records) {
|
||||
dataList.value = res.data.records;
|
||||
page.total = res.data.total;
|
||||
|
||||
// 计算统计数据
|
||||
statistics.total = res.data.total
|
||||
statistics.matched = dataList.value.filter((item: any) => item.isMatch === '1').length
|
||||
statistics.mismatched = dataList.value.filter((item: any) => item.isMatch === '0').length
|
||||
statistics.pending = dataList.value.filter((item: any) => item.verifyStatus === '0').length
|
||||
statistics.verified = dataList.value.filter((item: any) => item.verifyStatus === '1').length
|
||||
} else {
|
||||
dataList.value = []
|
||||
page.total = 0
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '获取数据失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
// 计算统计数据
|
||||
statistics.total = res.data.total;
|
||||
statistics.matched = dataList.value.filter((item: any) => item.isMatch === '1').length;
|
||||
statistics.mismatched = dataList.value.filter((item: any) => item.isMatch === '0').length;
|
||||
statistics.pending = dataList.value.filter((item: any) => item.verifyStatus === '0').length;
|
||||
statistics.verified = dataList.value.filter((item: any) => item.verifyStatus === '1').length;
|
||||
} else {
|
||||
dataList.value = [];
|
||||
page.total = 0;
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '获取数据失败');
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 上传前验证
|
||||
const beforeUpload = (file: File) => {
|
||||
const isExcel = file.name.endsWith('.xlsx') || file.name.endsWith('.xls')
|
||||
if (!isExcel) {
|
||||
useMessage().error('只能上传Excel文件')
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
const isExcel = file.name.endsWith('.xlsx') || file.name.endsWith('.xls');
|
||||
if (!isExcel) {
|
||||
useMessage().error('只能上传Excel文件');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
// 导入核对
|
||||
const handleImport = async (options: any) => {
|
||||
importLoading.value = true
|
||||
try {
|
||||
const res = await importData(options.file)
|
||||
useMessage().success(res.msg || '导入核对成功')
|
||||
if (res.data) {
|
||||
searchForm.batchNo = ''
|
||||
}
|
||||
getDataList()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导入失败')
|
||||
} finally {
|
||||
importLoading.value = false
|
||||
}
|
||||
}
|
||||
importLoading.value = true;
|
||||
try {
|
||||
const res = await importData(options.file);
|
||||
useMessage().success(res.msg || '导入核对成功');
|
||||
if (res.data) {
|
||||
searchForm.batchNo = '';
|
||||
}
|
||||
getDataList();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导入失败');
|
||||
} finally {
|
||||
importLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 下载模板
|
||||
const handleDownloadTemplate = async () => {
|
||||
try {
|
||||
const res = await downloadTemplate()
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.download = '毕业学籍回流导入模板.xlsx'
|
||||
link.click()
|
||||
window.URL.revokeObjectURL(url)
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '下载失败')
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await downloadTemplate();
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = '毕业学籍回流导入模板.xlsx';
|
||||
link.click();
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '下载失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 导出
|
||||
const handleExport = async () => {
|
||||
try {
|
||||
const res = await exportData(searchForm)
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.download = '毕业学生核对数据.xlsx'
|
||||
link.click()
|
||||
window.URL.revokeObjectURL(url)
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导出失败')
|
||||
}
|
||||
}
|
||||
try {
|
||||
const res = await exportData(searchForm);
|
||||
const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = '毕业学生核对数据.xlsx';
|
||||
link.click();
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '导出失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 下发班主任
|
||||
const handleSend = async () => {
|
||||
if (!searchForm.batchNo) {
|
||||
useMessage().warning('请先选择批次号')
|
||||
return
|
||||
}
|
||||
try {
|
||||
await useMessageBox().confirm('确定要将该批次数据下发至班主任核对吗？')
|
||||
await sendToClassMaster(searchForm.batchNo)
|
||||
useMessage().success('下发成功')
|
||||
} catch (err: any) {
|
||||
if (err !== 'cancel') {
|
||||
useMessage().error(err.msg || '下发失败')
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!searchForm.batchNo) {
|
||||
useMessage().warning('请先选择批次号');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await useMessageBox().confirm('确定要将该批次数据下发至班主任核对吗？');
|
||||
await sendToClassMaster(searchForm.batchNo);
|
||||
useMessage().success('下发成功');
|
||||
} catch (err: any) {
|
||||
if (err !== 'cancel') {
|
||||
useMessage().error(err.msg || '下发失败');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 核对
|
||||
const handleVerify = (row: any) => {
|
||||
verifyData.value = row
|
||||
verifyForm.id = row.id
|
||||
verifyForm.verifyResult = '信息无误'
|
||||
verifyDialogVisible.value = true
|
||||
}
|
||||
verifyData.value = row;
|
||||
verifyForm.id = row.id;
|
||||
verifyForm.verifyResult = '信息无误';
|
||||
verifyDialogVisible.value = true;
|
||||
};
|
||||
|
||||
// 提交核对
|
||||
const submitVerify = async () => {
|
||||
verifyLoading.value = true
|
||||
try {
|
||||
await submitVerifyApi(verifyForm.id, verifyForm.verifyResult)
|
||||
useMessage().success('核对成功')
|
||||
verifyDialogVisible.value = false
|
||||
getDataList()
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '核对失败')
|
||||
} finally {
|
||||
verifyLoading.value = false
|
||||
}
|
||||
}
|
||||
verifyLoading.value = true;
|
||||
try {
|
||||
await submitVerifyApi(verifyForm.id, verifyForm.verifyResult);
|
||||
useMessage().success('核对成功');
|
||||
verifyDialogVisible.value = false;
|
||||
getDataList();
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg || '核对失败');
|
||||
} finally {
|
||||
verifyLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getDataList()
|
||||
})
|
||||
getDataList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '/@/assets/styles/modern-page.scss';
|
||||
|
||||
.stat-row {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: var(--el-color-danger);
|
||||
color: var(--el-color-danger);
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: var(--el-color-warning);
|
||||
color: var(--el-color-warning);
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: var(--el-color-success);
|
||||
color: var(--el-color-success);
|
||||
}
|
||||
|
||||
.verify-form {
|
||||
margin-top: 16px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user