@golstats/gsc-reports 1.0.52 → 1.0.54

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@golstats/gsc-reports",
-  "version": "1.0.52",
+  "version": "1.0.54",
   "main": "dist/gsc-reports.umd.js",
   "module": "dist/gsc-reports.es.js",
   "exports": {
@@ -47,7 +47,7 @@
   },
   "dependencies": {
     "@golstats/gsc-checkbox": "^1.0.13",
-    "@golstats/gsc-template-report-maker": "^1.0.71",
+    "@golstats/gsc-template-report-maker": "^1.0.73",
     "axios": "^1.10.0",
     "gridstack": "^12.1.1",
     "tiny-emitter": "^2.1.0",

package/src/components/TemplatesSection.vue

@@ -104,6 +104,7 @@
     <ModalGenerarReporte
       :user-id="userId"
       :token="token"
+      :team="team"
       :template-id="generarTemplateId"
       :template-type="generarTemplateType"
       :template="generarTemplate"

package/src/components/elementsTemplates/ModalGenerarReporte.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="modal-overlay">
     <div class="modal-content">
-      <button class="close-btn" @click="$emit('close')">
+      <button class="close-btn" @click="closeModal">
         <img
           src="https://golstatsimages.blob.core.windows.net/reports-images/icn-close.svg"
           alt="Cerrar"
@@ -27,9 +27,16 @@
         </div>
 
         <!-- Mostrar selectores solo cuando no hay error 409 -->
-        <div v-else>
+        <div v-else style="position: relative">
+          <!-- Loading overlay para autoseteo -->
+          <div v-if="loadingAutoseteo" class="loading-autoseteo-overlay">
+            <div class="loading-autoseteo-content">
+              <div class="loading-spinner"></div>
+            </div>
+          </div>
+
           <div class="modal-group">
-            <label>1. Elige la liga</label>
+            <label>1. Elige el torneo</label>
             <div
               class="select-wrapper custom-dropdown liga-select"
               tabindex="0"
@@ -42,11 +49,11 @@
               >
                 <template v-if="loading">
                   <span class="placeholder"
-                    ><span class="loading-spinner select-spinner"></span>Cargando ligas...</span
+                    ><span class="loading-spinner select-spinner"></span>Cargando torneos...</span
                   >
                 </template>
                 <template v-else>
-                  <span v-if="!selectedLiga" class="placeholder">Selecciona la liga</span>
+                  <span v-if="!selectedLiga" class="placeholder">Selecciona el torneo</span>
                   <span v-else>{{ selectedLiga.name }}</span>
                 </template>
                 <span class="select-chevron" :class="{ open: showDropdownLigas }">
@@ -81,7 +88,7 @@
           </div>
           <div class="modal-row">
             <div class="modal-group">
-              <label>2. Elige el torneo</label>
+              <label>2. Elige la temporada</label>
               <div
                 class="select-wrapper custom-dropdown torneo-select"
                 tabindex="0"
@@ -94,11 +101,12 @@
                 >
                   <template v-if="loading">
                     <span class="placeholder"
-                      ><span class="loading-spinner select-spinner"></span>Cargando torneos...</span
+                      ><span class="loading-spinner select-spinner"></span>Cargando
+                      temporada...</span
                     >
                   </template>
                   <template v-else>
-                    <span v-if="!selectedTorneo" class="placeholder">Elige el torneo</span>
+                    <span v-if="!selectedTorneo" class="placeholder">Elige la temporada</span>
                     <span v-else>{{ selectedTorneo.name }}</span>
                   </template>
                   <span class="select-chevron" :class="{ open: showDropdownTorneos }">
@@ -139,7 +147,7 @@
               <div
                 class="select-wrapper custom-dropdown jornada-select"
                 tabindex="0"
-                @click="showDropdownJornadas = !showDropdownJornadas"
+                @click="toggleJornadasDropdown"
                 @blur="showDropdownJornadas = false"
               >
                 <div
@@ -175,7 +183,7 @@
                   </span>
                 </div>
                 <div
-                  v-if="showDropdownJornadas && jornadas.length > 0 && selectedTorneo"
+                  v-if="showDropdownJornadas && jornadas.length > 0"
                   class="custom-select-dropdown"
                 >
                   <div
@@ -264,7 +272,7 @@
       </div>
       <div class="header-separator" v-if="!showError409"></div>
       <div class="modal-footer" v-if="!showError409">
-        <button class="cancel-btn" @click="$emit('close')">Cancelar</button>
+        <button class="cancel-btn" @click="closeModal">Cancelar</button>
         <button
           class="next-btn"
           :disabled="
@@ -281,7 +289,7 @@
 </template>
 
 <script setup>
-import { ref, defineEmits, onMounted, onUnmounted } from 'vue'
+import { ref, defineEmits, onMounted, onUnmounted, watch } from 'vue'
 import axios from 'axios'
 
 const props = defineProps({
@@ -293,6 +301,10 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  team: {
+    type: Number,
+    required: true,
+  },
   templateId: {
     type: String,
     required: true,
@@ -328,6 +340,9 @@ const showDropdownPartidos = ref(false)
 const loading = ref(false)
 const loadingPartidos = ref(false)
 const loadingJornadas = ref(false)
+const loadingAutoseteo = ref(false) // Loading para el autoseteo automático
+const autoseteoActivo = ref(false) // Controla si el autoseteo está activo
+const cambioAutomatico = ref(false) // Indica si el cambio fue automático
 const showError409 = ref(false) // Controla la visualización del mensaje de error 409
 const torneosRaw = ref([]) // Aquí se guarda el response.data completo
 const allPartidos = ref([]) // Guardar todos los partidos de la season seleccionada
@@ -339,21 +354,45 @@ const showDropdownTorneos = ref(false)
 const showDropdownJornadas = ref(false)
 
 function selectLiga(liga) {
+  // Si el usuario selecciona manualmente, desactivar autoseteo
+  if (autoseteoActivo.value) {
+    autoseteoActivo.value = false
+    loadingAutoseteo.value = false
+  }
+
+  cambioAutomatico.value = false // Marcar como cambio manual
   selectedLiga.value = liga
   showDropdownLigas.value = false
   onLigaChange()
 }
 function selectTorneo(season) {
+  // Si el usuario selecciona manualmente, desactivar autoseteo
+  if (autoseteoActivo.value) {
+    autoseteoActivo.value = false
+    loadingAutoseteo.value = false
+  }
+
+  cambioAutomatico.value = false // Marcar como cambio manual
   selectedTorneo.value = season
   showDropdownTorneos.value = false
   onTorneoChange()
 }
 function selectJornada(jornada) {
+  // Si el usuario selecciona manualmente, desactivar autoseteo
+  if (autoseteoActivo.value) {
+    autoseteoActivo.value = false
+    loadingAutoseteo.value = false
+  }
+
+  cambioAutomatico.value = false // Marcar como cambio manual
   selectedJornada.value = jornada
   showDropdownJornadas.value = false
   onJornadaChange()
 }
 
+// Variable para almacenar el partido que se configurará automáticamente
+const partidoParaConfigurar = ref(null)
+
 // Función para cargar los torneos desde el endpoint
 async function cargarTorneos() {
   try {
@@ -390,6 +429,21 @@ async function cargarTorneos() {
       selectedJornada.value = ''
       partidos.value = []
       selectedPartido.value = null
+
+      // Si hay un partido para configurar automáticamente, hacerlo ahora
+      if (partidoParaConfigurar.value) {
+        setTimeout(() => {
+          configurarSelectoresAutomaticamente(partidoParaConfigurar.value)
+        }, 100)
+      } else {
+        // Si no hay partido para configurar, forzar la carga de datos para tener opciones disponibles
+        if (ligas.value.length > 0) {
+          // Seleccionar la primera liga para cargar datos
+          const primeraLiga = ligas.value[0]
+          selectedLiga.value = primeraLiga
+          filtrarSeasonsPorTorneo(primeraLiga)
+        }
+      }
     }
   } catch (error) {
     console.error('Error al cargar torneos:', error)
@@ -461,14 +515,13 @@ function onTorneoChange() {
         .map((season) => season.id)
         .filter(Boolean)
       seasonIds.push(...relatedIds)
-      console.log('relatedIds', relatedIds)
     }
 
     cargarPartidosPorSeason(seasonIds)
-  }
-  setTimeout(() => {
+  } else {
+    // Si no hay torneo seleccionado, asegurar que el loading termine
     loadingJornadas.value = false
-  }, 400) // Simula carga
+  }
 }
 
 async function cargarPartidosPorSeason(seasonIds) {
@@ -480,10 +533,7 @@ async function cargarPartidosPorSeason(seasonIds) {
     const response = await axiosInstance.get(
       `https://qyyibs1w0d.execute-api.us-west-2.amazonaws.com/prod/calendar/gamesBySeason?seasons=${seasonsQueryString}`,
     )
-    console.log('response.data:: 2', response.data)
     if (response.data.data && Array.isArray(response.data.data)) {
-      console.log('response.data:: 4ddd', response.data.data)
-
       // Unir todos los arrays de partidos de todas las temporadas
       const todosLosPartidos = response.data.data.reduce((acumulador, temporada) => {
         if (temporada.games && Array.isArray(temporada.games)) {
@@ -492,8 +542,6 @@ async function cargarPartidosPorSeason(seasonIds) {
         return acumulador
       }, [])
 
-      console.log('Todos los partidos unidos:', todosLosPartidos)
-
       // Guardar todos los partidos
       allPartidos.value = todosLosPartidos.map((partido) => ({
         label:
@@ -511,6 +559,7 @@ async function cargarPartidosPorSeason(seasonIds) {
 
       // Filtrar partidos según templateType para jornadas válidas
       let partidosValidos = allPartidos.value
+
       if (props.templateType === '2' || props.templateType === 2) {
         partidosValidos = partidosValidos.filter((p) => p.game_status === 1)
       } else if (props.templateType === '1' || props.templateType === 1) {
@@ -518,14 +567,19 @@ async function cargarPartidosPorSeason(seasonIds) {
       }
 
       // Extraer matchdays únicos SOLO de partidos válidos
-      const matchdaysUnicos = [
-        ...new Set(partidosValidos.map((p) => p.matchday_id).filter(Boolean)),
-      ]
+      const matchdayIds = partidosValidos.map((p) => p.matchday_id).filter(Boolean)
+
+      const matchdaysUnicos = [...new Set(matchdayIds)]
 
       // Llenar jornadas con los objetos matchday únicos y ordenar por matchday_id
       jornadas.value = matchdaysUnicos
         .map((id) => {
           const partido = allPartidos.value.find((p) => p.matchday_id && p.matchday_id === id)
+
+          if (!partido) {
+            return null
+          }
+
           return {
             id,
             name: partido.matchday_name
@@ -539,6 +593,7 @@ async function cargarPartidosPorSeason(seasonIds) {
               .replace('Playoffs 6', 'Final Vuelta'),
           }
         })
+        .filter(Boolean) // Filtrar los nulls
         .sort((a, b) => {
           // Solo ordenar por matchday_id si ambos nombres empiezan con "Jornada"
           const aIsJornada = a.name.startsWith('Jornada')
@@ -554,11 +609,21 @@ async function cargarPartidosPorSeason(seasonIds) {
             return 0 // Mantener orden original para playoffs/finales
           }
         })
-      console.log('jornadas: ', jornadas)
       // NO seleccionar automáticamente ninguna jornada
       selectedJornada.value = ''
       partidos.value = []
       selectedPartido.value = null
+
+      // Asegurar que el loading de jornadas termine
+      loadingJornadas.value = false
+
+      // Después de cargar gamesBySeason, volver a intentar setear la información automáticamente
+      // SOLO si el autoseteo está activo (no cuando el usuario cambia manualmente)
+      if (partidoParaConfigurar.value && autoseteoActivo.value) {
+        setTimeout(() => {
+          configurarSelectoresSoloSetear(partidoParaConfigurar.value)
+        }, 200)
+      }
     } else {
       allPartidos.value = []
       jornadas.value = []
@@ -573,6 +638,8 @@ async function cargarPartidosPorSeason(seasonIds) {
     selectedJornada.value = ''
     partidos.value = []
     selectedPartido.value = null
+    // Asegurar que el loading de jornadas también termine en caso de error
+    loadingJornadas.value = false
   } finally {
     loadingPartidos.value = false
   }
@@ -636,8 +703,6 @@ async function generarReporte() {
       },
     )
 
-    console.log('Reporte generado exitosamente:', response.data)
-
     // Emitir evento con los datos del reporte generado
     emit('generar', {
       liga: selectedLiga.value,
@@ -667,7 +732,18 @@ async function generarReporte() {
   }
 }
 
+function toggleJornadasDropdown() {
+  showDropdownJornadas.value = !showDropdownJornadas.value
+}
+
 function selectPartido(partido) {
+  // Si el usuario selecciona manualmente, desactivar autoseteo
+  if (autoseteoActivo.value) {
+    autoseteoActivo.value = false
+    loadingAutoseteo.value = false
+  }
+
+  cambioAutomatico.value = false // Marcar como cambio manual
   selectedPartido.value = partido
   showDropdownPartidos.value = false
 }
@@ -682,14 +758,259 @@ function restaurarScroll() {
 onMounted(() => {
   cargarTorneos()
   bloquearScroll()
+  cargarUltimosJuegos()
+
+  // Activar loading de autoseteo desde el inicio si hay partido para configurar
+  if (partidoParaConfigurar.value) {
+    loadingAutoseteo.value = true
+    autoseteoActivo.value = true
+  }
+})
+
+// Watchers para autoseteo automático sin setTimeout
+watch(selectedLiga, (nuevaLiga, anteriorLiga) => {
+  // Solo ejecutar si es autoseteo (no cambio manual) y no es un cambio automático
+  if (
+    nuevaLiga &&
+    partidoParaConfigurar.value &&
+    autoseteoActivo.value &&
+    !anteriorLiga &&
+    !cambioAutomatico.value
+  ) {
+    // Buscar torneo automáticamente
+    const torneoEncontrado = torneos.value.find(
+      (torneo) => torneo.id === partidoParaConfigurar.value.season_id,
+    )
+    if (torneoEncontrado) {
+      cambioAutomatico.value = true
+      selectedTorneo.value = torneoEncontrado
+      // Ejecutar directamente la función que hace la petición a gamesBySeason
+      cargarPartidosPorSeason([torneoEncontrado.id])
+      cambioAutomatico.value = false
+    }
+  }
+  // Removemos la condición else if que detectaba cambios manuales en liga
+  // porque esto estaba causando problemas cuando se limpiaban otros valores
+})
+
+watch(selectedTorneo, (nuevoTorneo, anteriorTorneo) => {
+  // Solo ejecutar si es autoseteo (no cambio manual) y no es un cambio automático
+  if (
+    nuevoTorneo &&
+    partidoParaConfigurar.value &&
+    autoseteoActivo.value &&
+    !anteriorTorneo &&
+    !cambioAutomatico.value
+  ) {
+    // Buscar jornada automáticamente después de que se carguen las jornadas
+    setTimeout(() => {
+      const jornadaEncontrada = jornadas.value.find(
+        (jornada) => jornada.id === partidoParaConfigurar.value.matchday_id,
+      )
+      if (jornadaEncontrada) {
+        cambioAutomatico.value = true
+        selectedJornada.value = jornadaEncontrada
+        // Ejecutar directamente la función que filtra partidos por jornada
+        filtrarPartidosPorJornada(jornadaEncontrada)
+        cambioAutomatico.value = false
+      }
+    }, 500) // Solo un setTimeout para esperar que se carguen las jornadas
+  } else if (nuevoTorneo && anteriorTorneo && autoseteoActivo.value) {
+    // Si el usuario cambió el torneo manualmente, desactivar autoseteo
+    autoseteoActivo.value = false
+    loadingAutoseteo.value = false
+  }
+})
+
+watch(selectedJornada, (nuevaJornada, anteriorJornada) => {
+  // Solo ejecutar si es autoseteo (no cambio manual) y no es un cambio automático
+  if (
+    nuevaJornada &&
+    partidoParaConfigurar.value &&
+    autoseteoActivo.value &&
+    !anteriorJornada &&
+    !cambioAutomatico.value
+  ) {
+    setTimeout(() => {
+      // Primer intento: buscar por game_id
+      const partidoEncontrado = partidos.value.find(
+        (p) =>
+          p.game_id === partidoParaConfigurar.value.game_id ||
+          p.id === partidoParaConfigurar.value.game_id,
+      )
+
+      if (partidoEncontrado) {
+        selectedPartido.value = partidoEncontrado
+        loadingAutoseteo.value = false
+        autoseteoActivo.value = false
+        return
+      }
+
+      // Segundo intento: buscar por equipos
+      const partidoAlternativo = partidos.value.find(
+        (p) =>
+          p.home_team === partidoParaConfigurar.value.home_team &&
+          p.visiting_team === partidoParaConfigurar.value.visiting_team,
+      )
+
+      if (partidoAlternativo) {
+        selectedPartido.value = partidoAlternativo
+        loadingAutoseteo.value = false
+        autoseteoActivo.value = false
+        return
+      }
+
+      // Tercer intento: buscar en todos los partidos (allPartidos)
+      if (allPartidos.value.length > 0) {
+        const partidoEnTodos = allPartidos.value.find(
+          (p) =>
+            p.game_id === partidoParaConfigurar.value.game_id ||
+            p.id === partidoParaConfigurar.value.game_id,
+        )
+
+        if (partidoEnTodos) {
+          selectedPartido.value = partidoEnTodos
+          // Desactivar loading de autoseteo
+          loadingAutoseteo.value = false
+          autoseteoActivo.value = false
+          return
+        }
+      }
+      loadingAutoseteo.value = false
+      autoseteoActivo.value = false
+    }, 1000) // Solo un setTimeout para esperar que se carguen los partidos
+  } else if (nuevaJornada && anteriorJornada && autoseteoActivo.value) {
+    // Si el usuario cambió la jornada manualmente, desactivar autoseteo
+    autoseteoActivo.value = false
+    loadingAutoseteo.value = false
+  }
 })
 
 onUnmounted(() => {
   restaurarScroll()
 })
 
+// Función para cargar los últimos juegos del equipo
+async function cargarUltimosJuegos() {
+  try {
+    const response = await axiosInstance.get(
+      `https://m9qip57rsh.execute-api.us-east-2.amazonaws.com/prod/teams/${props.team}/last-games`,
+    )
+
+    // Imprimir datos según el tipo de template
+    if (props.templateType === '1' || props.templateType === 1) {
+      partidoParaConfigurar.value = response.data.data.prematch
+      // Activar loading de autoseteo si hay partido
+      if (response.data.data.prematch) {
+        loadingAutoseteo.value = true
+        autoseteoActivo.value = true
+      }
+    } else if (props.templateType === '2' || props.templateType === 2) {
+      partidoParaConfigurar.value = response.data.data.postmatch
+      // Activar loading de autoseteo si hay partido
+      if (response.data.data.postmatch) {
+        loadingAutoseteo.value = true
+        autoseteoActivo.value = true
+      }
+    }
+  } catch (error) {
+    console.error('Error al cargar últimos juegos:', error)
+  }
+}
+
+// Función para configurar automáticamente los selectores basado en el partido
+function configurarSelectoresAutomaticamente(partido) {
+  if (!partido || !partido.game_id) {
+    return
+  }
+
+  // Buscar y seleccionar la liga/torneo
+  if (partido.tournament_id && ligas.value.length > 0) {
+    const ligaEncontrada = ligas.value.find((liga) => liga.id === partido.tournament_id)
+    if (ligaEncontrada) {
+      selectedLiga.value = ligaEncontrada
+
+      // Cargar torneos para esta liga
+      filtrarSeasonsPorTorneo(ligaEncontrada)
+      // Los watchers se encargarán del resto automáticamente
+    }
+  }
+}
+
+// Función para solo setear los selectores sin cargar datos (evita ciclos)
+function configurarSelectoresSoloSetear(partido) {
+  if (!partido || !partido.game_id) {
+    return
+  }
+
+  // Buscar y seleccionar la liga/torneo
+  if (partido.tournament_id && ligas.value.length > 0) {
+    const ligaEncontrada = ligas.value.find((liga) => liga.id === partido.tournament_id)
+    if (ligaEncontrada) {
+      selectedLiga.value = ligaEncontrada
+
+      // Buscar y seleccionar la temporada (ya están cargados los torneos)
+      if (partido.season_id && torneos.value.length > 0) {
+        const torneoEncontrado = torneos.value.find((torneo) => torneo.id === partido.season_id)
+        if (torneoEncontrado) {
+          selectedTorneo.value = torneoEncontrado
+
+          // Buscar y seleccionar la jornada (ya están cargadas las jornadas)
+          if (partido.matchday_id && jornadas.value.length > 0) {
+            const jornadaEncontrada = jornadas.value.find(
+              (jornada) => jornada.id === partido.matchday_id,
+            )
+            if (jornadaEncontrada) {
+              selectedJornada.value = jornadaEncontrada
+
+              // Buscar y seleccionar el partido (ya están cargados los partidos)
+              if (partido.game_id && partidos.value.length > 0) {
+                const partidoEncontrado = partidos.value.find(
+                  (p) => p.game_id === partido.game_id || p.id === partido.game_id,
+                )
+                if (partidoEncontrado) {
+                  selectedPartido.value = partidoEncontrado
+                } else {
+                  // Intentar buscar por otros campos
+                  const partidoAlternativo = partidos.value.find(
+                    (p) =>
+                      p.home_team === partido.home_team &&
+                      p.visiting_team === partido.visiting_team,
+                  )
+                  if (partidoAlternativo) {
+                    selectedPartido.value = partidoAlternativo
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
 function closeModal() {
   showError409.value = false
+
+  // Restaurar todos los valores del autoseteo
+  selectedLiga.value = ''
+  selectedTorneo.value = ''
+  selectedJornada.value = ''
+  selectedPartido.value = null
+  // NO limpiar partidoParaConfigurar.value para mantener los datos del autoseteo
+
+  // Limpiar las listas de opciones
+  torneos.value = []
+  jornadas.value = []
+  partidos.value = []
+
+  // Cerrar todos los dropdowns
+  showDropdownLigas.value = false
+  showDropdownTorneos.value = false
+  showDropdownJornadas.value = false
+  showDropdownPartidos.value = false
+
   restaurarScroll()
   emit('close')
 }
@@ -1175,4 +1496,35 @@ select:focus {
 .accept-btn:hover {
   background: #b6d94c;
 }
+
+/* Loading overlay para autoseteo */
+.loading-autoseteo-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(46, 59, 70, 0.8);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  border-radius: 10px;
+}
+
+.loading-autoseteo-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  color: #fff;
+  text-align: center;
+}
+
+.loading-autoseteo-content p {
+  font-family: Poppins-Regular;
+  font-size: 14px;
+  margin: 0;
+  color: #fff;
+}
 </style>

package/src/components/thumbnails-reports/AnalisisPostMatchType3.vue

@@ -1,28 +1,6 @@
 <template>
   <div class="prematch-bg">
     <!-- Escudos de fondo -->
-    <div class="background-shields">
-      <div class="shield-left">
-        <img
-          :src="
-            'https://golstatsimages.blob.core.windows.net/teams-150/' +
-            report.game.home_team +
-            '.png'
-          "
-          alt="Escudo local"
-        />
-      </div>
-      <div class="shield-right">
-        <img
-          :src="
-            'https://golstatsimages.blob.core.windows.net/teams-150/' +
-            report.game.visiting_team +
-            '.png'
-          "
-          alt="Escudo visitante"
-        />
-      </div>
-    </div>
 
     <div class="title">Análisis <span class="highlight">Postmatch</span></div>
     <div class="subtitle">

package/src/components/thumbnails-reports/AnalisisPostMatchType4.vue

@@ -1,28 +1,6 @@
 <template>
   <div class="prematch-bg">
     <!-- Escudos de fondo -->
-    <div class="background-shields">
-      <div class="shield-left">
-        <img
-          :src="
-            'https://golstatsimages.blob.core.windows.net/teams-150/' +
-            report.game.home_team +
-            '.png'
-          "
-          alt="Escudo local"
-        />
-      </div>
-      <div class="shield-right">
-        <img
-          :src="
-            'https://golstatsimages.blob.core.windows.net/teams-150/' +
-            report.game.visiting_team +
-            '.png'
-          "
-          alt="Escudo visitante"
-        />
-      </div>
-    </div>
 
     <div class="title">Análisis <span class="highlight">Postmatch</span></div>
     <div class="subtitle">