KRBL/WhiteNightsAdminPanel
10
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add search for select into LinkedItems component

Browse Source
This commit is contained in:
maxim 2025-03-19 18:33:04 +03:00
parent afa94b999c
commit e35818df63
1 changed files with 13 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/LinkedItems.tsx
View File

@ -1,5 +1,5 @@
import {useState, useEffect} from 'react' import {useState, useEffect} from 'react'
import {Stack, Typography, Button, MenuItem, Select, FormControl, InputLabel, Grid, Box, Accordion, AccordionSummary, AccordionDetails, useTheme, TextField} from '@mui/material' import {Stack, Typography, Button, FormControl, Grid, Box, Accordion, AccordionSummary, AccordionDetails, useTheme, TextField, Autocomplete} from '@mui/material'
import ExpandMoreIcon from '@mui/icons-material/ExpandMore' import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
import axios from 'axios' import axios from 'axios'
import {BACKEND_URL} from '../lib/constants' import {BACKEND_URL} from '../lib/constants'
@ -172,17 +172,18 @@ export const LinkedItems = <T extends {id: number; [key: string]: any}>({parentI
{type === 'edit' && ( {type === 'edit' && (
<Stack gap={2}> <Stack gap={2}>
<Typography variant="subtitle1">Добавить {title}</Typography> <Typography variant="subtitle1">Добавить {title}</Typography>
<FormControl fullWidth> <Autocomplete
<InputLabel>Выберите {title}</InputLabel> fullWidth
<Select value={selectedItemId || ''} onChange={(e) => setSelectedItemId(e.target.value as number)} label={`Выберите ${title}`}> value={availableItems.find((item) => item.id === selectedItemId) || null}
{availableItems.map((item) => ( onChange={(_, newValue) => setSelectedItemId(newValue?.id || null)}
<MenuItem key={item.id} value={item.id}> options={availableItems}
{/* {fields.map((field) => item[field.data]).join(' - ')} */} getOptionLabel={(item) => String(item[fields[0].data])}
{item[fields[0].data]} renderInput={(params) => <TextField {...params} label={`Выберите ${title}`} fullWidth />}
</MenuItem> isOptionEqualToValue={(option, value) => option.id === value?.id}
))} filterOptions={(options, {inputValue}) => {
</Select> return options.filter((option) => String(option[fields[0].data]).toLowerCase().startsWith(inputValue.toLowerCase()))
</FormControl> }}
/>
{childResource === 'article' && ( {childResource === 'article' && (
<FormControl fullWidth> <FormControl fullWidth>