Alexander/FitTrackee
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Client - use imperial units in workouts filters

Browse Source
This commit is contained in:
Sam 2021-11-14 13:59:41 +01:00
parent 9b7f685992
commit 56bdc4a448
2 changed files with 28 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
fittrackee_client/src/components/Workouts/WorkoutsFilters.vue
View File

@ -47,7 +47,7 @@
<div class="form-items-group">
<div class="form-item">
<label> {{ $t('workouts.DISTANCE') }} (km): </label>
<label> {{ $t('workouts.DISTANCE') }} ({{ toUnit }}): </label>
<div class="form-inputs-group">
<input
name="distance_from"
@ -72,7 +72,7 @@
<div class="form-items-group">
<div class="form-item">
<label> {{ $t('workouts.DURATION') }} (km): </label>
<label> {{ $t('workouts.DURATION') }} ({{ toUnit }}): </label>
<div class="form-inputs-group">
<input
name="duration_from"
@ -97,7 +97,7 @@
<div class="form-items-group">
<div class="form-item">
<label> {{ $t('workouts.AVE_SPEED') }} (km): </label>
<label> {{ $t('workouts.AVE_SPEED') }} ({{ toUnit }}): </label>
<div class="form-inputs-group">
<input
min="0"
@ -122,7 +122,7 @@
<div class="form-items-group">
<div class="form-item">
<label> {{ $t('workouts.MAX_SPEED') }} (km): </label>
<label> {{ $t('workouts.MAX_SPEED') }} ({{ toUnit }}): </label>
<div class="form-inputs-group">
<input
@ -167,6 +167,7 @@
import { ISport } from '@/types/sports'
import { IUserProfile } from '@/types/user'
import { translateSports } from '@/utils/sports'
import { units } from '@/utils/units'
interface Props {
authUser: IUserProfile
@ -181,6 +182,10 @@
const router = useRouter()
const { authUser } = toRefs(props)
const toUnit = authUser.value.imperial_units
? units['km'].defaultTarget
: 'km'
const translatedSports: ComputedRef<ISport[]> = computed(() =>
translateSports(props.sports, t)
)

21
fittrackee_client/src/components/Workouts/WorkoutsList.vue
View File

@ -45,8 +45,9 @@
{{ $t('workouts.SPORT', 1) }}
</span>
<SportImage
v-if="sports.length > 0"
:title="
sports.filter((s) => s.id === workout.sport_id)[0]
sports.find((s) => s.id === workout.sport_id)
.translatedLabel
"
:sport-label="getSportLabel(workout, sports)"
@ -187,6 +188,7 @@
import { getQuery, sortList, workoutsPayloadKeys } from '@/utils/api'
import { getDateWithTZ } from '@/utils/dates'
import { getSportColor, getSportLabel } from '@/utils/sports'
import { convertDistance } from '@/utils/units'
import { defaultOrder } from '@/utils/workouts'
interface Props {
@ -220,7 +222,10 @@
})
function loadWorkouts(payload: TWorkoutsPayload) {
store.dispatch(WORKOUTS_STORE.ACTIONS.GET_USER_WORKOUTS, payload)
store.dispatch(
WORKOUTS_STORE.ACTIONS.GET_USER_WORKOUTS,
user.value.imperial_units ? getConvertedPayload(payload) : payload
)
}
function reloadWorkouts(queryParam: string, queryValue: string) {
const newQuery: LocationQuery = Object.assign({}, route.query)
@ -248,6 +253,18 @@
return query
}
function getConvertedPayload(payload: TWorkoutsPayload): TWorkoutsPayload {
const convertedPayload: TWorkoutsPayload = {
...payload,
}
Object.entries(convertedPayload).map((entry) => {
if (entry[0].match('speed|distance')) {
convertedPayload[entry[0]] = convertDistance(+entry[1], 'mi', 'km')
}
})
return convertedPayload
}
function onHover(workoutId: string | null) {
hoverWorkoutId.value = workoutId
}