Browse Source

表格折行优化

main
jinlan.du 5 years ago
parent
commit
b905acc9d5
  1. 29
      web/src/style/main.scss
  2. 4
      web/src/view/example/table/table.vue
  3. 2
      web/src/view/superAdmin/authority/authority.vue

29
web/src/style/main.scss

@ -1040,32 +1040,3 @@ li {
}
}
}
@media screen and (max-width: 1080px) {
.admin-box{
tr{
td{
.el-button{
padding: 7px 5px;
}
}
}
}
}
@media screen and (max-width: 885px) {
.admin-box{
.el-table__fixed-right{
tr{
td{
.el-button{
padding: 7px 0px;
}
}
}
}
.el-table__row{
.el-button.el-button--text.el-button--small::after{
margin-left: 8px;
}
}
}
}

4
web/src/view/example/table/table.vue

@ -17,12 +17,12 @@
<el-table-column label="姓名" prop="name" width="120"></el-table-column>
<el-table-column label="年龄" prop="age" width="120"></el-table-column>
<el-table-column label="住址" prop="address" min-width="200" show-overflow-tooltip></el-table-column>
<el-table-column label="是否禁用" prop="switch" min-width="180">
<el-table-column label="是否禁用" prop="switch" width="180">
<template slot-scope="scope">
<el-switch active-text="开启" inactive-text="禁用" v-model="scope.row.switch"></el-switch>
</template>
</el-table-column>
<el-table-column label="按钮组" min-width="180">
<el-table-column label="按钮组" width="200">
<template slot-scope="scope" >
<el-button type="text" size="small" @click="toggleSelection([scope.row])">按钮1</el-button>
<el-button type="text" size="small" @click="toggleSelection([scope.row])">按钮2</el-button>

2
web/src/view/superAdmin/authority/authority.vue

@ -13,7 +13,7 @@
>
<el-table-column label="角色id" min-width="180" prop="authorityId"></el-table-column>
<el-table-column label="角色名称" min-width="180" prop="authorityName"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="350">
<el-table-column fixed="right" label="操作" width="460">
<template slot-scope="scope">
<el-button @click="opdendrawer(scope.row)" size="small" type="text">设置权限</el-button>
<el-button @click="addAuthority(scope.row.authorityId)" size="small" type="text">新增子角色</el-button>

Loading…
Cancel
Save