sa2kit 1.6.15 → 1.6.17

package/dist/universalExport/index.mjs

@@ -1,5 +1,7 @@
 export { ExportConfigError, ExportDataError, ExportFileError, ExportServiceError } from '../chunk-7XLFSPDG.mjs';
 import '../chunk-BJTO5JO5.mjs';
+import React, { useState, useCallback, useEffect } from 'react';
+import { Settings, X, Eye, EyeOff, MoveUp, MoveDown, Trash2, Group, Save, Loader2, Download, ChevronDown, Type, Database, FileText, FileSpreadsheet } from 'lucide-react';
 
 // src/universalExport/constants.ts
 var UNIVERSAL_EXPORT_VERSION = "1.0.0";
@@ -547,7 +549,567 @@ var universalExportClient = new UniversalExportClient();
 function createExportClient(config) {
   return new UniversalExportClient(config);
 }
+var FORMAT_ICONS = {
+  csv: /* @__PURE__ */ React.createElement(FileText, { className: "w-4 h-4" }),
+  excel: /* @__PURE__ */ React.createElement(FileSpreadsheet, { className: "w-4 h-4" }),
+  json: /* @__PURE__ */ React.createElement(Database, { className: "w-4 h-4" })
+};
+var FORMAT_DESCRIPTIONS = {
+  csv: "\u9017\u53F7\u5206\u9694\u503C\u6587\u4EF6\uFF0C\u517C\u5BB9\u6027\u6700\u597D",
+  excel: "Excel\u8868\u683C\u6587\u4EF6\uFF0C\u652F\u6301\u683C\u5F0F\u5316\u548C\u5355\u5143\u683C\u5408\u5E76",
+  json: "JSON\u6570\u636E\u6587\u4EF6\uFF0C\u9002\u5408\u5F00\u53D1\u8005\u4F7F\u7528"
+};
+var ExportConfigEditor = ({
+  initialConfig,
+  moduleId,
+  businessId,
+  availableFields,
+  onSave,
+  onCancel,
+  visible = false,
+  className = "",
+  onConfigChange
+}) => {
+  const [config, setConfig] = useState(() => {
+    if (initialConfig) {
+      return { ...initialConfig };
+    }
+    return {
+      id: "",
+      name: "\u65B0\u5EFA\u5BFC\u51FA\u914D\u7F6E",
+      description: "",
+      format: "csv",
+      fields: availableFields.map((field, index) => ({
+        ...field,
+        enabled: true,
+        sortOrder: index
+      })),
+      grouping: {
+        enabled: false,
+        fields: [],
+        preserveOrder: true,
+        nullValueHandling: "separate",
+        nullGroupName: "\u672A\u5206\u7EC4"
+      },
+      fileNameTemplate: "\u5BFC\u51FA\u6570\u636E_{date}",
+      includeHeader: true,
+      delimiter: ",",
+      encoding: "utf-8",
+      addBOM: true,
+      maxRows: void 0,
+      createdAt: /* @__PURE__ */ new Date(),
+      updatedAt: /* @__PURE__ */ new Date(),
+      moduleId,
+      businessId
+    };
+  });
+  const [activeTab, setActiveTab] = useState("basic");
+  const [savedConfigs, setSavedConfigs] = useState([]);
+  const [loadingConfigs, setLoadingConfigs] = useState(false);
+  const [deletingConfigId, setDeletingConfigId] = useState(null);
+  const loadSavedConfigs = useCallback(async () => {
+    if (!visible || activeTab !== "manage") return;
+    setLoadingConfigs(true);
+    try {
+      const params = new URLSearchParams({ moduleId });
+      if (businessId) {
+        params.set("businessId", businessId);
+      }
+      const response = await fetch(`/api/universal-export/configs?${params.toString()}`);
+      if (response.ok) {
+        const data = await response.json();
+        setSavedConfigs(data.configs || []);
+      }
+    } catch (error) {
+      console.error("\u52A0\u8F7D\u914D\u7F6E\u5F02\u5E38:", error);
+    } finally {
+      setLoadingConfigs(false);
+    }
+  }, [visible, activeTab, moduleId, businessId]);
+  const deleteConfig = useCallback(async (configId) => {
+    setDeletingConfigId(configId);
+    try {
+      const response = await fetch(`/api/universal-export/configs/${configId}`, {
+        method: "DELETE"
+      });
+      if (response.ok) {
+        setSavedConfigs((prev) => prev.filter((cfg) => cfg.id !== configId));
+        onConfigChange?.();
+      }
+    } catch (error) {
+      console.error("\u5220\u9664\u914D\u7F6E\u5931\u8D25:", error);
+    } finally {
+      setDeletingConfigId(null);
+    }
+  }, [onConfigChange]);
+  const loadConfigToEditor = useCallback((config2) => {
+    setConfig(config2);
+    setActiveTab("basic");
+  }, []);
+  useEffect(() => {
+    if (activeTab === "manage") {
+      loadSavedConfigs();
+    }
+  }, [activeTab, loadSavedConfigs]);
+  useEffect(() => {
+    if (!visible) return;
+    const scrollY = window.scrollY;
+    document.body.style.position = "fixed";
+    document.body.style.top = `-${scrollY}px`;
+    document.body.style.left = "0";
+    document.body.style.right = "0";
+    document.body.style.overflow = "hidden";
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") {
+        onCancel?.();
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.body.style.position = "";
+      document.body.style.top = "";
+      document.body.style.left = "";
+      document.body.style.right = "";
+      document.body.style.overflow = "";
+      window.scrollTo(0, scrollY);
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [visible, onCancel]);
+  const toggleFieldEnabled = useCallback((fieldKey) => {
+    setConfig((prev) => ({
+      ...prev,
+      fields: prev.fields.map(
+        (field) => field.key === fieldKey ? { ...field, enabled: !field.enabled } : field
+      )
+    }));
+  }, []);
+  useCallback((fieldKey, updates) => {
+    setConfig((prev) => ({
+      ...prev,
+      fields: prev.fields.map(
+        (field) => field.key === fieldKey ? { ...field, ...updates } : field
+      )
+    }));
+  }, []);
+  const moveField = useCallback((fieldKey, direction) => {
+    setConfig((prev) => {
+      const fields = [...prev.fields];
+      const index = fields.findIndex((f) => f.key === fieldKey);
+      if (direction === "up" && index > 0) {
+        const temp = fields[index - 1];
+        fields[index - 1] = fields[index];
+        fields[index] = temp;
+      } else if (direction === "down" && index < fields.length - 1) {
+        const temp = fields[index + 1];
+        fields[index + 1] = fields[index];
+        fields[index] = temp;
+      }
+      return {
+        ...prev,
+        fields: fields.map((field, idx) => ({ ...field, sortOrder: idx }))
+      };
+    });
+  }, []);
+  const removeField = useCallback((fieldKey) => {
+    setConfig((prev) => ({
+      ...prev,
+      fields: prev.fields.filter((f) => f.key !== fieldKey)
+    }));
+  }, []);
+  const toggleGrouping = useCallback((enabled) => {
+    setConfig((prev) => ({
+      ...prev,
+      grouping: {
+        ...prev.grouping,
+        enabled
+      }
+    }));
+  }, []);
+  const addGroupingField = useCallback((fieldKey) => {
+    const field = config.fields.find((f) => f.key === fieldKey);
+    if (!field) return;
+    const groupField = {
+      key: field.key,
+      label: field.label,
+      mode: "merge",
+      valueProcessing: "first",
+      showGroupHeader: false,
+      mergeCells: true
+    };
+    setConfig((prev) => ({
+      ...prev,
+      grouping: {
+        ...prev.grouping,
+        fields: [...prev.grouping.fields, groupField]
+      }
+    }));
+  }, [config.fields]);
+  const removeGroupingField = useCallback((fieldKey) => {
+    setConfig((prev) => ({
+      ...prev,
+      grouping: {
+        ...prev.grouping,
+        fields: prev.grouping.fields.filter((f) => f.key !== fieldKey)
+      }
+    }));
+  }, []);
+  const updateGroupingField = useCallback((fieldKey, updates) => {
+    setConfig((prev) => ({
+      ...prev,
+      grouping: {
+        ...prev.grouping,
+        fields: prev.grouping.fields.map(
+          (field) => field.key === fieldKey ? { ...field, ...updates } : field
+        )
+      }
+    }));
+  }, []);
+  useCallback((fieldKey, direction) => {
+    setConfig((prev) => {
+      const fields = [...prev.grouping.fields];
+      const index = fields.findIndex((f) => f.key === fieldKey);
+      if (direction === "up" && index > 0) {
+        const temp = fields[index - 1];
+        fields[index - 1] = fields[index];
+        fields[index] = temp;
+      } else if (direction === "down" && index < fields.length - 1) {
+        const temp = fields[index + 1];
+        fields[index + 1] = fields[index];
+        fields[index] = temp;
+      }
+      return {
+        ...prev,
+        grouping: {
+          ...prev.grouping,
+          fields
+        }
+      };
+    });
+  }, []);
+  useCallback((updates) => {
+    setConfig((prev) => ({
+      ...prev,
+      grouping: {
+        ...prev.grouping,
+        ...updates
+      }
+    }));
+  }, []);
+  const handleSave = useCallback(() => {
+    if (!config.name.trim()) {
+      alert("\u8BF7\u8F93\u5165\u914D\u7F6E\u540D\u79F0");
+      return;
+    }
+    const enabledFields = config.fields.filter((f) => f.enabled);
+    if (enabledFields.length === 0) {
+      alert("\u81F3\u5C11\u9700\u8981\u542F\u7528\u4E00\u4E2A\u5B57\u6BB5");
+      return;
+    }
+    const updatedConfig = {
+      ...config,
+      updatedAt: /* @__PURE__ */ new Date()
+    };
+    onSave?.(updatedConfig);
+    onConfigChange?.();
+  }, [config, onSave, onConfigChange]);
+  if (!visible) {
+    return null;
+  }
+  const tabs = [
+    { id: "basic", label: "\u57FA\u672C\u914D\u7F6E", icon: /* @__PURE__ */ React.createElement(Settings, { className: "w-4 h-4" }), description: "\u914D\u7F6E\u540D\u79F0\u3001\u683C\u5F0F\u548C\u57FA\u672C\u9009\u9879" },
+    { id: "fields", label: "\u5B57\u6BB5\u8BBE\u7F6E", icon: /* @__PURE__ */ React.createElement(Type, { className: "w-4 h-4" }), description: "\u9009\u62E9\u548C\u914D\u7F6E\u5BFC\u51FA\u5B57\u6BB5" },
+    { id: "grouping", label: "\u5206\u7EC4\u8BBE\u7F6E", icon: /* @__PURE__ */ React.createElement(Group, { className: "w-4 h-4" }), description: "\u914D\u7F6E\u6570\u636E\u5206\u7EC4\u548C\u5408\u5E76\u9009\u9879" },
+    { id: "manage", label: "\u914D\u7F6E\u7BA1\u7406", icon: /* @__PURE__ */ React.createElement(Database, { className: "w-4 h-4" }), description: "\u7BA1\u7406\u5DF2\u4FDD\u5B58\u7684\u5BFC\u51FA\u914D\u7F6E" }
+  ];
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: `fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4 ${className}`,
+      onClick: onCancel
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "bg-white rounded-lg shadow-xl w-full max-w-5xl max-h-[90vh] flex flex-col",
+        onClick: (e) => e.stopPropagation()
+      },
+      /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between p-4 border-b flex-shrink-0" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React.createElement(Settings, { className: "w-6 h-6 text-blue-600" }), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("h2", { className: "text-xl font-semibold text-gray-900" }, "\u5BFC\u51FA\u914D\u7F6E\u7F16\u8F91\u5668"), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-600" }, "\u914D\u7F6E\u5BFC\u51FA\u5B57\u6BB5\u548C\u683C\u5F0F\u9009\u9879"))), /* @__PURE__ */ React.createElement("button", { onClick: onCancel, className: "p-2 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg" }, /* @__PURE__ */ React.createElement(X, { className: "w-5 h-5" }))),
+      /* @__PURE__ */ React.createElement("div", { className: "border-b bg-gray-50 flex-shrink-0" }, /* @__PURE__ */ React.createElement("nav", { className: "flex space-x-1 p-2" }, tabs.map((tab) => /* @__PURE__ */ React.createElement(
+        "button",
+        {
+          key: tab.id,
+          onClick: () => setActiveTab(tab.id),
+          className: `flex items-center gap-2 px-4 py-3 text-sm font-medium rounded-lg transition-colors ${activeTab === tab.id ? "bg-white text-blue-600 shadow-sm border border-gray-200" : "text-gray-600 hover:text-gray-900"}`
+        },
+        tab.icon,
+        /* @__PURE__ */ React.createElement("span", null, tab.label)
+      )))),
+      /* @__PURE__ */ React.createElement("div", { className: "flex-1 overflow-hidden flex flex-col" }, /* @__PURE__ */ React.createElement("div", { className: "bg-blue-50 border-b border-blue-100 p-4 flex-shrink-0" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 text-blue-800 text-sm font-medium" }, tabs.find((t) => t.id === activeTab)?.icon, tabs.find((t) => t.id === activeTab)?.description)), /* @__PURE__ */ React.createElement("div", { className: "flex-1 overflow-y-auto p-4 sm:p-6" }, activeTab === "basic" && /* @__PURE__ */ React.createElement("div", { className: "max-w-2xl mx-auto space-y-6" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React.createElement("label", { className: "block text-sm font-medium text-gray-700" }, "\u914D\u7F6E\u540D\u79F0 *"), /* @__PURE__ */ React.createElement(
+        "input",
+        {
+          type: "text",
+          value: config.name,
+          onChange: (e) => setConfig((prev) => ({ ...prev, name: e.target.value })),
+          className: "w-full px-3 py-2 border border-gray-300 rounded-lg"
+        }
+      ), /* @__PURE__ */ React.createElement("label", { className: "block text-sm font-medium text-gray-700" }, "\u63CF\u8FF0"), /* @__PURE__ */ React.createElement(
+        "textarea",
+        {
+          value: config.description,
+          onChange: (e) => setConfig((prev) => ({ ...prev, description: e.target.value })),
+          className: "w-full px-3 py-2 border border-gray-300 rounded-lg",
+          rows: 3
+        }
+      ), /* @__PURE__ */ React.createElement("label", { className: "block text-sm font-medium text-gray-700" }, "\u5BFC\u51FA\u683C\u5F0F"), /* @__PURE__ */ React.createElement("div", { className: "space-y-3" }, ["csv", "excel", "json"].map((format) => /* @__PURE__ */ React.createElement("label", { key: format, className: "flex items-start gap-3 p-3 border rounded-lg cursor-pointer hover:border-blue-300" }, /* @__PURE__ */ React.createElement(
+        "input",
+        {
+          type: "radio",
+          checked: config.format === format,
+          onChange: () => setConfig((prev) => ({ ...prev, format })),
+          className: "mt-1"
+        }
+      ), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 font-medium" }, FORMAT_ICONS[format], " ", format.toUpperCase()), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-600" }, FORMAT_DESCRIPTIONS[format]))))))), activeTab === "fields" && /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, config.fields.map((field, index) => /* @__PURE__ */ React.createElement("div", { key: field.key, className: "flex items-center gap-3 p-3 border rounded-lg bg-white" }, /* @__PURE__ */ React.createElement("button", { onClick: () => toggleFieldEnabled(field.key), className: field.enabled ? "text-blue-600" : "text-gray-400" }, field.enabled ? /* @__PURE__ */ React.createElement(Eye, { className: "w-4 h-4" }) : /* @__PURE__ */ React.createElement(EyeOff, { className: "w-4 h-4" })), /* @__PURE__ */ React.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "font-medium" }, field.label), /* @__PURE__ */ React.createElement("div", { className: "text-xs text-gray-500" }, field.key)), /* @__PURE__ */ React.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React.createElement("button", { onClick: () => moveField(field.key, "up"), disabled: index === 0, className: "disabled:opacity-30" }, /* @__PURE__ */ React.createElement(MoveUp, { className: "w-4 h-4" })), /* @__PURE__ */ React.createElement("button", { onClick: () => moveField(field.key, "down"), disabled: index === config.fields.length - 1, className: "disabled:opacity-30" }, /* @__PURE__ */ React.createElement(MoveDown, { className: "w-4 h-4" })), /* @__PURE__ */ React.createElement("button", { onClick: () => removeField(field.key), className: "text-red-600" }, /* @__PURE__ */ React.createElement(Trash2, { className: "w-4 h-4" })))))), activeTab === "grouping" && /* @__PURE__ */ React.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React.createElement("h3", { className: "text-lg font-medium flex items-center gap-2" }, /* @__PURE__ */ React.createElement(Group, { className: "w-5 h-5 text-blue-600" }), " \u5206\u7EC4\u914D\u7F6E"), /* @__PURE__ */ React.createElement("label", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement("input", { type: "checkbox", checked: config.grouping?.enabled, onChange: (e) => toggleGrouping(e.target.checked) }), "\u542F\u7528\u5206\u7EC4")), config.grouping?.enabled && /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, config.grouping.fields.map((gf, index) => /* @__PURE__ */ React.createElement("div", { key: gf.key, className: "p-4 border rounded-lg bg-blue-50 border-blue-200" }, /* @__PURE__ */ React.createElement("div", { className: "flex justify-between items-center mb-4" }, /* @__PURE__ */ React.createElement("span", { className: "font-medium text-blue-900" }, gf.label), /* @__PURE__ */ React.createElement("button", { onClick: () => removeGroupingField(gf.key), className: "text-red-600" }, /* @__PURE__ */ React.createElement(Trash2, { className: "w-4 h-4" }))), /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React.createElement("select", { value: gf.mode, onChange: (e) => updateGroupingField(gf.key, { mode: e.target.value }), className: "border rounded p-2" }, /* @__PURE__ */ React.createElement("option", { value: "merge" }, "\u5408\u5E76\u6A21\u5F0F"), /* @__PURE__ */ React.createElement("option", { value: "separate" }, "\u5206\u79BB\u6A21\u5F0F"), /* @__PURE__ */ React.createElement("option", { value: "nested" }, "\u5D4C\u5957\u6A21\u5F0F")), /* @__PURE__ */ React.createElement("select", { value: gf.valueProcessing, onChange: (e) => updateGroupingField(gf.key, { valueProcessing: e.target.value }), className: "border rounded p-2" }, /* @__PURE__ */ React.createElement("option", { value: "first" }, "\u9996\u503C"), /* @__PURE__ */ React.createElement("option", { value: "sum" }, "\u6C42\u548C"), /* @__PURE__ */ React.createElement("option", { value: "count" }, "\u8BA1\u6570"))))), /* @__PURE__ */ React.createElement("select", { onChange: (e) => e.target.value && addGroupingField(e.target.value), className: "w-full border rounded p-2" }, /* @__PURE__ */ React.createElement("option", { value: "" }, "\u6DFB\u52A0\u5206\u7EC4\u5B57\u6BB5..."), config.fields.filter((f) => f.enabled && !config.grouping?.fields.some((gf) => gf.key === f.key)).map((f) => /* @__PURE__ */ React.createElement("option", { key: f.key, value: f.key }, f.label))))), activeTab === "manage" && /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, loadingConfigs ? /* @__PURE__ */ React.createElement("div", { className: "text-center py-10" }, "\u52A0\u8F7D\u4E2D...") : savedConfigs.map((sc) => /* @__PURE__ */ React.createElement("div", { key: sc.id, className: "flex justify-between items-center p-4 border rounded-lg" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "font-medium" }, sc.name), /* @__PURE__ */ React.createElement("div", { className: "text-sm text-gray-500" }, sc.format)), /* @__PURE__ */ React.createElement("div", { className: "flex gap-2" }, /* @__PURE__ */ React.createElement("button", { onClick: () => loadConfigToEditor(sc), className: "text-blue-600 px-3 py-1 border rounded" }, "\u7F16\u8F91"), /* @__PURE__ */ React.createElement("button", { onClick: () => deleteConfig(sc.id), className: "text-red-600 px-3 py-1 border rounded" }, "\u5220\u9664"))))))),
+      /* @__PURE__ */ React.createElement("div", { className: "flex justify-end gap-3 p-4 border-t bg-gray-50" }, /* @__PURE__ */ React.createElement("button", { onClick: onCancel, className: "px-4 py-2 border rounded" }, "\u53D6\u6D88"), activeTab !== "manage" && /* @__PURE__ */ React.createElement("button", { onClick: handleSave, className: "px-4 py-2 bg-blue-600 text-white rounded flex items-center gap-2" }, /* @__PURE__ */ React.createElement(Save, { className: "w-4 h-4" }), " \u4FDD\u5B58\u914D\u7F6E"))
+    )
+  );
+};
+
+// src/universalExport/components/UniversalExportButton.tsx
+var BUTTON_STYLES = {
+  primary: {
+    sm: "px-3 py-1.5 text-sm bg-blue-600 text-white hover:bg-blue-700",
+    md: "px-4 py-2 text-sm bg-blue-600 text-white hover:bg-blue-700",
+    lg: "px-6 py-3 text-base bg-blue-600 text-white hover:bg-blue-700"
+  },
+  secondary: {
+    sm: "px-3 py-1.5 text-sm bg-gray-600 text-white hover:bg-gray-700",
+    md: "px-4 py-2 text-sm bg-gray-600 text-white hover:bg-gray-700",
+    lg: "px-6 py-3 text-base bg-gray-600 text-white hover:bg-gray-700"
+  },
+  outline: {
+    sm: "px-3 py-1.5 text-sm border border-gray-300 text-gray-700 hover:bg-gray-50",
+    md: "px-4 py-2 text-sm border border-gray-300 text-gray-700 hover:bg-gray-50",
+    lg: "px-6 py-3 text-base border border-gray-300 text-gray-700 hover:bg-gray-50"
+  }
+};
+var UniversalExportButton = ({
+  exportService,
+  moduleId,
+  businessId,
+  availableFields,
+  dataSource,
+  defaultConfig,
+  buttonText = "\u5BFC\u51FA\u6570\u636E",
+  variant = "primary",
+  size = "md",
+  disabled = false,
+  className = "",
+  onExportSuccess,
+  onExportError,
+  onConfigSave
+}) => {
+  const [showConfigEditor, setShowConfigEditor] = useState(false);
+  const [showDropdown, setShowDropdown] = useState(false);
+  const [isExporting, setIsExporting] = useState(false);
+  const [exportProgress, setExportProgress] = useState(null);
+  const [savedConfigs, setSavedConfigs] = useState([]);
+  const loadSavedConfigs = useCallback(async () => {
+    try {
+      if (exportService) {
+        const configs = await exportService.getConfigsByModule(moduleId, businessId);
+        setSavedConfigs(configs);
+      }
+    } catch (error) {
+      console.error("\u52A0\u8F7D\u4FDD\u5B58\u7684\u914D\u7F6E\u5931\u8D25:", error);
+    }
+  }, [exportService, moduleId, businessId]);
+  React.useEffect(() => {
+    loadSavedConfigs();
+  }, [loadSavedConfigs]);
+  const handleExport = useCallback(async (config) => {
+    console.log("\u{1F680} [UniversalExportButton] \u5F00\u59CB\u5BFC\u51FA:", {
+      configId: config.id,
+      configName: config.name,
+      format: config.format,
+      fieldsCount: config.fields.length
+    });
+    if (!exportService) {
+      console.error("\u274C [UniversalExportButton] \u5BFC\u51FA\u670D\u52A1\u672A\u521D\u59CB\u5316");
+      onExportError?.("\u5BFC\u51FA\u670D\u52A1\u672A\u521D\u59CB\u5316");
+      return;
+    }
+    setIsExporting(true);
+    setExportProgress(null);
+    try {
+      const request = {
+        configId: config,
+        dataSource,
+        callbacks: {
+          onProgress: (progress) => {
+            console.log("\u{1F4CA} [UniversalExportButton] \u5BFC\u51FA\u8FDB\u5EA6:", progress);
+            setExportProgress(progress);
+          },
+          onSuccess: (result) => {
+            console.log("\u2705 [UniversalExportButton] \u5BFC\u51FA\u6210\u529F:", {
+              fileName: result.fileName,
+              fileSize: result.fileSize,
+              exportedRows: result.exportedRows
+            });
+            setIsExporting(false);
+            setExportProgress(null);
+            if (result.fileBlob) {
+              console.log("\u{1F4E5} [UniversalExportButton] \u5F00\u59CB\u4E0B\u8F7D\u6587\u4EF6...");
+              const url = window.URL.createObjectURL(result.fileBlob);
+              const link = document.createElement("a");
+              link.href = url;
+              link.download = result.fileName;
+              document.body.appendChild(link);
+              link.click();
+              document.body.removeChild(link);
+              window.URL.revokeObjectURL(url);
+              console.log("\u2705 [UniversalExportButton] \u6587\u4EF6\u4E0B\u8F7D\u5B8C\u6210");
+            }
+            onExportSuccess?.(result);
+          },
+          onError: (error) => {
+            console.error("\u274C [UniversalExportButton] \u5BFC\u51FA\u5931\u8D25:", error);
+            setIsExporting(false);
+            setExportProgress(null);
+            onExportError?.(error.message);
+          }
+        }
+      };
+      console.log("\u{1F4DE} [UniversalExportButton] \u8C03\u7528\u5BFC\u51FA\u670D\u52A1...");
+      await exportService.exportData(request);
+    } catch (error) {
+      console.error("\u274C [UniversalExportButton] \u5BFC\u51FA\u5F02\u5E38:", error);
+      setIsExporting(false);
+      setExportProgress(null);
+      onExportError?.(error instanceof Error ? error.message : "\u5BFC\u51FA\u5931\u8D25");
+    }
+  }, [exportService, dataSource, onExportSuccess, onExportError]);
+  const handleQuickExport = useCallback(async () => {
+    if (defaultConfig) {
+      await handleExport(defaultConfig);
+    } else {
+      const config = {
+        id: "quick_export",
+        name: "\u5FEB\u901F\u5BFC\u51FA",
+        description: "\u4F7F\u7528\u9ED8\u8BA4\u914D\u7F6E\u5FEB\u901F\u5BFC\u51FA",
+        format: "csv",
+        fields: availableFields.map((field, index) => ({
+          ...field,
+          enabled: true,
+          sortOrder: index
+        })),
+        fileNameTemplate: "\u5BFC\u51FA\u6570\u636E_{date}",
+        includeHeader: true,
+        delimiter: ",",
+        encoding: "utf-8",
+        addBOM: true,
+        createdAt: /* @__PURE__ */ new Date(),
+        updatedAt: /* @__PURE__ */ new Date(),
+        moduleId,
+        businessId
+      };
+      await handleExport(config);
+    }
+  }, [defaultConfig, availableFields, moduleId, businessId, handleExport]);
+  const handleConfigSave = useCallback(async (config) => {
+    try {
+      if (exportService) {
+        const savedConfig = await exportService.createConfig(config);
+        await loadSavedConfigs();
+        onConfigSave?.(savedConfig);
+      }
+      setShowConfigEditor(false);
+    } catch (error) {
+      onExportError?.(error instanceof Error ? error.message : "\u4FDD\u5B58\u914D\u7F6E\u5931\u8D25");
+    }
+  }, [exportService, onConfigSave, onExportError, loadSavedConfigs]);
+  const renderProgress = () => {
+    if (!exportProgress) return null;
+    const { status, progress, processedRows, totalRows } = exportProgress;
+    return /* @__PURE__ */ React.createElement("div", { className: "absolute top-full left-0 right-0 mt-2 bg-white border border-gray-200 rounded-lg shadow-lg p-4 z-10" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-3 mb-2" }, /* @__PURE__ */ React.createElement(Loader2, { className: "w-4 h-4 animate-spin text-blue-600" }), /* @__PURE__ */ React.createElement("span", { className: "text-sm font-medium text-gray-900" }, status === "processing" ? "\u6B63\u5728\u5BFC\u51FA..." : "\u5BFC\u51FA\u5B8C\u6210")), /* @__PURE__ */ React.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React.createElement("div", { className: "flex justify-between text-xs text-gray-600" }, /* @__PURE__ */ React.createElement("span", null, "\u8FDB\u5EA6: ", progress, "%"), /* @__PURE__ */ React.createElement("span", null, processedRows, " / ", totalRows, " \u884C")), /* @__PURE__ */ React.createElement("div", { className: "w-full bg-gray-200 rounded-full h-2" }, /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "bg-blue-600 h-2 rounded-full transition-all duration-300",
+        style: { width: `${progress}%` }
+      }
+    ))));
+  };
+  const renderDropdown = () => {
+    if (!showDropdown) return null;
+    return /* @__PURE__ */ React.createElement("div", { className: "absolute top-full left-0 mt-2 bg-white border border-gray-200 rounded-lg shadow-lg py-2 z-10 min-w-48" }, /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        onClick: () => {
+          setShowDropdown(false);
+          handleQuickExport();
+        },
+        disabled: isExporting,
+        className: "w-full px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-50 flex items-center gap-2"
+      },
+      /* @__PURE__ */ React.createElement(Download, { className: "w-4 h-4" }),
+      "\u5FEB\u901F\u5BFC\u51FA"
+    ), savedConfigs.length > 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "border-t border-gray-200 my-1" }), savedConfigs.map((config) => /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        key: config.id,
+        onClick: () => {
+          setShowDropdown(false);
+          handleExport(config);
+        },
+        disabled: isExporting,
+        className: "w-full px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-50 flex items-center gap-2"
+      },
+      /* @__PURE__ */ React.createElement(FileText, { className: "w-4 h-4" }),
+      config.name
+    ))), /* @__PURE__ */ React.createElement("div", { className: "border-t border-gray-200 my-1" }), /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        onClick: () => {
+          setShowDropdown(false);
+          setShowConfigEditor(true);
+        },
+        className: "w-full px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-50 flex items-center gap-2"
+      },
+      /* @__PURE__ */ React.createElement(Settings, { className: "w-4 h-4" }),
+      "\u81EA\u5B9A\u4E49\u914D\u7F6E"
+    ));
+  };
+  const buttonStyle = BUTTON_STYLES[variant][size];
+  const baseClasses = `inline-flex items-center gap-2 rounded-lg font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed ${buttonStyle}`;
+  return /* @__PURE__ */ React.createElement("div", { className: `relative ${className}` }, /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      onClick: () => setShowDropdown(!showDropdown),
+      disabled: disabled || isExporting,
+      className: `${baseClasses} ${isExporting ? "cursor-not-allowed" : ""}`
+    },
+    isExporting ? /* @__PURE__ */ React.createElement(Loader2, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ React.createElement(Download, { className: "w-4 h-4" }),
+    /* @__PURE__ */ React.createElement("span", null, isExporting ? "\u5BFC\u51FA\u4E2D..." : buttonText),
+    /* @__PURE__ */ React.createElement(ChevronDown, { className: "w-4 h-4" })
+  ), renderDropdown(), renderProgress(), /* @__PURE__ */ React.createElement(
+    ExportConfigEditor,
+    {
+      moduleId,
+      businessId,
+      availableFields,
+      onSave: handleConfigSave,
+      onCancel: () => setShowConfigEditor(false),
+      visible: showConfigEditor,
+      onConfigChange: loadSavedConfigs
+    }
+  ), showDropdown && /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: "fixed inset-0 z-0",
+      onClick: () => setShowDropdown(false)
+    }
+  ));
+};
 
-export { API_BASE_PATH, API_ENDPOINTS, DEFAULT_ADD_BOM, DEFAULT_CONFIG_CACHE_TTL, DEFAULT_CSV_DELIMITER, DEFAULT_ENCODING, DEFAULT_EXPORT_FORMAT, DEFAULT_EXPORT_TIMEOUT, DEFAULT_FORMATTERS, DEFAULT_MAX_CONCURRENT_EXPORTS, DEFAULT_MAX_FILE_SIZE, DEFAULT_MAX_ROWS, DEFAULT_RESULT_CACHE_TTL, ERROR_CODES, EXPORT_FORMAT_EXTENSIONS, EXPORT_FORMAT_MIME_TYPES, UNIVERSAL_EXPORT_NAME, UNIVERSAL_EXPORT_VERSION, UniversalExportClient, applyFormatter, createExportClient, createExportError, escapeCSVField, estimateEndTime, formatDuration, formatErrorMessage, formatFileSize, generateExportFileName, getNestedValue, parseCSVField, sanitizeFileName, setNestedValue, universalExportClient, validateExportConfig, validateExportRequest, validateFileName };
+export { API_BASE_PATH, API_ENDPOINTS, DEFAULT_ADD_BOM, DEFAULT_CONFIG_CACHE_TTL, DEFAULT_CSV_DELIMITER, DEFAULT_ENCODING, DEFAULT_EXPORT_FORMAT, DEFAULT_EXPORT_TIMEOUT, DEFAULT_FORMATTERS, DEFAULT_MAX_CONCURRENT_EXPORTS, DEFAULT_MAX_FILE_SIZE, DEFAULT_MAX_ROWS, DEFAULT_RESULT_CACHE_TTL, ERROR_CODES, EXPORT_FORMAT_EXTENSIONS, EXPORT_FORMAT_MIME_TYPES, ExportConfigEditor, UNIVERSAL_EXPORT_NAME, UNIVERSAL_EXPORT_VERSION, UniversalExportButton, UniversalExportClient, applyFormatter, createExportClient, createExportError, escapeCSVField, estimateEndTime, formatDuration, formatErrorMessage, formatFileSize, generateExportFileName, getNestedValue, parseCSVField, sanitizeFileName, setNestedValue, universalExportClient, validateExportConfig, validateExportRequest, validateFileName };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map