zrlibs
2025-03-20 b0478092cb738ea038216c347835a14da3768baf
src/components/examples/data-table.vue
@@ -5,11 +5,15 @@
      :row-class-name="() => ['no-wrap', 'col-gap-none']"
      :columns="columns"
      :data="data"
      :height="tableHeight - 70"
      :height="paged ? tableHeight - 70 : tableHeight"
      border
      :highlight-row="highlightRow"
      @on-current-change="onCurrentChange"
      @on-selection-change="onSelectionChange"
      ref="refTable"
    ></Table>
    <Page
      v-if="paged"
      class="text-center"
      :model-value="page"
      :total="total"
@@ -25,6 +29,7 @@
      @on-next="onNext"
      ref="refPage"
    />
    <Spin fix :show="loading" />
  </div>
</template>
@@ -34,6 +39,10 @@
  name: "DataTable",
  props: {
    tableHeight: Number | String,
    paged: {
      type: Boolean,
      default: () => true,
    },
    columns: {
      type: Array,
      default: () => [],
@@ -58,6 +67,8 @@
      type: Array,
      default: () => [10, 20, 30, 40],
    },
    loading: Boolean,
    highlightRow: Boolean,
  },
  data() {
    return {};
@@ -127,6 +138,8 @@
<style lang="less" scoped>
.data-table {
  height: 100%;
  position: relative;
  .text-center {
    text-align: center;
  }