Erweiterung der Teamformatierungsfunktionen um Altersgruppen für bessere Anzeige in Spielplänen

components/HomeSpielplanTeamWidget.vue

@@ -58,9 +58,9 @@
               </p>
             </div>
             <p class="text-sm text-gray-800">
-              {{ formatMatchTeamName(game.HeimMannschaft, game.HeimMannschaftAltersklasse) }}
+              {{ formatMatchTeamName(game.HeimMannschaft, game.HeimMannschaftAltersklasse, game.Altersklasse) }}
               vs
-              {{ formatMatchTeamName(game.GastMannschaft, game.GastMannschaftAltersklasse) }}
+              {{ formatMatchTeamName(game.GastMannschaft, game.GastMannschaftAltersklasse, game.Altersklasse) }}
             </p>
           </div>
         </div>
@@ -97,8 +97,8 @@ const widgetTitle = computed(() => {
   return formatTeamDisplayName(props.teamName, props.teamAgeGroup)
 })
 
-function formatMatchTeamName(teamName, teamAgeGroup) {
-  return formatTeamDisplayName(teamName, teamAgeGroup) || '-'
+function formatMatchTeamName(teamName, teamAgeGroup, competitionAgeGroup) {
+  return formatTeamDisplayName(teamName, teamAgeGroup, competitionAgeGroup) || '-'
 }
 
 const seasonLabel = computed(() => {

components/Navigation.vue

@@ -216,7 +216,7 @@
                     <div class="h-3 w-px shrink-0 bg-primary-700" />
                     <NuxtLink
                       to="/mannschaften/spielplaene"
-                      class="shrink-0 px-2.5 py-1 text-xs text-gray-300 hover:text-white hover:bg-primary-700/50 rounded transition-all"
+                      class="shrink-0 whitespace-nowrap px-2.5 py-1 text-xs text-gray-300 hover:text-white hover:bg-primary-700/50 rounded transition-all"
                       active-class="text-white bg-primary-600"
                     >
                       Spielpläne

components/Spielplan.vue

@@ -146,7 +146,7 @@
                     Heim
                   </p>
                   <p class="font-semibold text-gray-900">
-                    {{ formatTeamName(game.HeimMannschaft, game.HeimMannschaftAltersklasse) }}
+                    {{ formatTeamName(game.HeimMannschaft, game.HeimMannschaftAltersklasse, game.Altersklasse) }}
                   </p>
                 </div>
                 <div class="text-center mx-4">
@@ -159,7 +159,7 @@
                     Gast
                   </p>
                   <p class="font-semibold text-gray-900">
-                    {{ formatTeamName(game.GastMannschaft, game.GastMannschaftAltersklasse) }}
+                    {{ formatTeamName(game.GastMannschaft, game.GastMannschaftAltersklasse, game.Altersklasse) }}
                   </p>
                 </div>
               </div>
@@ -356,10 +356,10 @@ const formatTime = (terminString) => {
   }
 }
 
-const formatTeamName = (teamName, ageGroup) => {
+const formatTeamName = (teamName, ageGroup, competitionAgeGroup) => {
   if (!teamName) return 'Nicht angegeben'
 
-  return formatTeamDisplayName(teamName, ageGroup)
+  return formatTeamDisplayName(teamName, ageGroup, competitionAgeGroup)
 }
 
 const formatRunde = (runde) => {

server/api/homepage/spielplan-options.get.js

@@ -1,15 +1,15 @@
 import { listSpielplanSeasons, readSpielplanData, validateSeasonSlug } from '../../utils/spielplan-data.js'
 import { formatTeamDisplayName } from '../../../utils/team-display.js'
 
-function teamLabel(teamName, teamAgeGroup) {
-  return formatTeamDisplayName(teamName, teamAgeGroup)
+function teamLabel(teamName, teamAgeGroup, competitionAgeGroup) {
+  return formatTeamDisplayName(teamName, teamAgeGroup, competitionAgeGroup)
 }
 
 function extractHarheimerTeams(rows) {
   const seen = new Set()
   const teams = []
 
-  const addTeam = (teamName, teamAgeGroup) => {
+  const addTeam = (teamName, teamAgeGroup, competitionAgeGroup) => {
     const name = String(teamName || '').trim()
     if (!name) return
     const age = String(teamAgeGroup || '').trim()
@@ -18,7 +18,7 @@ function extractHarheimerTeams(rows) {
     seen.add(key)
     teams.push({
       key,
-      label: teamLabel(name, age),
+      label: teamLabel(name, age, competitionAgeGroup),
       teamName: name,
       teamAgeGroup: age
     })
@@ -26,10 +26,10 @@ function extractHarheimerTeams(rows) {
 
   for (const row of rows || []) {
     if (String(row.HeimVereinName || '').trim() === 'Harheimer TC') {
-      addTeam(row.HeimMannschaft, row.HeimMannschaftAltersklasse)
+      addTeam(row.HeimMannschaft, row.HeimMannschaftAltersklasse, row.Altersklasse)
     }
     if (String(row.GastVereinName || '').trim() === 'Harheimer TC') {
-      addTeam(row.GastMannschaft, row.GastMannschaftAltersklasse)
+      addTeam(row.GastMannschaft, row.GastMannschaftAltersklasse, row.Altersklasse)
     }
   }
 

utils/team-display.js

@@ -1,22 +1,30 @@
 /**
  * Makes youth teams identifiable while retaining the team name supplied by
  * click-TT. Age groups occur in a few forms, for example "Jugend 13",
- * "Jugend 13 1. Kreisklasse", and "J13".
+ * "Jugend 13 1. Kreisklasse", and "J13". Some imports provide the age
+ * only for the whole fixture, therefore `competitionAgeGroup` is considered
+ * as a fallback.
  */
-export function youthTeamCode(teamAgeGroup, teamName = '') {
-  const ageGroup = String(teamAgeGroup || '').trim()
+export function youthTeamCode(teamAgeGroup, teamName = '', competitionAgeGroup = '') {
+  const ageGroup = [teamAgeGroup, competitionAgeGroup]
+    .map(value => String(value || '').trim())
+    .filter(Boolean)
+    .join(' ')
   const name = String(teamName || '').trim()
-  const codeMatch = ageGroup.match(/\b(?:jugend\s*|j\s*)(\d{1,2})\b/i)
+  const codeMatch = `${ageGroup} ${name}`.match(/\b(?:jugend\s*|j\s*\(?)(\d{1,2})\b/i)
 
   if (codeMatch) return `J${codeMatch[1]}`
   if (/\bjugend\b/i.test(ageGroup) || /\bjugend\b/i.test(name)) return 'J'
   return ''
 }
 
-export function formatTeamDisplayName(teamName, teamAgeGroup) {
-  const name = String(teamName || '').trim()
-  if (!name) return ''
+export function formatTeamDisplayName(teamName, teamAgeGroup, competitionAgeGroup = '') {
+  const rawName = String(teamName || '').trim()
+  if (!rawName) return ''
 
-  const youthCode = youthTeamCode(teamAgeGroup, name)
+  const youthCode = youthTeamCode(teamAgeGroup, rawName, competitionAgeGroup)
+  const name = youthCode
+    ? rawName.replace(/\s*\(J\d{1,2}\)\s*$/i, '').trim()
+    : rawName
   return youthCode ? `(${youthCode}) ${name}` : name
 }