67 lines
2.3 KiB
JavaScript
67 lines
2.3 KiB
JavaScript
const Header = ({req}) =>{
|
|
|
|
return (
|
|
<div className="inner-container">
|
|
|
|
<div className="search-container">
|
|
|
|
{req.searchReq.map(s=>{
|
|
switch(s.type){
|
|
case "text":
|
|
return (
|
|
<div className="input-container flexcol gap06">
|
|
<div className="input-box">
|
|
<input type={s.type} id={s.id} placeholder={s.placeholder}></input>
|
|
</div>
|
|
</div>
|
|
);
|
|
case "checkbox":
|
|
return (
|
|
<div className="input-container flexrow checkbox-container">
|
|
<label for={s.id}>{s.label}</label>
|
|
<div className="input-box">
|
|
<input type={s.type} id={s.id} checked={s.checked}></input>
|
|
</div>
|
|
</div>
|
|
)
|
|
case "select":
|
|
return (
|
|
<div className="input-container flexcol gap06">
|
|
<div className="input-box">
|
|
<select name={s.id} id={s.id}>
|
|
<option value="">- 전체 -</option>
|
|
{s.option.map(op=>(
|
|
<option value={op.value}>{op.text}</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
)
|
|
|
|
}
|
|
})}
|
|
|
|
|
|
</div>
|
|
|
|
<div className="button-container">
|
|
<div className="button-box">
|
|
<button className="point-btn" disabled={req.btn["excel_down"]} id="excel_down">엑셀 양식 다운로드</button>
|
|
<input type="file" id="fileInput" hidden accept=".xlsx, .xls"></input>
|
|
<button className="point-btn" disabled={req.btn["excel_data"]} id="excel_data">엑셀 다운로드</button>
|
|
<button className="point-btn" disabled={req.btn["excel_up"]} id="excel_up">엑셀 업로드</button>
|
|
|
|
{ req.btn.addBtn ? req.btn.addBtn.map((add)=>{
|
|
return(
|
|
<button className="point-btn" disabled={add.disabled} id={add.id}>{add.value}</button>
|
|
)
|
|
}) : null }
|
|
|
|
<button className="point-btn" disabled={req.btn["filter_btn"]} id="filter_btn">조회</button>
|
|
<button className="point-btn" disabled={req.btn["put_btn"]} id="put_btn">저장</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
);
|
|
}; |