Uecko/Uecko_ERP
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

.

Browse Source
This commit is contained in:
David Arranz 2026-04-12 21:20:31 +02:00
parent f80eb9acab
commit 430ae8e5ea
4 changed files with 92 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
modules/customer-invoices/src/web/issued-invoices/list/ui/components/index.ts
View File

@ -1 +1,2 @@
export * from "./issued-invoices-grid-empty";
export * from "./verifactu-status-badge"; export * from "./verifactu-status-badge";

17
modules/customer-invoices/src/web/issued-invoices/list/ui/components/issued-invoices-grid-empty.tsx Normal file
View File

@ -0,0 +1,17 @@
import { Card, CardContent } from "@repo/shadcn-ui/components";
import { cn } from "@repo/shadcn-ui/lib/utils";
import { ChartNoAxesColumnIncreasingIcon } from "lucide-react";
export const IssuedInvoicesEmptyGrid = ({ className }: React.ComponentProps<"div">) => {
return (
<Card className={cn("w-full max-w-lg", className)}>
<CardContent>
<div className="rounded-md border border-dashed p-6 text-center">
<ChartNoAxesColumnIncreasingIcon className="text-muted-foreground mx-auto size-12" />
<p className="mt-2 text-sm font-medium">No data to show</p>
<p className="text-muted-foreground mt-1 text-sm">May take 15 minutes for data to load</p>
</div>
</CardContent>
</Card>
);
};

121
modules/customer-invoices/src/web/issued-invoices/list/ui/pages/list-issued-invoices-page.tsx
View File

@ -17,6 +17,7 @@ import { useNavigate } from "react-router-dom";
import { useTranslation } from "../../../../i18n"; import { useTranslation } from "../../../../i18n";
import { useIssuedInvoiceListPageController } from "../../controllers"; import { useIssuedInvoiceListPageController } from "../../controllers";
import { IssuedInvoicesGrid, useIssuedInvoicesGridColumns } from "../blocks"; import { IssuedInvoicesGrid, useIssuedInvoicesGridColumns } from "../blocks";
import { IssuedInvoicesEmptyGrid } from "../components";
export const ListIssuedInvoicesPage = () => { export const ListIssuedInvoicesPage = () => {
const { t } = useTranslation(); const { t } = useTranslation();
@ -88,63 +89,71 @@ export const ListIssuedInvoicesPage = () => {
</Alert> </Alert>
{/* Search and filters */} {/* Search and filters */}
<div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"> {listCtrl.data.totalItems === 0 && <IssuedInvoicesEmptyGrid className="mx-auto" />}
<SimpleSearchInput
loading={listCtrl.isLoading}
onSearchChange={listCtrl.setSearchValue}
value={listCtrl.search}
/>
<Select {listCtrl.data.totalItems !== 0 && (
onValueChange={(value) => listCtrl.setStatusFilter(value ?? "all")} <>
value={listCtrl.statusFilter} <div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
> <SimpleSearchInput
<SelectTrigger className="w-full sm:w-48"> loading={listCtrl.isLoading}
<FilterIcon aria-hidden className="mr-2 size-4" /> onSearchChange={listCtrl.setSearchValue}
<SelectValue placeholder={t("filters.status")} /> value={listCtrl.search}
</SelectTrigger> />
<SelectContent>
<SelectItem value="all">{t("catalog.issued_invoices.status.all.label")}</SelectItem> <Select
<SelectItem value="Correcto"> onValueChange={(value) => listCtrl.setStatusFilter(value ?? "all")}
{t("catalog.issued_invoices.status.correcto.label")} value={listCtrl.statusFilter}
</SelectItem> >
<SelectItem value="Pendiente"> <SelectTrigger className="w-full sm:w-48">
{t("catalog.issued_invoices.status.pendiente.label")} <FilterIcon aria-hidden className="mr-2 size-4" />
</SelectItem> <SelectValue placeholder={t("filters.status")} />
<SelectItem value="aceptado_con_error"> </SelectTrigger>
{t("catalog.issued_invoices.status.aceptado_con_error.label")} <SelectContent>
</SelectItem> <SelectItem value="all">
<SelectItem value="incorrecto"> {t("catalog.issued_invoices.status.all.label")}
{t("catalog.issued_invoices.status.incorrecto.label")} </SelectItem>
</SelectItem> <SelectItem value="Correcto">
<SelectItem value="duplicado"> {t("catalog.issued_invoices.status.correcto.label")}
{t("catalog.issued_invoices.status.duplicado.label")} </SelectItem>
</SelectItem> <SelectItem value="Pendiente">
<SelectItem value="anulado"> {t("catalog.issued_invoices.status.pendiente.label")}
{t("catalog.issued_invoices.status.anulado.label")} </SelectItem>
</SelectItem> <SelectItem value="aceptado_con_error">
<SelectItem value="factura_inexistente"> {t("catalog.issued_invoices.status.aceptado_con_error.label")}
{t("catalog.issued_invoices.status.duplicado.label")} </SelectItem>
</SelectItem> <SelectItem value="incorrecto">
<SelectItem value="rechazado"> {t("catalog.issued_invoices.status.incorrecto.label")}
{t("catalog.issued_invoices.status.rechazado.label")} </SelectItem>
</SelectItem> <SelectItem value="duplicado">
</SelectContent> {t("catalog.issued_invoices.status.duplicado.label")}
</Select> </SelectItem>
</div> <SelectItem value="anulado">
<div className="min-h-0 flex-1 overflow-auto"> {t("catalog.issued_invoices.status.anulado.label")}
<IssuedInvoicesGrid </SelectItem>
columns={columns} <SelectItem value="factura_inexistente">
data={listCtrl.data} {t("catalog.issued_invoices.status.duplicado.label")}
loading={listCtrl.isLoading} </SelectItem>
onPageChange={listCtrl.setPageIndex} <SelectItem value="rechazado">
onPageSizeChange={listCtrl.setPageSize} {t("catalog.issued_invoices.status.rechazado.label")}
// acciones rápidas del grid → page controller </SelectItem>
//onRowClick={(id) => navigate(`/issuedInvoices/${id}`)} </SelectContent>
pageIndex={listCtrl.pageIndex} </Select>
pageSize={listCtrl.pageSize} </div>
/> <div className="min-h-0 flex-1 overflow-auto">
</div> <IssuedInvoicesGrid
columns={columns}
data={listCtrl.data}
loading={listCtrl.isLoading}
onPageChange={listCtrl.setPageIndex}
onPageSizeChange={listCtrl.setPageSize}
// acciones rápidas del grid → page controller
//onRowClick={(id) => navigate(`/issuedInvoices/${id}`)}
pageIndex={listCtrl.pageIndex}
pageSize={listCtrl.pageSize}
/>
</div>
</>
)}
</AppContent> </AppContent>
</section> </section>
); );

18
modules/customers/src/web/_archived/components/customer-modal-selector/customer-empty-card.tsx
View File

@ -3,21 +3,21 @@ import { UserSearchIcon } from "lucide-react";
export const CustomerEmptyCard = (props: React.ComponentProps<"button">) => { export const CustomerEmptyCard = (props: React.ComponentProps<"button">) => {
return ( return (
<button <button
aria-label="Seleccionar cliente"
className="group w-full cursor-pointer rounded-lg border border-border bg-card p-4 transition hover:bg-accent/50 hover:border-primary"
tabIndex={0} tabIndex={0}
type='button' type="button"
className='group w-full cursor-pointer rounded-lg border border-border bg-card p-4 transition hover:bg-accent/50 hover:border-primary'
aria-label='Seleccionar cliente'
{...props} {...props}
> >
<div className='flex items-center gap-4 group-hover:text-primary'> <div className="flex items-center gap-4 group-hover:text-primary">
<div className='flex size-12 items-center justify-center rounded-full bg-muted group-hover:bg-primary/15'> <div className="flex size-12 items-center justify-center rounded-full bg-muted group-hover:bg-primary/15">
<UserSearchIcon className='size-6 text-muted-foreground group-hover:text-primary' /> <UserSearchIcon className="size-6 text-muted-foreground group-hover:text-primary" />
</div> </div>
<div className='flex-1 text-left'> <div className="flex-1 text-left">
<h3 className='font-medium text-muted-foreground mb-1 group-hover:text-primary'> <h3 className="font-medium text-muted-foreground mb-1 group-hover:text-primary">
Seleccionar Cliente Seleccionar Cliente
</h3> </h3>
<p className='text-sm text-muted-foreground/70 group-hover:text-primary'> <p className="text-sm text-muted-foreground/70 group-hover:text-primary">
Haz clic para buscar un cliente existente o crear uno nuevo Haz clic para buscar un cliente existente o crear uno nuevo
</p> </p>
</div> </div>