Nicolas Drolet
33061ef2ab
Change timesheet UI to better fit current app model and avoid adding extra clicks and interactions to add new shifts and expenses. Also refactoring calls to backend to be more efficient and use recently-finalized OIDC implementation and integration.
61 lines
1.4 KiB
Vue
61 lines
1.4 KiB
Vue
<script
|
|
setup
|
|
lang="ts"
|
|
>
|
|
import { ref } from 'vue';
|
|
|
|
const { commentString } = defineProps<{
|
|
commentString: string;
|
|
}>();
|
|
|
|
const emit = defineEmits<{
|
|
clickClose: [];
|
|
clickSave: [comment: string];
|
|
}>();
|
|
|
|
const text = ref(commentString);
|
|
|
|
const close = () => {
|
|
emit('clickClose');
|
|
text.value = '';
|
|
}
|
|
|
|
const save = () => {
|
|
emit('clickSave', text.value);
|
|
close();
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<q-card class="full-width">
|
|
<div class="row items-center justify-between q-pa-md">
|
|
{{ $t('timesheet.fields.header_comment') }}
|
|
</div>
|
|
<q-separator />
|
|
<div class="q-pa-md">
|
|
<q-input
|
|
v-model="text"
|
|
type="textarea"
|
|
autogrow
|
|
filled
|
|
:label="$t('timesheet.fields.textarea_comment')"
|
|
:counter=true
|
|
maxlength="512"
|
|
color="primary"
|
|
/>
|
|
</div>
|
|
<div class="row justify-end q-gutter-sm q-pa-sm">
|
|
<q-btn
|
|
color="secondary"
|
|
text-color="grey-8"
|
|
:label="$t('timesheet.cancel_button')"
|
|
@click="close"
|
|
/>
|
|
<q-btn
|
|
:label="$t('timesheet.save_button')"
|
|
color="primary"
|
|
@click="save"
|
|
/>
|
|
</div>
|
|
</q-card>
|
|
</template> |