Merge pull request #25 from codebar-ag/main

m/p

Author: StanBarrows

resources/js/Components/Common/Reporting/ReportingOverview.vue

@@ -16,6 +16,7 @@ import {
 import { formatCents } from '@/packages/ui/src/utils/money';
 import ReportingTabNavbar from '@/Components/Common/Reporting/ReportingTabNavbar.vue';
 import ReportingExportButton from '@/Components/Common/Reporting/ReportingExportButton.vue';
+import ReportingRoundingControls from '@/Components/Common/Reporting/ReportingRoundingControls.vue';
 import TaskMultiselectDropdown from '@/Components/Common/Task/TaskMultiselectDropdown.vue';
 import ClientMultiselectDropdown from '@/Components/Common/Client/ClientMultiselectDropdown.vue';
 import ReportingRow from '@/Components/Common/Reporting/ReportingRow.vue';
@@ -33,7 +34,7 @@ import ReportSaveButton from '@/Components/Common/Report/ReportSaveButton.vue';
 import TagDropdown from '@/packages/ui/src/Tag/TagDropdown.vue';
 import ReportingPieChart from '@/Components/Common/Reporting/ReportingPieChart.vue';
 
-import { computed, type ComputedRef, inject, onMounted, ref } from 'vue';
+import { computed, type ComputedRef, inject, onMounted, ref, watch } from 'vue';
 import { type GroupingOption, useReportingStore } from '@/utils/useReporting';
 import { storeToRefs } from 'pinia';
 import {
@@ -54,6 +55,9 @@ import type { ExportFormat } from '@/types/reporting';
 import { getRandomColorWithSeed } from '@/packages/ui/src/utils/color';
 import { useProjectsStore } from '@/utils/useProjects';
 
+// TimeEntryRoundingType is now defined in ReportingRoundingControls component
+type TimeEntryRoundingType = 'up' | 'down' | 'nearest';
+
 const { handleApiRequestNotifications } = useNotificationsStore();
 
 const startDate = useSessionStorage<string>(
@@ -71,6 +75,9 @@ const selectedTasks = ref<string[]>([]);
 const selectedClients = ref<string[]>([]);
 
 const billable = ref<'true' | 'false' | null>(null);
+const roundingEnabled = ref<boolean>(false);
+const roundingType = ref<TimeEntryRoundingType>('nearest');
+const roundingMinutes = ref<number>(15);
 
 const group = useStorage<GroupingOption>('reporting-group', 'project');
 const subGroup = useStorage<GroupingOption>('reporting-sub-group', 'task');
@@ -84,6 +91,11 @@ const { groupByOptions } = reportingStore;
 
 const organization = inject<ComputedRef<Organization>>('organization');
 
+// Watch rounding enabled state to trigger updates
+watch(roundingEnabled, () => {
+    updateReporting();
+});
+
 function getFilterAttributes(): AggregatedTimeEntriesQueryParams {
     let params: AggregatedTimeEntriesQueryParams = {
         start: getLocalizedDayJs(startDate.value).startOf('day').utc().format(),
@@ -111,6 +123,8 @@ function getFilterAttributes(): AggregatedTimeEntriesQueryParams {
             getCurrentRole() === 'employee'
                 ? getCurrentMembershipId()
                 : undefined,
+        rounding_type: roundingEnabled.value ? roundingType.value : undefined,
+        rounding_minutes: roundingEnabled.value ? roundingMinutes.value : undefined,
     };
     return params;
 }
@@ -305,7 +319,7 @@ const tableData = computed(() => {
     <div class="py-2.5 w-full border-b border-default-background-separator">
         <MainContainer class="sm:flex space-y-4 sm:space-y-0 justify-between">
             <div
-                class="flex flex-wrap items-center space-y-2 sm:space-y-0 space-x-4">
+                class="flex flex-wrap items-center space-y-2 sm:space-y-0 space-x-3">
                 <div class="text-sm font-medium">Filters</div>
                 <MemberMultiselectDropdown
                     v-model="selectedMembers"
@@ -395,6 +409,11 @@ const tableData = computed(() => {
                             :icon="BillableIcon"></ReportingFilterBadge>
                     </template>
                 </SelectDropdown>
+                <ReportingRoundingControls
+                    v-model:enabled="roundingEnabled"
+                    v-model:type="roundingType"
+                    v-model:minutes="roundingMinutes"
+                    @change="updateReporting"></ReportingRoundingControls>
             </div>
             <div>
                 <DateRangePicker
@@ -490,7 +509,7 @@ const tableData = computed(() => {
                     <div
                         v-else
                         class="chart flex flex-col items-center justify-center py-12 col-span-3">
-                        <p class="text-lg text-text-primary font-semibold">
+                        <p class="text-lg text-text-primary font-medium">
                             No time entries found
                         </p>
                         <p>Try to change the filters and time range</p>
@@ -505,4 +524,4 @@ const tableData = computed(() => {
     </MainContainer>
 </template>
 
-<style scoped></style>
+<style scoped></style>

resources/js/Components/Dashboard/ThisWeekOverview.vue

@@ -18,7 +18,7 @@ import ProjectsChartCard from '@/Components/Dashboard/ProjectsChartCard.vue';
 import { formatHumanReadableDuration } from '@/packages/ui/src/utils/time';
 import { formatCents } from '@/packages/ui/src/utils/money';
 import { getWeekStart } from '@/packages/ui/src/utils/settings';
-import { useCssVar } from '@vueuse/core';
+import { useCssVariable } from '@/utils/useCssVariable';
 import { getOrganizationCurrencyString } from '@/utils/money';
 import { useQuery } from '@tanstack/vue-query';
 import { getCurrentOrganizationId } from '@/utils/useUser';
@@ -60,7 +60,7 @@ const weekdays = computed(() => {
     }
 });
 
-const accentColor = useCssVar('--theme-color-chart', null, { observe: true });
+const accentColor = useCssVariable('--theme-color-chart');
 
 // Get the organization ID using the utility function
 const organizationId = computed(() => getCurrentOrganizationId());
@@ -176,10 +176,8 @@ const seriesData = computed(() => {
     });
 });
 
-const markLineColor = useCssVar('--color-border-secondary', null, {
-    observe: true,
-});
-const labelColor = useCssVar('--color-text-secondary', null, { observe: true });
+const markLineColor = useCssVariable('--color-border-secondary');
+const labelColor = useCssVariable('--color-text-secondary');
 const option = computed(() => {
     return {
         tooltip: {
@@ -204,7 +202,7 @@ const option = computed(() => {
                 fontSize: 16,
                 fontWeight: 600,
                 margin: 24,
-                fontFamily: 'Outfit, sans-serif',
+                fontFamily: 'Inter, sans-serif',
                 color: labelColor.value,
             },
             axisTick: {
@@ -215,6 +213,10 @@ const option = computed(() => {
         },
         yAxis: {
             type: 'value',
+            axisLabel: {
+                color: labelColor.value,
+                fontFamily: 'Inter, sans-serif',
+            },
             splitLine: {
                 lineStyle: {
                     color: markLineColor.value,
@@ -304,4 +306,4 @@ const option = computed(() => {
     height: 280px;
     background: transparent;
 }
-</style>
+</style>

routes/api.php

@@ -43,7 +43,6 @@
         // Organization routes
         Route::name('organizations.')->group(static function (): void {
             Route::get('/organizations/{organization}', [OrganizationController::class, 'show'])->name('show');
-            Route::get('/organizations/{organization}/counts', [OrganizationController::class, 'getCounts'])->name('counts');
             Route::put('/organizations/{organization}', [OrganizationController::class, 'update'])->name('update');
         });
 
@@ -89,7 +88,7 @@
             Route::get('/projects/{project}', [ProjectController::class, 'show'])->name('show');
             Route::post('/projects', [ProjectController::class, 'store'])->name('store')->middleware('check-organization-blocked');
             Route::put('/projects/{project}', [ProjectController::class, 'update'])->name('update')->middleware('check-organization-blocked');
-            Route::delete('/projects/{project}', [ProjectController::class, 'destroy'])->name('destroy'); // @otod uncommented
+            Route::delete('/projects/{project}', [ProjectController::class, 'destroy'])->name('destroy');
         });
 
         // Project member routes
@@ -153,7 +152,7 @@
             Route::get('/clients', [ClientController::class, 'index'])->name('index');
             Route::post('/clients', [ClientController::class, 'store'])->name('store')->middleware('check-organization-blocked');
             Route::put('/clients/{client}', [ClientController::class, 'update'])->name('update')->middleware('check-organization-blocked');
-            Route::delete('/clients/{client}', [ClientController::class, 'destroy'])->name('destroy'); // @otod uncommented
+            Route::delete('/clients/{client}', [ClientController::class, 'destroy'])->name('destroy');
         });
 
         // Task routes