79 lines
2.4 KiB
TypeScript
79 lines
2.4 KiB
TypeScript
import NextIcon from "components/Icons/NextIcon";
|
|
import InvoiceIcon from "components/Icons/order/InvoiceIcon";
|
|
import ProInputCard from "components/ProInputCard/ProInputCard.tsx";
|
|
import ProText from "components/ProText";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useAppSelector } from "redux/hooks";
|
|
import { selectCart } from "features/order/orderSlice";
|
|
import { useLocation, useNavigate, useParams } from "react-router-dom";
|
|
import { useGetOrderDetailsQuery } from "redux/api/others";
|
|
import BackIcon from "components/Icons/BackIcon";
|
|
|
|
export default function BriefMenuCard() {
|
|
const { t } = useTranslation();
|
|
const { items } = useAppSelector(selectCart);
|
|
const { subdomain, orderId } = useParams();
|
|
const navigate = useNavigate();
|
|
const location = useLocation();
|
|
const { data: orderDetails } = useGetOrderDetailsQuery(
|
|
{
|
|
orderID: orderId || "",
|
|
restaurantID: localStorage.getItem("restaurantID") || "",
|
|
},
|
|
{
|
|
skip: !orderId,
|
|
// return it t0 60000 after finish testing
|
|
},
|
|
);
|
|
const totalItems = items.length || orderDetails?.orderItems.length;
|
|
const { isRTL } = useAppSelector((state) => state.locale);
|
|
|
|
return (
|
|
<>
|
|
<ProInputCard
|
|
title={t("checkout.orderSummary")}
|
|
dividerStyle={{ margin: "3px 0 16px 0" }}
|
|
>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
justifyContent: "space-between",
|
|
}}
|
|
onClick={() => {
|
|
if (orderId && location.pathname.includes("/order/")) {
|
|
navigate(`/${subdomain}/order/details/${orderId}`);
|
|
} else {
|
|
navigate(`/${subdomain}/cart`);
|
|
}
|
|
}}
|
|
>
|
|
<ProText
|
|
style={{
|
|
fontWeight: 400,
|
|
fontStyle: "Regular",
|
|
fontSize: 12,
|
|
lineHeight: "140%",
|
|
letterSpacing: "0%",
|
|
color: "#777580",
|
|
cursor: "pointer",
|
|
}}
|
|
>
|
|
<span
|
|
style={{
|
|
[isRTL ? "marginLeft" : "marginRight"]: 5,
|
|
position: "relative",
|
|
top: 3.5,
|
|
}}
|
|
>
|
|
<InvoiceIcon />
|
|
</span>
|
|
{t("checkout.viewOrder")} ( {totalItems} {t("cart.items")} )
|
|
</ProText>
|
|
{isRTL ? <BackIcon /> : <NextIcon />}
|
|
</div>
|
|
</ProInputCard>
|
|
</>
|
|
);
|
|
}
|