128 lines
3.3 KiB
Vue
128 lines
3.3 KiB
Vue
|
<template>
|
|||
|
|
<div class="app-container">
|
|||
|
|
<el-card class="box-card">
|
|||
|
|
<div slot="header" class="clearfix">
|
|||
|
|
<span>转正申请</span>
|
|||
|
|
<el-tag :type="statusType">{{ statusText }}</el-tag>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<el-form ref="form" class="apply-form">
|
|||
|
|
<el-form-item label="申请材料" prop="file">
|
|||
|
|
<el-upload
|
|||
|
|
action=""
|
|||
|
|
:auto-upload="false"
|
|||
|
|
:on-change="handleFileChange"
|
|||
|
|
:file-list="fileList"
|
|||
|
|
>
|
|||
|
|
<el-button size="small" type="primary">选择文件</el-button>
|
|||
|
|
<div slot="tip" class="el-upload__tip">支持PDF/DOC格式，大小不超过50MB</div>
|
|||
|
|
</el-upload>
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
<el-form-item>
|
|||
|
|
<el-button
|
|||
|
|
type="primary"
|
|||
|
|
:loading="loading"
|
|||
|
|
@click="handleSubmit"
|
|||
|
|
>提交申请</el-button>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-card>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { submitProbation } from '@/api/oa/hr'
|
|||
|
|
import { uploadFile, addFile } from '@/api/oa/document'
|
|||
|
|
import { getOnboarding } from "@/api/oa/onboarding"
|
|||
|
|
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
name: 'ProbationApply',
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
loading: false,
|
|||
|
|
fileList: [],
|
|||
|
|
currentFile: null,
|
|||
|
|
statusMap: {
|
|||
|
|
pending: { label: '待审批', type: 'warning' },
|
|||
|
|
success: { label: '已提交', type: 'success' }
|
|||
|
|
},
|
|||
|
|
userInfo: null,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
console.log(this.$store.state.user)
|
|||
|
|
// 获取用户入职信息
|
|||
|
|
// this.getUserInfo()
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
statusType() {
|
|||
|
|
return this.statusMap[this.fileList.length ? 'success' : 'pending'].type
|
|||
|
|
},
|
|||
|
|
statusText() {
|
|||
|
|
return this.statusMap[this.fileList.length ? 'success' : 'pending'].label
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
async getUserInfo() {
|
|||
|
|
const { data } = await getOnboarding(this.$store.state.user.id)
|
|||
|
|
this.userInfo = data
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handleFileChange(file) {
|
|||
|
|
this.currentFile = file.raw
|
|||
|
|
this.fileList = [file]
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
async handleSubmit() {
|
|||
|
|
if (!this.currentFile) {
|
|||
|
|
return this.$message.warning('请先选择申请文件')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
this.loading = true
|
|||
|
|
|
|||
|
|
// 1. 上传文件
|
|||
|
|
const formData = new FormData()
|
|||
|
|
formData.append('file', this.currentFile)
|
|||
|
|
const data = await uploadFile(formData)
|
|||
|
|
// 2. 将文件关联用户
|
|||
|
|
await addFile({
|
|||
|
|
userId: this.$store.state.user.id,
|
|||
|
|
fileList: [{
|
|||
|
|
fileName: data.originalFilename,
|
|||
|
|
filePath: data.url,
|
|||
|
|
fileType: 0,
|
|||
|
|
}]
|
|||
|
|
})
|
|||
|
|
// 3. 提交申请
|
|||
|
|
await submitProbation({
|
|||
|
|
userId: this.$store.state.user.id,
|
|||
|
|
// onboardingId: this.userInfo.onboardingId,
|
|||
|
|
status: 1,
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
this.$message.success('申请提交成功')
|
|||
|
|
this.fileList = []
|
|||
|
|
} catch (error) {
|
|||
|
|
this.$message.error('提交失败: ' + (error.message || error))
|
|||
|
|
} finally {
|
|||
|
|
this.loading = false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
.apply-form {
|
|||
|
|
max-width: 600px;
|
|||
|
|
margin: 20px auto;
|
|||
|
|
}
|
|||
|
|
.el-upload__tip {
|
|||
|
|
color: #999;
|
|||
|
|
font-size: 12px;
|
|||
|
|
margin-top: 5px;
|
|||
|
|
}
|
|||
|
|
</style>
|