<template>
|
<GlobalWindow
|
title="新增访客预约"
|
width="600px"
|
:visible.sync="isShowModal"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<el-form :model="param" ref="paramRef" :rules="rules" >
|
<div class="title_tip">访客信息</div>
|
<el-form-item label="访客姓名" prop="name">
|
<el-input v-model="param.name" placeholder="请输入访客的姓名"></el-input>
|
</el-form-item>
|
<el-form-item label="访客手机号" prop="phone">
|
<el-input v-model="param.phone" placeholder="请输入访客的手机号"></el-input>
|
</el-form-item>
|
<el-form-item label="证件类型" prop="idcardType">
|
<el-select v-model="param.idcardType" placeholder="请选择">
|
<el-option label="身份证" :value="0" />
|
<el-option label="港澳证件" :value="1" />
|
<el-option label="护照" :value="2" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="证件号码" prop="idcardNo">
|
<el-input maxlength="18" v-model="param.idcardNo" placeholder="请输入访客的证件号码"></el-input>
|
</el-form-item>
|
<el-form-item label="来访单位" prop="companyName">
|
<el-input v-model="param.companyName" placeholder="请输入来访的单位全称"></el-input>
|
</el-form-item>
|
<el-form-item label="人脸照片" prop="faceImgUrl">
|
<UploadFaceImg
|
:file="{ 'imgurlfull': param.faceImgUrl, 'imgurl': param.faceImg }"
|
:uploadData="uploadData"
|
@uploadSuccess="uploadAvatarSuccess"
|
@uploadEnd="isUploading = false"
|
@uploadBegin="isUploading = true"
|
/>
|
</el-form-item>
|
|
<div class="title_tip" style="marginTop: 60px;">访客预约</div>
|
<el-form-item label="被访人" prop="receptMemberId">
|
<el-select v-model="param.receptMemberId" placeholder="请选择">
|
<el-option v-for="item in memberList" :key="item.id" :label="item.name + ' ' + item.companyName" :value="item.id" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="入园时间" prop="starttime">
|
<el-date-picker
|
v-model="param.starttime"
|
format="yyyy-MM-dd HH:mm"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
type="datetime"
|
default-time="08:00:00"
|
/>
|
</el-form-item>
|
<el-form-item label="离园时间" prop="endtime">
|
<el-date-picker
|
v-model="param.endtime"
|
format="yyyy-MM-dd HH:mm"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
type="datetime"
|
default-time="08:00:00"
|
/>
|
</el-form-item>
|
<el-form-item label="来访事由" prop="reason">
|
<el-select v-model="param.reason" placeholder="请选择">
|
<el-option v-for="item in VisitReason" :key="item.id" :label="item.title" :value="item.title" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="是否施工作业" prop="type">
|
<el-switch
|
style="width: 200px"
|
v-model="param.type"
|
:active-value="1"
|
:inactive-value="0">
|
</el-switch>
|
</el-form-item>
|
<el-form-item v-if="param.type == 1" label="施工内容" prop="constructionReason">
|
<el-input v-model="param.constructionReason" placeholder="请输入施工内容"></el-input>
|
</el-form-item>
|
<el-form-item label="随行车辆" prop="carNos">
|
<el-input v-model="param.carNos" placeholder="请输入车牌号"></el-input>
|
</el-form-item>
|
</el-form>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import UploadFaceImg from '@/components/common/UploadFaceImg'
|
import { createFk, getVisitedVisitReason, getVisitedMember } from '@/api/business/visits'
|
export default {
|
name: 'OperaVisitsHkWindow',
|
extends: BaseOpera,
|
components: {
|
GlobalWindow,
|
UploadFaceImg
|
},
|
data () {
|
return {
|
isShowModal: false,
|
param: {
|
type: 0,
|
idcardType: 0
|
},
|
|
VisitReason: [],
|
memberList: [],
|
uploadData: {
|
folder: 'member'
|
},
|
rules: {
|
starttime: [{ required: true, message: '请选择日期', trigger: 'change' }],
|
endtime: [{ required: true, message: '请选择日期', trigger: 'change' }],
|
reason: [{ required: true, message: '请选择', trigger: 'change' }],
|
type: [{ required: true, message: '请选择', trigger: 'change' }],
|
idcardType: [{ required: true, message: '请选择', trigger: 'change' }],
|
faceImgUrl: [{ required: true, message: '请上传', trigger: 'change' }],
|
|
name: [{ required: true, message: '请输入', trigger: 'blur' }],
|
idcardNo: [{ required: true, message: '请输入', trigger: 'blur' }],
|
companyName: [{ required: true, message: '请输入', trigger: 'blur' }],
|
phone: [{ required: true, message: '请输入', trigger: 'blur' }],
|
carNos: [{ required: true, message: '请输入', trigger: 'blur' }],
|
constructionReason: [{ required: true, message: '请输入', trigger: 'blur' }],
|
}
|
}
|
},
|
created () {
|
this.$set(this.param, 'receptMemberId', this.$store.state.userInfo.memberId)
|
this.initData()
|
},
|
methods: {
|
initData () {
|
getVisitedVisitReason({}).then(res => {
|
this.VisitReason = res || []
|
})
|
getVisitedMember({}).then(res => {
|
this.memberList = res || []
|
})
|
},
|
uploadAvatarSuccess (file) {
|
this.$set(this.param, 'faceImg', file.imgurl)
|
this.$set(this.param, 'faceImgUrl', file.imgurlfull)
|
},
|
// 同步信息
|
confirm () {
|
this.$refs.paramRef.validate((valid) => {
|
if (!valid) {
|
return
|
}
|
// 调用新建接口
|
this.isWorking = true
|
createFk({
|
...this.param
|
})
|
.then(() => {
|
this.visible = false
|
this.$tip.apiSuccess('提交成功')
|
this.$emit('success')
|
this.$emit('close')
|
})
|
.catch(e => {
|
this.$tip.apiFailed(e)
|
})
|
.finally(() => {
|
this.isWorking = false
|
})
|
})
|
}
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
.title_tip{
|
font-size: 18px;
|
font-weight: 600;
|
margin-bottom: 10px;
|
}
|
</style>
|