<template>
  <q-virtual-scroll
    v-slot="{ item, index }"
    :items="rows"
  >
    <div
      :key="index"
      class="full-width"
    >
      <GridTableColumn
        v-model:selected="selected"
        :item="item"
        :columns="columns"
        :row-key="rowKey"
        :action="action"
        :selection="selection"
        @select-row="(row) => emits('selectRow', row)"
      />
    </div>
  </q-virtual-scroll>
</template>
<script setup>
import { onMounted } from 'vue'
import GridTableColumn from './GridTableColumn.vue'

defineProps({
  rows: {
    type: Array,
    required: true
  },
  columns: {
    type: Array,
    required: true
  },
  pageActions: {
    type: Array,
    required: true
  },
  rowKey: {
    type: Array,
    required: true
  },
  action: {
    type: Object,
    required: true
  },
  selection: {
    type: String,
    required: true
  }
})

const selected = defineModel('selected', {
  type: Array,
  required: true
})
const emits = defineEmits(['selectRow'])
onMounted(() => {
})
</script>
