#266 [calendar] replace calendarWide with ?layout=basic

This commit is contained in:
Avris 2021-10-03 16:56:07 +02:00
parent 77ad300432
commit 5c53e47f6d
5 changed files with 57 additions and 69 deletions

View File

@ -277,7 +277,6 @@ export default {
routes.push({ path: '/' + config.calendar.route, component: resolve(__dirname, 'routes/calendar.vue') });
routes.push({ path: '/' + config.calendar.route + '/:year(\\d\\d\\d\\d)', component: resolve(__dirname, 'routes/calendar.vue') });
routes.push({ path: '/' + config.calendar.route + '/:year(\\d\\d\\d\\d)-:month(\\d\\d)-:day(\\d\\d)', component: resolve(__dirname, 'routes/calendarDay.vue') });
routes.push({ path: '/calendar-wide', component: resolve(__dirname, 'routes/calendarWide.vue') });
}
if (config.api !== null) {

View File

@ -1,28 +1,45 @@
<template>
<div v-if="year">
<CommunityNav/>
<CommunityNav v-if="!basic"/>
<h2>
<Icon v="calendar-star"/>
<T>calendar.headerLong</T> <small class="text-muted">({{year.year}})</small>
<h2 class="d-flex justify-content-between">
<span>
<Icon v="calendar-star"/>
<T>calendar.headerLong</T> <small class="text-muted">({{year.year}})</small>
</span>
<span v-if="basic" class="h4 mt-2">
<nuxt-link :to="`/${ config.calendar.route }`">
<Icon v="tags"/>
<T>domain</T>/{{ config.calendar.route }}
</nuxt-link>
</span>
</h2>
<CalendarBanner v-if="year.isCurrent()"/>
<section class="row">
<section v-if="basic" class="row pb-4">
<div v-for="i in 12" class="col-12 col-lg-3 py-3">
<h3 class="text-center"><T>calendar.months.{{i}}</T></h3>
<CalendarMonthEvents v-if="labels" :year="year" :month="i" class="small my-3"/>
<Calendar v-else :year="year" :month="i"/>
</div>
</section>
<section v-else class="row">
<div v-for="i in 12" class="col-12 col-sm-6 col-lg-4 py-3">
<h3 class="text-center"><T>calendar.months.{{i}}</T></h3>
<Calendar :year="year" :month="i" :mark="today" tooltips/>
</div>
</section>
<CalendarExtra/>
<template v-if="!basic">
<CalendarExtra/>
<Support/>
<Support/>
<section>
<Share :title="$t('calendar.header')"/>
</section>
<section>
<Share :title="$t('calendar.header')"/>
</section>
</template>
</div>
<NotFound v-else/>
</template>
@ -33,12 +50,17 @@
import { Day } from '../src/calendar/helpers';
export default {
layout({route}) {
return route.query.layout === 'basic' ? 'basic' : 'default';
},
data() {
return {
year: this.$route.params.year
? calendar.getYear(this.$route.params.year)
: calendar.getCurrentYear(),
today: Day.today(),
basic: this.$route.query.layout === 'basic',
labels: this.$route.query.labels === 'true',
}
},
head() {

View File

@ -1,10 +1,18 @@
<template>
<div v-if="year.eventsByDate[day.toString()]">
<CommunityNav/>
<CommunityNav v-if="!basic"/>
<h2>
<Icon v="calendar-star"/>
<T>calendar.headerLong</T> <small class="text-muted">({{day}})</small>
<h2 class="d-flex justify-content-between">
<span>
<Icon v="calendar-star"/>
<T>calendar.headerLong</T> <small class="text-muted">({{day}})</small>
</span>
<span v-if="basic" class="h4 mt-2">
<nuxt-link :to="`/${ config.calendar.route }`">
<Icon v="tags"/>
<T>domain</T>/{{ config.calendar.route }}
</nuxt-link>
</span>
</h2>
<section>
@ -22,13 +30,15 @@
</div>
</section>
<CalendarExtra :day="day"/>
<template v-if="!basic">
<CalendarExtra :day="day"/>
<Support/>
<Support/>
<section>
<Share :title="$t('calendar.header')"/>
</section>
<section>
<Share :title="$t('calendar.header')"/>
</section>
</template>
</div>
<NotFound v-else/>
</template>
@ -39,6 +49,9 @@
import { Day } from '../src/calendar/helpers';
export default {
layout({route}) {
return route.query.layout === 'basic' ? 'basic' : 'default';
},
data() {
const day = new Day(
this.$route.params.year,
@ -49,6 +62,7 @@
return {
day,
year: calendar.getYear(day.year),
basic: this.$route.query.layout === 'basic',
}
},
head() {

View File

@ -1,47 +0,0 @@
<template>
<div v-if="year">
<h2 class="d-flex justify-content-between">
<span>
<Icon v="calendar-star"/>
<T>calendar.headerLong</T> <small class="text-muted">({{year.year}})</small>
</span>
<span class="h4 mt-2">
<nuxt-link to="/">
<Icon v="tags"/>
<T>domain</T>/{{ config.calendar.route }}
</nuxt-link>
</span>
</h2>
<section class="row pb-4">
<div v-for="i in 12" class="col-12 col-lg-3 py-3">
<h3 class="text-center"><T>calendar.months.{{i}}</T></h3>
<CalendarMonthEvents v-if="labels" :year="year" :month="i" class="small my-3"/>
<Calendar v-else :year="year" :month="i"/>
</div>
</section>
</div>
<NotFound v-else/>
</template>
<script>
import { head } from "../src/helpers";
import {calendar} from "@/src/calendar/calendar";
export default {
layout: 'basic',
data() {
return {
year: this.$route.params.year
? calendar.getYear(this.$route.params.year)
: calendar.getCurrentYear(),
labels: this.$route.query.labels === 'true',
}
},
head() {
return head({
title: this.$t('calendar.headerLong'),
});
},
}
</script>

View File

@ -43,7 +43,7 @@ const dumpNameDays = async () => {
}
(async () => {
await shoot('/calendar-wide', `overview`);
await shoot('/calendar-wide?labels=true', `labels`);
await shoot(`/${config.calendar.route}?layout=basic`, `overview`);
await shoot(`/${config.calendar.route}?layout=basic&labels=true`, `labels`);
await dumpNameDays();
})();