var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/components/booking/forms/single/index.tsx
var single_exports = {};
__export(single_exports, {
  default: () => single_default
});
module.exports = __toCommonJS(single_exports);
var import_react = __toESM(require("react"));
var import_FileDownload02 = __toESM(require("@pisell/icon/es/FileDownload02"));
var import_utils = require("@pisell/utils");
var import_antd = require("antd");
var import_customSelect = __toESM(require("../../components/customSelect"));
var import_collapsibleList = __toESM(require("../../components/collapsibleList"));
var import_index = require("./index.less");
var import_RenderValueById = __toESM(require("./RenderValueById"));
var import_useComponents = __toESM(require("../../../../hooks/useComponents"));
var import_dayjs = __toESM(require("dayjs"));
var import_date = require("../../../../utils/date");
var queryValueById = ["checkbox", "radioButton", "select", "form_to_form"];
var Single = ({
  value,
  onChange,
  form,
  mode,
  optionRender,
  loading,
  customSelectProps,
  onAdd,
  addButtonProps,
  modalOpen,
  watch,
  drawerProps
}) => {
  var _a, _b;
  const [HumanBodySelector] = (0, import_useComponents.default)({
    components: ["HumanBodySelector"]
  });
  const renderFieldValue = (fieldData, field) => {
    const val = fieldData[field.key];
    if (field.filed_type === "attachment") {
      if (Array.isArray(val)) {
        return val.map((item) => {
          if (item.type.indexOf("image") !== -1) {
            return /* @__PURE__ */ import_react.default.createElement(
              "img",
              {
                className: "attachment-item",
                src: import_utils.image.ali(item.url, 200),
                key: import_utils.image.ali(item.url, 200)
              }
            );
          }
          return /* @__PURE__ */ import_react.default.createElement(
            "a",
            {
              href: item.url,
              key: item.url,
              style: { display: "block", marginTop: 8 },
              onClick: (e) => {
                e.stopPropagation();
              }
            },
            /* @__PURE__ */ import_react.default.createElement(import_FileDownload02.default, { style: { fontSize: 40 } })
          );
        });
      }
    }
    if (field.filed_type === "customer_cover") {
      return /* @__PURE__ */ import_react.default.createElement(import_antd.Avatar, { src: val });
    }
    if (field.filed_type === "signature") {
      return /* @__PURE__ */ import_react.default.createElement(
        "img",
        {
          className: "attachment-item",
          src: import_utils.image.ali(val, 200),
          key: import_utils.image.ali(val, 200)
        }
      );
    }
    if (field.filed_type === "customer_phone") {
      if (val) {
        return `${val.country_calling_code && `(+${val.country_calling_code})`} ${val.phone || ""}`;
      }
    }
    if (field.filed_type === "body_hotspot_image") {
      return HumanBodySelector ? /* @__PURE__ */ import_react.default.createElement(HumanBodySelector, { value: val, disable: true }) : val;
    }
    if (field.filed_type === "agreement") {
      return val === 1 ? import_utils.locales.getText("pisell2.booking.info.text.form-agreement-yes") : import_utils.locales.getText("pisell2.booking.info.text.form-agreement-no");
    }
    if (queryValueById.includes(field == null ? void 0 : field.filed_type)) {
      return /* @__PURE__ */ import_react.default.createElement(import_RenderValueById.default, { field, value: val });
    }
    if ((field == null ? void 0 : field.filed_type) === "media") {
      return null;
    }
    return val || "-";
  };
  const renderItem = (0, import_react.useCallback)(
    (fieldData) => {
      let _fields = form.field || [];
      _fields = _fields.filter((item) => item.status !== "hide");
      return /* @__PURE__ */ import_react.default.createElement(
        import_collapsibleList.default,
        {
          list: _fields,
          renderItem: (field) => {
            return /* @__PURE__ */ import_react.default.createElement("div", { className: "pet-form-item", key: field.key }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pet-form-item-label" }, field.field_column.title), /* @__PURE__ */ import_react.default.createElement("div", { className: "pet-form-item-value" }, renderFieldValue(fieldData, field)));
          }
        }
      );
    },
    [form]
  );
  console.log("fff", form);
  const ignoreValidity = (0, import_react.useMemo)(() => {
    var _a2, _b2;
    return !((_b2 = (_a2 = form == null ? void 0 : form.form) == null ? void 0 : _a2.setting) == null ? void 0 : _b2.validity) || form.form.setting.validity.type === "no_expiry";
  }, [form == null ? void 0 : form.form]);
  const getExpireStatus = (expiredAt) => {
    if (ignoreValidity || !expiredAt) return null;
    const now = (0, import_dayjs.default)();
    const expireDate = (0, import_dayjs.default)(expiredAt).endOf("day");
    const diffDays = expireDate.diff(now, "day");
    let cnDate = "YYYY-MM-DD";
    let enDate = "DD/MM/YYYY";
    const formattedDate = (0, import_date.formatDate)(expireDate, cnDate, enDate);
    if (now.isAfter(expireDate)) {
      return /* @__PURE__ */ import_react.default.createElement("div", { style: { color: "#999999", fontSize: "14px", lineHeight: "20px" } }, /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, { color: "red", style: { borderRadius: 16, marginRight: 8 } }, import_utils.locales.getText("pisell2.text.status.expired")), import_utils.locales.getText("pisell2.text.validity.expired")(formattedDate));
    }
    if (diffDays < 7) {
      return /* @__PURE__ */ import_react.default.createElement("div", { style: { color: "#FFA940", fontSize: "14px", lineHeight: "20px" } }, import_utils.locales.getText("pisell2.text.validity.expiring_soon")(
        formattedDate
      ));
    }
    return /* @__PURE__ */ import_react.default.createElement("div", { style: { color: "#999999", fontSize: "14px", lineHeight: "20px" } }, import_utils.locales.getText("pisell2.text.validity.valid_through")(formattedDate));
  };
  const _optionRender = (item) => {
    if (optionRender) {
      return optionRender(item);
    }
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        style: {
          flex: 1
        }
      },
      /* @__PURE__ */ import_react.default.createElement("div", { style: { color: "#1B1B1B", fontSize: 16, fontWeight: 600, lineHeight: "22px" } }, item["main_field"] || item[form.option_key] || "-"),
      /* @__PURE__ */ import_react.default.createElement("div", null, getExpireStatus(item.expired_at))
    );
  };
  const _addButtonProps = (0, import_react.useMemo)(() => {
    var _a2, _b2;
    let obj = {
      title: `${import_utils.locales.getText("pisell2.text.add-a")} ${((_a2 = form.form) == null ? void 0 : _a2.title) || "-"}`,
      subTitle: `${import_utils.locales.getText("pisell2.text.add-another")} ${((_b2 = form.form) == null ? void 0 : _b2.title) || "-"}`,
      ...addButtonProps
    };
    if (["form", "table"].includes(form.type)) {
      obj.onClick = onAdd;
    }
    return obj;
  }, [form, addButtonProps, value, watch]);
  const _mode = (0, import_react.useMemo)(() => {
    if (["form"].includes(mode)) {
      return "single";
    }
    if (["table"].includes(mode)) {
      return "multiple";
    }
    return mode;
  }, [mode, form]);
  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-pet-cards" }, /* @__PURE__ */ import_react.default.createElement(
    import_customSelect.default,
    {
      loading,
      value,
      options: form.options || [],
      onValueChange: (e) => {
        onChange(e);
      },
      modalOpen,
      mode: _mode,
      previewItemClassName: "pisell-lowcode__booking-pet-card",
      previewItemRender: (d) => {
        return renderItem(d);
      },
      name: ((_a = form.form) == null ? void 0 : _a.title) || "-",
      addButtonProps: _addButtonProps,
      drawerProps: {
        title: `${import_utils.locales.getText("pisell2.text.select")} ${((_b = form.form) == null ? void 0 : _b.title) || "-"}`,
        destroyOnClose: true,
        ...drawerProps || {}
      },
      optionRender: _optionRender,
      rowKey: "form_record_id",
      ...customSelectProps || {}
    }
  ));
};
var single_default = Single;
