1094 lines
32 KiB
TypeScript
1094 lines
32 KiB
TypeScript
"use client";
|
|
|
|
import React, { useState, useMemo } from 'react';
|
|
import { Pencil, Palette, Camera, Search, ChevronDown, ChevronUp } from 'lucide-react';
|
|
|
|
const parseEuro = (str: string) => {
|
|
if (!str || str === '-') return null;
|
|
const cleaned = str.replace(/\s/g, '').replace('€', '').replace(',', '.');
|
|
return parseFloat(cleaned);
|
|
};
|
|
|
|
const euro = (n: number | null) => {
|
|
if (n === null) return '-';
|
|
return new Intl.NumberFormat('fr-FR', {
|
|
minimumFractionDigits: 2,
|
|
maximumFractionDigits: 2
|
|
}).format(n) + ' €';
|
|
};
|
|
|
|
interface Emploi {
|
|
nom: string;
|
|
filiere: string;
|
|
niveau: string;
|
|
cddu: {
|
|
semaine35h: number | null;
|
|
semaine39h: number | null;
|
|
jour7h: number | null;
|
|
jour8h: number | null;
|
|
mois35h: number | null;
|
|
mois39h: number | null;
|
|
};
|
|
cdi: number | null;
|
|
}
|
|
|
|
const emploisData: Emploi[] = [
|
|
// Filière A - Écriture
|
|
{
|
|
nom: "Chargé d'enquête / de recherche",
|
|
filiere: "A",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("791,32 €"),
|
|
semaine39h: parseEuro("904,37 €"),
|
|
jour7h: parseEuro("175,85 €"),
|
|
jour8h: parseEuro("200,97 €"),
|
|
mois35h: parseEuro("3 007,02 €"),
|
|
mois39h: parseEuro("3 436,58 €"),
|
|
},
|
|
cdi: parseEuro("2 530,92 €"),
|
|
},
|
|
{
|
|
nom: "Chargé de sélection",
|
|
filiere: "A",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("810,63 €"),
|
|
semaine39h: parseEuro("926,43 €"),
|
|
jour7h: parseEuro("180,14 €"),
|
|
jour8h: parseEuro("205,87 €"),
|
|
mois35h: parseEuro("3 080,39 €"),
|
|
mois39h: parseEuro("3 520,43 €"),
|
|
},
|
|
cdi: parseEuro("2 590,58 €"),
|
|
},
|
|
{
|
|
nom: "Collaborateur artistique",
|
|
filiere: "A",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("526,45 €"),
|
|
semaine39h: parseEuro("601,66 €"),
|
|
jour7h: parseEuro("116,99 €"),
|
|
jour8h: parseEuro("133,70 €"),
|
|
mois35h: parseEuro("2 342,34 €"),
|
|
mois39h: parseEuro("2 676,95 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Collaborateur de sélection",
|
|
filiere: "A",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("634,28 €"),
|
|
semaine39h: parseEuro("724,89 €"),
|
|
jour7h: parseEuro("140,95 €"),
|
|
jour8h: parseEuro("161,09 €"),
|
|
mois35h: parseEuro("2 410,26 €"),
|
|
mois39h: parseEuro("2 754,58 €"),
|
|
},
|
|
cdi: parseEuro("2 048,84 €"),
|
|
},
|
|
{
|
|
nom: "Conseiller artistique d'émission",
|
|
filiere: "A",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("795,79 €"),
|
|
semaine39h: parseEuro("909,47 €"),
|
|
jour7h: parseEuro("176,84 €"),
|
|
jour8h: parseEuro("202,11 €"),
|
|
mois35h: parseEuro("3 024,00 €"),
|
|
mois39h: parseEuro("3 455,99 €"),
|
|
},
|
|
cdi: parseEuro("2 590,58 €"),
|
|
},
|
|
{
|
|
nom: "Coordinateur d'écriture (ex script éditeur)",
|
|
filiere: "A",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("864,60 €"),
|
|
semaine39h: parseEuro("988,11 €"),
|
|
jour7h: parseEuro("192,13 €"),
|
|
jour8h: parseEuro("219,58 €"),
|
|
mois35h: parseEuro("3 285,48 €"),
|
|
mois39h: parseEuro("3 754,83 €"),
|
|
},
|
|
cdi: parseEuro("3 013,00 €"),
|
|
},
|
|
{
|
|
nom: "Directeur artistique",
|
|
filiere: "A",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 110,85 €"),
|
|
semaine39h: parseEuro("1 269,54 €"),
|
|
jour7h: parseEuro("246,86 €"),
|
|
jour8h: parseEuro("282,12 €"),
|
|
mois35h: parseEuro("4 221,22 €"),
|
|
mois39h: parseEuro("4 824,24 €"),
|
|
},
|
|
cdi: parseEuro("2 952,74 €"),
|
|
},
|
|
{
|
|
nom: "Directeur de jeux",
|
|
filiere: "A",
|
|
niveau: "I",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 110,85 €"),
|
|
semaine39h: parseEuro("1 269,54 €"),
|
|
jour7h: parseEuro("246,86 €"),
|
|
jour8h: parseEuro("282,12 €"),
|
|
mois35h: parseEuro("4 221,22 €"),
|
|
mois39h: parseEuro("4 824,24 €"),
|
|
},
|
|
cdi: parseEuro("2 952,14 €"),
|
|
},
|
|
{
|
|
nom: "Directeur de programmation",
|
|
filiere: "A",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 110,85 €"),
|
|
semaine39h: parseEuro("1 269,54 €"),
|
|
jour7h: parseEuro("246,86 €"),
|
|
jour8h: parseEuro("282,12 €"),
|
|
mois35h: parseEuro("4 221,22 €"),
|
|
mois39h: parseEuro("4 824,24 €"),
|
|
},
|
|
cdi: parseEuro("2 952,74 €"),
|
|
},
|
|
{
|
|
nom: "Directeur de sélection",
|
|
filiere: "A",
|
|
niveau: "I",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 110,85 €"),
|
|
semaine39h: parseEuro("1 269,54 €"),
|
|
jour7h: parseEuro("246,86 €"),
|
|
jour8h: parseEuro("282,12 €"),
|
|
mois35h: parseEuro("4 221,22 €"),
|
|
mois39h: parseEuro("4 824,24 €"),
|
|
},
|
|
cdi: parseEuro("2 892,47 €"),
|
|
},
|
|
{
|
|
nom: "Documentaliste",
|
|
filiere: "A",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("826,70 €"),
|
|
semaine39h: parseEuro("944,80 €"),
|
|
jour7h: parseEuro("183,71 €"),
|
|
jour8h: parseEuro("209,96 €"),
|
|
mois35h: parseEuro("3 141,46 €"),
|
|
mois39h: parseEuro("3 590,23 €"),
|
|
},
|
|
cdi: parseEuro("2 892,47 €"),
|
|
},
|
|
{
|
|
nom: "Enquêteur / Recherchiste",
|
|
filiere: "A",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("757,20 €"),
|
|
semaine39h: parseEuro("865,38 €"),
|
|
jour7h: parseEuro("168,27 €"),
|
|
jour8h: parseEuro("192,31 €"),
|
|
mois35h: parseEuro("2 877,37 €"),
|
|
mois39h: parseEuro("3 288,42 €"),
|
|
},
|
|
cdi: parseEuro("2 169,36 €"),
|
|
},
|
|
{
|
|
nom: "Illustrateur sonore",
|
|
filiere: "A",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("777,33 €"),
|
|
semaine39h: parseEuro("888,38 €"),
|
|
jour7h: parseEuro("172,74 €"),
|
|
jour8h: parseEuro("197,42 €"),
|
|
mois35h: parseEuro("2 953,86 €"),
|
|
mois39h: parseEuro("3 375,83 €"),
|
|
},
|
|
cdi: parseEuro("2 410,40 €"),
|
|
},
|
|
{
|
|
nom: "Préparateur de questions",
|
|
filiere: "A",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("634,28 €"),
|
|
semaine39h: parseEuro("724,89 €"),
|
|
jour7h: parseEuro("140,95 €"),
|
|
jour8h: parseEuro("161,09 €"),
|
|
mois35h: parseEuro("2 410,26 €"),
|
|
mois39h: parseEuro("2 754,58 €"),
|
|
},
|
|
cdi: parseEuro("2 147,87 €"),
|
|
},
|
|
{
|
|
nom: "Producteur artistique",
|
|
filiere: "A",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 110,85 €"),
|
|
semaine39h: parseEuro("1 269,54 €"),
|
|
jour7h: parseEuro("246,86 €"),
|
|
jour8h: parseEuro("282,12 €"),
|
|
mois35h: parseEuro("4 221,22 €"),
|
|
mois39h: parseEuro("4 824,24 €"),
|
|
},
|
|
cdi: parseEuro("2 952,74 €"),
|
|
},
|
|
{
|
|
nom: "Programmateur artistique d'émission",
|
|
filiere: "A",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("735,16 €"),
|
|
semaine39h: parseEuro("840,18 €"),
|
|
jour7h: parseEuro("163,37 €"),
|
|
jour8h: parseEuro("186,71 €"),
|
|
mois35h: parseEuro("2 793,61 €"),
|
|
mois39h: parseEuro("3 192,68 €"),
|
|
},
|
|
cdi: parseEuro("2 048,84 €"),
|
|
},
|
|
{
|
|
nom: "Responsable d'enquête / de recherche",
|
|
filiere: "A",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("826,70 €"),
|
|
semaine39h: parseEuro("944,80 €"),
|
|
jour7h: parseEuro("183,71 €"),
|
|
jour8h: parseEuro("209,96 €"),
|
|
mois35h: parseEuro("3 141,46 €"),
|
|
mois39h: parseEuro("3 590,23 €"),
|
|
},
|
|
cdi: parseEuro("2 892,47 €"),
|
|
},
|
|
{
|
|
nom: "Responsable de questions",
|
|
filiere: "A",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("777,33 €"),
|
|
semaine39h: parseEuro("888,38 €"),
|
|
jour7h: parseEuro("172,74 €"),
|
|
jour8h: parseEuro("197,42 €"),
|
|
mois35h: parseEuro("2 953,86 €"),
|
|
mois39h: parseEuro("3 375,83 €"),
|
|
},
|
|
cdi: parseEuro("2 651,44 €"),
|
|
},
|
|
|
|
// Filière B - Décor & Costume
|
|
{
|
|
nom: "1er assistant décorateur",
|
|
filiere: "B",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("948,41 €"),
|
|
semaine39h: parseEuro("1 083,90 €"),
|
|
jour7h: parseEuro("210,76 €"),
|
|
jour8h: parseEuro("240,87 €"),
|
|
mois35h: parseEuro("3 603,95 €"),
|
|
mois39h: parseEuro("4 118,79 €"),
|
|
},
|
|
cdi: parseEuro("2 530,92 €"),
|
|
},
|
|
{
|
|
nom: "2ème assistant décorateur",
|
|
filiere: "B",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("826,78 €"),
|
|
semaine39h: parseEuro("944,89 €"),
|
|
jour7h: parseEuro("183,73 €"),
|
|
jour8h: parseEuro("209,97 €"),
|
|
mois35h: parseEuro("3 141,75 €"),
|
|
mois39h: parseEuro("3 590,56 €"),
|
|
},
|
|
cdi: parseEuro("2 109,10 €"),
|
|
},
|
|
{
|
|
nom: "Accessoiriste",
|
|
filiere: "B",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("798,94 €"),
|
|
semaine39h: parseEuro("913,07 €"),
|
|
jour7h: parseEuro("177,54 €"),
|
|
jour8h: parseEuro("202,91 €"),
|
|
mois35h: parseEuro("3 035,97 €"),
|
|
mois39h: parseEuro("3 469,67 €"),
|
|
},
|
|
cdi: parseEuro("2 048,84 €"),
|
|
},
|
|
{
|
|
nom: "Assistant décorateur adjoint",
|
|
filiere: "B",
|
|
niveau: "VI",
|
|
cddu: {
|
|
semaine35h: parseEuro("456,50 €"),
|
|
semaine39h: parseEuro("521,72 €"),
|
|
jour7h: parseEuro("101,45 €"),
|
|
jour8h: parseEuro("115,94 €"),
|
|
mois35h: parseEuro("2 342,34 €"),
|
|
mois39h: parseEuro("2 676,95 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Chef constructeur",
|
|
filiere: "B",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 203,69 €"),
|
|
semaine39h: parseEuro("1 375,64 €"),
|
|
jour7h: parseEuro("267,49 €"),
|
|
jour8h: parseEuro("305,70 €"),
|
|
mois35h: parseEuro("4 574,02 €"),
|
|
mois39h: parseEuro("5 227,43 €"),
|
|
},
|
|
cdi: parseEuro("2 651,44 €"),
|
|
},
|
|
{
|
|
nom: "Chef costumier",
|
|
filiere: "B",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("881,28 €"),
|
|
semaine39h: parseEuro("1 007,18 €"),
|
|
jour7h: parseEuro("195,84 €"),
|
|
jour8h: parseEuro("223,82 €"),
|
|
mois35h: parseEuro("3 348,87 €"),
|
|
mois39h: parseEuro("3 827,27 €"),
|
|
},
|
|
cdi: parseEuro("2 169,36 €"),
|
|
},
|
|
{
|
|
nom: "Chef décorateur",
|
|
filiere: "B",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 639,88 €"),
|
|
semaine39h: parseEuro("1 874,15 €"),
|
|
jour7h: parseEuro("364,42 €"),
|
|
jour8h: parseEuro("416,48 €"),
|
|
mois35h: parseEuro("6 231,55 €"),
|
|
mois39h: parseEuro("7 121,75 €"),
|
|
},
|
|
cdi: parseEuro("3 013,00 €"),
|
|
},
|
|
{
|
|
nom: "Constructeur de décor",
|
|
filiere: "B",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("918,47 €"),
|
|
semaine39h: parseEuro("1 049,68 €"),
|
|
jour7h: parseEuro("204,10 €"),
|
|
jour8h: parseEuro("233,26 €"),
|
|
mois35h: parseEuro("3 490,19 €"),
|
|
mois39h: parseEuro("3 988,78 €"),
|
|
},
|
|
cdi: parseEuro("2 481,29 €"),
|
|
},
|
|
{
|
|
nom: "Costumier",
|
|
filiere: "B",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("703,86 €"),
|
|
semaine39h: parseEuro("804,41 €"),
|
|
jour7h: parseEuro("156,41 €"),
|
|
jour8h: parseEuro("178,76 €"),
|
|
mois35h: parseEuro("2 674,68 €"),
|
|
mois39h: parseEuro("3 056,77 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Créateur de costume",
|
|
filiere: "B",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 616,70 €"),
|
|
semaine39h: parseEuro("1 847,66 €"),
|
|
jour7h: parseEuro("359,27 €"),
|
|
jour8h: parseEuro("410,59 €"),
|
|
mois35h: parseEuro("6 143,47 €"),
|
|
mois39h: parseEuro("7 021,08 €"),
|
|
},
|
|
cdi: parseEuro("3 013,00 €"),
|
|
},
|
|
{
|
|
nom: "Décorateur",
|
|
filiere: "B",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 054,04 €"),
|
|
semaine39h: parseEuro("1 204,62 €"),
|
|
jour7h: parseEuro("234,23 €"),
|
|
jour8h: parseEuro("267,69 €"),
|
|
mois35h: parseEuro("4 005,37 €"),
|
|
mois39h: parseEuro("4 577,55 €"),
|
|
},
|
|
cdi: parseEuro("2 892,47 €"),
|
|
},
|
|
{
|
|
nom: "Électricien déco / Machiniste déco",
|
|
filiere: "B",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("906,79 €"),
|
|
semaine39h: parseEuro("1 036,33 €"),
|
|
jour7h: parseEuro("201,51 €"),
|
|
jour8h: parseEuro("230,30 €"),
|
|
mois35h: parseEuro("3 445,79 €"),
|
|
mois39h: parseEuro("3 938,04 €"),
|
|
},
|
|
cdi: parseEuro("2 169,36 €"),
|
|
},
|
|
{
|
|
nom: "Ensemblier - décorateur",
|
|
filiere: "B",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("948,41 €"),
|
|
semaine39h: parseEuro("1 083,90 €"),
|
|
jour7h: parseEuro("210,76 €"),
|
|
jour8h: parseEuro("240,87 €"),
|
|
mois35h: parseEuro("3 603,95 €"),
|
|
mois39h: parseEuro("4 118,79 €"),
|
|
},
|
|
cdi: parseEuro("2 530,92 €"),
|
|
},
|
|
{
|
|
nom: "Habilleur",
|
|
filiere: "B",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("634,28 €"),
|
|
semaine39h: parseEuro("724,89 €"),
|
|
jour7h: parseEuro("140,95 €"),
|
|
jour8h: parseEuro("161,09 €"),
|
|
mois35h: parseEuro("2 410,26 €"),
|
|
mois39h: parseEuro("2 754,58 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Menuisier-traceur-toupilleur de décor",
|
|
filiere: "B",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("935,78 €"),
|
|
semaine39h: parseEuro("1 069,46 €"),
|
|
jour7h: parseEuro("207,95 €"),
|
|
jour8h: parseEuro("237,66 €"),
|
|
mois35h: parseEuro("3 555,95 €"),
|
|
mois39h: parseEuro("4 063,93 €"),
|
|
},
|
|
cdi: parseEuro("2 410,40 €"),
|
|
},
|
|
{
|
|
nom: "Métallier / Serrurier / Mécanicien de décor",
|
|
filiere: "B",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("906,79 €"),
|
|
semaine39h: parseEuro("1 036,33 €"),
|
|
jour7h: parseEuro("201,51 €"),
|
|
jour8h: parseEuro("230,30 €"),
|
|
mois35h: parseEuro("3 445,79 €"),
|
|
mois39h: parseEuro("3 938,04 €"),
|
|
},
|
|
cdi: parseEuro("2 169,36 €"),
|
|
},
|
|
{
|
|
nom: "Peintre en lettres / en faux bois de décor",
|
|
filiere: "B",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("906,79 €"),
|
|
semaine39h: parseEuro("1 036,33 €"),
|
|
jour7h: parseEuro("201,51 €"),
|
|
jour8h: parseEuro("230,30 €"),
|
|
mois35h: parseEuro("3 445,79 €"),
|
|
mois39h: parseEuro("3 938,04 €"),
|
|
},
|
|
cdi: parseEuro("2 169,36 €"),
|
|
},
|
|
{
|
|
nom: "Régisseur d'extérieurs",
|
|
filiere: "B",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("826,78 €"),
|
|
semaine39h: parseEuro("944,89 €"),
|
|
jour7h: parseEuro("183,73 €"),
|
|
jour8h: parseEuro("209,97 €"),
|
|
mois35h: parseEuro("3 141,75 €"),
|
|
mois39h: parseEuro("3 590,56 €"),
|
|
},
|
|
cdi: parseEuro("2 109,10 €"),
|
|
},
|
|
{
|
|
nom: "Rippeur",
|
|
filiere: "B",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("810,55 €"),
|
|
semaine39h: parseEuro("926,34 €"),
|
|
jour7h: parseEuro("180,12 €"),
|
|
jour8h: parseEuro("205,85 €"),
|
|
mois35h: parseEuro("3 080,07 €"),
|
|
mois39h: parseEuro("3 520,07 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Styliste",
|
|
filiere: "B",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("793,15 €"),
|
|
semaine39h: parseEuro("906,46 €"),
|
|
jour7h: parseEuro("176,26 €"),
|
|
jour8h: parseEuro("201,43 €"),
|
|
mois35h: parseEuro("3 013,97 €"),
|
|
mois39h: parseEuro("3 444,52 €"),
|
|
},
|
|
cdi: parseEuro("2 048,84 €"),
|
|
},
|
|
|
|
// Filière C - Image
|
|
{
|
|
nom: "1er assistant OPV / pointeur",
|
|
filiere: "C",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("954,15 €"),
|
|
semaine39h: parseEuro("1 090,46 €"),
|
|
jour7h: parseEuro("212,03 €"),
|
|
jour8h: parseEuro("242,32 €"),
|
|
mois35h: parseEuro("3 625,78 €"),
|
|
mois39h: parseEuro("4 143,74 €"),
|
|
},
|
|
cdi: parseEuro("2 651,44 €"),
|
|
},
|
|
{
|
|
nom: "2ème assistant OPV",
|
|
filiere: "C",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("703,86 €"),
|
|
semaine39h: parseEuro("804,41 €"),
|
|
jour7h: parseEuro("156,41 €"),
|
|
jour8h: parseEuro("178,76 €"),
|
|
mois35h: parseEuro("2 674,68 €"),
|
|
mois39h: parseEuro("3 056,77 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Assistant OPV adjoint",
|
|
filiere: "C",
|
|
niveau: "VI",
|
|
cddu: {
|
|
semaine35h: parseEuro("456,50 €"),
|
|
semaine39h: parseEuro("521,72 €"),
|
|
jour7h: parseEuro("101,45 €"),
|
|
jour8h: parseEuro("115,94 €"),
|
|
mois35h: parseEuro("2 342,34 €"),
|
|
mois39h: parseEuro("2 676,95 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Cadreur / OPV",
|
|
filiere: "C",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 108,57 €"),
|
|
semaine39h: parseEuro("1 266,94 €"),
|
|
jour7h: parseEuro("246,35 €"),
|
|
jour8h: parseEuro("281,54 €"),
|
|
mois35h: parseEuro("4 212,58 €"),
|
|
mois39h: parseEuro("4 814,37 €"),
|
|
},
|
|
cdi: parseEuro("2 651,44 €"),
|
|
},
|
|
{
|
|
nom: "Chef OPV",
|
|
filiere: "C",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 245,64 €"),
|
|
semaine39h: parseEuro("1 423,59 €"),
|
|
jour7h: parseEuro("276,81 €"),
|
|
jour8h: parseEuro("316,35 €"),
|
|
mois35h: parseEuro("4 733,44 €"),
|
|
mois39h: parseEuro("5 409,64 €"),
|
|
},
|
|
cdi: parseEuro("3 013,00 €"),
|
|
},
|
|
{
|
|
nom: "Directeur photo",
|
|
filiere: "C",
|
|
niveau: "I",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 735,96 €"),
|
|
semaine39h: parseEuro("1 983,96 €"),
|
|
jour7h: parseEuro("385,77 €"),
|
|
jour8h: parseEuro("440,88 €"),
|
|
mois35h: parseEuro("6 596,66 €"),
|
|
mois39h: parseEuro("7 539,02 €"),
|
|
},
|
|
cdi: parseEuro("3 314,29 €"),
|
|
},
|
|
{
|
|
nom: "Ingénieur de la vision",
|
|
filiere: "C",
|
|
niveau: "II",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 245,64 €"),
|
|
semaine39h: parseEuro("1 423,59 €"),
|
|
jour7h: parseEuro("276,81 €"),
|
|
jour8h: parseEuro("316,35 €"),
|
|
mois35h: parseEuro("4 733,44 €"),
|
|
mois39h: parseEuro("5 409,64 €"),
|
|
},
|
|
cdi: parseEuro("3 013,00 €"),
|
|
},
|
|
{
|
|
nom: "Ingénieur de la vision adjoint",
|
|
filiere: "C",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("881,28 €"),
|
|
semaine39h: parseEuro("1 007,18 €"),
|
|
jour7h: parseEuro("195,84 €"),
|
|
jour8h: parseEuro("223,82 €"),
|
|
mois35h: parseEuro("3 348,87 €"),
|
|
mois39h: parseEuro("3 827,27 €"),
|
|
},
|
|
cdi: parseEuro("2 169,36 €"),
|
|
},
|
|
{
|
|
nom: "Monteur",
|
|
filiere: "C",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("927,66 €"),
|
|
semaine39h: parseEuro("1 060,18 €"),
|
|
jour7h: parseEuro("206,15 €"),
|
|
jour8h: parseEuro("235,60 €"),
|
|
mois35h: parseEuro("3 525,09 €"),
|
|
mois39h: parseEuro("4 028,66 €"),
|
|
},
|
|
cdi: parseEuro("2 289,87 €"),
|
|
},
|
|
{
|
|
nom: "Opérateur de transfert et de traitement numérique",
|
|
filiere: "C",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("703,86 €"),
|
|
semaine39h: parseEuro("804,41 €"),
|
|
jour7h: parseEuro("156,41 €"),
|
|
jour8h: parseEuro("178,76 €"),
|
|
mois35h: parseEuro("2 674,68 €"),
|
|
mois39h: parseEuro("3 056,78 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Opérateur magnéto / Opérateur magnéto ralenti",
|
|
filiere: "C",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("669,07 €"),
|
|
semaine39h: parseEuro("764,65 €"),
|
|
jour7h: parseEuro("148,68 €"),
|
|
jour8h: parseEuro("169,92 €"),
|
|
mois35h: parseEuro("2 542,47 €"),
|
|
mois39h: parseEuro("2 905,67 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Opérateur régie-vidéo",
|
|
filiere: "C",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("669,07 €"),
|
|
semaine39h: parseEuro("764,65 €"),
|
|
jour7h: parseEuro("148,68 €"),
|
|
jour8h: parseEuro("169,92 €"),
|
|
mois35h: parseEuro("2 542,47 €"),
|
|
mois39h: parseEuro("2 905,67 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Opérateur spécial (steadicamer)",
|
|
filiere: "C",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 162,83 €"),
|
|
semaine39h: parseEuro("1 328,95 €"),
|
|
jour7h: parseEuro("258,41 €"),
|
|
jour8h: parseEuro("295,32 €"),
|
|
mois35h: parseEuro("4 418,76 €"),
|
|
mois39h: parseEuro("5 050,00 €"),
|
|
},
|
|
cdi: parseEuro("2 651,44 €"),
|
|
},
|
|
{
|
|
nom: "Opérateur synthétiseur",
|
|
filiere: "C",
|
|
niveau: "V",
|
|
cddu: {
|
|
semaine35h: parseEuro("669,07 €"),
|
|
semaine39h: parseEuro("764,65 €"),
|
|
jour7h: parseEuro("148,68 €"),
|
|
jour8h: parseEuro("169,92 €"),
|
|
mois35h: parseEuro("2 542,47 €"),
|
|
mois39h: parseEuro("2 905,67 €"),
|
|
},
|
|
cdi: parseEuro("1 828,83 €"),
|
|
},
|
|
{
|
|
nom: "Photographe de plateau",
|
|
filiere: "C",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("798,94 €"),
|
|
semaine39h: parseEuro("913,07 €"),
|
|
jour7h: parseEuro("177,54 €"),
|
|
jour8h: parseEuro("202,91 €"),
|
|
mois35h: parseEuro("3 035,97 €"),
|
|
mois39h: parseEuro("3 469,67 €"),
|
|
},
|
|
cdi: parseEuro("2 229,61 €"),
|
|
},
|
|
{
|
|
nom: "Pupitreur lumière",
|
|
filiere: "C",
|
|
niveau: "IIIB",
|
|
cddu: {
|
|
semaine35h: parseEuro("918,47 €"),
|
|
semaine39h: parseEuro("1 049,68 €"),
|
|
jour7h: parseEuro("204,10 €"),
|
|
jour8h: parseEuro("233,26 €"),
|
|
mois35h: parseEuro("3 490,19 €"),
|
|
mois39h: parseEuro("3 988,78 €"),
|
|
},
|
|
cdi: parseEuro("2 481,29 €"),
|
|
},
|
|
{
|
|
nom: "Superviseur d'effets spéciaux image",
|
|
filiere: "C",
|
|
niveau: "IIIA",
|
|
cddu: {
|
|
semaine35h: parseEuro("1 035,68 €"),
|
|
semaine39h: parseEuro("1 183,63 €"),
|
|
jour7h: parseEuro("230,15 €"),
|
|
jour8h: parseEuro("263,03 €"),
|
|
mois35h: parseEuro("3 935,57 €"),
|
|
mois39h: parseEuro("4 497,78 €"),
|
|
},
|
|
cdi: parseEuro("2 530,92 €"),
|
|
},
|
|
{
|
|
nom: "Technicien truquiste",
|
|
filiere: "C",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("810,55 €"),
|
|
semaine39h: parseEuro("926,34 €"),
|
|
jour7h: parseEuro("180,12 €"),
|
|
jour8h: parseEuro("205,85 €"),
|
|
mois35h: parseEuro("3 080,07 €"),
|
|
mois39h: parseEuro("3 520,07 €"),
|
|
},
|
|
cdi: parseEuro("2 109,10 €"),
|
|
},
|
|
{
|
|
nom: "Technicien vidéo",
|
|
filiere: "C",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("810,55 €"),
|
|
semaine39h: parseEuro("926,34 €"),
|
|
jour7h: parseEuro("180,12 €"),
|
|
jour8h: parseEuro("205,85 €"),
|
|
mois35h: parseEuro("3 080,07 €"),
|
|
mois39h: parseEuro("3 520,07 €"),
|
|
},
|
|
cdi: parseEuro("2 109,10 €"),
|
|
},
|
|
{
|
|
nom: "Assistant lumière",
|
|
filiere: "C",
|
|
niveau: "IV",
|
|
cddu: {
|
|
semaine35h: parseEuro("753,73 €"),
|
|
semaine39h: parseEuro("861,41 €"),
|
|
jour7h: parseEuro("167,50 €"),
|
|
jour8h: parseEuro("191,42 €"),
|
|
mois35h: parseEuro("2 864,18 €"),
|
|
mois39h: parseEuro("3 273,34 €"),
|
|
},
|
|
cdi: parseEuro("2 018,71 €"),
|
|
},
|
|
];
|
|
|
|
const filieres = [
|
|
{ code: 'A', nom: 'Contenu du programme et collaboration artistique', icon: Pencil, color: 'violet' },
|
|
{ code: 'B', nom: 'Costumes, décor', icon: Palette, color: 'blue' },
|
|
{ code: 'C', nom: 'Image', icon: Camera, color: 'cyan' },
|
|
];
|
|
|
|
const colorClasses = {
|
|
violet: {
|
|
bg: 'bg-violet-50',
|
|
border: 'border-violet-200',
|
|
text: 'text-violet-900',
|
|
hover: 'hover:bg-violet-100',
|
|
gradient: 'from-violet-500 to-purple-600',
|
|
ring: 'ring-violet-500',
|
|
},
|
|
blue: {
|
|
bg: 'bg-blue-50',
|
|
border: 'border-blue-200',
|
|
text: 'text-blue-900',
|
|
hover: 'hover:bg-blue-100',
|
|
gradient: 'from-blue-500 to-indigo-600',
|
|
ring: 'ring-blue-500',
|
|
},
|
|
cyan: {
|
|
bg: 'bg-cyan-50',
|
|
border: 'border-cyan-200',
|
|
text: 'text-cyan-900',
|
|
hover: 'hover:bg-cyan-100',
|
|
gradient: 'from-cyan-500 to-teal-600',
|
|
ring: 'ring-cyan-500',
|
|
},
|
|
};
|
|
|
|
interface EmploiCardProps {
|
|
emploi: Emploi;
|
|
color: keyof typeof colorClasses;
|
|
}
|
|
|
|
function EmploiCard({ emploi, color }: EmploiCardProps) {
|
|
const [isExpanded, setIsExpanded] = useState(false);
|
|
const [activeTab, setActiveTab] = useState<'cddu' | 'cdi'>('cdi');
|
|
const colors = colorClasses[color];
|
|
|
|
return (
|
|
<div className={`rounded-xl border ${colors.border} bg-white overflow-hidden transition-all duration-200 hover:shadow-md`}>
|
|
{/* Header */}
|
|
<button
|
|
onClick={() => setIsExpanded(!isExpanded)}
|
|
className={`w-full px-4 py-3 flex items-center justify-between ${colors.hover} transition-colors`}
|
|
>
|
|
<div className="flex items-center gap-3">
|
|
<span className={`inline-flex items-center px-2 py-1 rounded-md text-xs font-semibold ${colors.bg} ${colors.text}`}>
|
|
Niveau {emploi.niveau}
|
|
</span>
|
|
<h3 className="text-sm font-semibold text-slate-900">{emploi.nom}</h3>
|
|
</div>
|
|
{isExpanded ? (
|
|
<ChevronUp className="w-4 h-4 text-slate-400" />
|
|
) : (
|
|
<ChevronDown className="w-4 h-4 text-slate-400" />
|
|
)}
|
|
</button>
|
|
|
|
{/* Content */}
|
|
{isExpanded && (
|
|
<div className="border-t border-slate-100 p-4 space-y-4">
|
|
{/* Tabs */}
|
|
<div className="flex gap-2">
|
|
<button
|
|
onClick={() => setActiveTab('cdi')}
|
|
className={`flex-1 px-4 py-2 rounded-lg text-xs font-semibold transition-all ${
|
|
activeTab === 'cdi'
|
|
? `bg-gradient-to-r ${colors.gradient} text-white shadow-sm`
|
|
: 'bg-slate-50 text-slate-600 hover:bg-slate-100'
|
|
}`}
|
|
>
|
|
CDI / CDD
|
|
</button>
|
|
<button
|
|
onClick={() => setActiveTab('cddu')}
|
|
className={`flex-1 px-4 py-2 rounded-lg text-xs font-semibold transition-all ${
|
|
activeTab === 'cddu'
|
|
? `bg-gradient-to-r ${colors.gradient} text-white shadow-sm`
|
|
: 'bg-slate-50 text-slate-600 hover:bg-slate-100'
|
|
}`}
|
|
>
|
|
CDDU
|
|
</button>
|
|
</div>
|
|
|
|
{/* Content based on tab */}
|
|
{activeTab === 'cdi' ? (
|
|
<div className={`rounded-lg ${colors.bg} border ${colors.border} p-4`}>
|
|
<p className="text-xs text-slate-600 mb-2">Salaire mensuel minimum</p>
|
|
<p className={`text-2xl font-bold ${colors.text}`}>{euro(emploi.cdi)}</p>
|
|
</div>
|
|
) : (
|
|
<div className="space-y-3">
|
|
{/* Par semaine */}
|
|
<div className={`rounded-lg ${colors.bg} border ${colors.border} p-3`}>
|
|
<p className="text-xs font-semibold text-slate-700 mb-2">Par semaine</p>
|
|
<div className="grid grid-cols-2 gap-3 text-xs">
|
|
<div>
|
|
<p className="text-slate-500">Base 35h</p>
|
|
<p className={`font-bold ${colors.text}`}>{euro(emploi.cddu.semaine35h)}</p>
|
|
</div>
|
|
<div>
|
|
<p className="text-slate-500">Base 39h</p>
|
|
<p className={`font-bold ${colors.text}`}>{euro(emploi.cddu.semaine39h)}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Par jour */}
|
|
<div className={`rounded-lg ${colors.bg} border ${colors.border} p-3`}>
|
|
<p className="text-xs font-semibold text-slate-700 mb-2">Par jour</p>
|
|
<div className="grid grid-cols-2 gap-3 text-xs">
|
|
<div>
|
|
<p className="text-slate-500">Base 7h</p>
|
|
<p className={`font-bold ${colors.text}`}>{euro(emploi.cddu.jour7h)}</p>
|
|
</div>
|
|
<div>
|
|
<p className="text-slate-500">Base 8h</p>
|
|
<p className={`font-bold ${colors.text}`}>{euro(emploi.cddu.jour8h)}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Par mois */}
|
|
<div className={`rounded-lg ${colors.bg} border ${colors.border} p-3`}>
|
|
<p className="text-xs font-semibold text-slate-700 mb-2">Par mois</p>
|
|
<div className="grid grid-cols-2 gap-3 text-xs">
|
|
<div>
|
|
<p className="text-slate-500">Base 35h</p>
|
|
<p className={`font-bold ${colors.text}`}>{euro(emploi.cddu.mois35h)}</p>
|
|
</div>
|
|
<div>
|
|
<p className="text-slate-500">Base 39h</p>
|
|
<p className={`font-bold ${colors.text}`}>{euro(emploi.cddu.mois39h)}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
interface CategorieBFluxDataPart1Props {
|
|
activeFiliere: string;
|
|
}
|
|
|
|
export default function CategorieBFluxDataPart1({ activeFiliere }: CategorieBFluxDataPart1Props) {
|
|
const [searchTerm, setSearchTerm] = useState('');
|
|
|
|
const filteredEmplois = useMemo(() => {
|
|
// D'abord filtrer par la filière active
|
|
let result = emploisData.filter(e => e.filiere === activeFiliere);
|
|
|
|
// Puis appliquer le filtre de recherche
|
|
if (searchTerm) {
|
|
result = result.filter(e =>
|
|
e.nom.toLowerCase().includes(searchTerm.toLowerCase())
|
|
);
|
|
}
|
|
|
|
return result.sort((a, b) => a.nom.localeCompare(b.nom));
|
|
}, [activeFiliere, searchTerm]);
|
|
|
|
// Déterminer la couleur en fonction de la filière
|
|
const getColorForFiliere = (filiereCode: string): keyof typeof colorClasses => {
|
|
const filiere = filieres.find(f => f.code === filiereCode);
|
|
return (filiere?.color as keyof typeof colorClasses) || 'blue';
|
|
};
|
|
const activeFiliereInfo = filieres.find(f => f.code === activeFiliere);
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
{/* En-tête */}
|
|
<div className="rounded-xl border bg-gradient-to-br from-amber-50 to-orange-50 p-4">
|
|
<h2 className="text-lg font-semibold text-amber-900 mb-1">
|
|
Filière {activeFiliere} - {activeFiliereInfo?.nom || 'Filière'}
|
|
</h2>
|
|
<p className="text-xs text-amber-600 mt-2">
|
|
{emploisData.length} emplois - Grille de salaires CCNPA (IDCC 2642) - Valeurs 2025
|
|
</p>
|
|
</div>
|
|
|
|
{/* Recherche */}
|
|
<div className="space-y-4">
|
|
{/* Barre de recherche */}
|
|
<div className="relative">
|
|
<Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-slate-400" />
|
|
<input
|
|
type="text"
|
|
value={searchTerm}
|
|
onChange={(e) => setSearchTerm(e.target.value)}
|
|
placeholder={`Rechercher dans ${activeFiliereInfo?.nom || 'la filière'}...`}
|
|
className="w-full pl-10 pr-4 py-2.5 rounded-lg border border-slate-200 focus:ring-2 focus:ring-amber-500 focus:border-transparent text-sm"
|
|
/>
|
|
</div>
|
|
|
|
{/* Résultats */}
|
|
<div className="space-y-3">
|
|
<div className="flex items-center justify-between">
|
|
<h3 className="text-sm font-semibold text-slate-700">
|
|
{filteredEmplois.length} emploi{filteredEmplois.length > 1 ? 's' : ''} trouvé{filteredEmplois.length > 1 ? 's' : ''}
|
|
</h3>
|
|
{searchTerm && (
|
|
<button
|
|
onClick={() => setSearchTerm('')}
|
|
className="text-xs text-slate-500 hover:text-slate-700"
|
|
>
|
|
Effacer la recherche
|
|
</button>
|
|
)}
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
{filteredEmplois.map((emploi, index) => (
|
|
<EmploiCard
|
|
key={index}
|
|
emploi={emploi}
|
|
color={getColorForFiliere(emploi.filiere)}
|
|
/>
|
|
))}
|
|
</div>
|
|
|
|
{filteredEmplois.length === 0 && (
|
|
<div className="text-center py-12">
|
|
<p className="text-sm text-slate-500">Aucun emploi trouvé pour cette recherche.</p>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|