Files
Genarrative/src/components/platform-entry/PlatformProfileRewardCodeRedeemModal.tsx
kdletters 914b74ce8e 拆出个人中心剩余弹层组件
- 新增充值账单任务兑换码共享组件并补齐组件级测试
- 让 RpgEntryHomeView 改为复用新的 profile 弹层组件并删除内联实现
- 更新 PlatformUiKit 收口文档与团队共享记忆记录新的组件沉淀
2026-06-10 20:06:06 +08:00

85 lines
2.3 KiB
TypeScript

import { PlatformActionButton } from '../common/PlatformActionButton';
import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
import { PlatformTextField } from '../common/PlatformTextField';
import { PlatformProfileModalShell } from './PlatformProfileModalShell';
export type PlatformProfileRewardCodeRedeemModalProps = {
value: string;
isSubmitting: boolean;
error: string | null;
success: string | null;
onChange: (value: string) => void;
onSubmit: () => void;
onClose: () => void;
};
/**
* 个人中心兑换码弹窗。
* 保持原有输入、回车提交、禁用态和反馈消息语义不变。
*/
export function PlatformProfileRewardCodeRedeemModal({
value,
isSubmitting,
error,
success,
onChange,
onSubmit,
onClose,
}: PlatformProfileRewardCodeRedeemModalProps) {
return (
<PlatformProfileModalShell
title="兑换码"
onClose={onClose}
closeLabel="关闭兑换码"
panelClassName="platform-recharge-modal !max-w-sm rounded-[1.4rem]"
bodyClassName="space-y-3 px-5 py-5"
>
<PlatformTextField
value={value}
onChange={(event) => onChange(event.target.value)}
onKeyDown={(event) => {
if (event.key === 'Enter') {
onSubmit();
}
}}
size="sm"
density="roomy"
className="uppercase tracking-normal"
placeholder="输入兑换码"
aria-label="兑换码"
autoFocus
/>
<PlatformActionButton
surface="profile"
fullWidth
size="md"
className="disabled:opacity-50"
onClick={onSubmit}
disabled={isSubmitting || !value.trim()}
>
{isSubmitting ? '兑换中' : '兑换'}
</PlatformActionButton>
{error ? (
<PlatformStatusMessage
tone="error"
surface="profile"
size="xs"
className="rounded-2xl font-semibold"
>
{error}
</PlatformStatusMessage>
) : null}
{success ? (
<PlatformStatusMessage
tone="success"
surface="profile"
size="xs"
className="rounded-2xl font-semibold"
>
{success}
</PlatformStatusMessage>
) : null}
</PlatformProfileModalShell>
);
}