style: 修复表格抖动bug

This commit is contained in:
q4speed 2020-08-25 17:47:58 +08:00
parent 8531e7e176
commit 954262a631
2 changed files with 317 additions and 316 deletions

View File

@ -12,8 +12,9 @@
<el-table-column prop="description" :label="$t('commons.description')"/> <el-table-column prop="description" :label="$t('commons.description')"/>
<el-table-column :label="$t('commons.member')"> <el-table-column :label="$t('commons.member')">
<template v-slot:default="scope"> <template v-slot:default="scope">
<el-button type="text" class="member-size" @click="cellClick(scope.row)">{{scope.row.memberSize}} <el-link type="primary" class="member-size" @click="cellClick(scope.row)">
</el-button> {{ scope.row.memberSize }}
</el-link>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :label="$t('commons.operating')"> <el-table-column :label="$t('commons.operating')">
@ -27,7 +28,8 @@
</el-card> </el-card>
<!-- dialog of organization member --> <!-- dialog of organization member -->
<el-dialog :visible.sync="dialogOrgMemberVisible" width="70%" :destroy-on-close="true" @close="closeFunc" class="dialog-css"> <el-dialog :visible.sync="dialogOrgMemberVisible" width="70%" :destroy-on-close="true" @close="closeFunc"
class="dialog-css">
<ms-table-header :condition.sync="dialogCondition" @create="addMember" @search="dialogSearch" <ms-table-header :condition.sync="dialogCondition" @create="addMember" @search="dialogSearch"
:create-tip="$t('member.create')" :title="$t('commons.member')"/> :create-tip="$t('member.create')" :title="$t('commons.member')"/>
<!-- organization member table --> <!-- organization member table -->
@ -43,7 +45,8 @@
</el-table-column> </el-table-column>
<el-table-column :label="$t('commons.operating')"> <el-table-column :label="$t('commons.operating')">
<template v-slot:default="scope"> <template v-slot:default="scope">
<ms-table-operator :tip2="$t('commons.remove')" @editClick="editMember(scope.row)" @deleteClick="delMember(scope.row)"/> <ms-table-operator :tip2="$t('commons.remove')" @editClick="editMember(scope.row)"
@deleteClick="delMember(scope.row)"/>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -146,7 +149,8 @@
<el-form-item :label="$t('commons.phone')" prop="phone"> <el-form-item :label="$t('commons.phone')" prop="phone">
<el-input v-model="memberForm.phone" autocomplete="off" :disabled="true"/> <el-input v-model="memberForm.phone" autocomplete="off" :disabled="true"/>
</el-form-item> </el-form-item>
<el-form-item :label="$t('commons.role')" prop="roleIds" :rules="{required: true, message: $t('role.please_choose_role'), trigger: 'change'}"> <el-form-item :label="$t('commons.role')" prop="roleIds"
:rules="{required: true, message: $t('role.please_choose_role'), trigger: 'change'}">
<el-select v-model="memberForm.roleIds" multiple :placeholder="$t('role.please_choose_role')" <el-select v-model="memberForm.roleIds" multiple :placeholder="$t('role.please_choose_role')"
class="select-width"> class="select-width">
<el-option <el-option
@ -171,23 +175,24 @@
</template> </template>
<script> <script>
import MsCreateBox from "../CreateBox"; import MsCreateBox from "../CreateBox";
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 {
getCurrentOrganizationId, getCurrentOrganizationId,
getCurrentUser, listenGoBack, getCurrentUser,
listenGoBack,
refreshSessionAndCookies, refreshSessionAndCookies,
removeGoBackListener removeGoBackListener
} from "../../../../common/js/utils"; } from "@/common/js/utils";
import {DEFAULT, ORGANIZATION} from "../../../../common/js/constants"; import {DEFAULT, ORGANIZATION} from "@/common/js/constants";
import MsDeleteConfirm from "../../common/components/MsDeleteConfirm"; import MsDeleteConfirm from "../../common/components/MsDeleteConfirm";
export default { export default {
name: "MsOrganization", name: "MsOrganization",
components: { components: {
MsDeleteConfirm, MsDeleteConfirm,
@ -339,8 +344,7 @@
let lastOrganizationId = getCurrentOrganizationId(); let lastOrganizationId = getCurrentOrganizationId();
let sourceId = organization.id; let sourceId = organization.id;
if (lastOrganizationId === sourceId) { if (lastOrganizationId === sourceId) {
let sign = DEFAULT; refreshSessionAndCookies(DEFAULT, sourceId);
refreshSessionAndCookies(sign, sourceId);
} }
this.$success(this.$t('commons.delete_success')); this.$success(this.$t('commons.delete_success'));
this.initTableData(); this.initTableData();
@ -363,8 +367,7 @@
let currentUser = getCurrentUser(); let currentUser = getCurrentUser();
let userId = row.id; let userId = row.id;
if (currentUser.id === userId) { if (currentUser.id === userId) {
let sign = ORGANIZATION; refreshSessionAndCookies(ORGANIZATION, sourceId);
refreshSessionAndCookies(sign, sourceId);
} }
this.$success(this.$t('commons.remove_success')) this.$success(this.$t('commons.remove_success'))
this.cellClick(this.currentRow); this.cellClick(this.currentRow);
@ -472,32 +475,31 @@
}, },
} }
} }
</script> </script>
<style scoped> <style scoped>
.member-size { .member-size {
text-decoration: underline; text-decoration: underline;
cursor: pointer; }
}
.org-member-id { .org-member-id {
float: left; float: left;
} }
.org-member-email { .org-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: 0px; padding: 0;
} }
</style> </style>

View File

@ -12,9 +12,9 @@
<el-table-column prop="organizationName" :label="$t('workspace.organization_name')"/> <el-table-column prop="organizationName" :label="$t('workspace.organization_name')"/>
<el-table-column :label="$t('commons.member')"> <el-table-column :label="$t('commons.member')">
<template v-slot:default="scope"> <template v-slot:default="scope">
<el-button type="text" class="member-size" @click="cellClick(scope.row)"> <el-link type="primary" class="member-size" @click="cellClick(scope.row)">
{{scope.row.memberSize}} {{scope.row.memberSize}}
</el-button> </el-link>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :label="$t('commons.operating')"> <el-table-column :label="$t('commons.operating')">
@ -200,12 +200,11 @@
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 {
getCurrentOrganizationId,
getCurrentUser, getCurrentUser,
getCurrentWorkspaceId, listenGoBack, getCurrentWorkspaceId, listenGoBack,
refreshSessionAndCookies, removeGoBackListener refreshSessionAndCookies, removeGoBackListener
} from "../../../../common/js/utils"; } from "@/common/js/utils";
import {DEFAULT, WORKSPACE} from "../../../../common/js/constants"; import {DEFAULT, WORKSPACE} from "@/common/js/constants";
import MsDeleteConfirm from "../../common/components/MsDeleteConfirm"; import MsDeleteConfirm from "../../common/components/MsDeleteConfirm";
export default { export default {
@ -537,7 +536,7 @@
} }
.dialog-css >>> .el-dialog__header { .dialog-css >>> .el-dialog__header {
padding: 0px; padding: 0;
} }
</style> </style>