[events] AgendaView fixed styling on low res devices and fixed icons

This commit is contained in:
Ferdinand Thiessen 2021-04-04 21:36:55 +02:00
parent 494a555985
commit dd33e77514
1 changed files with 91 additions and 90 deletions

View File

@ -12,7 +12,7 @@
align="right" align="right"
style="position: sticky; top: 5px; padding-right: 5px; z-index: 999" style="position: sticky; top: 5px; padding-right: 5px; z-index: 999"
> >
<q-btn round color="negative" icon="close" dense rounded @click="editDone(false)" /> <q-btn round color="negative" icon="mdi-close" dense rounded @click="editDone(false)" />
</div> </div>
<div class="col" style="margin: 0; padding: 0; margin-top: -2.4em"> <div class="col" style="margin: 0; padding: 0; margin-top: -2.4em">
<edit-event v-model="editor" :date="editor.start" @done="editDone" /> <edit-event v-model="editor" :date="editor.start" @done="editDone" />
@ -21,9 +21,8 @@
</q-card> </q-card>
</q-dialog> </q-dialog>
<q-card> <q-card>
<div style="max-width: 1800px; width: 100%">
<q-toolbar class="bg-primary text-white q-my-md shadow-2 items-center row justify-center"> <q-toolbar class="bg-primary text-white q-my-md shadow-2 items-center row justify-center">
<q-btn flat dense class="row absolute-left q-ml-sm" <q-btn flat dense class="absolute-left q-ml-sm"
>{{ asMonth(selectedDate) }} {{ asYear(selectedDate) }} >{{ asMonth(selectedDate) }} {{ asYear(selectedDate) }}
<q-popup-proxy transition-show="scale" transition-hide="scale" @before-show="updateProxy"> <q-popup-proxy transition-show="scale" transition-hide="scale" @before-show="updateProxy">
<q-date v-model="proxyDate"> <q-date v-model="proxyDate">
@ -40,7 +39,10 @@
</q-date> </q-date>
</q-popup-proxy> </q-popup-proxy>
</q-btn> </q-btn>
<div class="row justify-center items-center"> <div
class="row"
:class="{ 'absolute-right': windowWidth < 600, 'q-mr-sm': windowWidth < 600 }"
>
<q-btn flat dense label="Zurück" @click="calendarPrev" /> <q-btn flat dense label="Zurück" @click="calendarPrev" />
<q-separator vertical /> <q-separator vertical />
<q-btn <q-btn
@ -108,7 +110,6 @@
</div> </div>
</template> </template>
</q-calendar-agenda> </q-calendar-agenda>
</div>
</q-card> </q-card>
</template> </template>
@ -178,7 +179,6 @@ export default defineComponent({
async function loadAgendas() { async function loadAgendas() {
const selected = new Date(selectedDate.value); const selected = new Date(selectedDate.value);
console.log(selected);
const start = calendarRealView.value === 'day' ? selected : startOfWeek(selected); const start = calendarRealView.value === 'day' ? selected : startOfWeek(selected);
const end = date.addToDate(start, { days: calendarDays.value }); const end = date.addToDate(start, { days: calendarDays.value });
@ -262,7 +262,8 @@ export default defineComponent({
} }
function newEvent(start: Date | string | number) { function newEvent(start: Date | string | number) {
editor.value = Object.assign({}, emptyEvent, { start: start }); if (typeof start === 'string') start = date.extractDate(start, 'YYYY-MM-DD');
editor.value = emptyEvent(new Date(start));
} }
return { return {