# up pagination style

This commit is contained in:
xianfuxing 2018-08-01 20:30:23 +08:00
parent e9c09ac836
commit 48127c3f57
1 changed files with 58 additions and 43 deletions

View File

@ -9,47 +9,47 @@
style="width: 100%"
:default-sort = "{prop: 'calc_time', order: 'descending'}"
>
<el-table-column
prop="device_id"
label="设备ID"
sortable
min-width="100">
</el-table-column>
<el-table-column
prop="signal"
label="信号强度"
min-width="100">
</el-table-column>
<el-table-column
sortable
prop="mosq_count"
label="灭蚊数量"
min-width="100">
</el-table-column>
<el-table-column
prop="energy"
label="电量"
min-width="100">
</el-table-column>
<el-table-column
prop="coordinate"
label="坐标"
min-width="100"
:formatter="formatter">
</el-table-column>
<el-table-column
prop="calc_time"
label="时间"
min-width="100">
</el-table-column>
</el-table>
<el-pagination
class="pagination"
background
layout="prev, pager, next"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
<el-table-column
prop="device_id"
label="设备ID"
sortable
min-width="150">
</el-table-column>
<el-table-column
prop="signal"
label="信号强度"
min-width="80">
</el-table-column>
<el-table-column
sortable
prop="mosq_count"
label="灭蚊数量"
min-width="100">
</el-table-column>
<el-table-column
prop="energy"
label="电量"
min-width="100">
</el-table-column>
<el-table-column
prop="coordinate"
label="坐标"
min-width="180"
:formatter="formatter">
</el-table-column>
<el-table-column
prop="calc_time"
label="时间"
min-width="150">
</el-table-column>
</el-table>
<el-pagination
class="pagination"
background
layout="prev, pager, next"
@current-change="handleCurrentChange"
:total="total">
</el-pagination>
</div>
</template>
@ -95,7 +95,22 @@ export default {
<style lang="scss">
.pagination {
float: right;
padding: 20px 50px 0 0;
float: right;
padding: 2rem 0 0 0;
}
@media screen and (max-width: 375px) {
.pagination {
display: flex !important;
justify-content: center;
float: none;
padding: 1rem 0 0 0;
.el-pager li {
height: 1.5rem;
line-height: 1.5rem;
font-size: .5rem !important;
margin: .1rem .1rem !important;
min-width: 1.5rem !important;
}
}
}
</style>