payment-kit 1.19.1 → 1.19.3

package/src/locales/zh.tsx

@@ -361,7 +361,7 @@ export default flat({
       },
       unit_label: {
         label: '单位标签',
-        placeholder: '座位',
+        placeholder: '单位',
       },
       billingType: {
         label: '计费类型',
@@ -424,6 +424,7 @@ export default flat({
       lookup_key: {
         label: '查找键',
         placeholder: '',
+        description: '查找键用于在API中识别价格',
       },
       recurring: {
         interval: '计费周期',
@@ -495,6 +496,7 @@ export default flat({
         format: '可售{num}件',
         noLimit: '不限制可售数量',
         valid: '可售数量不得少于已售数量',
+        description: '输入可售数量，0表示不限制可售数量',
       },
       quantitySold: {
         label: '已售数量',
@@ -505,6 +507,7 @@ export default flat({
         placeholder: '0表示无限制',
         format: '单次最多购买{num}件',
         noLimit: '不限制单次购买数量',
+        description: '输入限制单次购买的最大数量, 0表示无限制',
       },
       inventory: '库存设置',
     },
@@ -945,7 +948,7 @@ export default flat({
         totalAmount: '总额度',
         pendingAmount: '欠费额度',
         grantCount: '额度数量',
-        noGrantsDescription: '您还没有任何信用额度，请联系管理员添加。',
+        noGrantsDescription: '您还没有任何信用额度',
         status: {
           granted: '生效中',
           pending: '待生效',
@@ -1121,7 +1124,7 @@ export default flat({
       totalAmount: '总额度',
       pendingAmount: '欠费额度',
       grantCount: '额度数量',
-      noGrantsDescription: '您还没有任何信用额度，请联系管理员添加。',
+      noGrantsDescription: '您还没有任何信用额度',
       status: {
         granted: '生效中',
         pending: '待生效',

package/src/pages/admin/customers/customers/detail.tsx

@@ -42,10 +42,6 @@ const fetchData = async (
 ): Promise<{
   customer: TCustomerExpanded;
   summary: { [key: string]: GroupedBN };
-  creditSummary?: {
-    grants?: { [currencyId: string]: { totalAmount: string; remainingAmount: string } };
-    pendingAmount?: { [currencyId: string]: string };
-  } | null;
 }> => {
   const [customer, summary] = await Promise.all([
     api.get(`/api/customers/${id}`).then((res) => res.data),
@@ -311,15 +307,11 @@ export default function CustomerDetail(props: { id: string }) {
         }}>
         <Box className="payment-link-column-1" sx={{ flex: 1, gap: 2.5, display: 'flex', flexDirection: 'column' }}>
           {/* 信用管理区域 */}
-          {data.creditSummary && (
-            <>
-              <Box className="section">
-                <SectionHeader title={t('admin.creditGrants.title')} mb={0} />
-                <CreditOverview customerId={props.id} settings={settings} mode="dashboard" />
-              </Box>
-              <Divider />
-            </>
-          )}
+          <Box className="section">
+            <SectionHeader title={t('admin.creditGrants.title')} mb={0} />
+            <CreditOverview customerId={props.id} settings={settings} mode="dashboard" />
+          </Box>
+          <Divider />
 
           <Box className="section" sx={{ containerType: 'inline-size' }}>
             <SectionHeader title={t('admin.details')} />

package/src/pages/admin/settings/payment-methods/index.tsx

@@ -3,8 +3,6 @@ import { ConfirmDialog, Switch, api, formatError, usePaymentContext } from '@blo
 import type { ChainType, TPaymentCurrency, TPaymentMethodExpanded } from '@blocklet/payment-types';
 import {
   AddOutlined,
-  Check,
-  Close,
   DeleteOutlined,
   EditOutlined,
   InfoOutlined,
@@ -27,7 +25,6 @@ import {
   ListItemText,
   Skeleton,
   Stack,
-  TextField,
   Tooltip,
   Typography,
   useTheme,
@@ -35,7 +32,6 @@ import {
 import { useRequest, useSessionStorageState, useSetState } from 'ahooks';
 import useBus from 'use-bus';
 
-import { useState } from 'react';
 import Toast from '@arcblock/ux/lib/Toast';
 import { DIDDialog } from '@arcblock/ux/lib/DID';
 import { fromUnitToToken } from '@ocap/util';
@@ -45,6 +41,7 @@ import InfoCard from '../../../../components/info-card';
 import InfoRow from '../../../../components/info-row';
 import PaymentCurrencyAdd from '../../../../components/payment-currency/add';
 import PaymentCurrencyEdit from '../../../../components/payment-currency/edit';
+import EditInLine from '../../../../components/edit-in-line';
 import { useRpcStatus } from '../../../../hooks/rpc-status';
 import PaymentMethodEdit from './edit';
 
@@ -62,94 +59,51 @@ const getMethods = (
   return api.get(`/api/payment-methods?${search.toString()}`).then((res) => res.data);
 };
 
-const updateApiHost = (id: string, apiHost: string) => {
-  return api.put(`/api/payment-methods/${id}/settings`, { arcblock: { api_host: apiHost } }).then((res) => res.data);
+const updateApiHost = (id: string, params: Record<string, any>) => {
+  return api.put(`/api/payment-methods/${id}/settings`, { arcblock: params }).then((res) => res.data);
 };
 
-function EditApiHost({ method }: { method: TPaymentMethodExpanded }) {
-  const [edit, setEdit] = useState(false);
+function EditApiHost({ method, refresh }: { method: TPaymentMethodExpanded; refresh: () => void }) {
   const { t } = useLocaleContext();
-  const [value, setValue] = useState(method.settings?.arcblock?.api_host || '');
-  const [tempValue, setTempValue] = useState(value);
-  const [error, setError] = useState('');
 
-  const handleSave = async () => {
-    if (!tempValue.trim()) {
-      setError(t('common.required'));
-      return;
-    }
-    try {
-      await updateApiHost(method.id, tempValue);
-      Toast.success(t('common.saved'));
-      setValue(tempValue);
-      setEdit(false);
-      setError('');
-    } catch (err) {
-      Toast.error(formatError(err));
-    }
+  const handleSave = async (newValue: string) => {
+    await updateApiHost(method.id, { api_host: newValue });
+    refresh();
   };
 
-  const handleCancel = () => {
-    setTempValue(value);
-    setEdit(false);
-    setError('');
+  return (
+    <InfoRow
+      label={t('admin.paymentMethod.arcblock.api_host.label')}
+      value={
+        <EditInLine
+          value={method.settings?.arcblock?.api_host || ''}
+          onSave={handleSave}
+          placeholder={t('admin.paymentMethod.arcblock.api_host.tip')}
+          required
+        />
+      }
+    />
+  );
+}
+
+function EditApiExplorerHost({ method, refresh }: { method: TPaymentMethodExpanded; refresh: () => void }) {
+  const { t } = useLocaleContext();
+
+  const handleSave = async (newValue: string) => {
+    await updateApiHost(method.id, { explorer_host: newValue });
+    refresh();
   };
 
   return (
     <InfoRow
-      label={t('admin.paymentMethod.arcblock.api_host.label')}
+      label={t('admin.paymentMethod.arcblock.explorer_host.label')}
       value={
-        <Stack
-          direction="row"
-          spacing={1}
-          sx={{
-            alignItems: 'center',
-            flexWrap: 'wrap',
-          }}>
-          {edit ? (
-            <>
-              <TextField
-                value={tempValue}
-                onChange={(e) => {
-                  const val = e.target.value;
-                  if (!val) {
-                    setError(t('common.required'));
-                  } else {
-                    setError('');
-                  }
-                  setTempValue(val);
-                }}
-                variant="outlined"
-                size="small"
-                sx={{ flex: 1 }}
-                placeholder={t('admin.paymentMethod.arcblock.api_host.tip')}
-                error={!!error}
-                slotProps={{
-                  input: {
-                    endAdornment: error ? (
-                      <Typography color="error" sx={{ whiteSpace: 'nowrap' }}>
-                        {error}
-                      </Typography>
-                    ) : undefined,
-                  },
-                }}
-              />
-              <IconButton onClick={handleSave} size="small">
-                <Check />
-              </IconButton>
-              <IconButton onClick={handleCancel} size="small">
-                <Close />
-              </IconButton>
-            </>
-          ) : (
-            <>
-              <Typography variant="body2">{value}</Typography>
-              <IconButton onClick={() => setEdit(true)} size="small">
-                <EditOutlined fontSize="small" />
-              </IconButton>
-            </>
-          )}
-        </Stack>
+        <EditInLine
+          value={method.settings?.arcblock?.explorer_host || ''}
+          onSave={handleSave}
+          placeholder={t('admin.paymentMethod.arcblock.explorer_host.tip')}
+          required
+        />
       }
     />
   );
@@ -219,11 +173,13 @@ function Balance({
   balances,
   addresses,
   setDidDialog,
+  refresh,
 }: {
   method: TPaymentMethodExpanded;
   balances: { [currencyId: string]: string };
   addresses: { arcblock: string; ethereum: string };
   setDidDialog: (value: any) => void;
+  refresh: () => void;
 }) {
   const { t } = useLocaleContext();
   const defaultCurrency = (method.payment_currencies || [])?.find(
@@ -252,7 +208,11 @@ function Balance({
   };
   return (
     <>
-      <InfoRow label={t('admin.paymentMethod.props.explorer_host')} value={explorerHost} />
+      {method.type === 'arcblock' ? (
+        <EditApiExplorerHost method={method} refresh={refresh} />
+      ) : (
+        <InfoRow label={t('admin.paymentMethod.props.explorer_host')} value={explorerHost} />
+      )}
       <InfoRow
         label={
           <Box
@@ -461,6 +421,11 @@ export default function PaymentMethods() {
     }
   };
 
+  const handleRefresh = () => {
+    runAsync();
+    refresh(true);
+  };
+
   return (
     <>
       {Object.keys(groups).map((x) => (
@@ -513,7 +478,7 @@ export default function PaymentMethods() {
                 container
                 spacing={2}
                 sx={{
-                  mt: 0,
+                  mt: 1,
                 }}>
                 <Grid
                   size={{
@@ -521,10 +486,16 @@ export default function PaymentMethods() {
                     md: 6,
                   }}>
                   <InfoRow label={t('admin.paymentMethod.props.type')} value={method.type} />
-                  {method.type === 'arcblock' && <EditApiHost method={method} />}
+                  {method.type === 'arcblock' && <EditApiHost method={method} refresh={handleRefresh} />}
                   {['ethereum', 'base'].includes(method.type) && <RpcStatus method={method} />}
                   {['arcblock', 'ethereum', 'base'].includes(method.type) && (
-                    <Balance method={method} balances={balances} addresses={addresses} setDidDialog={setDidDialog} />
+                    <Balance
+                      method={method}
+                      balances={balances}
+                      addresses={addresses}
+                      setDidDialog={setDidDialog}
+                      refresh={handleRefresh}
+                    />
                   )}
 
                   <InfoRow label={t('admin.paymentMethod.props.confirmation')} value={method.confirmation.type} />

package/src/pages/customer/index.tsx

@@ -40,6 +40,7 @@ import { memo, useEffect, useState } from 'react';
 import { useNavigate, useSearchParams } from 'react-router-dom';
 import { joinURL } from 'ufo';
 import CreditOverview from '../../components/customer/credit-overview';
+import ConditionalSection from '../../components/conditional-section';
 
 import { useTransitionContext } from '../../components/progress-bar';
 import CurrentSubscriptions from '../../components/subscription/portal/list';
@@ -214,7 +215,6 @@ export default function CustomerHome() {
   const navigate = useNavigate();
   const [subscriptionStatus, setSubscriptionStatus] = useState(false);
   const [hasSubscriptions, setHasSubscriptions] = useState(false);
-  const [hasRevenues, setHasRevenues] = useState(false);
   const { startTransition } = useTransitionContext();
   const {
     data,
@@ -480,15 +480,15 @@ export default function CustomerHome() {
   );
 
   // 独立的Credit Card组件
-  const CreditCard = loadingCard ? (
-    <CardSkeleton height={400} />
-  ) : (
-    <Box className="base-card section section-credit">
-      <Box className="section-header" sx={{ mb: 2 }}>
-        <Typography variant="h3">{t('admin.creditGrants.title')}</Typography>
+  const CreditCard = (
+    <ConditionalSection skeleton={loadingCard}>
+      <Box className="base-card section section-credit">
+        <Box className="section-header" sx={{ mb: 2 }}>
+          <Typography variant="h3">{t('admin.creditGrants.title')}</Typography>
+        </Box>
+        <CreditOverview customerId={data?.id || ''} settings={settings} />
       </Box>
-      <CreditOverview customerId={data?.id} settings={settings} />
-    </Box>
+    </ConditionalSection>
   );
 
   const InvoiceCard = loadingCard ? (
@@ -519,13 +519,15 @@ export default function CustomerHome() {
     </Box>
   );
 
-  const RevenueCard = loadingCard ? null : (
-    <Box className="base-card section section-revenue" sx={{ visibility: hasRevenues ? 'visible' : 'hidden' }}>
-      <Box className="section-header">
-        <Typography variant="h3">{t('customer.payout.title')}</Typography>
+  const RevenueCard = (
+    <ConditionalSection skeleton={loadingCard}>
+      <Box className="base-card section section-revenue">
+        <Box className="section-header">
+          <Typography variant="h3">{t('customer.payout.title')}</Typography>
+        </Box>
+        <CustomerRevenueList />
       </Box>
-      <CustomerRevenueList setHasRevenues={setHasRevenues} />
-    </Box>
+    </ConditionalSection>
   );
 
   return (

package/src/pages/customer/recharge/account.tsx

@@ -260,7 +260,7 @@ export default function BalanceRechargePage() {
     if (Number(value) > MAX_SAFE_AMOUNT) {
       return;
     }
-    const precision = currency.decimal;
+    const precision = currency.maximum_precision;
     const errorMessage = formatAmountPrecisionLimit(value, locale, precision || 6);
     setAmountError(errorMessage || '');
     setAmount(value);