Commit b2364aa9 authored by 徐一鸣's avatar 徐一鸣

Merge branch 'xym' into dev

parents e7514cbe 38e344e4
......@@ -582,4 +582,13 @@ width: 620px!important;
font-size: 14px;
color: #dde4ff;
margin: 0 20px;
}
.apass_checkbox .el-checkbox__input.is-checked .el-checkbox__inner,
.apass_checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #626de9;
border-color: #515fe7;
}
.apass_checkbox .el-checkbox__input.is-checked + .el-checkbox__label {
color: #58617a;
}
\ No newline at end of file
<template>
<div class="menu_permission">
<el-table border :data="data">
<el-table-column label="名称" width="214">
<template slot-scope="scope">
<div class="permission_list">
<el-checkbox
:value="selectAllInfo[scope.row.prop]"
@change="selectAll(scope.row.prop)"
<ul class="floor_list first" v-if="data && data.length">
<li v-for="(first_item, first_index) in data" :key="'p_' + first_index">
<div class="floor_item first">
<label
class="el-checkbox apass_checkbox"
:class="{ 'is-checked': first_item.selected }"
@click="selectedItem(first_item)"
>
<span
class="el-checkbox__input"
:class="{ 'is-checked': first_item.selected }"
>
{{ scope.row.name }}
</el-checkbox>
</div>
</template>
</el-table-column>
<el-table-column label="选项">
<template slot-scope="scope">
<el-checkbox-group
v-model="permissions[scope.row.prop]"
class="permission_list"
@change="selectPermission"
<span class="el-checkbox__inner"></span>
</span>
<span class="el-checkbox__label" v-text="first_item.name"></span>
</label>
</div>
<ul
class="floor_list second"
v-if="first_item.children && first_item.children.length"
>
<li
v-for="(second_item, second_index) in first_item.children"
:key="'p_' + first_index + '_' + second_index"
>
<el-checkbox
v-for="(item, index) in scope.row.children"
:label="item.value"
:key="'permission_' + index"
<div class="floor_item second">
<label
class="el-checkbox apass_checkbox"
:class="{ 'is-checked': second_item.selected }"
@click="selectedItem(second_item, first_item)"
>
<span
class="el-checkbox__input"
:class="{ 'is-checked': second_item.selected }"
>
<span class="el-checkbox__inner"></span>
</span>
<span
class="el-checkbox__label"
v-text="second_item.name"
></span>
</label>
</div>
<ul
class="floor_list third"
v-if="second_item.children && second_item.children.length"
>
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</template>
</el-table-column>
</el-table>
<li
v-for="(third_item, third_index) in second_item.children"
:key="
'p_' + first_index + '_' + second_index + '_' + third_index
"
>
<div class="floor_item third">
<label
class="el-checkbox apass_checkbox"
:class="{ 'is-checked': third_item.selected }"
@click="selectedItem(third_item, second_item, first_item)"
>
<span
class="el-checkbox__input"
:class="{ 'is-checked': third_item.selected }"
>
<span class="el-checkbox__inner"></span>
</span>
<span
class="el-checkbox__label"
v-text="third_item.name"
></span>
</label>
</div>
<ul
class="floor_list fourth"
v-if="third_item.children && third_item.children.length"
>
<li>
<div class="floor_item fourth">
<label
v-for="(fourth_item,
fourth_index) in third_item.children"
:key="
'p_' +
first_index +
'_' +
second_index +
'_' +
third_index +
'_' +
fourth_index
"
class="el-checkbox apass_checkbox"
:class="{ 'is-checked': fourth_item.selected }"
@click="
selectedItem(
fourth_item,
third_item,
second_item,
first_item
)
"
>
<span
class="el-checkbox__input"
:class="{ 'is-checked': fourth_item.selected }"
>
<span class="el-checkbox__inner"></span>
</span>
<span
class="el-checkbox__label"
v-text="fourth_item.name"
></span>
</label>
</div>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</template>
......@@ -41,86 +131,104 @@ export default {
event: "change-permissions",
},
props: {
permissions: {
type: Object,
default: {},
},
data: {
type: Array,
default: () => [],
},
},
data: () => ({
selectAllInfo: {},
}),
watch: {
permissions: {
handler() {
this.upSelectAllInfo();
},
deep: true,
},
},
methods: {
selectPermission(values) {
this.$emit("change-permissions", this.permissions);
},
upSelectAllInfo() {
this.data.forEach((item) => {
let values = this.permissions[item.prop];
let datas = this.data.find((v) => v.prop === item.prop).children;
let selectAllFlag = true;
selectedItem(
selected_item,
p_item = null, // 父元素
gp_item = null, // 祖父元素
ggp_item = null // 曾祖父元素
) {
let selected = !(selected_item.selected || false);
this.traverse(selected_item, (v) => {
this.$set(v, "selected", selected);
});
if (p_item) {
let selectedAll = true;
datas.forEach((v) => {
selectAllFlag = selectAllFlag && values.indexOf(v.value) > -1;
p_item.children.forEach((item) => {
selectedAll = selectedAll && item.selected;
});
this.selectAllInfo[item.prop] = selectAllFlag;
});
},
selectAll(prop) {
let newValues = { ...this.permissions };
this.$set(p_item, "selected", selectedAll);
}
this.selectAllInfo[prop] = !this.selectAllInfo[prop];
if (gp_item) {
let selectedAll = true;
if (this.selectAllInfo[prop]) {
newValues[prop] = this.data
.find((item) => item.prop === prop)
.children.map((item) => item.value);
} else {
newValues[prop] = [];
gp_item.children.forEach((item) => {
selectedAll = selectedAll && item.selected;
});
this.$set(gp_item, "selected", selectedAll);
}
if (ggp_item) {
let selectedAll = true;
ggp_item.children.forEach((item) => {
selectedAll = selectedAll && item.selected;
});
this.$set(ggp_item, "selected", selectedAll);
}
this.$emit("change", this.data);
},
traverse(obj, cb) {
cb(obj);
if (obj.children && obj.children.length) {
obj.children.forEach((item) => {
this.traverse(item, cb);
});
}
this.$emit("change-permissions", newValues);
},
},
mounted() {
this.upSelectAllInfo();
},
mounted() {},
};
</script>
<style>
.menu_permission .el-table__header-wrapper {
display: none;
<style scoped>
.floor_list > li {
display: flex;
justify-content: flex-start;
align-items: stretch;
}
.permission_list .el-checkbox {
color: #58617a;
line-height: 40px;
.floor_list.first > li {
border: 2px solid #f4f7fc;
border-radius: 7px;
overflow: hidden;
}
.permission_list .el-checkbox__input.is-checked .el-checkbox__inner,
.permission_list .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #626de9;
border-color: #515fe7;
.floor_list:not(.first) {
flex-grow: 1;
}
.permission_list .el-checkbox__input.is-checked + .el-checkbox__label {
color: #58617a;
.floor_list:not(.first) > li {
border-left: 2px solid #f4f7fc;
border-top: 2px solid #f4f7fc;
margin: -2px 0 0 -2px;
}
.menu_permission .el-table .cell {
padding: 0 50px !important;
.floor_list.first > li:not(:first-child) {
margin-top: 20px;
}
.menu_permission .el-table--border {
border: 1px solid #f4f7fc;
border-radius: 6px;
.floor_item {
min-width: 230px;
padding: 10px 30px;
display: flex;
justify-content: center;
align-items: center;
}
.floor_item.fourth {
width: 100%;
justify-content: flex-start;
}
.apass_checkbox {
line-height: 40px;
}
</style>
......@@ -51,9 +51,8 @@
style="margin-bottom:100px;margin-top:20px;"
>
<menu-permission
v-model="permission"
:data="permissionData"
@change-permissions="changePermissions"
@change="changePermissions"
></menu-permission>
</div>
</div>
......@@ -77,126 +76,200 @@ export default {
date: "",
},
now_user: 2, //0:普通用户,1:组织管理员,2:超级管理员
permission: {
value1: [11, 13],
value2: [],
value3: [31, 32, 33],
value4: [],
value5: [],
},
permissionData: [
{
name: "权限管理1",
prop: "value1",
selected: false,
value: 1,
children: [
{
name: "权限管理1",
name: "权限管理1-1",
selected: false,
value: 11,
children: [
{
name: "权限管理1-1-1",
selected: false,
value: 111,
children: [
{
name: "权限管理1-1-1-1",
selected: false,
value: 1111,
},
{
name: "权限管理1-1-1-2",
selected: false,
value: 1112,
},
{
name: "权限管理1-1-1-3",
selected: false,
value: 1113,
},
],
},
],
},
{
name: "权限管理2",
name: "权限管理1-2",
selected: false,
value: 12,
},
{
name: "权限管理3",
value: 13,
children: [
{
name: "权限管理1-2-1",
selected: false,
value: 121,
children: [
{
name: "权限管理1-2-1-1",
selected: false,
value: 1211,
},
{
name: "权限管理1-2-1-2",
selected: false,
value: 1212,
},
{
name: "权限管理1-2-1-3",
selected: false,
value: 1213,
},
],
},
],
},
],
},
{
name: "权限管理2",
prop: "value2",
selected: false,
value: 2,
children: [
{
name: "权限管理1",
name: "权限管理2-1",
selected: false,
value: 21,
children: [
{
name: "权限管理2-1-1",
selected: false,
value: 211,
children: [
{
name: "权限管理2-1-1-1",
selected: false,
value: 2111,
},
{
name: "权限管理2-1-1-2",
selected: false,
value: 2112,
},
{
name: "权限管理2-1-1-3",
selected: false,
value: 2113,
},
],
},
],
},
{
name: "权限管理2",
name: "权限管理2-2",
selected: false,
value: 22,
},
{
name: "权限管理3",
value: 23,
},
{
name: "权限管理4",
value: 24,
},
{
name: "权限管理5",
value: 25,
},
{
name: "权限管理6",
value: 26,
},
{
name: "权限管理7",
value: 27,
},
{
name: "权限管理8",
value: 28,
},
{
name: "权限管理9",
value: 29,
children: [
{
name: "权限管理2-2-1",
selected: false,
value: 221,
children: [
{
name: "权限管理2-2-1-1",
selected: false,
value: 2211,
},
{
name: "权限管理2-2-1-2",
selected: false,
value: 2212,
},
{
name: "权限管理2-2-1-3",
selected: false,
value: 2213,
},
],
},
],
},
],
},
{
name: "权限管理3",
prop: "value3",
selected: false,
value: 3,
children: [
{
name: "权限管理1",
name: "权限管理3-1",
selected: false,
value: 31,
children: [
{
name: "权限管理3-1-1",
selected: false,
value: 311,
children: [
{
name: "权限管理3-1-1-1",
selected: false,
value: 3111,
},
{
name: "权限管理3-1-1-2",
selected: false,
value: 3112,
},
{
name: "权限管理3-1-1-3",
selected: false,
value: 3113,
},
],
},
],
},
{
name: "权限管理2",
name: "权限管理3-2",
selected: false,
value: 32,
},
{
name: "权限管理3",
value: 33,
children: [
{
name: "权限管理3-2-1",
selected: false,
value: 321,
},
],
},
],
},
{
name: "权限管理4",
prop: "value4",
selected: false,
value: 4,
children: [
{
name: "权限管理1",
name: "权限管理4-1",
selected: false,
value: 41,
},
{
name: "权限管理2",
name: "权限管理4-2",
selected: false,
value: 42,
},
{
name: "权限管理4",
value: 43,
},
],
},
{
name: "权限管理5",
prop: "value5",
children: [
{
name: "权限管理1",
value: 51,
},
{
name: "权限管理2",
value: 52,
},
{
name: "权限管理5",
value: 53,
},
],
},
],
......
......@@ -15,22 +15,28 @@
<el-table-column label="" width="40"></el-table-column>
<el-table-column label="账号" width="160">
<template slot-scope="scope">
<span v-text="scope.row.account"></span>
<span v-text="scope.row.user_id"></span>
</template>
</el-table-column>
<el-table-column label="业务系统名称">
<template slot-scope="scope">
<span v-text="scope.row.name"></span>
<span v-text="scope.row.user_name"></span>
</template>
</el-table-column>
<el-table-column label="用户类型" align="center" width="240">
<template slot-scope="scope">
<span v-text="scope.row.role"></span>
<span
v-text="
['-', '超级管理员', '组织管理员', '普通用户', '开发者'][
scope.row.is_admin || 0
]
"
></span>
</template>
</el-table-column>
<el-table-column label="用户所属组织">
<template slot-scope="scope">
<span v-text="scope.row.organization"></span>
<span v-text="scope.row.department"></span>
</template>
</el-table-column>
<el-table-column label="用户状态" align="center" width="160">
......@@ -40,7 +46,7 @@
</el-table-column>
<el-table-column label="申请时间" align="center" width="200">
<template slot-scope="scope">
<span v-text="scope.row.update_time"></span>
<span v-text="scope.row.update_date"></span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="300">
......@@ -69,56 +75,51 @@ import apassDialog from "@/components/apass-dialog";
export default {
components: { apassList, apassDialog },
data: () => ({
listTotal: 300,
listData: [
{
account: "012344",
name: "贵阳机关事务大数据平台",
role: "普通用户",
organization: "贵阳市水利局",
state: 0,
update_time: "2020-04-27 13:24:19",
},
{
account: "012345",
name: "贵州省水利厅",
role: "普通用户",
organization: "贵阳市水利局",
state: 1,
update_time: "2020-04-27 13:24:19",
},
{
account: "012346",
name: "贵州省公安厅",
role: "普通用户",
organization: "贵阳市水利局",
state: 1,
update_time: "2020-04-27 13:24:19",
},
{
account: "012347",
name: "贵阳机关事务大数据平台",
role: "普通用户",
organization: "贵阳市水利局",
state: 1,
update_time: "2020-04-27 13:24:19",
},
{
account: "012348",
name: "长兴县应急指挥平台",
role: "普通用户",
organization: "贵阳市水利局",
state: 1,
update_time: "2020-04-27 13:24:19",
},
],
listTotal: 0,
listData: [],
}),
methods: {
listAction(value) {
console.log(value);
listAction(filters) {
this.$http
.get("/apaas/backmgt/user/userApply/list", {
params: {
page: filters.page,
limit: filters.size,
},
})
.then(({ data }) => {
this.listTotal = data.total;
this.listData = data.data;
})
.catch((error) => {
console.log(error);
});
},
permissionAction(item, passFlag = true) {
console.log((passFlag ? "通过 " : "拒绝 ") + item.name);
this.$http
.put(
"/apaas/backmgt/user/userApply",
{},
{
params: {
result: passFlag ? 1 : 0,
user_id: item.user_id,
id: item.id,
},
}
)
.then(({ data }) => {
this.$message({
message: `操作成功.`,
type: "success",
});
})
.catch((error) => {
this.$message({
message: `操作失败.`,
type: "warning",
});
});
},
},
};
......
......@@ -75,7 +75,7 @@ export default {
},
deleteItem(item) {
this.dialogInfo.title = "";
this.dialogInfo.msg = "确认删除当前角色";
this.dialogInfo.msg = "确认删除当前角色?";
this.dialogInfo.cancelText = "";
this.dialogInfo.sunbmitText = "";
this.dialogInfo.submit = () => {
......
......@@ -80,7 +80,7 @@
<a
class="btn"
:class="{ warn: scope.row.state === 1 }"
@click="setState(scope.row)"
@click="changeState(scope.row)"
>
{{ scope.row.state === 0 ? "启用" : "禁用" }}
</a>
......@@ -126,11 +126,33 @@ export default {
console.log(error);
});
},
setRole(item) {
console.log("setRole " + item.name);
},
setState(item) {
console.log("setState " + item.name);
changeState(item) {
console.log(item);
this.$http
.put(
"/apaas/backmgt/user/status",
{},
{
params: {
user_id: item.user_id,
status: item.state == 0 ? 1 : 0,
},
}
)
.then(({ data }) => {
this.$message({
message: `${item.state == 0 ? "已启用" : "已禁用"}${item.user_name}.`,
type: "success",
});
this.initDatas(this.tempFilter);
})
.catch((error) => {
this.$message({
message: `${item.state == 0 ? "启用" : "禁用"}${item.user_name}失败.`,
type: "warning",
});
});
},
},
};
......
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