feat: Implement full CRUD functionality for bridal gown (veil) management with image uploads and a dedicated UI.

Author: beginwebdev2002

backend/package-lock.json

@@ -28,6 +28,7 @@
     "@nestjs/mongoose": "^11.0.4",
     "@nestjs/passport": "^11.0.5",
     "@nestjs/platform-express": "^11.0.1",
+    "@nestjs/serve-static": "^5.0.4",
     "bcrypt": "^6.0.0",
     "class-transformer": "^0.5.1",
     "class-validator": "^0.14.3",
@@ -46,6 +47,7 @@
     "@types/bcrypt": "^6.0.0",
     "@types/express": "^5.0.0",
     "@types/jest": "^30.0.0",
+    "@types/multer": "^2.0.0",
     "@types/node": "^22.10.7",
     "@types/passport-jwt": "^4.0.1",
     "@types/supertest": "^6.0.2",

backend/package.json

@@ -1,4 +1,6 @@
 import { Module } from '@nestjs/common';
+import { ServeStaticModule } from '@nestjs/serve-static';
+import { join } from 'path';
 import { AppController } from './app.controller';
 import { AppService } from './app.service';
 import { AppConfigModule } from './common/config/app-config.module';
@@ -22,6 +24,10 @@ import { PaymentModule } from './payment/payment.module';
     GalleryModule,
     AuthModule,
     PaymentModule,
+    ServeStaticModule.forRoot({
+      rootPath: join(__dirname, '..', 'uploads'),
+      serveRoot: '/uploads',
+    }),
   ],
   controllers: [AppController],
   providers: [AppService],

backend/src/app.module.ts

@@ -6,6 +6,7 @@ import {
   IsOptional,
   IsBoolean,
 } from 'class-validator';
+import { Type } from 'class-transformer';
 
 export class CreateVeilDto {
   @IsString()
@@ -18,10 +19,12 @@ export class CreateVeilDto {
 
   @IsNumber()
   @IsNotEmpty()
+  @Type(() => Number)
   price: number;
 
   @IsNumber()
   @IsNotEmpty()
+  @Type(() => Number)
   rentalPrice: number;
 
   @IsArray()
@@ -59,5 +62,6 @@ export class CreateVeilDto {
 
   @IsNumber()
   @IsOptional()
+  @Type(() => Number)
   stock?: number;
 }

backend/src/veil/presentation/dto/create-veil.dto.ts

@@ -6,7 +6,12 @@ import {
   Put,
   Param,
   Delete,
+  UseInterceptors,
+  UploadedFiles,
 } from '@nestjs/common';
+import { FilesInterceptor } from '@nestjs/platform-express';
+import { diskStorage } from 'multer';
+import { extname } from 'path';
 import { VeilService } from '../application/veil.service';
 import { Veil } from '../domain/veil.entity';
 import { CreateVeilDto } from './dto/create-veil.dto';
@@ -32,19 +37,85 @@ export class VeilController {
   }
 
   @Post()
-  async create(@Body() createVeilDto: CreateVeilDto): Promise<Veil> {
-    const veil = createVeilDto as unknown as Omit<Veil, 'id' | 'createdAt'>;
+  @UseInterceptors(
+    FilesInterceptor('files', 10, {
+      storage: diskStorage({
+        destination: './uploads/veils',
+        filename: (req, file, callback) => {
+          const uniqueSuffix =
+            Date.now() + '-' + Math.round(Math.random() * 1e9);
+          const ext = extname(file.originalname);
+          callback(null, `${file.fieldname}-${uniqueSuffix}${ext}`);
+        },
+      }),
+    }),
+  )
+  async create(
+    @Body() createVeilDto: CreateVeilDto,
+    @UploadedFiles() files: Array<Express.Multer.File>,
+  ): Promise<Veil> {
+    const imagePaths = files
+      ? files.map((file) => `/uploads/veils/${file.filename}`)
+      : [];
+    const veilData = {
+      ...createVeilDto,
+      images: [
+        ...(createVeilDto.images || []),
+        ...imagePaths,
+      ],
+    };
+      
+    // The service expects Omit<Veil, 'id' | 'createdAt'>
+    // We cast to unknown first because DTO might have optional fields that are required in Entity or vice versa, 
+    // but effectively it matches.
+    const veil = veilData as unknown as Omit<Veil, 'id' | 'createdAt'>;
     return this.veilService.create(veil);
   }
 
   @Put(':id')
+  @UseInterceptors(
+    FilesInterceptor('files', 10, {
+      storage: diskStorage({
+        destination: './uploads/veils',
+        filename: (req, file, callback) => {
+          const uniqueSuffix =
+            Date.now() + '-' + Math.round(Math.random() * 1e9);
+          const ext = extname(file.originalname);
+          callback(null, `${file.fieldname}-${uniqueSuffix}${ext}`);
+        },
+      }),
+    }),
+  )
   async update(
     @Param('id') id: string,
     @Body() updateVeilDto: UpdateVeilDto,
+    @UploadedFiles() files: Array<Express.Multer.File>,
   ): Promise<Veil> {
+    const imagePaths = files
+      ? files.map((file) => `/uploads/veils/${file.filename}`)
+      : [];
+    
+    // Handle existing images. 
+    // If updateVeilDto.images is a string (single file from FormData), make it array.
+    // If it's already array, keep it.
+    // If undefined, start with empty array.
+    let existingImages: string[] = [];
+    if (updateVeilDto.images) {
+      if (Array.isArray(updateVeilDto.images)) {
+        existingImages = updateVeilDto.images;
+      } else {
+        existingImages = [updateVeilDto.images];
+      }
+    }
+
+    const veilData = {
+      ...updateVeilDto,
+      images: [...existingImages, ...imagePaths],
+    };
+
     return this.veilService.update(
       id,
-      updateVeilDto as unknown as Partial<Veil>,
+      veilData as unknown as Partial<Veil>,
     );
   }
 

backend/src/veil/presentation/veil.controller.ts

@@ -9,6 +9,7 @@
     "preview": "ng serve --configuration=production"
   },
   "dependencies": {
+    "@angular/animations": "^21.1.3",
     "@angular/build": "^21.0.0",
     "@angular/cli": "^21.0.0",
     "@angular/common": "^21.0.0",

backend/uploads/veils/files-1770831599173-141653546.jpg

@@ -25,5 +25,6 @@ <h1 class="font-serif text-4xl text-white" i18n="@@appBrandName">Mavluda Beauty<
     </div>
   </div>
 } @else {
+  <app-global-error></app-global-error>
   <router-outlet></router-outlet>
 }