fix
This commit is contained in:
吴红兵
@@ -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>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user