refactor: 优化项目创建相关代码

This commit is contained in:
Captain.B 2021-06-01 11:28:02 +08:00 committed by 刘瑞斌
parent 5df76a9e8b
commit decc06d27c
1 changed files with 352 additions and 342 deletions

View File

@ -2,7 +2,8 @@
<div> <div>
<el-card class="table-card" v-loading="result.loading"> <el-card class="table-card" v-loading="result.loading">
<template v-slot:header> <template v-slot:header>
<ms-table-header :create-permission="['SYSTEM_WORKSPACE:READ+CREATE']" :condition.sync="condition" @search="list" @create="create" <ms-table-header :create-permission="['SYSTEM_WORKSPACE:READ+CREATE']" :condition.sync="condition"
@search="list" @create="create"
:create-tip="$t('workspace.create')" :title="$t('commons.workspace')"/> :create-tip="$t('workspace.create')" :title="$t('commons.workspace')"/>
</template> </template>
<!-- workspace table --> <!-- workspace table -->
@ -24,7 +25,9 @@
<div> <div>
<ms-table-operator :edit-permission="['SYSTEM_WORKSPACE:READ+EDIT']" <ms-table-operator :edit-permission="['SYSTEM_WORKSPACE:READ+EDIT']"
:delete-permission="['SYSTEM_WORKSPACE:READ+DELETE']" :delete-permission="['SYSTEM_WORKSPACE:READ+DELETE']"
@editClick="edit(scope.row)" @deleteClick="handleDelete(scope.row)"/> :show-delete="workspaceId !== scope.row.id"
@editClick="edit(scope.row)"
@deleteClick="handleDelete(scope.row)"/>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -206,371 +209,378 @@
</template> </template>
<script> <script>
import MsCreateBox from "../CreateBox"; import MsCreateBox from "../CreateBox";
import {Message} from "element-ui"; import {Message} from "element-ui";
import MsTablePagination from "../../common/pagination/TablePagination"; import MsTablePagination from "../../common/pagination/TablePagination";
import MsTableHeader from "../../common/components/MsTableHeader"; import MsTableHeader from "../../common/components/MsTableHeader";
import MsRolesTag from "../../common/components/MsRolesTag"; import MsRolesTag from "../../common/components/MsRolesTag";
import MsTableOperator from "../../common/components/MsTableOperator"; import MsTableOperator from "../../common/components/MsTableOperator";
import MsTableOperatorButton from "../../common/components/MsTableOperatorButton"; import MsTableOperatorButton from "../../common/components/MsTableOperatorButton";
import MsDialogFooter from "../../common/components/MsDialogFooter"; import MsDialogFooter from "../../common/components/MsDialogFooter";
import { import {
getCurrentUser, getCurrentUser,
getCurrentWorkspaceId, listenGoBack, getCurrentWorkspaceId,
refreshSessionAndCookies, removeGoBackListener listenGoBack,
} from "@/common/js/utils"; refreshSessionAndCookies,
import {DEFAULT, GROUP_ORGANIZATION, GROUP_WORKSPACE, WORKSPACE} from "@/common/js/constants"; removeGoBackListener
import MsDeleteConfirm from "../../common/components/MsDeleteConfirm"; } from "@/common/js/utils";
import {DEFAULT, GROUP_WORKSPACE, WORKSPACE} from "@/common/js/constants";
import MsDeleteConfirm from "../../common/components/MsDeleteConfirm";
export default { export default {
name: "MsSystemWorkspace", name: "MsSystemWorkspace",
components: { components: {
MsDeleteConfirm, MsDeleteConfirm,
MsCreateBox, MsCreateBox,
MsTablePagination, MsTablePagination,
MsTableHeader, MsTableHeader,
MsRolesTag, MsRolesTag,
MsTableOperator, MsTableOperator,
MsDialogFooter, MsDialogFooter,
MsTableOperatorButton MsTableOperatorButton
},
activated() {
this.list();
},
methods: {
create() {
this.dialogWsAddVisible = true;
this.form = {};
this.$get("/organization/list", response => {
this.$set(this.form, "orgList", response.data);
});
listenGoBack(this.close);
}, },
activated() { dataFilter(val) {
this.list(); if (val) {
this.memberForm.userList = this.memberForm.copyUserList.filter((item) => {
if (!!~item.id.indexOf(val) || !!~item.id.toUpperCase().indexOf(val.toUpperCase())) {
return true;
}
});
} else {
this.memberForm.userList = this.memberForm.copyUserList;
}
}, },
methods: { submit(formName) {
create() { this.$refs[formName].validate((valid) => {
this.dialogWsAddVisible = true; if (valid) {
this.form = {}; let saveType = 'special/add';
this.$get("/organization/list", response => { if (this.form.id) {
this.$set(this.form, "orgList", response.data); saveType = 'update';
}) }
listenGoBack(this.close); this.result = this.$post("/workspace/" + saveType, this.form, () => {
}, this.dialogWsAddVisible = false;
dataFilter(val) { this.list();
if (val) { Message.success(this.$t('commons.save_success'));
this.memberForm.userList = this.memberForm.copyUserList.filter((item) => { });
if (!!~item.id.indexOf(val) || !!~item.id.toUpperCase().indexOf(val.toUpperCase())) {
return true
}
})
} else { } else {
this.memberForm.userList = this.memberForm.copyUserList; return false;
} }
}, });
submit(formName) { },
this.$refs[formName].validate((valid) => { addMember() {
if (valid) { this.dialogWsMemberAddVisible = true;
let saveType = 'special/add'; this.result = this.$get('/user/list/', response => {
if (this.form.id) { this.$set(this.memberForm, "userList", response.data);
saveType = 'update' this.$set(this.memberForm, "copyUserList", response.data);
} });
this.result = this.$post("/workspace/" + saveType, this.form, () => { this.result = this.$post('/user/group/list', {type: GROUP_WORKSPACE, resourceId: this.wsId}, response => {
this.dialogWsAddVisible = false; this.$set(this.memberForm, "groups", response.data);
this.list(); });
Message.success(this.$t('commons.save_success'));
});
} else {
return false;
}
});
},
addMember() {
this.dialogWsMemberAddVisible = true;
this.result = this.$get('/user/list/', response => {
this.$set(this.memberForm, "userList", response.data);
this.$set(this.memberForm, "copyUserList", response.data);
});
this.result = this.$post('/user/group/list', {type: GROUP_WORKSPACE, resourceId: this.wsId}, response => {
this.$set(this.memberForm, "groups", response.data);
})
listenGoBack(this.handleClose); listenGoBack(this.handleClose);
}, },
cellClick(row) { cellClick(row) {
// currentRow // currentRow
this.currentWorkspaceRow = row; this.currentWorkspaceRow = row;
this.dialogWsMemberVisible = true; this.dialogWsMemberVisible = true;
let param = { let param = {
name: '', name: '',
workspaceId: row.id workspaceId: row.id
}; };
this.wsId = row.id; this.wsId = row.id;
let path = "/user/special/ws/member/list"; let path = "/user/special/ws/member/list";
this.result = this.$post(path + "/" + this.dialogCurrentPage + "/" + this.dialogPageSize, param, res => { this.result = this.$post(path + "/" + this.dialogCurrentPage + "/" + this.dialogPageSize, param, res => {
let data = res.data; let data = res.data;
this.memberLineData = data.listObject; this.memberLineData = data.listObject;
let url = "/user/group/list/ws/" + row.id; let url = "/user/group/list/ws/" + row.id;
// //
for (let i = 0; i < this.memberLineData.length; i++) { for (let i = 0; i < this.memberLineData.length; i++) {
this.$get(url + "/" + encodeURIComponent(this.memberLineData[i].id), response => { this.$get(url + "/" + encodeURIComponent(this.memberLineData[i].id), response => {
let groups = response.data; let groups = response.data;
this.$set(this.memberLineData[i], "groups", groups); this.$set(this.memberLineData[i], "groups", groups);
}) });
} }
this.dialogTotal = data.itemCount; this.dialogTotal = data.itemCount;
}); });
listenGoBack(this.closeWsMemberDialog); listenGoBack(this.closeWsMemberDialog);
}, },
dialogSearch() { dialogSearch() {
let row = this.currentWorkspaceRow; let row = this.currentWorkspaceRow;
this.dialogWsMemberVisible = true; this.dialogWsMemberVisible = true;
let param = this.dialogCondition; let param = this.dialogCondition;
this.$set(param, 'workspaceId', row.id); this.$set(param, 'workspaceId', row.id);
let path = "/user/special/ws/member/list"; let path = "/user/special/ws/member/list";
this.result = this.$post(path + "/" + this.dialogCurrentPage + "/" + this.dialogPageSize, param, res => { this.result = this.$post(path + "/" + this.dialogCurrentPage + "/" + this.dialogPageSize, param, res => {
let data = res.data; let data = res.data;
this.memberLineData = data.listObject; this.memberLineData = data.listObject;
let url = "/userrole/list/ws/" + row.id; let url = "/userrole/list/ws/" + row.id;
// //
for (let i = 0; i < this.memberLineData.length; i++) { for (let i = 0; i < this.memberLineData.length; i++) {
this.$get(url + "/" + encodeURIComponent(this.memberLineData[i].id), response => { this.$get(url + "/" + encodeURIComponent(this.memberLineData[i].id), response => {
let groups = response.data; let groups = response.data;
this.$set(this.memberLineData[i], "groups", groups); this.$set(this.memberLineData[i], "groups", groups);
}) });
} }
this.dialogTotal = data.itemCount; this.dialogTotal = data.itemCount;
}); });
}, },
edit(row) { edit(row) {
this.dialogWsUpdateVisible = true; this.dialogWsUpdateVisible = true;
// copy user // copy user
this.form = Object.assign({}, row); this.form = Object.assign({}, row);
this.$get("/organization/list", response => { this.$get("/organization/list", response => {
this.$set(this.form, "orgList1", response.data); this.$set(this.form, "orgList1", response.data);
}) });
listenGoBack(this.close); listenGoBack(this.close);
}, },
close() { close() {
this.dialogWsAddVisible = false; this.dialogWsAddVisible = false;
this.dialogWsUpdateVisible = false; this.dialogWsUpdateVisible = false;
removeGoBackListener(this.close); removeGoBackListener(this.close);
}, },
updateWorkspace(updateForm) { updateWorkspace(updateForm) {
this.$refs[updateForm].validate(valid => { this.$refs[updateForm].validate(valid => {
if (valid) { if (valid) {
this.result = this.$post("/workspace/special/update", this.form, () => { this.result = this.$post("/workspace/special/update", this.form, () => {
this.$success(this.$t('commons.modify_success')); this.$success(this.$t('commons.modify_success'));
this.dialogWsUpdateVisible = false; this.dialogWsUpdateVisible = false;
this.list();
});
} else {
return false;
}
})
},
handleClose() {
this.memberForm = {};
this.dialogWsMemberAddVisible = false;
this.dialogWsMemberUpdateVisible = false;
removeGoBackListener(this.handleClose);
},
closeWsMemberDialog() {
this.memberLineData = [];
this.list();
removeGoBackListener(this.closeWsMemberDialog);
this.dialogWsMemberVisible = false;
},
list() {
let url = '/workspace/list/all/' + this.currentPage + '/' + this.pageSize;
this.result = this.$post(url, this.condition, response => {
let data = response.data;
this.items = data.listObject;
for (let i = 0; i < this.items.length; i++) {
let param = {
name: '',
workspaceId: this.items[i].id
}
let path = "user/special/ws/member/list/all";
this.$post(path, param, res => {
let member = res.data;
this.$set(this.items[i], "memberSize", member.length);
})
}
this.total = data.itemCount;
});
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
let param = {
userIds: this.memberForm.userIds,
groupIds: this.memberForm.groupIds,
workspaceId: this.currentWorkspaceRow.id
};
this.result = this.$post("user/special/ws/member/add", param, () => {
this.cellClick(this.currentWorkspaceRow);
this.dialogWsMemberAddVisible = false;
})
} else {
return false;
}
});
},
editMember(row) {
this.dialogWsMemberUpdateVisible = true;
this.memberForm = Object.assign({}, row);
// console.log(this.memberForm)
let groupIds = this.memberForm.groups.map(r => r.id);
this.result = this.$post('/user/group/list', {type: GROUP_WORKSPACE, resourceId: this.wsId}, response => {
this.$set(this.memberForm, "allgroups", response.data);
})
// console.log(this.memberForm)
//
this.$set(this.memberForm, 'groupIds', groupIds);
listenGoBack(this.handleClose);
},
handleDelete(workspace) {
this.$refs.deleteConfirm.open(workspace);
},
_handleDelete(workspace) {
this.$confirm(this.$t('workspace.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
cancelButtonText: this.$t('commons.cancel'),
type: 'warning'
}).then(() => {
this.$get('/workspace/special/delete/' + workspace.id, () => {
let lastWorkspaceId = getCurrentWorkspaceId();
let sourceId = workspace.id;
if (lastWorkspaceId === sourceId) {
let sign = DEFAULT;
refreshSessionAndCookies(sign, sourceId);
}
Message.success(this.$t('commons.delete_success'));
this.list(); this.list();
}); });
}).catch(() => { } else {
this.$message({ return false;
type: 'info', }
message: this.$t('commons.delete_cancelled') });
},
handleClose() {
this.memberForm = {};
this.dialogWsMemberAddVisible = false;
this.dialogWsMemberUpdateVisible = false;
removeGoBackListener(this.handleClose);
},
closeWsMemberDialog() {
this.memberLineData = [];
this.list();
removeGoBackListener(this.closeWsMemberDialog);
this.dialogWsMemberVisible = false;
},
list() {
let url = '/workspace/list/all/' + this.currentPage + '/' + this.pageSize;
this.result = this.$post(url, this.condition, response => {
let data = response.data;
this.items = data.listObject;
for (let i = 0; i < this.items.length; i++) {
let param = {
name: '',
workspaceId: this.items[i].id
};
let path = "user/special/ws/member/list/all";
this.$post(path, param, res => {
let member = res.data;
this.$set(this.items[i], "memberSize", member.length);
}); });
}
this.total = data.itemCount;
});
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
let param = {
userIds: this.memberForm.userIds,
groupIds: this.memberForm.groupIds,
workspaceId: this.currentWorkspaceRow.id
};
this.result = this.$post("user/special/ws/member/add", param, () => {
this.cellClick(this.currentWorkspaceRow);
this.dialogWsMemberAddVisible = false;
});
} else {
return false;
}
});
},
editMember(row) {
this.dialogWsMemberUpdateVisible = true;
this.memberForm = Object.assign({}, row);
// console.log(this.memberForm)
let groupIds = this.memberForm.groups.map(r => r.id);
this.result = this.$post('/user/group/list', {type: GROUP_WORKSPACE, resourceId: this.wsId}, response => {
this.$set(this.memberForm, "allgroups", response.data);
});
// console.log(this.memberForm)
//
this.$set(this.memberForm, 'groupIds', groupIds);
listenGoBack(this.handleClose);
},
handleDelete(workspace) {
this.$refs.deleteConfirm.open(workspace);
},
_handleDelete(workspace) {
this.$confirm(this.$t('workspace.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
cancelButtonText: this.$t('commons.cancel'),
type: 'warning'
}).then(() => {
this.$get('/workspace/special/delete/' + workspace.id, () => {
let lastWorkspaceId = getCurrentWorkspaceId();
let sourceId = workspace.id;
if (lastWorkspaceId === sourceId) {
let sign = DEFAULT;
refreshSessionAndCookies(sign, sourceId);
}
Message.success(this.$t('commons.delete_success'));
this.list();
}); });
}, }).catch(() => {
delMember(row) { this.$message({
this.$confirm(this.$t('member.remove_member'), '', { type: 'info',
confirmButtonText: this.$t('commons.confirm'), message: this.$t('commons.delete_cancelled')
cancelButtonText: this.$t('commons.cancel'), });
type: 'warning' });
}).then(() => { },
this.result = this.$get('/user/special/ws/member/delete/' + this.currentWorkspaceRow.id + '/' + encodeURIComponent(row.id), () => { delMember(row) {
let sourceId = this.currentWorkspaceRow.id; this.$confirm(this.$t('member.remove_member'), '', {
let userId = row.id; confirmButtonText: this.$t('commons.confirm'),
let user = getCurrentUser(); cancelButtonText: this.$t('commons.cancel'),
if (user.id === userId) { type: 'warning'
let sign = WORKSPACE; }).then(() => {
refreshSessionAndCookies(sign, sourceId); this.result = this.$get('/user/special/ws/member/delete/' + this.currentWorkspaceRow.id + '/' + encodeURIComponent(row.id), () => {
} let sourceId = this.currentWorkspaceRow.id;
this.$success(this.$t('commons.remove_success')); let userId = row.id;
let user = getCurrentUser();
if (user.id === userId) {
let sign = WORKSPACE;
refreshSessionAndCookies(sign, sourceId);
}
this.$success(this.$t('commons.remove_success'));
this.cellClick(this.currentWorkspaceRow);
});
}).catch(() => {
this.$info(this.$t('commons.remove_cancel'));
});
},
updateWorkspaceMember(formName) {
let param = {
id: this.memberForm.id,
name: this.memberForm.name,
email: this.memberForm.email,
phone: this.memberForm.phone,
groupIds: this.memberForm.groupIds,
workspaceId: this.currentWorkspaceRow.id
};
this.$refs[formName].validate((valid) => {
if (valid) {
this.result = this.$post("/workspace/member/update", param, () => {
this.$success(this.$t('commons.modify_success'));
this.dialogWsMemberUpdateVisible = false;
this.cellClick(this.currentWorkspaceRow); this.cellClick(this.currentWorkspaceRow);
}); });
}).catch(() => {
this.$info(this.$t('commons.remove_cancel'));
});
},
updateWorkspaceMember(formName) {
let param = {
id: this.memberForm.id,
name: this.memberForm.name,
email: this.memberForm.email,
phone: this.memberForm.phone,
groupIds: this.memberForm.groupIds,
workspaceId: this.currentWorkspaceRow.id
} }
this.$refs[formName].validate((valid) => { });
if (valid) {
this.result = this.$post("/workspace/member/update", param, () => {
this.$success(this.$t('commons.modify_success'));
this.dialogWsMemberUpdateVisible = false;
this.cellClick(this.currentWorkspaceRow);
});
}
});
},
}, },
data() { },
return { computed: {
result: {}, workspaceId() {
dialogWsAddVisible: false, return getCurrentWorkspaceId();
dialogWsUpdateVisible: false,
dialogWsMemberVisible: false,
dialogWsMemberAddVisible: false,
dialogWsMemberUpdateVisible: false,
condition: {},
dialogCondition: {},
items: [],
currentPage: 1,
pageSize: 10,
total: 0,
dialogCurrentPage: 1,
dialogPageSize: 10,
dialogTotal: 0,
memberLineData: [],
memberForm: {},
screenHeight: 'calc(100vh - 255px)',
form: {
// name: "",
// description: ""
},
rules: {
name: [
{required: true, message: this.$t('workspace.input_name'), trigger: 'blur'},
{min: 2, max: 25, message: this.$t('commons.input_limit', [2, 25]), trigger: 'blur'},
{
required: true,
pattern: /^(?!-)(?!.*?-$)[a-zA-Z0-9\u4e00-\u9fa5-]+$/,
message: this.$t('workspace.special_characters_are_not_supported'),
trigger: 'blur'
}
],
description: [
{max: 50, message: this.$t('commons.input_limit', [0, 50]), trigger: 'blur'}
],
organizationId: [
{required: true, message: this.$t('organization.select_organization'), trigger: ['blur']}
]
},
wsMemberRule: {
userIds: [
{required: true, message: this.$t('member.please_choose_member'), trigger: ['blur']}
],
roleIds: [
{required: true, message: this.$t('role.please_choose_role'), trigger: ['blur']}
]
},
currentWorkspaceRow: {},
wsId: ""
}
} }
},
data() {
return {
result: {},
dialogWsAddVisible: false,
dialogWsUpdateVisible: false,
dialogWsMemberVisible: false,
dialogWsMemberAddVisible: false,
dialogWsMemberUpdateVisible: false,
condition: {},
dialogCondition: {},
items: [],
currentPage: 1,
pageSize: 10,
total: 0,
dialogCurrentPage: 1,
dialogPageSize: 10,
dialogTotal: 0,
memberLineData: [],
memberForm: {},
screenHeight: 'calc(100vh - 255px)',
form: {
// name: "",
// description: ""
},
rules: {
name: [
{required: true, message: this.$t('workspace.input_name'), trigger: 'blur'},
{min: 2, max: 25, message: this.$t('commons.input_limit', [2, 25]), trigger: 'blur'},
{
required: true,
pattern: /^(?!-)(?!.*?-$)[a-zA-Z0-9\u4e00-\u9fa5-]+$/,
message: this.$t('workspace.special_characters_are_not_supported'),
trigger: 'blur'
}
],
description: [
{max: 50, message: this.$t('commons.input_limit', [0, 50]), trigger: 'blur'}
],
organizationId: [
{required: true, message: this.$t('organization.select_organization'), trigger: ['blur']}
]
},
wsMemberRule: {
userIds: [
{required: true, message: this.$t('member.please_choose_member'), trigger: ['blur']}
],
roleIds: [
{required: true, message: this.$t('role.please_choose_role'), trigger: ['blur']}
]
},
currentWorkspaceRow: {},
wsId: ""
};
} }
};
</script> </script>
<style scoped> <style scoped>
.el-table__row:hover .edit { .el-table__row:hover .edit {
opacity: 1; opacity: 1;
} }
.member-size { .member-size {
text-decoration: underline; text-decoration: underline;
cursor: pointer; cursor: pointer;
} }
.ws-member-id { .ws-member-id {
float: left; float: left;
} }
.ws-member-email { .ws-member-email {
float: right; float: right;
color: #8492a6; color: #8492a6;
font-size: 13px; font-size: 13px;
} }
.select-width { .select-width {
width: 100%; width: 100%;
} }
.dialog-css >>> .el-dialog__header { .dialog-css >>> .el-dialog__header {
padding: 0; padding: 0;
} }
</style> </style>