Client - minor refactoring

This commit is contained in:
Sam
2021-09-26 13:40:12 +02:00
parent 63f8ef59ae
commit 2826e8ad8c
11 changed files with 67 additions and 58 deletions

View File

@ -46,7 +46,7 @@
import { IAuthUserProfile } from '@/types/user'
import {
IWorkoutChartData,
IWorkoutState,
IWorkoutData,
TCoordinates,
} from '@/types/workouts'
import { getDatasets } from '@/utils/workouts'
@ -62,8 +62,8 @@
type: Object as PropType<IAuthUserProfile>,
required: true,
},
workout: {
type: Object as PropType<IWorkoutState>,
workoutData: {
type: Object as PropType<IWorkoutData>,
required: true,
},
},
@ -72,7 +72,7 @@
const { t } = useI18n()
let displayDistance = ref(true)
const datasets: ComputedRef<IWorkoutChartData> = computed(() =>
getDatasets(props.workout.chartData, t)
getDatasets(props.workoutData.chartData, t)
)
let chartData: ComputedRef<ChartData<'line'>> = computed(() => ({
labels: displayDistance.value

View File

@ -35,7 +35,7 @@
import { ROOT_STORE } from '@/store/constants'
import { GeoJSONData } from '@/types/geojson'
import { IWorkoutState, TCoordinates } from '@/types/workouts'
import { IWorkoutData, TCoordinates } from '@/types/workouts'
import { useStore } from '@/use/useStore'
import { getApiUrl } from '@/utils'
@ -48,8 +48,8 @@
LTileLayer,
},
props: {
workout: {
type: Object as PropType<IWorkoutState>,
workoutData: {
type: Object as PropType<IWorkoutData>,
},
markerCoordinates: {
type: Object as PropType<TCoordinates>,
@ -89,15 +89,15 @@
}
const bounds = computed(() =>
props.workout
props.workoutData
? [
[
props.workout.workout.bounds[0],
props.workout.workout.bounds[1],
props.workoutData.workout.bounds[0],
props.workoutData.workout.bounds[1],
],
[
props.workout.workout.bounds[2],
props.workout.workout.bounds[3],
props.workoutData.workout.bounds[2],
props.workoutData.workout.bounds[3],
],
]
: []
@ -111,8 +111,8 @@
bounds: bounds,
center: computed(() => getCenter(bounds)),
geoJson: computed(() =>
props.workout && props.workout.gpx
? getGeoJson(props.workout.gpx)
props.workoutData && props.workoutData.gpx
? getGeoJson(props.workoutData.gpx)
: {}
),
options: { zoom: 13 },

View File

@ -4,17 +4,17 @@
<template #title>
<div
class="workout-previous workout-arrow"
:class="{ inactive: !workout.workout.previous_workout }"
:class="{ inactive: !workoutData.workout.previous_workout }"
:title="
workout.workout.previous_workout
workoutData.workout.previous_workout
? t('workouts.PREVIOUS_WORKOUT')
: t('workouts.NO_PREVIOUS_WORKOUT')
"
@click="
workout.workout.previous_workout
workoutData.workout.previous_workout
? $router.push({
name: 'Workout',
params: { workoutId: workout.workout.previous_workout },
params: { workoutId: workoutData.workout.previous_workout },
})
: null
"
@ -26,7 +26,7 @@
<img alt="workout sport logo" :src="sport.img" />
</div>
<div class="workout-title-date">
<div class="workout-title">{{ workout.workout.title }}</div>
<div class="workout-title">{{ workoutData.workout.title }}</div>
<div class="workout-date">
{{ workoutDate.workout_date }} - {{ workoutDate.workout_time }}
</div>
@ -34,17 +34,17 @@
</div>
<div
class="workout-next workout-arrow"
:class="{ inactive: !workout.workout.next_workout }"
:class="{ inactive: !workoutData.workout.next_workout }"
:title="
workout.workout.next_workout
workoutData.workout.next_workout
? t('workouts.NEXT_WORKOUT')
: t('workouts.NO_NEXT_WORKOUT')
"
@click="
workout.workout.next_workout
workoutData.workout.next_workout
? $router.push({
name: 'Workout',
params: { workoutId: workout.workout.next_workout },
params: { workoutId: workoutData.workout.next_workout },
})
: null
"
@ -53,8 +53,11 @@
</div>
</template>
<template #content>
<WorkoutMap :workout="workout" :markerCoordinates="markerCoordinates" />
<WorkoutData :workout="workout.workout" />
<WorkoutMap
:workoutData="workoutData"
:markerCoordinates="markerCoordinates"
/>
<WorkoutData :workout="workoutData.workout" />
</template>
</Card>
</div>
@ -71,7 +74,7 @@
import { WORKOUTS_STORE } from '@/store/constants'
import { ISport } from '@/types/sports'
import { IAuthUserProfile } from '@/types/user'
import { IWorkoutState, TCoordinates } from '@/types/workouts'
import { IWorkoutData, TCoordinates } from '@/types/workouts'
import { useStore } from '@/use/useStore'
import { formatWorkoutDate, getDateWithTZ } from '@/utils/dates'
@ -94,8 +97,8 @@
sports: {
type: Object as PropType<ISport[]>,
},
workout: {
type: Object as PropType<IWorkoutState>,
workoutData: {
type: Object as PropType<IWorkoutData>,
required: true,
},
},
@ -106,21 +109,21 @@
watch(
() => route.params.workoutId,
async (newWorkoutId) => {
store.dispatch(WORKOUTS_STORE.ACTIONS.GET_WORKOUT, newWorkoutId)
store.dispatch(WORKOUTS_STORE.ACTIONS.GET_WORKOUT_DATA, newWorkoutId)
}
)
return {
sport: computed(() =>
props.sports
? props.sports.find(
(sport) => sport.id === props.workout.workout.sport_id
(sport) => sport.id === props.workoutData.workout.sport_id
)
: {}
),
workoutDate: computed(() =>
formatWorkoutDate(
getDateWithTZ(
props.workout.workout.workout_date,
props.workoutData.workout.workout_date,
props.authUser.timezone
)
)