Client - inject sport colors

This commit is contained in:
Sam 2021-10-23 15:47:17 +02:00
parent bf229860ae
commit 2de2ad3f3f
4 changed files with 9 additions and 11 deletions

View File

@ -2,7 +2,7 @@
<div
class="sport-img"
:style="{ fill: sportColors[sportLabel] }"
:title="title ? title : t(`sports.${sportLabel}.LABEL`)"
:title="title ? title : $t(`sports.${sportLabel}.LABEL`)"
>
<CyclingSport v-if="sportLabel === 'Cycling (Sport)'" />
<CyclingTransport v-if="sportLabel === 'Cycling (Transport)'" />
@ -14,8 +14,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import { useI18n } from 'vue-i18n'
import { defineComponent, inject } from 'vue'
import CyclingSport from '@/components/Common/Images/SportImage/CyclingSport.vue'
import CyclingTransport from '@/components/Common/Images/SportImage/CyclingTransport.vue'
@ -23,7 +22,6 @@
import MountainBiking from '@/components/Common/Images/SportImage/MountainBiking.vue'
import Running from '@/components/Common/Images/SportImage/Running.vue'
import Walking from '@/components/Common/Images/SportImage/Walking.vue'
import { sportColors } from '@/utils/sports'
export default defineComponent({
name: 'SportImg',
@ -46,8 +44,7 @@
},
},
setup() {
const { t } = useI18n()
return { sportColors, t }
return { sportColors: inject('sportColors') }
},
})
</script>

View File

@ -20,12 +20,12 @@
</template>
<script lang="ts">
import { ComputedRef, PropType, computed, defineComponent } from 'vue'
import { ComputedRef, PropType, computed, defineComponent, inject } from 'vue'
import { useI18n } from 'vue-i18n'
import SportImage from '@/components/Common/Images/SportImage/index.vue'
import { ISport, ITranslatedSport } from '@/types/sports'
import { translateSports, sportColors } from '@/utils/sports'
import { translateSports } from '@/utils/sports'
export default defineComponent({
name: 'SportsMenu',
@ -54,7 +54,7 @@
}
return {
sportColors,
sportColors: inject('sportColors'),
translatedSports,
updateSelectedSportIds,
}

View File

@ -37,7 +37,7 @@
import { ISport, ITranslatedSport } from '@/types/sports'
import { IStatisticsDateParams } from '@/types/statistics'
import { IAuthUserProfile } from '@/types/user'
import { translateSports, sportColors } from '@/utils/sports'
import { translateSports } from '@/utils/sports'
import { getStatsDateParams, updateChartParams } from '@/utils/statistics'
export default defineComponent({
@ -106,7 +106,6 @@
return {
chartParams,
selectedTimeFrame,
sportColors,
timeFrames,
translatedSports,
selectedSportIds,

View File

@ -8,8 +8,10 @@ import store from './store'
import { customComponents } from '@/custom-components'
import { clickOutsideDirective } from '@/directives'
import { sportColors } from '@/utils/sports'
const app = createApp(App)
.provide('sportColors', sportColors)
.use(i18n)
.use(store)
.use(router)