fix: report master

app/Exports/PurchaseDetailsExport.php

+<?php
+
+namespace App\Exports;
+
+use Illuminate\Contracts\View\View;
+use Maatwebsite\Excel\Concerns\FromView;
+use Maatwebsite\Excel\Concerns\Exportable;
+use Maatwebsite\Excel\Concerns\WithStyles;
+use Illuminate\Contracts\Support\Responsable;
+use Maatwebsite\Excel\Concerns\ShouldAutoSize;
+use PhpOffice\PhpSpreadsheet\Worksheet\Worksheet;
+use Maatwebsite\Excel\Concerns\WithPreCalculateFormulas;
+
+class PurchaseDetailsExport implements
+    FromView,
+    Responsable,
+    WithStyles,
+    ShouldAutoSize,
+    WithPreCalculateFormulas
+{
+    use Exportable;
+
+    private $fileName = "purchase-report.xlsx";
+
+    public function __construct(private array $data)
+    {
+    }
+
+    public function view(): View
+    {
+        ["purchases" => $purchases] = $this->data;
+
+        return view("Excel.Purchases.Export", compact("purchases"));
+    }
+
+    public function styles(Worksheet $sheet)
+    {
+        $lastRow = $sheet->getHighestDataRow();
+
+        $lastContent = $lastRow - 1;
+
+        $sheet->setCellValue("E$lastRow", "=SUM(E5:E$lastContent)");
+
+        $sheet
+            ->getStyle("E")
+            ->getNumberFormat()
+            ->setFormatCode("#,###");
+
+        return [
+            1 => [
+                "font" => ["bold" => true, "size" => 12],
+                "alignment" => [
+                    "vertical" => "center",
+                    "horizontal" => "center",
+                ],
+            ],
+            2 => [
+                "font" => ["bold" => true, "size" => 12],
+                "alignment" => [
+                    "vertical" => "center",
+                    "horizontal" => "center",
+                ],
+            ],
+            4 => [
+                "font" => ["bold" => true],
+            ],
+            $lastRow => [
+                "font" => ["bold" => true, "size" => 12],
+            ],
+        ];
+    }
+}

app/Http/Controllers/PurchaseController.php

 
 namespace App\Http\Controllers;
 
+use App\Exports\PurchaseDetailsExport;
 use App\Models\Ppn;
 use Inertia\Inertia;
 use App\Models\Product;
 
     public function report()
     {
-        return inertia("Purchases/Report");
+        return inertia("Purchases/Report", [
+            "initialFilters" => request()->only("start_date", "end_date"),
+            "purchases" => PurchaseDetail::filter(
+                request()->only("start_date", "end_date")
+            )
+                ->latest()
+                ->paginate(10)
+                ->withQueryString()
+                ->through(
+                    fn($purchaseDetail) => [
+                        "createdAt" => $purchaseDetail->created_at,
+                        "totalPrice" => FunctionService::rupiahFormat(
+                            $purchaseDetail->price * $purchaseDetail->qty
+                        ),
+                        "qty" => $purchaseDetail->qty,
+                        "status" => $purchaseDetail->purchase->status,
+                    ]
+                ),
+        ]);
     }
 
     public function reportExcel()
     {
-        //
+        return new PurchaseDetailsExport([
+            "purchases" => PurchaseDetail::filter(
+                request()->only("start_date", "end_date")
+            )
+                ->latest()
+                ->get()
+                ->map(
+                    fn($purchaseDetail) => [
+                        "createdAt" => $purchaseDetail->created_at,
+                        "qty" => $purchaseDetail->qty,
+                        "status" => $purchaseDetail->purchase->status,
+                        "price" =>
+                            $purchaseDetail->price * $purchaseDetail->qty,
+                    ]
+                ),
+        ]);
     }
 }

app/Http/Controllers/SalesController.php

     public function report()
     {
         return inertia("Sales/Report", [
-            "filters" => request()->only("start_date", "end_date"),
-            "sales" => Inertia::lazy(
-                fn() => SaleDetail::filter(
-                    request()->only("start_date", "end_date")
-                )
-                    ->latest()
-                    ->paginate(3)
-                    ->withQueryString()
-                    ->through(
-                        fn($saleDetail) => [
-                            "createdAt" => $saleDetail->created_at,
-                            "totalPrice" => FunctionService::rupiahFormat(
-                                $saleDetail->price * $saleDetail->qty
-                            ),
-                            "status" => $saleDetail->sale->status,
-                        ]
-                    )
-            ),
+            "initialFilters" => request()->only("start_date", "end_date"),
+            "sales" => SaleDetail::filter(
+                request()->only("start_date", "end_date")
+            )
+                ->latest()
+                ->paginate(10)
+                ->withQueryString()
+                ->through(
+                    fn($saleDetail) => [
+                        "createdAt" => $saleDetail->created_at,
+                        "totalPrice" => FunctionService::rupiahFormat(
+                            $saleDetail->price * $saleDetail->qty
+                        ),
+                        "qty" => $saleDetail->qty,
+                        "status" => $saleDetail->sale->status,
+                    ]
+                ),
         ]);
     }
 

app/Models/PurchaseDetail.php

 
 namespace App\Models;
 
+use Carbon\Carbon;
 use App\Services\FunctionService;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Casts\Attribute;
 
     protected $fillable = ["price", "qty", "purchase_number", "product_number"];
 
+    protected function createdAt(): Attribute
+    {
+        return Attribute::make(
+            get: fn($value) => Carbon::parse($value)->translatedFormat(
+                "l d/m/y"
+            )
+        );
+    }
+
     protected function price(): Attribute
     {
         return Attribute::make(
                 });
             });
     }
+
+    public function scopeFilter($query, array $filters)
+    {
+        $query
+            ->when($filters["start_date"] ?? null, function ($query, $search) {
+                $query->whereDate("created_at", ">=", $search);
+            })
+            ->when($filters["end_date"] ?? null, function ($query, $search) {
+                $query->whereDate("created_at", "<=", $search);
+            });
+    }
 }

resources/js/components/AppDateRangeFilter.vue

 <script setup>
-import { onMounted, reactive, watch } from 'vue'
+import { watch, ref } from 'vue'
 import { Inertia } from '@inertiajs/inertia'
 import dayjs from 'dayjs'
 import { pickBy } from 'lodash'
+import { computed } from '@vue/reactivity'
 
 const props = defineProps({
   initialFilter: {
   },
 })
 
-const filters = reactive({
-  dates: null,
-  startDate: null,
-  endDate: null,
-})
-
-onMounted(() => {
+const initialFilter = computed(() => {
   if (props.initialFilter.start_date || props.initialFilter.end_date) {
     if (props.initialFilter.end_date) {
-      filters.dates = [
+      return [
         new Date(props.initialFilter.start_date),
         new Date(props.initialFilter.end_date),
       ]
     } else {
-      filters.dates = [new Date(props.initialFilter.start_date), null]
+      return [new Date(props.initialFilter.start_date), null]
     }
   }
 })
 
-watch(
-  () => filters.dates,
-  () => {
-    if (filters.dates[1]) {
-      filters.startDate = dayjs(filters.dates[0]).format('YYYY-MM-DD')
+const dates = ref(initialFilter.value)
 
-      filters.endDate = dayjs(filters.dates[1]).format('YYYY-MM-DD')
-    } else if (filters.dates[0]) {
-      filters.startDate = dayjs(filters.dates[0]).format('YYYY-MM-DD')
+watch(dates, (value) => {
+  if (value[1]) {
+    var start_date = dayjs(value[0]).format('YYYY-MM-DD')
 
-      filters.endDate = null
-    }
+    var end_date = dayjs(value[1]).format('YYYY-MM-DD')
+  } else if (value[0]) {
+    var start_date = dayjs(value[0]).format('YYYY-MM-DD')
 
-    Inertia.get(
-      props.url,
-      pickBy({
-        start_date: filters.startDate,
-        end_date: filters.endDate,
-      }),
-      {
-        preserveState: true,
-        only: [...props.refreshData],
-      }
-    )
+    var end_date = null
   }
-)
+
+  Inertia.get(
+    props.url,
+    pickBy({
+      start_date,
+      end_date,
+    }),
+    {
+      preserveState: true,
+      only: [...props.refreshData],
+    }
+  )
+})
 </script>
 
 <template>
     selection-mode="range"
     date-format="dd/mm/yy"
     :manual-input="false"
-    v-model="filters.dates"
+    v-model="dates"
   />
 </template>

resources/js/pages/Purchases/Report.vue

 <script setup>
+import { reportTable, optionStatus } from './config'
+import AppDateRangeFilter from '@/components/AppDateRangeFilter.vue'
+import AppButtonLink from '@/components/AppButtonLink.vue'
+import AppResetFilter from '@/components/AppResetFilter.vue'
+import AppDropdown from '@/components/AppDropdown.vue'
+import AppPagination from '@/components/AppPagination.vue'
 import DashboardLayout from '@/layouts/Dashboard/DashboardLayout.vue'
+
+defineProps({
+  initialFilters: Object,
+  purchases: {
+    type: Object,
+    default: {
+      data: [],
+      links: [],
+      total: 0,
+    },
+  },
+})
+
+const exportExcel = () => {
+  return route('purchases.report.excel', location.search)
+}
 </script>
 
 <template>
   <DashboardLayout title="Laporan Pembelian">
-    <h1>Laporan Pembelian</h1>
+    <DataTable
+      responsive-layout="scroll"
+      column-resize-mode="expand"
+      :value="purchases.data"
+      :rowHover="true"
+      :stripedRows="true"
+    >
+      <template #header>
+        <h1>Laporan Pembelian</h1>
+
+        <div class="grid">
+          <div class="col-12 sm:col-6 lg:col-4">
+            <AppDateRangeFilter
+              placeholder="filter waktu..."
+              :url="route('purchases.report')"
+              :refresh-data="['purchases']"
+              :initial-filter="initialFilters"
+            />
+          </div>
+
+          <div class="col-12 sm:col-6 lg:col-4">
+            <AppResetFilter :url="route('purchases.report')" />
+          </div>
+
+          <div class="col-12">
+            <AppButtonLink
+              v-if="purchases.total"
+              label="Export excel"
+              class-button="p-button-outlined md:w-16rem"
+              icon="pi pi-file-excel"
+              :inertia-link="false"
+              :href="exportExcel()"
+            />
+          </div>
+        </div>
+      </template>
+
+      <Column
+        v-for="value in reportTable"
+        :field="value.field"
+        :header="value.header"
+        :key="value.field"
+      />
+    </DataTable>
+
+    <AppPagination :links="purchases.links" />
   </DashboardLayout>
 </template>

resources/js/pages/Purchases/config.js

   { field: 'qty', header: 'Kuantitas' },
   { field: 'unit', header: 'Satuan' },
 ]
+
+export const reportTable = [
+  { field: 'createdAt', header: 'Tanggal' },
+  { field: 'totalPrice', header: 'Total Harga' },
+  { field: 'qty', header: 'Kuantitas' },
+  { field: 'status', header: 'Status' },
+]

resources/js/pages/Sales/Report.vue

 import AppResetFilter from '@/components/AppResetFilter.vue'
 
 defineProps({
-  filters: Object,
+  initialFilters: Object,
   sales: {
     type: Object,
     default: {
               placeholder="filter waktu..."
               :url="route('sales.report')"
               :refresh-data="['sales']"
-              :initial-filter="filters"
+              :initial-filter="initialFilters"
             />
           </div>
 

resources/views/Excel/Purchases/Export.blade.php

+<table>
+    <thead>
+        <tr>
+            <th colspan="5">{{ __('words.report_purchase') }}</th>
+        </tr>
+        <tr>
+            <th colspan="5" rowspan="2">{{ __('words.period', ['number' => '']) }}
+                {{ $purchases->first()['createdAt'] }}
+                -
+                {{ $purchases->last()['createdAt'] }} </th>
+        </tr>
+        <tr></tr>
+        <tr>
+            <th>#</th>
+            <th>{{ __('words.date') }}</th>
+            <th>{{ __('words.quantity') }}</th>
+            <th>{{ __('words.status') }}</th>
+            <th>{{ __('words.total_price') }}</th>
+        </tr>
+    </thead>
+    <tbody>
+        @foreach ($purchases as $index => $purchase)
+            <tr>
+                <td>{{ ++$index }}</td>
+                <td>{{ $purchase['createdAt'] }}</td>
+                <td>{{ $purchase['qty'] }}</td>
+                <td>{{ $purchase['status'] }}</td>
+                <td>{{ $purchase['price'] }}</td>
+            </tr>
+        @endforeach
+        <tr>
+            <td colspan="4">{{ __('words.total') }}</td>
+        </tr>
+    </tbody>
+</table>

routes/web.php

         "reportExcel",
     ])->name("purchases.report.excel");
 
-    Route::get("/purchases/report", [PurchaseController::class, "report"]);
+    Route::get("/purchases/report", [
+        PurchaseController::class,
+        "report",
+    ])->name("purchases.report");
 
     Route::resource("/purchases", PurchaseController::class);