Merge branch 'gin-vue-admin_v2_dev' of https://github.com/flipped-aurora/gin-vue-admin into gin-vue-admin_v2_dev
This commit is contained in:
klausY
@@ -59,4 +59,19 @@ export const setDataAuthority = (data) => {
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// @Summary 修改角色
|
||||
// @Security ApiKeyAuth
|
||||
// @accept application/json
|
||||
// @Produce application/json
|
||||
// @Param data body model.SysAuthority true "修改角色"
|
||||
// @Success 200 {string} string "{"success":true,"data":{},"msg":"设置成功"}"
|
||||
// @Router /authority/setDataAuthority [post]
|
||||
export const updateAuthority = (data) => {
|
||||
return service({
|
||||
url: "/authority/updateAuthority",
|
||||
method: 'put',
|
||||
data
|
||||
})
|
||||
}
|
||||
@@ -77,4 +77,21 @@ export const setUserAuthority = (data) => {
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// @Tags SysUser
|
||||
// @Summary 删除用户
|
||||
// @Security ApiKeyAuth
|
||||
// @accept application/json
|
||||
// @Produce application/json
|
||||
// @Param data body request.SetUserAuth true "删除用户"
|
||||
// @Success 200 {string} string "{"success":true,"data":{},"msg":"修改成功"}"
|
||||
// @Router /user/deleteUser [delete]
|
||||
export const deleteUser = (data) => {
|
||||
return service({
|
||||
url: "/user/deleteUser",
|
||||
method: 'delete',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
@@ -24,9 +24,5 @@ export default {
|
||||
this.page = table.data.page
|
||||
this.pageSize = table.data.pageSize
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getTableData()
|
||||
}
|
||||
|
||||
}
|
||||
+163
-160
@@ -530,11 +530,12 @@ ol,
|
||||
li {
|
||||
list-style-type: none;
|
||||
}
|
||||
.el-table__body-wrapper{
|
||||
tr{
|
||||
td{
|
||||
.cell{
|
||||
.el-button+.el-button{
|
||||
|
||||
.el-table__body-wrapper {
|
||||
tr {
|
||||
td {
|
||||
.cell {
|
||||
.el-button+.el-button {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
@@ -542,210 +543,204 @@ li {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// navbar
|
||||
.aside{
|
||||
.el-scrollbar {
|
||||
.el-scrollbar__view {
|
||||
.el-menu-vertical{
|
||||
background-color: #001529;
|
||||
}
|
||||
.el-menu-item:hover i,
|
||||
.el-menu-item:hover span{
|
||||
color:#fff;
|
||||
}
|
||||
li{
|
||||
background-color: #001529;
|
||||
|
||||
ul{
|
||||
.el-menu-item{
|
||||
background-color: #000408;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
}
|
||||
|
||||
.is-active{
|
||||
background-color:#1890ff;
|
||||
}
|
||||
.aside {
|
||||
.el-scrollbar {
|
||||
.el-scrollbar__view {
|
||||
.el-menu-vertical {
|
||||
background-color: #001529;
|
||||
}
|
||||
.el-menu-item:hover i,
|
||||
.el-menu-item:hover span {
|
||||
color: #fff;
|
||||
}
|
||||
li {
|
||||
background-color: #001529;
|
||||
ul {
|
||||
.el-menu-item {
|
||||
background-color: #000408;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
}
|
||||
.is-active {
|
||||
background-color: #1890ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-submenu__title:hover {
|
||||
background-color: #001529;
|
||||
}
|
||||
.el-submenu__title:hover i,
|
||||
.el-submenu__title:hover span {
|
||||
color: #fff;
|
||||
}
|
||||
.el-menu--inline {
|
||||
border-left: 5px solid #2c3b41;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-submenu__title:hover{
|
||||
background-color: #001529;
|
||||
}
|
||||
.el-submenu__title:hover i,
|
||||
.el-submenu__title:hover span{
|
||||
color:#fff;
|
||||
}
|
||||
|
||||
.el-menu--inline{
|
||||
border-left: 5px solid #2c3b41;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// layout
|
||||
.layout-cont{
|
||||
.main-cont{
|
||||
position: relative;
|
||||
&.el-main {
|
||||
background-color: #ecf0f5;
|
||||
padding: 0;
|
||||
}
|
||||
.breadcrumb{
|
||||
background-color: #fff;
|
||||
padding: 0 0 15px 15px;
|
||||
}
|
||||
.layout-cont {
|
||||
.main-cont {
|
||||
position: relative;
|
||||
&.el-main {
|
||||
background-color: #ecf0f5;
|
||||
padding: 0;
|
||||
}
|
||||
.breadcrumb {
|
||||
background-color: #fff;
|
||||
padding: 0 0 15px 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.admin-box {
|
||||
padding: 15px 20px;
|
||||
.el-button{
|
||||
padding: 7px 10px;
|
||||
}
|
||||
.el-input__inner{
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.el-input__icon{
|
||||
line-height: 30px;
|
||||
}
|
||||
.admin-box {
|
||||
padding: 15px 20px;
|
||||
.el-button {
|
||||
padding: 7px 10px;
|
||||
}
|
||||
.button-box{
|
||||
background: #fff;
|
||||
border: 1px solid #ebeef5;
|
||||
border-bottom: none;
|
||||
.el-input__inner {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.el-input__icon {
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.search-term{
|
||||
background: #fff;
|
||||
padding: 0 15px;
|
||||
border-left: 1px solid #ebeef5;
|
||||
border-right: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
.button-box {
|
||||
background: #fff;
|
||||
border: 1px solid #ebeef5;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.search-term {
|
||||
background: #fff;
|
||||
padding: 0 15px;
|
||||
border-left: 1px solid #ebeef5;
|
||||
border-right: 1px solid #ebeef5;
|
||||
}
|
||||
|
||||
// table
|
||||
.has-gutter{
|
||||
tr{
|
||||
th{
|
||||
.has-gutter {
|
||||
tr {
|
||||
th {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-table--striped{
|
||||
.el-table__body{
|
||||
tr.el-table__row--striped{
|
||||
td{
|
||||
|
||||
.el-table--striped {
|
||||
.el-table__body {
|
||||
tr.el-table__row--striped {
|
||||
td {
|
||||
background: #fff!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-table th, .el-table tr{
|
||||
}
|
||||
|
||||
.el-table th,
|
||||
.el-table tr {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
.el-pagination{
|
||||
|
||||
.el-pagination {
|
||||
.btn-prev,
|
||||
.btn-next{
|
||||
.btn-next {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.el-pager{
|
||||
|
||||
|
||||
li{
|
||||
.el-pager {
|
||||
li {
|
||||
color: #666;
|
||||
font-size: 12px;
|
||||
margin: 0 5px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// el-form
|
||||
.el-form{
|
||||
.el-form {
|
||||
background-color: #fff;
|
||||
padding: 10px 0;
|
||||
}
|
||||
.el-row{
|
||||
|
||||
.el-row {
|
||||
padding: 10px 0;
|
||||
.el-col>label{
|
||||
|
||||
line-height: 30px;
|
||||
text-align: right;
|
||||
width: 80%;
|
||||
padding-right: 15px;
|
||||
display: inline-block;
|
||||
|
||||
.el-col>label {
|
||||
line-height: 30px;
|
||||
text-align: right;
|
||||
width: 80%;
|
||||
padding-right: 15px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.line{
|
||||
.line {
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
// edit_container
|
||||
.edit_container{
|
||||
.edit_container {
|
||||
background-color: #fff;
|
||||
padding: 15px;
|
||||
.el-button {
|
||||
margin: 15px 0;
|
||||
}
|
||||
}
|
||||
.edit{
|
||||
|
||||
.edit {
|
||||
background-color: #fff;
|
||||
padding: 15px;
|
||||
padding: 15px;
|
||||
.el-button {
|
||||
margin: 15px 0;
|
||||
}
|
||||
}
|
||||
|
||||
// upload-demo
|
||||
.upload-demo,
|
||||
.upload{
|
||||
.upload {
|
||||
background-color: #fff;
|
||||
padding: 15px;
|
||||
.el-upload-list__item-status-label{
|
||||
padding: 15px;
|
||||
.el-upload-list__item-status-label {
|
||||
right: 0;
|
||||
left: 120px;
|
||||
}
|
||||
.el-upload__tip{
|
||||
.el-upload__tip {
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// system
|
||||
.system{
|
||||
.system {
|
||||
padding: 15px;
|
||||
.el-input__inner{
|
||||
.el-input__inner {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
// 导航
|
||||
#app {
|
||||
.el-container{
|
||||
.el-container {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
.el-container.mobile.openside {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
.hideside{
|
||||
.aside{
|
||||
.hideside {
|
||||
.aside {
|
||||
width: 54px!important;
|
||||
}
|
||||
}
|
||||
.el-aside{
|
||||
.el-aside {
|
||||
-webkit-transition: width .2s;
|
||||
transition: width .2s;
|
||||
width: 220px;
|
||||
@@ -759,66 +754,57 @@ li {
|
||||
z-index: 1001;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mobile.hideside{
|
||||
.el-aside{
|
||||
.mobile.hideside {
|
||||
.el-aside {
|
||||
// pointer-events: none;
|
||||
-webkit-transition-duration: .2s;
|
||||
transition-duration: .2s;
|
||||
-webkit-transform: translate3d(-210px,0,0);
|
||||
transform: translate3d(-220px,0,0);
|
||||
-webkit-transform: translate3d(-210px, 0, 0);
|
||||
transform: translate3d(-220px, 0, 0);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.mobile{
|
||||
.el-aside{
|
||||
.mobile {
|
||||
.el-aside {
|
||||
-webkit-transition: -webkit-transform .28s;
|
||||
transition: -webkit-transform .28s;
|
||||
transition: transform .28s;
|
||||
transition: transform .28s,-webkit-transform .28s;
|
||||
transition: transform .28s, -webkit-transform .28s;
|
||||
width: 210px!important
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-container{
|
||||
.el-container {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
.el-aside{
|
||||
.el-aside {
|
||||
// transition: none;
|
||||
.aside {
|
||||
.aside {
|
||||
background: #000;
|
||||
.el-menu{
|
||||
.el-menu {
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-cont.el-main{
|
||||
.main-cont.el-main {
|
||||
min-height: 100%;
|
||||
-webkit-transition: margin-left .28s;
|
||||
transition: margin-left .28s;
|
||||
margin-left: 220px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
.hideside{
|
||||
.main-cont.el-main{
|
||||
.hideside {
|
||||
.main-cont.el-main {
|
||||
margin-left: 54px;
|
||||
}
|
||||
}
|
||||
.mobile {
|
||||
.main-cont.el-main{
|
||||
.mobile {
|
||||
.main-cont.el-main {
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
}
|
||||
.openside.mobile{
|
||||
.shadowBg{
|
||||
.openside.mobile {
|
||||
.shadowBg {
|
||||
background: #000;
|
||||
opacity: .3;
|
||||
width: 100%;
|
||||
@@ -829,22 +815,39 @@ li {
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.el-menu--vertical{
|
||||
.el-menu{
|
||||
|
||||
.el-menu .el-menu--inline {
|
||||
background: #2c3b41;
|
||||
}
|
||||
|
||||
.el-submenu .el-submenu {
|
||||
background-color: #000408 !important;
|
||||
}
|
||||
|
||||
.aside .el-scrollbar .el-scrollbar__view .el-submenu__title:hover {
|
||||
background-color: #000408 !important;
|
||||
}
|
||||
|
||||
.el-submenu {
|
||||
.aside .el-scrollbar .el-scrollbar__view .el-submenu__title:hover {
|
||||
background-color: #000408 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--vertical {
|
||||
.el-menu {
|
||||
margin-left: -8px;
|
||||
background-color:rgb(48,65,86);
|
||||
.el-menu-item{
|
||||
background-color:rgb(48,65,86);
|
||||
background-color: rgb(48, 65, 86);
|
||||
.el-menu-item {
|
||||
background-color: rgb(48, 65, 86);
|
||||
}
|
||||
.el-menu-item:focus,
|
||||
.el-menu-item:hover{
|
||||
.el-menu-item:focus,
|
||||
.el-menu-item:hover {
|
||||
background-color: #263445;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 导航*****
|
||||
|
||||
|
||||
// 导航*****
|
||||
@@ -1,17 +1,31 @@
|
||||
<template>
|
||||
<div class="hello">
|
||||
<form id="fromCont" method="post">
|
||||
<input @change="choseFile" id="file" multiple="multiple" type="file" />
|
||||
<el-divider content-position="left">大文件上传</el-divider>
|
||||
<form id="fromCont" method="post" >
|
||||
<div class="fileUpload">
|
||||
选择文件<input @change="choseFile" id="file" multiple="multiple" type="file" />
|
||||
</div>
|
||||
</form>
|
||||
<el-button @click="getFile">上传</el-button>
|
||||
<span
|
||||
<el-button @click="getFile" :disabled="limitFileSize" type="primary" size="medium" class="uploadBtn">上传文件</el-button>
|
||||
<div class="el-upload__tip">请上传不超过5MB的文件</div>
|
||||
<div class="list">
|
||||
<transition-group name="list" tag="p">
|
||||
<div class="list-item" v-for="(item,i) in uploadList" :key="i" >
|
||||
<i class="el-icon-document"></i>
|
||||
<span>{{ item.name }}</span>
|
||||
<span v-if="file" class="percentage" >{{percentage}}%</span>
|
||||
<el-progress :show-text='false' :text-inside="false" :stroke-width="2" :percentage="percentage"></el-progress>
|
||||
</div>
|
||||
</transition-group>
|
||||
</div>
|
||||
|
||||
<!-- <span
|
||||
v-if="this.file"
|
||||
>{{Math.floor(((this.formDataList.length-this.waitNum)/this.formDataList.length)*100)}}%</span>
|
||||
<h2>此版本为先行体验功能测试版，样式美化和性能优化正在进行中，上传切片文件和合成的完整文件分别再QMPlusserver目录的breakpointDir文件夹和fileDir文件夹</h2>
|
||||
>{{Math.floor(((this.formDataList.length-this.waitNum)/this.formDataList.length)*100)}}%</span> -->
|
||||
<h2 class="tips">此版本为先行体验功能测试版，样式美化和性能优化正在进行中，上传切片文件和合成的完整文件分别再QMPlusserver目录的breakpointDir文件夹和fileDir文件夹</h2>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import SparkMD5 from 'spark-md5'
|
||||
import axios from 'axios'
|
||||
import {
|
||||
@@ -27,15 +41,25 @@ export default {
|
||||
fileMd5: '',
|
||||
formDataList: [],
|
||||
waitUpLoad: [],
|
||||
waitNum: 0
|
||||
waitNum: 0,
|
||||
limitFileSize: false,
|
||||
percentage:0,
|
||||
percentageFlage: true,
|
||||
customColor: '#409eff',
|
||||
uploadList:[]
|
||||
}
|
||||
},
|
||||
created(){
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 选中文件的函数
|
||||
async choseFile(e) {
|
||||
const fileR = new FileReader() // 创建一个reader用来读取文件流
|
||||
const file = e.target.files[0] // 获取当前文件
|
||||
const maxSize = 5*1024*1024
|
||||
this.file = file // file 丢全局方便后面用 可以改进为func传参形式
|
||||
if(file.size<maxSize){
|
||||
fileR.readAsArrayBuffer(file) // 把文件读成ArrayBuffer 主要为了保持跟后端的流一致
|
||||
fileR.onload = async e => {
|
||||
// 读成arrayBuffer的回调 e 为方法自带参数 相当于 dom的e 流存在e.target.result 中
|
||||
@@ -83,6 +107,10 @@ export default {
|
||||
}
|
||||
this.waitNum = this.waitUpLoad.length // 记录长度用于百分比展示
|
||||
}
|
||||
} else {
|
||||
this.limitFileSize = true
|
||||
this.$message('请上传小于5M文件')
|
||||
}
|
||||
},
|
||||
getFile() {
|
||||
// 确定按钮
|
||||
@@ -90,7 +118,14 @@ export default {
|
||||
this.$message('请先上传文件')
|
||||
return
|
||||
}
|
||||
this.percentage = Math.floor(((this.formDataList.length-this.waitNum)/this.formDataList.length)*100)
|
||||
if(this.percentage == 100){
|
||||
this.percentageFlage = false
|
||||
}
|
||||
this.sliceFile() // 上传切片
|
||||
if(this.percentage == 100){
|
||||
this.uploadList.push(this.file)
|
||||
}
|
||||
},
|
||||
sliceFile() {
|
||||
this.waitUpLoad &&
|
||||
@@ -119,7 +154,7 @@ export default {
|
||||
fileMd5: this.fileMd5
|
||||
}
|
||||
const res = await breakpointContinueFinish(params)
|
||||
if (res.code == 0) {
|
||||
if (res.success) {
|
||||
// 合成文件过后 删除缓存切片
|
||||
const params = {
|
||||
fileName: this.file.name,
|
||||
@@ -134,7 +169,7 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style lang='scss' scoped>
|
||||
h3 {
|
||||
margin: 40px 0 0;
|
||||
}
|
||||
@@ -149,4 +184,70 @@ li {
|
||||
a {
|
||||
color: #42b983;
|
||||
}
|
||||
</style>
|
||||
#fromCont{
|
||||
display: inline-block;
|
||||
}
|
||||
.fileUpload{
|
||||
padding: 4px 10px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
color: #000;
|
||||
border: 1px solid #c1c1c1;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
input{
|
||||
position: absolute;
|
||||
font-size: 100px;
|
||||
right: 0;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
.fileName{
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin: 6px 15px 0 15px;
|
||||
}
|
||||
.uploadBtn{
|
||||
position: relative;
|
||||
top: -10px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.tips{
|
||||
margin-top: 30px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #606266;
|
||||
}
|
||||
.el-divider{
|
||||
margin: 0 0 30px 0;
|
||||
}
|
||||
|
||||
.list{
|
||||
margin-top:15px;
|
||||
}
|
||||
.list-item {
|
||||
display: block;
|
||||
margin-right: 10px;
|
||||
color: #606266;
|
||||
line-height: 25px;
|
||||
margin-bottom: 5px;
|
||||
width: 40%;
|
||||
.percentage{
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.list-enter-active, .list-leave-active {
|
||||
transition: all 1s;
|
||||
}
|
||||
.list-enter, .list-leave-to
|
||||
/* .list-leave-active for below version 2.1.8 */ {
|
||||
opacity: 0;
|
||||
transform: translateY(-30px);
|
||||
}
|
||||
</style>
|
||||
@@ -121,6 +121,10 @@ export default {
|
||||
},
|
||||
closeDialog(){
|
||||
this.dialogFormVisible = false
|
||||
this.form = {
|
||||
customerName:"",
|
||||
customerPhoneData:""
|
||||
}
|
||||
},
|
||||
async deleteCustomer(row){
|
||||
this.visible = false
|
||||
@@ -149,7 +153,7 @@ export default {
|
||||
}
|
||||
|
||||
if(res.code == 0){
|
||||
this.dialogFormVisible = false
|
||||
this.closeDialog()
|
||||
this.getTableData()
|
||||
}
|
||||
},
|
||||
@@ -157,6 +161,9 @@ export default {
|
||||
this.type = "create"
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -145,6 +145,9 @@ export default {
|
||||
downloadFile(row) {
|
||||
downloadImage(row.url, row.name)
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -67,7 +67,12 @@
|
||||
:to="{ path: item.path }" 暂时注释不用-->
|
||||
<HistoryComponent />
|
||||
<transition mode="out-in" name="el-fade-in-linear">
|
||||
<router-view class="admin-box"></router-view>
|
||||
<keep-alive>
|
||||
<router-view v-if="$route.meta.keepAlive" class="admin-box"></router-view>
|
||||
</keep-alive>
|
||||
</transition>
|
||||
<transition mode="out-in" name="el-fade-in-linear">
|
||||
<router-view v-if="!$route.meta.keepAlive" class="admin-box"></router-view>
|
||||
</transition>
|
||||
</el-main>
|
||||
</el-container>
|
||||
|
||||
@@ -181,6 +181,12 @@ export default {
|
||||
},
|
||||
initForm() {
|
||||
this.$refs.apiForm.resetFields()
|
||||
this.form= {
|
||||
path: '',
|
||||
apiGroup: '',
|
||||
method: '',
|
||||
description: ''
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
this.initForm()
|
||||
@@ -253,7 +259,7 @@ export default {
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功',
|
||||
message: '编辑成功',
|
||||
showClose: true
|
||||
})
|
||||
}
|
||||
@@ -285,6 +291,9 @@ export default {
|
||||
const target = methodOptions.filter(item => item.value === value)[0]
|
||||
return target && `${target.type}`
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -16,19 +16,28 @@
|
||||
<el-table-column fixed="right" label="操作" min-width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="opdendrawer(scope.row)" size="small" type="text">设置权限</el-button>
|
||||
<el-button @click="deleteAuth(scope.row)" size="small" type="text">删除角色</el-button>
|
||||
<el-button @click="addAuthority(scope.row.authorityId)" size="small" type="text">新增子角色</el-button>
|
||||
<el-button @click="editAuthority(scope.row)" size="small" type="text">编辑角色</el-button>
|
||||
<el-button @click="deleteAuth(scope.row)" size="small" type="text">删除角色</el-button>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 新增角色弹窗 -->
|
||||
<el-dialog :visible.sync="dialogFormVisible" :title="dialogTitle">
|
||||
<el-form :model="form" :rules="rules" ref="authorityForm">
|
||||
<el-form-item label="父级角色ID" prop="parentId">
|
||||
<el-input autocomplete="off" disabled v-model="form.parentId"></el-input>
|
||||
<el-form-item label="父级角色" prop="parentId">
|
||||
<el-cascader
|
||||
:disabled="dialogType=='add'"
|
||||
v-model="form.parentId"
|
||||
:options="AuthorityOption"
|
||||
:show-all-levels="false"
|
||||
:props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
|
||||
filterable>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色ID" prop="authorityId">
|
||||
<el-input autocomplete="off" v-model="form.authorityId"></el-input>
|
||||
<el-input autocomplete="off" :disabled="dialogType=='edit'" v-model="form.authorityId"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色姓名" prop="authorityName">
|
||||
<el-input autocomplete="off" v-model="form.authorityName"></el-input>
|
||||
@@ -62,7 +71,8 @@
|
||||
import {
|
||||
getAuthorityList,
|
||||
deleteAuthority,
|
||||
createAuthority
|
||||
createAuthority,
|
||||
updateAuthority
|
||||
} from '@/api/authority'
|
||||
|
||||
import Menus from '@/view/superAdmin/authority/components/menus'
|
||||
@@ -75,8 +85,13 @@ export default {
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
return {
|
||||
AuthorityOption:[{
|
||||
authorityId:"0",
|
||||
authorityName:"根角色"
|
||||
}],
|
||||
listApi: getAuthorityList,
|
||||
drawer: false,
|
||||
dialogType:"add",
|
||||
activeRow: {},
|
||||
activeUserId: 0,
|
||||
dialogTitle:"新增角色",
|
||||
@@ -137,6 +152,11 @@ export default {
|
||||
// 初始化表单
|
||||
initForm() {
|
||||
this.$refs.authorityForm.resetFields()
|
||||
this.form = {
|
||||
authorityId: '',
|
||||
authorityName: '',
|
||||
parentId: '0'
|
||||
}
|
||||
},
|
||||
// 关闭窗口
|
||||
closeDialog() {
|
||||
@@ -156,28 +176,94 @@ export default {
|
||||
}
|
||||
this.$refs.authorityForm.validate(async valid => {
|
||||
if (valid) {
|
||||
const res = await createAuthority(this.form)
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
switch (this.dialogType) {
|
||||
case 'add':
|
||||
{
|
||||
const res = await createAuthority(this.form)
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'edit':
|
||||
{
|
||||
const res = await updateAuthority(this.form)
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
}
|
||||
}
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
}
|
||||
})
|
||||
},
|
||||
setOptions(){
|
||||
this.AuthorityOption = [{
|
||||
authorityId:"0",
|
||||
authorityName:"根角色"
|
||||
}]
|
||||
this.setAuthorityOptions(this.tableData,this.AuthorityOption,false)
|
||||
},
|
||||
setAuthorityOptions(AuthorityData,optionsData,disabled){
|
||||
AuthorityData&&AuthorityData.map(item=>{
|
||||
if(item.children.length){
|
||||
const option = {
|
||||
authorityId:item.authorityId,
|
||||
authorityName:item.authorityName,
|
||||
disabled:disabled||item.authorityId == this.form.authorityId,
|
||||
children:[]
|
||||
}
|
||||
this.setAuthorityOptions(item.children,option.children,disabled||item.authorityId == this.form.authorityId)
|
||||
optionsData.push(option)
|
||||
}else{
|
||||
const option = {
|
||||
authorityId:item.authorityId,
|
||||
authorityName:item.authorityName,
|
||||
disabled:disabled||item.authorityId == this.form.authorityId,
|
||||
}
|
||||
optionsData.push(option)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 增加角色
|
||||
addAuthority(parentId) {
|
||||
this.dialogTitle = "新增角色"
|
||||
this.dialogType = "add"
|
||||
this.form.parentId = parentId
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
|
||||
},
|
||||
// 编辑角色
|
||||
editAuthority(row) {
|
||||
this.setOptions()
|
||||
this.dialogTitle = "编辑角色"
|
||||
this.dialogType = "edit"
|
||||
for(let key in this.form){
|
||||
this.form[key] = row[key]
|
||||
}
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
async created() {
|
||||
this.pageSize = 999
|
||||
await this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -47,7 +47,14 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="父节点Id">
|
||||
<el-input autocomplete="off" disabled v-model="form.parentId"></el-input>
|
||||
<el-cascader
|
||||
:disabled="!this.isEdit"
|
||||
v-model="form.parentId"
|
||||
:options="menuOption"
|
||||
:show-all-levels="false"
|
||||
:props="{ checkStrictly: true,label:'title',value:'ID',disabled:'disabled',emitPath:false}"
|
||||
filterable>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="文件路径" prop="component">
|
||||
<el-input autocomplete="off" v-model="form.component"></el-input>
|
||||
@@ -55,12 +62,18 @@
|
||||
<el-form-item label="展示名称" prop="meta.title">
|
||||
<el-input autocomplete="off" v-model="form.meta.title"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="图标">
|
||||
<el-form-item label="图标" prop="meta.icon">
|
||||
<el-input autocomplete="off" v-model="form.meta.icon"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序标记">
|
||||
<el-form-item label="排序标记" prop="sort">
|
||||
<el-input autocomplete="off" v-model.number="form.sort"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="keepAlive" prop="meta.keepAlive">
|
||||
<el-select placeholder="是否keepAlive缓存页面" v-model="form.meta.keepAlive">
|
||||
<el-option :value="false" label="否"></el-option>
|
||||
<el-option :value="true" label="是"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="warning">新增菜单需要在角色管理内配置权限才可使用</div>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
@@ -90,6 +103,12 @@ export default {
|
||||
listApi: getMenuList,
|
||||
dialogFormVisible: false,
|
||||
dialogTitle:"新增菜单",
|
||||
menuOption:[
|
||||
{
|
||||
ID:"0",
|
||||
title:"根菜单"
|
||||
}
|
||||
],
|
||||
form: {
|
||||
ID: 0,
|
||||
path: '',
|
||||
@@ -99,7 +118,9 @@ export default {
|
||||
component: '',
|
||||
meta: {
|
||||
title: '',
|
||||
icon: ''
|
||||
icon: '',
|
||||
defaultMenu:false,
|
||||
keepAlive:false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
@@ -115,6 +136,34 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setOptions(){
|
||||
this.menuOption = [{
|
||||
ID:"0",
|
||||
title:"根目录"
|
||||
}]
|
||||
this.setMenuOptions(this.tableData,this.menuOption,false)
|
||||
},
|
||||
setMenuOptions(menuData,optionsData,disabled){
|
||||
menuData&&menuData.map(item=>{
|
||||
if(item.children.length){
|
||||
const option = {
|
||||
title:item.meta.title,
|
||||
ID:String(item.ID),
|
||||
disabled:disabled||item.ID == this.form.ID,
|
||||
children:[]
|
||||
}
|
||||
this.setMenuOptions(item.children,option.children,disabled||item.ID == this.form.ID)
|
||||
optionsData.push(option)
|
||||
}else{
|
||||
const option = {
|
||||
title:item.meta.title,
|
||||
ID:String(item.ID),
|
||||
disabled:disabled||item.ID == this.form.ID,
|
||||
}
|
||||
optionsData.push(option)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleClose(done) {
|
||||
this.initForm()
|
||||
done()
|
||||
@@ -163,6 +212,20 @@ export default {
|
||||
// 初始化弹窗内表格方法
|
||||
initForm() {
|
||||
this.$refs.menuForm.resetFields()
|
||||
this.form = {
|
||||
ID: 0,
|
||||
path: '',
|
||||
name: '',
|
||||
hidden: '',
|
||||
parentId: '',
|
||||
component: '',
|
||||
meta: {
|
||||
title: '',
|
||||
icon: '',
|
||||
defaultMenu:false,
|
||||
keepAlive:""
|
||||
}
|
||||
}
|
||||
},
|
||||
// 关闭弹窗
|
||||
closeDialog() {
|
||||
@@ -183,14 +246,9 @@ export default {
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功!'
|
||||
message: this.isEdit?'编辑成功':'添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '添加失败!'
|
||||
})
|
||||
}
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
@@ -202,6 +260,7 @@ export default {
|
||||
this.dialogTitle = "新增菜单"
|
||||
this.form.parentId = String(id)
|
||||
this.isEdit = false
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
// 修改菜单方法
|
||||
@@ -209,12 +268,15 @@ export default {
|
||||
this.dialogTitle = "编辑菜单"
|
||||
const res = await getBaseMenuById({ id })
|
||||
this.form = res.data.menu
|
||||
this.dialogFormVisible = true
|
||||
this.isEdit = true
|
||||
}
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
},
|
||||
created() {
|
||||
async created() {
|
||||
this.pageSize = 999
|
||||
await this.getTableData()
|
||||
await this.getMenuList(this.tableData)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -16,18 +16,29 @@
|
||||
<el-table-column label="昵称" min-width="150" prop="nickName"></el-table-column>
|
||||
<el-table-column label="用户角色" min-width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-select
|
||||
<el-cascader
|
||||
@change="changeAuthority(scope.row)"
|
||||
placeholder="请选择"
|
||||
v-model="scope.row.authority.authorityId"
|
||||
>
|
||||
<el-option
|
||||
:key="item.authorityId"
|
||||
:label="item.authorityName"
|
||||
:value="item.authorityId"
|
||||
v-for="item in authOptions"
|
||||
></el-option>
|
||||
</el-select>
|
||||
v-model="scope.row.authority.authorityId"
|
||||
:options="authOptions"
|
||||
:show-all-levels="false"
|
||||
:props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
|
||||
filterable>
|
||||
</el-cascader>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" min-width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-popover
|
||||
placement="top"
|
||||
width="160"
|
||||
v-model="scope.row.visible">
|
||||
<p>确定要删除此用户吗</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="deleteUser(scope.row)">确定</el-button>
|
||||
</div>
|
||||
<el-button type="text" size="small" slot="reference">删除</el-button>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -67,14 +78,14 @@
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户角色" label-width="80px" prop="authorityId">
|
||||
<el-select placeholder="请选择" v-model="userInfo.authorityId">
|
||||
<el-option
|
||||
:key="item.authorityId"
|
||||
:label="item.authorityName"
|
||||
:value="item.authorityId"
|
||||
v-for="item in authOptions"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-cascader
|
||||
@change="changeAuthority(scope.row)"
|
||||
v-model="userInfo.authorityId"
|
||||
:options="authOptions"
|
||||
:show-all-levels="false"
|
||||
:props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
|
||||
filterable>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
@@ -89,7 +100,7 @@
|
||||
<script>
|
||||
// 获取列表内容封装在mixins内部 getTableData方法 初始化已封装完成
|
||||
const path = process.env.VUE_APP_BASE_API
|
||||
import { getUserList, setUserAuthority, register } from '@/api/user'
|
||||
import { getUserList, setUserAuthority, register, deleteUser } from '@/api/user'
|
||||
import { getAuthorityList } from '@/api/authority'
|
||||
import infoList from '@/components/mixins/infoList'
|
||||
import { mapGetters } from 'vuex'
|
||||
@@ -127,6 +138,36 @@ export default {
|
||||
...mapGetters('user', ['token'])
|
||||
},
|
||||
methods: {
|
||||
setOptions(authData){
|
||||
this.authOptions = []
|
||||
this.setAuthorityOptions(authData,this.authOptions)
|
||||
},
|
||||
setAuthorityOptions(AuthorityData,optionsData){
|
||||
AuthorityData&&AuthorityData.map(item=>{
|
||||
if(item.children.length){
|
||||
const option = {
|
||||
authorityId:item.authorityId,
|
||||
authorityName:item.authorityName,
|
||||
children:[]
|
||||
}
|
||||
this.setAuthorityOptions(item.children,option.children)
|
||||
optionsData.push(option)
|
||||
}else{
|
||||
const option = {
|
||||
authorityId:item.authorityId,
|
||||
authorityName:item.authorityName,
|
||||
}
|
||||
optionsData.push(option)
|
||||
}
|
||||
})
|
||||
},
|
||||
async deleteUser(row){
|
||||
const res = await deleteUser({id:row.ID})
|
||||
if(res.code == 0){
|
||||
this.getTableData()
|
||||
row.visible = false
|
||||
}
|
||||
},
|
||||
async enterAddUserDialog() {
|
||||
this.$refs.userForm.validate(async valid => {
|
||||
if (valid) {
|
||||
@@ -160,8 +201,9 @@ export default {
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.getTableData()
|
||||
const res = await getAuthorityList({ page: 1, pageSize: 999 })
|
||||
this.authOptions = res.data.list
|
||||
this.setOptions(res.data.list)
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user