Client - use imperial units when adding workout w/o gpx

This commit is contained in:
Sam 2021-11-14 14:34:46 +01:00
parent 56bdc4a448
commit f867ad7a4b
2 changed files with 31 additions and 11 deletions

View File

@ -6,7 +6,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { toRefs, withDefaults } from 'vue' import { ComputedRef, computed, toRefs, withDefaults } from 'vue'
import { TUnit } from '@/types/units' import { TUnit } from '@/types/units'
import { units, convertDistance } from '@/utils/units' import { units, convertDistance } from '@/utils/units'
@ -36,12 +36,21 @@
unitFrom, unitFrom,
useImperialUnits, useImperialUnits,
} = toRefs(props) } = toRefs(props)
const unitTo: TUnit = useImperialUnits.value const unitTo: ComputedRef<TUnit> = computed(() =>
useImperialUnits.value
? units[unitFrom.value].defaultTarget ? units[unitFrom.value].defaultTarget
: unitFrom.value : unitFrom.value
const convertedDistance = useImperialUnits.value )
? convertDistance(distance.value, unitFrom.value, unitTo, digits.value) const convertedDistance = computed(() =>
: distance useImperialUnits.value
? convertDistance(
distance.value,
unitFrom.value,
unitTo.value,
digits.value
)
: distance.value
)
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -173,7 +173,11 @@
</div> </div>
</div> </div>
<div class="form-item"> <div class="form-item">
<label>{{ $t('workouts.DISTANCE') }} (km):</label> <label>
{{ $t('workouts.DISTANCE') }} ({{
authUser.imperial_units ? 'mi' : 'km'
}}):
</label>
<input <input
name="workout-distance" name="workout-distance"
type="number" type="number"
@ -239,6 +243,7 @@
import { formatWorkoutDate, getDateWithTZ } from '@/utils/dates' import { formatWorkoutDate, getDateWithTZ } from '@/utils/dates'
import { getReadableFileSize } from '@/utils/files' import { getReadableFileSize } from '@/utils/files'
import { translateSports } from '@/utils/sports' import { translateSports } from '@/utils/sports'
import { convertDistance } from '@/utils/units'
interface Props { interface Props {
authUser: IUserProfile authUser: IUserProfile
@ -257,7 +262,7 @@
const store = useStore() const store = useStore()
const router = useRouter() const router = useRouter()
const { workout, isCreation, loading } = toRefs(props) const { authUser, workout, isCreation, loading } = toRefs(props)
const translatedSports: ComputedRef<ISport[]> = computed(() => const translatedSports: ComputedRef<ISport[]> = computed(() =>
translateSports( translateSports(
props.sports, props.sports,
@ -324,7 +329,11 @@
'yyyy-MM-dd' 'yyyy-MM-dd'
) )
const duration = workout.duration.split(':') const duration = workout.duration.split(':')
workoutForm.workoutDistance = `${workout.distance}` workoutForm.workoutDistance = `${
authUser.value.imperial_units
? convertDistance(workout.distance, 'km', 'mi', 2)
: workout.distance
}`
workoutForm.workoutDate = workoutDateTime.workout_date workoutForm.workoutDate = workoutDateTime.workout_date
workoutForm.workoutTime = workoutDateTime.workout_time workoutForm.workoutTime = workoutDateTime.workout_time
workoutForm.workoutDurationHour = duration[0] workoutForm.workoutDurationHour = duration[0]
@ -334,7 +343,9 @@
} }
function formatPayload(payload: IWorkoutForm) { function formatPayload(payload: IWorkoutForm) {
payload.title = workoutForm.title payload.title = workoutForm.title
payload.distance = +workoutForm.workoutDistance payload.distance = authUser.value.imperial_units
? convertDistance(+workoutForm.workoutDistance, 'mi', 'km', 3)
: +workoutForm.workoutDistance
payload.duration = payload.duration =
+workoutForm.workoutDurationHour * 3600 + +workoutForm.workoutDurationHour * 3600 +
+workoutForm.workoutDurationMinutes * 60 + +workoutForm.workoutDurationMinutes * 60 +