✨ feat: 人事流程
This commit is contained in:
@@ -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>
|
||||
Reference in New Issue
Block a user