Update Settings.tsx
This commit is contained in:
GitHub
@@ -135,17 +135,17 @@ export const SettingsPage: React.FC = () => {
|
||||
try { await CondoService.updateSettings(globalSettings); setSuccessMsg('Configurazione salvata!'); setTimeout(() => { setSuccessMsg(''); window.location.reload(); }, 1500); } catch (e) { console.error(e); } finally { setSaving(false); }
|
||||
};
|
||||
const handleBrandingSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault(); if (!globalSettings) return; setSaving(true);
|
||||
e.preventDefault(); if (!globalSettings) return; setSaving(true); setSuccessMsg('');
|
||||
try {
|
||||
const updated = { ...globalSettings, branding: brandingForm };
|
||||
await CondoService.updateSettings(updated);
|
||||
setGlobalSettings(updated);
|
||||
window.dispatchEvent(new Event('branding-updated'));
|
||||
setSuccessMsg('Branding salvato!'); setTimeout(() => setSuccessMsg(''), 3000);
|
||||
} catch(e) { console.error(e); } finally { setSaving(false); }
|
||||
} catch(e) { console.error(e); alert('Errore salvataggio branding'); } finally { setSaving(false); }
|
||||
};
|
||||
const handleStorageSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault(); if (!globalSettings) return; setSaving(true);
|
||||
e.preventDefault(); if (!globalSettings) return; setSaving(true); setSuccessMsg('');
|
||||
try { const updated = { ...globalSettings, storageConfig: storageForm }; await CondoService.updateSettings(updated); setGlobalSettings(updated); setSuccessMsg('Configurazione Storage salvata!'); setTimeout(() => setSuccessMsg(''), 3000); } catch (e) { console.error(e); } finally { setSaving(false); }
|
||||
};
|
||||
const handleLogoUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
@@ -221,7 +221,7 @@ export const SettingsPage: React.FC = () => {
|
||||
<Building className="w-12 h-12 text-amber-400 mx-auto mb-4" />
|
||||
<h3 className="text-xl font-bold text-amber-800 mb-2">Nessun Condominio Selezionato</h3>
|
||||
<p className="text-amber-700 mb-6">Per accedere a questa sezione devi prima creare o selezionare un condominio.</p>
|
||||
<button onClick={openAddCondoModal} className="bg-amber-600 text-white px-6 py-3 rounded-xl font-bold hover:bg-amber-700 inline-flex items-center gap-2">
|
||||
<button onClick={openAddCondoModal} className="bg-amber-600 text-white px-6 py-3 rounded-xl font-bold hover:bg-amber-700 inline-flex items-center gap-2 justify-center">
|
||||
<Plus className="w-5 h-5"/> Crea il tuo primo Condominio
|
||||
</button>
|
||||
</div>
|
||||
@@ -267,7 +267,7 @@ export const SettingsPage: React.FC = () => {
|
||||
<div><label className="text-xs font-bold text-slate-500 uppercase mb-2 block">Telefono</label><input type="tel" value={profileForm.phone} onChange={(e) => setProfileForm({...profileForm, phone: e.target.value})} className="w-full border border-slate-200 p-3 rounded-xl focus:ring-2 focus:ring-blue-500 outline-none" /></div>
|
||||
<div><label className="text-xs font-bold text-slate-500 uppercase mb-2 block">Password</label><input type="password" placeholder="Opzionale" value={profileForm.password} onChange={(e) => setProfileForm({...profileForm, password: e.target.value})} className="w-full border border-slate-200 p-3 rounded-xl focus:ring-2 focus:ring-blue-500 outline-none" /></div>
|
||||
</div>
|
||||
<div className="pt-2 border-t flex justify-between items-center"><button type="submit" disabled={profileSaving} className="bg-blue-600 text-white px-8 py-3 rounded-xl font-bold flex items-center gap-2 hover:bg-blue-700 shadow-lg shadow-blue-200 disabled:opacity-50"><Save className="w-4 h-4" /> {profileSaving ? '...' : 'Salva'}</button>{profileMsg && <p className="text-sm font-bold text-green-600">{profileMsg}</p>}</div>
|
||||
<div className="pt-2 border-t flex justify-between items-center"><button type="submit" disabled={profileSaving} className="bg-blue-600 text-white px-8 py-3 rounded-xl font-bold flex items-center justify-center gap-2 hover:bg-blue-700 shadow-lg shadow-blue-200 disabled:opacity-50"><Save className="w-4 h-4" /> {profileSaving ? '...' : 'Salva'}</button>{profileMsg && <p className="text-sm font-bold text-green-600">{profileMsg}</p>}</div>
|
||||
</form>
|
||||
</div>
|
||||
)}
|
||||
@@ -291,7 +291,12 @@ export const SettingsPage: React.FC = () => {
|
||||
<div><label className="text-xs font-bold text-slate-500 uppercase mb-2 block">Logo</label><div className="border-4 border-dashed border-slate-100 rounded-3xl p-8 text-center relative h-48 flex items-center justify-center bg-slate-50/50 hover:bg-slate-50 transition-colors"><input type="file" onChange={handleLogoUpload} className="absolute inset-0 opacity-0 cursor-pointer z-10" />{brandingForm.logoUrl ? <img src={brandingForm.logoUrl} alt="Logo" className="max-h-full max-w-full object-contain" /> : <ImageIcon className="w-12 h-12 text-slate-300"/>}</div></div>
|
||||
<div><label className="text-xs font-bold text-slate-500 uppercase mb-2 block">Sfondo Login</label><div className="border-4 border-dashed border-slate-100 rounded-3xl p-8 text-center relative h-48 flex items-center justify-center bg-slate-50/50 hover:bg-slate-50 transition-colors"><input type="file" onChange={handleBgUpload} className="absolute inset-0 opacity-0 cursor-pointer z-10" />{brandingForm.loginBackgroundUrl ? <img src={brandingForm.loginBackgroundUrl} alt="Bg" className="w-full h-full object-cover rounded-xl" /> : <Upload className="w-12 h-12 text-slate-300"/>}</div></div>
|
||||
</div>
|
||||
<div className="pt-6 border-t flex justify-end"><button type="submit" className="bg-slate-900 text-white px-10 py-4 rounded-2xl font-bold hover:bg-black shadow-xl"><Save className="w-5 h-5" /> Applica</button></div>
|
||||
<div className="pt-6 border-t flex justify-between items-center">
|
||||
<div className="flex-1">{successMsg && <span className="text-green-600 font-bold flex items-center gap-2"><CheckCircle2 className="w-5 h-5"/> {successMsg}</span>}</div>
|
||||
<button type="submit" disabled={saving} className="bg-slate-900 text-white px-10 py-4 rounded-2xl font-bold hover:bg-black shadow-xl flex items-center justify-center gap-2 disabled:opacity-50">
|
||||
{saving ? 'Salvataggio...' : <><Save className="w-5 h-5" /> Applica</>}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
)}
|
||||
@@ -308,7 +313,12 @@ export const SettingsPage: React.FC = () => {
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div className="pt-8 border-t flex justify-end"><button type="submit" className="bg-blue-600 text-white px-8 py-3 rounded-xl font-bold hover:bg-blue-700 shadow-lg">Salva</button></div>
|
||||
<div className="pt-8 border-t flex justify-between items-center">
|
||||
<div className="flex-1">{successMsg && <span className="text-green-600 font-bold flex items-center gap-2"><CheckCircle2 className="w-5 h-5"/> {successMsg}</span>}</div>
|
||||
<button type="submit" disabled={saving} className="bg-blue-600 text-white px-8 py-3 rounded-xl font-bold hover:bg-blue-700 shadow-lg flex items-center justify-center gap-2 disabled:opacity-50">
|
||||
{saving ? '...' : 'Salva'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
)}
|
||||
@@ -333,7 +343,12 @@ export const SettingsPage: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div><label className="text-xs font-bold text-slate-500 uppercase mb-2 block">PayPal Client ID</label><input type="text" value={activeCondo.paypalClientId || ''} onChange={e => setActiveCondo({...activeCondo, paypalClientId: e.target.value})} className="w-full border border-slate-200 p-3 rounded-xl text-xs font-mono" /></div>
|
||||
<div className="pt-6 border-t flex justify-end"><button type="submit" className="bg-blue-600 text-white px-8 py-3 rounded-xl font-bold hover:bg-blue-700 shadow-lg">Salva Dati</button></div>
|
||||
<div className="pt-6 border-t flex justify-between items-center">
|
||||
<div className="flex-1">{successMsg && <span className="text-green-600 font-bold flex items-center gap-2"><CheckCircle2 className="w-5 h-5"/> {successMsg}</span>}</div>
|
||||
<button type="submit" disabled={saving} className="bg-blue-600 text-white px-8 py-3 rounded-xl font-bold hover:bg-blue-700 shadow-lg flex items-center justify-center gap-2 disabled:opacity-50">
|
||||
{saving ? '...' : 'Salva Dati'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
)}
|
||||
@@ -353,7 +368,12 @@ export const SettingsPage: React.FC = () => {
|
||||
<input value={storageForm.bucket || ''} onChange={e => setStorageForm({...storageForm, bucket: e.target.value})} className="w-full border p-3 rounded-xl" placeholder="Bucket Name" />
|
||||
</div>
|
||||
)}
|
||||
<div className="pt-4 border-t flex justify-end"><button type="submit" className="bg-slate-900 text-white px-8 py-3 rounded-xl font-bold">Salva</button></div>
|
||||
<div className="pt-4 border-t flex justify-between items-center">
|
||||
<div className="flex-1">{successMsg && <span className="text-green-600 font-bold flex items-center gap-2"><CheckCircle2 className="w-5 h-5"/> {successMsg}</span>}</div>
|
||||
<button type="submit" disabled={saving} className="bg-slate-900 text-white px-8 py-3 rounded-xl font-bold flex items-center justify-center gap-2 disabled:opacity-50">
|
||||
{saving ? '...' : 'Salva'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
)}
|
||||
@@ -361,7 +381,7 @@ export const SettingsPage: React.FC = () => {
|
||||
{/* TAB LISTA CONDOMINI */}
|
||||
{activeTab === 'condos' && (
|
||||
<div className="bg-white rounded-2xl shadow-sm border border-slate-200 p-8">
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Elenco Condomini</h3><button onClick={openAddCondoModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex gap-2"><Plus className="w-4 h-4"/> Aggiungi</button></div>
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Elenco Condomini</h3><button onClick={openAddCondoModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex items-center justify-center gap-2"><Plus className="w-4 h-4"/> Aggiungi</button></div>
|
||||
<div className="grid gap-4">
|
||||
{condos.map(c => (
|
||||
<div key={c.id} className="flex items-center justify-between p-5 rounded-2xl border bg-slate-50 border-slate-100">
|
||||
@@ -382,7 +402,7 @@ export const SettingsPage: React.FC = () => {
|
||||
<>
|
||||
{!activeCondo ? <NoCondoState /> : (
|
||||
<div className="bg-white rounded-2xl shadow-sm border border-slate-200 p-8">
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Famiglie</h3><button onClick={openAddFamilyModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex gap-2"><Plus className="w-4 h-4"/> Aggiungi</button></div>
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Famiglie</h3><button onClick={openAddFamilyModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex items-center justify-center gap-2"><Plus className="w-4 h-4"/> Aggiungi</button></div>
|
||||
<div className="overflow-x-auto border border-slate-100 rounded-2xl">
|
||||
<table className="w-full text-sm text-left">
|
||||
<thead className="bg-slate-50 text-slate-500 font-bold uppercase text-[10px]"><tr><th className="px-6 py-4">Nome</th><th className="px-6 py-4">Unità</th><th className="px-6 py-4 text-right">Azioni</th></tr></thead>
|
||||
@@ -397,7 +417,7 @@ export const SettingsPage: React.FC = () => {
|
||||
{/* TAB USERS (ADMIN) */}
|
||||
{activeTab === 'users' && (
|
||||
<div className="bg-white rounded-2xl shadow-sm border border-slate-200 p-8">
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Utenti</h3><button onClick={openAddUserModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex gap-2"><Plus className="w-4 h-4"/> Aggiungi</button></div>
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Utenti</h3><button onClick={openAddUserModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex items-center justify-center gap-2"><Plus className="w-4 h-4"/> Aggiungi</button></div>
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
{users.map(u => (
|
||||
<div key={u.id} className="p-5 border border-slate-100 rounded-2xl bg-slate-50 flex items-center justify-between">
|
||||
@@ -414,7 +434,7 @@ export const SettingsPage: React.FC = () => {
|
||||
<>
|
||||
{!activeCondo ? <NoCondoState /> : (
|
||||
<div className="bg-white rounded-2xl shadow-sm border border-slate-200 p-8">
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Bacheca</h3><button onClick={openAddNoticeModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex gap-2"><Plus className="w-4 h-4"/> Pubblica</button></div>
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Bacheca</h3><button onClick={openAddNoticeModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex items-center justify-center gap-2"><Plus className="w-4 h-4"/> Pubblica</button></div>
|
||||
<div className="grid gap-4">{notices.map(n => (<div key={n.id} className="p-5 border rounded-2xl flex justify-between items-center"><div><h4 className="font-bold text-slate-800">{n.title}</h4><p className="text-sm text-slate-500 line-clamp-1">{n.content}</p></div><div className="flex gap-2"><button onClick={() => { setSelectedNoticeId(n.id); setShowReadDetailsModal(true); }} className="p-2 text-slate-500 bg-slate-50 rounded-lg"><Eye className="w-4 h-4"/></button><button onClick={() => openEditNoticeModal(n)} className="p-2 text-blue-600 bg-blue-50 rounded-lg"><Pencil className="w-4 h-4"/></button><button onClick={() => handleDeleteNotice(n.id)} className="p-2 text-red-500 bg-red-50 rounded-lg"><Trash2 className="w-4 h-4"/></button></div></div>))}</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -426,7 +446,7 @@ export const SettingsPage: React.FC = () => {
|
||||
<>
|
||||
{!activeCondo ? <NoCondoState /> : (
|
||||
<div className="bg-white rounded-2xl shadow-sm border border-slate-200 p-8">
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Alerts</h3><div className="flex gap-2"><button onClick={() => setShowSmtpModal(true)} className="bg-slate-100 text-slate-700 px-4 py-2 rounded-xl font-bold">SMTP</button><button onClick={openAddAlertModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold"><Plus className="w-4 h-4"/></button></div></div>
|
||||
<div className="flex justify-between items-center mb-8"><h3 className="text-xl font-bold text-slate-800">Alerts</h3><div className="flex gap-2"><button onClick={() => setShowSmtpModal(true)} className="bg-slate-100 text-slate-700 px-4 py-2 rounded-xl font-bold">SMTP</button><button onClick={openAddAlertModal} className="bg-blue-600 text-white px-4 py-2 rounded-xl font-bold flex items-center justify-center gap-2"><Plus className="w-4 h-4"/></button></div></div>
|
||||
<div className="grid gap-4">{alerts.map(a => (<div key={a.id} className="p-5 border rounded-2xl flex justify-between"><div><h4 className="font-bold text-slate-800">{a.subject}</h4><p className="text-xs text-slate-500">{a.daysOffset}gg {a.offsetType}</p></div><button onClick={() => handleDeleteAlert(a.id)} className="text-red-500"><Trash2 className="w-4 h-4"/></button></div>))}</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user