@pisell/private-materials 3.4.87 → 3.4.88

package/lib/components/booking/locales.js

@@ -283,6 +283,10 @@ var locales_default = {
     "pisell2.booking.dashboard.default": "Default",
     "pisell2.booking.info.text.clear-cart": "Clear cart",
     "pisell2.booking.info.text.clear-all": "Clear all",
+    "pisell2.booking.info.text.clear-cart-modal.title": "Clear Cart",
+    "pisell2.booking.info.text.clear-cart-modal.content": "This will remove all items from the cart and cannot be undone. Continue?",
+    "pisell2.booking.info.text.clear-cart-modal.confirm": "Clear All",
+    "pisell2.booking.info.text.clear-cart-modal.cancel": "Cancel",
     "pisell2.booking.info.text.create-new": "Create new",
     "pisell2.booking.info.text.form-agreement-yes": "Yes",
     "pisell2.booking.info.text.form-agreement-no": "No",
@@ -594,6 +598,10 @@ var locales_default = {
     "pisell2.booking.dashboard.default": "默认",
     "pisell2.booking.info.text.clear-cart": "清空购物车",
     "pisell2.booking.info.text.clear-all": "清空",
+    "pisell2.booking.info.text.clear-cart-modal.title": "清空购物车",
+    "pisell2.booking.info.text.clear-cart-modal.content": "此操作将移除购物车中的所有商品，且无法恢复，是否继续？",
+    "pisell2.booking.info.text.clear-cart-modal.confirm": "确认清空",
+    "pisell2.booking.info.text.clear-cart-modal.cancel": "取消",
     "pisell2.booking.info.text.create-new": "新建",
     "pisell2.booking.info.text.form-agreement-yes": "是",
     "pisell2.booking.info.text.form-agreement-no": "否",
@@ -905,6 +913,10 @@ var locales_default = {
     "pisell2.booking.dashboard.default": "默认",
     "pisell2.booking.info.text.clear-cart": "清空購物車",
     "pisell2.booking.info.text.clear-all": "清空",
+    "pisell2.booking.info.text.clear-cart-modal.title": "清空購物車",
+    "pisell2.booking.info.text.clear-cart-modal.content": "此操作將移除購物車中的所有商品，且無法恢復，是否繼續？",
+    "pisell2.booking.info.text.clear-cart-modal.confirm": "確認清空",
+    "pisell2.booking.info.text.clear-cart-modal.cancel": "取消",
     "pisell2.booking.info.text.create-new": "新建",
     "pisell2.booking.info.text.form-agreement-yes": "是",
     "pisell2.booking.info.text.form-agreement-no": "否",
@@ -1216,6 +1228,10 @@ var locales_default = {
     "pisell2.booking.info.text.clear": "クリア",
     "pisell2.booking.info.text.clear-cart": "カートをクリア",
     "pisell2.booking.info.text.clear-all": "すべてクリア",
+    "pisell2.booking.info.text.clear-cart-modal.title": "カートを空にする",
+    "pisell2.booking.info.text.clear-cart-modal.content": "この操作によりカート内のすべての商品が削除され、元に戻せません。続行しますか？",
+    "pisell2.booking.info.text.clear-cart-modal.confirm": "すべて削除",
+    "pisell2.booking.info.text.clear-cart-modal.cancel": "キャンセル",
     "pisell2.booking.info.text.add-holder": "選択",
     "pisell2.booking.info.text.select-holder-title": "このイベントを誰のために予約しますか？",
     "pisell2.booking.info.text.create-new": "新規作成",
@@ -1556,6 +1572,10 @@ var locales_default = {
     "pisell2.booking.info.text.clear": "Limpar",
     "pisell2.booking.info.text.clear-cart": "Limpar carrinho",
     "pisell2.booking.info.text.clear-all": "Limpar tudo",
+    "pisell2.booking.info.text.clear-cart-modal.title": "Esvaziar carrinho",
+    "pisell2.booking.info.text.clear-cart-modal.content": "Esta ação irá remover todos os itens do carrinho e não pode ser desfeita. Deseja continuar?",
+    "pisell2.booking.info.text.clear-cart-modal.confirm": "Esvaziar tudo",
+    "pisell2.booking.info.text.clear-cart-modal.cancel": "Cancelar",
     "pisell2.booking.info.text.add-holder": "Selecionar",
     "pisell2.booking.info.text.select-holder-title": "Para quem você gostaria de reservar este evento？",
     "pisell2.booking.info.text.create-new": "Criar novo",

package/lib/components/booking/model.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface FormState {
     amountSymbol: string;
     apis: {
@@ -109,11 +108,4 @@ export declare const walkInData: {
     id: number;
     nickname: string;
 };
-export declare const Provider: (ComponentUi: any) => any, Context: import("react").Context<{
-    state: FormState;
-} & {
-    dispatch: (params: {
-        type: string;
-        payload: any;
-    }) => void;
-}>;
+export declare const Provider: any, Context: any;

package/lib/components/booking/notes/model.d.ts

@@ -1,10 +1 @@
-/// <reference types="react" />
-import { FormState } from "../model";
-export declare const Provider: (ComponentUi: any) => any, Context: import("react").Context<{
-    state: FormState;
-} & {
-    dispatch: (params: {
-        type: string;
-        payload: any;
-    }) => void;
-}>;
+export declare const Provider: any, Context: any;

package/lib/components/booking/payments/model.d.ts

@@ -1,10 +1 @@
-/// <reference types="react" />
-import { FormState } from "../model";
-export declare const Provider: (ComponentUi: any) => any, Context: import("react").Context<{
-    state: FormState;
-} & {
-    dispatch: (params: {
-        type: string;
-        payload: any;
-    }) => void;
-}>;
+export declare const Provider: any, Context: any;

package/lib/components/booking/utils.d.ts

@@ -166,10 +166,10 @@ export declare const getProductTotalPrice: (item: any) => number;
 export declare const getDuration: (duration: number | {
     type: string;
     value: number;
-}) => number | "flexible" | {
+}) => number | {
     type: string;
     value: number;
-};
+} | "flexible";
 export declare const isWalkIn: (customer_id?: number | string) => boolean;
 export declare const getIsEdit: (state: any) => boolean;
 export {};

package/lib/components/eftpos/hooks.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { Eftpos } from './const';
 /**
  * @title: tyro 设备连接

package/lib/components/eftposPay/amount.d.ts

@@ -9,7 +9,7 @@ import { PosProps } from './const';
  */
 declare const _default: ({ className, onChange, onClose, formatAmount, isMobile, net, client }: {
     className?: string | undefined;
-    onChange?: ((status: "success" | "page" | "print" | "fail" | "mark_tx_processed", params?: string | {
+    onChange?: ((status: "page" | "success" | "fail" | "print" | "mark_tx_processed", params?: string | {
         [keys: string]: unknown;
     } | undefined, other?: any) => void) | undefined;
     onClose: () => void;

package/lib/components/eftposPay/device.d.ts

@@ -11,7 +11,7 @@ import './device.less';
 declare const _default: ({ api, onChange, onClose, className, device_number, isMobile, net, client, formatAmount, }: {
     api: PayProps['api'];
     className?: string | undefined;
-    onChange?: ((status: "success" | "page" | "print" | "fail" | "mark_tx_processed", params?: string | {
+    onChange?: ((status: "page" | "success" | "fail" | "print" | "mark_tx_processed", params?: string | {
         [keys: string]: unknown;
     } | undefined, other?: any) => void) | undefined;
     onClose: () => void;

package/lib/components/eftposPay/hooks.d.ts

@@ -15,11 +15,11 @@ export declare const useStoreRef: <T extends {
     readonly numRef: React.MutableRefObject<string | number | undefined>;
     readonly orderIdRef: React.MutableRefObject<string | number>;
     readonly modeRef: React.MutableRefObject<ModeEnum>;
-    readonly statusRef: React.MutableRefObject<"warn" | "success" | "loading" | "fail" | "pedding" | "resove" | "reject" | "question">;
+    readonly statusRef: React.MutableRefObject<"loading" | "success" | "warn" | "fail" | "pedding" | "resove" | "reject" | "question">;
     readonly netRef: React.MutableRefObject<boolean | undefined>;
     readonly symbolRef: React.MutableRefObject<string>;
     readonly amountRef: React.MutableRefObject<string | number>;
-    readonly eftposRef: React.MutableRefObject<"stripe" | "payo" | "tyro" | "windcave" | "linkly">;
+    readonly eftposRef: React.MutableRefObject<"payo" | "tyro" | "windcave" | "stripe" | "linkly">;
     readonly clientRef: React.MutableRefObject<ClientEnum>;
     readonly dataRef: React.MutableRefObject<import("./store").State>;
 };

package/lib/components/eftposPay/store/index.d.ts

@@ -176,7 +176,7 @@ export declare const updateCustom: (payload: {
 export declare const updateStatus: (status: 'loading' | 'warn' | 'fail' | 'success' | 'question') => {
     type: EActionTypes;
     payload: {
-        status: "warn" | "success" | "loading" | "fail" | "question";
+        status: "loading" | "success" | "warn" | "fail" | "question";
     };
 };
 /**
@@ -197,7 +197,7 @@ export declare const updateComponent: (component: string, render?: boolean) => {
     } | {
         readonly type: "step";
         readonly render: boolean;
-        component?: undefined;
+        readonly component?: undefined;
     };
 };
 /**
@@ -297,10 +297,10 @@ export declare const backUpFree: (payload: Partial<State>) => {
         name?: string | undefined;
         symbol?: string | undefined;
         amount?: string | number | undefined;
-        mode?: "refund" | "pay" | "fullPay" | "query" | undefined;
+        mode?: "pay" | "fullPay" | "refund" | "query" | undefined;
         order_id?: string | number | undefined;
-        eftpos?: "stripe" | "payo" | "tyro" | "windcave" | "linkly" | undefined;
-        action?: "amount" | "pay" | "deviceList" | undefined;
+        eftpos?: "payo" | "tyro" | "windcave" | "stripe" | "linkly" | undefined;
+        action?: "pay" | "amount" | "deviceList" | undefined;
         key?: number | undefined;
         step?: number | undefined;
         title?: string | undefined;
@@ -310,7 +310,7 @@ export declare const backUpFree: (payload: Partial<State>) => {
         net?: boolean | undefined;
         component?: string | undefined;
         form?: string | undefined;
-        status?: "warn" | "success" | "loading" | "fail" | "pedding" | "resove" | "reject" | "question" | undefined;
+        status?: "loading" | "success" | "warn" | "fail" | "pedding" | "resove" | "reject" | "question" | undefined;
         warn?: string | undefined;
         steps?: {
             /** 用于重置当前步骤 */

package/lib/components/eftposPay/tyro/hooks.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * @title: 获取 Tyro 资源
  * @description:

package/lib/components/eventBooking/components/ErrorTip/index.d.ts

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

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/CalenDateStatus/index.d.ts

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

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/CalenDateWeek/CallToBook/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare type CallToBookProps = {
     show: boolean;
     type: string;

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/CalenDateWeek/WeekItem/index.d.ts

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

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/CalenDateWeek/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import './index.less';
 declare type CalenDateWeekProps = {
     currentDate: string;

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/Item/DayItem/index.d.ts

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

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/Item/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import './index.less';
 import { CalendarItemProps } from '../../../../../type';
 declare const Item: (props: CalendarItemProps) => import("react").JSX.Element;

package/lib/components/eventBooking/components/bookingAvailabilityCalendar/components/CalendarDate/Status/index.d.ts

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

package/lib/components/pay/toC/PaymentMethods/StripePay/Stripe/Finish/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 declare const StripePayment: () => import("react").JSX.Element;
 export default StripePayment;

package/lib/components/pay/toC/PaymentMethods/StripePay/Stripe/StripeSDK/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const StripeSDK: ({ public_key, client_secret, children, lang, }: {
     public_key: string;
     client_secret?: string | undefined;

package/lib/components/pay/toC/PaymentMethods/StripePay/Stripe/components/PageLoading/index.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 declare const PageLoading: () => import("react").JSX.Element;
 export default PageLoading;

package/lib/components/pay/toC/model.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface FormState {
     platform: 'pc' | 'h5' | '' | undefined;
     order: any;
@@ -30,11 +29,4 @@ export interface PayGroup {
     _order: any;
     front_order_uuid?: string;
 }
-export declare const Provider: (ComponentUi: any) => any, Context: import("react").Context<{
-    state: FormState;
-} & {
-    dispatch: (params: {
-        type: string;
-        payload: any;
-    }) => void;
-}>;
+export declare const Provider: any, Context: any;

package/lib/components/schedules/model.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CalendarDataItem, ScheduleItem } from "./type";
 import dayjs from "dayjs";
 export interface FormState {
@@ -69,11 +68,4 @@ export interface FormState {
     };
     setGlobalState: Function | null;
 }
-export declare const Provider: (ComponentUi: any) => any, Context: import("react").Context<{
-    state: FormState;
-} & {
-    dispatch: (params: {
-        type: string;
-        payload: any;
-    }) => void;
-}>;
+export declare const Provider: any, Context: any;

package/lib/components/shoppingCart/components/Cart/index.less

@@ -40,6 +40,7 @@
     line-height: 24px; /* 150% */
     display: flex;
     align-items: center;
+    width: max-content;
     .anticon {
       font-size: 18px;
       margin-right: 6px;

package/lib/components/shoppingCart/components/Empty/index.d.ts

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

package/lib/components/shoppingCart/hooks/useClearCart.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-declare const useClearCart: (key?: number | undefined) => React.JSX.Element | null;
+declare const useClearCart: (key?: number | undefined) => React.JSX.Element;
 export default useClearCart;

package/lib/components/shoppingCart/hooks/useClearCart.js

@@ -38,6 +38,7 @@ var import_materials = require("@pisell/materials");
 var import_useContext = require("./useContext");
 var import_utils = require("@pisell/utils");
 var useClearCart = (key) => {
+  const [open, setOpen] = (0, import_react.useState)(false);
   const { state, onChange } = (0, import_useContext.useContext)();
   const { isProductList, disabledEdit, holders, isHideClearCart } = state;
   const handleClear = () => {
@@ -47,20 +48,50 @@ var useClearCart = (key) => {
     } else {
       const ids = products == null ? void 0 : products.map((item) => item == null ? void 0 : item._id);
       onChange(ids, "delete_holders", key);
+      setOpen(false);
       return;
       products = products.filter((item) => (item == null ? void 0 : item.holder_id) !== key);
     }
   };
-  return !disabledEdit && (holders == null ? void 0 : holders.length) > 0 && !isHideClearCart ? /* @__PURE__ */ import_react.default.createElement(
-    "span",
-    {
-      className: (0, import_classnames.default)("pisell-lowcode__shopping-cart-clear-btn", {
-        "pisell-lowcode__shopping-cart-clear-btn-empty": isProductList
-      }),
-      onClick: handleClear
-    },
-    /* @__PURE__ */ import_react.default.createElement(import_materials.Iconfont, { type: "pisell2-trash-01" }),
-    /* @__PURE__ */ import_react.default.createElement("span", null, import_utils.locales.getText("pisell2.booking.info.text.clear-cart"))
-  ) : null;
+  const handleOpenModal = (0, import_react.useCallback)(() => {
+    setOpen(true);
+  }, []);
+  const handleCancel = (0, import_react.useCallback)(() => {
+    setOpen(false);
+  }, []);
+  return (0, import_react.useMemo)(() => {
+    const showClearBtn = !disabledEdit && (holders == null ? void 0 : holders.length) > 0 && !isHideClearCart;
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showClearBtn ? /* @__PURE__ */ import_react.default.createElement(
+      "span",
+      {
+        className: (0, import_classnames.default)("pisell-lowcode__shopping-cart-clear-btn", {
+          "pisell-lowcode__shopping-cart-clear-btn-empty": isProductList
+        }),
+        onClick: handleOpenModal
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_materials.Iconfont, { type: "pisell2-trash-01" }),
+      /* @__PURE__ */ import_react.default.createElement("span", null, import_utils.locales.getText("pisell2.booking.info.text.clear-cart"))
+    ) : null, /* @__PURE__ */ import_react.default.createElement(
+      import_materials.PisellModal,
+      {
+        open,
+        title: import_utils.locales.getText(
+          "pisell2.booking.info.text.clear-cart-modal.title"
+        ),
+        onOk: handleClear,
+        onCancel: handleCancel,
+        okText: import_utils.locales.getText(
+          "pisell2.booking.info.text.clear-cart-modal.confirm"
+        ),
+        cancelText: import_utils.locales.getText(
+          "pisell2.booking.info.text.clear-cart-modal.cancel"
+        ),
+        destroyOnClose: true
+      },
+      /* @__PURE__ */ import_react.default.createElement("div", { style: { margin: "24px 0" } }, /* @__PURE__ */ import_react.default.createElement("span", null, import_utils.locales.getText(
+        "pisell2.booking.info.text.clear-cart-modal.content"
+      )))
+    ));
+  }, [open, disabledEdit, holders == null ? void 0 : holders.length, isHideClearCart, isProductList]);
 };
 var useClearCart_default = useClearCart;

package/lib/hooks/usePaymentLogger.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface LogData {
     key: string;
     value: any;

package/lib/plus/pisellSalesManagement/config/booking.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const getBookingStatusMap: () => Record<string, string>;
 export declare const BOOKING_STATUS_COLOR_MAP: Record<string, string>;
 export declare const getBookingPlatformMap: () => Record<string, string>;
@@ -19,7 +20,7 @@ export declare const getFilterButtonList: () => ({
         }[];
         minInputNumberProps?: undefined;
         maxInputNumberProps?: undefined;
-        component?: undefined;
+        readonly component?: undefined;
         isSearchServer?: undefined;
         showSearch?: undefined;
         showTime?: undefined;
@@ -45,7 +46,7 @@ export declare const getFilterButtonList: () => ({
         mode?: undefined;
         maxTagCount?: undefined;
         options?: undefined;
-        component?: undefined;
+        readonly component?: undefined;
         isSearchServer?: undefined;
         showSearch?: undefined;
         showTime?: undefined;
@@ -90,7 +91,7 @@ export declare const getFilterButtonList: () => ({
         options: () => Promise<any>;
         minInputNumberProps?: undefined;
         maxInputNumberProps?: undefined;
-        component?: undefined;
+        readonly component?: undefined;
         isSearchServer?: undefined;
         showSearch?: undefined;
         showTime?: undefined;
@@ -110,7 +111,7 @@ export declare const getFilterButtonList: () => ({
         options?: undefined;
         minInputNumberProps?: undefined;
         maxInputNumberProps?: undefined;
-        component?: undefined;
+        readonly component?: undefined;
         isSearchServer?: undefined;
         showSearch?: undefined;
         showTime?: undefined;
@@ -132,7 +133,7 @@ export declare const getFilterButtonList: () => ({
         maxTagCount?: undefined;
         minInputNumberProps?: undefined;
         maxInputNumberProps?: undefined;
-        component?: undefined;
+        readonly component?: undefined;
         showTime?: undefined;
     };
     sort?: undefined;
@@ -151,7 +152,7 @@ export declare const getFilterButtonList: () => ({
         options?: undefined;
         minInputNumberProps?: undefined;
         maxInputNumberProps?: undefined;
-        component?: undefined;
+        readonly component?: undefined;
         isSearchServer?: undefined;
         showSearch?: undefined;
     };

package/lib/plus/selectHolder/components/ErrorTip/index.d.ts

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

package/lib/plus/walletEditor/components/ImageUpload/index.d.ts

@@ -3,6 +3,6 @@ export interface ImageUploadProps {
     value?: string;
     onChange?: (val: string) => void;
 }
-export declare const getBaseTime: (size: number) => 2000 | 1000 | 4000 | 8000;
+export declare const getBaseTime: (size: number) => 1000 | 2000 | 4000 | 8000;
 declare const ImageUpload: React.FC<ImageUploadProps>;
 export default ImageUpload;

package/lib/plus/walletPassGallery/components/recharge/index.js

@@ -128,23 +128,25 @@ var Recharge = ({
         {
           className: `pisell-card-item ${item.id === (chargeItem == null ? void 0 : chargeItem.id) ? "pisell-card-selected" : ""}`
         },
-        /* @__PURE__ */ import_react.default.createElement("div", { className: "card-content" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "card-content-left" }, /* @__PURE__ */ import_react.default.createElement("p", { className: "pisell-card-amount-item-name" }, item.name), /* @__PURE__ */ import_react.default.createElement(
+        /* @__PURE__ */ import_react.default.createElement("div", { className: "card-content" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "card-content-left" }, /* @__PURE__ */ import_react.default.createElement("p", { className: "pisell-card-amount-item-name" }, item.name), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item-arrival" }, /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-card-amount-item-label" }, import_utils.locales.getText(
+          "wallet-pass-gallery.rechargeArrivalAmount"
+        )), /* @__PURE__ */ import_react.default.createElement(
           import_materials.PisellText.Amount,
           {
             showCurrencySymbol: true,
-            className: "pisell-card-amount-item-value",
+            className: "highlight-amount",
             useThousandsSeparator: true,
             value: item.gift_price
           }
-        )), /* @__PURE__ */ import_react.default.createElement(
+        ))), /* @__PURE__ */ import_react.default.createElement("div", { className: "card-content-right" }, /* @__PURE__ */ import_react.default.createElement("span", { className: "pay-label" }, import_utils.locales.getText("wallet-pass-gallery.rechargePayAmount")), /* @__PURE__ */ import_react.default.createElement(
           import_materials.PisellText.Amount,
           {
             showCurrencySymbol: true,
-            className: "pisell-card-amount-item-value",
+            className: "pay-amount",
             useThousandsSeparator: true,
             value: item.price
           }
-        ))
+        )))
       )
     ))))
   );

package/lib/plus/walletPassGallery/components/recharge/index.less

@@ -7,10 +7,79 @@
 
   &-card-item {
     cursor: pointer;
+    min-width: 0;
+  }
+
+  .pisell-card-item {
+    border-radius: 8px;
+    border: 1px solid transparent;
+    transition: all 0.3s;
+    background: #fff;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+    min-width: 0;
   }
 
   .pisell-card-selected {
-    border: 1px solid var(--theme-color, #7f56d9);
+    border-color: var(--theme-color, #7f56d9);
     background: var(--Primary-50, #f9f5ff);
+    box-shadow: 0 4px 12px rgba(127, 86, 217, 0.1);
+  }
+
+  .card-content {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: 16px;
+  }
+
+  .card-content-left {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .pisell-card-amount-item-name {
+    font-size: 16px;
+    font-weight: 600;
+    color: #333;
+    margin: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .pisell-card-amount-item-arrival {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    font-size: 13px;
+    color: #666;
+    flex-wrap: wrap;
+
+    .highlight-amount {
+      color: #ff4d4f;
+      font-weight: 500;
+    }
+  }
+
+  .card-content-right {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    margin-top: 4px;
+    flex-shrink: 0;
+  }
+
+  .pay-label {
+    font-size: 12px;
+    color: #666;
+  }
+
+  .pay-amount {
+    font-size: 20px;
+    font-weight: bold;
+    color: var(--theme-color, #7f56d9);
   }
 }

package/lib/plus/walletPassGallery/locales.d.ts

@@ -92,6 +92,8 @@ declare const _default: {
         'page.wallet.tempHolderSelector.confirm': string;
         'page.wallet.notValidDate': string;
         'page.wallet.includedDate': string;
+        'wallet-pass-gallery.rechargeArrivalAmount': string;
+        'wallet-pass-gallery.rechargePayAmount': string;
     };
     'zh-CN': {
         'wallet-pass-gallery.rechargeableCard': string;
@@ -186,6 +188,8 @@ declare const _default: {
         'page.wallet.tempHolderSelector.confirm': string;
         'page.wallet.notValidDate': string;
         'page.wallet.includedDate': string;
+        'wallet-pass-gallery.rechargeArrivalAmount': string;
+        'wallet-pass-gallery.rechargePayAmount': string;
     };
     'zh-HK': {
         'wallet-pass-gallery.rechargeableCard': string;
@@ -280,6 +284,8 @@ declare const _default: {
         'page.wallet.tempHolderSelector.confirm': string;
         'page.wallet.notValidDate': string;
         'page.wallet.includedDate': string;
+        'wallet-pass-gallery.rechargeArrivalAmount': string;
+        'wallet-pass-gallery.rechargePayAmount': string;
     };
     ja: {
         'wallet-pass-gallery.rechargeableCard': string;
@@ -374,6 +380,8 @@ declare const _default: {
         'page.wallet.tempHolderSelector.confirm': string;
         'page.wallet.notValidDate': string;
         'page.wallet.includedDate': string;
+        'wallet-pass-gallery.rechargeArrivalAmount': string;
+        'wallet-pass-gallery.rechargePayAmount': string;
     };
     pt: {
         'wallet-pass-gallery.rechargeableCard': string;
@@ -468,6 +476,8 @@ declare const _default: {
         'page.wallet.tempHolderSelector.confirm': string;
         'page.wallet.notValidDate': string;
         'page.wallet.includedDate': string;
+        'wallet-pass-gallery.rechargeArrivalAmount': string;
+        'wallet-pass-gallery.rechargePayAmount': string;
     };
 };
 export default _default;