import { useState, useEffect } from 'react';
|
import {
|
useTranslate, useNotify, required
|
} from 'react-admin';
|
import { useController } from 'react-hook-form';
|
import request from '@/utils/request';
|
import { Select, MenuItem, FormControl, InputLabel } from '@mui/material';
|
|
const BasStationSelect = (props) => {
|
const { dictTypeCode, label, name, validate, ...params } = props;
|
const translate = useTranslate();
|
const notify = useNotify();
|
const [list, setList] = useState([]);
|
|
// 使用 useController 与 react-hook-form 集成
|
const { field, fieldState } = useController({
|
name: name,
|
rules: validate ? {
|
validate: (value) => {
|
for (const rule of validate) {
|
const result = rule(value);
|
if (result) return result;
|
}
|
return true;
|
}
|
} : undefined
|
});
|
|
useEffect(() => {
|
http();
|
}, [dictTypeCode]);
|
|
const http = async () => {
|
const res = await request.post('/basStation/page/v1', { current: 1, pageSize: 100 });
|
if (res?.data?.code === 200) {
|
setList(res.data.data.records.map((item) => {
|
return {
|
id: item.id.toString(),
|
name: item.stationName
|
};
|
}));
|
} else {
|
notify(res.data.msg);
|
}
|
};
|
|
const handleChange = (event) => {
|
const selectedValue = event.target.value;
|
field.onChange(selectedValue);
|
};
|
|
const validValue = list.some(item => item.id === field.value) ? field.value : '';
|
|
return (
|
<FormControl required fullWidth error={!!fieldState.error}>
|
<InputLabel id={`${name}-label`}>{label}</InputLabel>
|
<Select
|
labelId={`${name}-label`}
|
value={validValue}
|
variant="filled"
|
onChange={handleChange}
|
size='small'
|
>
|
{list.map((item) => (
|
<MenuItem
|
key={item.id}
|
value={item.id}>
|
{item.name}
|
</MenuItem>
|
))}
|
</Select>
|
</FormControl>
|
);
|
};
|
|
export default BasStationSelect;
|
