forked from liweijie/education
前端文件
This commit is contained in:
@@ -0,0 +1,534 @@
|
||||
<template>
|
||||
<div class="app-container joint-training-page">
|
||||
<div class="list-title">联教联训管理</div>
|
||||
|
||||
<!-- ==================== 1. 查询条件区域 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form :model="searchForm" label-width="40px" class="search-form">
|
||||
<el-row :gutter="6">
|
||||
<el-col :span="4">
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="searchForm.mc" placeholder="请输入名称" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div class="search-actions">
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 操作区域 ==================== -->
|
||||
<el-card shadow="never" class="upload-card">
|
||||
<div class="upload-row">
|
||||
<div class="upload-left">
|
||||
<el-button type="primary" @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>
|
||||
<el-button icon="el-icon-folder-opened" @click="handleChooseFile">选择文件</el-button>
|
||||
<span class="file-name" :class="{ 'has-file': selectedFile }">{{ fileName }}</span>
|
||||
<input ref="fileInputRef" type="file" accept=".xls,.xlsx" style="display: none" @change="handleFileChange" />
|
||||
<el-button type="primary" icon="el-icon-upload2" :loading="uploading" @click="handleUpload">上传数据</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 3. 数据表格 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-title">联教联训记录列表</div>
|
||||
<el-table v-loading="tableLoading" :data="tableData" border stripe style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="mc" label="名称" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="xz" label="性质" width="80" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="yj" label="依据" width="110" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="ksrq" label="开始日期" width="110" align="center" :formatter="fmtDateTime" />
|
||||
<el-table-column prop="jsrq" label="结束日期" width="110" align="center" :formatter="fmtDateTime" />
|
||||
<el-table-column prop="ts" label="天数" width="70" align="center" />
|
||||
<el-table-column prop="jbksl" label="基本课时量" width="90" align="center" />
|
||||
<el-table-column prop="kslx" label="课时类型" width="80" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="xmlx" label="项目类型" width="80" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="bz" label="备注" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="230" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" @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"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 4. 新增/修改对话框 ==================== -->
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
:title="dialogTitle"
|
||||
width="720px"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => dialogVisible = val"
|
||||
>
|
||||
<el-form ref="formRef" :model="form" :rules="rules" label-width="110px" class="add-form">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="编号">
|
||||
<el-input v-model="form.bh" placeholder="留空则自动生成" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称" prop="mc">
|
||||
<el-input v-model="form.mc" placeholder="请输入名称" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性质">
|
||||
<el-input v-model="form.xz" placeholder="请输入性质" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="依据">
|
||||
<el-input v-model="form.yj" placeholder="请输入依据" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="开始日期">
|
||||
<el-date-picker v-model="form.ksrq" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择开始日期" clearable class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="结束日期">
|
||||
<el-date-picker v-model="form.jsrq" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择结束日期" clearable class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="天数">
|
||||
<el-input-number v-model="form.ts" :min="0" :precision="1" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="基本课时量">
|
||||
<el-input-number v-model="form.jbksl" :min="0" :precision="1" :step="0.5" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课时类型">
|
||||
<el-input v-model="form.kslx" placeholder="请输入课时类型" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="项目类型">
|
||||
<el-input v-model="form.xmlx" placeholder="请输入项目类型" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="说明">
|
||||
<el-input v-model="form.sm" type="textarea" :rows="2" placeholder="请输入说明" />
|
||||
</el-form-item>
|
||||
<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="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" :loading="saving" @click="handleSubmit">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- ==================== 5. 详情对话框 ==================== -->
|
||||
<el-dialog :visible="detailVisible" title="联教联训详情" width="640px" @update:visible="val => detailVisible = val">
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="编号">{{ detailData.bh }}</el-descriptions-item>
|
||||
<el-descriptions-item label="名称">{{ detailData.mc }}</el-descriptions-item>
|
||||
<el-descriptions-item label="性质">{{ fmtEmpty(detailData.xz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="依据">{{ fmtEmpty(detailData.yj) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="开始日期">{{ fmtDateTime(null, null, detailData.ksrq) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="结束日期">{{ fmtDateTime(null, null, detailData.jsrq) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="天数">{{ fmtValue(detailData.ts) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="基本课时量">{{ fmtValue(detailData.jbksl) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="课时类型">{{ fmtEmpty(detailData.kslx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="项目类型">{{ fmtEmpty(detailData.xmlx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="说明" :span="2">{{ fmtEmpty(detailData.sm) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注" :span="2">{{ fmtEmpty(detailData.bz) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div slot="footer">
|
||||
<el-button @click="detailVisible = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { saveAs } from 'file-saver'
|
||||
import {
|
||||
listJointTraining,
|
||||
addJointTraining,
|
||||
updateJointTraining,
|
||||
deleteJointTraining,
|
||||
getJointTraining,
|
||||
importJointTraining,
|
||||
exportJointTraining,
|
||||
downloadJointTrainingTemplate
|
||||
} from '@/api/classHour/jointTraining'
|
||||
|
||||
export default {
|
||||
name: 'JointTrainingIndex',
|
||||
data() {
|
||||
return {
|
||||
// ==================== 1. 查询条件 ====================
|
||||
searchForm: {
|
||||
mc: ''
|
||||
},
|
||||
|
||||
// ==================== 2. 文件操作 ====================
|
||||
selectedFile: null,
|
||||
uploading: false,
|
||||
|
||||
// ==================== 3. 表格数据 ====================
|
||||
tableLoading: false,
|
||||
tableData: [],
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
|
||||
// ==================== 4. 新增/修改表单 ====================
|
||||
dialogVisible: false,
|
||||
dialogTitle: '新增联教联训',
|
||||
saving: false,
|
||||
form: this.createEmptyForm(),
|
||||
rules: {
|
||||
mc: [{ required: true, message: '请输入名称', trigger: 'blur' }]
|
||||
},
|
||||
|
||||
// ==================== 5. 详情 ====================
|
||||
detailVisible: false,
|
||||
detailData: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
fileName() {
|
||||
return (this.selectedFile && this.selectedFile.name) || '未选择任何文件'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
createEmptyForm() {
|
||||
return {
|
||||
bh: '',
|
||||
mc: '',
|
||||
xz: '',
|
||||
yj: '',
|
||||
ksrq: '',
|
||||
jsrq: '',
|
||||
ts: null,
|
||||
jbksl: null,
|
||||
kslx: '',
|
||||
xmlx: '',
|
||||
sm: '',
|
||||
bz: ''
|
||||
}
|
||||
},
|
||||
|
||||
/** 把后端 LocalDateTime（含 T/毫秒）规范为表单可回显的格式 */
|
||||
normalizeDateTime(val) {
|
||||
if (!val) return ''
|
||||
return String(val).replace('T', ' ').replace(/\.\d+$/, '').slice(0, 19)
|
||||
},
|
||||
|
||||
// ==================== 查询 ====================
|
||||
fetchList() {
|
||||
this.tableLoading = true
|
||||
const params = { pageNum: this.pageNum, pageSize: this.pageSize }
|
||||
if (this.searchForm.mc && this.searchForm.mc.trim()) params.mc = this.searchForm.mc.trim()
|
||||
listJointTraining(params).then(res => {
|
||||
const data = (res && res.data) || {}
|
||||
this.tableData = data.records || []
|
||||
this.total = data.total || 0
|
||||
this.tableLoading = false
|
||||
}).catch(() => {
|
||||
this.tableData = []
|
||||
this.total = 0
|
||||
this.tableLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleQuery() {
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(page) {
|
||||
this.pageNum = page
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.pageSize = size
|
||||
this.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
/** 日期时间显示（去掉 T、截断到分钟） */
|
||||
fmtDateTime(row, column, cellValue) {
|
||||
if (cellValue === null || cellValue === undefined || cellValue === '') return '-'
|
||||
return String(cellValue).replace('T', ' ').slice(0, 16)
|
||||
},
|
||||
|
||||
/** 空值显示为 '-' */
|
||||
fmtEmpty(val) {
|
||||
return val === null || val === undefined || val === '' ? '-' : val
|
||||
},
|
||||
|
||||
/** 数值空值显示为 '-'（保留 0） */
|
||||
fmtValue(val) {
|
||||
return val === null || val === undefined ? '-' : val
|
||||
},
|
||||
|
||||
// ==================== 新增 / 修改 ====================
|
||||
handleAdd() {
|
||||
this.form = this.createEmptyForm()
|
||||
this.dialogTitle = '新增联教联训'
|
||||
this.dialogVisible = true
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
getJointTraining(row.bh).then(res => {
|
||||
const d = (res && res.data) || {}
|
||||
this.form = {
|
||||
bh: d.bh || '',
|
||||
mc: d.mc || '',
|
||||
xz: d.xz || '',
|
||||
yj: d.yj || '',
|
||||
ksrq: this.normalizeDateTime(d.ksrq),
|
||||
jsrq: this.normalizeDateTime(d.jsrq),
|
||||
ts: d.ts === null || d.ts === undefined ? null : d.ts,
|
||||
jbksl: d.jbksl === null || d.jbksl === undefined ? null : d.jbksl,
|
||||
kslx: d.kslx || '',
|
||||
xmlx: d.xmlx || '',
|
||||
sm: d.sm || '',
|
||||
bz: d.bz || ''
|
||||
}
|
||||
this.dialogTitle = '修改联教联训'
|
||||
this.dialogVisible = true
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
handleSubmit() {
|
||||
this.$refs.formRef.validate(valid => {
|
||||
if (!valid) {
|
||||
this.$message.warning('请完善必填项后再提交')
|
||||
return
|
||||
}
|
||||
const payload = this.buildPayload()
|
||||
this.saving = true
|
||||
const req = payload.bh ? updateJointTraining(payload) : addJointTraining(payload)
|
||||
req.then(() => {
|
||||
this.$message.success(this.dialogTitle === '修改联教联训' ? '修改成功' : '新增成功')
|
||||
this.dialogVisible = false
|
||||
this.fetchList()
|
||||
}).catch(() => {}).finally(() => {
|
||||
this.saving = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
/** 构建请求体，仅含实体非空字段（创建/修改时间为后端自动维护，不传） */
|
||||
buildPayload() {
|
||||
const f = this.form
|
||||
const payload = {}
|
||||
if (f.bh && f.bh.trim()) payload.bh = f.bh.trim()
|
||||
if (f.mc && f.mc.trim()) payload.mc = f.mc.trim()
|
||||
if (f.xz && f.xz.trim()) payload.xz = f.xz.trim()
|
||||
if (f.yj && f.yj.trim()) payload.yj = f.yj.trim()
|
||||
if (f.ksrq) payload.ksrq = f.ksrq
|
||||
if (f.jsrq) payload.jsrq = f.jsrq
|
||||
if (f.ts !== null && f.ts !== undefined) payload.ts = f.ts
|
||||
if (f.jbksl !== null && f.jbksl !== undefined) payload.jbksl = f.jbksl
|
||||
if (f.kslx && f.kslx.trim()) payload.kslx = f.kslx.trim()
|
||||
if (f.xmlx && f.xmlx.trim()) payload.xmlx = f.xmlx.trim()
|
||||
if (f.sm && f.sm.trim()) payload.sm = f.sm.trim()
|
||||
if (f.bz && f.bz.trim()) payload.bz = f.bz.trim()
|
||||
return payload
|
||||
},
|
||||
|
||||
// ==================== 删除 ====================
|
||||
handleDelete(row) {
|
||||
this.$confirm(`确定要删除「${row.mc || row.bh || '该记录'}」吗？`, '系统提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => deleteJointTraining(row.bh)).then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchList()
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
handleDetail(row) {
|
||||
getJointTraining(row.bh).then(res => {
|
||||
this.detailData = (res && res.data) || {}
|
||||
this.detailVisible = true
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 导出 ====================
|
||||
handleExport() {
|
||||
exportJointTraining().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
|
||||
importJointTraining(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
|
||||
})
|
||||
},
|
||||
|
||||
handleDownloadTemplate() {
|
||||
downloadJointTrainingTemplate().then(blob => {
|
||||
saveAs(blob, '联教连训管理.xls')
|
||||
this.$message.success('模板下载成功')
|
||||
}).catch(() => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.joint-training-page {
|
||||
.list-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
// ==================== 1. 查询条件区域 ====================
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.search-form {
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 2. 操作区域 ====================
|
||||
.upload-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.upload-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
|
||||
.upload-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.file-name {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
|
||||
&.has-file {
|
||||
color: #303133;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 3. 数据表格 ====================
|
||||
.table-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.table-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 4. 新增/修改表单 ====================
|
||||
.add-form {
|
||||
max-height: 62vh;
|
||||
overflow-y: auto;
|
||||
padding-right: 4px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,706 @@
|
||||
<template>
|
||||
<div class="app-container plan-page">
|
||||
|
||||
<!-- ==================== Tab 切换 ==================== -->
|
||||
<el-tabs v-model="activeTab" @tab-click="handleTabClick">
|
||||
<el-tab-pane label="课时费方案" name="fee" />
|
||||
<el-tab-pane label="课时方案" name="coeff" />
|
||||
</el-tabs>
|
||||
|
||||
<!-- ==================== 1. 查询与新增 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form :inline="true" class="search-form" @submit.native.prevent>
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="currentForm.mc" placeholder="请输入名称" clearable style="width: 220px" @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
<el-button type="primary" plain @click="handleAdd">新增{{ currentTitle }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 数据表格 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<!-- 课时费方案 -->
|
||||
<el-table
|
||||
v-if="activeTab === 'fee'"
|
||||
v-loading="feeState.loading"
|
||||
:data="feeState.list"
|
||||
border
|
||||
stripe
|
||||
class="plan-data-table"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="mc" label="名称" min-width="130" show-overflow-tooltip />
|
||||
<el-table-column prop="mrbzksl" label="默认标准课时量" width="120" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrbzksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mrksfbz" label="默认课时费标准" width="120" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mrclksfbz" label="默认超量课时费标准" width="150" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrclksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="xgjxbzksfbz" label="相关教学补助课时费标准" width="180" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.xgjxbzksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxyxbz" label="绩效优秀补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxyxbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxlhbz" label="绩效良好补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxlhbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxzdbz" label="绩效中等补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxzdbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxjgbz" label="绩效及格补助" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxjgbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jxbjgbz" label="绩效不及格补助" width="120" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jxbjgbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="180" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<div class="table-actions">
|
||||
<el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
|
||||
<el-button type="text" size="small" class="text-danger" @click="handleDelete(row)">删除</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 课时方案 -->
|
||||
<el-table
|
||||
v-else
|
||||
v-loading="coeffState.loading"
|
||||
:data="coeffState.list"
|
||||
border
|
||||
stripe
|
||||
class="plan-data-table"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="mc" label="名称" min-width="130" show-overflow-tooltip />
|
||||
<el-table-column prop="zjksxs" label="主讲课时系数" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.zjksxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="fjksxs" label="辅讲课时系数" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.fjksxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mbxyrs" label="满班学员人数" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mbxyrs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="dz10xybjxs" label="递增10学员班级系数" width="150" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.dz10xybjxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="bjxssx" label="班级系数上限" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.bjxssx) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="d78jksl" label="第78节课时量" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.d78jksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="yjksl" label="夜间课时量" width="100" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.yjksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="mrktjxffxs" label="默认课堂教法系数" width="130" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.mrktjxffxs) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hbxszl" label="合班系数增量" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.hbxszl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hbxssx" label="合班系数上限" width="110" align="right">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.hbxssx) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="140" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<div class="table-actions">
|
||||
<el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
|
||||
<el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
:current-page="currentState.pageNum"
|
||||
:page-size="currentState.pageSize"
|
||||
:total="currentState.total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 3. 新增/修改对话框 ==================== -->
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
:title="dialogTitle"
|
||||
width="760px"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => dialogVisible = val"
|
||||
>
|
||||
<!-- 课时费方案表单 -->
|
||||
<el-form v-if="activeTab === 'fee'" ref="feeFormRef" :model="feeForm" :rules="feeRules" label-width="160px" class="add-form">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="编号">
|
||||
<el-input v-model="feeForm.bh" placeholder="留空则自动生成" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称" prop="mc">
|
||||
<el-input v-model="feeForm.mc" placeholder="请输入名称" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="默认标准课时量" prop="mrbzksl">
|
||||
<el-input-number v-model="feeForm.mrbzksl" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="默认课时费标准" prop="mrksfbz">
|
||||
<el-input-number v-model="feeForm.mrksfbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="默认超量课时费标准" prop="mrclksfbz">
|
||||
<el-input-number v-model="feeForm.mrclksfbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="相关教学补助课时费标准" prop="xgjxbzksfbz">
|
||||
<el-input-number v-model="feeForm.xgjxbzksfbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="绩效优秀补助" prop="jxyxbz">
|
||||
<el-input-number v-model="feeForm.jxyxbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="绩效良好补助" prop="jxlhbz">
|
||||
<el-input-number v-model="feeForm.jxlhbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="绩效中等补助" prop="jxzdbz">
|
||||
<el-input-number v-model="feeForm.jxzdbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="绩效及格补助" prop="jxjgbz">
|
||||
<el-input-number v-model="feeForm.jxjgbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="绩效不及格补助" prop="jxbjgbz">
|
||||
<el-input-number v-model="feeForm.jxbjgbz" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="说明">
|
||||
<el-input v-model="feeForm.sm" type="textarea" :rows="2" placeholder="请输入说明" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="feeForm.bz" type="textarea" :rows="2" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 课时方案表单 -->
|
||||
<el-form v-else ref="coeffFormRef" :model="coeffForm" :rules="coeffRules" label-width="160px" class="add-form">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="编号">
|
||||
<el-input v-model="coeffForm.bh" placeholder="留空则自动生成" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称" prop="mc">
|
||||
<el-input v-model="coeffForm.mc" placeholder="请输入名称" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="主讲课时系数">
|
||||
<el-input-number v-model="coeffForm.zjksxs" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="辅讲课时系数">
|
||||
<el-input-number v-model="coeffForm.fjksxs" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="满班学员人数">
|
||||
<el-input-number v-model="coeffForm.mbxyrs" :min="0" :precision="0" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="递增10学员班级系数">
|
||||
<el-input-number v-model="coeffForm.dz10xybjxs" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班级系数上限">
|
||||
<el-input-number v-model="coeffForm.bjxssx" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="第78节课时量">
|
||||
<el-input-number v-model="coeffForm.d78jksl" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="夜间课时量">
|
||||
<el-input-number v-model="coeffForm.yjksl" :min="0" :precision="2" :step="1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="默认课堂教学方法系数">
|
||||
<el-input-number v-model="coeffForm.mrktjxffxs" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="合班系数增量">
|
||||
<el-input-number v-model="coeffForm.hbxszl" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="合班系数上限">
|
||||
<el-input-number v-model="coeffForm.hbxssx" :min="0" :precision="2" :step="0.1" class="w-full" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="说明">
|
||||
<el-input v-model="coeffForm.sm" type="textarea" :rows="2" placeholder="请输入说明" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="coeffForm.bz" type="textarea" :rows="2" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div slot="footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" :loading="saving" @click="handleSubmit">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- ==================== 4. 详情对话框 ==================== -->
|
||||
<el-dialog :visible="detailVisible" :title="`${currentTitle}详情`" width="680px" @update:visible="val => detailVisible = val">
|
||||
<el-descriptions v-if="activeTab === 'fee'" :column="2" border>
|
||||
<el-descriptions-item label="编号">{{ detailData.bh }}</el-descriptions-item>
|
||||
<el-descriptions-item label="名称">{{ detailData.mc }}</el-descriptions-item>
|
||||
<el-descriptions-item label="默认标准课时量">{{ fmtValue(detailData.mrbzksl) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="默认课时费标准">{{ fmtValue(detailData.mrksfbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="默认超量课时费标准">{{ fmtValue(detailData.mrclksfbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="相关教学补助课时费标准">{{ fmtValue(detailData.xgjxbzksfbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="绩效优秀补助">{{ fmtValue(detailData.jxyxbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="绩效良好补助">{{ fmtValue(detailData.jxlhbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="绩效中等补助">{{ fmtValue(detailData.jxzdbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="绩效及格补助">{{ fmtValue(detailData.jxjgbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="绩效不及格补助">{{ fmtValue(detailData.jxbjgbz) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">{{ fmtEmpty(detailData.cjsj) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="说明" :span="2">{{ fmtEmpty(detailData.sm) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注" :span="2">{{ fmtEmpty(detailData.bz) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<el-descriptions v-else :column="2" border>
|
||||
<el-descriptions-item label="编号">{{ detailData.bh }}</el-descriptions-item>
|
||||
<el-descriptions-item label="名称">{{ detailData.mc }}</el-descriptions-item>
|
||||
<el-descriptions-item label="主讲课时系数">{{ fmtValue(detailData.zjksxs) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="辅讲课时系数">{{ fmtValue(detailData.fjksxs) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="满班学员人数">{{ fmtValue(detailData.mbxyrs) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="递增10学员班级系数">{{ fmtValue(detailData.dz10xybjxs) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="班级系数上限">{{ fmtValue(detailData.bjxssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="第78节课时量">{{ fmtValue(detailData.d78jksl) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="夜间课时量">{{ fmtValue(detailData.yjksl) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="默认课堂教学方法系数">{{ fmtValue(detailData.mrktjxffxs) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="合班系数增量">{{ fmtValue(detailData.hbxszl) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="合班系数上限">{{ fmtValue(detailData.hbxssx) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="创建时间">{{ fmtEmpty(detailData.cjsj) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="说明" :span="2">{{ fmtEmpty(detailData.sm) }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注" :span="2">{{ fmtEmpty(detailData.bz) }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<div slot="footer">
|
||||
<el-button @click="detailVisible = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listFeeStandard,
|
||||
getFeeStandard,
|
||||
addFeeStandard,
|
||||
updateFeeStandard,
|
||||
deleteFeeStandard,
|
||||
listCoefficientPlan,
|
||||
getCoefficientPlan,
|
||||
addCoefficientPlan,
|
||||
updateCoefficientPlan
|
||||
} from '@/api/classHour/plan'
|
||||
|
||||
export default {
|
||||
name: 'ClassHourPlan',
|
||||
data() {
|
||||
return {
|
||||
// ==================== Tab ====================
|
||||
activeTab: 'fee',
|
||||
|
||||
// ==================== 查询条件 ====================
|
||||
feeSearch: { mc: '' },
|
||||
coeffSearch: { mc: '' },
|
||||
|
||||
// ==================== 列表状态 ====================
|
||||
feeState: this.createEmptyState(),
|
||||
coeffState: this.createEmptyState(),
|
||||
|
||||
// ==================== 新增/修改 ====================
|
||||
dialogVisible: false,
|
||||
dialogTitle: '',
|
||||
saving: false,
|
||||
feeForm: this.createEmptyFeeForm(),
|
||||
coeffForm: this.createEmptyCoeffForm(),
|
||||
feeRules: {
|
||||
mc: [{ required: true, message: '请输入名称', trigger: 'blur' }],
|
||||
mrbzksl: [{ required: true, message: '请输入默认标准课时量', trigger: 'blur' }],
|
||||
mrksfbz: [{ required: true, message: '请输入默认课时费标准', trigger: 'blur' }],
|
||||
mrclksfbz: [{ required: true, message: '请输入默认超量课时费标准', trigger: 'blur' }],
|
||||
xgjxbzksfbz: [{ required: true, message: '请输入相关教学补助课时费标准', trigger: 'blur' }],
|
||||
jxyxbz: [{ required: true, message: '请输入绩效优秀补助', trigger: 'blur' }],
|
||||
jxlhbz: [{ required: true, message: '请输入绩效良好补助', trigger: 'blur' }],
|
||||
jxzdbz: [{ required: true, message: '请输入绩效中等补助', trigger: 'blur' }],
|
||||
jxjgbz: [{ required: true, message: '请输入绩效及格补助', trigger: 'blur' }],
|
||||
jxbjgbz: [{ required: true, message: '请输入绩效不及格补助', trigger: 'blur' }]
|
||||
},
|
||||
coeffRules: {
|
||||
mc: [{ required: true, message: '请输入名称', trigger: 'blur' }]
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
detailVisible: false,
|
||||
detailData: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
currentForm() {
|
||||
return this.activeTab === 'fee' ? this.feeSearch : this.coeffSearch
|
||||
},
|
||||
currentState() {
|
||||
return this.activeTab === 'fee' ? this.feeState : this.coeffState
|
||||
},
|
||||
currentTitle() {
|
||||
return this.activeTab === 'fee' ? '课时费方案' : '课时方案'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
createEmptyState() {
|
||||
return { list: [], loading: false, pageNum: 1, pageSize: 10, total: 0 }
|
||||
},
|
||||
|
||||
createEmptyFeeForm() {
|
||||
return {
|
||||
bh: '',
|
||||
mc: '',
|
||||
mrbzksl: null,
|
||||
mrksfbz: null,
|
||||
mrclksfbz: null,
|
||||
xgjxbzksfbz: null,
|
||||
jxyxbz: null,
|
||||
jxlhbz: null,
|
||||
jxzdbz: null,
|
||||
jxjgbz: null,
|
||||
jxbjgbz: null,
|
||||
sm: '',
|
||||
bz: ''
|
||||
}
|
||||
},
|
||||
|
||||
createEmptyCoeffForm() {
|
||||
return {
|
||||
bh: '',
|
||||
mc: '',
|
||||
zjksxs: null,
|
||||
fjksxs: null,
|
||||
mbxyrs: null,
|
||||
dz10xybjxs: null,
|
||||
bjxssx: null,
|
||||
d78jksl: null,
|
||||
yjksl: null,
|
||||
mrktjxffxs: null,
|
||||
hbxszl: null,
|
||||
hbxssx: null,
|
||||
sm: '',
|
||||
bz: ''
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 查询 ====================
|
||||
fetchList() {
|
||||
const state = this.currentState
|
||||
const params = { pageNum: state.pageNum, pageSize: state.pageSize }
|
||||
if (this.currentForm.mc && this.currentForm.mc.trim()) params.mc = this.currentForm.mc.trim()
|
||||
state.loading = true
|
||||
const req = this.activeTab === 'fee' ? listFeeStandard(params) : listCoefficientPlan(params)
|
||||
req.then(res => {
|
||||
const data = (res && res.data) || {}
|
||||
state.list = data.records || []
|
||||
state.total = data.total || 0
|
||||
}).catch(() => {
|
||||
state.list = []
|
||||
state.total = 0
|
||||
}).finally(() => {
|
||||
state.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleTabClick() {
|
||||
this.currentState.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleQuery() {
|
||||
this.currentState.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(page) {
|
||||
this.currentState.pageNum = page
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.currentState.pageSize = size
|
||||
this.currentState.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
// ==================== 新增 / 修改 ====================
|
||||
handleAdd() {
|
||||
this.feeForm = this.createEmptyFeeForm()
|
||||
this.coeffForm = this.createEmptyCoeffForm()
|
||||
this.dialogTitle = `新增${this.currentTitle}`
|
||||
this.dialogVisible = true
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
const req = this.activeTab === 'fee' ? getFeeStandard(row.bh) : getCoefficientPlan(row.bh)
|
||||
req.then(res => {
|
||||
const d = (res && res.data) || {}
|
||||
if (this.activeTab === 'fee') {
|
||||
this.feeForm = {
|
||||
bh: d.bh || '',
|
||||
mc: d.mc || '',
|
||||
mrbzksl: this.toNull(d.mrbzksl),
|
||||
mrksfbz: this.toNull(d.mrksfbz),
|
||||
mrclksfbz: this.toNull(d.mrclksfbz),
|
||||
xgjxbzksfbz: this.toNull(d.xgjxbzksfbz),
|
||||
jxyxbz: this.toNull(d.jxyxbz),
|
||||
jxlhbz: this.toNull(d.jxlhbz),
|
||||
jxzdbz: this.toNull(d.jxzdbz),
|
||||
jxjgbz: this.toNull(d.jxjgbz),
|
||||
jxbjgbz: this.toNull(d.jxbjgbz),
|
||||
sm: d.sm || '',
|
||||
bz: d.bz || ''
|
||||
}
|
||||
} else {
|
||||
this.coeffForm = {
|
||||
bh: d.bh || '',
|
||||
mc: d.mc || '',
|
||||
zjksxs: this.toNull(d.zjksxs),
|
||||
fjksxs: this.toNull(d.fjksxs),
|
||||
mbxyrs: this.toNull(d.mbxyrs),
|
||||
dz10xybjxs: this.toNull(d.dz10xybjxs),
|
||||
bjxssx: this.toNull(d.bjxssx),
|
||||
d78jksl: this.toNull(d.d78jksl),
|
||||
yjksl: this.toNull(d.yjksl),
|
||||
mrktjxffxs: this.toNull(d.mrktjxffxs),
|
||||
hbxszl: this.toNull(d.hbxszl),
|
||||
hbxssx: this.toNull(d.hbxssx),
|
||||
sm: d.sm || '',
|
||||
bz: d.bz || ''
|
||||
}
|
||||
}
|
||||
this.dialogTitle = `修改${this.currentTitle}`
|
||||
this.dialogVisible = true
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
handleSubmit() {
|
||||
const isFee = this.activeTab === 'fee'
|
||||
const formRef = isFee ? this.$refs.feeFormRef : this.$refs.coeffFormRef
|
||||
formRef.validate(valid => {
|
||||
if (!valid) {
|
||||
this.$message.warning('请完善必填项后再提交')
|
||||
return
|
||||
}
|
||||
const payload = isFee ? this.buildFeePayload() : this.buildCoeffPayload()
|
||||
this.saving = true
|
||||
const req = payload.bh
|
||||
? (isFee ? updateFeeStandard(payload) : updateCoefficientPlan(payload))
|
||||
: (isFee ? addFeeStandard(payload) : addCoefficientPlan(payload))
|
||||
req.then(() => {
|
||||
this.$message.success(this.dialogTitle.indexOf('修改') === 0 ? '修改成功' : '新增成功')
|
||||
this.dialogVisible = false
|
||||
this.fetchList()
|
||||
}).catch(() => {}).finally(() => {
|
||||
this.saving = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
toNull(val) {
|
||||
return val === null || val === undefined ? null : val
|
||||
},
|
||||
|
||||
/** 课时费方案请求体：仅含实体非空字段（创建/修改时间后端自动维护） */
|
||||
buildFeePayload() {
|
||||
const f = this.feeForm
|
||||
const p = {}
|
||||
if (f.bh && f.bh.trim()) p.bh = f.bh.trim()
|
||||
if (f.mc && f.mc.trim()) p.mc = f.mc.trim()
|
||||
;['mrbzksl', 'mrksfbz', 'mrclksfbz', 'xgjxbzksfbz', 'jxyxbz', 'jxlhbz', 'jxzdbz', 'jxjgbz', 'jxbjgbz'].forEach(k => {
|
||||
if (f[k] !== null && f[k] !== undefined) p[k] = f[k]
|
||||
})
|
||||
if (f.sm && f.sm.trim()) p.sm = f.sm.trim()
|
||||
if (f.bz && f.bz.trim()) p.bz = f.bz.trim()
|
||||
return p
|
||||
},
|
||||
|
||||
/** 课时方案请求体：仅含实体非空字段 */
|
||||
buildCoeffPayload() {
|
||||
const f = this.coeffForm
|
||||
const p = {}
|
||||
if (f.bh && f.bh.trim()) p.bh = f.bh.trim()
|
||||
if (f.mc && f.mc.trim()) p.mc = f.mc.trim()
|
||||
;['zjksxs', 'fjksxs', 'mbxyrs', 'dz10xybjxs', 'bjxssx', 'd78jksl', 'yjksl', 'mrktjxffxs', 'hbxszl', 'hbxssx'].forEach(k => {
|
||||
if (f[k] !== null && f[k] !== undefined) p[k] = f[k]
|
||||
})
|
||||
if (f.sm && f.sm.trim()) p.sm = f.sm.trim()
|
||||
if (f.bz && f.bz.trim()) p.bz = f.bz.trim()
|
||||
return p
|
||||
},
|
||||
|
||||
// ==================== 删除（仅课时费方案有删除接口） ====================
|
||||
handleDelete(row) {
|
||||
this.$confirm(`确定要删除「${row.mc || row.bh || '该方案'}」吗？`, '系统提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => deleteFeeStandard(row.bh)).then(() => {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchList()
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
handleDetail(row) {
|
||||
const req = this.activeTab === 'fee' ? getFeeStandard(row.bh) : getCoefficientPlan(row.bh)
|
||||
req.then(res => {
|
||||
this.detailData = (res && res.data) || {}
|
||||
this.detailVisible = true
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
/** 数值空值显示为 '-'（保留 0） */
|
||||
fmtValue(val) {
|
||||
return val === null || val === undefined ? '-' : val
|
||||
},
|
||||
|
||||
/** 空值显示为 '-' */
|
||||
fmtEmpty(val) {
|
||||
return val === null || val === undefined || val === '' ? '-' : val
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.plan-page {
|
||||
.list-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
// ==================== 1. 查询区域 ====================
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.search-form {
|
||||
.el-form-item {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 2. 数据表格 ====================
|
||||
.table-card {
|
||||
.table-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f56c6c;
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 3. 新增/修改表单 ====================
|
||||
.add-form {
|
||||
max-height: 62vh;
|
||||
overflow-y: auto;
|
||||
padding-right: 4px;
|
||||
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<div class="app-container subsidy-page">
|
||||
<div class="list-title">课时补助核算</div>
|
||||
|
||||
<!-- ==================== Tab 切换 ==================== -->
|
||||
<el-tabs v-model="activeTab" @tab-click="handleTabClick">
|
||||
<el-tab-pane label="课时统计" name="hour" />
|
||||
<el-tab-pane label="课时费统计" name="fee" />
|
||||
</el-tabs>
|
||||
|
||||
<!-- ==================== 1. 查询条件 ==================== -->
|
||||
<!-- 课时统计 -->
|
||||
<el-card v-if="activeTab === 'hour'" shadow="never" class="search-card">
|
||||
<el-form :model="hourForm" label-width="100px" class="search-form" @submit.native.prevent>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="学期年度">
|
||||
<el-input v-model="hourForm.nd" placeholder="如 2026" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="学期序号">
|
||||
<el-input v-model="hourForm.xq" placeholder="如 1" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="教员姓名">
|
||||
<el-input v-model="hourForm.jyxm" placeholder="请输入教员姓名" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6" class="search-actions-col">
|
||||
<div class="search-actions">
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
<el-button type="primary" plain @click="handleExport">导出 Excel</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- 课时费统计 -->
|
||||
<el-card v-else shadow="never" class="search-card">
|
||||
<el-form :model="feeForm" label-width="100px" class="search-form" @submit.native.prevent>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="学期年度">
|
||||
<el-input v-model="feeForm.nd" placeholder="如 2026" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="学期序号">
|
||||
<el-input v-model="feeForm.xq" placeholder="如 1" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="教员姓名">
|
||||
<el-input v-model="feeForm.jyxm" placeholder="请输入教员姓名" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-form-item label="标准编号">
|
||||
<el-input v-model="feeForm.ksfbzbh" placeholder="课时费标准编号" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" class="search-actions-col">
|
||||
<div class="search-actions">
|
||||
<el-button type="primary" @click="handleQuery">查询</el-button>
|
||||
<el-button type="primary" plain @click="handleExport">导出 Excel</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
<!-- ==================== 2. 数据表格 ==================== -->
|
||||
<el-card shadow="never" class="table-card">
|
||||
<div class="table-title">{{ activeTab === 'hour' ? '课时统计列表' : '课时费统计列表' }}</div>
|
||||
<el-table v-loading="currentState.loading" :data="currentState.list" border stripe style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="jysdh" label="教研室代号" width="100" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="jysmc" label="教研室名称" width="120" show-overflow-tooltip />
|
||||
<el-table-column prop="jybh" label="教员编号" width="110" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="jyxm" label="教员姓名" width="100" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="zc" label="职称" width="90" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="nf" label="年份" width="70" align="center" />
|
||||
<el-table-column prop="sbn" label="上半年" width="90" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.sbn) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="xbn" label="下半年" width="90" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.xbn) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="zj" label="总计" width="90" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.zj) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="bzksl" label="标准课时量" width="100" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.bzksl) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="cks" label="超课时" width="90" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.cks) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jsgs" label="计算过程" min-width="140" show-overflow-tooltip />
|
||||
<el-table-column prop="jg" label="结果" width="90" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.jg) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="ksfbzmc" label="课时费标准" width="110" align="center" show-overflow-tooltip />
|
||||
<el-table-column prop="ksfbz" label="课时费单价" width="100" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.ksfbz) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="clksfbz" label="超量课时费单价" width="120" align="right" header-align="center">
|
||||
<template slot-scope="{ row }">{{ fmtValue(row.clksfbz) }}</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination
|
||||
:current-page="currentState.pageNum"
|
||||
:page-size="currentState.pageSize"
|
||||
:total="currentState.total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
class="pagination"
|
||||
@current-change="handlePageChange"
|
||||
@size-change="handleSizeChange"
|
||||
/>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { saveAs } from 'file-saver'
|
||||
import {
|
||||
listHourStatistics,
|
||||
exportHourStatistics,
|
||||
listFeeStatistics,
|
||||
exportFeeStatistics
|
||||
} from '@/api/classHour/hourStat'
|
||||
|
||||
export default {
|
||||
name: 'SubsidyIndex',
|
||||
data() {
|
||||
return {
|
||||
// ==================== Tab ====================
|
||||
activeTab: 'hour',
|
||||
|
||||
// ==================== 课时统计查询条件 ====================
|
||||
hourForm: {
|
||||
nd: '',
|
||||
xq: '',
|
||||
jyxm: ''
|
||||
},
|
||||
|
||||
// ==================== 课时费统计查询条件 ====================
|
||||
feeForm: {
|
||||
nd: '',
|
||||
xq: '',
|
||||
jyxm: '',
|
||||
ksfbzbh: ''
|
||||
},
|
||||
|
||||
// ==================== 各 Tab 列表状态 ====================
|
||||
hourState: this.createEmptyState(),
|
||||
feeState: this.createEmptyState()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
currentForm() {
|
||||
return this.activeTab === 'hour' ? this.hourForm : this.feeForm
|
||||
},
|
||||
currentState() {
|
||||
return this.activeTab === 'hour' ? this.hourState : this.feeState
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
createEmptyState() {
|
||||
return { list: [], loading: false, pageNum: 1, pageSize: 20, total: 0 }
|
||||
},
|
||||
|
||||
/** 构建查询参数，仅传非空字段（与后端 Query 字段一致） */
|
||||
buildParams(form) {
|
||||
const params = {}
|
||||
if (form.nd && form.nd.trim()) params.nd = form.nd.trim()
|
||||
if (form.xq && form.xq.trim()) params.xq = form.xq.trim()
|
||||
if (form.jyxm && form.jyxm.trim()) params.jyxm = form.jyxm.trim()
|
||||
if (form.ksfbzbh && form.ksfbzbh.trim()) params.ksfbzbh = form.ksfbzbh.trim()
|
||||
return params
|
||||
},
|
||||
|
||||
// ==================== 查询 ====================
|
||||
fetchList() {
|
||||
const state = this.currentState
|
||||
const form = this.currentForm
|
||||
const params = Object.assign(
|
||||
{ pageNum: state.pageNum, pageSize: state.pageSize },
|
||||
this.buildParams(form)
|
||||
)
|
||||
state.loading = true
|
||||
const req = this.activeTab === 'hour' ? listHourStatistics(params) : listFeeStatistics(params)
|
||||
req.then(res => {
|
||||
const data = (res && res.data) || {}
|
||||
state.list = data.records || []
|
||||
state.total = data.total || 0
|
||||
}).catch(() => {
|
||||
state.list = []
|
||||
state.total = 0
|
||||
}).finally(() => {
|
||||
state.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
handleTabClick() {
|
||||
this.currentState.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleQuery() {
|
||||
this.currentState.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handlePageChange(page) {
|
||||
this.currentState.pageNum = page
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
handleSizeChange(size) {
|
||||
this.currentState.pageSize = size
|
||||
this.currentState.pageNum = 1
|
||||
this.fetchList()
|
||||
},
|
||||
|
||||
// ==================== 导出 ====================
|
||||
handleExport() {
|
||||
const clean = this.buildParams(this.currentForm)
|
||||
const isHour = this.activeTab === 'hour'
|
||||
const req = isHour ? exportHourStatistics(clean) : exportFeeStatistics(clean)
|
||||
const fileName = isHour ? '课时统计.xlsx' : '课时费统计.xlsx'
|
||||
req.then(blob => {
|
||||
saveAs(blob, fileName)
|
||||
this.$message.success('导出成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
/** 数值空值显示为 '-'（保留 0） */
|
||||
fmtValue(val) {
|
||||
return val === null || val === undefined ? '-' : val
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.subsidy-page {
|
||||
.list-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
// ==================== 1. 查询条件区域 ====================
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.search-form {
|
||||
.search-actions-col {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.search-actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 2. 数据表格 ====================
|
||||
.table-card {
|
||||
.table-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user