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 {useTableSort} from "../../../hook/useTableSort.ts";
import type {SearchParams} from "../../../../type/searchParams.ts";
import {CheckBox} from "../../../component/checkbox/CheckBox.tsx";
import {SortableHeaderCell} from "../../../component/table/SortableHeaderCell.tsx";
interface ContentListTableHeaderProps {
params: SearchParams;
onChange: (params: SearchParams) => void
checked: boolean
indeterminate: boolean
onCheckAll: (checked: boolean) => void
}
export const ContentListTableHeader = ({
params,
onChange,
checked,
indeterminate,
onCheckAll
}: ContentListTableHeaderProps) => {
const {handleSort, getSortIcon, isSorted} = useTableSort(params, onChange);
return (
<>
<colgroup>
<col style={{width: "40px"}}/>
<col style={{width: "6%"}}/>
<col style={{width: "calc((54%/2) - 40px)"}}/>
<col style={{width: "calc((54%/2) - 40px)"}}/>
<col style={{width: "10%"}}/>
<col style={{width: "20%"}}/>
<col style={{width: "10%"}}/>
</colgroup>
<thead>
<tr>
<th>
<CheckBox id="contentCheckAll"
name="checkAll"
checked={checked}
onChange={onCheckAll}
indeterminate={indeterminate}/>
</th>
<SortableHeaderCell field={"cntId"} active={isSorted("cntId")} icon={getSortIcon("cntId")} onSort={handleSort}>번호</SortableHeaderCell>
<SortableHeaderCell field={"cntName"} active={isSorted("cntName")} icon={getSortIcon("cntName")} onSort={handleSort}>콘텐츠이름</SortableHeaderCell>
<SortableHeaderCell field={"menuNm"} active={isSorted("menuNm")} icon={getSortIcon("menuNm")} onSort={handleSort}>연결메뉴</SortableHeaderCell>
<SortableHeaderCell field={"registerId"} active={isSorted("registerId")} icon={getSortIcon("registerId")} onSort={handleSort}>등록자</SortableHeaderCell>
<SortableHeaderCell field={"registPnttm"} active={isSorted("registPnttm")} icon={getSortIcon("registPnttm")} onSort={handleSort}>등록일자</SortableHeaderCell>
<th scope={"col"}>미리보기</th>
</tr>
</thead>
</>
)
}