@pisell/private-materials 6.3.113 → 6.3.114

package/lib/plus/clientCard/index.js

@@ -1,457 +0,0 @@
-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/plus/clientCard/index.tsx
-var clientCard_exports = {};
-__export(clientCard_exports, {
-  PREFIX: () => PREFIX,
-  default: () => clientCard_default,
-  processClientData: () => processClientData
-});
-module.exports = __toCommonJS(clientCard_exports);
-var import_react = __toESM(require("react"));
-var import_antd = require("antd");
-var import_materials = require("@pisell/materials");
-var import_icon = require("@pisell/icon");
-var import_classnames = __toESM(require("classnames"));
-var import_line = __toESM(require("./line"));
-var import_locales = __toESM(require("./locales"));
-var import_utils = require("@pisell/utils");
-var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
-var import_clientName = __toESM(require("../clientName"));
-var import_utils2 = require("./utils");
-var import_index = require("./index.less");
-var processClientData = (dataSource, fieldNames = {}) => {
-  if (!dataSource) return null;
-  const fields = [
-    "id",
-    "name",
-    "display_name",
-    "nickname",
-    "cover",
-    "phone",
-    "email",
-    "birthday",
-    "address",
-    "tags"
-  ];
-  const _data = {};
-  fields.forEach((key) => {
-    _data[key] = (0, import_utils2.getFieldValue)(dataSource, key, fieldNames);
-  });
-  return {
-    ...dataSource,
-    ..._data
-  };
-};
-var PREFIX = "pisell-client-card";
-var renderAvatar = (processedData, avatarConfig = {}, isShowAvatar = true, isShowStatus = false, statusConfig = {}) => {
-  if (!isShowAvatar || !processedData) return null;
-  const { icon, useTextAvatar = false, children } = avatarConfig;
-  const statusIndicator = isShowStatus && /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: `${PREFIX}__status-indicator`,
-      style: {
-        backgroundColor: statusConfig.color || "#17B26A"
-      }
-    }
-  );
-  if (useTextAvatar) {
-    const text = children || (0, import_utils2.getAvatarText)(
-      processedData.name || processedData.display_name || processedData.nickname || ""
-    );
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__avatar-wrapper` }, /* @__PURE__ */ import_react.default.createElement(import_materials.PisellAvatar, { className: `${PREFIX}__avatar`, ...avatarConfig }, text), statusIndicator);
-  }
-  if (icon) {
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__avatar-wrapper` }, /* @__PURE__ */ import_react.default.createElement(
-      import_materials.PisellAvatar,
-      {
-        className: `${PREFIX}__avatar`,
-        ...avatarConfig,
-        icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: icon })
-      }
-    ), statusIndicator);
-  }
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__avatar-wrapper` }, /* @__PURE__ */ import_react.default.createElement(
-    import_materials.PisellAvatar,
-    {
-      className: `${PREFIX}__avatar`,
-      ...avatarConfig,
-      src: processedData.cover
-    }
-  ), statusIndicator);
-};
-var renderTags = (processedData, isShowTag = true, tags = [], tagConfig = {}) => {
-  if (!isShowTag) return null;
-  const tagsToShow = tags.length > 0 ? tags : (processedData == null ? void 0 : processedData.tags) || [];
-  if (!tagsToShow.length) return null;
-  const { gap = 4, flexWrap = "nowrap" } = tagConfig;
-  const isNoWrap = flexWrap === "nowrap";
-  return /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: (0, import_classnames.default)(
-        `${PREFIX}__tags`,
-        isNoWrap && `${PREFIX}__tags--nowrap`
-      ),
-      style: { gap, flexWrap }
-    },
-    tagsToShow.map((tag, index) => {
-      const content = typeof tag === "string" ? tag : tag.children || tag.label;
-      const tagProps = {
-        key: index,
-        color: typeof tag === "object" ? tag.color : void 0,
-        className: (0, import_classnames.default)(
-          `${PREFIX}__tag`,
-          isNoWrap && `${PREFIX}__tag--nowrap`,
-          !isNoWrap && `${PREFIX}__tag--wrap`
-        )
-      };
-      return import_react.default.createElement(import_antd.Tag, tagProps, content);
-    })
-  );
-};
-var renderContactInfo = (processedData, isShowPhone = true, isShowEmail = true, isShowBirthday = true, isShowAddress = true, gap, cardType) => {
-  if (!processedData) return null;
-  const fields = [];
-  if (cardType === "b2") {
-    if (isShowPhone && processedData.phone) {
-      fields.push({ value: processedData.phone, type: "phone" });
-    } else if (isShowEmail && processedData.email) {
-      fields.push({ value: processedData.email, type: "email" });
-    }
-  } else {
-    if (isShowPhone && processedData.phone) {
-      fields.push({ value: processedData.phone, type: "phone" });
-    }
-    if (isShowEmail && processedData.email) {
-      fields.push({ value: processedData.email, type: "email" });
-    }
-  }
-  if (isShowBirthday && processedData.birthday) {
-    fields.push({ value: processedData.birthday, type: "birthday" });
-  }
-  if (isShowAddress && processedData.address) {
-    fields.push({ value: processedData.address, type: "address" });
-  }
-  if (!fields.length) return null;
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__fields`, style: { gap } }, fields.map((field, index) => /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      key: index,
-      className: (0, import_classnames.default)(
-        `${PREFIX}__contact`,
-        field.type === "address" && `${PREFIX}__contact--address`
-      )
-    },
-    field.value
-  )));
-};
-var renderExtraFields = (extraFields = [], gap) => {
-  if (!extraFields.length) return null;
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__extra-fields`, style: { gap } }, extraFields.map((field, index) => {
-    return /* @__PURE__ */ import_react.default.createElement("div", { key: index, className: `${PREFIX}__extra-field` }, field.icon && /* @__PURE__ */ import_react.default.createElement(
-      import_materials.Icon,
-      {
-        type: field.icon,
-        className: `${PREFIX}__extra-field-icon`,
-        style: {
-          fontSize: field.iconSize,
-          color: field.iconColor
-        }
-      }
-    ), field.isShowLabel !== false && field.label && /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}__extra-field-label` }, field.label, ":"), field.isShowValue !== false && field.value && /* @__PURE__ */ import_react.default.createElement("span", { className: (0, import_classnames.default)(`${PREFIX}__extra-field-value`) }, field.value));
-  }));
-};
-var ClientCard = ({
-  // 基础配置
-  type = "b2",
-  direction = "horizontal",
-  dataSource,
-  fieldNames = {},
-  // 样式配置
-  style: customStyle = {},
-  horizontalGap,
-  verticalGap,
-  // 显示配置
-  isShowAvatar = true,
-  isShowName = true,
-  isShowPhone = true,
-  isShowEmail = true,
-  isShowBirthday = true,
-  isShowAddress = true,
-  isShowTag = true,
-  isShowStatus = false,
-  isShowEmptyDescription = true,
-  // 头像配置
-  avatar = {},
-  status = {},
-  // 下拉菜单
-  dropdown,
-  // 姓名样式
-  defaultName,
-  nameStyle = {},
-  // 标签配置
-  tags = [],
-  tag = {},
-  // 额外字段
-  extraFields = [],
-  // 插槽
-  slots = {},
-  // 事件回调
-  onViewClient,
-  onAddClient,
-  onChangeClient,
-  onRemoveClient
-}) => {
-  var _a, _b, _c;
-  const context = (0, import_useEngineContext.default)();
-  import_utils.locales.init(
-    import_locales.default,
-    ((_c = (_b = (_a = context.appHelper) == null ? void 0 : _a.utils) == null ? void 0 : _b.storage) == null ? void 0 : _c.get("umi_locale")) || "en"
-  );
-  const processed = (0, import_react.useMemo)(() => {
-    if (dataSource) {
-      return processClientData(dataSource, fieldNames);
-    }
-    return null;
-  }, [dataSource, fieldNames]);
-  const translatedExtraFields = (0, import_react.useMemo)(() => {
-    const _fields = extraFields.filter((item) => !!item);
-    return _fields;
-  }, [extraFields]);
-  const _dropdownProps = (0, import_react.useMemo)(() => {
-    const _props = {
-      menu: {
-        items: [
-          {
-            key: "change",
-            label: import_utils.locales.getText("pisell2.text.change-client"),
-            onClick: () => {
-              onChangeClient == null ? void 0 : onChangeClient(dataSource);
-            }
-          },
-          {
-            key: "remove",
-            label: import_utils.locales.getText("pisell2.text.remove-client"),
-            onClick: () => {
-              onRemoveClient == null ? void 0 : onRemoveClient(dataSource);
-            }
-          }
-        ]
-      }
-    };
-    if (dropdown && "open" in dropdown) {
-      _props.open = dropdown.open;
-    }
-    return _props;
-  }, [dropdown]);
-  const isWalkIn = (0, import_utils2.isWalkIn)(processed == null ? void 0 : processed.id);
-  if (isWalkIn) {
-    const cardStyle2 = {
-      ...customStyle,
-      gap: horizontalGap
-    };
-    return /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: (0, import_classnames.default)(PREFIX, `${PREFIX}--empty`),
-        ...{ onClick: () => onAddClient == null ? void 0 : onAddClient() },
-        style: { ...cardStyle2, cursor: "pointer" }
-      },
-      /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__content` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__info` }, isShowAvatar && /* @__PURE__ */ import_react.default.createElement(
-        import_materials.PisellAvatar,
-        {
-          icon: avatar.icon ? /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: avatar.icon }) : /* @__PURE__ */ import_react.default.createElement(
-            import_icon.User01,
-            {
-              style: {
-                color: "#475467"
-              }
-            }
-          ),
-          size: avatar.size
-        }
-      ), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__details`, style: { gap: verticalGap } }, isShowName && /* @__PURE__ */ import_react.default.createElement(
-        import_clientName.default,
-        {
-          dataSource: defaultName || import_utils.locales.getText("pisell2.text.add-client"),
-          style: nameStyle
-        }
-      ), isShowEmptyDescription && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__empty-description` }, import_utils.locales.getText("pisell2.text.leave-empty-for-walk-in")))), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__actions` }, /* @__PURE__ */ import_react.default.createElement("span", { className: `${PREFIX}__plugin-icon` }, /* @__PURE__ */ import_react.default.createElement(
-        import_icon.PlusCircle,
-        {
-          style: {
-            fontSize: 28,
-            color: "#475467"
-          }
-        }
-      ))))
-    );
-  }
-  if (type === "b1") {
-    return /* @__PURE__ */ import_react.default.createElement(
-      import_line.default,
-      {
-        dataSource: processed,
-        isShowAvatar,
-        isShowPhone,
-        isShowEmail,
-        isShowStatus,
-        style: customStyle,
-        horizontalGap,
-        avatar,
-        status,
-        nameStyle,
-        tags,
-        tag,
-        slots,
-        onViewClient
-      }
-    );
-  }
-  const cardStyle = {
-    ...customStyle,
-    gap: horizontalGap
-  };
-  const isVertical = direction === "vertical";
-  const isInlineTag = tag.placement === "inline";
-  const getFieldVisibility = () => {
-    switch (type) {
-      case "b2":
-        return {
-          showBirthday: false,
-          showAddress: false,
-          showExtraFields: false
-        };
-      case "b5":
-        return {
-          showBirthday: isShowBirthday,
-          showAddress: isShowAddress,
-          showExtraFields: false
-        };
-      case "b9":
-        return {
-          showBirthday: isShowBirthday,
-          showAddress: isShowAddress,
-          showExtraFields: true
-        };
-      default:
-        return {
-          showBirthday: isShowBirthday,
-          showAddress: isShowAddress,
-          showExtraFields: true
-        };
-    }
-  };
-  const { showBirthday, showAddress, showExtraFields } = getFieldVisibility();
-  return /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: (0, import_classnames.default)(PREFIX, `${PREFIX}--${type}`, {
-        [`${PREFIX}--vertical`]: isVertical,
-        [`${PREFIX}--horizontal`]: !isVertical
-      }),
-      style: { ...cardStyle, cursor: "pointer" },
-      ...{ onClick: () => dataSource && (onViewClient == null ? void 0 : onViewClient(dataSource)) }
-    },
-    slots.top,
-    /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__content` }, slots.left && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__slot-left` }, slots.left), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__info` }, renderAvatar(processed, avatar, isShowAvatar, isShowStatus, status), /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__details`, style: { gap: verticalGap } }, /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: (0, import_classnames.default)(
-          `${PREFIX}__name-tags`,
-          isInlineTag && `${PREFIX}__name-tags--inline`
-        )
-      },
-      isShowName && /* @__PURE__ */ import_react.default.createElement(
-        import_clientName.default,
-        {
-          dataSource: processed,
-          style: nameStyle,
-          className: "pisell-client-card__name "
-        }
-      ),
-      isInlineTag && renderTags(processed, isShowTag, tags, tag)
-    ), !isInlineTag && renderTags(processed, isShowTag, tags, tag), renderContactInfo(
-      processed,
-      isShowPhone,
-      isShowEmail,
-      showBirthday,
-      showAddress,
-      typeof verticalGap === "number" ? verticalGap : void 0,
-      type
-    ), showExtraFields && renderExtraFields(
-      translatedExtraFields,
-      typeof verticalGap === "number" ? verticalGap : void 0
-    ))), /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: `${PREFIX}__actions`,
-        onClick: (e) => e.stopPropagation()
-      },
-      /* @__PURE__ */ import_react.default.createElement(
-        import_antd.Dropdown,
-        {
-          trigger: ["click"],
-          placement: "bottomRight",
-          ..._dropdownProps
-        },
-        /* @__PURE__ */ import_react.default.createElement(
-          import_antd.Button,
-          {
-            type: "text",
-            className: `${PREFIX}__menu-button`,
-            size: "large",
-            icon: /* @__PURE__ */ import_react.default.createElement(
-              import_materials.Icon,
-              {
-                type: "pisell2-dots-vertical",
-                className: `${PREFIX}__menu-button-icon`
-              }
-            ),
-            ...(dropdown == null ? void 0 : dropdown.buttonProps) || {},
-            onClick: (e) => {
-              var _a2, _b2;
-              e.stopPropagation();
-              (_b2 = (_a2 = dropdown == null ? void 0 : dropdown.buttonProps) == null ? void 0 : _a2.onClick) == null ? void 0 : _b2.call(_a2, e);
-            }
-          }
-        )
-      )
-    ), slots.right && /* @__PURE__ */ import_react.default.createElement("div", { className: `${PREFIX}__slot-right` }, slots.right)),
-    slots.bottom
-  );
-};
-var clientCard_default = ClientCard;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PREFIX,
-  processClientData
-});