@pisell/materials 6.11.107 → 6.11.108

package/es/components/productCard/lineItem/BookingLineItem.js

@@ -1,5 +1,9 @@
-var _excluded = ["dataSource", "type", "cartSkuType", "relatedProductDataSource", "rightActions", "escapeDom", "isShowImage", "isShowDelete", "isShowNote", "isShowAmountFooter", "disabledClick", "disabledEdit", "statusOptions", "statusLoading", "statusDisabled", "isShowRelatedProduct", "onBookingStatusChange", "onAction", "onDelete", "onNote", "onCard", "onPromotion", "onGift"];
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["dataSource", "type", "cartSkuType", "isShowBookingHeader", "relatedProductDataSource", "rightActions", "escapeDom", "isShowImage", "isFormSubject", "isShowDelete", "isShowNote", "isShowAmountFooter", "disabledClick", "disabledEdit", "statusOptions", "statusLoading", "statusDisabled", "isShowRelatedProduct", "holderOptions", "onBookingStatusChange", "onAction", "onDelete", "onNote", "onCard", "onPromotion", "onGift"];
 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 _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 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); }
@@ -24,6 +28,7 @@ import { SwipeAction } from "../cartSkuCard/components/swipeAction";
 import Action from "../components/Action";
 import TimeRange from "./components/TimeRange";
 import Resources from "./components/Resources";
+import Holders from "./components/Holders";
 import Iconfont from "../../iconfont";
 import useEngineContext from "../../../hooks/useEngineContext";
 var PREFIX = 'pisell-line-item';
@@ -64,15 +69,17 @@ var getResourceName = function getResourceName(booking, translationOriginal) {
   }).filter(Boolean).join(', ');
 };
 var BookingLineItem = function BookingLineItem(props) {
-  var _context$appHelper$ut, _context$appHelper$ut2, _context$appHelper$ut3, _context$appHelper$ut4, _dataSource$promotion;
+  var _context$appHelper$ut, _context$appHelper$ut2, _context$appHelper$ut3, _context$appHelper$ut4, _ref, _ref2, _dataSource$promotion;
   var dataSource = props.dataSource,
     type = props.type,
     cartSkuType = props.cartSkuType,
+    isShowBookingHeader = props.isShowBookingHeader,
     relatedProductDataSource = props.relatedProductDataSource,
     _props$rightActions = props.rightActions,
     rightActions = _props$rightActions === void 0 ? [] : _props$rightActions,
     escapeDom = props.escapeDom,
     isShowImage = props.isShowImage,
+    isFormSubject = props.isFormSubject,
     isShowDelete = props.isShowDelete,
     isShowNote = props.isShowNote,
     isShowAmountFooter = props.isShowAmountFooter,
@@ -86,6 +93,7 @@ var BookingLineItem = function BookingLineItem(props) {
     statusDisabled = _props$statusDisabled === void 0 ? false : _props$statusDisabled,
     _props$isShowRelatedP = props.isShowRelatedProduct,
     isShowRelatedProduct = _props$isShowRelatedP === void 0 ? true : _props$isShowRelatedP,
+    holderOptions = props.holderOptions,
     onBookingStatusChange = props.onBookingStatusChange,
     _onAction = props.onAction,
     onDelete = props.onDelete,
@@ -131,9 +139,23 @@ var BookingLineItem = function BookingLineItem(props) {
     }
   };
   var bookingRightActions = isShowDelete ? [deleteAction].concat(_toConsumableArray(rightActions)) : rightActions;
-  var bookingTitle = String((dataSource === null || dataSource === void 0 ? void 0 : dataSource.booking_id) || '-');
-  var bookingTime = formatBookingTime(dataSource, locale);
-  var resourceName = getResourceName(dataSource, translationOriginal) || '-';
+  var resolvedHolderOptions = (_ref = (_ref2 = holderOptions !== null && holderOptions !== void 0 ? holderOptions : dataSource === null || dataSource === void 0 ? void 0 : dataSource.holderOptions) !== null && _ref2 !== void 0 ? _ref2 : dataSource === null || dataSource === void 0 ? void 0 : dataSource.holders) !== null && _ref !== void 0 ? _ref : [];
+  var resolvedIsFormSubject = isFormSubject !== null && isFormSubject !== void 0 ? isFormSubject : dataSource === null || dataSource === void 0 ? void 0 : dataSource.isFormSubject;
+  var bookingTitle = String((dataSource === null || dataSource === void 0 ? void 0 : dataSource.booking_id) || '');
+  var renderDeleteButton = function renderDeleteButton() {
+    var inline = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    return isShowDelete ? /*#__PURE__*/React.createElement("button", {
+      className: classNames("".concat(PREFIX, "__delete-btn"), _defineProperty({}, "".concat(PREFIX, "__delete-btn--inline"), inline)),
+      type: "button",
+      onClick: function onClick(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        onDelete === null || onDelete === void 0 || onDelete(dataSource);
+      }
+    }, /*#__PURE__*/React.createElement(Iconfont, {
+      type: "pisell2-trash-01"
+    })) : null;
+  };
   var renderStatusButton = function renderStatusButton() {
     return /*#__PURE__*/React.createElement(Button, {
       className: "".concat(PREFIX, "__status"),
@@ -170,7 +192,7 @@ var BookingLineItem = function BookingLineItem(props) {
       e.stopPropagation();
       onCard === null || onCard === void 0 || onCard(dataSource);
     }
-  }, /*#__PURE__*/React.createElement("div", {
+  }, isShowBookingHeader ? /*#__PURE__*/React.createElement("div", {
     className: "".concat(PREFIX, "__booking-header"),
     style: {
       '--pisell-line-item-header-color': currentStatus.color || DEFAULT_STATUS_COLOR
@@ -184,29 +206,25 @@ var BookingLineItem = function BookingLineItem(props) {
   }, canChangeStatus ? /*#__PURE__*/React.createElement(Dropdown, {
     menu: {
       items: statusMenuItems,
-      onClick: function onClick(_ref) {
-        var key = _ref.key;
+      onClick: function onClick(_ref3) {
+        var key = _ref3.key;
         return onBookingStatusChange === null || onBookingStatusChange === void 0 ? void 0 : onBookingStatusChange(String(key), dataSource);
       }
     },
     trigger: ['click']
-  }, renderStatusButton()) : renderStatusButton(), isShowDelete ? /*#__PURE__*/React.createElement("button", {
-    className: "".concat(PREFIX, "__delete-btn"),
-    type: "button",
-    onClick: function onClick(e) {
-      e.preventDefault();
-      e.stopPropagation();
-      onDelete === null || onDelete === void 0 || onDelete(dataSource);
-    }
-  }, /*#__PURE__*/React.createElement(Iconfont, {
-    type: "pisell2-trash-01"
-  })) : null))), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(PREFIX, "__booking-detail")
+  }, renderStatusButton()) : renderStatusButton(), renderDeleteButton()))) : null, /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(PREFIX, "__booking-detail"), _defineProperty({}, "".concat(PREFIX, "__booking-detail--with-delete"), !isShowBookingHeader && isShowDelete))
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(PREFIX, "__booking-detail-content")
   }, /*#__PURE__*/React.createElement(Resources, {
     dataSource: dataSource
   }), /*#__PURE__*/React.createElement(TimeRange, {
     dataSource: dataSource
-  })), isShowRelatedProduct && relatedProductDataSource ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
+  }), resolvedIsFormSubject ? /*#__PURE__*/React.createElement(Holders, {
+    dataSource: dataSource,
+    holderOptions: resolvedHolderOptions,
+    isFormSubject: resolvedIsFormSubject
+  }) : null), !isShowBookingHeader ? renderDeleteButton(true) : null), isShowRelatedProduct && relatedProductDataSource ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
     style: {
       margin: 0
     }

package/es/components/productCard/lineItem/components/Holders/index.js

@@ -0,0 +1,74 @@
+import React, { useMemo } from 'react';
+import { locales } from '@pisell/utils';
+import Iconfont from "../../../../iconfont";
+import "./index.less";
+var PREFIX = 'pisell-line-item';
+var holderIconMap = {
+  form: 'pisell2-file-05',
+  minors: 'pisell2-user-check-01',
+  waiver: 'pisell2-file-lock-03'
+};
+var isEmptyHolderId = function isEmptyHolderId(value) {
+  if (Array.isArray(value)) return value.length === 0;
+  return value === undefined || value === null || value === '';
+};
+var normalizeHolderIds = function normalizeHolderIds(value) {
+  if (isEmptyHolderId(value)) return [];
+  return Array.isArray(value) ? value : [value];
+};
+var pickHolderId = function pickHolderId(dataSource) {
+  var _ref, _ref2, _dataSource$holder_id, _dataSource$metadata, _dataSource$_extend, _dataSource$_extend2;
+  return (_ref = (_ref2 = (_dataSource$holder_id = dataSource === null || dataSource === void 0 ? void 0 : dataSource.holder_id) !== null && _dataSource$holder_id !== void 0 ? _dataSource$holder_id : dataSource === null || dataSource === void 0 || (_dataSource$metadata = dataSource.metadata) === null || _dataSource$metadata === void 0 ? void 0 : _dataSource$metadata.holder_id) !== null && _ref2 !== void 0 ? _ref2 : dataSource === null || dataSource === void 0 || (_dataSource$_extend = dataSource._extend) === null || _dataSource$_extend === void 0 || (_dataSource$_extend = _dataSource$_extend.product) === null || _dataSource$_extend === void 0 || (_dataSource$_extend = _dataSource$_extend.metadata) === null || _dataSource$_extend === void 0 ? void 0 : _dataSource$_extend.holder_id) !== null && _ref !== void 0 ? _ref : dataSource === null || dataSource === void 0 || (_dataSource$_extend2 = dataSource._extend) === null || _dataSource$_extend2 === void 0 || (_dataSource$_extend2 = _dataSource$_extend2.product) === null || _dataSource$_extend2 === void 0 || (_dataSource$_extend2 = _dataSource$_extend2._extend) === null || _dataSource$_extend2 === void 0 ? void 0 : _dataSource$_extend2.holder_id;
+};
+var pickHolderMaxCount = function pickHolderMaxCount(dataSource, holderIds) {
+  var _ref3, _ref4, _ref5, _ref6, _ref7, _dataSource$holderMax, _dataSource$_extend3, _dataSource$_extend4, _dataSource$_extend5;
+  var count = ((_ref3 = (_ref4 = (_ref5 = (_ref6 = (_ref7 = (_dataSource$holderMax = dataSource === null || dataSource === void 0 ? void 0 : dataSource.holderMaxCount) !== null && _dataSource$holderMax !== void 0 ? _dataSource$holderMax : dataSource === null || dataSource === void 0 ? void 0 : dataSource.holder_max_count) !== null && _ref7 !== void 0 ? _ref7 : dataSource === null || dataSource === void 0 ? void 0 : dataSource.number) !== null && _ref6 !== void 0 ? _ref6 : dataSource === null || dataSource === void 0 || (_dataSource$_extend3 = dataSource._extend) === null || _dataSource$_extend3 === void 0 || (_dataSource$_extend3 = _dataSource$_extend3.product) === null || _dataSource$_extend3 === void 0 ? void 0 : _dataSource$_extend3.num) !== null && _ref5 !== void 0 ? _ref5 : dataSource === null || dataSource === void 0 || (_dataSource$_extend4 = dataSource._extend) === null || _dataSource$_extend4 === void 0 || (_dataSource$_extend4 = _dataSource$_extend4.product) === null || _dataSource$_extend4 === void 0 ? void 0 : _dataSource$_extend4.product_quantity) !== null && _ref4 !== void 0 ? _ref4 : dataSource === null || dataSource === void 0 || (_dataSource$_extend5 = dataSource._extend) === null || _dataSource$_extend5 === void 0 || (_dataSource$_extend5 = _dataSource$_extend5.product) === null || _dataSource$_extend5 === void 0 || (_dataSource$_extend5 = _dataSource$_extend5._extend) === null || _dataSource$_extend5 === void 0 ? void 0 : _dataSource$_extend5.quantity) !== null && _ref3 !== void 0 ? _ref3 : holderIds.length) || 1;
+  return Number(count) || 1;
+};
+var LineItemHolders = function LineItemHolders(props) {
+  var _props$dataSource = props.dataSource,
+    dataSource = _props$dataSource === void 0 ? {} : _props$dataSource,
+    _props$holderOptions = props.holderOptions,
+    holderOptions = _props$holderOptions === void 0 ? [] : _props$holderOptions,
+    isFormSubject = props.isFormSubject;
+  var holderIds = useMemo(function () {
+    return normalizeHolderIds(pickHolderId(dataSource));
+  }, [dataSource]);
+  var holderMaxCount = pickHolderMaxCount(dataSource, holderIds);
+  var showUnassigned = Boolean(isFormSubject || (dataSource === null || dataSource === void 0 ? void 0 : dataSource.isFormSubject));
+  var holderType = (dataSource === null || dataSource === void 0 ? void 0 : dataSource.holderType) || (dataSource === null || dataSource === void 0 ? void 0 : dataSource.holder_type) || 'minors';
+  var holderIcon = holderIconMap[holderType] || holderIconMap.minors;
+  if (!holderIds.length) {
+    if (!showUnassigned) return null;
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(PREFIX, "__holders")
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "holder-item unassigned"
+    }, holderMaxCount > 1 ? /*#__PURE__*/React.createElement("span", null, holderMaxCount, "/", holderMaxCount, ' ') : null, /*#__PURE__*/React.createElement("span", {
+      className: "holder-label"
+    }, locales.getText('pisell2.cart.sku-card.unassigned'))));
+  }
+  var renderHolder = function renderHolder(id, index) {
+    var _holder$label;
+    var holder = holderOptions.find(function (item) {
+      return String(item.id) === String(id);
+    });
+    var label = (_holder$label = holder === null || holder === void 0 ? void 0 : holder.label) !== null && _holder$label !== void 0 ? _holder$label : String(id);
+    return /*#__PURE__*/React.createElement("div", {
+      className: "holder-item",
+      key: "".concat(id, "-").concat(index)
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "holder-icon"
+    }, /*#__PURE__*/React.createElement(Iconfont, {
+      type: holderIcon
+    })), /*#__PURE__*/React.createElement("span", {
+      className: "holder-label"
+    }, label));
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(PREFIX, "__holders")
+  }, holderIds.map(function (id, index) {
+    return renderHolder(id, index);
+  }));
+};
+export default LineItemHolders;

package/es/components/productCard/lineItem/components/Holders/index.less

@@ -0,0 +1,39 @@
+.pisell-line-item__holders {
+  user-select: none;
+  display: flex;
+  gap: 16px;
+  overflow: hidden;
+
+  .holder-item {
+    min-width: 30px;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    white-space: nowrap;
+
+    .holder-icon {
+      margin-right: 2px;
+      color: #7f56da;
+      font-size: 16px;
+    }
+
+    .holder-label {
+      display: inline-block;
+      overflow: hidden;
+      color: #667085;
+      font-size: 14px;
+      font-weight: 500;
+      line-height: 20px;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+
+  .unassigned {
+    color: red;
+
+    .holder-label {
+      color: red;
+    }
+  }
+}

package/es/components/productCard/lineItem/index.d.ts

@@ -1,19 +1,21 @@
 import type { ProductCardTypes } from '../types';
-import type { itemType, LineItemStatusOption, LineItemType } from './types';
+import type { itemType, LineItemHolderOption, LineItemStatusOption, LineItemType } from './types';
 import './index.less';
 export declare const PREFIX = "pisell-line-item";
-export type { itemType, LineItemStatusOption, LineItemType } from './types';
+export type { itemType, LineItemHolderOption, LineItemStatusOption, LineItemType, } from './types';
 declare type LocalizedText = string | Record<string, unknown> | null | undefined;
 export interface LineItemProps extends Omit<ProductCardTypes, 'dataSource'> {
     dataSource: any;
     itemType?: itemType;
     type?: LineItemType;
+    isShowBookingHeader: boolean;
     rightActions?: any[];
     escapeDom?: string;
     statusOptions?: LineItemStatusOption[];
     statusLoading?: boolean;
     statusDisabled?: boolean;
     isShowRelatedProduct?: boolean;
+    holderOptions?: LineItemHolderOption[];
     onBookingStatusChange?: (status: string, item: any) => void;
 }
 export declare const convertProductToLineItemProduct: (product: any, translationOriginal: (text: LocalizedText) => string, symbol: string) => {
@@ -30,8 +32,8 @@ export declare const convertProductToLineItemProduct: (product: any, translation
     quantity: any;
     price: any;
     total: any;
-    origin_total: any;
-    original_total: any;
+    origin_total: string | number | undefined;
+    original_total: string | number | undefined;
     source_product_price: any;
     selling_price: any;
     payment_price: any;
@@ -41,23 +43,25 @@ export declare const convertProductToLineItemProduct: (product: any, translation
     product_sku: any;
     product_bundle: any;
     bundle: any;
-    product_option_string: string;
+    product_option_string: any;
+    options: any[];
     discount_list: any;
     promotions: any;
+    discount_reason: any;
     isGift: boolean;
     giftData: any;
     _origin: any;
     _extend: {
         other: {
             product_id: any;
-            option: any;
+            option: any[];
             bundle: any;
             product_variant_id: any;
             quantity: any;
         };
         note: any;
         total: any;
-        origin_total: any;
+        origin_total: string | number | undefined;
         payment_price: any;
     };
 };

package/es/components/productCard/lineItem/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["dataSource", "itemType", "type", "rightActions", "escapeDom", "isShowImage", "isShowDelete", "isShowNote", "isShowAmountFooter", "disabledClick", "disabledEdit", "statusOptions", "statusLoading", "statusDisabled", "isShowRelatedProduct", "onBookingStatusChange", "onAction", "onDelete", "onNote", "onCard", "onPromotion", "onGift"];
+var _excluded = ["dataSource", "itemType", "type", "isShowBookingHeader", "rightActions", "escapeDom", "isShowImage", "isShowDelete", "isShowNote", "isShowAmountFooter", "disabledClick", "disabledEdit", "statusOptions", "statusLoading", "statusDisabled", "isShowRelatedProduct", "holderOptions", "onBookingStatusChange", "onAction", "onDelete", "onNote", "onCard", "onPromotion", "onGift"];
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -27,10 +27,32 @@ var translateText = function translateText(text, translationOriginal) {
   if (!text) return '';
   return translationOriginal(text);
 };
+
+/**
+ * 解析行级划线原价（composite 单价）。
+ * SalesSdk/OS 行数据用 original_price；legacy cacheItem 用 original_total / _extend.origin_total。
+ *
+ * @example
+ * resolveLineOriginTotal({ original_price: '8.00', selling_price: '5.00' }); // '8.00'
+ */
+var resolveLineOriginTotal = function resolveLineOriginTotal(product) {
+  var _product$_extend, _product$metadata;
+  var candidates = [product === null || product === void 0 ? void 0 : product.original_total, product === null || product === void 0 ? void 0 : product.original_price, product === null || product === void 0 || (_product$_extend = product._extend) === null || _product$_extend === void 0 ? void 0 : _product$_extend.origin_total, product === null || product === void 0 || (_product$metadata = product.metadata) === null || _product$metadata === void 0 || (_product$metadata = _product$metadata.origin) === null || _product$metadata === void 0 || (_product$metadata = _product$metadata._extend) === null || _product$metadata === void 0 ? void 0 : _product$metadata.origin_total];
+  for (var _i = 0, _candidates = candidates; _i < _candidates.length; _i++) {
+    var candidate = _candidates[_i];
+    if (candidate !== undefined && candidate !== null && candidate !== '') {
+      return candidate;
+    }
+  }
+  return undefined;
+};
 var convertBundleOption = function convertBundleOption(option, translationOriginal) {
+  var _option$add_price, _ref, _option$num;
   return _objectSpread(_objectSpread({}, option), {}, {
     id: option.option_group_item_id,
-    name: translateText(option.name, translationOriginal)
+    name: translateText(option.name, translationOriginal),
+    price: (_option$add_price = option.add_price) !== null && _option$add_price !== void 0 ? _option$add_price : option.price,
+    num: (_ref = (_option$num = option.num) !== null && _option$num !== void 0 ? _option$num : option.quantity) !== null && _ref !== void 0 ? _ref : 1
   });
 };
 var convertBundle = function convertBundle(bundle, translationOriginal) {
@@ -44,15 +66,8 @@ var convertBundle = function convertBundle(bundle, translationOriginal) {
     product_id: bundle.bundle_product_id,
     _bundle_product_id: bundle.bundle_product_id,
     product_variant_id: bundle.bundle_variant_id,
-    title: title,
-    name: title,
-    bundle_title: title,
-    num: bundle.num,
-    quantity: bundle.num,
-    price: price,
-    total: bundle.bundle_payment_price,
-    origin_total: bundle.bundle_selling_price,
-    original_total: bundle.bundle_selling_price,
+    total: bundle.bundle_selling_price,
+    origin_total: bundle.original_total,
     custom_price: bundle.custom_price,
     custom_price_type: bundle.custom_price_type,
     custom_price_type_ext: bundle.price_type_ext,
@@ -61,14 +76,51 @@ var convertBundle = function convertBundle(bundle, translationOriginal) {
     _origin: bundle
   });
 };
+
+/**
+ * 读取行级规格：优先 product_sku.option，回落 legacy product_option_item。
+ *
+ * @example
+ * resolveLineItemOptions({ product_sku: { option: [{ name: 'Large' }] } });
+ */
+var resolveLineItemOptions = function resolveLineItemOptions(product) {
+  var _product$product_sku;
+  var skuOptions = product === null || product === void 0 || (_product$product_sku = product.product_sku) === null || _product$product_sku === void 0 ? void 0 : _product$product_sku.option;
+  if (Array.isArray(skuOptions) && skuOptions.length > 0) {
+    return skuOptions;
+  }
+  if (Array.isArray(product === null || product === void 0 ? void 0 : product.product_option_item)) {
+    return product.product_option_item;
+  }
+  return [];
+};
+
+/**
+ * 将 OS 规格项映射为 CartSkuCard 可直接渲染的 options。
+ *
+ * @example
+ * mapLineItemOptions([{ name: 'Large', add_price: 1, num: 2 }], translateText);
+ */
+var mapLineItemOptions = function mapLineItemOptions(options, translationOriginal) {
+  return options.map(function (option) {
+    var _option$name, _option$add_price2, _ref2, _option$num2;
+    return _objectSpread(_objectSpread({}, option), {}, {
+      name: translateText((_option$name = option.name) !== null && _option$name !== void 0 ? _option$name : option.title, translationOriginal),
+      price: (_option$add_price2 = option.add_price) !== null && _option$add_price2 !== void 0 ? _option$add_price2 : option.price,
+      num: (_ref2 = (_option$num2 = option.num) !== null && _option$num2 !== void 0 ? _option$num2 : option.quantity) !== null && _ref2 !== void 0 ? _ref2 : 1
+    });
+  });
+};
 export var convertProductToLineItemProduct = function convertProductToLineItemProduct(product, translationOriginal, symbol) {
-  var _product$metadata, _ref, _product$num, _ref2, _product$num2, _product$metadata$sou, _product$metadata2, _product$payment_pric, _product$metadata3, _product$product_sku, _ref3, _product$num3;
+  var _product$metadata2, _ref3, _product$num, _ref4, _product$num2, _product$metadata3, _product$metadata4, _product$discount_lis, _product$discount_lis2, _product$metadata5, _product$metadata6, _ref5, _product$num3;
   var title = translateText(product.product_title || product.title, translationOriginal);
   var bundle = (product.product_bundle || []).map(function (bundleItem) {
     return convertBundle(bundleItem, translationOriginal);
   });
-  return {
-    _id: ((_product$metadata = product.metadata) === null || _product$metadata === void 0 ? void 0 : _product$metadata.unique_identification_number) || product.order_detail_id || product.product_id,
+  var lineOriginTotal = resolveLineOriginTotal(product);
+  var lineOptions = mapLineItemOptions(resolveLineItemOptions(product), translationOriginal);
+  var mapped = {
+    _id: ((_product$metadata2 = product.metadata) === null || _product$metadata2 === void 0 ? void 0 : _product$metadata2.unique_identification_number) || product.order_detail_id || product.product_id,
     id: product.product_id,
     product_id: product.product_id,
     product_variant_id: product.product_variant_id,
@@ -77,13 +129,13 @@ export var convertProductToLineItemProduct = function convertProductToLineItemPr
     name: title,
     cover: product.cover,
     image: product.cover,
-    num: (_ref = (_product$num = product.num) !== null && _product$num !== void 0 ? _product$num : product.product_quantity) !== null && _ref !== void 0 ? _ref : 1,
-    quantity: (_ref2 = (_product$num2 = product.num) !== null && _product$num2 !== void 0 ? _product$num2 : product.product_quantity) !== null && _ref2 !== void 0 ? _ref2 : 1,
-    price: (_product$metadata$sou = (_product$metadata2 = product.metadata) === null || _product$metadata2 === void 0 ? void 0 : _product$metadata2.source_product_price) !== null && _product$metadata$sou !== void 0 ? _product$metadata$sou : product.selling_price,
-    total: (_product$payment_pric = product.payment_price) !== null && _product$payment_pric !== void 0 ? _product$payment_pric : product.selling_price,
-    origin_total: product.original_price,
-    original_total: product.original_price,
-    source_product_price: (_product$metadata3 = product.metadata) === null || _product$metadata3 === void 0 ? void 0 : _product$metadata3.source_product_price,
+    num: (_ref3 = (_product$num = product.num) !== null && _product$num !== void 0 ? _product$num : product.product_quantity) !== null && _ref3 !== void 0 ? _ref3 : 1,
+    quantity: (_ref4 = (_product$num2 = product.num) !== null && _product$num2 !== void 0 ? _product$num2 : product.product_quantity) !== null && _ref4 !== void 0 ? _ref4 : 1,
+    price: (_product$metadata3 = product.metadata) === null || _product$metadata3 === void 0 ? void 0 : _product$metadata3.source_product_price,
+    total: product.selling_price,
+    origin_total: lineOriginTotal,
+    original_total: lineOriginTotal,
+    source_product_price: (_product$metadata4 = product.metadata) === null || _product$metadata4 === void 0 ? void 0 : _product$metadata4.source_product_price,
     selling_price: product.selling_price,
     payment_price: product.payment_price,
     tax_fee: product.tax_fee,
@@ -92,26 +144,32 @@ export var convertProductToLineItemProduct = function convertProductToLineItemPr
     product_sku: product.product_sku,
     product_bundle: bundle,
     bundle: bundle,
-    product_option_string: product.product_sku ? translateText(product.product_sku.subtitle, translationOriginal) : '',
+    product_option_string: product.product_option_string,
+    options: lineOptions,
     discount_list: product.discount_list,
     promotions: product.promotions,
-    isGift: Boolean(product.gift_card),
+    discount_reason: (_product$discount_lis = (_product$discount_lis2 = product.discount_list) === null || _product$discount_lis2 === void 0 || (_product$discount_lis2 = _product$discount_lis2.find(function (d) {
+      return (d === null || d === void 0 ? void 0 : d.type) === 'product';
+    })) === null || _product$discount_lis2 === void 0 || (_product$discount_lis2 = _product$discount_lis2.discount) === null || _product$discount_lis2 === void 0 ? void 0 : _product$discount_lis2.message) !== null && _product$discount_lis !== void 0 ? _product$discount_lis : (_product$metadata5 = product.metadata) === null || _product$metadata5 === void 0 ? void 0 : _product$metadata5.product_discount_reason,
+    // 促销赠品走 metadata._giftInfo；礼品卡走 gift_card（对齐 legacy formatProducts isGift）
+    isGift: Boolean(product.gift_card || product.isGift || product._isGiftPromotion || ((_product$metadata6 = product.metadata) === null || _product$metadata6 === void 0 ? void 0 : _product$metadata6._giftInfo) || product._giftInfo),
     giftData: product.giftData,
     _origin: product,
     _extend: {
       other: {
         product_id: product.product_id,
-        option: (_product$product_sku = product.product_sku) === null || _product$product_sku === void 0 ? void 0 : _product$product_sku.option,
+        option: lineOptions,
         bundle: product.product_bundle,
         product_variant_id: product.product_variant_id,
-        quantity: (_ref3 = (_product$num3 = product.num) !== null && _product$num3 !== void 0 ? _product$num3 : product.product_quantity) !== null && _ref3 !== void 0 ? _ref3 : 1
+        quantity: (_ref5 = (_product$num3 = product.num) !== null && _product$num3 !== void 0 ? _product$num3 : product.product_quantity) !== null && _ref5 !== void 0 ? _ref5 : 1
       },
       note: product.note,
-      total: product.payment_price,
-      origin_total: product.original_price,
+      total: product.selling_price,
+      origin_total: lineOriginTotal,
       payment_price: product.payment_price
     }
   };
+  return mapped;
 };
 var LineItem = function LineItem(props) {
   var _context$appHelper$ut, _context$appHelper$ut2, _context$appHelper$ut3, _context$appHelper$ut4, _dataSource$_extend2;
@@ -120,6 +178,7 @@ var LineItem = function LineItem(props) {
     itemType = props.itemType,
     _props$type = props.type,
     type = _props$type === void 0 ? 'a9' : _props$type,
+    isShowBookingHeader = props.isShowBookingHeader,
     _props$rightActions = props.rightActions,
     rightActions = _props$rightActions === void 0 ? [] : _props$rightActions,
     escapeDom = props.escapeDom,
@@ -143,6 +202,7 @@ var LineItem = function LineItem(props) {
     statusDisabled = _props$statusDisabled === void 0 ? false : _props$statusDisabled,
     _props$isShowRelatedP = props.isShowRelatedProduct,
     isShowRelatedProduct = _props$isShowRelatedP === void 0 ? true : _props$isShowRelatedP,
+    holderOptions = props.holderOptions,
     onBookingStatusChange = props.onBookingStatusChange,
     onAction = props.onAction,
     onDelete = props.onDelete,
@@ -190,6 +250,7 @@ var LineItem = function LineItem(props) {
     dataSource: dataSource,
     type: type,
     cartSkuType: type,
+    isShowBookingHeader: isShowBookingHeader,
     relatedProductDataSource: relatedProductDataSource,
     rightActions: rightActions,
     escapeDom: escapeDom,
@@ -203,6 +264,7 @@ var LineItem = function LineItem(props) {
     statusLoading: statusLoading,
     statusDisabled: statusDisabled,
     isShowRelatedProduct: isShowRelatedProduct,
+    holderOptions: holderOptions,
     onBookingStatusChange: onBookingStatusChange,
     onAction: onAction,
     onDelete: onDelete,

package/es/components/productCard/lineItem/index.less

@@ -18,10 +18,10 @@
   &__delete-btn {
     width: 34px;
     height: 34px;
-    border: 1px solid rgba(255, 255, 255, 0.35);
+    border: 1px solid var(--Gray-300, #d0d5dd);
     border-radius: 8px;
-    background: rgba(255, 255, 255, 0.12);
-    color: #fff;
+    background: var(--Gray-100, #f2f4f7);
+    color: var(--Gray-500, #667085);
     cursor: pointer;
     padding: 0;
     display: inline-flex;
@@ -33,6 +33,21 @@
       color: currentColor;
       font-size: 20px;
     }
+
+    &--inline {
+      width: auto;
+      height: auto;
+      border: none;
+      border-radius: 0;
+      background: transparent;
+      color: #667085;
+      padding: 10px;
+
+      > span {
+        color: currentColor;
+        font-size: 20px;
+      }
+    }
   }
 
   &__swipe-delete {
@@ -148,6 +163,28 @@
     padding: 8px;
   }
 
+  &__booking-detail--with-delete {
+    position: relative;
+
+    .pisell-line-item__booking-detail-content {
+      padding-right: 40px;
+    }
+
+    .pisell-line-item__delete-btn--inline {
+      position: absolute;
+      top: 0;
+      right: 0;
+    }
+  }
+
+  &__booking-detail-content {
+    min-width: 0;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+  }
+
   &__booking-field {
     min-width: 0;
   }

package/lib/components/buttonGroupPreview/index.js

@@ -71,7 +71,8 @@ var ButtonGroupPreview = (0, import_react.forwardRef)(
           } = items;
           const btnProps = { ...buttonProps, ...props.updateButtonProps };
           const { children, ...dropdownButtonProps } = btnProps;
-          return isMore ? /* @__PURE__ */ import_react.default.createElement(import_antd.Dropdown, { menu: { items: menuData }, trigger: ["click"] }, /* @__PURE__ */ import_react.default.createElement(import_button.default, { key: id, ...dropdownButtonProps }, children ?? /* @__PURE__ */ import_react.default.createElement(import_icons.MoreOutlined, null))) : /* @__PURE__ */ import_react.default.createElement(
+          const moreButtonChildren = children ?? (dropdownButtonProps.icon ? null : /* @__PURE__ */ import_react.default.createElement(import_icons.MoreOutlined, null));
+          return isMore ? /* @__PURE__ */ import_react.default.createElement(import_antd.Dropdown, { menu: { items: menuData }, trigger: ["click"] }, /* @__PURE__ */ import_react.default.createElement(import_button.default, { key: id, ...dropdownButtonProps }, moreButtonChildren)) : /* @__PURE__ */ import_react.default.createElement(
             import_button.default,
             {
               key: id,