2025-06-26 15:12:34 +08:00

79 lines
6.0 KiB
TypeScript

import { Steps } from '@/app/(tabs)/user-message';
import { useTranslation } from 'react-i18next';
import { TouchableOpacity, View } from 'react-native';
import { ThemedText } from '../ThemedText';
interface Props {
setSteps: (steps: Steps) => void;
}
export default function Done(props: Props) {
const { setSteps } = props
const { t } = useTranslation();
const handleContinue = () => {
};
return (
<View className="flex-1 bg-bgPrimary absolute top-0 left-0 right-0 bottom-0 h-full">
<View className="absolute top-[2rem] left-0 right-0 bottom-[10rem] justify-center items-center">
<ThemedText className="text-4xl !text-white text-center">
{t('auth.userMessage.allDone', { ns: 'login' })}
</ThemedText>
</View>
<View className='flex-1' />
<svg width="402" height="658" viewBox="0 0 402 658" fill="none" xmlns="http://www.w3.org/2000/svg" className='!w-full !h-full'>
<path d="M188.942 376.831C189.985 369.965 206.061 373.848 213.969 376.647L197.429 388.107C193.075 388.588 187.898 383.698 188.942 376.831Z" fill="#FFDBA3" />
<path d="M192.525 377.316C192.829 371.596 203.633 375.761 208.997 378.558L200.667 383.979C197.827 384.142 192.221 383.036 192.525 377.316Z" fill="#AC7E35" />
<path d="M290.119 318.416C283.651 315.886 278.975 331.75 277.446 339.999L295.64 331.404C298.234 327.874 296.588 320.946 290.119 318.416Z" fill="#FFDBA3" />
<path d="M288.748 321.762C283.643 319.165 281.847 330.604 281.588 336.647L290.448 332.145C292.008 329.766 293.853 324.359 288.748 321.762Z" fill="#AC7E35" />
<path d="M153.808 500.814C153.808 367.119 298.537 283.56 414.32 350.407L493.295 396.003C609.078 462.851 609.078 629.97 493.295 696.817L414.32 742.413C298.537 809.261 153.808 725.701 153.808 592.006L153.808 500.814Z" fill="#FFD18A" />
<rect x="271.421" y="424.225" width="6.83761" height="9.57265" rx="3.4188" transform="rotate(150 271.421 424.225)" fill="#4C320C" />
<rect x="292.738" y="411.917" width="6.83761" height="9.57265" rx="3.4188" transform="rotate(150 292.738 411.917)" fill="#4C320C" />
<path d="M230.424 528.749C237.002 445.589 324.896 394.844 400.204 430.726L485.973 471.594C572.466 512.806 577.258 634.129 494.284 682.034L401.022 735.879C318.049 783.784 215.375 718.973 222.931 623.462L230.424 528.749Z" fill="#FFF8DE" />
<g filter="url(#filter0_i_35_262)">
<ellipse cx="391.673" cy="421.909" rx="112.137" ry="80" transform="rotate(-30 391.673 421.909)" fill="#FFF8DE" />
</g>
<g filter="url(#filter1_i_35_262)">
<ellipse cx="226.462" cy="517.293" rx="111.453" ry="80" transform="rotate(-30 226.462 517.293)" fill="#FFF8DE" />
</g>
<ellipse cx="288.942" cy="435.427" rx="8.20513" ry="6.15385" transform="rotate(150 288.942 435.427)" fill="#FFB8B9" />
<ellipse cx="19.5369" cy="7.79375" rx="19.5369" ry="7.79375" transform="matrix(0.994747 -0.102367 -0.102367 -0.994747 385.179 534.461)" fill="#FFD38D" />
<ellipse cx="302.278" cy="583.331" rx="19.5369" ry="7.79375" transform="rotate(125.875 302.278 583.331)" fill="#FFD38D" />
<path d="M291.335 441.941C291.335 440.888 292.475 440.23 293.386 440.756L295.438 441.941C296.349 442.467 296.349 443.783 295.438 444.309L293.386 445.494C292.475 446.02 291.335 445.362 291.335 444.309L291.335 441.941Z" fill="#4C320C" />
<defs>
<filter id="filter0_i_35_262" x="274.309" y="332.779" width="222.419" height="182.363" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
<feOffset dx="-12.3077" dy="4.10256" />
<feGaussianBlur stdDeviation="11.2821" />
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.713726 0 0 0 0 0.270588 0 0 0 1 0" />
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_35_262" />
</filter>
<filter id="filter1_i_35_262" x="121.953" y="428.378" width="222.692" height="177.831" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix" />
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
<feOffset dx="13.6752" />
<feGaussianBlur stdDeviation="7.52137" />
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.713974 0 0 0 0 0.272498 0 0 0 1 0" />
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_35_262" />
</filter>
</defs>
</svg>
{/* Next Button */}
<View className="w-full mt-8 mb-4 absolute bottom-[0.5rem] p-[1rem]">
<TouchableOpacity
className={`w-full bg-buttonFill rounded-full p-4 items-center`}
onPress={handleContinue}
>
<ThemedText className="text-textTertiary text-lg font-semibold">
{t('auth.userMessage.next', { ns: 'login' })}
</ThemedText>
</TouchableOpacity>
</View>
</View>
)
}