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";
interface BoardListTableHeaderProps {
params: SearchParams;
onChange: (params: SearchParams) => void
}
export function BoardListTableHeader({params, onChange}: 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: '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>번호</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>
</>
)
}