xgxt_sd/zhxg_pc
16
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

退伍复习修改

Browse Source
This commit is contained in:
韦东恒
2025-11-12 11:05:17 +08:00
parent eee7b48ad1
commit a733cf303d
5 changed files with 844 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

691
src/views/routine/dis/formData.vue Normal file
View File

@@ -0,0 +1,691 @@
<template>
<div class="application-form-container">
<h2 class="form-title">广西水利电力职业技术学院</h2>
<h3 class="form-subtitle">退役复学申请表</h3>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<table class="application-table">
<!-- 基本信息行1 -->
<tr>
<td class="label">姓名</td>
<td class="input-cell">
<el-form-item prop="stName" class="form-item-custom">
<el-input v-model="form.stName" placeholder="请输入姓名" class="basic-input"></el-input>
</el-form-item>
</td>
<td class="label">性别</td>
<td class="input-cell">
<el-form-item prop="gender" class="form-item-custom">
<el-select v-model="form.gender" placeholder="请选择性别" class="basic-input">
<el-option label="男" value="0"></el-option>
<el-option label="女" value="1"></el-option>
</el-select>
</el-form-item>
</td>
<td class="label">民族</td>
<td class="input-cell">
<el-form-item prop="nations" class="form-item-custom">
<el-input v-model="form.nations" placeholder="请输入民族" class="basic-input"></el-input>
</el-form-item>
</td>
<td class="label">班级</td>
<td class="input-cell" colspan="2">
<el-form-item prop="stClass" class="form-item-custom">
<el-input v-model="form.stClass" placeholder="请输入年级" class="basic-input"></el-input>
</el-form-item>
</td>
</tr>
<!-- 专业、学号、班级行 -->
<tr>
<td class="label">学号</td>
<td class="input-cell">
<el-form-item prop="stId" class="form-item-custom">
<el-input v-model="form.stId" placeholder="请输入学号" class="basic-input" type="textarea" :rows="3"></el-input>
</el-form-item>
</td>
<td class="label" rowspan="2">专业<br />名称</td>
<td class="input-cell" colspan="3" rowspan="2">
<el-form-item prop="majors" class="form-item-custom">
<el-input v-model="form.majors" placeholder="请输入专业名称" class="major-input" type="textarea" :rows="3"></el-input>
</el-form-item>
</td>
<td class="label">联系电话</td>
<td class="input-cell" colspan="2">
<el-form-item prop="datab" class="form-item-custom">
<el-input v-model="form.datab" placeholder="请输入电话" class="basic-input" type="textarea" :rows="3"></el-input>
</el-form-item>
</td>
</tr>
<tr></tr>
<tr>
<td class="label" rowspan="4">申请<br />理由</td>
<td class="input-cell" colspan="8" rowspan="4">
<p class="reason-text">本人于
<el-form-item prop="rwTime" class="form-item-custom inline-item">
<el-date-picker v-model="form.rwTime" type="date" placeholder="选择日期" format="yyyy-MM-dd"
value-format="yyyy-MM-dd" class="date-picker"></el-date-picker>
</el-form-item>
应征入伍，于
<el-form-item prop="dataa" class="form-item-custom inline-item">
<el-date-picker v-model="form.dataa" type="date" placeholder="选择日期" format="yyyy-MM-dd"
value-format="yyyy-MM-dd" class="date-picker"></el-date-picker>
</el-form-item> 日退役，退役后申请复学。
</p>
<p class="reason-text" style="">是否申请转专业：（）是 （）否
</p>
<p class="reason-text" style="color: red;">原年级和专业_____________________________
申请转入年级和专业：_____________________________
</p>
<p class="attachment-tip">（设上传入伍通知书等佐证材料区域）</p>
<div class="applicant-info right-align">
<span>申请人：</span>
<el-input v-model="form.stName" readonly class="applicant-input"></el-input>
<span class="date-label">日期：</span>
<el-form-item prop="times" class="form-item-custom inline-item">
<el-date-picker v-model="form.times" type="date" placeholder="选择日期" format="yyyy-MM-dd"
value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</el-form-item>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
<!-- 招生意见行 -->
<tr>
<td class="label" rowspan="4">招生与<br />就业处<br />意见</td>
<td class="input-cell" colspan="8" rowspan="4">
<p class="reason-text" style="color: red;">符合转专业条件，拟同意转入年级和专业：
</p>
<div class="signature-area right-align">
<span>审批结果：</span>
<el-select v-model="form.status" placeholder="请选择" class="short-select">
<el-option label="通过" value="1"></el-option>
<el-option label="驳回" value="2"></el-option>
</el-select>
<span class="date-label">签名：</span>
<el-input v-model="form.idea" placeholder="请输入姓名" class="signature-input"></el-input>
<span class="date-label">日期：</span>
<el-date-picker v-model="form.time" type="date" placeholder="选择日期"
format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
<!-- 辅导员意见行 -->
<tr>
<td class="label" rowspan="4">辅导员<br />意见</td>
<td class="input-cell" colspan="8" rowspan="4">
<el-input v-model="form.fdIdea" type="textarea" :rows="3" placeholder="请填写辅导员意见..."
class="opinion-textarea"></el-input>
<div class="signature-area right-align">
<span>审批结果：</span>
<el-select v-model="form.fdStatus" placeholder="请选择" class="short-select">
<el-option label="通过" value="1"></el-option>
<el-option label="驳回" value="2"></el-option>
</el-select>
<span class="date-label">签名：</span>
<el-input v-model="form.fdQm" placeholder="请输入姓名" class="signature-input"></el-input>
<span class="date-label">日期：</span>
<el-date-picker v-model="form.fdTime" type="date" placeholder="选择日期"
format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
<!-- 学务意见行 -->
<tr>
<td class="label" rowspan="4">学务<br />意见</td>
<td class="input-cell" colspan="8" rowspan="4">
<p>拟编入</p>
<div class="signature-area right-align">
<span>审批结果：</span>
<el-select v-model="form.xwStatus" placeholder="请选择" class="short-select">
<el-option label="通过" value="1"></el-option>
<el-option label="驳回" value="2"></el-option>
</el-select>
<span class="date-label">签名：</span>
<el-input v-model="form.xwQm" placeholder="请输入姓名" class="signature-input"></el-input>
<span class="date-label">日期：</span>
<el-date-picker v-model="form.xwTime" type="date" placeholder="选择日期"
format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
<!-- 二级意见行 -->
<tr>
<td class="label" rowspan="4">二级学<br />院意见</td>
<td class="input-cell" colspan="8" rowspan="4">
<el-input v-model="form.twoIdea" type="textarea" :rows="3" placeholder="请填写意见..."
class="opinion-textarea"></el-input>
<div class="signature-area right-align">
<span>审批结果：</span>
<el-select v-model="form.twoStatus" placeholder="请选择" class="short-select">
<el-option label="通过" value="1"></el-option>
<el-option label="驳回" value="2"></el-option>
</el-select>
<span class="date-label">签名：</span>
<el-input v-model="form.erQm" placeholder="请输入姓名" class="signature-input"></el-input>
<span class="date-label">日期：</span>
<el-date-picker v-model="form.twoTime" type="date" placeholder="选择日期"
format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
<!-- 学籍管理科意见行 -->
<tr>
<td class="label" rowspan="4">学籍管<br />理科意见</td>
<td class="input-cell" colspan="8" rowspan="4">
<el-input v-model="form.xjIdea" type="textarea" :rows="3" placeholder="请填写意见..."
class="opinion-textarea"></el-input>
<div class="signature-area right-align">
<span>审批结果：</span>
<el-select v-model="form.xjglStatus" placeholder="请选择" class="short-select">
<el-option label="通过" value="1"></el-option>
<el-option label="驳回" value="2"></el-option>
</el-select>
<span class="date-label">签名：</span>
<el-input v-model="form.xjQm" placeholder="请输入姓名" class="signature-input"></el-input>
<span class="date-label">日期：</span>
<el-date-picker v-model="form.xjTime" type="date" placeholder="选择日期"
format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
<!-- 教务处主意见行 -->
<tr>
<td class="label" rowspan="4">教务处<br />主管领导意见</td>
<td class="input-cell" colspan="8" rowspan="4">
<el-input v-model="form.jwIdea" type="textarea" :rows="3" placeholder="请填写意见..."
class="opinion-textarea"></el-input>
<div class="signature-area right-align">
<span>审批结果：</span>
<el-select v-model="form.jwStatus" placeholder="请选择" class="short-select">
<el-option label="通过" value="1"></el-option>
<el-option label="驳回" value="2"></el-option>
</el-select>
<span class="date-label">签名：</span>
<el-input v-model="form.jwQm" placeholder="请输入姓名" class="signature-input"></el-input>
<span class="date-label">日期：</span>
<el-date-picker v-model="form.jwTime" type="date" placeholder="选择日期"
format="yyyy-MM-dd" value-format="yyyy-MM-dd" class="date-picker full-date"></el-date-picker>
</div>
</td>
</tr>
<tr></tr>
<tr></tr>
<tr></tr>
</table>
<!-- 说明信息 -->
<div class="form-description">
<p>说明：1.本表应附学生入伍证明材料复印件；</p>
<p>2.本表一式两份，二级学院和教务处各留存一份。</p>
</div>
<!-- 操作按钮 -->
<div class="form-btn-group">
<el-button type="primary" @click="submitForm">提交审核</el-button>
<!-- <el-button @click="resetForm">重置表单</el-button> -->
<!-- <el-button type="text" @click="printForm">打印表单</el-button> -->
</div>
</el-form>
</div>
</template>
<script>
import { listBasic, getBasic, delBasic, addBasic, updateBasic } from "@/api/routine/basic";
export default {
name: "Basic",
dicts: ['sys_user_sex'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 退伍复学申请表格数据
basicList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
fxId: null,
fxTime: null,
stId: null,
stName: null,
fdName: null,
sex: null,
nations: null,
fdQm: null,
xwQm: null,
erQm: null,
xjQm: null,
jwQm: null,
stClass: null,
majors: null,
grade: null,
college: null,
reasons: null,
fdIdea: null,
twoIdea: null,
xwIdea: null,
xjIdea: null,
jwIdea: null,
zsIdea: null,
zsStatus: null,
times: null,
fdStatus: null,
xwStatus: null,
twoStatus: null,
xjglStatus: null,
jwStatus: null,
rwTime: null,
zsTime: null,
fdTime: null,
xwTime: null,
twoTime: null,
xjTime: null,
jwTime: null,
datab: null,
dataa: null,
conversion: null,
processId: null,
deployId: null
},
// 表单参数
form: {},
// 表单校验
rules: {
}
};
},
created() {
this.getList();
this.showData()
},
methods: {
showData() {
if (this.$route.query.id != undefined) {
console.log(this.$route.query.id)
getBasic(this.$route.query.id).then((response) => {
this.form = response.data
// this.active = response.data.status + 1;
})
}
},
/** 查询退伍复学申请列表 */
getList() {
this.loading = true;
listBasic(this.queryParams).then(response => {
this.basicList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
fxId: null,
fxTime: null,
stId: null,
stName: null,
fdName: null,
sex: null,
nations: null,
fdQm: null,
xwQm: null,
erQm: null,
xjQm: null,
jwQm: null,
stClass: null,
majors: null,
grade: null,
college: null,
reasons: null,
fdIdea: null,
twoIdea: null,
xwIdea: null,
xjIdea: null,
jwIdea: null,
zsIdea: null,
zsStatus: null,
times: null,
fdStatus: null,
xwStatus: null,
twoStatus: null,
xjglStatus: null,
jwStatus: null,
rwTime: null,
zsTime: null,
fdTime: null,
xwTime: null,
twoTime: null,
xjTime: null,
jwTime: null,
datab: null,
dataa: null,
conversion: null,
processId: null,
deployId: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加退伍复学申请";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getBasic(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改退伍复学申请";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateBasic(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addBasic(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除退伍复学申请编号为"' + ids + '"的数据项？').then(function() {
return delBasic(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download('routine/basic/export', {
...this.queryParams
}, `basic_${new Date().getTime()}.xlsx`)
}
}
};
</script>
<style scoped>
.application-form-container {
width: 100%;
padding: 30px;
box-sizing: border-box;
font-family: "Source Han Sans CN", "PingFang SC", "Microsoft YaHei", sans-serif;
}
.form-title {
text-align: center;
font-size: 20px;
font-weight: 700;
color: #222;
margin: 0 0 12px 0;
}
.form-subtitle {
text-align: center;
font-size: 18px;
font-weight: 600;
color: #222;
margin: 0 0 25px 0;
}
.application-table {
width: 100%;
border-collapse: separate;
/* 关键：使用separate替代collapse */
border-spacing: 0;
/* 消除单元格间距 */
border: 1.5px solid #000;
background-color: #fff;
position: relative;
z-index: 1;
}
.application-table td {
border: 1px solid #000;
padding: 8px;
vertical-align: top;
position: relative;
/* 关键：为子元素提供定位上下文 */
}
.label {
width: 80px;
text-align: center;
background-color: #f5f5f5;
font-weight: 600;
line-height: 1.6;
vertical-align: middle !important;
}
.input-cell {
min-height: 36px;
padding-top: 20px !important;
padding-bottom: 25px !important;
/* 关键：预留验证提示空间 */
}
/* 解决验证提示遮挡核心样式 */
.form-item-custom {
position: relative;
margin-bottom: 0 !important;
}
.el-form-item__error {
position: absolute !important;
left: 0 !important;
bottom: -22px !important;
/* 显示在单元格内预留空间 */
background: #f56c6c !important;
color: #fff !important;
padding: 2px 6px !important;
border-radius: 2px !important;
z-index: 10 !important;
white-space: nowrap !important;
font-size: 12px !important;
box-shadow: none !important;
}
.inline-item {
display: inline-block !important;
}
/* 输入控件样式 */
.basic-input {
width: 100%;
}
.major-input,
.address-input {
width: 100%;
min-height: 72px;
}
.opinion-textarea {
width: 100%;
min-height: 80px;
resize: none;
}
.date-picker {
width: 150px;
margin: 0 6px;
}
.date-picker.full-date {
width: 180px;
}
.applicant-input,
.signature-input {
width: 200px;
margin: 0 6px;
display: inline-block;
}
.short-select {
width: 120px;
margin: 0 10px;
display: inline-block;
}
/* 文本样式 */
.reason-text {
margin: 10px 0;
line-height: 2;
font-size: 14px;
}
.attachment-tip {
margin: 10px 0;
color: #666;
font-size: 13px;
}
.right-align {
text-align: right;
margin-top: 15px;
line-height: 2.2;
}
.date-label {
margin-left: 20px;
}
/* 按钮样式 */
.form-btn-group {
margin-top: 30px;
text-align: center;
}
.form-btn-group .el-button {
margin: 0 10px;
}
.form-description {
margin-top: 20px;
font-size: 13px;
line-height: 2;
padding-left: 10px;
}
/* 打印样式 */
@media print {
.form-btn-group {
display: none;
}
.el-input,
.el-select,
.el-textarea {
border: 1px solid #000 !important;
background: transparent !important;
}
.label {
background-color: #eee !important;
-webkit-print-color-adjust: exact;
}
.el-form-item__error {
display: none !important;
}
.input-cell {
padding-bottom: 8px !important;
}
}
</style>