feat: Add major features - Mejoras 5-10

- Mejora 5: Órdenes de Compra integration in obra detail
- Mejora 6: Portal de Cliente with JWT auth for clients
- Mejora 7: Diagrama de Gantt for project visualization
- Mejora 8: Push Notifications with service worker
- Mejora 9: Activity Log system with templates
- Mejora 10: PWA support with offline capabilities

New features include:
- Fotos gallery with upload/delete
- Bitácora de obra with daily logs
- PDF export for reports, gastos, presupuestos
- Control de asistencia for employees
- Client portal with granular permissions
- Gantt chart with task visualization
- Push notification system
- Activity timeline component
- PWA manifest, icons, and install prompt

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

scripts/generate-icons-simple.js

@@ -0,0 +1,89 @@
+const fs = require('fs');
+const path = require('path');
+
+// Icon sizes for PWA
+const sizes = [72, 96, 128, 144, 152, 192, 384, 512];
+
+// Simple 1x1 blue PNG as base64 (we'll use this as a placeholder)
+// Users should replace these with actual icons generated from the SVG
+const createPlaceholderPNG = (size) => {
+  // PNG header for a simple blue image
+  // This creates a valid minimal PNG
+  const png = Buffer.from([
+    0x89, 0x50, 0x4E, 0x47, 0x0D, 0x0A, 0x1A, 0x0A, // PNG signature
+    0x00, 0x00, 0x00, 0x0D, 0x49, 0x48, 0x44, 0x52, // IHDR chunk start
+    0x00, 0x00, 0x00, 0x01, 0x00, 0x00, 0x00, 0x01, // 1x1 pixels
+    0x08, 0x02, 0x00, 0x00, 0x00, 0x90, 0x77, 0x53, // 8-bit RGB
+    0xDE, 0x00, 0x00, 0x00, 0x0C, 0x49, 0x44, 0x41, // IDAT chunk
+    0x54, 0x08, 0xD7, 0x63, 0x48, 0xC5, 0xD8, 0x60, // compressed blue pixel
+    0x00, 0x00, 0x00, 0x83, 0x00, 0x81, 0x3D, 0xE7,
+    0x79, 0xBA, 0x00, 0x00, 0x00, 0x00, 0x49, 0x45, // IEND chunk
+    0x4E, 0x44, 0xAE, 0x42, 0x60, 0x82
+  ]);
+  return png;
+};
+
+// Generate placeholder icons
+const iconsDir = path.join(__dirname, '../public/icons');
+
+console.log('Generating placeholder icons...');
+console.log('Note: Replace these with properly generated icons from icon.svg');
+console.log('You can use tools like: https://realfavicongenerator.net/\n');
+
+// For now, we'll copy the SVG as a reference and create instruction file
+sizes.forEach(size => {
+  const outputPath = path.join(iconsDir, `icon-${size}x${size}.png`);
+  fs.writeFileSync(outputPath, createPlaceholderPNG(size));
+  console.log(`Created placeholder: icon-${size}x${size}.png`);
+});
+
+// Create favicon placeholder
+fs.writeFileSync(path.join(__dirname, '../public/favicon.png'), createPlaceholderPNG(32));
+console.log('Created placeholder: favicon.png');
+
+// Create apple-touch-icon placeholder
+fs.writeFileSync(path.join(__dirname, '../public/apple-touch-icon.png'), createPlaceholderPNG(180));
+console.log('Created placeholder: apple-touch-icon.png');
+
+// Create instructions file
+const instructions = `# PWA Icons Generation Instructions
+
+The placeholder icons in this directory should be replaced with properly generated icons.
+
+## Option 1: Use an online tool
+1. Go to https://realfavicongenerator.net/
+2. Upload the icon.svg file from this directory
+3. Download the generated icons
+4. Replace the placeholder PNGs
+
+## Option 2: Use sharp (Node.js)
+If you have libvips installed, you can use the generate-icons.js script:
+\`\`\`bash
+npm install sharp --save-dev
+node scripts/generate-icons.js
+\`\`\`
+
+## Option 3: Use ImageMagick
+If you have ImageMagick installed:
+\`\`\`bash
+for size in 72 96 128 144 152 192 384 512; do
+  convert icon.svg -resize \${size}x\${size} icon-\${size}x\${size}.png
+done
+\`\`\`
+
+## Required icon sizes:
+- 72x72
+- 96x96
+- 128x128
+- 144x144
+- 152x152
+- 192x192
+- 384x384
+- 512x512
+- 180x180 (apple-touch-icon.png)
+- 32x32 (favicon.png)
+`;
+
+fs.writeFileSync(path.join(iconsDir, 'README.md'), instructions);
+console.log('\nCreated: icons/README.md with generation instructions');
+console.log('\nPlaceholder icons generated successfully!');

scripts/generate-icons.js

@@ -0,0 +1,56 @@
+const fs = require('fs');
+const path = require('path');
+
+// Read the SVG file
+const svgPath = path.join(__dirname, '../public/icons/icon.svg');
+const svgContent = fs.readFileSync(svgPath, 'utf8');
+
+// Icon sizes for PWA
+const sizes = [72, 96, 128, 144, 152, 192, 384, 512];
+
+// Try to use sharp if available, otherwise create placeholder files
+async function generateIcons() {
+  try {
+    const sharp = require('sharp');
+
+    for (const size of sizes) {
+      const outputPath = path.join(__dirname, `../public/icons/icon-${size}x${size}.png`);
+
+      await sharp(Buffer.from(svgContent))
+        .resize(size, size)
+        .png()
+        .toFile(outputPath);
+
+      console.log(`Generated: icon-${size}x${size}.png`);
+    }
+
+    // Generate favicon
+    await sharp(Buffer.from(svgContent))
+      .resize(32, 32)
+      .png()
+      .toFile(path.join(__dirname, '../public/favicon.png'));
+
+    console.log('Generated: favicon.png');
+
+    // Generate apple-touch-icon
+    await sharp(Buffer.from(svgContent))
+      .resize(180, 180)
+      .png()
+      .toFile(path.join(__dirname, '../public/apple-touch-icon.png'));
+
+    console.log('Generated: apple-touch-icon.png');
+
+    console.log('\nAll icons generated successfully!');
+  } catch (error) {
+    if (error.code === 'MODULE_NOT_FOUND') {
+      console.log('Sharp not found. Installing...');
+      const { execSync } = require('child_process');
+      execSync('npm install sharp --save-dev', { stdio: 'inherit' });
+      console.log('Sharp installed. Please run this script again.');
+    } else {
+      console.error('Error generating icons:', error);
+    }
+  }
+}
+
+generateIcons();