envide/Nye-TeeOff
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Så alt er med

Browse source
This commit is contained in:
Erol 2026-03-06 16:14:00 +01:00
parent 4713eced56
commit 137328d795
1 changed files with 17 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
frontend/src/app/golfbaner/[slug]/CourseDisplay.tsx
View file

@ -5,7 +5,6 @@ import { STATUS_MAP } from "@/config/constants";
// Designerens definisjon av fargetemaer - Nå med kraftigere tints for kolonnene
const getTeeTheme = (label: string) => {
const name = label.toLowerCase();
if (name.includes("svart") || name.includes("black")) {
return { header: "bg-gray-900 text-white", col: "bg-gray-100", text: "text-gray-900" };
}
@ -53,6 +52,7 @@ export default function CourseDisplay({ course }: { course: any }) {
// Kalkulering av SpH
const activeTee = availableTees[selectedTeeIndex];
let playingHandicap = 0;
if (activeTee && hcp) {
const exactHcp = Number(hcp.replace(',', '.'));
const slope = Number(activeTee.slopeverdi || activeTee.slopeverdi_damer || 113);
@ -70,6 +70,11 @@ export default function CourseDisplay({ course }: { course: any }) {
const sumPar = (holes: any[]) => holes.reduce((acc, h) => acc + (h.par || 0), 0);
const sumLen = (holes: any[], key: string) => holes.reduce((acc, h) => acc + (h.lengths?.[key] || 0), 0);
// Formater utløpsdato
const slopeExpiry = course.slope_valid_until
? new Date(course.slope_valid_until).toLocaleDateString('nb-NO', { year: 'numeric', month: 'short', day: 'numeric' })
: 'Ukjent';
return (
<div className="bg-white rounded-[3rem] shadow-sm border border-gray-200 overflow-hidden mb-12">
@ -77,14 +82,19 @@ export default function CourseDisplay({ course }: { course: any }) {
<div className="p-8 md:p-12 flex flex-col md:flex-row justify-between items-center gap-8 border-b border-gray-100 bg-white">
<div className="text-center md:text-left">
<h2 className="text-5xl font-black text-[#11280f] tracking-tighter">{course.name}</h2>
<p className="text-[#7ca982] font-black uppercase text-xs tracking-[0.2em] mt-2">Par {course.par} • {course.length_meters || '--'} meter</p>
</div>
<p className="text-[#7ca982] font-black uppercase text-xs tracking-[0.2em] mt-2 mb-1">
Par {course.par} • {course.length_meters || '--'} meter
</p>
<p className="text-gray-400 text-[10px] font-bold uppercase tracking-widest">
Rating utløper: {slopeExpiry}
</p>
</div>
<div className="flex items-center gap-6 bg-gray-50 p-6 rounded-[2.5rem] border border-gray-100">
<div className="flex flex-col"><span className="text-[9px] font-black text-[#7ca982] uppercase ml-1">Kjønn</span>
<select value={gender} onChange={e => { setGender(e.target.value as any); setSelectedTeeIndex(0); }} className="bg-transparent text-[#11280f] font-black outline-none border-b-2 border-[#7ca982]/30 pb-1 cursor-pointer">
<option value="herrer">HERRER</option><option value="damer">DAMER</option>
</select>
</select>
</div>
<div className="flex flex-col"><span className="text-[9px] font-black text-[#7ca982] uppercase ml-1">Utslag</span>
<select value={selectedTeeIndex} onChange={e => setSelectedTeeIndex(Number(e.target.value))} className="bg-transparent text-[#11280f] font-black outline-none border-b-2 border-[#7ca982]/30 pb-1 cursor-pointer">
@ -125,7 +135,7 @@ export default function CourseDisplay({ course }: { course: any }) {
<td className="p-4 text-left pl-10 font-black text-lg text-gray-800">{h.hole_number}</td>
<td className="p-4 border-l border-gray-100 bg-white">{h.par}</td>
<td className="p-4 border-l border-gray-100 text-gray-300 text-xs font-mono">{h.hcp_index}</td>
<td className="p-4 border-l border-gray-100 bg-[#7ca982]/5 text-[#7ca982] font-mono">{extra > 0 ? `+${extra}` : '-'}</td>
<td className="p-4 border-l border-gray-100 bg-[#7ca982]/5 text-[#7ca982] font-mono">{extra > 0 ? `+${extra}` : '-'}</td>
<td className="p-4 border-l border-gray-100 bg-[#7ca982]/10 text-lg font-mono">{h.par + extra}</td>
{activeColumns.map((col, i) => (
<td key={i} className={`p-4 border-l border-white font-mono transition-all ${col.theme.col} ${col.theme.text}`}>
@ -158,7 +168,7 @@ export default function CourseDisplay({ course }: { course: any }) {
<td className="p-4 border-l border-gray-100 bg-[#7ca982]/10 text-lg font-mono">{h.par + extra}</td>
{activeColumns.map((col, i) => (
<td key={i} className={`p-4 border-l border-white font-mono transition-all ${col.theme.col} ${col.theme.text}`}>
{h.lengths?.[col.key] || '--'}
{h.lengths?.[col.key] || '--'}
</td>
))}
</tr>