running-tools

A collection of tools for runners and their coaches
git clone https://git.ashermorgan.net/running-tools/
Log | Files | Refs | README

RaceCalculator.vue (2655B)

      1 <template>
      2   <div class="calculator">
      3     <h2>Input Race Result</h2>
      4     <div class="input">
      5       <pace-input v-model="raceOptions.input" label="Input race"/>
      6     </div>
      7 
      8     <details>
      9       <summary>
     10         <h2>Race Statistics</h2>
     11       </summary>
     12       <div>
     13         Purdy points: <b>{{ formatNumber(raceStats.purdyPoints, 0, 1, true) }}</b>
     14       </div>
     15       <div>
     16         V&#775;O&#8322;: <b>{{ formatNumber(raceStats.vo2, 0, 1, true) }}</b> ml/kg/min
     17           (<b>{{ formatNumber(raceStats.vo2MaxPercentage, 0, 1, true) }}%</b> of max)
     18       </div>
     19       <div>
     20         V&#775;O&#8322; Max: <b>{{ formatNumber(raceStats.vo2Max, 0, 1, true) }}</b>
     21           ml/kg/min
     22       </div>
     23     </details>
     24 
     25     <details>
     26       <summary>
     27         <h2>Advanced Options</h2>
     28       </summary>
     29       <advanced-options-input v-model:globalOptions="globalOptions"
     30         v-model:options="raceOptions" v-model:targetSets="targetSets" :type="Calculators.Race"/>
     31     </details>
     32 
     33     <h2>Equivalent Race Results</h2>
     34     <single-output-table class="output" show-pace :calculate-result="x =>
     35       calculateRaceResults(raceOptions.input, x, globalOptions.racePredictionOptions,
     36       globalOptions.defaultUnitSystem, true)"
     37       :targets="targetSets[raceOptions.selectedTargetSet] ?
     38       targetSets[raceOptions.selectedTargetSet].targets : []"/>
     39   </div>
     40 </template>
     41 
     42 <script setup lang="ts">
     43 import { computed } from 'vue';
     44 
     45 import { Calculators, calculateRaceResults, calculateRaceStats, defaultGlobalOptions,
     46   defaultRaceOptions } from '@/core/calculators';
     47 import type { GlobalOptions, RaceOptions, RaceStats } from '@/core/calculators';
     48 import { defaultRaceTargetSets } from '@/core/targets';
     49 import type { StandardTargetSets } from '@/core/targets';
     50 import { formatNumber } from '@/core/units';
     51 
     52 import AdvancedOptionsInput from '@/components/AdvancedOptionsInput.vue';
     53 import PaceInput from '@/components/PaceInput.vue';
     54 import SingleOutputTable from '@/components/SingleOutputTable.vue';
     55 
     56 import useStorage from '@/composables/useStorage';
     57 
     58 /*
     59  * The global options
     60  */
     61 const globalOptions = useStorage<GlobalOptions>('global-options', defaultGlobalOptions);
     62 
     63 /*
     64 * The race calculator options
     65 */
     66 const raceOptions = useStorage<RaceOptions>('race-calculator-options', defaultRaceOptions);
     67 
     68 /*
     69  * The race calculator target sets
     70  */
     71 const targetSets = useStorage<StandardTargetSets>('race-calculator-target-sets',
     72   defaultRaceTargetSets);
     73 
     74 /*
     75  * The statistics for the current input race
     76  */
     77 const raceStats = computed<RaceStats>(() => calculateRaceStats(raceOptions.value.input));
     78 </script>
     79 
     80 <style scoped>
     81 @import '@/assets/target-calculator.css';
     82 </style>