humam/garage-erp
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add template checkpoint edit dialog and vendor management components

Browse Source 
- Implemented TemplateCheckpointEditDialog for creating and editing inspection checkpoints.
- Added VendorActions component for managing vendor actions including edit, activate/deactivate, and delete.
- Created VendorContext for managing vendor state across components.
- Developed VendorGeneralInfo component to display detailed vendor information.
- Introduced AedSymbol and Money components for consistent currency representation.
- Added PromptDialog for user input prompts throughout the application.
- Implemented RelationLink component for unified related-data display in CRUD tables.
- Created InspectionTemplatesClient for API interactions related to inspection templates.
This commit is contained in:
humam
2026-05-18 12:08:42 +04:00
parent 54d11f01b4
commit 4bfd8c84a9
111 changed files with 5002 additions and 1047 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/dashboard/app/(authenticated)/purchase/bill/page.tsx
+26 -4
View File
@@ -6,9 +6,13 @@ import { Badge } from "@/shared/components/ui/badge"
import { ResourcePage } from "@/shared/data-view/resource-page"
import { ColumnHeader } from "@/shared/data-view/table-view"
import { BillForm } from "@/modules/bills/bill-form"
import { BILL_ROUTES } from "@garage/api"
import { BILL_ROUTES, BillStatus } from "@garage/api"
import type { BillsClient } from "@garage/api"
import { formatDate } from "@/shared/utils/formatters"
import { getFullName } from "@/shared/utils/getFullName"
import { Money } from "@/shared/components/money"
import { RelationLink } from "@/shared/components/relation-link"
import { Building2 } from "lucide-react"
export default function BillsPage() {
const router = useRouter()
@@ -17,6 +21,9 @@ export default function BillsPage() {
<ResourcePage<BillsClient>
pageTitle="Bills"
routeKey={BILL_ROUTES.INDEX}
searchable
searchPlaceholder="Search bills..."
statusFilter={{ statuses: BillStatus }}
getClient={(api) => api.bills}
onRowClick={(row) => router.push(`/purchase/bill/${(row as any).id}`)}
headerProps={({ selectedItem, invalidateQuery }) => ({
@@ -41,12 +48,18 @@ export default function BillsPage() {
{
accessorKey: "total",
header: ({ column }) => <ColumnHeader column={column} title="Total" />,
cell: ({ row }) => (row.original as any).total || "—",
cell: ({ row }) => {
const v = (row.original as any).total
return v != null && v !== "" ? <Money value={v} /> : "—"
},
},
{
accessorKey: "balance_due",
header: ({ column }) => <ColumnHeader column={column} title="Balance Due" />,
cell: ({ row }) => (row.original as any).balance_due || "—",
cell: ({ row }) => {
const v = (row.original as any).balance_due
return v != null && v !== "" ? <Money value={v} /> : "—"
},
},
{
accessorKey: "title",
@@ -55,7 +68,16 @@ export default function BillsPage() {
{
accessorKey: "vendor",
header: ({ column }) => <ColumnHeader column={column} title="Vendor" />,
cell: ({ row }) => (row.original as any).vendor?.name || "—",
cell: ({ row }) => {
const vendor = (row.original as any).vendor
return (
<RelationLink
href={vendor?.id ? `/purchase/vendor/${vendor.id}` : null}
icon={Building2}
label={vendor?.company_name || getFullName(vendor)}
/>
)
},
},
{
accessorKey: "bill_date",
apps/dashboard/app/(authenticated)/purchase/expense/page.tsx
+18 -5
View File
@@ -5,10 +5,14 @@ import { ColumnHeader } from "@/shared/data-view/table-view"
import FormDialog from "@/shared/components/form-dialog"
import { ExpenseForm } from "@/modules/expenses/expense-form"
import { Badge } from "@/shared/components/ui/badge"
import { EXPENSE_ROUTES } from "@garage/api"
import { EXPENSE_ROUTES, ExpenseStatus } from "@garage/api"
import type { ExpensesClient } from "@garage/api"
import { useRouter } from "next/navigation"
import { formatCurrency, formatDate, formatEnum } from "@/shared/utils/formatters"
import { formatDate, formatEnum } from "@/shared/utils/formatters"
import { Money } from "@/shared/components/money"
import { RelationLink } from "@/shared/components/relation-link"
import { Building2 } from "lucide-react"
import { getFullName } from "@/shared/utils/getFullName"
export default function ExpensesPage() {
const router = useRouter()
@@ -16,6 +20,9 @@ export default function ExpensesPage() {
<ResourcePage<ExpensesClient>
pageTitle="Expenses"
routeKey={EXPENSE_ROUTES.INDEX}
searchable
searchPlaceholder="Search expenses..."
statusFilter={{ statuses: ExpenseStatus }}
getClient={(api) => api.expenses}
onRowClick={(row)=>router.push(`/purchase/expense/${row.id}`)}
headerProps={({ selectedItem, invalidateQuery }) => ({
@@ -49,7 +56,13 @@ export default function ExpensesPage() {
header: () => "Vendor",
cell: ({ row }) => {
const vendor = (row.original as any).vendor
return vendor?.company_name || vendor?.name || "—"
return (
<RelationLink
href={vendor?.id ? `/purchase/vendor/${vendor.id}` : null}
icon={Building2}
label={vendor?.company_name || getFullName(vendor) || vendor?.name}
/>
)
},
},
{
@@ -60,12 +73,12 @@ export default function ExpensesPage() {
{
accessorKey: "total",
header: () => "Total",
cell: ({ row }) => formatCurrency((row.original as any).total ?? 0),
cell: ({ row }) => <Money value={(row.original as any).total ?? 0} />,
},
{
accessorKey: "balance_due",
header: () => "Balance Due",
cell: ({ row }) => formatCurrency((row.original as any).balance_due ?? 0),
cell: ({ row }) => <Money value={(row.original as any).balance_due ?? 0} />,
},
{
accessorKey: "status",
apps/dashboard/app/(authenticated)/purchase/payments-made/page.tsx
+41 -8
View File
@@ -32,8 +32,11 @@ import {
} from "@/shared/components/ui/dialog"
import { confirm } from "@/shared/components/confirm-dialog"
import { useAuthApi } from "@/shared/useApi"
import { getFullName } from "@/shared/utils/getFullName"
import { PAYMENT_MADE_ROUTES } from "@garage/api"
import type { PaymentMadesClient } from "@garage/api"
import { RelationLink } from "@/shared/components/relation-link"
import { Building2 } from "lucide-react"
// ── Attachment helpers ──
@@ -208,10 +211,13 @@ function AttachmentsDialog({
type PaymentMadeItem = {
id: number
payment_number?: string
vendor?: { id?: number | string; company_name?: string | null; first_name?: string | null; last_name?: string | null; name?: string | null } | null
vendor_name?: string
employee?: { id?: number | string; first_name?: string | null; last_name?: string | null; name?: string | null } | null
employee_name?: string
payment_for?: string
payment_made?: string | number
payment_mode?: { name?: string | null; title?: string | null } | null
payment_mode_name?: string
payment_date?: string
paid_through?: string
@@ -230,14 +236,20 @@ export default function PaymentsMadePage() {
<ResourcePage<PaymentMadesClient>
pageTitle="Payments Made"
routeKey={PAYMENT_MADE_ROUTES.INDEX}
searchable
searchPlaceholder="Search payments..."
getClient={(api) => api.paymentMades}
headerProps={({ invalidateQuery }) => ({
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
<FormDialog title="Record Payment">
{(resourceId) => (
{(resourceId, { close }) => (
<PaymentMadeForm
resourceId={resourceId}
onSuccess={invalidateQuery}
initialData={selectedItem}
onSuccess={() => {
invalidateQuery()
close()
}}
/>
)}
</FormDialog>
@@ -262,11 +274,27 @@ export default function PaymentsMadePage() {
header: ({ column }) => <ColumnHeader column={column} title="Vendor" />,
cell: ({ row }) => {
const item = row.original as unknown as PaymentMadeItem
const isVendor =
item.vendor?.company_name ||
getFullName(item.vendor) ||
item.vendor?.name ||
item.vendor_name
const label =
isVendor ||
getFullName(item.employee) ||
item.employee?.name ||
item.employee_name
const href = isVendor && item.vendor?.id
? `/purchase/vendor/${item.vendor.id}`
: item.employee?.id
? `/productivity/employees/${item.employee.id}`
: null
return (
<div className="flex items-center gap-2">
<UserIcon className="h-4 w-4 text-muted-foreground" />
<span>{item.vendor_name || "—"}</span>
</div>
<RelationLink
href={href}
icon={isVendor ? Building2 : UserIcon}
label={label}
/>
)
},
},
@@ -309,10 +337,15 @@ export default function PaymentsMadePage() {
header: ({ column }) => <ColumnHeader column={column} title="Payment Mode" />,
cell: ({ row }) => {
const item = row.original as unknown as PaymentMadeItem
const label =
item.payment_mode?.name ||
item.payment_mode?.title ||
item.payment_mode_name ||
"—"
return (
<div className="flex items-center gap-2">
<CreditCardIcon className="h-4 w-4 text-muted-foreground" />
<span className="capitalize">{item.payment_mode_name || "—"}</span>
<span className="capitalize">{label}</span>
</div>
)
},
apps/dashboard/app/(authenticated)/purchase/purchase-order/page.tsx
+15 -1
View File
@@ -7,6 +7,9 @@ import FormDialog from "@/shared/components/form-dialog"
import { PurchaseOrderForm } from "@/modules/purchase-orders/purchase-order-form"
import { PURCHASE_ORDER_ROUTES } from "@garage/api"
import type { PurchaseOrdersClient } from "@garage/api"
import { RelationLink } from "@/shared/components/relation-link"
import { Building2 } from "lucide-react"
import { getFullName } from "@/shared/utils/getFullName"
export default function PurchaseOrdersPage() {
const router = useRouter()
@@ -15,6 +18,8 @@ export default function PurchaseOrdersPage() {
<ResourcePage<PurchaseOrdersClient>
pageTitle="Purchase Orders"
routeKey={PURCHASE_ORDER_ROUTES.INDEX}
searchable
searchPlaceholder="Search purchase orders..."
getClient={(api) => api.purchaseOrders}
onRowClick={(row) => router.push(`/purchase/purchase-order/${(row as any).id}`)}
headerProps={({ selectedItem, invalidateQuery }) => ({
@@ -43,7 +48,16 @@ export default function PurchaseOrdersPage() {
{
accessorKey: "vendor_name",
header: ({ column }) => <ColumnHeader column={column} title="Vendor" />,
cell: ({ row }) => (row.original as any).vendor_name || "—",
cell: ({ row }) => {
const item = row.original as any
return (
<RelationLink
href={item.vendor?.id ? `/purchase/vendor/${item.vendor.id}` : null}
icon={Building2}
label={item.vendor?.company_name || getFullName(item.vendor) || item.vendor_name}
/>
)
},
},
{
accessorKey: "order_date",
apps/dashboard/app/(authenticated)/purchase/vendor-credit/page.tsx
+27 -3
View File
@@ -5,14 +5,20 @@ import { Badge } from "@/shared/components/ui/badge"
import { ResourcePage } from "@/shared/data-view/resource-page"
import { ColumnHeader } from "@/shared/data-view/table-view"
import { VendorCreditForm } from "@/modules/vendor-credits/vendor-credit-form"
import { VENDOR_CREDIT_ROUTES } from "@garage/api"
import { VENDOR_CREDIT_ROUTES, VendorCreditStatus } from "@garage/api"
import type { VendorCreditsClient } from "@garage/api"
import { RelationLink } from "@/shared/components/relation-link"
import { Building2, FileTextIcon } from "lucide-react"
import { getFullName } from "@/shared/utils/getFullName"
export default function VendorCreditsPage() {
return (
<ResourcePage<VendorCreditsClient>
pageTitle="Vendor Credits"
routeKey={VENDOR_CREDIT_ROUTES.INDEX}
searchable
searchPlaceholder="Search vendor credits..."
statusFilter={{ statuses: VendorCreditStatus }}
getClient={(api) => api.vendorCredits}
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
@@ -35,12 +41,30 @@ export default function VendorCreditsPage() {
{
accessorKey: "vendor_name",
header: ({ column }) => <ColumnHeader column={column} title="Vendor" />,
cell: ({ row }) => (row.original as any).vendor_name || "—",
cell: ({ row }) => {
const item = row.original as any
return (
<RelationLink
href={item.vendor?.id ? `/purchase/vendor/${item.vendor.id}` : null}
icon={Building2}
label={item.vendor?.company_name || getFullName(item.vendor) || item.vendor_name}
/>
)
},
},
{
accessorKey: "bill_number",
header: ({ column }) => <ColumnHeader column={column} title="Bill #" />,
cell: ({ row }) => (row.original as any).bill_number || "—",
cell: ({ row }) => {
const item = row.original as any
return (
<RelationLink
href={item.bill?.id ? `/purchase/bill/${item.bill.id}` : null}
icon={FileTextIcon}
label={item.bill?.bill_number || item.bill_number}
/>
)
},
},
{
accessorKey: "vendor_credit_date",
apps/dashboard/app/(authenticated)/purchase/vendor/[id]/layout.tsx
Vendored
+37
View File
@@ -0,0 +1,37 @@
import { DashboardDetailsPage } from "@/base/components/layout/dashboard"
import { getServerApi } from "@garage/api/server"
import { VendorActions } from "@/modules/vendors/vendor-actions"
import { VendorProvider } from "@/modules/vendors/vendor-context"
import React from "react"
export default async function layout(props: {
params: Promise<{ id: string }>
children: React.ReactNode
}) {
const { id } = await props.params
const api = await getServerApi()
const response = (await api.vendors.getById(id)) as { data?: Record<string, any> }
const vendor = response?.data
const company = vendor?.company_name as string | undefined
const fullName = [vendor?.first_name, vendor?.last_name].filter(Boolean).join(" ").trim()
const title = company || fullName || "Vendor Details"
const isActive = vendor?.is_active ?? vendor?.status === "active"
return (
<VendorProvider vendor={{ id, label: title }}>
<DashboardDetailsPage
className="p-0 lg:p-0"
title={title}
description={vendor?.email ?? vendor?.phone ?? undefined}
backHref="/purchase/vendor"
actions={<VendorActions vendorId={id} isActive={Boolean(isActive)} />}
tabs={[
{ href: `/purchase/vendor/${id}`, label: "Details" },
]}
>
{props.children}
</DashboardDetailsPage>
</VendorProvider>
)
}
apps/dashboard/app/(authenticated)/purchase/vendor/[id]/page.tsx
Vendored
+17
View File
@@ -0,0 +1,17 @@
import { getServerApi } from "@garage/api/server"
import { VendorGeneralInfo } from "@/modules/vendors/vendor-general-info"
export default async function VendorDetailPage(props: { params: Promise<{ id: string }> }) {
const { id } = await props.params
const api = await getServerApi()
// The OpenAPI schema doesn't yet describe GET /api/vendors/{id} (only PUT/DELETE),
// so cast through `any` here until the schema is regenerated.
const response = (await api.vendors.getById(id)) as { data?: Record<string, any> }
const vendor = response?.data
if (!vendor) {
return <div className="text-muted-foreground p-6">Vendor not found.</div>
}
return <VendorGeneralInfo vendor={vendor} />
}
apps/dashboard/app/(authenticated)/purchase/vendor/page.tsx
Vendored
+42 -1
View File
@@ -1,18 +1,28 @@
"use client"
import { useRouter } from "next/navigation"
import { toast } from "sonner"
import { Power } from "lucide-react"
import { ResourcePage } from "@/shared/data-view/resource-page"
import { ColumnHeader } from "@/shared/data-view/table-view"
import FormDialog from "@/shared/components/form-dialog"
import { Badge } from "@/shared/components/ui/badge"
import { VendorForm } from "@/modules/vendors/vendor-form"
import { useAuthApi } from "@/shared/useApi"
import { VENDOR_ROUTES } from "@garage/api"
import type { VendorsClient } from "@garage/api"
export default function VendorsPage() {
const router = useRouter()
const api = useAuthApi()
return (
<ResourcePage<VendorsClient>
pageTitle="Vendors"
routeKey={VENDOR_ROUTES.INDEX}
searchable
searchPlaceholder="Search vendors..."
getClient={(api) => api.vendors}
onRowClick={(row) => router.push(`/purchase/vendor/${(row as any).id}`)}
headerProps={({ selectedItem, invalidateQuery }) => ({
actions: (
<FormDialog title="Vendor">
@@ -46,6 +56,18 @@ export default function VendorsPage() {
header: ({ column }) => <ColumnHeader column={column} title="Email" />,
cell: ({ row }) => (row.original as any).email || "—",
},
{
accessorKey: "is_active",
header: ({ column }) => <ColumnHeader column={column} title="Status" />,
cell: ({ row }) => {
const isActive = Boolean((row.original as any).is_active)
return (
<Badge variant={isActive ? "default" : "outline"}>
{isActive ? "Active" : "Inactive"}
</Badge>
)
},
},
{
accessorKey: "created_at",
header: ({ column }) => <ColumnHeader column={column} title="Created" />,
@@ -54,7 +76,26 @@ export default function VendorsPage() {
return val ? new Date(val).toLocaleDateString() : "—"
},
},
actionsColumn(),
actionsColumn({
extraItems: (row) => {
const isActive = Boolean((row as any).is_active)
return [
{
label: isActive ? "Deactivate" : "Activate",
icon: Power,
onClick: async () => {
try {
await api.vendors.toggleStatus({ id: Number((row as any).id) } as any)
toast.success(isActive ? "Vendor deactivated." : "Vendor activated.")
router.refresh()
} catch {
toast.error("Failed to update vendor status.")
}
},
},
]
},
}),
]}
/>
)