feat: display points for event results when no times

Author: brownben

frontend/components/Table/Results.vue

@@ -18,6 +18,10 @@ const sortedResults = computed(() =>
     .sort(byProperty(ascending.value, activeColumn.value)),
 )
 
+const isPointsOnly = computed(() =>
+  props.results.every((result) => result.time === 0),
+)
+
 const changeSortPreference = (property: Column) => {
   if (property !== activeColumn.value) ascending.value = false
   else ascending.value = !ascending.value
@@ -101,7 +105,8 @@ const ariaSorted = computed(
             class="ring-main-200 rounded-sm px-1 font-medium focus:outline-hidden focus-visible:ring-3"
             @click="changeSortPreference('time')"
           >
-            Time
+            <template v-if="isPointsOnly"> Points </template>
+            <template v-else> Time </template>
             <TableArrows
               :active="activeColumn == 'time'"
               :ascending="ascending"
@@ -115,6 +120,7 @@ const ariaSorted = computed(
         v-for="result of sortedResults"
         :key="result.id"
         :result="result"
+        :points-not-time="isPointsOnly"
       />
     </tbody>
   </table>

frontend/components/Table/RowResult.vue

@@ -5,6 +5,7 @@ import { elapsedTime } from '~/utils/time'
 
 defineProps({
   result: { type: Object as PropType<EventResult>, required: true },
+  pointsNotTime: { type: Boolean, default: false },
 })
 </script>
 <template>
@@ -42,6 +43,13 @@ defineProps({
     >
       {{ result.club || ' ' }}
     </td>
-    <td class="text-center">{{ elapsedTime(result.time) }}</td>
+    <td class="text-center">
+      <template v-if="pointsNotTime">
+        {{ result.file_points }}
+      </template>
+      <template v-else>
+        {{ elapsedTime(result.time) }}
+      </template>
+    </td>
   </tr>
 </template>