import React, { useMemo } from 'react';
import classNames from 'classnames';
import { AmountDetails, CartActions, Client, Contact, PromotionAlert, SaleQrButton } from "../../components";
import { CartItems } from "../../components/CartItems/Editable";
import { DetailActions, TEMPLATE_A_ACTIONS } from "../../components/DetailActions";
import { MobileSheetFrame } from "../../shared";
import "./index.less";
import { useMemoizedFn } from 'ahooks';
function SaleDetailTemplateAMain(_ref) {
  var _context$booking, _bookingConfig$config, _context$cart3, _context$cart4, _context$sales, _context$sales2, _context$sales$tempOr2, _moduleConfig$cartIte2;
  var context = _ref.context,
    moduleConfig = _ref.moduleConfig;
  var bookingConfig = (_context$booking = context.booking) === null || _context$booking === void 0 ? void 0 : _context$booking.getBookingConfig();
  var _showContactFromConfig = bookingConfig === null || bookingConfig === void 0 || (_bookingConfig$config = bookingConfig.config) === null || _bookingConfig$config === void 0 || (_bookingConfig$config = _bookingConfig$config.cart_settings_tab) === null || _bookingConfig$config === void 0 || (_bookingConfig$config = _bookingConfig$config.display_contact_info) === null || _bookingConfig$config === void 0 ? void 0 : _bookingConfig$config.show_contact_info;
  var hiddenModules = (moduleConfig === null || moduleConfig === void 0 ? void 0 : moduleConfig.hidden) || [];
  var showCustomer = !hiddenModules.includes('customer');
  var showContact = !hiddenModules.includes('contact') && !!_showContactFromConfig;
  var showCartItems = !hiddenModules.includes('cartItems');
  var showCartActions = !hiddenModules.includes('cartActions');
  var showPromotionAlert = !hiddenModules.includes('promotionAlert');
  var hasCartItems = useMemo(function () {
    var _context$cart, _context$cart2;
    return Boolean((_context$cart = context.cart) === null || _context$cart === void 0 || (_context$cart = _context$cart.bookings) === null || _context$cart === void 0 ? void 0 : _context$cart.length) || Boolean((_context$cart2 = context.cart) === null || _context$cart2 === void 0 || (_context$cart2 = _context$cart2.items) === null || _context$cart2 === void 0 ? void 0 : _context$cart2.length);
  }, [(_context$cart3 = context.cart) === null || _context$cart3 === void 0 || (_context$cart3 = _context$cart3.bookings) === null || _context$cart3 === void 0 ? void 0 : _context$cart3.length, (_context$cart4 = context.cart) === null || _context$cart4 === void 0 || (_context$cart4 = _context$cart4.items) === null || _context$cart4 === void 0 ? void 0 : _context$cart4.length]);
  var clientContext = useMemo(function () {
    return {
      customer: context.customer,
      sales: context.sales
    };
  }, [context.customer, (_context$sales = context.sales) === null || _context$sales === void 0 ? void 0 : _context$sales.setContactsInfo]);
  var saleQrButtonClick = useMemoizedFn(function () {
    context.sales.activateCamera();
  });
  var clientEntryContent = useMemo(function () {
    return /*#__PURE__*/React.createElement("div", {
      className: "pisell-sale-detail-client-entry"
    }, /*#__PURE__*/React.createElement(Client, {
      context: clientContext,
      isShowAvatar: true
    }), /*#__PURE__*/React.createElement(SaleQrButton, {
      onClick: saleQrButtonClick
    }));
  }, [clientContext]);
  var contactContext = useMemo(function () {
    return {
      sales: context.sales
    };
  }, [(_context$sales2 = context.sales) === null || _context$sales2 === void 0 ? void 0 : _context$sales2.setContactsInfo]);
  var contactContent = useMemo(function () {
    var _context$sales$tempOr;
    return /*#__PURE__*/React.createElement(Contact, {
      dataSource: (_context$sales$tempOr = context.sales.tempOrder) === null || _context$sales$tempOr === void 0 ? void 0 : _context$sales$tempOr.contacts_info,
      context: contactContext,
      showAction: true,
      showEmpty: true
    });
  }, [(_context$sales$tempOr2 = context.sales.tempOrder) === null || _context$sales$tempOr2 === void 0 ? void 0 : _context$sales$tempOr2.contacts_info, contactContext]);
  var promotionAlertContext = useMemo(function () {
    return {
      cart: context.cart,
      sales: context.sales
    };
  }, [context.cart, context.sales]);
  var cartActionsContext = useMemo(function () {
    return {
      cart: context.cart,
      sales: context.sales,
      summary: context.summary
    };
  }, [context.cart, context.sales, context.summary]);
  var cartItemsContext = useMemo(function () {
    return {
      cart: context.cart,
      sales: context.sales,
      booking: context.booking
    };
  }, [context.cart, context.sales, context.booking]);
  var CartItemsInteractionPolicy = useMemo(function () {
    return {
      cardAction: 'edit',
      disabledEdit: true,
      isShowDelete: true,
      isShowRightActions: true
    };
  }, []);
  var cartItemContent = useMemo(function () {
    var _moduleConfig$cartIte;
    return /*#__PURE__*/React.createElement("div", {
      className: "pisell-sale-detail-cart-scroll-panel"
    }, /*#__PURE__*/React.createElement("div", {
      className: "pisell-sale-detail-scroll-content"
    }, /*#__PURE__*/React.createElement(CartItems, {
      context: cartItemsContext,
      layout: moduleConfig === null || moduleConfig === void 0 || (_moduleConfig$cartIte = moduleConfig.cartItems) === null || _moduleConfig$cartIte === void 0 ? void 0 : _moduleConfig$cartIte.layout,
      interactionPolicy: CartItemsInteractionPolicy,
      showEmpty: true
    })), showPromotionAlert ? /*#__PURE__*/React.createElement(PromotionAlert, {
      context: promotionAlertContext
    }) : null);
  }, [cartItemsContext, moduleConfig === null || moduleConfig === void 0 || (_moduleConfig$cartIte2 = moduleConfig.cartItems) === null || _moduleConfig$cartIte2 === void 0 ? void 0 : _moduleConfig$cartIte2.layout, CartItemsInteractionPolicy, promotionAlertContext]);
  var cartActionsContent = useMemo(function () {
    return /*#__PURE__*/React.createElement(CartActions, {
      context: cartActionsContext,
      hasCartItems: hasCartItems
    });
  }, [cartActionsContext, hasCartItems]);
  return /*#__PURE__*/React.createElement("main", {
    className: "pisell-sale-detail-main"
  }, showCustomer ? clientEntryContent : null, showContact ? contactContent : null, showCartItems ? cartItemContent : null, showCartActions ? cartActionsContent : null);
}
function SaleDetailTemplateAFooter(_ref2) {
  var amountDetailsDefaultExpanded = _ref2.amountDetailsDefaultExpanded,
    context = _ref2.context,
    onOrderComplete = _ref2.onOrderComplete,
    _ref2$orderActions = _ref2.orderActions,
    orderActions = _ref2$orderActions === void 0 ? TEMPLATE_A_ACTIONS : _ref2$orderActions,
    showAmountDetails = _ref2.showAmountDetails,
    showOrderActions = _ref2.showOrderActions;
  var hasOrderActions = showOrderActions && orderActions.length > 0;
  var hasFloorResourceAction = orderActions.some(function (action) {
    return action.key === 'select-floor-resource';
  });
  if (!showAmountDetails && !hasOrderActions) {
    return null;
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "pisell-sale-detail-footer"
  }, showAmountDetails ? /*#__PURE__*/React.createElement(AmountDetails, {
    defaultExpanded: amountDetailsDefaultExpanded,
    context: {
      sales: context.sales,
      summary: context.summary
    }
  }) : null, hasOrderActions ? /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-sale-detail-button-actions', 'pisell-sale-detail-button-actions--template-a', {
      'pisell-sale-detail-button-actions--with-floor-resource': hasFloorResourceAction
    })
  }, /*#__PURE__*/React.createElement(DetailActions, {
    actions: orderActions,
    onOrderComplete: onOrderComplete
  })) : null);
}
export function SaleDetailTemplateA(_ref3) {
  var _moduleConfig$amountD;
  var context = _ref3.context,
    mobilePresentation = _ref3.mobilePresentation,
    moduleConfig = _ref3.moduleConfig,
    renderType = _ref3.renderType,
    variant = _ref3.variant;
  var hiddenModules = (moduleConfig === null || moduleConfig === void 0 ? void 0 : moduleConfig.hidden) || [];
  var showAmountDetails = !hiddenModules.includes('amountDetails');
  var showOrderActions = !hiddenModules.includes('orderActions');
  var isMobileBottomSheet = variant === 'phone' && renderType === 'current' && mobilePresentation === 'bottomSheet';
  var bodyContent = /*#__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(SaleDetailTemplateAMain, {
    context: context,
    moduleConfig: moduleConfig
  }))));
  var footerContent = /*#__PURE__*/React.createElement(SaleDetailTemplateAFooter, {
    context: {
      sales: context.sales,
      summary: context.summary
    },
    onOrderComplete: context.onOrderComplete,
    orderActions: moduleConfig === null || moduleConfig === void 0 ? void 0 : moduleConfig.orderActions,
    showAmountDetails: showAmountDetails,
    showOrderActions: showOrderActions,
    amountDetailsDefaultExpanded: moduleConfig === null || moduleConfig === void 0 || (_moduleConfig$amountD = moduleConfig.amountDetails) === null || _moduleConfig$amountD === void 0 ? void 0 : _moduleConfig$amountD.defaultExpanded
  });
  if (isMobileBottomSheet) {
    return /*#__PURE__*/React.createElement(MobileSheetFrame, {
      className: classNames('pisell-sale-detail-tmpl-a', 'pisell-sale-detail-tmpl-a--mobile-sheet'),
      footer: footerContent
    }, bodyContent);
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "pisell-sale-detail-tmpl-a"
  }, /*#__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(SaleDetailTemplateAMain, {
    context: context,
    moduleConfig: moduleConfig
  }), footerContent))));
}