почти рабочий вариант
This commit is contained in:
@@ -139,7 +139,7 @@ const CellTargetEditor: React.FC<{
|
||||
|
||||
{/* Поле ввода ячейки */}
|
||||
<Input
|
||||
placeholder="A1"
|
||||
placeholder="A12"
|
||||
value={target.cell}
|
||||
onChange={e => handleCellInputChange(index, e.target.value)}
|
||||
className="h-6 w-16 px-2 text-xs"
|
||||
@@ -231,36 +231,6 @@ const ElementForm: React.FC<ElementFormProps> = ({ formData, setFormData }) => {
|
||||
? getElementDefinition(formData.type)
|
||||
: null
|
||||
|
||||
const handleAddOption = () => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
options: [...(prev.options || []), { value: '', label: '' }],
|
||||
}))
|
||||
}
|
||||
|
||||
const handleUpdateOption = (
|
||||
index: number,
|
||||
field: 'value' | 'label',
|
||||
value: string
|
||||
) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
options: prev.options?.map((option, i) =>
|
||||
i === index ? { ...option, [field]: value } : option
|
||||
),
|
||||
}))
|
||||
}
|
||||
|
||||
const handleRemoveOption = (index: number) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
options: prev.options?.filter((_, i) => i !== index),
|
||||
}))
|
||||
}
|
||||
|
||||
const needsOptions =
|
||||
formData.type === 'select' || formData.type === 'button_group'
|
||||
|
||||
return (
|
||||
<div className="grid h-full grid-cols-1 gap-6 lg:grid-cols-2">
|
||||
{/* Настройки элемента */}
|
||||
@@ -394,69 +364,6 @@ const ElementForm: React.FC<ElementFormProps> = ({ formData, setFormData }) => {
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Варианты для select/radio/button_group */}
|
||||
{needsOptions && (
|
||||
<Card>
|
||||
<CardHeader className="pb-3">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
<Tag className="h-4 w-4 text-orange-600" />
|
||||
<CardTitle className="text-sm">Варианты выбора</CardTitle>
|
||||
</div>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={handleAddOption}
|
||||
className="h-7 px-2 text-xs"
|
||||
>
|
||||
<Plus className="mr-1 h-3 w-3" />
|
||||
Добавить
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="max-h-32 space-y-2 overflow-y-auto">
|
||||
{formData.options?.map((option, index) => (
|
||||
<div key={index} className="flex gap-2">
|
||||
<Input
|
||||
placeholder="Значение"
|
||||
value={option.value}
|
||||
onChange={e =>
|
||||
handleUpdateOption(index, 'value', e.target.value)
|
||||
}
|
||||
className="h-8 text-xs"
|
||||
/>
|
||||
<Input
|
||||
placeholder="Подпись"
|
||||
value={option.label}
|
||||
onChange={e =>
|
||||
handleUpdateOption(index, 'label', e.target.value)
|
||||
}
|
||||
className="h-8 text-xs"
|
||||
/>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={() => handleRemoveOption(index)}
|
||||
className="h-8 w-8 text-red-600 hover:bg-red-50 hover:text-red-700"
|
||||
>
|
||||
<Trash2 className="h-3 w-3" />
|
||||
</Button>
|
||||
</div>
|
||||
))}
|
||||
{(!formData.options || formData.options.length === 0) && (
|
||||
<div className="py-4 text-center">
|
||||
<Tag className="mx-auto mb-2 h-6 w-6 text-gray-300" />
|
||||
<p className="text-xs text-gray-500">
|
||||
Добавьте варианты выбора
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Предпросмотр */}
|
||||
|
||||
Reference in New Issue
Block a user