@golstats/gsc-lineups-reports 1.0.8 → 1.1.0

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.
Files changed (48) hide show
  1. package/README.md +2 -2
  2. package/dist/css/fonts.css +91 -91
  3. package/dist/gsc-lineups-reports.css +1 -1
  4. package/dist/gsc-lineups-reports.es.js +3135 -2751
  5. package/dist/gsc-lineups-reports.umd.js +10 -7
  6. package/dist/images/canchaRPH.svg +30 -30
  7. package/dist/images/events/atajada.svg +56 -56
  8. package/dist/images/events/fin-del-partido.svg +43 -43
  9. package/dist/images/events/fuera-de-lugar.svg +57 -57
  10. package/dist/images/events/gol.svg +48 -48
  11. package/dist/images/events/icn-cambio.svg +6 -6
  12. package/dist/images/events/icn-falta.svg +4 -4
  13. package/dist/images/events/icn-play.svg +3 -3
  14. package/dist/images/events/icn-tarjeta-amarilla.svg +3 -3
  15. package/dist/images/events/icn-tarjeta-roja.svg +3 -3
  16. package/dist/images/events/icn-tiro-a-porteria.svg +36 -36
  17. package/dist/images/events/icn-tiros-de-esquina.svg +18 -18
  18. package/dist/images/events/inicia-el-partido.svg +45 -45
  19. package/dist/images/events/jugada-peligrosa.svg +90 -90
  20. package/dist/images/events/penal-fallado.svg +194 -194
  21. package/dist/images/events/penal-marcado.svg +189 -189
  22. package/dist/images/events/tiempo-agregado.svg +74 -74
  23. package/dist/images/events/tiro-a-porteria.svg +80 -80
  24. package/dist/images/events/var.svg +30 -30
  25. package/package.json +7 -3
  26. package/src/components/Lineup2D/CheckBox.vue +42 -42
  27. package/src/components/Lineup2D/FilterEmpty.vue +48 -48
  28. package/src/components/Lineup2D/Icons.vue +29 -29
  29. package/src/components/Lineup2D/LineupField.vue +274 -274
  30. package/src/components/Lineup2D/LineupFilter.vue +285 -285
  31. package/src/components/Lineup2D/LineupMainHeader.vue +222 -222
  32. package/src/components/Lineup2D/LineupRecentItem.vue +110 -110
  33. package/src/components/Lineup2D/MatchDetails.vue +66 -66
  34. package/src/components/gsc-filter.vue +286 -286
  35. package/src/components/gsc-header-historico-lineup.vue +1064 -1064
  36. package/src/components/gsc-header-postmatch-lineup.vue +1017 -1017
  37. package/src/components/gsc-header-probables-lineup.vue +1044 -1044
  38. package/src/components/gsc-header-recientes-lineup.vue +2337 -2337
  39. package/src/components/gsc-lineup-dosd.vue +3777 -3752
  40. package/src/components/gsc-lineup-main.vue +81 -65
  41. package/src/components/gsc-lineups-reports.vue +10 -1
  42. package/src/components/gsc-lineups.vue +229 -37
  43. package/src/components/gsc-player-card.vue +166 -166
  44. package/src/index.js +4 -4
  45. package/src/main-test.js +42 -0
  46. package/src/types.d.ts +45 -45
  47. package/src/utils/apiUrl.js +33 -0
  48. package/src/utils/socketConnection.js +29 -29
@@ -1,81 +1,81 @@
1
- <?xml version="1.0" encoding="UTF-8"?>
2
- <svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 104.32 74.73">
3
- <defs>
4
- <style>
5
- .cls-1 {
6
- fill: none;
7
- }
8
-
9
- .cls-2 {
10
- clip-path: url(#clippath);
11
- }
12
-
13
- .cls-3 {
14
- fill: #fff;
15
- }
16
-
17
- .cls-4 {
18
- fill: #172531;
19
- }
20
-
21
- .cls-5 {
22
- clip-path: url(#clippath-1);
23
- }
24
-
25
- .cls-6 {
26
- opacity: .5;
27
- }
28
- </style>
29
- <clipPath id="clippath">
30
- <circle class="cls-1" cx="24" cy="26.43" r="24"/>
31
- </clipPath>
32
- <clipPath id="clippath-1">
33
- <rect class="cls-1" x=".82" width="91.96" height="59.78"/>
34
- </clipPath>
35
- </defs>
36
- <g id="Layer_1-2" data-name="Layer 1">
37
- <g>
38
- <g id="Oval">
39
- <circle class="cls-4" cx="24" cy="26.43" r="24"/>
40
- </g>
41
- <g class="cls-2">
42
- <g class="cls-5">
43
- <g>
44
- <g class="cls-6">
45
- <rect class="cls-3" x="24.71" y="16.99" width=".5" height="55.25"/>
46
- <rect class="cls-3" x="30.31" y="16.99" width=".5" height="55.25"/>
47
- <rect class="cls-3" x="35.91" y="16.99" width=".5" height="55.25"/>
48
- <rect class="cls-3" x="41.51" y="16.99" width=".5" height="55.25"/>
49
- <rect class="cls-3" x="49.69" y="18.68" width=".34" height="56.04"/>
50
- <rect class="cls-3" x="16.09" y="24.57" width="88.23" height=".5"/>
51
- <rect class="cls-3" x="16.09" y="30.09" width="88.23" height=".5"/>
52
- <rect class="cls-3" x="16.09" y="35.61" width="88.23" height=".5"/>
53
- <rect class="cls-3" x="16.09" y="41.14" width="88.23" height=".5"/>
54
- <rect class="cls-3" x="16.09" y="46.66" width="88.23" height=".5"/>
55
- </g>
56
- <polygon class="cls-3" points="16.49 49.82 14.99 49.82 14.99 16.69 48.05 16.69 48.05 18.19 16.49 18.19 16.49 49.82"/>
57
- </g>
58
- </g>
59
- </g>
60
- <g>
61
- <ellipse class="cls-4" cx="30.36" cy="32.03" rx="9.59" ry="9.61"/>
62
- <g>
63
- <path class="cls-3" d="M26.8,37.49c-.12,0-.24-.04-.33-.13-.21-.18-.22-.5-.04-.71l1.38-1.54c.18-.2,.5-.22,.71-.04,.21,.18,.22,.5,.04,.71l-1.38,1.54c-.1,.11-.24,.17-.37,.17Z"/>
64
- <g>
65
- <path class="cls-3" d="M30.39,40.63c-4.74,0-8.6-3.86-8.6-8.6s3.86-8.6,8.6-8.6,8.6,3.86,8.6,8.6-3.86,8.6-8.6,8.6Zm0-16.2c-4.19,0-7.6,3.41-7.6,7.6s3.41,7.6,7.6,7.6,7.6-3.41,7.6-7.6-3.41-7.6-7.6-7.6Z"/>
66
- <path class="cls-3" d="M32.63,35.95h-4.45c-.22,0-.41-.14-.48-.35l-1.38-4.25c-.07-.21,0-.43,.18-.56l3.6-2.62c.18-.13,.41-.13,.59,0l3.6,2.62c.17,.13,.25,.35,.18,.56l-1.38,4.25c-.07,.21-.26,.35-.48,.35Zm-4.09-1h3.72l1.15-3.56-3.01-2.2-3.01,2.2,1.15,3.56Z"/>
67
- <path class="cls-3" d="M30.41,26.37c-.07,0-.13-.01-.2-.04l-3.07-1.31c-.25-.11-.37-.4-.26-.66,.11-.25,.4-.37,.66-.26l2.87,1.23,2.87-1.23c.25-.11,.55,0,.66,.26,.11,.25,0,.55-.26,.66l-3.07,1.31c-.06,.03-.13,.04-.2,.04Z"/>
68
- <path class="cls-3" d="M22.39,33.14c-.12,0-.23-.04-.33-.12-.21-.18-.23-.5-.05-.71l2.05-2.36-.28-3.12c-.02-.27,.18-.52,.45-.54,.28-.02,.52,.18,.54,.45l.29,3.33c.01,.14-.03,.27-.12,.37l-2.19,2.52c-.1,.11-.24,.17-.38,.17Z"/>
69
- <path class="cls-3" d="M28.52,40.36c-.17,0-.34-.09-.43-.24l-1.61-2.69-3.04-.7c-.27-.06-.44-.33-.38-.6,.06-.27,.33-.44,.6-.38l3.25,.75c.13,.03,.25,.11,.32,.23l1.71,2.87c.14,.24,.06,.54-.17,.69-.08,.05-.17,.07-.26,.07Z"/>
70
- <path class="cls-3" d="M32.29,40.36c-.09,0-.18-.02-.26-.07-.24-.14-.31-.45-.17-.69l1.71-2.87c.07-.12,.18-.2,.32-.23l3.25-.75c.27-.06,.54,.11,.6,.38,.06,.27-.11,.54-.38,.6l-3.04,.7-1.6,2.69c-.09,.16-.26,.24-.43,.24Z"/>
71
- <path class="cls-3" d="M38.43,33.14c-.14,0-.28-.06-.38-.17l-2.19-2.52c-.09-.1-.13-.24-.12-.37l.29-3.33c.02-.27,.27-.48,.54-.45,.28,.02,.48,.27,.45,.54l-.28,3.12,2.05,2.36c.18,.21,.16,.52-.05,.71-.09,.08-.21,.12-.33,.12Z"/>
72
- <path class="cls-3" d="M30.4,29.08c-.28,0-.5-.22-.5-.5v-2.71c0-.28,.22-.5,.5-.5s.5,.22,.5,.5v2.71c0,.28-.22,.5-.5,.5Z"/>
73
- <path class="cls-3" d="M34.02,31.81c-.18,0-.35-.1-.44-.26-.13-.24-.04-.55,.2-.68l2.22-1.19c.24-.13,.55-.04,.68,.2,.13,.24,.04,.55-.2,.68l-2.22,1.19c-.08,.04-.16,.06-.24,.06Z"/>
74
- <path class="cls-3" d="M34.01,37.49c-.14,0-.27-.06-.37-.17l-1.38-1.53c-.18-.21-.17-.52,.04-.71,.2-.18,.52-.17,.71,.04l1.38,1.53c.18,.21,.17,.52-.04,.71-.1,.09-.21,.13-.33,.13Z"/>
75
- <path class="cls-3" d="M26.81,31.71c-.07,0-.15-.02-.22-.05l-2.23-1.09c-.25-.12-.35-.42-.23-.67,.12-.25,.42-.35,.67-.23l2.23,1.09c.25,.12,.35,.42,.23,.67-.09,.18-.26,.28-.45,.28Z"/>
76
- </g>
77
- </g>
78
- </g>
79
- </g>
80
- </g>
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 104.32 74.73">
3
+ <defs>
4
+ <style>
5
+ .cls-1 {
6
+ fill: none;
7
+ }
8
+
9
+ .cls-2 {
10
+ clip-path: url(#clippath);
11
+ }
12
+
13
+ .cls-3 {
14
+ fill: #fff;
15
+ }
16
+
17
+ .cls-4 {
18
+ fill: #172531;
19
+ }
20
+
21
+ .cls-5 {
22
+ clip-path: url(#clippath-1);
23
+ }
24
+
25
+ .cls-6 {
26
+ opacity: .5;
27
+ }
28
+ </style>
29
+ <clipPath id="clippath">
30
+ <circle class="cls-1" cx="24" cy="26.43" r="24"/>
31
+ </clipPath>
32
+ <clipPath id="clippath-1">
33
+ <rect class="cls-1" x=".82" width="91.96" height="59.78"/>
34
+ </clipPath>
35
+ </defs>
36
+ <g id="Layer_1-2" data-name="Layer 1">
37
+ <g>
38
+ <g id="Oval">
39
+ <circle class="cls-4" cx="24" cy="26.43" r="24"/>
40
+ </g>
41
+ <g class="cls-2">
42
+ <g class="cls-5">
43
+ <g>
44
+ <g class="cls-6">
45
+ <rect class="cls-3" x="24.71" y="16.99" width=".5" height="55.25"/>
46
+ <rect class="cls-3" x="30.31" y="16.99" width=".5" height="55.25"/>
47
+ <rect class="cls-3" x="35.91" y="16.99" width=".5" height="55.25"/>
48
+ <rect class="cls-3" x="41.51" y="16.99" width=".5" height="55.25"/>
49
+ <rect class="cls-3" x="49.69" y="18.68" width=".34" height="56.04"/>
50
+ <rect class="cls-3" x="16.09" y="24.57" width="88.23" height=".5"/>
51
+ <rect class="cls-3" x="16.09" y="30.09" width="88.23" height=".5"/>
52
+ <rect class="cls-3" x="16.09" y="35.61" width="88.23" height=".5"/>
53
+ <rect class="cls-3" x="16.09" y="41.14" width="88.23" height=".5"/>
54
+ <rect class="cls-3" x="16.09" y="46.66" width="88.23" height=".5"/>
55
+ </g>
56
+ <polygon class="cls-3" points="16.49 49.82 14.99 49.82 14.99 16.69 48.05 16.69 48.05 18.19 16.49 18.19 16.49 49.82"/>
57
+ </g>
58
+ </g>
59
+ </g>
60
+ <g>
61
+ <ellipse class="cls-4" cx="30.36" cy="32.03" rx="9.59" ry="9.61"/>
62
+ <g>
63
+ <path class="cls-3" d="M26.8,37.49c-.12,0-.24-.04-.33-.13-.21-.18-.22-.5-.04-.71l1.38-1.54c.18-.2,.5-.22,.71-.04,.21,.18,.22,.5,.04,.71l-1.38,1.54c-.1,.11-.24,.17-.37,.17Z"/>
64
+ <g>
65
+ <path class="cls-3" d="M30.39,40.63c-4.74,0-8.6-3.86-8.6-8.6s3.86-8.6,8.6-8.6,8.6,3.86,8.6,8.6-3.86,8.6-8.6,8.6Zm0-16.2c-4.19,0-7.6,3.41-7.6,7.6s3.41,7.6,7.6,7.6,7.6-3.41,7.6-7.6-3.41-7.6-7.6-7.6Z"/>
66
+ <path class="cls-3" d="M32.63,35.95h-4.45c-.22,0-.41-.14-.48-.35l-1.38-4.25c-.07-.21,0-.43,.18-.56l3.6-2.62c.18-.13,.41-.13,.59,0l3.6,2.62c.17,.13,.25,.35,.18,.56l-1.38,4.25c-.07,.21-.26,.35-.48,.35Zm-4.09-1h3.72l1.15-3.56-3.01-2.2-3.01,2.2,1.15,3.56Z"/>
67
+ <path class="cls-3" d="M30.41,26.37c-.07,0-.13-.01-.2-.04l-3.07-1.31c-.25-.11-.37-.4-.26-.66,.11-.25,.4-.37,.66-.26l2.87,1.23,2.87-1.23c.25-.11,.55,0,.66,.26,.11,.25,0,.55-.26,.66l-3.07,1.31c-.06,.03-.13,.04-.2,.04Z"/>
68
+ <path class="cls-3" d="M22.39,33.14c-.12,0-.23-.04-.33-.12-.21-.18-.23-.5-.05-.71l2.05-2.36-.28-3.12c-.02-.27,.18-.52,.45-.54,.28-.02,.52,.18,.54,.45l.29,3.33c.01,.14-.03,.27-.12,.37l-2.19,2.52c-.1,.11-.24,.17-.38,.17Z"/>
69
+ <path class="cls-3" d="M28.52,40.36c-.17,0-.34-.09-.43-.24l-1.61-2.69-3.04-.7c-.27-.06-.44-.33-.38-.6,.06-.27,.33-.44,.6-.38l3.25,.75c.13,.03,.25,.11,.32,.23l1.71,2.87c.14,.24,.06,.54-.17,.69-.08,.05-.17,.07-.26,.07Z"/>
70
+ <path class="cls-3" d="M32.29,40.36c-.09,0-.18-.02-.26-.07-.24-.14-.31-.45-.17-.69l1.71-2.87c.07-.12,.18-.2,.32-.23l3.25-.75c.27-.06,.54,.11,.6,.38,.06,.27-.11,.54-.38,.6l-3.04,.7-1.6,2.69c-.09,.16-.26,.24-.43,.24Z"/>
71
+ <path class="cls-3" d="M38.43,33.14c-.14,0-.28-.06-.38-.17l-2.19-2.52c-.09-.1-.13-.24-.12-.37l.29-3.33c.02-.27,.27-.48,.54-.45,.28,.02,.48,.27,.45,.54l-.28,3.12,2.05,2.36c.18,.21,.16,.52-.05,.71-.09,.08-.21,.12-.33,.12Z"/>
72
+ <path class="cls-3" d="M30.4,29.08c-.28,0-.5-.22-.5-.5v-2.71c0-.28,.22-.5,.5-.5s.5,.22,.5,.5v2.71c0,.28-.22,.5-.5,.5Z"/>
73
+ <path class="cls-3" d="M34.02,31.81c-.18,0-.35-.1-.44-.26-.13-.24-.04-.55,.2-.68l2.22-1.19c.24-.13,.55-.04,.68,.2,.13,.24,.04,.55-.2,.68l-2.22,1.19c-.08,.04-.16,.06-.24,.06Z"/>
74
+ <path class="cls-3" d="M34.01,37.49c-.14,0-.27-.06-.37-.17l-1.38-1.53c-.18-.21-.17-.52,.04-.71,.2-.18,.52-.17,.71,.04l1.38,1.53c.18,.21,.17,.52-.04,.71-.1,.09-.21,.13-.33,.13Z"/>
75
+ <path class="cls-3" d="M26.81,31.71c-.07,0-.15-.02-.22-.05l-2.23-1.09c-.25-.12-.35-.42-.23-.67,.12-.25,.42-.35,.67-.23l2.23,1.09c.25,.12,.35,.42,.23,.67-.09,.18-.26,.28-.45,.28Z"/>
76
+ </g>
77
+ </g>
78
+ </g>
79
+ </g>
80
+ </g>
81
81
  </svg>
@@ -1,31 +1,31 @@
1
- <?xml version="1.0" encoding="UTF-8"?>
2
- <svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
3
- <defs>
4
- <style>
5
- .cls-1 {
6
- fill: #fff;
7
- }
8
-
9
- .cls-2 {
10
- fill: #172531;
11
- }
12
- </style>
13
- </defs>
14
- <g id="Layer_1-2" data-name="Layer 1">
15
- <g>
16
- <g id="Oval">
17
- <circle class="cls-2" cx="24" cy="24" r="24"/>
18
- </g>
19
- <g id="Group-19">
20
- <g id="Path-16">
21
- <path class="cls-1" d="M32.85,36.6H15.15c-.41,0-.75-.34-.75-.75s.34-.75,.75-.75h17.69c.41,0,.75,.34,.75,.75s-.34,.75-.75,.75Z"/>
22
- </g>
23
- </g>
24
- <g id="Rectangle">
25
- <g id="path-1">
26
- <path class="cls-1" d="M38.02,32.62H9.98V13.43h28.04v19.19Zm-26.54-1.5h25.04V14.93H11.48V31.12Z"/>
27
- </g>
28
- </g>
29
- </g>
30
- </g>
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
3
+ <defs>
4
+ <style>
5
+ .cls-1 {
6
+ fill: #fff;
7
+ }
8
+
9
+ .cls-2 {
10
+ fill: #172531;
11
+ }
12
+ </style>
13
+ </defs>
14
+ <g id="Layer_1-2" data-name="Layer 1">
15
+ <g>
16
+ <g id="Oval">
17
+ <circle class="cls-2" cx="24" cy="24" r="24"/>
18
+ </g>
19
+ <g id="Group-19">
20
+ <g id="Path-16">
21
+ <path class="cls-1" d="M32.85,36.6H15.15c-.41,0-.75-.34-.75-.75s.34-.75,.75-.75h17.69c.41,0,.75,.34,.75,.75s-.34,.75-.75,.75Z"/>
22
+ </g>
23
+ </g>
24
+ <g id="Rectangle">
25
+ <g id="path-1">
26
+ <path class="cls-1" d="M38.02,32.62H9.98V13.43h28.04v19.19Zm-26.54-1.5h25.04V14.93H11.48V31.12Z"/>
27
+ </g>
28
+ </g>
29
+ </g>
30
+ </g>
31
31
  </svg>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@golstats/gsc-lineups-reports",
3
- "version": "1.0.8",
3
+ "version": "1.1.0",
4
4
  "main": "dist/gsc-lineups-reports.umd.js",
5
5
  "module": "dist/gsc-lineups-reports.es.js",
6
6
  "exports": {
@@ -20,7 +20,10 @@
20
20
  "preview": "vite preview",
21
21
  "lint": "eslint . --fix",
22
22
  "format": "prettier --write src/",
23
- "prepublishOnly": "npm run build"
23
+ "prepublishOnly": "npm run build",
24
+ "test:e2e": "playwright test",
25
+ "test:e2e:ui": "playwright test --ui",
26
+ "test:e2e:report": "playwright show-report e2e/report"
24
27
  },
25
28
  "keywords": [
26
29
  "vue",
@@ -66,6 +69,7 @@
66
69
  "sass-embedded": "^1.89.2",
67
70
  "vite": "^6.2.4",
68
71
  "vite-plugin-vue-devtools": "^7.7.2",
69
- "vue": "^3.5.13"
72
+ "vue": "^3.5.13",
73
+ "@playwright/test": "^1.52.0"
70
74
  }
71
75
  }
@@ -1,42 +1,42 @@
1
- <template>
2
-
3
- <div @click="emit('update:model-value', !modelValue)" class="checkbox">
4
- <label v-if="label" :for="label" style="margin-right: 6px;" class="checkbox__label">{{ label }}</label>
5
- <svg v-if="modelValue" :name="label" width=" 19" height="19" viewBox="0 0 19 20" fill="none" xmlns="http://www.w3.org/2000/svg">
6
- <path id="Vector"
7
- fill="#CBEE6B"
8
- d="M13.4872 0.5H5.52225C2.06253 0.5 0 2.5615 0 6.0195V13.971C0 17.4385 2.06253 19.5 5.52225 19.5H13.4777C16.9374 19.5 19 17.4385 19 13.9805V6.0195C19.0095 2.5615 16.9469 0.5 13.4872 0.5ZM14.048 7.815L8.65881 13.2015C8.52575 13.3345 8.34516 13.4105 8.15506 13.4105C7.96497 13.4105 7.78438 13.3345 7.65131 13.2015L4.96147 10.513C4.68583 10.2375 4.68583 9.7815 4.96147 9.506C5.23711 9.2305 5.69334 9.2305 5.96897 9.506L8.15506 11.691L13.0405 6.808C13.3161 6.5325 13.7724 6.5325 14.048 6.808C14.3236 7.0835 14.3236 7.53 14.048 7.815Z" />
9
-
10
- </svg>
11
- <svg v-else width="19" height="19" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path
13
- id="Vector"
14
- d="M7.65 20.5H13.35C18.1 20.5 20 18.6 20 13.85V8.15C20 3.4 18.1 1.5 13.35 1.5H7.65C2.9 1.5 1 3.4 1 8.15V13.85C1 18.6 2.9 20.5 7.65 20.5Z" stroke="white" stroke-opacity="0.5" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
15
- </svg>
16
- </div>
17
-
18
- </template>
19
-
20
- <script setup>
21
-
22
- const { modelValue } = defineProps(['model-value', 'label']);
23
-
24
- const emit = defineEmits(['update:model-value']);
25
- </script>
26
- <style lang="scss">
27
- .checkbox {
28
- cursor: pointer;
29
- display: flex;
30
- align-items: center;
31
- &__label {
32
- margin-right: 6px;
33
- color: #FFF;
34
- text-align: right;
35
- font-family: Poppins, sans-serif;
36
- font-size: 12px;
37
- font-style: normal;
38
- font-weight: 400;
39
- line-height: 150%; /* 18px */
40
- }
41
- }
42
- </style>
1
+ <template>
2
+
3
+ <div @click="emit('update:model-value', !modelValue)" class="checkbox">
4
+ <label v-if="label" :for="label" style="margin-right: 6px;" class="checkbox__label">{{ label }}</label>
5
+ <svg v-if="modelValue" :name="label" width=" 19" height="19" viewBox="0 0 19 20" fill="none" xmlns="http://www.w3.org/2000/svg">
6
+ <path id="Vector"
7
+ fill="#CBEE6B"
8
+ d="M13.4872 0.5H5.52225C2.06253 0.5 0 2.5615 0 6.0195V13.971C0 17.4385 2.06253 19.5 5.52225 19.5H13.4777C16.9374 19.5 19 17.4385 19 13.9805V6.0195C19.0095 2.5615 16.9469 0.5 13.4872 0.5ZM14.048 7.815L8.65881 13.2015C8.52575 13.3345 8.34516 13.4105 8.15506 13.4105C7.96497 13.4105 7.78438 13.3345 7.65131 13.2015L4.96147 10.513C4.68583 10.2375 4.68583 9.7815 4.96147 9.506C5.23711 9.2305 5.69334 9.2305 5.96897 9.506L8.15506 11.691L13.0405 6.808C13.3161 6.5325 13.7724 6.5325 14.048 6.808C14.3236 7.0835 14.3236 7.53 14.048 7.815Z" />
9
+
10
+ </svg>
11
+ <svg v-else width="19" height="19" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
12
+ <path
13
+ id="Vector"
14
+ d="M7.65 20.5H13.35C18.1 20.5 20 18.6 20 13.85V8.15C20 3.4 18.1 1.5 13.35 1.5H7.65C2.9 1.5 1 3.4 1 8.15V13.85C1 18.6 2.9 20.5 7.65 20.5Z" stroke="white" stroke-opacity="0.5" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
15
+ </svg>
16
+ </div>
17
+
18
+ </template>
19
+
20
+ <script setup>
21
+
22
+ const { modelValue } = defineProps(['model-value', 'label']);
23
+
24
+ const emit = defineEmits(['update:model-value']);
25
+ </script>
26
+ <style lang="scss">
27
+ .checkbox {
28
+ cursor: pointer;
29
+ display: flex;
30
+ align-items: center;
31
+ &__label {
32
+ margin-right: 6px;
33
+ color: #FFF;
34
+ text-align: right;
35
+ font-family: Poppins, sans-serif;
36
+ font-size: 12px;
37
+ font-style: normal;
38
+ font-weight: 400;
39
+ line-height: 150%; /* 18px */
40
+ }
41
+ }
42
+ </style>
@@ -1,49 +1,49 @@
1
- <template>
2
- <div class="filter-empty">
3
- <p>
4
- No hay resultados con los criterios de búsqueda aplicados.
5
- </p>
6
- <button @click="$emit('clickButton')">
7
- Eliminar filtros aplicados
8
- </button>
9
- </div>
10
- </template>
11
- <script setup>
12
- </script>
13
- <style lang="scss" scoped>
14
- .filter-empty {
15
- max-width: 220px;
16
- widows: 100%;
17
- margin: auto;
18
- p {
19
- color: rgba(255, 255, 255, 0.70);
20
- text-align: center;
21
- font-family: Poppins, sans-serif;
22
- font-size: 12px;
23
- font-style: normal;
24
- font-weight: 500;
25
- line-height: normal;
26
- margin: 0 0 16px;
27
- }
28
- button {
29
- outline: none;
30
- border: none;
31
- margin: auto;
32
- cursor: pointer;
33
- height: 32px;
34
- border-radius: 50px;
35
- background: rgba(255, 255, 255, 0.10);
36
- padding: 8px 20px;
37
- align-items: center;
38
- color: #FFF;
39
- display: flex;
40
- justify-content: center;
41
- align-items: center;
42
- font-family: Poppins, sans-serif;
43
- font-size: 12px;
44
- font-style: normal;
45
- font-weight: 500;
46
- line-height: 24px; /* 200% */
47
- }
48
- }
1
+ <template>
2
+ <div class="filter-empty">
3
+ <p>
4
+ No hay resultados con los criterios de búsqueda aplicados.
5
+ </p>
6
+ <button @click="$emit('clickButton')">
7
+ Eliminar filtros aplicados
8
+ </button>
9
+ </div>
10
+ </template>
11
+ <script setup>
12
+ </script>
13
+ <style lang="scss" scoped>
14
+ .filter-empty {
15
+ max-width: 220px;
16
+ widows: 100%;
17
+ margin: auto;
18
+ p {
19
+ color: rgba(255, 255, 255, 0.70);
20
+ text-align: center;
21
+ font-family: Poppins, sans-serif;
22
+ font-size: 12px;
23
+ font-style: normal;
24
+ font-weight: 500;
25
+ line-height: normal;
26
+ margin: 0 0 16px;
27
+ }
28
+ button {
29
+ outline: none;
30
+ border: none;
31
+ margin: auto;
32
+ cursor: pointer;
33
+ height: 32px;
34
+ border-radius: 50px;
35
+ background: rgba(255, 255, 255, 0.10);
36
+ padding: 8px 20px;
37
+ align-items: center;
38
+ color: #FFF;
39
+ display: flex;
40
+ justify-content: center;
41
+ align-items: center;
42
+ font-family: Poppins, sans-serif;
43
+ font-size: 12px;
44
+ font-style: normal;
45
+ font-weight: 500;
46
+ line-height: 24px; /* 200% */
47
+ }
48
+ }
49
49
  </style>
@@ -1,30 +1,30 @@
1
- <template>
2
- <svg v-if="icon === 'goal'" xmlns="http://www.w3.org/2000/svg" width="9" height="9" viewBox="0 0 9 9" fill="none">
3
- <path fill-rule="evenodd" clip-rule="evenodd" d="M4.02408 0.891998C2.29589 0.891998 0.894531 2.28984 0.894531 4.01399C0.894531 5.73814 2.29589 7.13598 4.02408 7.13598C5.75227 7.13598 7.15363 5.73814 7.15363 4.01399C7.15363 2.28984 5.75227 0.891998 4.02408 0.891998V0.891998Z" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
4
- <path fill-rule="evenodd" clip-rule="evenodd" d="M3.17056 5.33314L2.63867 3.69586L4.02996 2.68407L5.42152 3.69586L4.89018 5.33314H3.17056Z" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
5
- <path d="M5.2148 1.13477L4.02938 1.63931L2.84424 1.13477" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
6
- <path d="M1.66458 1.99231L1.77847 3.2768L0.932129 4.24869" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
7
- <path d="M1.38428 5.63698L2.63977 5.92542L3.30228 7.03115" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
8
- <path d="M4.7583 7.03114L5.42027 5.92487L6.67535 5.63643" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
9
- <path d="M7.1312 4.24842L6.28418 3.27599L6.39793 1.99231" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
10
- <path d="M4.03044 1.63925V2.68417" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
11
- <path d="M5.42432 3.7367L6.28358 3.27614" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
12
- <path d="M4.8916 5.33328L5.42294 5.92497" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
13
- <path d="M3.17029 5.33328L2.63867 5.92551" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
14
- <path d="M1.77881 3.27682L2.63848 3.69599" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
15
- </svg>
16
- <svg v-else-if="icon === 'yellow-card'" width="4" height="6" viewBox="0 0 4 6" fill="none" xmlns="http://www.w3.org/2000/svg">
17
- <rect width="4" height="6" rx="1" fill="#F7C330"/>
18
- </svg>
19
- <svg v-else-if="icon === 'red-card'" width="4" height="6" viewBox="0 0 4 6" fill="none" xmlns="http://www.w3.org/2000/svg">
20
- <rect width="4" height="6" rx="1" fill="#FF0000"/>
21
- </svg>
22
- </template>
23
- <script setup>
24
- defineProps({
25
- icon: {
26
- type: String,
27
- default: 'goal'
28
- }
29
- })
1
+ <template>
2
+ <svg v-if="icon === 'goal'" xmlns="http://www.w3.org/2000/svg" width="9" height="9" viewBox="0 0 9 9" fill="none">
3
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M4.02408 0.891998C2.29589 0.891998 0.894531 2.28984 0.894531 4.01399C0.894531 5.73814 2.29589 7.13598 4.02408 7.13598C5.75227 7.13598 7.15363 5.73814 7.15363 4.01399C7.15363 2.28984 5.75227 0.891998 4.02408 0.891998V0.891998Z" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
4
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M3.17056 5.33314L2.63867 3.69586L4.02996 2.68407L5.42152 3.69586L4.89018 5.33314H3.17056Z" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
5
+ <path d="M5.2148 1.13477L4.02938 1.63931L2.84424 1.13477" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
6
+ <path d="M1.66458 1.99231L1.77847 3.2768L0.932129 4.24869" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
7
+ <path d="M1.38428 5.63698L2.63977 5.92542L3.30228 7.03115" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
8
+ <path d="M4.7583 7.03114L5.42027 5.92487L6.67535 5.63643" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
9
+ <path d="M7.1312 4.24842L6.28418 3.27599L6.39793 1.99231" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
10
+ <path d="M4.03044 1.63925V2.68417" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
11
+ <path d="M5.42432 3.7367L6.28358 3.27614" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
12
+ <path d="M4.8916 5.33328L5.42294 5.92497" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
13
+ <path d="M3.17029 5.33328L2.63867 5.92551" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
14
+ <path d="M1.77881 3.27682L2.63848 3.69599" stroke="white" stroke-width="0.6" stroke-linecap="round" stroke-linejoin="round"/>
15
+ </svg>
16
+ <svg v-else-if="icon === 'yellow-card'" width="4" height="6" viewBox="0 0 4 6" fill="none" xmlns="http://www.w3.org/2000/svg">
17
+ <rect width="4" height="6" rx="1" fill="#F7C330"/>
18
+ </svg>
19
+ <svg v-else-if="icon === 'red-card'" width="4" height="6" viewBox="0 0 4 6" fill="none" xmlns="http://www.w3.org/2000/svg">
20
+ <rect width="4" height="6" rx="1" fill="#FF0000"/>
21
+ </svg>
22
+ </template>
23
+ <script setup>
24
+ defineProps({
25
+ icon: {
26
+ type: String,
27
+ default: 'goal'
28
+ }
29
+ })
30
30
  </script>