mirror of
https://gitee.com/elegant_wings/dbd-meeting-html.git
synced 2025-06-21 04:29:36 +08:00
描述：用户管理选择用户
This commit is contained in:
SelfRidicule
parent
cd3fc1f20a
commit
0113927f92
@ -1,95 +1,97 @@
|
||||
<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-spin :spinning="spinning">
|
||||
<a-form :form="form">
|
||||
<a-form-item style="display:none">
|
||||
<a-input v-decorator="['id']"/>
|
||||
<a-spin :spinning='spinning'>
|
||||
<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-input placeholder='用户名'
|
||||
v-decorator="['username', {rules: [{ required: true, message: '请输入用户名' }]}]" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="昵称">
|
||||
<a-input v-decorator="['nickname', {rules: [{ required: true, message: '请输入昵称' }]}] "placeholder="起一个名字"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='昵称'>
|
||||
<a-input v-decorator="['nickname', {rules: [{ required: true, message: '请输入昵称' }]}] "
|
||||
placeholder='起一个名字' />
|
||||
</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="['mobile', {rules: [{ required: true, message: '请输入手机' }]}]" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="状态">
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='状态'>
|
||||
<a-select v-decorator="['status', {initialValue:'0',rules: [{ required: true, message: '请选择状态' }]}]">
|
||||
<a-select-option :value="'0'">正常</a-select-option>
|
||||
<a-select-option :value="'1'">禁用</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item v-if="tenantId !== null" :labelCol="labelCol" :wrapperCol="wrapperCol" label="部门">
|
||||
<a-form-item v-if='tenantId !== null' :labelCol='labelCol' :wrapperCol='wrapperCol' label='部门'>
|
||||
<a-tree-select
|
||||
v-decorator="['deptId', {rules: [{ required: true, message: '请选择部门' }]}]"
|
||||
:dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
|
||||
:treeData="deptTree"
|
||||
@change="onChange"
|
||||
placeholder="部门"
|
||||
:treeData='deptTree'
|
||||
@change='onChange'
|
||||
placeholder='部门'
|
||||
treeDefaultExpandAll
|
||||
>
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
<a-form-item v-if="tenantId === null" :labelCol="labelCol" :wrapperCol="wrapperCol" label="所属租户">
|
||||
<a-form-item v-if='tenantId === null' :labelCol='labelCol' :wrapperCol='wrapperCol' label='所属租户'>
|
||||
<a-select v-decorator="['tenantId', {rules: [{ required: true, message: '请选择所属租户' }]}]">
|
||||
<a-select-option v-for="item in tenantData" :key="item.value">{{ item.text }}</a-select-option>
|
||||
<a-select-option v-for='item in tenantData' :key='item.value'>{{ item.text }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item v-if="tenantId !== null" :labelCol="labelCol" :wrapperCol="wrapperCol" label="所属园区">
|
||||
<a-form-item v-if='tenantId !== null' :labelCol='labelCol' :wrapperCol='wrapperCol' label='所属园区'>
|
||||
<a-select v-decorator="['parkId', {rules: [{ required: true, message: '请选择所属园区' }]}]">
|
||||
<a-select-option v-for="item in parkData" :key="item.value">{{ item.text }}</a-select-option>
|
||||
<a-select-option v-for='item in parkData' :key='item.value'>{{ item.text }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="拥有角色" hasFeedback>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='拥有角色' hasFeedback>
|
||||
<a-select
|
||||
style="width: 100%"
|
||||
mode="multiple"
|
||||
style='width: 100%'
|
||||
mode='multiple'
|
||||
v-decorator="['roleIds', {rules: [{ required: true, message: '请选择角色' }]}]"
|
||||
:allowClear="true"
|
||||
:allowClear='true'
|
||||
>
|
||||
<a-select-option v-for="(action) in roleAll" :key="action.id" >{{ action.roleName }}</a-select-option>
|
||||
<a-select-option v-for='(action) in roleAll' :key='action.id'>{{ action.roleName }}</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-option v-for="item in customerList" :key="item.value" >{{ item.text }}</a-select-option>
|
||||
<a-select-option v-for='item in customerList' :key='item.value'>{{ item.text }}</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
|
||||
show-search
|
||||
v-decorator="['staffId', {rules: [{required: true, message: '请选择手机号码'}]}]"
|
||||
placeholder="请选择手机号码"
|
||||
style="width: 200px"
|
||||
:default-active-first-option="false"
|
||||
:show-arrow="false"
|
||||
:filter-option="false"
|
||||
:not-found-content="null"
|
||||
@search="handleSearch"
|
||||
@change="handleChange"
|
||||
placeholder='请选择手机号码'
|
||||
style='width: 200px'
|
||||
:default-active-first-option='false'
|
||||
:show-arrow='false'
|
||||
:filter-option='false'
|
||||
:not-found-content='null'
|
||||
@search='handleSearch'
|
||||
@change='handleChange'
|
||||
>
|
||||
<a-select-option v-for="item in data" :key="item.id">
|
||||
{{item-username}} -{{ item.mobile }}
|
||||
<a-select-option v-for='item in data' :value='item.id' :key='item.id'>
|
||||
{{ item.username }} -{{ item.mobile }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
|
||||
</a-form-item>
|
||||
|
||||
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="描述">
|
||||
<a-textarea :rows="3" placeholder="..." v-decorator="['remark']"/>
|
||||
<a-form-item :labelCol='labelCol' :wrapperCol='wrapperCol' label='描述'>
|
||||
<a-textarea :rows='3' placeholder='...' v-decorator="['remark']" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
@ -97,7 +99,7 @@
|
||||
</template>
|
||||
<script>
|
||||
import { getRoleAll, saveUser, getUser } from '@/api/system'
|
||||
import { saveCustomerContacts,getStaffList,updateStaff,getStaffListByUser } from '@/api/admin/customer'
|
||||
import { saveCustomerContacts, getStaffList, updateStaff, getStaffListByUser } from '@/api/admin/customer'
|
||||
|
||||
import {
|
||||
getCustomerList
|
||||
@ -106,6 +108,7 @@ import { getTenantList } from '@/api/tenant'
|
||||
import { getParkList } from '@/api/admin/park'
|
||||
import pick from 'lodash.pick'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'UserModal',
|
||||
props: {
|
||||
@ -117,7 +120,7 @@ export default {
|
||||
computed: {
|
||||
...mapGetters(['parkId', 'tenantId'])
|
||||
},
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
description: '列表使用场景：后台管理中的权限管理以及角色管理，可用于基于 RBAC 设计的角色权限控制，颗粒度细到每一个操作类型。',
|
||||
visible: false,
|
||||
@ -132,8 +135,8 @@ export default {
|
||||
confirmLoading: false,
|
||||
roleAll: [],
|
||||
mdl: {},
|
||||
data:[],
|
||||
customerList:[],
|
||||
data: [],
|
||||
customerList: [],
|
||||
deptCheck: true,
|
||||
spinning: false,
|
||||
tenantData: [],
|
||||
@ -141,10 +144,10 @@ export default {
|
||||
form: this.$form.createForm(this)
|
||||
}
|
||||
},
|
||||
beforeCreate () {
|
||||
beforeCreate() {
|
||||
},
|
||||
created () {
|
||||
getCustomerList().then(res =>{
|
||||
created() {
|
||||
getCustomerList().then(res => {
|
||||
res.rows.forEach(r => {
|
||||
this.customerList.push({ value: r.id, text: r.name })
|
||||
})
|
||||
@ -169,56 +172,54 @@ export default {
|
||||
this.loadRoleAll()
|
||||
},
|
||||
methods: {
|
||||
handleSearch(value){
|
||||
handleSearch(value) {
|
||||
let param = {
|
||||
mobile:value
|
||||
mobile: value
|
||||
}
|
||||
getStaffList(param).then(res =>{
|
||||
getStaffList(param).then(res => {
|
||||
this.data = res.rows
|
||||
})
|
||||
},
|
||||
handleChange(){
|
||||
handleChange() {
|
||||
|
||||
},
|
||||
add () {
|
||||
add() {
|
||||
this.form.resetFields()
|
||||
this.mdl = Object.assign({}, { id: 0, deptId: '' })
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'username', 'nickname', 'status', 'mobile', 'roleIds','staffId','customerId', 'remark', 'deptId', 'parkId', 'tenantId'))
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'username', 'nickname', 'status', 'mobile', 'roleIds', 'staffId', 'customerId', 'remark', 'deptId', 'parkId', 'tenantId'))
|
||||
})
|
||||
let param = {
|
||||
}
|
||||
getStaffListByUser(param).then(res =>{
|
||||
let param = {}
|
||||
getStaffListByUser(param).then(res => {
|
||||
this.data = res.rows
|
||||
|
||||
})
|
||||
},
|
||||
edit (record) {
|
||||
edit(record) {
|
||||
if (record.id > 0) {
|
||||
let param = {
|
||||
}
|
||||
getStaffListByUser(param).then(res => {
|
||||
this.data = res.rows
|
||||
|
||||
})
|
||||
//
|
||||
this.spinning = true
|
||||
getUser(record.id).then(res => {
|
||||
|
||||
|
||||
this.mdl = Object.assign({}, res)
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'username', 'nickname', 'status', 'mobile', 'roleIds','customerId','staffId', 'remark', 'deptId', 'parkId', 'tenantId'))
|
||||
this.form.setFieldsValue(pick(this.mdl, 'id', 'username', 'nickname', 'status', 'mobile', 'roleIds', 'customerId', 'staffId', 'remark', 'deptId', 'parkId', 'tenantId'))
|
||||
this.spinning = false
|
||||
// this.form.setFieldsValue({ ...record })
|
||||
|
||||
// 查询 选择用户
|
||||
getStaffListByUser({
|
||||
staffId: this.mdl.staffId
|
||||
}).then(res => {
|
||||
console.log('edit getStaffListByUser', res)
|
||||
this.data = res.rows
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
},
|
||||
onChange (value, label, extra) {
|
||||
onChange(value, label, extra) {
|
||||
if (extra.triggerNode.$children.length > 0) {
|
||||
this.$message.error('不能选择父节点' + `${label}`)
|
||||
this.deptCheck = false
|
||||
@ -226,12 +227,12 @@ export default {
|
||||
this.deptCheck = true
|
||||
}
|
||||
},
|
||||
loadRoleAll () {
|
||||
loadRoleAll() {
|
||||
getRoleAll().then(res => {
|
||||
this.roleAll = res.rows
|
||||
})
|
||||
},
|
||||
handleSubmit (e) {
|
||||
handleSubmit(e) {
|
||||
e.preventDefault()
|
||||
if (!this.deptCheck) {
|
||||
this.$message.error('不能选择父节点')
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user