Nicolas Drolet
ac6744ff18
removed modal for shift creation/update to better match current timesheet app and avoid adding superfluous user actions. Tweaked appearance of timesheet and overall theme to remove overcrowding of colors/elements
56 lines
1.9 KiB
Vue
56 lines
1.9 KiB
Vue
<script
|
|
setup
|
|
lang="ts"
|
|
>
|
|
import { useShiftStore } from 'src/stores/shift-store';
|
|
import { computed } from 'vue';
|
|
|
|
const shift_store = useShiftStore();
|
|
|
|
const is_showing_errors = computed(() => shift_store.shift_errors.length > 0);
|
|
</script>
|
|
|
|
<template>
|
|
<q-slide-transition>
|
|
<div
|
|
clickable
|
|
v-if="is_showing_errors"
|
|
class="full-width q-px-md q-mb-sm"
|
|
@click="shift_store.shift_errors = []"
|
|
>
|
|
<q-list>
|
|
<q-item
|
|
clickable
|
|
dense
|
|
v-for="error, index in shift_store.shift_errors"
|
|
:key="index"
|
|
class="row items-center full-width bg-dark shadow-2 rounded-5 q-my-xs"
|
|
style="border: 2px solid var(--q-negative)"
|
|
>
|
|
<q-item-section class="col-auto">
|
|
<q-badge
|
|
outline
|
|
color="negative"
|
|
class="bg-dark text-weight-bolder"
|
|
>{{ error.conflicts.date }}</q-badge>
|
|
</q-item-section>
|
|
|
|
<q-item-section class="col-auto">
|
|
<q-badge
|
|
outline
|
|
color="negative"
|
|
class="bg-dark text-weight-bolder"
|
|
>
|
|
{{ error.conflicts.start_time }} - {{ error.conflicts.end_time }}
|
|
</q-badge>
|
|
</q-item-section>
|
|
|
|
<q-item-label class="text-weight-medium text-caption q-ml-md">
|
|
{{ $t('timesheet.shift.errors.' + error.error_code) }}
|
|
</q-item-label>
|
|
</q-item>
|
|
</q-list>
|
|
|
|
</div>
|
|
</q-slide-transition>
|
|
</template> |