import PersistentBottomSheet from "../../../../pro/PersistentBottomSheet/index.js";
import { AmountDetails } from "../../components/AmountDetails/index.js";
import { CartItems } from "../../components/CartItems/index.js";
import { Client } from "../../components/Client/index.js";
import { Contact } from "../../components/Contact/index.js";
import { OrderNote } from "../../components/OrderNote/index.js";
import { SaleOverview } from "../../components/SaleOverview/index.js";
import { useSaleDetailActions } from "../../hooks/saleDetailActions/index.js";
import React, { useState } from "react";
import { ButtonGroupPreview, Iconfont } from "@pisell/materials";
import classNames from "classnames";
import "./index.less";
//#region src/plus/saleDetail/tmpl/B/index.tsx
function SaleDetailTemplateBMain({ dataSource, moduleConfig }) {
	var _dataSource$sales$tem, _dataSource$sales$tem2;
	const hiddenModules = (moduleConfig === null || moduleConfig === void 0 ? void 0 : moduleConfig.hidden) || [];
	const showCustomer = !hiddenModules.includes("customer");
	const showContact = !hiddenModules.includes("contact");
	const showOrderNote = !hiddenModules.includes("orderNote");
	const showCartItems = !hiddenModules.includes("cartItems");
	const showScrollContent = showContact || showCartItems;
	return /* @__PURE__ */ React.createElement("main", { className: "pisell-sale-detail-main" }, showCustomer ? /* @__PURE__ */ React.createElement(Client, { dataSource: {
		customer: dataSource.customer,
		sales: dataSource.sales
	} }) : null, showOrderNote && ((_dataSource$sales$tem = dataSource.sales.tempOrder) === null || _dataSource$sales$tem === void 0 ? void 0 : _dataSource$sales$tem.note) ? /* @__PURE__ */ React.createElement(OrderNote, { dataSource: dataSource.sales.tempOrder.note }) : null, showScrollContent ? /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-scroll-content" }, showContact ? /* @__PURE__ */ React.createElement(Contact, { dataSource: (_dataSource$sales$tem2 = dataSource.sales.tempOrder) === null || _dataSource$sales$tem2 === void 0 ? void 0 : _dataSource$sales$tem2.contacts_info }) : null, showCartItems ? /* @__PURE__ */ React.createElement(CartItems, {
		dataSource: dataSource.cart,
		sales: dataSource.sales
	}) : null) : null);
}
function SaleDetailTemplateB({ dataSource, mobilePresentation, moduleConfig, renderType, variant }) {
	var _moduleConfig$amountD;
	const [mobileSheetOpen, setMobileSheetOpen] = useState(false);
	const hiddenModules = (moduleConfig === null || moduleConfig === void 0 ? void 0 : moduleConfig.hidden) || [];
	const showOverview = !hiddenModules.includes("overview");
	const showAmountDetails = !hiddenModules.includes("amountDetails");
	const showOrderActions = !hiddenModules.includes("orderActions");
	const isMobileBottomSheet = variant === "phone" && renderType === "current" && mobilePresentation === "bottomSheet";
	const actionButtonGroupList = useSaleDetailActions({
		dataSource,
		actions: [
			{
				name: "edit",
				row: 1,
				order: 10
			},
			{
				name: "print",
				row: 1,
				order: 20,
				items: [
					"print-product-voucher",
					"print-wristband",
					"print-receipts",
					"print-all"
				]
			},
			{
				name: "cancel",
				row: 1,
				order: 30
			},
			{
				name: "more",
				row: 2,
				order: 10,
				items: ["return", "refund"]
			},
			{
				name: "checkout",
				row: 2,
				order: 20
			}
		]
	});
	const showFooter = showAmountDetails || showOrderActions && actionButtonGroupList.length;
	const overviewContent = showOverview ? /* @__PURE__ */ React.createElement(SaleOverview, {
		className: "pisell-sale-detail-tmpl-overview",
		dataSource
	}) : null;
	const bodyContent = /* @__PURE__ */ React.createElement(React.Fragment, null, overviewContent, /* @__PURE__ */ React.createElement("main", { className: "pisell-sale-detail-tmpl-body" }, /* @__PURE__ */ React.createElement("section", { className: "pisell-sale-detail-tmpl-content" }, /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-inline-layout" }, /* @__PURE__ */ React.createElement(SaleDetailTemplateBMain, {
		dataSource,
		moduleConfig
	})))));
	const footerContent = showFooter ? /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-footer" }, showAmountDetails ? /* @__PURE__ */ React.createElement(AmountDetails, {
		defaultExpanded: moduleConfig === null || moduleConfig === void 0 || (_moduleConfig$amountD = moduleConfig.amountDetails) === null || _moduleConfig$amountD === void 0 ? void 0 : _moduleConfig$amountD.defaultExpanded,
		dataSource: {
			sales: dataSource.sales,
			summary: dataSource.summary
		}
	}) : null, showOrderActions && actionButtonGroupList.length ? /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-button-actions" }, /* @__PURE__ */ React.createElement(ButtonGroupPreview, { buttonGroupList: actionButtonGroupList })) : null) : null;
	if (isMobileBottomSheet) return /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-tmpl-b pisell-sale-detail-tmpl-b--mobile-sheet" }, /* @__PURE__ */ React.createElement(PersistentBottomSheet, {
		open: mobileSheetOpen,
		onOpenChange: setMobileSheetOpen,
		maxHeight: "95dvh",
		mask: true,
		maskClosable: true,
		destroyOnHidden: false,
		className: classNames("pisell-sale-detail-mobile-sheet", { "pisell-sale-detail-mobile-sheet--open": mobileSheetOpen }),
		header: /* @__PURE__ */ React.createElement("button", {
			type: "button",
			className: classNames("pisell-sale-detail-mobile-sheet__handler", { "pisell-sale-detail-mobile-sheet__handler--open": mobileSheetOpen }),
			"aria-expanded": mobileSheetOpen,
			onClick: () => setMobileSheetOpen((open) => !open)
		}, /* @__PURE__ */ React.createElement("span", { className: "pisell-sale-detail-mobile-sheet__handler-icon" }, /* @__PURE__ */ React.createElement(Iconfont, { type: "pisell2-chevron-down-double" }))),
		classNames: {
			body: classNames("pisell-sale-detail-mobile-sheet__body", { "pisell-sale-detail-mobile-sheet__body--open": mobileSheetOpen }),
			footer: "pisell-sale-detail-mobile-sheet__footer"
		},
		footer: footerContent,
		zIndex: 100
	}, bodyContent));
	return /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-tmpl-b" }, overviewContent, /* @__PURE__ */ React.createElement("main", { className: "pisell-sale-detail-tmpl-body" }, /* @__PURE__ */ React.createElement("section", { className: "pisell-sale-detail-tmpl-content" }, /* @__PURE__ */ React.createElement("div", { className: "pisell-sale-detail-inline-layout" }, /* @__PURE__ */ React.createElement(SaleDetailTemplateBMain, {
		dataSource,
		moduleConfig
	}), footerContent))));
}
//#endregion
export { SaleDetailTemplateB };
