sme-pos-package 1.0.14 → 1.0.15

package/src/components/session-management/close-session-modal/draft-orders-confirm.tsx

@@ -1,53 +0,0 @@
-import { QUERY_KEYS } from "@constants/query.constant";
-import { useQueryParams } from "@hooks/common/use-query-params";
-import { useOrder } from "@provider/pos-provider/order-provider";
-import { useSessionStore } from "@store/session";
-import { useMemo } from "react";
-import { useTranslation } from "react-i18next";
-import Actions from "./actions";
-import CloseSessionModalContainer from "./container";
-
-export const DraftOrdersConfirm = () => {
-  const { setStep } = useSessionStore();
-  const { t } = useTranslation();
-  const { removeParam } = useQueryParams();
-  const { draftOrders } = useOrder();
-  const { cancelOrder } = useOrder();
-
-  const numberOfUnpaidOrders = useMemo(() => {
-    return draftOrders.length;
-  }, [draftOrders]);
-
-  const onContinue = async () => {
-    await cancelOrder.mutateAsync(draftOrders.map((order) => Number(order.id)));
-    setStep(3);
-  };
-
-  const handleClose = () => {
-    setStep(0);
-    removeParam([QUERY_KEYS.OPEN]);
-  };
-
-  return (
-    <CloseSessionModalContainer
-      isOpen={true}
-      onClose={handleClose}
-      title={t("close_session")}
-    >
-      <div className="flex flex-col h-full ">
-        <p className="text-sm leading-5 overflow-auto flex-1 tracking-[-0.12px] text-text-secondary">
-          {t("orders_left")}{" "}
-          <span className="font-bold tracking-[-0.2px] text-text-primary">
-            {numberOfUnpaidOrders.toString().padStart(2, "0")}{" "}
-            {t("orders_not_paid")}
-          </span>{" "}
-          {t("orders_left_content")}
-          <br /> <br />
-          <span>{t("confirm_sure")}</span>
-        </p>
-
-        <Actions onContinue={onContinue} buttonLabel={t("yes_button")} />
-      </div>
-    </CloseSessionModalContainer>
-  );
-};

package/src/components/session-management/close-session-modal/draft-orders-summary.tsx

@@ -1,82 +0,0 @@
-import { QUERY_KEYS } from "@constants/query.constant";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useQueryParams } from "@hooks/common/use-query-params";
-import { useSessionStore } from "@store/session";
-import { useCloseSessionStore } from "@store/states/close-session.state";
-import { useForm } from "react-hook-form";
-import { useTranslation } from "react-i18next";
-import { z } from "zod";
-import Actions from "./actions";
-import CloseSessionModalContainer from "./container";
-import SessionSummary from "./session-summary";
-
-const schema = z.object({
-  cashCount: z.string().min(1, "Cash count is required"),
-  note: z.string(),
-});
-
-export const DraftOrdersSummary = () => {
-  const {
-    handleSubmit,
-    register,
-    watch,
-    formState: { errors },
-    setValue,
-  } = useForm({
-    defaultValues: {
-      cashCount: "",
-      note: "",
-    },
-    mode: "onChange",
-    resolver: zodResolver(schema),
-  });
-
-  const { setStep, setSessionConfirmParams } = useSessionStore();
-  const { setCloseSessionInfo } = useCloseSessionStore();
-  const { t } = useTranslation();
-  const { removeParam } = useQueryParams();
-
-  const onSubmit = handleSubmit((data) => {
-    setSessionConfirmParams({
-      cashCount: Number(data.cashCount),
-      note: data.note,
-    });
-    setCloseSessionInfo({
-      cashCount: Number(data.cashCount),
-      difference: 0,
-    });
-    setStep(4);
-  });
-
-  const handleClose = () => {
-    setStep(0);
-    removeParam([QUERY_KEYS.OPEN]);
-  };
-
-  return (
-    <CloseSessionModalContainer
-      isOpen={true}
-      onClose={handleClose}
-      title={t("close_session")}
-    >
-      <form onSubmit={onSubmit} className="flex flex-col h-full">
-        <SessionSummary
-          register={register}
-          errorMessage={errors.cashCount?.message}
-          cashCount={Number(watch("cashCount"))}
-          watch={watch}
-          setValue={setValue}
-        />
-
-        <Actions
-          onContinue={() => onSubmit()}
-          buttonLabel={t("yes_button")}
-          isDisabled={
-            errors.cashCount?.message !== undefined || watch("cashCount") === ""
-          }
-          className="flex items-center gap-2 w-full pt-6"
-        />
-      </form>
-    </CloseSessionModalContainer>
-  );
-};

package/src/components/session-management/close-session-modal/draft-orders.tsx

@@ -1,34 +0,0 @@
-import { QUERY_KEYS } from "@constants/query.constant";
-import { useQueryParams } from "@hooks/common/use-query-params";
-import { useSessionStore } from "@store/session";
-import { useTranslation } from "react-i18next";
-import Actions from "./actions";
-import CloseSessionModalContainer from "./container";
-import { OrdersInDraft } from "./order";
-
-export const DraftOrders = () => {
-  const { setStep } = useSessionStore();
-  const { t } = useTranslation();
-  const { removeParam } = useQueryParams();
-
-  const onContinue = () => setStep(2);
-
-  const handleClose = () => {
-    setStep(0);
-    removeParam([QUERY_KEYS.OPEN]);
-  };
-
-  return (
-    <CloseSessionModalContainer
-      isOpen={true}
-      onClose={handleClose}
-      title={t("close_session")}
-    >
-      <div className="flex flex-col h-full">
-        <OrdersInDraft />
-
-        <Actions onContinue={onContinue} buttonLabel={t("continue")} />
-      </div>
-    </CloseSessionModalContainer>
-  );
-};

package/src/components/session-management/close-session-modal/index.tsx

@@ -1,35 +0,0 @@
-import { LoadDataModel, useSale } from "@provider/pos-provider/sale-provider"
-import { useSessionStore } from "@store/session"
-import { CloseSessionConfirm } from "./close-session-confirm"
-import { DraftOrders } from "./draft-orders"
-import { DraftOrdersConfirm } from "./draft-orders-confirm"
-import { DraftOrdersSummary } from "./draft-orders-summary"
-
-type TProps = {
-  onBack: () => void
-}
-
-const CloseSessionModal = () => {
-  const { step } = useSessionStore()
-  const { getData } = useSale()
-  const posName = getData(LoadDataModel.POS_CONFIG)?.[0]?.name
-
-  const onShowModal = () => {
-    switch (step) {
-      case 1:
-        return <DraftOrders />
-      case 2:
-        return <DraftOrdersConfirm />
-      case 3:
-        return <DraftOrdersSummary />
-      case 4:
-        return <CloseSessionConfirm posName={posName} />
-      default:
-        return <></>
-    }
-  }
-
-  return onShowModal()
-}
-
-export default CloseSessionModal

package/src/components/session-management/close-session-modal/order/index.ts

@@ -1 +0,0 @@
-export { default as OrdersInDraft } from "./orders-in-draft";

package/src/components/session-management/close-session-modal/order/order-line.tsx

@@ -1,64 +0,0 @@
-import { FileListIcon } from "@assets/icons/order-icon";
-import { VNCurrency } from "@components/common/header";
-import { ORDER_STATE } from "@constants/order-state";
-import { TBasicOrder } from "@type/order";
-import { dd_mm_yyyy, hh_mm } from "@utils/functions";
-import { useTranslation } from "react-i18next";
-
-type TProps = {
-  order: TBasicOrder;
-};
-
-const OrderLine = (props: TProps) => {
-  const { order } = props;
-  const { t } = useTranslation();
-
-  return (
-    <div className="rounded-2xl border border-stroke-default bg-white flex items-center gap-3 p-4">
-      <div className="min-w-14 aspect-square rounded-lg bg-neutral-100-96 flex items-center justify-center">
-        <FileListIcon />
-      </div>
-
-      <div className="flex flex-col gap-2 w-full justify-center">
-        <div className="flex items-center justify-between">
-          <p className="font-semibold leading-6 text-text-primary tracking-[-0.16px]">
-            #{order.id}
-          </p>
-          <div
-            className={`rounded border ${
-              order.state === ORDER_STATE.IN_PAID
-                ? "border-stroke-warning bg-[#FFF5DC]"
-                : "border-colored-success bg-success"
-            }  py-1 px-2`}
-          >
-            <p
-              className={`text-xs font-medium leading-4 ${
-                order.state === ORDER_STATE.NEW
-                  ? "text-text-colored-warning"
-                  : "text-colored-success"
-              }`}
-            >
-              {order.state === ORDER_STATE.NEW
-                ? `${t(ORDER_STATE.NEW)}`
-                : `${t(ORDER_STATE.IN_PAID)}`}
-            </p>
-          </div>
-        </div>
-
-        <div className="flex items-center justify-between">
-          <p className="text-text-secondary flex-1 text-sm leading-5 tracking-[-0.12px]">
-            {hh_mm(order.create_date) + " • " + dd_mm_yyyy(order.create_date)}
-          </p>
-          <p className="font-semibold text-end flex-1 line-clamp-1 leading-6 tracking-[-0.24px] text-text-primary">
-            {(order.amount_total + order.amount_tax).toLocaleString("vi-VN", {
-              maximumFractionDigits: 0,
-            })}{" "}
-            {VNCurrency}
-          </p>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default OrderLine;

package/src/components/session-management/close-session-modal/order/orders-in-draft.tsx

@@ -1,31 +0,0 @@
-import { useCloseSession } from "@provider/pos-provider/close-session-provider";
-import { useTranslation } from "react-i18next";
-import OrderLine from "./order-line";
-
-const OrdersInDraft = () => {
-  const { draftInPaidOrders } = useCloseSession();
-  const { t } = useTranslation();
-
-  if (!draftInPaidOrders.length) return null;
-
-  return (
-    <div className="flex flex-col flex-1 gap-6 overflow-auto justify-start">
-      <div className="flex flex-col gap-1">
-        <p className="text-lg font-semibold leading-[26px] text-text-primary">
-          {t("number_orders_left", {
-            numberOfOrders: draftInPaidOrders.length,
-          })}
-        </p>
-        <p className="text-sm leading-5 tracking-[-0.12px] text-text-secondary">
-          {t("confirm_close")}
-        </p>
-      </div>
-
-      {draftInPaidOrders.map((order) => (
-        <OrderLine key={order.id} order={order} />
-      ))}
-    </div>
-  );
-};
-
-export default OrdersInDraft;

package/src/components/session-management/close-session-modal/session-summary.tsx

@@ -1,165 +0,0 @@
-import { IcBack } from "@assets/icons/common";
-import { VNCurrency } from "@components/common/header";
-import TextArea from "@components/common/input/text-area";
-import { formatCurrency, unFormatCurrency } from "@utils/functions";
-import { generateCloseSessionData } from "@utils/pos/session";
-import { useState } from "react";
-import {
-  UseFormRegister,
-  UseFormSetValue,
-  UseFormWatch,
-} from "react-hook-form";
-import { useTranslation } from "react-i18next";
-import { toast } from "react-toastify";
-import { useCloseSession } from "@provider/pos-provider/close-session-provider";
-
-type Props = {
-  register: UseFormRegister<{ cashCount: string; note: string }>;
-  watch: UseFormWatch<{
-    cashCount: string;
-    note: string;
-  }>;
-  setValue: UseFormSetValue<{
-    cashCount: string;
-    note: string;
-  }>;
-  errorMessage?: string;
-  cashCount: number;
-};
-
-const SessionSummary = ({
-  register,
-  errorMessage,
-  watch,
-  setValue,
-  cashCount,
-}: Props) => {
-  const {
-    getDataCloseSessionQuery: { data },
-  } = useCloseSession();
-
-  const closeSessionSummary = generateCloseSessionData(
-    data as TSessionData,
-    cashCount
-  );
-
-  const handleCashChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const raw = unFormatCurrency(e.target.value);
-    if (!/^\d*$/.test(raw)) return;
-    setValue("cashCount", raw);
-  };
-
-  const { t } = useTranslation();
-
-  return (
-    <div className="flex flex-col flex-1 overflow-auto gap-3 hide-scrollbar">
-      {closeSessionSummary.map((item, index) => (
-        <SummaryCard key={index} item={item} />
-      ))}
-
-      <div className="flex flex-col gap-4 bg-white p-4 border border-stroke-disabled rounded-xl">
-        <div className="flex flex-col gap-[6px]">
-          <p className="text-text-primary text-sm font-medium leading-5 tracking-[-0.12px]">
-            {t("cash_count")}
-            <span className="text-state-error-base"> *</span>
-          </p>
-
-          <input
-            type="text"
-            inputMode="numeric"
-            value={formatCurrency(cashCount)}
-            onChange={handleCashChange}
-            placeholder="0"
-            className={`w-full px-3 py-2 border ${
-              errorMessage ? "border-state-error-base" : "border-stroke-default"
-            } rounded-md text-sm`}
-          />
-
-          {errorMessage && (
-            <p className="text-state-error-base text-xs">{errorMessage}</p>
-          )}
-        </div>
-
-        <TextArea
-          title={t("note")}
-          register={register("note")}
-          placeholder={t("close_session_note")}
-        />
-      </div>
-    </div>
-  );
-};
-
-export default SessionSummary;
-
-const SummaryCard = ({ item }: { item: TCloseSessionItemProps }) => {
-  const { title, subItems, price } = item;
-  const { t } = useTranslation();
-  const [showContent, setShowContent] = useState(true);
-
-  return (
-    <div
-      style={{
-        boxShadow: "0 2px 4px 0 rgba(27, 28, 29, 0.04)",
-      }}
-      className="rounded-xl border border-stroke-disabled bg-white"
-    >
-      {/* title */}
-      <div
-        onClick={() => setShowContent(!showContent)}
-        className="flex cursor-pointer items-center justify-between p-3"
-      >
-        <div className="flex items-center justify-center gap-2">
-          <item.icon />
-
-          <span className="text-sm font-semibold leading-4 text-text-primary">
-            {t(`${title}` as any)}
-          </span>
-        </div>
-
-        <div className="flex items-center justify-center gap-1">
-          <span className="space-x-1 text-right text-sm font-semibold tracking-[-0.12px] text-strong-950">
-            {price.toLocaleString()}{" "}
-            <span className="text-stroke-soft-400">{VNCurrency}</span>
-          </span>
-
-          <div className={`${showContent ? "" : "rotate-180"}`}>
-            <IcBack />
-          </div>
-        </div>
-      </div>
-
-      {/* content */}
-      {showContent && (
-        <div className="overflow-hidden border-t border-stroke-disabled p-3">
-          {subItems.map((item, index) => (
-            <div key={index} className="flex items-center justify-between py-1">
-              <span className="text-xs font-medium leading-4 text-text-secondary">
-                {t(`${item.title}` as any)}
-              </span>
-
-              <span className="space-x-1 text-right text-xs leading-4 font-semibold tracking-[-0.12px] text-strong-950">
-                {item.price.toLocaleString()}{" "}
-                <span className="text-tertiary">{VNCurrency}</span>
-              </span>
-            </div>
-          ))}
-
-          {item.title.toLowerCase().includes("card") && (
-            <div
-              onClick={() => toast.success("Coming soon")}
-              className="w-full flex items-center justify-center py-[2px]"
-            >
-              <div className="flex items-center justify-center gap-4">
-                <div className="w-5 h-5 rounded border-[1.5px] border-stroke-disabled bg-white" />
-                <p className="text-sm font-medium text-text-primary leading-5 tracking-[-0.12px]">
-                  {t("pos_auto_close_session")}
-                </p>
-              </div>
-            </div>
-          )}
-        </div>
-      )}
-    </div>
-  );
-};

package/src/components/session-management/index.ts

@@ -1 +0,0 @@
-export * from "./close-session-modal";

package/src/components/session-management/open-shift/index.tsx

@@ -1,172 +0,0 @@
-import ButtonAction from "@components/common/button-action";
-import ModalZoom from "@components/common/modal/modal-zoom";
-import { QUERY_KEYS } from "@constants/query.constant";
-import POSPath from "@constants/routes.constants";
-import useSessionProvider from "@provider/use-session-provider";
-import { formatCurrency } from "@utils/functions";
-import { t } from "i18next";
-import { useMemo, useState } from "react";
-import { FormProvider } from "react-hook-form";
-import { useNavigate } from "react-router-dom";
-
-type RecordType = Record<string, any>;
-
-type POSStatus =
-  | false
-  | "opened"
-  | "closed"
-  | "opening_control"
-  | "closing_control";
-
-type TProps = {
-  openModal: boolean;
-  setOpenModal: (val: boolean) => void;
-  methods: any;
-  row: any;
-  record: RecordType;
-};
-
-const OpenSessionModal = (props: TProps) => {
-  const { openModal, setOpenModal, methods, row, record } = props;
-  const { openSession, setOpeningCashBox } = useSessionProvider();
-  const [money, setMoney] = useState("");
-  const [loading, setLoading] = useState(false);
-  const data = useMemo(() => {
-    return {
-      current_session_id: record["current_session_id"]?.id ?? "",
-      record_id: record?.id as number,
-      current_session_state: record["current_session_state"] as POSStatus,
-      module_pos_restaurant: record["module_pos_restaurant"] as boolean,
-      name: record.name as string,
-      id: record.id as number,
-      cash_control: record.cash_control as boolean,
-    };
-  }, [record]);
-  const onClose = () => props.setOpenModal(false);
-
-  const navigate = useNavigate();
-  const handleOpeningCashBoxSuccess = (sessionId: number) => {
-    onClose();
-    if (data.module_pos_restaurant)
-      return navigate(
-        `${POSPath.TABLES}?${QUERY_KEYS.POS_ID}=${data.id}&${QUERY_KEYS.SESSION_ID}=${sessionId}`
-      );
-    // return `/${PosPaths.MANAGEMENT_TABLE}?${QUERY_KEYS.POS_ID}=${data.id}&${QUERY_KEYS.SESSION_ID}=${sessionId}`;
-    return navigate(
-      `${POSPath.MENUS}?${QUERY_KEYS.POS_ID}=${data.id}&${QUERY_KEYS.SESSION_ID}=${sessionId}`
-    );
-    // else return toast.info("Đang phát triển");
-  };
-
-  const onSetOpeningCashBox = async (
-    cashBoxValue: number,
-    sessionId: number
-  ) => {
-    try {
-      await setOpeningCashBox.mutateAsync(
-        {
-          cashBoxValue,
-          sessionId: Number(sessionId),
-        },
-        {
-          onSuccess: () => {
-            handleOpeningCashBoxSuccess(sessionId);
-          },
-        }
-      );
-    } catch (error) {
-      console.error("Error setting opening cash box:", error);
-    }
-  };
-
-  const handleOpenSession = async () => {
-    setLoading(true);
-    try {
-      if (data.current_session_state == "opening_control") {
-        await onSetOpeningCashBox(
-          Number(money),
-          Number(data.current_session_id)
-        );
-      } else {
-        const res = await openSession.mutateAsync(Number(data.record_id));
-        const sessionIdNew = Object.keys(Object.fromEntries(res as any));
-        await onSetOpeningCashBox(Number(money), Number(sessionIdNew[0]));
-      }
-    } catch (error) {
-      console.error("Error opening session:", error);
-    } finally {
-      setLoading(false);
-    }
-  };
-  const handleAmountChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const rawValue = e.target.value.replace(/\,/g, "");
-    if (!/^\d*$/.test(rawValue)) return;
-
-    setMoney(rawValue);
-  };
-  return (
-    <ModalZoom isOpen={openModal} onClose={onClose} className="">
-      <FormProvider {...methods}>
-        <div className="flex flex-col gap-6  border-b border-[--stroke-default] w-[500px] p-6 bg-white">
-          <div className="p-3 flex gap-5 items-center">
-            <img
-              src="/assets/images/cashier.svg"
-              alt="POS Icon"
-              className="size-12"
-            />
-            <p className="text-base text-[#0E121B] font-semibold">
-              {row["name"]}
-            </p>
-          </div>
-          <div className="flex flex-col gap-[6px]">
-            <p className="text-sm font-medium">
-              {t("starting_cash_float")}{" "}
-              <span className="text-[--color-error]">*</span>
-            </p>
-
-            <input
-              type="text"
-              value={formatCurrency(money)}
-              onChange={handleAmountChange}
-              onWheel={(e) => e.currentTarget.blur()}
-              className="border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-1 focus:ring-gray-400 text-sm"
-              placeholder="0"
-              inputMode="numeric"
-            />
-          </div>
-          {/* <div className="flex flex-col gap-[6px]">
-            <p className="text-sm font-medium">Lưu ý</p>
-            <TextAreaField
-              {...{
-                defaultValue: "",
-                string: "Lưu ý ",
-                readOnly: false,
-                methods: methods,
-                isForm: true,
-                placeholder: "Lưu ý khi mở ca",
-                name: "note",
-              }}
-            />
-          </div> */}
-        </div>
-        <p className="p-4 flex justify-end gap-4 mt-auto">
-          <ButtonAction
-            onClick={() => setOpenModal(false)}
-            className="h-[36px] button-secondary"
-          >
-            {t("cancel_button")}
-          </ButtonAction>
-          <ButtonAction
-            disabled={!money || loading}
-            onClick={handleOpenSession}
-            className="h-[36px] button-primary"
-          >
-            {t("open_session")}
-          </ButtonAction>
-        </p>
-      </FormProvider>
-    </ModalZoom>
-  );
-};
-
-export default OpenSessionModal;

package/src/constants/api/index.ts

@@ -1 +0,0 @@
-export const FIND_PARTNER_CODE = "walk_in_customer";

package/src/constants/headers.constant.tsx

@@ -1,24 +0,0 @@
-import { IcMenu } from "@assets/icons/order-icon";
-import { IcOrderList, IcTable } from "@assets/icons/pos-icon";
-import POSPath from "./routes.constants";
-
-export const headerTabs = [
-  {
-    id: 0,
-    name: "Danh sách bàn",
-    icon: <IcTable />,
-    path: POSPath.TABLES,
-  },
-  {
-    id: 1,
-    name: "Thực đơn",
-    icon: <IcMenu />,
-    path: POSPath.MENUS,
-  },
-  {
-    id: 2,
-    name: "Đơn hàng",
-    icon: <IcOrderList />,
-    path: POSPath.ORDERS,
-  },
-];

package/src/constants/index.ts

@@ -1 +0,0 @@
-export { default as POSPath } from "./routes.constants";