lanhu/web
2
0
Fork 0
Code Issues Actions Packages Releases 11 Activity

开启充值和余额支付功能

Browse Source
This commit is contained in:
Eamon-meng
2026-03-31 16:11:36 +08:00
parent e27869fb4a
commit 8ce5f99a24
8 changed files with 121 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/admin/(dashboard)/_client/userCenter.tsx
View File

@@ -59,7 +59,7 @@ export default async function UserCenter() {
</> </>
)} )}
</div> </div>
{/* <div className="flex flex-col gap-1"> <div className="flex flex-col gap-1">
<h4 className="text-sm text-weak">账户余额</h4> <h4 className="text-sm text-weak">账户余额</h4>
<div className="flex justify-between items-baseline"> <div className="flex justify-between items-baseline">
<p className="text-xl text-accent"> <p className="text-xl text-accent">
@@ -68,7 +68,7 @@ export default async function UserCenter() {
</p> </p>
<RechargeModal/> <RechargeModal/>
</div> </div>
</div> */} </div>
<div className="flex flex-col gap-3"> <div className="flex flex-col gap-3">
<h4 className="text-sm text-weak">快捷入口</h4> <h4 className="text-sm text-weak">快捷入口</h4>
<div className="flex justify-around gap-2"> <div className="flex justify-around gap-2">

189
src/components/composites/extract/index.tsx
View File

@@ -382,102 +382,103 @@ function SelectResource() {
<Loader className="animate-spin" size={20}/> <Loader className="animate-spin" size={20}/>
<span>暂无可用套餐</span> <span>暂无可用套餐</span>
</div> </div>
) : resources.map((resource, i) => ( ) : (
<> <>
<SelectItem {resources.map(resource => (
key={`${resource.id}`} <SelectItem
value={String(resource.id)} key={resource.id}
className="p-3"> value={String(resource.id)}
<div className="flex flex-col gap-2 w-72"> className="p-3">
{resource.type === 1 && resource.short.type === 1 && ( <div className="flex flex-col gap-2 w-72">
<> {resource.type === 1 && resource.short.type === 1 && (
<div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md text-sm"> <>
<Timer size={20}/> <div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md text-sm">
<span>{name(resource)}</span> <Timer size={20}/>
</div> <span>{name(resource)}</span>
<div className="flex text-xs text-weak"> </div>
<span>{resource.resource_no}</span> <div className="flex text-xs text-weak">
</div> <span>{resource.resource_no}</span>
<div className="flex justify-between gap-2 text-xs text-weak"> </div>
<span> <div className="flex justify-between gap-2 text-xs text-weak">
到期时间： <span>
{format(resource.short.expire_at, 'yyyy-MM-dd HH:mm')} 到期时间：
</span> {format(resource.short.expire_at, 'yyyy-MM-dd HH:mm')}
<span>{intlFormatDistance(resource.short.expire_at, new Date())}</span> </span>
</div> <span>{intlFormatDistance(resource.short.expire_at, new Date())}</span>
</> </div>
)} </>
{resource.type === 1 && resource.short.type === 2 && ( )}
<> {resource.type === 1 && resource.short.type === 2 && (
<div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md text-sm"> <>
<Box size={20}/> <div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md text-sm">
<span>{name(resource)}</span> <Box size={20}/>
</div> <span>{name(resource)}</span>
<div className="flex text-xs text-weak"> </div>
<span>{resource.resource_no}</span> <div className="flex text-xs text-weak">
</div> <span>{resource.resource_no}</span>
<div className="flex justify-between gap-2 text-xs text-weak"> </div>
<span> <div className="flex justify-between gap-2 text-xs text-weak">
提取数量： <span>
{resource.short.used} 提取数量：
{' '} {resource.short.used}
/ {' '}
{resource.short.quota} /
</span> {resource.short.quota}
<span> </span>
剩余 <span>
{resource.short.quota - resource.short.used} 剩余
</span> {resource.short.quota - resource.short.used}
</div> </span>
</> </div>
)} </>
{resource.type === 2 && resource.long.type === 1 && ( )}
<> {resource.type === 2 && resource.long.type === 1 && (
<div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md text-sm"> <>
<Timer size={20}/> <div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md text-sm">
<span>{name(resource)}</span> <Timer size={20}/>
</div> <span>{name(resource)}</span>
<div className="flex text-xs text-weak"> </div>
<span>{resource.resource_no}</span> <div className="flex text-xs text-weak">
</div> <span>{resource.resource_no}</span>
<div className="flex justify-between gap-2 text-xs text-weak"> </div>
<span> <div className="flex justify-between gap-2 text-xs text-weak">
到期时间： <span>
{format(resource.long.expire_at, 'yyyy-MM-dd HH:mm')} 到期时间：
</span> {format(resource.long.expire_at, 'yyyy-MM-dd HH:mm')}
<span>{intlFormatDistance(resource.long.expire_at, new Date())}</span> </span>
</div> <span>{intlFormatDistance(resource.long.expire_at, new Date())}</span>
</> </div>
)} </>
{resource.type === 2 && resource.long.type === 2 && ( )}
<> {resource.type === 2 && resource.long.type === 2 && (
<div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md text-sm"> <>
<Box size={20}/> <div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md text-sm">
<span>{name(resource)}</span> <Box size={20}/>
</div> <span>{name(resource)}</span>
<div className="flex text-xs text-weak"> </div>
<span>{resource.resource_no}</span> <div className="flex text-xs text-weak">
</div> <span>{resource.resource_no}</span>
<div className="flex justify-between gap-2 text-xs text-weak"> </div>
<span> <div className="flex justify-between gap-2 text-xs text-weak">
提取数量： <span>
{resource.long.used} 提取数量：
{' '} {resource.long.used}
/ {' '}
{resource.long.quota} /
</span> {resource.long.quota}
<span> </span>
剩余 <span>
{resource.long.quota - resource.long.used} 剩余
</span> {resource.long.quota - resource.long.used}
</div> </span>
</> </div>
)} </>
</div> )}
</SelectItem> </div>
{i < resources.length - 1 && <SelectSeparator className="m-1"/>} </SelectItem>
))}
</> </>
))} )}
</SelectContent> </SelectContent>
</Select> </Select>
)} )}

6
src/components/composites/payment/payment-modal.tsx
View File

@@ -62,12 +62,12 @@ export function PaymentModal(props: PaymentModalProps) {
if (!open) handleClose() if (!open) handleClose()
}}> }}>
{/* {props.platform === TradePlatform.Mobile {props.platform === TradePlatform.Mobile
? <MobilePayment {...props} onClose={handleClose}/> ? <MobilePayment {...props} onClose={handleClose}/>
: <DesktopPayment {...props} onClose={handleClose}/> : <DesktopPayment {...props} onClose={handleClose}/>
} */} }
<UniversalDesktopPayment {...props} onClose={handleClose}/> {/* <UniversalDesktopPayment {...props} onClose={handleClose}/> */}
</Dialog> </Dialog>
) )
} }

2
src/components/composites/purchase/long/form.tsx
View File

@@ -28,7 +28,7 @@ export default function LongForm() {
quota: 500, quota: 500,
expire: '30', // 天 expire: '30', // 天
daily_limit: 100, daily_limit: 100,
pay_type: 'wechat', // 余额支付 pay_type: 'balance', // 余额支付
}, },
}) })

2
src/components/composites/purchase/long/right.tsx
View File

@@ -164,7 +164,7 @@ function BalanceOrLogin(props: {
const profile = use(useProfileStore(store => store.profile)) const profile = use(useProfileStore(store => store.profile))
return profile ? ( return profile ? (
<> <>
{/* <FieldPayment/> */} <FieldPayment/>
<Pay <Pay
method={props.method} method={props.method}
balance={profile.balance} balance={profile.balance}

23
src/components/composites/purchase/shared/field-payment.tsx
View File

@@ -4,9 +4,17 @@ import {FormField} from '@/components/ui/form'
import Image from 'next/image' import Image from 'next/image'
import alipay from '../_assets/alipay.svg' import alipay from '../_assets/alipay.svg'
import wechat from '../_assets/wechat.svg' import wechat from '../_assets/wechat.svg'
import balance from '../_assets/balance.svg'
import RechargeModal from '@/components/composites/recharge'
import {useProfileStore} from '@/components/stores/profile'
import {use} from 'react'
import Link from 'next/link'
import {buttonVariants} from '@/components/ui/button'
export function FieldPayment() { export function FieldPayment() {
return ( const profile = use(useProfileStore(store => store.profile))
return profile ? (
<FormField name="pay_type" label="支付方式" className="flex flex-col gap-6"> <FormField name="pay_type" label="支付方式" className="flex flex-col gap-6">
{({id, field}) => ( {({id, field}) => (
<RadioGroup <RadioGroup
@@ -15,7 +23,7 @@ export function FieldPayment() {
onValueChange={field.onChange} onValueChange={field.onChange}
className="flex flex-col gap-3"> className="flex flex-col gap-3">
{/* <div className="w-full p-3 flex flex-col gap-4 bg-gray-100 rounded-md"> <div className="w-full p-3 flex flex-col gap-4 bg-gray-100 rounded-md">
<p className="flex items-center gap-3"> <p className="flex items-center gap-3">
<Image src={balance} alt="余额icon"/> <Image src={balance} alt="余额icon"/>
<span className="text-sm text-gray-500">账户余额</span> <span className="text-sm text-gray-500">账户余额</span>
@@ -24,16 +32,15 @@ export function FieldPayment() {
<span className="text-xl">{profile.balance}</span> <span className="text-xl">{profile.balance}</span>
<RechargeModal/> <RechargeModal/>
</p> </p>
</div> */} </div>
<FormOption
{/* <FormOption
id={`${id}-balance`} id={`${id}-balance`}
value="balance" value="balance"
compare={field.value} compare={field.value}
className="p-3 w-full flex-row gap-2 justify-center"> className="p-3 w-full flex-row gap-2 justify-center">
<Image src={balance} alt="余额 icon"/> <Image src={balance} alt="余额 icon"/>
<span>余额</span> <span>余额</span>
</FormOption> */} </FormOption>
<FormOption <FormOption
id={`${id}-wechat`} id={`${id}-wechat`}
value="wechat" value="wechat"
@@ -53,5 +60,9 @@ export function FieldPayment() {
</RadioGroup> </RadioGroup>
)} )}
</FormField> </FormField>
) : (
<Link href="/login" className={buttonVariants()}>
登录后支付
</Link>
) )
} }

2
src/components/composites/purchase/short/form.tsx
View File

@@ -28,7 +28,7 @@ export default function ShortForm() {
quota: 10_000, // >= 10000 quota: 10_000, // >= 10000
expire: '30', // 天 expire: '30', // 天
daily_limit: 2_000, // >= 2000 daily_limit: 2_000, // >= 2000
pay_type: 'wechat', // 余额支付 pay_type: 'balance', // 余额支付
}, },
}) })

2
src/components/composites/purchase/short/right.tsx
View File

@@ -165,7 +165,7 @@ function BalanceOrLogin(props: {
const profile = use(useProfileStore(store => store.profile)) const profile = use(useProfileStore(store => store.profile))
return profile ? ( return profile ? (
<> <>
{/* <FieldPayment/> */} <FieldPayment/>
<Pay <Pay
method={props.method} method={props.method}
balance={profile.balance} balance={profile.balance}