<template>
|
<div class="app-container">
|
<el-col :span="6">
|
<el-input size="medium" v-model="input" placeholder="搜索" clearable>
|
<i slot="prefix" class="el-input__icon el-icon-search"></i>
|
</el-input>
|
</el-col>
|
<br>
|
<h1 style="font-size:21px">个人简历</h1>
|
<el-divider />
|
<h2 style="font-size:16px">基本信息</h2>
|
|
<el-container>
|
<div style="padding-left:30px">
|
<el-container>
|
<el-col>
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="70px" label-position="left">
|
<el-row :span="6">
|
<el-form-item label="姓名" prop="nickName">
|
<el-input v-model="formData.nickName" placeholder="请输入姓名" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="6">
|
<el-form-item label="曾用名" prop="oldName">
|
<el-input v-model="formData.oldName" placeholder="请输入曾用名" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="8">
|
<el-form-item label="身份证号" prop="idNum">
|
<el-input v-model="formData.idNum" placeholder="请输入身份证号" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:70px">
|
<el-container>
|
<el-col >
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="60px" label-position="left">
|
<el-row :span="6">
|
<el-form-item label="性别" prop="sex">
|
<el-input v-model="formData.sex" placeholder="请输入性别" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="6">
|
<el-form-item label="民族" prop="nation">
|
<el-input v-model="formData.nation" placeholder="请输入民族" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="8">
|
<el-form-item label="联系方式" prop="phoneNumber">
|
<el-input v-model="formData.phoneNumber" placeholder="请输入联系方式" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:70px">
|
<el-container>
|
<el-col>
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="60px" label-position="left">
|
<el-row :span="6">
|
<el-form-item label="国籍" prop="nationality">
|
<el-input v-model="formData.nationality" placeholder="请输入国籍" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="6">
|
<el-form-item label="婚姻状况" prop="maritalStatus">
|
<el-input v-model="formData.maritalStatus" placeholder="请输入婚姻状况" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:70px;padding-top:30px">
|
<el-row :gutter="6" >
|
<el-upload ref="ref1"
|
action=""
|
:file-list="fileList"
|
list-type="picture-card"
|
accept="image/*"
|
:auto-upload="false"
|
:multiple="false"
|
:limit="1">
|
<i class="el-icon-plus"></i>
|
</el-upload>
|
</el-row>
|
</div>
|
<div style="padding-left:50px;padding-top:30px" >
|
<el-container>
|
<el-row :span="2" style="flex-direction: column;">
|
<el-button type="primary" @click="submitForm">编辑</el-button>
|
<br>
|
<el-button type="primary" @click="submitForm">导入</el-button>
|
</el-row>
|
</el-container>
|
</div>
|
</el-container>
|
<el-container>
|
<div style="padding-left:30px">
|
<el-container>
|
<el-col>
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px" label-position="left">
|
<el-row :span="15">
|
<el-form-item label="户籍地址" prop="locationAddress">
|
<el-input v-model="formData.locationAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="15">
|
<el-form-item label="常住地址" prop="alwaysAddress">
|
<el-input v-model="formData.alwaysAddress" placeholder="请输入常住地址" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="15">
|
<el-form-item label="单位及职务职称" prop="position">
|
<el-input v-model="formData.position" placeholder="请输入单位及职务职称" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:30px">
|
<el-container>
|
<el-col>
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px" label-position="left">
|
<el-row :span="12">
|
<el-form-item label="户籍地公安机关" prop="locationPolice">
|
<el-input v-model="formData.locationPolice" placeholder="请输入户籍地公安机关" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="12">
|
<el-form-item label="常住地公安机关" prop=" alwaysPolice">
|
<el-input v-model="formData. alwaysPolice" placeholder="请输入常住地公安机关" clearable :style="{width: '100%'}">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
</el-container>
|
|
|
<div style="padding-top:30px">
|
<el-container>
|
<div style="width:100%"><h2 style="font-size:15px" >主要学习及工作经历</h2></div>
|
<el-button type="primary" icon="el-icon-edit" round></el-button>
|
<el-button type="primary" icon="el-icon-delete" round></el-button>
|
</el-container>
|
|
<el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
|
<el-table-column type="selection" width="16" align="center" />
|
<el-table-column label="起止日期" prop="startDate" sortable width="300" align="center" />
|
<el-table-column label="主要学习经历、工作单位及任职情况" prop="content" sortable width="350" align="center" />
|
<el-table-column label="证明人" prop="witness" sortable width="300" align="center" />
|
<el-table-column label="删除" align="center" class-name="small-padding fixed-width" sortable width="100">
|
|
</el-table-column>
|
</el-table>
|
</div>
|
|
<div style="padding-top:30px">
|
<el-container>
|
<div style="width:100%"><h2 style="font-size:15px" >家庭成员及主要社会关系情况</h2></div>
|
<el-button type="primary" icon="el-icon-edit" round></el-button>
|
<el-button type="primary" icon="el-icon-delete" round></el-button>
|
</el-container>
|
<!-- :data =""内的东西不知道要不要改-->
|
<el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
|
<el-table-column type="selection" width="16" align="center" />
|
<el-table-column label="与本人关系" sortable width="270" align="center" />
|
<el-table-column label="姓名" sortable width="270" align="center" />
|
<el-table-column label="单位及职务" sortable width="270" align="center" />
|
<el-table-column label="政治面貌" sortable width="270" align="center">
|
</el-table-column>
|
</el-table>
|
</div>
|
|
<el-container>
|
<div style="width:100%"><h2 style="font-size:15px" >移居国(境)情况</h2></div>
|
|
</el-container>
|
|
<div style="padding-top:30px">
|
<el-container>
|
<div style="width:100%"><h2 style="font-size:15px" >持有出入境证件情况</h2></div>
|
<el-button type="primary" icon="el-icon-edit" round></el-button>
|
<el-button type="primary" icon="el-icon-delete" round></el-button>
|
</el-container>
|
<!-- :data =""内的东西不知道要不要改-->
|
<el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
|
<el-table-column type="selection" width="16" align="center" />
|
<el-table-column label="证件名称" sortable width="270" align="center" />
|
<el-table-column label="持有情况" sortable width="270" align="center" />
|
<el-table-column label="证件号码" sortable width="270" align="center" />
|
<el-table-column label="有效期" sortable width="270" align="center">
|
</el-table-column>
|
</el-table>
|
</div>
|
<div style="padding-top:30px">
|
<el-container>
|
<div style="width:100%"><h2 style="font-size:15px" >出国(境)情况</h2></div>
|
<el-button type="primary" icon="el-icon-edit" round></el-button>
|
<el-button type="primary" icon="el-icon-delete" round></el-button>
|
</el-container>
|
<el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
|
<el-table-column type="selection" width="16" align="center" />
|
<el-table-column label="起止日期" prop="startDate" sortable width="300" align="center" />
|
<el-table-column label="所到国家或者地区" prop="content" sortable width="350" align="center" />
|
<el-table-column label="事由(旅游、走访、探亲、继承财产、其他)" prop="witness" sortable width="300" align="center" />
|
<el-table-column label="删除" align="center" class-name="small-padding fixed-width" sortable width="100">
|
</el-table-column>
|
</el-table>
|
|
</div>
|
<pagination
|
v-show="total>0"
|
:total="total"
|
:page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize"
|
@pagination="getList"
|
/>
|
</div>
|
|
</template>
|
|
<script>
|
import {getIndividualInfo, getIndividualRelation, delIndividual, updateIndividual, addIndividual,listExperience,updateExperience,
|
addExperience,delExperience} from "@/api/self/index";
|
|
export default {
|
name: 'index',
|
components: {},
|
props: [],
|
|
data() {
|
return {
|
input: '',
|
filelist: [],
|
|
// 遮罩层
|
disabled: false,
|
|
loading: true,
|
// formData:[],
|
// 选中数组
|
ids: [],
|
// 非单个禁用
|
single: true,
|
// 非多个禁用
|
multiple: true,
|
// 显示搜索条件
|
showSearch: true,
|
// 总条数
|
total: 0,
|
// 个人经历数据
|
experiencelList: [],
|
// 弹出层标题
|
title: "",
|
// 是否显示弹出层
|
open: false,
|
// 是否显示弹出层(数据权限)
|
openDataScope: false,
|
menuExpand: false,
|
menuNodeAll: false,
|
deptExpand: true,
|
deptNodeAll: false,
|
// 日期范围
|
dateRange: [],
|
// 数据范围选项
|
fot:[".jpg",".jif"],
|
fileList:[
|
],
|
fileListOther:[
|
|
],
|
dsb:true,
|
btn:false,
|
|
formData: {
|
nickName: undefined,
|
oldName: undefined,
|
sex: undefined,
|
nationality: undefined,
|
nation: undefined,
|
maritalStatus: undefined,
|
idNum: undefined,
|
politicalOutlook: undefined,
|
phoneNumber: undefined,
|
locationAddress: undefined,
|
alwaysPolice: undefined,
|
alwaysAddress: undefined,
|
position: undefined,
|
locationPolice: undefined,
|
},
|
rules: {
|
nickName: [{
|
required: true,
|
message: '请输入姓名',
|
trigger: 'blur'
|
}],
|
sex: [{
|
required: true,
|
message: '请输入性别',
|
trigger: 'blur'
|
}],
|
nationality: [{
|
required: true,
|
message: '请输入国籍',
|
trigger: 'blur'
|
}],
|
oldName: [{
|
required: true,
|
message: '请输入曾用名',
|
trigger: 'blur'
|
}],
|
nation: [{
|
required: true,
|
message: '请输入民族',
|
trigger: 'blur'
|
}],
|
idNum: [{
|
// required: true,
|
message: '请输入身份证号',
|
trigger: 'blur'
|
}],
|
maritalStatus: [{
|
// required: true,
|
message: '请输入婚姻状况',
|
trigger: 'blur'
|
}],
|
phoneNumber: [{
|
// required: true,
|
message: '请输入联系方式',
|
trigger: 'blur'
|
}],
|
locationAddress: [{
|
// required: true,
|
message: '请输入户籍地址',
|
trigger: 'blur'
|
}],
|
locationPolice: [{
|
// required: true,
|
message: '请输入户籍地公安机关',
|
trigger: 'blur'
|
}],
|
alwaysAddress: [{
|
// required: true,
|
message: '请输入常住地址',
|
trigger: 'blur'
|
}],
|
alwaysPolice: [{
|
// required: true,
|
message: '请输入常住地公安机关',
|
trigger: 'blur'
|
}],
|
position: [{
|
// required: true,
|
message: '请输入单位及职务职称',
|
trigger: 'blur'
|
}],
|
},
|
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 5,
|
startDate:undefined,
|
content:undefined,
|
witness:undefined,
|
createTime:undefined
|
},
|
}
|
},
|
computed: {},
|
watch: {},
|
created() {
|
this.getList();
|
// this.getCateInfor()
|
},
|
mounted() {},
|
methods: {
|
submitForm() {
|
this.$refs['elForm'].validate(valid => {
|
if (!valid) return
|
// TODO 提交表单
|
})
|
},
|
resetForm() {
|
this.$refs['elForm'].resetFields()
|
},
|
fillFormData(){
|
let formData = new FormData();
|
let photo = this.$refs['ref1'].uploadFiles[0];
|
if(photo===undefined){
|
this.$message.error("请选择照片");
|
return false;
|
}
|
if(photo!==undefined){
|
formData.append('照片', photo.raw);//根据后端需要的参数进行相应更改,大多是文件格式
|
}
|
return formData;
|
},
|
dialogConfirm() {
|
let formData=this.fillFormData();
|
if(this.dialogMode ==='edit'){//dialogMode用于判断当前时添加还是编辑
|
this.api.update(formData).then(res => {//调用修改接口
|
if (res.data.code == "OK") {
|
this.$message({
|
type: "success",
|
message: "修改成功!",
|
duration:5000
|
});
|
this.fileList=[];
|
} else {
|
this.$message.error(res.data.message);
|
}
|
},()=>{
|
this.$message.error("修改失败");
|
}).finally(()=>{
|
});
|
}else{
|
this.api.insert(formData).then(res => {//添加接口
|
if (res.data.code == "OK") {
|
this.$message({
|
type: "success",
|
message: "新建成功!",
|
duration:5000
|
});
|
this.fileList=[];
|
} else {
|
this.$message.error(res.data.message);
|
}
|
},()=>{
|
this.$message.error("新建失败");
|
}).finally(()=>{
|
});
|
}
|
},
|
//点击编辑时图片回显
|
edit(info){//info=>后台接口返回的数据
|
let url=this.baseUrl+info.photo//url的地址根据项目实际需要,info.photo=>图片路径,this.baseUrl=>上传的网络地址
|
this.fileList=[];
|
this.fileList.push({
|
'url': url
|
})
|
this.dialogMode='edit';//设置为编辑
|
},
|
onCreateNew(){
|
this.fileList=[];
|
this.dialogMode='create';//设置为添加
|
},
|
/** 个人信息列表 */
|
getList() {
|
this.loading = true;
|
// console.log(this.queryParams)
|
// listProperty(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
listExperience(this.queryParams).then(response => {
|
// alert(123)
|
// console.log(response.data)
|
this.experiencelList = response.data.data;
|
|
this.total = response.data.total;
|
this.loading = false;
|
}
|
|
);
|
},
|
|
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|