change size
This commit is contained in:
@@ -30,6 +30,7 @@ function MuiDatePicker({ label, value, setFieldValue, name, minDate, maxDate, he
|
|||||||
maxDate={maxDate ? new Date(maxDate) : null}
|
maxDate={maxDate ? new Date(maxDate) : null}
|
||||||
slotProps={{
|
slotProps={{
|
||||||
textField: {
|
textField: {
|
||||||
|
size: 'small',
|
||||||
error: error,
|
error: error,
|
||||||
placeholder: placeholder,
|
placeholder: placeholder,
|
||||||
InputProps: {
|
InputProps: {
|
||||||
@@ -60,9 +61,9 @@ function MuiDatePicker({ label, value, setFieldValue, name, minDate, maxDate, he
|
|||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<FormHelperText id="component-helper-text" sx={{ ml: 2, color: error ? "#d32f2f" : "unset" }}>
|
{/* <FormHelperText id="component-helper-text" variant="caption" sx={{ ml: 2, color: error ? "#d32f2f" : "unset", fontWeight: 'bold' }}>
|
||||||
{helperText ? helperText : ""}
|
{helperText ? helperText : ""}
|
||||||
</FormHelperText>
|
</FormHelperText> */}
|
||||||
</LocalizationProvider>
|
</LocalizationProvider>
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,46 +1,32 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { FormControl, FormHelperText, InputLabel, MenuItem, OutlinedInput, Select, Typography } from "@mui/material";
|
import { FormControl, FormHelperText, InputLabel, MenuItem, OutlinedInput, Select, Typography } from "@mui/material";
|
||||||
import { useEffect, useMemo } from "react";
|
function CustomSelect({ column, filterParameters, defaultFilterTranslation, handleChange }) {
|
||||||
|
|
||||||
function CustomSelect({ column, dependencyFieldValue, filterParameters, defaultFilterTranslation, handleChange }) {
|
|
||||||
const columnSelectOption = useMemo(() => {
|
|
||||||
return column?.columnSelectOption?.(dependencyFieldValue) || [];
|
|
||||||
}, [dependencyFieldValue]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const isValidValue = columnSelectOption.some((option) => option.value === filterParameters.value);
|
|
||||||
if (!isValidValue) {
|
|
||||||
handleChange({ ...filterParameters, value: "" });
|
|
||||||
}
|
|
||||||
}, [columnSelectOption, filterParameters.value, handleChange]);
|
|
||||||
|
|
||||||
const isValidValue = columnSelectOption.some((option) => option.value === filterParameters.value);
|
|
||||||
const selectedValue = isValidValue ? filterParameters.value : "";
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<FormControl fullWidth sx={{ marginY: 1 }}>
|
<FormControl fullWidth sx={{ marginY: 1 }} size="small">
|
||||||
<InputLabel id={`label${column.id}`}>{column.header}</InputLabel>
|
<InputLabel id={`label${column.id}`}>{column.header}</InputLabel>
|
||||||
<Select
|
<Select
|
||||||
labelId={`label${column.id}`}
|
labelId={`label${column.id}`}
|
||||||
id={column.id}
|
id={column.id}
|
||||||
name={`${column.id}.value`}
|
name={`${column.id}.value`}
|
||||||
value={selectedValue}
|
value={filterParameters.value}
|
||||||
input={<OutlinedInput label={column.header} />}
|
input={<OutlinedInput label={column.header} />}
|
||||||
|
size="small"
|
||||||
onChange={(e) => handleChange({ ...filterParameters, value: e.target.value })}
|
onChange={(e) => handleChange({ ...filterParameters, value: e.target.value })}
|
||||||
>
|
>
|
||||||
<MenuItem value="">{column.header}</MenuItem>
|
<MenuItem value="">{column.header}</MenuItem>
|
||||||
{columnSelectOption.map((option) => (
|
{column.columnSelectOption().map((option) => (
|
||||||
<MenuItem key={option.value} value={option.value}>
|
<MenuItem key={option.value} value={option.value}>
|
||||||
{option.label}
|
{option.label}
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
))}
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
<FormHelperText>
|
{/* <FormHelperText>
|
||||||
<Typography variant="button" sx={{ color: "#155175" }}>
|
<Typography variant="caption" sx={{ color: "#155175", fontWeight: 'bold' }}>
|
||||||
نوع فیلتر: {defaultFilterTranslation}
|
نوع فیلتر: {defaultFilterTranslation}
|
||||||
</Typography>
|
</Typography>
|
||||||
</FormHelperText>
|
</FormHelperText> */}
|
||||||
</FormControl>
|
</FormControl>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,13 +12,14 @@ function CustomSelectByDependency({
|
|||||||
columnSelectOption,
|
columnSelectOption,
|
||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<FormControl fullWidth sx={{ marginY: 1 }}>
|
<FormControl fullWidth sx={{ marginY: 1 }} size="small">
|
||||||
<InputLabel id={`label${column.id}`}>{column.header}</InputLabel>
|
<InputLabel id={`label${column.id}`}>{column.header}</InputLabel>
|
||||||
<Select
|
<Select
|
||||||
labelId={`label${column.id}`}
|
labelId={`label${column.id}`}
|
||||||
id={column.id}
|
id={column.id}
|
||||||
name={`${column.id}.value`}
|
name={`${column.id}.value`}
|
||||||
value={value}
|
value={value}
|
||||||
|
size="small"
|
||||||
input={<OutlinedInput label={column.header} />}
|
input={<OutlinedInput label={column.header} />}
|
||||||
onChange={(e) => handleChange({ ...filterParameters, value: e.target.value })}
|
onChange={(e) => handleChange({ ...filterParameters, value: e.target.value })}
|
||||||
>
|
>
|
||||||
@@ -28,11 +29,11 @@ function CustomSelectByDependency({
|
|||||||
</MenuItem>
|
</MenuItem>
|
||||||
))}
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
<FormHelperText>
|
{/* <FormHelperText>
|
||||||
<Typography variant="button" sx={{ color: "#155175" }}>
|
<Typography variant="caption" sx={{ color: "#155175", fontWeight: 'bold' }}>
|
||||||
نوع فیلتر: {defaultFilterTranslation}
|
نوع فیلتر: {defaultFilterTranslation}
|
||||||
</Typography>
|
</Typography>
|
||||||
</FormHelperText>
|
</FormHelperText> */}
|
||||||
</FormControl>
|
</FormControl>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -21,7 +21,7 @@ function CustomSelectMultiple({ column, filterParameters, defaultFilterTranslati
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<FormControl fullWidth sx={{ marginY: 1 }}>
|
<FormControl fullWidth sx={{ marginY: 1 }} size="small">
|
||||||
<InputLabel htmlFor="uncontrolled-native" id={`label${column.id}`}>
|
<InputLabel htmlFor="uncontrolled-native" id={`label${column.id}`}>
|
||||||
{column.header}
|
{column.header}
|
||||||
</InputLabel>
|
</InputLabel>
|
||||||
@@ -30,6 +30,7 @@ function CustomSelectMultiple({ column, filterParameters, defaultFilterTranslati
|
|||||||
id={column.id}
|
id={column.id}
|
||||||
value={filterParameters.value}
|
value={filterParameters.value}
|
||||||
multiple
|
multiple
|
||||||
|
size="small"
|
||||||
onChange={(e) => handleChange({ ...filterParameters, value: e.target.value })}
|
onChange={(e) => handleChange({ ...filterParameters, value: e.target.value })}
|
||||||
renderValue={(selected) => (
|
renderValue={(selected) => (
|
||||||
<Box sx={{ display: "flex", flexWrap: "wrap", gap: 0.5 }}>
|
<Box sx={{ display: "flex", flexWrap: "wrap", gap: 0.5 }}>
|
||||||
@@ -46,11 +47,11 @@ function CustomSelectMultiple({ column, filterParameters, defaultFilterTranslati
|
|||||||
</MenuItem>
|
</MenuItem>
|
||||||
))}
|
))}
|
||||||
</Select>
|
</Select>
|
||||||
<FormHelperText>
|
{/* <FormHelperText>
|
||||||
<Typography variant="button" sx={{ color: "#155175" }}>
|
<Typography variant="caption" sx={{ color: "#155175", fontWeight: 'bold' }}>
|
||||||
نوع فیلتر: {defaultFilterTranslation}
|
نوع فیلتر: {defaultFilterTranslation}
|
||||||
</Typography>
|
</Typography>
|
||||||
</FormHelperText>
|
</FormHelperText> */}
|
||||||
</FormControl>
|
</FormControl>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -19,12 +19,12 @@ function CustomTextField({
|
|||||||
onBlur={handleBlur}
|
onBlur={handleBlur}
|
||||||
fullWidth
|
fullWidth
|
||||||
helperText={
|
helperText={
|
||||||
<Typography variant="button" sx={{ color: "#155175" }}>
|
<Typography variant="caption" sx={{ color: "#155175", fontWeight: 'bold' }}>
|
||||||
نوع فیلتر: {defaultFilterTranslation}
|
نوع فیلتر: {defaultFilterTranslation}
|
||||||
</Typography>
|
</Typography>
|
||||||
}
|
}
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
size="normal"
|
size="small"
|
||||||
sx={{ marginY: 1 }}
|
sx={{ marginY: 1 }}
|
||||||
InputProps={{
|
InputProps={{
|
||||||
endAdornment: (
|
endAdornment: (
|
||||||
|
|||||||
@@ -24,12 +24,12 @@ function CustomTextFieldRange({
|
|||||||
fullWidth
|
fullWidth
|
||||||
error={touched?.[`${column.id}`]?.value && Boolean(errors?.[`${column.id}`]?.value)}
|
error={touched?.[`${column.id}`]?.value && Boolean(errors?.[`${column.id}`]?.value)}
|
||||||
helperText={
|
helperText={
|
||||||
<Typography variant="button" sx={{ color: "#155175" }}>
|
<Typography variant="caption" sx={{ color: "#155175", fontWeight: 'bold' }}>
|
||||||
نوع فیلتر: {defaultFilterTranslation}
|
نوع فیلتر: {defaultFilterTranslation}
|
||||||
</Typography>
|
</Typography>
|
||||||
}
|
}
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
size="normal"
|
size="small"
|
||||||
sx={{ marginY: 1, marginRight: 1 }}
|
sx={{ marginY: 1, marginRight: 1 }}
|
||||||
/>
|
/>
|
||||||
<TextField
|
<TextField
|
||||||
@@ -45,7 +45,7 @@ function CustomTextFieldRange({
|
|||||||
value={filterParameters.value[1]}
|
value={filterParameters.value[1]}
|
||||||
fullWidth
|
fullWidth
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
size="normal"
|
size="small"
|
||||||
sx={{ marginY: 1 }}
|
sx={{ marginY: 1 }}
|
||||||
InputProps={{
|
InputProps={{
|
||||||
endAdornment: (
|
endAdornment: (
|
||||||
|
|||||||
Reference in New Issue
Block a user