描述:访客预约

This commit is contained in:
SelfRidicule 2024-04-05 15:30:29 +08:00
parent e6fa3a3666
commit d9944cacf1
3 changed files with 193 additions and 28 deletions

View File

@ -58,10 +58,11 @@ export function selectUserByCustomer(id) {
}) })
} }
export function selectCustomer () { export function selectCustomer (parameter) {
return axios({ return axios({
url: api.visitorPerson + '/selectCustomer', url: api.visitorPerson + '/selectCustomer',
method: 'get', method: 'get',
params: parameter
}) })
} }

View File

@ -10,6 +10,25 @@
<span style='display: block;margin-top: 11px;font-size: 15px'>访客详情</span> <span style='display: block;margin-top: 11px;font-size: 15px'>访客详情</span>
</div> </div>
<a-form-model :model='form' :label-col='labelCol' :wrapper-col='wrapperCol'> <a-form-model :model='form' :label-col='labelCol' :wrapper-col='wrapperCol'>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='地区'>
{{ form.userName }}
</a-form-item>
</a-col>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='园区'>
{{ form.tenantName }}
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访单位'>
{{ form.customerName }}
</a-form-item>
</a-col>
</a-row>
<a-row> <a-row>
<a-col :span='10'> <a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访人员'> <a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访人员'>
@ -23,11 +42,6 @@
</a-col> </a-col>
</a-row> </a-row>
<a-row> <a-row>
<a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访单位'>
{{ form.customerName }}
</a-form-item>
</a-col>
<a-col :span='10'> <a-col :span='10'>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='来访人照片'> <a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='来访人照片'>
<img :src='baseUrl + form.photo' style='max-width: 80px; max-height: 80px'> <img :src='baseUrl + form.photo' style='max-width: 80px; max-height: 80px'>

View File

@ -14,10 +14,24 @@
<a-form-item style='display:none'> <a-form-item style='display:none'>
<a-input v-decorator="['version']" /> <a-input v-decorator="['version']" />
</a-form-item> </a-form-item>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='所属地区'>
<a-select v-decorator="['tenantId', {rules: [{ required: true, message: '请选择所属地区' }]}]"
@change='selectTenant'
:disabled='tenantEnable'>
<a-select-option v-for='item in tenantList' :key='item.id'>{{ item.name }}</a-select-option>
</a-select>
</a-form-item>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='所属园区'>
<a-select v-decorator="['parkId', {rules: [{ required: true, message: '请选择所属园区' }]}]"
@change='selectPark'
:disabled='parkEnable'>
<a-select-option v-for='item in parkList' :key='item.id'>{{ item.name }}</a-select-option>
</a-select>
</a-form-item>
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访单位'> <a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访单位'>
<a-select v-decorator="['customerId',{rules: [{ required: true, message: '请选择被访单位' }]}]" <a-select v-decorator="['customerId',{rules: [{ required: true, message: '请选择被访单位' }]}]"
placeholder='请选择被访单位' placeholder='请选择被访单位'
@change='getPersonList'> @change='selectEnterprise'>
<a-select-option v-for='item in enterpriseList' :key='item.id' :value='item.id'> <a-select-option v-for='item in enterpriseList' :key='item.id' :value='item.id'>
{{ item.name }} {{ item.name }}
</a-select-option> </a-select-option>
@ -26,7 +40,7 @@
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访人姓名'> <a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='被访人姓名'>
<a-select v-decorator="['userId',{rules: [{ required: true, message: '请选择被访人姓名' }]}]" <a-select v-decorator="['userId',{rules: [{ required: true, message: '请选择被访人姓名' }]}]"
placeholder='请选择被访人姓名' placeholder='请选择被访人姓名'
@change='getPersonData'> @change='selectPerson'>
<a-select-option v-for='item in personList' :key='item.id' :value='item.id'> <a-select-option v-for='item in personList' :key='item.id' :value='item.id'>
{{ item.mobile + '-' + item.username }} {{ item.mobile + '-' + item.username }}
</a-select-option> </a-select-option>
@ -105,10 +119,14 @@
</template> </template>
<script> <script>
import { saveVisitorPerson, selectUserByCustomer, selectCustomer } from '@/api/admin/meeting/visitorPerson' import { saveVisitorPerson, selectUserByCustomer, selectCustomer } from '@/api/admin/meeting/visitorPerson'
import { getInfo } from '@/api/login'
import { getTenantList } from '@/api/tenant'
import { getParkList } from '@/api/admin/park'
import pick from 'lodash.pick' import pick from 'lodash.pick'
import { getRoomListByFloorId } from '@/api/admin/meeting/roomContent' import { getRoomListByFloorId } from '@/api/admin/meeting/roomContent'
import storage from 'store' import storage from 'store'
import { ACCESS_TOKEN } from '@/store/mutation-types' import { ACCESS_TOKEN } from '@/store/mutation-types'
import { getBuildingList } from '@/api/admin/building'
export default { export default {
@ -129,8 +147,6 @@ export default {
confirmLoading: false, confirmLoading: false,
mdl: {}, mdl: {},
form: this.$form.createForm(this), form: this.$form.createForm(this),
enterpriseList: [],
personList: [],
idcardTypeList: [{ idcardTypeList: [{
name: '居民身份证' name: '居民身份证'
}], }],
@ -138,30 +154,131 @@ export default {
imageUrl: '', imageUrl: '',
headers: { headers: {
Authorization: 'Bearer ' + storage.get(ACCESS_TOKEN) Authorization: 'Bearer ' + storage.get(ACCESS_TOKEN)
} },
userDetail: {},
tenantList: [], //
parkList: [], //
enterpriseList: [], //
personList: [], //
tenantEnable: false,
parkEnable: false
} }
}, },
beforeCreate() { beforeCreate() {
}, },
created() { created() {
},
methods: {
//
getUserDetail() {
getInfo().then(res => {
console.log('getUserDetail', res)
this.userDetail = res
// 5
if (this.userDetail.roleIds && this.userDetail.roleIds.length > 0 && this.userDetail.roleIds[0] == 5) {
//
//
let { id } = this.mdl
if (!id) {
// ->
this.selectTenant(this.userDetail.tenantId)
// ->
this.selectPark(this.userDetail.parkId)
}
//
//
this.tenantEnable = true
this.parkEnable = true
//
this.mdl.parkId = this.userDetail.parkId
this.mdl.tenantId = this.userDetail.tenantId
this.form.setFieldsValue({
parkId: this.mdl.parkId,
tenantId: this.mdl.tenantId
})
}
})
},
//
getTenantData() {
getTenantList().then(res => {
this.tenantList = res.rows
})
},
// ->
selectTenant(id) {
console.log('selectTenant', id)
//
this.mdl.parkId = null //
this.mdl.customerId = null //
this.mdl.userId = null //
this.mdl.mobile = null //
this.form.setFieldsValue({
parkId: null, //
customerId: null, //
userId: null, //
mobile: null //
})
//
getParkList({
tenantId: id
}).then(res => {
this.parkList = res.rows
})
},
// ->
selectPark(id) {
//
this.mdl.customerId = null //
this.mdl.userId = null //
this.mdl.mobile = null //
this.form.setFieldsValue({
customerId: null, //
userId: null, //
mobile: null //
})
// //
selectCustomer().then(res => { selectCustomer({
parkId: id
}).then(res => {
console.log('selectCustomer', res) console.log('selectCustomer', res)
this.enterpriseList = res.data this.enterpriseList = res.data
}) })
}, },
methods: { // ->
getPersonList(value) { selectEnterprise(id, userId) {
console.log('getPersonList', value) //
selectUserByCustomer(value).then(res => { this.mdl.userId = null //
this.mdl.mobile = null //
this.form.setFieldsValue({
userId: null, //
mobile: null //
})
//
selectUserByCustomer(id).then(res => {
console.log('selectUserByCustomer', res) console.log('selectUserByCustomer', res)
this.personList = res.data this.personList = res.data
this.form.setFieldsValue({ mobile: null, userId: null }) // -> ""
if (userId) {
this.selectPerson(userId)
}
}) })
}, },
getPersonData(value) { // -> ""
console.log('getPersonData', value) selectPerson(id) {
this.form.setFieldsValue({ mobile: this.personList.find(item => item.id == value).mobile }) //
this.mdl.mobile = null //
this.form.setFieldsValue({
mobile: null //
})
console.log('this.personList', this.personList)
console.log('id', id)
this.form.setFieldsValue({ mobile: this.personList.find(item => item.id == id).mobile })
}, },
beforeUpload(file) { beforeUpload(file) {
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png' const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'
@ -202,18 +319,51 @@ export default {
reader.readAsDataURL(img) reader.readAsDataURL(img)
}, },
add() { add() {
this.mdl = {}
this.form.resetFields() this.form.resetFields()
this.edit({ id: 0 }) this.edit({ id: 0 })
this.imageUrl = null
}, },
edit(record) { edit(record) {
this.mdl = Object.assign(record) this.mdl = Object.assign(this.mdl, record)
let copyMdl = JSON.parse(JSON.stringify(this.mdl))
//
this.getTenantData()
//
if (record.id) { //
// ->
if (copyMdl.tenantId) {
this.mdl = JSON.parse(JSON.stringify(copyMdl))
this.selectTenant(copyMdl.tenantId)
}
// ->
if (copyMdl.parkId) {
this.mdl = JSON.parse(JSON.stringify(copyMdl))
this.selectPark(copyMdl.parkId)
}
// -> , -> ""
if (copyMdl.customerId) {
this.mdl = JSON.parse(JSON.stringify(copyMdl))
this.selectEnterprise(copyMdl.customerId, copyMdl.userId)
}
//
this.mdl = JSON.parse(JSON.stringify(copyMdl))
} else { //
}
//
this.getUserDetail()
//
this.visible = true this.visible = true
this.$nextTick(() => { this.$nextTick(() => {
this.form.setFieldsValue(pick(this.mdl, 'id', 'userId', 'customerId', 'intervieweeId', 'name', 'phone', 'joinTime', 'visitTime', 'leaveTime', 'visitContent', 'cardType', 'cardNo', 'status', 'createBy', 'createTime', 'updateBy', 'updateTime', 'version', 'deleteFlag', 'photo')) this.form.setFieldsValue(pick(this.mdl, 'id', 'tenantId', 'parkId', 'customerId', 'userId', 'mobile', 'intervieweeId',
'name', 'phone', 'joinTime', 'visitTime', 'leaveTime', 'visitContent', 'cardType',
'cardNo', 'status', 'createBy', 'createTime', 'updateBy', 'updateTime', 'version', 'deleteFlag', 'photo'))
}) })
if (this.mdl.photo) { if (this.mdl.photo) {
this.imageUrl = process.env.VUE_APP_API_BASE_URL + this.mdl.photo this.imageUrl = process.env.VUE_APP_API_BASE_URL + this.mdl.photo
} else {
this.imageUrl = null
} }
}, },
handleSubmit(e) { handleSubmit(e) {