94 lines
2.9 KiB
JavaScript
94 lines
2.9 KiB
JavaScript
import BottomSelect from "@/components/icons/BottomSelect";
|
|
import { Autocomplete, Button, TextField } from "@mui/material";
|
|
import { styleTextSelectRight } from "@/mui";
|
|
|
|
function DefaultSelect({ list, value, updateData, label, error, name }) {
|
|
return (
|
|
<Autocomplete
|
|
disablePortal
|
|
options={list}
|
|
value={value || ""}
|
|
getOptionLabel={(option) => {
|
|
if (typeof option === "string") return option;
|
|
return option?.title || option?.name || option?.label || "";
|
|
}}
|
|
className="!w-full !rounded-lg auto-complete-selector"
|
|
onChange={(_, newValue) => {
|
|
// اگر آیتم انتخاب شده باشد، کل شیء را برمیگردانیم، در غیر این صورت خالی
|
|
updateData(name, newValue || "");
|
|
}}
|
|
sx={{
|
|
...styleTextSelectRight,
|
|
// Hide Icon Number
|
|
"& input::-webkit-outer-spin-button, & input::-webkit-inner-spin-button":
|
|
{
|
|
display: "none",
|
|
},
|
|
"& input[type=number]": {
|
|
MozAppearance: "textfield",
|
|
},
|
|
"& .MuiInputBase-input": { padding: "12.5px 14px !important" },
|
|
"& .MuiInputBase-root": {
|
|
borderRadius: 2,
|
|
padding: "0 !important",
|
|
height: {
|
|
xs: "43px !important",
|
|
sm: "43px !important",
|
|
md: "46px !important",
|
|
lg: "48px !important",
|
|
},
|
|
},
|
|
"& .MuiOutlinedInput-notchedOutline": {
|
|
border: error
|
|
? "1px solid red !important"
|
|
: "1px solid #D7D7D7 !important",
|
|
},
|
|
"& .MuiInput-underline:hover:not(.Mui-disabled):before, .MuiOutlinedInput-notchedOutline":
|
|
{
|
|
borderColor: error ? "red !important" : "#D7D7D7 !important",
|
|
},
|
|
"& .muirtl-1kiro5a-MuiInputBase-root-MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline":
|
|
{
|
|
border: "1px solid #5559CE !important",
|
|
},
|
|
}}
|
|
renderOption={(props, option) => (
|
|
<Button
|
|
fullWidth
|
|
{...props}
|
|
key={option.id || props.id}
|
|
className="!flex !justify-start !p-[8px] !text-start !text-[#A1A1A1] hover:dark:!bg-[#35343D] !bg-[#FFF] dark:!bg-[#1F1D2B]"
|
|
>
|
|
{option.title || option.name || option.label}
|
|
</Button>
|
|
)}
|
|
renderInput={(params) => (
|
|
<TextField
|
|
fullWidth
|
|
{...params}
|
|
InputProps={{
|
|
...params.InputProps,
|
|
endAdornment: (
|
|
<div className="absolute left-4">
|
|
<BottomSelect />
|
|
</div>
|
|
),
|
|
}}
|
|
placeholder={label}
|
|
error={!!error}
|
|
helperText={error || ""}
|
|
sx={{
|
|
borderRadius: "8px",
|
|
"& .MuiFormHelperText-root": {
|
|
marginLeft: "0",
|
|
marginRight: "14px",
|
|
},
|
|
}}
|
|
/>
|
|
)}
|
|
/>
|
|
);
|
|
}
|
|
|
|
export default DefaultSelect;
|