应征入伍保留学籍申请表
This commit is contained in:
664
src/views/routine/enlistmentReserve/applicationForm.vue
Normal file
664
src/views/routine/enlistmentReserve/applicationForm.vue
Normal file
@@ -0,0 +1,664 @@
|
||||
<template>
|
||||
<div class="application-form-container">
|
||||
<h2 class="form-title">广西水利电力职业技术学院</h2>
|
||||
<h3 class="form-subtitle">应征入伍保留学籍申请表</h3>
|
||||
|
||||
<el-form :model="formData" :rules="formRules" ref="formRef" class="form-wrapper">
|
||||
<table class="application-table">
|
||||
<!-- 基本信息行1 -->
|
||||
<tr>
|
||||
<td class="label">姓名</td>
|
||||
<td class="input-cell">
|
||||
<el-form-item prop="studentName" class="form-item-custom">
|
||||
<el-input v-model="formData.studentName" 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="formData.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="nation" class="form-item-custom">
|
||||
<el-input v-model="formData.nation" placeholder="请输入民族" class="basic-input"></el-input>
|
||||
</el-form-item>
|
||||
</td>
|
||||
<td class="label">年级</td>
|
||||
<td class="input-cell" colspan="2">
|
||||
<el-form-item prop="grade" class="form-item-custom">
|
||||
<el-input v-model="formData.grade" placeholder="请输入年级" class="basic-input"></el-input>
|
||||
</el-form-item>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- 专业、学号、班级行 -->
|
||||
<tr>
|
||||
<td class="label" rowspan="2">专业<br />名称</td>
|
||||
<td class="input-cell" colspan="3" rowspan="2">
|
||||
<el-form-item prop="major" class="form-item-custom">
|
||||
<el-input v-model="formData.major" placeholder="请输入专业名称" class="major-input" type="textarea" :rows="3"></el-input>
|
||||
</el-form-item>
|
||||
</td>
|
||||
<td class="label">学号</td>
|
||||
<td class="input-cell">
|
||||
<el-form-item prop="studentNo" class="form-item-custom">
|
||||
<el-input v-model="formData.studentNo" placeholder="请输入学号" class="basic-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="className" class="form-item-custom">
|
||||
<el-input v-model="formData.className" placeholder="请输入班级" class="basic-input" type="textarea" :rows="3"></el-input>
|
||||
</el-form-item>
|
||||
</td>
|
||||
</tr>
|
||||
<tr></tr>
|
||||
|
||||
<!-- 家庭地址、家长联系电话行 -->
|
||||
<tr>
|
||||
<td class="label" rowspan="2">家庭<br />地址</td>
|
||||
<td class="input-cell" colspan="5" rowspan="2">
|
||||
<el-form-item prop="familyAddress" class="form-item-custom">
|
||||
<el-input v-model="formData.familyAddress" placeholder="请输入家庭地址" class="address-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="parentPhone" class="form-item-custom">
|
||||
<el-input v-model="formData.parentPhone" placeholder="请输入家长联系电话" type="tel"
|
||||
class="basic-input"></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">
|
||||
<el-form-item prop="applyReason" class="form-item-custom">
|
||||
<el-input v-model="formData.applyReason" type="textarea" :rows="3" placeholder="请填写申请理由..."
|
||||
class="opinion-textarea"></el-input>
|
||||
</el-form-item>
|
||||
<p class="reason-text">本人应征入伍,申请保留学籍从
|
||||
<el-form-item prop="reserveStartDate" class="form-item-custom inline-item">
|
||||
<el-date-picker v-model="formData.reserveStartDate" type="date" placeholder="选择日期" format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd" class="date-picker"></el-date-picker>
|
||||
</el-form-item> 日至退役后两年。
|
||||
</p>
|
||||
<p class="attachment-tip">(设上传入伍通知书等佐证材料区域)</p>
|
||||
<div class="applicant-info right-align">
|
||||
<span>申请人:</span>
|
||||
<el-input v-model="formData.studentName" readonly class="applicant-input"></el-input>
|
||||
<span class="date-label">日期:</span>
|
||||
<el-form-item prop="createTime" class="form-item-custom inline-item">
|
||||
<el-date-picker v-model="formData.createTime" 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 />意见</td>
|
||||
<td class="input-cell" colspan="8" rowspan="4">
|
||||
<el-input v-model="counselorApproval.approvalOpinion" type="textarea" :rows="3" placeholder="请填写辅导员意见..."
|
||||
class="opinion-textarea"></el-input>
|
||||
<div class="signature-area right-align">
|
||||
<span>审批结果:</span>
|
||||
<el-select v-model="counselorApproval.approvalResult" 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="counselorApproval.approverName" placeholder="请输入姓名" class="signature-input"></el-input>
|
||||
<span class="date-label">日期:</span>
|
||||
<el-date-picker v-model="counselorApproval.approvalTime" 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="academicApproval.approvalOpinion" type="textarea" :rows="3" placeholder="请填写学务意见..."
|
||||
class="opinion-textarea"></el-input>
|
||||
<div class="signature-area right-align">
|
||||
<span>审批结果:</span>
|
||||
<el-select v-model="academicApproval.approvalResult" 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="academicApproval.approverName" placeholder="请输入姓名" class="signature-input"></el-input>
|
||||
<span class="date-label">日期:</span>
|
||||
<el-date-picker v-model="academicApproval.approvalTime" 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">二级学院意见</td>
|
||||
<td class="input-cell" colspan="8" rowspan="4">
|
||||
<el-input v-model="collegeApproval.approvalOpinion" type="textarea" :rows="3" placeholder="请填写二级学院意见..."
|
||||
class="opinion-textarea"></el-input>
|
||||
<div class="signature-area right-align">
|
||||
<span>审批结果:</span>
|
||||
<el-select v-model="collegeApproval.approvalResult" 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="collegeApproval.approverName" placeholder="请输入姓名" class="signature-input"></el-input>
|
||||
<span class="date-label">日期:</span>
|
||||
<el-date-picker v-model="collegeApproval.approvalTime" 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="5">学籍管理科<br />意见</td>
|
||||
<td class="input-cell" colspan="8" rowspan="5">
|
||||
<el-input v-model="studentStatusApproval.approvalOpinion" type="textarea" :rows="3"
|
||||
placeholder="请填写学籍管理科意见..." class="opinion-textarea"></el-input>
|
||||
<div class="signature-area right-align">
|
||||
<span>审批结果:</span>
|
||||
<el-select v-model="studentStatusApproval.approvalResult" 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="studentStatusApproval.approverName" placeholder="请输入姓名"
|
||||
class="signature-input"></el-input>
|
||||
<span class="date-label">日期:</span>
|
||||
<el-date-picker v-model="studentStatusApproval.approvalTime" 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></tr>
|
||||
|
||||
<!-- 教务处主管领导意见行 -->
|
||||
<tr>
|
||||
<td class="label" rowspan="4">教务处<br />主管领导意见</td>
|
||||
<td class="input-cell" colspan="8" rowspan="4">
|
||||
<el-input v-model="deanApproval.approvalOpinion" type="textarea" :rows="3" placeholder="请填写教务处主管领导意见..."
|
||||
class="opinion-textarea"></el-input>
|
||||
<div class="signature-area right-align">
|
||||
<span>审批结果:</span>
|
||||
<el-select v-model="deanApproval.approvalResult" 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="deanApproval.approverName" placeholder="请输入姓名" class="signature-input"></el-input>
|
||||
<span class="date-label">日期:</span>
|
||||
<el-date-picker v-model="deanApproval.approvalTime" 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">备注</td>
|
||||
<td class="input-cell" colspan="8">
|
||||
<span>保留学籍编号:</span>
|
||||
<el-input v-model="formData.reserveNo" readonly class="remark-input"
|
||||
style="width: 150px; margin: 0 10px;"></el-input>
|
||||
<!-- <span>批文号:</span>
|
||||
<el-input v-model="formData.approvalNo" readonly class="remark-input"
|
||||
style="width: 150px; margin: 0 10px;"></el-input>
|
||||
<span>申请状态:</span>
|
||||
<el-select v-model="formData.applyStatus" disabled class="short-select">
|
||||
<el-option label="草稿" value="0"></el-option>
|
||||
<el-option label="审批中" value="1"></el-option>
|
||||
<el-option label="通过" value="2"></el-option>
|
||||
<el-option label="驳回" value="3"></el-option>
|
||||
</el-select> -->
|
||||
</td>
|
||||
</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>
|
||||
export default {
|
||||
name: 'EnlistmentReserveForm',
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
id: null,
|
||||
applyNo: '',
|
||||
studentId: null,
|
||||
studentName: '',
|
||||
gender: '',
|
||||
nation: '',
|
||||
grade: '',
|
||||
studentNo: '',
|
||||
className: '',
|
||||
major: '',
|
||||
familyAddress: '',
|
||||
parentPhone: '',
|
||||
applyReason: '',
|
||||
applyStatus: 0,
|
||||
processInstanceId: '',
|
||||
reserveNo: '',
|
||||
reserveStartDate: '',
|
||||
reserveEndDate: '',
|
||||
approvalNo: '',
|
||||
createTime: '',
|
||||
updateTime: '',
|
||||
remark: ''
|
||||
},
|
||||
formRules: {
|
||||
studentName: [
|
||||
{ required: true, message: '请输入姓名', trigger: 'blur' }
|
||||
],
|
||||
gender: [
|
||||
{ required: true, message: '请选择性别', trigger: 'change' }
|
||||
],
|
||||
nation: [
|
||||
{ required: true, message: '请输入民族', trigger: 'blur' }
|
||||
],
|
||||
grade: [
|
||||
{ required: true, message: '请输入年级', trigger: 'blur' }
|
||||
],
|
||||
studentNo: [
|
||||
{ required: true, message: '请输入学号', trigger: 'blur' }
|
||||
],
|
||||
className: [
|
||||
{ required: true, message: '请输入班级', trigger: 'blur' }
|
||||
],
|
||||
major: [
|
||||
{ required: true, message: '请输入专业名称', trigger: 'blur' }
|
||||
],
|
||||
familyAddress: [
|
||||
{ required: true, message: '请输入家庭地址', trigger: 'blur' }
|
||||
],
|
||||
parentPhone: [
|
||||
{ required: true, message: '请输入家长联系电话', trigger: 'blur' },
|
||||
{ pattern: /^1[3-9]\d{9}$/, message: '请输入有效的手机号码', trigger: 'blur' }
|
||||
],
|
||||
applyReason: [
|
||||
{ required: true, message: '请输入申请理由', trigger: 'blur' },
|
||||
{ min: 20, message: '申请理由长度不能少于20字', trigger: 'blur' }
|
||||
],
|
||||
reserveStartDate: [
|
||||
{ required: true, message: '请选择保留学籍起始时间', trigger: 'change' }
|
||||
],
|
||||
createTime: [
|
||||
{ required: true, message: '请选择提交日期', trigger: 'change' }
|
||||
]
|
||||
},
|
||||
counselorApproval: {
|
||||
id: null,
|
||||
applyId: null,
|
||||
processInstanceId: '',
|
||||
taskId: '',
|
||||
nodeName: '辅导员',
|
||||
approverId: null,
|
||||
approverName: '',
|
||||
approvalOpinion: '',
|
||||
approvalResult: null,
|
||||
approvalTime: ''
|
||||
},
|
||||
academicApproval: {
|
||||
id: null,
|
||||
applyId: null,
|
||||
processInstanceId: '',
|
||||
taskId: '',
|
||||
nodeName: '学务',
|
||||
approverId: null,
|
||||
approverName: '',
|
||||
approvalOpinion: '',
|
||||
approvalResult: null,
|
||||
approvalTime: ''
|
||||
},
|
||||
collegeApproval: {
|
||||
id: null,
|
||||
applyId: null,
|
||||
processInstanceId: '',
|
||||
taskId: '',
|
||||
nodeName: '二级学院',
|
||||
approverId: null,
|
||||
approverName: '',
|
||||
approvalOpinion: '',
|
||||
approvalResult: null,
|
||||
approvalTime: ''
|
||||
},
|
||||
studentStatusApproval: {
|
||||
id: null,
|
||||
applyId: null,
|
||||
processInstanceId: '',
|
||||
taskId: '',
|
||||
nodeName: '学籍管理科',
|
||||
approverId: null,
|
||||
approverName: '',
|
||||
approvalOpinion: '',
|
||||
approvalResult: null,
|
||||
approvalTime: ''
|
||||
},
|
||||
deanApproval: {
|
||||
id: null,
|
||||
applyId: null,
|
||||
processInstanceId: '',
|
||||
taskId: '',
|
||||
nodeName: '教务处主管领导',
|
||||
approverId: null,
|
||||
approverName: '',
|
||||
approvalOpinion: '',
|
||||
approvalResult: null,
|
||||
approvalTime: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'formData.reserveStartDate'(val) {
|
||||
if (val) {
|
||||
const start = new Date(val);
|
||||
const end = new Date(start.setFullYear(start.getFullYear() + 2));
|
||||
this.formData.reserveEndDate = `${end.getFullYear()}-${(end.getMonth() + 1).toString().padStart(2, '0')}-${end.getDate().toString().padStart(2, '0')}`;
|
||||
} else {
|
||||
this.formData.reserveEndDate = '';
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
this.$refs.formRef.validate((valid) => {
|
||||
if (valid) {
|
||||
if (!this.formData.applyNo) {
|
||||
const year = new Date().getFullYear();
|
||||
const randomNo = Math.floor(Math.random() * 1000000).toString().padStart(6, '0');
|
||||
this.formData.applyNo = `RY${year}${randomNo}`;
|
||||
}
|
||||
this.formData.applyStatus = 1;
|
||||
this.formData.updateTime = new Date().toISOString().split('T')[0];
|
||||
|
||||
const submitData = {
|
||||
formData: this.formData,
|
||||
approvals: [
|
||||
this.counselorApproval,
|
||||
this.academicApproval,
|
||||
this.collegeApproval,
|
||||
this.studentStatusApproval,
|
||||
this.deanApproval
|
||||
].filter(item => item.approvalResult !== null)
|
||||
};
|
||||
|
||||
console.log('提交数据:', submitData);
|
||||
this.$message.success('提交成功!');
|
||||
} else {
|
||||
this.$message.error('表单填写不完整,请检查!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs.formRef.resetFields();
|
||||
const resetApproval = () => ({
|
||||
id: null,
|
||||
applyId: null,
|
||||
processInstanceId: '',
|
||||
taskId: '',
|
||||
nodeName: '',
|
||||
approverId: null,
|
||||
approverName: '',
|
||||
approvalOpinion: '',
|
||||
approvalResult: null,
|
||||
approvalTime: ''
|
||||
});
|
||||
|
||||
this.counselorApproval = { ...resetApproval(), nodeName: '辅导员' };
|
||||
this.academicApproval = { ...resetApproval(), nodeName: '学务' };
|
||||
this.collegeApproval = { ...resetApproval(), nodeName: '二级学院' };
|
||||
this.studentStatusApproval = { ...resetApproval(), nodeName: '学籍管理科' };
|
||||
this.deanApproval = { ...resetApproval(), nodeName: '教务处主管领导' };
|
||||
|
||||
this.formData.applyStatus = 0;
|
||||
this.formData.reserveEndDate = '';
|
||||
this.$message.info('表单已重置');
|
||||
},
|
||||
printForm() {
|
||||
window.print();
|
||||
}
|
||||
}
|
||||
};
|
||||
</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>
|
||||
@@ -1,18 +1,9 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="申请编号" prop="applyNo">
|
||||
<el-input v-model="queryParams.applyNo" placeholder="请输入申请编号" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="学生ID" prop="studentId">
|
||||
<el-input v-model="queryParams.studentId" placeholder="请输入学生ID" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="studentName">
|
||||
<el-input v-model="queryParams.studentName" placeholder="请输入姓名" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-input v-model="queryParams.gender" placeholder="请输入性别" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="民族" prop="nation">
|
||||
<el-select v-model="queryParams.nation" placeholder="请选择民族" clearable>
|
||||
<el-option v-for="dict in dict.type.rt_nation" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
@@ -31,25 +22,10 @@
|
||||
<el-option v-for="dict in dict.type.rt_classes" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="专业名称" prop="major">
|
||||
<!-- <el-form-item label="专业名称" prop="major">
|
||||
<el-input v-model="queryParams.major" placeholder="请输入专业名称" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="家庭地址" prop="familyAddress">
|
||||
<el-input v-model="queryParams.familyAddress" placeholder="请输入家庭地址" clearable
|
||||
@keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="家长联系电话" prop="parentPhone">
|
||||
<el-input v-model="queryParams.parentPhone" placeholder="请输入家长联系电话" clearable
|
||||
@keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Flowable流程实例ID" prop="processInstanceId">
|
||||
<el-input v-model="queryParams.processInstanceId" placeholder="请输入Flowable流程实例ID" clearable
|
||||
@keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="保留学籍编号" prop="reserveNo">
|
||||
<el-input v-model="queryParams.reserveNo" placeholder="请输入保留学籍编号" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="保留学籍开始日期" prop="reserveStartDate">
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item label="保留学籍开始日期" prop="reserveStartDate">
|
||||
<el-date-picker clearable v-model="queryParams.reserveStartDate" type="date" value-format="yyyy-MM-dd"
|
||||
placeholder="请选择保留学籍开始日期">
|
||||
</el-date-picker>
|
||||
@@ -58,10 +34,7 @@
|
||||
<el-date-picker clearable v-model="queryParams.reserveEndDate" type="date" value-format="yyyy-MM-dd"
|
||||
placeholder="请选择保留学籍结束日期">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="批文号" prop="approvalNo">
|
||||
<el-input v-model="queryParams.approvalNo" placeholder="请输入批文号" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
@@ -69,11 +42,14 @@
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<!-- <el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['routine:enlistmentReserve:add']">新增</el-button>
|
||||
</el-col>
|
||||
v-hasPermi="['routine:enlistmentReserve:add']">发起入伍保留学籍申请</el-button>
|
||||
</el-col> -->
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="openForm">发起入伍保留学籍申请</el-button>
|
||||
</el-col>
|
||||
<!-- <el-col :span="1.5">
|
||||
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
|
||||
v-hasPermi="['routine:enlistmentReserve:edit']">修改</el-button>
|
||||
</el-col>
|
||||
@@ -84,15 +60,13 @@
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
v-hasPermi="['routine:enlistmentReserve:export']">导出</el-button>
|
||||
</el-col>
|
||||
</el-col> -->
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="enlistmentReserveList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键" align="center" prop="id" />
|
||||
<el-table-column label="申请编号" align="center" prop="applyNo" />
|
||||
<el-table-column label="学生ID" align="center" prop="studentId" />
|
||||
<el-table-column label="姓名" align="center" prop="studentName" />
|
||||
<el-table-column label="性别" align="center" prop="gender" />
|
||||
<el-table-column label="民族" align="center" prop="nation">
|
||||
@@ -116,7 +90,6 @@
|
||||
<el-table-column label="家长联系电话" align="center" prop="parentPhone" />
|
||||
<el-table-column label="申请理由" align="center" prop="applyReason" />
|
||||
<el-table-column label="申请状态" align="center" prop="applyStatus" />
|
||||
<el-table-column label="Flowable流程实例ID" align="center" prop="processInstanceId" />
|
||||
<el-table-column label="保留学籍编号" align="center" prop="reserveNo" />
|
||||
<el-table-column label="保留学籍开始日期" align="center" prop="reserveStartDate" width="180">
|
||||
<template slot-scope="scope">
|
||||
@@ -428,6 +401,10 @@ export default {
|
||||
this.download('routine/enlistmentReserve/export', {
|
||||
...this.queryParams
|
||||
}, `enlistmentReserve_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
// 跳转申请表
|
||||
openForm () {
|
||||
this.$router.push("/routine/enlistmentReserve/applicationForm")
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user