UB Masse Salariale Interface

A professional Next.js application for managing and viewing salary reports with advanced filtering capabilities.

🌟 Features

• Employee Management: Search and filter employees
• Location-based Filtering: View shifts by location with day-by-day grouping
• Date Range Filtering: Advanced date selection with location sub-filtering
• Salary Calculations: Before and after charges calculations
• Authentication: Secure login system
• Responsive Design: Modern UI with Tailwind CSS
• Real-time Data: Dynamic JSON file loading

🚀 Quick Start

Automatic Deployment (Recommended)

1. Fork/Clone this repository
2. Set up CI/CD: Follow CICD_SETUP.md
3. Push to main branch → Automatic deployment! 🎉

Manual Deployment

See DEPLOYMENT.md for manual Docker deployment.

📁 Data Management

Adding Salary Data

1. Place your JSON file in public/data/
2. Rename it to salary_report.json
3. The app will automatically load the new data

JSON File Format

{
  "report_info": {
    "period_start": "2025-09-01",
    "period_end": "2025-09-30"
  },
  "employees": [
    {
      "employee_id": 123,
      "employee_name": "John Doe",
      "weeks": {
        "week_1": {
          "days": [
            {
              "date": "2025-09-01",
              "location": "Store A",
              "hours": {
                "tracked_minutes": 480
              },
              "planning_salary_breakdown": {
                "salaire_avant_charge": 100.00,
                "salaire_apres_charge": 120.00
              },
              "pointage_salary_breakdown": {
                "salaire_avant_charge": 95.00,
                "salaire_apres_charge": 115.00
              }
            }
          ]
        }
      }
    }
  ]
}

🔧 Development

Prerequisites

• Node.js 18+
• npm or yarn

Local Development

# Clone the repository
git clone https://github.com/YOUR_USERNAME/ub_masse_salariale_interface.git
cd ub_masse_salariale_interface

# Install dependencies
npm install

# Start development server
npm run dev

# Open http://localhost:3000

Building for Production

npm run build
npm start

🐳 Docker

Development

docker-compose up --build

Production

docker-compose -f docker-compose.prod.yml up -d --build

📊 Usage

Authentication

Use the provided API endpoint credentials:

• Username: factorialmanager
• Password: t^Cd_jTL6m_#vG&

Filtering Options

1. Employee Filter: Search by name or ID
2. Location Filter: View shifts grouped by location and date
3. Date Range Filter:
   • Select date range
   • Sub-filter by locations within that range
   • Toggle between date and employee grouping

Data Views

• Planning vs Pointage: Toggle between planned and actual hours
• Salary Breakdown: Before and after charges
• Time Tracking: Hours worked and expected
• Augmentations: Overtime and bonus calculations

🔐 Security

• JWT-based authentication
• Secure cookie handling
• Environment variable configuration
• Docker security best practices

🌐 Deployment Architecture

GitHub Repository
       ↓ (push to main)
GitHub Actions
       ↓ (SSH deploy)
Your Server (Port 9099)
       ↓ (reverse proxy)
Nginx → Domain Name

📝 Configuration

Environment Variables

NODE_ENV=production
NEXT_TELEMETRY_DISABLED=1

Server Configuration

• Port: 9099 (configurable in docker-compose.yml)
• Data Volume: ./public/data mounted for easy updates
• Network: Bridge network for container communication

🛠️ Troubleshooting

Common Issues

1. Data not loading: Check public/data/salary_report.json exists
2. Authentication fails: Verify API endpoint accessibility
3. Port conflicts: Change port in docker-compose.yml
4. Build failures: Check Node.js version and dependencies

Logs

# Application logs
docker-compose logs -f

# Deployment logs
tail -f /var/log/deploy.log

🤝 Contributing

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Test thoroughly
5. Submit a pull request

📄 License

This project is proprietary software for UB internal use.

📞 Support

For support and questions:

• Check the documentation files
• Review deployment logs
• Contact the development team

---

Made with ❤️ for UB Masse Salariale Management