|
@@ -33,8 +33,11 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="searList">
|
|
|
- <div class="searItem" v-loading.fullscreen.lock="fullscreenLoading" v-for="item in roleList" @click="searBtnFn(item)" :class="{'active': item.id == roleId}">
|
|
|
- {{item.roleName}}
|
|
|
+ <div class="searItem searItemLeft" element-loading-text="拼命加载中" v-loading.fullscreen.lock="fullscreenLoading" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.4)" v-for="item in roleList" @click="searBtnFn(item)" :class="{'active': item.id == roleId}" :key="item.id">
|
|
|
+ <span>
|
|
|
+ {{item.roleName}}
|
|
|
+ </span>
|
|
|
+ <i class="el-icon-delete" @click.stop="handleDelete(item)" v-if="item.id == roleId"></i>
|
|
|
</div>
|
|
|
</div>
|
|
|
<pagination sty v-show="total>0" :total="total" layout="prev, pager, next" :page.sync="queryParams.pageNum"
|
|
@@ -53,15 +56,18 @@
|
|
|
<div class="searName">
|
|
|
功能
|
|
|
</div>
|
|
|
- <div class="searItem" v-for="item in 8">
|
|
|
- <el-checkbox :label="'新增'+item"></el-checkbox>
|
|
|
+ <div class="searItem" v-for="item in menusList.heads">
|
|
|
+ <el-checkbox :label="item.name"></el-checkbox>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="searCont" v-for="items in 12" @click="searIndex = item" :class="{'active': searIndex == item}">
|
|
|
+ <div class="searCont" v-if="menusList.sysMenus.length" v-for="items in menusList.sysMenus" @click="searIndex = items.id" :class="{'active': searIndex == items.id}" :key="items.id">
|
|
|
<div class="searName">
|
|
|
- 功能功能{{items}}
|
|
|
+ {{items.menuName}}
|
|
|
</div>
|
|
|
- <div class="searItem" v-for="item in 8">
|
|
|
+ <div class="searItem" v-for="(itemChild,indexChild) in items.containsHead" :key="indexChild">
|
|
|
+ <!-- <el-checkbox-group v-model="checkedCities">
|
|
|
+ <el-checkbox v-for="(item,index) in items.containsHead" :key="index"></el-checkbox>
|
|
|
+ </el-checkbox-group> -->
|
|
|
<el-checkbox></el-checkbox>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -69,7 +75,30 @@
|
|
|
</el-col>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
- </el-row>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 添加或修改角色配置对话框 -->
|
|
|
+ <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
|
|
+ <el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
|
+ <el-form-item label="角色名称" prop="roleName">
|
|
|
+ <el-input v-model="form.roleName" placeholder="请输入角色名称" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="权限字符" prop="roleKey">
|
|
|
+ <el-input v-model="form.roleKey" placeholder="请输入权限字符" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="角色顺序" prop="roleSort">
|
|
|
+ <el-input-number v-model="form.roleSort" controls-position="right" :min="0" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注">
|
|
|
+ <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
+ <el-button @click="cancel">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -86,7 +115,7 @@
|
|
|
} from "@/api/system/role";
|
|
|
import {
|
|
|
treeselect as menuTreeselect,
|
|
|
- allLeafNodeById,
|
|
|
+ listMenus,
|
|
|
treeMenuNotAddLeafNode
|
|
|
} from "@/api/system/menu";
|
|
|
import {
|
|
@@ -105,7 +134,8 @@
|
|
|
children: 'children',
|
|
|
label: 'label'
|
|
|
},
|
|
|
- indexs: 3,
|
|
|
+ indexs: 3,
|
|
|
+ menusList: '',
|
|
|
// 遮罩层
|
|
|
loading: true,
|
|
|
// 选中数组
|
|
@@ -199,13 +229,15 @@
|
|
|
},
|
|
|
methods: {
|
|
|
qxList(e) {
|
|
|
- allLeafNodeById(e.id).then(res => {
|
|
|
- console.log(res)
|
|
|
+ listMenus(e.id).then(res => {
|
|
|
+ let data = res.data
|
|
|
+ this.menusList = data
|
|
|
})
|
|
|
},
|
|
|
refreshFn() {
|
|
|
- this.getList()
|
|
|
- this.deptOptions = []
|
|
|
+ // this.getList()
|
|
|
+ this.reload()
|
|
|
+ // this.deptOptions = []
|
|
|
},
|
|
|
searBtnFn(item) {
|
|
|
this.roleId = item.id
|
|
@@ -408,14 +440,14 @@
|
|
|
this.$refs["form"].validate(valid => {
|
|
|
if (valid) {
|
|
|
if (this.form.id != undefined) {
|
|
|
- this.form.menuIds = this.getMenuAllCheckedKeys();
|
|
|
+ // this.form.menuIds = this.getMenuAllCheckedKeys();
|
|
|
updateRole(this.form).then(response => {
|
|
|
this.msgSuccess("修改成功");
|
|
|
this.open = false;
|
|
|
this.getList();
|
|
|
});
|
|
|
} else {
|
|
|
- this.form.menuIds = this.getMenuAllCheckedKeys();
|
|
|
+ // this.form.menuIds = this.getMenuAllCheckedKeys();
|
|
|
addRole(this.form).then(response => {
|
|
|
this.msgSuccess("新增成功");
|
|
|
this.open = false;
|
|
@@ -442,11 +474,13 @@
|
|
|
this.$confirm('是否确认删除角色编号为"' + ids + '"的数据项?', "警告", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
|
- type: "warning"
|
|
|
+ type: "warning",
|
|
|
+
|
|
|
}).then(function() {
|
|
|
return delRole(ids);
|
|
|
}).then(() => {
|
|
|
- this.getList();
|
|
|
+ this.getList();
|
|
|
+ this.deptOptions = []
|
|
|
this.msgSuccess("删除成功");
|
|
|
})
|
|
|
},
|
|
@@ -459,7 +493,12 @@
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .searItemLeft{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
.roleContrBox {
|
|
|
background-color: #fff;
|
|
|
border-radius: 6px;
|