修改购买套餐调用接口后端计算价格 & 重置包时/包量初始化数量

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

@@ -10,11 +10,19 @@ import check from '../_assets/check.svg'
 import {Schema} from '@/components/composites/purchase/long/form'
 import {useFormContext, useWatch} from 'react-hook-form'
 import {Card} from '@/components/ui/card'
+import {useEffect} from 'react'
 
 export default function Center() {
   const form = useFormContext<Schema>()
   const type = useWatch({name: 'type'})
-
+  useEffect(() => {
+    if (type === '1') {
+      form.setValue('quota', 100)
+    }
+    else {
+      form.setValue('quota', 500)
+    }
+  }, [type, form])
   return (
     <Card className="flex-auto p-6 flex flex-col gap-6 relative">
 
@@ -136,7 +144,7 @@ export default function Center() {
           {/* 包时：每日提取上限 */}
           <FormField
             className="space-y-4"
-            name="daily_limit"
+            name="quota"
             label="每日提取上限">
             {({id, field}) => {
               const value = Number(field.value) || 100
@@ -151,7 +159,7 @@ export default function Center() {
                     className={`h-10 w-10 border border-gray-200 rounded-sm flex items-center justify-center text-lg ${
                       value === minValue ? 'opacity-50 cursor-not-allowed' : ''
                     }`}
-                    onClick={() => form.setValue('daily_limit', Math.max(minValue, value - step))}
+                    onClick={() => form.setValue('quota', Math.max(minValue, value - step))}
                     disabled={value === minValue}>
                     <Minus/>
                   </Button>
@@ -164,7 +172,7 @@ export default function Center() {
                     theme="outline"
                     type="button"
                     className="h-10 w-10 border border-gray-200 rounded-sm flex items-center justify-center text-lg"
-                    onClick={() => form.setValue('daily_limit', value + step)}>
+                    onClick={() => form.setValue('quota', value + step)}>
                     <Plus/>
                   </Button>
                 </div>

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

@@ -1,5 +1,5 @@
 'use client'
-import {Suspense, use, useContext, useMemo} from 'react'
+import {Suspense, use, useContext, useEffect, useMemo, useState} from 'react'
 import {PurchaseFormContext} from '@/components/composites/purchase/short/form'
 import {RadioGroup} from '@/components/ui/radio-group'
 import {FormField} from '@/components/ui/form'
@@ -17,6 +17,7 @@ import {merge} from '@/lib/utils'
 import {useFormContext, useWatch} from 'react-hook-form'
 import {Schema} from '@/components/composites/purchase/long/form'
 import {Card} from '@/components/ui/card'
+import {getPrice, CreateResourceReq} from '@/actions/resource'
 
 export default function Right() {
   const {control} = useFormContext<Schema>()
@@ -27,21 +28,37 @@ export default function Right() {
   const expire = useWatch({control, name: 'expire'})
   const dailyLimit = useWatch({control, name: 'daily_limit'})
 
-  const price = useMemo(() => {
+  const [price, setPrice] = useState<string>('0.00')
-    const base = {
-      1: 30,
-      4: 80,
-      8: 120,
-      12: 180,
-      24: 350,
-    }[live]
-    const factor = {
-      1: Number(expire) * dailyLimit,
-      2: quota,
-    }[mode]
-    return (base * factor / 100).toFixed(2)
-  }, [dailyLimit, expire, live, quota, mode])
 
+  useEffect(() => {
+    const price = async () => {
+      const params: CreateResourceReq = {
+        type: 2,
+        long: {
+          live: Number(live),
+          mode: Number(mode),
+          quota: quota,
+          expire: Number(mode) === 1 ? Number(expire) : undefined,
+        },
+      }
+      console.log(params, 'params')
+
+      try {
+        const priceValue = await getPrice(params)
+        if (priceValue.success && priceValue.data?.price) {
+          setPrice(priceValue.data.price)
+        }
+        else {
+          setPrice('0.00')
+        }
+      }
+      catch (error) {
+        console.error('获取价格失败:', error)
+        setPrice('0.00')
+      }
+    }
+    price()
+  }, [dailyLimit, expire, live, quota, mode])
   return (
     <Card className={merge(
       `flex-none basis-90 p-6 flex flex-col gap-6 relative`,

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

@@ -10,11 +10,19 @@ import check from '../_assets/check.svg'
 import {useFormContext, useWatch} from 'react-hook-form'
 import {Schema} from '@/components/composites/purchase/short/form'
 import {Card} from '@/components/ui/card'
+import {useEffect} from 'react'
 
 export default function Center() {
   const form = useFormContext<Schema>()
   const type = useWatch({name: 'type'})
-
+  useEffect(() => {
+    if (type === '1') {
+      form.setValue('quota', 2000)
+    }
+    else {
+      form.setValue('quota', 10000)
+    }
+  }, [type, form])
   return (
     <Card className="flex-auto p-6 flex flex-col gap-6 relative">
 
@@ -130,7 +138,7 @@ export default function Center() {
           {/* 包时：每日提取上限 */}
           <FormField
             className="space-y-4"
-            name="daily_limit"
+            name="quota"
             label="每日提取上限">
             {({id, field}) => (
               <div className="flex gap-2 items-center">
@@ -138,7 +146,7 @@ export default function Center() {
                   theme="outline"
                   type="button"
                   className="h-10 w-10 border border-gray-200 rounded-sm flex items-center justify-center text-lg"
-                  onClick={() => form.setValue('daily_limit', Math.max(2_000, Number(field.value) - 1_000))}
+                  onClick={() => form.setValue('quota', Math.max(2_000, Number(field.value) - 1_000))}
                   disabled={Number(field.value) === 2_000}>
                   <Minus/>
                 </Button>
@@ -154,7 +162,7 @@ export default function Center() {
                   theme="outline"
                   type="button"
                   className="h-10 w-10 border border-gray-200 rounded-sm flex items-center justify-center text-lg"
-                  onClick={() => form.setValue('daily_limit', Number(field.value) + 1_000)}>
+                  onClick={() => form.setValue('quota', Number(field.value) + 1_000)}>
                   <Plus/>
                 </Button>
               </div>

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

@@ -1,5 +1,5 @@
 'use client'
-import {Suspense, use, useMemo} from 'react'
+import {Suspense, use, useEffect, useMemo, useState} from 'react'
 import {Schema} from '@/components/composites/purchase/short/form'
 import {RadioGroup} from '@/components/ui/radio-group'
 import {FormField} from '@/components/ui/form'
@@ -16,7 +16,7 @@ import {merge} from '@/lib/utils'
 import Pay from '@/components/composites/purchase/pay'
 import {useFormContext, useWatch} from 'react-hook-form'
 import {Card} from '@/components/ui/card'
-
+import {CreateResourceReq, getPrice} from '@/actions/resource'
 export default function Right() {
   const {control} = useFormContext<Schema>()
   const method = useWatch({control, name: 'pay_type'})
@@ -26,13 +26,35 @@ export default function Right() {
   const expire = useWatch({control, name: 'expire'})
   const quota = useWatch({control, name: 'quota'})
 
-  const price = useMemo(() => {
+  const [price, setPrice] = useState<string>('0.00')
-    const base = live === '180' ? 150 : Number(live)
+  useEffect(() => {
-    const factor = {
+    const price = async () => {
-      1: Number(expire) * dailyLimit,
+      const params: CreateResourceReq = {
-      2: quota,
+        type: 1,
-    }[mode]
+        short: {
-    return (base * factor / 30000).toFixed(2)
+          live: Number(live),
+          mode: Number(mode),
+          quota: quota,
+          expire: Number(mode) === 1 ? Number(expire) : undefined,
+        },
+      }
+      console.log(params, 'params')
+
+      try {
+        const priceResponse = await getPrice(params)
+        if (priceResponse.success && priceResponse.data?.price) {
+          setPrice(priceResponse.data.price)
+        }
+        else {
+          setPrice('0.00')
+        }
+      }
+      catch (error) {
+        console.error('获取价格失败:', error)
+        setPrice('0.00')
+      }
+    }
+    price()
   }, [dailyLimit, expire, live, quota, mode])
 
   return (