<template>
  <Table
    ref="tableRef"
    :columns="tableColumns"
    :data="data"
    v-loading="loading"
    height="100%"
    element-loading-text="加载中..."
  >
    <template #operate="slotProps">
      <syMoreOperate
        :teleport="true"
        :list="getOperateList(slotProps)"
        @click-item="(value) => handleClickItem(value, slotProps)"
        :margin-left="-30"
      >
        <Icon
          icon-name="iconbianzu7"
          style="font-size: 40px"
          class="cursor-pointer"
        ></Icon>
      </syMoreOperate>
    </template>
  </Table>
</template>

<script setup lang="ts">
import Table from "@/components/Table/index.vue";
import { tableColumns } from "./table";
import Icon from "@/components/Icon/index.vue";
import { ref } from "vue";
import { syMoreOperate } from "cqk-sy-ui";
import { useTableScrollListener } from "@/components/Table/hooks";

const emit = defineEmits(["scrollToEnd"]);

const tableRef = ref<InstanceType<typeof Table>>();

useTableScrollListener(tableRef, () => {
  emit("scrollToEnd");
});

defineProps<{
  data: any[];
  loading: boolean;
}>();

const getOperateList = (slotProps: any) => {
  return [
    { name: "编辑", value: "编辑" },
    { name: "删除", value: "删除" },
  ];
};

const handleClickItem = (value: any, slotProps: any) => {};
</script>

<style></style>
