mirror of
https://gitee.com/elegant_wings/dbd-meeting-html.git
synced 2025-06-21 05:39:36 +08:00
描述:企业用户管理
This commit is contained in:
parent
3bc437329e
commit
e9986b1274
@ -1,48 +1,55 @@
|
||||
<template>
|
||||
<a-modal
|
||||
title="操作"
|
||||
style="top: 20px;"
|
||||
:width="800"
|
||||
v-model="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleSubmit"
|
||||
title='操作'
|
||||
style='top: 20px;'
|
||||
:width='800'
|
||||
v-model='visible'
|
||||
:confirmLoading='confirmLoading'
|
||||
@ok='handleSubmit'
|
||||
>
|
||||
<a-form :form="form">
|
||||
<a-form-item style="display:none">
|
||||
<a-input v-decorator="['id']"/>
|
||||
<a-form :form='form'>
|
||||
<a-form-item style='display:none'>
|
||||
<a-input v-decorator="['id']" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="姓名">
|
||||
<a-input placeholder="姓名" v-decorator="['username', {rules: [{required: true, message: '请输入姓名'}]}]"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='企业'>
|
||||
<a-select v-decorator="['icsCustomerId',{rules: [{ required: true, message: '请选择企业' }]}]"
|
||||
placeholder='企业'>
|
||||
<a-select-option v-for='item in customerList' :key='item.id' :value='item.id'>
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="电话">
|
||||
<a-input placeholder="电话" v-decorator="['mobile', {rules: [{required: true, message: '请输入电话'}]}]"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='姓名'>
|
||||
<a-input placeholder='姓名' v-decorator="['name', {rules: [{required: true, message: '请输入姓名'}]}]" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="用户性别">
|
||||
<a-radio-group @change="onChange" v-decorator="['gender',{rules: [{required: true, message: '请选择性别'}]}]" >
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='电话'>
|
||||
<a-input placeholder='电话' v-decorator="['mobile', {rules: [{required: true, message: '请输入电话'}]}]" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='用户性别'>
|
||||
<a-radio-group @change='onChange' v-decorator="['gender',{rules: [{required: true, message: '请选择性别'}]}]">
|
||||
<a-radio :value="'0'">男</a-radio>
|
||||
<a-radio :value="'1'">女</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='照片'>
|
||||
<!-- <a-input placeholder="室内图片url" v-decorator="['indoorPicUrl']" />-->
|
||||
<a-upload
|
||||
v-decorator="['photo']"
|
||||
v-decorator="['photo' ,{rules: [{required: true, message: '请上传照片'}]}]"
|
||||
list-type='picture-card'
|
||||
class='avatar-uploader'
|
||||
:show-upload-list='false'
|
||||
:action='uploadUrl'
|
||||
:headers='headers'
|
||||
:before-upload='beforeUpload'
|
||||
@change='handleChange'
|
||||
:before-upload='photoBeforeUpload'
|
||||
@change='photoHandleChange'
|
||||
>
|
||||
<img v-if='imageUrl' :src='imageUrl' style='width: 102px; height: 102px' />
|
||||
<img v-if='photoImageUrl' :src='photoImageUrl' style='width: 102px; height: 102px' />
|
||||
<div v-else>
|
||||
<a-icon :type="loading ? 'loading' : 'plus'" />
|
||||
<a-icon :type="photoLoading ? 'loading' : 'plus'" />
|
||||
<div class='ant-upload-text'> 上传</div>
|
||||
</div>
|
||||
</a-upload>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='照片'>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='头像'>
|
||||
<a-upload
|
||||
v-decorator="['avatar']"
|
||||
list-type='picture-card'
|
||||
@ -50,33 +57,33 @@
|
||||
:show-upload-list='false'
|
||||
:action='uploadUrl'
|
||||
:headers='headers'
|
||||
:before-upload='beforeUpload1'
|
||||
@change='handleChange1'
|
||||
:before-upload='avatarBeforeUpload'
|
||||
@change='avatarHandleChange'
|
||||
>
|
||||
<img v-if='imageUrl' :src='imageUrl' style='width: 102px; height: 102px' />
|
||||
<img v-if='avatarImageUrl' :src='avatarImageUrl' style='width: 102px; height: 102px' />
|
||||
<div v-else>
|
||||
<a-icon :type="loading ? 'loading' : 'plus'" />
|
||||
<a-icon :type="avatarLoading ? 'loading' : 'plus'" />
|
||||
<div class='ant-upload-text'> 上传</div>
|
||||
</div>
|
||||
</a-upload>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="用户昵称">
|
||||
<a-input placeholder="用户昵称" v-decorator="['username']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='昵称'>
|
||||
<a-input placeholder='昵称' v-decorator="['username']" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="身份证号">
|
||||
<a-input placeholder="身份证号" v-decorator="['cardNo']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='身份证号'>
|
||||
<a-input placeholder='身份证号' v-decorator="['cardNo']" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="员工地址">
|
||||
<a-input placeholder="员工地址" v-decorator="['address']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='地址'>
|
||||
<a-input placeholder='地址' v-decorator="['address' ,{rules: [{required: true, message: '请输入地址'}]}]" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="邮箱">
|
||||
<a-input placeholder="邮箱" v-decorator="['email']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='邮箱'>
|
||||
<a-input placeholder='邮箱' v-decorator="['email']" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="学历">
|
||||
<a-input placeholder="学历" v-decorator="['degree']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='学历'>
|
||||
<a-input placeholder='学历' v-decorator="['degree']" />
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="紧急联系人">
|
||||
<a-input placeholder="紧急联系人" v-decorator="['urgent']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='紧急联系人'>
|
||||
<a-input placeholder='紧急联系人' v-decorator="['urgent']" />
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
@ -84,16 +91,19 @@
|
||||
</template>
|
||||
<script>
|
||||
import { saveIcsCustomerStaff } from '@/api/admin/icsCustomerStaff'
|
||||
import {
|
||||
getCustomerList
|
||||
} from '@/api/admin/meeting/roomContent'
|
||||
|
||||
import pick from 'lodash.pick'
|
||||
import storage from 'store'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
|
||||
export default {
|
||||
name: 'IcsCustomerStaffModal',
|
||||
props: {
|
||||
},
|
||||
components: {
|
||||
},
|
||||
data () {
|
||||
props: {},
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
labelCol: {
|
||||
@ -111,16 +121,21 @@ export default {
|
||||
},
|
||||
confirmLoading: false,
|
||||
mdl: {},
|
||||
form: this.$form.createForm(this)
|
||||
form: this.$form.createForm(this),
|
||||
customerList: [],
|
||||
photoImageUrl: '',
|
||||
photoLoading: false,
|
||||
avatarImageUrl: '',
|
||||
avatarLoading: false
|
||||
}
|
||||
},
|
||||
beforeCreate () {
|
||||
beforeCreate() {
|
||||
},
|
||||
created () {
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
|
||||
beforeUpload(file) {
|
||||
// 照片
|
||||
photoBeforeUpload(file) {
|
||||
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'
|
||||
if (!isJpgOrPng) {
|
||||
this.$message.error('You can only upload JPG file!')
|
||||
@ -131,9 +146,9 @@ export default {
|
||||
}
|
||||
return isJpgOrPng && isLt2M
|
||||
},
|
||||
handleChange(info) {
|
||||
photoHandleChange(info) {
|
||||
if (info.file.status === 'uploading') {
|
||||
this.loading = true
|
||||
this.photoLoading = true
|
||||
return
|
||||
}
|
||||
if (info.file.status === 'done') {
|
||||
@ -147,14 +162,14 @@ export default {
|
||||
})
|
||||
})
|
||||
// Get this url from response in real world.
|
||||
getBase64(info.file.originFileObj, imageUrl => {
|
||||
this.imageUrl = imageUrl
|
||||
this.loading = false
|
||||
this.getBase64(info.file.originFileObj, imageUrl => {
|
||||
this.photoImageUrl = imageUrl
|
||||
this.photoLoading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
beforeUpload1(file) {
|
||||
// 头像
|
||||
avatarBeforeUpload(file) {
|
||||
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'
|
||||
if (!isJpgOrPng) {
|
||||
this.$message.error('You can only upload JPG file!')
|
||||
@ -165,9 +180,9 @@ export default {
|
||||
}
|
||||
return isJpgOrPng && isLt2M
|
||||
},
|
||||
handleChange1(info) {
|
||||
avatarHandleChange(info) {
|
||||
if (info.file.status === 'uploading') {
|
||||
this.loading = true
|
||||
this.avatarLoading = true
|
||||
return
|
||||
}
|
||||
if (info.file.status === 'done') {
|
||||
@ -181,25 +196,45 @@ export default {
|
||||
})
|
||||
})
|
||||
// Get this url from response in real world.
|
||||
getBase64(info.file.originFileObj, imageUrl => {
|
||||
this.imageUrl = imageUrl
|
||||
this.loading = false
|
||||
this.getBase64(info.file.originFileObj, imageUrl => {
|
||||
this.avatarImageUrl = imageUrl
|
||||
this.avatarLoading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
add () {
|
||||
getBase64(img, callback) {
|
||||
const reader = new FileReader()
|
||||
reader.addEventListener('load', () => callback(reader.result))
|
||||
reader.readAsDataURL(img)
|
||||
},
|
||||
add() {
|
||||
this.form.resetFields()
|
||||
this.edit({ id: 0 })
|
||||
},
|
||||
edit (record) {
|
||||
edit(record) {
|
||||
// 查询企业
|
||||
getCustomerList().then(res => {
|
||||
console.log('getCustomerList', res)
|
||||
this.customerList = res.rows
|
||||
})
|
||||
this.mdl = Object.assign(record)
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'username', 'mobile', 'gender'))
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'icsCustomerId', 'name', 'mobile', 'gender', 'photo', 'avatar', 'username', 'cardNo', 'address', 'email', 'degree', 'urgent'))
|
||||
})
|
||||
//
|
||||
if (this.mdl.photo) {
|
||||
this.photoImageUrl = process.env.VUE_APP_API_BASE_URL + this.mdl.photo
|
||||
} else {
|
||||
this.photoImageUrl = ''
|
||||
}
|
||||
if (this.mdl.avatar) {
|
||||
this.avatarImageUrl = process.env.VUE_APP_API_BASE_URL + this.mdl.avatar
|
||||
} else {
|
||||
this.avatarImageUrl = ''
|
||||
}
|
||||
},
|
||||
handleSubmit (e) {
|
||||
handleSubmit(e) {
|
||||
e.preventDefault()
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user