83 lines
2.4 KiB
TypeScript
83 lines
2.4 KiB
TypeScript
import React from "react";
|
|
import { View, Text, TouchableOpacity, Image } from "react-native";
|
|
import QRCode from "react-native-qrcode-svg";
|
|
import ScreenWrapper from "~/components/ui/ScreenWrapper";
|
|
import { Button } from "~/components/ui/button";
|
|
import { router, useLocalSearchParams } from "expo-router";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
export default function EventQRScreen() {
|
|
const params = useLocalSearchParams<{
|
|
code?: string;
|
|
packageName?: string;
|
|
qrImage?: string;
|
|
}>();
|
|
const { t } = useTranslation();
|
|
|
|
const code = params.code || "AMB-123-2025";
|
|
const packageName = params.packageName || "Package 2";
|
|
const qrImage = params.qrImage as string | undefined;
|
|
console.log("qrimage", params.qrImage);
|
|
|
|
const handleClose = () => {
|
|
router.back();
|
|
};
|
|
|
|
const handlePrint = () => {
|
|
router.back();
|
|
};
|
|
|
|
return (
|
|
<ScreenWrapper edges={[]}>
|
|
<View className="flex-1 bg-white">
|
|
{/* QR image */}
|
|
<View className="flex-1 items-center justify-center px-5">
|
|
<View className="items-center justify-center">
|
|
{qrImage ? (
|
|
<Image
|
|
source={{ uri: qrImage }}
|
|
style={{ width: 200, height: 200 }}
|
|
resizeMode="contain"
|
|
/>
|
|
) : (
|
|
<QRCode
|
|
value={code}
|
|
size={200}
|
|
color="#0F7B4A"
|
|
backgroundColor="transparent"
|
|
/>
|
|
)}
|
|
</View>
|
|
|
|
<View className="mt-6 items-center">
|
|
<Text className="text-sm font-dmsans text-[#6B7280]">
|
|
{packageName}
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
|
|
{/* Bottom buttons */}
|
|
<View className="w-full flex flex-col px-5 pb-10 gap-4">
|
|
<Button
|
|
className="h-13 rounded-full bg-[#FFB668]"
|
|
onPress={handlePrint}
|
|
>
|
|
<Text className="text-white font-dmsans-bold text-base">
|
|
{t("eventqrscreen.printButton")}
|
|
</Text>
|
|
</Button>
|
|
|
|
<Button
|
|
className="h-13 rounded-full bg-[#0F7B4A]"
|
|
onPress={handleClose}
|
|
>
|
|
<Text className="text-white font-dmsans-bold text-base">
|
|
{t("eventqrscreen.goBackButton")}
|
|
</Text>
|
|
</Button>
|
|
</View>
|
|
</View>
|
|
</ScreenWrapper>
|
|
);
|
|
}
|