240 lines
7.2 KiB
Vue
240 lines
7.2 KiB
Vue
<template>
|
|
<div class="vdetails">
|
|
<el-page-header @back="goBack" content="面试者详情页面"> </el-page-header>
|
|
<el-card class="box-card">
|
|
<h3 class="Maintitle">面试者详细情况介绍</h3>
|
|
<el-form label-position="left" label-width="180px" :model="formdetails">
|
|
<el-form-item label="录入时间">
|
|
<el-input v-model="formdetails.date" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="姓名">
|
|
<el-input v-model="formdetails.name" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="面试邀约时间">
|
|
<el-input v-model="formdetails.iitime" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="邀约人">
|
|
<el-input v-model="formdetails.iperson" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="面试类型">
|
|
<el-input v-model="formdetails.itype" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="是否到面">
|
|
<el-input v-model="formdetails.toface" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="是否试岗">
|
|
<el-input v-model="formdetails.trialpost" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="是否到岗">
|
|
<el-input
|
|
v-model="formdetails.toposition"
|
|
:disabled="true"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="性别">
|
|
<el-input v-model="formdetails.gender" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="年龄">
|
|
<el-input v-model="formdetails.age" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="面试岗位">
|
|
<el-input v-model="formdetails.iposition" :disabled="true"></el-input>
|
|
</el-form-item>-
|
|
<el-form-item label="目前职业">
|
|
<el-input
|
|
v-model="formdetails.currentOccupation"
|
|
:disabled="true"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="毕业学校">
|
|
<el-input
|
|
v-model="formdetails.graduateSchool"
|
|
:disabled="true"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="学历">
|
|
<el-input v-model="formdetails.education" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="毕业时间">
|
|
<el-input
|
|
v-model="formdetails.graduationTime"
|
|
:disabled="true"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="专业">
|
|
<el-input v-model="formdetails.major" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="校企合作单位">
|
|
<el-input v-model="formdetails.secUnit" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="电话">
|
|
<el-input v-model="formdetails.telephone" :disabled="true"></el-input>
|
|
</el-form-item>
|
|
<!-- 上传照片 -->
|
|
<el-form-item label="照片" style="height: 200px">
|
|
<div class="uploade">
|
|
<el-upload
|
|
action="#"
|
|
list-type="picture-card"
|
|
@click="xianshi"
|
|
v-if="show"
|
|
:auto-upload="false"
|
|
>
|
|
<i slot="default" class="el-icon-plus"></i>
|
|
<div slot="file" slot-scope="{ file }">
|
|
<img
|
|
class="el-upload-list__item-thumbnail"
|
|
:src="file.url"
|
|
alt=""
|
|
/>
|
|
<span class="el-upload-list__item-actions">
|
|
<span
|
|
class="el-upload-list__item-preview"
|
|
@click="handlePictureCardPreview(file)"
|
|
>
|
|
<i class="el-icon-zoom-in"></i>
|
|
</span>
|
|
<span
|
|
v-if="!disabled"
|
|
class="el-upload-list__item-delete"
|
|
@click="handleDownload(file)"
|
|
>
|
|
<i class="el-icon-download"></i>
|
|
</span>
|
|
<span
|
|
v-if="!disabled"
|
|
class="el-upload-list__item-delete"
|
|
@click="handleRemove(file)"
|
|
>
|
|
<i class="el-icon-delete"></i>
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</el-upload>
|
|
<el-dialog :visible.sync="dialogVisible">
|
|
<img width="100%" :src="dialogImageUrl" alt="" />
|
|
</el-dialog>
|
|
<el-button class="tijiao" type="primary" round size="mini"
|
|
>提交</el-button
|
|
>
|
|
</div>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
formdetails: {
|
|
date: "",//录入时间
|
|
name: "",//姓名
|
|
iitime: "",//面试邀约时间
|
|
iperson: "",//邀约人
|
|
itype: "",//面试类型
|
|
toface: "",//是否到面
|
|
trialpost: "",//是否试岗
|
|
toposition: "",//是否到岗
|
|
gender: "",//性别
|
|
age: "",//年龄
|
|
iposition: "",//面试岗位
|
|
currentOccupation: "",//目前职业
|
|
graduateSchool: "",//毕业学校
|
|
education: "",//学历
|
|
graduationTime: "",//毕业时间
|
|
major: "",//专业
|
|
secUnit: "",//校企合作单位
|
|
telephone: "",//电话
|
|
},
|
|
// 上传照片
|
|
dialogImageUrl: "",
|
|
show: true,
|
|
dialogVisible: false,
|
|
disabled: false,
|
|
};
|
|
},
|
|
methods: {
|
|
goBack() {
|
|
this.$router.push("/");
|
|
},
|
|
// 上传照片
|
|
// 是否显示上传框框
|
|
xianshi() {
|
|
console.log(this.show)
|
|
if (this.dialogImageUrl !== "") {
|
|
this.show = false;
|
|
}
|
|
},
|
|
// 删除
|
|
handleRemove(file) {
|
|
console.log(file);
|
|
console.log("11");
|
|
},
|
|
// 上传
|
|
handlePictureCardPreview(file) {
|
|
this.dialogImageUrl = file.url;
|
|
this.dialogVisible = true;
|
|
},
|
|
// 下载
|
|
handleDownload(file) {
|
|
console.log(file);
|
|
console.log("aa");
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="less" scoped>
|
|
.Maintitle {
|
|
margin: 0 auto;
|
|
margin-bottom: 50px;
|
|
}
|
|
.el-card {
|
|
width: 50%;
|
|
margin: 0 auto;
|
|
}
|
|
.el-card__body {
|
|
padding: 100px;
|
|
}
|
|
.el-input {
|
|
// width: 80%;
|
|
// float: right;
|
|
}
|
|
// 上传照片
|
|
.uploade {
|
|
width: 75%;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
}
|
|
.avatar-uploader,
|
|
.el-upload {
|
|
width: 178px;
|
|
height: 178px;
|
|
border: 1px dashed #8c8989;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
position: relative;
|
|
overflow: hidden;
|
|
// background-color: #409eff;
|
|
}
|
|
.avatar-uploader .el-upload:hover {
|
|
border-color: #409eff;
|
|
}
|
|
.avatar-uploader-icon {
|
|
font-size: 28px;
|
|
color: #8c939d;
|
|
width: 178px;
|
|
height: 178px;
|
|
line-height: 178px;
|
|
text-align: center;
|
|
}
|
|
.avatar {
|
|
width: 178px;
|
|
height: 178px;
|
|
display: block;
|
|
}
|
|
.tijiao {
|
|
height: 50px;
|
|
}
|
|
</style>
|