zhaichao/education
1
0
Fork 0
forked from liweijie/education
Code Pull Requests Activity

前端代码

Browse Source
This commit is contained in:
liumengyu
2026-08-21 18:42:51 +08:00
parent 054947482f
commit 04e06a9c9a
762 changed files with 62992 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/student/score/index.vue
+15
View File
@@ -0,0 +1,15 @@
<template>
<div class="app-container">
<placeholder-page title="学员成绩管理" icon="form"
description="用于管理学员各课程的考核成绩，支持录入、查询、统计与导出。" />
</div>
</template>
<script>
import PlaceholderPage from "@/components/PlaceholderPage"
export default {
name: "Score",
components: { PlaceholderPage }
}
</script>
frontend/src/views/student/shiftTeam/index.vue
+772
View File
@@ -0,0 +1,772 @@
<template>
<div class="app-container shift-team-page">
<!-- 查询条件 -->
<el-card shadow="never" class="search-card">
<el-form :model="searchForm" label-width="150px" class="search-form">
<el-row :gutter="0">
<!-- 左栏 -->
<el-col :span="12">
<el-form-item label="专业">
<el-input v-model="searchForm.zy" placeholder="请输入专业" clearable />
</el-form-item>
<el-form-item label="班次">
<el-input v-model="searchForm.bc" placeholder="请输入班次" clearable />
</el-form-item>
<el-form-item label="培训任务">
<el-input v-model="searchForm.pxrw" placeholder="请输入培训任务" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.sxlxEnabled">虚实类型</el-checkbox></template>
<el-checkbox v-model="searchForm.xnbc" :disabled="!searchForm.sxlxEnabled">虚拟(虚班次不参与冲突检查)</el-checkbox>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.xydlxEnabled">学员队类型</el-checkbox></template>
<el-select v-model="searchForm.xydlx" placeholder="请选择学员队类型" class="w-full" :disabled="!searchForm.xydlxEnabled">
<el-option v-for="item in studentTeamTypeOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxlxEnabled">培训类型</el-checkbox></template>
<el-select v-model="searchForm.pxlx" placeholder="请选择培训类型" class="w-full" :disabled="!searchForm.pxlxEnabled">
<el-option v-for="item in trainTypeOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.ksrqEnabled">开学日期</el-checkbox></template>
<div class="date-range">
<span>从</span>
<el-date-picker v-model="searchForm.ksrqStart" type="date" value-format="yyyy-MM-dd" placeholder="开始日期" class="date-picker" :disabled="!searchForm.ksrqEnabled" />
<span>到</span>
<el-date-picker v-model="searchForm.ksrqEnd" type="date" value-format="yyyy-MM-dd" placeholder="结束日期" class="date-picker" :disabled="!searchForm.ksrqEnabled" />
</div>
</el-form-item>
</el-col>
<!-- 右栏 -->
<el-col :span="12">
<el-form-item label="年级">
<el-input v-model="searchForm.nj" placeholder="请输入年级" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.rwlbEnabled">任务类别</el-checkbox></template>
<el-select v-model="searchForm.rwlb" placeholder="请选择任务类别" class="w-full" :disabled="!searchForm.rwlbEnabled">
<el-option v-for="item in taskCategoryOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="学期">
<el-select v-model="searchForm.xq" placeholder="请选择学期" clearable class="w-full">
<el-option v-for="item in semesterList" :key="item.xqbh" :label="item.xqmc" :value="item.xqbh" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.zxztEnabled">在校状态</el-checkbox></template>
<el-select v-model="searchForm.zxzt" placeholder="请选择在校状态" class="w-full" :disabled="!searchForm.zxztEnabled">
<el-option v-for="item in statusOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxlx2Enabled">培训类型2</el-checkbox></template>
<el-select v-model="searchForm.pxlx2" placeholder="请选择培训类型2" class="w-full" :disabled="!searchForm.pxlx2Enabled">
<el-option v-for="item in trainTypeOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxccEnabled">培训层次</el-checkbox></template>
<el-select v-model="searchForm.pxcc" placeholder="请选择培训层次" class="w-full" :disabled="!searchForm.pxccEnabled">
<el-option v-for="item in trainLevelOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.byrqEnabled">毕业日期</el-checkbox></template>
<div class="date-range">
<span>从</span>
<el-date-picker v-model="searchForm.byrqStart" type="date" value-format="yyyy-MM-dd" placeholder="开始日期" class="date-picker" :disabled="!searchForm.byrqEnabled" />
<span>到</span>
<el-date-picker v-model="searchForm.byrqEnd" type="date" value-format="yyyy-MM-dd" placeholder="结束日期" class="date-picker" :disabled="!searchForm.byrqEnabled" />
</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="search-tip">
注意：勾选"选择框"表示启用该项对应的查询条件。
</div>
<div class="search-actions">
<el-button type="primary" @click="handleSearch">查询</el-button>
</div>
</el-card>
<!-- 教学班次列表 -->
<div class="list-title">教学班次列表：</div>
<div class="toolbar">
<div class="left-group">
<el-button type="primary" @click="handleNew">新建教学班次</el-button>
<el-button type="primary" @click="handleDownloadClassList">班次列表下载</el-button>
<el-button type="primary" @click="handleDownloadTaskOverview">培训任务一览下载</el-button>
</div>
</div>
<el-card shadow="never" class="upload-card">
<div class="upload-row">
<el-button type="primary" @click="handleDownloadTemplate">【学员队数据文件模板】下载</el-button>
<div class="file-input">
<input ref="fileInput" type="file" accept=".xls,.xlsx" style="display: none" @change="handleFileChange" />
<el-button type="primary" plain @click="handleChooseFile">选择文件</el-button>
<span class="file-name">{{ fileName }}</span>
</div>
<el-button type="primary" plain @click="handleUploadData">上传数据</el-button>
</div>
</el-card>
<el-card shadow="never" class="table-card">
<el-table
v-loading="loading"
:data="tableData"
stripe
border
highlight-current-row
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="40" align="center" />
<el-table-column prop="rwlb" label="分类" width="100" align="center" />
<el-table-column label="年级专业人才培养方案" min-width="170" show-overflow-tooltip>
<template slot-scope="{ row }">{{ row.nj || '' }}{{ row.zydh ? ' / ' + row.zydh : '' }}</template>
</el-table-column>
<el-table-column prop="pxrwbsh" label="培训任务" min-width="120" show-overflow-tooltip />
<el-table-column prop="xydmc" label="队别班次" min-width="130" show-overflow-tooltip />
<el-table-column label="入学毕业日期" min-width="170" align="center">
<template slot-scope="{ row }">{{ formatDate(row.rxrq) }} ~ {{ formatDate(row.byrq) }}</template>
</el-table-column>
<el-table-column prop="xq" label="已排课学期列表" min-width="140" show-overflow-tooltip />
<el-table-column prop="xydrs" label="当前人数" width="90" align="center" />
<el-table-column prop="zhrs" label="注册人数" width="90" align="center" />
<el-table-column prop="pj" label="学员评测" min-width="120" align="center" />
<el-table-column prop="bz" label="备注" min-width="120" show-overflow-tooltip />
</el-table>
<div class="pagination-wrap">
<el-pagination
:current-page="pagination.pageNum"
:page-size="pagination.pageSize"
:total="pagination.total"
:page-sizes="[10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</el-card>
<!-- 新建教学班次对话框 -->
<el-dialog
:visible="addDialogVisible"
title="新建教学班次"
width="750px"
:close-on-click-modal="false"
@update:visible="val => addDialogVisible = val"
>
<el-form :model="addForm" label-width="120px" class="add-form">
<el-divider content-position="left">班次信息</el-divider>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="学员队编号" required><el-input v-model="addForm.clazz.xydbh" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="学员队名称" required><el-input v-model="addForm.clazz.xydmc" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="学员队人数" required><el-input-number v-model="addForm.clazz.xydrs" :min="0" style="width:100%" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="专业代号" required><el-input v-model="addForm.clazz.zydh" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="任务类别" required><el-input v-model="addForm.clazz.rwlb" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="虚实类型" required>
<el-select v-model="addForm.clazz.xslx" style="width:100%">
<el-option :value="0" label="虚" /><el-option :value="1" label="实" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="入学日期" required>
<el-date-picker v-model="addForm.clazz.rxrq" type="date" value-format="yyyy-MM-ddTHH:mm:ss" style="width:100%" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="毕业日期" required>
<el-date-picker v-model="addForm.clazz.byrq" type="date" value-format="yyyy-MM-ddTHH:mm:ss" style="width:100%" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="学员队类型" required><el-input v-model="addForm.clazz.xydlx" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="节次类别" required><el-input v-model="addForm.clazz.jclb" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="系统模式" required><el-input v-model="addForm.clazz.xtms" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="主体培训任务" required>
<el-select v-model="addForm.clazz.ztpxrw" style="width:100%">
<el-option :value="1" label="是" /><el-option :value="0" label="否" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12"><el-form-item label="简称"><el-input v-model="addForm.clazz.jc" placeholder="选填" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="年级"><el-input v-model="addForm.clazz.nj" placeholder="选填" /></el-form-item></el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12"><el-form-item label="所属单位"><el-input v-model="addForm.clazz.ssdw" placeholder="选填" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="序号"><el-input v-model="addForm.clazz.xh" placeholder="选填" /></el-form-item></el-col>
</el-row>
<el-form-item label="备注"><el-input v-model="addForm.clazz.bz" type="textarea" :rows="2" placeholder="选填" /></el-form-item>
<el-divider content-position="left">期次信息</el-divider>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="编号" required><el-input v-model="addForm.period.bh" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="名称" required><el-input v-model="addForm.period.mc" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="学号前缀" required><el-input v-model="addForm.period.xhqz" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="学号位数" required><el-input-number v-model="addForm.period.xhws" :min="1" style="width:100%" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="在校状态" required>
<el-select v-model="addForm.period.zxzt" style="width:100%">
<el-option :value="1" label="在校" /><el-option :value="0" label="毕业" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="允许注册" required>
<el-select v-model="addForm.period.yxzc" style="width:100%">
<el-option :value="1" label="是" /><el-option :value="0" label="否" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="截止注册时间">
<el-date-picker v-model="addForm.period.jszcsj" type="datetime" value-format="yyyy-MM-ddTHH:mm:ss" style="width:100%" />
</el-form-item>
<el-form-item label="备注"><el-input v-model="addForm.period.bz" type="textarea" :rows="2" placeholder="选填" /></el-form-item>
</el-form>
<div slot="footer">
<el-button @click="addDialogVisible = false">取消</el-button>
<el-button type="primary" :loading="addSaving" @click="handleAddConfirm">确定</el-button>
</div>
</el-dialog>
<!-- 编辑教学班次对话框 -->
<el-dialog
:visible="editDialogVisible"
title="编辑教学班次"
width="700px"
:close-on-click-modal="false"
@update:visible="val => editDialogVisible = val"
>
<el-form :model="editForm" label-width="120px" class="add-form">
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="学员队编号"><el-input v-model="editForm.xydbh" disabled /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="学员队名称" required><el-input v-model="editForm.xydmc" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="简称"><el-input v-model="editForm.jc" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="年级"><el-input v-model="editForm.nj" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="专业代号"><el-input v-model="editForm.zydh" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="所属单位"><el-input v-model="editForm.ssdw" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="学员队类型"><el-input v-model="editForm.xydlx" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="类别"><el-input v-model="editForm.jclb" placeholder="请输入" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="任务类别"><el-input v-model="editForm.rwlb" placeholder="请输入" /></el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="在校状态">
<el-select v-model="editForm.zxzt" style="width:100%">
<el-option label="在校" value="在校" /><el-option label="毕业" value="毕业" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="人数"><el-input-number v-model="editForm.xydrs" :min="0" style="width:100%" /></el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="入学日期">
<el-date-picker v-model="editForm.rxrq" type="date" value-format="yyyy-MM-ddTHH:mm:ss" style="width:100%" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="毕业日期">
<el-date-picker v-model="editForm.byrq" type="date" value-format="yyyy-MM-ddTHH:mm:ss" style="width:100%" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="备注"><el-input v-model="editForm.bz" type="textarea" :rows="2" placeholder="请输入" /></el-form-item>
</el-form>
<div slot="footer">
<el-button @click="editDialogVisible = false">取消</el-button>
<el-button type="primary" :loading="editSaving" @click="handleEditConfirm">保存</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
// 模拟列表数据（后端接口未提供，接口就绪后可删除并改为接口加载）
const mockTableData = [
{ xydbh: 'D001', rwlb: '学历教育', nj: '2025级', zydh: '炮兵装备运用', pxrwbsh: '炮兵专业培训任务', xydmc: '54队5区队', rxrq: '2025-09-01', byrq: '2029-06-30', xq: '2025-2026-1、2025-2026-2', xydrs: 45, zhrs: 45, pj: '良好', bz: '' },
{ xydbh: 'D002', rwlb: '学历教育', nj: '2025级', zydh: '通信工程', pxrwbsh: '通信专业培训任务', xydmc: '32队1区队', rxrq: '2025-09-01', byrq: '2029-06-30', xq: '2025-2026-1', xydrs: 40, zhrs: 39, pj: '优秀', bz: '' },
{ xydbh: 'D003', rwlb: '任职培训', nj: '2024级', zydh: '军事指挥', pxrwbsh: '指挥专业培训任务', xydmc: '51队2区队', rxrq: '2024-09-01', byrq: '2028-06-30', xq: '2024-2025-1、2024-2025-2', xydrs: 50, zhrs: 50, pj: '良好', bz: '重点班次' }
]
// 模拟学期数据（原来自 semesterStore，后端接口就绪后可由接口加载）
const mockSemesterList = [
{ xqbh: '2025-2026-1', xqmc: '2025-2026学年第一学期' },
{ xqbh: '2025-2026-2', xqmc: '2025-2026学年第二学期' },
{ xqbh: '2026-2027-1', xqmc: '2026-2027学年第一学期' }
]
export default {
name: 'ShiftTeamIndex',
data() {
return {
// ==================== 查询表单 ====================
searchForm: {
zy: '', nj: '', bc: '',
rwlb: '全军院校训练规划内任务', rwlbEnabled: false,
pxrw: '', xq: '',
sxlx: false, sxlxEnabled: false, xnbc: false,
zxzt: '在读', zxztEnabled: false,
xydlx: '注册管理', xydlxEnabled: false,
pxlx: '军官基础教育', pxlxEnabled: false,
pxlx2: '其他', pxlx2Enabled: false,
pxcc: '无', pxccEnabled: false,
ksrqStart: '', ksrqEnd: '', ksrqEnabled: false,
byrqStart: '', byrqEnd: '', byrqEnabled: false
},
// ==================== 下拉选项（字典数据，接口就绪后可由后端字典加载） ====================
taskCategoryOptions: ['全军院校训练规划内任务', '其他任务'],
statusOptions: ['在读', '休学', '退学'],
studentTeamTypeOptions: ['注册管理', '学员队管理', '教学班管理'],
trainTypeOptions: ['军官基础教育', '生长军官任职培训', '军官轮训'],
trainLevelOptions: ['无', '初级', '中级', '高级'],
semesterList: mockSemesterList,
// ==================== 表格数据 ====================
loading: false,
selectedRows: [],
tableData: [],
pagination: { pageNum: 1, pageSize: 20, total: 0 },
// ==================== 文件导入 ====================
selectedFile: null,
// ==================== 新建教学班次 ====================
addDialogVisible: false,
addSaving: false,
addForm: this.emptyAddForm(),
CLZ_REQUIRED: [
{ key: 'xydbh', label: '学员队编号' }, { key: 'xydmc', label: '学员队名称' }, { key: 'xydrs', label: '学员队人数' },
{ key: 'zydh', label: '专业代号' }, { key: 'rwlb', label: '任务类别' }, { key: 'xslx', label: '虚实类型' },
{ key: 'rxrq', label: '入学日期' }, { key: 'byrq', label: '毕业日期' }, { key: 'xydlx', label: '学员队类型' },
{ key: 'jclb', label: '节次类别' }, { key: 'xtms', label: '系统模式' }, { key: 'ztpxrw', label: '主体培训任务' }
],
PRD_REQUIRED: [
{ key: 'bh', label: '编号' }, { key: 'mc', label: '名称' }, { key: 'xhqz', label: '学号前缀' },
{ key: 'xhws', label: '学号位数' }, { key: 'zxzt', label: '在校状态' }, { key: 'yxzc', label: '允许注册' }
],
// ==================== 编辑 ====================
editDialogVisible: false,
editSaving: false,
editForm: {},
// ==================== 开放/关闭报名状态集合 ====================
openedSet: new Set()
}
},
computed: {
fileName() {
return (this.selectedFile && this.selectedFile.name) || '未选择任何文件'
}
},
mounted() {
this.fetchList()
},
methods: {
/** 日期格式化（截取前10位） */
formatDate(val) {
if (!val) return ''
const s = String(val)
return s.length >= 10 ? s.substring(0, 10) : s
},
/** 空学员队 */
emptyClazz() {
return {
xydbh: '', xydmc: '', xydrs: 0, nj: '', zydh: '', zyjsbh: '', bz: '',
xh: '', rwlb: '学历教育', xslx: 1, rxrq: '', byrq: '',
xydlx: '本科队', pxrwbsh: '', jclb: '全日制', xtms: '', jsonzd: '',
jc: '', ssdw: '', ztpxrw: 1
}
},
/** 空期次 */
emptyPeriod() {
return {
bh: '', mc: '', xhqz: '', xhws: 8, zxzt: 1, yxzc: 1, jszcsj: '', bz: ''
}
},
/** 空新增表单 */
emptyAddForm() {
return {
clazz: this.emptyClazz(),
period: this.emptyPeriod()
}
},
// ==================== 列表加载 ====================
// TODO: 后端接口未提供，暂用模拟数据；接口就绪后替换为 getElectiveList
fetchList() {
this.loading = true
setTimeout(() => {
this.tableData = mockTableData.slice()
this.pagination.total = mockTableData.length
this.loading = false
}, 200)
},
handleSearch() {
this.pagination.pageNum = 1
this.fetchList()
},
handleSizeChange(size) {
this.pagination.pageSize = size
this.fetchList()
},
handleCurrentChange(page) {
this.pagination.pageNum = page
this.fetchList()
},
handleSelectionChange(rows) {
this.selectedRows = rows
},
// ==================== 文件导入 ====================
handleChooseFile() {
this.$refs.fileInput && this.$refs.fileInput.click()
},
handleFileChange(e) {
const input = e.target
if (input.files && input.files.length > 0) {
this.selectedFile = input.files[0]
}
},
// TODO: 后端接口未提供，模板下载为前端模拟；接口就绪后替换为 downloadElectiveTemplate
handleDownloadTemplate() {
this.$message.success('下载学员队数据文件模板（前端模拟）')
},
// TODO: 后端接口未提供，上传为前端模拟；接口就绪后替换为 importElective
handleUploadData() {
if (!this.selectedFile) {
this.$message.warning('请先选择文件')
return
}
this.$message.success('上传数据（前端模拟）')
},
// ==================== 新建教学班次 ====================
handleNew() {
this.addForm = this.emptyAddForm()
this.addDialogVisible = true
},
// TODO: 后端接口未提供，保存为前端模拟；接口就绪后替换为 addElective
handleAddConfirm() {
for (let i = 0; i < this.CLZ_REQUIRED.length; i++) {
const item = this.CLZ_REQUIRED[i]
const val = this.addForm.clazz[item.key]
if (val === '' || val === null || val === undefined) {
this.$message.warning(`请输入${item.label}`)
return
}
}
for (let i = 0; i < this.PRD_REQUIRED.length; i++) {
const item = this.PRD_REQUIRED[i]
const val = this.addForm.period[item.key]
if (val === '' || val === null || val === undefined) {
this.$message.warning(`请输入${item.label}`)
return
}
}
this.addSaving = true
setTimeout(() => {
this.$message.success('新增成功')
this.addDialogVisible = false
this.fetchList()
this.addSaving = false
}, 300)
},
// ==================== 编辑 ====================
// TODO: 后端接口未提供，直接使用当前行数据；接口就绪后替换为 getElective
handleEdit(row) {
if (!row.xydbh) {
this.$message.warning('缺少学员队编号')
return
}
this.editDialogVisible = true
this.editForm = { ...row }
},
// TODO: 后端接口未提供，保存为前端模拟；接口就绪后替换为 updateElective
handleEditConfirm() {
if (!this.editForm.xydbh) {
this.$message.warning('缺少学员队编号')
return
}
this.editSaving = true
setTimeout(() => {
this.$message.success('保存成功')
this.editDialogVisible = false
this.fetchList()
this.editSaving = false
}, 300)
},
// ==================== 开放/关闭报名 ====================
// TODO: 后端接口未提供，为前端模拟；接口就绪后替换为 setRegistration
handleToggleRegistration(row) {
if (!row.xydbh) {
this.$message.warning('缺少学员队编号')
return
}
const key = row.xydbh
const isOpened = this.openedSet.has(key)
const action = isOpened ? '关闭' : '开放'
if (isOpened) {
this.openedSet.delete(key)
} else {
this.openedSet.add(key)
}
this.$message.success(`${action}报名成功（前端模拟）`)
},
// ==================== 停用 ====================
// TODO: 后端接口未提供，删除为前端模拟；接口就绪后替换为 disableElective
handleDisable(row) {
if (!row.xydbh) {
this.$message.warning('缺少学员队编号')
return
}
this.$confirm(`确定要删除「${row.xydmc || row.xydbh}」吗？`, '删除确认', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.tableData = this.tableData.filter((r) => r.xydbh !== row.xydbh)
this.pagination.total = this.tableData.length
this.$message.success('删除成功')
}).catch(() => {})
},
// ==================== 批量操作 ====================
// TODO: 后端接口未提供，下载为前端模拟；接口就绪后替换为 downloadElectiveList
handleDownloadClassList() {
this.$message.success('班次列表下载（前端模拟）')
},
// TODO: 后端接口未提供，下载为前端模拟；接口就绪后替换为 downloadElectiveTaskOverview
handleDownloadTaskOverview() {
this.$message.success('培训任务一览下载（前端模拟）')
}
}
}
</script>
<style scoped lang="scss">
.app-container {
padding: 20px;
}
.shift-team-page {
.search-card {
margin-bottom: 16px;
.search-form {
.w-full {
width: 100%;
}
.el-row {
border-bottom: 1px solid #ebeef5;
&:last-child {
border-bottom: none;
}
}
.el-col {
border-right: 1px solid #ebeef5;
&:last-child {
border-right: none;
}
}
.el-form-item__label {
white-space: nowrap;
line-height: 1.4;
text-align: left;
justify-content: flex-start;
}
.el-form-item {
margin-bottom: 0;
padding: 10px 12px;
}
.date-range {
display: flex;
align-items: center;
gap: 8px;
width: 100%;
.date-picker {
flex: 1;
}
}
}
.search-tip {
font-size: 12px;
color: #f56c6c;
padding: 8px 12px;
}
.search-actions {
display: flex;
justify-content: flex-end;
padding: 12px;
border-top: 1px solid #ebeef5;
}
}
.list-title {
font-size: 16px;
font-weight: 600;
color: #303133;
margin-bottom: 12px;
}
.toolbar {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 12px;
flex-wrap: wrap;
margin-bottom: 12px;
.left-group {
display: flex;
gap: 12px;
flex-wrap: wrap;
}
}
.upload-card {
margin-bottom: 16px;
.upload-row {
display: flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
.file-input {
display: flex;
align-items: center;
gap: 8px;
.file-name {
font-size: 12px;
color: #999;
min-width: 120px;
}
}
}
}
.table-card {
.el-table {
width: 100%;
}
.pagination-wrap {
display: flex;
justify-content: flex-end;
margin-top: 16px;
}
}
}
</style>
frontend/src/views/student/statusChange/index.vue
+272
View File
@@ -0,0 +1,272 @@
<template>
<div class="app-container status-change-page">
<!-- ==================== 1. 查询条件区域 ==================== -->
<el-card shadow="never" class="search-card">
<el-form :model="searchForm" label-width="140px" class="search-form">
<el-row :gutter="24">
<!-- 左栏 -->
<el-col :xs="24" :md="12">
<el-form-item label="年级">
<el-input v-model="searchForm.nj" placeholder="请输入年级" clearable />
</el-form-item>
<el-form-item label="专业">
<el-input v-model="searchForm.zy" placeholder="请输入专业" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxlxChecked">培训类型</el-checkbox></template>
<el-select v-model="searchForm.pxlx" class="w-full" :disabled="!searchForm.pxlxChecked">
<el-option v-for="item in pxlxOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxccChecked">培训层次</el-checkbox></template>
<el-select v-model="searchForm.pxcc" class="w-full" :disabled="!searchForm.pxccChecked">
<el-option v-for="item in pxccOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="学号">
<el-input v-model="searchForm.xh" placeholder="请输入学号" clearable />
</el-form-item>
</el-col>
<!-- 右栏 -->
<el-col :xs="24" :md="12">
<el-form-item label="队别">
<el-input v-model="searchForm.db" placeholder="请输入队别" clearable />
</el-form-item>
<el-form-item label="班次">
<el-input v-model="searchForm.bc" placeholder="请输入班次" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.sqlbChecked">学籍异动申请类别</el-checkbox></template>
<el-select v-model="searchForm.sqlb" class="w-full" :disabled="!searchForm.sqlbChecked">
<el-option v-for="item in applyTypeOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.sqztChecked">学籍异动申请状态</el-checkbox></template>
<el-select v-model="searchForm.sqzt" class="w-full" :disabled="!searchForm.sqztChecked">
<el-option v-for="item in applyStatusOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="姓名">
<el-input v-model="searchForm.xm" placeholder="请输入姓名" clearable />
</el-form-item>
</el-col>
</el-row>
<div class="search-tip">注意：勾选"选择框"表示启用该项对应的查询条件；文本输入框非空白表示启用对应的查询条件。</div>
<div class="search-actions">
<el-button class="gray-btn" @click="handleSearch">查询</el-button>
</div>
</el-form>
</el-card>
<!-- ==================== 2. 审核意见区域 ==================== -->
<el-card shadow="never" class="opinion-card">
<div class="opinion-row">
<span class="opinion-label">审核意见：</span>
<el-input v-model="auditOpinion" placeholder="请输入审核意见" clearable class="opinion-input" />
<el-button type="primary" @click="handleBatchAudit">提交审核意见</el-button>
</div>
</el-card>
<!-- ==================== 3. 列表标题 ==================== -->
<div class="list-title">学籍异动申请审核列表</div>
<!-- ==================== 4. 数据表格区域 ==================== -->
<el-card shadow="never" class="table-card">
<el-table :data="tableData" stripe border @selection-change="handleSelectionChange">
<el-table-column type="selection" width="40" align="center" />
<el-table-column prop="xhName" label="学号姓名" min-width="150" show-overflow-tooltip />
<el-table-column prop="bcxx" label="班次信息" min-width="160" show-overflow-tooltip />
<el-table-column prop="applyType" label="申请类型" width="90" align="center" />
<el-table-column prop="reason" label="事由" min-width="120" show-overflow-tooltip />
<el-table-column prop="time" label="时间" width="110" align="center" />
<el-table-column prop="auditOpinion" label="审核意见" min-width="120" show-overflow-tooltip />
<el-table-column prop="status" label="状态" width="90" align="center" />
<el-table-column prop="change" label="学籍异动" width="90" align="center" />
<el-table-column label="操作" width="130" align="center" fixed="right">
<template slot-scope="{ row }">
<el-button type="text" size="small" class="text-primary" @click="handleAudit(row)">审核</el-button>
<el-button type="text" size="small" class="text-primary" @click="handleView(row)">查看</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</template>
<script>
// 模拟列表数据（后端接口未提供，接口就绪后可删除并改为接口加载）
const mockTableData = [
{ id: 1, xhName: '2025010101 张三', bcxx: '2025级炮兵装备运用54队5区队', applyType: '退学', reason: '身体原因', time: '2026-08-20', auditOpinion: '待审核', status: '拟制', change: '退学' },
{ id: 2, xhName: '2025010102 李四', bcxx: '2025级通信工程32队1区队', applyType: '休学', reason: '家庭原因', time: '2026-08-21', auditOpinion: '同意', status: '待审核', change: '休学' },
{ id: 3, xhName: '2024010101 王五', bcxx: '2024级军事指挥51队2区队', applyType: '留级', reason: '成绩不达标', time: '2026-08-22', auditOpinion: '', status: '拟制', change: '留级' }
]
export default {
name: 'StatusChangeIndex',
data() {
return {
// ==================== 下拉选项（字典数据，接口就绪后可由后端字典加载） ====================
pxlxOptions: ['军官基础教育', '士兵职业教育', '研究生教育', '其他'],
pxccOptions: ['无', '本科', '硕士', '博士'],
applyTypeOptions: ['退学', '休学', '留级', '复学', '转专业'],
applyStatusOptions: ['拟制', '待审核', '已通过', '已驳回'],
// ==================== 查询条件 ====================
searchForm: {
nj: '', zy: '', pxlxChecked: false, pxlx: '军官基础教育', pxccChecked: false, pxcc: '无', xh: '',
db: '', bc: '', sqlbChecked: false, sqlb: '退学', sqztChecked: false, sqzt: '拟制', xm: ''
},
// ==================== 审核意见 ====================
auditOpinion: '',
// ==================== 数据表格 ====================
tableData: [],
selectedRows: []
}
},
mounted() {
this.loadData()
},
methods: {
// ==================== 列表加载 ====================
// TODO: 后端接口未提供，暂用模拟数据；接口就绪后替换为 getStatusChangeList
loadData() {
this.tableData = mockTableData.slice()
},
// ==================== 查询 ====================
// TODO: 后端接口未提供，查询为前端模拟；接口就绪后替换为后端查询
handleSearch() {
this.loadData()
this.$message.success('查询完成（前端模拟）')
},
handleSelectionChange(rows) {
this.selectedRows = rows
},
// TODO: 后端接口未提供，审核为前端模拟；接口就绪后替换为 auditStatusChange
handleAudit(row) {
this.$message.info(`审核「${row.xhName}」的申请（前端模拟）`)
},
// TODO: 后端接口未提供，查看为前端模拟；接口就绪后替换为 getStatusChangeDetail
handleView(row) {
this.$message.info(`查看「${row.xhName}」的申请详情（前端模拟）`)
},
/** 批量审核所选 */
// TODO: 后端接口未提供，批量审核为前端模拟；接口就绪后替换为 batchAuditStatusChange
handleBatchAudit() {
if (this.selectedRows.length === 0) {
this.$message.warning('请先选择申请记录')
return
}
if (!this.auditOpinion.trim()) {
this.$message.warning('请输入审核意见')
return
}
const names = this.selectedRows.map((r) => r.xhName).join('、')
this.$message.success(`已对「${names}」提交审核意见（前端模拟）`)
}
}
}
</script>
<style scoped lang="scss">
.app-container {
padding: 20px;
}
.status-change-page {
.search-card {
margin-bottom: 16px;
.search-form {
.w-full {
width: 100%;
}
.search-tip {
font-size: 12px;
color: #909399;
margin-top: 8px;
margin-bottom: 8px;
}
.search-actions {
display: flex;
justify-content: flex-end;
padding-top: 12px;
border-top: 1px solid #ebeef5;
}
}
}
.opinion-card {
margin-bottom: 16px;
.opinion-row {
display: flex;
align-items: center;
gap: 12px;
.opinion-label {
font-size: 14px;
font-weight: 600;
color: #303133;
white-space: nowrap;
}
.opinion-input {
flex: 1;
min-width: 0;
}
}
}
.list-title {
font-size: 17px;
font-weight: 700;
color: #000;
margin-bottom: 12px;
}
.table-card {
.el-table {
width: 100%;
::v-deep(.cell) {
font-size: 12px;
}
}
}
.text-primary {
color: #409eff;
padding: 0;
}
.gray-btn {
height: 28px;
padding: 2px 16px;
font-size: 12px;
background: #f5f5f5;
border: 1px solid #c0c4cc;
color: #333;
border-radius: 2px;
&:hover,
&:focus {
background: #ebebeb;
border-color: #c0c4cc;
color: #333;
}
}
}
</style>
frontend/src/views/student/studentInfo/index.vue
+597
View File
@@ -0,0 +1,597 @@
<template>
<div class="app-container student-info-page">
<!-- ==================== 1. 查询条件区域 ==================== -->
<el-card shadow="never" class="search-card">
<el-form :model="searchForm" label-width="110px" class="search-form">
<el-row :gutter="24">
<!-- 左栏 -->
<el-col :xs="24" :md="12">
<el-form-item label="年级">
<el-input v-model="searchForm.nj" placeholder="请输入年级" clearable />
</el-form-item>
<el-form-item label="专业">
<el-input v-model="searchForm.zy" placeholder="请输入专业" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxlxChecked">培训类型</el-checkbox></template>
<el-select v-model="searchForm.pxlx" class="w-full" :disabled="!searchForm.pxlxChecked">
<el-option v-for="item in pxlxOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxccChecked">培训层次</el-checkbox></template>
<el-select v-model="searchForm.pxcc" class="w-full" :disabled="!searchForm.pxccChecked">
<el-option v-for="item in pxccOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="学号">
<el-input v-model="searchForm.xh" placeholder="请输入学号" clearable />
</el-form-item>
<el-form-item label="证件号码">
<el-input v-model="searchForm.zjhm" placeholder="请输入证件号码" clearable />
</el-form-item>
<el-form-item label="政治面貌">
<el-input v-model="searchForm.zzmm" placeholder="请输入政治面貌" clearable />
</el-form-item>
<el-form-item label="籍贯">
<el-input v-model="searchForm.jg" placeholder="请输入籍贯" clearable />
</el-form-item>
<el-form-item label="学位">
<el-input v-model="searchForm.xw" placeholder="请输入学位" clearable />
</el-form-item>
<el-form-item label="原部职别">
<el-input v-model="searchForm.ybzb" placeholder="请输入原部职别" clearable />
</el-form-item>
<el-form-item label="标签">
<el-input v-model="searchForm.bq" placeholder="请输入标签" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.xjydEnabled">学籍异动状态</el-checkbox></template>
<el-radio-group v-model="searchForm.xjyd" :disabled="!searchForm.xjydEnabled">
<el-radio :label="'无异动'">无异动</el-radio>
<el-radio :label="'异动'">异动</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.ksqkEnabled">考试情况</el-checkbox></template>
<el-radio-group v-model="searchForm.ksqk" :disabled="!searchForm.ksqkEnabled">
<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-item label="不及格门数">
<div class="range-control">
<el-input v-model="searchForm.bjgmMin" placeholder="0" />
<span class="range-sep">至</span>
<el-input v-model="searchForm.bjgmMax" placeholder="0" />
</div>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.xbEnabled">性别</el-checkbox></template>
<el-radio-group v-model="searchForm.xb" :disabled="!searchForm.xbEnabled">
<el-radio :label="'男'">男</el-radio>
<el-radio :label="'女'">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.zcztEnabled">注册状态</el-checkbox></template>
<el-radio-group v-model="searchForm.zczt" :disabled="!searchForm.zcztEnabled">
<el-radio :label="'已注册'">已注册</el-radio>
<el-radio :label="'未注册'">未注册</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<!-- 右栏 -->
<el-col :xs="24" :md="12">
<el-form-item label="队别">
<el-input v-model="searchForm.db" placeholder="请输入队别" clearable />
</el-form-item>
<el-form-item label="班次">
<el-input v-model="searchForm.bc" placeholder="请输入班次" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.pxlx2Checked">培训类型2</el-checkbox></template>
<el-select v-model="searchForm.pxlx2" class="w-full" :disabled="!searchForm.pxlx2Checked">
<el-option v-for="item in pxlx2Options" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="自定义分类">
<el-input v-model="searchForm.zdyfl" placeholder="请输入自定义分类" clearable />
</el-form-item>
<el-form-item label="姓名">
<el-input v-model="searchForm.xm" placeholder="请输入姓名" clearable />
</el-form-item>
<el-form-item label="身份证号">
<el-input v-model="searchForm.sfzh" placeholder="请输入身份证号" clearable />
</el-form-item>
<el-form-item label="民族">
<el-input v-model="searchForm.mz" placeholder="请输入民族" clearable />
</el-form-item>
<el-form-item label="文化程度">
<el-input v-model="searchForm.whcd" placeholder="请输入文化程度" clearable />
</el-form-item>
<el-form-item label="本科毕业院校">
<el-input v-model="searchForm.bkbyyx" placeholder="请输入本科毕业院校" clearable />
</el-form-item>
<el-form-item label="所属战区">
<el-input v-model="searchForm.sszq" placeholder="请输入所属战区" clearable />
</el-form-item>
<el-form-item label="奖惩情况">
<el-input v-model="searchForm.jcqk" placeholder="请输入奖惩情况" clearable />
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.txEnabled">退学状态</el-checkbox></template>
<el-radio-group v-model="searchForm.tx" :disabled="!searchForm.txEnabled">
<el-radio :label="'未退学'">未退学</el-radio>
<el-radio :label="'退学'">退学</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="曾不及格门数">
<div class="range-control">
<el-input v-model="searchForm.lbjgmMin" placeholder="0" />
<span class="range-sep">至</span>
<el-input v-model="searchForm.lbjgmMax" placeholder="0" />
</div>
</el-form-item>
<el-form-item label="补考不及格门数">
<div class="range-control">
<el-input v-model="searchForm.bkcljgmMin" placeholder="0" />
<span class="range-sep">至</span>
<el-input v-model="searchForm.bkcljgmMax" placeholder="0" />
</div>
</el-form-item>
<el-form-item>
<template slot="label"><el-checkbox v-model="searchForm.gljgChecked">管理机构</el-checkbox></template>
<el-select v-model="searchForm.gljg" class="w-full" :disabled="!searchForm.gljgChecked">
<el-option v-for="item in gljgOptions" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<div class="search-tip">注意：勾选"选择框"表示启用该项对应的查询条件；文本输入框非空白表示启用对应的查询条件。</div>
<div class="search-actions">
<el-button class="gray-btn" @click="handleSearch">查询</el-button>
</div>
</el-form>
</el-card>
<!-- ==================== 2. 数据表格区域 ==================== -->
<div class="list-title">学员信息列表：</div>
<div class="toolbar"><el-button type="primary" @click="handleAdd">新增学员</el-button></div>
<el-card shadow="never" class="table-card">
<el-table v-loading="loading" :data="tableData" stripe border>
<el-table-column type="index" label="序号" width="55" align="center" />
<el-table-column prop="xh" label="学号" width="55" show-overflow-tooltip />
<el-table-column prop="xm" label="姓名" width="55" />
<el-table-column prop="xb" label="性别" width="55" align="center" />
<el-table-column prop="nj" label="年级" width="55" align="center" />
<el-table-column prop="zy" label="专业" width="55" show-overflow-tooltip />
<el-table-column prop="db" label="队别" width="55" align="center" />
<el-table-column prop="bc" label="班次" width="55" align="center" />
<el-table-column prop="pxlx" label="培训类型" width="85" show-overflow-tooltip />
<el-table-column prop="pxcc" label="培训层次" width="85" align="center" />
<el-table-column prop="zzmm" label="政治面貌" width="85" align="center" />
<el-table-column prop="mz" label="民族" width="55" align="center" />
<el-table-column prop="jg" label="籍贯" width="55" align="center" />
<el-table-column prop="xw" label="学位" width="55" align="center" />
<el-table-column prop="zczt" label="注册状态" width="85" align="center" />
<el-table-column prop="xjyd" label="学籍异动状态" width="110" align="center" />
<el-table-column prop="ksqk" label="考试情况" width="85" align="center" />
<el-table-column prop="bjgm" label="不及格门数" width="110" align="center" />
<el-table-column prop="gljg" label="管理机构" width="85" align="center" />
<el-table-column label="操作" align="center" fixed="right">
<template slot-scope="{ row }">
<el-button type="text" class="text-primary" @click="handleEdit(row)">编辑</el-button>
<el-button type="text" class="text-success" @click="handleGrades(row)">成绩</el-button>
<el-button type="text" class="danger-text" @click="handleDelete(row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
:current-page="pagination.pageNum"
:page-size="pagination.pageSize"
:total="pagination.total"
:page-sizes="[10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper"
background
@size-change="handleSizeChange"
@current-change="handlePageChange"
/>
</div>
</el-card>
<!-- 新增/编辑弹窗 -->
<el-dialog
:visible="dialogVisible"
:title="dialogTitle"
width="780px"
:close-on-click-modal="false"
@update:visible="val => dialogVisible = val"
>
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px">
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="编号" prop="bh"><el-input v-model="formData.bh" placeholder="请输入编号" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="学号" prop="xh"><el-input v-model="formData.xh" placeholder="请输入学号" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="姓名" prop="xm"><el-input v-model="formData.xm" placeholder="请输入姓名" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="性别" prop="xb"><el-select v-model="formData.xb" placeholder="请选择" class="full-width"><el-option label="男" value="1" /><el-option label="女" value="0" /></el-select></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="出生日期" prop="csrq"><el-date-picker v-model="formData.csrq" type="date" placeholder="请选择" value-format="yyyy-MM-dd" class="full-width" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="民族" prop="mz"><el-input v-model="formData.mz" placeholder="请输入民族" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="籍贯" prop="jg"><el-input v-model="formData.jg" placeholder="请输入籍贯" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="政治面貌" prop="zzmm"><el-input v-model="formData.zzmm" placeholder="请输入政治面貌" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="文化程度" prop="whcd"><el-input v-model="formData.whcd" placeholder="请输入文化程度" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="学员类别" prop="xylb"><el-input v-model="formData.xylb" placeholder="请输入学员类别" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="学员队期编号" prop="xydqbh"><el-input v-model="formData.xydqbh" placeholder="请输入学员队期编号" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="证件号码" prop="zjhm"><el-input v-model="formData.zjhm" placeholder="请输入证件号码" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="所属军区" prop="ssjq"><el-input v-model="formData.ssjq" placeholder="请输入所属军区" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="当前班次编号" prop="dqbzbh"><el-input v-model="formData.dqbzbh" placeholder="请输入当前班次编号" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="军人证件类型" prop="jrzjlx"><el-input v-model="formData.jrzjlx" placeholder="请输入军人证件类型" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="退学状态" prop="txzt"><el-input v-model="formData.txzt" placeholder="请输入退学状态" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8"><el-form-item label="国防生" prop="gfs"><el-select v-model="formData.gfs" placeholder="请选择" class="full-width"><el-option label="是" value="1" /><el-option label="否" value="0" /></el-select></el-form-item></el-col>
<el-col :span="8"><el-form-item label="留级状态" prop="ljzt"><el-input v-model="formData.ljzt" placeholder="请输入" /></el-form-item></el-col>
<el-col :span="8"><el-form-item label="分班状态" prop="fbzt"><el-input v-model="formData.fbzt" placeholder="请输入" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8"><el-form-item label="允许查看成绩" prop="yxckcj"><el-select v-model="formData.yxckcj" placeholder="请选择" class="full-width"><el-option label="是" value="1" /><el-option label="否" value="0" /></el-select></el-form-item></el-col>
<el-col :span="8"><el-form-item label="已注册" prop="yzc"><el-select v-model="formData.yzc" placeholder="请选择" class="full-width"><el-option label="是" value="1" /><el-option label="否" value="0" /></el-select></el-form-item></el-col>
<el-col :span="8" />
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="联系电话" prop="lxdh"><el-input v-model="formData.lxdh" placeholder="请输入联系电话" /></el-form-item></el-col>
<el-col :span="12"><el-form-item label="通讯地址" prop="txdz"><el-input v-model="formData.txdz" placeholder="请输入通讯地址" /></el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24"><el-form-item label="备注" prop="bz"><el-input v-model="formData.bz" type="textarea" :rows="2" placeholder="请输入备注" /></el-form-item></el-col>
</el-row>
</el-form>
<div slot="footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" :loading="submitting" @click="handleSubmit">确定</el-button>
</div>
</el-dialog>
<!-- 成绩弹窗 -->
<el-dialog
:visible="gradesVisible"
title="学员成绩"
width="600px"
:close-on-click-modal="false"
@update:visible="val => gradesVisible = val"
>
<p><strong>学员：</strong>{{ gradesStudent }}</p>
<el-tabs v-model="gradesTab">
<el-tab-pane label="成绩" name="grades">
<div v-loading="gradesLoading">
<pre v-if="gradesData">{{ gradesData }}</pre>
</div>
</el-tab-pane>
<el-tab-pane label="进程成绩" name="process">
<div v-loading="gradesLoading">
<pre v-if="processGradesData">{{ processGradesData }}</pre>
</div>
</el-tab-pane>
</el-tabs>
<div slot="footer">
<el-button type="primary" @click="handleExportGrades">导出成绩</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
// 模拟列表数据（后端接口未提供，接口就绪后可删除并改为接口加载）
const mockTableData = [
{ id: 1, bh: 'X101', xh: '2025010101', xm: '张三', xb: '男', nj: '2025级', zy: '炮兵装备运用', db: '54队', bc: '5区队', pxlx: '军官基础教育', pxcc: '本科', zzmm: '党员', mz: '汉族', jg: '江苏', xw: '学士', zczt: '已注册', xjyd: '无异动', ksqk: '正常', bjgm: '0', gljg: '教务处' },
{ id: 2, bh: 'X102', xh: '2025010102', xm: '李四', xb: '男', nj: '2025级', zy: '通信工程', db: '32队', bc: '1区队', pxlx: '军官基础教育', pxcc: '本科', zzmm: '团员', mz: '汉族', jg: '山东', xw: '学士', zczt: '已注册', xjyd: '无异动', ksqk: '正常', bjgm: '1', gljg: '教务处' },
{ id: 3, bh: 'X103', xh: '2024010101', xm: '王五', xb: '男', nj: '2024级', zy: '军事指挥', db: '51队', bc: '2区队', pxlx: '军官基础教育', pxcc: '本科', zzmm: '党员', mz: '汉族', jg: '河南', xw: '学士', zczt: '已注册', xjyd: '异动', ksqk: '正常', bjgm: '2', gljg: '教务处' }
]
export default {
name: 'StudentInfoIndex',
data() {
return {
// ==================== 下拉选项（字典数据，接口就绪后可由后端字典加载） ====================
pxlxOptions: ['军官基础教育', '士兵职业教育', '研究生教育', '其他'],
pxccOptions: ['无', '本科', '硕士', '博士'],
pxlx2Options: ['其他', '军官基础教育', '任职培训', '研究生教育'],
gljgOptions: ['教务处', '教研室1', '教研室2'],
// ==================== 查询条件 ====================
searchForm: {
nj: '', zy: '', pxlxChecked: false, pxlx: '军官基础教育', pxccChecked: false, pxcc: '无', xh: '', zjhm: '', zzmm: '',
jg: '', xw: '', ybzb: '', bq: '', xjydEnabled: false, xjyd: '无异动', ksqkEnabled: false, ksqk: '正常',
bjgmMin: '', bjgmMax: '', xbEnabled: false, xb: '男', zcztEnabled: false, zczt: '已注册',
db: '', bc: '', pxlx2Checked: false, pxlx2: '其他', zdyfl: '', xm: '', sfzh: '', mz: '', whcd: '',
bkbyyx: '', sszq: '', jcqk: '', txEnabled: false, tx: '未退学', lbjgmMin: '', lbjgmMax: '',
bkcljgmMin: '', bkcljgmMax: '', gljgChecked: false, gljg: '教务处',
xylb: ''
},
// ==================== 数据表格 ====================
loading: false,
tableData: [],
pagination: { pageNum: 1, pageSize: 20, total: 0 },
// ==================== 新增/编辑弹窗 ====================
dialogVisible: false,
dialogTitle: '新增学员',
submitting: false,
formData: this.createEmptyForm(),
formRules: {
bh: [{ required: true, message: '请输入编号', trigger: 'blur' }],
xh: [{ required: true, message: '请输入学号', trigger: 'blur' }],
xm: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
xydqbh: [{ required: true, message: '请输入学员队期编号', trigger: 'blur' }],
zjhm: [{ required: true, message: '请输入证件号码', trigger: 'blur' }],
zzmm: [{ required: true, message: '请输入政治面貌', trigger: 'blur' }],
xb: [{ required: true, message: '请选择性别', trigger: 'change' }],
csrq: [{ required: true, message: '请选择出生日期', trigger: 'change' }],
mz: [{ required: true, message: '请输入民族', trigger: 'blur' }],
jg: [{ required: true, message: '请输入籍贯', trigger: 'blur' }],
whcd: [{ required: true, message: '请输入文化程度', trigger: 'blur' }],
xylb: [{ required: true, message: '请输入学员类别', trigger: 'blur' }],
ssjq: [{ required: true, message: '请输入所属军区', trigger: 'blur' }],
gfs: [{ required: true, message: '请选择国防生', trigger: 'change' }],
txzt: [{ required: true, message: '请输入退学状态', trigger: 'blur' }],
ljzt: [{ required: true, message: '请输入留级状态', trigger: 'blur' }],
fbzt: [{ required: true, message: '请输入分班状态', trigger: 'blur' }],
yxckcj: [{ required: true, message: '请选择允许查看成绩', trigger: 'change' }],
dqbzbh: [{ required: true, message: '请输入当前班次编号', trigger: 'blur' }],
yzc: [{ required: true, message: '请选择已注册', trigger: 'change' }],
jrzjlx: [{ required: true, message: '请输入军人证件类型', trigger: 'blur' }]
},
// ==================== 成绩弹窗 ====================
gradesVisible: false,
gradesTab: 'grades',
gradesData: null,
processGradesData: null,
gradesStudent: '',
currentBh: '',
gradesLoading: false
}
},
mounted() {
this.loadData()
},
methods: {
/** 创建空白表单 */
createEmptyForm() {
return {
bh: '', xh: '', xm: '', xydqbh: '', zjhm: '', zzmm: '', xb: '', csrq: '', mz: '', jg: '',
whcd: '', xylb: '', ssjq: '', gfs: '', txzt: '', ljzt: '', fbzt: '', yxckcj: '', dqbzbh: '', yzc: '',
jrzjlx: '', sfzh: '', lxdh: '', txdz: '', bz: '', dtsj: ''
}
},
// ==================== 列表加载 ====================
// TODO: 后端接口未提供，暂用模拟数据；接口就绪后替换为 getStudentRecordsList
loadData() {
this.loading = true
setTimeout(() => {
this.tableData = mockTableData.slice()
this.pagination.total = mockTableData.length
this.loading = false
}, 200)
},
// ==================== 查询/分页 ====================
handleSearch() {
this.pagination.pageNum = 1
this.loadData()
this.$message.success('查询学员信息（前端模拟）')
},
handlePageChange(page) {
this.pagination.pageNum = page
this.loadData()
},
handleSizeChange(size) {
this.pagination.pageSize = size
this.pagination.pageNum = 1
this.loadData()
},
// ==================== 新增/编辑弹窗 ====================
resetForm() {
Object.assign(this.formData, this.createEmptyForm())
this.$nextTick(() => {
if (this.$refs.formRef) {
this.$refs.formRef.clearValidate()
}
})
},
handleAdd() {
this.dialogTitle = '新增学员'
this.resetForm()
this.dialogVisible = true
},
// TODO: 后端接口未提供，直接使用当前行数据；接口就绪后替换为 getStudentRecordsDetail
handleEdit(row) {
this.dialogTitle = '编辑学员'
this.resetForm()
Object.assign(this.formData, this.createEmptyForm(), row)
this.dialogVisible = true
},
// TODO: 后端接口未提供，保存为前端模拟；接口就绪后替换为 addStudentRecords / updateStudentRecords
handleSubmit() {
this.$refs.formRef.validate((valid) => {
if (!valid) return
this.submitting = true
setTimeout(() => {
this.$message.success(this.dialogTitle === '新增学员' ? '新增成功' : '编辑成功')
this.dialogVisible = false
this.loadData()
this.submitting = false
}, 300)
})
},
// TODO: 后端接口未提供，删除为前端模拟；接口就绪后替换为 deleteStudentRecords
handleDelete(row) {
this.$confirm(`确定要删除"${row.xm}"吗？`, '删除确认', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.tableData = this.tableData.filter((r) => r.bh !== row.bh)
this.pagination.total = this.tableData.length
this.$message.success('删除成功')
}).catch(() => {})
},
// ==================== 成绩弹窗 ====================
// TODO: 后端接口未提供，成绩数据为前端模拟；接口就绪后替换为 getStudentGrades / getStudentProcessGrades
handleGrades(row) {
this.gradesStudent = row.xm || ''
this.currentBh = row.bh || ''
this.gradesData = null
this.processGradesData = null
this.gradesTab = 'grades'
this.gradesVisible = true
this.gradesLoading = true
setTimeout(() => {
this.gradesData = { 学员: row.xm, 学号: row.xh, 课程: '通信原理', 成绩: 92, 学分: 3.0 }
this.processGradesData = { 进程成绩: [{ 名称: '平时成绩', 得分: 95 }, { 名称: '期末成绩', 得分: 88 }] }
this.gradesLoading = false
}, 300)
},
// TODO: 后端接口未提供，导出为前端模拟；接口就绪后替换为 exportStudentGrades
handleExportGrades() {
this.$message.success(`已导出学员${this.gradesStudent}成绩（前端模拟）`)
}
}
}
</script>
<style scoped lang="scss">
.app-container {
padding: 20px;
}
.student-info-page {
.search-card {
margin-bottom: 16px;
.search-form {
.w-full {
width: 100%;
}
.range-control {
display: flex;
align-items: center;
gap: 6px;
width: 100%;
.el-input {
flex: 1;
}
.range-sep {
flex-shrink: 0;
font-size: 12px;
color: #606266;
}
}
.search-tip {
font-size: 12px;
color: #f56c6c;
margin-top: 8px;
margin-bottom: 8px;
}
.search-actions {
display: flex;
justify-content: flex-end;
padding-top: 12px;
border-top: 1px solid #ebeef5;
}
}
}
.list-title {
font-size: 16px;
font-weight: 600;
color: #303133;
margin-bottom: 12px;
}
.toolbar {
margin-bottom: 16px;
}
.table-card {
.el-table {
width: 100%;
}
.pagination {
display: flex;
justify-content: flex-end;
margin-top: 16px;
}
}
.text-primary {
color: #409eff;
padding: 0;
}
.text-success {
color: #67c23a;
padding: 0;
}
.danger-text {
color: #f56c6c;
padding: 0;
}
.full-width {
width: 100%;
}
.gray-btn {
height: 28px;
padding: 2px 16px;
font-size: 12px;
background: #f5f5f5;
border: 1px solid #c0c4cc;
color: #333;
border-radius: 2px;
&:hover,
&:focus {
background: #ebebeb;
border-color: #c0c4cc;
color: #333;
}
}
}
</style>
frontend/src/views/student/warningCondition/index.vue
+15
View File
@@ -0,0 +1,15 @@
<template>
<div class="app-container">
<placeholder-page title="学员学籍预警条件管理" icon="tool"
description="用于配置学员学籍预警的触发条件，如成绩、出勤等指标阈值，支持条件的新增与维护。" />
</div>
</template>
<script>
import PlaceholderPage from "@/components/PlaceholderPage"
export default {
name: "WarningCondition",
components: { PlaceholderPage }
}
</script>
frontend/src/views/student/warningResult/index.vue
+15
View File
@@ -0,0 +1,15 @@
<template>
<div class="app-container">
<placeholder-page title="学员学籍预警结果" icon="checkbox"
description="用于查看学员学籍预警的触发结果列表，支持按条件筛选、导出与处理。" />
</div>
</template>
<script>
import PlaceholderPage from "@/components/PlaceholderPage"
export default {
name: "WarningResult",
components: { PlaceholderPage }
}
</script>