Browse Source

前端页面布局修改,后台数据库结构变化,需要重新导入数据库才可使用

main
pixel 5 years ago
parent
commit
4bf7109122
  1. 33
      QMPlusVuePage/src/api/api.js
  2. 4
      QMPlusVuePage/src/view/example/upload/upload.vue
  3. 14
      QMPlusVuePage/src/view/layout/aside/asideComponent/index.vue
  4. 41
      QMPlusVuePage/src/view/layout/aside/index.vue
  5. 5
      QMPlusVuePage/src/view/superAdmin/api/api.vue
  6. 17
      QMPlusVuePage/src/view/superAdmin/authority/authority.vue
  7. 37
      QMPlusVuePage/src/view/superAdmin/menu/menu.vue
  8. 4
      README.md

33
QMPlusVuePage/src/api/api.js

@ -101,39 +101,6 @@ export const getAllApis = (data) => {
}) })
} }
// @Tags authority
// @Summary 获取本角色所有有权限的apiId
// @Security ApiKeyAuth
// @accept application/json
// @Produce application/json
// @Param data body api.GetAuthorityId true "获取本角色所有有权限的apiId"
// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
// @Router /authority/getAuthAndApi [post]
export const getAuthAndApi = (data) => {
return service({
url: "/api/getAuthAndApi",
method: 'post',
data
})
}
// @Tags Api
// @Summary 创建api和角色关系
// @Security ApiKeyAuth
// @accept application/json
// @Produce application/json
// @Param data body api.AuthAndPathIn true "创建api和角色关系"
// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
// @Router /api/setAuthAndApi [post]
export const setAuthAndApi = (data) => {
return service({
url: "/api/setAuthAndApi",
method: 'post',
data
})
}
// @Tags Api // @Tags Api
// @Summary 删除指定api // @Summary 删除指定api
// @Security ApiKeyAuth // @Security ApiKeyAuth

4
QMPlusVuePage/src/view/example/upload/upload.vue

@ -19,9 +19,7 @@
</el-table-column> </el-table-column>
<el-table-column label="日期" prop="UpdatedAt" width="180"> <el-table-column label="日期" prop="UpdatedAt" width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<div>
{{scope.row.UpdatedAt|formatDate}}
</div>
<div>{{scope.row.UpdatedAt|formatDate}}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="文件名" prop="name" width="180"></el-table-column> <el-table-column label="文件名" prop="name" width="180"></el-table-column>

14
QMPlusVuePage/src/view/layout/aside/asideComponent/index.vue

@ -12,14 +12,14 @@ import AsyncSubmenu from './asyncSubmenu'
export default { export default {
name: 'AsideComponent', name: 'AsideComponent',
computed:{
menuComponent(){
if(this.routerInfo.children.length){
return 'AsyncSubmenu'
}else{
return 'MenuItem'
}
computed: {
menuComponent() {
if (this.routerInfo.children.length) {
return 'AsyncSubmenu'
} else {
return 'MenuItem'
} }
}
}, },
props: { props: {
routerInfo: { routerInfo: {

41
QMPlusVuePage/src/view/layout/aside/index.vue

@ -1,26 +1,21 @@
<template> <template>
<div> <div>
<div @click="isCollapse=!isCollapse" class="menu-total">
<i class="el-icon-arrow-right" v-if="isCollapse"></i>
<i class="el-icon-arrow-left" v-else></i>
</div>
<el-scrollbar style="height:calc(100vh - 60px)">
<el-menu
:collapse-transition="true"
:class="['el-menu-vertical',!isCollapse&&'noCollapse']"
:collapse="isCollapse"
:default-active="active"
@select="selectMenuItem"
unique-opened
background-color="#0F3D5F"
text-color="#bbb"
active-text-color="#fff"
>
<template v-for="item in asyncRouters[0].children">
<aside-component :key="item.name" :routerInfo="item" v-if="!item.hidden" />
</template>
</el-menu>
<el-scrollbar style="height:calc(100vh)">
<el-menu
:class="['el-menu-vertical',!isCollapse&&'noCollapse']"
:collapse="isCollapse"
:collapse-transition="true"
:default-active="active"
@select="selectMenuItem"
active-text-color="#fff"
background-color="#0F3D5F"
text-color="rgb(191, 203, 217)"
unique-opened
>
<template v-for="item in asyncRouters[0].children">
<aside-component :key="item.name" :routerInfo="item" v-if="!item.hidden" />
</template>
</el-menu>
</el-scrollbar> </el-scrollbar>
</div> </div>
</template> </template>
@ -61,8 +56,8 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.el-scrollbar{
.el-scrollbar__view{
.el-scrollbar {
.el-scrollbar__view {
height: 100%; height: 100%;
} }
} }

5
QMPlusVuePage/src/view/superAdmin/api/api.vue

@ -1,17 +1,18 @@
<template> <template>
<div> <div>
<div class="button-box clearflex"> <div class="button-box clearflex">
<el-button @click="openDialog('addApi')" type="primary">新增api</el-button>
</div> </div>
<div class="search-term"> <div class="search-term">
<el-form :inline="true" :model="searchInfo" class="demo-form-inline"> <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
<el-form-item label="路径"> <el-form-item label="路径">
<el-input v-model="searchInfo.path" placeholder="路径"></el-input> <el-input v-model="searchInfo.path" placeholder="路径"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button> <el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item> </el-form-item>
<el-form-item >
<el-button @click="openDialog('addApi')" type="primary">新增api</el-button>
</el-form-item>
</el-form> </el-form>
</div> </div>
<el-table :data="tableData" border stripe> <el-table :data="tableData" border stripe>

17
QMPlusVuePage/src/view/superAdmin/authority/authority.vue

@ -90,8 +90,8 @@ import {
createAuthority createAuthority
} from '@/api/authority' } from '@/api/authority'
import { getBaseMenuTree, addMenuAuthority, getMenuAuthority } from '@/api/menu' import { getBaseMenuTree, addMenuAuthority, getMenuAuthority } from '@/api/menu'
import { getAllApis, getAuthAndApi, setAuthAndApi } from '@/api/api'
import { casbinPUpdata,getPolicyPathByAuthorityId } from '@/api/casbin'
import { getAllApis } from '@/api/api'
import { casbinPUpdata, getPolicyPathByAuthorityId } from '@/api/casbin'
import infoList from '@/components/mixins/infoList' import infoList from '@/components/mixins/infoList'
export default { export default {
name: 'Authority', name: 'Authority',
@ -235,7 +235,9 @@ export default {
}, },
// api // api
async addAuthApi(row) { async addAuthApi(row) {
const res = await getPolicyPathByAuthorityId({ authorityId: row.authorityId })
const res = await getPolicyPathByAuthorityId({
authorityId: row.authorityId
})
this.activeUserId = row.authorityId this.activeUserId = row.authorityId
this.apiTreeIds = res.data.paths || [] this.apiTreeIds = res.data.paths || []
this.apiDialogFlag = true this.apiDialogFlag = true
@ -243,9 +245,12 @@ export default {
// //
async authApiEnter() { async authApiEnter() {
const checkArr = this.$refs.apiTree.getCheckedKeys(true) const checkArr = this.$refs.apiTree.getCheckedKeys(true)
const res = await casbinPUpdata({ authorityId: this.activeUserId,paths:checkArr})
if(res.success){
this.$message({type:"success",message:res.msg})
const res = await casbinPUpdata({
authorityId: this.activeUserId,
paths: checkArr
})
if (res.success) {
this.$message({ type: 'success', message: res.msg })
this.closeDialog() this.closeDialog()
} }
} }

37
QMPlusVuePage/src/view/superAdmin/menu/menu.vue

@ -3,23 +3,23 @@
<div class="button-box clearflex"> <div class="button-box clearflex">
<el-button @click="addMenu('0')" type="primary">新增根菜单</el-button> <el-button @click="addMenu('0')" type="primary">新增根菜单</el-button>
</div> </div>
<el-table :data="tableData" border stripe>
<el-table-column label="ID" min-width="40" prop="ID"></el-table-column>
<el-table-column label="路径" min-width="100" prop="path"></el-table-column>
<el-table-column label="名称" min-width="100" prop="name"></el-table-column>
<el-table :data="tableData" border stripe row-key="ID">
<el-table-column label="ID" min-width="100" prop="ID"></el-table-column>
<el-table-column label="路由Name" min-width="160" prop="name"></el-table-column>
<el-table-column label="是否隐藏" min-width="80" prop="hidden"> <el-table-column label="是否隐藏" min-width="80" prop="hidden">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.hidden?"隐藏":"显示"}}</span> <span>{{scope.row.hidden?"隐藏":"显示"}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="父节点Id" min-width="70" prop="parentId"></el-table-column>
<el-table-column label="文件路径" min-width="250" prop="component"></el-table-column>
<el-table-column label="展示名称" min-width="80" prop="authorityName">
<el-table-column label="父节点" min-width="70" prop="parentId"></el-table-column>
<el-table-column label="排序" min-width="70" prop="sort"></el-table-column>
<el-table-column label="文件路径" min-width="400" prop="component"></el-table-column>
<el-table-column label="展示名称" min-width="120" prop="authorityName">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.meta.title}}</span> <span>{{scope.row.meta.title}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="图标" min-width="180" prop="authorityName">
<el-table-column label="图标" min-width="140" prop="authorityName">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.meta.icon}}</span> <span>{{scope.row.meta.icon}}</span>
</template> </template>
@ -43,7 +43,7 @@
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
></el-pagination> ></el-pagination>
<el-dialog :visible.sync="dialogFormVisible" title="新增角色">
<el-dialog :visible.sync="dialogFormVisible" title="新增菜单">
<el-form :inline="true" :model="form" label-width="80px"> <el-form :inline="true" :model="form" label-width="80px">
<el-form-item label="路径"> <el-form-item label="路径">
<el-input autocomplete="off" v-model="form.path"></el-input> <el-input autocomplete="off" v-model="form.path"></el-input>
@ -69,6 +69,9 @@
<el-form-item label="图标"> <el-form-item label="图标">
<el-input autocomplete="off" v-model="form.meta.icon"></el-input> <el-input autocomplete="off" v-model="form.meta.icon"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="排序标记">
<el-input autocomplete="off" v-model="form.sort"></el-input>
</el-form-item>
</el-form> </el-form>
<div class="dialog-footer" slot="footer"> <div class="dialog-footer" slot="footer">
<el-button @click="closeDialog"> </el-button> <el-button @click="closeDialog"> </el-button>
@ -113,6 +116,22 @@ export default {
} }
}, },
methods: { methods: {
//
load(tree, treeNode, resolve) {
resolve([
{
id: 31,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
id: 32,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}
])
},
// //
deleteMenu(ID) { deleteMenu(ID) {
this.$confirm('此操作将永久删除所有角色下该菜单, 是否继续?', '提示', { this.$confirm('此操作将永久删除所有角色下该菜单, 是否继续?', '提示', {

4
README.md

@ -12,6 +12,10 @@
# gin-vue-admin gin+vue开源快速项目模板 # gin-vue-admin gin+vue开源快速项目模板
# 重构记录
2019年12月12日 17:15 第一次重构完成 主要更新后台数据库结构 引入casbin进行鉴权 后台代码结构整理 前端页面结构变更
注意!!!
在此时间之前拉取项目的朋友,pull代码后必须重新导入数据库数据,之前数据库结构不可使用
本模板使用前端ui框架为 element-ui https://element.eleme.cn/#/zh-CN 前端组件可查看elementUi文档使用 本模板使用前端ui框架为 element-ui https://element.eleme.cn/#/zh-CN 前端组件可查看elementUi文档使用
## 写在前面 ## 写在前面
本项目主要是小弟在接各种私活的时候发现频繁得书写CURD、权限管理、用户管理、列表、分页、上传下载、日志包封装、文档自动化等等功能 本项目主要是小弟在接各种私活的时候发现频繁得书写CURD、权限管理、用户管理、列表、分页、上传下载、日志包封装、文档自动化等等功能

Loading…
Cancel
Save