// ECO-PANNEAU.FR - __react/socle/_socle_editeur_acteurs.jsx

// 1. - Composant : Intervenants principaux
window.pano_PanneauEditorIntervenants = ({
    panneau,
    lockedFields = [],
    onEditEntity,
    deleteEntity,
    handleDragStart,
    handleDragOver,
    handleDrop
}) => {
    const isFieldLocked = (field) => lockedFields.includes(field);
    
    const { PlusIcon, BuildingIcon, EditIcon, Trash2Icon, LockIcon } = window.pano_getIcons();
    const { Button, EmptyState } = window.pano_getComponents();

    return (
        <div className="space-y-4 animate-in fade-in">
            <div className="flex justify-between items-center">
                <p className="text-sm text-slate-500 font-medium flex items-center gap-2">
                    Déclarez l'architecte, le bureau de contrôle, etc.
                    {isFieldLocked('intervenants') && <LockIcon size={14} className="text-amber-500" title="Verrouillé" />}
                </p>
                {!isFieldLocked('intervenants') && (
                    <Button variant="outline" icon={PlusIcon} onClick={() => onEditEntity({ type: 'intervenant' }, { name: '', role: '', address: '', phone: '', email: '', website: '', logoId: '', logoUrl: '' })} className="bg-emerald-100 text-emerald-700 hover:bg-emerald-200 border-none shrink-0">
                        Nouvel intervenant
                    </Button>
                )}
            </div>
            
            <div className="space-y-2">
                {(!panneau.intervenants || panneau.intervenants.length === 0) && (
                    <EmptyState icon={BuildingIcon} text="Aucun intervenant ajouté." />
                )}
                {(panneau.intervenants || []).map((inter, i) => (
                    <div 
                        key={inter.id || i} 
                        draggable={!isFieldLocked('intervenants') && !!handleDragStart} 
                        onDragStart={!isFieldLocked('intervenants') && handleDragStart ? (e) => handleDragStart(e, { type: 'intervenant', index: i }) : undefined} 
                        onDragOver={handleDragOver ? handleDragOver : undefined} 
                        onDrop={handleDrop ? (e) => handleDrop(e, { type: 'intervenant', index: i }) : undefined} 
                        className={`bg-white border border-slate-200 p-4 rounded-2xl flex justify-between items-center shadow-sm transition group ${!isFieldLocked('intervenants') && handleDragStart ? 'cursor-move hover:border-emerald-300' : ''}`}
                    >
                        <div className="flex items-center gap-4 min-w-0 flex-1 pr-4">
                            {!isFieldLocked('intervenants') && handleDragStart && (
                                <div className="w-8 h-8 flex items-center justify-center text-slate-300 group-hover:text-emerald-500 shrink-0">::</div>
                            )}
                            {(inter.logoUrl || inter.logoId) && (
                                <img src={inter.logoUrl || (window.pano_CONFIG?.apiBaseUrl + 'file/download&type=image&id=' + inter.logoId + '&preview=1')} alt="Logo" className="w-10 h-10 object-contain rounded-lg border border-slate-100 bg-white shrink-0" />
                            )}
                            <div className="min-w-0">
                                <p className="font-black text-slate-800 text-sm break-words leading-tight">{inter.name}</p>
                                <p className="text-xs text-slate-500 break-words leading-tight mt-0.5">{inter.role}</p>
                            </div>
                        </div>
                        {!isFieldLocked('intervenants') && (
                            <div className="flex gap-2 shrink-0">
                                {onEditEntity && (
                                    <Button variant="outline" shape="square" icon={EditIcon} onClick={() => onEditEntity({ type: 'intervenant', index: i }, inter)} className="p-2 border-none bg-transparent hover:bg-emerald-50 text-slate-400 hover:text-emerald-600" title="Modifier" />
                                )}
                                {deleteEntity && (
                                    <Button variant="outline" shape="round" icon={Trash2Icon} onClick={() => deleteEntity({ type: 'intervenant', index: i })} className="p-2 border-none bg-transparent hover:bg-red-50 text-slate-400 hover:text-red-600" title="Supprimer" />
                                )}
                            </div>
                        )}
                    </div>
                ))}
            </div>
        </div>
    );
};

// 2. - Composant : Lots et entreprises sous-traitantes
window.pano_PanneauEditorLots = ({
    panneau,
    lockedFields = [],
    onEditEntity,
    deleteEntity,
    handleDragStart,
    handleDragOver,
    handleDrop
}) => {
    const isFieldLocked = (field) => lockedFields.includes(field);
    
    const { PlusIcon, BuildingIcon, EditIcon, Trash2Icon, LockIcon } = window.pano_getIcons();
    const { Button, EmptyState } = window.pano_getComponents();

    return (
        <div className="space-y-6 animate-in fade-in">
            <div className="flex justify-between items-center">
                <p className="text-sm text-slate-500 font-medium flex items-center gap-2">
                    Organisez les entreprises par lot de travaux.
                    {isFieldLocked('lots') && <LockIcon size={14} className="text-amber-500" title="Verrouillé" />}
                </p>
                {!isFieldLocked('lots') && (
                    <Button variant="outline" icon={PlusIcon} onClick={() => onEditEntity({ type: 'lot' }, { name: '' })} className="bg-emerald-100 text-emerald-700 hover:bg-emerald-200 border-none shrink-0">
                        Nouveau lot
                    </Button>
                )}
            </div>
            <div className="space-y-4">
                {(!panneau.lots || panneau.lots.length === 0) && (
                    <EmptyState icon={BuildingIcon} text="Aucun lot créé." />
                )}
                {(panneau.lots || []).map((lot, lIdx) => (
                    <div 
                        key={lot.id || lIdx} 
                        draggable={!isFieldLocked('lots') && !!handleDragStart} 
                        onDragStart={!isFieldLocked('lots') && handleDragStart ? (e) => handleDragStart(e, { type: 'lot', index: lIdx }) : undefined} 
                        onDragOver={handleDragOver ? handleDragOver : undefined} 
                        onDrop={handleDrop ? (e) => handleDrop(e, { type: 'lot', index: lIdx }) : undefined} 
                        className={`bg-slate-50 border border-slate-200 rounded-3xl p-5 ${!isFieldLocked('lots') && handleDragStart ? 'cursor-move' : ''}`}
                    >
                        <div className="flex justify-between items-center mb-4 pb-3 border-b border-slate-200">
                            <div className="flex items-center gap-3 min-w-0 pr-2">
                                {!isFieldLocked('lots') && handleDragStart && <span className="text-slate-400 cursor-move shrink-0">::</span>}
                                <h4 className="font-black text-slate-800 break-words leading-tight">
                                    {lot.name}
                                </h4>
                                {lot.entreprises && lot.entreprises.length > 0 && (
                                    <span className="text-[10px] text-slate-400 font-bold ml-2">
                                        ({window.pano_formatPlural(lot.entreprises.length, 'entreprise', 'entreprises')})
                                    </span>
                                )}
                            </div>
                            {!isFieldLocked('lots') && (
                                <div className="flex gap-2 shrink-0">
                                    {onEditEntity && <Button variant="outline" shape="square" icon={EditIcon} onClick={() => onEditEntity({ type: 'lot', index: lIdx }, lot)} className="p-1.5 border-none bg-transparent hover:bg-white text-slate-500" title="Modifier" />}
                                    {deleteEntity && <Button variant="outline" shape="round" icon={Trash2Icon} onClick={() => deleteEntity({ type: 'lot', index: lIdx })} className="p-1.5 border-none bg-transparent hover:bg-red-50 text-slate-500 hover:text-red-600" title="Supprimer" />}
                                </div>
                            )}
                        </div>
                        
                        <div className="space-y-2 pl-4 border-l-2 border-emerald-100 ml-2">
                            {(lot.entreprises || []).map((ent, eIdx) => (
                                <div 
                                    key={ent.id || eIdx} 
                                    draggable={!isFieldLocked('lots') && !!handleDragStart} 
                                    onDragStart={(e) => { e.stopPropagation(); if(!isFieldLocked('lots') && handleDragStart) handleDragStart(e, { type: 'entreprise', lotIndex: lIdx, index: eIdx }); }} 
                                    onDragOver={(e) => { if(handleDragOver) handleDragOver(e); else e.preventDefault(); }} 
                                    onDrop={(e) => { e.stopPropagation(); if(handleDrop) handleDrop(e, { type: 'entreprise', lotIndex: lIdx, index: eIdx }); }} 
                                    className={`bg-white border border-slate-200 p-3 rounded-2xl flex justify-between items-center shadow-sm transition ${!isFieldLocked('lots') && handleDragStart ? 'cursor-move hover:border-emerald-300' : ''}`}
                                >
                                    <div className="flex items-center gap-3 min-w-0 flex-1 pr-4">
                                        {!isFieldLocked('lots') && handleDragStart && <span className="text-slate-300 text-xs shrink-0">::</span>}
                                        {(ent.logoUrl || ent.logoId) && (
                                            <img src={ent.logoUrl || (window.pano_CONFIG?.apiBaseUrl + 'file/download&type=image&id=' + ent.logoId + '&preview=1')} alt="Logo" className="w-8 h-8 object-contain rounded-md border border-slate-100 bg-white shrink-0" />
                                        )}
                                        <div className="min-w-0">
                                            <p className="font-bold text-sm text-slate-800 break-words leading-tight">{ent.name}</p>
                                        </div>
                                    </div>
                                    {!isFieldLocked('lots') && (
                                        <div className="flex gap-1 shrink-0">
                                            {onEditEntity && <Button variant="outline" shape="square" icon={EditIcon} onClick={() => onEditEntity({ type: 'entreprise', lotIndex: lIdx, index: eIdx }, ent)} className="p-1.5 border-none bg-transparent hover:bg-emerald-50 text-slate-400 hover:text-emerald-600" title="Modifier" />}
                                            {deleteEntity && <Button variant="outline" shape="round" icon={Trash2Icon} onClick={() => deleteEntity({ type: 'entreprise', lotIndex: lIdx, index: eIdx })} className="p-1.5 border-none bg-transparent hover:bg-red-50 text-slate-400 hover:text-red-600" title="Supprimer" />}
                                        </div>
                                    )}
                                </div>
                            ))}
                            {onEditEntity && !isFieldLocked('lots') && (
                                <Button variant="outline" icon={PlusIcon} onClick={() => onEditEntity({ type: 'entreprise', lotIndex: lIdx }, { name: '', address: '', phone: '', email: '', website: '', logoId: '', logoUrl: '' })} className="w-full mt-2 py-2 border-2 border-dashed border-slate-200 text-slate-500 hover:text-emerald-600 hover:border-emerald-300 hover:bg-white flex items-center justify-center gap-2">
                                    Ajouter une entreprise au lot
                                </Button>
                            )}
                        </div>
                    </div>
                ))}
            </div>
        </div>
    );
};

/* EOF ========== [__react/socle/_socle_editeur_acteurs.jsx] */