vijay
/
Mosqkiller
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

# up pagination style

This commit is contained in:
xianfuxing 2018-08-03 12:38:09 +08:00
parent 67ab8dc8f9
commit 4613c32c93
1 changed files with 44 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
src/views/counter/count.vue
View File

@ -46,8 +46,9 @@
<el-pagination <el-pagination
class="pagination" class="pagination"
background background
layout="prev, pager, next" layout="total, prev, pager, next, jumper"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
@size-change="handleSizeChange"
:total="total"> :total="total">
</el-pagination> </el-pagination>
</div> </div>
@ -82,6 +83,10 @@ export default {
// console.log(page) // console.log(page)
this.listLoading = true this.listLoading = true
this.getDeviceCount({ page }) this.getDeviceCount({ page })
},
handleSizeChange(page) {
this.listLoading = true
this.getDeviceCount({ page })
} }
}, },
created() { created() {
@ -96,8 +101,36 @@ export default {
<style lang="scss"> <style lang="scss">
.pagination { .pagination {
float: right; float: right;
font-weight: normal;
padding: 2rem 0 1rem 0; padding: 2rem 0 1rem 0;
.btn-prev {
border: 1px solid #d1dbe5;
border-right: 0;
border-radius: 0 !important;
margin: 0 !important;
} }
.btn-next {
border: 1px solid #d1dbe5;
// border-left: 0;
border-radius: 0!important;
margin: 0 !important;
}
.el-pager li {
border: 1px solid #d1dbe5;
box-sizing: border-box;
border-radius: 0!important;
border-right: 0;
padding: 0;
margin: 0 !important;
}
.el-pagination__jump {
margin-left: .8rem;
}
.el-pagination__editor.el-input {
width: 2.5rem;
}
}
// mobile
@media screen and (max-width: 375px) { @media screen and (max-width: 375px) {
.pagination { .pagination {
display: flex !important; display: flex !important;
@ -105,11 +138,17 @@ export default {
float: none; float: none;
padding: 1rem 0 1rem 0; padding: 1rem 0 1rem 0;
.el-pager li { .el-pager li {
height: 1.5rem; // height: 1.5rem;
line-height: 1.5rem; // line-height: 1.5rem;
font-size: .5rem !important; font-size: .5rem !important;
margin: .1rem .1rem !important; // min-width: 1.5rem !important;
min-width: 1.5rem !important; }
.el-pagination__total {
// margin-right: 2rem;
display: none !important;
}
.el-pagination__jump {
display: none !important;
} }
} }
} }