File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import type {SearchParams} from "../../../../../type/searchParams.ts";
import {CheckBox} from "../../../../component/checkbox/CheckBox.tsx";
interface BoardListTableHeaderProps {
params: SearchParams;
onChange: (params: SearchParams) => void
checked: boolean
indeterminate: boolean
onCheckAll: (checked: boolean) => void
}
export function BoardListTableHeader({
params,
onChange,
checked,
indeterminate,
onCheckAll
}: BoardListTableHeaderProps) {
const handleSort = (field: string) => {
const nextOrder =
params.searchSortCnd === field &&
params.searchSortOrd === 'ASC'
? 'DESC'
: 'ASC';
onChange({
...params,
searchSortCnd: field,
searchSortOrd: nextOrder,
pageIndex: 1,
});
};
const getSortIcon = (field: string) => {
if (params.searchSortCnd !== field) {
return '-';
}
return params.searchSortOrd === 'ASC'
? '▲'
: '▼';
};
return (
<>
<colgroup>
<col style={{width: '40px'}}/>
<col style={{width: '6%'}}/>
<col style={{width: '18%'}}/>
<col style={{width: '18%'}}/>
<col style={{width: '10%'}}/>
<col style={{width: '10%'}}/>
<col style={{width: '10%'}}/>
<col style={{width: '6%'}}/>
<col style={{width: '20%'}}/>
</colgroup>
<thead>
<tr>
<th>
<CheckBox
id="boardCheckAll"
name="checkAll"
checked={checked}
indeterminate={indeterminate}
onChange={onCheckAll}
/>
</th>
<th>번호</th>
<th>
게시판명
<button
className={`sort sortBtn ${params.searchSortCnd === 'BBS_NM' ? 'active' : ''}`}
onClick={() => handleSort('BBS_NM')}
>
{getSortIcon('BBS_NM')}
</button>
</th>
<th>
연결 메뉴
<button
className={`sort sortBtn ${params.searchSortCnd === 'MENU_NM' ? 'active' : ''}`}
onClick={() => handleSort('MENU_NM')}
>
{getSortIcon('MENU_NM')}
</button>
</th>
<th>
댓글 / 글수
<button
className={`sort sortBtn ${params.searchSortCnd === 'TOTCNT' ? 'active' : ''}`}
onClick={() => handleSort('TOTCNT')}
>
{getSortIcon('TOTCNT')}
</button>
</th>
<th>
게시판유형
<button
className={`sort sortBtn ${params.searchSortCnd === 'BBS_TY_CODE_NM' ? 'active' : ''}`}
onClick={() => handleSort('BBS_TY_CODE_NM')}
>
{getSortIcon('BBS_TY_CODE_NM')}
</button>
</th>
<th>
생성일
<button
className={`sort sortBtn ${params.searchSortCnd === 'FRST_REGIST_PNTTM' ? 'active' : ''}`}
onClick={() => handleSort('FRST_REGIST_PNTTM')}
>
{getSortIcon('FRST_REGIST_PNTTM')}
</button>
</th>
<th>
사용여부
<button
className={`sort sortBtn ${params.searchSortCnd === 'USE_AT' ? 'active' : ''}`}
onClick={() => handleSort('USE_AT')}
>
{getSortIcon('USE_AT')}
</button>
</th>
<th>게시판 관리</th>
</tr>
</thead>
</>
)
}