best-unit 2.0.17 → 2.1.4

package/dist/types/global.d.ts

@@ -49,7 +49,7 @@ export interface InitParams {
   locale?: Locale;
   env: Env;
   size?: Size;
-  themeConfig?: ThemeConfig;
+  theme_config?: ThemeConfig;
 }
 
 export interface ThemeConfig {
@@ -81,7 +81,7 @@ export declare function initFundUnit(params: {
   locale?: Locale;
   env: Env;
   size?: Size;
-  themeConfig?: ThemeConfig;
+  theme_config?: ThemeConfig;
 }): {
   token: string;
   merchantId?: string;
@@ -91,7 +91,7 @@ export declare function initFundUnit(params: {
   locale: Locale;
   env: Env;
   size?: Size;
-  themeConfig?: ThemeConfig;
+  theme_config?: ThemeConfig;
 };
 
 export declare function getBalanceData(): Promise<BalanceData>;
@@ -120,7 +120,7 @@ declare global {
         locale?: "zh" | "en";
         theme?: Theme;
         size?: Size;
-        themeConfig?: ThemeConfig;
+        theme_config?: ThemeConfig;
         env: Env;
       }) => void;
       getBalanceData: () => any;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "best-unit",
   "private": false,
-  "version": "2.0.17",
+  "version": "2.1.4",
   "type": "module",
   "main": "dist/best-unit.cjs",
   "module": "dist/best-unit.js",

package/src/api/index.ts

@@ -1,39 +1,80 @@
 import { http } from "./axiosInstance";
 import type { AxiosProgressEvent } from "axios";
-// 获取余额
-export function getBalance() {
+
+export interface MerchantBalanceItem {
+  fundBalanceId: string;
+  merchantId: number;
+  bizType: string;
+}
+
+export const getAllBalances = async () => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
   return http()
-    .get("/balance", {
-      params: {
-        merchant_id: fundUnitParams.merchantId,
-        biz_type: fundUnitParams.bizType,
-        fund_balance_id: fundUnitParams.fundBalanceId,
-      },
+    .post("/merchant/all-balances", {
+      merchant_id: Number(fundUnitParams.merchantId),
     })
     .then((res) => {
-      const data = res.data;
-      const balanceData = {
-        fundBalanceId: data.fund_balance_id,
-        merchantId: data.merchant_id,
-        bizType: data.biz_type,
-        currency: data.currency,
-        totalAmount: data.total_amount,
-        frozenAmount: data.frozen_amount,
-        creditLimit: data.credit_config?.credit_limit,
-        creditUsed: data.credit_used,
-        isCredit: data.credit_config ? true : false,
-        availableAmount: data.available_amount,
-        currBalance: data.curr_balance,
-        pendingAmount: data.pending_amount,
-        status: data.status,
-        createdAt: data.created_at,
-      };
-      sessionStorage.setItem("balanceData", JSON.stringify(balanceData));
-      return balanceData;
+      const allBalances: MerchantBalanceItem[] = (
+        Array.isArray(res?.data) ? res.data : []
+      ).map((item: any) => ({
+        fundBalanceId: String(item.fund_balance_id || ""),
+        merchantId: Number(item.merchant_id || 0),
+        bizType: String(item.biz_type || ""),
+      }));
+
+      sessionStorage.setItem("allBalances", JSON.stringify(allBalances));
+      return allBalances;
     });
+};
+
+// 获取余额
+export async function getBalance() {
+  const fundUnitParams = JSON.parse(
+    sessionStorage.getItem("fund_unit_params") || "{}",
+  );
+
+  const balanceRequest = http().get("/balance", {
+    params: {
+      merchant_id: fundUnitParams.merchantId,
+      biz_type: fundUnitParams.bizType,
+      fund_balance_id: fundUnitParams.fundBalanceId,
+    },
+  });
+  const [balanceRes, allBalancesRes] = await Promise.allSettled([
+    balanceRequest,
+    getAllBalances(),
+  ]);
+
+  if (balanceRes.status !== "fulfilled") {
+    throw balanceRes.reason;
+  }
+
+  const data = balanceRes.value.data;
+  const balanceData = {
+    fundBalanceId: data.fund_balance_id,
+    merchantId: data.merchant_id,
+    bizType: data.biz_type,
+    currency: data.currency,
+    totalAmount: data.total_amount,
+    frozenAmount: data.frozen_amount,
+    creditLimit: data.credit_config?.credit_limit,
+    creditUsed: data.credit_used,
+    isCredit: data.credit_config ? true : false,
+    availableAmount: data.available_amount,
+    currBalance: data.curr_balance,
+    pendingAmount: data.pending_amount,
+    status: data.status,
+    createdAt: data.created_at,
+  };
+
+  if (allBalancesRes.status !== "fulfilled") {
+    console.error("获取子业务账户列表失败:", allBalancesRes.reason);
+  }
+
+  sessionStorage.setItem("balanceData", JSON.stringify(balanceData));
+  return balanceData;
 }
 
 // 获取所有字典
@@ -49,7 +90,7 @@ export const getAllDicts = async () => {
 // 获取所有币种
 export const getAllCurrencies = async () => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
   return http()
     .get("/currency", {
@@ -70,7 +111,7 @@ export const getAllCurrencies = async () => {
 // 上传文件
 export const uploadFile = async (
   file: any,
-  onProgress?: (percent: number) => void
+  onProgress?: (percent: number) => void,
 ) => {
   return http()
     .post("/oss/upload", file, {
@@ -80,7 +121,7 @@ export const uploadFile = async (
       onUploadProgress: (progressEvent: AxiosProgressEvent) => {
         if (progressEvent.total) {
           const percent = Math.round(
-            (progressEvent.loaded * 100) / progressEvent.total
+            (progressEvent.loaded * 100) / progressEvent.total,
           );
           onProgress && onProgress(percent);
         }
@@ -94,7 +135,7 @@ export const uploadFile = async (
 // 创建离线充值
 export const createOfflineRecharge = async (data: any) => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
 
   const params = {
@@ -111,6 +152,13 @@ export const createOfflineRecharge = async (data: any) => {
     submit_amount: data.submitAmount,
     submit_currency: data.submitCurrency,
     voucher_urls: data.voucherUrls,
+    use_fund_allocation: Boolean(data.useFundAllocation),
+    allocation_ratios: Boolean(data.useFundAllocation)
+      ? (data.allocationRatios || []).map((item: any) => ({
+          fund_balance_id: item.fundBalanceId,
+          ratio: String(item.ratio),
+        }))
+      : [],
     metadata:
       fundUnitParams.bizType === "ad"
         ? {
@@ -124,7 +172,7 @@ export const createOfflineRecharge = async (data: any) => {
 // 创建在线充值
 export const createOnlineRecharge = async (data: any) => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
 
   const params = {
@@ -177,7 +225,7 @@ export const calcPaymentAmount = async (data: CalcPaymentAmountParams) => {
 // /sdk/channel/info
 export const getChannelInfo = async (data: { code: string }) => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
   return http()
     .get("/channel/info", {
@@ -194,7 +242,7 @@ export const getChannelInfo = async (data: { code: string }) => {
 // 获取币种对应渠道
 export const getOfflineChannelMap = async (data: { currency: string }) => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
   return http()
     .get("/offline/channel/map", {
@@ -228,7 +276,7 @@ export const calculateBusinessExchangeRate = async (data: {
   amount: string;
 }) => {
   const fundUnitParams = JSON.parse(
-    sessionStorage.getItem("fund_unit_params") || "{}"
+    sessionStorage.getItem("fund_unit_params") || "{}",
   );
   return http()
     .post("/business_exchange_rate/calculate", {

package/src/components/business/payment-sdk/offline-detail/index.tsx

@@ -1,7 +1,9 @@
-import { t } from "@/local";
+import { getCurrentLocale, t } from "@/local";
 import { getOfflineDetailTheme } from "./theme";
 import { useEffect, useState } from "preact/hooks";
 import { getChannelInfo } from "@/api";
+import { Locale } from "@/types";
+import { getInitParams } from "@/utils/business";
 
 interface OfflineDetailProps {
   onConfirm: () => void;
@@ -11,6 +13,8 @@ interface OfflineDetailProps {
 export function OfflineDetail({ onConfirm, channelCode }: OfflineDetailProps) {
   const theme = getOfflineDetailTheme();
   const [detailLines, setDetailLines] = useState<string[]>([]);
+  const merchantId = getInitParams<string>("merchantId");
+  const reminderAccentStyle = { color: "#ff4d4f", fontWeight: 600 };
 
   useEffect(() => {
     if (!channelCode) return;
@@ -77,12 +81,37 @@ export function OfflineDetail({ onConfirm, channelCode }: OfflineDetailProps) {
 
       <div style={theme.reminderTitle}>{t("温馨提示")}</div>
       <ul style={theme.reminderList}>
-        <li>{t("创建付款时请勿填写敏感备注，例如：topup ads、order等、建议填写数字代码")}</li>
-        <li>{t("请填写正确的支付金额、币种、支付时间，相同的交易请勿重复提交。")}</li>
+        <li>
+          {t("我们强烈建议，转账时在备注中输入您的ID：")}
+          <span style={reminderAccentStyle}>{merchantId}</span>
+          {t("。这可以")}
+          <span style={reminderAccentStyle}>{t("加速资金审核")}</span>
+          {getCurrentLocale() === Locale.ZH ? "。" : "."}
+        </li>
+        <li>
+          {t(
+            "创建付款时请勿填写敏感备注，例如：topup ads、order等、建议填写数字代码",
+          )}
+        </li>
+        <li>
+          {t("请填写正确的支付金额、币种、支付时间，相同的交易请勿重复提交。")}
+        </li>
         <li>{t("请上传交易凭证，否则无法核验并及时添加余额。")}</li>
-        <li>{t("提交成功后根据实际到账金额添加余额。工作时间提交的转账当日处理，非工作时间提交的转账将在下一个工作日处理。")}</li>
-        <li>{t("通过平台互转（例如payoneer转payoneer）付款方式可能会有10分钟延迟，请耐心等待。")}</li>
-        <li>{t("广告款项若入账金额为美金外其他币种额外扣除0.6%手续费，其中PayPal支付方式额外扣除2.5%手续费。")}</li>
+        <li>
+          {t(
+            "提交成功后根据实际到账金额添加余额。工作时间提交的转账当日处理，非工作时间提交的转账将在下一个工作日处理。",
+          )}
+        </li>
+        <li>
+          {t(
+            "通过平台互转（例如payoneer转payoneer）付款方式可能会有10分钟延迟，请耐心等待。",
+          )}
+        </li>
+        <li>
+          {t(
+            "广告款项若入账金额为美金外其他币种额外扣除0.6%手续费，其中PayPal支付方式额外扣除2.5%手续费。",
+          )}
+        </li>
         <li>{t("如有问题，请联系客服。")}</li>
       </ul>
     </div>

package/src/components/business/payment-sdk/offline-payment/fund-allocation.tsx

@@ -0,0 +1,213 @@
+import { useEffect, useState } from "preact/hooks";
+import { t } from "@/local";
+import { getAllBalances, type MerchantBalanceItem } from "@/api";
+
+interface FundAllocationSectionProps {
+  theme: any;
+  useFundAllocation: boolean;
+  subBusinesses: MerchantBalanceItem[];
+  subBizPercentages: Record<string, string>;
+  subBizError: string;
+  onUseFundAllocationChange: (value: boolean) => void;
+  onPercentageChange: (bizType: string, value: string) => void;
+}
+
+function getBizTypeLabel(bizType: string) {
+  if (bizType === "ad") return "Advertising";
+  if (bizType === "fulfill") return "Fulfillment";
+  if (bizType === "chargewipe") return "ChargeWipe";
+  return bizType;
+}
+
+export function useFundAllocation() {
+  const [subBusinesses, setSubBusinesses] = useState<MerchantBalanceItem[]>([]);
+  const [useFundAllocation, setUseFundAllocation] = useState(false);
+  const [subBizPercentages, setSubBizPercentages] = useState<
+    Record<string, string>
+  >({});
+  const [subBizError, setSubBizError] = useState("");
+
+  useEffect(() => {
+    let mounted = true;
+
+    const applySubBusinesses = (items: MerchantBalanceItem[]) => {
+      if (!mounted) return;
+
+      setSubBusinesses(items);
+      setSubBizPercentages((prev) =>
+        items.reduce(
+          (acc, item) => ({
+            ...acc,
+            [item.bizType]: prev[item.bizType] || "",
+          }),
+          {} as Record<string, string>,
+        ),
+      );
+    };
+
+    const cached = JSON.parse(sessionStorage.getItem("allBalances") || "[]");
+    if (Array.isArray(cached) && cached.length > 0) {
+      applySubBusinesses(cached);
+    }
+
+    getAllBalances()
+      .then((items) => {
+        applySubBusinesses(items);
+      })
+      .catch(() => {
+        if (!Array.isArray(cached)) {
+          applySubBusinesses([]);
+        }
+      });
+
+    return () => {
+      mounted = false;
+    };
+  }, []);
+
+  const handleUseFundAllocationChange = (value: boolean) => {
+    setUseFundAllocation(value);
+    setSubBizError("");
+  };
+
+  const handlePercentageChange = (bizType: string, value: string) => {
+    setSubBizPercentages((prev) => ({
+      ...prev,
+      [bizType]: value,
+    }));
+    setSubBizError("");
+  };
+
+  const validateFundAllocation = () => {
+    if (!useFundAllocation || subBusinesses.length === 0) {
+      return true;
+    }
+
+    const hasEmptyValue = subBusinesses.some(
+      (item) => !subBizPercentages[item.bizType]?.trim(),
+    );
+    const hasInvalidValue = subBusinesses.some((item) => {
+      const value = Number(subBizPercentages[item.bizType]);
+      return Number.isNaN(value) || value < 0 || value > 100;
+    });
+    const totalPercentage = subBusinesses.reduce(
+      (sum, item) => sum + Number(subBizPercentages[item.bizType] || 0),
+      0,
+    );
+
+    if (hasEmptyValue) {
+      setSubBizError(t("请输入子业务占比"));
+      return false;
+    }
+
+    if (hasInvalidValue || Math.abs(totalPercentage - 100) > 0.0001) {
+      setSubBizError(t("子业务占比总和必须为100%"));
+      return false;
+    }
+
+    setSubBizError("");
+    return true;
+  };
+
+  const buildAllocationRatios = () => {
+    if (!useFundAllocation) {
+      return [];
+    }
+
+    return subBusinesses.map((item) => ({
+      fundBalanceId: item.fundBalanceId,
+      ratio: String(subBizPercentages[item.bizType] || ""),
+    }));
+  };
+
+  return {
+    subBusinesses,
+    useFundAllocation,
+    subBizPercentages,
+    subBizError,
+    setUseFundAllocation: handleUseFundAllocationChange,
+    setSubBizPercentage: handlePercentageChange,
+    validateFundAllocation,
+    buildAllocationRatios,
+  };
+}
+
+export function FundAllocationSection({
+  theme,
+  useFundAllocation,
+  subBusinesses,
+  subBizPercentages,
+  subBizError,
+  onUseFundAllocationChange,
+  onPercentageChange,
+}: FundAllocationSectionProps) {
+  return (
+    <>
+      <div style={theme.fieldSection}>
+        <label style={theme.fieldLabel}>{t("是否使用资金分配")}</label>
+        <div style={theme.radioGroup}>
+          <label style={theme.radioOption}>
+            <input
+              type="radio"
+              name="useFundAllocation"
+              checked={useFundAllocation}
+              onChange={() => onUseFundAllocationChange(true)}
+            />
+            <span>{t("是")}</span>
+          </label>
+          <label style={theme.radioOption}>
+            <input
+              type="radio"
+              name="useFundAllocation"
+              checked={!useFundAllocation}
+              onChange={() => onUseFundAllocationChange(false)}
+            />
+            <span>{t("否")}</span>
+          </label>
+        </div>
+      </div>
+
+      {useFundAllocation && subBusinesses.length > 0 && (
+        <div style={theme.fieldSection}>
+          <div style={theme.subBizGrid}>
+            {subBusinesses.map((item) => (
+              <div
+                key={item.fundBalanceId || item.bizType}
+                style={theme.subBizField}
+              >
+                <label style={theme.fieldLabel}>
+                  {getBizTypeLabel(item.bizType)}
+                  {" (%)"}
+                </label>
+                <input
+                  type="number"
+                  min="0"
+                  max="100"
+                  step="0.01"
+                  placeholder="0"
+                  value={subBizPercentages[item.bizType] || ""}
+                  onChange={(e) => {
+                    onPercentageChange(
+                      item.bizType,
+                      (e.target as HTMLInputElement).value,
+                    );
+                  }}
+                  style={{
+                    ...theme.input,
+                    ...(subBizError ? theme.inputError : {}),
+                  }}
+                />
+              </div>
+            ))}
+          </div>
+          <div style={theme.subBizHint}>
+            {`${subBusinesses
+              .map((item) => getBizTypeLabel(item.bizType))
+              .join(" + ")} ${t("must total 100%")}`}
+          </div>
+          {subBizError && <div style={theme.error}>{subBizError}</div>}
+        </div>
+      )}
+    </>
+  );
+}

package/src/components/business/payment-sdk/offline-payment/index.tsx

@@ -5,6 +5,10 @@ import { DatePicker } from "@/components/common/date-picker";
 import { Upload } from "@/components/common/upload";
 import { createOfflineRecharge } from "@/api";
 import { message } from "@/components/common/message";
+import {
+  FundAllocationSection,
+  useFundAllocation,
+} from "./fund-allocation";
 
 interface OfflinePaymentProps {
   onBack: () => void;
@@ -25,11 +29,21 @@ export function OfflinePayment({
 }: OfflinePaymentProps) {
   const theme = getOfflinePaymentTheme();
   const isDark = theme.container.background === "#181A20";
+  const {
+    subBusinesses,
+    useFundAllocation: isUsingFundAllocation,
+    subBizPercentages,
+    subBizError,
+    setUseFundAllocation,
+    setSubBizPercentage,
+    validateFundAllocation,
+    buildAllocationRatios,
+  } = useFundAllocation();
 
   // 默认选择当日日期，格式为 YYYY-MM-DD
   const today = new Date();
   const todayStr = `${today.getFullYear()}-${String(
-    today.getMonth() + 1
+    today.getMonth() + 1,
   ).padStart(2, "0")}-${String(today.getDate()).padStart(2, "0")}`;
 
   const [formState, setFormState] = useState({
@@ -85,6 +99,10 @@ export function OfflinePayment({
       }));
     }
 
+    if (!validateFundAllocation()) {
+      valid = false;
+    }
+
     if (!valid) return;
 
     try {
@@ -96,6 +114,8 @@ export function OfflinePayment({
         payerName: formState.payerName,
         submitAmount: amount,
         submitCurrency: currency,
+        useFundAllocation: isUsingFundAllocation,
+        allocationRatios: buildAllocationRatios(),
       });
       message.success(t("提交成功"));
       onCancel();
@@ -226,6 +246,16 @@ export function OfflinePayment({
         )}
       </div>
 
+      <FundAllocationSection
+        theme={theme}
+        useFundAllocation={isUsingFundAllocation}
+        subBusinesses={subBusinesses}
+        subBizPercentages={subBizPercentages}
+        subBizError={subBizError}
+        onUseFundAllocationChange={setUseFundAllocation}
+        onPercentageChange={setSubBizPercentage}
+      />
+
       {/* 操作按钮 */}
       <div style={theme.buttonSection}>
         <button type="button" onClick={onCancel} style={theme.cancelButton}>

package/src/components/business/payment-sdk/offline-payment/theme.tsx

@@ -100,6 +100,37 @@ function createOfflinePaymentThemes() {
     fieldSection: {
       marginBottom: size === Size.SMALL ? 12 : 16,
     },
+    radioGroup: {
+      display: "flex",
+      alignItems: "center",
+      gap: size === Size.SMALL ? 16 : 20,
+      flexWrap: "wrap",
+    },
+    radioOption: {
+      display: "inline-flex",
+      alignItems: "center",
+      gap: 6,
+      color: "#222",
+      fontSize: size === Size.SMALL ? 13 : 14,
+      cursor: "pointer",
+    },
+    subBizGrid: {
+      display: "grid",
+      gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+      gap: size === Size.SMALL ? 10 : 12,
+      width: "100%",
+      "@media (max-width: 600px)": {
+        gridTemplateColumns: "1fr",
+      },
+    },
+    subBizField: {
+      minWidth: 0,
+    },
+    subBizHint: {
+      marginTop: 8,
+      color: "#666",
+      fontSize: size === Size.SMALL ? 12 : 13,
+    },
     fieldLabel: {
       display: "block",
       fontSize: size === Size.SMALL ? 13 : 14,
@@ -240,6 +271,14 @@ function createOfflinePaymentThemes() {
         ...base.fieldLabel,
         color: "#fff",
       },
+      radioOption: {
+        ...base.radioOption,
+        color: "#fff",
+      },
+      subBizHint: {
+        ...base.subBizHint,
+        color: "#B5B8BE",
+      },
       input: {
         ...base.input,
         border: "1px solid #374151",