@rtdui/datatable/esm/DataTable/ExportTable.mjs

React DataTable component based on Rtdui components

'use client';
import { jsxs, jsx } from 'react/jsx-runtime';
import React from 'react';
import { utils, writeFileXLSX } from 'xlsx';
import { IconDownload } from '@tabler/icons-react';
import { Popover, Button } from '@rtdui/core';

function ExportTable(props) {
  const { table, tableRef } = props;
  const exportXLSX = React.useCallback(async () => {
    const tableEle = tableRef.current;
    const clonedTableEle = tableEle.cloneNode(true);
    const dropdownEles = clonedTableEle.querySelectorAll(".dropdown ");
    Array.prototype.forEach.call(dropdownEles, (el, i) => {
      el.innerHTML = "";
    });
    const wb = utils.table_to_book(clonedTableEle);
    writeFileXLSX(wb, "\u8868\u683C\u5BFC\u51FA.xlsx");
  }, [tableRef]);
  return /* @__PURE__ */ jsxs(Popover, { position: "bottom", children: [
    /* @__PURE__ */ jsx(Popover.Target, { children: /* @__PURE__ */ jsx(Button, { size: "sm", ghost: true, shape: "circle", children: /* @__PURE__ */ jsx(IconDownload, {}) }) }),
    /* @__PURE__ */ jsx(Popover.Dropdown, { children: /* @__PURE__ */ jsx("ul", { className: "menu p-2", children: /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { className: "w-full", onClick: exportXLSX, children: "\u5BFC\u51FA\u4E3AExcel" }) }) }) })
  ] });
}

export { ExportTable };
//# sourceMappingURL=ExportTable.mjs.map