1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
  | <template> 
 |    <div class="table-pagination"> 
 |      <el-pagination 
 |        :current-page="pagination.pageIndex || pagination.page" 
 |        :page-sizes="pagination.pageSizes||[10, 20, 30, 40]" 
 |        :page-size="pagination.pageSize" 
 |        layout="total, sizes, prev, pager, next, jumper" 
 |        :total="pagination.total" 
 |        @size-change="sizeChange" 
 |        @current-change="currentChange" 
 |        background> 
 |      </el-pagination> 
 |    </div> 
 |  </template> 
 |    
 |  <script> 
 |  export default { 
 |    name: 'Pagination', 
 |    props: { 
 |      pagination: { 
 |        type: Object, 
 |        default: function () { 
 |          return {} 
 |        } 
 |      } 
 |    }, 
 |    data () { 
 |      return { 
 |      } 
 |    }, 
 |    methods: { 
 |      sizeChange (value) { 
 |        this.$emit('size-change', value) 
 |      }, 
 |      currentChange (value) { 
 |        this.$emit('current-change', value) 
 |      } 
 |    } 
 |  } 
 |  </script> 
 |  <style lang="scss" scoped> 
 |  .table-pagination { 
 |    margin-left: 0px; 
 |    padding: 16px 0px; 
 |    text-align: left; 
 |    display: block; 
 |    z-index: 100; 
 |    width: -webkit-fill-available; 
 |    /* width: 80%; */ 
 |    position: fixed; 
 |    bottom: 0px; 
 |    background-color: white; 
 |    margin-right: 50px; 
 |  } 
 |  </style> 
 |  
  |