@pisell/private-materials 6.5.12 → 6.5.14

package/lib/components/ticketBooking/components/ProductDisplayAdapter/ProductDisplayAdapter.js

@@ -0,0 +1,165 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ticketBooking/components/ProductDisplayAdapter/ProductDisplayAdapter.tsx
+var ProductDisplayAdapter_exports = {};
+__export(ProductDisplayAdapter_exports, {
+  default: () => ProductDisplayAdapter_default
+});
+module.exports = __toCommonJS(ProductDisplayAdapter_exports);
+var import_react = __toESM(require("react"));
+var import_ahooks = require("ahooks");
+var import_productSelect = __toESM(require("../../../../plus/productSelect"));
+var import_List = __toESM(require("../../../list/List"));
+var import_SkuCard = __toESM(require("../../../../plus/productSelect/ProductCard/SkuCard"));
+var import_utils = require("./utils");
+var import_index = require("./index.less");
+var ProductDisplayAdapter = (props) => {
+  const {
+    config,
+    dataSource,
+    loading = false,
+    currentProductId,
+    onSelectProduct,
+    emptyDescription,
+    style,
+    className
+  } = props;
+  const { displayMode = "product-select" } = config;
+  const listRef = (0, import_react.useRef)(null);
+  const size = (0, import_ahooks.useSize)(listRef);
+  const renderProductSelect = (0, import_react.useMemo)(() => {
+    const {
+      showSearch = true,
+      showTab = true,
+      layout = { grid: true, config: "12:12" },
+      productListSetting = {
+        isProductCover: 1,
+        isTitle: 1,
+        isSubtitle: 1,
+        isPrice: 1,
+        isOriginPrice: 0,
+        isStock: 0
+      }
+    } = config.productSelectConfig || {};
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_productSelect.default,
+      {
+        dataSource,
+        layout,
+        onChange: onSelectProduct,
+        value: currentProductId,
+        loading,
+        productListSetting,
+        showSearch,
+        showTab,
+        emptyDescription,
+        style
+      }
+    );
+  }, [
+    config.productSelectConfig,
+    dataSource,
+    currentProductId,
+    onSelectProduct,
+    loading,
+    emptyDescription,
+    style
+  ]);
+  const renderSkuList = (0, import_react.useMemo)(() => {
+    const { listConfig = {}, skuCardAllConfig = {} } = config.skuListConfig || {};
+    const displayStyle = listConfig.layout || "grid";
+    const columns = listConfig.columns || 2;
+    const paginationType = listConfig.showPagination ? "pager" : "all";
+    const enableTab = listConfig.showTab || false;
+    const tabStyle = listConfig.tabStyle || "switch";
+    const stickyTop = listConfig.stickyTop !== void 0 ? listConfig.stickyTop : true;
+    const tabData = enableTab ? (0, import_utils.generateProductTabs)(dataSource, tabStyle) : void 0;
+    const filteredData = dataSource.map((item) => {
+      var _a, _b;
+      return {
+        ...item,
+        category: ((_b = (_a = item.category) == null ? void 0 : _a.map) == null ? void 0 : _b.call(_a, (category) => `${category.id}`)) || []
+      };
+    });
+    return /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: `sku-list-container ${className || ""}`,
+        style,
+        ref: listRef
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_List.default,
+        {
+          className: "sku-list",
+          style: { maxHeight: size == null ? void 0 : size.height, overflow: "auto" },
+          data: filteredData,
+          loading,
+          displayStyle,
+          columns,
+          paginationType,
+          layoutDirection: "vertical",
+          tabStyle: enableTab ? tabStyle : "none",
+          tabData,
+          tabGroup: "category",
+          stickyTop,
+          emptyConfig: {
+            show: !loading && filteredData.length === 0,
+            text: emptyDescription
+          },
+          renderItem: (item, index) => /* @__PURE__ */ import_react.default.createElement(
+            import_SkuCard.default,
+            {
+              key: item.id,
+              ...skuCardAllConfig,
+              dataSource: (0, import_utils.formatSkuDataSource)(item),
+              onCardClick: () => onSelectProduct(item),
+              isSelected: item.id === currentProductId
+            }
+          )
+        }
+      )
+    );
+  }, [
+    config.skuListConfig,
+    dataSource,
+    loading,
+    currentProductId,
+    onSelectProduct,
+    emptyDescription,
+    style,
+    className,
+    size == null ? void 0 : size.height
+  ]);
+  if (displayMode === "sku-list") {
+    return renderSkuList;
+  }
+  return renderProductSelect;
+};
+var ProductDisplayAdapter_default = ProductDisplayAdapter;

package/lib/components/ticketBooking/components/ProductDisplayAdapter/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * ProductDisplayAdapter 产品展示适配器
+ * 支持通过配置化方式在 ProductSelect 和 SkuList 两种展示模式之间切换
+ */
+export { default } from './ProductDisplayAdapter';
+export type { ProductDisplayConfig, ProductDisplayPresetKey, ProductSelectConfig, ProductSelectLayout, ProductListSetting, SkuListConfig, SkuCardDisplayMode, ListConfig, ListLayoutType, DisplayMode, } from './types';
+export { ProductDisplayPresets, LegacyProductDisplayPresets, resolveProductDisplayConfig, } from './types';

package/lib/components/ticketBooking/components/ProductDisplayAdapter/index.js

@@ -0,0 +1,45 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ticketBooking/components/ProductDisplayAdapter/index.tsx
+var ProductDisplayAdapter_exports = {};
+__export(ProductDisplayAdapter_exports, {
+  LegacyProductDisplayPresets: () => import_types.LegacyProductDisplayPresets,
+  ProductDisplayPresets: () => import_types.ProductDisplayPresets,
+  default: () => import_ProductDisplayAdapter.default,
+  resolveProductDisplayConfig: () => import_types.resolveProductDisplayConfig
+});
+module.exports = __toCommonJS(ProductDisplayAdapter_exports);
+var import_ProductDisplayAdapter = __toESM(require("./ProductDisplayAdapter"));
+var import_types = require("./types");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LegacyProductDisplayPresets,
+  ProductDisplayPresets,
+  resolveProductDisplayConfig
+});

package/lib/components/ticketBooking/components/ProductDisplayAdapter/index.less

@@ -0,0 +1,41 @@
+.sku-list-container {
+  height: 100%;
+  background-color: #4e4e4e;
+  .sku-list {
+    background-color: #4e4e4e;
+    overflow: auto;
+    border-radius: 0;
+    .list-group-items {
+      .list-item {
+        height: 100% !important;
+        .pisell-product-sku__card-wrapper {
+          height: 100% ;
+          .pisell-lowcode-card {
+            height: 100% !important;
+          }
+        }
+      }
+    }
+    &::-webkit-scrollbar {
+      display: none;
+      width: 0;
+      height: 0;
+    }
+  }
+  .list-content {
+    &::-webkit-scrollbar {
+      display: none;
+      width: 0;
+      height: 0;
+    }
+  }
+  .pisell-list-header {
+    overflow: auto;
+
+    &::-webkit-scrollbar {
+      display: none;
+      width: 0;
+      height: 0;
+    }
+  }
+}

package/lib/components/ticketBooking/components/ProductDisplayAdapter/types.d.ts

@@ -0,0 +1,115 @@
+/**
+ * 产品展示配置类型定义
+ */
+import type { ProductCardConfig } from '../../../../plus/productSelect/ProductCard/SkuCard/type';
+/** 预设配置的字符串键 */
+export declare type ProductDisplayPresetKey = 'product-select' | 'sku-list-a1' | 'sku-list-a2' | 'sku-list-a5' | 'default';
+/** ProductSelect 布局配置 */
+export interface ProductSelectLayout {
+    grid: boolean;
+    config: string;
+}
+export declare type NumberBoolean = 0 | 1;
+/** ProductSelect 列表设置 */
+export interface ProductListSetting {
+    /** 是否显示产品封面 */
+    isProductCover?: NumberBoolean;
+    /** 是否显示标题 */
+    isTitle?: NumberBoolean;
+    /** 是否显示副标题 */
+    isSubtitle?: NumberBoolean;
+    /** 是否显示价格 */
+    isPrice?: NumberBoolean;
+    /** 是否显示原价 */
+    isOriginPrice?: NumberBoolean;
+    /** 是否显示库存 */
+    isStock?: NumberBoolean;
+}
+/** ProductSelect 模式配置 */
+export interface ProductSelectConfig {
+    /** 是否显示搜索框 */
+    showSearch?: boolean;
+    /** 是否显示分类Tab */
+    showTab?: boolean;
+    /** 布局配置 */
+    layout?: ProductSelectLayout;
+    /** 产品列表设置 */
+    productListSetting?: ProductListSetting;
+}
+/** SkuCard 显示模式 */
+export declare type SkuCardDisplayMode = 'display_a1' | 'display_a2' | 'display_a5' | 'display_a9' | 'display_custom';
+/**
+ * SkuCard 配置
+ * 直接使用 ProductCardConfig 类型，保持类型同步
+ *
+ * @see packages/private-materials/src/plus/productSelect/ProductCard/SkuCard/type.ts ProductCardConfig
+ */
+export declare type SkuCardAllConfig = ProductCardConfig;
+/** List 布局类型 */
+export declare type ListLayoutType = 'grid' | 'list';
+/** Tab 样式类型 */
+export declare type TabStyleType = 'switch' | 'anchor' | 'none';
+/** List 组件配置 */
+export interface ListConfig {
+    /** 布局类型 */
+    layout?: ListLayoutType;
+    /** 列数 */
+    columns?: number;
+    /** 是否显示分页 */
+    showPagination?: boolean;
+    /** 是否显示Tab */
+    showTab?: boolean;
+    /** Tab 样式类型：switch-切换模式，anchor-锚点模式，none-不显示 */
+    tabStyle?: TabStyleType;
+    /** Tab 是否吸顶 */
+    stickyTop?: boolean;
+    /** Tab配置 */
+    tabConfig?: any;
+    /** 分页配置 */
+    paginationConfig?: any;
+    [key: string]: any;
+}
+/** SkuList 模式配置 */
+export interface SkuListConfig {
+    /** List 组件配置 */
+    listConfig?: ListConfig;
+    /** SkuCard 配置 */
+    skuCardAllConfig?: SkuCardAllConfig;
+}
+/** 展示模式类型 */
+export declare type DisplayMode = 'product-select' | 'sku-list';
+/**
+ * 产品展示配置
+ * 用于配置化控制产品展示的方式
+ */
+export interface ProductDisplayConfig {
+    /** 展示模式 */
+    displayMode: DisplayMode;
+    /** ProductSelect 模式配置 */
+    productSelectConfig?: ProductSelectConfig;
+    /** SkuList 模式配置 */
+    skuListConfig?: SkuListConfig;
+}
+/**
+ * 产品展示配置预设
+ * 支持通过字符串键或直接使用配置对象
+ */
+export declare const ProductDisplayPresets: Record<ProductDisplayPresetKey, ProductDisplayConfig>;
+/**
+ * 兼容性：保持原有的导出方式
+ * @deprecated 建议使用 ProductDisplayPresets['product-select'] 或字符串键访问
+ */
+export declare const LegacyProductDisplayPresets: {
+    /** @deprecated 使用 ProductDisplayPresets['product-select'] */
+    DEFAULT_PRODUCT_SELECT: ProductDisplayConfig;
+    /** @deprecated 使用 ProductDisplayPresets['sku-list-a1'] */
+    DEFAULT_SKU_LIST_A1: ProductDisplayConfig;
+    /** @deprecated 使用 ProductDisplayPresets['sku-list-a2'] */
+    DEFAULT_SKU_LIST_A2: ProductDisplayConfig;
+    /** @deprecated 使用 ProductDisplayPresets['sku-list-a5'] */
+    DEFAULT_SKU_LIST_A5: ProductDisplayConfig;
+};
+/**
+ * 工具函数：将字符串键或配置对象解析为配置对象
+ */
+export declare function resolveProductDisplayConfig(config?: ProductDisplayPresetKey | ProductDisplayConfig): ProductDisplayConfig;

package/lib/components/ticketBooking/components/ProductDisplayAdapter/types.js

@@ -0,0 +1,247 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ticketBooking/components/ProductDisplayAdapter/types.ts
+var types_exports = {};
+__export(types_exports, {
+  LegacyProductDisplayPresets: () => LegacyProductDisplayPresets,
+  ProductDisplayPresets: () => ProductDisplayPresets,
+  resolveProductDisplayConfig: () => resolveProductDisplayConfig
+});
+module.exports = __toCommonJS(types_exports);
+var ProductDisplayPresets = {
+  // 默认配置
+  default: {
+    displayMode: "product-select",
+    productSelectConfig: {
+      showSearch: true,
+      showTab: true,
+      layout: {
+        grid: true,
+        config: "12:12"
+      },
+      productListSetting: {
+        isProductCover: 1,
+        isTitle: 1,
+        isSubtitle: 1,
+        isPrice: 1,
+        isOriginPrice: 0,
+        isStock: 0
+      }
+    }
+  },
+  // 别名：product-select
+  "product-select": {
+    displayMode: "product-select",
+    productSelectConfig: {
+      showSearch: true,
+      showTab: true,
+      layout: {
+        grid: true,
+        config: "12:12"
+      },
+      productListSetting: {
+        isProductCover: 1,
+        isTitle: 1,
+        isSubtitle: 1,
+        isPrice: 1,
+        isOriginPrice: 0,
+        isStock: 0
+      }
+    }
+  },
+  // SkuList A1
+  "sku-list-a1": {
+    displayMode: "sku-list",
+    skuListConfig: {
+      listConfig: {
+        layout: "grid",
+        showPagination: false,
+        showTab: false
+      },
+      skuCardAllConfig: {
+        skuCardConfig: {
+          displayMode: "display_a1",
+          isFavorite: false,
+          layoutDirection: "column"
+        }
+      }
+    }
+  },
+  // SkuList A2 - 详细信息卡片
+  "sku-list-a2": {
+    displayMode: "sku-list",
+    skuListConfig: {
+      listConfig: {
+        layout: "grid",
+        showPagination: false,
+        showTab: false
+      },
+      skuCardAllConfig: {
+        skuCardConfig: {
+          displayMode: "display_a2",
+          layoutDirection: "row",
+          radius: 12,
+          paddingX: 12,
+          paddingY: 12,
+          skuImageConfig: {
+            isCover: true,
+            width: "140px",
+            height: "140px",
+            radius: 8
+          },
+          skuNameConfig: {
+            isOpen: true,
+            fontSize: 16,
+            fontWeight: 600,
+            color: "#101828",
+            ellipsisCount: 2
+          },
+          skuSubtitleConfig: {
+            isOpen: true,
+            fontSize: 14,
+            color: "#667085",
+            ellipsisCount: 1
+          },
+          skuPriceConfig: {
+            isOpen: true,
+            isPrice: true,
+            priceFontSize: 18,
+            priceFontWeight: 600,
+            priceColor: "#101828",
+            isOriginPrice: true,
+            originPriceFontSize: 14,
+            originPriceColor: "#98A2B3"
+          },
+          skuStockConfig: {
+            isOpen: true,
+            fontSize: 12,
+            color: "#667085"
+          }
+        }
+      }
+    }
+  },
+  // SkuList A5
+  "sku-list-a5": {
+    displayMode: "sku-list",
+    skuListConfig: {
+      listConfig: {
+        layout: "grid",
+        showPagination: false,
+        showTab: true,
+        // 启用 Tab
+        tabStyle: "switch",
+        // 使用 switch 模式
+        stickyTop: true,
+        // Tab 吸顶
+        columns: 5,
+        tabGroup: "category"
+      },
+      skuCardAllConfig: {
+        skuCardConfig: {
+          displayMode: "display_a5",
+          layoutDirection: "column",
+          background: "#ffffff",
+          paddingY: 8,
+          paddingX: 8,
+          marginY: 0,
+          marginX: 0,
+          radius: 12,
+          isBorderVisible: false,
+          borderWidth: 1,
+          borderColor: "#ffffff",
+          isFoldable: true
+        },
+        skuActionConfig: {
+          isOpen: false
+        },
+        skuTextConfig: {
+          skuSubtitleConfig: {
+            isOpen: false
+          },
+          skuNameConfig: {
+            isOpen: true
+            // fontSize: 18,
+            // fontWeight: 600,
+            // color: '#101828',
+            // ellipsisCount: 1,
+          },
+          skuPriceConfig: {
+            isOpen: true,
+            isPrice: true,
+            priceFontSize: 18,
+            priceFontWeight: 600,
+            priceColor: "#101828",
+            isShowZeroPrice: true,
+            isShowFreePrice: false,
+            isOriginPrice: true,
+            originPriceFontSize: 16,
+            originPriceFontWeight: 400,
+            originPriceColor: "#667085",
+            isTaxPrice: true,
+            isCustomText: false
+          }
+        },
+        skuImageConfig: {
+          isCover: true,
+          width: "100%",
+          height: "126px",
+          isTextFallback: true,
+          background: "#ffffff",
+          skuImageRadius: 12,
+          slotPosition: "left_top",
+          radius: 12
+        },
+        skuExtraConfig: {
+          isOpen: false
+        }
+      }
+    }
+  }
+};
+var LegacyProductDisplayPresets = {
+  /** @deprecated 使用 ProductDisplayPresets['product-select'] */
+  DEFAULT_PRODUCT_SELECT: ProductDisplayPresets["product-select"],
+  /** @deprecated 使用 ProductDisplayPresets['sku-list-a1'] */
+  DEFAULT_SKU_LIST_A1: ProductDisplayPresets["sku-list-a1"],
+  /** @deprecated 使用 ProductDisplayPresets['sku-list-a2'] */
+  DEFAULT_SKU_LIST_A2: ProductDisplayPresets["sku-list-a2"],
+  /** @deprecated 使用 ProductDisplayPresets['sku-list-a5'] */
+  DEFAULT_SKU_LIST_A5: ProductDisplayPresets["sku-list-a5"]
+};
+function resolveProductDisplayConfig(config) {
+  if (!config) {
+    return ProductDisplayPresets["default"];
+  }
+  if (typeof config === "string") {
+    const preset = ProductDisplayPresets[config];
+    if (!preset) {
+      console.warn(`Unknown preset key: "${config}", falling back to default`);
+      return ProductDisplayPresets["default"];
+    }
+    return preset;
+  }
+  return config;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LegacyProductDisplayPresets,
+  ProductDisplayPresets,
+  resolveProductDisplayConfig
+});

package/lib/components/ticketBooking/components/ProductDisplayAdapter/utils.d.ts

@@ -0,0 +1,50 @@
+/**
+ * 格式化 SKU 数据源，适配 SkuCard 组件
+ */
+export declare const formatSkuDataSource: (dataSource: any) => {
+    id: any;
+    title: any;
+    subtitle: any;
+    cover: any;
+    price: any;
+    original_price: any;
+    stock: any;
+    sortKeys: string[];
+};
+/**
+ * Tab 项接口定义（与 List 组件保持一致）
+ */
+export interface TabItem {
+    key: string;
+    label: string;
+    group?: string;
+}
+/**
+ * 产品分类信息接口
+ */
+interface ProductCategory {
+    id: number;
+    name: string;
+    icon?: string;
+    slug?: string;
+    sort?: number;
+}
+/**
+ * 产品项接口
+ */
+interface Product {
+    id: number;
+    title: string;
+    category?: ProductCategory[];
+    [key: string]: any;
+}
+/**
+ * 根据产品数据生成分类 Tabs（Switch 模式）
+ * 参考 TestResponsiveWrapper 的 generateSimpleTabItems 函数
+ *
+ * @param products 产品列表
+ * @param tabStyle tab 样式类型
+ * @returns TabItem 数组
+ */
+export declare const generateProductTabs: (products: Product[], tabStyle?: 'switch' | 'anchor') => TabItem[];
+export {};