67 lines
2.5 KiB
JavaScript
67 lines
2.5 KiB
JavaScript
const Header = ({req}) =>{
|
|
|
|
return (
|
|
<div className="inner-container">
|
|
|
|
<div className="search-container">
|
|
|
|
{req.searchReq.map((s, sidx)=>{
|
|
switch(s.type){
|
|
case "text":
|
|
return (
|
|
<div key={'input_'+sidx} 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 key={'input_'+sidx} className="input-container flexrow checkbox-container">
|
|
<label htmlFor={s.id}>{s.label}</label>
|
|
<div className="input-box">
|
|
<input type={s.type} id={s.id} defaultChecked={s.checked}></input>
|
|
</div>
|
|
</div>
|
|
)
|
|
case "select":
|
|
return (
|
|
<div key={'input_'+sidx} className="input-container flexcol gap06">
|
|
<div className="input-box">
|
|
<select name={s.id} id={s.id}>
|
|
<option value="">- 전체 -</option>
|
|
{s.option.map((op, opidx)=>(
|
|
<option key={'op_'+opidx} 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, idx)=>{
|
|
return(
|
|
<button key={'btn_'+idx} 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>
|
|
);
|
|
}; |