一个列表页要接哪些点

一个列表页要接哪些点

以订单列表为例，这些名字要是同一个或能包含：

页面骨架：

<script setup lang="ts">
import { hasPerms } from "@bit-labs.cn/owl-ui";
import { getOrders } from "../api/order";

defineOptions({ name: "OrderList" });

const loading = ref(false);
const list = ref<OrderItem[]>([]);

async function load() {
  loading.value = true;
  try {
    const res = await getOrders({ page: 1, pageSize: 10 });
    list.value = res.data?.list ?? [];
  } finally {
    loading.value = false;
  }
}

onMounted(load);
</script>

<template>
  <el-button
    v-if="hasPerms('order:order:Create')"
    type="primary"
  >
    新建
  </el-button>
  <el-table v-loading="loading" :data="list" />
</template>

权限标识的中间段是 Handler 的 ModuleName() 英文名，不是菜单中文。这里假设模块英文名是 order、子系统名是 order、方法是 Create。和后端对过再写进 hasPerms，不要按路由 path 猜。

列表数据在 data.list。ID 用字符串。分页参数用 page 和 pageSize。