feat: add sale flow with Boopos Cloud
This commit is contained in:
parent
0a14fe8882
commit
9cb4302fc9
19 changed files with 449 additions and 398 deletions
|
|
@ -3,30 +3,16 @@
|
|||
import { Box, Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material';
|
||||
import React from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { SaleTransactionObjectInterface } from '@interfaces/ResponseInterfaces/Sale/GetSaleResponseInterface';
|
||||
import CustomCard from '@molecules/CustomCard';
|
||||
import UserHeader from '@molecules/UserHeader';
|
||||
|
||||
interface Product {
|
||||
id: number;
|
||||
amount: number;
|
||||
name: string;
|
||||
unitValue: number;
|
||||
tax: number;
|
||||
discount: number;
|
||||
total: number;
|
||||
}
|
||||
|
||||
interface ProductTableProps {
|
||||
products: Product[];
|
||||
products: SaleTransactionObjectInterface | null;
|
||||
}
|
||||
|
||||
const ProductTable: React.FC<ProductTableProps> = ({ products }) => {
|
||||
const totalAmount = products.reduce((acc, product) => acc + product.amount, 0);
|
||||
const totalUnitValue = products.reduce((acc, product) => acc + product.unitValue * product.amount, 0);
|
||||
const totalTax = products.reduce((acc, product) => acc + product.tax, 0);
|
||||
const totalDiscount = products.reduce((acc, product) => acc + product.discount, 0);
|
||||
const grandTotal = products.reduce((acc, product) => acc + product.total, 0);
|
||||
const { t } = useTranslation()
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
|
||||
|
|
@ -48,38 +34,60 @@ const ProductTable: React.FC<ProductTableProps> = ({ products }) => {
|
|||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{products.map((product) => (
|
||||
<TableRow key={product.id}>
|
||||
<TableCell>{product.amount}</TableCell>
|
||||
<TableCell>{product.name}</TableCell>
|
||||
<TableCell>${product.unitValue.toFixed(2)}</TableCell>
|
||||
<TableCell>${product.tax.toFixed(2)}</TableCell>
|
||||
<TableCell>${product.discount.toFixed(2)}</TableCell>
|
||||
<TableCell>${product.total.toFixed(2)}</TableCell>
|
||||
{products?.list?.length ? (
|
||||
products.list.map((product) => (
|
||||
<TableRow key={product.idDetail}>
|
||||
<TableCell>{product.quantity}</TableCell>
|
||||
<TableCell>{product.name}</TableCell>
|
||||
<TableCell>${product.regularUnitPrice.toFixed(2)}</TableCell>
|
||||
<TableCell>${product.totalTaxes.toFixed(2)}</TableCell>
|
||||
<TableCell>${product.discount.toFixed(2)}</TableCell>
|
||||
<TableCell>${product.extendedPrice.toFixed(2)}</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
) : (
|
||||
<TableRow>
|
||||
<TableCell colSpan={6} align="center">
|
||||
{t("msj_no_products_added")} {/* Mensaje de no productos */}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</Box>
|
||||
<Box sx={{ p:0.2, boxShadow: '2', }}>
|
||||
<Box sx={{ p: 0.2, boxShadow: '2' }}>
|
||||
<CustomCard className="bg-gray-700 text-white">
|
||||
<Table>
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with', fontWeight: 'bold', width: '20%' }}>{t("tle_item_count")}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with', fontWeight: 'bold', width: '20%' }}>{t("tle_total_unit")}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with', fontWeight: 'bold', width: '20%' }}>{t("tle_total_taxes")}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with', fontWeight: 'bold', width: '20%' }}>{t("tle_total_discount")}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with', fontWeight: 'bold', width: '20%' }}>{t("tle_total")}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', fontWeight: 'bold', width: '20%' }}>
|
||||
{t("tle_total_unit")}
|
||||
</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', fontWeight: 'bold', width: '20%' }}>
|
||||
{t("tle_total_taxes")}
|
||||
</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', fontWeight: 'bold', width: '20%' }}>
|
||||
{t("tle_total_discount")}
|
||||
</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', fontWeight: 'bold', width: '20%' }}>
|
||||
{t("tle_total")}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
<TableRow>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with' }}>{totalAmount}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with' }}>${totalUnitValue.toFixed(2)}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with' }}>${totalTax.toFixed(2)}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with' }}>${totalDiscount.toFixed(2)}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)', borderColor: 'with' }}>${grandTotal.toFixed(2)}</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)' }}>
|
||||
${products?.totalSale?.toFixed(2) || '0.00'}
|
||||
</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)' }}>
|
||||
${products?.totalTaxes?.toFixed(2) || '0.00'}
|
||||
</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)' }}>
|
||||
$0.00 {/* Descuento total si aplica */}
|
||||
</TableCell>
|
||||
<TableCell sx={{ color: 'RGB(255,255,255)' }}>
|
||||
${((products?.totalWithPromotion ?? 0) + (products?.totalTaxes ?? 0)).toFixed(2)}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableBody>
|
||||
</Table>
|
||||
|
|
@ -89,4 +97,4 @@ const ProductTable: React.FC<ProductTableProps> = ({ products }) => {
|
|||
);
|
||||
};
|
||||
|
||||
export default ProductTable;
|
||||
export default ProductTable;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue