init
This commit is contained in:
JasonChen
@@ -1,42 +1,35 @@
|
||||
<template>
|
||||
<page-header-wrapper v-if="loading" :title="pageTitle">
|
||||
<page-header-wrapper>
|
||||
<!-- 有操作权限 -->
|
||||
<!-- v-if="$store.getters.hasPromissionsShow.permission" -->
|
||||
<a-card :bordered="false" class="card">
|
||||
<a-row>
|
||||
<a-col :span="24" v-if="queryParam.state == 'role'">
|
||||
<a-col :span="24">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-form-item label="用户角色">
|
||||
<a-select
|
||||
label-in-value
|
||||
default-value=""
|
||||
placeholder="请选择"
|
||||
@change="handleRoleChange">
|
||||
<a-select-option
|
||||
v-for="item in departs"
|
||||
:key="item.key"
|
||||
:value="item.key">{{ item.title }}</a-select-option>
|
||||
<a-select placeholder="请选择" v-model="queryParam.identity_id">
|
||||
<a-select-option v-for="item in indentitys" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-form-item label="用户姓名">
|
||||
<a-input v-model="userQueryParam.name" placeholder="" />
|
||||
<a-input v-model="queryParam.name" placeholder="" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-form-item label="用户手机">
|
||||
<a-input v-model="userQueryParam.username" placeholder="" />
|
||||
<a-input v-model="queryParam.username" placeholder="" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
||||
<a-button class="ml8" type="primary" @click="addPromissions">新增</a-button>
|
||||
<a-button
|
||||
class="ml8"
|
||||
@click="() => ((this.queryParam = { state: 'role' }), $refs.table.refresh(true))">重置</a-button>
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
||||
<a-button class="ml8" type="primary" @click="addPromissions">新增</a-button>
|
||||
<a-button class="ml8" @click="resetSearch" >重置</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
@@ -44,11 +37,11 @@
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:rowKey="(row) => row.staff_id"
|
||||
:rowKey="row => row.user.user_id"
|
||||
showPagination="auto"
|
||||
bordered
|
||||
size="default">
|
||||
|
||||
size="default"
|
||||
>
|
||||
<div slot="name" slot-scope="text, record">
|
||||
<div>{{ record.name }}</div>
|
||||
<div>{{ record.username }}</div>
|
||||
@@ -69,313 +62,266 @@
|
||||
title="是否确认删除该角色?"
|
||||
ok-text="OK"
|
||||
cancel-text="NO"
|
||||
@confirm="delPromissions(record)">
|
||||
@confirm="delPromissions(record)"
|
||||
>
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
</s-table>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-card>
|
||||
<!-- 没有操作权限限制 -->
|
||||
<!-- <NoPromissions v-else /> -->
|
||||
<!-- <NoPromissions /> -->
|
||||
</page-header-wrapper>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { STable, UserInfo } from '@/components'
|
||||
import DeriveButton from '@/components/OrderDetailInfo/DeriveButton'
|
||||
import {
|
||||
staffDeparts, delDepartsUser, getDepartsUser, getDepartsOrder
|
||||
} from '@/api/promissions'
|
||||
import { getList } from '@/api/permissions'
|
||||
import AddPromissions from './modules/AddPromissions'
|
||||
import EditPromissions from './modules/EditPromissions'
|
||||
import AssignmentChange from './modules/AssignmentChange'
|
||||
// import NoPromissions from '@/views/exception/noRight'
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '用户ID',
|
||||
dataIndex: 'staff_id',
|
||||
align: 'center',
|
||||
width: 120
|
||||
}, {
|
||||
title: '用户姓名',
|
||||
key: 'name',
|
||||
scopedSlots: { customRender: 'name' },
|
||||
align: 'center',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
title: '用户角色',
|
||||
scopedSlots: { customRender: 'type' },
|
||||
align: 'center',
|
||||
width: 160
|
||||
},
|
||||
// {
|
||||
// title: '待处理订单',
|
||||
// scopedSlots: { customRender: 'status' },
|
||||
// // width: 400,
|
||||
// align: 'center'
|
||||
// },
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'created_at',
|
||||
align: 'center',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
scopedSlots: { customRender: 'actions' },
|
||||
align: 'center',
|
||||
width: 120
|
||||
}
|
||||
{
|
||||
title: '用户ID',
|
||||
dataIndex: 'staff_id',
|
||||
align: 'center',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
title: '用户姓名',
|
||||
key: 'name',
|
||||
scopedSlots: { customRender: 'name' },
|
||||
align: 'center',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
title: '用户角色',
|
||||
scopedSlots: { customRender: 'type' },
|
||||
align: 'center',
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'created_at',
|
||||
align: 'center',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
scopedSlots: { customRender: 'actions' },
|
||||
align: 'center',
|
||||
width: 120
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
name: 'PermissionsIndex',
|
||||
components: {
|
||||
STable,
|
||||
UserInfo,
|
||||
DeriveButton,
|
||||
AddPromissions,
|
||||
EditPromissions,
|
||||
AssignmentChange
|
||||
// NoPromissions
|
||||
STable,
|
||||
UserInfo,
|
||||
DeriveButton,
|
||||
AddPromissions,
|
||||
EditPromissions,
|
||||
AssignmentChange
|
||||
// NoPromissions
|
||||
},
|
||||
data () {
|
||||
this.columns = columns
|
||||
return {
|
||||
dataList: [],
|
||||
tabsList: [
|
||||
{ key: 'role', tab: '权限管理-新增身份' }
|
||||
],
|
||||
pageTitle: '权限管理-新增身份',
|
||||
tabActiveKey: 'role',
|
||||
promissions: [], // 权限列表
|
||||
departs: [],
|
||||
queryParam: {
|
||||
state: 'role',
|
||||
phone: '',
|
||||
nickname: '',
|
||||
type: ''
|
||||
},
|
||||
userQueryParam: {
|
||||
name: '',
|
||||
username: '',
|
||||
key: ''
|
||||
},
|
||||
listCount: 0,
|
||||
loading: false,
|
||||
permission: false, // 展示展示分配权限
|
||||
dispatch: false, // 可展示可指派订单
|
||||
loadData: (parameter) => {
|
||||
const requestParameters = Object.assign({}, parameter, this.queryParam)
|
||||
const userQueryParams = Object.assign({}, parameter, this.userQueryParam)
|
||||
return this.tabActiveKey === 'role' ? getDepartsUser(userQueryParams) : getDepartsOrder(requestParameters)
|
||||
}
|
||||
this.columns = columns
|
||||
return {
|
||||
indentitys: [
|
||||
{ id: 1, name: '普通用户' },
|
||||
{ id: 2, name: 'VIP' },
|
||||
{ id: 4, name: '创客' },
|
||||
{ id: 6, name: '代理商' }
|
||||
], // 业务类型
|
||||
queryParam: {
|
||||
identity_id: undefined,
|
||||
name: undefined,
|
||||
username: undefined
|
||||
},
|
||||
permission: false, // 展示展示分配权限
|
||||
loadData: parameter => {
|
||||
const requestParameters = Object.assign({}, parameter, this.queryParam)
|
||||
return getList(requestParameters)
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route (to, from) {
|
||||
if (
|
||||
(from.name === 'Detail' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'DetailLogistics' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'Home' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'AssignrderIndex' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'FristCheckrderIndex' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'ReCheckrderIndex' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'HandleService' && to.name === 'SignInrderIndex') ||
|
||||
(from.name === 'CompleteOrder' && to.name === 'SignInrderIndex')
|
||||
) {
|
||||
this.$refs.table.loadData()
|
||||
}
|
||||
console.log(to.name, from.name)
|
||||
}
|
||||
},
|
||||
activated () {
|
||||
this.staffDeparts()
|
||||
},
|
||||
methods: {
|
||||
// 获取当前用户的组织
|
||||
staffDeparts () {
|
||||
this.loading = true
|
||||
staffDeparts().then(res => {
|
||||
console.log(res)
|
||||
this.promissions = res
|
||||
this.loading = true
|
||||
if (res.length > 0) {
|
||||
this.departs = [{ key: '', title: '全部角色' }, ...res[0].departs]
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
// 确认删除权限
|
||||
delPromissions (item) {
|
||||
// delDepartsUser(item.staff_id).then(res => {
|
||||
this.$refs.table.loadData()
|
||||
this.$notification.success({
|
||||
message: '成功',
|
||||
description: '删除成功'
|
||||
})
|
||||
},
|
||||
// 角色更改
|
||||
handleRoleChange (e) {
|
||||
this.userQueryParam.key = e.key
|
||||
// this.$refs.table.refresh(true) // 从第一页开始刷新
|
||||
},
|
||||
handleTabChange (key) {
|
||||
this.tabActiveKey = key
|
||||
this.queryParam.state = key
|
||||
this.$refs.table.refresh(true) // 刷新列表
|
||||
this.pageTitle = this.tabsList.find((item) => item.key === key).tab
|
||||
},
|
||||
// 确认删除权限
|
||||
delPromissions (item) {
|
||||
delDepartsUser(item.staff_id).then(res => {
|
||||
this.$refs.table.loadData()
|
||||
this.$notification.success({
|
||||
message: '成功',
|
||||
description: '删除成功'
|
||||
})
|
||||
this.staffDeparts()
|
||||
}).catch(err => {
|
||||
this.$notification.error(err)
|
||||
})
|
||||
},
|
||||
// 新增权限
|
||||
addPromissions () {
|
||||
this.$dialog(AddPromissions,
|
||||
{
|
||||
on: {
|
||||
ok: () => {
|
||||
this.$refs.table.refresh(true)
|
||||
this.staffDeparts()
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '新增用户',
|
||||
width: 500,
|
||||
maskClosable: true,
|
||||
closable: true,
|
||||
okText: '确认新增',
|
||||
cancelText: '取消'
|
||||
}
|
||||
)
|
||||
},
|
||||
// 编辑权限
|
||||
EditPromissions (item) {
|
||||
this.$dialog(EditPromissions,
|
||||
{
|
||||
item,
|
||||
on: {
|
||||
ok: () => {
|
||||
this.$refs.table.loadData()
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '编辑权限',
|
||||
width: 500,
|
||||
maskClosable: true,
|
||||
closable: true,
|
||||
okText: '确认修改',
|
||||
cancelText: '取消'
|
||||
}
|
||||
)
|
||||
},
|
||||
// 指派订单
|
||||
Assignment (item) {
|
||||
console.log(item)
|
||||
const order = {
|
||||
item: item,
|
||||
orderId: this.id,
|
||||
type: this.promissions
|
||||
}
|
||||
this.$dialog(AssignmentChange
|
||||
,
|
||||
{
|
||||
order,
|
||||
on: {
|
||||
ok: () => {
|
||||
this.$refs.table.loadData()
|
||||
// this.getInfo()
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '指派订单',
|
||||
width: 500,
|
||||
maskClosable: true,
|
||||
closable: true,
|
||||
okText: '确认指派',
|
||||
cancelText: '取消'
|
||||
}
|
||||
)
|
||||
this.staffDeparts()
|
||||
// }).catch(err => {
|
||||
// this.$notification.error(err)
|
||||
// })
|
||||
},
|
||||
// 重置搜索列表
|
||||
resetSearch () {
|
||||
this.queryParam = {
|
||||
username: undefined,
|
||||
name: undefined,
|
||||
identity_id: undefined
|
||||
}
|
||||
this.$refs.table.refresh(true) // 重置接口且刷先到第一页
|
||||
},
|
||||
// 新增权限
|
||||
addPromissions () {
|
||||
this.$dialog(
|
||||
AddPromissions,
|
||||
{
|
||||
on: {
|
||||
ok: () => {
|
||||
this.$refs.table.refresh(true)
|
||||
this.staffDeparts()
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '新增用户',
|
||||
width: 500,
|
||||
maskClosable: true,
|
||||
closable: true,
|
||||
okText: '确认新增',
|
||||
cancelText: '取消'
|
||||
}
|
||||
)
|
||||
},
|
||||
// 编辑权限
|
||||
EditPromissions (item) {
|
||||
this.$dialog(
|
||||
EditPromissions,
|
||||
{
|
||||
item,
|
||||
on: {
|
||||
ok: () => {
|
||||
this.$refs.table.loadData()
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '编辑权限',
|
||||
width: 500,
|
||||
maskClosable: true,
|
||||
closable: true,
|
||||
okText: '确认修改',
|
||||
cancelText: '取消'
|
||||
}
|
||||
)
|
||||
},
|
||||
// 指派订单
|
||||
Assignment (item) {
|
||||
console.log(item)
|
||||
const order = {
|
||||
item: item,
|
||||
orderId: this.id,
|
||||
type: this.promissions
|
||||
}
|
||||
this.$dialog(
|
||||
AssignmentChange,
|
||||
{
|
||||
order,
|
||||
on: {
|
||||
ok: () => {
|
||||
this.$refs.table.loadData()
|
||||
// this.getInfo()
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '指派订单',
|
||||
width: 500,
|
||||
maskClosable: true,
|
||||
closable: true,
|
||||
okText: '确认指派',
|
||||
cancelText: '取消'
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ml8 {
|
||||
margin-left: 8px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.right {
|
||||
min-height: 80vh;
|
||||
margin-right: 30px;
|
||||
background-color: #f9f9f9;
|
||||
padding: 20px;
|
||||
min-height: 80vh;
|
||||
margin-right: 30px;
|
||||
background-color: #f9f9f9;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.ant-card-body {
|
||||
padding: 0px !important;
|
||||
padding: 0px !important;
|
||||
}
|
||||
|
||||
.title_left {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
border-bottom: solid 1px rgba(#1890ff, 0.2);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
border-bottom: solid 1px rgba(#1890ff, 0.2);
|
||||
}
|
||||
|
||||
.icon_title {
|
||||
padding: 10px 0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.a_tree_title {
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.a_tree_node {
|
||||
margin-top: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
|
||||
.status-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
|
||||
.status-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
flex-wrap: wrap;
|
||||
// div{
|
||||
// width: 49%;
|
||||
// display: flex;
|
||||
// flex-direction: row;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
// box-sizing: border-box;
|
||||
// flex-wrap: wrap;
|
||||
// margin: 2px 10px;
|
||||
// }
|
||||
}
|
||||
flex-wrap: wrap;
|
||||
// div{
|
||||
// width: 49%;
|
||||
// display: flex;
|
||||
// flex-direction: row;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
// box-sizing: border-box;
|
||||
// flex-wrap: wrap;
|
||||
// margin: 2px 10px;
|
||||
// }
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user