外宿申请-表单详细

This commit is contained in:
2025-12-09 12:27:31 +08:00
parent 22f5db28de
commit 190b7fae8c
5 changed files with 282 additions and 15 deletions

View File

@@ -178,8 +178,8 @@
<el-descriptions-item label="家长意见" required> <el-descriptions-item label="家长意见" required>
<el-form-item prop="parentOpinion" class="no-label-form-item"> <el-form-item prop="parentOpinion" class="no-label-form-item">
<el-radio-group v-model="form.parentOpinion"> <el-radio-group v-model="form.parentOpinion">
<el-radio label="1">同意外宿</el-radio> <el-radio :label="1">同意外宿</el-radio>
<el-radio label="0">不同意外宿</el-radio> <el-radio :label="0">不同意外宿</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-descriptions-item> </el-descriptions-item>
@@ -353,7 +353,7 @@ export default {
outsideAddress: '', outsideAddress: '',
emergencyContact: '', emergencyContact: '',
emergencyPhone: '', emergencyPhone: '',
parentOpinion: '1', parentOpinion: 1,
parentPhone: '', parentPhone: '',
parentAddress: '', parentAddress: '',
parentDetailAddress: '', parentDetailAddress: '',
@@ -682,11 +682,24 @@ export default {
submitForm(status) { submitForm(status) {
this.$refs.formRef.validate((valid) => { this.$refs.formRef.validate((valid) => {
if (valid) { if (valid) {
// 生成申请编号
if (!this.form.applyNo) { if (!this.form.applyNo) {
const year = new Date().getFullYear(); const year = new Date().getFullYear();
const randomNo = Math.floor(Math.random() * 1000000).toString().padStart(6, '0'); const randomNo = Math.floor(Math.random() * 1000000).toString().padStart(6, '0');
this.form.applyNo = `WS${year}${randomNo}`; // 获取申请编号 this.form.applyNo = `WS${year}${randomNo}`; // 获取申请编号
} }
// 生成外宿结束时间默认次年8月31日
this.form.endDate = this.getOutsideDefaultEndTime()
// 生成本人承诺内容
this.form.promiseContent = `
1. 自觉遵守国家法律、法规;
2. 自觉遵守学生行为规范和学校的规章制度,遵守社会公德;
3. 自觉遵守外宿住址所在社区的有关管理规定;
4. 本人申请外宿,属个人自愿行为,外宿期间发生的一切事故,造成本人、他人或集体的人身、财产损害的,学校不负责任。
`
// 将地址数组转为字符串(用 / 拼接,后端可按此分隔解析) // 将地址数组转为字符串(用 / 拼接,后端可按此分隔解析)
const submitForm = { const submitForm = {
...this.form, ...this.form,
@@ -701,7 +714,7 @@ export default {
this.loading = false; this.loading = false;
this.$modal.msgSuccess('修改成功') this.$modal.msgSuccess('修改成功')
this.goBack() this.goBack()
}).catch(error => { }).catch(error => {
this.loading = false; this.loading = false;
this.goBack() this.goBack()
}) })
@@ -710,7 +723,7 @@ export default {
this.loading = false; this.loading = false;
this.$modal.msgSuccess('新增成功') this.$modal.msgSuccess('新增成功')
this.goBack() this.goBack()
}).catch(error => { }).catch(error => {
this.loading = false; this.loading = false;
this.goBack() this.goBack()
}) })
@@ -919,6 +932,32 @@ export default {
this.$message.error('上传头像图片大小不能超过 2MB!'); this.$message.error('上传头像图片大小不能超过 2MB!');
} }
return isJPG && isLt2M; return isJPG && isLt2M;
},
/**
* 生成外宿默认结束时间次年8月31日
* @returns {String} 格式化日期yyyy-MM-dd
*/
getOutsideDefaultEndTime() {
const now = new Date();
const currentYear = now.getFullYear();
// 计算次年(当前年+1
const nextYear = currentYear + 1;
// 生成次年8月31日月份从0开始8月对应9
const endDate = new Date(nextYear, 8, 31);
// 格式化为 yyyy-MM-dd适配 el-date-picker 的 value-format
return this.formatDate(endDate);
},
/**
* 日期格式化工具(补零+拼接)
* @param {Date} date 日期对象
* @returns {String} yyyy-MM-dd
*/
formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份补零
const day = String(date.getDate()).padStart(2, '0'); // 日期补零
return `${year}-${month}-${day}`;
} }
} }
} }
@@ -1069,5 +1108,4 @@ li {
text-align: center !important; text-align: center !important;
width: 120px; width: 120px;
} }
</style> </style>

View File

@@ -0,0 +1,215 @@
<!-- 详细外宿申请表 -->
<template>
<div v-loading="loading">
<!-- 详细入伍保留学籍表单 -->
<el-descriptions class="margin-top" title="" :column="4" size="medium" border style="width: 100%">
<el-descriptions-item>
<template slot="label"> 原宿舍号 </template>
{{ renderData.originalDormitory }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 姓名 </template>
{{ renderData.studentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 性别 </template>
<span v-if="renderData.gender == 1"></span>
<span v-else></span>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 出生年月 </template>
{{ renderData.birthDate }}
</el-descriptions-item>
<el-descriptions-item span="2">
<template slot="label"> 专业系 </template>
{{ renderData.majorName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 班级 </template>
{{ renderData.className }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 学号 </template>
{{ renderData.studentNo }}
</el-descriptions-item>
<el-descriptions-item span="4">
<template slot="label"> 宿费交纳情况只填写当年度交费情况 </template>
<!-- {{ renderData.familyAddress }} -->
已交 绑定当前学年年度住宿费 人民币
</el-descriptions-item>
<el-descriptions-item span="2">
<template slot="label"> 身份证号码 </template>
{{ renderData.idCard }}
</el-descriptions-item>
<el-descriptions-item span="2">
<template slot="label"> 学生联系电话 </template>
{{ renderData.studentPhone }}
</el-descriptions-item>
<el-descriptions-item span="4">
<template slot="label"> 附件材料 </template>
<Affix v-model="renderData.affixId" :disabled="true" />
</el-descriptions-item>
<el-descriptions-item span="4">
<template slot="label"> 申请原因 </template>
<div style="padding-top: 10px;">
{{ renderData.applyReason }}
</div>
<div style="padding: 20px;">
<div style="display: flex;justify-content: flex-end;align-items: center;">
<div style="padding: 0 10px;display: flex;justify-content: flex-end;align-items: center;">
<div>申请人 </div>
<div>
<el-image style="width: 100px; height: 50px; margin-left: 10px; border: 1px solid #eee"
:src="baseUrl + renderData.studentSignature" :preview-src-list="[baseUrl + renderData.studentSignature]">
</el-image>
</div>
</div>
<div style="padding: 0 10px;">日期 {{ renderData.createTime }}</div>
</div>
</div>
</el-descriptions-item>
<!-- <el-descriptions-item span="4" v-for="item in formData.enlistmentReserveApprovalList">
<template slot="label"> {{ item.opinionType }} </template>
<div style="padding-top: 10px;">
{{ item.approvalOpinion || "暂无意见" }}
</div>
<div style="padding: 20px;">
<div style="display: flex;justify-content: flex-end;align-items: center;">
<div style="padding: 0 10px;">
审批结果
<el-tag v-if="item.approvalResult == 1" type="success">通过</el-tag>
<el-tag v-else type="danger">驳回</el-tag>
</div>
<div style="padding: 0 10px;">签名 {{ item.approverName }}</div>
<div style="padding: 0 10px;">日期 {{ item.approvalTime }}</div>
</div>
</div>
</el-descriptions-item> -->
<el-descriptions-item span="2">
<template slot="label"> 外宿详细地址具体到门牌号 </template>
{{ renderData.address + renderData.outsideAddress }}
</el-descriptions-item>
<el-descriptions-item span="2">
<template slot="label"> 外宿居所紧急联系人电话 </template>
{{ renderData.emergencyPhone }}
</el-descriptions-item>
<el-descriptions-item span="4">
<template slot="label"> 家长意见 </template>
<div style="padding-top: 10px;">
<el-image style="width: 200px; height: 150px; margin-left: 10px; border: 1px solid #eee"
:src="baseUrl + renderData.parentSignAttachment" :preview-src-list="[baseUrl + renderData.parentSignAttachment]">
</el-image>
</div>
<div style="padding: 20px;">
<div style="display: flex;justify-content: flex-end;align-items: center;">
<div style="padding: 0 10px;display: flex;justify-content: flex-end;align-items: center;">
<div>申请人 </div>
<div>
<el-image style="width: 100px; height: 50px; margin-left: 10px; border: 1px solid #eee"
:src="baseUrl + renderData.parentSignAttachment" :preview-src-list="[baseUrl + renderData.parentSignAttachment]">
</el-image>
</div>
</div>
<div style="padding: 0 10px;">日期 {{ renderData.createTime }}</div>
</div>
</div>
</el-descriptions-item>
<el-descriptions-item span="4">
<template slot="label"> 家长联系方式 </template>
<div>
<div style="display: flex;align-items: center;">
<div>通讯地址</div>
<div>{{ renderData.parentAddress + renderData.parentDetailAddress }}</div>
</div>
<div style="display: flex;align-items: center;">
<div>联系电话</div>
<div>{{ renderData.parentPhone }}</div>
</div>
</div>
</el-descriptions-item>
<el-descriptions-item span="4">
<template slot="label"> 保留学籍时间和编号 </template>
{{ renderData.reserveNo }}
</el-descriptions-item>
</el-descriptions>
</div>
</template>
<script>
import {
getOutsideAccommodationApply,
} from '@/api/dormitory/outsideAccommodation/outsideAccommodationApply'
export default {
props: {
// props类型定义Object类型+默认空对象)
formData: {
type: Object, // 正确的对象类型声明
default: () => ({}) // 函数返回空对象(避免所有实例共享同一个对象)
}
},
data() {
return {
loading: false,
currentId: null,
// formData: {} // 注释/删除这一行
detailData: {}, // 用独立变量存储接口返回的详情数据
baseUrl: process.env.VUE_APP_BASE_API,
}
},
// 计算属性判断优先级
computed: {
renderData() {
// 规则有接口数据detailData有内容则用detailData否则用props的formData
// Object.keys(this.detailData).length > 0 表示detailData非空
return Object.keys(this.detailData).length > 0
? this.detailData
: this.formData;
}
},
watch: {
// 监听路由参数变化,只要有新的 id 就更新
"$route.query.id": {
immediate: true, // 初始化时立即执行一次
handler(newId, oldId) {
if (newId) {
this.loading = true;
this.currentId = newId;
// 调用接口加载数据
getOutsideAccommodationApply(this.currentId)
.then(res => {
// 修正Promise语法逗号改分号/换行)
this.detailData = { ...res.data }; // 接口数据存入独立变量
this.loading = false;
console.log(this.detailData);
})
// 添加异常捕获避免接口报错导致loading一直显示
.catch(err => {
this.loading = false;
this.$message.error('加载详情失败:' + err.message);
console.error(err);
});
} else {
// 若 id 为空,清空数据
this.currentId = null;
this.detailData = {};
}
}
}
},
methods: {},
created() { },
mounted() { },
destroyed() { }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
</style>

View File

@@ -142,9 +142,11 @@
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['dormitory:outsideAccommodationApply:edit']">修改</el-button> v-hasPermi="['dormitory:outsideAccommodationApply:edit']" v-if="scope.row.status == 0 || scope.row.status == 6">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['dormitory:outsideAccommodationApply:remove']">删除</el-button> v-hasPermi="['dormitory:outsideAccommodationApply:remove']" v-if="scope.row.status == 0">删除</el-button>
<el-button v-if="scope.row.applyStatus != 0" size="mini" type="text" icon="el-icon-info"
@click="detail(scope.row)">详情</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -610,6 +612,12 @@ export default {
// 跳转申请表 // 跳转申请表
openForm() { openForm() {
this.$router.push("/dormitory/outsideAccommodation/applicationForm"); this.$router.push("/dormitory/outsideAccommodation/applicationForm");
},
detail(row) {
this.$router.push({
path: "/dormitory/outsideAccommodation/detailApply",
query: { id: row.id } // 将 row.id 放在 query 中
});
} }
} }
}; };

View File

@@ -4,11 +4,11 @@
<el-form-item label="申请编号" prop="applyNo"> <el-form-item label="申请编号" prop="applyNo">
<el-input v-model="queryParams.applyNo" placeholder="请输入申请编号" clearable @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.applyNo" placeholder="请输入申请编号" clearable @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
<el-form-item label="审批节点" prop="approvalNode"> <!-- <el-form-item label="审批节点" prop="approvalNode">
<el-input v-model="queryParams.approvalNode" placeholder="请输入审批节点" clearable <el-input v-model="queryParams.approvalNode" placeholder="请输入审批节点" clearable
@keyup.enter.native="handleQuery" /> @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item> -->
<el-form-item label="审批人姓名" prop="approverName"> <el-form-item label="审批人" prop="approverName">
<el-input v-model="queryParams.approverName" placeholder="请输入审批人姓名" clearable <el-input v-model="queryParams.approverName" placeholder="请输入审批人姓名" clearable
@keyup.enter.native="handleQuery" /> @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
@@ -57,12 +57,17 @@
<el-table-column label="学生学号" align="center" prop="studentNo" /> <el-table-column label="学生学号" align="center" prop="studentNo" />
<el-table-column label="申请编号" align="center" prop="applyNo" /> <el-table-column label="申请编号" align="center" prop="applyNo" />
<el-table-column label="审批节点" align="center" prop="approvalNode" /> <el-table-column label="审批节点" align="center" prop="approvalNode" />
<el-table-column label="审批人ID" align="center" prop="approverId" /> <!-- <el-table-column label="审批人ID" align="center" prop="approverId" /> -->
<el-table-column label="审批人姓名" align="center" prop="approverName" /> <el-table-column label="审批人姓名" align="center" prop="approverName" />
<el-table-column label="审批人角色" align="center" prop="approverRole" /> <!-- <el-table-column label="审批人角色" align="center" prop="approverRole" /> -->
<el-table-column label="审批意见" align="center" prop="approvalOpinion" /> <el-table-column label="审批意见" align="center" prop="approvalOpinion" />
<el-table-column label="审批结果" align="center" prop="approvalResult" /> <el-table-column label="审批结果" align="center" prop="approvalResult">
<el-table-column label="审批时间" align="center" prop="approvalTime" width="180"> <template slot-scope="scope">
<el-tag v-if="scope.row.approvalResult == 1" type="success">通过</el-tag>
<el-tag v-else type="danger">驳回</el-tag>
</template>
</el-table-column>
<el-table-column label="审批时间" align="center" prop="approvalTime">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.approvalTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.approvalTime, '{y}-{m}-{d}') }}</span>
</template> </template>

View File

@@ -1105,6 +1105,7 @@ export default {
if (this.taskName == '教务处主管领导审批') { // (最后一个领导审核完成之后,修改学生学籍状态, status07是入伍保留学籍) if (this.taskName == '教务处主管领导审批') { // (最后一个领导审核完成之后,修改学生学籍状态, status07是入伍保留学籍)
updateStudent({stuId: this.form.studentId, status: '07'}).then(response => {}) updateStudent({stuId: this.form.studentId, status: '07'}).then(response => {})
} }
this.$modal.msgSuccess(response.msg)
} else { } else {
this.$modal.msgSuccess(response.msg) this.$modal.msgSuccess(response.msg)
} }