improved subNav for matches

This commit is contained in:
cnachtigall1991
2021-10-16 12:52:26 +02:00
parent d6e862a5a1
commit f306b07f3e
4 changed files with 48 additions and 32 deletions

View File

@@ -4,7 +4,7 @@
</header>
<main>
<div class="spacer"></div>
<router-view/>
<router-view name="main" />
</main>
<footer class="mt-auto">
<Footer />
@@ -24,4 +24,4 @@ export default {
.spacer {
height: 70px;
}
</style>
</style>

View File

@@ -12,23 +12,36 @@ const routes = [
{
path: '/',
name: 'Home',
component: lazyLoadView('Home')
components: {
main: lazyLoadView('Home')
}
},
{
path: '/explore',
name: 'Explore',
components: {
main: lazyLoadView('Explore')
}
},
{
path: '/player/:id',
name: 'Player',
component: lazyLoadView('Player'),
components: {
main: lazyLoadView('Player'),
},
props: true
},
{
path: '/match/:match_id',
name: 'Match',
component: lazyLoadView('Match'),
// redirect: '/match/:match_id/overview',
components: {
main: lazyLoadView('Match')
},
props: true,
children: [
{
path: '',
alias: '/match/:match_id',
path: 'overview',
components: {
score: lazyLoadComponent('ScoreTeam')
}
@@ -59,12 +72,6 @@ const routes = [
}
]
},
{
path: '/explore',
name: 'Explore',
component: lazyLoadView('Explore'),
props: true
},
{
path: '/:pathMatch(.*)*',
redirect: '/'

View File

@@ -9,5 +9,5 @@ export const GoToPlayer = (id) => {
}
export const GoToLink = (link) => {
router.push(link)
router.replace(link)
}

View File

@@ -38,36 +38,36 @@
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id"
class="nav-link" name="score">Scoreboard
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/overview'" replace
class="nav-link">Scoreboard
</router-link>
</li>
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/details'"
class="nav-link" name="score">Details
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/details'" replace
class="nav-link">Details
</router-link>
</li>
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/flashes'"
class="nav-link" name="score">Flashes
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/flashes'" replace
class="nav-link">Flashes
</router-link>
</li>
<!-- <li :class="!data.matchDetails.parsed ? 'disabled' : ''"-->
<!-- :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"-->
<!-- class="list-item nav-item">-->
<!-- <router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/utility'"-->
<!-- class="nav-link" name="score">Utility-->
<!-- </router-link>-->
<!-- </li>-->
<!-- <li :class="!data.matchDetails.parsed ? 'disabled' : ''"-->
<!-- :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"-->
<!-- class="list-item nav-item">-->
<!-- <router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/utility'" replace-->
<!-- class="nav-link">Utility-->
<!-- </router-link>-->
<!-- </li>-->
<li :class="!data.matchDetails.parsed ? 'disabled' : ''"
:title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''"
class="list-item nav-item">
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/damage'"
class="nav-link" name="score">Damage
<router-link :disabled="!data.matchDetails.parsed" :to="'/match/' + data.matchDetails.match_id + '/damage'" replace
class="nav-link">Damage
</router-link>
</li>
</ul>
@@ -141,6 +141,17 @@ export default {
data.avgRank = Math.floor(fullRank / count)
}
const checkRoute = () => {
if (route.fullPath.split('/')[3]) {
const sub = route.fullPath.split('/')[3]
GoToLink(`/match/${props.match_id}/${sub}`)
} else if (route.fullPath.split('/')[3] === undefined) {
// setTimeout(() => {
GoToLink(`/match/${props.match_id}/overview`)
// }, 200)
}
}
// Watchers
watch(() => props.match_id, GetMatch)
watch(() => data.stats, GetAvgRank)
@@ -151,9 +162,7 @@ export default {
})
onMounted(() => {
if (!route.fullPath.match('details' || 'flashes' || 'damage')) {
GoToLink(`/match/${props.match_id}`)
}
checkRoute()
})
return {