Skip to content

Commit cdacae3

Browse files
lucien-chastanlucien-chastan
committed
Mise en place d'un système de sous niveau sur les blocs et voies indoor
1 parent 98702fe commit cdacae3

10 files changed

Lines changed: 325 additions & 17 deletions

File tree

‎components/forms/GymRouteSubLevelInput.vue‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
<template>
2+
<v-slider
3+
v-if="gymLevels && gymLevels[climbingType] && gymLevels[climbingType].sub_level_enabled"
4+
v-model="subLevel"
5+
:label="$t('models.gymRoute.intensity')"
6+
:tick-labels="tickLabels()"
7+
track-color="rgba(150,150,150,0.4)"
8+
:color="color"
9+
min="0"
10+
:prepend-icon="mdiChiliMild"
11+
class="mb-5"
12+
:max="gymLevels[climbingType].sub_level_max"
13+
@change="onChange()"
14+
/>
15+
</template>
16+
17+
<script>
18+
import { mdiChiliMild } from '@mdi/js'
19+
20+
export default {
21+
name: 'GymRouteSubLevelInput',
22+
props: {
23+
value: {
24+
type: [Number, String],
25+
default: null
26+
},
27+
gymLevels: {
28+
type: Object,
29+
required: true
30+
},
31+
climbingType: {
32+
type: String,
33+
required: true
34+
}
35+
},
36+
37+
data () {
38+
return {
39+
subLevel: this.value,
40+
41+
colors: {
42+
0: [],
43+
1: ['#a10026'],
44+
2: ['#8bbc22', '#a10026'],
45+
3: ['#8bbc22', '#f2b600', '#a10026'],
46+
4: ['#8bbc22', '#f2b600', '#fd2605', '#a10026'],
47+
5: ['#8bbc22', '#f2b600', '#f96a02', '#f11d10', '#a10026']
48+
},
49+
50+
mdiChiliMild
51+
}
52+
},
53+
54+
computed: {
55+
color () {
56+
return this.colors[this.gymLevels[this.climbingType].sub_level_max][this.subLevel - 1]
57+
}
58+
},
59+
60+
methods: {
61+
onChange () {
62+
this.$emit('input', this.subLevel)
63+
},
64+
65+
tickLabels () {
66+
const labels = []
67+
for (let i = 0; i <= this.gymLevels[this.climbingType].sub_level_max; i++) {
68+
if (i === 0) {
69+
labels.push('Ø')
70+
} else {
71+
labels.push(i)
72+
}
73+
}
74+
return labels
75+
}
76+
}
77+
}
78+
</script>

‎components/gymRoutes/GymRouteInfo.vue‎

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -233,6 +233,23 @@
233233
class="rounded-sm py-1"
234234
/>
235235
</v-col>
236+
237+
<!-- Route sub level -->
238+
<v-col
239+
v-if="route.sub_level > 0"
240+
cols="6"
241+
class="my-1"
242+
>
243+
<description-line
244+
:icon="mdiChiliMild"
245+
:item-title="$t('models.gymRoute.intensity')"
246+
class="rounded-sm py-1"
247+
>
248+
<template #content>
249+
<gym-route-sub-level-scale :gym-route="gymRoute" />
250+
</template>
251+
</description-line>
252+
</v-col>
236253
</v-row>
237254

238255
<!-- Difficulty appreciation -->
@@ -367,6 +384,7 @@ import {
367384
mdiCalendar,
368385
mdiTextureBox,
369386
mdiBolt,
387+
mdiChiliMild,
370388
mdiPound,
371389
mdiMap,
372390
mdiGauge,
@@ -389,6 +407,7 @@ import GymCreateYourAccount from '~/components/gyms/GymCreateYourAccount'
389407
import GymRouteApi from '~/services/oblyk-api/GymRouteApi'
390408
import GymRoute from '~/models/GymRoute'
391409
import GymRouteTagAndHoldV2 from '~/components/gymRoutes/partial/GymRouteTagAndHoldV2'
410+
import GymRouteSubLevelScale from '~/components/gymRoutes/GymRouteSubLevelScale'
392411
393412
const GymRouteVideoList = () => import('@/components/gymRoutes/GymRouteVideoList')
394413
const CommentList = () => import('@/components/comments/CommentList')
@@ -397,6 +416,7 @@ const MarkdownText = () => import('@/components/ui/MarkdownText')
397416
export default {
398417
name: 'GymRouteInfo',
399418
components: {
419+
GymRouteSubLevelScale,
400420
GymRouteTagAndHoldV2,
401421
GymCreateYourAccount,
402422
GymRouteVideoList,
@@ -454,7 +474,8 @@ export default {
454474
mdiGauge,
455475
mdiArrowRight,
456476
mdiShield,
457-
mdiInformation
477+
mdiInformation,
478+
mdiChiliMild
458479
}
459480
},
460481

‎components/gymRoutes/GymRouteListItem.vue‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -71,8 +71,16 @@
7171
<div class="mr-auto text-truncate">
7272
{{ gymRoute.name }}
7373
</div>
74-
<div class="pt-1">
75-
<gym-route-grade-and-point :gym-route="gymRoute" />
74+
<div class="pt-1 text-no-wrap">
75+
<gym-route-grade-and-point
76+
:gym-route="gymRoute"
77+
inline
78+
/>
79+
<gym-route-sub-level
80+
v-if="gymRoute.sub_level"
81+
class="ml-1"
82+
:gym-route="gymRoute"
83+
/>
7684
</div>
7785
</v-list-item-title>
7886
<v-list-item-subtitle class="d-flex">
@@ -149,10 +157,12 @@ import { MyAscentStatusMixin } from '~/mixins/MyAscentStatusMixin'
149157
import GymRouteGradeAndPoint from '~/components/gymRoutes/partial/GymRouteGradeAndPoint'
150158
import GymRouteAvatar from '~/components/gymRoutes/GymRouteAvatar'
151159
import GymRouteClimbingSimpleStyleIcons from '~/components/gymRoutes/partial/GymRouteClimbingSimpleStyleIcons'
160+
import GymRouteSubLevel from '~/components/gymRoutes/GymRouteSubLevel.vue'
152161
153162
export default {
154163
name: 'GymRouteListItem',
155164
components: {
165+
GymRouteSubLevel,
156166
GymRouteClimbingSimpleStyleIcons,
157167
GymRouteAvatar,
158168
GymRouteGradeAndPoint

‎components/gymRoutes/GymRouteSubLevel.vue‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
<template>
2+
<span
3+
:style="`color: ${color};`"
4+
class="font-weight-bold"
5+
>
6+
<span>
7+
{{ gymRoute.sub_level }}
8+
</span>
9+
<v-icon
10+
class="vertical-align-text-top"
11+
:color="color"
12+
small
13+
style="margin-left: -6px; padding-top: 1px"
14+
>
15+
{{ mdiChiliMild }}
16+
</v-icon>
17+
</span>
18+
</template>
19+
20+
<script>
21+
import { mdiChiliMild } from '@mdi/js'
22+
23+
export default {
24+
name: 'GymRouteSubLevel',
25+
props: {
26+
gymRoute: {
27+
type: Object,
28+
required: true
29+
}
30+
},
31+
32+
data () {
33+
return {
34+
colors: {
35+
0: [],
36+
1: ['#a10026'],
37+
2: ['#8bbc22', '#a10026'],
38+
3: ['#8bbc22', '#f2b600', '#a10026'],
39+
4: ['#8bbc22', '#f2b600', '#fd2605', '#a10026'],
40+
5: ['#8bbc22', '#f2b600', '#f96a02', '#f11d10', '#a10026']
41+
},
42+
43+
mdiChiliMild
44+
}
45+
},
46+
47+
computed: {
48+
color () {
49+
return this.colors[this.gymRoute.sub_level_max][this.gymRoute.sub_level - 1]
50+
}
51+
}
52+
}
53+
</script>

‎components/gymRoutes/GymRouteSubLevelScale.vue‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<template>
2+
<span>
3+
<v-icon
4+
v-for="(level, levelIndex) in gymRoute.sub_level_max"
5+
:key="`level-${levelIndex}`"
6+
:color="gymRoute.sub_level >= level ? colors[gymRoute.sub_level_max][gymRoute.sub_level - 1] : 'rgba(150, 150, 150, 0.3)'"
7+
size="17"
8+
style="margin-right: -6px;"
9+
>
10+
{{ mdiChiliMild }}
11+
</v-icon>
12+
</span>
13+
</template>
14+
15+
<script>
16+
import { mdiChiliMild } from '@mdi/js'
17+
18+
export default {
19+
name: 'GymRouteSubLevelScale',
20+
props: {
21+
gymRoute: {
22+
type: Object,
23+
required: true
24+
}
25+
},
26+
27+
data () {
28+
return {
29+
colors: {
30+
0: [],
31+
1: ['#a10026'],
32+
2: ['#8bbc22', '#a10026'],
33+
3: ['#8bbc22', '#f2b600', '#a10026'],
34+
4: ['#8bbc22', '#f2b600', '#fd2605', '#a10026'],
35+
5: ['#8bbc22', '#f2b600', '#f96a02', '#f11d10', '#a10026']
36+
},
37+
38+
mdiChiliMild
39+
}
40+
}
41+
}
42+
</script>

‎components/gymRoutes/GymRouteTable.vue‎

Lines changed: 32 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,15 @@
138138
{{ MC_ClimbingStylesByStyle[style].icon }}
139139
</v-icon>
140140
</template>
141+
<template
142+
v-once
143+
#[`item.subLevel`]="{ item }"
144+
>
145+
<gym-route-sub-level-scale
146+
v-if="item.subLevel"
147+
:gym-route="{ sub_level: item.subLevel, sub_level_max: item.subLevelMax }"
148+
/>
149+
</template>
141150
<template
142151
v-once
143152
#[`item.openedAt`]="{ item }"
@@ -435,6 +444,8 @@ import {
435444
} from '@mdi/js'
436445
import { DateHelpers } from '@/mixins/DateHelpers'
437446
import { GymRolesHelpers } from '~/mixins/GymRolesHelpers'
447+
import { ClimbingStylesMixin } from '~/mixins/ClimbingStylesMixin'
448+
import { ImageVariantHelpers } from '~/mixins/ImageVariantHelpers'
438449
import GymApi from '~/services/oblyk-api/GymApi'
439450
import GymRoute from '@/models/GymRoute'
440451
import GymRouteTagAndHold from '@/components/gymRoutes/partial/GymRouteTagAndHold'
@@ -446,13 +457,13 @@ import GymSpace from '~/models/GymSpace'
446457
import DownToCloseDialog from '~/components/ui/DownToCloseDialog'
447458
import GymRouteInfo from '~/components/gymRoutes/GymRouteInfo'
448459
import OpeningSheetDialog from '~/components/gymOpeningSheets/OpeningSheetDialog'
449-
import { ImageVariantHelpers } from '~/mixins/ImageVariantHelpers'
450460
import AscentGymRouteIcon from '~/components/ascentGymRoutes/AscentGymRouteIcon'
451-
import { ClimbingStylesMixin } from '~/mixins/ClimbingStylesMixin'
461+
import GymRouteSubLevelScale from '~/components/gymRoutes/GymRouteSubLevelScale'
452462
453463
export default {
454464
name: 'GymRoutesTable',
455465
components: {
466+
GymRouteSubLevelScale,
456467
AscentGymRouteIcon,
457468
OpeningSheetDialog,
458469
GymRouteInfo,
@@ -599,6 +610,7 @@ export default {
599610
let haveAnchor = false
600611
let haveName = false
601612
let haveGrade = false
613+
let haveSubLevel = false
602614
for (const route of this.routes) {
603615
// Add anchor column
604616
if (!haveAnchor && route.anchor_number !== null) {
@@ -613,6 +625,21 @@ export default {
613625
})
614626
haveAnchor = true
615627
}
628+
629+
// Add subLevel column
630+
if (!haveSubLevel && route.sub_level > 0) {
631+
headers.push({
632+
order: 4.1,
633+
text: this.$t('models.gymRoute.intensity'),
634+
align: 'start',
635+
sortable: true,
636+
cellClass: 'text-no-wrap',
637+
class: 'text-no-wrap',
638+
value: 'subLevel'
639+
})
640+
haveSubLevel = true
641+
}
642+
616643
// Add name column
617644
if (!haveName && route.name !== null) {
618645
headers.push({
@@ -625,6 +652,7 @@ export default {
625652
})
626653
haveName = true
627654
}
655+
628656
// Add grade column
629657
if (!haveGrade && route.grade_to_s !== null) {
630658
headers.push({
@@ -754,6 +782,8 @@ export default {
754782
point_to_s: route.points_to_s,
755783
points: route.points,
756784
styles,
785+
subLevel: route.sub_level,
786+
subLevelMax: route.sub_level_max,
757787
anchorNumber: route.anchor_number,
758788
sector: route.gym_sector.name,
759789
gym_space: {

0 commit comments

Comments
 (0)