This commit is contained in:
shiziyuan9527 2020-09-24 15:16:33 +08:00
commit 56491903de
1 changed files with 301 additions and 288 deletions

View File

@ -50,7 +50,8 @@
</el-card>
<!--Create user-->
<el-dialog :close-on-click-modal="false" :title="$t('user.create')" :visible.sync="createVisible" width="35%" @closed="handleClose"
<el-dialog :close-on-click-modal="false" :title="$t('user.create')" :visible.sync="createVisible" width="35%"
@closed="handleClose"
:destroy-on-close="true">
<el-form :model="form" label-position="right" label-width="120px" size="small" :rules="rule" ref="createUserForm">
<el-form-item label="ID" prop="id">
@ -81,10 +82,11 @@
:label="$t('role.' + item.id)"
:value="item.id"
>
{{$t('role.' + item.id)}}
{{ $t('role.' + item.id) }}
</el-option>
</el-select>
<el-button @click.prevent="removeRole(role)" style="margin-left: 20px;" v-if="form.roles.length > 1">{{$t('commons.delete')}}
<el-button @click.prevent="removeRole(role)" style="margin-left: 20px;" v-if="form.roles.length > 1">
{{ $t('commons.delete') }}
</el-button>
</el-form-item>
<div v-if="role.id === 'org_admin'">
@ -151,7 +153,9 @@
<el-form-item>
<template>
<el-button type="success" style="width: 100%;" @click="addRole('createUserForm')" :disabled="btnAddRole">{{$t('role.add')}}</el-button>
<el-button type="success" style="width: 100%;" @click="addRole('createUserForm')" :disabled="btnAddRole">
{{ $t('role.add') }}
</el-button>
</template>
</el-form-item>
</el-form>
@ -163,7 +167,8 @@
</el-dialog>
<!--Modify user information in system settings-->
<el-dialog :close-on-click-modal="false" :title="$t('user.modify')" :visible.sync="updateVisible" width="35%" :destroy-on-close="true"
<el-dialog :close-on-click-modal="false" :title="$t('user.modify')" :visible.sync="updateVisible" width="35%"
:destroy-on-close="true"
@close="handleClose" v-loading="result.loading">
<el-form :model="form" label-position="right" label-width="120px" size="small" :rules="rule" ref="updateUserForm">
<el-form-item label="ID" prop="id">
@ -191,7 +196,8 @@
:value="item.id">
</el-option>
</el-select>
<el-button @click.prevent="removeRole(role)" style="margin-left: 20px;" v-if="form.roles.length > 1">{{$t('commons.delete')}}
<el-button @click.prevent="removeRole(role)" style="margin-left: 20px;" v-if="form.roles.length > 1">
{{ $t('commons.delete') }}
</el-button>
</el-form-item>
<div v-if="role.id === 'org_admin'">
@ -257,7 +263,9 @@
</div>
<el-form-item>
<template>
<el-button type="success" style="width: 100%;" @click="addRole('updateUserForm')" :disabled="btnAddRole">{{$t('role.add')}}</el-button>
<el-button type="success" style="width: 100%;" @click="addRole('updateUserForm')" :disabled="btnAddRole">
{{ $t('role.add') }}
</el-button>
</template>
</el-form-item>
</el-form>
@ -268,7 +276,8 @@
</template>
</el-dialog>
<!--Changing user password in system settings-->
<el-dialog :close-on-click-modal="false" :title="$t('member.edit_password')" :visible.sync="editPasswordVisible" width="30%"
<el-dialog :close-on-click-modal="false" :title="$t('member.edit_password')" :visible.sync="editPasswordVisible"
width="30%"
:destroy-on-close="true" @close="handleClose" left>
<el-form :model="ruleForm" label-position="right" label-width="120px" size="small" :rules="rule"
ref="editPasswordForm" class="demo-ruleForm">
@ -290,297 +299,301 @@
</template>
<script>
import MsCreateBox from "../CreateBox";
import MsTablePagination from "../../common/pagination/TablePagination";
import MsTableHeader from "../../common/components/MsTableHeader";
import MsTableOperator from "../../common/components/MsTableOperator";
import MsDialogFooter from "../../common/components/MsDialogFooter";
import MsTableOperatorButton from "../../common/components/MsTableOperatorButton";
import {listenGoBack, removeGoBackListener} from "@/common/js/utils";
import MsRolesTag from "../../common/components/MsRolesTag";
import MsCreateBox from "../CreateBox";
import MsTablePagination from "../../common/pagination/TablePagination";
import MsTableHeader from "../../common/components/MsTableHeader";
import MsTableOperator from "../../common/components/MsTableOperator";
import MsDialogFooter from "../../common/components/MsDialogFooter";
import MsTableOperatorButton from "../../common/components/MsTableOperatorButton";
import {hasRole, listenGoBack, removeGoBackListener} from "@/common/js/utils";
import MsRolesTag from "../../common/components/MsRolesTag";
import {ROLE_ADMIN} from "@/common/js/constants";
export default {
name: "MsUser",
components: {
MsCreateBox,
MsTablePagination,
MsTableHeader,
MsTableOperator,
MsDialogFooter,
MsTableOperatorButton,
MsRolesTag
},
data() {
return {
queryPath: '/user/special/list',
deletePath: '/user/special/delete/',
createPath: '/user/special/add',
updatePath: '/user/special/update',
editPasswordPath: '/user/special/password',
result: {},
createVisible: false,
updateVisible: false,
editPasswordVisible: false,
btnAddRole: false,
multipleSelection: [],
userRole: [],
currentPage: 1,
pageSize: 5,
total: 0,
condition: {},
tableData: [],
form: {
roles: [{
id: ''
}]
},
checkPasswordForm: {},
ruleForm: {},
rule: {
id: [
{required: true, message: this.$t('user.input_id'), trigger: 'blur'},
{min: 2, max: 50, message: this.$t('commons.input_limit', [2, 50]), trigger: 'blur'},
{
required: true,
pattern: '^[^\u4e00-\u9fa5]+$',
message: this.$t('user.special_characters_are_not_supported'),
trigger: 'blur'
}
],
name: [
{required: true, message: this.$t('user.input_name'), trigger: 'blur'},
{min: 2, max: 50, message: this.$t('commons.input_limit', [2, 50]), trigger: 'blur'},
{
required: true,
message: this.$t('user.special_characters_are_not_supported'),
trigger: 'blur'
}
],
phone: [
{
required: false,
pattern: '^1(3|4|5|7|8)\\d{9}$',
message: this.$t('user.mobile_number_format_is_incorrect'),
trigger: 'blur'
}
],
email: [
{required: true, message: this.$t('user.input_email'), trigger: 'blur'},
{
required: true,
pattern: /^[a-zA-Z0-9_._-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/,
message: this.$t('user.email_format_is_incorrect'),
trigger: 'blur'
}
],
password: [
{required: true, message: this.$t('user.input_password'), trigger: 'blur'},
{
required: true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
message: this.$t('member.password_format_is_incorrect'),
trigger: 'blur'
}
],
newpassword: [
{required: true, message: this.$t('user.input_password'), trigger: 'blur'},
{
required: true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
message: this.$t('member.password_format_is_incorrect'),
trigger: 'blur'
}
]
}
}
},
activated() {
this.search();
this.getAllRole();
},
methods: {
create() {
this.createVisible = true;
this.getOrgList();
this.getWsList();
listenGoBack(this.handleClose);
export default {
name: "MsUser",
components: {
MsCreateBox,
MsTablePagination,
MsTableHeader,
MsTableOperator,
MsDialogFooter,
MsTableOperatorButton,
MsRolesTag
},
data() {
return {
queryPath: '/user/special/list',
deletePath: '/user/special/delete/',
createPath: '/user/special/add',
updatePath: '/user/special/update',
editPasswordPath: '/user/special/password',
result: {},
createVisible: false,
updateVisible: false,
editPasswordVisible: false,
btnAddRole: false,
multipleSelection: [],
userRole: [],
currentPage: 1,
pageSize: 5,
total: 0,
condition: {},
tableData: [],
form: {
roles: [{
id: ''
}]
},
edit(row) {
this.updateVisible = true;
this.form = Object.assign({}, row);
this.$get("/organization/list", response => {
this.$set(this.form, "orgList", response.data);
});
this.$get("/workspace/list", response => {
this.$set(this.form, "wsList", response.data);
});
if (row.id) {
this.$get('/userrole/all/' + encodeURIComponent(row.id), response => {
let data = response.data;
this.$set(this.form, "roles", data);
});
}
listenGoBack(this.handleClose);
},
editPassword(row) {
this.editPasswordVisible = true;
this.ruleForm = Object.assign({}, row);
listenGoBack(this.handleClose);
},
del(row) {
this.$confirm(this.$t('user.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
cancelButtonText: this.$t('commons.cancel'),
type: 'warning'
}).then(() => {
this.result = this.$get(this.deletePath + encodeURIComponent(row.id), () => {
this.$success(this.$t('commons.delete_success'));
this.search();
});
}).catch(() => {
this.$info(this.$t('commons.delete_cancel'));
});
},
createUser(createUserForm) {
this.$refs[createUserForm].validate(valid => {
if (valid) {
this.result = this.$post(this.createPath, this.form, () => {
this.$success(this.$t('commons.save_success'));
this.search();
this.createVisible = false;
});
} else {
return false;
checkPasswordForm: {},
ruleForm: {},
rule: {
id: [
{required: true, message: this.$t('user.input_id'), trigger: 'blur'},
{min: 2, max: 50, message: this.$t('commons.input_limit', [2, 50]), trigger: 'blur'},
{
required: true,
pattern: '^[^\u4e00-\u9fa5]+$',
message: this.$t('user.special_characters_are_not_supported'),
trigger: 'blur'
}
})
},
updateUser(updateUserForm) {
this.$refs[updateUserForm].validate(valid => {
if (valid) {
this.result = this.$post(this.updatePath, this.form, () => {
this.$success(this.$t('commons.modify_success'));
this.updateVisible = false;
this.search();
});
} else {
return false;
],
name: [
{required: true, message: this.$t('user.input_name'), trigger: 'blur'},
{min: 2, max: 50, message: this.$t('commons.input_limit', [2, 50]), trigger: 'blur'},
{
required: true,
message: this.$t('user.special_characters_are_not_supported'),
trigger: 'blur'
}
})
},
editUserPassword(editPasswordForm) {
this.$refs[editPasswordForm].validate(valid => {
if (valid) {
this.result = this.$post(this.editPasswordPath, this.ruleForm, () => {
this.$success(this.$t('commons.modify_success'));
this.editPasswordVisible = false;
this.search();
window.location.reload();
});
} else {
return false;
],
phone: [
{
required: false,
pattern: '^1(3|4|5|7|8)\\d{9}$',
message: this.$t('user.mobile_number_format_is_incorrect'),
trigger: 'blur'
}
})
},
search() {
this.result = this.$post(this.buildPagePath(this.queryPath), this.condition, response => {
let data = response.data;
this.total = data.itemCount;
this.tableData = data.listObject;
let url = "/user/special/user/role";
for (let i = 0; i < this.tableData.length; i++) {
if (this.tableData[i].id) {
this.$get(url + '/' + encodeURIComponent(this.tableData[i].id), result => {
let data = result.data;
let roles = data.roles;
// let userRoles = result.userRoles;
this.$set(this.tableData[i], "roles", roles);
this.$set(this.tableData[i], "isLdapUser", this.tableData[i].source === 'LDAP');
});
}
],
email: [
{required: true, message: this.$t('user.input_email'), trigger: 'blur'},
{
required: true,
pattern: /^[a-zA-Z0-9_._-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/,
message: this.$t('user.email_format_is_incorrect'),
trigger: 'blur'
}
})
},
handleClose() {
this.form = {roles: [{id: ''}]};
this.btnAddRole = false;
removeGoBackListener(this.handleClose);
this.editPasswordVisible = false;
this.createVisible = false;
this.updateVisible = false;
},
changeSwitch(row) {
this.$post('/user/special/update_status', row, () => {
this.$success(this.$t('commons.modify_success'));
})
},
buildPagePath(path) {
return path + "/" + this.currentPage + "/" + this.pageSize;
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
getOrgList() {
this.$get("/organization/list", response => {
this.$set(this.form, "orgList", response.data);
})
},
getWsList() {
this.$get("/workspace/list", response => {
this.$set(this.form, "wsList", response.data);
})
},
getAllRole() {
this.$get("/role/all", response => {
this.userRole = response.data;
})
},
addRole(validForm) {
this.$refs[validForm].validate(valid => {
if (valid) {
let roleInfo = {};
roleInfo.selects = [];
let ids = this.form.roles.map(r => r.id);
ids.forEach(id => {
roleInfo.selects.push(id);
})
let roles = this.form.roles;
roles.push(roleInfo);
if (this.form.roles.length > this.userRole.length - 1) {
this.btnAddRole = true;
}
} else {
return false;
],
password: [
{required: true, message: this.$t('user.input_password'), trigger: 'blur'},
{
required: true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
message: this.$t('member.password_format_is_incorrect'),
trigger: 'blur'
}
})
},
removeRole(item) {
let index = this.form.roles.indexOf(item);
if (index !== -1) {
this.form.roles.splice(index, 1)
}
if (this.form.roles.length < this.userRole.length) {
this.btnAddRole = false;
}
},
activeRole(roleInfo) {
return this.userRole.filter(function (role) {
let value = true;
if (!roleInfo.selects) {
return true;
],
newpassword: [
{required: true, message: this.$t('user.input_password'), trigger: 'blur'},
{
required: true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
message: this.$t('member.password_format_is_incorrect'),
trigger: 'blur'
}
if (roleInfo.selects.length === 0) {
value = true;
}
for (let i = 0; i < roleInfo.selects.length; i++) {
if (role.id === roleInfo.selects[i]) {
value = false;
}
}
return value;
})
]
}
}
},
activated() {
this.search();
this.getAllRole();
},
methods: {
create() {
this.createVisible = true;
this.getOrgList();
this.getWsList();
listenGoBack(this.handleClose);
},
edit(row) {
this.updateVisible = true;
this.form = Object.assign({}, row);
this.$get("/organization/list", response => {
this.$set(this.form, "orgList", response.data);
});
this.$get("/workspace/list", response => {
this.$set(this.form, "wsList", response.data);
});
if (row.id) {
this.$get('/userrole/all/' + encodeURIComponent(row.id), response => {
let data = response.data;
this.$set(this.form, "roles", data);
});
}
listenGoBack(this.handleClose);
},
editPassword(row) {
this.editPasswordVisible = true;
this.ruleForm = Object.assign({}, row);
listenGoBack(this.handleClose);
},
del(row) {
this.$confirm(this.$t('user.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
cancelButtonText: this.$t('commons.cancel'),
type: 'warning'
}).then(() => {
this.result = this.$get(this.deletePath + encodeURIComponent(row.id), () => {
this.$success(this.$t('commons.delete_success'));
this.search();
});
}).catch(() => {
this.$info(this.$t('commons.delete_cancel'));
});
},
createUser(createUserForm) {
this.$refs[createUserForm].validate(valid => {
if (valid) {
this.result = this.$post(this.createPath, this.form, () => {
this.$success(this.$t('commons.save_success'));
this.search();
this.createVisible = false;
});
} else {
return false;
}
})
},
updateUser(updateUserForm) {
this.$refs[updateUserForm].validate(valid => {
if (valid) {
this.result = this.$post(this.updatePath, this.form, () => {
this.$success(this.$t('commons.modify_success'));
this.updateVisible = false;
this.search();
});
} else {
return false;
}
})
},
editUserPassword(editPasswordForm) {
this.$refs[editPasswordForm].validate(valid => {
if (valid) {
this.result = this.$post(this.editPasswordPath, this.ruleForm, () => {
this.$success(this.$t('commons.modify_success'));
this.editPasswordVisible = false;
this.search();
window.location.reload();
});
} else {
return false;
}
})
},
search() {
if (!hasRole(ROLE_ADMIN)) {
return;
}
this.result = this.$post(this.buildPagePath(this.queryPath), this.condition, response => {
let data = response.data;
this.total = data.itemCount;
this.tableData = data.listObject;
let url = "/user/special/user/role";
for (let i = 0; i < this.tableData.length; i++) {
if (this.tableData[i].id) {
this.$get(url + '/' + encodeURIComponent(this.tableData[i].id), result => {
let data = result.data;
let roles = data.roles;
// let userRoles = result.userRoles;
this.$set(this.tableData[i], "roles", roles);
this.$set(this.tableData[i], "isLdapUser", this.tableData[i].source === 'LDAP');
});
}
}
})
},
handleClose() {
this.form = {roles: [{id: ''}]};
this.btnAddRole = false;
removeGoBackListener(this.handleClose);
this.editPasswordVisible = false;
this.createVisible = false;
this.updateVisible = false;
},
changeSwitch(row) {
this.$post('/user/special/update_status', row, () => {
this.$success(this.$t('commons.modify_success'));
})
},
buildPagePath(path) {
return path + "/" + this.currentPage + "/" + this.pageSize;
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
getOrgList() {
this.$get("/organization/list", response => {
this.$set(this.form, "orgList", response.data);
})
},
getWsList() {
this.$get("/workspace/list", response => {
this.$set(this.form, "wsList", response.data);
})
},
getAllRole() {
this.$get("/role/all", response => {
this.userRole = response.data;
})
},
addRole(validForm) {
this.$refs[validForm].validate(valid => {
if (valid) {
let roleInfo = {};
roleInfo.selects = [];
let ids = this.form.roles.map(r => r.id);
ids.forEach(id => {
roleInfo.selects.push(id);
})
let roles = this.form.roles;
roles.push(roleInfo);
if (this.form.roles.length > this.userRole.length - 1) {
this.btnAddRole = true;
}
} else {
return false;
}
})
},
removeRole(item) {
let index = this.form.roles.indexOf(item);
if (index !== -1) {
this.form.roles.splice(index, 1)
}
if (this.form.roles.length < this.userRole.length) {
this.btnAddRole = false;
}
},
activeRole(roleInfo) {
return this.userRole.filter(function (role) {
let value = true;
if (!roleInfo.selects) {
return true;
}
if (roleInfo.selects.length === 0) {
value = true;
}
for (let i = 0; i < roleInfo.selects.length; i++) {
if (role.id === roleInfo.selects[i]) {
value = false;
}
}
return value;
})
}
}
}
</script>
<style scoped>