Skip to content

F
founder_vue
Commit 8699df37 by maxiaohan
Options

用户权限编辑、用户组权限编辑 静态页面

parent f69dd645
Showing with 1043 additions and 25 deletions
src/router/modules/index.js
......@@ -295,7 +295,7 @@ export default [
name: "GroupPermission",
hidden: true,
meta: {
title: "编辑用户权限",
title: "编辑用户组权限",
auth: "5"
},
component: () => import("@/views/SystemManage/GroupPermission.vue")
......
src/views/SystemManage/GroupPermission.vue
<template>
<div>{{ id }}</div>
<el-container class="manage-page" direction="vertical">
<!-- 0停用 1启用-->
<div class="header" :class="{ down: status === '0', up: status === '1' }">
<div class="title" :class="{ down: status === '0', up: status === '1' }">
<div class="title-status">
<div v-if="status === '0'" class="circle-red"></div>
<div v-if="status === '1'" class="circle-blue"></div>
{{ status === "0" ? "停用" : status === "1" ? "启用" : "无状态" }}
</div>
</div>
</div>
<div class="main">
<div class="header">
<div class="btns">
<div class="btn" :class="{ active: funFlag }" @click="funAuth">
功能权限
</div>
<div class="btn" :class="{ active: dataFlag }" @click="dataAuth">
数据权限
</div>
</div>
<div class="save">
<div class="btn" @click="save">保存</div>
<!-- <el-button @click="add">add</el-button>-->
<!-- <el-button @click="edit">edit</el-button>-->
<!-- <el-button @click="del">del</el-button>-->
<!-- <el-button @click="search">search</el-button>-->
</div>
</div>
<div class="role-info">
<!-- 角色权限菜单列-->
<div class="menus">
<div class="div3">
<el-checkbox v-model="roleMenus[0].flag">
{{ roleMenus[0].name }}
</el-checkbox>
<el-checkbox v-model="roleMenus[1].flag">
{{ roleMenus[1].name }}
</el-checkbox>
<el-checkbox v-model="roleMenus[2].flag">
{{ roleMenus[2].name }}
</el-checkbox>
</div>
<div class="div3">
<el-checkbox v-model="roleMenus[3].flag">
{{ roleMenus[3].name }}
</el-checkbox>
</div>
<div class="div1">
<el-checkbox v-model="roleMenus[4].flag">
{{ roleMenus[4].name }}
</el-checkbox>
</div>
<div class="div1">
<el-checkbox v-model="roleMenus[5].flag">
{{ roleMenus[5].name }}
</el-checkbox>
</div>
<div class="div1">
<el-checkbox v-model="roleMenus[6].flag">
{{ roleMenus[6].name }}
</el-checkbox>
</div>
<div class="div2">
<el-checkbox v-model="roleMenus[7].flag">
{{ roleMenus[7].name }}
</el-checkbox>
</div>
<div class="div3">
<el-checkbox v-model="roleMenus[8].flag">
{{ roleMenus[8].name }}
</el-checkbox>
</div>
</div>
<div class="content">
<div class="div3">
<div
class="line"
v-for="item in printCollectMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
<br />
<div class="line" v-for="item in printInputMenus" :key="item.code">
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
<br />
<div
class="line"
v-for="item in fileInformationInputMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div3">
<div
class="line"
v-for="item in comprehensiveMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div1">
<div class="line" v-for="item in seniorMenus" :key="item.code">
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div1">
<div
class="line"
v-for="item in qualityTestingMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div1">
<div
class="line"
v-for="item in seniorQualityTestingMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div2">
<div
class="line"
v-for="item in informationManageMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div3">
<div
class="line"
v-for="item in seniorManageMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<!-- <div class="line" v-for="item in " :key="item.code"></div>-->
</div>
</div>
</div>
</el-container>
</template>
<script>
......@@ -7,14 +158,167 @@ export default {
name: "GroupPermission",
data() {
return {
id: ""
id: "",
rolename: "",
status: "-1",
groupData: {},
funFlag: false,
dataFlag: false,
// 角色按钮
defaultRoleBtns: [
{ name: "指纹入库员", value: 1, flag: false },
{ name: "综合认定员", value: 2, flag: false },
{ name: "高级认定员", value: 3, flag: false },
{ name: "质量检查员", value: 4, flag: false },
{ name: "高级质量检查", value: 5, flag: false },
{ name: "一般管理员", value: 6, flag: false },
{ name: "超级管理员", value: 7, flag: false }
],
// 角色权限菜单
roleMenus: [
{ name: "指掌纹采集", code: 0, flag: false },
{ name: "指掌纹录入", code: 1, flag: false },
{ name: "档案信息录入", code: 2, flag: false },
{ name: "综合认定", code: 3, flag: false },
{ name: "高级认定", code: 4, flag: false },
{ name: "质量检查", code: 5, flag: false },
{ name: "高级质量检查", code: 6, flag: false },
{ name: "信息管理", code: 7, flag: false },
{ name: "高级管理", code: 8, flag: false }
],
// 指掌纹采集菜单
printCollectMenus: [
{ name: "指掌纹采集", code: 0, flag: false },
{ name: "非违法人员指纹采集", code: 1, flag: false }
],
// 指掌纹录入菜单
printInputMenus: [
{ name: "图片导入", code: 0, flag: false },
{ name: "FPTX数据导入", code: 1, flag: false },
{ name: "人员指纹扫描", code: 2, flag: false },
{ name: "案件指纹扫描", code: 3, flag: false },
{ name: "笔录指纹", code: 4, flag: false }
],
// 档案信息录入菜单
fileInformationInputMenus: [
{ name: "人员文字信息录入", code: 0, flag: false },
{ name: "案件文字信息录入", code: 1, flag: false }
],
// 综合认定
comprehensiveMenus: [
{ name: "发查询", code: 0, flag: false },
{ name: "比中认定-隐藏条码号", code: 1, flag: false },
{ name: "比中信息反馈", code: 2, flag: false },
{ name: "比中信息管理", code: 3, flag: false },
{ name: "破案信息管理", code: 4, flag: false },
{ name: "导入比中认定", code: 5, flag: false },
{ name: "填写比中抓获", code: 6, flag: false },
{ name: "人员信息新增修改", code: 7, flag: false },
{ name: "比中信息反馈", code: 8, flag: false },
{ name: "关注人员", code: 9, flag: false },
{ name: "关注条件", code: 10, flag: false },
{ name: "协查信息上报", code: 11, flag: false },
{ name: "提取现勘信息", code: 12, flag: false },
{ name: "人员指纹编辑", code: 13, flag: false },
{ name: "案件指纹编辑", code: 14, flag: false },
{ name: "文字信息修改", code: 15, flag: false },
{ name: "二次打印", code: 16, flag: false },
{ name: "比中信息撤销", code: 17, flag: false }
],
// 高级认定
seniorMenus: [
{ name: "比中认定-显示条码号", code: 1, flag: false },
{ name: "高级案件编辑", code: 2, flag: false },
{ name: "人案控制条码规则", code: 3, flag: false },
{ name: "基本/比中数据上报", code: 4, flag: false },
{ name: "全用户认定权限", code: 5, flag: false }
],
// 质量检查
qualityTestingMenus: [
{ name: "比中信息复核", code: 1, flag: false },
{ name: "协查信息复核", code: 2, flag: false },
{ name: "人案控制条码规则", code: 3, flag: false }
],
// 高级质量检查
seniorQualityTestingMenus: [
{ name: "比中信息复核", code: 1, flag: false },
{ name: "协查信息复核", code: 2, flag: false },
{ name: "人案控制条码规则", code: 3, flag: false }
],
// 信息管理
informationManageMenus: [
{ name: "比中信息管理", code: 1, flag: false },
{ name: "破案信息管理", code: 2, flag: false },
{ name: "协查信息管理", code: 3, flag: false },
{ name: "工作信息统计", code: 4, flag: false },
{ name: "战果查询上报", code: 5, flag: false },
{ name: "人员队列管理", code: 6, flag: false },
{ name: "案件队列管理", code: 7, flag: false },
{ name: "系统操作日志", code: 8, flag: false },
{ name: "复制案件数据", code: 9, flag: false },
{ name: "FPTX数据导出", code: 10, flag: false },
{ name: "批量处理操作", code: 11, flag: false }
],
// 高级管理
seniorManageMenus: [
{ name: "人案更改条码号", code: 1, flag: false },
{ name: "人案控制条码规则", code: 2, flag: false },
{ name: "删除人员数据", code: 3, flag: false },
{ name: "删除案件数据", code: 4, flag: false },
{ name: "删除查询数据", code: 5, flag: false },
{ name: "系统用户管理", code: 6, flag: false },
{ name: "系统分库管理", code: 7, flag: false },
{ name: "资源库管理", code: 8, flag: false },
{ name: "协查用户管理", code: 9, flag: false },
{ name: "人员类型管理", code: 10, flag: false },
{ name: "用户组管理", code: 11, flag: false },
{ name: "查询模块管理", code: 12, flag: false },
{ name: "上报条件设置", code: 13, flag: false },
{ name: "本地重卡反馈", code: 14, flag: false },
{ name: "本地涉案反馈", code: 15, flag: false }
],
// 保存的角色选项
roleMenusSelection: []
};
},
methods: {
funAuth() {
this.funFlag = true;
this.dataFlag = false;
console.info("功能权限");
},
dataAuth() {
this.funFlag = false;
this.dataFlag = true;
console.info("数据权限");
},
// 保存
save() {
this.roleMenusSelection = this.roleMenus;
console.info("roleMenusSelection====", this.roleMenusSelection);
}
},
mounted() {
this.funFlag = true;
this.id = this.$route.params.id;
console.info("chuancan", this.$route.params.id);
this.rolename = this.$route.params.rolename;
var usergroup = new URLSearchParams();
usergroup.append("Id", this.id);
// 获取用户组信息
this.$axios
.post("/login/usergroup/queryusergroup", usergroup)
.then(res => {
console.info(res.data);
this.groupData = res.data.usergroup;
this.status = res.data.usergroup.status;
console.info(res.data.usergroup.status);
})
.catch(failResponse => {});
}
};
</script>
<style scoped></style>
<style scoped lang="scss">
@import "scss/grouppermission.scss";
</style>
src/views/SystemManage/UserPermission.vue
<template>
<el-container class="manage-page" direction="vertical">
<div class="header" :class="{ stop: status === '0', up: status === '1' }">
<!-- <div-->
<!-- >-->
<!-- {{ id }}{{ rolename }}-->
<!-- </div>-->
<!-- 0停用 1启用-->
<div class="header" :class="{ down: status === '0', up: status === '1' }">
<div class="title" :class="{ down: status === '0', up: status === '1' }">
<div class="title-status">
<div v-if="status === '0'" class="circle-red"></div>
<div v-if="status === '1'" class="circle-blue"></div>
{{ status === "0" ? "停用" : status === "1" ? "启用" : "无状态" }}
</div>
</div>
</div>
<div class="main">
<div class="header">
<div class="btns">
<div class="btn" :class="{ active: funFlag }" @click="funAuth">
功能权限
</div>
<div class="btn" :class="{ active: dataFlag }" @click="dataAuth">
数据权限
</div>
</div>
<div class="save">
<div class="btn" @click="save">保存</div>
<!-- <el-button @click="add">add</el-button>-->
<!-- <el-button @click="edit">edit</el-button>-->
<!-- <el-button @click="del">del</el-button>-->
<!-- <el-button @click="search">search</el-button>-->
</div>
</div>
<div class="role-info">
<!-- 角色权限菜单列-->
<div class="menus">
<div class="div3">
<el-checkbox v-model="roleMenus[0].flag">
{{ roleMenus[0].name }}
</el-checkbox>
<el-checkbox v-model="roleMenus[1].flag">
{{ roleMenus[1].name }}
</el-checkbox>
<el-checkbox v-model="roleMenus[2].flag">
{{ roleMenus[2].name }}
</el-checkbox>
</div>
<div class="div3">
<el-checkbox v-model="roleMenus[3].flag">
{{ roleMenus[3].name }}
</el-checkbox>
</div>
<div class="div1">
<el-checkbox v-model="roleMenus[4].flag">
{{ roleMenus[4].name }}
</el-checkbox>
</div>
<div class="div1">
<el-checkbox v-model="roleMenus[5].flag">
{{ roleMenus[5].name }}
</el-checkbox>
</div>
<div class="div1">
<el-checkbox v-model="roleMenus[6].flag">
{{ roleMenus[6].name }}
</el-checkbox>
</div>
<div class="div2">
<el-checkbox v-model="roleMenus[7].flag">
{{ roleMenus[7].name }}
</el-checkbox>
</div>
<div class="div3">
<el-checkbox v-model="roleMenus[8].flag">
{{ roleMenus[8].name }}
</el-checkbox>
</div>
</div>
<div class="content">
<div class="div3">
<div
class="line"
v-for="item in printCollectMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
<br />
<div class="line" v-for="item in printInputMenus" :key="item.code">
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
<br />
<div
class="line"
v-for="item in fileInformationInputMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div3">
<div
class="line"
v-for="item in comprehensiveMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div1">
<div class="line" v-for="item in seniorMenus" :key="item.code">
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div1">
<div
class="line"
v-for="item in qualityTestingMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div1">
<div
class="line"
v-for="item in seniorQualityTestingMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div2">
<div
class="line"
v-for="item in informationManageMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<div class="div3">
<div
class="line"
v-for="item in seniorManageMenus"
:key="item.code"
>
<el-checkbox v-model="item.flag"> {{ item.name }}</el-checkbox>
</div>
</div>
<!-- <div class="line" v-for="item in " :key="item.code"></div>-->
</div>
</div>
</div>
</el-container>
</template>
......@@ -17,21 +161,158 @@ export default {
id: "",
rolename: "",
status: "-1",
userData: {}
userData: {},
funFlag: false,
dataFlag: false,
// 角色按钮
defaultRoleBtns: [
{ name: "指纹入库员", value: 1, flag: false },
{ name: "综合认定员", value: 2, flag: false },
{ name: "高级认定员", value: 3, flag: false },
{ name: "质量检查员", value: 4, flag: false },
{ name: "高级质量检查", value: 5, flag: false },
{ name: "一般管理员", value: 6, flag: false },
{ name: "超级管理员", value: 7, flag: false }
],
// 角色权限菜单
roleMenus: [
{ name: "指掌纹采集", code: 0, flag: false },
{ name: "指掌纹录入", code: 1, flag: false },
{ name: "档案信息录入", code: 2, flag: false },
{ name: "综合认定", code: 3, flag: false },
{ name: "高级认定", code: 4, flag: false },
{ name: "质量检查", code: 5, flag: false },
{ name: "高级质量检查", code: 6, flag: false },
{ name: "信息管理", code: 7, flag: false },
{ name: "高级管理", code: 8, flag: false }
],
// 指掌纹采集菜单
printCollectMenus: [
{ name: "指掌纹采集", code: 0, flag: false },
{ name: "非违法人员指纹采集", code: 1, flag: false }
],
// 指掌纹录入菜单
printInputMenus: [
{ name: "图片导入", code: 0, flag: false },
{ name: "FPTX数据导入", code: 1, flag: false },
{ name: "人员指纹扫描", code: 2, flag: false },
{ name: "案件指纹扫描", code: 3, flag: false },
{ name: "笔录指纹", code: 4, flag: false }
],
// 档案信息录入菜单
fileInformationInputMenus: [
{ name: "人员文字信息录入", code: 0, flag: false },
{ name: "案件文字信息录入", code: 1, flag: false }
],
// 综合认定
comprehensiveMenus: [
{ name: "发查询", code: 0, flag: false },
{ name: "比中认定-隐藏条码号", code: 1, flag: false },
{ name: "比中信息反馈", code: 2, flag: false },
{ name: "比中信息管理", code: 3, flag: false },
{ name: "破案信息管理", code: 4, flag: false },
{ name: "导入比中认定", code: 5, flag: false },
{ name: "填写比中抓获", code: 6, flag: false },
{ name: "人员信息新增修改", code: 7, flag: false },
{ name: "比中信息反馈", code: 8, flag: false },
{ name: "关注人员", code: 9, flag: false },
{ name: "关注条件", code: 10, flag: false },
{ name: "协查信息上报", code: 11, flag: false },
{ name: "提取现勘信息", code: 12, flag: false },
{ name: "人员指纹编辑", code: 13, flag: false },
{ name: "案件指纹编辑", code: 14, flag: false },
{ name: "文字信息修改", code: 15, flag: false },
{ name: "二次打印", code: 16, flag: false },
{ name: "比中信息撤销", code: 17, flag: false }
],
// 高级认定
seniorMenus: [
{ name: "比中认定-显示条码号", code: 1, flag: false },
{ name: "高级案件编辑", code: 2, flag: false },
{ name: "人案控制条码规则", code: 3, flag: false },
{ name: "基本/比中数据上报", code: 4, flag: false },
{ name: "全用户认定权限", code: 5, flag: false }
],
// 质量检查
qualityTestingMenus: [
{ name: "比中信息复核", code: 1, flag: false },
{ name: "协查信息复核", code: 2, flag: false },
{ name: "人案控制条码规则", code: 3, flag: false }
],
// 高级质量检查
seniorQualityTestingMenus: [
{ name: "比中信息复核", code: 1, flag: false },
{ name: "协查信息复核", code: 2, flag: false },
{ name: "人案控制条码规则", code: 3, flag: false }
],
// 信息管理
informationManageMenus: [
{ name: "比中信息管理", code: 1, flag: false },
{ name: "破案信息管理", code: 2, flag: false },
{ name: "协查信息管理", code: 3, flag: false },
{ name: "工作信息统计", code: 4, flag: false },
{ name: "战果查询上报", code: 5, flag: false },
{ name: "人员队列管理", code: 6, flag: false },
{ name: "案件队列管理", code: 7, flag: false },
{ name: "系统操作日志", code: 8, flag: false },
{ name: "复制案件数据", code: 9, flag: false },
{ name: "FPTX数据导出", code: 10, flag: false },
{ name: "批量处理操作", code: 11, flag: false }
],
// 高级管理
seniorManageMenus: [
{ name: "人案更改条码号", code: 1, flag: false },
{ name: "人案控制条码规则", code: 2, flag: false },
{ name: "删除人员数据", code: 3, flag: false },
{ name: "删除案件数据", code: 4, flag: false },
{ name: "删除查询数据", code: 5, flag: false },
{ name: "系统用户管理", code: 6, flag: false },
{ name: "系统分库管理", code: 7, flag: false },
{ name: "资源库管理", code: 8, flag: false },
{ name: "协查用户管理", code: 9, flag: false },
{ name: "人员类型管理", code: 10, flag: false },
{ name: "用户组管理", code: 11, flag: false },
{ name: "查询模块管理", code: 12, flag: false },
{ name: "上报条件设置", code: 13, flag: false },
{ name: "本地重卡反馈", code: 14, flag: false },
{ name: "本地涉案反馈", code: 15, flag: false }
],
// 保存的角色选项
roleMenusSelection: []
};
},
methods: {
funAuth() {
this.funFlag = true;
this.dataFlag = false;
console.info("功能权限");
},
dataAuth() {
this.funFlag = false;
this.dataFlag = true;
console.info("数据权限");
},
// 保存
save() {
this.roleMenusSelection = this.roleMenus;
console.info("roleMenusSelection====", this.roleMenusSelection);
}
},
mounted() {
this.funFlag = true;
this.id = this.$route.params.id;
this.rolename = this.$route.params.rolename;
var user = new URLSearchParams();
user.append("userId", this.id);
// 获取用户信息
this.$axios
.post("/login/user/queryuserInfo", user)
.then(res => {
if (res.data) {
console.info(res.data);
this.userData = res.data;
this.status = res.data.status;
this.userData = res.data.user;
this.status = res.data.user.status;
console.info(res.data.user.status);
}
})
.catch(failResponse => {});
......
src/views/SystemManage/scss/grouppermission.scss
.manage-page {
width: 100%;
padding: 24px;
font-family: MicrosoftYaHei;
div {
display: inline-block;
}
.header{
width: 1544px;
height: 54px;
border-radius: 8px;
overflow: hidden;
&.down{
background: #FEF5F6;
}
&.up{
background: #f2f7fe;
}
.title{
width: 96px;
height: 96px;
border-radius: 16px;
transform: rotate(40deg);
position: relative;
left: -23px;
top: -17px;
&.down{
background: #FAE1E4;
}
&.up{
background: #DDEBFF;
}
.title-status{
position: relative;
top: 28px;
left: 30px;
transform: rotate(-40deg);
.circle-red{
width: 8px;
height: 8px;
background-color:#FE0000;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
z-index: 100;
}
.circle-blue{
width: 8px;
height: 8px;
background-color:#055FE7;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
z-index: 100;
}
}
}
}
.main {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
.header {
height: 55px;
margin: 0 auto;
//margin-bottom: 3px;
.btns {
width: 224px;
height: 48px;
background: #f6f8fa;
border-radius: 8px;
text-align: center;
.btn {
margin-top: 8px;
width: 104px;
height: 32px;
line-height: 32px;
color: #666666;
cursor: pointer;
//&:hover{
// background: #FFFFFF;
// color: #055FE7;
// box-shadow: 0px 6px 8px 1px rgba(0, 21, 51, 0.05);
// border-radius: 6px;
//}
&.active {
background: #ffffff;
color: #055fe7;
box-shadow: 0px 6px 8px 1px rgba(0, 21, 51, 0.05);
border-radius: 6px;
}
}
}
.save {
.btn {
position: absolute;
right: 30px;
top: 150px;
width: 72px;
height: 32px;
background: #055fe7;
border-radius: 4px;
line-height: 32px;
color: #ffffff;
text-align: center;
}
}
}
.role-info {
width: 100%;
height: 690px;
background: #ffffff;
box-shadow: 1px 0px 3px 0px rgba(5, 95, 231, 0.3),
-1px 1px 3px 0px rgba(5, 95, 231, 0.24);
border-radius: 10px;
display: flex;
flex-direction: row;
.menus {
width: 155px;
height: 100%;
border-right: 1px solid #eeeeee;
.div3 {
width: 100%;
height: 130px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 12px 20px 0 20px;
}
}
.div2 {
width: 100%;
height: 90px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 25px 20px 0 25px;
}
}
.div1 {
width: 100%;
height: 70px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 25px 20px 0 25px;
}
}
// 未选中字体颜色
/deep/ .el-checkbox {
font-size: 14px;
color: #333333;
font-weight: 400;
}
/deep/ .el-checkbox__input .el-checkbox__inner:hover {
border-color: #055fe7;
}
// 选中样式
/deep/.el-checkbox__input.is-checked + .el-checkbox__label {
font-size: 14px;
font-weight: 400;
color: #333333;
}
/deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
background: #055fe7;
border-color: #055fe7;
}
}
.content {
width: 100%;
height: 725px;
.div3 {
width: 100%;
height: 130px;
border-bottom: 1px solid #eeeeee;
padding-left: 30px;
padding-top: 8px;
.line {
height: 40px;
}
}
.div2 {
width: 100%;
height: 90px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 10px 20px 0 25px;
}
.line {
height: 35px;
}
}
.div1 {
width: 100%;
height: 70px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 25px 20px 0 25px;
}
}
// 未选中字体颜色
/deep/ .el-checkbox {
//border: 1px darkblue solid;
width: 140px;
font-size: 14px;
color: #666666;
font-weight: 400;
margin-right: 50px;
}
/deep/ .el-checkbox__input .el-checkbox__inner:hover {
border-color: #055fe7;
}
// 选中样式
/deep/.el-checkbox__input.is-checked + .el-checkbox__label {
font-size: 14px;
font-weight: 400;
color: #333333;
}
/deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
background: #055fe7;
border-color: #055fe7;
}
}
}
}
}
\ No newline at end of file
src/views/SystemManage/scss/userpermission.scss
.manage-page {
width: 100%;
padding: 24px;
font-family: MicrosoftYaHei; border: 1px solid darkcyan;
font-family: MicrosoftYaHei;
div {
display: inline-block;
}
.header{
border: 1px solid #8b0027;
width: 1544px;
height: 54px;
border-radius: 8px;
&.stop{
overflow: hidden;
&.down{
background: #FEF5F6;
}
&.up{
background: #f2f7fe;
}
.title{
width: 96px;
height: 96px;
border-radius: 16px;
transform: rotate(40deg);
position: relative;
left: -23px;
top: -17px;
&.down{
background: #FAE1E4;
}
&.up{
background: #DDEBFF;
}
.title-status{
position: relative;
top: 28px;
left: 30px;
transform: rotate(-40deg);
.circle-red{
width: 8px;
height: 8px;
background-color:#FE0000;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
z-index: 100;
}
.circle-blue{
width: 8px;
height: 8px;
background-color:#055FE7;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
z-index: 100;
}
}
}
background: #F2F7FE;
}
.main {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
.header {
height: 55px;
margin: 0 auto;
//margin-bottom: 3px;
.btns {
width: 224px;
height: 48px;
background: #f6f8fa;
border-radius: 8px;
text-align: center;
.btn {
margin-top: 8px;
width: 104px;
height: 32px;
line-height: 32px;
color: #666666;
cursor: pointer;
//&:hover{
// background: #FFFFFF;
// color: #055FE7;
// box-shadow: 0px 6px 8px 1px rgba(0, 21, 51, 0.05);
// border-radius: 6px;
//}
&.active {
background: #ffffff;
color: #055fe7;
box-shadow: 0px 6px 8px 1px rgba(0, 21, 51, 0.05);
border-radius: 6px;
}
}
}
.save {
.btn {
position: absolute;
right: 30px;
top: 150px;
width: 72px;
height: 32px;
background: #055fe7;
border-radius: 4px;
line-height: 32px;
color: #ffffff;
text-align: center;
}
}
}
//.status{
// width: 96px;
// height: 96px;
// background: #FAE1E4;
// border-radius: 16px;
//
//}
.role-info {
width: 100%;
height: 690px;
background: #ffffff;
box-shadow: 1px 0px 3px 0px rgba(5, 95, 231, 0.3),
-1px 1px 3px 0px rgba(5, 95, 231, 0.24);
border-radius: 10px;
display: flex;
flex-direction: row;
.menus {
width: 155px;
height: 100%;
border-right: 1px solid #eeeeee;
.div3 {
width: 100%;
height: 130px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 12px 20px 0 20px;
}
}
.div2 {
width: 100%;
height: 90px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 25px 20px 0 25px;
}
}
.div1 {
width: 100%;
height: 70px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 25px 20px 0 25px;
}
}
// 未选中字体颜色
/deep/ .el-checkbox {
font-size: 14px;
color: #333333;
font-weight: 400;
}
/deep/ .el-checkbox__input .el-checkbox__inner:hover {
border-color: #055fe7;
}
// 选中样式
/deep/.el-checkbox__input.is-checked + .el-checkbox__label {
font-size: 14px;
font-weight: 400;
color: #333333;
}
/deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
background: #055fe7;
border-color: #055fe7;
}
}
.content {
width: 100%;
height: 725px;
.div3 {
width: 100%;
height: 130px;
border-bottom: 1px solid #eeeeee;
padding-left: 30px;
padding-top: 8px;
.line {
height: 40px;
}
}
.div2 {
width: 100%;
height: 90px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 10px 20px 0 25px;
}
.line {
height: 35px;
}
}
.div1 {
width: 100%;
height: 70px;
border-bottom: 1px solid #eeeeee;
.el-checkbox {
margin: 25px 20px 0 25px;
}
}
// 未选中字体颜色
/deep/ .el-checkbox {
//border: 1px darkblue solid;
width: 140px;
font-size: 14px;
color: #666666;
font-weight: 400;
margin-right: 50px;
}
/deep/ .el-checkbox__input .el-checkbox__inner:hover {
border-color: #055fe7;
}
// 选中样式
/deep/.el-checkbox__input.is-checked + .el-checkbox__label {
font-size: 14px;
font-weight: 400;
color: #333333;
}
/deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
background: #055fe7;
border-color: #055fe7;
}
}
}
}
}
\ No newline at end of file
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