From 0cf61a46de4f7055380e540c77192fab08cac418 Mon Sep 17 00:00:00 2001 From: Sam Date: Fri, 24 Sep 2021 19:51:04 +0200 Subject: [PATCH] Client - add workout details --- .../public/img/misc/mountains.svg | 11 ++ .../public/img/weather/breeze.svg | 16 +++ .../public/img/weather/clear-day.svg | 30 ++++ .../public/img/weather/clear-night.svg | 15 ++ .../public/img/weather/cloudy.svg | 14 ++ fittrackee_client/public/img/weather/fog.svg | 18 +++ .../public/img/weather/partly-cloudy-day.svg | 34 +++++ .../img/weather/partly-cloudy-night.svg | 21 +++ .../public/img/weather/pour-rain.svg | 15 ++ fittrackee_client/public/img/weather/rain.svg | 34 +++++ .../public/img/weather/sleet.svg | 22 +++ fittrackee_client/public/img/weather/snow.svg | 32 +++++ .../public/img/weather/temperature.svg | 12 ++ fittrackee_client/public/img/weather/wind.svg | 20 +++ .../Workout/WorkoutDetail/WorkoutData.vue | 98 +++++++++++++ .../Workout/WorkoutDetail/WorkoutMap.vue | 1 + .../Workout/WorkoutDetail/WorkoutRecord.vue | 32 +++++ .../Workout/WorkoutDetail/WorkoutWeather.vue | 129 ++++++++++++++++++ .../Workout/WorkoutDetail/index.vue | 10 ++ .../src/locales/en/workouts.json | 27 ++++ .../src/locales/fr/workouts.json | 27 ++++ fittrackee_client/src/scss/colors.scss | 2 + 22 files changed, 620 insertions(+) create mode 100644 fittrackee_client/public/img/misc/mountains.svg create mode 100644 fittrackee_client/public/img/weather/breeze.svg create mode 100644 fittrackee_client/public/img/weather/clear-day.svg create mode 100644 fittrackee_client/public/img/weather/clear-night.svg create mode 100644 fittrackee_client/public/img/weather/cloudy.svg create mode 100644 fittrackee_client/public/img/weather/fog.svg create mode 100644 fittrackee_client/public/img/weather/partly-cloudy-day.svg create mode 100644 fittrackee_client/public/img/weather/partly-cloudy-night.svg create mode 100644 fittrackee_client/public/img/weather/pour-rain.svg create mode 100644 fittrackee_client/public/img/weather/rain.svg create mode 100644 fittrackee_client/public/img/weather/sleet.svg create mode 100644 fittrackee_client/public/img/weather/snow.svg create mode 100644 fittrackee_client/public/img/weather/temperature.svg create mode 100644 fittrackee_client/public/img/weather/wind.svg create mode 100644 fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutData.vue create mode 100644 fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutRecord.vue create mode 100644 fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutWeather.vue diff --git a/fittrackee_client/public/img/misc/mountains.svg b/fittrackee_client/public/img/misc/mountains.svg new file mode 100644 index 00000000..3568d889 --- /dev/null +++ b/fittrackee_client/public/img/misc/mountains.svg @@ -0,0 +1,11 @@ + + + + + + + + diff --git a/fittrackee_client/public/img/weather/breeze.svg b/fittrackee_client/public/img/weather/breeze.svg new file mode 100644 index 00000000..71e134e5 --- /dev/null +++ b/fittrackee_client/public/img/weather/breeze.svg @@ -0,0 +1,16 @@ + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/clear-day.svg b/fittrackee_client/public/img/weather/clear-day.svg new file mode 100644 index 00000000..3cb98d01 --- /dev/null +++ b/fittrackee_client/public/img/weather/clear-day.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/clear-night.svg b/fittrackee_client/public/img/weather/clear-night.svg new file mode 100644 index 00000000..cc7cb229 --- /dev/null +++ b/fittrackee_client/public/img/weather/clear-night.svg @@ -0,0 +1,15 @@ + + + + + + diff --git a/fittrackee_client/public/img/weather/cloudy.svg b/fittrackee_client/public/img/weather/cloudy.svg new file mode 100644 index 00000000..45be567f --- /dev/null +++ b/fittrackee_client/public/img/weather/cloudy.svg @@ -0,0 +1,14 @@ + + + + + + diff --git a/fittrackee_client/public/img/weather/fog.svg b/fittrackee_client/public/img/weather/fog.svg new file mode 100644 index 00000000..fb4f5824 --- /dev/null +++ b/fittrackee_client/public/img/weather/fog.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/partly-cloudy-day.svg b/fittrackee_client/public/img/weather/partly-cloudy-day.svg new file mode 100644 index 00000000..ba775f72 --- /dev/null +++ b/fittrackee_client/public/img/weather/partly-cloudy-day.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/partly-cloudy-night.svg b/fittrackee_client/public/img/weather/partly-cloudy-night.svg new file mode 100644 index 00000000..7cee913c --- /dev/null +++ b/fittrackee_client/public/img/weather/partly-cloudy-night.svg @@ -0,0 +1,21 @@ + + + + + + diff --git a/fittrackee_client/public/img/weather/pour-rain.svg b/fittrackee_client/public/img/weather/pour-rain.svg new file mode 100644 index 00000000..9afd55e8 --- /dev/null +++ b/fittrackee_client/public/img/weather/pour-rain.svg @@ -0,0 +1,15 @@ + + + + + + diff --git a/fittrackee_client/public/img/weather/rain.svg b/fittrackee_client/public/img/weather/rain.svg new file mode 100644 index 00000000..896c2ce5 --- /dev/null +++ b/fittrackee_client/public/img/weather/rain.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/sleet.svg b/fittrackee_client/public/img/weather/sleet.svg new file mode 100644 index 00000000..1871e5be --- /dev/null +++ b/fittrackee_client/public/img/weather/sleet.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/snow.svg b/fittrackee_client/public/img/weather/snow.svg new file mode 100644 index 00000000..e0f21c52 --- /dev/null +++ b/fittrackee_client/public/img/weather/snow.svg @@ -0,0 +1,32 @@ + + + + + + + + + + + diff --git a/fittrackee_client/public/img/weather/temperature.svg b/fittrackee_client/public/img/weather/temperature.svg new file mode 100644 index 00000000..858521ce --- /dev/null +++ b/fittrackee_client/public/img/weather/temperature.svg @@ -0,0 +1,12 @@ + + + + + + diff --git a/fittrackee_client/public/img/weather/wind.svg b/fittrackee_client/public/img/weather/wind.svg new file mode 100644 index 00000000..a0a1ca84 --- /dev/null +++ b/fittrackee_client/public/img/weather/wind.svg @@ -0,0 +1,20 @@ + + + + + + + + + + diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutData.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutData.vue new file mode 100644 index 00000000..2ff0ba3f --- /dev/null +++ b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutData.vue @@ -0,0 +1,98 @@ + + + + + diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutMap.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutMap.vue index bd40e2f8..ecd6ac97 100644 --- a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutMap.vue +++ b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutMap.vue @@ -105,6 +105,7 @@ diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue index 19748af3..e4f7e54c 100644 --- a/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue +++ b/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue @@ -54,6 +54,7 @@ @@ -65,6 +66,7 @@ import { useRoute } from 'vue-router' import Card from '@/components/Common/Card.vue' + import WorkoutData from '@/components/Workout/WorkoutDetail/WorkoutData.vue' import WorkoutMap from '@/components/Workout/WorkoutDetail/WorkoutMap.vue' import { WORKOUTS_STORE } from '@/store/constants' import { ISport } from '@/types/sports' @@ -77,6 +79,7 @@ name: 'WorkoutDetail', components: { Card, + WorkoutData, WorkoutMap, }, props: { @@ -158,6 +161,13 @@ } } } + .card-content { + display: flex; + flex-direction: row; + @media screen and (max-width: $small-limit) { + flex-direction: column; + } + } } } diff --git a/fittrackee_client/src/locales/en/workouts.json b/fittrackee_client/src/locales/en/workouts.json index 1621ac4d..dfcb2e31 100644 --- a/fittrackee_client/src/locales/en/workouts.json +++ b/fittrackee_client/src/locales/en/workouts.json @@ -1,14 +1,22 @@ { "ADD_WORKOUT": "Add workout", + "ASCENT": "ascent", + "AVERAGE_SPEED": "average speed", + "DESCENT": "descent", "DISTANCE": "distance", "DURATION": "duration", + "END": "end", "KM": "km", "LATEST_WORKOUTS": "Latest workouts", + "MAX_ALTITUDE": "max. altitude", + "MAX_SPEED": "max. speed", + "MIN_ALTITUDE": "min. altitude", "NEXT_WORKOUT": "Next workout", "NO_NEXT_WORKOUT": "No next workout", "NO_PREVIOUS_WORKOUT": "No previous workout", "NO_RECORDS": "No records.", "NO_WORKOUTS": "No workouts.", + "PAUSES": "pauses", "PREVIOUS_WORKOUT": "Previous workout", "RECORD": "record | records", "RECORD_AS": "Ave. speed", @@ -16,5 +24,24 @@ "RECORD_LD": "Longest duration", "RECORD_MS": "Max. speed", "SPORT": "sport | sports", + "START": "start", + "TOTAL_DURATION": "total duration", + "WEATHER": { + "HUMIDITY": "humidity", + "TEMPERATURE": "temperature", + "WIND": "wind", + "DARK_SKY": { + "clear-day": "clear day", + "clear-night": "clear night", + "cloudy": "cloudy", + "fog": "fog", + "partly-cloudy-day": "partly cloudy day", + "partly-cloudy-night": "partly cloudy night", + "rain": "rain", + "sleet": "sleet", + "snow": "snow", + "wind": "wind" + } + }, "WORKOUT": "workout | workouts" } diff --git a/fittrackee_client/src/locales/fr/workouts.json b/fittrackee_client/src/locales/fr/workouts.json index 3b274e0e..a94368c5 100644 --- a/fittrackee_client/src/locales/fr/workouts.json +++ b/fittrackee_client/src/locales/fr/workouts.json @@ -1,14 +1,22 @@ { "ADD_WORKOUT": "Ajouter une séance", + "ASCENT": "dénivelé positif", + "AVERAGE_SPEED": "vitesse moyenne", + "DESCENT": "dénivelé négatif", "DISTANCE": "distance", "DURATION": "durée", + "END": "fin", "KM": "km", "LATEST_WORKOUTS": "Séances récentes", + "MAX_ALTITUDE": "altitude max", + "MAX_SPEED": "vitesse max", + "MIN_ALTITUDE": "altitude min", "NEXT_WORKOUT": "Séance suivante", "NO_NEXT_WORKOUT": "Pas de séance suivante", "NO_PREVIOUS_WORKOUT": "Pas de séances précédente", "NO_RECORDS": "Pas de records.", "NO_WORKOUTS": "Pas de séances.", + "PAUSES": "pauses", "PREVIOUS_WORKOUT": "Séance précédente", "RECORD": "record | records", "RECORD_AS": "Vitesse moy.", @@ -16,5 +24,24 @@ "RECORD_LD": "Durée la + longue", "RECORD_MS": "Vitesse max.", "SPORT": "sport | sports", + "START": "début", + "TOTAL_DURATION": "durée totale", + "WEATHER": { + "HUMIDITY": "humidité", + "TEMPERATURE": "température", + "WIND": "vent", + "DARK_SKY": { + "clear-day": "ensoleillé", + "clear-night": "nuit claire", + "cloudy": "nuageux", + "fog": "brouillard", + "partly-cloudy-day": "partiellement nuageux", + "partly-cloudy-night": "nuit partiellement nuageuse", + "rain": "pluie", + "sleet": "neige fondue", + "snow": "neige", + "wind": "venteux" + } + }, "WORKOUT": "séance | séances" } diff --git a/fittrackee_client/src/scss/colors.scss b/fittrackee_client/src/scss/colors.scss index aeecda3e..6d86f04b 100644 --- a/fittrackee_client/src/scss/colors.scss +++ b/fittrackee_client/src/scss/colors.scss @@ -32,4 +32,6 @@ --disabled-color: #a3a3a3; --workout-trophy-color: #daa520; + --workout-img-color: invert(22%) sepia(25%) saturate(646%) hue-rotate(169deg) + brightness(97%) contrast(96%); } \ No newline at end of file