@golstats/gsc-top-player 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,161 +3,156 @@
3
3
  <div ref="myDivRef">
4
4
  <template v-if="type == 0">
5
5
  <template v-if="topData.length > 0">
6
- <GSCCarousel
7
- :items="topData"
8
- :is-pagination-visible="carrousel"
9
- :are-navigation-arrows-visible="carrousel"
10
- @input="changeCarrousel"
11
- >
12
- <template #default="{ item: page }">
13
- <div class="row-table-carrousel">
14
- <template v-for="(player, index) in page" :key="index">
15
- <template v-if="player.top == 1">
16
- <GSCLeaders
17
- @mediadata="emitEventMedia($event, category, categoryName)"
18
- :type="typeTable"
19
- :type-data="typeData"
20
- :game="game"
21
- :arrow="arrow"
22
- :team-widget="teamWidget"
23
- :can-play-videos="canPlayVideos"
24
- :is-expanded="playerexpand == player.id && expand"
25
- ref="GSCLeaders"
26
- :data="
27
- typeTable == 0
28
- ? {
29
- top: '01',
30
- photo: player.img,
31
- logo:
32
- 'https://golstatsimages.blob.core.windows.net/teams-80/' +
6
+ <div class="row-table-carrousel">
7
+ <template v-for="(player, index) in topData[0]" :key="index">
8
+ <template v-if="player.top == 1">
9
+ <GSCLeaders
10
+ @mediadata="emitEventMedia($event, category, categoryName)"
11
+ :type="typeTable"
12
+ :type-data="typeData"
13
+ :game="game"
14
+ :arrow="arrow"
15
+ :team-widget="teamWidget"
16
+ :can-play-videos="canPlayVideos"
17
+ :is-expanded="playerexpand == player.id && expand"
18
+ ref="GSCLeaders"
19
+ :data="
20
+ typeTable == 0
21
+ ? {
22
+ top: '01',
23
+ photo: player.img,
24
+ logo:
25
+ player.img && player.img.includes('player-shadow')
26
+ ? 'https://golstatsimages.blob.core.windows.net/images-library/logo-team@2x.png'
27
+ : 'https://golstatsimages.blob.core.windows.net/teams-80/' +
33
28
  player.teamid +
34
29
  '.png',
35
- name: player.name,
36
- player_short: player.name_short,
37
- player_id: player.id,
38
- categoryId: category,
39
- total: player.total,
40
- }
41
- : {
42
- top: '01',
43
- logo: player.img,
44
- total: player.total,
45
- name_team: player.name,
46
- player_id: player.id,
47
- }
48
- "
49
- :category-name="categoryName"
50
- :buttonMaxWidth="
51
- typeTable != 0
52
- ? elementSize.width > 360
53
- ? '210px'
54
- : '130px'
55
- : elementSize.width > 360
56
- ? '180px'
57
- : '110px'
58
- "
59
- buttonFontSize="12px"
60
- iconSize="11px"
61
- @expand="clickexpand"
62
- @more="morestats"
63
- />
64
- </template>
65
- <template v-else>
66
- <GSCRowTable
67
- :type-data="typeData"
68
- :team-widget="teamWidget"
69
- :game="game"
70
- :type="typeTable"
71
- :type-view="type"
72
- :arrow="arrow"
73
- :is-expanded="playerexpand == player.id && expand"
74
- @mediadata="emitEventMedia($event, category, categoryName)"
75
- :data="
76
- typeTable == 0
77
- ? {
78
- position: player.top,
79
- player_name: player.name,
80
- player_short: player.name_short,
81
- player_photo: player.img,
82
- total: player.total,
83
- id: player.id,
84
- player_age: player.age,
85
- team_abrev: player.team,
86
- team_logo:
87
- 'https://golstatsimages.blob.core.windows.net/teams-80/' +
30
+ name: player.name,
31
+ player_short: player.name_short,
32
+ player_id: player.id,
33
+ categoryId: category,
34
+ total: player.total,
35
+ }
36
+ : {
37
+ top: '01',
38
+ logo: player.img,
39
+ total: player.total,
40
+ name_team: player.name,
41
+ player_id: player.id,
42
+ }
43
+ "
44
+ :category-name="categoryName"
45
+ :buttonMaxWidth="
46
+ typeTable != 0
47
+ ? elementSize.width > 360
48
+ ? '210px'
49
+ : '130px'
50
+ : elementSize.width > 360
51
+ ? '180px'
52
+ : '110px'
53
+ "
54
+ buttonFontSize="12px"
55
+ iconSize="11px"
56
+ @expand="clickexpand"
57
+ @more="morestats"
58
+ />
59
+ </template>
60
+ <template v-else>
61
+ <GSCRowTable
62
+ :type-data="typeData"
63
+ :team-widget="teamWidget"
64
+ :game="game"
65
+ :type="typeTable"
66
+ :type-view="type"
67
+ :arrow="arrow"
68
+ :is-expanded="playerexpand == player.id && expand"
69
+ @mediadata="emitEventMedia($event, category, categoryName)"
70
+ :data="
71
+ typeTable == 0
72
+ ? {
73
+ position: player.top,
74
+ player_name: player.name,
75
+ player_short: player.name_short,
76
+ player_photo: player.img,
77
+ total: player.total,
78
+ id: player.id,
79
+ player_age: player.age,
80
+ team_abrev: player.team,
81
+ team_logo:
82
+ player.img && player.img.includes('player-shadow')
83
+ ? 'https://golstatsimages.blob.core.windows.net/images-library/logo-team@2x.png'
84
+ : 'https://golstatsimages.blob.core.windows.net/teams-80/' +
88
85
  player.teamid +
89
86
  '.png',
90
- player_position: player.position,
91
- player_country_flag:
92
- 'https://golstatsimages.blob.core.windows.net/flags/' +
93
- player.country +
94
- '.jpg',
95
- player_games: player.minutes,
96
- player_min: player.games,
97
- league_name:
98
- '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Liga MX&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;',
99
- }
100
- : {
101
- position: player.top,
102
- team_logo: player.img,
103
- team_abrev: player.name,
104
- frequency: player.frecuency,
105
- promthistournament: player.game_avg,
106
- promlasttournament: player.game_avg_last_season,
107
- teams_games: '-',
108
- category: category,
109
- total: player.total,
110
- id: player.id,
111
- }
112
- "
113
- height="71px"
114
- :can-play-videos="canPlayVideos"
115
- :background="index % 2 === 0 ? backgroundEven : backgroundOdd"
116
- @expand="clickexpand"
117
- />
118
- </template>
119
- <template v-if="expand && playerexpand == player.id">
120
- <GSCExpandedInfo
121
- :type="typeTable"
122
- :is-live="game.is_live"
123
- :view-effectiveness="player.positionId === 1 ? false : true"
124
- :data="
125
- typeTable == 0
126
- ? {
127
- teams: player.teamname,
128
- age: player.age,
129
- dataofbirth: player.date,
130
- nationality: player.nationality,
131
- countryFlag: player.player_country_flag,
132
- position: player.position,
133
- games: player.games,
134
- min: player.minutes,
135
- goals: player.total,
136
- effectiveness: player.effectiveness,
137
- category: categoryName,
138
- id: player.id,
139
- }
140
- : {
141
- position: player.positiontable,
142
- goals: player.goals,
143
- goals_received: player.goalsrecived,
144
- games_played: player.games_played,
145
- category: categoryName,
146
- effectiveness: player.effectiveness,
147
- xg: player.xg,
148
- total: player.total,
149
- attendance: '-',
150
- id: player.id,
151
- }
152
- "
153
- @viewprofile="viewprofile($event, player.teamid)"
154
- :background="index % 2 === 0 ? backgroundEven : backgroundOdd"
155
- />
156
- </template>
157
- </template>
158
- </div>
87
+ player_position: player.position,
88
+ player_country_flag:
89
+ 'https://golstatsimages.blob.core.windows.net/flags/' +
90
+ player.country +
91
+ '.jpg',
92
+ player_games: player.minutes,
93
+ player_min: player.games,
94
+ league_name:
95
+ '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Liga MX&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;',
96
+ }
97
+ : {
98
+ position: player.top,
99
+ team_logo: player.img,
100
+ team_abrev: player.name,
101
+ frequency: player.frecuency,
102
+ promthistournament: player.game_avg,
103
+ promlasttournament: player.game_avg_last_season,
104
+ teams_games: '-',
105
+ category: category,
106
+ total: player.total,
107
+ id: player.id,
108
+ }
109
+ "
110
+ height="71px"
111
+ :can-play-videos="canPlayVideos"
112
+ :background="index % 2 === 0 ? backgroundEven : backgroundOdd"
113
+ @expand="clickexpand"
114
+ />
115
+ </template>
116
+ <template v-if="expand && playerexpand == player.id">
117
+ <GSCExpandedInfo
118
+ :type="typeTable"
119
+ :is-live="game.is_live"
120
+ :view-effectiveness="player.positionId === 1 ? false : true"
121
+ :data="
122
+ typeTable == 0
123
+ ? {
124
+ teams: player.teamname,
125
+ age: player.age,
126
+ dataofbirth: player.date,
127
+ nationality: player.nationality,
128
+ countryFlag: player.player_country_flag,
129
+ position: player.position,
130
+ games: player.games,
131
+ min: player.minutes,
132
+ goals: player.total,
133
+ effectiveness: player.effectiveness,
134
+ category: categoryName,
135
+ id: player.id,
136
+ }
137
+ : {
138
+ position: player.positiontable,
139
+ goals: player.goals,
140
+ goals_received: player.goalsrecived,
141
+ games_played: player.games_played,
142
+ category: categoryName,
143
+ effectiveness: player.effectiveness,
144
+ xg: player.xg,
145
+ total: player.total,
146
+ attendance: '-',
147
+ id: player.id,
148
+ }
149
+ "
150
+ @viewprofile="viewprofile($event, player.teamid)"
151
+ :background="index % 2 === 0 ? backgroundEven : backgroundOdd"
152
+ />
153
+ </template>
159
154
  </template>
160
- </GSCCarousel>
155
+ </div>
161
156
  </template>
162
157
  <template v-else>
163
158
  <div class="container-no-search-result">
@@ -186,7 +181,7 @@
186
181
  <template v-else>
187
182
  <GSCTableHeader background="#183143" :type="typeTable" />
188
183
  <template v-for="(page, index2) in topData" :key="index2">
189
- <template v-for="(player, index) in page" :key="index">
184
+ <template v-for="(player, index) in page.slice(0, numRows)" :key="index">
190
185
  <GSCRowTable
191
186
  :type-data="typeData"
192
187
  :team-widget="teamWidget"
@@ -295,14 +290,11 @@ import GSCLeaders from './gsc-header-tops.vue'
295
290
  import GSCRowTable from './gsc-row.vue'
296
291
  import GSCTableHeader from './gsc-head-titles.vue'
297
292
  import GSCExpandedInfo from './gsc-expanded-info-player.vue'
298
- import { GSCCarousel } from '@golstats/gsc-carousel'
299
- import '@@/@golstats/gsc-carousel/dist/style.css'
300
293
 
301
294
  import nationalitiesCatalog from '@/components/comparative/nationalities-catalog.js'
302
295
 
303
296
  export default {
304
297
  components: {
305
- GSCCarousel,
306
298
  GSCLeaders,
307
299
  GSCRowTable,
308
300
  GSCTableHeader,
@@ -387,6 +379,10 @@ export default {
387
379
  backgroundOdd: { type: String, default: '#172531' },
388
380
  backgroundEven: { type: String, default: '#0d1d29' },
389
381
  numRows: { type: Number, default: 5 },
382
+ dummyData: {
383
+ type: Array,
384
+ default: null,
385
+ },
390
386
  },
391
387
  setup() {
392
388
  const myDivRef = ref('myDivRef')
@@ -449,6 +445,10 @@ export default {
449
445
  },
450
446
  computed: {
451
447
  topData() {
448
+ // Si hay dummyData, úsala directamente
449
+ if (this.dummyData && this.category === 0) {
450
+ return [this.dummyData]
451
+ }
452
452
  this.changeStateLoading(true)
453
453
  if (Object.entries(this.statsData).length > 0 && this.formatFilterStats.length > 0) {
454
454
  var topTeam = {}
@@ -945,13 +945,11 @@ export default {
945
945
  teamId = topLeaderId
946
946
  } else {
947
947
  playerIds = [topLeaderId]
948
- categoryIds = categoryIds.filter((id) => !id.toString().includes('_r'))
949
948
  }
950
949
  } else if (this.isTeam) {
951
950
  teamId = data.id
952
951
  } else {
953
952
  playerIds = [data.id]
954
- categoryIds = categoryIds.filter((id) => !id.toString().includes('_r'))
955
953
  }
956
954
  const jsonConfig = {
957
955
  auxwidget:
@@ -1010,7 +1008,6 @@ export default {
1010
1008
  teamId = data.id
1011
1009
  } else {
1012
1010
  playerIds = [data.id]
1013
- categoryIds = categoryIds.filter((id) => !id.toString().includes('_r'))
1014
1011
  }
1015
1012
 
1016
1013
  const jsonConfig = {
@@ -1346,13 +1343,8 @@ export default {
1346
1343
  }
1347
1344
  },
1348
1345
  formatArrayPaginate(arrayData) {
1349
- const num = Math.ceil(arrayData.length / this.numRows)
1350
-
1351
- return Array.from({ length: num }, (_, index) => {
1352
- const start = index * this.numRows
1353
- const end = start + this.numRows
1354
- return arrayData.slice(start, end)
1355
- })
1346
+ // Solo mostrar la primera página
1347
+ return [arrayData.slice(0, this.numRows)]
1356
1348
  },
1357
1349
  createIntervalTops() {
1358
1350
  this.intervalIdtops = setInterval(async () => {
@@ -1466,23 +1458,27 @@ export default {
1466
1458
  }
1467
1459
  .gsc-top {
1468
1460
  width: 100%;
1461
+ max-width: 100%;
1469
1462
  position: relative;
1470
1463
  height: auto;
1471
1464
  min-height: 460px;
1472
- margin: 0 auto;
1465
+ margin: 0;
1473
1466
  padding-bottom: 30px;
1474
1467
  border-radius: v-bind(borderRadius);
1475
1468
  border-style: solid;
1476
1469
  border-width: v-bind(borderWidth);
1477
1470
  border-color: v-bind(borderColor);
1471
+ box-sizing: border-box;
1478
1472
  }
1479
1473
 
1480
1474
  .gsc-top-full {
1481
1475
  width: 100%;
1476
+ max-width: 100%;
1482
1477
  height: auto;
1483
- margin: 0 auto;
1478
+ margin: 0;
1484
1479
  background: rgb(13, 29, 41);
1485
1480
  margin-top: 20px;
1481
+ box-sizing: border-box;
1486
1482
  }
1487
1483
 
1488
1484
  .row-table-carrousel {
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <div ref="myDivRefTopsFull">
2
+ <div ref="myDivRefTopsFull" style="width: 100%; max-width: 100%; box-sizing: border-box">
3
3
  <template v-for="(category, index) in categoryView" :key="index">
4
4
  <div :class="toniKroosWrapperClass">
5
5
  <GSCTopCategory
@@ -21,7 +21,9 @@
21
21
  :season-selected="seasonSelected"
22
22
  :season="seasonActive"
23
23
  :filter-team="teamselect"
24
+ :num-rows="numRows"
24
25
  :key="updateTables"
26
+ :dummy-data="category.id === 0 ? dummyData : null"
25
27
  />
26
28
  </div>
27
29
  </template>
@@ -158,6 +160,14 @@ export default {
158
160
  type: String,
159
161
  default: '',
160
162
  },
163
+ numRows: {
164
+ type: Number,
165
+ default: 5,
166
+ },
167
+ dummyData: {
168
+ type: Array,
169
+ default: null,
170
+ },
161
171
  },
162
172
  watch: {
163
173
  async seasonActive() {
@@ -9,15 +9,18 @@
9
9
  :season-active="season"
10
10
  :teamselect="teamView"
11
11
  :category-view="categoryView"
12
+ :num-rows="numRows"
13
+ :dummy-data="dummyData"
12
14
  />
13
15
  </div>
14
16
  </template>
15
17
 
16
18
  <script setup>
17
19
  import GSCTopFull from '@/components/comparative/gsc-tops-full.vue'
20
+ import { dummyTopPlayers } from './comparative/dummy-top-players.js'
18
21
 
19
22
  // Definir todas las props
20
- defineProps({
23
+ const props = defineProps({
21
24
  categoryView: {
22
25
  type: Array,
23
26
  default: () => [],
@@ -50,12 +53,23 @@ defineProps({
50
53
  type: Number,
51
54
  default: 0,
52
55
  },
56
+ numRows: {
57
+ type: Number,
58
+ default: 5,
59
+ },
53
60
  })
61
+
62
+ // Si la categoría seleccionada es id=0, usa la info dummy
63
+ const dummyData =
64
+ props.categoryView.length === 1 && props.categoryView[0].id === 0 ? dummyTopPlayers : null
54
65
  </script>
55
66
 
56
67
  <style scoped>
57
68
  .gsc-top-player {
58
- text-align: center;
69
+ width: 100%;
70
+ max-width: 100%;
71
+ display: block;
72
+ box-sizing: border-box;
59
73
  }
60
74
 
61
75
  h1 {