b2052ac3 by xiaomiao

角色管理人员勾选回显问腿处理

1 parent fac0bf8d
......@@ -142,8 +142,8 @@
padding: 24px 120px 0px;
.el-form-item {
margin-bottom: 24px;
.el-form-item__label {
color: #747e8c;
/deep/.el-form-item__label {
color: #ffffff;
}
::v-deep .el-input .el-input__inner {
padding: 0 8px;
......
......@@ -110,10 +110,10 @@
overflow-y: auto;
.form-wrapper {
padding: 24px 120px 0px;
.el-form-item {
/deep/.el-form-item {
margin-bottom: 24px;
.el-form-item__label {
color: #747e8c;
color: #ffffff;
}
::v-deep .el-input .el-input__inner {
padding: 0 8px;
......
......@@ -30,8 +30,8 @@
</el-row>
<el-row :gutter="24">
<el-col :span="12">
<el-form-item label="代码:" prop="code" label-width="54px">
<el-col :span="24">
<el-form-item label="代码:" prop="code" label-width="124px">
<el-input
v-model="codeComputed"
placeholder="请输入菜单代码"
......
import filter from '@/utils/filter.js'
class data extends filter {
constructor() {
super()
}
columns () {
return [
{
prop: "name",
label: "角色名称",
width: 330
},
{
prop: "type",
label: "类别",
width: 400
},
{
prop: "address",
label: "备注"
}
]
}
}
export default new data()
......@@ -4,8 +4,7 @@
:title="dialogTitle"
:show.sync="showAddEditDialog"
:width="'767px'"
@close="handleCloseDialog()"
>
@close="handleCloseDialog()">
<template slot="content">
<el-form ref="form" :model="dialogForm" :rules="rules" label-width="82px">
<el-row :gutter="24">
......@@ -14,8 +13,7 @@
<el-input
v-model="dialogForm.roleName"
clearable
placeholder="角色名称"
/>
placeholder="角色名称" />
</el-form-item>
</el-col>
<el-col :span="12">
......@@ -23,8 +21,7 @@
<el-input
v-model="dialogForm.roleType"
clearable
placeholder="角色类型"
/>
placeholder="角色类型" />
</el-form-item>
</el-col>
</el-row>
......@@ -35,8 +32,7 @@
<el-input
v-model="dialogForm.roleTextArea"
type="textarea"
placeholder="备注"
/>
placeholder="备注" />
</el-form-item>
</el-col>
</el-row>
......@@ -45,72 +41,89 @@
<template slot="footer">
<el-button
class="cancel-button"
@click="handleCloseDialog"
>取消</el-button>
@click="handleCloseDialog">取消</el-button>
<el-button
type="primary"
@click="handleSaveRole()"
>保存</el-button>
<el-button
type="primary"
@click="handleSaveRole()">保存</el-button>
</template>
</Dialog>
</template>
<script>
import Dialog from "@/components/Dialog/";
import { api, httpAction } from '@/api/manageApi'
export default {
components: {
Dialog
},
data() {
return {
dialogTitle: '',
showAddEditDialog: false,
menuType: '',
roleId: '',
sort: 0,
dialogForm: {
roleName: '',
roleType: '',
roleTextArea: ''
},
rules: {
roleName: [
{ required: true, message: '请输入角色名称', trigger: 'blur' }
],
roleType: [
{ required: true, message: '请输入角色类型', trigger: 'blur' }
import Dialog from "@/components/Dialog/";
import { api, httpAction } from '@/api/manageApi'
export default {
components: {
Dialog
},
data () {
return {
dialogTitle: '',
showAddEditDialog: false,
menuType: '',
roleId: '',
sort: 0,
dialogForm: {
roleName: '',
roleType: '',
roleTextArea: ''
},
rules: {
roleName: [
{ required: true, message: '请输入角色名称', trigger: 'blur' }
],
roleType: [
{ required: true, message: '请输入角色类型', trigger: 'blur' }
]
},
roleTypeOptions: [
{ name: '定制', value: '定制' },
{ name: '其他', value: '其他' }
]
},
roleTypeOptions: [
{ name: '定制', value: '定制' },
{ name: '其他', value: '其他' }
]
}
},
methods: {
// 保存新增或关闭事件
handleSaveRole(val) {
this.$refs.form.validate((valid) => {
if (valid) {
try {
const params = {
category: 2,
description: this.dialogForm.roleTextArea,
name: this.dialogForm.roleName,
sort: this.sort,
type: this.dialogForm.roleType
}
console.log("this.roleId",this.roleId);
if (this.roleId) {
params.id = this.roleId
console.log("修改",params.id,params);
httpAction(`${api.roles}/${params.id}`, params, 'post').then(
(res) => {
}
},
methods: {
// 保存新增或关闭事件
handleSaveRole (val) {
this.$refs.form.validate((valid) => {
if (valid) {
try {
const params = {
category: 2,
description: this.dialogForm.roleTextArea,
name: this.dialogForm.roleName,
sort: this.sort,
type: this.dialogForm.roleType
}
if (this.roleId) {
params.id = this.roleId
httpAction(`${api.roles}/${params.id}`, params, 'post').then(
(res) => {
if (res.status === 1) {
this.$message.success({
message: '修改成功',
showClose: true
})
this.dialogForm = {
roleName: '',
roleType: ''
}
this.showAddEditDialog = val
this.$emit('ok', this.menuType)
} else {
this.$message.error({
message: res.message,
showClose: true
})
}
}
)
} else {
httpAction(api.roles, params, 'post').then((res) => {
if (res.status === 1) {
this.$message.success({
message: '修改成功',
message: '新增成功',
showClose: true
})
this.dialogForm = {
......@@ -125,58 +138,42 @@ export default {
showClose: true
})
}
}
)
} else {
httpAction(api.roles, params, 'post').then((res) => {
if (res.status === 1) {
this.$message.success({
message: '新增成功',
showClose: true
})
this.dialogForm = {
roleName: '',
roleType: ''
}
this.showAddEditDialog = val
this.$emit('ok', this.menuType)
} else {
this.$message.error({
message: res.message,
showClose: true
})
}
})
})
}
} catch (e) {
console.error(e)
}
} catch (e) {
console.error(e)
}
})
},
// 取消事件
handleCloseDialog () {
this.$refs.form.resetFields()
this.dialogForm = {
roleName: '',
roleType: ''
}
})
},
// 取消事件
handleCloseDialog() {
this.$refs.form.resetFields()
this.dialogForm = {
roleName: '',
roleType: ''
this.showAddEditDialog = false
}
this.showAddEditDialog = false
}
}
}
</script>
<style scoped lang="scss">
/deep/.el-input__inner {
background: #07388B;
border-radius: 2px;
border: 1px solid #6BC1FC;
}
/deep/.el-textarea__inner{
background: #07388B;
color: #fff;
}
/deep/.el-form-item__label{
color:#fff;
}
/deep/.el-input__inner {
background: #07388b;
border-radius: 2px;
border: 1px solid #6bc1fc;
}
/deep/.el-textarea__inner {
background: #07388b;
color: #fff;
}
/deep/.el-form-item__label {
color: #fff;
}
/deep/.el-dialog__headerbtn {
position: absolute;
top: 15px;
right: 30px;
}
</style>
......
......@@ -22,7 +22,7 @@
:column="tableData.columns"
:data="listdata"
:expand-row-keys="keyList"
row-key="id">
row-key="dictid">
</lb-table>
</div>
<EditDialog ref="addEditDialog" @ok="reloadTableData" />
......@@ -376,8 +376,6 @@
}
this.$refs.rolesForm.personlist(this.waitMemberList, row.id);
// this.$refs.rolesForm.getMenuData();
this.$refs.rolesForm.menulist(this.operationList, row.id, this.selectedSubsystemCode, this.menutablelistData, this.operationCodes);
} else {
this.$message.error({ message: res.message, showClose: true });
......@@ -402,15 +400,15 @@
},
// 上移下移
moveUpward (index, row) {
realMove(row.id, "UP", this.listdata);
realMove(row.dictid, "UP", this.listdata);
this.key++;
let id = findParents(this.listdata, row.id);
let id = findParents(this.listdata, row.dictid);
this.keyList = id;
},
moveDown (index, row) {
realMove(row.id, "DOWN", this.listdata);
realMove(row.dictid, "DOWN", this.listdata);
this.key++;
let id = findParents(this.listdata, row.id);
let id = findParents(this.listdata, row.dictid);
this.keyList = id;
},
......
......@@ -10,7 +10,7 @@
{{ title || "标题" }}
</div>
<div class="editDialogBox-box">
<el-tabs v-model="activeName" type="card">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="人员配置" name="first"></el-tab-pane>
<el-tab-pane label="菜单配置" name="second"></el-tab-pane>
</el-tabs>
......@@ -19,7 +19,7 @@
ref="multipleTable"
:pagination="false"
:column="usertableData.column"
:data="usertableData.data"
:data="lastuserList"
@selection-change="handleSelectionChange"
@row-click="handleClickTableRow">
>
......@@ -27,7 +27,6 @@
<lb-table
:key="menukey"
v-if="activeName == 'second'"
ref="multipleTable1"
:pagination="false"
:column="menutableData.column"
:data="lastMenuList"
......@@ -99,7 +98,6 @@
label: "用户名",
},
],
data: []
},
// 角色id
roleId: "",
......@@ -107,6 +105,7 @@
queryParam: {},
menukey: 0,
activeName: "first",
lastuserList: [], // 人员表格数据
lastMenuList: [], // 重构完成的菜单表格数据
usermultipleSelection: [],
// 选中菜单列表
......@@ -132,8 +131,8 @@
// 人员配置点击行勾选数据
handleClickTableRow (row, event) {
this.checkNum1 = 0;
this.isCheck1 = false;
this.checkNum = 0;
this.isCheck = false;
if (event.label == "操作") {
return;
} else {
......@@ -163,10 +162,10 @@
}
}
if (this.usermultipleSelection.length > 0) {
this.checkNum1 = this.usermultipleSelection.length;
this.isCheck1 = true;
this.checkNum = this.usermultipleSelection.length;
this.isCheck = true;
} else {
this.isCheck1 = false;
this.isCheck = false;
}
},
// 获取授权主体的菜单权限
......@@ -304,19 +303,21 @@
personlist (a, rid) {
this.roleId = rid;
this.visible = true;
this.usertableData.data = a;
this.usertableData.data.forEach((item, index) => {
this.lastuserList = a;
this.lastuserList.forEach((item, index) => {
if (item.selectStatus === 0) {
this.$nextTick(() => {
this.$refs.multipleTable.toggleRowSelection(
this.usertableData.data[index],
true
);
this.$nextTick(async () => {
await this.$refs.multipleTable
if (this.$refs.multipleTable) {
this.$refs.multipleTable.toggleRowSelection(
this.lastuserList[index],
true
);
}
});
}
});
},
// 关闭事件
close () {
......@@ -351,7 +352,17 @@
},
// 勾选人员事件
handleSelectionChange (val) {
this.lastuserList.forEach((element, index) => {
delete this.lastuserList[index].selectStatus
});
this.usermultipleSelection = val;
this.lastuserList.forEach((element, index) => {
this.usermultipleSelection.forEach(element1 => {
if (element.id == element1.id) {
this.lastuserList[index].selectStatus = 0
}
});
});
},
// 数据筛选
setarrdata (scope, arr) {
......@@ -383,6 +394,23 @@
)
this.getAuthorizedInfo()
},
handleClick (tab, event) {
this.lastuserList.forEach((item, index) => {
if (item.selectStatus === 0) {
this.$nextTick(async () => {
await this.$refs.multipleTable
if (this.$refs.multipleTable) {
this.$refs.multipleTable.toggleRowSelection(
this.lastuserList[index],
true
);
}
});
}
});
}
},
};
</script>
......