93 lines
3.5 KiB
Vue
93 lines
3.5 KiB
Vue
<script
|
|
setup
|
|
lang="ts"
|
|
>
|
|
import { default_timesheet_approval_cvs_report_filters, type TimesheetApprovalCSVReportFilters } from 'src/modules/timesheet-approval/models/timesheet-approval-csv-report.models';
|
|
import { ref, computed } from 'vue';
|
|
|
|
const report_filter_options = ref<TimesheetApprovalCSVReportFilters>(default_timesheet_approval_cvs_report_filters);
|
|
|
|
const company_options = [
|
|
{ label: 'Targo', value: report_filter_options.value.companies.targo },
|
|
{ label: 'Solucom', value: report_filter_options.value.companies.solucom },
|
|
];
|
|
|
|
const type_options = [
|
|
{ label: 'timesheet_approvals.print_report.shifts', value: report_filter_options.value.types.shifts },
|
|
{ label: 'timesheet_approvals.print_report.expenses', value: report_filter_options.value.types.expenses },
|
|
{ label: 'shared.shift_type.holiday', value: report_filter_options.value.types.holiday },
|
|
{ label: 'shared.shift_type.vacation', value: report_filter_options.value.types.vacation },
|
|
];
|
|
|
|
const is_download_button_disabled = computed(() => {
|
|
return company_options.map(option => option.value).filter(value => value === true).length > 0 ||
|
|
type_options.map(option => option.value).filter(value => value === true).length > 0;
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<q-btn-group
|
|
rounded
|
|
push
|
|
>
|
|
<q-btn
|
|
rounded
|
|
push
|
|
color="primary"
|
|
icon="print"
|
|
:disable="is_download_button_disabled"
|
|
/>
|
|
|
|
<q-btn-dropdown
|
|
rounded
|
|
push
|
|
color="white"
|
|
text-color="primary"
|
|
icon="checklist"
|
|
>
|
|
<q-list class="row">
|
|
<q-item class="col">
|
|
<q-item-label class="text-weight-bolder text-primary q-ma-none q-pa-none text-uppercase">
|
|
{{ $t('timesheet_approvals.print_report.company') }}
|
|
</q-item-label>
|
|
|
|
<q-item-section
|
|
row
|
|
no-wrap
|
|
>
|
|
<q-checkbox
|
|
v-for="option, index in company_options"
|
|
:key="index"
|
|
v-model="option.value"
|
|
:val="option.label"
|
|
:label="option.label"
|
|
/>
|
|
</q-item-section>
|
|
</q-item>
|
|
|
|
<q-separator
|
|
spaced
|
|
vertical
|
|
color="primary"
|
|
/>
|
|
|
|
<q-item class="col">
|
|
<q-item-section
|
|
row
|
|
no-wrap
|
|
>
|
|
<p class="text-weight-bolder text-primary q-ma-none q-pa-none text-uppercase">
|
|
{{ $t('timesheet_approvals.print_report.type') }}</p>
|
|
<q-checkbox
|
|
v-for="option, index in type_options"
|
|
:key="index"
|
|
v-model="option.value"
|
|
:val="option.label"
|
|
:label="option.label"
|
|
/>
|
|
</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</q-btn-dropdown>
|
|
</q-btn-group>
|
|
</template> |