@golstats/gsc-top-player 1.0.8 → 1.0.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@golstats/gsc-top-player",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "main": "dist/gsc-top-player.umd.js",
   "module": "dist/gsc-top-player.es.js",
   "exports": {

package/src/App.vue

@@ -1,12 +1,7 @@
 <script setup>
 import GscTopPlayer from './components/gsc-top-player.vue'
-import { categoriesDefault } from './components/comparative/categories.js'
 // import { dummyTopPlayers } from './components/comparative/dummy-top-players.js'
 
-// Selecciona una categoría real o la dummy manualmente para pruebas
-//const selectedCategories = [{ id: 0, name: 'Categoria' }]
-const selectedCategories = categoriesDefault.filter((cat) => cat.id === 2)
-
 const gameData = {
   gameId: 90209,
   id: 90209,
@@ -43,96 +38,19 @@ const gameData = {
     away_red_cards_minutes: [],
   },
 }
-
-const gameData2 = {
-  season_id: 2010,
-  game_id: 90328,
-  matchday_id: 4,
-  matchday_name: 'Matchday 4',
-  matchday_abbreviation: 'M4',
-  home_team: 16,
-  visiting_team: 10,
-  date: '2025-08-08',
-  schedule: '21:00:00',
-  date_time_utc: '2025-08-09T02:00:00Z',
-  game_status: 4,
-  score: [0, 0],
-  is_live: 0,
-  penalties_score_home_team: 0,
-  penalties_score_visiting_team: 0,
-  referee_id: 0,
-  referee_name: 'Sin designar',
-  home_games_played: 2,
-  away_games_played: 3,
-  has_video: 0,
-  tv_stations: [],
-  home_team_name: 'Tigres de la UANL',
-  visiting_team_name: 'Puebla FC',
-  home_team_acronym: 'TIG',
-  visiting_team_acronym: 'PUE',
-  live_stats: 0,
-  has_tracking: 0,
-  video_types: [],
-  home_team_probability: 69,
-  visiting_team_probability: 8,
-  draw_probability: 23,
-  home_team_xg: 1.9749,
-  home_team_goals: 1,
-  visiting_team_xg: 6.331,
-  visiting_team_goals: 4,
-  minutes: {
-    home_goals_minutes: [],
-    visiting_goals_minutes: [],
-    home_yellow_cards_minutes: [],
-    away_yellow_cards_minutes: [],
-    home_red_cards_minutes: [],
-    away_red_cards_minutes: [],
-  },
-  report_minutes: {
-    home_goals_minutes: [],
-    visiting_goals_minutes: [],
-    home_yellow_cards_minutes: [],
-    away_yellow_cards_minutes: [],
-    home_red_cards_minutes: [],
-    away_red_cards_minutes: [],
-  },
-  alt_minutes: {
-    home_goals_minutes: [],
-    visiting_goals_minutes: [],
-    home_yellow_cards_minutes: [],
-    away_yellow_cards_minutes: [],
-    home_red_cards_minutes: [],
-    away_red_cards_minutes: [],
-  },
-  time_active: {
-    home_te: '00:00',
-    visiting_te: '00:00',
-    home_ti: '00:00',
-    visiting_ti: '00:00',
-    total_te: '00:00',
-    total_ti: '00:00',
-    others: '00:00',
-    home_ta_average: '30:50',
-    visiting_ta_average: '31:10',
-    referee_ta_average: '-',
-    xta: '62:00',
-  },
-  is_edition_available: 1,
-}
 </script>
 
 <template>
   <div id="app">
-    <!-- Ejemplo con datos dummy (useDummyData: true) -->
+    <!-- Ejemplo con datos dummy - Goles -->
     <GscTopPlayer
-      :category-view="selectedCategories"
+      :category-view="[{ id: 1, name: 'Goles' }]"
       :gamed="gameData.id"
       :game="gameData"
       :season="gameData.seasonId"
       :team-view="2"
-      :use-dummy-data="false"
+      :use-dummy-data="true"
     />
-
     <!-- Ejemplo con datos reales (useDummyData: false) -->
     <!-- 
     <GscTopPlayer

package/src/components/comparative/dummy-top-players.js

@@ -2,12 +2,12 @@
 export const dummyTopPlayers = [
   {
     top: '01',
-    name: 'Nombre Jugador',
-    name_short: 'Nombre Jugador',
+    name: 'Nombre Completo',
+    name_short: 'Nombre Completo',
     img: 'https://golstatsimages.blob.core.windows.net/images-library/player-shadow@2x.png',
     id: 9991,
     age: 25,
-    team: 'DUM',
+    team: 'EQU',
     teamid: 1,
     position: 'DEL',
     positionId: 9,
@@ -20,18 +20,18 @@ export const dummyTopPlayers = [
     nationality: 'Mexicano',
     player_country_flag:
       'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
-    categoryName: 'Pases acertados',
-    total: 0,
+    categoryName: 'Goles',
+    total: 15,
   },
   {
     top: '02',
-    name: 'Nombre Jugador',
-    name_short: 'Nombre Jugador',
+    name: 'Nombre Completo',
+    name_short: 'Nombre Completo',
     img: 'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
     id: 9992,
     age: 27,
-    team: 'DUM',
-    teamname: 'Dummy FC',
+    team: 'EQU',
+    teamname: 'Equipo',
     teamid: 1,
     position: 'MED',
     positionId: 7,
@@ -44,18 +44,18 @@ export const dummyTopPlayers = [
     nationality: 'Mexicano',
     player_country_flag:
       'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
-    categoryName: 'Pases acertados',
-    total: 0,
+    categoryName: 'Asistencias',
+    total: 12,
   },
   {
     top: '03',
-    name: 'Nombre Jugador',
-    name_short: 'Nombre Jugador',
+    name: 'Nombre Completo',
+    name_short: 'Nombre Completo',
     img: 'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
     id: 9993,
     age: 22,
-    team: 'DUM',
-    teamname: 'Dummy FC',
+    team: 'EQU',
+    teamname: 'Equipo',
     teamid: 1,
     position: 'DEF',
     positionId: 2,
@@ -69,17 +69,17 @@ export const dummyTopPlayers = [
     player_country_flag:
       'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
     categoryName: 'Pases acertados',
-    total: 0,
+    total: 89,
   },
   {
     top: '04',
-    name: 'Nombre Jugador',
-    name_short: 'Nombre Jugador',
+    name: 'Nombre Completo',
+    name_short: 'Nombre Completo',
     img: 'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
     id: 9994,
     age: 24,
-    team: 'DUM',
-    teamname: 'Dummy FC',
+    team: 'EQU',
+    teamname: 'Equipo',
     teamid: 1,
     position: 'POR',
     positionId: 1,
@@ -92,18 +92,18 @@ export const dummyTopPlayers = [
     nationality: 'Mexicano',
     player_country_flag:
       'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
-    categoryName: 'Pases acertados',
-    total: 0,
+    categoryName: 'Atajadas',
+    total: 45,
   },
   {
     top: '05',
-    name: 'Nombre Jugador',
-    name_short: 'Nombre Jugador',
+    name: 'Nombre Completo',
+    name_short: 'Nombre Completo',
     img: 'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
     id: 9995,
     age: 28,
-    team: 'DUM',
-    teamname: 'Dummy FC',
+    team: 'EQU',
+    teamname: 'Equipo',
     teamid: 1,
     position: 'LAT',
     positionId: 3,
@@ -116,7 +116,7 @@ export const dummyTopPlayers = [
     nationality: 'Mexicano',
     player_country_flag:
       'https://golstatsimages.blob.core.windows.net/images-library/player-shadow-02@2x.png',
-    categoryName: 'Pases acertados',
-    total: 0,
+    categoryName: 'Centros',
+    total: 23,
   },
 ]

package/src/components/comparative/gsc-header-tops.vue

@@ -6,6 +6,10 @@
           <div :class="$style.playerPhotoGamesReports" id="container-player-photp">
             <div :class="$style.tablePositionWrapperGamesReports">
               <b :class="$style.tablePositionGamesReports">{{ data.top }}</b>
+              <div
+                :class="$style.teamIconOverlay"
+                :style="{ backgroundImage: `url(${data.logo})` }"
+              ></div>
             </div>
             <img :class="$style.imgHenrryIconReports" alt="" :src="data.photo" />
             <img :class="$style.americaIconReports" alt="" :src="data.logo" />
@@ -837,7 +841,6 @@ body {
 
   .playerRowReports {
     height: 80px;
-    min-width: 300px;
   }
 
   .groupsLeagueReports {
@@ -875,6 +878,167 @@ body {
   }
 }
 
+@container header-tops (max-width: 300px) {
+  .headerTopGameReports {
+    position: relative;
+    height: 88px;
+    align-items: flex-end;
+    justify-content: flex-start;
+    padding: 0px 8px 0px 4px;
+    gap: 20px;
+    overflow: visible;
+  }
+
+  .playerPhotoGamesReports {
+    position: relative;
+    height: 132px;
+    padding-bottom: 8px !important;
+    justify-content: flex-end;
+    align-items: flex-end;
+    z-index: 1;
+  }
+
+  #container-player-info {
+    position: absolute !important;
+    right: 8px !important;
+    z-index: 10 !important;
+    width: auto !important;
+    gap: 4px !important;
+    align-items: flex-end !important;
+    justify-content: flex-end !important;
+    border-radius: 6px !important;
+    backdrop-filter: blur(2px) !important;
+  }
+
+  .playerInfoGamesReports {
+    position: absolute !important;
+    right: 8px !important;
+    top: -12px !important;
+    z-index: 10 !important;
+    width: auto !important;
+    gap: 4px !important;
+    align-items: flex-end !important;
+    justify-content: flex-end !important;
+    border-radius: 6px !important;
+  }
+
+  .playerNameGamesReports {
+    width: auto;
+    text-align: right;
+    justify-content: flex-end;
+    margin-bottom: 0;
+    z-index: 11;
+  }
+
+  .toniKroosGamesReports {
+    font-size: 9px;
+    line-height: 11px;
+    text-align: right;
+    max-width: 100px;
+    margin: 0;
+    font-weight: 600;
+    color: #ffffff;
+    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
+  }
+
+  .playerDataGamesReports {
+    width: auto;
+    justify-content: flex-end;
+    gap: 6px;
+    flex-wrap: nowrap;
+    z-index: 11;
+  }
+
+  .containerDataReports {
+    justify-content: flex-end;
+    gap: 6px;
+    flex-wrap: nowrap;
+    z-index: 11;
+  }
+
+  .containerDataReports :deep(.gsc-button) {
+    z-index: 12;
+    position: relative;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
+  }
+
+  .tablePositionWrapperGamesReports {
+    position: relative;
+    z-index: 0;
+    height: 132px;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: flex-end;
+    padding-bottom: 0;
+  }
+
+  .tablePositionGamesReports {
+    font-size: v-bind(fontSizeTopNum);
+    line-height: 90px;
+    opacity: v-bind(opacityColorTopNum);
+    color: v-bind(fontColorTopNum);
+    width: 96px;
+    height: 81px;
+    margin-bottom: 0;
+  }
+
+  .imgHenrryIconReports {
+    height: 132px;
+    width: auto;
+    margin-left: -14px;
+    position: relative;
+    z-index: 1;
+    display: block;
+    margin-bottom: 0;
+  }
+
+  .americaIconReports {
+    display: none;
+  }
+
+  .americaIcon1Reports {
+    display: none;
+  }
+
+  .teamsAmericaReports {
+    display: none;
+  }
+
+  .tablePositionWrapperGamesReports {
+    position: relative;
+  }
+
+  .teamIconOverlay {
+    position: absolute;
+    top: 92px;
+    left: 28px;
+    width: 28px;
+    height: 28px;
+    z-index: 5;
+    border-radius: 50%;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+  }
+
+  .playerRowReports {
+    height: 88px;
+    position: relative;
+  }
+
+  .headerTopsGamesReports {
+    height: 88px;
+    position: relative;
+  }
+
+  .icnExpandReports {
+    z-index: 11;
+    position: relative;
+  }
+}
+
 /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */
 /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */
 /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */ /** holaaaaaaaaaaaaaa numerto 1 */