elementUi设置表格分页排序

elementUi设置表格分页排序

{{(scope.$index+1)+(tableModel.pageNum-1)*10}}

效果图
elementUi设置表格分页排序_第1张图片

<template>
       <el-table
           :data="tableData"
           style="width: 100%"
           height="250"
           size="mini">
           <el-table-column
               label="排名"
               align='center'
               >
               <slot slot-scope="scope">
                   <span>{{(scope.$index+1)+(tableModel.pageNum-1)*10}}</span>
               </slot>
           </el-table-column>
           <el-table-column
               prop="faultKindName"
               label="故障原因"
               align='center'
               width="480"
               :show-overflow-tooltip='true'>
           </el-table-column>
           <el-table-column
               prop="deviceNum"
               label="故障次数"
               align='center'>
           </el-table-column>
           <el-table-column
               prop="address"
               label="操作"
               align='center'>
               <slot slot-scope="scope">
                   <el-button type="text" style="color:#0300F1"  @click="repairNum(scope.row.faultKindId)">查看</el-button>
               </slot>
           </el-table-column>
       </el-table>
   <div class="pst_page">
     <el-pagination
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
         :current-page="tableModel.pageNum"
         :page-sizes="[10, 20, 30, 40,50,60,70,80,90,100]"
         :page-size="tableModel.pageSize"
         layout="total, sizes, prev, pager, next, jumper"
         :total="tableModel.total">
     </el-pagination>
 </div>
</template>
<script>
export default {
    data(){
        return {
        tableData:[],
            tableModel:{
                pageNum:1,
                pageSize:10,
                total:0,
                faultTimeStart:'',
                faultTimeEnd:''
            },
		}
    }
    methods:{
    	getStatisticsKind(){
            statisticsKind(this.tableModel).then(res=>{
                let {code,data}=res
                if(code==10000){
                    this.tableData=data.data
                    this.tableModel.total=data.total
                }
            })
        },
    }
}
</script>

你可能感兴趣的:(elementUi设置表格分页排序)