Ben Lin
2024-08-05 16257dd099d9811fb5caf78047ffc2425c401e0e
src/views/demo/table/ResizeParentHeightTable.vue
@@ -1,11 +1,11 @@
<template>
  <div class="h-full flex p-4">
    <div class="flex flex-col pr-4 w-1/2">
      <div class="flex-1">
      <div class="flex-1 h-0">
        <BasicTable @register="registerTable" />
      </div>
      <div class="h-4"></div>
      <div class="flex-1">
      <div class="h-4 shrink-0"></div>
      <div class="flex-1 h-0">
        <BasicTable @register="registerTable" />
      </div>
    </div>
@@ -22,58 +22,46 @@
    </div>
  </div>
</template>
<script lang="ts">
  import { defineComponent } from 'vue';
  import { BasicTable, useTable } from '/@/components/Table';
<script lang="ts" setup>
  import { BasicTable, useTable } from '@/components/Table';
  import { getBasicColumns, getFormConfig } from './tableData';
  import { demoListApi } from '/@/api/demo/table';
  import { demoListApi } from '@/api/demo/table';
  export default defineComponent({
    components: { BasicTable },
    setup(_) {
      const [registerTable] = useTable({
        api: demoListApi,
        columns: getBasicColumns(),
        useSearchForm: false,
        formConfig: getFormConfig(),
        showTableSetting: false,
        tableSetting: { fullScreen: true },
        showIndexColumn: false,
        isCanResizeParent: true,
        rowKey: 'id',
      });
  const [registerTable] = useTable({
    api: demoListApi,
    columns: getBasicColumns(),
    useSearchForm: false,
    formConfig: getFormConfig(),
    showTableSetting: false,
    tableSetting: { fullScreen: true },
    showIndexColumn: false,
    isCanResizeParent: true,
    rowKey: 'id',
  });
      const [registerTable1] = useTable({
        api: demoListApi,
        columns: getBasicColumns(),
        formConfig: getFormConfig(),
        showTableSetting: false,
        tableSetting: { fullScreen: true },
        showIndexColumn: false,
        isCanResizeParent: true,
        useSearchForm: false,
        rowKey: 'id',
      });
  const [registerTable1] = useTable({
    api: demoListApi,
    columns: getBasicColumns(),
    formConfig: getFormConfig(),
    showTableSetting: false,
    tableSetting: { fullScreen: true },
    showIndexColumn: false,
    isCanResizeParent: true,
    useSearchForm: false,
    rowKey: 'id',
  });
      const [registerTable2] = useTable({
        api: demoListApi,
        columns: getBasicColumns(),
        formConfig: getFormConfig(),
        showTableSetting: false,
        tableSetting: { fullScreen: true },
        showIndexColumn: false,
        isCanResizeParent: true,
        useSearchForm: false,
        pagination: false,
        rowKey: 'id',
      });
      return {
        registerTable,
        registerTable1,
        registerTable2,
      };
    },
  const [registerTable2] = useTable({
    api: demoListApi,
    columns: getBasicColumns(),
    formConfig: getFormConfig(),
    showTableSetting: false,
    tableSetting: { fullScreen: true },
    showIndexColumn: false,
    isCanResizeParent: true,
    useSearchForm: false,
    pagination: false,
    rowKey: 'id',
  });
</script>