Initial commit
This commit is contained in:
dahoud
625
app/(main)/budget/planification/page.tsx
Normal file
625
app/(main)/budget/planification/page.tsx
Normal file
@@ -0,0 +1,625 @@
|
||||
'use client';
|
||||
|
||||
/**
|
||||
* Page principale de planification budgétaire
|
||||
* Vue d'ensemble de tous les budgets avec possibilité de planification détaillée
|
||||
*/
|
||||
|
||||
import React, { useState, useRef, useEffect, useContext } from 'react';
|
||||
import { LayoutContext } from '../../../../layout/context/layoutcontext';
|
||||
import { Card } from 'primereact/card';
|
||||
import { DataTable } from 'primereact/datatable';
|
||||
import { Column } from 'primereact/column';
|
||||
import { Button } from 'primereact/button';
|
||||
import { Tag } from 'primereact/tag';
|
||||
import { ProgressBar } from 'primereact/progressbar';
|
||||
import { Toolbar } from 'primereact/toolbar';
|
||||
import { InputText } from 'primereact/inputtext';
|
||||
import { Dropdown } from 'primereact/dropdown';
|
||||
import { Calendar } from 'primereact/calendar';
|
||||
import { Toast } from 'primereact/toast';
|
||||
import { Chart } from 'primereact/chart';
|
||||
import { Divider } from 'primereact/divider';
|
||||
import { TabView, TabPanel } from 'primereact/tabview';
|
||||
import { Panel } from 'primereact/panel';
|
||||
import BudgetPlanningDialog from '../../../../components/phases/BudgetPlanningDialog';
|
||||
|
||||
interface BudgetChantier {
|
||||
id: string;
|
||||
chantierNom: string;
|
||||
client: string;
|
||||
dateDebut: string;
|
||||
dateFin: string;
|
||||
budgetTotal: number;
|
||||
budgetPlanifie: number;
|
||||
avancementPlanification: number;
|
||||
nombrePhases: number;
|
||||
nombrePhasesPlanifiees: number;
|
||||
statut: 'NON_PLANIFIE' | 'EN_COURS_PLANIFICATION' | 'PLANIFIE' | 'VALIDE';
|
||||
priorite: 'HAUTE' | 'MOYENNE' | 'BASSE';
|
||||
responsable: string;
|
||||
derniereMaj: string;
|
||||
}
|
||||
|
||||
const BudgetPlanificationPage = () => {
|
||||
const { layoutConfig, setLayoutConfig, layoutState, setLayoutState } = useContext(LayoutContext);
|
||||
const toast = useRef<Toast>(null);
|
||||
|
||||
// États
|
||||
const [budgets, setBudgets] = useState<BudgetChantier[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [globalFilter, setGlobalFilter] = useState('');
|
||||
const [selectedBudget, setSelectedBudget] = useState<BudgetChantier | null>(null);
|
||||
const [showPlanningDialog, setShowPlanningDialog] = useState(false);
|
||||
const [activeIndex, setActiveIndex] = useState(0);
|
||||
|
||||
// Filtres
|
||||
const [statusFilter, setStatusFilter] = useState<string>('');
|
||||
const [prioriteFilter, setPrioriteFilter] = useState<string>('');
|
||||
const [dateFilter, setDateFilter] = useState<Date | null>(null);
|
||||
|
||||
// Options pour les filtres
|
||||
const statusOptions = [
|
||||
{ label: 'Tous les statuts', value: '' },
|
||||
{ label: 'Non planifié', value: 'NON_PLANIFIE' },
|
||||
{ label: 'En cours', value: 'EN_COURS_PLANIFICATION' },
|
||||
{ label: 'Planifié', value: 'PLANIFIE' },
|
||||
{ label: 'Validé', value: 'VALIDE' }
|
||||
];
|
||||
|
||||
const prioriteOptions = [
|
||||
{ label: 'Toutes priorités', value: '' },
|
||||
{ label: 'Haute', value: 'HAUTE' },
|
||||
{ label: 'Moyenne', value: 'MOYENNE' },
|
||||
{ label: 'Basse', value: 'BASSE' }
|
||||
];
|
||||
|
||||
// Charger les données
|
||||
useEffect(() => {
|
||||
loadBudgets();
|
||||
}, []);
|
||||
|
||||
const loadBudgets = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
|
||||
// Simuler des données de budget (en production, ceci viendrait de l'API)
|
||||
const budgetsSimules: BudgetChantier[] = [
|
||||
{
|
||||
id: '1',
|
||||
chantierNom: 'Villa Moderne Bordeaux',
|
||||
client: 'Jean Dupont',
|
||||
dateDebut: '2025-03-01',
|
||||
dateFin: '2025-08-30',
|
||||
budgetTotal: 250000,
|
||||
budgetPlanifie: 180000,
|
||||
avancementPlanification: 72,
|
||||
nombrePhases: 8,
|
||||
nombrePhasesPlanifiees: 6,
|
||||
statut: 'EN_COURS_PLANIFICATION',
|
||||
priorite: 'HAUTE',
|
||||
responsable: 'Marie Martin',
|
||||
derniereMaj: '2025-01-28'
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
chantierNom: 'Extension Maison Lyon',
|
||||
client: 'Sophie Lambert',
|
||||
dateDebut: '2025-02-15',
|
||||
dateFin: '2025-06-15',
|
||||
budgetTotal: 120000,
|
||||
budgetPlanifie: 120000,
|
||||
avancementPlanification: 100,
|
||||
nombrePhases: 5,
|
||||
nombrePhasesPlanifiees: 5,
|
||||
statut: 'PLANIFIE',
|
||||
priorite: 'MOYENNE',
|
||||
responsable: 'Pierre Dubois',
|
||||
derniereMaj: '2025-01-25'
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
chantierNom: 'Rénovation Appartement Paris',
|
||||
client: 'Michel Robert',
|
||||
dateDebut: '2025-04-01',
|
||||
dateFin: '2025-07-31',
|
||||
budgetTotal: 85000,
|
||||
budgetPlanifie: 0,
|
||||
avancementPlanification: 0,
|
||||
nombrePhases: 6,
|
||||
nombrePhasesPlanifiees: 0,
|
||||
statut: 'NON_PLANIFIE',
|
||||
priorite: 'HAUTE',
|
||||
responsable: 'Anne Legrand',
|
||||
derniereMaj: '2025-01-20'
|
||||
}
|
||||
];
|
||||
|
||||
setBudgets(budgetsSimules);
|
||||
|
||||
} catch (error) {
|
||||
console.error('Erreur lors du chargement des budgets:', error);
|
||||
toast.current?.show({
|
||||
severity: 'error',
|
||||
summary: 'Erreur',
|
||||
detail: 'Impossible de charger les budgets',
|
||||
life: 3000
|
||||
});
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Templates pour le DataTable
|
||||
const statutTemplate = (rowData: BudgetChantier) => {
|
||||
const severityMap = {
|
||||
'NON_PLANIFIE': 'danger',
|
||||
'EN_COURS_PLANIFICATION': 'warning',
|
||||
'PLANIFIE': 'info',
|
||||
'VALIDE': 'success'
|
||||
} as const;
|
||||
|
||||
const labelMap = {
|
||||
'NON_PLANIFIE': 'Non planifié',
|
||||
'EN_COURS_PLANIFICATION': 'En cours',
|
||||
'PLANIFIE': 'Planifié',
|
||||
'VALIDE': 'Validé'
|
||||
};
|
||||
|
||||
return <Tag value={labelMap[rowData.statut]} severity={severityMap[rowData.statut]} />;
|
||||
};
|
||||
|
||||
const prioriteTemplate = (rowData: BudgetChantier) => {
|
||||
const severityMap = {
|
||||
'HAUTE': 'danger',
|
||||
'MOYENNE': 'warning',
|
||||
'BASSE': 'info'
|
||||
} as const;
|
||||
|
||||
return <Tag value={rowData.priorite} severity={severityMap[rowData.priorite]} />;
|
||||
};
|
||||
|
||||
const budgetTemplate = (rowData: BudgetChantier) => {
|
||||
const pourcentagePlanifie = rowData.budgetTotal > 0 ? (rowData.budgetPlanifie / rowData.budgetTotal) * 100 : 0;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="flex justify-content-between mb-1">
|
||||
<span className="text-sm text-color-secondary">
|
||||
{new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR' }).format(rowData.budgetPlanifie)}
|
||||
</span>
|
||||
<span className="text-sm text-color-secondary">
|
||||
{new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR' }).format(rowData.budgetTotal)}
|
||||
</span>
|
||||
</div>
|
||||
<ProgressBar
|
||||
value={pourcentagePlanifie}
|
||||
className="w-full"
|
||||
style={{ height: '8px' }}
|
||||
color={pourcentagePlanifie < 50 ? '#dc3545' : pourcentagePlanifie < 80 ? '#ffc107' : '#22c55e'}
|
||||
/>
|
||||
<small className="text-color-secondary">{pourcentagePlanifie.toFixed(0)}% planifié</small>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const avancementTemplate = (rowData: BudgetChantier) => {
|
||||
return (
|
||||
<div>
|
||||
<div className="flex justify-content-between mb-1">
|
||||
<span className="text-sm">Phases planifiées</span>
|
||||
<span className="text-sm font-semibold">{rowData.nombrePhasesPlanifiees}/{rowData.nombrePhases}</span>
|
||||
</div>
|
||||
<ProgressBar
|
||||
value={rowData.avancementPlanification}
|
||||
className="w-full"
|
||||
style={{ height: '8px' }}
|
||||
/>
|
||||
<small className="text-color-secondary">{rowData.avancementPlanification}% avancement</small>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const dateTemplate = (rowData: BudgetChantier, field: keyof BudgetChantier) => {
|
||||
const date = rowData[field] as string;
|
||||
return new Date(date).toLocaleDateString('fr-FR');
|
||||
};
|
||||
|
||||
const actionsTemplate = (rowData: BudgetChantier) => {
|
||||
return (
|
||||
<div className="flex gap-1">
|
||||
<Button
|
||||
icon="pi pi-calculator"
|
||||
className="p-button-outlined p-button-sm"
|
||||
tooltip="Planifier le budget"
|
||||
onClick={() => {
|
||||
setSelectedBudget(rowData);
|
||||
setShowPlanningDialog(true);
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
icon="pi pi-eye"
|
||||
className="p-button-outlined p-button-sm"
|
||||
tooltip="Voir détails"
|
||||
onClick={() => {
|
||||
// Navigation vers le détail du chantier
|
||||
window.open(`/chantiers/${rowData.id}`, '_blank');
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
icon="pi pi-check"
|
||||
className="p-button-success p-button-sm"
|
||||
tooltip="Valider le budget"
|
||||
disabled={rowData.statut !== 'PLANIFIE'}
|
||||
onClick={() => validerBudget(rowData.id)}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// Fonctions d'action
|
||||
const validerBudget = async (budgetId: string) => {
|
||||
try {
|
||||
// Appel API pour valider le budget
|
||||
setBudgets(budgets.map(b =>
|
||||
b.id === budgetId ? { ...b, statut: 'VALIDE' as const } : b
|
||||
));
|
||||
|
||||
toast.current?.show({
|
||||
severity: 'success',
|
||||
summary: 'Budget validé',
|
||||
detail: 'Le budget a été validé avec succès',
|
||||
life: 3000
|
||||
});
|
||||
} catch (error) {
|
||||
toast.current?.show({
|
||||
severity: 'error',
|
||||
summary: 'Erreur',
|
||||
detail: 'Impossible de valider le budget',
|
||||
life: 3000
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const handleSaveBudgetPlanning = async (budgetData: any) => {
|
||||
if (!selectedBudget) return;
|
||||
|
||||
try {
|
||||
// Mettre à jour le budget avec les nouvelles données
|
||||
setBudgets(budgets.map(b =>
|
||||
b.id === selectedBudget.id
|
||||
? {
|
||||
...b,
|
||||
budgetPlanifie: budgetData.prixVenteCalcule,
|
||||
statut: 'PLANIFIE' as const,
|
||||
avancementPlanification: 100,
|
||||
derniereMaj: new Date().toISOString().split('T')[0]
|
||||
}
|
||||
: b
|
||||
));
|
||||
|
||||
toast.current?.show({
|
||||
severity: 'success',
|
||||
summary: 'Budget planifié',
|
||||
detail: `Le budget du chantier "${selectedBudget.chantierNom}" a été mis à jour`,
|
||||
life: 3000
|
||||
});
|
||||
} catch (error) {
|
||||
toast.current?.show({
|
||||
severity: 'error',
|
||||
summary: 'Erreur',
|
||||
detail: 'Impossible de sauvegarder la planification',
|
||||
life: 3000
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// Filtrer les données
|
||||
const filteredBudgets = budgets.filter(budget => {
|
||||
let matches = true;
|
||||
|
||||
if (globalFilter) {
|
||||
const search = globalFilter.toLowerCase();
|
||||
matches = matches && (
|
||||
budget.chantierNom.toLowerCase().includes(search) ||
|
||||
budget.client.toLowerCase().includes(search) ||
|
||||
budget.responsable.toLowerCase().includes(search)
|
||||
);
|
||||
}
|
||||
|
||||
if (statusFilter) {
|
||||
matches = matches && budget.statut === statusFilter;
|
||||
}
|
||||
|
||||
if (prioriteFilter) {
|
||||
matches = matches && budget.priorite === prioriteFilter;
|
||||
}
|
||||
|
||||
return matches;
|
||||
});
|
||||
|
||||
// Statistiques
|
||||
const stats = {
|
||||
totalBudgets: budgets.length,
|
||||
budgetsNonPlanifies: budgets.filter(b => b.statut === 'NON_PLANIFIE').length,
|
||||
budgetsEnCours: budgets.filter(b => b.statut === 'EN_COURS_PLANIFICATION').length,
|
||||
budgetsPlanifies: budgets.filter(b => b.statut === 'PLANIFIE').length,
|
||||
budgetsValides: budgets.filter(b => b.statut === 'VALIDE').length,
|
||||
montantTotalBudget: budgets.reduce((sum, b) => sum + b.budgetTotal, 0),
|
||||
montantTotalPlanifie: budgets.reduce((sum, b) => sum + b.budgetPlanifie, 0)
|
||||
};
|
||||
|
||||
// Données pour le graphique
|
||||
const chartData = {
|
||||
labels: ['Non planifié', 'En cours', 'Planifié', 'Validé'],
|
||||
datasets: [
|
||||
{
|
||||
data: [
|
||||
stats.budgetsNonPlanifies,
|
||||
stats.budgetsEnCours,
|
||||
stats.budgetsPlanifies,
|
||||
stats.budgetsValides
|
||||
],
|
||||
backgroundColor: ['#dc3545', '#ffc107', '#007ad9', '#22c55e'],
|
||||
borderWidth: 0
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// Template de la toolbar
|
||||
const toolbarStartTemplate = (
|
||||
<div className="flex align-items-center gap-2">
|
||||
<h5 className="m-0">Planification Budgétaire</h5>
|
||||
<Tag value={`${stats.totalBudgets} chantiers`} className="ml-2" />
|
||||
</div>
|
||||
);
|
||||
|
||||
const toolbarEndTemplate = (
|
||||
<div className="flex gap-2">
|
||||
<span className="p-input-icon-left">
|
||||
<i className="pi pi-search" />
|
||||
<InputText
|
||||
value={globalFilter}
|
||||
onChange={(e) => setGlobalFilter(e.target.value)}
|
||||
placeholder="Rechercher..."
|
||||
/>
|
||||
</span>
|
||||
<Dropdown
|
||||
value={statusFilter}
|
||||
options={statusOptions}
|
||||
onChange={(e) => setStatusFilter(e.value)}
|
||||
placeholder="Statut"
|
||||
className="w-10rem"
|
||||
/>
|
||||
<Dropdown
|
||||
value={prioriteFilter}
|
||||
options={prioriteOptions}
|
||||
onChange={(e) => setPrioriteFilter(e.value)}
|
||||
placeholder="Priorité"
|
||||
className="w-10rem"
|
||||
/>
|
||||
<Button
|
||||
label="Nouveau budget"
|
||||
icon="pi pi-plus"
|
||||
className="p-button-success"
|
||||
onClick={() => {
|
||||
// Navigation vers création de nouveau budget
|
||||
window.location.href = '/budget/planification/nouveau';
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="grid">
|
||||
<Toast ref={toast} />
|
||||
|
||||
<div className="col-12">
|
||||
<Card>
|
||||
<TabView activeIndex={activeIndex} onTabChange={(e) => setActiveIndex(e.index)}>
|
||||
<TabPanel header="Vue d'ensemble" leftIcon="pi pi-chart-pie">
|
||||
{/* Statistiques générales */}
|
||||
<div className="grid mb-4">
|
||||
<div className="col-12 lg:col-3">
|
||||
<Card className="bg-blue-50">
|
||||
<div className="flex justify-content-between">
|
||||
<div>
|
||||
<span className="block text-blue-600 font-medium mb-3">Budget Total</span>
|
||||
<div className="text-blue-900 font-bold text-xl">
|
||||
{new Intl.NumberFormat('fr-FR', {
|
||||
style: 'currency',
|
||||
currency: 'EUR',
|
||||
minimumFractionDigits: 0
|
||||
}).format(stats.montantTotalBudget)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex align-items-center justify-content-center bg-blue-100 border-round" style={{ width: '2.5rem', height: '2.5rem' }}>
|
||||
<i className="pi pi-euro text-blue-500 text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
<div className="col-12 lg:col-3">
|
||||
<Card className="bg-green-50">
|
||||
<div className="flex justify-content-between">
|
||||
<div>
|
||||
<span className="block text-green-600 font-medium mb-3">Budget Planifié</span>
|
||||
<div className="text-green-900 font-bold text-xl">
|
||||
{new Intl.NumberFormat('fr-FR', {
|
||||
style: 'currency',
|
||||
currency: 'EUR',
|
||||
minimumFractionDigits: 0
|
||||
}).format(stats.montantTotalPlanifie)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex align-items-center justify-content-center bg-green-100 border-round" style={{ width: '2.5rem', height: '2.5rem' }}>
|
||||
<i className="pi pi-check-circle text-green-500 text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
<div className="col-12 lg:col-3">
|
||||
<Card className="bg-orange-50">
|
||||
<div className="flex justify-content-between">
|
||||
<div>
|
||||
<span className="block text-orange-600 font-medium mb-3">En Attente</span>
|
||||
<div className="text-orange-900 font-bold text-xl">
|
||||
{stats.budgetsNonPlanifies + stats.budgetsEnCours}
|
||||
</div>
|
||||
<small className="text-orange-600">chantiers</small>
|
||||
</div>
|
||||
<div className="flex align-items-center justify-content-center bg-orange-100 border-round" style={{ width: '2.5rem', height: '2.5rem' }}>
|
||||
<i className="pi pi-clock text-orange-500 text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
<div className="col-12 lg:col-3">
|
||||
<Card className="bg-purple-50">
|
||||
<div className="flex justify-content-between">
|
||||
<div>
|
||||
<span className="block text-purple-600 font-medium mb-3">Taux Planification</span>
|
||||
<div className="text-purple-900 font-bold text-xl">
|
||||
{stats.totalBudgets > 0 ?
|
||||
(((stats.budgetsPlanifies + stats.budgetsValides) / stats.totalBudgets) * 100).toFixed(0)
|
||||
: 0}%
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex align-items-center justify-content-center bg-purple-100 border-round" style={{ width: '2.5rem', height: '2.5rem' }}>
|
||||
<i className="pi pi-chart-pie text-purple-500 text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Graphique de répartition */}
|
||||
<div className="grid mb-4">
|
||||
<div className="col-12 lg:col-6">
|
||||
<Card title="Répartition par statut">
|
||||
<Chart type="doughnut" data={chartData} style={{ height: '300px' }} />
|
||||
</Card>
|
||||
</div>
|
||||
<div className="col-12 lg:col-6">
|
||||
<Card title="Actions prioritaires">
|
||||
<div className="flex flex-column gap-3">
|
||||
<Panel header="Budgets à planifier" toggleable>
|
||||
<p className="m-0">
|
||||
<strong>{stats.budgetsNonPlanifies}</strong> chantiers n'ont pas encore de budget planifié.
|
||||
</p>
|
||||
{stats.budgetsNonPlanifies > 0 && (
|
||||
<Button
|
||||
label="Voir la liste"
|
||||
icon="pi pi-list"
|
||||
className="mt-2"
|
||||
onClick={() => setStatusFilter('NON_PLANIFIE')}
|
||||
/>
|
||||
)}
|
||||
</Panel>
|
||||
<Panel header="Budgets à valider" toggleable>
|
||||
<p className="m-0">
|
||||
<strong>{stats.budgetsPlanifies}</strong> budgets sont prêts à être validés.
|
||||
</p>
|
||||
{stats.budgetsPlanifies > 0 && (
|
||||
<Button
|
||||
label="Voir la liste"
|
||||
icon="pi pi-list"
|
||||
className="mt-2"
|
||||
onClick={() => setStatusFilter('PLANIFIE')}
|
||||
/>
|
||||
)}
|
||||
</Panel>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</TabPanel>
|
||||
|
||||
<TabPanel header="Liste des budgets" leftIcon="pi pi-list">
|
||||
<Toolbar
|
||||
start={toolbarStartTemplate}
|
||||
end={toolbarEndTemplate}
|
||||
className="mb-4"
|
||||
/>
|
||||
|
||||
<DataTable
|
||||
value={filteredBudgets}
|
||||
loading={loading}
|
||||
paginator
|
||||
rows={20}
|
||||
emptyMessage="Aucun budget trouvé"
|
||||
className="p-datatable-lg"
|
||||
dataKey="id"
|
||||
sortMode="multiple"
|
||||
>
|
||||
<Column field="chantierNom" header="Chantier" sortable style={{ minWidth: '15rem' }} />
|
||||
<Column field="client" header="Client" sortable style={{ width: '12rem' }} />
|
||||
<Column
|
||||
field="dateDebut"
|
||||
header="Début"
|
||||
body={(rowData) => dateTemplate(rowData, 'dateDebut')}
|
||||
sortable
|
||||
style={{ width: '8rem' }}
|
||||
/>
|
||||
<Column
|
||||
field="dateFin"
|
||||
header="Fin prévue"
|
||||
body={(rowData) => dateTemplate(rowData, 'dateFin')}
|
||||
sortable
|
||||
style={{ width: '8rem' }}
|
||||
/>
|
||||
<Column
|
||||
field="budgetTotal"
|
||||
header="Budget"
|
||||
body={budgetTemplate}
|
||||
sortable
|
||||
style={{ width: '12rem' }}
|
||||
/>
|
||||
<Column
|
||||
field="avancementPlanification"
|
||||
header="Avancement"
|
||||
body={avancementTemplate}
|
||||
style={{ width: '12rem' }}
|
||||
/>
|
||||
<Column
|
||||
field="statut"
|
||||
header="Statut"
|
||||
body={statutTemplate}
|
||||
sortable
|
||||
style={{ width: '8rem' }}
|
||||
/>
|
||||
<Column
|
||||
field="priorite"
|
||||
header="Priorité"
|
||||
body={prioriteTemplate}
|
||||
sortable
|
||||
style={{ width: '8rem' }}
|
||||
/>
|
||||
<Column field="responsable" header="Responsable" sortable style={{ width: '10rem' }} />
|
||||
<Column
|
||||
header="Actions"
|
||||
body={actionsTemplate}
|
||||
style={{ width: '10rem' }}
|
||||
/>
|
||||
</DataTable>
|
||||
</TabPanel>
|
||||
</TabView>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
{/* Dialog de planification budgétaire */}
|
||||
<BudgetPlanningDialog
|
||||
visible={showPlanningDialog}
|
||||
onHide={() => setShowPlanningDialog(false)}
|
||||
phase={selectedBudget ? {
|
||||
id: parseInt(selectedBudget.id),
|
||||
nom: selectedBudget.chantierNom,
|
||||
budgetPrevu: selectedBudget.budgetTotal
|
||||
} as any : null}
|
||||
onSave={handleSaveBudgetPlanning}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default BudgetPlanificationPage;
|
||||
Reference in New Issue
Block a user