master
parent
f4897c4ea2
commit
1a5823e903
@ -1,41 +1,49 @@
|
||||
import request from '@/utils/request';
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function index (params) {
|
||||
export function index(params) {
|
||||
return request({
|
||||
url: "/api/backend/role",
|
||||
method: "get",
|
||||
url: '/api/backend/role',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
export function save (data) {
|
||||
export function save(data) {
|
||||
return request({
|
||||
url: "/api/backend/role/save",
|
||||
method: "post",
|
||||
url: '/api/backend/role/save',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function destroy (data) {
|
||||
export function destroy(data) {
|
||||
return request({
|
||||
url: "/api/backend/role/delete",
|
||||
method: "post",
|
||||
url: '/api/backend/role/delete',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function getPermissions (params) {
|
||||
export function getPermissions(params) {
|
||||
return request({
|
||||
url: "/api/backend/role/get-permissions",
|
||||
method: "get",
|
||||
url: '/api/backend/role/get-permissions',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
export function setPermissions (data) {
|
||||
export function setPermissions(data) {
|
||||
return request({
|
||||
url: "/api/backend/role/set-permissions",
|
||||
method: "post",
|
||||
url: '/api/backend/role/set-permissions',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function batchUser(data) {
|
||||
return request({
|
||||
url: '/api/backend/role/batch-user',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
After Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 5.0 KiB After Width: | Height: | Size: 983 B |
|
After Width: | Height: | Size: 5.0 KiB |
@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<div>
|
||||
<vxe-modal
|
||||
:value="isShow"
|
||||
show-footer
|
||||
title="绑定用户"
|
||||
show-confirm-button
|
||||
:width="600"
|
||||
:height="600"
|
||||
esc-closable
|
||||
@input="e => $emit('update:isShow',e)"
|
||||
>
|
||||
<template>
|
||||
<vxe-table
|
||||
ref="table"
|
||||
stripe
|
||||
style="margin-top: 10px;"
|
||||
keep-source
|
||||
show-overflow
|
||||
:row-config="{ keyField: 'id' }"
|
||||
:column-config="{ resizable: true }"
|
||||
:checkbox-config="{ trigger: 'row', highlight: true, reserve: true }"
|
||||
:data="tableData"
|
||||
>
|
||||
<vxe-column type="checkbox" width="60" fixed="left" />
|
||||
<vxe-column type="seq" width="58" align="center" />
|
||||
<vxe-column field="name" width="140" title="姓名" />
|
||||
<vxe-column field="department.name" width="160" align="center" title="部门" />
|
||||
<vxe-column field="position" width="140" title="职位" align="center" />
|
||||
<vxe-column field="mobile" width="140" align="center" title="手机号" />
|
||||
</vxe-table>
|
||||
|
||||
<el-pagination
|
||||
style="margin-top: 10px;"
|
||||
:current-page="select.page"
|
||||
:page-sizes="[20, 30, 40, 50]"
|
||||
:page-size="select.rows"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
@size-change="e => {
|
||||
select.rows = e;
|
||||
select.page = 1;
|
||||
getUsers();
|
||||
}"
|
||||
@current-change="e => {
|
||||
select.page = e;
|
||||
getUsers();
|
||||
}"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template #footer>
|
||||
<el-button type="primary" :loading="loading" @click="submit">确认</el-button>
|
||||
</template>
|
||||
</vxe-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { index } from '@/api/user'
|
||||
import { batchUser } from '@/api/role'
|
||||
export default {
|
||||
props: {
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
|
||||
select: {
|
||||
page: 1,
|
||||
rows: 20,
|
||||
keyword: ''
|
||||
},
|
||||
|
||||
tableData: [],
|
||||
total: 0,
|
||||
form: {
|
||||
id: '',
|
||||
user_ids: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
'form.user_ids': function(val, oldVal) {
|
||||
this.setSelectRow()
|
||||
},
|
||||
isShow(newVal) {
|
||||
if (newVal) {
|
||||
this.getRoleUsers()
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getUsers()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* @param {array[string]} keys
|
||||
* @param {array[all]} values
|
||||
* @returns {void}
|
||||
*/
|
||||
setForm(keys = [], values = []) {
|
||||
keys.forEach((key, index) => {
|
||||
this.form[key] = values[index]
|
||||
})
|
||||
},
|
||||
|
||||
setSelectRow() {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs['table']) {
|
||||
this.$refs['table'].clearCheckboxRow()
|
||||
this.$refs['table'].setCheckboxRow(
|
||||
this.tableData.filter(row => this.form.user_ids.findIndex(j => j === row.id) !== -1),
|
||||
true
|
||||
)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
async getUsers() {
|
||||
const res = await index(this.select)
|
||||
this.tableData = res.data
|
||||
this.total = res.total
|
||||
},
|
||||
|
||||
async getRoleUsers() {
|
||||
try {
|
||||
const res = await index({
|
||||
page: 1,
|
||||
rows: 9999,
|
||||
role_id: this.form.id
|
||||
})
|
||||
this.form.user_ids = res.data?.map(i => i.id)
|
||||
} catch (err) {
|
||||
console.error(err)
|
||||
}
|
||||
},
|
||||
async submit() {
|
||||
if (this.$refs['table']) {
|
||||
this.loading = true
|
||||
const selectRecords = this.$refs['table'].getCheckboxRecords()
|
||||
try {
|
||||
batchUser({
|
||||
id: this.form.id,
|
||||
user_ids: selectRecords.map(row => row.id)
|
||||
})
|
||||
// 接口中角色信息有延迟
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
this.$emit('update:isShow', false)
|
||||
this.$emit('refresh')
|
||||
}, 500)
|
||||
} catch (err) {
|
||||
this.loading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.total {
|
||||
color: #666;
|
||||
text-align: right;
|
||||
line-height: 3;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<div>
|
||||
<vxe-modal
|
||||
:z-index="zIndex"
|
||||
:value="isShow"
|
||||
show-footer
|
||||
title="绑定用户"
|
||||
show-confirm-button
|
||||
:width="600"
|
||||
:height="600"
|
||||
esc-closable
|
||||
@input="e => $emit('update:isShow',e)"
|
||||
>
|
||||
<template>
|
||||
<vxe-table
|
||||
ref="table"
|
||||
stripe
|
||||
style="margin-top: 10px;"
|
||||
keep-source
|
||||
show-overflow
|
||||
:row-config="{ keyField: 'id' }"
|
||||
:column-config="{ resizable: true }"
|
||||
:checkbox-config="{ trigger: 'row', highlight: true, reserve: true }"
|
||||
:data="tableData"
|
||||
>
|
||||
<vxe-column type="checkbox" width="60" fixed="left" />
|
||||
<vxe-column type="seq" width="58" align="center" />
|
||||
<vxe-column field="name" width="140" title="姓名" />
|
||||
<vxe-column field="department.name" width="160" align="center" title="部门" />
|
||||
<vxe-column field="position" width="140" title="职位" align="center" />
|
||||
<vxe-column field="mobile" width="140" align="center" title="手机号" />
|
||||
</vxe-table>
|
||||
|
||||
<el-pagination
|
||||
style="margin-top: 10px;"
|
||||
:current-page="select.page"
|
||||
:page-sizes="[20, 30, 40, 50]"
|
||||
:page-size="select.rows"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
@size-change="e => {
|
||||
select.rows = e;
|
||||
select.page = 1;
|
||||
getUsers();
|
||||
}"
|
||||
@current-change="e => {
|
||||
select.page = e;
|
||||
getUsers();
|
||||
}"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template #footer>
|
||||
<el-button type="primary" :loading="loading" @click="submit">确认</el-button>
|
||||
</template>
|
||||
</vxe-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { index } from '@/api/user'
|
||||
import { batchRoles } from '@/api/module'
|
||||
import { PopupManager } from 'element-ui/lib/utils/popup'
|
||||
export default {
|
||||
props: {
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: true
|
||||
},
|
||||
moduleId: {
|
||||
type: [Number, String],
|
||||
default: '',
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
zIndex: PopupManager.nextZIndex(),
|
||||
loading: false,
|
||||
|
||||
select: {
|
||||
page: 1,
|
||||
rows: 20,
|
||||
module_id: '',
|
||||
keyword: ''
|
||||
},
|
||||
|
||||
tableData: [],
|
||||
total: 0,
|
||||
form: {
|
||||
role_id: '',
|
||||
module_id: '',
|
||||
user_ids: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
'form.user_ids': function(val, oldVal) {
|
||||
this.setSelectRow()
|
||||
},
|
||||
isShow(newVal) {
|
||||
if (newVal) {
|
||||
this.zIndex = PopupManager.nextZIndex()
|
||||
this.getRoleUsers()
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getUsers()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* @param {array[string]} keys
|
||||
* @param {array[all]} values
|
||||
* @returns {void}
|
||||
*/
|
||||
setForm(keys = [], values = []) {
|
||||
keys.forEach((key, index) => {
|
||||
this.form[key] = values[index]
|
||||
})
|
||||
},
|
||||
|
||||
setSelectRow() {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs['table']) {
|
||||
this.$refs['table'].clearCheckboxRow()
|
||||
this.$refs['table'].setCheckboxRow(
|
||||
this.tableData.filter(row => this.form.user_ids.findIndex(j => j === row.id) !== -1),
|
||||
true
|
||||
)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
async getUsers() {
|
||||
const res = await index(this.select)
|
||||
this.tableData = res.data
|
||||
this.total = res.total
|
||||
},
|
||||
|
||||
async getRoleUsers() {
|
||||
try {
|
||||
const res = await index({
|
||||
page: 1,
|
||||
rows: 9999,
|
||||
module_role_id: this.form.role_id,
|
||||
module_id: this.moduleId
|
||||
})
|
||||
this.form.user_ids = res.data?.map(i => i.id)
|
||||
} catch (err) {
|
||||
console.error(err)
|
||||
}
|
||||
},
|
||||
async submit() {
|
||||
if (this.$refs['table']) {
|
||||
this.loading = true
|
||||
const selectRecords = this.$refs['table'].getCheckboxRecords()
|
||||
try {
|
||||
batchRoles({
|
||||
...this.form,
|
||||
module_id: this.moduleId,
|
||||
user_ids: selectRecords.map(row => row.id)
|
||||
})
|
||||
// 接口中角色信息有延迟
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
this.$emit('update:isShow', false)
|
||||
this.$emit('refresh')
|
||||
}, 500)
|
||||
} catch (err) {
|
||||
this.loading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.total {
|
||||
color: #666;
|
||||
text-align: right;
|
||||
line-height: 3;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue