Merge branch 'main' of https://gitea.fengyingkj.top/zhaichao/education
This commit is contained in:
@@ -0,0 +1,498 @@
|
||||
<template>
|
||||
<div class="app-container student-info-page">
|
||||
<!-- ==================== 1. 查询条件区域 ==================== -->
|
||||
<el-card shadow="never" class="search-card">
|
||||
<el-form :model="searchForm" label-width="110px" class="search-form">
|
||||
<el-row :gutter="24">
|
||||
<!-- 左栏 -->
|
||||
<el-col :xs="24" :md="12">
|
||||
<el-form-item label="学号">
|
||||
<el-input v-model="searchForm.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-input v-model="searchForm.zzmm" placeholder="请输入政治面貌" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="民族">
|
||||
<el-input v-model="searchForm.mz" placeholder="请输入民族" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="籍贯">
|
||||
<el-input v-model="searchForm.jg" placeholder="请输入籍贯" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="学位">
|
||||
<el-input v-model="searchForm.xw" placeholder="请输入学位" clearable />
|
||||
</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-input v-model="searchForm.whcd" placeholder="请输入文化程度" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="本科毕业院校">
|
||||
<el-input v-model="searchForm.bkbyyx" placeholder="请输入本科毕业院校" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签">
|
||||
<el-input v-model="searchForm.bq" placeholder="请输入标签" clearable />
|
||||
</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 type="primary" icon="el-icon-plus" @click="handleAdd">新增学员</el-button>
|
||||
</div>
|
||||
<el-table v-loading="loading" :data="tableData" stripe border>
|
||||
<el-table-column type="index" label="序号" width="55" align="center" />
|
||||
<el-table-column prop="xh" label="学号" width="55" show-overflow-tooltip />
|
||||
<el-table-column prop="xm" label="姓名" width="55" />
|
||||
<el-table-column prop="xb" label="性别" width="55" align="center" />
|
||||
<el-table-column prop="nj" label="年级" width="55" align="center" />
|
||||
<el-table-column prop="zy" label="专业" width="55" show-overflow-tooltip />
|
||||
<el-table-column prop="db" label="队别" width="55" align="center" />
|
||||
<el-table-column prop="bc" label="班次" width="55" align="center" />
|
||||
<el-table-column prop="pxlx" label="培训类型" width="85" show-overflow-tooltip />
|
||||
<el-table-column prop="pxcc" label="培训层次" width="85" align="center" />
|
||||
<el-table-column prop="zzmm" label="政治面貌" width="85" align="center" />
|
||||
<el-table-column prop="mz" label="民族" width="55" align="center" />
|
||||
<el-table-column prop="jg" label="籍贯" width="55" align="center" />
|
||||
<el-table-column prop="xw" label="学位" width="55" align="center" />
|
||||
<el-table-column prop="zczt" label="注册状态" width="85" align="center" />
|
||||
<el-table-column prop="xjyd" label="学籍异动状态" width="110" align="center" />
|
||||
<el-table-column prop="ksqk" label="考试情况" width="85" align="center" />
|
||||
<el-table-column prop="bjgm" label="不及格门数" width="110" align="center" />
|
||||
<el-table-column prop="gljg" label="管理机构" width="85" align="center" />
|
||||
<el-table-column label="操作" align="center" fixed="right">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" class="text-primary" @click="handleEdit(row)">编辑</el-button>
|
||||
<el-button type="text" class="text-success" @click="handleGrades(row)">成绩</el-button>
|
||||
<el-button type="text" class="danger-text" @click="handleDelete(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination">
|
||||
<el-pagination
|
||||
:current-page="pagination.pageNum"
|
||||
:page-size="pagination.pageSize"
|
||||
:total="pagination.total"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
background
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handlePageChange"
|
||||
/>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<!-- 新增/编辑弹窗 -->
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
:title="dialogTitle"
|
||||
width="780px"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => dialogVisible = val"
|
||||
>
|
||||
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="编号" prop="bh"><el-input v-model="formData.bh" placeholder="请输入编号" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="学号" prop="xh"><el-input v-model="formData.xh" placeholder="请输入学号" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="姓名" prop="xm"><el-input v-model="formData.xm" placeholder="请输入姓名" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="性别" prop="xb"><el-select v-model="formData.xb" placeholder="请选择" class="full-width"><el-option label="男" value="1" /><el-option label="女" value="0" /></el-select></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="出生日期" prop="csrq"><el-date-picker v-model="formData.csrq" type="date" placeholder="请选择" value-format="yyyy-MM-dd" class="full-width" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="民族" prop="mz"><el-input v-model="formData.mz" placeholder="请输入民族" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="籍贯" prop="jg"><el-input v-model="formData.jg" placeholder="请输入籍贯" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="政治面貌" prop="zzmm"><el-input v-model="formData.zzmm" placeholder="请输入政治面貌" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="文化程度" prop="whcd"><el-input v-model="formData.whcd" placeholder="请输入文化程度" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="学员类别" prop="xylb"><el-input v-model="formData.xylb" placeholder="请输入学员类别" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="学员队期编号" prop="xydqbh"><el-input v-model="formData.xydqbh" placeholder="请输入学员队期编号" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="证件号码" prop="zjhm"><el-input v-model="formData.zjhm" placeholder="请输入证件号码" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="所属军区" prop="ssjq"><el-input v-model="formData.ssjq" placeholder="请输入所属军区" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="当前班次编号" prop="dqbzbh"><el-input v-model="formData.dqbzbh" placeholder="请输入当前班次编号" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="军人证件类型" prop="jrzjlx"><el-input v-model="formData.jrzjlx" placeholder="请输入军人证件类型" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="退学状态" prop="txzt"><el-input v-model="formData.txzt" placeholder="请输入退学状态" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8"><el-form-item label="国防生" prop="gfs"><el-select v-model="formData.gfs" placeholder="请选择" class="full-width"><el-option label="是" value="1" /><el-option label="否" value="0" /></el-select></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="留级状态" prop="ljzt"><el-input v-model="formData.ljzt" placeholder="请输入" /></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="分班状态" prop="fbzt"><el-input v-model="formData.fbzt" placeholder="请输入" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8"><el-form-item label="允许查看成绩" prop="yxckcj"><el-select v-model="formData.yxckcj" placeholder="请选择" class="full-width"><el-option label="是" value="1" /><el-option label="否" value="0" /></el-select></el-form-item></el-col>
|
||||
<el-col :span="8"><el-form-item label="已注册" prop="yzc"><el-select v-model="formData.yzc" placeholder="请选择" class="full-width"><el-option label="是" value="1" /><el-option label="否" value="0" /></el-select></el-form-item></el-col>
|
||||
<el-col :span="8" />
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="联系电话" prop="lxdh"><el-input v-model="formData.lxdh" placeholder="请输入联系电话" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="通讯地址" prop="txdz"><el-input v-model="formData.txdz" placeholder="请输入通讯地址" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24"><el-form-item label="备注" prop="bz"><el-input v-model="formData.bz" type="textarea" :rows="2" placeholder="请输入备注" /></el-form-item></el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" :loading="submitting" @click="handleSubmit">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 成绩弹窗 -->
|
||||
<el-dialog
|
||||
:visible="gradesVisible"
|
||||
title="学员成绩"
|
||||
width="600px"
|
||||
:close-on-click-modal="false"
|
||||
@update:visible="val => gradesVisible = val"
|
||||
>
|
||||
<p><strong>学员：</strong>{{ gradesStudent }}</p>
|
||||
<el-tabs v-model="gradesTab">
|
||||
<el-tab-pane label="成绩" name="grades">
|
||||
<div v-loading="gradesLoading">
|
||||
<pre v-if="gradesData">{{ gradesData }}</pre>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="进程成绩" name="process">
|
||||
<div v-loading="gradesLoading">
|
||||
<pre v-if="processGradesData">{{ processGradesData }}</pre>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div slot="footer">
|
||||
<el-button type="primary" @click="handleExportGrades">导出成绩</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listStudentRecord,
|
||||
getStudentRecord,
|
||||
addStudentRecord,
|
||||
updateStudentRecord,
|
||||
delStudentRecord
|
||||
} from "@/api/studentRecords/studentRecords"
|
||||
|
||||
export default {
|
||||
name: 'StudentInfoIndex',
|
||||
data() {
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
// 仅保留后端 XYXX 实体支持的字段：/student-records/list 会按实体字段动态构建查询条件
|
||||
searchForm: {
|
||||
xh: '', xm: '', xb: '', zjhm: '', zzmm: '', mz: '', jg: '', xw: '',
|
||||
ybzb: '', sfzh: '', whcd: '', bkbyyx: '', bq: '', lxdh: '', txdz: ''
|
||||
},
|
||||
|
||||
// ==================== 数据表格 ====================
|
||||
loading: false,
|
||||
tableData: [],
|
||||
pagination: { pageNum: 1, pageSize: 20, total: 0 },
|
||||
|
||||
// ==================== 新增/编辑弹窗 ====================
|
||||
dialogVisible: false,
|
||||
dialogTitle: '新增学员',
|
||||
submitting: false,
|
||||
formData: this.createEmptyForm(),
|
||||
formRules: {
|
||||
bh: [{ required: true, message: '请输入编号', trigger: 'blur' }],
|
||||
xh: [{ required: true, message: '请输入学号', trigger: 'blur' }],
|
||||
xm: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
|
||||
xydqbh: [{ required: true, message: '请输入学员队期编号', trigger: 'blur' }],
|
||||
zjhm: [{ required: true, message: '请输入证件号码', trigger: 'blur' }],
|
||||
zzmm: [{ required: true, message: '请输入政治面貌', trigger: 'blur' }],
|
||||
xb: [{ required: true, message: '请选择性别', trigger: 'change' }],
|
||||
csrq: [{ required: true, message: '请选择出生日期', trigger: 'change' }],
|
||||
mz: [{ required: true, message: '请输入民族', trigger: 'blur' }],
|
||||
jg: [{ required: true, message: '请输入籍贯', trigger: 'blur' }],
|
||||
whcd: [{ required: true, message: '请输入文化程度', trigger: 'blur' }],
|
||||
xylb: [{ required: true, message: '请输入学员类别', trigger: 'blur' }],
|
||||
ssjq: [{ required: true, message: '请输入所属军区', trigger: 'blur' }],
|
||||
gfs: [{ required: true, message: '请选择国防生', trigger: 'change' }],
|
||||
txzt: [{ required: true, message: '请输入退学状态', trigger: 'blur' }],
|
||||
ljzt: [{ required: true, message: '请输入留级状态', trigger: 'blur' }],
|
||||
fbzt: [{ required: true, message: '请输入分班状态', trigger: 'blur' }],
|
||||
yxckcj: [{ required: true, message: '请选择允许查看成绩', trigger: 'change' }],
|
||||
dqbzbh: [{ required: true, message: '请输入当前班次编号', trigger: 'blur' }],
|
||||
yzc: [{ required: true, message: '请选择已注册', trigger: 'change' }],
|
||||
jrzjlx: [{ required: true, message: '请输入军人证件类型', trigger: 'blur' }]
|
||||
},
|
||||
|
||||
// ==================== 成绩弹窗 ====================
|
||||
gradesVisible: false,
|
||||
gradesTab: 'grades',
|
||||
gradesData: null,
|
||||
processGradesData: null,
|
||||
gradesStudent: '',
|
||||
currentBh: '',
|
||||
gradesLoading: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
/** 创建空白表单 */
|
||||
createEmptyForm() {
|
||||
return {
|
||||
bh: '', xh: '', xm: '', xydqbh: '', zjhm: '', zzmm: '', xb: '', csrq: '', mz: '', jg: '',
|
||||
whcd: '', xylb: '', ssjq: '', gfs: '', txzt: '', ljzt: '', fbzt: '', yxckcj: '', dqbzbh: '', yzc: '',
|
||||
jrzjlx: '', sfzh: '', lxdh: '', txdz: '', bz: '', dtsj: ''
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 列表加载 ====================
|
||||
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.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', 'bq', '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 }
|
||||
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(() => {})
|
||||
},
|
||||
|
||||
// ==================== 成绩弹窗 ====================
|
||||
// TODO: 后端接口未提供，成绩数据为前端模拟；接口就绪后替换为 getStudentGrades / getStudentProcessGrades
|
||||
handleGrades(row) {
|
||||
this.gradesStudent = row.xm || ''
|
||||
this.currentBh = row.bh || ''
|
||||
this.gradesData = null
|
||||
this.processGradesData = null
|
||||
this.gradesTab = 'grades'
|
||||
this.gradesVisible = true
|
||||
this.gradesLoading = true
|
||||
setTimeout(() => {
|
||||
this.gradesData = { 学员: row.xm, 学号: row.xh, 课程: '通信原理', 成绩: 92, 学分: 3.0 }
|
||||
this.processGradesData = { 进程成绩: [{ 名称: '平时成绩', 得分: 95 }, { 名称: '期末成绩', 得分: 88 }] }
|
||||
this.gradesLoading = false
|
||||
}, 300)
|
||||
},
|
||||
|
||||
// TODO: 后端接口未提供，导出为前端模拟；接口就绪后替换为 exportStudentGrades
|
||||
handleExportGrades() {
|
||||
this.$message.success(`已导出学员${this.gradesStudent}成绩（前端模拟）`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.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%;
|
||||
}
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: #409eff;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: #67c23a;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.danger-text {
|
||||
color: #f56c6c;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,541 @@
|
||||
<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-input v-model="searchForm.pxlx" 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.pxcc" 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-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-input v-model="form.pxlx" placeholder="请输入培训类型" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="培训层次" prop="pxcc">
|
||||
<el-input v-model="form.pxcc" placeholder="请输入培训层次" />
|
||||
</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-switch v-model="form.ty" :active-value="1" :inactive-value="0" active-text="是" inactive-text="否" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="修改时间" prop="xgsj">
|
||||
<el-date-picker v-model="form.xgsj" type="datetime" placeholder="请选择修改时间" value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%" />
|
||||
</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"
|
||||
|
||||
export default {
|
||||
name: "WarningCondition",
|
||||
data() {
|
||||
return {
|
||||
// ==================== 查询条件 ====================
|
||||
searchForm: {
|
||||
mc: '',
|
||||
pxlx: '',
|
||||
pxcc: '',
|
||||
ty: 0
|
||||
},
|
||||
|
||||
// ==================== 列表数据 ====================
|
||||
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" }],
|
||||
xgsj: [{ required: true, message: "修改时间不能为空", trigger: "change" }]
|
||||
},
|
||||
|
||||
// ==================== 详情 ====================
|
||||
viewDialogVisible: false,
|
||||
viewLoading: false,
|
||||
viewForm: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchList()
|
||||
},
|
||||
methods: {
|
||||
/** 创建空表单 */
|
||||
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: '',
|
||||
xgsj: ''
|
||||
}
|
||||
},
|
||||
|
||||
// ==================== 查询列表 ====================
|
||||
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', 'xgsj'
|
||||
]
|
||||
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>
|
||||
Reference in New Issue
Block a user