SidharthPL/Event-Management-System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Convert backends to Firebase and combine projects

Browse Source
This commit is contained in:
Abiram070207
2026-06-18 14:07:24 +05:30
commit 0a76feafc5
147 changed files with 35104 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

146
RIT-EVENT-MANAGEMENT--main/components/TicketVerificationView.tsx Normal file
View File

@@ -0,0 +1,146 @@
import React from 'react';
import { Ticket, Event } from '../types';
interface TicketVerificationViewProps {
ticket: Ticket;
event: Event;
onBack: () => void;
}
const TicketVerificationView: React.FC<TicketVerificationViewProps> = ({ ticket, event, onBack }) => {
return (
<div className="min-h-screen bg-black flex flex-col items-center justify-center p-6 md:p-12 animate-in fade-in duration-700">
{/* Background Decorative Mesh */}
<div className="fixed inset-0 pointer-events-none opacity-20">
<div className="absolute top-0 right-0 w-[600px] h-[600px] bg-amber-500 rounded-full blur-[150px] -translate-y-1/2 translate-x-1/2"></div>
<div className="absolute bottom-0 left-0 w-[600px] h-[600px] bg-[#f97316] rounded-full blur-[150px] translate-y-1/2 -translate-x-1/2"></div>
</div>
<div className="relative z-10 w-full max-w-5xl">
<div className="flex justify-between items-center mb-10 w-full">
<div className="flex items-center gap-4">
<div className="w-[3px] h-12 bg-[#f97316] rounded-full"></div>
<div className="flex flex-col leading-none tracking-tight">
<span className="text-xl font-black text-white uppercase">RAJALAKSHMI</span>
<span className="text-[10px] font-bold text-white/50 tracking-[0.2em] uppercase py-1">INSTITUTE OF TECHNOLOGY</span>
</div>
</div>
<button
onClick={onBack}
className="px-8 py-3 bg-[#f97316] text-white rounded-full font-black text-[10px] uppercase tracking-widest hover:bg-[#ea580c] transition-all shadow-xl shadow-orange-950/20 active:scale-95"
>
RETURN TO PORTAL
</button>
</div>
{/* GOLDEN TICKET DESIGN - Matching Screenshot Concept */}
<div className="relative w-full rounded-[2.5rem] overflow-hidden shadow-[0_50px_100px_rgba(0,0,0,0.5)] flex flex-col md:flex-row border border-white/10 group">
{/* Main Gold Section */}
<div className="flex-1 bg-gradient-to-br from-[#d4af37] via-[#f9d976] to-[#b8860b] relative flex flex-col p-12 overflow-hidden shadow-inner">
{/* Stripes Texture Overlay */}
<div className="absolute inset-0 opacity-10 pointer-events-none" style={{ backgroundImage: 'repeating-linear-gradient(90deg, transparent, transparent 15px, rgba(0,0,0,0.5) 15px, rgba(0,0,0,0.5) 30px)' }}></div>
{/* Large Barcode Visual Accents */}
<div className="absolute left-8 top-12 bottom-12 w-12 flex flex-col justify-between items-center py-4 border-r border-black/10 opacity-30">
<div className="flex flex-col gap-1 w-full px-2">
{[...Array(12)].map((_, i) => <div key={i} className={`h-1 w-full bg-black ${i % 3 === 0 ? 'h-2' : 'h-0.5'}`}></div>)}
</div>
<div className="font-mono text-[8px] font-bold rotate-90 whitespace-nowrap text-black tracking-widest mt-8">#RIT_AUTH_0928374</div>
</div>
<div className="relative pl-16">
<h1 className="text-[8rem] md:text-[10rem] font-black text-black leading-none mb-10 tracking-tighter mix-blend-overlay opacity-80 uppercase select-none">TICKET</h1>
<div className="space-y-4 mb-16">
<div className="flex items-baseline gap-6">
<h2 className="text-4xl md:text-5xl font-black text-black tracking-tight uppercase">{event.date.split(',')[0]}</h2>
<span className="w-12 h-1 bg-black/40"></span>
<h2 className="text-4xl md:text-5xl font-black text-black/60 tracking-tight uppercase">{event.schedule?.[0]?.start_time || ''}</h2>
</div>
<p className="text-xl font-bold text-black/40 uppercase tracking-[0.4em]">{event.location}</p>
</div>
<div className="grid grid-cols-3 gap-12 border-t-2 border-black/10 pt-8 mt-12 max-w-xl">
<div className="flex flex-col gap-2">
<span className="text-[10px] font-black text-black/30 uppercase tracking-widest">GATE</span>
<span className="text-2xl font-black text-black">A-02</span>
</div>
<div className="flex flex-col gap-2">
<span className="text-[10px] font-black text-black/30 uppercase tracking-widest">ROW</span>
<span className="text-2xl font-black text-black">VIP-0</span>
</div>
<div className="flex flex-col gap-2">
<span className="text-[10px] font-black text-black/30 uppercase tracking-widest">SEAT</span>
<span className="text-2xl font-black text-black">A-42</span>
</div>
</div>
{/* USER DATA DISPLAY AREA */}
<div className="mt-16 bg-white/10 backdrop-blur-sm rounded-[2rem] p-8 border border-white/20 shadow-xl max-w-2xl">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<span className="text-[9px] font-black text-black/40 uppercase tracking-widest block mb-1">Pass Holder</span>
<p className="text-xl font-black text-black truncate">{ticket.userName}</p>
<p className="text-[11px] font-bold text-black/60">{ticket.userEmail}</p>
</div>
<div className="text-right md:text-left">
<span className="text-[9px] font-black text-black/40 uppercase tracking-widest block mb-1">Academic Dossier</span>
<p className="text-lg font-black text-black">{ticket.regNo}</p>
<p className="text-[11px] font-bold text-black/60 uppercase">{ticket.dept} • {ticket.section}</p>
</div>
</div>
<div className="mt-6 pt-6 border-t border-black/5 flex items-center justify-between">
<div>
<span className="text-[9px] font-black text-black/40 uppercase tracking-widest block mb-1">Access Protocol</span>
<span className="text-[10px] font-black bg-emerald-500 text-white px-3 py-1 rounded-full">VERIFIED AUTHENTIC</span>
</div>
<i className="fas fa-shield-check text-2xl text-emerald-600"></i>
</div>
</div>
</div>
</div>
{/* Right Black Sidebar Section */}
<div className="w-full md:w-80 bg-black flex flex-col p-10 justify-between relative">
<div className="absolute top-0 bottom-0 left-0 w-[1px] bg-white/10 hidden md:block"></div>
<div className="flex flex-col items-center text-center">
<span className="text-[10px] font-black text-white/30 uppercase tracking-[0.5em] vertical-text transform rotate-180 mb-10 hidden md:block" style={{ writingMode: 'vertical-rl' }}>ADMIT ONE TICKET</span>
<h3 className="text-4xl font-black text-white leading-none mb-6 vertical-text transform rotate-180 hidden md:block" style={{ writingMode: 'vertical-rl' }}>TICKET</h3>
<div className="flex flex-col items-center gap-4 mt-8">
<div className="w-24 h-24 bg-[#f9d976] p-2 rounded-2xl shadow-[0_10px_30px_rgba(249,217,118,0.2)]">
<img src={`https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=VERIFIED_${ticket.ticketId}`} alt="Verified" className="w-full h-full mix-blend-multiply" />
</div>
<p className="text-amber-400 font-black text-[9px] uppercase tracking-[0.3em]">VIP ENTRY PASS</p>
</div>
</div>
<div className="flex flex-col items-center gap-6 mt-12 md:mt-0">
<div className="w-full h-24 relative opacity-40">
<div className="absolute inset-0 flex gap-1 items-end">
{[...Array(20)].map((_, i) => (
<div key={i} className="flex-1 bg-white" style={{ height: `${Math.random() * 100}%` }}></div>
))}
</div>
<span className="absolute bottom-[-1.5rem] left-1/2 -translate-x-1/2 font-mono text-[8px] text-white/40 tracking-widest">8 0 1 2 4 9 5 3 0 0 1</span>
</div>
<div className="bg-white/5 border border-white/10 rounded-2xl p-6 w-full group-hover:border-amber-500/30 transition-colors">
<span className="text-[8px] font-black text-gray-500 uppercase tracking-widest block mb-2">Event Authority</span>
<p className="text-sm font-black text-white uppercase tracking-tight truncate">{event.title}</p>
</div>
</div>
</div>
</div>
<div className="mt-12 text-center text-white/30 text-[10px] font-bold uppercase tracking-[0.4em] animate-pulse">
Digital Authentication Synchronized with Registrar Office
</div>
</div>
</div>
);
};
export default TicketVerificationView;