<!--
 * @Author: wjc
 * @Date: 2025-04-09 10:19:11
 * @LastEditors: wjc
 * @LastEditTime: 2026-01-16 14:24:41
 * @Description: 测试页面
-->
<route lang="json">
{
  "layout": "inner",
  "style": {
    "navigationStyle": "custom"
  }
}
</route>

<template>
  <z-paging ref="pagingRef" v-model="dataList" @query="queryList">
    <template #top>
      <MNavBar title="ZPaging 列表" fixed :right-menu="rightMenu" @right-click="handleRightClick" />
    </template>
    <view v-for="item in dataList" :key="item" class="h-200rpx mb-10px bg-white">
      <view class="">{{ item }}</view>
    </view>
    <template #loadingMoreNoMore>
      <MFooter />
    </template>
  </z-paging>
</template>

<script setup lang="ts">
  defineOptions({ name: 'Test' })

  const rightMenu = ref([
    {
      icon: 'i-ep-link',
      text: '分享链接',
      command: 'qrcode',
    },
    {
      icon: 'i-ep-full-screen',
      text: '发起会议',
      command: 'view',
    },
    {
      icon: 'i-ep-credit-card',
      text: '收付款',
      command: 'money',
    },
  ])

  const handleRightClick = (val) => {
    console.log('点击了多功能菜单：', val)
  }

  const pagingRef = ref(null)
  const dataList = ref([])
  const queryList = (pageNo) => {
    setTimeout(() => {
      // 当结果长度小于pageSize：10，即判断为没有更多数据，大于则可以继续加载更多
      pagingRef.value.complete([
        pageNo,
        pageNo + 1,
        pageNo + 2,
        pageNo + 3,
        pageNo + 4,
        pageNo + 5,
        pageNo + 6,
        pageNo + 7,
        pageNo + 8,
        pageNo + 9,
        pageNo + 10,
      ])
    }, 2000)
  }
</script>
