import { Fragment } from "react";
import { Field } from "./Field.js";
import { UiForm } from "./UiForm.js";
import { jsx, jsxs } from "../../node_modules/.pnpm/@emotion_react@11.10.4_q4mq7tnhdumujvomvw24zx33y4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
import { Buttons } from "../../components/Button.js";
import "../../components/Tabs.js";
import { toast } from "react-hot-toast";
import ArcoForm from "../../node_modules/.pnpm/@arco-design_web-react@2.40.1_biqbaboplfbrettd7655fr4n2y/node_modules/@arco-design/web-react/es/Form/index.js";
import Skeleton from "../../node_modules/.pnpm/@arco-design_web-react@2.40.1_biqbaboplfbrettd7655fr4n2y/node_modules/@arco-design/web-react/es/Skeleton/index.js";
import Button from "../../node_modules/.pnpm/@arco-design_web-react@2.40.1_biqbaboplfbrettd7655fr4n2y/node_modules/@arco-design/web-react/es/Button/index.js";
const FormItem = ArcoForm.Item;
function FormContent({
  loading = false,
  autoComplete = "off",
  layout = "vertical",
  size = "default",
  data = [],
  type,
  cols,
  gap,
  onChange,
  compressed,
  buttons,
  pageHeader,
  formClassName,
  defaultValues = {},
  values = {},
  formId,
  onCloseModal,
  className = "",
  ...props
}) {
  const [form] = ArcoForm.useForm();
  let customCols = "";
  if (cols) {
    customCols = layout !== "inline" ? `grid grid-cols-${cols} gap-x-${gap || 6} ` : "";
  }
  if (loading) {
    return /* @__PURE__ */ jsx("div", {
      className: "relative w-full m-auto",
      children: /* @__PURE__ */ jsx("div", {
        className: customCols + className,
        children: data == null ? void 0 : data.map((field, index) => /* @__PURE__ */ jsx(Skeleton, {
          animation: true
        }, field.name))
      })
    });
  }
  const items = data == null ? void 0 : data.map((prop, index) => {
    return /* @__PURE__ */ jsx(Field, {
      ...prop
    }, `fild-${index}`);
  });
  const onSubmit = (formData) => {
    console.log("Form onSubmit-->", formData);
    const clearData = Object.keys(formData).filter((key) => formData[key] !== null && formData[key] !== void 0).reduce((acc, key) => ({
      ...acc,
      [key]: formData[key]
    }), {});
    if (type === "create") {
      props.onSubmit && props.onSubmit(clearData);
      return;
    }
    const diffData = JSON.stringify(defaultValues) !== "{}" ? Object.keys(formData).filter((key) => defaultValues[key] !== formData[key]).reduce((ret, key) => ({
      ...ret,
      [key]: formData[key]
    }), {}) : formData;
    if (JSON.stringify(diffData) === "{}") {
      toast.error("\u8BF7\u586B\u5199\u6216\u4FEE\u6539\u5185\u5BB9");
      return;
    }
    props.onSubmit && props.onSubmit(diffData);
  };
  return /* @__PURE__ */ jsx(Fragment, {
    children: /* @__PURE__ */ jsxs(UiForm, {
      id: formId,
      form,
      Form: ArcoForm,
      layout,
      size,
      onSubmit,
      onValuesChange: onChange,
      initialValues: defaultValues || values,
      className: formClassName,
      contentClassName: customCols + className,
      autoComplete,
      header: pageHeader,
      scrollToFirstError: true,
      validateMessages: {
        required: (_, {
          label
        }) => `\u5FC5\u987B\u586B\u5199 ${label}`,
        string: {
          length: `\u5B57\u7B26\u6570\u5FC5\u987B\u662F #{length}`,
          match: `\u4E0D\u5339\u914D\u6B63\u5219 #{pattern}`
        },
        number: {
          min: `\u6700\u5C0F\u503C\u4E3A #{min}`,
          max: `\u6700\u5927\u503C\u4E3A #{max}`
        }
      },
      children: [items, buttons ? /* @__PURE__ */ jsx("div", {
        className: cols ? `col-span-${cols}` : "",
        children: /* @__PURE__ */ jsx(Buttons, {
          data: buttons,
          onCloseModal,
          contentClassName: layout === "horizontal" ? "ml28" : ""
        })
      }) : /* @__PURE__ */ jsx("div", {
        className: cols ? `col-span-${cols}` : "",
        children: /* @__PURE__ */ jsx(FormItem, {
          className: "mt-8 gap-x-6 ",
          wrapperCol: layout === "horizontal" ? {
            offset: 5
          } : {},
          children: /* @__PURE__ */ jsx(Button, {
            type: "primary",
            htmlType: "submit",
            size: "large",
            children: "\u786E\u8BA4\u63D0\u4EA4"
          })
        })
      })]
    })
  });
}
export {
  FormContent as default
};
//# sourceMappingURL=Form.js.map
