@pisell/private-materials 6.9.2 → 6.9.3

package/lib/components/ecocup/components/CupStatusModal/index.js

@@ -0,0 +1,140 @@
+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/ecocup/components/CupStatusModal/index.tsx
+var CupStatusModal_exports = {};
+__export(CupStatusModal_exports, {
+  default: () => CupStatusModal_default
+});
+module.exports = __toCommonJS(CupStatusModal_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
+var import_types = require("../../types");
+var import_index = require("./index.less");
+var import_CupInfoCard = __toESM(require("../CupInfoCard"));
+var import_CustomerCard = __toESM(require("../CustomerCard"));
+var import_hooks = require("./hooks");
+var CupStatusModal = (props) => {
+  var _a;
+  const { visible, onCancel, onOk, data } = props;
+  const { scanStatus, cupData } = data || {};
+  const cupAction = (0, import_hooks.useCupAction)();
+  const isRed = scanStatus !== import_types.ECupScanStatus.OTHER_IN_STOCK && scanStatus !== import_types.ECupScanStatus.OTHER_RENT;
+  const lineStyle = (0, import_react.useMemo)(() => {
+    if (isRed) {
+      return {
+        backgroundColor: "#FEE4E2",
+        color: "#F04438"
+      };
+    }
+    return {
+      backgroundColor: "#F6F2FF",
+      color: "#7F56DA"
+    };
+  }, [isRed]);
+  const cupInfoCardType = (0, import_react.useMemo)(() => {
+    if (scanStatus === import_types.ECupScanStatus.OTHER_IN_STOCK || scanStatus === import_types.ECupScanStatus.IN_STOCK) {
+      return "belongInfo";
+    }
+    if (scanStatus === import_types.ECupScanStatus.OTHER_RENT || scanStatus === import_types.ECupScanStatus.RENT) {
+      return "rentInfo";
+    }
+    if (scanStatus === import_types.ECupScanStatus.MISSING || scanStatus === import_types.ECupScanStatus.BROKEN) {
+      return "markInfo";
+    }
+    return "";
+  }, [scanStatus]);
+  const _onCancel = () => {
+    if (cupAction == null ? void 0 : cupAction.loading) return;
+    onCancel == null ? void 0 : onCancel();
+  };
+  const _onOk = async () => {
+    if (cupAction == null ? void 0 : cupAction.loading) return;
+    const type = scanStatus === import_types.ECupScanStatus.OTHER_IN_STOCK ? import_types.ECupActionType.TRANSFER : scanStatus === import_types.ECupScanStatus.OTHER_RENT ? import_types.ECupActionType.RETURN : "";
+    if (!type) {
+      onOk == null ? void 0 : onOk();
+      return;
+    }
+    const result = await cupAction.run(
+      (cupData == null ? void 0 : cupData.eco_cup_id) || (cupData == null ? void 0 : cupData.id),
+      type
+    );
+    if (result) {
+      (0, import_materials.PisellToast)({
+        content: import_utils.locales.getText(`pisell2.text.ecocup.toast.success-${type}`)
+      });
+      onOk == null ? void 0 : onOk();
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_materials.PisellModal,
+    {
+      headerDivider: false,
+      open: visible,
+      onCancel: _onCancel,
+      onOk: _onOk,
+      title: import_utils.locales.getText(
+        `pisell2.text.ecocup.cup-status-modal.title-${scanStatus}`
+      ),
+      cancelText: import_utils.locales.getText("pisell2.text.ecocup.button.dismiss"),
+      okText: isRed ? import_utils.locales.getText("pisell2.text.ecocup.button.confirm") : scanStatus === import_types.ECupScanStatus.OTHER_IN_STOCK ? import_utils.locales.getText("pisell2.text.ecocup.button.transfer") : import_utils.locales.getText("pisell2.text.ecocup.button.mark-as-return"),
+      okButtonProps: { loading: cupAction == null ? void 0 : cupAction.loading },
+      cancelVisible: !isRed,
+      width: 580
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-cup-status-modal-content" }, /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: "pisell2-ecocup-cup-status-modal-content-cup",
+        style: { ...lineStyle }
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "RestOutlined", size: 24 }),
+      /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          style: {
+            color: !isRed ? "#667085" : "#F04438"
+          }
+        },
+        import_utils.locales.getText("pisell2.text.ecocup.cup-id")
+      ),
+      /* @__PURE__ */ import_react.default.createElement("span", null, (cupData == null ? void 0 : cupData.eco_cup_code) || (cupData == null ? void 0 : cupData.code) || "")
+    ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-cup-status-modal-content-info" }, /* @__PURE__ */ import_react.default.createElement("div", { style: { flex: 1 } }, (cupData == null ? void 0 : cupData.current_shop) && cupInfoCardType ? /* @__PURE__ */ import_react.default.createElement(
+      import_CupInfoCard.default,
+      {
+        type: cupInfoCardType,
+        data: {
+          shop: (_a = cupData == null ? void 0 : cupData.current_shop) == null ? void 0 : _a.name,
+          time: cupData == null ? void 0 : cupData.operated_at
+        }
+      }
+    ) : null), /* @__PURE__ */ import_react.default.createElement("div", { style: { flex: 1 } }, (cupData == null ? void 0 : cupData.status) === import_types.ECupStatus.RENT ? (cupData == null ? void 0 : cupData.customer) ? /* @__PURE__ */ import_react.default.createElement(import_CustomerCard.default, { ...(cupData == null ? void 0 : cupData.customer) || {} }) : null : (cupData == null ? void 0 : cupData.status) === import_types.ECupStatus.IN_STOCK ? null : /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-cup-status-modal-content-info-tip" }, import_utils.locales.getText("pisell2.text.ecocup.cup-status-modal.tip")))))
+  );
+};
+var CupStatusModal_default = CupStatusModal;

package/lib/components/ecocup/components/CupStatusModal/index.less

@@ -0,0 +1,35 @@
+.pisell2-ecocup-cup-status-modal-content {
+  padding: 0 0 24px 0;
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+
+  &-cup {
+    height: 60px;
+    padding: 0 16px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    border-radius: 8px;
+    gap: 8px;
+
+    & > span {
+      font-size: 20px;
+      font-weight: 300;
+    }
+  }
+
+  &-info {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    &-tip {
+      flex: 1;
+      color: #d92d20;
+      font-size: 16px;
+      font-weight: 400;
+    }
+  }
+}

package/lib/components/ecocup/components/CustomerAndCupModal/hooks.d.ts

@@ -0,0 +1,14 @@
+/**
+ * 获取客户详情
+ */
+export declare const useCustomerDetail: () => {
+    run: (id: string) => Promise<any>;
+    loading: boolean;
+};
+/**
+ * 批量租用杯子
+ */
+export declare const useBatchRentCups: () => {
+    run: (id: string, cupIds: string[]) => Promise<boolean>;
+    loading: boolean;
+};

package/lib/components/ecocup/components/CustomerAndCupModal/hooks.js

@@ -0,0 +1,89 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ecocup/components/CustomerAndCupModal/hooks.ts
+var hooks_exports = {};
+__export(hooks_exports, {
+  useBatchRentCups: () => useBatchRentCups,
+  useCustomerDetail: () => useCustomerDetail
+});
+module.exports = __toCommonJS(hooks_exports);
+var import_react = require("react");
+var import_ahooks = require("ahooks");
+var import_hooks = require("../../hooks");
+var useCustomerDetail = () => {
+  const { get } = (0, import_hooks.useRequest)();
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const { goalShopId } = (0, import_hooks.useGetGoalShopInfo)();
+  const run = (0, import_ahooks.useMemoizedFn)(async (id) => {
+    try {
+      setLoading(true);
+      const res = await get(`/shop/wallet/eco/customer/${id}`, {
+        with_rent_cups_flag: 1,
+        goal_shop_id: goalShopId,
+        with: ["tags"]
+      });
+      if ((res == null ? void 0 : res.code) == 200) {
+        return res == null ? void 0 : res.data;
+      }
+      return null;
+    } catch (error) {
+      console.error(error);
+      return null;
+    } finally {
+      setLoading(false);
+    }
+  });
+  return {
+    run,
+    loading
+  };
+};
+var useBatchRentCups = () => {
+  const { post } = (0, import_hooks.useRequest)();
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const { goalShopId } = (0, import_hooks.useGetGoalShopInfo)();
+  const run = (0, import_ahooks.useMemoizedFn)(async (id, cupIds) => {
+    try {
+      setLoading(true);
+      const res = await post("/shop/wallet/eco/cups-rent", {
+        customer_id: id,
+        eco_cup_ids: cupIds,
+        goal_shop_id: goalShopId
+      });
+      if ((res == null ? void 0 : res.code) == 200) {
+        return true;
+      }
+      return false;
+    } catch (error) {
+      console.error(error);
+      return false;
+    } finally {
+      setLoading(false);
+    }
+  });
+  return {
+    run,
+    loading
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useBatchRentCups,
+  useCustomerDetail
+});

package/lib/components/ecocup/components/CustomerAndCupModal/index.d.ts

@@ -0,0 +1,16 @@
+import './index.less';
+import { ICup, ICustomer } from '../../types';
+interface IProps {
+    key: string;
+    title?: string;
+    visible: boolean;
+    onCancel: () => void;
+    onOk: () => void;
+    data: {
+        firstType: 'customer' | 'cup';
+        customerData?: ICustomer;
+        cupData?: ICup;
+    };
+}
+declare const CustomerAndCupModal: (props: IProps) => JSX.Element;
+export default CustomerAndCupModal;

package/lib/components/ecocup/components/CustomerAndCupModal/index.js

@@ -0,0 +1,178 @@
+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/ecocup/components/CustomerAndCupModal/index.tsx
+var CustomerAndCupModal_exports = {};
+__export(CustomerAndCupModal_exports, {
+  default: () => CustomerAndCupModal_default
+});
+module.exports = __toCommonJS(CustomerAndCupModal_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
+var import_ahooks = require("ahooks");
+var import_CustomerCard = __toESM(require("../CustomerCard"));
+var import_SearchBar = __toESM(require("../SearchBar"));
+var import_index = require("./index.less");
+var import_CupActionList = __toESM(require("../CupActionList"));
+var import_types = require("../../types");
+var import_hooks = require("./hooks");
+var SCAN_LISTENER_KEY = "eco-cup-customer-first-modal-scan-listener";
+var CustomerAndCupModal = (props) => {
+  const { key, title, visible, onCancel, onOk, data } = props;
+  const [customerData, setCustomerData] = (0, import_react.useState)();
+  const [rentedCups, setRentedCups] = (0, import_react.useState)([]);
+  const [newCups, setNewCups] = (0, import_react.useState)([]);
+  const [maxCupsNum, setMaxCupsNum] = (0, import_react.useState)(0);
+  const customerDetail = (0, import_hooks.useCustomerDetail)();
+  const batchRentCups = (0, import_hooks.useBatchRentCups)();
+  const currentCupsNum = (0, import_react.useMemo)(() => {
+    return ((rentedCups == null ? void 0 : rentedCups.length) || 0) + ((newCups == null ? void 0 : newCups.length) || 0);
+  }, [rentedCups, newCups]);
+  const isOverMax = (0, import_react.useMemo)(() => {
+    return currentCupsNum > maxCupsNum;
+  }, [currentCupsNum, maxCupsNum]);
+  const isLoading = (0, import_react.useMemo)(() => {
+    return (customerDetail == null ? void 0 : customerDetail.loading) || (batchRentCups == null ? void 0 : batchRentCups.loading);
+  }, [customerDetail == null ? void 0 : customerDetail.loading, batchRentCups == null ? void 0 : batchRentCups.loading]);
+  (0, import_react.useEffect)(() => {
+    setCustomerData((data == null ? void 0 : data.customerData) || void 0);
+  }, [data == null ? void 0 : data.customerData]);
+  const _getCustomerDetail = (0, import_ahooks.useMemoizedFn)((id) => {
+    if (!id) return;
+    customerDetail.run(id).then((res) => {
+      console.log("res", res);
+      if (res) {
+        setMaxCupsNum((res == null ? void 0 : res.max_rent_count) || 0);
+        setRentedCups((res == null ? void 0 : res.rent_cups) || []);
+      } else {
+        setMaxCupsNum(0);
+        setRentedCups([]);
+      }
+    });
+  });
+  (0, import_react.useEffect)(() => {
+    var _a;
+    if ((data == null ? void 0 : data.firstType) === "cup") {
+      (data == null ? void 0 : data.cupData) && setNewCups([data == null ? void 0 : data.cupData]);
+    } else {
+      _getCustomerDetail((_a = data == null ? void 0 : data.customerData) == null ? void 0 : _a.id);
+    }
+  }, [data == null ? void 0 : data.firstType, data == null ? void 0 : data.customerData, data == null ? void 0 : data.cupData, _getCustomerDetail]);
+  const _onCancel = () => {
+    if (isLoading) return;
+    onCancel == null ? void 0 : onCancel();
+  };
+  const _onOk = async () => {
+    if (isLoading || !(customerData == null ? void 0 : customerData.id)) return;
+    const cupIds = newCups.map((c) => c == null ? void 0 : c.id);
+    const result = await batchRentCups.run(customerData == null ? void 0 : customerData.id, cupIds);
+    if (!result) {
+      return;
+    }
+    setNewCups([]);
+    _getCustomerDetail(customerData == null ? void 0 : customerData.id);
+  };
+  const onSearchResult = (result) => {
+    var _a, _b;
+    console.log("onSearchResult", result);
+    if ((result == null ? void 0 : result.type) === "cup") {
+      if (newCups.find((c) => {
+        var _a2;
+        return (c == null ? void 0 : c.id) === ((_a2 = result == null ? void 0 : result.data) == null ? void 0 : _a2.id);
+      })) {
+        return;
+      }
+      if (((_a = result == null ? void 0 : result.data) == null ? void 0 : _a.status) !== import_types.ECupStatus.IN_STOCK) {
+        return;
+      }
+      setNewCups([...newCups, result == null ? void 0 : result.data]);
+    } else {
+      setCustomerData(result == null ? void 0 : result.data);
+      _getCustomerDetail((_b = result == null ? void 0 : result.data) == null ? void 0 : _b.id);
+    }
+  };
+  const renderCustomerCard = () => {
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-first-modal-title" }, "Current Customer"), (customerData == null ? void 0 : customerData.id) ? /* @__PURE__ */ import_react.default.createElement(import_CustomerCard.default, { ...customerData || {} }) : /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-first-modal-no-customer" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-first-modal-no-customer-icon" }), /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell2-ecocup-customer-first-modal-no-customer-text" }, import_utils.locales.getText(
+      "pisell2.text.ecocup.customer-first-modal.no-customer"
+    ))));
+  };
+  const renderSearchBar = () => {
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-first-modal-search-bar" }, /* @__PURE__ */ import_react.default.createElement(
+      import_SearchBar.default,
+      {
+        scanListenerKey: `${key}-${SCAN_LISTENER_KEY}`,
+        searchType: (customerData == null ? void 0 : customerData.id) ? "cup" : void 0,
+        placeholder: (customerData == null ? void 0 : customerData.id) ? import_utils.locales.getText(
+          "pisell2.text.ecocup.customer-first-modal.search-bar.placeholder-cup"
+        ) : import_utils.locales.getText(
+          "pisell2.text.ecocup.customer-first-modal.search-bar.placeholder"
+        ),
+        onSearchResult,
+        customerId: customerData == null ? void 0 : customerData.id
+      }
+    ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-first-modal-search-bar-limit" }, /* @__PURE__ */ import_react.default.createElement("span", null, "Max"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("span", { style: { color: isOverMax ? "#CF1322" : "#000000" } }, currentCupsNum), "/", maxCupsNum)));
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_materials.PisellModal,
+    {
+      open: visible,
+      title: title || import_utils.locales.getText("pisell2.text.ecocup.customer-first-modal.title"),
+      headerDivider: false,
+      onCancel: _onCancel,
+      onOk: _onOk,
+      okText: import_utils.locales.getText("pisell2.text.ecocup.button.confirm"),
+      cancelText: import_utils.locales.getText("pisell2.text.ecocup.button.cancel"),
+      okButtonProps: {
+        disabled: newCups.length === 0 || isOverMax || isLoading || !(customerData == null ? void 0 : customerData.id),
+        loading: isLoading
+      },
+      width: 580
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-first-modal" }, (data == null ? void 0 : data.firstType) === "customer" ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, renderCustomerCard(), renderSearchBar()) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, renderSearchBar(), renderCustomerCard()), /* @__PURE__ */ import_react.default.createElement(
+      import_CupActionList.default,
+      {
+        maxNum: maxCupsNum,
+        currentNum: currentCupsNum,
+        cups: [...rentedCups, ...newCups],
+        customerData,
+        onClearAll: () => setNewCups([]),
+        onRemove: (cup) => {
+          setNewCups(newCups.filter((c) => (c == null ? void 0 : c.id) !== (cup == null ? void 0 : cup.id)));
+        },
+        onAction: (type, cup) => {
+          const key2 = (cup == null ? void 0 : cup.eco_cup_id) ? "eco_cup_id" : "id";
+          setRentedCups(
+            rentedCups.filter((c) => (c == null ? void 0 : c[key2]) !== (cup == null ? void 0 : cup[key2]))
+          );
+        }
+      }
+    ))
+  );
+};
+var CustomerAndCupModal_default = CustomerAndCupModal;

package/lib/components/ecocup/components/CustomerAndCupModal/index.less

@@ -0,0 +1,68 @@
+.pisell2-ecocup-customer-first-modal {
+  padding-bottom: 24px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+
+  .pisell2-ecocup-customer-first-modal-title {
+    margin-bottom: 8px;
+    font-size: 14px;
+    font-weight: 300;
+    color: #000000;
+  }
+
+  .pisell2-ecocup-customer-first-modal-no-customer {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-start;
+    gap: 16px;
+
+    &-icon {
+      width: 64px;
+      height: 64px;
+      border-radius: 50%;
+      background-color: #f6f2ff;
+    }
+
+    &-text {
+      color: #101828;
+      font-size: 16px;
+      font-weight: 600;
+    }
+  }
+
+  &-search-bar {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 16px;
+
+    &-limit {
+      width: 100px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      color: #000;
+      font-weight: 300;
+
+      & > span {
+        font-size: 14px;
+      }
+
+      & > div {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: center;
+        font-size: 20px;
+      }
+    }
+  }
+
+  .comprehensive-search__search-section .comprehensive-search__search-button {
+    min-width: 60px !important;
+  }
+}

package/lib/components/ecocup/components/CustomerCard/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import './index.less';
+import { ICustomer } from '../../types';
+interface IProps extends ICustomer {
+}
+declare const CustomerCard: (props: IProps) => JSX.Element | null;
+export default CustomerCard;

package/lib/components/ecocup/components/CustomerCard/index.js

@@ -0,0 +1,48 @@
+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/ecocup/components/CustomerCard/index.tsx
+var CustomerCard_exports = {};
+__export(CustomerCard_exports, {
+  default: () => CustomerCard_default
+});
+module.exports = __toCommonJS(CustomerCard_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("@pisell/utils");
+var import_index = require("./index.less");
+var CustomerCard = (props) => {
+  var _a;
+  const { id, nickname, display_name, phone, country_calling_code, cover } = props;
+  if (!id && !nickname && !display_name && !phone) {
+    return null;
+  }
+  const phoneStr = phone ? `${country_calling_code} ${phone}` : "-";
+  const name = display_name || nickname || "";
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-card" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-card-avatar" }, cover ? /* @__PURE__ */ import_react.default.createElement("img", { src: import_utils.image.ali(cover, 360), alt: "avatar" }) : /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-card-avatar-text" }, ((_a = name == null ? void 0 : name.charAt(0)) == null ? void 0 : _a.toUpperCase()) || "")), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-card-info" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-card-info-name" }, name || ""), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell2-ecocup-customer-card-info-phone" }, phoneStr || "")));
+};
+var CustomerCard_default = CustomerCard;

package/lib/components/ecocup/components/CustomerCard/index.less

@@ -0,0 +1,50 @@
+.pisell2-ecocup-customer-card {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+
+  .pisell2-ecocup-customer-card-avatar {
+    width: 48px;
+    height: 48px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 50%;
+    background: #f2f4f7;
+    border: 1px solid #e5e7eb;
+    overflow: hidden;
+
+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
+    &-text {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 18px;
+      font-weight: 600;
+      color: #475467;
+    }
+  }
+
+  .pisell2-ecocup-customer-card-info {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+
+    &-name {
+      color: #101828;
+      font-size: 16px;
+      font-weight: 600;
+    }
+
+    &-phone {
+      color: #101828;
+      font-size: 16px;
+      font-weight: 400;
+    }
+  }
+}

package/lib/components/ecocup/components/MoreDropdown/index.d.ts

@@ -0,0 +1,8 @@
+interface MoreDropdownProps {
+    locales: any;
+    onClick?: (key: string) => void;
+    buttonText?: string;
+    showFields?: string[];
+}
+declare const MoreDropdown: (props: MoreDropdownProps) => JSX.Element;
+export default MoreDropdown;