update:角色详情页面显示优化&&角色管理页部分逻辑完善

parent 175b3470
...@@ -31,7 +31,6 @@ exports.getAdd_role = async (ctx, next) => { ...@@ -31,7 +31,6 @@ exports.getAdd_role = async (ctx, next) => {
json: true, json: true,
body: ctx.request.body body: ctx.request.body
} }
console.log('server getAdd_role::::', opts)
ctx.body = await req(ctx, opts) ctx.body = await req(ctx, opts)
} }
exports.get_role_info = async (ctx, next) => { exports.get_role_info = async (ctx, next) => {
......
...@@ -13,8 +13,8 @@ ...@@ -13,8 +13,8 @@
</el-form-item> </el-form-item>
<el-form-item label="类型"> <el-form-item label="类型">
<el-select v-model="life_account.type" placeholder="类型"> <el-select v-model="life_account.type" placeholder="类型">
<el-option value="个人" label="个人"></el-option> <el-option value="1" label="个人"></el-option>
<el-option value="企业" label="企业"></el-option> <el-option value="2" label="企业"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
...@@ -83,7 +83,7 @@ export default { ...@@ -83,7 +83,7 @@ export default {
page, page,
page_size, page_size,
life_account_name: name, life_account_name: name,
life_account_type: type == "个人" ? 1 : type == "企业" ? 2 : '' life_account_type: type
} }
reqGetLifeNoList(params).then(res => { reqGetLifeNoList(params).then(res => {
this.totalNum = res.count this.totalNum = res.count
......
<template> <template>
<div class="life-no-detail"> <div class="life-no-detail">
<h4 class="titleInfo">生活号信息</h4> <el-button type="text" @click="goBack" icon="el-icon-arrow-left"
<el-descriptions :column="3" border> >返回</el-button
<template #extra> </template> >
<el-descriptions-item> <el-card class="management">
<template #label> ID </template> <h4 class="titleInfo">生活号信息</h4>
{{ life_account.life_account_id }} <el-descriptions :column="3" border>
</el-descriptions-item> <template #extra> </template>
<el-descriptions-item>
<template #label> 状态 </template>
{{ life_account.life_account_status == 1 ? "上线" : "下线" }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 创建人 </template>
{{ life_account.create_user_nick_name }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 创建时间 </template>
{{ life_account.create_time }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 生活号名称 </template>
{{ life_account.life_account_name }}
</el-descriptions-item>
</el-descriptions>
<h4 class="titleInfo">类型信息</h4>
<el-descriptions :column="3" border>
<template #extra> </template>
<el-descriptions-item>
<template #label>职业表标签 </template>
{{ personal_auth_record.occupation }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 姓名 </template>
{{ personal_auth_record.full_name }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 身份证号 </template>
{{ personal_auth_record.id_card }}
</el-descriptions-item>
<div v-if="company_auth_record">
<el-descriptions-item> <el-descriptions-item>
<template #label> 统一社会信用代码(注册码) </template> <template #label> ID </template>
{{ company_auth_record.code }} {{ life_account.life_account_id }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 企业注册名称 </template> <template #label> 状态 </template>
{{ company_auth_record.name }} {{ life_account.life_account_status == 1 ? "上线" : "下线" }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item>
<template #label> 创建人 </template>
{{ life_account.create_user_nick_name }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 创建时间 </template>
{{ life_account.create_time }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 生活号名称 </template>
{{ life_account.life_account_name }}
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="management">
<h4 class="titleInfo">类型信息</h4>
<el-descriptions :column="3" border>
<template #extra> </template>
<el-descriptions-item>
<template #label>职业表标签 </template>
{{ personal_auth_record.occupation }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 姓名 </template>
{{ personal_auth_record.full_name }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 身份证号 </template>
{{ personal_auth_record.id_card }}
</el-descriptions-item>
<div v-if="company_auth_record">
<el-descriptions-item>
<template #label> 统一社会信用代码(注册码) </template>
{{ company_auth_record.code }}
</el-descriptions-item>
<el-descriptions-item>
<template #label> 企业注册名称 </template>
{{ company_auth_record.name }}
</el-descriptions-item>
</div>
</el-descriptions>
</el-card>
<el-card class="management">
<h4 class="titleInfo">用户信息</h4>
<div class="accountRoleList">
<el-table :data="accountRoleList" border style="width: 100%">
<el-table-column prop="nick_name" label="昵称" width="180">
</el-table-column>
<el-table-column prop="mobile" label="账号" width="180">
</el-table-column>
<el-table-column :formatter="roleRangeFormat" label="管理员">
</el-table-column>
</el-table>
</div> </div>
</el-descriptions> </el-card>
<h4 class="title">用户信息</h4>
<el-table :data="accountRoleList" border style="width: 100%">
<el-table-column prop="nick_name" label="昵称" width="180">
</el-table-column>
<el-table-column prop="mobile" label="账号" width="180">
</el-table-column>
<el-table-column :formatter="roleRangeFormat" label="管理员">
</el-table-column>
</el-table>
</div> </div>
</template> </template>
<script> <script>
...@@ -86,14 +97,14 @@ export default { ...@@ -86,14 +97,14 @@ export default {
roleRangeFormat (row) { roleRangeFormat (row) {
return row.role_type == 1 ? '是' : '否' return row.role_type == 1 ? '是' : '否'
}, },
goBack () {
this.$router.go(-1)
}
} }
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.life-no-detail { .life-no-detail {
.title {
margin: 10px;
}
.titleInfo { .titleInfo {
margin-top: 10px; margin-top: 10px;
} }
...@@ -101,5 +112,11 @@ export default { ...@@ -101,5 +112,11 @@ export default {
.box-card { .box-card {
width: 100%; width: 100%;
} }
.accountRoleList {
margin-top: 20px;
}
.management {
margin-top: 20px;
}
} }
</style> </style>
\ No newline at end of file
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
:data="roleDataList" :data="roleDataList"
style="width: 100%; margin-top: 10px" style="width: 100%; margin-top: 10px"
:header-cell-style="{ background: '#e1e4e5', color: '#80878f' }" :header-cell-style="{ background: '#e1e4e5', color: '#80878f' }"
@row-click="toLifeDetail" @row-click="toRoleDetail"
> >
<el-table-column prop="role_name" label="角色名称" width="180"> <el-table-column prop="role_name" label="角色名称" width="180">
</el-table-column> </el-table-column>
...@@ -109,7 +109,7 @@ export default { ...@@ -109,7 +109,7 @@ export default {
return { return {
parmas: { parmas: {
page: 1, page: 1,
page_size: 20 page_size: 10
}, },
user_info: { user_info: {
user_name: "jianghaiming", user_name: "jianghaiming",
...@@ -128,7 +128,7 @@ export default { ...@@ -128,7 +128,7 @@ export default {
children: 'sub_permissions'//children值和哪个值绑定 children: 'sub_permissions'//children值和哪个值绑定
}, },
formLabelWidth: '120px', formLabelWidth: '120px',
selectedOptions: [189, 190],//选中权限类型 selectedOptions: [230, 231, 232],//选中权限类型
currentRolePrivilege: [],//当前权限设置 currentRolePrivilege: [],//当前权限设置
role_info_detail: {//详情非编辑项 role_info_detail: {//详情非编辑项
role_id: "", role_id: "",
...@@ -152,7 +152,7 @@ export default { ...@@ -152,7 +152,7 @@ export default {
}) })
}, },
methods: { methods: {
toLifeDetail (row) { toRoleDetail (row) {
this.$router.push({ name: 'RoleDetail', query: { roleId: row.role_id } }); this.$router.push({ name: 'RoleDetail', query: { roleId: row.role_id } });
}, },
newAddRole () { newAddRole () {
...@@ -167,7 +167,7 @@ export default { ...@@ -167,7 +167,7 @@ export default {
let { page, page_size } = this.parmas let { page, page_size } = this.parmas
reqGetRole_list(page, page_size).then(res => { reqGetRole_list(page, page_size).then(res => {
this.roleDataList = res.result this.roleDataList = res.result
this.totalNum = res.count this.totalNum = 24
}) })
}, },
//列表分页 //列表分页
......
This diff is collapsed.
<template> <template>
<div class="user-detail"> <div class="user-detail">
<h3 style="margin-bottom: 10px">角色详情</h3> <el-button type="text" @click="goBack" icon="el-icon-arrow-left"
<el-descriptions class="margin-top" :column="2" :size="size" border> >返回</el-button
<el-descriptions-item> >
<template #label>状态 </template> <el-card class="management">
{{ role_info_detail.role_status }} <h3 style="margin-bottom: 10px">角色详情</h3>
</el-descriptions-item> <el-descriptions class="margin-top" :column="2" border>
<el-descriptions-item> <el-descriptions-item>
<template #label> ID </template> <template #label>状态 </template>
{{ role_info_detail.role_id }} {{ role_info_detail.role_status }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 角色名称 </template> <template #label> ID </template>
{{ role_info_detail.role_name }} {{ role_info_detail.role_id }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 创建人账号 </template> <template #label> 角色名称 </template>
{{ role_info_detail.update_user_name }} {{ role_info_detail.role_name }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 创建时间 </template> <template #label> 创建人账号 </template>
{{ role_info_detail.create_time }} {{ role_info_detail.update_user_name }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 最后修改人账号 </template> <template #label> 创建时间 </template>
{{ role_info_detail.update_user_name }} {{ role_info_detail.create_time }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 最后修改时间 </template> <template #label> 最后修改人账号 </template>
{{ role_info_detail.update_time }} {{ role_info_detail.update_user_name }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 角色账号 </template> <template #label> 最后修改时间 </template>
{{ role_info_detail.role_status }} {{ role_info_detail.update_time }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> <el-descriptions-item>
<template #label> 角色账号 </template>
{{ role_info_detail.role_status }}
</el-descriptions-item>
</el-descriptions>
<div class="tree">
<div class="content">
<el-tree
:data="permissionsAll"
show-checkbox
:default-checked-keys="checkedKeys"
:default-expanded-keys="expandedKeys"
node-key="id"
ref="tree"
highlight-current
:props="defaultProps"
:expand-on-click-node="false"
>
</el-tree>
</div>
</div>
</el-card>
</div> </div>
</template> </template>
<script> <script>
import { get_role_info as reqGet_role_info } from '../../service/role' import { get_role_info as reqGet_role_info, getAll_role_list as reqGetAll_role_list, } from '../../service/role'
export default { export default {
data () { data () {
return { return {
roleId: this.$route.query.roleId, roleId: this.$route.query.roleId,
defaultProps: {
children: 'sub_permissions',
label: 'desc'
},
user_info: {
user_name: "jianghaiming",
user_email: "jianghaiming@126.com",
},
checkedKeys: [],
expandedKeys: [],
permissionsAll: [],
role_info_detail: {//详情非编辑项 role_info_detail: {//详情非编辑项
role_id: "", role_id: "",
role_name: "", role_name: "",
...@@ -55,8 +87,18 @@ export default { ...@@ -55,8 +87,18 @@ export default {
} }
}, },
created () { created () {
let { user_name, user_email } = this.user_info
reqGetAll_role_list(user_name, user_email).then(res => {
this.permissionsAll = res
this.permissionsAll.forEach(item => {
item.disabled = true
item.sub_permissions.forEach(element => {
element.disabled = true
})
})
})
reqGet_role_info(this.roleId).then((res) => { reqGet_role_info(this.roleId).then((res) => {
const { role_id, role_name, role_status, update_time, update_user_name, create_time, create_user_name } = res const { role_id, role_name, role_status, update_time, update_user_name, create_time, create_user_name, permissions } = res
this.role_info_detail = { this.role_info_detail = {
role_id, role_id,
role_name, role_name,
...@@ -66,12 +108,46 @@ export default { ...@@ -66,12 +108,46 @@ export default {
create_time, create_time,
create_user_name create_user_name
} }
this.editEchoData(permissions)
}) })
},
methods: {
goBack () {
this.$router.go(-1)
},
//遍历回显值selectedOptions
editEchoData (permissions) {
let parentArr = [], childArr = [], selectExpandedKeys = []
permissions.forEach(item => {
parentArr.push(item.sub_permissions)
selectExpandedKeys.push(item.id)
})
parentArr.forEach(element => {
element.forEach(val => {
childArr.push(val.id)
})
})
let selectedArr = []
for (let i in childArr) {
selectedArr.push(childArr[i]);
}
this.checkedKeys = selectedArr
this.expandedKeys = selectExpandedKeys
console.log(selectedArr, 'selectedArrselectedArrselectedArr')
},
} }
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.user-detail { .user-detail {
margin: 50px; margin: 50px;
.management {
margin-top: 20px;
}
.tree {
border: 1px solid #ebeef5;
margin-top: 20px;
}
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="user-detail"> <div class="user-detail">
<h2 style="margin-bottom: 10px">用户详情</h2> <el-button type="text" @click="goBack" icon="el-icon-arrow-left"
<el-descriptions class="margin-top" :column="3" :size="size" border> >返回</el-button
<el-descriptions-item> >
<template #label> 用户姓名 </template> <el-card class="management">
{{ user_info.user_name }} <h2 style="margin-bottom: 10px">用户详情</h2>
</el-descriptions-item> <el-descriptions class="margin-top" :column="3" :size="size" border>
<el-descriptions-item> <el-descriptions-item>
<template #label> 手机号 </template> <template #label> 用户姓名 </template>
{{ user_info.user_mobile }} {{ user_info.user_name }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 所属组织 </template> <template #label> 手机号 </template>
{{ user_info.organization }} {{ user_info.user_mobile }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 添加人账号 </template> <template #label> 所属组织 </template>
{{ user_info.create_user_name }} {{ user_info.organization }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 添加时间 </template> <template #label> 添加人账号 </template>
{{ user_info.create_time }} {{ user_info.create_user_name }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 最后修改人账号 </template> <template #label> 添加时间 </template>
{{ user_info.update_user_name }} {{ user_info.create_time }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 最后修改时间 </template> <template #label> 最后修改人账号 </template>
{{ user_info.update_user_name }} {{ user_info.update_user_name }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template #label> 敏感词权限 </template> <template #label> 最后修改时间 </template>
{{ user_info.is_sensitive_authority == 1 ? "有" : "无" }} {{ user_info.update_user_name }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> <el-descriptions-item>
<div class="role">已拥有角色池</div> <template #label> 敏感词权限 </template>
<el-table :data="role_list" border style="width: 100%"> {{ user_info.is_sensitive_authority == 1 ? "有" : "无" }}
<el-table-column prop="role_id" label="ID" width="180"> </el-table-column> </el-descriptions-item>
<el-table-column prop="role_name" label="角色名称"> </el-table-column> </el-descriptions>
</el-table> <div class="role">已拥有角色池</div>
<el-table :data="role_list" border style="width: 100%">
<el-table-column prop="role_id" label="ID" width="180">
</el-table-column>
<el-table-column prop="role_name" label="角色名称"> </el-table-column>
</el-table>
</el-card>
</div> </div>
</template> </template>
<script> <script>
...@@ -61,6 +67,9 @@ export default { ...@@ -61,6 +67,9 @@ export default {
this.user_info = res.user_info this.user_info = res.user_info
this.role_list = res.role_list this.role_list = res.role_list
}) })
},
goBack () {
this.$router.go(-1)
} }
} }
} }
......
<template> <template>
<div class="block"> <div class="block">
<!-- <el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-size="page_size"
background
layout="total,prev, pager, next"
:total="totalNum"
>
</el-pagination> -->
<el-pagination <el-pagination
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
...@@ -27,7 +18,7 @@ export default { ...@@ -27,7 +18,7 @@ export default {
data () { data () {
return { return {
currentPage: 1, currentPage: 1,
page_size: 20 page_size: 10
} }
}, },
methods: { methods: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment