@pisell/private-materials 3.2.22 → 3.2.25

package/es/components/appointmentBooking/components/Content/index.less

@@ -10,6 +10,10 @@
     width: 634px;
     // padding: 16px 0;
 
+    .appointment-resource-wrap {
+      padding: 16px 0;
+    }
+
     .booking-tab-product {
       .booking-tabs-wrap {
         top: 77px !important;
@@ -38,7 +42,18 @@
     flex: none;
     // padding: 16px 16px 0;
 
+    .calendar-date-box {
+      padding: 0 16px;
+    }
+
+    .appointment-resource-wrap {
+      padding: 16px;
+    }
+
     .booking-tab-product {
+      .booking-tabs-wrap {
+        top: 0 !important;
+      }
       .booking-category-list {
         padding: 0 20px;
       }

package/es/components/appointmentBooking/components/Date/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './index.less';
 declare const CalendarDate: (props: any) => JSX.Element;
 export default CalendarDate;

package/es/components/appointmentBooking/components/Date/index.js

@@ -18,30 +18,35 @@ import { Skeleton } from 'antd';
 import Dayjs from 'dayjs';
 import isSameOrBefore from 'dayjs/plugin/isSameOrBefore';
 Dayjs.extend(isSameOrBefore);
-import { weekListText } from "./state";
 import classNames from 'classnames';
+import { locales, isMobile } from '@pisell/utils';
 import { CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
 import { useAppointmentBookingContext } from "../../context";
 import "./index.less";
 var CalendarDate = function CalendarDate(props) {
-  var _useState = useState(),
+  var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
-    currentDate = _useState2[0],
-    setCurrentDate = _useState2[1];
-  // 生成7天的时间列表
-  var _useState3 = useState([]),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var _useState3 = useState(),
     _useState4 = _slicedToArray(_useState3, 2),
-    dateMonthList = _useState4[0],
-    setDateMonthList = _useState4[1];
+    currentDate = _useState4[0],
+    setCurrentDate = _useState4[1];
+  // 生成7天的时间列表
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    dateMonthList = _useState6[0],
+    setDateMonthList = _useState6[1];
   // 切换的月份
-  var _useState5 = useState(function () {
+  var _useState7 = useState(function () {
       return Dayjs();
     }),
-    _useState6 = _slicedToArray(_useState5, 2),
-    currentMonth = _useState6[0],
-    setCurrentMonth = _useState6[1];
+    _useState8 = _slicedToArray(_useState7, 2),
+    currentMonth = _useState8[0],
+    setCurrentMonth = _useState8[1];
   var _useAppointmentBookin = useAppointmentBookingContext(),
     appointmentBooking = _useAppointmentBookin.appointmentBooking;
+  var weekListText = [locales.getText('pisell2.appointment.sunday'), locales.getText('pisell2.appointment.monday'), locales.getText('pisell2.appointment.tuesday'), locales.getText('pisell2.appointment.wednesday'), locales.getText('pisell2.appointment.thursday'), locales.getText('pisell2.appointment.friday'), locales.getText('pisell2.appointment.saturday')];
 
   // 计算开始渲染的列
   var startingColumn = 0 % 7; // 0 表示星期日
@@ -98,30 +103,36 @@ var CalendarDate = function CalendarDate(props) {
   };
   var getDates = /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(date) {
-      var startDate, endDate, params, data, firstAvailableDate, baseMonthData, updatedDates;
+      var startDate, endDate, params, data, selected, firstAvailableDate, baseMonthData, updatedDates;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
+            _context.prev = 0;
             startDate = Dayjs(date).startOf('month').format('YYYY-MM-DD');
             endDate = Dayjs(date).endOf('month').format('YYYY-MM-DD');
             params = {
               startDate: startDate,
               endDate: endDate
             };
-            _context.next = 5;
+            _context.next = 6;
             return appointmentBooking.getAvailableDate(params);
-          case 5:
+          case 6:
             data = _context.sent;
-            console.log(data, params, date, date.format('YYYY-MM') === Dayjs().format('YYYY-MM'), 'wh78968');
-
-            // 当前月则默认选中当前第一个可用的
-
-            if (date.format('YYYY-MM') === Dayjs().format('YYYY-MM')) {
-              firstAvailableDate = data.find(function (d) {
-                return d.status === 'available';
-              });
-              setCurrentDate(firstAvailableDate === null || firstAvailableDate === void 0 ? void 0 : firstAvailableDate.date);
-              appointmentBooking.setDateRange([firstAvailableDate]);
+            _context.next = 9;
+            return appointmentBooking.getDateRange();
+          case 9:
+            selected = _context.sent;
+            if ((selected === null || selected === void 0 ? void 0 : selected.length) > 0) {
+              setCurrentDate(selected[0].date);
+            } else {
+              // 当前月则默认选中当前第一个可用的
+              if (date.format('YYYY-MM') === Dayjs().format('YYYY-MM')) {
+                firstAvailableDate = data.find(function (d) {
+                  return d.status === 'available';
+                });
+                setCurrentDate(firstAvailableDate === null || firstAvailableDate === void 0 ? void 0 : firstAvailableDate.date);
+                appointmentBooking.setDateRange([firstAvailableDate]);
+              }
             }
 
             // 创建基础日历数据
@@ -137,12 +148,20 @@ var CalendarDate = function CalendarDate(props) {
               }
               return day;
             });
+            setLoading(false);
             setDateMonthList(updatedDates);
-          case 11:
+            _context.next = 21;
+            break;
+          case 17:
+            _context.prev = 17;
+            _context.t0 = _context["catch"](0);
+            setLoading(false);
+            console.log(_context.t0, 'wh978968234234');
+          case 21:
           case "end":
             return _context.stop();
         }
-      }, _callee);
+      }, _callee, null, [[0, 17]]);
     }));
     return function getDates(_x) {
       return _ref.apply(this, arguments);
@@ -178,9 +197,10 @@ var CalendarDate = function CalendarDate(props) {
     var currentMonthText = currentMonth.format('YYYY-MM');
     var newNextMonth = Dayjs(currentMonthText).add(1, 'month');
     setCurrentMonth(newNextMonth);
+    setLoading(true);
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: 'calendar-date-box'
+    className: "calendar-date-box ".concat(isMobile() ? 'calendar-date-mobile-box' : '')
   }, !dateMonthList.length ? /*#__PURE__*/React.createElement(Skeleton, {
     loading: true,
     active: true,
@@ -216,17 +236,14 @@ var CalendarDate = function CalendarDate(props) {
     var isCurrentMonth = Dayjs(day.date).isSame(currentMonth, 'month');
     return /*#__PURE__*/React.createElement("div", {
       key: index,
-      className: classNames('calendar-days-items', _defineProperty(_defineProperty(_defineProperty({}, 'disabledDate', day === null || day === void 0 ? void 0 : day.disabled), 'selectDate', currentDate === date), 'other-month-days', !isCurrentMonth)),
+      className: classNames('calendar-days-items', _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, 'disabledDate', day === null || day === void 0 ? void 0 : day.disabled), 'selectDate', currentDate === date), 'other-month-days', !isCurrentMonth), 'loading-item', loading)),
       onClick: function onClick() {
         if (day !== null && day !== void 0 && day.disabled) return;
-        console.log(day, 'wh987976');
         setCurrentDate(date);
         appointmentBooking.setDateRange([day]);
       }
     }, isCurrentMonth && /*#__PURE__*/React.createElement("div", {
-      className: classNames('day-text', {
-        // ['day-line']: !disabled,
-      })
+      className: classNames('day-text')
     }, Dayjs(day.date).format('D')));
   })))));
 };

package/es/components/appointmentBooking/components/Date/index.less

@@ -128,4 +128,15 @@
     background: none;
     border: none;
   }
+
+  &.loading-item {
+    background: #eaecf0;
+    cursor: not-allowed;
+  }
+}
+
+.calendar-date-mobile-box {
+  .calendar-days-items {
+    height: 54px;
+  }
 }

package/es/components/appointmentBooking/components/Footer/index.js

@@ -4,7 +4,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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 from 'react';
+import React, { useEffect } from 'react';
 import { SectionFooters, Button, Badge, Image } from '@pisell/materials';
 import { useState } from 'react';
 import ContinueButton from "../Cart/ContinueButton";
@@ -14,12 +14,17 @@ import Cart from "../Cart";
 import Total from "../Cart/Item/Total";
 import "./index.less";
 var Footer = function Footer() {
+  var _currentStep$step;
   var _useAppointmentBookin = useAppointmentBookingContext(),
-    carts = _useAppointmentBookin.carts;
+    carts = _useAppointmentBookin.carts,
+    currentStep = _useAppointmentBookin.currentStep;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
     setOpen = _useState2[1];
+  useEffect(function () {
+    setOpen(false);
+  }, [currentStep === null || currentStep === void 0 || (_currentStep$step = currentStep.step) === null || _currentStep$step === void 0 ? void 0 : _currentStep$step.key]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SectionFooters, {
     className: "section-footer-wrap",
     left: /*#__PURE__*/React.createElement(Total, {

package/es/components/appointmentBooking/components/Guest/components/InformationOptionsModal/index.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const GuestOptionsModal: (props: any) => JSX.Element;
+export default GuestOptionsModal;

package/es/components/appointmentBooking/components/Guest/components/InformationOptionsModal/index.js

@@ -0,0 +1,50 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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; }
+import React, { useMemo } from 'react';
+import { PisellModal } from '@pisell/materials';
+import "./index.less";
+var GuestOptionsModal = function GuestOptionsModal(props) {
+  var open = props.open,
+    onCancel = props.onCancel,
+    options = props.options,
+    _onClick = props.onClick,
+    holderItem = props.holderItem;
+  var lists = useMemo(function () {
+    var _options = _toConsumableArray(options);
+    if (!(holderItem !== null && holderItem !== void 0 && holderItem.isGuest)) {
+      _options = _options.filter(function (option) {
+        return option.key !== 'remove';
+      });
+    }
+    return _options;
+  }, [options]);
+  return /*#__PURE__*/React.createElement(PisellModal, {
+    open: open,
+    platform: 'h5',
+    closable: true,
+    bodyStyle: {
+      padding: '0 24px'
+    },
+    destroyOnClose: true,
+    footer: null,
+    onCancel: onCancel,
+    mobileModalHeight: 'auto',
+    className: 'guest-option-modal',
+    headerDivider: false
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "guest-options-wrap"
+  }, lists.map(function (item) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.key,
+      className: "guest-options-wrap-item ".concat(item.key === 'remove' ? 'remove' : ''),
+      onClick: function onClick() {
+        return _onClick(item);
+      }
+    }, item.label);
+  })));
+};
+export default GuestOptionsModal;

package/es/components/appointmentBooking/components/Guest/components/InformationOptionsModal/index.less

@@ -0,0 +1,28 @@
+.guest-options-wrap {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  .guest-options-wrap-item {
+    color: var(--Gray-900, #101828);
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 24px;
+    display: flex;
+    padding: 9px 10px;
+    align-items: center;
+    flex: 1 0 0;
+  }
+
+  .remove {
+    color: var(--Error-700, #b42318);
+  }
+}
+
+.guest-option-modal {
+  .pisell-lowcode-modal-header {
+    border: none;
+  }
+  .pisell-lowcode-modal-body {
+    height: max-content;
+  }
+}

package/es/components/appointmentBooking/components/Guest/index.js

@@ -6,14 +6,11 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useMemo, useState } from 'react';
 import { Dropdown } from 'antd';
-import { Button, Iconfont, PisellCard, PisellAvatar } from '@pisell/materials';
+import { Button, Iconfont, PisellCard, PisellAvatar, PisellToast } from '@pisell/materials';
 import { locales, isMobile, getUniqueId } from '@pisell/utils';
-// import SelectHolderModal from '../Provider/SelectHolderModal';
-// import InformationOptionsModal from '../Provider/InformationOptionsModal/index';
-// import RemoveOptionConfirmModal from '../Provider/RemoveOptionConfirmModal';
-import { useAppointmentBookingAccount } from "../../hooks";
+import InformationOptionsModal from "./components/InformationOptionsModal";
 import { useAppointmentBookingContext } from "../../context";
-// import appointmentBookingAccount from '../../hooks';
+import { useAppointmentBookingAccount } from "../../hooks";
 import { formatGuest } from "../../utils";
 import "./index.less";
 var Guest = function Guest() {
@@ -26,14 +23,6 @@ var Guest = function Guest() {
     _useState4 = _slicedToArray(_useState3, 2),
     holderItem = _useState4[0],
     setHolderItem = _useState4[1];
-  // 移除确认
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    removeOpen = _useState6[0],
-    setRemoveOpen = _useState6[1];
-
-  // const appointmentBooking = useAppointmentBooking();
-  // const { products } = useAppointmentBookingCart();
   var _useAppointmentBookin = useAppointmentBookingContext(),
     carts = _useAppointmentBookin.carts,
     appointmentBooking = _useAppointmentBookin.appointmentBooking;
@@ -73,6 +62,7 @@ var Guest = function Guest() {
    */
   var handleClick = function handleClick(_ref, item) {
     var key = _ref.key;
+    console.log(key, item, 'wh978967');
     // 编辑holder
     if (key === 'edit') {
       appointmentBooking.setActiveAccount(item.id);
@@ -118,10 +108,16 @@ var Guest = function Guest() {
         }
       },
       placement: "bottomRight",
-      overlayClassName: "provider-information-custom-dropdown-menu"
+      overlayClassName: "appointment-guest-custom-dropdown-menu"
     }, /*#__PURE__*/React.createElement(Button, null, locales.getText('pisell2.event.option')));
   };
   var handleAddGuest = function handleAddGuest() {
+    // 最多添加6个人
+    if (accountLists.length >= 6) {
+      return PisellToast({
+        content: locales.getText('pisell2.appointment.max.guest')
+      });
+    }
     var guest = {
       id: getUniqueId(),
       username: "Guest".concat(accountLists.length + 1),
@@ -132,7 +128,7 @@ var Guest = function Guest() {
     appointmentBooking.back();
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "provider-information-wrap"
+    className: "appointment-guest-wrap"
   }, lists === null || lists === void 0 ? void 0 : lists.map(function (item) {
     var _item$children;
     return /*#__PURE__*/React.createElement(PisellCard, {
@@ -158,12 +154,23 @@ var Guest = function Guest() {
       width: 'max-content'
     },
     onClick: handleAddGuest,
-    className: "provider-information-add-button"
+    className: "appointment-guest-add-button"
   }, /*#__PURE__*/React.createElement(Iconfont, {
     type: "pisell2-plus",
     style: {
       fontSize: '20px'
     }
-  }), locales.getText('pisell2.appointment.add.guest'))));
+  }), locales.getText('pisell2.appointment.add.guest'))), openOption ? /*#__PURE__*/React.createElement(InformationOptionsModal, {
+    options: options,
+    open: openOption,
+    holderItem: holderItem,
+    onCancel: function onCancel() {
+      return setOpenOption(false);
+    },
+    onClick: function onClick(e) {
+      handleClick(e, holderItem);
+      setOpenOption(false);
+    }
+  }) : null);
 };
 export default Guest;

package/es/components/appointmentBooking/components/Guest/index.less

@@ -1,4 +1,4 @@
-.provider-information-wrap {
+.appointment-guest-wrap {
   padding: 16px;
   display: flex;
   flex-direction: column;
@@ -7,7 +7,7 @@
   margin-top: 16px;
   width: 100%;
 
-  .provider-information-add-button {
+  .appointment-guest-add-button {
     display: flex;
     align-items: center;
     .pisell-lowcode-image-mask-info {
@@ -64,7 +64,7 @@
   }
 }
 
-.provider-information-custom-dropdown-menu {
+.appointment-guest-custom-dropdown-menu {
   .pisell-lowcode-dropdown-menu {
     padding: 6px;
     border-bottom: 1px solid var(--Gray-200, #eaecf0);

package/es/components/appointmentBooking/components/Header/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import './index.less';
 declare const Header: () => JSX.Element;
 export default Header;

package/es/components/appointmentBooking/components/Header/index.js

@@ -1,14 +1,37 @@
-import React from 'react';
+import React, { useMemo } from 'react';
+import { locales } from '@pisell/utils';
 import ProgressBar from "../../../eventBooking/components/progressBar";
 import { useAppointmentBookingContext } from "../../context";
+import useEngineContext from "../../../../hooks/useEngineContext";
 import "./index.less";
 var Header = function Header() {
-  var _currentStep$step, _currentStep$step2;
-  // const appointmentBooking = useAppointmentBooking();
-  // const { currentStep } = useAppointmentBookingStep();
+  var _currentStep$step3, _currentStep$step5;
   var _useAppointmentBookin = useAppointmentBookingContext(),
     currentStep = _useAppointmentBookin.currentStep,
-    appointmentBooking = _useAppointmentBookin.appointmentBooking;
+    appointmentBooking = _useAppointmentBookin.appointmentBooking,
+    resources = _useAppointmentBookin.resources;
+  var context = useEngineContext();
+
+  /**
+   * @title: 获取资源名称
+   * @description:
+   * @param {*} useMemo
+   * @return {*}
+   * @Author: WangHan
+   * @Date: 2025-04-15 21:37
+   */
+  var stepName = useMemo(function () {
+    var _currentStep$step, _currentStep$step2;
+    var key = currentStep === null || currentStep === void 0 || (_currentStep$step = currentStep.step) === null || _currentStep$step === void 0 ? void 0 : _currentStep$step.key;
+
+    // 选择资源则获取资源列表的第一个名称
+    if (key === 'select-resource') {
+      var _resources$;
+      var name = (resources === null || resources === void 0 || (_resources$ = resources[0]) === null || _resources$ === void 0 || (_resources$ = _resources$.resources) === null || _resources$ === void 0 || (_resources$ = _resources$[0]) === null || _resources$ === void 0 ? void 0 : _resources$.title) || '';
+      return locales.getText('pisell2.event.select.category')(name);
+    }
+    return currentStep === null || currentStep === void 0 || (_currentStep$step2 = currentStep.step) === null || _currentStep$step2 === void 0 ? void 0 : _currentStep$step2.description;
+  }, [currentStep === null || currentStep === void 0 || (_currentStep$step3 = currentStep.step) === null || _currentStep$step3 === void 0 ? void 0 : _currentStep$step3.key, resources]);
 
   /**
    * @title: 返回
@@ -18,6 +41,22 @@ var Header = function Header() {
    * @Date: 2025-01-18 22:28
    */
   var handleBack = function handleBack() {
+    var _currentStep$step4;
+    var key = currentStep === null || currentStep === void 0 || (_currentStep$step4 = currentStep.step) === null || _currentStep$step4 === void 0 ? void 0 : _currentStep$step4.key;
+
+    // 删除缓存
+    var types = {
+      'select-time': 'time',
+      'select-resource': 'resource'
+    };
+    if (types[key]) {
+      appointmentBooking.deleteCartItemInfo(types[key]);
+    }
+
+    // 清空选中的日期
+    if (key === 'select-date') {
+      appointmentBooking.clearDateRange();
+    }
     appointmentBooking.back();
   };
 
@@ -29,11 +68,14 @@ var Header = function Header() {
    * @Date: 2025-01-22 13:43
    */
   var handleClose = function handleClose() {
-    appointmentBooking.close();
+    var _utils$history;
+    var utils = context.appHelper.utils || {};
+    utils === null || utils === void 0 || (_utils$history = utils.history) === null || _utils$history === void 0 || _utils$history.replace('/');
+    appointmentBooking.destroy();
   };
   return /*#__PURE__*/React.createElement(ProgressBar, {
-    title: currentStep === null || currentStep === void 0 || (_currentStep$step = currentStep.step) === null || _currentStep$step === void 0 ? void 0 : _currentStep$step.title,
-    description: currentStep === null || currentStep === void 0 || (_currentStep$step2 = currentStep.step) === null || _currentStep$step2 === void 0 ? void 0 : _currentStep$step2.description,
+    title: currentStep === null || currentStep === void 0 || (_currentStep$step5 = currentStep.step) === null || _currentStep$step5 === void 0 ? void 0 : _currentStep$step5.title,
+    description: stepName,
     showBack: (currentStep === null || currentStep === void 0 ? void 0 : currentStep.index) > 0,
     onBack: function onBack() {
       return handleBack();

package/es/components/appointmentBooking/components/Resource/index.d.ts

@@ -1,3 +1,3 @@
 import './index.less';
-declare const Resource: ({ onChange }: any) => JSX.Element;
+declare const Resource: () => JSX.Element;
 export default Resource;

package/es/components/appointmentBooking/components/Resource/index.js

@@ -7,18 +7,17 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useState, useEffect, useMemo } from 'react';
 import { Skeleton } from 'antd';
 import ResourceDisplay from "../../../eventBooking/components/resourceDisplay";
-import { PisellCustomCheckboxGroup } from '@pisell/materials';
+import { PisellCustomCheckboxGroup, PisellToast } from '@pisell/materials';
 import { useAppointmentBookingResource } from "../../hooks";
 import { useAppointmentBookingContext } from "../../context";
-import { isMobile } from '@pisell/utils';
+import guestsImg from "../../assets/guests.svg";
+import { isMobile, locales } from '@pisell/utils';
 import "./index.less";
-var Resource = function Resource(_ref) {
-  var onChange = _ref.onChange;
+var Resource = function Resource() {
   var _useState = useState(0),
     _useState2 = _slicedToArray(_useState, 2),
     selectedResource = _useState2[0],
     setSelectedResource = _useState2[1];
-  // const appointmentBooking = useAppointmentBooking();
   var _useAppointmentBookin = useAppointmentBookingContext(),
     appointmentBooking = _useAppointmentBookin.appointmentBooking,
     resources = _useAppointmentBookin.resources,
@@ -26,30 +25,29 @@ var Resource = function Resource(_ref) {
     resourceOtherParams = _useAppointmentBookin.resourceOtherParams;
   var _useAppointmentBookin2 = useAppointmentBookingResource(),
     getResourceList = _useAppointmentBookin2.getResourceList,
-    getResourceTimeSlot = _useAppointmentBookin2.getResourceTimeSlot,
     autoSelectAllProductResources = _useAppointmentBookin2.autoSelectAllProductResources;
-  // const { products } = useAppointmentBookingCart();
-  console.log(resources, carts, appointmentBooking, 'lists, products');
   useEffect(function () {
     var _resources = getResourceList();
-    autoSelectAllProductResources('resources');
+    autoSelectAllProductResources();
+    getResourceList();
   }, []);
   useEffect(function () {
     var _resourceOtherParams$;
-    console.log(resourceOtherParams === null || resourceOtherParams === void 0 ? void 0 : resourceOtherParams.errorList, 'errorListerrorListerrorList');
+    // 无可用时间提示
     if ((resourceOtherParams === null || resourceOtherParams === void 0 || (_resourceOtherParams$ = resourceOtherParams.errorList) === null || _resourceOtherParams$ === void 0 ? void 0 : _resourceOtherParams$.length) > 0) {
-      return;
+      return PisellToast({
+        content: locales.getText('pisell2.appointment.no.available.time')
+      });
     }
   }, [resourceOtherParams === null || resourceOtherParams === void 0 ? void 0 : resourceOtherParams.errorList]);
   var anyResource = [{
     id: 0,
-    image: 'https://cdn-partners-api.fresha.com/employee-avatars/processed/399178/medium/3b77991b-0ee2-4d0f-9d6f-a7501b39afcd-tempImageHYe20U.jpg',
-    title: 'Any professional',
-    subtitle: 'for maximum availability'
+    image: guestsImg,
+    title: locales.getText('pisell2.appointment.any.professional'),
+    subtitle: locales.getText('pisell2.appointment.for.maximum.availability')
   }];
   var currentResource = useMemo(function () {
     if (resources.length && carts.length) {
-      console.log(resources, carts, 'lists, products');
       if (carts.length === 1) {
         var _resources$;
         return (_resources$ = resources[0]) === null || _resources$ === void 0 || (_resources$ = _resources$.resources) === null || _resources$ === void 0 ? void 0 : _resources$[0];
@@ -61,25 +59,16 @@ var Resource = function Resource(_ref) {
     }
   }, [resources, carts]);
   var resourcesResult = useMemo(function () {
-    console.log(currentResource, resources, 'wh98765756');
     return anyResource.concat((currentResource === null || currentResource === void 0 ? void 0 : currentResource.renderList) || []);
   }, [currentResource]);
   var _onClick = function onClick(e) {
     setSelectedResource(e.id);
-    console.log(currentResource, e, 'whcurrentResourcecurrentResource');
     if (e.id) {
-      var _resources$2;
-      getResourceTimeSlot({
-        product: resources === null || resources === void 0 || (_resources$2 = resources[0]) === null || _resources$2 === void 0 ? void 0 : _resources$2.product,
-        resources: currentResource === null || currentResource === void 0 ? void 0 : currentResource.renderList,
-        currentResourceId: e.id
+      var _carts$;
+      return appointmentBooking.updateCart({
+        _id: carts === null || carts === void 0 || (_carts$ = carts[0]) === null || _carts$ === void 0 ? void 0 : _carts$._id,
+        resources: [e]
       });
-
-      // onChange({
-      //   times: times,
-      //   product: resources?.[0]?.product,
-      //   resources: resources[0]?.resources?.[1]?.renderList || [],
-      // });
     }
   };
   return /*#__PURE__*/React.createElement("div", {
@@ -97,7 +86,8 @@ var Resource = function Resource(_ref) {
         dataSource: item,
         direction: "vertical",
         children: !(item !== null && item !== void 0 && item.image) ? item === null || item === void 0 || (_item$title = item.title) === null || _item$title === void 0 ? void 0 : _item$title.charAt(0).toUpperCase() : null,
-        selected: selectedResource === (item === null || item === void 0 ? void 0 : item.id)
+        selected: selectedResource === (item === null || item === void 0 ? void 0 : item.id),
+        className: !item.id ? 'appointment-resource-guest-card' : ''
       });
     },
     columns: isMobile() ? 2 : 3,

package/es/components/appointmentBooking/components/Resource/index.less

@@ -1,6 +1,10 @@
 .appointment-resource-wrap {
-  padding-top: 16px;
   .pisell-lowcode-card {
     min-height: 166px !important;
   }
+
+  .appointment-resource-guest-card .pisell-lowcode-avatar-image img {
+    width: 50%;
+    height: 50%;
+  }
 }