shuhi-ui/src/views/optimization/orderAnalysis/components/rank-list.vue

<template>
  <ele-data-table
    ref="tableRef"
    class="flex-1"
    row-key="id"
    :columns="columns"
    :data="dataList"
  ></ele-data-table>
</template>

<script setup>
  import SimpleTable from '@/components/CommonPage/SimpleTable.vue';
  import request from '@/utils/request';

  const columns = reactive([
    { label: '排行榜', prop: 'rank', align: 'center' },
    { label: '取消地区', prop: 'area', align: 'center' },
    { label: '取消数量', prop: 'number', align: 'center' }
  ]);

  const dataList = reactive([
    { rank: 1, area: '北京', number: 10 },
    { rank: 2, area: '上海', number: 9 },
    { rank: 3, area: '广州', number: 8 },
    { rank: 4, area: '深圳', number: 7 },
    { rank: 5, area: '成都', number: 6 },
    { rank: 6, area: '杭州', number: 5 },
    { rank: 7, area: '武汉', number: 4 },
    { rank: 8, area: '西安', number: 3 },
  ]);
</script>