调整购买页面价格显示

src/app/admin/balance/page.tsx

@@ -197,7 +197,7 @@ export default function BalancePage(props: BalancePageProps) {
                   <div className="flex items-center gap-1">
                     <span
                       className={`font-semibold ${
-                        isPositive ? 'text-green-600' : 'text-red-600'
+                        isPositive ? 'text-red-600' : 'text-green-600'
                       }`}
                     >
                       {isPositive ? '+' : ''}

src/components/composites/purchase/index.tsx

@@ -30,6 +30,7 @@ export default function Purchase() {
       const res = profile
         ? await listProduct({})
         : await listProductHome({})
+      console.log(res, 'res')
 
       if (res.success) {
         setProductList(res.data)

src/components/composites/purchase/long/center.tsx

@@ -9,7 +9,7 @@ import {Card} from '@/components/ui/card'
 import {BillingMethodField} from '../shared/billing-method-field'
 import {FeatureList} from '../shared/feature-list'
 import {NumberStepperField} from '../shared/number-stepper-field'
-import {getAvailablePurchaseExpires, getAvailablePurchaseLives, getPurchaseSkuCountMin, getPurchaseSkuPrice, hasPurchaseSku, PurchaseSkuData} from '../shared/sku'
+import {getAvailablePurchaseExpires, getAvailablePurchaseLives, getPurchaseSkuCountMin, getPurchaseSkuDiscount, getPurchaseSkuPrice, hasPurchaseSku, PurchaseSkuData} from '../shared/sku'
 
 export default function Center({skuData}: {
   skuData: PurchaseSkuData
@@ -18,7 +18,7 @@ export default function Center({skuData}: {
   const type = useWatch<Schema>({name: 'type'}) as Schema['type']
   const live = useWatch<Schema>({name: 'live'}) as Schema['live']
   const expire = useWatch<Schema>({name: 'expire'}) as Schema['expire']
-  const {modeList, priceMap} = skuData
+  const {modeList, priceMap, discountMap} = skuData
   const liveList = type === '1'
     ? getAvailablePurchaseLives(skuData, {mode: type, expire})
     : getAvailablePurchaseLives(skuData, {mode: type})
@@ -144,6 +144,11 @@ export default function Center({skuData}: {
                 live,
                 expire: priceExpire,
               })
+              const discount = getPurchaseSkuDiscount(discountMap, {
+                mode: type,
+                live,
+                expire: priceExpire,
+              })
               return (
                 <FormOption
                   key={live}
@@ -151,6 +156,8 @@ export default function Center({skuData}: {
                   value={live}
                   label={`${Number(live) / 60} 小时`}
                   description={price && `￥${price}/IP`}
+                  price={price}
+                  discount={discount}
                   compare={field.value}
                 />
               )

src/components/composites/purchase/long/form.tsx

@@ -20,7 +20,7 @@ export type Schema = z.infer<typeof schema>
 
 export default function LongForm({skuList}: {skuList: ProductItem['skus']}) {
   const skuData = parsePurchaseSkuList('long', skuList)
-  const defaultMode = skuData.modeList.includes('1') ? '1' : '2'
+  const defaultMode = skuData.modeList.includes('2') ? '2' : '1'
   const defaultLive = getAvailablePurchaseLives(skuData, {mode: defaultMode})[0] || ''
   const defaultExpire = defaultMode === '1'
     ? getAvailablePurchaseExpires(skuData, {mode: defaultMode, live: defaultLive})[0] || '0'
@@ -46,7 +46,7 @@ export default function LongForm({skuList}: {skuList: ProductItem['skus']}) {
   return (
     <Form form={form} className="flex flex-col lg:flex-row gap-4">
       <Center skuData={skuData}/>
-      <PurchaseSidePanel kind="long"/>
+      <PurchaseSidePanel kind="long" skuData={skuData}/>
     </Form>
   )
 }

src/components/composites/purchase/option.tsx

@@ -9,12 +9,37 @@ export type FormOptionProps = {
   value: string
   label?: string
   description?: string
+  price?: string
+  discount?: number
   compare: string
   className?: string
   children?: ReactNode
 }
 
 export default function FormOption(props: FormOptionProps) {
+  // 安全地解析价格
+  const priceNum = props.price ? parseFloat(props.price) : NaN
+  const isValidPrice = !isNaN(priceNum) && priceNum > 0
+
+  const discount = typeof props.discount === 'number' ? props.discount : undefined
+  const hasDiscount = isValidPrice && discount !== undefined && discount < 100
+  const discountedPrice = hasDiscount ? priceNum * discount / 100 : null
+
+  const formatPrice = (price: number | string): string => {
+    const num = typeof price === 'string' ? parseFloat(price) : price
+    // 如果是 NaN 或无效值，返回空字符串
+    if (isNaN(num) || !isFinite(num)) return ''
+
+    const str = num.toString()
+    if (!str.includes('.')) return str
+
+    const decimal = str.split('.')[1]
+    if (/^0+$/.test(decimal)) return Math.floor(num).toString()
+    if (decimal.length <= 2) return str
+
+    return num.toFixed(4).replace(/\.?0+$/, '')
+  }
+
   return (
     <>
       <FormLabel
@@ -28,7 +53,24 @@ export default function FormOption(props: FormOptionProps) {
         {props.children ? props.children : (
           <>
             <span>{props.label}</span>
-            {props.description && <p className="text-sm text-gray-500">{props.description}</p>}
+            {props.description && !isValidPrice && (
+              <p className="text-sm text-gray-500">{props.description}</p>
+            )}
+            {isValidPrice && (
+              <div className="flex items-center gap-2 flex-wrap">
+                {hasDiscount ? (
+                  <>
+                    <p className="text-sm  font-medium">￥{formatPrice(discountedPrice!)}/IP</p>
+                    <p className="text-sm text-gray-500 line-through">原价:{formatPrice(props.price!)}/IP</p>
+                    {/* <span className="text-xs font-medium text-orange-600 bg-orange-50 px-1.5 py-0.5 rounded-full">
+                      {props.discount}折
+                    </span> */}
+                  </>
+                ) : (
+                  <p className="text-sm">￥{formatPrice(props.price!)}/IP</p>
+                )}
+              </div>
+            )}
           </>
         )}
       </FormLabel>

src/components/composites/purchase/shared/billing-method-field.tsx

@@ -34,16 +34,6 @@ export function BillingMethodField(props: {
           }}
           className="flex gap-4 max-md:flex-col"
         >
-
-          {props.modeList.includes('1') && (
-            <FormOption
-              id={`${id}-1`}
-              value="1"
-              label="包时套餐"
-              description="适用于每日提取量稳定的业务场景"
-              compare={field.value}
-            />
-          )}
           {props.modeList.includes('2') && (
             <FormOption
               id={`${id}-2`}
@@ -53,6 +43,15 @@ export function BillingMethodField(props: {
               compare={field.value}
             />
           )}
+          {props.modeList.includes('1') && (
+            <FormOption
+              id={`${id}-1`}
+              value="1"
+              label="包时套餐"
+              description="适用于每日提取量稳定的业务场景"
+              compare={field.value}
+            />
+          )}
         </RadioGroup>
       )}
     </FormField>

src/components/composites/purchase/shared/side-panel.tsx

@@ -11,7 +11,7 @@ import {FieldPayment} from './field-payment'
 import {buildPurchaseResource, PurchaseKind, PurchaseSelection} from './resource'
 import {getPrice, getPriceHome} from '@/actions/resource'
 import {ExtraResp} from '@/lib/api'
-import {formatPurchaseLiveLabel} from './sku'
+import {formatPurchaseLiveLabel, getPurchaseSkuCountMin, PurchaseSkuData} from './sku'
 import {User} from '@/lib/models'
 import {PurchaseFormValues} from './form-values'
 import {IdCard} from 'lucide-react'
@@ -25,6 +25,7 @@ const emptyPrice: ExtraResp<typeof getPrice> = {
 
 export type PurchaseSidePanelProps = {
   kind: PurchaseKind
+  skuData: PurchaseSkuData
 }
 
 export function PurchaseSidePanel(props: PurchaseSidePanelProps) {
@@ -44,7 +45,7 @@ export function PurchaseSidePanel(props: PurchaseSidePanelProps) {
     expire,
     dailyLimit,
   }
-  const {priceData, isLoading, isError} = usePurchasePrice(profile, selection)
+  const {priceData, isLoading, isError} = usePurchasePrice(profile, selection, props.skuData)
   const {price, actual: discountedPrice = '0.00'} = priceData
   const totalDiscount = getTotalDiscount(price, discountedPrice)
   const hasDiscount = Number(totalDiscount) > 0
@@ -154,7 +155,7 @@ export function PurchaseSidePanel(props: PurchaseSidePanelProps) {
   )
 }
 
-function usePurchasePrice(profile: User | null, selection: PurchaseSelection) {
+function usePurchasePrice(profile: User | null, selection: PurchaseSelection, skuData: PurchaseSkuData) {
   const [priceData, setPriceData] = useState<ExtraResp<typeof getPrice>>(emptyPrice)
   const [isLoading, setIsLoading] = useState(true)
   const [isError, setIsError] = useState(false)
@@ -164,6 +165,15 @@ function usePurchasePrice(profile: User | null, selection: PurchaseSelection) {
   useEffect(() => {
     const requestId = ++requestIdRef.current
 
+    const expireValue = mode === '1' ? expire : '0'
+    const countMin = getPurchaseSkuCountMin(skuData, {mode, live, expire: expireValue})
+    const quantity = mode === '1' ? dailyLimit : quota
+    if (countMin > 0 && quantity < countMin) {
+      setIsLoading(false)
+      setIsError(false)
+      return
+    }
+
     const loadPrice = async () => {
       setIsLoading(true)
       setIsError(false)
@@ -177,6 +187,7 @@ function usePurchasePrice(profile: User | null, selection: PurchaseSelection) {
           expire,
           dailyLimit,
         })
+
         const response = profile
           ? await getPrice(resource)
           : await getPriceHome(resource)
@@ -184,7 +195,9 @@ function usePurchasePrice(profile: User | null, selection: PurchaseSelection) {
         if (requestId !== requestIdRef.current) {
           return
         }
-
+        if (!response.success) {
+          throw new Error(response.message)
+        }
         if (response.success) {
           setPriceData({
             price: response.data.price,
@@ -211,7 +224,7 @@ function usePurchasePrice(profile: User | null, selection: PurchaseSelection) {
     }
 
     loadPrice()
-  }, [dailyLimit, expire, kind, live, mode, profile, quota])
+  }, [dailyLimit, expire, kind, live, mode, profile, quota, skuData])
 
   return {priceData, isLoading, isError}
 }

src/components/composites/purchase/shared/sku.ts

@@ -8,12 +8,14 @@ export type PurchaseSkuItem = {
   expire: string
   price: string
   count_min: number
+  discount: number
 }
 
 export type PurchaseSkuData = {
   items: PurchaseSkuItem[]
   priceMap: Map<string, string>
   countMinMap: Map<string, number>
+  discountMap: Map<string, number>
   modeList: PurchaseMode[]
   liveList: string[]
   expireList: string[]
@@ -27,6 +29,7 @@ export function parsePurchaseSkuList(kind: PurchaseKind, skuList: ProductItem['s
   const items: PurchaseSkuItem[] = []
   const priceMap = new Map<string, string>()
   const countMinMap = new Map<string, number>()
+  const discountMap = new Map<string, number>()
   const modeSet = new Set<PurchaseMode>()
   const liveSet = new Set<number>()
   const expireSet = new Set<number>()
@@ -51,6 +54,7 @@ export function parsePurchaseSkuList(kind: PurchaseKind, skuList: ProductItem['s
     const countMin = typeof sku.count_min === 'number' ? sku.count_min : Number(sku.count_min) || 0
     countMinMap.set(code, countMin)
 
+    const skuDiscount = sku.discount ?? 100
     items.push({
       code,
       mode,
@@ -58,8 +62,10 @@ export function parsePurchaseSkuList(kind: PurchaseKind, skuList: ProductItem['s
       expire: expireValue,
       price: sku.price,
       count_min: countMin,
+      discount: skuDiscount,
     })
     priceMap.set(code, sku.price)
+    discountMap.set(code, skuDiscount)
     modeSet.add(mode)
 
     liveSet.add(live)
@@ -82,6 +88,7 @@ export function parsePurchaseSkuList(kind: PurchaseKind, skuList: ProductItem['s
     items,
     priceMap,
     countMinMap,
+    discountMap,
     modeList: (['2', '1'] as const).filter(mode => modeSet.has(mode)),
     liveList: sortNumericValues(liveSet),
     expireList: sortNumericValues(expireSet),
@@ -157,6 +164,14 @@ export function getPurchaseSkuPrice(priceMap: Map<string, string>, props: {
   return priceMap.get(getPurchaseSkuKey(props))
 }
 
+export function getPurchaseSkuDiscount(discountMap: Map<string, number>, props: {
+  mode: PurchaseMode
+  live: string
+  expire: string
+}) {
+  return discountMap.get(getPurchaseSkuKey(props))
+}
+
 export function formatPurchaseLiveLabel(live: string, kind: PurchaseKind) {
   const minutes = Number(live)
 

src/components/composites/purchase/short/center.tsx

@@ -9,7 +9,7 @@ import {Card} from '@/components/ui/card'
 import {BillingMethodField} from '../shared/billing-method-field'
 import {FeatureList} from '../shared/feature-list'
 import {NumberStepperField} from '../shared/number-stepper-field'
-import {getAvailablePurchaseExpires, getAvailablePurchaseLives, getPurchaseSkuCountMin, getPurchaseSkuPrice, hasPurchaseSku, PurchaseSkuData} from '../shared/sku'
+import {getAvailablePurchaseExpires, getAvailablePurchaseLives, getPurchaseSkuCountMin, getPurchaseSkuDiscount, getPurchaseSkuPrice, hasPurchaseSku, PurchaseSkuData} from '../shared/sku'
 
 export default function Center({
   skuData,
@@ -20,7 +20,7 @@ export default function Center({
   const type = useWatch<Schema>({name: 'type'}) as Schema['type']
   const live = useWatch<Schema>({name: 'live'}) as Schema['live']
   const expire = useWatch<Schema>({name: 'expire'}) as Schema['expire']
-  const {modeList, priceMap} = skuData
+  const {modeList, priceMap, discountMap} = skuData
   const liveList = type === '1'
     ? getAvailablePurchaseLives(skuData, {mode: type, expire})
     : getAvailablePurchaseLives(skuData, {mode: type})
@@ -145,6 +145,11 @@ export default function Center({
                 live,
                 expire: priceExpire,
               })
+              const discount = getPurchaseSkuDiscount(discountMap, {
+                mode: type,
+                live,
+                expire: priceExpire,
+              })
               const minutes = Number(live)
               const hours = minutes / 60
               const label = minutes % 60 === 0 ? `${hours} 小时` : `${minutes} 分钟`
@@ -155,6 +160,8 @@ export default function Center({
                   value={live}
                   label={label}
                   description={price && `￥${price}/IP`}
+                  price={price}
+                  discount={discount}
                   compare={field.value}
                 />
               )

src/components/composites/purchase/short/form.tsx

@@ -20,7 +20,7 @@ export type Schema = z.infer<typeof schema>
 
 export default function ShortForm({skuList}: {skuList: ProductItem['skus']}) {
   const skuData = parsePurchaseSkuList('short', skuList)
-  const defaultMode = skuData.modeList.includes('1') ? '1' : '2'
+  const defaultMode = skuData.modeList.includes('2') ? '2' : '1'
   const defaultLive = getAvailablePurchaseLives(skuData, {mode: defaultMode})[0] || ''
   const defaultExpire = defaultMode === '1'
     ? getAvailablePurchaseExpires(skuData, {mode: defaultMode, live: defaultLive})[0] || '0'
@@ -42,11 +42,12 @@ export default function ShortForm({skuList}: {skuList: ProductItem['skus']}) {
       pay_type: 'balance', // 余额支付
     },
   })
+  console.log(skuData, 'skuData')
 
   return (
     <Form form={form} className="flex flex-col lg:flex-row gap-4">
       <Center skuData={skuData}/>
-      <PurchaseSidePanel kind="short"/>
+      <PurchaseSidePanel kind="short" skuData={skuData}/>
     </Form>
   )
 }

src/lib/models/product-sku.ts

@@ -7,5 +7,6 @@ export type ProductSku = {
   price_min: string
   product_id: number
   discount_id: number
+  discount?: number
   status: number
 }