feat: 人事流程

This commit is contained in:
2025-03-09 16:07:01 +08:00
parent d335612b2f
commit a140dbc846
10 changed files with 435 additions and 160 deletions

View File

@@ -1,123 +1,144 @@
<template>
<div class="main">
<el-header style="background-color: #fff;display: flex;justify-content:center;border-radius: 10px">
<h1>员工离职申请表</h1>
</el-header>
<el-container style="background-color: #fff;border-radius: 10px;margin-top: 30px;flex-direction: column;padding: 20px">
<div style="display: flex;justify-content: space-between;align-items: center;">
<div>基本信息</div>
<div>
<el-button type="primary" @click="saveFormToOffboarding">
<i class="el-icon-check"></i>提交
</el-button>
<div class="main">
<el-header style="background-color: #fff;display: flex;justify-content:center;border-radius: 10px">
<h1>员工离职申请表</h1>
</el-header>
<el-container style="background-color: #fff;border-radius: 10px;margin-top: 30px;flex-direction: column;padding: 20px">
<div style="display: flex;justify-content: space-between;align-items: center;">
<div>基本信息</div>
<div>
<el-button type="primary" @click="saveFormToOffboarding">
<i class="el-icon-check"></i>提交
</el-button>
</div>
</div>
</div>
<el-divider></el-divider>
<div>
<el-form ref="form" :model="form" label-width="80px">
<el-row :gutter="18">
<el-col :span="12">
<el-form-item label="离职人员" required>
<el-select v-model="form.userId" filterable placeholder="请选择">
<el-option
v-for="item in userList"
:key="item.userId"
:label="item.nickName"
:value="item.userId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="离职时间" required>
<el-date-picker
v-model="form.resignationDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="离职原因" required>
<el-input type="textarea" v-model="form.exitReason" placeholder="请输入内容"></el-input>
</el-form-item>
</el-form>
</div>
</el-container>
</div>
<el-divider></el-divider>
<div>
<el-form ref="form" :model="form" label-width="80px">
<el-row :gutter="18">
<el-col :span="12">
<el-form-item label="离职人员" required>
<el-select v-model="form.userId" filterable placeholder="请选择">
<el-option
v-for="item in userList"
:key="item.userId"
:label="item.nickName"
:value="item.userId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="离职时间" required>
<el-date-picker
v-model="form.resignationDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="离职原因" required>
<el-input type="textarea" v-model="form.exitReason" placeholder="请输入内容"></el-input>
</el-form-item>
<!-- 新增文件上传组件 -->
<el-form-item label="附件上传">
<el-upload
ref="upload"
:auto-upload="false"
:on-change="handleFileChange"
:on-remove="handleFileRemove"
multiple
:file-list="fileList">
<el-button size="small" type="primary">点击选择文件</el-button>
<div slot="tip" class="el-upload__tip">请上传相关文件支持多个文件</div>
</el-upload>
</el-form-item>
</el-form>
</div>
</el-container>
</div>
</template>
<script>
import { addOffboarding } from "@/api/oa/offboarding";
import { listUser } from "@/api/system/user";
import { uploadFile, addFile } from '@/api/oa/document'
</template>
<script>
import {addOffboarding} from "@/api/oa/offboarding";
import {listUser} from "@/api/system/user";
export default {
name: "Offboarding",
dicts: [],
data() {
return{
form:{},
userList:[],
user:{}
}
},
created() {
export default {
name: "Offboarding",
dicts: [],
data() {
return {
form: {},
userList: [],
user: {},
fileList: [] // 存储选中的文件
}
},
created() {
this.getUserList();
},
methods: {
//获取用户列表
getUserList() {
listUser().then(res => {
this.userList = res.rows;
console.log(res.rows)
})
},
//保存离职信息
saveFormToOffboarding(){
addOffboarding(this.form).then(res=>{
this.$modal.msgSuccess("新增成功");
this.loading = false;
this.goBack()
})
},
/** 返回页面 */
goBack() {
// 关闭当前标签页并返回上个页面
this.$tab.closePage(this.$route)
this.$router.back()
},
querySearchAsync(queryString, cb) {
var userList = this.userList;
var results = queryString ? userList.filter(this.createStateFilter(queryString)) : userList;
methods: {
// 获取用户列表
getUserList() {
listUser().then(res => {
this.userList = res.rows;
})
},
// 文件状态改变时的处理
handleFileChange(file, fileList) {
this.fileList = fileList;
},
// 文件移除处理
handleFileRemove(file, fileList) {
this.fileList = fileList;
},
// 保存离职信息
async saveFormToOffboarding() {
try {
// 1. 文件上传
// 创建FormData对象
const formData = new FormData();
// 添加表单数据
formData.append('file', this.fileList[0].raw);
console.log(this.fileList, formData);
const data = uploadFile(formData);
console.log(data, this.form);
clearTimeout(this.timeout);
cb(results);
},
createStateFilter(queryString) {
return (user) => {
console.log(user);
return (user.nickName.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
handleSelect(item) {
this.form.userId = item.userId
// 2. 文件绑定用户
await addFile({
userId: this.user.userId,
fileList: [{
fileName: data.newFileName,
filePath: data.url,
fileType: 1
}]
})
// 3. 提交离职信息
await addOffboarding(this.form);
this.$modal.msgSuccess("提交成功");
this.goBack();
} catch (error) {
this.$modal.msgError("提交失败");
}
},
/** 返回页面 */
goBack() {
this.$tab.closePage(this.$route);
this.$router.back();
}
}
},
}
</script>
<style scoped >
.main{
padding: 20px;
background: #f6f6f6;
}
</style>
}
</script>
<style scoped>
.main {
padding: 20px;
background: #f6f6f6;
}
</style>