import type { ComputedRef, Slots } from 'vue';
import type { BasicTableProps, InnerHandlers } from '../types/table';
import { unref, computed, h } from 'vue';
import TableHeader from '../components/TableHeader.vue';
import TableTitle from '../components/TableTitle.vue';
// import { isString } from '/@/utils/is';
import { getSlot } from '/@/utils/helper/tsxHelper';

export function useTableHeader(propsRef: ComputedRef<BasicTableProps>, slots: Slots, handlers: InnerHandlers) {
  const getHeaderProps = computed((): Recordable => {
    const { title, showTableSetting, titleHelpMessage, tableSetting, useSearchForm } = unref(propsRef);
    // const hideTitle = !slots.tableTitle && !title && !slots.toolbar && !showTableSetting;

    const hideFormHeader = !title && !useSearchForm && !slots.formTitle;
    const hideTableHeader = !slots.toolbar && !showTableSetting && !slots.infobar;

    // if (!isString(title)) {
    //   return {};
    // }

    return {
      // title: slots.tableTop ? () => h(slots.tableTop) : null,
      formTitle: hideFormHeader
        ? null
        : () =>
            h(TableTitle, {
              title,
              helpMessage: titleHelpMessage,
            } as Recordable),
      title: hideTableHeader
        ? null
        : () =>
            h(
              TableHeader,
              {
                showTableSetting,
                tableSetting,
                onColumnsChange: handlers.onColumnsChange,
              } as Recordable,
              {
                ...(slots.toolbar
                  ? {
                      toolbar: () => getSlot(slots, 'toolbar'),
                    }
                  : {}),
                ...(slots.infobar
                  ? {
                      infobar: () => getSlot(slots, 'infobar'),
                    }
                  : {}),
                //添加tableTop插槽
                ...(slots.tableTop
                  ? {
                      tableTop: () => getSlot(slots, 'tableTop'),
                    }
                  : {}),
                // 添加alertAfter插槽
                ...(slots.alertAfter
                  ? {
                      alertAfter: () => getSlot(slots, 'alertAfter'),
                    }
                  : {}),
              }
            ),
    };
  });
  return { getHeaderProps };
}
