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

add checkbox with autocomplete for edit into /city and /carrier

Browse Source
This commit is contained in:
maxim 2025-02-04 17:06:33 +03:00
parent 6c251f5a7a
commit 74069250be
2 changed files with 56 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/pages/carrier/edit.tsx
View File

@ -1,29 +1,44 @@
import {Box, TextField} from '@mui/material'
import {Edit} from '@refinedev/mui'
import {Autocomplete, Box, TextField} from '@mui/material'
import {Edit, useAutocomplete} from '@refinedev/mui'
import {useForm} from '@refinedev/react-hook-form'
import {Controller} from 'react-hook-form'
export const CarrierEdit = () => {
const {
saveButtonProps,
register,
control,
formState: {errors},
} = useForm()
const {autocompleteProps: cityAutocompleteProps} = useAutocomplete({
resource: 'city',
})
return (
<Edit saveButtonProps={saveButtonProps}>
<Box component="form" sx={{display: 'flex', flexDirection: 'column'}} autoComplete="off">
<TextField
{...register('city_id', {
required: 'This field is required',
})}
error={!!(errors as any)?.city_id}
helperText={(errors as any)?.city_id?.message}
margin="normal"
fullWidth
InputLabelProps={{shrink: true}}
type="text"
label={'City ID'}
<Controller
control={control}
name="city_id"
rules={{required: 'This field is required'}}
defaultValue={null}
render={({field}) => (
<Autocomplete
{...cityAutocompleteProps}
value={cityAutocompleteProps.options.find((option) => option.id === field.value) || null}
onChange={(_, value) => {
field.onChange(value?.id || '')
}}
getOptionLabel={(item) => {
return item ? item.name : ''
}}
isOptionEqualToValue={(option, value) => {
return option.id === value?.id
}}
renderInput={(params) => <TextField {...params} label="Select City" margin="normal" variant="outlined" error={!!errors.city_id} helperText={(errors as any)?.city_id?.message} required />}
/>
)}
/>
<TextField

41
src/pages/city/edit.tsx
View File

@ -1,29 +1,44 @@
import {Box, TextField} from '@mui/material'
import {Edit} from '@refinedev/mui'
import {Autocomplete, Box, TextField} from '@mui/material'
import {Edit, useAutocomplete} from '@refinedev/mui'
import {useForm} from '@refinedev/react-hook-form'
import {Controller} from 'react-hook-form'
export const CityEdit = () => {
const {
saveButtonProps,
register,
control,
formState: {errors},
} = useForm({})
const {autocompleteProps: countryAutocompleteProps} = useAutocomplete({
resource: 'country',
})
return (
<Edit saveButtonProps={saveButtonProps}>
<Box component="form" sx={{display: 'flex', flexDirection: 'column'}} autoComplete="off">
<TextField
{...register('country_code', {
required: 'This field is required',
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{shrink: true}}
type="text"
label={'Country code'}
<Controller
control={control}
name="country_code"
rules={{required: 'This field is required'}}
defaultValue={null}
render={({field}) => (
<Autocomplete
{...countryAutocompleteProps}
value={countryAutocompleteProps.options.find((option) => option.code === field.value) || null}
onChange={(_, value) => {
field.onChange(value?.code || '')
}}
getOptionLabel={(item) => {
return item ? item.code : ''
}}
isOptionEqualToValue={(option, value) => {
return option.id === value?.id
}}
renderInput={(params) => <TextField {...params} label="Country Code" margin="normal" variant="outlined" error={!!errors.country_code} helperText={(errors as any)?.country_code?.message} required />}
/>
)}
/>
<TextField