79 lines
1.6 KiB
TypeScript
79 lines
1.6 KiB
TypeScript
import React from 'react'
|
|
import Selector, { Option } from '@/components/ui/Selector'
|
|
|
|
export interface Role {
|
|
id: number
|
|
value: string
|
|
label: string
|
|
[key: string]: string | number
|
|
}
|
|
|
|
interface RoleSelectorProps {
|
|
name: string
|
|
value: string
|
|
handleChange: (e: {
|
|
target: {
|
|
id: string
|
|
value: string
|
|
selectedOption?: Option
|
|
}
|
|
}) => void
|
|
label?: string
|
|
tooltip?: string | React.ReactNode
|
|
placeholder?: string
|
|
}
|
|
|
|
const ROLES = [
|
|
{ id: 1, value: 'engineer', label: 'Инженер' },
|
|
{ id: 2, value: 'operator', label: 'Оператор' },
|
|
{ id: 3, value: 'admin', label: 'Администратор' },
|
|
]
|
|
|
|
const RoleSelector: React.FC<RoleSelectorProps> = ({
|
|
name,
|
|
value,
|
|
handleChange,
|
|
label,
|
|
tooltip,
|
|
placeholder,
|
|
}) => {
|
|
const handleSelectorChange = (e: {
|
|
target: {
|
|
id: string
|
|
value: Option | null
|
|
selectedOption?: Option
|
|
}
|
|
}) => {
|
|
const selectedOption = e.target.value
|
|
handleChange({
|
|
target: {
|
|
id: name,
|
|
value: selectedOption?.value || '',
|
|
selectedOption: selectedOption || undefined,
|
|
},
|
|
})
|
|
}
|
|
|
|
// Находим текущее значение в списке для отображения
|
|
const currentValue = ROLES.find(role => role.value === value)
|
|
|
|
return (
|
|
<Selector<Role>
|
|
name={name}
|
|
value={currentValue}
|
|
handleChange={handleSelectorChange}
|
|
label={label}
|
|
tooltip={tooltip}
|
|
placeholder={placeholder}
|
|
mapDataToOptions={role => ({
|
|
id: role.id,
|
|
value: role.value,
|
|
label: role.label,
|
|
})}
|
|
staticOptions={ROLES}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export default RoleSelector
|