Fondemi/sistema_base
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

status añadido, cambios en el responsive al ver el producto

Browse Source
This commit is contained in:
Sergio Ramirez
2025-07-14 14:13:35 -04:00
parent f4e9379c34
commit ee089f4351
18 changed files with 1754 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apps/api/src/database/migrations/0006_real_tyger_tiger.sql Normal file
View File

@@ -0,0 +1,8 @@
DROP VIEW "public"."v_product_store";--> statement-breakpoint
ALTER TABLE "products" ALTER COLUMN "price" SET DEFAULT '0';--> statement-breakpoint
ALTER TABLE "products" ALTER COLUMN "stock" SET DEFAULT 0;--> statement-breakpoint
ALTER TABLE "products" ADD COLUMN "status" text DEFAULT 'BORRADOR' NOT NULL;--> statement-breakpoint
CREATE VIEW "public"."v_product_store" AS (
select p.id as product_id, p.title, p.description, p.price, p.stock, p.url_img, p.address, p.status, p.user_id, u.fullname, u.email, u.phone
from products p
left join auth.users as u on u.id = p.user_id);

1537
apps/api/src/database/migrations/meta/0006_snapshot.json Normal file
View File

File diff suppressed because it is too large Load Diff

7
apps/api/src/database/migrations/meta/_journal.json
View File

@@ -43,6 +43,13 @@
"when": 1752500607554,
"tag": "0005_little_bloodscream",
"breakpoints": true
},
{
"idx": 6,
"version": "7",
"when": 1752507413748,
"tag": "0006_real_tyger_tiger",
"breakpoints": true
}
]
}

8
apps/api/src/database/schema/inventory.ts
View File

@@ -9,10 +9,11 @@ export const products = t.pgTable(
id: t.serial('id').primaryKey(),
title: t.text('title').notNull(),
description: t.text('description').notNull(),
price: t.numeric('price').notNull(),
stock: t.integer('stock').notNull(),
price: t.numeric('price').notNull().default('0'),
stock: t.integer('stock').notNull().default(0),
address: t.text('address').notNull(),
urlImg: t.text('url_img').notNull(),
status: t.text('status').notNull().default('BORRADOR'),
userId: t.integer('user_id').references(() => users.id, { onDelete: 'cascade' }).notNull(),
...timestamps,
}
@@ -26,11 +27,12 @@ export const viewProductsStore = t.pgView('v_product_store', {
stock: t.integer('stock'),
urlImg: t.text('url_img'),
address: t.text('address'),
status: t.text('status'),
userId: t.integer('user_id'),
fullname: t.text('fullname'),
email: t.text('email'),
phone: t.text('phone')
}).as(sql`
select p.id as product_id, p.title, p.description, p.price, p.stock, p.url_img, p.address, p.user_id, u.fullname, u.email, u.phone
select p.id as product_id, p.title, p.description, p.price, p.stock, p.url_img, p.address, p.status, p.user_id, u.fullname, u.email, u.phone
from products p
left join auth.users as u on u.id = p.user_id`);

32
apps/api/src/database/seeds/inventory.seed.ts
View File

@@ -7,19 +7,31 @@ export async function seedProducts(db: NodePgDatabase<typeof schema>) {
console.log('Seeding example product...');
// Insert inventory
const array = [{title:'manzana',description:'fruta roja',price:'100',urlImg:'apple.avif',address:"Calle 1",userId:1,stock:0}];
const array = [
{
title:'manzana',
description:'Fruta pequeña y roja, extraída de los árboles de nuestra fundación, de increíble sabor',
price:'100',
stock:10,
address:"Calle 1",
status:'PUBLICADO', // PUBLICADO, AGOTADO, BORRADOR
urlImg:'apple.avif',
userId:1
}
];
for (const item of array) {
try {
await db.insert(products).values({
title: item.title,
description: item.description,
price: item.price,
stock: item.stock,
address: item.address,
urlImg: item.urlImg,
userId: item.userId
}).onConflictDoNothing();
// await db.insert(products).values({
// title: item.title,
// description: item.description,
// price: item.price,
// stock: item.stock,
// address: item.address,
// urlImg: item.urlImg,
// userId: item.userId
// }).onConflictDoNothing();
await db.insert(products).values(item).onConflictDoNothing();
} catch (error) {
console.error(`Error creating products '${item.title}':`, error);
}

11
apps/api/src/features/inventory/dto/create-product.dto.ts
View File

@@ -32,10 +32,17 @@ export class CreateProductDto {
address: string;
@ApiProperty()
@IsInt({
message: 'stock must be a number',
@IsString({
message: 'address must be a string',
})
@IsOptional()
status: string;
@ApiProperty()
@IsInt({
message: 'userID must be a number',
})
// @IsOptional()
userId: number;
@ApiProperty()

3
apps/api/src/features/inventory/dto/update-product.dto.ts
View File

@@ -20,6 +20,9 @@ export class UpdateProductDto extends PartialType(CreateProductDto) {
@IsOptional()
address: string;
@IsOptional()
status: string;
@IsOptional()
urlImg: string;
}

2
apps/api/src/features/inventory/inventory.controller.ts
View File

@@ -16,7 +16,7 @@ export class UsersController {
@ApiOperation({ summary: 'Get all products with pagination and filters' })
@ApiResponse({ status: 200, description: 'Return paginated products.' })
async findAll(@Query() paginationDto: PaginationDto) {
const result = await this.inventoryService.findAll(paginationDto);
const result = await this.inventoryService.findAll(paginationDto,true);
return {
message: 'products fetched successfully',
data: result.data,

26
apps/api/src/features/inventory/inventory.service.ts
View File

@@ -56,6 +56,7 @@ export class InventoryService {
address: products.address,
price: products.price,
stock: products.stock,
status: products.status,
urlImg: products.urlImg
})
.from(products)
@@ -78,7 +79,7 @@ export class InventoryService {
return { data, meta };
}
async findAll(paginationDto?: PaginationDto): Promise<{ data: Store[], meta: any }> {
async findAll(paginationDto?: PaginationDto, isStore: boolean = false): Promise<{ data: Store[], meta: any }> {
const { page = 1, limit = 10, search = '', sortBy = 'id', sortOrder = 'asc' } = paginationDto || {};
// Calculate offset
@@ -86,11 +87,21 @@ export class InventoryService {
// Build search condition
let searchCondition: SQL<unknown> | undefined;
if (search) {
searchCondition = or(
if (search && isStore) {
searchCondition = and(
or(
like(viewProductsStore.title, `%${search}%`),
like(viewProductsStore.description, `%${search}%`),
);
like(viewProductsStore.description, `%${search}%`)
),
or(eq(viewProductsStore.status, 'PUBLICADO'), eq(viewProductsStore.status, 'AGOTADO'))
)
} else if(search){
or(
like(viewProductsStore.title, `%${search}%`),
like(viewProductsStore.description, `%${search}%`)
)
} else if(isStore){
searchCondition = or(eq(viewProductsStore.status, 'PUBLICADO'), eq(viewProductsStore.status, 'AGOTADO'))
}
// Build sort condition
@@ -117,6 +128,7 @@ export class InventoryService {
address: viewProductsStore.address,
urlImg: viewProductsStore.urlImg,
stock: viewProductsStore.stock,
status: viewProductsStore.status,
userId: viewProductsStore.userId,
fullname: viewProductsStore.fullname,
email: viewProductsStore.email,
@@ -152,6 +164,7 @@ export class InventoryService {
address: viewProductsStore.address,
urlImg: viewProductsStore.urlImg,
stock: viewProductsStore.stock,
status: viewProductsStore.status,
userId: viewProductsStore.userId,
fullname: viewProductsStore.fullname,
email: viewProductsStore.email,
@@ -185,6 +198,7 @@ export class InventoryService {
address: createProductDto.address,
urlImg: createProductDto.urlImg,
stock: createProductDto.stock,
status: createProductDto.status,
userId: createProductDto.userId
})
.returning();
@@ -194,6 +208,7 @@ export class InventoryService {
async update(id: string, updateProductDto: UpdateProductDto): Promise<Product> {
const productId = parseInt(id);
console.log(updateProductDto);
// Check if exists
await this.findOne(id);
@@ -204,6 +219,7 @@ export class InventoryService {
if (updateProductDto.description) updateData.description = updateProductDto.description;
if (updateProductDto.price) updateData.price = updateProductDto.price;
if (updateProductDto.address) updateData.address = updateProductDto.address;
if (updateProductDto.status) updateData.status = updateProductDto.status;
if (updateProductDto.stock) updateData.stock = updateProductDto.stock;
if (updateProductDto.urlImg) updateData.urlImg = updateProductDto.urlImg;

22
apps/web/app/dashboard/productos/[id]/page.tsx
View File

@@ -40,34 +40,36 @@ export default async function SurveyResponsePage({
return (
// <PageContainer>
<main className='p-4 md:px-6 flex flex-col md:flex-row gap-4 md:relative'>
<main className='px-4 lg:px-6 flex flex-col md:flex-row gap-3 lg:gap-4 md:relative'>
<img
className="border-2 object-cover w-full h-full aspect-square rounded-2xl"
className="border-2 object-cover w-full f-full min-h-[400px] md:h-[85vh] aspect-square rounded-2xl"
src={`http://localhost:3000/${product.urlImg}`}
alt=""
/>
<Card className="flex flex-col md:w-[500px] md:max-h-[90vh] md:overflow-auto md:sticky top-0 right-0">
<CardHeader>
<Card className="flex flex-col md:w-[400px] lg:w-[500px] min-h-[400px] md:h-[85vh] md:overflow-auto md:sticky top-0 right-0">
<CardHeader className='py-2 px-2 md:px-4 lg:px-6'>
<CardTitle className="font-bold text-2xl">
{product.title.charAt(0).toUpperCase() + product.title.slice(1)}
</CardTitle>
<p className='font-semibold'>$ {product.price} </p>
{product.status === 'AGOTADO' ? (
<p className="font-semibold text-lg text-red-900">AGOTADO</p>
): ('')}
</CardHeader>
<CardContent className="flex-grow flex justify-between flex-col gap-4">
<CardContent className="py-0 px-2 md:px-4 lg:px-6 flex-col justify-between flex-grow md:overflow-auto">
<div>
<p className='font-semibold text-lg border-t border-b'> Descripción</p>
<p className='p-1'>{product.description}</p>
{/* <p className='p-1'>{lorem+lorem+lorem+lorem}</p> */}
</div>
<div>
<div className='mt-2'>
<p className='font-semibold text-lg border-t border-b'> Dirección</p>
<p>{product.address}</p>
<p className='p-1'>{product.address}</p>
</div>
</CardContent>
<CardFooter className="">
<CardFooter className="px-2 md:px-4 lg:px-6">
<div>
<p className='font-semibold text-lg border-t border-b mt-4'>Información del vendedor</p>
<p>{product.fullname}</p>

5
apps/web/constants/status.ts Normal file
View File

@@ -0,0 +1,5 @@
export const STATUS = {
PUBLICADO:"Publicado",
AGOTADO:"Agotado",
BORRADOR:"Borrador",
}

52
apps/web/feactures/inventory/components/inventory/create-product-form.tsx
View File

@@ -9,11 +9,19 @@ import {
FormLabel,
FormMessage,
} from '@repo/shadcn/form';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@repo/shadcn/select';
import { Textarea } from '@repo/shadcn/textarea';
import { Input } from '@repo/shadcn/input';
import { useForm } from 'react-hook-form';
import { useCreateUser } from "@/feactures/inventory/hooks/use-mutation";
import { EditInventory, editInventory, formDataInput } from '@/feactures/inventory/schemas/inventory';
import {STATUS} from '@/constants/status'
interface CreateFormProps {
onSuccess?: () => void;
@@ -34,9 +42,11 @@ export function CreateForm({
const defaultformValues = {
title: '',
description: '',
address: '',
price: '',
stock: '',
urlImg: ''
urlImg: '',
status: ''
}
const form = useForm<formDataInput>({
@@ -100,6 +110,20 @@ export function CreateForm({
)}
/>
<FormField
control={form.control}
name="address"
render={({ field }) => (
<FormItem className='col-span-2'>
<FormLabel>Dirección</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="description"
@@ -107,7 +131,6 @@ export function CreateForm({
<FormItem className='col-span-2'>
<FormLabel>Descripción</FormLabel>
<FormControl>
{/* <Input {...field} /> */}
<Textarea {...field} className="resize-none"/>
</FormControl>
<FormMessage />
@@ -122,13 +145,36 @@ export function CreateForm({
<FormItem>
<FormLabel>Cantidad/Stock</FormLabel>
<FormControl>
<Input {...field} />
<Input {...field} type='number' />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="status"
render={({ field }) => (
<FormItem className="w-full">
<FormLabel>Estatus</FormLabel>
<Select onValueChange={(value) => field.onChange(value)}>
<SelectTrigger className="w-full">
<SelectValue placeholder="Seleccione un estatus" />
</SelectTrigger>
<SelectContent>
{Object.entries(STATUS).map(([value, label]) => (
<SelectItem key={value} value={value}>
{label}
</SelectItem>
))}
</SelectContent>
</Select>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="urlImg"

7
apps/web/feactures/inventory/components/inventory/product-tables/columns.tsx
View File

@@ -22,6 +22,8 @@ export const columns: ColumnDef<InventoryTable>[] = [
{
accessorKey: "description",
header: "Descripcion",
cell: ({ row }) => row.original.description.length > 40 ?
`${row.original.description.slice(0, 40)}...` : row.original.description
},
{
accessorKey: 'price',
@@ -32,7 +34,10 @@ export const columns: ColumnDef<InventoryTable>[] = [
accessorKey: 'stock',
header: 'Stock',
},
{
accessorKey: 'status',
header: 'Estado',
},
{
id: 'actions',
header: 'Acciones',

53
apps/web/feactures/inventory/components/inventory/update-product-form.tsx
View File

@@ -9,11 +9,19 @@ import {
FormLabel,
FormMessage,
} from '@repo/shadcn/form';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@repo/shadcn/select';
import { Input } from '@repo/shadcn/input';
import { useForm } from 'react-hook-form';
import { useUpdateUser } from "@/feactures/inventory/hooks/use-mutation";
import { editInventory, formDataInput, EditInventory } from '@/feactures/inventory/schemas/inventory'; // Renombrado EditInventory para claridad
import { Textarea } from '@repo/shadcn/components/ui/textarea';
import {STATUS} from '@/constants/status'
interface UpdateFormProps {
onSuccess?: () => void;
@@ -37,6 +45,8 @@ export function UpdateForm({
title: defaultValues?.title || '',
description: defaultValues?.description || '',
price: defaultValues?.price || '',
address: defaultValues?.address || '',
status: defaultValues?.status || 'BORRADOR',
stock: (defaultValues?.stock ?? '').toString(),
urlImg: defaultValues?.urlImg || '',
userId: defaultValues?.userId
@@ -49,6 +59,7 @@ export function UpdateForm({
});
const onSubmit = async (data: formDataInput) => {
console.log(data);
saveAccountingAccounts(data, {
onSuccess: () => {
@@ -88,8 +99,6 @@ export function UpdateForm({
)}
/>
<FormField
control={form.control}
name="price"
@@ -105,6 +114,21 @@ export function UpdateForm({
)}
/>
<FormField
control={form.control}
name="address"
render={({ field }) => (
<FormItem className='col-span-2'>
<FormLabel>Dirección</FormLabel>
<FormControl>
{/* Simplificado. price es z.string(), field.value ya es string o undefined. */}
<Input {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="description"
@@ -112,7 +136,6 @@ export function UpdateForm({
<FormItem className='col-span-2'>
<FormLabel>Descripción</FormLabel>
<FormControl>
{/* <Input {...field} /> */}
<Textarea {...field} className="resize-none"/>
</FormControl>
<FormMessage />
@@ -127,7 +150,6 @@ export function UpdateForm({
<FormItem>
<FormLabel>Cantidad/Stock</FormLabel>
<FormControl>
{/* Añadido type="number" para UX. field.value ya es string debido a formDataInput */}
<Input {...field} type="number" />
</FormControl>
<FormMessage />
@@ -135,6 +157,29 @@ export function UpdateForm({
)}
/>
<FormField
control={form.control}
name="status"
render={({ field }) => (
<FormItem className="w-full">
<FormLabel>Estatus</FormLabel>
<Select value={field.value} onValueChange={(value) => field.onChange(value)}>
<SelectTrigger className="w-full">
<SelectValue placeholder="Seleccione un estatus" />
</SelectTrigger>
<SelectContent>
{Object.entries(STATUS).map(([value, label]) => (
<SelectItem key={value} value={value}>
{label}
</SelectItem>
))}
</SelectContent>
</Select>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="urlImg"

7
apps/web/feactures/inventory/components/products/product-list.tsx
View File

@@ -42,12 +42,15 @@ export function ProductList() {
</CardHeader>
<CardContent className="p-0 flex-grow">
<img
className="object-cover w-full h-full aspect-square"
className="object-cover w-full h-full aspect-square border"
src={`http://localhost:3000/${data.urlImg}`}
alt=""
/>
</CardContent>
<CardFooter className="flex justify-between items-center p-4">
<CardFooter className="flex-col items-start p-4">
{data.status === 'AGOTADO' ? (
<p className="font-semibold text-lg text-red-900">AGOTADO</p>
): ('')}
<p className="font-semibold text-lg">$ {data.price}</p>
</CardFooter>
</Card>

3
apps/web/feactures/inventory/schemas/inventory.ts
View File

@@ -17,6 +17,7 @@ export const product = z.object({
stock: z.number(),
price: z.string(),
urlImg: z.string(),
status: z.string(),
userId: z.number().optional()
})
@@ -33,8 +34,10 @@ export const editInventory = z.object({
stock: z.string().transform(val => Number(val)).pipe(z.number(
{ invalid_type_error: 'El stock debe ser un número' }).min(0, { message: "El stock debe ser mayor a 0" })
),
address: z.string().min(5, { message: "Debe de tener 5 o más caracteres" }),
price: z.string(),
urlImg: z.string(),
status: z.string().min(1, { message: "Debe de seleccionar un valor" }),
userId: z.number().optional(),
})

BIN
apps/web/public/apples.avif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 21 KiB

2
packages/shadcn/src/components/ui/textarea.tsx
View File

@@ -7,7 +7,7 @@ function Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {
<textarea
data-slot="textarea"
className={cn(
'border-input placeholder:text-muted-foreground ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 aria-invalid:outline-destructive/60 dark:aria-invalid:outline-destructive dark:aria-invalid:ring-destructive/40 aria-invalid:ring-destructive/20 aria-invalid:border-destructive/60 dark:aria-invalid:border-destructive dark:aria-invalid:ring-destructive/50 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:focus-visible:ring-[3px] aria-invalid:focus-visible:outline-none md:text-sm dark:aria-invalid:focus-visible:ring-4',
'border-gray-400 dark:border-input placeholder:text-muted-foreground ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 aria-invalid:outline-destructive/60 dark:aria-invalid:outline-destructive dark:aria-invalid:ring-destructive/40 aria-invalid:ring-destructive/20 aria-invalid:border-destructive/60 dark:aria-invalid:border-destructive dark:aria-invalid:ring-destructive/50 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:focus-visible:ring-[3px] aria-invalid:focus-visible:outline-none md:text-sm dark:aria-invalid:focus-visible:ring-4',
className,
)}
{...props}