feat(reports): render generate-report form from OpenAPI spec
Replace hand-written GenerateReportPanel inputs with a generic loop over
extractFields("ReportQuery") + FormFieldRenderer; submit via
useResource("reports").create with server-side validation only.
react-openapi additions (all additive):
- lift items.enum into FieldConfig.enumValues for array-of-enum props
- extract schema `default` into FieldConfig.defaultValue
- new MultiEnumField renderer dispatched for isArray && enumValues
- FKFieldConfig.value: bind option values to a target property instead
of the primary key (account names); sanitize-payload skips resolveFk
when set
- new useFkFieldOptions hook encapsulating FK option loading/prefetch
- export extractFields, useFkFieldOptions, MultiEnumField
Drop now-unused granularityOptions/groupDimOptions helpers.
This commit is contained in:
@@ -6,6 +6,7 @@ import { NumberField } from "./renderers/NumberField";
|
||||
import { DateField } from "./renderers/DateField";
|
||||
import { BooleanField } from "./renderers/BooleanField";
|
||||
import { EnumField } from "./renderers/EnumField";
|
||||
import { MultiEnumField } from "./renderers/MultiEnumField";
|
||||
import { FkSelectField } from "./renderers/FkSelectField";
|
||||
import { FkMultiSelectField } from "./renderers/FkMultiSelectField";
|
||||
import { FileUploadField } from "./renderers/FileUploadField";
|
||||
@@ -81,6 +82,17 @@ export function FormFieldRenderer({ field, value, onChange, error, fkOptions, fk
|
||||
);
|
||||
}
|
||||
|
||||
if (field.isArray && field.enumValues) {
|
||||
return (
|
||||
<MultiEnumField
|
||||
field={field}
|
||||
value={value}
|
||||
onChange={onChange}
|
||||
error={error}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (field.enumValues) {
|
||||
return (
|
||||
<EnumField
|
||||
|
||||
@@ -3,4 +3,5 @@ export { ListCellRenderer } from "./ListCellRenderer";
|
||||
export { DetailFieldRenderer } from "./DetailFieldRenderer";
|
||||
export { applyDisplayFormat } from "./utils";
|
||||
export { JsonField } from "./renderers/JsonField";
|
||||
export { MultiEnumField } from "./renderers/MultiEnumField";
|
||||
export { CurrencyField, formatCurrency } from "./renderers/CurrencyField";
|
||||
|
||||
@@ -0,0 +1,59 @@
|
||||
import React from "react";
|
||||
import { Autocomplete, TextField, Chip, Box } from "@mui/material";
|
||||
import DoneIcon from "@mui/icons-material/Done";
|
||||
import type { FieldConfig } from "../../../types";
|
||||
|
||||
interface Props {
|
||||
field: FieldConfig;
|
||||
value: any;
|
||||
onChange: (value: any[]) => void;
|
||||
error?: string;
|
||||
}
|
||||
|
||||
export function MultiEnumField({ field, value, onChange, error }: Props) {
|
||||
const selected: string[] = Array.isArray(value) ? value : [];
|
||||
|
||||
return (
|
||||
<Autocomplete
|
||||
multiple
|
||||
disableCloseOnSelect
|
||||
size="small"
|
||||
options={field.enumValues ?? []}
|
||||
value={selected}
|
||||
onChange={(_, newVal) => onChange(newVal)}
|
||||
renderOption={(props, option, { selected: isSelected }) => {
|
||||
const { key, ...rest } = props as any;
|
||||
return (
|
||||
<li key={key} {...rest}>
|
||||
{isSelected ? (
|
||||
<DoneIcon sx={{ fontSize: 14, mr: 1, color: "primary.main" }} />
|
||||
) : (
|
||||
<Box sx={{ width: 22, mr: 1 }} />
|
||||
)}
|
||||
{option}
|
||||
</li>
|
||||
);
|
||||
}}
|
||||
renderTags={(tagValue, getTagProps) =>
|
||||
tagValue.map((tag, index) => {
|
||||
const { key, ...tagProps } = getTagProps({ index });
|
||||
return <Chip key={key} {...tagProps} label={tag} size="small" />;
|
||||
})
|
||||
}
|
||||
renderInput={(params) => (
|
||||
<TextField
|
||||
{...params}
|
||||
label={field.label}
|
||||
placeholder={field.description || undefined}
|
||||
error={!!error}
|
||||
helperText={error || field.description || undefined}
|
||||
size="small"
|
||||
/>
|
||||
)}
|
||||
sx={{
|
||||
"& .MuiAutocomplete-popupIndicator, & .MuiAutocomplete-clearIndicator": { width: 20, height: 20, fontSize: 16 },
|
||||
}}
|
||||
disabled={field.readOnly}
|
||||
/>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user