282 lines
8.3 KiB
Python
282 lines
8.3 KiB
Python
<template>
|
|
<div class="app-container">
|
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-form-item label="编号" prop="code">
|
|
<el-input v-model="formData.code" placeholder="请输入编号" clearable :style="{width: '100%'}"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="易记码" prop="remember_code">
|
|
<el-input v-model="formData.remember_code" placeholder="请输入易记码" clearable :style="{width: '100%'}">
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="财务编号" prop="finance_number">
|
|
<el-input v-model="formData.finance_number" placeholder="请输入财务编号" clearable :style="{width: '100%'}">
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-form-item label="性别" prop="gender">
|
|
<el-select v-model="formData.gender" placeholder="请选择性别" clearable :style="{width: '100%'}" >
|
|
<el-option
|
|
v-for="item in genderOptions"
|
|
:key="item.key"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="座机号" prop="landline">
|
|
<el-input v-model="formData.landline" placeholder="请输入座机" clearable :style="{width: '100%'}">
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="邮箱" prop="email">
|
|
<el-input v-model="formData.email" placeholder="请输入邮箱" clearable :style="{width: '100%'}">
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-form-item label="职称" prop="gender">
|
|
<el-select v-model="formData.pro_title" placeholder="请选择职称" clearable :style="{width: '100%'}" >
|
|
<el-option
|
|
v-for="item in titleOptions"
|
|
:key="item.key"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="身份证号" prop="ID_number">
|
|
<el-input v-model="formData.ID_number" placeholder="请输入身份证号" clearable :style="{width: '100%'}">
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="出生日期" prop="birth" >
|
|
<el-date-picker
|
|
:style="{width: '100%'}"
|
|
v-model="formData.birth"
|
|
type="date"
|
|
value-format="yyyy-MM-dd"
|
|
placeholder="选择日期">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<el-form-item label="劳务费级别" prop="gender">
|
|
<el-select v-model="formData.fee_level" placeholder="请选择劳务费级别" clearable :style="{width: '100%'}" >
|
|
<el-option
|
|
v-for="item in feeOptions"
|
|
:key="item.key"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="省市区" prop="region">
|
|
<el-cascader
|
|
clearable :style="{width: '100%'}"
|
|
v-model="formData.region"
|
|
:options="regionOptions"
|
|
></el-cascader>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="详细地址" prop="address">
|
|
<el-input v-model="formData.address" placeholder="请输入详细地址" clearable :style="{width: '100%'}"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="4">
|
|
<el-form-item label="是否在职" prop="is_onjob">
|
|
<el-switch v-model="formData.is_onjob"></el-switch>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-form-item label="是否专职" prop="is_fulltime">
|
|
<el-switch v-model="formData.is_fulltime"></el-switch>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-form-item label="缴纳保险" prop="is_payinsurance">
|
|
<el-switch v-model="formData.is_payinsurance"></el-switch>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="6">
|
|
<el-form-item label="证件照" prop="photo">
|
|
<el-upload :action="upUrl" accept=".png,.jpeg,.jpg"
|
|
:headers="upHeaders" class="avatar-uploader" :show-file-list="false" :on-success="handleSuccess"
|
|
:before-upload="beforeUpload">
|
|
<img v-if="formData.photo" :src="formData.photo" class="avatar">
|
|
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
|
</el-upload>
|
|
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="签名图片" prop="signature">
|
|
<el-upload :action="upUrl"
|
|
:headers="upHeaders"></el-upload>
|
|
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-form-item size="large">
|
|
<el-button type="primary" @click="submitForm">保存</el-button>
|
|
<el-button @click="goBack">返回</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
<style>
|
|
.avatar-uploader .el-upload {
|
|
border: 1px dashed #d9d9d9;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.avatar-uploader .el-upload:hover {
|
|
border-color: #409EFF;
|
|
}
|
|
.avatar-uploader-icon {
|
|
font-size: 28px;
|
|
color: #8c939d;
|
|
width: 100px;
|
|
height: 126px;
|
|
line-height: 126px;
|
|
text-align: center;
|
|
}
|
|
.avatar {
|
|
width: 100px;
|
|
height: 126px;
|
|
display: block;
|
|
}
|
|
</style>
|
|
<script>
|
|
import { upUrl, upHeaders } from "@/api/file"
|
|
import { getDictList } from "@/api/dict"
|
|
import { genTree } from "@/utils"
|
|
import { getEmployee, updateEmployee } from '@/api/employee'
|
|
const defaultForm = {
|
|
is_onjob:true,
|
|
is_fulltime:true,
|
|
is_payinsurance:true
|
|
}
|
|
export default {
|
|
name:'Employeedetail',
|
|
components: {},
|
|
props: ['id'],
|
|
data() {
|
|
return {
|
|
upHeaders: upHeaders(),
|
|
upUrl: upUrl(),
|
|
formData: Object.assign({}, defaultForm),
|
|
titleOptions:[],
|
|
regionOptions:[],
|
|
feeOptions:[],
|
|
genderOptions:[
|
|
{'value':'男','label':'男'},
|
|
{'value':'女','label':'女'}
|
|
],
|
|
rules:{
|
|
email:[
|
|
{
|
|
pattern: /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/,
|
|
message: '邮箱格式错误',
|
|
trigger: 'blur'
|
|
}],
|
|
ID_number:[
|
|
{
|
|
pattern: /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/,
|
|
message: '身份证格式错误',
|
|
trigger: 'blur'
|
|
}]
|
|
}
|
|
}
|
|
},
|
|
computed: {},
|
|
watch: {},
|
|
created() {
|
|
this.formData.id = this.id
|
|
this.getDetail()
|
|
this.getTitleOptions()
|
|
this.getReginOptions()
|
|
this.getFeeOptions()
|
|
},
|
|
mounted() {},
|
|
methods: {
|
|
getDetail() {
|
|
getEmployee(this.id).then(res=>{
|
|
this.formData = res.data
|
|
})
|
|
},
|
|
beforeUpload(file) {
|
|
const isLt1M = file.size / 1024 / 1024 < 1;
|
|
if (!isLt1M) {
|
|
this.$message.error('上传头像图片大小不能超过 1MB!');
|
|
}
|
|
return isLt1M;
|
|
},
|
|
handleSuccess(res, file) {
|
|
this.formData.photo = res.data.path;
|
|
},
|
|
getTitleOptions() {
|
|
getDictList({type__code:'pro_title'}).then(res=>{
|
|
this.titleOptions=genTree(res.data)
|
|
})
|
|
},
|
|
getFeeOptions() {
|
|
getDictList({type__code:'fee_level'}).then(res=>{
|
|
this.feeOptions = genTree(res.data)
|
|
})
|
|
},
|
|
getReginOptions() {
|
|
getDictList({type__code:'china_regions'}).then(res=>{
|
|
this.regionOptions=genTree(res.data)
|
|
})
|
|
},
|
|
submitForm() {
|
|
this.$refs['elForm'].validate(valid => {
|
|
if (!valid) return
|
|
// TODO 提交表单
|
|
var data = this.formData
|
|
data.region = data.region[data.region.length-1]
|
|
updateEmployee(this.id,data).then(res=>{
|
|
this.$message.success('成功')
|
|
})
|
|
})
|
|
},
|
|
resetForm() {
|
|
this.$refs['elForm'].resetFields()
|
|
},
|
|
goBack() {
|
|
this.$router.go(-1)
|
|
}
|
|
}
|
|
}
|
|
</script> |