41 lines
1.2 KiB
JavaScript
41 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
import Box from '@mui/material/Box';
|
|
import Autocomplete from '@mui/material/Autocomplete';
|
|
import TextField from '@mui/material/TextField';
|
|
|
|
export default function ProjectSelectorBar({
|
|
projects,
|
|
selectedProject,
|
|
onSelectProject,
|
|
inactiveProjects,
|
|
}) {
|
|
const activeProjects = projects.filter(p => {
|
|
const id = p.job_no || p.official_project_code || p.id;
|
|
return !inactiveProjects.has(id);
|
|
});
|
|
|
|
return (
|
|
<Box sx={{ display: 'flex', gap: 1.5, alignItems: 'center' }}>
|
|
<Autocomplete
|
|
size="small"
|
|
sx={{ flex: 1, maxWidth: 500 }}
|
|
options={activeProjects}
|
|
value={selectedProject}
|
|
onChange={(_, v) => onSelectProject(v)}
|
|
getOptionLabel={(opt) => {
|
|
const name = opt.job_name || opt.project_name || '';
|
|
const code = opt.job_no || opt.official_project_code || '';
|
|
return name ? `${name} (${code})` : code;
|
|
}}
|
|
isOptionEqualToValue={(opt, val) =>
|
|
(opt.job_no || opt.id) === (val.job_no || val.id)
|
|
}
|
|
renderInput={(params) => (
|
|
<TextField {...params} placeholder="프로젝트 선택..." />
|
|
)}
|
|
noOptionsText="프로젝트 없음"
|
|
/>
|
|
</Box>
|
|
);
|
|
}
|