best-unit 1.2.19 → 1.2.21

package/src/demo/testBalanceData.tsx

@@ -0,0 +1,79 @@
+import { useState } from "preact/hooks";
+import { getBalanceData } from "@/utils/business";
+
+interface TestBalanceDataProps {
+  isDark: boolean;
+}
+
+export function TestBalanceData({ isDark }: TestBalanceDataProps) {
+  const [balanceData, setBalanceData] = useState<any>(null);
+  const [balanceLoading, setBalanceLoading] = useState(false);
+
+  // 测试 getBalanceData 函数
+  const testGetBalanceData = async () => {
+    setBalanceLoading(true);
+    try {
+      const result = await getBalanceData();
+      setBalanceData(result);
+      console.log("getBalanceData 测试结果:", result);
+    } catch (error) {
+      console.error("getBalanceData 测试失败:", error);
+      setBalanceData({ error: "获取失败" });
+    } finally {
+      setBalanceLoading(false);
+    }
+  };
+
+  return (
+    <div
+      style={{
+        marginBottom: 20,
+        padding: 16,
+        border: "2px solid #52c41a",
+        borderRadius: 8,
+        backgroundColor: "#f6ffed",
+      }}
+    >
+      <h3 style={{ marginTop: 0, marginBottom: 12, color: "#52c41a" }}>
+        🧪 getBalanceData 函数测试：
+      </h3>
+      <button
+        onClick={testGetBalanceData}
+        disabled={balanceLoading}
+        style={{
+          padding: "8px 16px",
+          backgroundColor: balanceLoading ? "#d9d9d9" : "#52c41a",
+          color: "#fff",
+          border: "none",
+          borderRadius: 6,
+          cursor: balanceLoading ? "not-allowed" : "pointer",
+          marginBottom: 12,
+        }}
+      >
+        {balanceLoading ? "测试中..." : "测试 getBalanceData 函数"}
+      </button>
+
+      {balanceData && (
+        <div
+          style={{
+            marginTop: 12,
+            padding: 12,
+            backgroundColor: isDark ? "#23262F" : "#fff",
+            border: "1px solid #d9d9d9",
+            borderRadius: 6,
+            fontSize: "12px",
+            fontFamily: "monospace",
+            whiteSpace: "pre-wrap",
+            maxHeight: "200px",
+            overflow: "auto",
+          }}
+        >
+          <strong>测试结果：</strong>
+          {JSON.stringify(balanceData, null, 2)}
+        </div>
+      )}
+    </div>
+  );
+}
+
+export default TestBalanceData;

package/src/demo/theme-config-example.tsx

@@ -0,0 +1 @@
+

package/src/local/en.ts

@@ -0,0 +1,64 @@
+// 英文语言包
+export const en: Record<string, string> = {
+  确定: "Confirm",
+  // 余额相关
+  余额详情: "Balance Details",
+  真实金额: "Real Balance",
+  冻结金额: "Frozen Amount",
+  信用额度: "Credit Limit",
+  已用额度: "Credit Used",
+  可用余额: "Available Balance",
+  暂无数据: "No Data",
+  "金额需在1到999999.99之间": "Amount must be between 1 and 999999.99",
+
+  // 充值相关
+  "充值 / 转账": "Recharge / Transfer",
+  在线充值: "Online Recharge",
+  线下转账: "Offline Transfer",
+  充值币种: "Recharge Currency",
+  充值金额: "Recharge Amount",
+  支付平台: "Payment Platform",
+  请选择充值币种: "Please select recharge currency",
+  请输入充值金额: "Please enter recharge amount",
+  请选择支付平台: "Please select payment platform",
+  "需要收取手续费，实际支付金额约为：":
+    "requires a handling fee, the actual payment amount is approximately: ",
+  "提交失败，请重试": "Submit failed, please try again",
+  "提交中...": "Submitting...",
+  去支付: "Go to Pay",
+  取消: "Cancel",
+  关闭: "Close",
+
+  // 离线转账相关
+  第三方支付平台: "Third-party Payment Platform",
+  交易ID: "Transaction ID",
+  请输入转账交易ID: "Please enter transfer transaction ID",
+  上传文件: "Upload Files",
+  请上传转账凭证: "Please upload transfer voucher",
+  离线充值创建成功: "Offline recharge created successfully",
+
+  // 通用
+  "加载中...": "Loading...",
+  错误: "Error",
+  成功: "Success",
+  必填: "Required",
+
+  // 按钮文本
+  "充值/转账": "Recharge/Transfer",
+  切换为暗黑主题: "Switch to Dark Theme",
+  切换为白色主题: "Switch to Light Theme",
+
+  // 上传组件相关
+  点击或拖拽文件到此处上传: "Click or drag files here to upload",
+  "支持 JPG、PNG、PDF 格式，单个文件不超过 20MB，最多上传":
+    "Supports JPG, PNG, PDF formats, single file not exceeding 20MB, maximum",
+  个文件: "files can be uploaded",
+  "正在上传...": "Uploading...",
+  已上传: "Uploaded",
+  移除: "Remove",
+};
+
+// 根据中文key获取英文文本的函数
+export function getEnText(zhKey: string): string {
+  return en[zhKey] || zhKey; // 如果找不到英文，返回中文key
+}

package/src/local/index.ts

@@ -0,0 +1,36 @@
+import { getZhText, zh } from "./zh";
+import { getEnText, en } from "./en";
+import { Locale } from "@/types";
+
+// 获取当前语言
+export function getCurrentLocale(): Locale {
+  const fundUnitParams = JSON.parse(
+    sessionStorage.getItem("fund_unit_params") || "{}"
+  );
+  return fundUnitParams.locale || Locale.ZH;
+}
+
+// 获取国际化文本
+export function getLocaleText() {
+  const locale = getCurrentLocale();
+  return locale === Locale.ZH ? zh : en;
+}
+
+// 获取指定语言的文本
+export function getLocaleTextByLang(locale: Locale) {
+  return locale === Locale.ZH ? zh : en;
+}
+
+// 使用中文key的t函数
+export function t(zhKey: string): string {
+  const locale = getCurrentLocale();
+
+  if (locale === "zh") {
+    return getZhText(zhKey);
+  } else {
+    return getEnText(zhKey);
+  }
+}
+
+// 导出所有语言包
+export { zh, en };

package/src/local/zh.ts

@@ -0,0 +1,63 @@
+// 中文语言包
+export const zh: Record<string, string> = {
+  确定: "确定",
+  // 余额相关
+  余额详情: "余额详情",
+  真实金额: "真实金额",
+  冻结金额: "冻结金额",
+  信用额度: "信用额度",
+  已用额度: "已用额度",
+  可用余额: "可用余额",
+  暂无数据: "暂无数据",
+  "金额需在1到999999.99之间": "金额需在1到999999.99之间",
+
+  // 充值相关
+  "充值 / 转账": "充值 / 转账",
+  在线充值: "在线充值",
+  线下转账: "线下转账",
+  充值币种: "充值币种",
+  充值金额: "充值金额",
+  支付平台: "支付平台",
+  请选择充值币种: "请选择充值币种",
+  请输入充值金额: "请输入充值金额",
+  请选择支付平台: "请选择支付平台",
+  "需要收取手续费，实际支付金额约为：": "需要收取手续费，实际支付金额约为：",
+  "提交失败，请重试": "提交失败，请重试",
+  "提交中...": "提交中...",
+  去支付: "去支付",
+  取消: "取消",
+  关闭: "关闭",
+
+  // 离线转账相关
+  第三方支付平台: "第三方支付平台",
+  交易ID: "交易ID",
+  请输入转账交易ID: "请输入转账交易ID",
+  上传文件: "上传文件",
+  请上传转账凭证: "请上传转账凭证",
+  离线充值创建成功: "离线充值创建成功",
+
+  // 通用
+  "加载中...": "加载中...",
+  错误: "错误",
+  成功: "成功",
+  必填: "必填",
+
+  // 按钮文本
+  "充值/转账": "充值/转账",
+  切换为暗黑主题: "切换为暗黑主题",
+  切换为白色主题: "切换为白色主题",
+
+  // 上传组件相关
+  点击或拖拽文件到此处上传: "点击或拖拽文件到此处上传",
+  "支持 JPG、PNG、PDF 格式，单个文件不超过 20MB，最多上传":
+    "支持 JPG、PNG、PDF 格式，单个文件不超过 20MB，最多上传",
+  个文件: "个文件",
+  "正在上传...": "正在上传...",
+  已上传: "已上传",
+  移除: "移除",
+};
+
+// 根据中文key获取文本的函数
+export function getZhText(zhKey: string): string {
+  return zh[zhKey] || zhKey;
+}

package/src/main.ts

@@ -0,0 +1,26 @@
+import { npmTest, printCurrentTime } from "@/utils/common/index";
+import {
+  initFundUnit,
+  getBalanceData,
+  refreshBalance,
+} from "@/utils/business/index";
+import { viteProxy } from "@/api/proxy";
+
+import "@/components/business/recharge-sdk";
+import "@/components/business/statistical-balance";
+import "@/components/business/refresh-button";
+
+// 可选：导出组件列表或版本信息
+export const components = [
+  "best-recharge",
+  "best-statistical-balance",
+  "best-refresh-button",
+];
+export {
+  npmTest,
+  printCurrentTime,
+  initFundUnit,
+  getBalanceData,
+  refreshBalance,
+  viteProxy,
+};

package/src/types/global.d.ts

@@ -0,0 +1,146 @@
+// 枚举定义
+export enum Locale {
+  ZH = "zh",
+  EN = "en",
+}
+
+export enum Theme {
+  WHITE = "white",
+  DARK = "dark",
+}
+
+export enum Env {
+  DEV = "dev",
+  DEVELOPMENT = "development",
+  TEST = "test",
+  PROD = "prod",
+  PRODUCTION = "production",
+}
+
+export enum Size {
+  SMALL = "small",
+  MEDIUM = "medium",
+}
+
+// 类型定义
+export interface BalanceData {
+  fundBalanceId: string;
+  merchantId: number;
+  bizType: string;
+  currency: string;
+  totalAmount: string;
+  frozenAmount: string;
+  creditLimit: string;
+  creditUsed: string;
+  isCredit: boolean;
+  availableAmount: string;
+  pendingAmount: string;
+  status: string;
+  createdAt: string;
+}
+
+export interface InitParams {
+  token: string;
+  merchant_id?: string;
+  biz_type?: string;
+  fund_balance_id?: string;
+  user_id: string;
+  theme?: Theme;
+  locale?: Locale;
+  env: Env;
+  size?: Size;
+  themeConfig?: ThemeConfig;
+}
+
+export interface ThemeConfig {
+  white?: {
+    color?: string;
+    fontSize?: number;
+  };
+  dark?: {
+    color?: string;
+    fontSize?: number;
+  };
+  global?: {
+    size?: Size;
+    fontSize?: number;
+  };
+}
+
+export declare function npmTest(): void;
+
+export declare function printCurrentTime(): void;
+
+export declare function initFundUnit(params: {
+  token: string;
+  merchant_id?: string;
+  biz_type?: string;
+  fund_balance_id?: string;
+  user_id: string;
+  theme?: Theme;
+  locale?: Locale;
+  env: Env;
+  size?: Size;
+  themeConfig?: ThemeConfig;
+}): {
+  token: string;
+  merchantId?: string;
+  bizType?: string;
+  fundBalanceId?: string;
+  theme?: Theme;
+  locale: Locale;
+  env: Env;
+  size?: Size;
+  themeConfig?: ThemeConfig;
+};
+
+export declare function getBalanceData(): Promise<BalanceData>;
+
+export declare function refreshBalance(): void;
+
+// Vite 代理配置类型
+export declare const viteProxy: {
+  "/api": {
+    target: string;
+    changeOrigin: boolean;
+    rewrite: (path: string) => string;
+    secure: boolean;
+  };
+};
+
+declare global {
+  interface Window {
+    bestUnit: {
+      initFundUnit: (params: {
+        token: string;
+        merchant_id: string;
+        biz_type: string;
+        user_id: string;
+        fund_balance_id?: string;
+        locale?: "zh" | "en";
+        theme?: Theme;
+        size?: Size;
+        themeConfig?: ThemeConfig;
+        env: Env;
+      }) => void;
+      getBalanceData: () => any;
+      refreshBalance: () => void;
+    };
+  }
+
+  namespace JSX {
+    interface IntrinsicElements {
+      "best-recharge": {
+        theme?: any;
+        merchant_id?: string;
+        biz_type?: string;
+        token?: string;
+        [key: string]: any;
+      };
+      "best-statistical-balance": any;
+      "best-refresh-button": any;
+    }
+  }
+}
+export {};
+/// <reference path="./preact-custom-element.d.ts" />

package/src/types/index.ts

@@ -0,0 +1,31 @@
+export enum Locale {
+  ZH = "zh",
+  EN = "en",
+}
+
+export enum Theme {
+  WHITE = "white",
+  DARK = "dark",
+}
+
+export enum Env {
+  DEV = "dev",
+  DEVELOPMENT = "development",
+  TEST = "test",
+  PROD = "prod",
+  PRODUCTION = "production",
+}
+
+export enum Size {
+  SMALL = "small",
+  MEDIUM = "medium",
+}
+
+export interface ThemeConfig {
+  white?: {
+    color?: string;
+  };
+  dark?: {
+    color?: string;
+  };
+}

package/src/types/preact-custom-element.d.ts

@@ -0,0 +1 @@
+declare module 'preact-custom-element'

package/src/utils/business/index.ts

@@ -0,0 +1,132 @@
+import { getAllDicts, getBalance } from "@/api";
+import { resetHttpInstance } from "@/api/axiosInstance";
+import { Locale, Size, Theme, type Env } from "@/types";
+
+// 余额数据结构接口
+export interface BalanceData {
+  fundBalanceId: string;
+  merchantId: number;
+  bizType: string;
+  currency: string;
+  totalAmount: string;
+  frozenAmount: string;
+  creditLimit: string;
+  creditUsed: string;
+  isCredit: boolean;
+  availableAmount: string;
+  pendingAmount: string;
+  status: string;
+  createdAt: string;
+}
+
+interface ThemeConfig {
+  white?: {
+    color?: string;
+  };
+  dark?: {
+    color?: string;
+  };
+}
+
+export interface InitParams {
+  token: string;
+  merchant_id?: string;
+  biz_type?: string;
+  fund_balance_id?: string;
+  user_id: string;
+  theme?: Theme;
+  locale?: Locale;
+  env: Env;
+  size?: Size;
+  themeConfig?: ThemeConfig;
+}
+
+// 获取余额数据并暴露给外部系统
+export async function getBalanceData() {
+  let balanceData = JSON.parse(sessionStorage.getItem("balanceData") || "{}");
+  if (balanceData && Object.keys(balanceData).length > 0) {
+    return balanceData;
+  }
+  balanceData = await getBalance();
+  return balanceData;
+}
+
+export function initFundUnit(params: InitParams) {
+  const {
+    merchant_id,
+    biz_type,
+    fund_balance_id,
+    user_id,
+    theme = Theme.WHITE,
+    locale = Locale.ZH,
+    env,
+    size,
+    themeConfig,
+  } = params;
+  console.log(params, "InitParams1111");
+  const token = "Bearer " + params.token;
+  sessionStorage.setItem(
+    "fund_unit_params",
+    JSON.stringify({
+      merchantId: merchant_id,
+      bizType: biz_type,
+      fundBalanceId: fund_balance_id,
+      userId: user_id,
+      token,
+      theme,
+      locale,
+      env,
+      size,
+      themeConfig,
+    })
+  );
+  // 重置 axios 实例，确保使用新的配置
+  resetHttpInstance();
+
+  getAllDicts();
+  return {
+    token,
+    merchantId: merchant_id,
+    bizType: biz_type,
+    fundBalanceId: fund_balance_id,
+    userId: user_id,
+    theme,
+    locale,
+    env,
+    size,
+  };
+}
+
+export function getInitParams<T = InitParams>(key?: string | string[]): T {
+  const fundUnitParams = JSON.parse(
+    sessionStorage.getItem("fund_unit_params") || "{}"
+  );
+
+  if (!key) {
+    return fundUnitParams as T;
+  }
+
+  if (Array.isArray(key)) {
+    const result: Partial<InitParams> = {};
+    key.forEach((k) => {
+      result[k as keyof InitParams] = fundUnitParams[k as keyof InitParams];
+    });
+    return result as T;
+  }
+
+  return fundUnitParams[key] as T;
+}
+
+/**
+ * 触发余额刷新事件
+ */
+export function refreshBalance() {
+  const refreshEvent = new CustomEvent("refresh-balance", {
+    detail: {},
+    bubbles: true,
+    composed: true,
+  });
+
+  // 从document开始分发事件
+  document.dispatchEvent(refreshEvent);
+}

package/src/utils/common/index.ts

@@ -0,0 +1,8 @@
+export function npmTest() {
+  console.log("npm package test!!!");
+}
+
+export function printCurrentTime() {
+  const now = new Date();
+  console.log("Current time:", now.toISOString());
+}

package/src/vite-env.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="vite/client" />
+
+declare module "path" {
+    export function resolve(...paths: string[]): string;
+  }
+  
+  declare const __dirname: string;
+  

package/tsconfig.app.json

@@ -0,0 +1,33 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"],
+      "react": ["./node_modules/preact/compat/"],
+      "react-dom": ["./node_modules/preact/compat/"]
+    },
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}

package/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "declaration": true,
+    "declarationDir": "dist",
+    "declarationMap": false,
+  },
+  "files": [],
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ],
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true
+  }
+}

package/tsconfig.node.json

@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2023",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}