@pisell/private-materials 6.2.24 → 6.2.25

package/es/components/ticketBooking/components/bookingDataPanel/constants.d.ts

@@ -0,0 +1,22 @@
+export declare const getPayStatusMap: () => {
+    authorized: any;
+    paid: any;
+    partially_paid: any;
+    partially_refunded: any;
+    payment_pending: any;
+    refunded: any;
+    unpaid: any;
+    voided: any;
+    payment_processing: any;
+};
+export declare const payStatusColorMap: {
+    authorized: string;
+    paid: string;
+    partially_paid: string;
+    partially_refunded: string;
+    payment_pending: string;
+    refunded: string;
+    unpaid: string;
+    voided: string;
+    payment_processing: string;
+};

package/es/components/ticketBooking/components/bookingDataPanel/constants.js

@@ -0,0 +1,25 @@
+import { locales } from '@pisell/utils';
+export var getPayStatusMap = function getPayStatusMap() {
+  return {
+    authorized: locales.getText('pisell2.ticket-booking.authorized'),
+    paid: locales.getText('pisell2.ticket-booking.paid'),
+    partially_paid: locales.getText('pisell2.ticket-booking.partially-paid'),
+    partially_refunded: locales.getText('pisell2.ticket-booking.partially-refunded'),
+    payment_pending: locales.getText('pisell2.ticket-booking.payment-pending'),
+    refunded: locales.getText('pisell2.ticket-booking.refunded'),
+    unpaid: locales.getText('pisell2.ticket-booking.unpaid'),
+    voided: locales.getText('pisell2.ticket-booking.voided'),
+    payment_processing: locales.getText('pisell2.ticket-booking.pending')
+  };
+};
+export var payStatusColorMap = {
+  authorized: 'var(--Gray-200, #EAECF0)',
+  paid: 'var(--Success-100, #DCFAE6)',
+  partially_paid: 'var(--Moss-100, #E6F4D7)',
+  partially_refunded: 'var(--Pink-100, #FCE7F6)',
+  payment_pending: 'var(--Warning-100, #FEF0C7)',
+  refunded: 'var(--Error-100, #FEE4E2)',
+  unpaid: 'var(--Blue-100, #D1E9FF)',
+  voided: 'var(--Gray-200, #EAECF0)',
+  payment_processing: 'var(--Warning-100, #FEF0C7)'
+};

package/es/components/ticketBooking/components/bookingDataPanel/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import './index.less';
+interface BookingDataPanelProps {
+    currentDate: string;
+    onBookingClick: (booking: any) => void;
+    bookingId?: number;
+}
+declare const BookingDataPanel: React.ForwardRefExoticComponent<BookingDataPanelProps & React.RefAttributes<unknown>>;
+export default BookingDataPanel;

package/es/components/ticketBooking/components/bookingDataPanel/index.js

@@ -0,0 +1,74 @@
+import React, { forwardRef, useImperativeHandle, useMemo, useRef } from 'react';
+import { Tabs } from '@pisell/materials';
+import { locales } from '@pisell/utils';
+import { SyncOutlined } from '@ant-design/icons';
+import BookingDashboard from "./bookingDashboard";
+import BookingList from "./bookingList";
+import useToast from "../../../../hooks/useToast";
+import "./index.less";
+var BookingDataPanel = /*#__PURE__*/forwardRef(function (props, ref) {
+  var currentDate = props.currentDate,
+    onBookingClick = props.onBookingClick,
+    bookingId = props.bookingId;
+  var Toast = useToast();
+  var bookingListRef = useRef(null);
+  var bookingDashboardRef = useRef(null);
+  var bookingTimeStartBetween = useMemo(function () {
+    return ["".concat(currentDate, " 00:00:00"), "".concat(currentDate, " 23:59:59")];
+  }, [currentDate]);
+  var items = useMemo(function () {
+    return [{
+      label: locales.getText('pisell2.ticket-booking.dashboard'),
+      key: 'data-board',
+      children: /*#__PURE__*/React.createElement(BookingDashboard, {
+        bookingTimeStartBetween: bookingTimeStartBetween,
+        ref: bookingDashboardRef
+      })
+    }, {
+      label: locales.getText('pisell2.ticket-booking.booking-list'),
+      key: 'booking-list',
+      children: /*#__PURE__*/React.createElement(BookingList, {
+        bookingTimeStartBetween: bookingTimeStartBetween,
+        onBookingClick: onBookingClick,
+        bookingId: bookingId,
+        ref: bookingListRef
+      })
+    }];
+  }, [currentDate, bookingId]);
+  useImperativeHandle(ref, function () {
+    return {
+      refresh: function refresh() {
+        var _bookingListRef$curre, _bookingDashboardRef$;
+        (_bookingListRef$curre = bookingListRef.current) === null || _bookingListRef$curre === void 0 || _bookingListRef$curre.refresh();
+        (_bookingDashboardRef$ = bookingDashboardRef.current) === null || _bookingDashboardRef$ === void 0 || _bookingDashboardRef$.refresh();
+      }
+    };
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "pisell-ticket-booking-data-panel"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "pisell-ticket-booking-data-panel-mask",
+    style: {
+      display: bookingId ? 'block' : 'none'
+    },
+    onClick: function onClick() {
+      onBookingClick({});
+    }
+  }), /*#__PURE__*/React.createElement(Tabs, {
+    type: "line",
+    items: items,
+    tabBarExtraContent: /*#__PURE__*/React.createElement("div", {
+      className: "pisell-ticket-booking-data-panel-tab-extra",
+      onClick: function onClick() {
+        var _bookingListRef$curre2, _Toast$success;
+        (_bookingListRef$curre2 = bookingListRef.current) === null || _bookingListRef$curre2 === void 0 || _bookingListRef$curre2.refresh();
+        Toast === null || Toast === void 0 || (_Toast$success = Toast.success) === null || _Toast$success === void 0 || _Toast$success.call(Toast, locales.getText('pisell2.ticket-booking.refresh-success'));
+      }
+    }, /*#__PURE__*/React.createElement(SyncOutlined, null)),
+    tabBarStyle: {
+      margin: '0 0 0 16px',
+      height: '40px'
+    }
+  }));
+});
+export default BookingDataPanel;

package/es/components/ticketBooking/components/bookingDataPanel/index.less

@@ -0,0 +1,61 @@
+.pisell-ticket-booking-data-panel {
+  position: relative;
+  height: 100%;
+  .pisell-lowcode-tabs-tabpane, .pisell-lowcode-tabs-content{
+    height: 100%;
+  }
+  .pisell-lowcode-tabs {
+    width: 100%;
+    height: 100%;
+  }
+  .pisell-lowcode-tabs-content-holder {
+    overflow: auto;
+  }
+  .pisell-ticket-booking-data-panel-tab-extra {
+    padding: 12px;
+    color: rgb(152, 162, 179);
+    font-size: 20px;
+    cursor: pointer;
+  }
+  .pisell-ticket-booking-data-panel-mask {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.85);
+    z-index: 9;
+  }
+  .pisell-lowcode-dropdown-trigger {
+    background: rgba(255, 255, 255, 0.07);
+    color: var(--Gray-400, #98a2b3);
+    border: none;
+    box-shadow: none;
+  }
+  .pisell-lowcode-sort-button-active {
+    background-color: var(--Primary-100, #F4EBFF);
+  }
+  .pisell-lowcode-badge {
+    color: inherit;
+  }
+  .pisell-lowcode-tabs-top>.pisell-lowcode-tabs-nav::before {
+    border-bottom: 1px solid var(--Gray-600, #475467);
+  }
+  
+  .pisell-lowcode-tabs {
+    .pisell-lowcode-tabs-tab {
+      color: #fff;
+      .pisell-lowcode-tab-bar-label {
+        color: inherit !important;
+        font-size: 14px;
+        font-weight: 600;
+        line-height: 20px;
+      }
+    }
+    .pisell-lowcode-input-lg {
+      background: rgba(255, 255, 255, 0.07);
+      border: none;
+      color: #fff;
+    }
+  }
+}

package/es/components/ticketBooking/components/bookingDataPanel/pisellFloatingPanel/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface PisellFloatingPanelProps {
+    currentDate: string;
+    onBookingClick: (booking: any) => void;
+    bookingId?: number;
+}
+export interface PisellFloatingPanelRef {
+    open: () => void;
+    close: () => void;
+    refresh: () => void;
+    getIsOpen: () => boolean;
+}
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<PisellFloatingPanelProps & React.RefAttributes<PisellFloatingPanelRef>>>;
+export default _default;

package/es/components/ticketBooking/components/bookingDataPanel/pisellFloatingPanel/index.js

@@ -0,0 +1,71 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { memo, useMemo, useState, useImperativeHandle, forwardRef, useRef } from 'react';
+import { PisellFloatingPanel as PisellFloatingPanelComponent } from '@pisell/materials';
+import BookingDataPanel from "../index";
+var PisellFloatingPanel = /*#__PURE__*/forwardRef(function (props, ref) {
+  var currentDate = props.currentDate,
+    onBookingClick = props.onBookingClick,
+    bookingId = props.bookingId;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var bookingDataPanelRef = useRef(null);
+  var floationgPanelProps = useMemo(function () {
+    return {
+      fullHeight: 'calc(100% - 62px)',
+      retractHeight: '0px',
+      defaultOpen: isOpen,
+      style: {
+        background: 'var(--Gray-950, #0C111D)',
+        width: '470px',
+        height: '100%',
+        zIndex: '1000',
+        left: '16px'
+      },
+      retractIconStyle: {
+        color: '#fff',
+        fontSize: '20px'
+      },
+      width: '470px',
+      isFloat: true,
+      onOpenChange: function onOpenChange(open) {
+        setIsOpen(open);
+      }
+    };
+  }, []);
+  useImperativeHandle(ref, function () {
+    return {
+      open: function open() {
+        var _bookingDataPanelRef$;
+        (_bookingDataPanelRef$ = bookingDataPanelRef.current) === null || _bookingDataPanelRef$ === void 0 || _bookingDataPanelRef$.refresh();
+        setIsOpen(true);
+      },
+      close: function close() {
+        setIsOpen(false);
+      },
+      refresh: function refresh() {
+        var _bookingDataPanelRef$2;
+        (_bookingDataPanelRef$2 = bookingDataPanelRef.current) === null || _bookingDataPanelRef$2 === void 0 || _bookingDataPanelRef$2.refresh();
+      },
+      getIsOpen: function getIsOpen() {
+        return isOpen;
+      }
+    };
+  });
+  return /*#__PURE__*/React.createElement(PisellFloatingPanelComponent, _extends({}, floationgPanelProps, {
+    open: isOpen
+  }), /*#__PURE__*/React.createElement(BookingDataPanel, {
+    currentDate: currentDate,
+    bookingId: bookingId,
+    onBookingClick: onBookingClick,
+    ref: bookingDataPanelRef
+  }));
+});
+export default /*#__PURE__*/memo(PisellFloatingPanel);

package/es/components/ticketBooking/components/floatButtons/index.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import './index.less';
+interface FloatButtonsProps {
+    items: {
+        icon: React.ReactNode;
+        onClick: () => void;
+        key: string;
+    }[];
+}
+declare const FloatButtons: (props: FloatButtonsProps) => JSX.Element;
+export default FloatButtons;

package/es/components/ticketBooking/components/floatButtons/index.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { Button } from '@pisell/materials';
+import "./index.less";
+var FloatButtons = function FloatButtons(props) {
+  var items = props.items;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ticket-booking-float-buttons"
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(Button, {
+      key: item.key,
+      type: "primary",
+      icon: item.icon,
+      shape: "circle",
+      size: "large",
+      onClick: item.onClick
+    });
+  }));
+};
+export default FloatButtons;

package/es/components/ticketBooking/components/floatButtons/index.less

@@ -0,0 +1,17 @@
+.ticket-booking-float-buttons {
+  position: absolute;
+  bottom: 24px;
+  right: 33px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  .pisell-lowcode-btn {
+    width: 54px;
+    height: 54px;
+    box-shadow: 0 1.813px 3.625px 0 rgba(16, 24, 40, 0.05);
+    background-color: #7F56DA;
+    .anticon {
+        font-size: 29px;
+    }
+  }
+}