前端文件
This commit is contained in:
@@ -0,0 +1,293 @@
|
||||
<template>
|
||||
<div class="app-container score-page">
|
||||
<!-- ==================== 1. 查询条件区域 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form :model="queryForm" label-width="90px" inline class="search-form">
|
||||
<el-form-item v-if="!isStudentRole" label="学号">
|
||||
<el-input v-model="queryForm.xh" placeholder="请输入学号" clearable style="width: 180px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="年度">
|
||||
<el-input v-model="queryForm.nd" placeholder="如 2026" clearable style="width: 140px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="课程名称">
|
||||
<el-select v-model="queryForm.kcbh" placeholder="请选择课程名称" clearable filterable style="width: 200px">
|
||||
<el-option v-for="item in kbOptions" :key="item.kbh" :label="item.kmc" :value="item.kbh" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="!isStudentRole" label="班次">
|
||||
<el-select v-model="queryForm.xydbh" placeholder="请选择班次" clearable filterable style="width: 200px">
|
||||
<el-option v-for="item in teamOptions" :key="item.xydbh" :label="item.xydmc" :value="item.xydbh" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSearch">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 成绩列表区域 ==================== -->
|
||||
<div class="toolbar">
|
||||
<el-button type="primary" :loading="exportLoading" @click="handleExportGrades">导出课程成绩</el-button>
|
||||
<el-button type="primary" :loading="exportLoading" @click="handleExportProcessGrades">导出课程过程成绩</el-button>
|
||||
</div>
|
||||
|
||||
<el-card shadow="never" class="table-card">
|
||||
<el-tabs v-model="activeTab">
|
||||
<!-- 课程成绩 -->
|
||||
<el-tab-pane label="课程成绩" name="grades">
|
||||
<el-table v-loading="loading" :data="gradesData" stripe border style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="kmbh" label="科目编号" min-width="110" show-overflow-tooltip />
|
||||
<el-table-column prop="klx" label="课类型" min-width="90" align="center" />
|
||||
<el-table-column prop="kscj" label="考试成绩" min-width="90" align="center" />
|
||||
<el-table-column prop="pscj" label="平时成绩" min-width="90" align="center" />
|
||||
<el-table-column prop="zzcj" label="最终成绩" min-width="90" align="center" />
|
||||
<el-table-column prop="bkcj" label="补考成绩" min-width="90" align="center" />
|
||||
<el-table-column prop="bkcs" label="补考次数" min-width="90" align="center" />
|
||||
<el-table-column prop="ksqk" label="考试情况" min-width="90" align="center" />
|
||||
<el-table-column prop="qwxf" label="期望学分" min-width="90" align="center" />
|
||||
<el-table-column prop="ytg" label="考试结果" min-width="90" align="center" :formatter="formatExamResult" />
|
||||
<el-table-column prop="nd" label="年度" min-width="80" align="center" />
|
||||
</el-table>
|
||||
<el-empty v-if="!loading && gradesData.length === 0" description="暂无课程成绩数据" :image-size="60" />
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- 课程过程成绩 -->
|
||||
<el-tab-pane label="课程过程成绩" name="process">
|
||||
<el-table v-loading="loading" :data="processGradesData" stripe border style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="kmbh" label="科目编号" min-width="110" show-overflow-tooltip />
|
||||
<el-table-column prop="klx" label="课类型" min-width="90" align="center" />
|
||||
<el-table-column prop="yscj" label="原始成绩" min-width="90" align="center" />
|
||||
<el-table-column prop="zzcj" label="最终成绩" min-width="90" align="center" />
|
||||
<el-table-column prop="bkcj1" label="补考1" min-width="80" align="center" />
|
||||
<el-table-column prop="bkcj2" label="补考2" min-width="80" align="center" />
|
||||
<el-table-column prop="bkcj3" label="补考3" min-width="80" align="center" />
|
||||
<el-table-column prop="ksqk" label="考试情况" min-width="90" align="center" />
|
||||
<el-table-column prop="nd" label="年度" min-width="80" align="center" />
|
||||
</el-table>
|
||||
<el-empty v-if="!loading && processGradesData.length === 0" description="暂无课程过程成绩数据" :image-size="60" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<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>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listStudentGrades,
|
||||
listStudentProcessGrades,
|
||||
exportStudentGrades,
|
||||
exportStudentProcessGrades
|
||||
} from "@/api/studentRecords/studentRecords"
|
||||
import { listKb } from "@/api/teachOffice/kb"
|
||||
import { listTeam } from "@/api/studentRecords/team"
|
||||
|
||||
export default {
|
||||
name: 'ScoreIndex',
|
||||
data() {
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
queryForm: {
|
||||
xh: '',
|
||||
nd: '',
|
||||
kcbh: '',
|
||||
xydbh: ''
|
||||
},
|
||||
|
||||
// ==================== 下拉选项 ====================
|
||||
kbOptions: [],
|
||||
teamOptions: [],
|
||||
|
||||
// ==================== 数据表格 ====================
|
||||
// 数据来源：grades 课程成绩 / process 课程过程成绩
|
||||
activeTab: 'grades',
|
||||
loading: false,
|
||||
gradesData: [],
|
||||
processGradesData: [],
|
||||
pagination: { pageNum: 1, pageSize: 20, total: 0 },
|
||||
|
||||
// ==================== 导出 ====================
|
||||
exportLoading: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
activeTab() {
|
||||
this.handleSearch()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
/** 学员角色（后端角色键 STUDENT）隐藏学号/班次查询，仅查看本人成绩 */
|
||||
isStudentRole() {
|
||||
const roles = this.$store.getters.roles
|
||||
return Array.isArray(roles) && roles.includes('STUDENT')
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadKbOptions()
|
||||
this.loadTeamOptions()
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
/** 格式化考试结果：1 已通过，0 不通过 */
|
||||
formatExamResult(row, column, cellValue) {
|
||||
if (cellValue === 1 || cellValue === '1') return '已通过'
|
||||
if (cellValue === 0 || cellValue === '0') return '不通过'
|
||||
return ''
|
||||
},
|
||||
|
||||
/** 加载课程名称下拉选项 */
|
||||
loadKbOptions() {
|
||||
listKb({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
const data = res.data || {}
|
||||
this.kbOptions = data.records || []
|
||||
}).catch(() => {
|
||||
this.kbOptions = []
|
||||
})
|
||||
},
|
||||
|
||||
/** 加载班次下拉选项 */
|
||||
loadTeamOptions() {
|
||||
listTeam({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
const data = res.data || {}
|
||||
this.teamOptions = data.records || []
|
||||
}).catch(() => {
|
||||
this.teamOptions = []
|
||||
})
|
||||
},
|
||||
|
||||
/** 组装查询参数，仅传非空值 */
|
||||
buildQueryParams(params) {
|
||||
const xh = this.queryForm.xh && this.queryForm.xh.trim()
|
||||
const nd = this.queryForm.nd && this.queryForm.nd.trim()
|
||||
const kcbh = this.queryForm.kcbh && this.queryForm.kcbh.trim()
|
||||
const xydbh = this.queryForm.xydbh && this.queryForm.xydbh.trim()
|
||||
if (xh) params.xh = xh
|
||||
if (nd) params.nd = nd
|
||||
if (kcbh) params.kcbh = kcbh
|
||||
if (xydbh) params.xydbh = xydbh
|
||||
},
|
||||
|
||||
loadData() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageNum: this.pagination.pageNum,
|
||||
pageSize: this.pagination.pageSize
|
||||
}
|
||||
this.buildQueryParams(params)
|
||||
const request = this.activeTab === 'grades' ? listStudentGrades(params) : listStudentProcessGrades(params)
|
||||
request.then(res => {
|
||||
const data = res.data || {}
|
||||
const records = data.records || []
|
||||
if (this.activeTab === 'grades') {
|
||||
this.gradesData = records
|
||||
} else {
|
||||
this.processGradesData = records
|
||||
}
|
||||
this.pagination.total = data.total || 0
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
if (this.activeTab === 'grades') {
|
||||
this.gradesData = []
|
||||
} else {
|
||||
this.processGradesData = []
|
||||
}
|
||||
this.pagination.total = 0
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleSearch() {
|
||||
this.pagination.pageNum = 1
|
||||
this.loadData()
|
||||
},
|
||||
handlePageChange(page) {
|
||||
this.pagination.pageNum = page
|
||||
this.loadData()
|
||||
},
|
||||
handleSizeChange(size) {
|
||||
this.pagination.pageSize = size
|
||||
this.pagination.pageNum = 1
|
||||
this.loadData()
|
||||
},
|
||||
|
||||
/** 通用 blob 下载 */
|
||||
downloadBlob(blob, filename) {
|
||||
const link = document.createElement('a')
|
||||
link.href = URL.createObjectURL(blob)
|
||||
link.download = filename
|
||||
link.click()
|
||||
URL.revokeObjectURL(link.href)
|
||||
},
|
||||
|
||||
/** 构建导出查询参数 */
|
||||
buildExportQuery() {
|
||||
const query = {}
|
||||
this.buildQueryParams(query)
|
||||
return query
|
||||
},
|
||||
|
||||
/** 导出课程成绩 Excel */
|
||||
handleExportGrades() {
|
||||
const query = this.buildExportQuery()
|
||||
this.exportLoading = true
|
||||
exportStudentGrades(query).then(res => {
|
||||
this.downloadBlob(res, `课程成绩_${Date.now()}.xls`)
|
||||
this.$message.success('课程成绩导出成功')
|
||||
}).catch(() => { }).finally(() => {
|
||||
this.exportLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
/** 导出课程过程成绩 Excel */
|
||||
handleExportProcessGrades() {
|
||||
const query = this.buildExportQuery()
|
||||
this.exportLoading = true
|
||||
exportStudentProcessGrades(query).then(res => {
|
||||
this.downloadBlob(res, `课程过程成绩_${Date.now()}.xls`)
|
||||
this.$message.success('课程过程成绩导出成功')
|
||||
}).catch(() => { }).finally(() => {
|
||||
this.exportLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.score-page {
|
||||
padding: 20px;
|
||||
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.search-form {
|
||||
.el-form-item {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.table-card {
|
||||
.el-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,871 @@
|
||||
<template>
|
||||
<div class="app-container shift-team-page">
|
||||
<!-- ==================== 1. 查询条件 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form ref="searchFormRef" :model="searchForm" label-width="90px" class="search-form">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="学员队名称">
|
||||
<el-input v-model="searchForm.xydmc" placeholder="请输入学员队名称" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="年级">
|
||||
<el-input v-model="searchForm.nj" placeholder="请输入年级" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="专业代号">
|
||||
<el-input v-model="searchForm.zydh" placeholder="请输入专业代号" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="学员队类型">
|
||||
<el-select v-model="searchForm.xydlx" placeholder="请选择学员队类型" clearable filterable class="w-full">
|
||||
<el-option
|
||||
v-for="item in teamTypeOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="任务类别">
|
||||
<el-input v-model="searchForm.rwlb" placeholder="请输入任务类别" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="虚实类型">
|
||||
<el-select v-model="searchForm.xslx" placeholder="请选择虚实类型" clearable class="w-full">
|
||||
<el-option label="否" :value="0" />
|
||||
<el-option label="是" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="search-actions-row">
|
||||
<el-col :span="24" class="search-actions">
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 工具栏：新增 / 导入 / 导出 ==================== -->
|
||||
<div class="toolbar">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增学员队</el-button>
|
||||
<el-button icon="el-icon-download" @click="handleExport">导出 Excel</el-button>
|
||||
<el-button icon="el-icon-download" @click="handleDownloadTemplate">模板下载</el-button>
|
||||
<div class="file-input">
|
||||
<input ref="fileInputRef" type="file" accept=".xls,.xlsx" style="display: none" @change="handleFileChange" />
|
||||
<el-button icon="el-icon-folder-opened" @click="handleChooseFile">选择文件</el-button>
|
||||
<span class="file-name">{{ fileName }}</span>
|
||||
<el-button type="primary" icon="el-icon-upload2" :loading="uploading" @click="handleUpload">上传数据</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ==================== 3. 列表 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-header">
|
||||
<span class="table-title">教学班次列表：</span>
|
||||
</div>
|
||||
<el-table v-loading="loading" :data="tableData" stripe border highlight-current-row>
|
||||
<el-table-column prop="xydbh" label="学员队编号" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="xydmc" label="学员队名称" min-width="130" show-overflow-tooltip />
|
||||
<el-table-column prop="nj" label="年级" width="90" align="center" />
|
||||
<el-table-column prop="zydh" label="专业代号" min-width="110" show-overflow-tooltip />
|
||||
<el-table-column prop="rwlb" label="任务类别" width="100" align="center" />
|
||||
<el-table-column label="虚实类型" width="90" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag :type="Number(row.xslx) === 1 ? 'success' : 'info'" size="mini">
|
||||
{{ Number(row.xslx) === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="在校状态" width="90" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag :type="Number(row.zxzt) === 1 ? 'success' : 'danger'" size="mini">
|
||||
{{ Number(row.zxzt) === 1 ? '在校' : '毕业' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="xydrs" label="人数" width="80" align="center" />
|
||||
<el-table-column label="入学日期" width="110" align="center">
|
||||
<template slot-scope="{ row }">{{ formatDate(row.rxrq) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="毕业日期" width="110" align="center">
|
||||
<template slot-scope="{ row }">{{ formatDate(row.byrq) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="190" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" size="small" icon="el-icon-view" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
|
||||
<el-button type="text" size="small" class="text-danger" @click="handleDelete(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
:current-page="pageNum"
|
||||
:page-size="pageSize"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination-wrapper"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 4. 新增/编辑对话框 ==================== -->
|
||||
<el-dialog
|
||||
:visible="formDialogVisible"
|
||||
:title="dialogTitle"
|
||||
width="760px"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => formDialogVisible = val"
|
||||
>
|
||||
<el-form ref="formRef" :model="form" :rules="formRules" label-width="130px" class="form-dialog-form">
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学员队编号" prop="xydbh">
|
||||
<el-input v-model="form.xydbh" placeholder="请输入学员队编号" :disabled="!isAdd" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学员队名称" prop="xydmc">
|
||||
<el-input v-model="form.xydmc" placeholder="请输入学员队名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学员队人数" prop="xydrs">
|
||||
<el-input-number v-model="form.xydrs" :min="0" controls-position="right" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="年级">
|
||||
<el-input v-model="form.nj" placeholder="请输入年级" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="专业代号" prop="zydh">
|
||||
<el-select
|
||||
v-model="form.zydh"
|
||||
:loading="majorOptionsLoading"
|
||||
placeholder="请选择专业"
|
||||
clearable
|
||||
filterable
|
||||
class="w-full"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in majorOptions"
|
||||
:key="item.zydh"
|
||||
:label="formatMajorLabel(item)"
|
||||
:value="item.zydh"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="专业教室编号">
|
||||
<el-input v-model="form.zyjsbh" placeholder="请输入专业教室编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学员队类型" prop="xydlx">
|
||||
<el-select v-model="form.xydlx" placeholder="请选择学员队类型" filterable class="w-full">
|
||||
<el-option
|
||||
v-for="item in teamTypeOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="节次类别" prop="jclb">
|
||||
<el-select v-model="form.jclb" placeholder="请选择节次类别" filterable class="w-full">
|
||||
<el-option
|
||||
v-for="item in sessionCategoryOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="系统模式" prop="xtms">
|
||||
<el-select v-model="form.xtms" placeholder="请选择系统模式" filterable class="w-full">
|
||||
<el-option
|
||||
v-for="item in systemModeOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="简称">
|
||||
<el-input v-model="form.jc" placeholder="请输入简称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属单位">
|
||||
<el-select v-model="form.ssdw" placeholder="请选择所属单位" clearable filterable class="w-full">
|
||||
<el-option
|
||||
v-for="item in unitCategoryOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-divider content-position="left">培训与状态</el-divider>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="任务类别" prop="rwlb">
|
||||
<el-input v-model="form.rwlb" placeholder="请输入任务类别" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="虚实类型" prop="xslx">
|
||||
<el-select v-model="form.xslx" class="w-full">
|
||||
<el-option label="否" :value="0" />
|
||||
<el-option label="是" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="主体培训任务" prop="ztpxrw">
|
||||
<el-select v-model="form.ztpxrw" class="w-full" @change="handlePrimaryTrainingTaskChange">
|
||||
<el-option label="是" :value="1" />
|
||||
<el-option label="否" :value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="培训任务标识号">
|
||||
<el-select
|
||||
v-model="form.pxrwbsh"
|
||||
:loading="trainingTaskLoading"
|
||||
placeholder="请选择培训任务"
|
||||
clearable
|
||||
filterable
|
||||
class="w-full"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in trainingTaskOptions"
|
||||
:key="item.bsh"
|
||||
:label="formatTrainingTaskLabel(item)"
|
||||
:value="item.bsh"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="在校状态">
|
||||
<el-select v-model="form.zxzt" placeholder="请选择在校状态" clearable class="w-full">
|
||||
<el-option label="在校" :value="1" />
|
||||
<el-option label="毕业" :value="0" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="入学日期" prop="rxrq">
|
||||
<el-date-picker v-model="form.rxrq" type="date" value-format="yyyy-MM-dd" placeholder="请选择入学日期" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="毕业日期" prop="byrq">
|
||||
<el-date-picker v-model="form.byrq" type="date" value-format="yyyy-MM-dd" placeholder="请选择毕业日期" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="form.bz" type="textarea" :rows="2" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="formDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" :loading="formSaving" @click="handleFormSubmit">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- ==================== 5. 详情对话框 ==================== -->
|
||||
<el-dialog title="学员队详情" :visible="detailDialogVisible" width="720px" :close-on-click-modal="false"
|
||||
@update:visible="val => detailDialogVisible = val">
|
||||
<div v-loading="detailLoading" class="detail-body">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="学员队编号">{{ detailForm.xydbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队名称">{{ detailForm.xydmc || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队人数">{{ fmtValue(detailForm.xydrs) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="年级">{{ detailForm.nj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="专业代号">{{ detailForm.zydh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="专业教室编号">{{ detailForm.zyjsbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队类型">{{ detailForm.xydlx || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="节次类别">{{ detailForm.jclb || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统模式">{{ detailForm.xtms || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="简称">{{ detailForm.jc || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="所属单位">{{ detailForm.ssdw || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="任务类别">{{ detailForm.rwlb || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="虚实类型">
|
||||
<el-tag :type="Number(detailForm.xslx) === 1 ? 'success' : 'info'" size="mini">
|
||||
{{ Number(detailForm.xslx) === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="主体培训任务">
|
||||
<el-tag :type="Number(detailForm.ztpxrw) === 1 ? 'success' : 'info'" size="mini">
|
||||
{{ Number(detailForm.ztpxrw) === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="培训任务标识号">{{ detailForm.pxrwbsh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="在校状态">
|
||||
<el-tag :type="Number(detailForm.zxzt) === 1 ? 'success' : 'danger'" size="mini">
|
||||
{{ Number(detailForm.zxzt) === 1 ? '在校' : '毕业' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="入学日期">{{ detailForm.rxrq || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="毕业日期">{{ detailForm.byrq || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注" :span="2">{{ detailForm.bz || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<el-button @click="detailDialogVisible = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { saveAs } from 'file-saver'
|
||||
import {
|
||||
listTeam,
|
||||
getTeam,
|
||||
addTeam,
|
||||
updateTeam,
|
||||
delTeam,
|
||||
listTrainingTasks,
|
||||
importTeam,
|
||||
exportTeam,
|
||||
downloadTeamTemplate
|
||||
} from '@/api/studentRecords/team'
|
||||
import { getDicts } from '@/api/system/dict/data'
|
||||
import { listMajor } from '@/api/subjectMajor/major'
|
||||
|
||||
const TEAM_TYPE_DICT_CODE = 'stu_type'
|
||||
const SESSION_CATEGORY_DICT_CODE = 'session_category'
|
||||
const SYSTEM_MODE_DICT_CODE = 'system_mode'
|
||||
const UNIT_CATEGORY_DICT_CODE = 'sys_unit_category'
|
||||
const MAJOR_OPTION_PAGE_SIZE = 10000
|
||||
|
||||
export default {
|
||||
name: 'ShiftTeamIndex',
|
||||
data() {
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
searchForm: {
|
||||
xydmc: '',
|
||||
nj: '',
|
||||
zydh: '',
|
||||
xydlx: '',
|
||||
rwlb: '',
|
||||
xslx: undefined
|
||||
},
|
||||
teamTypeOptions: [],
|
||||
sessionCategoryOptions: [],
|
||||
systemModeOptions: [],
|
||||
unitCategoryOptions: [],
|
||||
majorOptions: [],
|
||||
majorOptionsLoading: false,
|
||||
trainingTaskOptions: [],
|
||||
trainingTaskLoading: false,
|
||||
|
||||
// ==================== 文件导入 ====================
|
||||
selectedFile: null,
|
||||
uploading: false,
|
||||
|
||||
// ==================== 列表数据 ====================
|
||||
loading: false,
|
||||
tableData: [],
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
|
||||
// ==================== 新增/编辑 ====================
|
||||
formDialogVisible: false,
|
||||
dialogTitle: '新增学员队',
|
||||
isAdd: true,
|
||||
formSaving: false,
|
||||
form: this.createEmptyForm(),
|
||||
formRules: {
|
||||
xydbh: [{ required: true, message: '请输入学员队编号', trigger: 'blur' }],
|
||||
xydmc: [{ required: true, message: '请输入学员队名称', trigger: 'blur' }],
|
||||
xydrs: [{ required: true, message: '请输入学员队人数', trigger: 'change' }],
|
||||
zydh: [{ required: true, message: '请选择专业', trigger: 'change' }],
|
||||
rwlb: [{ required: true, message: '请输入任务类别', trigger: 'blur' }],
|
||||
xslx: [{ required: true, message: '请选择虚实类型', trigger: 'change' }],
|
||||
rxrq: [{ required: true, message: '请选择入学日期', trigger: 'change' }],
|
||||
byrq: [{ required: true, message: '请选择毕业日期', trigger: 'change' }],
|
||||
xydlx: [{ required: true, message: '请选择学员队类型', trigger: 'change' }],
|
||||
jclb: [{ required: true, message: '请选择节次类别', trigger: 'change' }],
|
||||
xtms: [{ required: true, message: '请选择系统模式', trigger: 'change' }],
|
||||
ztpxrw: [{ required: true, message: '请选择主体培训任务', trigger: 'change' }]
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
detailDialogVisible: false,
|
||||
detailLoading: false,
|
||||
detailForm: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
fileName() {
|
||||
return (this.selectedFile && this.selectedFile.name) || '未选择任何文件'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadTeamDictionaries()
|
||||
this.loadMajorOptions()
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
/** 加载学员队相关字典。 */
|
||||
async loadTeamDictionaries() {
|
||||
const emptyResponse = { data: [] }
|
||||
const [teamTypeResponse, sessionCategoryResponse, systemModeResponse, unitCategoryResponse] = await Promise.all([
|
||||
getDicts(TEAM_TYPE_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(SESSION_CATEGORY_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(SYSTEM_MODE_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(UNIT_CATEGORY_DICT_CODE).catch(() => emptyResponse)
|
||||
])
|
||||
this.teamTypeOptions = teamTypeResponse.data || []
|
||||
this.sessionCategoryOptions = sessionCategoryResponse.data || []
|
||||
this.systemModeOptions = systemModeResponse.data || []
|
||||
this.unitCategoryOptions = unitCategoryResponse.data || []
|
||||
},
|
||||
|
||||
/** 加载专业下拉选项，标签同时包含名称、代码和代号，便于直接模糊搜索。 */
|
||||
async loadMajorOptions() {
|
||||
this.majorOptionsLoading = true
|
||||
try {
|
||||
const response = await listMajor({
|
||||
pageNum: 1,
|
||||
pageSize: MAJOR_OPTION_PAGE_SIZE,
|
||||
ty: false
|
||||
})
|
||||
const data = response.data || {}
|
||||
this.majorOptions = Array.isArray(data.records) ? data.records : []
|
||||
} catch (error) {
|
||||
this.majorOptions = []
|
||||
} finally {
|
||||
this.majorOptionsLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
formatMajorLabel(item) {
|
||||
const identifiers = [item.zydm, item.zydh].filter(Boolean).join(' / ')
|
||||
if (!item.zymc) {
|
||||
return identifiers
|
||||
}
|
||||
|
||||
return identifiers ? `${item.zymc}（${identifiers}）` : item.zymc
|
||||
},
|
||||
|
||||
createEmptyForm() {
|
||||
return {
|
||||
xydbh: '',
|
||||
xydmc: '',
|
||||
xydrs: undefined,
|
||||
nj: '',
|
||||
zydh: '',
|
||||
zyjsbh: '',
|
||||
bz: '',
|
||||
zxzt: undefined,
|
||||
rwlb: '',
|
||||
xslx: 1,
|
||||
rxrq: '',
|
||||
byrq: '',
|
||||
xydlx: '',
|
||||
pxrwbsh: '',
|
||||
jclb: '',
|
||||
xtms: '',
|
||||
jsonzd: '',
|
||||
jc: '',
|
||||
ssdw: '',
|
||||
ztpxrw: 1
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 日期/数值展示 ====================
|
||||
formatDate(val) {
|
||||
if (!val) return ''
|
||||
return String(val).substring(0, 10)
|
||||
},
|
||||
fmtValue(val) {
|
||||
return val === null || val === undefined || val === '' ? '-' : val
|
||||
},
|
||||
|
||||
normalizeSchoolStatus(value) {
|
||||
if (value === 1 || value === '1' || value === '在校') {
|
||||
return 1
|
||||
}
|
||||
if (value === 0 || value === '0' || value === '毕业') {
|
||||
return 0
|
||||
}
|
||||
|
||||
return undefined
|
||||
},
|
||||
|
||||
/** 构建查询条件（不含分页），供列表查询与导出共用 */
|
||||
buildQuery() {
|
||||
const params = {}
|
||||
;['xydmc', 'nj', 'zydh', 'xydlx', 'rwlb'].forEach(key => {
|
||||
const value = this.searchForm[key]
|
||||
if (value !== '' && value !== null && value !== undefined) {
|
||||
params[key] = String(value).trim()
|
||||
}
|
||||
})
|
||||
if (this.searchForm.xslx !== undefined && this.searchForm.xslx !== '' && this.searchForm.xslx !== null) {
|
||||
params.xslx = this.searchForm.xslx
|
||||
}
|
||||
return params
|
||||
},
|
||||
|
||||
// ==================== 查询列表 ====================
|
||||
fetchList() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize,
|
||||
...this.buildQuery()
|
||||
}
|
||||
listTeam(params).then(response => {
|
||||
const data = response.data || {}
|
||||
this.tableData = data.records || []
|
||||
this.total = data.total || 0
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.tableData = []
|
||||
this.total = 0
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleSearch() {
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleReset() {
|
||||
this.$refs.searchFormRef.resetFields()
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(current) {
|
||||
this.pageNum = current
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.pageSize = size
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
// ==================== 新增/编辑 ====================
|
||||
handleAdd() {
|
||||
this.isAdd = true
|
||||
this.dialogTitle = '新增学员队'
|
||||
this.form = this.createEmptyForm()
|
||||
this.loadTrainingTaskOptions(this.form.ztpxrw)
|
||||
this.formDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate()
|
||||
})
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
this.isAdd = false
|
||||
this.dialogTitle = '编辑学员队'
|
||||
this.form = this.createEmptyForm()
|
||||
this.formDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate()
|
||||
})
|
||||
getTeam(row.xydbh).then(response => {
|
||||
const d = response.data || {}
|
||||
this.form = {
|
||||
xydbh: d.xydbh || '',
|
||||
xydmc: d.xydmc || '',
|
||||
xydrs: d.xydrs !== null && d.xydrs !== undefined ? d.xydrs : undefined,
|
||||
nj: d.nj || '',
|
||||
zydh: d.zydh || '',
|
||||
zyjsbh: d.zyjsbh || '',
|
||||
bz: d.bz || '',
|
||||
zxzt: this.normalizeSchoolStatus(d.zxzt),
|
||||
rwlb: d.rwlb || '',
|
||||
xslx: d.xslx !== null && d.xslx !== undefined ? Number(d.xslx) : 1,
|
||||
rxrq: this.formatDate(d.rxrq),
|
||||
byrq: this.formatDate(d.byrq),
|
||||
xydlx: d.xydlx || '',
|
||||
pxrwbsh: d.pxrwbsh || '',
|
||||
jclb: d.jclb || '',
|
||||
xtms: d.xtms || '',
|
||||
jsonzd: d.jsonzd || '',
|
||||
jc: d.jc || '',
|
||||
ssdw: d.ssdw || '',
|
||||
ztpxrw: d.ztpxrw !== null && d.ztpxrw !== undefined ? Number(d.ztpxrw) : 1
|
||||
}
|
||||
this.loadTrainingTaskOptions(this.form.ztpxrw)
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
/** 按主体培训任务标志加载后端培训任务选项。 */
|
||||
async loadTrainingTaskOptions(ztpxrw) {
|
||||
this.trainingTaskLoading = true
|
||||
try {
|
||||
const response = await listTrainingTasks(ztpxrw)
|
||||
this.trainingTaskOptions = Array.isArray(response.data) ? response.data : []
|
||||
} catch (error) {
|
||||
this.trainingTaskOptions = []
|
||||
} finally {
|
||||
this.trainingTaskLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
handlePrimaryTrainingTaskChange(ztpxrw) {
|
||||
this.form.pxrwbsh = ''
|
||||
this.loadTrainingTaskOptions(ztpxrw)
|
||||
},
|
||||
|
||||
formatTrainingTaskLabel(item) {
|
||||
if (!item.mc) {
|
||||
return item.bsh
|
||||
}
|
||||
|
||||
return `${item.mc}（${item.bsh}）`
|
||||
},
|
||||
|
||||
buildPayload() {
|
||||
const f = this.form
|
||||
const payload = {
|
||||
xydbh: f.xydbh,
|
||||
xydmc: f.xydmc,
|
||||
zydh: f.zydh,
|
||||
rwlb: f.rwlb,
|
||||
xydlx: f.xydlx,
|
||||
jclb: f.jclb,
|
||||
xtms: f.xtms,
|
||||
xslx: Number(f.xslx),
|
||||
ztpxrw: Number(f.ztpxrw)
|
||||
}
|
||||
// 数值字段
|
||||
if (f.xydrs !== '' && f.xydrs !== null && f.xydrs !== undefined) payload.xydrs = Number(f.xydrs)
|
||||
// 字符串字段
|
||||
if (f.zxzt !== '' && f.zxzt !== null && f.zxzt !== undefined) payload.zxzt = String(f.zxzt)
|
||||
// 后端字段为 LocalDateTime，日期选择器值统一补齐当天零点。
|
||||
if (f.rxrq) payload.rxrq = `${this.formatDate(f.rxrq)}T00:00:00`
|
||||
if (f.byrq) payload.byrq = `${this.formatDate(f.byrq)}T00:00:00`
|
||||
// 其余文本字段非空才传
|
||||
;['nj', 'zyjsbh', 'pxrwbsh', 'jsonzd', 'jc', 'ssdw', 'bz'].forEach(key => {
|
||||
if (f[key] !== '' && f[key] !== null && f[key] !== undefined) {
|
||||
payload[key] = String(f[key]).trim()
|
||||
}
|
||||
})
|
||||
return payload
|
||||
},
|
||||
|
||||
handleFormSubmit() {
|
||||
this.$refs.formRef.validate(valid => {
|
||||
if (!valid) return
|
||||
this.formSaving = true
|
||||
const payload = this.buildPayload()
|
||||
const request = this.isAdd ? addTeam(payload) : updateTeam(payload)
|
||||
request.then(() => {
|
||||
this.$message.success(this.isAdd ? '新增成功' : '修改成功')
|
||||
this.formDialogVisible = false
|
||||
this.fetchList()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.formSaving = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// ==================== 删除 ====================
|
||||
handleDelete(row) {
|
||||
this.$confirm(`确定要删除「${row.xydmc || row.xydbh}」吗？`, '系统提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
return delTeam(row.xydbh)
|
||||
}).then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchList()
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
handleDetail(row) {
|
||||
this.detailDialogVisible = true
|
||||
this.detailLoading = true
|
||||
this.detailForm = {}
|
||||
getTeam(row.xydbh).then(response => {
|
||||
this.detailForm = response.data || {}
|
||||
this.detailLoading = false
|
||||
}).catch(() => {
|
||||
this.detailLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
// ==================== 导出 ====================
|
||||
handleExport() {
|
||||
exportTeam(this.buildQuery()).then(blob => {
|
||||
saveAs(blob, '班次(学员队)管理.xlsx')
|
||||
this.$message.success('导出成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 模板下载 / 导入 ====================
|
||||
handleDownloadTemplate() {
|
||||
downloadTeamTemplate().then(blob => {
|
||||
saveAs(blob, '学员队导入模板.xlsx')
|
||||
this.$message.success('模板下载成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
handleChooseFile() {
|
||||
this.$refs.fileInputRef && this.$refs.fileInputRef.click()
|
||||
},
|
||||
|
||||
handleFileChange(e) {
|
||||
const input = e.target
|
||||
this.selectedFile = (input.files && input.files[0]) || null
|
||||
},
|
||||
|
||||
handleUpload() {
|
||||
if (!this.selectedFile) {
|
||||
this.$message.warning('请先选择文件')
|
||||
return
|
||||
}
|
||||
this.uploading = true
|
||||
importTeam(this.selectedFile).then(res => {
|
||||
const count = res && res.data
|
||||
if (count !== null && count !== undefined) {
|
||||
this.$message.success(`导入成功，共 ${count} 条记录`)
|
||||
} else {
|
||||
this.$message.success((res && res.msg) || '导入成功')
|
||||
}
|
||||
this.selectedFile = null
|
||||
this.$refs.fileInputRef && (this.$refs.fileInputRef.value = '')
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
}).catch(() => {}).finally(() => {
|
||||
this.uploading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.shift-team-page {
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.search-form {
|
||||
.search-actions-row {
|
||||
margin-top: 2px;
|
||||
border-top: 1px dashed #ebeef5;
|
||||
padding-top: 14px;
|
||||
}
|
||||
|
||||
.search-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.file-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
|
||||
.file-name {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
max-width: 180px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-card {
|
||||
.table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.table-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-dialog-form {
|
||||
max-height: 62vh;
|
||||
overflow-y: auto;
|
||||
padding-right: 6px;
|
||||
|
||||
::v-deep .el-divider--horizontal {
|
||||
margin: 4px 0 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f56c6c;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,730 @@
|
||||
<template>
|
||||
<div class="app-container status-change-page">
|
||||
<!-- ==================== 1. 查询条件 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form ref="searchFormRef" :model="searchForm" label-width="90px" class="search-form">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="编号">
|
||||
<el-input v-model="searchForm.bh" placeholder="请输入编号" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="学员编号">
|
||||
<el-input v-model="searchForm.xybh" placeholder="请输入学员编号" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="申请类型">
|
||||
<el-select v-model="searchForm.sqlx" placeholder="请选择申请类型" clearable class="w-full">
|
||||
<el-option v-for="item in applyTypeOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="状态">
|
||||
<el-select v-model="searchForm.zt" placeholder="请选择状态" clearable class="w-full">
|
||||
<el-option v-for="(item, key) in statusMap" :key="key" :label="item.label" :value="Number(key)" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24" class="search-actions">
|
||||
<div class="search-buttons">
|
||||
<el-button type="primary" @click="handleSearch">查询</el-button>
|
||||
<el-button @click="handleReset">重置</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 列表 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-header">
|
||||
<span class="table-title">学籍异动申请列表：</span>
|
||||
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增学籍异动申请</el-button>
|
||||
</div>
|
||||
<el-table v-loading="loading" :data="tableData" stripe border highlight-current-row>
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="bh" label="编号" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="xybh" label="学员编号" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="sqlx" label="申请类型" width="100" align="center" />
|
||||
<el-table-column prop="sy" label="事由" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="bz" label="备注" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column label="状态" width="90" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag :type="statusTagType(row.zt)" size="mini" effect="light">{{ statusLabel(row.zt) }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提交时间" width="160" align="center">
|
||||
<template slot-scope="{ row }">{{ row.tjsj ? fmtDateTime(row.tjsj) : '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" width="160" align="center">
|
||||
<template slot-scope="{ row }">{{ row.cjsj ? fmtDateTime(row.cjsj) : '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="修改时间" width="160" align="center">
|
||||
<template slot-scope="{ row }">{{ row.xgsj ? fmtDateTime(row.xgsj) : '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="230" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button
|
||||
v-if="!row.tjsj"
|
||||
type="text"
|
||||
size="small"
|
||||
icon="el-icon-upload2"
|
||||
@click="handleSubmit(row)"
|
||||
>提交</el-button>
|
||||
<el-button v-else type="text" size="small" icon="el-icon-check" disabled>已提交</el-button>
|
||||
<el-button type="text" size="small" icon="el-icon-view" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
|
||||
<el-button type="text" size="small" class="text-danger" @click="handleDelete(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-empty v-if="!loading && tableData.length === 0" description="暂无学籍异动申请数据" :image-size="60" />
|
||||
|
||||
<el-pagination
|
||||
:current-page="pageNum"
|
||||
:page-size="pageSize"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination-wrapper"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 3. 新增/编辑对话框 ==================== -->
|
||||
<el-dialog
|
||||
:visible="formDialogVisible"
|
||||
:title="dialogTitle"
|
||||
width="600px"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => formDialogVisible = val"
|
||||
>
|
||||
<el-form ref="formRef" :model="form" :rules="formRules" label-width="110px" class="add-form">
|
||||
<el-form-item label="学号" prop="xh">
|
||||
<el-input
|
||||
ref="studentNoInput"
|
||||
v-model.trim="form.xh"
|
||||
placeholder="请输入学号"
|
||||
:disabled="studentVerifying"
|
||||
@input="handleStudentNoInput"
|
||||
@change="handleStudentNoComplete"
|
||||
/>
|
||||
<div v-if="isStudentVerified" class="student-verified-tip">
|
||||
<i class="el-icon-circle-check" />
|
||||
已核验：{{ verifiedStudent.xm || verifiedStudent.xh || form.xh }}
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请类型" prop="sqlx">
|
||||
<el-select v-model="form.sqlx" placeholder="请选择申请类型" class="w-full">
|
||||
<el-option v-for="item in applyTypeOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="事由" prop="sy">
|
||||
<el-input v-model="form.sy" type="textarea" :rows="3" placeholder="请输入事由" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="form.bz" type="textarea" :rows="3" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="formDialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" :loading="formSaving" @click="handleFormSubmit">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- ==================== 4. 学员信息核验对话框 ==================== -->
|
||||
<el-dialog
|
||||
title="请确认学员信息"
|
||||
:visible="studentConfirmVisible"
|
||||
width="560px"
|
||||
append-to-body
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => studentConfirmVisible = val"
|
||||
>
|
||||
<el-alert
|
||||
title="请核对以下信息，确认无误后再提交申请。"
|
||||
type="info"
|
||||
:closable="false"
|
||||
show-icon
|
||||
class="student-confirm-alert"
|
||||
/>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="学号">{{ pendingStudent.xh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员编号">{{ pendingStudent.bh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="姓名">{{ pendingStudent.xm || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="性别">{{ studentSexLabel(pendingStudent.xb) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队期编号">{{ pendingStudent.xydqbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前班次编号">{{ pendingStudent.dqbzbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员类别">{{ pendingStudent.xylb || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="政治面貌">{{ pendingStudent.zzmm || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div slot="footer">
|
||||
<el-button @click="handleStudentReenter">重新输入</el-button>
|
||||
<el-button type="primary" @click="handleStudentConfirm">确认无误</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- ==================== 5. 详情对话框 ==================== -->
|
||||
<el-dialog title="学籍异动申请详情" :visible="detailDialogVisible" width="760px" :close-on-click-modal="false"
|
||||
@update:visible="val => detailDialogVisible = val">
|
||||
<div v-loading="detailLoading" class="detail-body">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="编号">{{ detailForm.bh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员编号">{{ detailForm.xybh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="申请类型">{{ detailForm.sqlx || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="状态">
|
||||
<el-tag :type="statusTagType(detailForm.zt)" size="mini">{{ statusLabel(detailForm.zt) }}</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="事由" :span="2">{{ detailForm.sy || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注" :span="2">{{ detailForm.bz || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">{{ detailForm.cjsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="修改时间">{{ detailForm.xgsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="提交时间">{{ detailForm.tjsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队审核意见">{{ detailForm.xydshyj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队干部编号">{{ detailForm.xydgbbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员队干部审核时间">{{ detailForm.xydshsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="管理员账户编号">{{ detailForm.glyzhbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="管理员审核意见">{{ detailForm.glyshyj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="管理员审核时间">{{ detailForm.glyshsj || '-' }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<el-button @click="detailDialogVisible = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listApplication,
|
||||
getApplication,
|
||||
addApplication,
|
||||
updateApplication,
|
||||
delApplication
|
||||
} from '@/api/studentRecords/application'
|
||||
import { getStudentRecord, listStudentRecord } from '@/api/studentRecords/studentRecords'
|
||||
|
||||
export default {
|
||||
name: 'StatusChangeIndex',
|
||||
computed: {
|
||||
isStudentVerified() {
|
||||
const studentNo = this.normalizeStudentNo(this.form.xh)
|
||||
return Boolean(
|
||||
studentNo &&
|
||||
studentNo === this.verifiedStudentNo &&
|
||||
this.form.xybh === this.verifiedStudent.bh
|
||||
)
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// ==================== 申请类型选项（学籍异动） ====================
|
||||
applyTypeOptions: ['休学', '复学', '退学', '转学', '留级', '转专业'],
|
||||
|
||||
// ==================== 状态映射：0-待审核 1-已审核 2-驳回等 ====================
|
||||
statusMap: {
|
||||
0: { label: '待审核', type: 'warning' },
|
||||
1: { label: '已审核', type: 'success' },
|
||||
2: { label: '驳回', type: 'danger' }
|
||||
},
|
||||
|
||||
// ==================== 查询条件 ====================
|
||||
searchForm: {
|
||||
bh: '',
|
||||
xybh: '',
|
||||
sqlx: '',
|
||||
zt: undefined
|
||||
},
|
||||
|
||||
// ==================== 列表数据 ====================
|
||||
loading: false,
|
||||
tableData: [],
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
|
||||
// ==================== 新增/编辑 ====================
|
||||
formDialogVisible: false,
|
||||
dialogTitle: '新增学籍异动申请',
|
||||
isAdd: true,
|
||||
formSaving: false,
|
||||
studentVerifying: false,
|
||||
studentConfirmVisible: false,
|
||||
pendingStudent: {},
|
||||
verifiedStudent: {},
|
||||
verifiedStudentNo: '',
|
||||
form: this.createEmptyForm(),
|
||||
formRules: {
|
||||
xh: [
|
||||
{ required: true, message: '请输入学号', trigger: 'blur' },
|
||||
{ max: 50, message: '学号不能超过50个字符', trigger: 'blur' },
|
||||
{ pattern: /^[A-Za-z0-9]+$/, message: '学号只能包含字母和数字', trigger: 'blur' }
|
||||
],
|
||||
sqlx: [{ required: true, message: '请选择申请类型', trigger: 'change' }],
|
||||
sy: [{ required: true, message: '请输入事由', trigger: 'blur' }]
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
detailDialogVisible: false,
|
||||
detailLoading: false,
|
||||
detailForm: {}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
createEmptyForm() {
|
||||
return {
|
||||
bh: '',
|
||||
xh: '',
|
||||
xybh: '',
|
||||
sqlx: '',
|
||||
sy: '',
|
||||
bz: '',
|
||||
zt: 0
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 状态展示 ====================
|
||||
// 统一格式化后端 LocalDateTime（去除 T、截断到秒）
|
||||
fmtDateTime(val) {
|
||||
if (val === null || val === undefined || val === '') return ''
|
||||
return String(val).replace('T', ' ').slice(0, 19)
|
||||
},
|
||||
statusLabel(zt) {
|
||||
const item = this.statusMap[zt]
|
||||
return item ? item.label : (zt !== null && zt !== undefined ? String(zt) : '-')
|
||||
},
|
||||
statusTagType(zt) {
|
||||
const item = this.statusMap[zt]
|
||||
return item ? item.type : 'info'
|
||||
},
|
||||
|
||||
studentSexLabel(value) {
|
||||
if (value === '' || value === null || value === undefined) {
|
||||
return '-'
|
||||
}
|
||||
if (String(value) === '1') {
|
||||
return '男'
|
||||
}
|
||||
if (String(value) === '0') {
|
||||
return '女'
|
||||
}
|
||||
return String(value)
|
||||
},
|
||||
|
||||
// ==================== 查询列表 ====================
|
||||
fetchList() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize
|
||||
}
|
||||
// 等值筛选，留空不传
|
||||
;['bh', 'xybh', 'sqlx'].forEach(key => {
|
||||
const value = this.searchForm[key]
|
||||
if (value !== '' && value !== null && value !== undefined) {
|
||||
params[key] = String(value).trim()
|
||||
}
|
||||
})
|
||||
if (this.searchForm.zt !== undefined && this.searchForm.zt !== '' && this.searchForm.zt !== null) {
|
||||
params.zt = this.searchForm.zt
|
||||
}
|
||||
listApplication(params).then(response => {
|
||||
const data = response.data || {}
|
||||
this.tableData = data.records || []
|
||||
this.total = data.total || 0
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.tableData = []
|
||||
this.total = 0
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleSearch() {
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleReset() {
|
||||
this.$refs.searchFormRef.resetFields()
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(current) {
|
||||
this.pageNum = current
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.pageSize = size
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
// ==================== 新增/编辑 ====================
|
||||
handleAdd() {
|
||||
this.isAdd = true
|
||||
this.dialogTitle = '新增学籍异动申请'
|
||||
this.form = this.createEmptyForm()
|
||||
this.resetStudentVerification()
|
||||
this.formDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate()
|
||||
})
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
this.isAdd = false
|
||||
this.dialogTitle = '编辑学籍异动申请'
|
||||
this.form = this.createEmptyForm()
|
||||
this.resetStudentVerification()
|
||||
this.formDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate()
|
||||
})
|
||||
getApplication(row.bh).then(response => {
|
||||
const data = response.data || {}
|
||||
this.form = {
|
||||
bh: data.bh || '',
|
||||
xh: '',
|
||||
xybh: data.xybh || '',
|
||||
sqlx: data.sqlx || '',
|
||||
sy: data.sy || '',
|
||||
bz: data.bz || '',
|
||||
zt: data.zt !== null && data.zt !== undefined ? Number(data.zt) : 0
|
||||
}
|
||||
this.loadExistingStudent(data.xybh)
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
normalizeStudentNo(value) {
|
||||
return value === null || value === undefined ? '' : String(value).trim()
|
||||
},
|
||||
|
||||
resetStudentVerification() {
|
||||
this.studentVerifying = false
|
||||
this.studentConfirmVisible = false
|
||||
this.pendingStudent = {}
|
||||
this.verifiedStudent = {}
|
||||
this.verifiedStudentNo = ''
|
||||
},
|
||||
|
||||
handleStudentNoInput() {
|
||||
const studentNo = this.normalizeStudentNo(this.form.xh)
|
||||
if (studentNo !== this.verifiedStudentNo) {
|
||||
this.verifiedStudent = {}
|
||||
this.verifiedStudentNo = ''
|
||||
this.form.xybh = ''
|
||||
}
|
||||
this.pendingStudent = {}
|
||||
},
|
||||
|
||||
handleStudentNoComplete() {
|
||||
if (this.normalizeStudentNo(this.form.xh)) {
|
||||
this.loadStudentForConfirmation()
|
||||
}
|
||||
},
|
||||
|
||||
async loadStudentForConfirmation() {
|
||||
if (this.studentVerifying) {
|
||||
return false
|
||||
}
|
||||
const studentNo = this.normalizeStudentNo(this.form.xh)
|
||||
if (!studentNo) {
|
||||
this.$refs.formRef && this.$refs.formRef.validateField('xh')
|
||||
return false
|
||||
}
|
||||
|
||||
if (studentNo === this.verifiedStudentNo && this.verifiedStudent.bh) {
|
||||
this.pendingStudent = { ...this.verifiedStudent }
|
||||
this.studentConfirmVisible = true
|
||||
return true
|
||||
}
|
||||
|
||||
this.studentVerifying = true
|
||||
try {
|
||||
const response = await listStudentRecord({ pageNum: 1, pageSize: 2, xh: studentNo })
|
||||
const records = response.data && Array.isArray(response.data.records) ? response.data.records : []
|
||||
|
||||
// 请求返回前用户可能已经修改了学号，旧结果不能覆盖当前输入。
|
||||
if (studentNo !== this.normalizeStudentNo(this.form.xh)) {
|
||||
return false
|
||||
}
|
||||
if (records.length === 0) {
|
||||
this.$message.warning('未查询到该学号对应的学员，请核对学号')
|
||||
this.resetStudentVerification()
|
||||
return false
|
||||
}
|
||||
if (records.length > 1) {
|
||||
this.$message.warning('该学号匹配到多名学员，请联系管理员检查学员数据')
|
||||
this.resetStudentVerification()
|
||||
return false
|
||||
}
|
||||
|
||||
this.pendingStudent = records[0]
|
||||
this.studentConfirmVisible = true
|
||||
return true
|
||||
} catch (error) {
|
||||
if (studentNo === this.normalizeStudentNo(this.form.xh)) {
|
||||
this.resetStudentVerification()
|
||||
}
|
||||
return false
|
||||
} finally {
|
||||
this.studentVerifying = false
|
||||
}
|
||||
},
|
||||
|
||||
handleStudentConfirm() {
|
||||
const studentNo = this.normalizeStudentNo(this.form.xh)
|
||||
if (!this.pendingStudent.bh || this.normalizeStudentNo(this.pendingStudent.xh) !== studentNo) {
|
||||
this.$message.warning('学号已变化，请重新核验')
|
||||
this.studentConfirmVisible = false
|
||||
return
|
||||
}
|
||||
this.verifiedStudent = { ...this.pendingStudent }
|
||||
this.verifiedStudentNo = studentNo
|
||||
this.form.xybh = this.pendingStudent.bh
|
||||
this.studentConfirmVisible = false
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate('xh')
|
||||
this.$message.success('学员信息核验成功')
|
||||
},
|
||||
|
||||
handleStudentReenter() {
|
||||
this.studentConfirmVisible = false
|
||||
this.pendingStudent = {}
|
||||
this.verifiedStudent = {}
|
||||
this.verifiedStudentNo = ''
|
||||
this.form.xybh = ''
|
||||
this.$nextTick(() => {
|
||||
const input = this.$refs.studentNoInput
|
||||
input && input.focus()
|
||||
})
|
||||
},
|
||||
|
||||
async loadExistingStudent(studentId) {
|
||||
const normalizedStudentId = this.normalizeStudentNo(studentId)
|
||||
if (!normalizedStudentId) {
|
||||
return
|
||||
}
|
||||
this.studentVerifying = true
|
||||
try {
|
||||
const response = await getStudentRecord(normalizedStudentId)
|
||||
const student = response.data || {}
|
||||
if (this.form.xybh !== normalizedStudentId || !student.bh) {
|
||||
return
|
||||
}
|
||||
this.form.xh = student.xh || ''
|
||||
this.verifiedStudentNo = this.normalizeStudentNo(student.xh)
|
||||
this.verifiedStudent = student
|
||||
} catch (error) {
|
||||
this.$message.warning('未能加载原申请的学员信息，请重新输入学号核验')
|
||||
} finally {
|
||||
this.studentVerifying = false
|
||||
}
|
||||
},
|
||||
|
||||
buildPayload() {
|
||||
const f = this.form
|
||||
const payload = {
|
||||
xybh: f.xybh,
|
||||
sqlx: f.sqlx,
|
||||
sy: f.sy
|
||||
}
|
||||
// 新增编号和状态由后端生成；编辑时仅回传记录定位编号和原状态。
|
||||
if (!this.isAdd) {
|
||||
payload.bh = f.bh
|
||||
if (f.zt !== null && f.zt !== undefined && f.zt !== '') {
|
||||
payload.zt = Number(f.zt)
|
||||
}
|
||||
}
|
||||
// 备注留空则移除
|
||||
if (f.bz !== '' && f.bz !== null && f.bz !== undefined) {
|
||||
payload.bz = f.bz
|
||||
}
|
||||
return payload
|
||||
},
|
||||
|
||||
async handleFormSubmit() {
|
||||
const isValid = await new Promise(resolve => {
|
||||
this.$refs.formRef.validate(valid => resolve(valid))
|
||||
})
|
||||
if (!isValid) {
|
||||
return
|
||||
}
|
||||
if (!this.isStudentVerified) {
|
||||
const isFound = await this.loadStudentForConfirmation()
|
||||
if (isFound) {
|
||||
this.$message.warning('请先确认学员信息，再提交申请')
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
this.formSaving = true
|
||||
const payload = this.buildPayload()
|
||||
const request = this.isAdd ? addApplication(payload) : updateApplication(payload)
|
||||
request.then(() => {
|
||||
this.$message.success(this.isAdd ? '新增成功' : '修改成功')
|
||||
this.formDialogVisible = false
|
||||
this.fetchList()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.formSaving = false
|
||||
})
|
||||
},
|
||||
|
||||
// ==================== 提交 ====================
|
||||
// 无独立提交接口，通过编辑接口写入提交时间 tjsj（zt 保持原值不变）
|
||||
formatNow() {
|
||||
const d = new Date()
|
||||
const pad = n => String(n).padStart(2, '0')
|
||||
const date = `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`
|
||||
const time = `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`
|
||||
return `${date} ${time}`
|
||||
},
|
||||
|
||||
handleSubmit(row) {
|
||||
this.$confirm(`确定要提交编号为「${row.bh}」的学籍异动申请吗？`, '系统提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
const payload = {
|
||||
bh: row.bh,
|
||||
xybh: row.xybh,
|
||||
sqlx: row.sqlx,
|
||||
sy: row.sy,
|
||||
zt: row.zt !== null && row.zt !== undefined ? Number(row.zt) : 0,
|
||||
tjsj: this.formatNow()
|
||||
}
|
||||
if (row.bz) {
|
||||
payload.bz = row.bz
|
||||
}
|
||||
return updateApplication(payload)
|
||||
}).then(() => {
|
||||
this.$message.success('提交成功')
|
||||
this.fetchList()
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 删除 ====================
|
||||
handleDelete(row) {
|
||||
this.$confirm(`确定要删除编号为「${row.bh}」的学籍异动申请吗？`, '系统提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
return delApplication(row.bh)
|
||||
}).then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchList()
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
handleDetail(row) {
|
||||
this.detailDialogVisible = true
|
||||
this.detailLoading = true
|
||||
this.detailForm = {}
|
||||
getApplication(row.bh).then(response => {
|
||||
this.detailForm = response.data || {}
|
||||
this.detailLoading = false
|
||||
}).catch(() => {
|
||||
this.detailLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.status-change-page {
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-top: 8px;
|
||||
|
||||
.search-tip {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.search-buttons {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-card {
|
||||
.table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.table-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.add-form {
|
||||
max-height: 60vh;
|
||||
overflow-y: auto;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
.student-verified-tip {
|
||||
margin-top: 4px;
|
||||
color: #078267;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
|
||||
i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f56c6c;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.student-confirm-alert {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,876 @@
|
||||
<template>
|
||||
<div class="app-container student-info-page">
|
||||
<!-- ==================== 1. 查询条件区域 ==================== -->
|
||||
<el-card v-if="!isStudentRole" 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.xh" 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-select v-model="searchForm.xb" placeholder="请选择性别" clearable class="full-width">
|
||||
<el-option label="男" value="男" />
|
||||
<el-option label="女" value="女" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="证件号码">
|
||||
<el-input v-model="searchForm.zjhm" placeholder="请输入证件号码" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="政治面貌">
|
||||
<el-select v-model="searchForm.zzmm" placeholder="请选择政治面貌" clearable filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in politicalStatusOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="民族">
|
||||
<el-select v-model="searchForm.mz" placeholder="请选择民族" clearable filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in nationOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="籍贯">
|
||||
<el-input v-model="searchForm.jg" placeholder="请输入籍贯" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="学位">
|
||||
<el-select v-model="searchForm.xw" placeholder="请选择学位" clearable filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in degreeOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 右栏 -->
|
||||
<el-col :xs="24" :md="12">
|
||||
<el-form-item label="原部职别">
|
||||
<el-input v-model="searchForm.ybzb" 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-select v-model="searchForm.whcd" placeholder="请选择文化程度" clearable filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in educationLevelOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="本科毕业院校">
|
||||
<el-input v-model="searchForm.bkbyyx" placeholder="请输入本科毕业院校" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="学员类别">
|
||||
<el-select v-model="searchForm.xylb" placeholder="请选择学员类别" clearable filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in studentCategoryOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话">
|
||||
<el-input v-model="searchForm.lxdh" placeholder="请输入联系电话" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="通信地址">
|
||||
<el-input v-model="searchForm.txdz" placeholder="请输入通信地址" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div class="search-actions">
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 数据表格区域 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="list-header">
|
||||
<div class="list-title">学员信息列表</div>
|
||||
<el-button v-if="!isStudentRole" type="primary" icon="el-icon-plus" @click="handleAdd">新增学员</el-button>
|
||||
</div>
|
||||
<el-table v-loading="loading" :data="tableData" class="student-info-table" stripe border>
|
||||
<el-table-column type="index" label="序号" width="70" align="center" />
|
||||
<el-table-column prop="xh" label="学号" width="130" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="xm" label="姓名" width="90" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="xb" label="性别" width="70" align="center" />
|
||||
<el-table-column prop="nj" label="年级" width="80" align="center" />
|
||||
<el-table-column prop="zy" label="专业" width="160" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="xylb" label="学员类别" width="110" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="bc" label="班次" width="180" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="zzmm" label="政治面貌" width="110" align="center" />
|
||||
<el-table-column prop="mz" label="民族" width="80" align="center" />
|
||||
<el-table-column prop="jg" label="籍贯" width="120" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="xw" label="学位" width="90" align="center" />
|
||||
<el-table-column prop="zczt" label="注册状态" width="110" align="center" />
|
||||
<el-table-column prop="xjyd" label="学籍异动状态" width="130" align="center" />
|
||||
<el-table-column prop="ksqk" label="考试情况" width="100" align="center" />
|
||||
<el-table-column prop="bjgm" label="不及格门数" width="110" align="center" />
|
||||
<el-table-column prop="gljg" label="管理机构" width="150" align="center" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="190" 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 v-if="dialogTitle !== '新增学员'" :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-select v-model="formData.mz" placeholder="请选择民族" filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in nationOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</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-select v-model="formData.zzmm" placeholder="请选择政治面貌" filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in politicalStatusOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="文化程度" prop="whcd">
|
||||
<el-select v-model="formData.whcd" placeholder="请选择文化程度" filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in educationLevelOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学员类别" prop="xylb">
|
||||
<el-select v-model="formData.xylb" placeholder="请选择学员类别" filterable class="full-width">
|
||||
<el-option
|
||||
v-for="item in studentCategoryOptions"
|
||||
:key="item.dictCode || item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</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 v-if="dialogTitle !== '新增学员'" :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 v-if="dialogTitle !== '新增学员'" :span="8"><el-form-item label="留级状态" prop="ljzt"><el-input v-model="formData.ljzt" placeholder="请输入" /></el-form-item></el-col>
|
||||
<el-col v-if="dialogTitle !== '新增学员'" :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="80%"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => gradesVisible = val"
|
||||
>
|
||||
<div class="student-summary">
|
||||
<span><strong>学员：</strong>{{ gradesStudent || '-' }}</span>
|
||||
<span><strong>学号：</strong>{{ gradesStudentNo || '-' }}</span>
|
||||
<div class="grades-year-filter">
|
||||
<span class="filter-label">年度：</span>
|
||||
<el-select v-model="gradesYear" size="small" clearable placeholder="全部年度">
|
||||
<el-option
|
||||
v-for="year in gradeYearOptions"
|
||||
:key="year"
|
||||
:label="year"
|
||||
:value="year"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<el-tabs v-model="gradesTab">
|
||||
<el-tab-pane label="成绩" name="grades">
|
||||
<el-table v-loading="gradesLoading" :data="filteredGradesData" stripe border max-height="420">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="nd" label="年度" width="85" align="center" />
|
||||
<el-table-column prop="kmbh" label="科目编号" min-width="120" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="klx" label="课类型" width="90" align="center" />
|
||||
<el-table-column prop="kscj" label="考试成绩" width="90" align="center" />
|
||||
<el-table-column prop="pscj" label="平时成绩" width="90" align="center" />
|
||||
<el-table-column prop="zzcj" label="最终成绩" width="90" align="center" />
|
||||
<el-table-column prop="qwxf" label="期望学分" width="90" align="center" />
|
||||
<el-table-column prop="bkcj" label="补考成绩" width="90" align="center" />
|
||||
<el-table-column prop="bkcs" label="补考次数" width="90" align="center" />
|
||||
<el-table-column prop="ksqk" label="考试情况" width="100" align="center" />
|
||||
<el-table-column label="考试结果" width="90" align="center">
|
||||
<template slot-scope="{ row }">{{ formatPassStatus(row.ytg) }}</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="进程成绩" name="process">
|
||||
<el-table v-loading="gradesLoading" :data="filteredProcessGradesData" stripe border max-height="420">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="nd" label="年度" width="85" align="center" />
|
||||
<el-table-column prop="kmbh" label="科目编号" min-width="120" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="klx" label="课类型" width="90" align="center" />
|
||||
<el-table-column prop="yscj" label="原始成绩" width="100" align="center" />
|
||||
<el-table-column prop="zzcj" label="最终成绩" width="90" align="center" />
|
||||
<el-table-column prop="bkcj1" label="补考成绩1" width="100" align="center" />
|
||||
<el-table-column prop="bkcj2" label="补考成绩2" width="100" align="center" />
|
||||
<el-table-column prop="bkcj3" label="补考成绩3" width="100" align="center" />
|
||||
<el-table-column prop="bkcs" label="补考次数" width="90" align="center" />
|
||||
<el-table-column prop="ksqk" label="考试情况" width="100" align="center" />
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div slot="footer">
|
||||
<el-button type="primary" :loading="gradesExporting" @click="handleExportGrades">
|
||||
{{ gradesTab === 'grades' ? '导出成绩' : '导出进程成绩' }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listStudentRecord,
|
||||
getStudentRecord,
|
||||
addStudentRecord,
|
||||
updateStudentRecord,
|
||||
delStudentRecord,
|
||||
listStudentGrades,
|
||||
listStudentProcessGrades,
|
||||
exportStudentGrades,
|
||||
exportStudentProcessGrades
|
||||
} from "@/api/studentRecords/studentRecords"
|
||||
import { getDicts } from '@/api/system/dict/data'
|
||||
import { optionselect } from '@/api/system/dict/type'
|
||||
|
||||
const POLITICAL_STATUS_DICT_CODE = 'sys_political_status'
|
||||
const NATION_DICT_CODE = 'nation_type'
|
||||
const DEGREE_DICT_CODE = 'sys_degree_type'
|
||||
const EDUCATION_LEVEL_DICT_CODE = 'sys_edu_level'
|
||||
const GRADES_VIEW_DISABLED_VALUES = new Set(['0', 'false', '否', '不允许'])
|
||||
const RESIDENT_IDENTITY_CARD_TYPES = new Set(['居民身份证', '身份证'])
|
||||
const IDENTITY_CARD_CHECK_CODES = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2']
|
||||
const IDENTITY_CARD_WEIGHTS = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]
|
||||
const PHONE_NUMBER_PATTERN = /^(1[3-9]\d{9}|0\d{2,3}-?\d{7,8})$/
|
||||
|
||||
function isResidentIdentityCardType(certificateType) {
|
||||
return RESIDENT_IDENTITY_CARD_TYPES.has(String(certificateType || '').trim())
|
||||
}
|
||||
|
||||
function isValidIdentityCard(identityCard) {
|
||||
const normalizedValue = String(identityCard || '').trim().toUpperCase()
|
||||
if (!/^\d{17}[\dX]$/.test(normalizedValue)) {
|
||||
return false
|
||||
}
|
||||
|
||||
const year = Number(normalizedValue.slice(6, 10))
|
||||
const month = Number(normalizedValue.slice(10, 12))
|
||||
const day = Number(normalizedValue.slice(12, 14))
|
||||
const birthDate = new Date(year, month - 1, day)
|
||||
const isValidDate = birthDate.getFullYear() === year &&
|
||||
birthDate.getMonth() === month - 1 && birthDate.getDate() === day
|
||||
if (!isValidDate || birthDate > new Date()) {
|
||||
return false
|
||||
}
|
||||
|
||||
const checksum = IDENTITY_CARD_WEIGHTS.reduce((total, weight, index) => {
|
||||
return total + Number(normalizedValue[index]) * weight
|
||||
}, 0)
|
||||
|
||||
return IDENTITY_CARD_CHECK_CODES[checksum % 11] === normalizedValue[17]
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'StudentInfoIndex',
|
||||
data() {
|
||||
const validateCertificateNumber = (rule, value, callback) => {
|
||||
if (value && isResidentIdentityCardType(this.formData.jrzjlx) && !isValidIdentityCard(value)) {
|
||||
callback(new Error('请输入合法的18位居民身份证号码'))
|
||||
return
|
||||
}
|
||||
callback()
|
||||
}
|
||||
const validateBirthDate = (rule, value, callback) => {
|
||||
if (value && new Date(`${value}T00:00:00`) > new Date()) {
|
||||
callback(new Error('出生日期不能晚于今天'))
|
||||
return
|
||||
}
|
||||
callback()
|
||||
}
|
||||
const validatePhoneNumber = (rule, value, callback) => {
|
||||
if (value && !PHONE_NUMBER_PATTERN.test(String(value).trim())) {
|
||||
callback(new Error('请输入正确的手机号码或固定电话号码'))
|
||||
return
|
||||
}
|
||||
callback()
|
||||
}
|
||||
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
// 仅保留后端 XYXX 实体支持的字段：/student-records/list 会按实体字段动态构建查询条件
|
||||
searchForm: {
|
||||
xh: '', xm: '', xb: '', zjhm: '', zzmm: '', mz: '', jg: '', xw: '',
|
||||
ybzb: '', sfzh: '', whcd: '', bkbyyx: '', xylb: '', lxdh: '', txdz: ''
|
||||
},
|
||||
politicalStatusOptions: [],
|
||||
nationOptions: [],
|
||||
degreeOptions: [],
|
||||
educationLevelOptions: [],
|
||||
studentCategoryOptions: [],
|
||||
|
||||
// ==================== 数据表格 ====================
|
||||
loading: false,
|
||||
tableData: [],
|
||||
pagination: { pageNum: 1, pageSize: 20, total: 0 },
|
||||
|
||||
// ==================== 新增/编辑弹窗 ====================
|
||||
dialogVisible: false,
|
||||
dialogTitle: '新增学员',
|
||||
submitting: false,
|
||||
formData: this.createEmptyForm(),
|
||||
formRules: {
|
||||
xm: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
|
||||
xydqbh: [{ required: true, message: '请输入学员队期编号', trigger: 'blur' }],
|
||||
zjhm: [
|
||||
{ required: true, message: '请输入证件号码', trigger: 'blur' },
|
||||
{ validator: validateCertificateNumber, trigger: 'blur' }
|
||||
],
|
||||
zzmm: [{ required: true, message: '请选择政治面貌', trigger: 'change' }],
|
||||
xb: [{ required: true, message: '请选择性别', trigger: 'change' }],
|
||||
csrq: [
|
||||
{ required: true, message: '请选择出生日期', trigger: 'change' },
|
||||
{ validator: validateBirthDate, trigger: 'change' }
|
||||
],
|
||||
mz: [{ required: true, message: '请选择民族', trigger: 'change' }],
|
||||
jg: [{ required: true, message: '请输入籍贯', trigger: 'blur' }],
|
||||
whcd: [{ required: true, message: '请选择文化程度', trigger: 'change' }],
|
||||
xylb: [{ required: true, message: '请选择学员类别', trigger: 'change' }],
|
||||
ssjq: [{ required: true, message: '请输入所属军区', trigger: 'blur' }],
|
||||
gfs: [{ required: true, message: '请选择国防生', trigger: 'change' }],
|
||||
yxckcj: [{ required: true, message: '请选择允许查看成绩', trigger: 'change' }],
|
||||
dqbzbh: [{ required: true, message: '请输入当前班次编号', trigger: 'blur' }],
|
||||
yzc: [{ required: true, message: '请选择已注册', trigger: 'change' }],
|
||||
jrzjlx: [{ required: true, message: '请输入军人证件类型', trigger: 'blur' }],
|
||||
lxdh: [{ validator: validatePhoneNumber, trigger: 'blur' }]
|
||||
},
|
||||
|
||||
// ==================== 成绩弹窗 ====================
|
||||
gradesVisible: false,
|
||||
gradesTab: 'grades',
|
||||
gradesData: [],
|
||||
processGradesData: [],
|
||||
gradesYear: '',
|
||||
gradesStudent: '',
|
||||
gradesStudentNo: '',
|
||||
currentBh: '',
|
||||
gradesLoading: false,
|
||||
gradesExporting: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
gradeYearOptions() {
|
||||
const years = [...this.gradesData, ...this.processGradesData]
|
||||
.map(item => item.nd)
|
||||
.filter(year => year !== '' && year !== null && year !== undefined)
|
||||
.map(String)
|
||||
|
||||
return [...new Set(years)].sort((firstYear, secondYear) => secondYear.localeCompare(firstYear))
|
||||
},
|
||||
/** 学员角色（后端角色键 STUDENT）隐藏条件查询栏与新增学员按钮 */
|
||||
isStudentRole() {
|
||||
const roles = this.$store.getters.roles
|
||||
return Array.isArray(roles) && roles.includes('STUDENT')
|
||||
},
|
||||
filteredGradesData() {
|
||||
return this.filterGradesByYear(this.gradesData)
|
||||
},
|
||||
filteredProcessGradesData() {
|
||||
return this.filterGradesByYear(this.processGradesData)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadStudentDictionaries()
|
||||
},
|
||||
mounted() {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
/** 加载学员基础信息字典，业务字段按字典标签查询和提交。 */
|
||||
async loadStudentDictionaries() {
|
||||
const emptyResponse = { data: [] }
|
||||
const [politicalStatusResponse, nationResponse, degreeResponse, educationLevelResponse, dictTypeResponse] =
|
||||
await Promise.all([
|
||||
getDicts(POLITICAL_STATUS_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(NATION_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(DEGREE_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(EDUCATION_LEVEL_DICT_CODE).catch(() => emptyResponse),
|
||||
optionselect().catch(() => emptyResponse)
|
||||
])
|
||||
|
||||
this.politicalStatusOptions = politicalStatusResponse.data || []
|
||||
this.nationOptions = nationResponse.data || []
|
||||
this.degreeOptions = degreeResponse.data || []
|
||||
this.educationLevelOptions = educationLevelResponse.data || []
|
||||
this.studentCategoryOptions = await this.loadNamedDictionary(dictTypeResponse.data || [], '学员类别')
|
||||
this.mergeExistingDictionaryOptions()
|
||||
},
|
||||
|
||||
/** 根据字典名称匹配类型编码，避免业务页面硬编码数据库配置。 */
|
||||
async loadNamedDictionary(dictTypes, dictName) {
|
||||
const dictType = dictTypes.find(item => item.dictName === dictName) ||
|
||||
dictTypes.find(item => String(item.dictName || '').includes(dictName))
|
||||
if (!dictType || !dictType.dictType) {
|
||||
return []
|
||||
}
|
||||
try {
|
||||
const response = await getDicts(dictType.dictType)
|
||||
return response.data || []
|
||||
} catch (error) {
|
||||
return []
|
||||
}
|
||||
},
|
||||
|
||||
/** 字典缺项时保留列表已有值，避免历史数据无法作为查询条件。 */
|
||||
mergeExistingDictionaryOptions() {
|
||||
this.politicalStatusOptions = this.mergeFieldOptions(this.politicalStatusOptions, 'zzmm')
|
||||
this.nationOptions = this.mergeFieldOptions(this.nationOptions, 'mz')
|
||||
this.degreeOptions = this.mergeFieldOptions(this.degreeOptions, 'xw')
|
||||
this.educationLevelOptions = this.mergeFieldOptions(this.educationLevelOptions, 'whcd')
|
||||
this.studentCategoryOptions = this.mergeFieldOptions(this.studentCategoryOptions, 'xylb')
|
||||
},
|
||||
|
||||
mergeFieldOptions(dictionaryOptions, fieldName) {
|
||||
const options = dictionaryOptions.slice()
|
||||
const existingLabels = new Set(options.map(item => String(item.dictLabel)))
|
||||
this.tableData.forEach(row => {
|
||||
const value = row[fieldName]
|
||||
if (value === '' || value === null || value === undefined || existingLabels.has(String(value))) {
|
||||
return
|
||||
}
|
||||
options.push({
|
||||
dictLabel: String(value),
|
||||
dictValue: String(value)
|
||||
})
|
||||
existingLabels.add(String(value))
|
||||
})
|
||||
|
||||
return options
|
||||
},
|
||||
|
||||
/** 创建空白表单 */
|
||||
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: ''
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 列表加载 ====================
|
||||
loadData() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageNum: this.pagination.pageNum,
|
||||
pageSize: this.pagination.pageSize
|
||||
}
|
||||
this.buildQueryParams(params)
|
||||
listStudentRecord(params).then(res => {
|
||||
const data = res.data || {}
|
||||
this.tableData = data.records || []
|
||||
this.pagination.total = data.total || 0
|
||||
this.mergeExistingDictionaryOptions()
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.tableData = []
|
||||
this.pagination.total = 0
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
/** 组装查询参数：仅传后端 XYXX 实体支持的字符串字段，空值忽略 */
|
||||
buildQueryParams(params) {
|
||||
const textFields = [
|
||||
'xh', 'xm', 'zjhm', 'zzmm', 'mz', 'jg', 'xw', 'ybzb', 'sfzh', 'whcd', 'bkbyyx', 'xylb', 'lxdh', 'txdz'
|
||||
]
|
||||
textFields.forEach(key => {
|
||||
const v = this.searchForm[key]
|
||||
if (v !== '' && v !== null && v !== undefined) params[key] = v.trim()
|
||||
})
|
||||
if (this.searchForm.xb) params.xb = this.searchForm.xb
|
||||
},
|
||||
|
||||
// ==================== 查询/分页 ====================
|
||||
handleSearch() {
|
||||
this.pagination.pageNum = 1
|
||||
this.loadData()
|
||||
},
|
||||
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
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
this.dialogTitle = '编辑学员'
|
||||
this.resetForm()
|
||||
if (!row.bh) {
|
||||
Object.assign(this.formData, this.createEmptyForm(), row)
|
||||
this.dialogVisible = true
|
||||
return
|
||||
}
|
||||
getStudentRecord(row.bh).then(res => {
|
||||
const data = res.data || {}
|
||||
Object.assign(this.formData, this.createEmptyForm(), data)
|
||||
this.dialogVisible = true
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 新增/编辑提交 ====================
|
||||
handleSubmit() {
|
||||
this.$refs.formRef.validate(valid => {
|
||||
if (!valid) return
|
||||
this.submitting = true
|
||||
const isAdd = this.dialogTitle === '新增学员'
|
||||
const payload = { ...this.formData }
|
||||
if (isAdd) {
|
||||
delete payload.bh
|
||||
delete payload.xh
|
||||
delete payload.txzt
|
||||
delete payload.ljzt
|
||||
delete payload.fbzt
|
||||
}
|
||||
const request = isAdd ? addStudentRecord(payload) : updateStudentRecord(payload)
|
||||
request.then(() => {
|
||||
this.$message.success(isAdd ? '新增成功' : '编辑成功')
|
||||
this.dialogVisible = false
|
||||
this.loadData()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.submitting = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// ==================== 删除 ====================
|
||||
handleDelete(row) {
|
||||
this.$confirm(`确定要删除"${row.xm}"吗？`, '删除确认', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
return delStudentRecord(row.bh)
|
||||
}).then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.loadData()
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 成绩弹窗 ====================
|
||||
async handleGrades(row) {
|
||||
if (this.isGradesViewDisabled(row.yxckcj)) {
|
||||
this.$alert('不允许查看该学员成绩', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
type: 'warning'
|
||||
}).catch(() => {})
|
||||
return
|
||||
}
|
||||
|
||||
this.gradesStudent = row.xm || ''
|
||||
this.gradesStudentNo = row.xh || ''
|
||||
this.currentBh = row.bh || ''
|
||||
this.gradesData = []
|
||||
this.processGradesData = []
|
||||
this.gradesYear = ''
|
||||
this.gradesTab = 'grades'
|
||||
this.gradesVisible = true
|
||||
this.gradesLoading = true
|
||||
|
||||
const emptyResponse = { data: { records: [] } }
|
||||
const query = { pageNum: 1, pageSize: 1000, xybh: this.currentBh }
|
||||
try {
|
||||
const [gradesResponse, processGradesResponse] = await Promise.all([
|
||||
listStudentGrades(query).catch(() => emptyResponse),
|
||||
listStudentProcessGrades(query).catch(() => emptyResponse)
|
||||
])
|
||||
this.gradesData = gradesResponse.data.records || []
|
||||
this.processGradesData = processGradesResponse.data.records || []
|
||||
} finally {
|
||||
this.gradesLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
formatPassStatus(value) {
|
||||
if (value === 1 || value === '1') {
|
||||
return '已通过'
|
||||
}
|
||||
if (value === 0 || value === '0') {
|
||||
return '未通过'
|
||||
}
|
||||
return '-'
|
||||
},
|
||||
|
||||
isGradesViewDisabled(value) {
|
||||
return GRADES_VIEW_DISABLED_VALUES.has(String(value).trim().toLowerCase())
|
||||
},
|
||||
|
||||
filterGradesByYear(grades) {
|
||||
if (!this.gradesYear) {
|
||||
return grades
|
||||
}
|
||||
|
||||
return grades.filter(item => String(item.nd) === this.gradesYear)
|
||||
},
|
||||
|
||||
downloadGradesFile(blob, fileName) {
|
||||
const link = document.createElement('a')
|
||||
link.href = URL.createObjectURL(blob)
|
||||
link.download = fileName
|
||||
link.click()
|
||||
URL.revokeObjectURL(link.href)
|
||||
},
|
||||
|
||||
async handleExportGrades() {
|
||||
if (!this.currentBh) {
|
||||
this.$message.warning('缺少学员编号，无法导出成绩')
|
||||
return
|
||||
}
|
||||
|
||||
this.gradesExporting = true
|
||||
try {
|
||||
const isProcessGrades = this.gradesTab === 'process'
|
||||
const request = isProcessGrades ? exportStudentProcessGrades : exportStudentGrades
|
||||
const blob = await request({ xybh: this.currentBh })
|
||||
const suffix = isProcessGrades ? '课程过程成绩' : '课程成绩'
|
||||
this.downloadGradesFile(blob, `${this.gradesStudent || '学员'}_${suffix}.xlsx`)
|
||||
this.$message.success(`${suffix}导出成功`)
|
||||
} finally {
|
||||
this.gradesExporting = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.student-info-page {
|
||||
.search-card {
|
||||
.search-form {
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-card {
|
||||
.list-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.list-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.student-info-table ::v-deep .cell {
|
||||
white-space: nowrap;
|
||||
word-break: keep-all;
|
||||
}
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: #409eff;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: #67c23a;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.danger-text {
|
||||
color: #f56c6c;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.student-summary {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 32px;
|
||||
margin-bottom: 8px;
|
||||
color: #303133;
|
||||
line-height: 24px;
|
||||
|
||||
.grades-year-filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: auto;
|
||||
|
||||
.filter-label {
|
||||
flex-shrink: 0;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.el-select {
|
||||
width: 160px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,583 @@
|
||||
<template>
|
||||
<div class="app-container warning-condition-page">
|
||||
<!-- ==================== 1. 查询条件 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form ref="searchFormRef" :model="searchForm" label-width="90px" class="search-form">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="searchForm.mc" placeholder="请输入名称" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="培训类型">
|
||||
<el-select v-model="searchForm.pxlx" placeholder="请选择培训类型" clearable filterable style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in trainingTypeOptions"
|
||||
:key="item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="培训层次">
|
||||
<el-select v-model="searchForm.pxcc" placeholder="请选择培训层次" clearable filterable style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in trainingLevelOptions"
|
||||
:key="item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="停用">
|
||||
<el-radio-group v-model="searchForm.ty">
|
||||
<el-radio :label="0">否</el-radio>
|
||||
<el-radio :label="1">是</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="search-actions-row">
|
||||
<el-col :span="24" class="search-actions">
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 列表 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-header">
|
||||
<span class="table-title">预警条件列表：</span>
|
||||
<div class="table-actions">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增预警条件</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table v-loading="loading" :data="tableData" stripe border highlight-current-row>
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="bh" label="编号" width="100" show-overflow-tooltip />
|
||||
<el-table-column prop="mc" label="名称" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="pxlx" label="培训类型" width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="pxcc" label="培训层次" width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="bb" label="版本" width="100" show-overflow-tooltip />
|
||||
<el-table-column prop="xgsj" label="修改时间" width="170" show-overflow-tooltip />
|
||||
<el-table-column label="停用" width="80" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag
|
||||
:type="scope.row.ty === 1 || scope.row.ty === true ? 'danger' : 'success'"
|
||||
class="ty-tag"
|
||||
@click.native="handleToggleDisable(scope.row, scope.row.ty === 1 || scope.row.ty === true ? 0 : 1)"
|
||||
>
|
||||
{{ scope.row.ty === 1 || scope.row.ty === true ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150" align="center" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="small" icon="el-icon-view" @click="handleView(scope.row)">详情</el-button>
|
||||
<el-button type="text" size="small" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
:current-page="pageNum"
|
||||
:page-size="pageSize"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination-wrapper"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 3. 新增/编辑预警条件对话框 ==================== -->
|
||||
<el-dialog
|
||||
:title="formTitle"
|
||||
:visible.sync="formDialogVisible"
|
||||
width="900px"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-form ref="formRef" :model="form" :rules="formRules" label-width="130px" class="form-dialog-form">
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称" prop="mc">
|
||||
<el-input v-model="form.mc" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="培训类型" prop="pxlx">
|
||||
<el-select v-model="form.pxlx" placeholder="请选择培训类型" filterable style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in trainingTypeOptions"
|
||||
:key="item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="培训层次" prop="pxcc">
|
||||
<el-select v-model="form.pxcc" placeholder="请选择培训层次" filterable style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in trainingLevelOptions"
|
||||
:key="item.dictValue"
|
||||
:label="item.dictLabel"
|
||||
:value="item.dictLabel"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="版本" prop="bb">
|
||||
<el-input v-model="form.bb" placeholder="请输入版本" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="停用" prop="ty">
|
||||
<el-radio-group v-model="form.ty">
|
||||
<el-radio :label="0">否</el-radio>
|
||||
<el-radio :label="1">是</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-divider content-position="left">当前学期门数限制</el-divider>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考试不及格门数下限">
|
||||
<el-input-number v-model="form.dqxqksbjgmsxx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考试不及格门数下限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考试不及格门数上限">
|
||||
<el-input-number v-model="form.dqxqksbjgmssx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考试不及格门数上限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考查不及格门数下限">
|
||||
<el-input-number v-model="form.dqxqkcbjgmsxx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考查不及格门数下限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考查不及格门数上限">
|
||||
<el-input-number v-model="form.dqxqkcbjgmssx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考查不及格门数上限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="不及格门数下限">
|
||||
<el-input-number v-model="form.dqxqbjgmsxx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入不及格门数下限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="不及格门数上限">
|
||||
<el-input-number v-model="form.dqxqbjgmssx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入不及格门数上限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-divider content-position="left">全部门数限制</el-divider>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考试不及格门数下限">
|
||||
<el-input-number v-model="form.qbksbjgmsxx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考试不及格门数下限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考试不及格门数上限">
|
||||
<el-input-number v-model="form.qbksbjgmssx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考试不及格门数上限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考查不及格门数下限">
|
||||
<el-input-number v-model="form.qbkcbjgmsxx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考查不及格门数下限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="考查不及格门数上限">
|
||||
<el-input-number v-model="form.qbkcbjgmssx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入考查不及格门数上限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="不及格门数下限">
|
||||
<el-input-number v-model="form.qbbjgmsxx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入不及格门数下限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="不及格门数上限">
|
||||
<el-input-number v-model="form.qbbjgmssx" :min="0" :max="999" controls-position="right" style="width: 100%" placeholder="请输入不及格门数上限" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="formDialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="formSaving" @click="handleFormSubmit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- ==================== 4. 详情对话框 ==================== -->
|
||||
<el-dialog title="预警条件详情" :visible.sync="viewDialogVisible" width="800px" :close-on-click-modal="false">
|
||||
<div v-loading="viewLoading" class="detail-body">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="编号">{{ viewForm.bh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="名称">{{ viewForm.mc || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="培训类型">{{ viewForm.pxlx || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="培训层次">{{ viewForm.pxcc || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="版本">{{ viewForm.bb || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="修改时间">{{ viewForm.xgsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前学期考试不及格门数下限">{{ formatValue(viewForm.dqxqksbjgmsxx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前学期考试不及格门数上限">{{ formatValue(viewForm.dqxqksbjgmssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前学期考查不及格门数下限">{{ formatValue(viewForm.dqxqkcbjgmsxx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前学期考查不及格门数上限">{{ formatValue(viewForm.dqxqkcbjgmssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前学期不及格门数下限">{{ formatValue(viewForm.dqxqbjgmsxx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前学期不及格门数上限">{{ formatValue(viewForm.dqxqbjgmssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全部考试不及格门数下限">{{ formatValue(viewForm.qbksbjgmsxx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全部考试不及格门数上限">{{ formatValue(viewForm.qbksbjgmssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全部考查不及格门数下限">{{ formatValue(viewForm.qbkcbjgmsxx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全部考查不及格门数上限">{{ formatValue(viewForm.qbkcbjgmssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全部不及格门数下限">{{ formatValue(viewForm.qbbjgmsxx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="全部不及格门数上限">{{ formatValue(viewForm.qbbjgmssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="停用">
|
||||
<el-tag :type="viewForm.ty === 1 || viewForm.ty === true ? 'danger' : 'success'" size="mini">
|
||||
{{ viewForm.ty === 1 || viewForm.ty === true ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="viewDialogVisible = false">关 闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listWarningCondition,
|
||||
getWarningCondition,
|
||||
addWarningCondition,
|
||||
updateWarningCondition
|
||||
} from "@/api/studentRecords/warningCondition"
|
||||
import { getDicts } from '@/api/system/dict/data'
|
||||
|
||||
const TRAINING_TYPE_DICT_CODE = 'train_type'
|
||||
const TRAINING_LEVEL_DICT_CODE = 'train_level'
|
||||
|
||||
export default {
|
||||
name: "WarningCondition",
|
||||
data() {
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
searchForm: {
|
||||
mc: '',
|
||||
pxlx: '',
|
||||
pxcc: '',
|
||||
ty: 0
|
||||
},
|
||||
trainingTypeOptions: [],
|
||||
trainingLevelOptions: [],
|
||||
|
||||
// ==================== 列表数据 ====================
|
||||
loading: false,
|
||||
tableData: [],
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
|
||||
// ==================== 新增/编辑 ====================
|
||||
formDialogVisible: false,
|
||||
formTitle: '新增预警条件',
|
||||
isAdd: true,
|
||||
formSaving: false,
|
||||
form: this.createEmptyForm(),
|
||||
formRules: {
|
||||
mc: [{ required: true, message: "名称不能为空", trigger: "blur" }],
|
||||
ty: [{ required: true, message: "停用不能为空", trigger: "change" }],
|
||||
bb: [{ required: true, message: "版本不能为空", trigger: "blur" }]
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
viewDialogVisible: false,
|
||||
viewLoading: false,
|
||||
viewForm: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadTrainingDictionaries()
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
/** 加载培训类型、培训层次字典。 */
|
||||
async loadTrainingDictionaries() {
|
||||
const emptyResponse = { data: [] }
|
||||
const [typeResponse, levelResponse] = await Promise.all([
|
||||
getDicts(TRAINING_TYPE_DICT_CODE).catch(() => emptyResponse),
|
||||
getDicts(TRAINING_LEVEL_DICT_CODE).catch(() => emptyResponse)
|
||||
])
|
||||
this.trainingTypeOptions = typeResponse.data || []
|
||||
this.trainingLevelOptions = levelResponse.data || []
|
||||
},
|
||||
|
||||
/** 创建空表单 */
|
||||
createEmptyForm() {
|
||||
return {
|
||||
mc: '',
|
||||
pxlx: '',
|
||||
pxcc: '',
|
||||
dqxqksbjgmssx: undefined,
|
||||
dqxqksbjgmsxx: undefined,
|
||||
dqxqkcbjgmssx: undefined,
|
||||
dqxqkcbjgmsxx: undefined,
|
||||
dqxqbjgmssx: undefined,
|
||||
dqxqbjgmsxx: undefined,
|
||||
qbksbjgmssx: undefined,
|
||||
qbksbjgmsxx: undefined,
|
||||
qbkcbjgmssx: undefined,
|
||||
qbkcbjgmsxx: undefined,
|
||||
qbbjgmssx: undefined,
|
||||
qbbjgmsxx: undefined,
|
||||
ty: 0,
|
||||
bb: ''
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 查询列表 ====================
|
||||
fetchList() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize
|
||||
}
|
||||
params.ty = this.searchForm.ty
|
||||
// 其余文本条件非空时才传
|
||||
;['mc', 'pxlx', 'pxcc'].forEach(key => {
|
||||
if (this.searchForm[key] !== '' && this.searchForm[key] !== null && this.searchForm[key] !== undefined) {
|
||||
params[key] = this.searchForm[key].trim()
|
||||
}
|
||||
})
|
||||
listWarningCondition(params).then(response => {
|
||||
const data = response.data || {}
|
||||
this.tableData = data.records || []
|
||||
this.total = data.total || 0
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.tableData = []
|
||||
this.total = 0
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleSearch() {
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleReset() {
|
||||
this.searchForm = {
|
||||
mc: '',
|
||||
pxlx: '',
|
||||
pxcc: '',
|
||||
ty: 0
|
||||
}
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(current) {
|
||||
this.pageNum = current
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.pageSize = size
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
// ==================== 新增/编辑 ====================
|
||||
handleAdd() {
|
||||
this.isAdd = true
|
||||
this.formTitle = '新增预警条件'
|
||||
this.form = this.createEmptyForm()
|
||||
this.formDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate()
|
||||
})
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
this.isAdd = false
|
||||
this.formTitle = '编辑预警条件'
|
||||
this.form = this.createEmptyForm()
|
||||
this.formDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.formRef && this.$refs.formRef.clearValidate()
|
||||
})
|
||||
getWarningCondition(row.bh).then(response => {
|
||||
const data = response.data || {}
|
||||
this.fillFormData(data)
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
/** 回填表单数据 */
|
||||
fillFormData(data) {
|
||||
const fieldKeys = [
|
||||
'mc', 'pxlx', 'pxcc',
|
||||
'dqxqksbjgmssx', 'dqxqksbjgmsxx',
|
||||
'dqxqkcbjgmssx', 'dqxqkcbjgmsxx',
|
||||
'dqxqbjgmssx', 'dqxqbjgmsxx',
|
||||
'qbksbjgmssx', 'qbksbjgmsxx',
|
||||
'qbkcbjgmssx', 'qbkcbjgmsxx',
|
||||
'qbbjgmssx', 'qbbjgmsxx',
|
||||
'bb'
|
||||
]
|
||||
const result = this.createEmptyForm()
|
||||
fieldKeys.forEach(key => {
|
||||
result[key] = data[key] !== null && data[key] !== undefined ? data[key] : result[key]
|
||||
})
|
||||
result.bh = data.bh
|
||||
result.ty = data.ty === 1 || data.ty === true ? 1 : 0
|
||||
this.form = result
|
||||
},
|
||||
|
||||
handleFormSubmit() {
|
||||
this.$refs.formRef.validate(valid => {
|
||||
if (!valid) return
|
||||
this.formSaving = true
|
||||
const payload = { ...this.form }
|
||||
if (!this.isAdd) {
|
||||
payload.bh = this.form.bh
|
||||
}
|
||||
const request = this.isAdd ? addWarningCondition(payload) : updateWarningCondition(payload)
|
||||
request.then(() => {
|
||||
this.$message.success(this.isAdd ? '新增成功' : '修改成功')
|
||||
this.formDialogVisible = false
|
||||
this.fetchList()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.formSaving = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// ==================== 停用/启用切换 ====================
|
||||
handleToggleDisable(row, val) {
|
||||
const isDisable = val === 1 || val === true
|
||||
const prevTy = isDisable ? 0 : 1
|
||||
const actionName = isDisable ? '停用' : '启用'
|
||||
this.$confirm(`确定要${actionName}「${row.mc || row.bh || '该预警条件'}」吗？`, '系统提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
return updateWarningCondition({ ...row, ty: isDisable ? 1 : 0 })
|
||||
}).then(() => {
|
||||
this.$message.success(actionName + '成功')
|
||||
this.fetchList()
|
||||
}).catch(() => {
|
||||
// 取消或接口失败时回滚开关状态并刷新
|
||||
row.ty = prevTy
|
||||
this.fetchList()
|
||||
})
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
handleView(row) {
|
||||
this.viewDialogVisible = true
|
||||
this.viewLoading = true
|
||||
this.viewForm = {}
|
||||
getWarningCondition(row.bh).then(response => {
|
||||
this.viewForm = response.data || {}
|
||||
this.viewLoading = false
|
||||
}).catch(() => {
|
||||
this.viewLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
/** 空值显示占位符 */
|
||||
formatValue(val) {
|
||||
return val !== null && val !== undefined ? val : '-'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.warning-condition-page {
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
::v-deep .el-form-item {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.search-actions-row {
|
||||
margin-top: 2px;
|
||||
border-top: 1px dashed #ebeef5;
|
||||
padding-top: 14px;
|
||||
}
|
||||
|
||||
.search-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.table-card {
|
||||
.table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.table-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.table-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-dialog-form {
|
||||
max-height: 62vh;
|
||||
overflow-y: auto;
|
||||
padding-right: 6px;
|
||||
|
||||
::v-deep .el-divider--horizontal {
|
||||
margin: 4px 0 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.ty-tag {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,256 @@
|
||||
<template>
|
||||
<div class="app-container warning-result-page">
|
||||
<!-- ==================== 1. 查询条件 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form ref="searchFormRef" :model="searchForm" label-width="110px" class="search-form">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="年度">
|
||||
<el-input v-model="searchForm.nd" placeholder="请输入年度" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="预警条件编号">
|
||||
<el-input v-model="searchForm.yjtjbh" placeholder="请输入预警条件编号" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="学员编号">
|
||||
<el-input v-model="searchForm.xybh" placeholder="请输入学员编号" clearable @keyup.enter.native="handleSearch" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
|
||||
<el-form-item label="发布">
|
||||
<el-select v-model="searchForm.fb" placeholder="请选择发布状态" clearable class="w-full">
|
||||
<el-option label="未发布" :value="0" />
|
||||
<el-option label="已发布" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="search-actions-row">
|
||||
<el-col :span="24" class="search-actions">
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 列表 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-header">
|
||||
<span class="table-title">预警结果列表：</span>
|
||||
</div>
|
||||
<el-table v-loading="loading" :data="tableData" stripe border highlight-current-row>
|
||||
<el-table-column prop="bh" label="编号" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="nd" label="年度" width="90" align="center" />
|
||||
<el-table-column prop="yjtjbh" label="预警条件编号" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="xybh" label="学员编号" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="cjsj" label="创建时间" width="160" show-overflow-tooltip />
|
||||
<el-table-column label="发布" width="90" align="center">
|
||||
<template slot-scope="{ row }">
|
||||
<el-tag :type="Number(row.fb) === 1 ? 'success' : 'info'" size="mini">
|
||||
{{ Number(row.fb) === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fbsj" label="发布时间" width="160" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="100" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" size="small" icon="el-icon-view" @click="handleDetail(row)">详情</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
:current-page="pageNum"
|
||||
:page-size="pageSize"
|
||||
:total="total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination-wrapper"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 3. 详情对话框 ==================== -->
|
||||
<el-dialog title="预警结果详情" :visible="detailDialogVisible" width="560px" :close-on-click-modal="false"
|
||||
@update:visible="val => detailDialogVisible = val">
|
||||
<div v-loading="detailLoading" class="detail-body">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="编号">{{ detailForm.bh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="年度">{{ detailForm.nd || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="预警条件编号">{{ detailForm.yjtjbh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="学员编号">{{ detailForm.xybh || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">{{ detailForm.cjsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="发布时间">{{ detailForm.fbsj || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="发布">
|
||||
<el-tag :type="Number(detailForm.fb) === 1 ? 'success' : 'info'" size="mini">
|
||||
{{ Number(detailForm.fb) === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<el-button @click="detailDialogVisible = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listWarningResult,
|
||||
getWarningResult
|
||||
} from '@/api/studentRecords/warningResult'
|
||||
|
||||
export default {
|
||||
name: 'WarningResult',
|
||||
data() {
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
searchForm: {
|
||||
nd: '',
|
||||
yjtjbh: '',
|
||||
xybh: '',
|
||||
fb: undefined
|
||||
},
|
||||
|
||||
// ==================== 列表数据 ====================
|
||||
loading: false,
|
||||
tableData: [],
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
|
||||
// ==================== 详情 ====================
|
||||
detailDialogVisible: false,
|
||||
detailLoading: false,
|
||||
detailForm: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
// ==================== 查询列表 ====================
|
||||
fetchList() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize
|
||||
}
|
||||
// 文本条件非空时才传
|
||||
;['nd', 'yjtjbh', 'xybh'].forEach(key => {
|
||||
const value = this.searchForm[key]
|
||||
if (value !== '' && value !== null && value !== undefined) {
|
||||
params[key] = String(value).trim()
|
||||
}
|
||||
})
|
||||
// 发布：等值筛选（选中时才传）
|
||||
if (this.searchForm.fb !== undefined && this.searchForm.fb !== '' && this.searchForm.fb !== null) {
|
||||
params.fb = this.searchForm.fb
|
||||
}
|
||||
listWarningResult(params).then(response => {
|
||||
const data = response.data || {}
|
||||
this.tableData = data.records || []
|
||||
this.total = data.total || 0
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.tableData = []
|
||||
this.total = 0
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleSearch() {
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleReset() {
|
||||
this.$refs.searchFormRef.resetFields()
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(current) {
|
||||
this.pageNum = current
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.pageSize = size
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
handleDetail(row) {
|
||||
this.detailDialogVisible = true
|
||||
this.detailLoading = true
|
||||
this.detailForm = {}
|
||||
getWarningResult(row.bh).then(response => {
|
||||
this.detailForm = response.data || {}
|
||||
this.detailLoading = false
|
||||
}).catch(() => {
|
||||
this.detailLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.warning-result-page {
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-actions-row {
|
||||
margin-top: 2px;
|
||||
border-top: 1px dashed #ebeef5;
|
||||
padding-top: 14px;
|
||||
}
|
||||
|
||||
.search-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.table-card {
|
||||
.table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.table-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user