|
|
@@ -9,60 +9,67 @@
|
|
|
<div class="from-box">
|
|
|
<div class="title">入职审批</div>
|
|
|
<el-divider></el-divider>
|
|
|
- <el-form :model="form" label-position="top" label-width="80px">
|
|
|
- <el-form-item label="入职人">
|
|
|
- <el-input v-model="form.name" placeholder='请输入'></el-input>
|
|
|
+ <el-form :model="form" label-position="top" :rules="rules" ref="form" label-width="80px">
|
|
|
+ <el-form-item label="入职人" prop="loginName">
|
|
|
+ <el-input v-model="form.loginName" placeholder='请输入'></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="部门">
|
|
|
<treeselect v-model="form.deptId" :options="deptOptions" :normalizer="normalizer" placeholder="选择部门" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="职位">
|
|
|
- <el-select v-model="form.employeeType" placeholder="请选择">
|
|
|
+ <el-select v-model="form.position" placeholder="请选择" style="width: 100%;">
|
|
|
<el-option v-for="item in posOptions" :key="item.value" :label="item.label" :value="item.value">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="性别">
|
|
|
- <el-select v-model="form.gender" placeholder="请选择">
|
|
|
+ <el-form-item label="员工类型" prop="employeeType">
|
|
|
+ <el-select v-model="form.employeeType" placeholder="请选择" style="width: 100%;">
|
|
|
<el-option v-for="item in posOptions" :key="item.value" :label="item.label" :value="item.value">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="出生日期">
|
|
|
- <el-date-picker v-model="form.birthday" type="date" placeholder="选择日期">
|
|
|
+ <el-form-item label="性别" prop="gender">
|
|
|
+ <el-select v-model="form.gender" placeholder="请选择" style="width: 100%;">
|
|
|
+ <el-option v-for="item in posOptions" :key="item.value" :label="item.label" :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="出生日期" prop="birthday">
|
|
|
+ <el-date-picker value-format="yyyy-MM-dd" v-model="form.birthday" type="date" placeholder="选择日期" style="width: 100%;">
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="联系电话">
|
|
|
+ <el-form-item label="联系电话" prop="contactNumber">
|
|
|
<el-input v-model="form.contactNumber" placeholder='请输入'></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="电子邮箱">
|
|
|
+ <el-form-item label="电子邮箱" prop="email">
|
|
|
<el-input v-model="form.email" placeholder='请输入'></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="教育背景">
|
|
|
- <el-input v-model="form.education" placeholder='请输入'></el-input>
|
|
|
+ <el-input maxlength="50" show-word-limit type="textarea" v-model="form.education" placeholder='请输入'></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="工作经验">
|
|
|
- <el-input v-model="form.workExperience" placeholder='请输入'></el-input>
|
|
|
+ <el-input maxlength="200" rows="4" show-word-limit type="textarea" v-model="form.workExperience" placeholder='请输入'></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="入职日期">
|
|
|
- <el-date-picker v-model="form.startDate" type="date" placeholder="选择日期">
|
|
|
+ <el-form-item label="入职日期" prop="peopleList">
|
|
|
+ <el-date-picker value-format="yyyy-MM-dd" v-model="form.startDate" type="date" placeholder="选择日期" style="width: 100%;">
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="附件">
|
|
|
- <el-upload
|
|
|
+ <FileUpload v-model="form.files" :limit="1"/>
|
|
|
+ <!-- <el-upload
|
|
|
action=""
|
|
|
ref="privateKeyContentFile"
|
|
|
:limit="1"
|
|
|
- :accept="fileAccept"
|
|
|
:http-request="appCertUpload"
|
|
|
:before-upload="fileBeforeUpload">
|
|
|
<el-button size="small" type="primary" icon="el-icon-upload">点击上传</el-button>
|
|
|
- </el-upload>
|
|
|
+ </el-upload> -->
|
|
|
</el-form-item>
|
|
|
<el-form-item label="备注">
|
|
|
- <el-input type="textarea" v-model="form.remarks" placeholder="请输入备注" />
|
|
|
+ <el-input maxlength="200" rows="4" show-word-limit type="textarea" v-model="form.remarks" placeholder="请输入备注" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="审批人">
|
|
|
+ <el-form-item label="审批人" prop="peopleList">
|
|
|
+ <el-input type="textarea" v-model="form.peopleList" style="display: none;"/>
|
|
|
<el-button class="button-new-tag" @click="openPS">+ 添加</el-button>
|
|
|
<el-tag :key="tag" v-for="tag in peopleList" closable :disable-transitions="false"
|
|
|
@close="handleClose(tag)">
|
|
|
@@ -103,6 +110,7 @@ import DataList from "./DataList.vue";
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
import { listDept } from "@/api/system/dept";
|
|
|
+import FileUpload from "@/components/FileUpload";
|
|
|
|
|
|
export default {
|
|
|
name: 'Index',
|
|
|
@@ -110,7 +118,8 @@ export default {
|
|
|
Oabar,
|
|
|
PeopleSelect,
|
|
|
DataList,
|
|
|
- Treeselect
|
|
|
+ Treeselect,
|
|
|
+ FileUpload,
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -134,7 +143,7 @@ export default {
|
|
|
deptOptions: [],
|
|
|
peopleList: [],
|
|
|
form: {
|
|
|
- name: undefined,
|
|
|
+ loginName: undefined,
|
|
|
deptId: undefined,
|
|
|
position: undefined,
|
|
|
employeeType: undefined,
|
|
|
@@ -145,8 +154,51 @@ export default {
|
|
|
education: undefined,
|
|
|
workExperience: undefined,
|
|
|
startDate: undefined,
|
|
|
+ files:undefined,
|
|
|
remarks: undefined,
|
|
|
+ peopleList: '',
|
|
|
},
|
|
|
+ rules: {
|
|
|
+ loginName: [
|
|
|
+ { required: true, message: '请输入活动名称', trigger: 'blur' },
|
|
|
+ // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ employeeType: [
|
|
|
+ { required: true, message: '请选择', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ gender: [
|
|
|
+ { required: true, message: '请选择', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ birthday: [
|
|
|
+ { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ contactNumber: [
|
|
|
+ { required: true, trigger: "blur", message: "联系电话不能为空" },
|
|
|
+ {
|
|
|
+ validator: function (rule, value, callback) {
|
|
|
+ if (/^1[0-9]\d{9}$|^0\d{2,3}-\d{7,8}$/.test(value) === false) {
|
|
|
+ callback(new Error("联系电话格式错误"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ }, trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ email: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ type: "email",
|
|
|
+ message: "'请输入正确的邮箱地址",
|
|
|
+ trigger: ["blur", "change"]
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ startDate: [
|
|
|
+ { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ peopleList:[
|
|
|
+ { required: true, message: '请选择审批人', }
|
|
|
+ ]
|
|
|
+ },
|
|
|
status: true,
|
|
|
|
|
|
type: 'single',
|
|
|
@@ -165,21 +217,24 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
fileBeforeUpload(file) {
|
|
|
- let format = '.' + file.name.split(".")[1];
|
|
|
- if (format !== this.fileAccept) {
|
|
|
- this.$message.error('请上传指定格式"' + this.fileAccept + '"文件');
|
|
|
- return false;
|
|
|
- }
|
|
|
- let isRightSize = file.size / 1024 / 1024 < 2
|
|
|
+ // let format = '.' + file.name.split(".")[1];
|
|
|
+ // if (format !== this.fileAccept) {
|
|
|
+ // this.$message.error('请上传指定格式"' + this.fileAccept + '"文件');
|
|
|
+ // return false;
|
|
|
+ // }
|
|
|
+ let isRightSize = file.size / 1024 / 1024 < 5
|
|
|
if (!isRightSize) {
|
|
|
- this.$message.error('文件大小超过 2MB')
|
|
|
+ this.$message.error('文件大小超过 5MB')
|
|
|
}
|
|
|
return isRightSize
|
|
|
},
|
|
|
appCertUpload(event) {
|
|
|
+ console.log(event);
|
|
|
+ // const file = event.file;
|
|
|
const readFile = new FileReader()
|
|
|
readFile.onload = (e) => {
|
|
|
- this.formData.config.appCertContent = e.target.result
|
|
|
+ this.form.files = e.target.result
|
|
|
+ console.log(this.form.files);
|
|
|
}
|
|
|
readFile.readAsText(event.file);
|
|
|
},
|
|
|
@@ -202,7 +257,15 @@ export default {
|
|
|
},
|
|
|
//提交
|
|
|
onSubmit() {
|
|
|
-
|
|
|
+ this.$refs.form.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ console.log(this.form);
|
|
|
+ this.$message.success('提交成功')
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
//暂存
|
|
|
onSave() {
|
|
|
@@ -220,6 +283,7 @@ export default {
|
|
|
submitPeople(peopleList) {
|
|
|
console.log(peopleList);
|
|
|
this.peopleList = peopleList;
|
|
|
+ this.form.peopleList = peopleList;
|
|
|
this.peopleOpen = false;
|
|
|
},
|
|
|
//获取状态
|
