@golstats/gsc-lineups-reports 1.0.1

package/src/components/gsc-player-card.vue

@@ -0,0 +1,166 @@
+<template>
+  <div v-if="type == 1" class="gsc-item-player">
+    <div class="gsc-num-player">
+      <template v-if="data.shirt < 10">0</template>
+      {{ data.shirt }}
+    </div>
+    <div class="gsc-cont-info-by-player">
+      <div class="gsc-cont-info-by-player-row1">
+        <div class="shield-player-cont">
+          <img class="gsc-logo-player" :src="data.img" />
+        </div>
+      </div>
+      <div class="gsc-cont-info-by-player-row2">
+        <div
+          class="gsc-cont-info-by-player-row2-line-name"
+          :style="
+            data.section == 'Historicos' && data.type != 'Postmatch'
+              ? 'text-decoration: none !important; cursor: default !important'
+              : ''
+          "
+          @click="
+            openProfile({
+              playerId: data.playerid,
+              teamId: data.teamid,
+              seasonId: data.season,
+              section: data.section,
+              type: data.type
+            })
+          "
+        >
+          {{ data.name }}
+        </div>
+        <div class="gsc-cont-info-by-player-row2-line-data">
+          <div class="cont-display-gsc">
+            <img class="gsc-img-country" :src="data.nation" />
+            <div :class="position">{{ data.position }}</div>
+          </div>
+          <div class="gsc-cont-cards">
+            <div class="gsc-yellow_card_div" v-if="data.yellowcard >= 1 && data.redcard == 0"></div>
+            <div class="gsc-red_card_div" v-if="data.redcard >= 1 && data.yellowcard == 0"></div>
+            <div
+              class="gsc-yellowred_card_div"
+              v-if="data.yellowcard >= 1 && data.redcard >= 1"
+            ></div>
+            <template v-if="data.yellowcard >= 1 && data.redcard == 0"
+              >'{{ data.yellowcardmin }}
+            </template>
+            <template v-if="data.redcard >= 1">'{{ data.redcardmin }}</template>
+            <div class="gsc-goal_card_div_wrapper" v-for="(min, keyM) in data.goalsMin" :key="keyM">
+              <div class="gsc-goal_card_div"></div>
+              <div>'{{ min }}</div>
+            </div>
+            <div
+              class="gsc-goal_card_div_wrapper"
+              v-if="data.substitutionIn || data.substitutionOut"
+            >
+              <div class="gsc-change_card_div"></div>
+              <div>'{{ data.substitutionMin }}</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div v-if="type == 2" class="gsc-item-player">
+    <div class="gsc-num-player2">
+      <template v-if="data.shirt < 10">0</template>
+      {{ data.shirt }}
+    </div>
+    <div class="gsc-cont-info-by-player2">
+      <div class="gsc-cont-info-by-player-row2">
+        <div
+          class="gsc-cont-info-by-player-row2-line-name2"
+          :style="
+            data.section == 'Historicos' && data.type != 'Postmatch'
+              ? 'text-decoration: none !important; cursor: default !important'
+              : ''
+          "
+          @click="
+            openProfile({
+              playerId: data.playerid,
+              teamId: data.teamid,
+              seasonId: data.season,
+              section: data.section,
+              type: data.type
+            })
+          "
+        >
+          {{ data.name }}
+        </div>
+        <div class="gsc-cont-info-by-player-row2-line-data">
+          <div class="gsc-cont-cards2">
+            <div class="gsc-yellow_card_div" v-if="data.yellowcard >= 1 && data.redcard == 0"></div>
+            <div class="gsc-red_card_div" v-if="data.redcard >= 1 && data.yellowcard == 0"></div>
+            <div
+              class="gsc-yellowred_card_div"
+              v-if="data.yellowcard >= 1 && data.redcard >= 1"
+            ></div>
+            <template v-if="data.yellowcard >= 1 && data.redcard == 0"
+              >'{{ data.yellowcardmin }}
+            </template>
+            <template v-if="data.redcard >= 1">'{{ data.redcardmin }}</template>
+            <div class="gsc-goal_card_div_wrapper" v-for="(min, keyM) in data.goalsMin" :key="keyM">
+              <div class="gsc-goal_card_div"></div>
+              <div>'{{ min }}</div>
+            </div>
+            <div
+              class="gsc-goal_card_div_wrapper"
+              v-if="data.substitutionIn || data.substitutionOut"
+            >
+              <div class="gsc-change_card_div"></div>
+              <div>'{{ data.substitutionMin }}</div>
+            </div>
+          </div>
+          <div class="cont-display-gsc">
+            <div :class="position">{{ data.position }}</div>
+            <img class="gsc-img-country" :src="data.nation" />
+          </div>
+        </div>
+      </div>
+      <div class="gsc-cont-info-by-player-row1">
+        <div class="shield-player-cont">
+          <img class="gsc-logo-player" :src="data.img" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'PlayerCard',
+  emits: ['open-profile'],
+  components: {},
+  props: {
+    data: {
+      type: Object,
+      default: () => {}
+    },
+    position: {
+      type: String,
+      default: 'gsc-position-player'
+    },
+    type: {
+      type: Number,
+      default: 1
+    }
+  },
+  data() {
+    return {}
+  },
+  computed: {},
+  methods: {
+    openProfile(data) {
+      if (data.section !== 'Historicos' || data.type === 'Postmatch') {
+        this.$emit('open-profile', data)
+      }
+    }
+  },
+  mounted() {}
+}
+</script>
+
+<style scoped>
+@import '/css/fonts.css';
+</style>

package/src/index.js

@@ -0,0 +1,4 @@
+'use strict'
+import GSCLineupsReports from './components/gsc-lineups-reports.vue'
+
+export { GSCLineupsReports }

package/src/main.js

@@ -0,0 +1,4 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+
+createApp(App).mount('#app')

package/src/types.d.ts

@@ -0,0 +1,45 @@
+export interface Team {
+  logo: string
+  team_id: number
+  provisional_logo: string
+  colloquial_name: string
+  acronym: string
+  team_name: string
+}
+
+export interface GameMinutes {
+  home_goals_minutes: number[]
+  visiting_goals_minutes: number[]
+  home_yellow_cards_minutes: number[]
+  away_yellow_cards_minutes: number[]
+  home_red_cards_minutes: number[]
+  away_red_cards_minutes: number[]
+}
+
+export interface Game {
+  gameId: number
+  id: number
+  seasonId: number
+  regularSeasonId: number
+  matchday_name: string
+  status: number
+  score: number[]
+  game_status: number
+  dateTimeUTC: string
+  homeTeam: Team
+  awayTeam: Team
+  is_live: number
+  minutes: GameMinutes
+}
+
+export interface TeamSelected {
+  teamId: number
+}
+
+export interface FieldPosesionProps {
+  game: Game
+  widthSection: number
+  teamSelected: TeamSelected
+  areInactiveVisible?: boolean
+  showTitle?: boolean
+}

package/src/utils/socketConnection.js

@@ -0,0 +1,29 @@
+import io from 'socket.io-client'
+
+const socket = io('https://golstats-live-server-sockets.azurewebsites.net/', {
+  autoConnect: false,
+  transports: ['websocket']
+})
+
+export function getSocket() {
+  return socket
+}
+
+export function connectSocket() {
+  if (socket.disconnected) {
+    socket.connect()
+  }
+}
+
+export function disconnectSocket() {
+  if (socket.connected) socket.disconnect()
+}
+
+export function connectChannel(channel, externalSocket) {
+  const socket = externalSocket || getSocket()
+  if (socket.connected) {
+    socket.emit('subscribe', {
+      channel
+    })
+  }
+}