diff --git a/src/admin/settings/SettingsPage.jsx b/src/admin/settings/SettingsPage.jsx new file mode 100644 index 0000000..6eb695d --- /dev/null +++ b/src/admin/settings/SettingsPage.jsx @@ -0,0 +1,122 @@ +import { useState } from 'react'; +import { Save, DollarSign } from 'lucide-react'; +import { useSettings } from './useSettings'; + +const inputStyle = { + width: '100%', padding: '10px 12px', + background: 'var(--bg-lighter)', + border: '1.5px solid var(--border-light)', + borderRadius: '6px', + color: 'var(--text-main)', fontSize: '0.92rem', + outline: 'none', fontFamily: 'var(--font-body)', + boxSizing: 'border-box', +}; + +const labelStyle = { + display: 'block', marginBottom: '5px', + fontSize: '0.75rem', fontWeight: 700, + color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: '0.4px', +}; + +const SettingsPage = () => { + const { prices, loading, error: fetchError, updatePrice } = useSettings(); + const [form, setForm] = useState(null); + const [saving, setSaving] = useState(false); + const [savedMsg, setSavedMsg] = useState(''); + const [saveError, setSaveError] = useState(''); + + // form is null until user edits; fall back to loaded prices + const formValues = form ?? prices; + + const handleChange = (thickness, value) => { + setForm((prev) => ({ ...(prev ?? prices), [thickness]: Number(value) })); + }; + + const handleSave = async () => { + setSaving(true); + setSavedMsg(''); + setSaveError(''); + const [r200, r300] = await Promise.all([ + updatePrice('price_200', formValues[200]), + updatePrice('price_300', formValues[300]), + ]); + setSaving(false); + if (r200.error || r300.error) { + setSaveError(r200.error?.message ?? r300.error?.message ?? 'Ошибка сохранения'); + } else { + setSavedMsg('Цены сохранены'); + setTimeout(() => setSavedMsg(''), 3000); + } + }; + + if (loading) { + return
{fetchError}
+ )} + {saveError && ( +{saveError}
+ )} + {savedMsg && ( +{savedMsg}
+ )} + + +