feat(app管理员页面): 角色新增“经理”
This commit is contained in:
hzj
parent
36d28f6416
commit
316809c2d3
@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container-admin">
|
<div class="app-container-admin">
|
||||||
|
|
||||||
<div class="filter-container">
|
<div class="filter-container">
|
||||||
<div class="filter-item">
|
<div class="filter-item">
|
||||||
<account-input v-model="listQuery.userId" placeholder="用户ID" />
|
<account-input v-model="listQuery.userId" placeholder="用户ID" />
|
||||||
@ -48,13 +47,23 @@
|
|||||||
>
|
>
|
||||||
<el-table-column label="头像" align="center">
|
<el-table-column label="头像" align="center">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<user-table-exhibit :user-profile="scope.row" :query-details="true" :custom-props="{'userId': 'userId'}" />
|
<user-table-exhibit
|
||||||
|
:user-profile="scope.row"
|
||||||
|
:query-details="true"
|
||||||
|
:custom-props="{ userId: 'userId' }"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column width="70" label="国旗" align="center">
|
<el-table-column width="70" label="国旗" align="center">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<a :title="scope.row.countryName" @click="copyTextContent(scope.row.countryName)">
|
<a
|
||||||
<flag-icon :code="scope.row.countryCode" style="margin-top: 20px;" />
|
:title="scope.row.countryName"
|
||||||
|
@click="copyTextContent(scope.row.countryName)"
|
||||||
|
>
|
||||||
|
<flag-icon
|
||||||
|
:code="scope.row.countryCode"
|
||||||
|
style="margin-top: 20px;"
|
||||||
|
/>
|
||||||
</a>
|
</a>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@ -77,13 +86,23 @@
|
|||||||
v-loading="scope.row.id === changeRolesLoadingId"
|
v-loading="scope.row.id === changeRolesLoadingId"
|
||||||
:disabled="scope.row.status !== 1"
|
:disabled="scope.row.status !== 1"
|
||||||
style="width: 120px;"
|
style="width: 120px;"
|
||||||
@change="(v) => changeRoles(scope.row,v)"
|
@change="v => changeRoles(scope.row, v)"
|
||||||
>
|
>
|
||||||
<el-option v-for="(item, index) in roles" :key="index" :label="item.name" :value="item.value" />
|
<el-option
|
||||||
|
v-for="(item, index) in roles"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="createTime" label="创建时间" align="center" width="200">
|
<el-table-column
|
||||||
|
prop="createTime"
|
||||||
|
label="创建时间"
|
||||||
|
align="center"
|
||||||
|
width="200"
|
||||||
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.createTime | dateFormat }}
|
{{ scope.row.createTime | dateFormat }}
|
||||||
</template>
|
</template>
|
||||||
@ -95,9 +114,13 @@
|
|||||||
<i class="el-icon-more" />
|
<i class="el-icon-more" />
|
||||||
</span>
|
</span>
|
||||||
<el-dropdown-menu slot="dropdown">
|
<el-dropdown-menu slot="dropdown">
|
||||||
<el-dropdown-item @click.native="AttributionSystem(scope.row)">权限分配</el-dropdown-item>
|
<el-dropdown-item @click.native="AttributionSystem(scope.row)"
|
||||||
|
>权限分配</el-dropdown-item
|
||||||
|
>
|
||||||
<!-- <el-dropdown-item @click.native="attributionRoom(scope.row)">管理房间</el-dropdown-item> -->
|
<!-- <el-dropdown-item @click.native="attributionRoom(scope.row)">管理房间</el-dropdown-item> -->
|
||||||
<el-dropdown-item @click.native="handlDel(scope.row.id)">移除管理</el-dropdown-item>
|
<el-dropdown-item @click.native="handlDel(scope.row.id)"
|
||||||
|
>移除管理</el-dropdown-item
|
||||||
|
>
|
||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
</template>
|
</template>
|
||||||
@ -115,13 +138,13 @@
|
|||||||
<auth-system
|
<auth-system
|
||||||
v-if="authSystemVisable"
|
v-if="authSystemVisable"
|
||||||
:user-id="thatSelectedUserId"
|
:user-id="thatSelectedUserId"
|
||||||
@close="authSystemVisable=false"
|
@close="authSystemVisable = false"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<room-drawer
|
<room-drawer
|
||||||
v-if="roomDrawerVisable"
|
v-if="roomDrawerVisable"
|
||||||
:row="thisRow"
|
:row="thisRow"
|
||||||
@close="roomDrawerVisable=false"
|
@close="roomDrawerVisable = false"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<el-dialog
|
<el-dialog
|
||||||
@ -137,11 +160,13 @@
|
|||||||
<el-input v-model.trim="form.userId" type="text" />
|
<el-input v-model.trim="form.userId" type="text" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="角色" prop="roles">
|
<el-form-item label="角色" prop="roles">
|
||||||
<el-select
|
<el-select v-model="form.roles" style="width: 100%">
|
||||||
v-model="form.roles"
|
<el-option
|
||||||
style="width: 100%"
|
v-for="(item, index) in roles"
|
||||||
>
|
:key="index"
|
||||||
<el-option v-for="(item, index) in roles" :key="index" :label="item.name" :value="item.value" />
|
:label="item.name"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
@ -155,22 +180,27 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { getAdministratorTable, getUserBaseInfo, changeStatusAdministrator, changeSysAdministratorRoles } from '@/api/app-user'
|
import {
|
||||||
import Pagination from '@/components/Pagination'
|
getAdministratorTable,
|
||||||
import { copyText } from '@/utils'
|
getUserBaseInfo,
|
||||||
import { deleteAdministrator, addAdministrator } from '@/api/stream'
|
changeStatusAdministrator,
|
||||||
import authSystem from './auth'
|
changeSysAdministratorRoles
|
||||||
|
} from "@/api/app-user";
|
||||||
|
import Pagination from "@/components/Pagination";
|
||||||
|
import { copyText } from "@/utils";
|
||||||
|
import { deleteAdministrator, addAdministrator } from "@/api/stream";
|
||||||
|
import authSystem from "./auth";
|
||||||
|
|
||||||
function getFormData() {
|
function getFormData() {
|
||||||
return {
|
return {
|
||||||
userId: '',
|
userId: "",
|
||||||
wage: '0',
|
wage: "0",
|
||||||
roles: 'ADMIN'
|
roles: "ADMIN"
|
||||||
}
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'AdministratorTable',
|
name: "AdministratorTable",
|
||||||
components: {
|
components: {
|
||||||
Pagination,
|
Pagination,
|
||||||
authSystem
|
authSystem
|
||||||
@ -179,17 +209,18 @@ export default {
|
|||||||
return {
|
return {
|
||||||
searchDisabled: false,
|
searchDisabled: false,
|
||||||
roles: [
|
roles: [
|
||||||
{ name: '管理员', value: 'ADMIN' },
|
{ name: "管理员", value: "ADMIN" },
|
||||||
{ name: '超级管理员', value: 'SUPER_ADMIN' }
|
{ name: "超级管理员", value: "SUPER_ADMIN" },
|
||||||
|
{ name: "经理", value: "MANAGER" }
|
||||||
],
|
],
|
||||||
changeRolesLoadingId: '',
|
changeRolesLoadingId: "",
|
||||||
thisRow: {},
|
thisRow: {},
|
||||||
level: 0,
|
level: 0,
|
||||||
authSystemVisable: false,
|
authSystemVisable: false,
|
||||||
formVisible: false,
|
formVisible: false,
|
||||||
roomDrawerVisable: false,
|
roomDrawerVisable: false,
|
||||||
textOptTitle: '',
|
textOptTitle: "",
|
||||||
thatSelectedUserId: '',
|
thatSelectedUserId: "",
|
||||||
form: getFormData(),
|
form: getFormData(),
|
||||||
submitLoading: false,
|
submitLoading: false,
|
||||||
list: [],
|
list: [],
|
||||||
@ -197,190 +228,223 @@ export default {
|
|||||||
listQuery: {
|
listQuery: {
|
||||||
cursor: 1,
|
cursor: 1,
|
||||||
limit: 20,
|
limit: 20,
|
||||||
userId: '',
|
userId: "",
|
||||||
account: '',
|
account: "",
|
||||||
userNickname: ''
|
userNickname: ""
|
||||||
},
|
},
|
||||||
rules: {
|
rules: {
|
||||||
userId: [
|
userId: [
|
||||||
{
|
{
|
||||||
required: true, trigger: 'blur', validator: (rule, value, callback) => {
|
required: true,
|
||||||
if (value !== '') {
|
trigger: "blur",
|
||||||
getUserBaseInfo(value).then(res => {
|
validator: (rule, value, callback) => {
|
||||||
if (JSON.stringify(res) === '{"status":200}') {
|
if (value !== "") {
|
||||||
callback(new Error('UID不存在!'))
|
getUserBaseInfo(value)
|
||||||
} else {
|
.then(res => {
|
||||||
callback()
|
if (JSON.stringify(res) === '{"status":200}') {
|
||||||
}
|
callback(new Error("UID不存在!"));
|
||||||
}).catch(er => {
|
} else {
|
||||||
callback(new Error(er.message))
|
callback();
|
||||||
})
|
}
|
||||||
|
})
|
||||||
|
.catch(er => {
|
||||||
|
callback(new Error(er.message));
|
||||||
|
});
|
||||||
} else {
|
} else {
|
||||||
callback(new Error('请填写UID'))
|
callback(new Error("请填写UID"));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
wage: [{
|
wage: [
|
||||||
required: true, trigger: 'blur', pattern: /^([0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|6[0-9]|7[0-9]|8[0-9]|9[0-9]|100)$/, message: '范围0~100' }],
|
{
|
||||||
roles: [{ required: true, trigger: 'blur', message: '必填参数不可为空' }]
|
required: true,
|
||||||
|
trigger: "blur",
|
||||||
|
pattern: /^([0-9]|1[0-9]|2[0-9]|3[0-9]|4[0-9]|5[0-9]|6[0-9]|7[0-9]|8[0-9]|9[0-9]|100)$/,
|
||||||
|
message: "范围0~100"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
roles: [
|
||||||
|
{ required: true, trigger: "blur", message: "必填参数不可为空" }
|
||||||
|
]
|
||||||
},
|
},
|
||||||
rangeDate: '',
|
rangeDate: "",
|
||||||
listLoading: true,
|
listLoading: true,
|
||||||
searchLoading: false,
|
searchLoading: false,
|
||||||
clickUserId: ''
|
clickUserId: ""
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.renderData(true)
|
this.renderData(true);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
changeRoles(row, newValue) {
|
changeRoles(row, newValue) {
|
||||||
const that = this
|
const that = this;
|
||||||
that.changeRolesLoadingId = row.id
|
that.changeRolesLoadingId = row.id;
|
||||||
changeSysAdministratorRoles({
|
changeSysAdministratorRoles({
|
||||||
id: row.id, roles: newValue
|
id: row.id,
|
||||||
}).then(res => {
|
roles: newValue
|
||||||
that.changeRolesLoadingId = ''
|
|
||||||
}).catch(er => {
|
|
||||||
that.changeRolesLoadingId = ''
|
|
||||||
console.error(er)
|
|
||||||
})
|
})
|
||||||
|
.then(res => {
|
||||||
|
that.changeRolesLoadingId = "";
|
||||||
|
})
|
||||||
|
.catch(er => {
|
||||||
|
that.changeRolesLoadingId = "";
|
||||||
|
console.error(er);
|
||||||
|
});
|
||||||
},
|
},
|
||||||
renderData(isReset) {
|
renderData(isReset) {
|
||||||
const that = this
|
const that = this;
|
||||||
if (isReset === true) {
|
if (isReset === true) {
|
||||||
that.listQuery.cursor = 1
|
that.listQuery.cursor = 1;
|
||||||
}
|
}
|
||||||
that.listLoading = true
|
that.listLoading = true;
|
||||||
getAdministratorTable(that.listQuery).then(res => {
|
getAdministratorTable(that.listQuery)
|
||||||
const { body } = res
|
.then(res => {
|
||||||
that.total = body.total || 0
|
const { body } = res;
|
||||||
that.list = body.records
|
that.total = body.total || 0;
|
||||||
that.searchLoading = that.listLoading = false
|
that.list = body.records;
|
||||||
}).catch(er => {
|
that.searchLoading = that.listLoading = false;
|
||||||
that.searchLoading = that.listLoading = false
|
})
|
||||||
})
|
.catch(er => {
|
||||||
|
that.searchLoading = that.listLoading = false;
|
||||||
|
});
|
||||||
},
|
},
|
||||||
handleSearch() {
|
handleSearch() {
|
||||||
this.searchLoading = true
|
this.searchLoading = true;
|
||||||
this.renderData(true)
|
this.renderData(true);
|
||||||
},
|
},
|
||||||
handleSwitchChange(row) {
|
handleSwitchChange(row) {
|
||||||
changeStatusAdministrator({ id: row.id, status: row.status, userId: row.userId })
|
changeStatusAdministrator({
|
||||||
|
id: row.id,
|
||||||
|
status: row.status,
|
||||||
|
userId: row.userId
|
||||||
|
})
|
||||||
.then(res => {})
|
.then(res => {})
|
||||||
.catch(er => {
|
.catch(er => {
|
||||||
if (row.status === 0) {
|
if (row.status === 0) {
|
||||||
row.status = 1
|
row.status = 1;
|
||||||
} else if (row.status === 1) {
|
} else if (row.status === 1) {
|
||||||
row.status = 0
|
row.status = 0;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
handleCreate() {
|
handleCreate() {
|
||||||
this.textOptTitle = '新建APP管理员'
|
this.textOptTitle = "新建APP管理员";
|
||||||
this.formVisible = true
|
this.formVisible = true;
|
||||||
},
|
},
|
||||||
accountHandleSuccess(data) {
|
accountHandleSuccess(data) {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'Successful',
|
message: "Successful",
|
||||||
type: 'success'
|
type: "success"
|
||||||
})
|
});
|
||||||
// this.renderData()
|
// this.renderData()
|
||||||
},
|
},
|
||||||
handleLiveClick(row) {
|
handleLiveClick(row) {
|
||||||
window.open(row.liveUrl)
|
window.open(row.liveUrl);
|
||||||
},
|
},
|
||||||
copyTextContent(text) {
|
copyTextContent(text) {
|
||||||
const that = this
|
const that = this;
|
||||||
copyText(text).then(() => {
|
copyText(text)
|
||||||
that.$message({
|
.then(() => {
|
||||||
message: '复制成功',
|
that.$message({
|
||||||
type: 'success'
|
message: "复制成功",
|
||||||
|
type: "success"
|
||||||
|
});
|
||||||
})
|
})
|
||||||
}).catch(() => {
|
.catch(() => {
|
||||||
that.$message({
|
that.$message({
|
||||||
message: '复制失败',
|
message: "复制失败",
|
||||||
type: 'error'
|
type: "error"
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
handleClose() {
|
handleClose() {
|
||||||
// 去除校验
|
// 去除校验
|
||||||
this.$refs.form.clearValidate()
|
this.$refs.form.clearValidate();
|
||||||
this.formVisible = false
|
this.formVisible = false;
|
||||||
this.resetForm()
|
this.resetForm();
|
||||||
},
|
},
|
||||||
resetForm() {
|
resetForm() {
|
||||||
this.form = getFormData()
|
this.form = getFormData();
|
||||||
},
|
},
|
||||||
submitForm() {
|
submitForm() {
|
||||||
const that = this
|
const that = this;
|
||||||
that.$refs.form.validate(valid => {
|
that.$refs.form.validate(valid => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
that.submitLoading = true
|
that.submitLoading = true;
|
||||||
addAdministrator({ userId: that.form.userId, wage: that.form.wage, roles: that.form.roles }).then(res => {
|
addAdministrator({
|
||||||
that.$opsMessage.success()
|
userId: that.form.userId,
|
||||||
that.submitLoading = false
|
wage: that.form.wage,
|
||||||
that.formVisible = false
|
roles: that.form.roles
|
||||||
that.resetForm()
|
|
||||||
that.renderData(true)
|
|
||||||
}).catch(er => {
|
|
||||||
that.submitLoading = false
|
|
||||||
console.error(er)
|
|
||||||
this.$emit('fail', er)
|
|
||||||
})
|
})
|
||||||
|
.then(res => {
|
||||||
|
that.$opsMessage.success();
|
||||||
|
that.submitLoading = false;
|
||||||
|
that.formVisible = false;
|
||||||
|
that.resetForm();
|
||||||
|
that.renderData(true);
|
||||||
|
})
|
||||||
|
.catch(er => {
|
||||||
|
that.submitLoading = false;
|
||||||
|
console.error(er);
|
||||||
|
this.$emit("fail", er);
|
||||||
|
});
|
||||||
} else {
|
} else {
|
||||||
console.error('error submit!!')
|
console.error("error submit!!");
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
handlDel(id) {
|
handlDel(id) {
|
||||||
const that = this
|
const that = this;
|
||||||
this.$confirm('您确定要删除该管理员吗', '温馨提示', {
|
this.$confirm("您确定要删除该管理员吗", "温馨提示", {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: "确定",
|
||||||
cancelButtonText: '取消'
|
cancelButtonText: "取消"
|
||||||
}).then(() => {
|
})
|
||||||
deleteAdministrator(id).then(res => {
|
.then(() => {
|
||||||
that.renderData(true)
|
deleteAdministrator(id)
|
||||||
that.$opsMessage.success()
|
.then(res => {
|
||||||
}).catch(er => {
|
that.renderData(true);
|
||||||
that.$opsMessage.success()
|
that.$opsMessage.success();
|
||||||
|
})
|
||||||
|
.catch(er => {
|
||||||
|
that.$opsMessage.success();
|
||||||
|
});
|
||||||
})
|
})
|
||||||
}).catch(() => {})
|
.catch(() => {});
|
||||||
},
|
},
|
||||||
renderDataSuccess() {
|
renderDataSuccess() {
|
||||||
this.$message({
|
this.$message({
|
||||||
message: 'Successful',
|
message: "Successful",
|
||||||
type: 'success'
|
type: "success"
|
||||||
})
|
});
|
||||||
this.renderData()
|
this.renderData();
|
||||||
},
|
},
|
||||||
handleMouseEnter(row) {
|
handleMouseEnter(row) {
|
||||||
this.thisRow = row
|
this.thisRow = row;
|
||||||
this.thatSelectedUserId = row.userId
|
this.thatSelectedUserId = row.userId;
|
||||||
},
|
},
|
||||||
AttributionSystem(row) {
|
AttributionSystem(row) {
|
||||||
const that = this
|
const that = this;
|
||||||
this.thatSelectedUserId = row.userId
|
this.thatSelectedUserId = row.userId;
|
||||||
that.authSystemVisable = true
|
that.authSystemVisable = true;
|
||||||
},
|
},
|
||||||
attributionRoom(row) {
|
attributionRoom(row) {
|
||||||
const that = this
|
const that = this;
|
||||||
that.roomDrawerVisable = true
|
that.roomDrawerVisable = true;
|
||||||
},
|
},
|
||||||
getLevelName(gender, level) {
|
getLevelName(gender, level) {
|
||||||
if (gender !== 0) {
|
if (gender !== 0) {
|
||||||
return '-'
|
return "-";
|
||||||
}
|
}
|
||||||
if (level === -1) {
|
if (level === -1) {
|
||||||
return 'L-1'
|
return "L-1";
|
||||||
}
|
}
|
||||||
return `L${level}`
|
return `L${level}`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.this-level {
|
.this-level {
|
||||||
@ -390,5 +454,4 @@ export default {
|
|||||||
width: 150px;
|
width: 150px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user