github/basic
1
0
Fork 1
mirror of https://github.com/fantastic-admin/basic.git synced 2026-10-07 13:07:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

更新权限演示

Browse Source
This commit is contained in:
hooray
2020-10-23 11:59:32 +08:00
parent d5a2395a59
commit 11f9391c3b
2 changed files with 76 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/router/modules/permission.example.js
+2 -2
View File
@@ -6,7 +6,7 @@ export default {
redirect: '/permission_example/index',
name: 'permissionExample',
meta: {
title: '权限',
title: '权限验证',
icon: 'sidebar-permission'
},
children: [
@@ -15,7 +15,7 @@ export default {
name: 'permissionExampleIndex',
component: () => import(/* webpackChunkName: 'permission_example' */ '@/views/permission_example'),
meta: {
title: '权限',
title: '权限验证',
auth: ['permission.browse'],
sidebar: false,
breadcrumb: false,
src/views/permission_example/index.vue
+74 -18
View File
@@ -1,26 +1,69 @@
<template>
<div>
<page-header title="权限验证" />
<page-main>
<div>当前权限：{{ $store.state.global.openPermission ? '开' : '关' }}</div>
<div v-if="!$store.state.global.openPermission">请到 seeting.js 里打开权限功能，再进入该页面查看演示</div>
<div v-else>
<div>请对照代码查看演示</div>
<auth value="permission.browse">
如果你有 permission.browse 权限则能看到这句话
</auth>
<auth value="permission.create">
如果你有 permission.create 权限则能看到这句话
</auth>
<auth :value="['permission.browse', 'permission.create']">
如果你有 permission.browse 或 permission.create 权限则能看到这句话
</auth>
<auth-all :value="['permission.browse', 'permission.create']">
如果你有 permission.browse 和 permission.create 权限则能看到这句话
</auth-all>
<el-button @click="permissionCheck('permission.browse')">校验 permission.browse 权限</el-button>
<el-button @click="permissionCheck('permission.create')">校验 permission.create 权限</el-button>
<el-button @click="permissionCheck(['permission.browse', 'permission.create'])">校验 permission.browse 或 permission.create 权限</el-button>
<el-button @click="permissionCheck2(['permission.browse', 'permission.create'])">校验 permission.browse 和 permission.create 权限</el-button>
<h3>切换帐号</h3>
<el-radio-group v-model="account" @change="accountChange">
<el-radio-button label="admin" />
<el-radio-button label="test" />
</el-radio-group>
<h3>帐号权限</h3>
<div>{{ $store.state.global.permissions }}</div>
<h3>鉴权组件（请对照代码查看）</h3>
<div>
<auth value="permission.browse" style="margin-bottom: 10px;">
<el-tag>你有 permission.browse 权限</el-tag>
<template slot="no-auth">
<el-tag type="danger">你没有 permission.browse 权限</el-tag>
</template>
</auth>
<auth value="permission.create" style="margin-bottom: 10px;">
<el-tag>你有 permission.create 权限</el-tag>
<template slot="no-auth">
<el-tag type="danger">你没有 permission.create 权限</el-tag>
</template>
</auth>
<auth :value="['permission.browse', 'permission.create']" style="margin-bottom: 10px;">
<el-tag>你有 permission.browse 或 permission.create 权限</el-tag>
<template slot="no-auth">
<el-tag type="danger">你没有 permission.browse 或 permission.create 权限</el-tag>
</template>
</auth>
<auth-all :value="['permission.browse', 'permission.create']">
<el-tag>你有 permission.browse 和 permission.create 权限</el-tag>
<template slot="no-auth">
<el-tag type="danger">你没有 permission.browse 和 permission.create 权限</el-tag>
</template>
</auth-all>
</div>
<h3>鉴权指令（请对照代码查看）</h3>
<div>
<div v-auth="'permission.browse'">
如果你有 permission.browse 权限则能看到这句话
</div>
<div v-auth="'permission.create'">
如果你有 permission.create 权限则能看到这句话
</div>
<div v-auth="['permission.browse', 'permission.create']">
如果你有 permission.browse 或 permission.create 权限则能看到这句话
</div>
<div v-auth-all="['permission.browse', 'permission.create']">
如果你有 permission.browse 和 permission.create 权限则能看到这句话
</div>
</div>
<h3>鉴权函数（请对照代码查看）</h3>
<div>
<el-button-group style="display: block; margin-bottom: 10px;">
<el-button @click="permissionCheck('permission.browse')">校验 permission.browse 权限</el-button>
<el-button @click="permissionCheck('permission.create')">校验 permission.create 权限</el-button>
</el-button-group>
<el-button-group>
<el-button @click="permissionCheck(['permission.browse', 'permission.create'])">校验 permission.browse 或 permission.create 权限</el-button>
<el-button @click="permissionCheck2(['permission.browse', 'permission.create'])">校验 permission.browse 和 permission.create 权限</el-button>
</el-button-group>
</div>
</div>
</page-main>
</div>
@@ -28,7 +71,20 @@
<script>
export default {
data() {
return {
account: this.$store.state.token.account
}
},
methods: {
accountChange(val) {
this.$store.dispatch('token/login', {
account: val,
password: ''
}).then(() => {
location.reload()
})
},
permissionCheck(permissions) {
if (this.$auth(permissions)) {
this.$message.success('校验通过')