fix: participant limits — red error when max < min, no save on invalid, shows 0
This commit is contained in:
@@ -45,17 +45,37 @@ export function ParticipantLimits({
|
||||
onMinChange: (v: number) => void;
|
||||
onMaxChange: (v: number) => void;
|
||||
}) {
|
||||
const [minLocal, setMinLocal] = useState(min);
|
||||
const [maxLocal, setMaxLocal] = useState(max);
|
||||
const maxError = maxLocal > 0 && minLocal > 0 && maxLocal < minLocal;
|
||||
|
||||
function handleMin(v: number) {
|
||||
setMinLocal(v);
|
||||
const newMaxError = maxLocal > 0 && v > maxLocal;
|
||||
if (!newMaxError) onMinChange(v);
|
||||
}
|
||||
|
||||
function handleMax(v: number) {
|
||||
setMaxLocal(v);
|
||||
const newMaxError = v > 0 && minLocal > 0 && v < minLocal;
|
||||
if (!newMaxError) onMaxChange(v);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
<div>
|
||||
<label className="block text-sm text-neutral-400 mb-1.5">Мин. участников</label>
|
||||
<input type="number" min={0} value={min} onChange={(e) => onMinChange(parseInt(e.target.value) || 0)} className={inputCls} />
|
||||
<input type="number" min={0} value={minLocal} onChange={(e) => handleMin(parseInt(e.target.value) || 0)}
|
||||
className={`${inputCls} ${maxError ? "!border-red-500/50" : ""}`} />
|
||||
<p className="text-[10px] text-neutral-600 mt-1">Если записей меньше — занятие можно отменить</p>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm text-neutral-400 mb-1.5">Макс. участников</label>
|
||||
<input type="number" min={0} value={max} onChange={(e) => onMaxChange(parseInt(e.target.value) || 0)} className={inputCls} />
|
||||
<p className="text-[10px] text-neutral-600 mt-1">0 = без лимита. При заполнении — лист ожидания</p>
|
||||
<input type="number" min={0} value={maxLocal} onChange={(e) => handleMax(parseInt(e.target.value) || 0)}
|
||||
className={`${inputCls} ${maxError ? "!border-red-500/50" : ""}`} />
|
||||
<p className={`text-[10px] mt-1 ${maxError ? "text-red-400" : "text-neutral-600"}`}>
|
||||
{maxError ? "Макс. не может быть меньше мин." : "0 = без лимита. При заполнении — лист ожидания"}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user