Antd+vue-Tabellen-Paginierungssequenznummer in umgekehrter Reihenfolge / Paging-Sequenznummer erhöhen

Bei der Verwendung der Tabellenkomponente des Ant-Design-Vue-Frameworks für die Datenanzeige besteht seit kurzem die Anforderung, die Sequenznummer in umgekehrter Reihenfolge zu sortieren. Das Folgende ist das Effektdiagramm der Realisierung;

1. Hauptcode in umgekehrter Reihenfolge: Fügen Sie den folgenden Code zur Spalte hinzu:
   ipagination.total: Gesamtzahl der Listendaten
   ipagination.current: aktuelle Seite
   ipagination.pageSize: Anzahl der Einträge pro Seite (ich bin 50)

 customRender: function (t, r, index) {
    
    
            return ipagination.total - (((ipagination.current - 1) * ipagination.pageSize) + Number(index))
          },

2. Erhöhen der Seriennummer jeder Seite. Hauptcode: Fügen Sie den folgenden Code zur Spalte
   ipagination.total hinzu: Gesamtzahl der Listendaten

 customRender: function (t, r, index) {
    
    
            return parseInt(ipagination.total) - parseInt(index)
          },

Das Folgende ist der detaillierte Code:

<template>
<a-table
                      ref="table"
                      size="middle"
                      :scroll="{ x: 1620, y: 470 }"
                      bordered
                      rowKey="id"
                      :columns="columns"
                      :dataSource="dataSource"
                      class="j-table-force-nowrap ant-table"
                      :loading="loading"
                      :pagination="ipagination"
                      @change="handleChange1"
                    ></a-table>
</template>

<script>
export default {
    
    
data() {
    
    
    return {
    
    
    //分页数据
    ipagination:{
    
    
        current: 1, //当前页
        pageSize: 50, //每页数量
        pageSizeOptions: ['50'],
        //分页右下角总条数那的数据
        showTotal: (total, range) => {
    
    
          // return range[0] + "-" + range[1] + " 共" + total + "条"   //序号递增时的显示
          //序号倒序
          let currSize = this.ipagination.total - ((this.ipagination.current - 1)*this.ipagination.pageSize);
          return  currSize + '-' + (currSize > 50 ? currSize - 49 : 1) +" 共" + total + "条"
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0  //总数
      },
    }
    }，

 created() {
    
    
    this.loadData(1);
  },

computed: {
    
    
 columns() {
    
    
 let {
    
     ipagination } = this;
		{
    
    
          fixed: 'left',
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 50,
          align: 'center',
          customRender: function (t, r, index) {
    
    
            // return parseInt(ipagination.total) - parseInt(index)   //序号递增
            //序号倒序
            return ipagination.total - (((ipagination.current - 1) * ipagination.pageSize) + Number(index))
          },
        },
     }
},

methods: {
    
    
//改变页数
handleChange1(pagination, filters, sorter) {
    
    
      this.ipagination = pagination;
      this.loadData();
    },
    
    //获取接口数据
loadData(arg) {
    
    
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
    
    
        this.ipagination.current = 1;
      }
      this.loading = true;
      getAction('/list', '').then((res) => {
    
    
        if (res) {
    
    
            this.dataSource = res.result.records
            if(res.result.searchCount)
            {
    
    
              this.ipagination.total = res.result.total
            }else{
    
    
              this.ipagination.total = 0;
            }
          }
        }else{
    
    
          this.$message.warning("查询失败")
        }
      }).finally(() => {
    
    
        this.loading = false
      })
    },
}

}
</script>