running-tools

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

PaceCalculator.vue (1768B)

      1 <template>
      2   <div class="calculator">
      3     <h2>Input Pace</h2>
      4     <div class="input">
      5       <pace-input v-model="paceOptions.input"/>
      6     </div>
      7 
      8     <details>
      9       <summary>
     10         <h2>Advanced Options</h2>
     11       </summary>
     12       <advanced-options-input v-model:globalOptions="globalOptions"
     13         v-model:options="paceOptions" v-model:targetSets="targetSets" :type="Calculators.Pace"/>
     14     </details>
     15 
     16     <h2>Equivalent Paces</h2>
     17     <single-output-table class="output" :calculate-result="x =>
     18       calculatePaceResults(paceOptions.input, x, globalOptions.defaultUnitSystem, true)"
     19      :targets="targetSets[paceOptions.selectedTargetSet] ?
     20      targetSets[paceOptions.selectedTargetSet].targets : []"/>
     21   </div>
     22 </template>
     23 
     24 <script setup lang="ts">
     25 import { Calculators, calculatePaceResults, defaultGlobalOptions,
     26   defaultPaceOptions } from '@/core/calculators';
     27 import type { GlobalOptions, PaceOptions } from '@/core/calculators';
     28 import { defaultPaceTargetSets } from '@/core/targets';
     29 import type { StandardTargetSets } from '@/core/targets';
     30 
     31 import AdvancedOptionsInput from '@/components/AdvancedOptionsInput.vue';
     32 import PaceInput from '@/components/PaceInput.vue';
     33 import SingleOutputTable from '@/components/SingleOutputTable.vue';
     34 
     35 import useStorage from '@/composables/useStorage';
     36 
     37 /*
     38  * The global options
     39  */
     40 const globalOptions = useStorage<GlobalOptions>('global-options', defaultGlobalOptions);
     41 
     42 /*
     43  * The pace calculator options
     44  */
     45 const paceOptions = useStorage<PaceOptions>('pace-calculator-options', defaultPaceOptions);
     46 
     47 /*
     48  * The target sets
     49  */
     50 const targetSets = useStorage<StandardTargetSets>('pace-calculator-target-sets',
     51   defaultPaceTargetSets);
     52 </script>
     53 
     54 <style scoped>
     55 @import '@/assets/target-calculator.css';
     56 </style>