@pisell/private-materials 3.0.184 → 3.0.186

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

@@ -0,0 +1,99 @@
+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/pisellSelectCustomerModal/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_antd = require("antd");
+var import_PlusCircle = __toESM(require("@pisell/icon/es/PlusCircle"));
+var import_XCircle = __toESM(require("@pisell/icon/es/XCircle"));
+var import_utils = require("@pisell/utils");
+var import_index = require("./index.less");
+var import_classnames = __toESM(require("classnames"));
+var CustomerCard = ({
+  onClickItem,
+  customer,
+  showIcon = true,
+  customIcon,
+  onRemove,
+  className
+}) => {
+  const username = (0, import_react.useMemo)(() => {
+    if (!customer) {
+      return "Walk-in";
+    }
+    const firstLastName = customer.first_name || customer.last_name ? `${customer.first_name} ${customer.last_name}` : "";
+    return customer.name || (customer.display_name || "").trim() || (customer.nickname || "").trim() || firstLastName.trim() || "";
+  }, [customer]);
+  const getAvatarName = (0, import_react.useMemo)(() => {
+    if (!username)
+      return "";
+    const parts = username.trim().split(/\s+/);
+    if (parts.length === 1) {
+      return parts[0].charAt(0);
+    }
+    return parts[0].charAt(0) + parts[1].charAt(0);
+  }, [username]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)("pisell-lowcode__customer_card", className),
+      onClick: () => {
+        onClickItem(customer);
+      }
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Avatar,
+      {
+        className: "pisell-lowcode__customer_card-avatar",
+        src: (customer == null ? void 0 : customer.cover) ? import_utils.image.ali(customer == null ? void 0 : customer.cover, 100) : void 0
+      },
+      getAvatarName
+    ),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__customer_card-info" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__customer_card-info-left" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__customer_card-info-name" }, username), !customer ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__customer_card-info-desc" }, import_utils.locales.getText("pisell2.text.leave-empty-for-walk-in")) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, (customer == null ? void 0 : customer.email) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__customer_card-info-email" }, customer == null ? void 0 : customer.email) : null, (customer == null ? void 0 : customer.phone) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__customer_card-info-phone" }, customer == null ? void 0 : customer.phone) : null)), showIcon ? /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: "pisell-lowcode__customer_card-info-right",
+        onClick: (e) => {
+          if (!customer) {
+            return;
+          }
+          e.preventDefault();
+          e.stopPropagation();
+          onRemove == null ? void 0 : onRemove();
+        }
+      },
+      customIcon ? customIcon : customer ? /* @__PURE__ */ import_react.default.createElement(import_XCircle.default, { className: "pisell-lowcode__customer_card-add-icon" }) : /* @__PURE__ */ import_react.default.createElement(import_PlusCircle.default, { className: "pisell-lowcode__customer_card-add-icon" })
+    ) : null)
+  );
+};
+var CustomerCard_default = CustomerCard;

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

@@ -0,0 +1,83 @@
+.pisell-lowcode__customer_card {
+  display: flex;
+  width: 100%;
+  padding: 20px 8px;
+  align-items: center;
+  gap: 16px;
+  border-radius: 8px;
+  border: 1px solid #D5D7DA;
+  background: var(--base-white, #FFF);
+  cursor: pointer;
+  position: relative;
+  margin-bottom: 0;
+
+  .pisell-lowcode__customer_card-avatar {
+    display: flex;
+    width: 48px;
+    height: 48px;
+    padding: 16px;
+    justify-content: center;
+    align-items: center;
+    border-radius: 200px;
+    background: var(--Badge-Blue_Container, #D1E3FF);
+    font-weight: 600;
+    color: #0B5FDB;
+  }
+
+  .pisell-lowcode__customer_card-avatar-icon {
+    font-size: 24px;
+    color: #0B5FDB;
+  }
+
+
+  .pisell-lowcode__customer_card-info {
+    flex: 1;
+    display: flex;
+    align-items: center;
+
+    .pisell-lowcode__customer_card-info-left {
+      flex: 1;
+      width: 0;
+
+      .pisell-lowcode__customer_card-info-name {
+        color: var(--gray-900, #101828);
+
+
+        font-size: 16px;
+        font-style: normal;
+        font-weight: 600;
+        line-height: 24px;
+      }
+
+      .pisell-lowcode__customer_card-info-desc {
+        color: var(--gray-400, #98A2B3);
+
+        font-size: 14px;
+        font-style: normal;
+        font-weight: 400;
+      }
+
+      .pisell-lowcode__customer_card-info-email,
+      .pisell-lowcode__customer_card-info-phone {
+        color: var(--gray-400, #98A2B3);
+
+        font-size: 14px;
+        font-style: normal;
+        font-weight: 400;
+      }
+    }
+
+    .pisell-lowcode__customer_card-info-right {
+      width: 40px;
+      height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      .pisell-lowcode__customer_card-add-icon {
+        font-size: 28px;
+        color: #475467;
+      }
+    }
+  }
+}

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/BirthdayField/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const DateSectionCom: ({ value, onChange, showTime, className, style, useSpace, format, itemStyle, }: any) => React.JSX.Element;
+export default DateSectionCom;

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/BirthdayField/index.js

@@ -0,0 +1,256 @@
+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/pisellSelectCustomerModal/RightPanel/Add/BirthdayField/index.tsx
+var BirthdayField_exports = {};
+__export(BirthdayField_exports, {
+  default: () => BirthdayField_default
+});
+module.exports = __toCommonJS(BirthdayField_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_debounce = __toESM(require("lodash/debounce"));
+var import_dayjs = __toESM(require("dayjs"));
+var import_utils = require("@pisell/utils");
+var { Option } = import_antd.Select;
+var getSelectInput = (id) => {
+  const input = document.getElementById(id);
+  if (input) {
+    return input;
+  }
+};
+var setSelectInputType = ({
+  input,
+  type
+}) => {
+  if (input) {
+    input.type = type;
+  }
+};
+var DateSectionCom = ({
+  value,
+  onChange,
+  showTime,
+  className = "",
+  style = {},
+  useSpace = true,
+  format,
+  itemStyle = {
+    width: 100
+  }
+}) => {
+  const currentYear = (0, import_dayjs.default)().year();
+  const locale = import_utils.locales.locale;
+  const dayRef = (0, import_react.useRef)(null);
+  const monthRef = (0, import_react.useRef)(null);
+  const yearRef = (0, import_react.useRef)(null);
+  const [date, setDate] = (0, import_react.useState)({
+    year: value ? (0, import_dayjs.default)(value).year() : null,
+    month: value ? (0, import_dayjs.default)(value).month() + 1 : null,
+    day: value ? (0, import_dayjs.default)(value).date() : null
+  });
+  const [dayOptions, setDayOptions] = (0, import_react.useState)([]);
+  const [monthOptions, setMonthOptions] = (0, import_react.useState)([]);
+  const [yearOptions, setYearOptions] = (0, import_react.useState)([]);
+  const localeMap = {
+    year: import_utils.locales.getText("pisell2.text.date-year-text"),
+    month: import_utils.locales.getText("pisell2.text.date-month-text"),
+    day: import_utils.locales.getText("pisell2.text.date-day-text")
+  };
+  (0, import_react.useEffect)(() => {
+    setDate({
+      year: value ? (0, import_dayjs.default)(value).year() : null,
+      month: value ? (0, import_dayjs.default)(value).month() + 1 : null,
+      day: value ? (0, import_dayjs.default)(value).date() : null
+    });
+  }, [value]);
+  (0, import_react.useEffect)(() => {
+    setMonthOptions(renderOptions("month", 1, 12));
+    setYearOptions(renderOptions("year", currentYear - 100, currentYear + 50));
+  }, []);
+  (0, import_react.useEffect)(() => {
+    setDayOptions(
+      renderOptions(
+        "day",
+        1,
+        date.month ? getDaysInMonth(date.year || currentYear, date.month) : 31
+      )
+    );
+  }, [date.month, date.year]);
+  const handleDateChange = (field, value2) => {
+    if (!value2) {
+      return;
+    }
+    let newDate = {
+      year: date.year,
+      month: date.month,
+      day: date.day,
+      [field]: value2
+    };
+    const foucsList = {
+      day: monthRef,
+      month: yearRef
+    };
+    if (field === "month" || field === "year") {
+      const daysInMonth = getDaysInMonth(
+        (newDate == null ? void 0 : newDate.year) || currentYear,
+        newDate == null ? void 0 : newDate.month
+      );
+      const newDay = (newDate == null ? void 0 : newDate.day) > daysInMonth ? daysInMonth : newDate.day;
+      newDate = {
+        ...newDate,
+        day: newDay
+      };
+    }
+    setDate(newDate);
+    if (foucsList[field]) {
+      foucsList[field].current.focus();
+    } else {
+      yearRef.current.blur();
+    }
+    const _format = format || "YYYY-MM-DD";
+    if (newDate.year && newDate.month && newDate.day) {
+      const _date = `${newDate.year}-${newDate.month.toString().padStart(2, "0")}-${newDate.day.toString().padStart(2, "0")}`;
+      onChange((0, import_dayjs.default)(_date).format(_format));
+    }
+  };
+  const getDaysInMonth = (year, month) => {
+    return (0, import_dayjs.default)(`${year}-${month}`, "YYYY-MM").daysInMonth();
+  };
+  const renderOptions = (field, start, end) => {
+    const options = [];
+    const _text = locale !== "en-US" && locale !== "en" ? localeMap[field] : "";
+    for (let i = start; i <= end; i++) {
+      options.push({
+        label: `${i}${_text}`,
+        value: i
+      });
+    }
+    return options;
+  };
+  const selectId = (0, import_react.useMemo)(() => {
+    return {
+      dayId: (0, import_utils.getUniqueId)("day"),
+      monthId: (0, import_utils.getUniqueId)("month"),
+      yearId: (0, import_utils.getUniqueId)("year")
+    };
+  }, []);
+  (0, import_react.useLayoutEffect)(() => {
+    setSelectInputType({
+      input: getSelectInput(selectId.dayId),
+      type: "number"
+    });
+    setSelectInputType({
+      input: getSelectInput(selectId.monthId),
+      type: "number"
+    });
+    setSelectInputType({
+      input: getSelectInput(selectId.yearId),
+      type: "number"
+    });
+  }, [selectId]);
+  const handleDateSearch = (0, import_react.useCallback)(
+    (0, import_debounce.default)((field, value2) => {
+      const dateOption = {
+        day: dayOptions,
+        month: monthOptions,
+        year: yearOptions
+      };
+      const _value = Number(value2);
+      const index = dateOption[field].findIndex((item) => {
+        return item.value === _value;
+      });
+      if (index !== -1) {
+        handleDateChange(field, _value);
+      } else {
+        handleDateChange(field, null);
+      }
+    }, 300),
+    [dayOptions, monthOptions, yearOptions, date]
+  );
+  const content = /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      id: selectId.dayId,
+      value: date.day,
+      placeholder: import_utils.locales.getText("pisell2.text.date-day-text"),
+      onChange: (value2) => handleDateChange("day", value2),
+      style: itemStyle,
+      showSearch: true,
+      onSearch: (value2) => {
+        handleDateSearch("day", value2);
+      },
+      ref: dayRef,
+      size: "large"
+    },
+    dayOptions.map((item) => {
+      return /* @__PURE__ */ import_react.default.createElement(Option, { key: item.value, value: item.value }, item.label);
+    })
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      id: selectId.monthId,
+      value: date.month,
+      placeholder: import_utils.locales.getText("pisell2.text.date-month-text"),
+      onChange: (value2) => handleDateChange("month", value2),
+      style: itemStyle,
+      showSearch: true,
+      onSearch: (value2) => {
+        handleDateSearch("month", value2);
+      },
+      ref: monthRef,
+      size: "large"
+    },
+    monthOptions.map((item) => {
+      return /* @__PURE__ */ import_react.default.createElement(Option, { key: item.value, value: item.value }, item.label);
+    })
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      id: selectId.yearId,
+      value: date.year,
+      placeholder: import_utils.locales.getText("pisell2.text.date-year-text"),
+      onChange: (value2) => handleDateChange("year", value2),
+      style: itemStyle,
+      showSearch: true,
+      onSearch: (value2) => {
+        handleDateSearch("year", value2);
+      },
+      ref: yearRef,
+      size: "large"
+    },
+    yearOptions.map((item) => {
+      return /* @__PURE__ */ import_react.default.createElement(Option, { key: item.value, value: item.value }, item.label);
+    })
+  ));
+  if (useSpace) {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { className: className || "", style: style || {} }, content);
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: className || "", style: style || {} }, content);
+};
+var BirthdayField_default = DateSectionCom;

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/GenderField/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const GenderField: (props: any) => React.JSX.Element;
+export default GenderField;

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/GenderField/index.js

@@ -0,0 +1,51 @@
+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/pisellSelectCustomerModal/RightPanel/Add/GenderField/index.tsx
+var GenderField_exports = {};
+__export(GenderField_exports, {
+  default: () => GenderField_default
+});
+module.exports = __toCommonJS(GenderField_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var GenderField = (props) => {
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      size: "large",
+      options: [
+        { label: import_utils.locales.getText("pisell2.text.gender.male"), value: "1" },
+        { label: import_utils.locales.getText("pisell2.text.gender.female"), value: "2" }
+      ],
+      ...props
+    }
+  );
+};
+var GenderField_default = GenderField;

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/PhoneField/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const PhoneField: ({ value, onChange }: any) => React.JSX.Element;
+export default PhoneField;

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/PhoneField/index.js

@@ -0,0 +1,81 @@
+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/pisellSelectCustomerModal/RightPanel/Add/PhoneField/index.tsx
+var PhoneField_exports = {};
+__export(PhoneField_exports, {
+  default: () => PhoneField_default
+});
+module.exports = __toCommonJS(PhoneField_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_ahooks = require("ahooks");
+var import_serve = require("./serve");
+var defaultValue = {
+  code: "+61",
+  phone: ""
+};
+var PhoneField = ({ value, onChange }) => {
+  const codes = (0, import_ahooks.useRequest)(import_serve.getCountries, {
+    manual: true
+  });
+  console.log("codes", codes.data);
+  (0, import_react.useEffect)(() => {
+    codes.run();
+  }, []);
+  const _onChange = (key, val) => {
+    onChange({ ...defaultValue, ...value, [key]: val });
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_antd.Space.Compact, { style: { width: "100%" } }, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      options: codes.data || [],
+      onChange: (val) => {
+        _onChange("code", val);
+      },
+      size: "large",
+      style: { flex: "0 0 100px" },
+      loading: codes.loading,
+      optionLabelProp: "value",
+      value: value == null ? void 0 : value.code,
+      dropdownMatchSelectWidth: false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Input,
+    {
+      type: "number",
+      value: value == null ? void 0 : value.phone,
+      size: "large",
+      style: { flex: 1 },
+      onChange: (e) => {
+        _onChange("phone", e.target.value);
+      }
+    }
+  ));
+};
+var PhoneField_default = PhoneField;

package/lib/components/pisellSelectCustomerModal/RightPanel/Add/PhoneField/serve.d.ts

@@ -0,0 +1,2 @@
+export declare const defaultCodes: any;
+export declare const getCountries: (params?: any) => Promise<any>;