@pisell/private-materials 6.8.76 → 6.8.77

package/es/components/kioskSkuDetail/index.js

@@ -1,10 +1,5 @@
 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 _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
@@ -18,14 +13,14 @@ 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, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import Decimal from 'decimal.js';
 import classNames from 'classnames';
 import { Button } from '@pisell/materials';
 import dayjs from 'dayjs';
 import { locales } from '@pisell/utils';
 import SKUOptionsSelection from "../../plus/skuOptionsSelection";
-// import PisellNumberSelector from '../../pro/pisellNumberSelector';
+import PisellNumberSelector from "../../pro/pisellNumberSelector";
 import useEngineContext from "../../hooks/useEngineContext";
 import { getProductDetail } from "../booking/info/service/serve";
 import localeTexts from "./locales";
@@ -39,9 +34,10 @@ import { request } from "../booking/utils";
  * - 底部用 PisellNumberSelector 做数量编辑
  */
 function KioskSkuDetail(props) {
-  var _ref, _context$appHelper, _context$engine, _context$appHelper2, _store$getState, _store$getState2, _store$getState3;
+  var _context$appHelper, _context$engine, _context$appHelper2, _store$getState, _store$getState2, _store$getState3;
   var className = props.className,
     style = props.style,
+    onBack = props.onBack,
     onAddToCart = props.onAddToCart;
 
   /**
@@ -53,7 +49,13 @@ function KioskSkuDetail(props) {
       keys: ['productId', 'product_id', 'id']
     });
   }, []);
-  var initialProductId = (_ref = productIdFromUrl !== null && productIdFromUrl !== void 0 ? productIdFromUrl : props.productId) !== null && _ref !== void 0 ? _ref : null;
+
+  /**
+   * @description 最终使用的商品 id
+   * - 以 URL 为准（方便 kiosk 场景通过路由跳转直接带参）
+   * - props.productId 作为兜底，兼容老用法
+   */
+  var resolvedProductId = productIdFromUrl !== null && productIdFromUrl !== void 0 ? productIdFromUrl : props.productId;
 
   /**
    * @description 目前 scheduleDate 暂时固定成“当天”
@@ -62,22 +64,33 @@ function KioskSkuDetail(props) {
   var scheduleDate = useMemo(function () {
     return dayjs().format('YYYY-MM-DD');
   }, []);
-  var stageScale = useDesignStageScale({
-    designWidth: 1080,
-    designHeight: 1800
-  });
   var context = useEngineContext();
-  var _ref2 = ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.utils) || {},
-    interaction = _ref2.interaction;
+  var _ref = ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.utils) || {},
+    interaction = _ref.interaction;
   locales.init(localeTexts, (context === null || context === void 0 || (_context$engine = context.engine) === null || _context$engine === void 0 || (_context$engine = _context$engine.props) === null || _context$engine === void 0 ? void 0 : _context$engine.locale) || 'en');
   request.setRequest(context.appHelper.utils.request);
-  var _ref3 = ((_context$appHelper2 = context.appHelper) === null || _context$appHelper2 === void 0 ? void 0 : _context$appHelper2.utils) || {},
-    store = _ref3.store,
-    getData = _ref3.getData,
-    Toast = _ref3.Toast;
+  var _ref2 = ((_context$appHelper2 = context.appHelper) === null || _context$appHelper2 === void 0 ? void 0 : _context$appHelper2.utils) || {},
+    store = _ref2.store,
+    getData = _ref2.getData;
   var state = store === null || store === void 0 || (_store$getState = store.getState) === null || _store$getState === void 0 ? void 0 : _store$getState.call(store);
   var symbol = (store === null || store === void 0 || (_store$getState2 = store.getState) === null || _store$getState2 === void 0 || (_store$getState2 = _store$getState2.call(store)) === null || _store$getState2 === void 0 || (_store$getState2 = _store$getState2.global) === null || _store$getState2 === void 0 ? void 0 : _store$getState2.symbol) || '$';
   var currency_code = (store === null || store === void 0 || (_store$getState3 = store.getState) === null || _store$getState3 === void 0 || (_store$getState3 = _store$getState3.call(store)) === null || _store$getState3 === void 0 || (_store$getState3 = _store$getState3.global) === null || _store$getState3 === void 0 ? void 0 : _store$getState3.currency_code) || 'AUD';
+  useEffect(function () {
+    var _interaction$utils, _interaction$utils$po;
+    // 通知原生初始化
+    interaction === null || interaction === void 0 || (_interaction$utils = interaction.utils) === null || _interaction$utils === void 0 || (_interaction$utils$po = _interaction$utils.postMessageToApp) === null || _interaction$utils$po === void 0 || _interaction$utils$po.call(_interaction$utils, {
+      module: 'tickets',
+      key: 'page_load'
+    });
+    // 原生初始化调用-新购流程
+    interaction.utils.mountFunction('tickets', 'restore_buy_wallet_pass', function (data) {
+      console.log('重置状态', data);
+    });
+    // 原生初始化调用-购物车编辑
+    interaction.utils.mountFunction('tickets', 'edit_buy_wallet_pass', function (data) {
+      console.log('编辑状态', data);
+    });
+  }, []);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isLoading = _useState2[0],
@@ -112,193 +125,90 @@ function KioskSkuDetail(props) {
     _useState12 = _slicedToArray(_useState11, 2),
     skuDefaultValue = _useState12[0],
     setSkuDefaultValue = _useState12[1];
-  var _useState13 = useState(false),
-    _useState14 = _slicedToArray(_useState13, 2),
-    isEdit = _useState14[0],
-    setIsEdit = _useState14[1];
-  var skuOptionsSelectionRef = useRef(null);
-  /**
-   * @description 防止“原生多次初始化/快速切换”导致请求乱序覆盖
-   */
-  var requestSeqRef = useRef(0);
-  var resetForInit = useCallback(function () {
-    setProductData(null);
-    setErrorText(null);
-    setQuantity(1);
-    setSkuValue({
-      product_id: 0,
-      product_variant_id: 0,
-      bundle: [],
-      option: []
-    });
-    setSkuDefaultValue({
-      product_id: 0,
-      product_variant_id: 0,
-      bundle: [],
-      option: []
-    });
-  }, []);
-  var loadByProductId = useCallback( /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(productId) {
-      var options,
-        reqId,
-        open_deposit,
-        _params,
-        res,
-        apiData,
-        normalizedProductId,
-        minNumUnit,
-        defaultVariantId,
-        initialSkuValue,
-        _args = arguments;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            options = _args.length > 1 && _args[1] !== undefined ? _args[1] : {};
-            console.log('准备 load', productId);
-            if (!(productId === null || typeof productId === 'undefined' || productId === '')) {
-              _context.next = 4;
-              break;
-            }
-            return _context.abrupt("return");
-          case 4:
-            reqId = ++requestSeqRef.current;
-            setIsLoading(true);
-            setErrorText(null);
-            _context.prev = 7;
-            open_deposit = (getData === null || getData === void 0 ? void 0 : getData('bookingv2_deposit')) || 0;
-            _params = {
-              open_deposit: open_deposit
-            };
-            _params.schedule_date = scheduleDate;
-            _context.next = 13;
-            return getProductDetail(String(productId), _params);
-          case 13:
-            res = _context.sent;
-            console.log('详情接口');
-            console.log(JSON.stringify(res));
-            apiData = (res !== null && res !== void 0 && res.id ? res : res === null || res === void 0 ? void 0 : res.data) || {};
-            if (!(reqId !== requestSeqRef.current)) {
-              _context.next = 19;
-              break;
-            }
-            return _context.abrupt("return");
-          case 19:
-            setProductData(apiData);
-            console.log('已设置 productData');
-            normalizedProductId = Number((apiData === null || apiData === void 0 ? void 0 : apiData.product_id) || (apiData === null || apiData === void 0 ? void 0 : apiData.id) || productId || 0);
-            minNumUnit = Number((apiData === null || apiData === void 0 ? void 0 : apiData.min_num_unit) || 1);
-            if (options.shouldInitQuantity !== false) {
+  useEffect(function () {
+    var isCancelled = false;
+    function load() {
+      return _load.apply(this, arguments);
+    }
+    function _load() {
+      _load = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+        var open_deposit, _params, res, apiData, normalizedProductId, minNumUnit, initialSkuValue;
+        return _regeneratorRuntime().wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              if (resolvedProductId) {
+                _context.next = 2;
+                break;
+              }
+              return _context.abrupt("return");
+            case 2:
+              setIsLoading(true);
+              setErrorText(null);
+              _context.prev = 4;
+              open_deposit = (getData === null || getData === void 0 ? void 0 : getData('bookingv2_deposit')) || 0;
+              _params = {
+                open_deposit: open_deposit
+              };
+              _params.schedule_date = scheduleDate;
+              _context.next = 10;
+              return getProductDetail(String(resolvedProductId), _params);
+            case 10:
+              res = _context.sent;
+              apiData = (res === null || res === void 0 ? void 0 : res.data) || {};
+              if (!isCancelled) {
+                _context.next = 14;
+                break;
+              }
+              return _context.abrupt("return");
+            case 14:
+              setProductData(apiData);
+              normalizedProductId = Number((apiData === null || apiData === void 0 ? void 0 : apiData.product_id) || (apiData === null || apiData === void 0 ? void 0 : apiData.id) || resolvedProductId || 0);
+              minNumUnit = Number((apiData === null || apiData === void 0 ? void 0 : apiData.min_num_unit) || 1);
               setQuantity(minNumUnit > 0 ? minNumUnit : 1);
-            }
-
-            /**
-             * @description 默认选中第一个 variant（如果接口返回了 variant 且有数据）
-             * 注意：本组件内部用 variant 的 `id` 来匹配 `skuValue.product_variant_id`
-             */
-            defaultVariantId = function (_apiData$variant) {
-              var firstVariantId = Array.isArray(apiData === null || apiData === void 0 ? void 0 : apiData.variant) ? Number((apiData === null || apiData === void 0 || (_apiData$variant = apiData.variant) === null || _apiData$variant === void 0 || (_apiData$variant = _apiData$variant[0]) === null || _apiData$variant === void 0 ? void 0 : _apiData$variant.id) || 0) : 0;
-              return Number.isFinite(firstVariantId) ? firstVariantId : 0;
-            }();
-            initialSkuValue = {
-              product_id: normalizedProductId,
-              product_variant_id: defaultVariantId,
-              bundle: [],
-              option: []
-            };
-            if (options.shouldInitSku !== false) {
+              initialSkuValue = {
+                product_id: normalizedProductId,
+                product_variant_id: 0,
+                bundle: [],
+                option: []
+              };
               setSkuValue(initialSkuValue);
               setSkuDefaultValue(initialSkuValue);
-              setTimeout(function () {
-                if (initialSkuValue.product_variant_id) {
-                  var _skuOptionsSelectionR;
-                  (_skuOptionsSelectionR = skuOptionsSelectionRef.current) === null || _skuOptionsSelectionR === void 0 || _skuOptionsSelectionR.validate();
-                }
-              }, 0);
-            }
-            _context.next = 33;
-            break;
-          case 29:
-            _context.prev = 29;
-            _context.t0 = _context["catch"](7);
-            console.error(_context.t0);
-            setErrorText('Failed to load product detail');
-          case 33:
-            _context.prev = 33;
-            if (!(reqId !== requestSeqRef.current)) {
-              _context.next = 36;
+              _context.next = 29;
               break;
-            }
-            return _context.abrupt("return");
-          case 36:
-            setIsLoading(false);
-            return _context.finish(33);
-          case 38:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee, null, [[7, 29, 33, 38]]);
-    }));
-    return function (_x) {
-      return _ref4.apply(this, arguments);
+            case 23:
+              _context.prev = 23;
+              _context.t0 = _context["catch"](4);
+              console.error(_context.t0);
+              if (!isCancelled) {
+                _context.next = 28;
+                break;
+              }
+              return _context.abrupt("return");
+            case 28:
+              setErrorText('Failed to load product detail');
+            case 29:
+              _context.prev = 29;
+              if (!isCancelled) {
+                _context.next = 32;
+                break;
+              }
+              return _context.abrupt("return");
+            case 32:
+              setIsLoading(false);
+              return _context.finish(29);
+            case 34:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[4, 23, 29, 34]]);
+      }));
+      return _load.apply(this, arguments);
+    }
+    load();
+    return function () {
+      isCancelled = true;
     };
-  }(), [getData, scheduleDate]);
-
-  // 避免 mountFunction 回调捕获旧的 loadByProductId（不用额外 useEffect）
-  var loadRef = useRef(loadByProductId);
-  loadRef.current = loadByProductId;
-  useEffect(function () {
-    var _interaction$utils, _interaction$utils$po, _interaction$utils2, _interaction$utils2$m, _interaction$utils3, _interaction$utils3$m;
-    // 通知原生初始化
-    interaction === null || interaction === void 0 || (_interaction$utils = interaction.utils) === null || _interaction$utils === void 0 || (_interaction$utils$po = _interaction$utils.postMessageToApp) === null || _interaction$utils$po === void 0 || _interaction$utils$po.call(_interaction$utils, {
-      module: 'wallet_pass',
-      key: 'page_load'
-    });
-    // 原生初始化调用-新购流程
-    interaction === null || interaction === void 0 || (_interaction$utils2 = interaction.utils) === null || _interaction$utils2 === void 0 || (_interaction$utils2$m = _interaction$utils2.mountFunction) === null || _interaction$utils2$m === void 0 || _interaction$utils2$m.call(_interaction$utils2, 'wallet_pass', 'restore_buy_wallet_pass', function (id) {
-      console.log('重置状态', id);
-      console.log('宽', window.innerWidth);
-      console.log('高', window.innerHeight);
-      console.log('设备像素比', window.devicePixelRatio);
-      // 原生会预渲染页面，真正展示时再调用这里；该方法可能被多次调用
-      resetForInit();
-
-      // 原生回调入参就是 productId：直接触发加载（不走“state→effect”链）
-      if (id || id === 0) loadRef.current(id);
-      setIsEdit(false);
-    });
-    // 原生初始化调用-购物车编辑
-    interaction === null || interaction === void 0 || (_interaction$utils3 = interaction.utils) === null || _interaction$utils3 === void 0 || (_interaction$utils3$m = _interaction$utils3.mountFunction) === null || _interaction$utils3$m === void 0 || _interaction$utils3$m.call(_interaction$utils3, 'wallet_pass', 'edit_buy_wallet_pass', function (data) {
-      console.log('编辑状态', data);
-      var productData = JSON.parse(data);
-      /**
-       * @description 编辑态原生只会触发 edit_buy_wallet_pass
-       * - 这里需要主动 load 一次拿到最新详情（尤其是 variant 列表/价格）
-       * - 但不能覆盖原生传入的 variantId / quantity
-       */
-      setProductData(productData.productDetail);
-      loadRef.current(productData.productDetail.id, {
-        shouldInitSku: false,
-        shouldInitQuantity: false
-      });
-      setSkuValue({
-        product_id: productData.productDetail.id,
-        product_variant_id: Number(productData.variantId),
-        bundle: [],
-        option: []
-      });
-      setSkuDefaultValue({
-        product_id: productData.productDetail.id,
-        product_variant_id: Number(productData.variantId),
-        bundle: [],
-        option: []
-      });
-      setIsEdit(true);
-    });
-
-    // URL 有 productId：挂载时只加载一次
-    if (initialProductId || initialProductId === 0) loadRef.current(initialProductId);
-  }, []);
+  }, [getData, resolvedProductId, scheduleDate]);
   var coverUrl = useMemo(function () {
     return (productData === null || productData === void 0 ? void 0 : productData.cover) || (productData === null || productData === void 0 ? void 0 : productData.image) || '';
   }, [productData]);
@@ -353,50 +263,65 @@ function KioskSkuDetail(props) {
     return "".concat(priceSign).concat(symbol).concat(deTotal.abs().toNumber().toFixed(2));
   }, [itemTotal, symbol]);
   var handleAddToCart = function handleAddToCart() {
-    var _skuOptionsSelectionR2;
     if (!productData) return;
-    (_skuOptionsSelectionR2 = skuOptionsSelectionRef.current) === null || _skuOptionsSelectionR2 === void 0 || _skuOptionsSelectionR2.validate();
-    if (!skuValue.product_variant_id) {
-      Toast.info(locales.getText('pisell2.text.kiosk.sku.detail.toast.select.variant'));
-      return;
-    }
-    ;
+    // onAddToCart?.({
+    //   product: productData,
+    //   skuValue,
+    //   quantity,
+    //   unitPrice,
+    //   total: itemTotal,
+    //   currencySymbol: symbol,
+    //   bookingConfig: state?.bookingConfig,
+    // });
+    var productBundle = [];
+    skuValue.bundle.forEach(function (item) {
+      if (!item.num || item.num < 1) return;
+      var targetBundleData;
+      var bundle_group_id;
+      for (var i = 0; i < productData.bundle_group.length; i++) {
+        var _productData$bundle_g = productData.bundle_group[i],
+          id = _productData$bundle_g.id,
+          _productData$bundle_g2 = _productData$bundle_g.bundle_item,
+          bundle_item = _productData$bundle_g2 === void 0 ? [] : _productData$bundle_g2;
+        for (var j = 0; j < bundle_item.length; j++) {
+          if (item.id === bundle_item[j].bundle_product_id) {
+            bundle_group_id = id;
+            targetBundleData = bundle_item[j];
+            break;
+          }
+        }
+      }
+      productBundle.push({
+        bundle_group_id: bundle_group_id,
+        bundle_id: targetBundleData.id,
+        bundle_product_id: item.id,
+        bundle_variant_id: targetBundleData.bundle_variant_id,
+        num: item.num,
+        extension_id: targetBundleData.extension_id,
+        extension_type: targetBundleData.extension_type
+      });
+    });
+    productData.option_group = [];
+    productData.variant_group = [];
     var obj = {
       productDetail: productData,
       quantity: quantity,
-      variantId: skuValue.product_variant_id,
       pricePerUnit: unitPrice,
-      isWebBuyWalletPass: true
+      bundlePrice: productData.price,
+      productBundle: productBundle
     };
     interaction.utils.postMessageToApp({
-      module: 'wallet_pass',
+      module: 'tickets',
       key: 'buy_wallet_pass',
       data: {
         // 把洗好的数据放这里
-        productData: obj,
-        isEdit: isEdit
+        productData: [obj]
       }
     });
   };
-  var onBack = function onBack() {
-    interaction.utils.postMessageToApp({
-      module: "wallet_pass",
-      key: "back"
-    });
-  };
-  var stageStyle = useMemo(function () {
-    return _objectSpread(_objectSpread({}, style || {}), {}, {
-      width: 1080,
-      height: 1800,
-      transform: "translateX(-50%) scale(".concat(stageScale, ")"),
-      transformOrigin: 'top center'
-    });
-  }, [stageScale, style]);
   return /*#__PURE__*/React.createElement("div", {
-    className: "pisell-kiosk-sku-detail-viewport"
-  }, /*#__PURE__*/React.createElement("div", {
     className: classNames('pisell-kiosk-sku-detail', className),
-    style: stageStyle
+    style: style
   }, /*#__PURE__*/React.createElement("div", {
     className: "pisell-kiosk-sku-detail__content"
   }, /*#__PURE__*/React.createElement("div", {
@@ -424,8 +349,7 @@ function KioskSkuDetail(props) {
     className: "pisell-kiosk-sku-detail__error"
   }, errorText)), /*#__PURE__*/React.createElement("div", {
     className: "pisell-kiosk-sku-detail__options-card"
-  }, productData && Array.isArray(productData === null || productData === void 0 ? void 0 : productData.variant) && productData.variant.length > 0 ? /*#__PURE__*/React.createElement(SKUOptionsSelection, {
-    ref: skuOptionsSelectionRef,
+  }, productData ? /*#__PURE__*/React.createElement(SKUOptionsSelection, {
     dataSource: productData,
     value: skuDefaultValue,
     skuCardConfig: {
@@ -450,13 +374,27 @@ function KioskSkuDetail(props) {
     className: "pisell-kiosk-sku-detail__footer-center"
   }, /*#__PURE__*/React.createElement("div", {
     className: "pisell-kiosk-sku-detail__item-total"
-  }, locales.getText('pisell2.text.kiosk.sku.detail.item.total'), ":", ' ', itemTotalText)), /*#__PURE__*/React.createElement(Button, {
+  }, locales.getText('pisell2.text.kiosk.sku.detail.item.total'), ":", ' ', itemTotalText), /*#__PURE__*/React.createElement("div", {
+    className: "pisell-kiosk-sku-detail__qty"
+  }, /*#__PURE__*/React.createElement(PisellNumberSelector, {
+    value: quantity,
+    width: "140px",
+    onChange: function onChange(v) {
+      if (!v) return;
+      setQuantity(v);
+    },
+    min: 1,
+    max: 99999,
+    step: 1,
+    size: "large",
+    enablePriceAdjust: false
+  }))), /*#__PURE__*/React.createElement(Button, {
     type: "primary",
     className: "pisell-kiosk-sku-detail__add-btn",
     size: "large",
     onClick: handleAddToCart,
     disabled: !productData || isLoading
-  }, locales.getText(isEdit ? 'pisell2.text.kiosk.sku.detail.btn.update' : 'pisell2.text.kiosk.sku.detail.btn.add.to.cart')))));
+  }, locales.getText('pisell2.text.kiosk.sku.detail.btn.add.to.cart'))));
 }
 export default KioskSkuDetail;
 
@@ -495,35 +433,4 @@ function getQueryFirstMatch(params) {
   var queryIndex = hash.indexOf('?');
   if (queryIndex === -1) return null;
   return tryRead(hash.slice(queryIndex + 1));
-}
-
-/**
- * @description 按设计稿基准尺寸（默认 1080x1800）计算页面缩放比例
- * - scale = min(viewportW/designW, viewportH/designH, 1)
- */
-function useDesignStageScale(params) {
-  var designWidth = params.designWidth;
-  var designHeight = params.designHeight;
-  var _useState15 = useState(1),
-    _useState16 = _slicedToArray(_useState15, 2),
-    scale = _useState16[0],
-    setScale = _useState16[1];
-  useEffect(function () {
-    var update = function update() {
-      var viewportWidth = window.innerWidth || designWidth;
-      var viewportHeight = window.innerHeight || designHeight;
-      var nextScale = Math.min(viewportWidth / designWidth, viewportHeight / designHeight, 1);
-      setScale(nextScale);
-    };
-    update();
-    window.addEventListener('resize', update);
-    return function () {
-      return window.removeEventListener('resize', update);
-    };
-  }, [designHeight, designWidth]);
-  return scale;
-}
-
-/**
- * @description 从原生回调 payload 中提取 productId
- */
+}

package/es/components/kioskSkuDetail/index.less

@@ -1,17 +1,7 @@
-.pisell-kiosk-sku-detail-viewport {
+.pisell-kiosk-sku-detail {
   position: relative;
-  width: 100vw;
+  width: 100%;
   height: 100vh;
-  overflow: hidden;
-  background: #f2f4f7;
-}
-
-.pisell-kiosk-sku-detail {
-  position: absolute;
-  top: 0;
-  left: 50%;
-  width: 1080px;
-  height: 1800px;
   overflow-y: auto;
   background: #f2f4f7;
   background-size: cover;
@@ -21,40 +11,12 @@
 }
 
 .pisell-kiosk-sku-detail__content {
-  width: 100%;
+  max-width: 1000px;
   margin: 0 auto;
   display: flex;
   flex-direction: column;
   gap: 40px;
   padding-bottom: 220px; // avoid overlap with footer
-  .pisell-pro-selector_header-content {
-    .pisell-pro-selector_header-content-title {
-      color: #101828;
-      font-size: 36px !important;
-    }
-    .pisell-lowcode-tag {
-      font-size: 22px !important;
-      margin-left: 20px !important;
-      padding-top: 5px !important;
-      padding-bottom: 5px !important;
-    }
-  }
-  .pisell-pro-selector_tip {
-    font-size: 36px !important;
-    color: #667085;
-  }
-  .pisell-sku-options-selection-variant-card__title {
-    font-size: 36px !important;
-    font-weight: 600 !important;
-    color: #101828;
-  }
-  .pisell-sku-options-selection-variant-card__price {
-    font-size: 30px !important;
-  }
-  .pisell-sku-options-selection-variant-card {
-    padding-top: 30px !important;
-    padding-bottom: 30px !important;
-  }
 }
 
 .pisell-kiosk-sku-detail__hero {
@@ -93,6 +55,7 @@
 }
 
 .pisell-kiosk-sku-detail__desc {
+  max-width: 860px;
   font-size: 36px;
   line-height: 44px;
   font-weight: 400;
@@ -128,13 +91,11 @@
 }
 
 .pisell-kiosk-sku-detail__footer {
-  // 注意：父容器有 transform(scale)，fixed 会相对该容器定位（适配小分辨率缩放舞台）
   position: fixed;
-  left: 30px;
-  right: 30px;
+  left: 50%;
   bottom: 30px;
-  transform: none;
-  width: auto;
+  transform: translateX(-50%);
+  width: min(1020px, calc(100% - 60px));
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -164,9 +125,6 @@
   display: flex;
   align-items: center;
   gap: 20px;
-  // 靠右，并与右侧主按钮保持 20px 间距
-  margin-left: auto;
-  margin-right: 20px;
 }
 
 .pisell-kiosk-sku-detail__item-total {

package/es/components/kioskSkuDetail/locales.d.ts

@@ -3,25 +3,19 @@ declare const _default: {
         'pisell2.text.kiosk.sku.detail.btn.back': string;
         'pisell2.text.kiosk.sku.detail.item.total': string;
         'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
-        'pisell2.text.kiosk.sku.detail.btn.update': string;
         'pisell2.text.kiosk.sku.detail.loading.options': string;
-        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
     };
     'zh-CN': {
         'pisell2.text.kiosk.sku.detail.btn.back': string;
         'pisell2.text.kiosk.sku.detail.item.total': string;
         'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
-        'pisell2.text.kiosk.sku.detail.btn.update': string;
         'pisell2.text.kiosk.sku.detail.loading.options': string;
-        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
     };
     'zh-TW': {
         'pisell2.text.kiosk.sku.detail.btn.back': string;
         'pisell2.text.kiosk.sku.detail.item.total': string;
         'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
-        'pisell2.text.kiosk.sku.detail.btn.update': string;
         'pisell2.text.kiosk.sku.detail.loading.options': string;
-        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
     };
 };
 export default _default;