<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{layout/layout}">
<th:block layout:fragment="script">
    <script th:inline="javascript">
        const commonCode = [[${session.commonCode}]];
    </script>
    <script type="text/javascript" th:src="@{/js/faStatistics/crackdownStatus.js}"></script>
</th:block>
<div layout:fragment="content">
    <main class="pt-3">
        <h4>불법조업 외국어선 단속현황</h4>
        <input type="hidden" name="_csrf_header" th:value="${_csrf.headerName}"/>
        <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/>
        <div class="row mx-0">
            <div class="col-12 card">
                <div class="card-body">
                    <form method="get" th:action="@{/faStatistics/crackdownStatus}" id="icaSearchForm">
                        <input type="hidden" name="pageIndex" id="pageIndex" th:value="${searchParams.pageIndex}">
                        <div class="row justify-content-between pe-3 py-1">
                            <div class="col-auto">
                                <select class="form-select" name="rowCnt" id="rowCnt">
                                    <th:block th:each="num : ${#numbers.sequence(1,5)}">
                                        <option th:value="${num*10}" th:text="${num*10}" th:selected="${searchParams.rowCnt eq num*10}"></option>
                                    </th:block>
                                </select>
                            </div>
                            <div class="col-auto">
                                <div class="row justify-content-end">
                                    <!--<div class="col-auto">
                                        <input type="text" class="form-control form-control-sm" placeholder="사건번호" name="caseNum" th:value="${searchParams.caseNum}">
                                    </div>-->
                                    <input type="submit" class="btn btn-sm btn-primary col-auto" id="searchBtn" value="검색">
                                </div>
                            </div>
                        </div>
                    </form>
                    <div class="row justify-content-start" style="overflow: hidden; overflow-x: scroll">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th rowspan="4">연번</th>
                                <th rowspan="4">나포일시</th>
                                <th rowspan="4">위반장소</th>
                                <th rowspan="4">위반내용</th>
                                <th colspan="4">침범유형</th>
                                <th rowspan="3">NLL</th>
                                <th colspan="7">특수공무집행방해</th>
                                <th rowspan="4">사건담당경찰서</th>
                                <th colspan="2">검거기관</th>
                                <th rowspan="4">MMSI.NO(AIS)</th>
                                <th colspan="6">선박제원</th>
                                <th rowspan="3" colspan="2">선장(출생년도)</th>
                                <th rowspan="4">선종</th>
                                <th rowspan="3" colspan="2">어획물 축소기재</th>
                                <th colspan="5">범칙물</th>
                                <th colspan="2">처리현황</th>
                                <th colspan="3">담보금납부(만원)</th>
                                <th colspan="2">담보금미납(만원)</th>
                                <th colspan="10">선박처리</th>
                                <th colspan="4">직접인계</th>
                                <th colspan="6">구속</th>
                                <th colspan="6">불구속</th>
                                <th rowspan="3" colspan="4">현장조사</th>
                                <th rowspan="3" colspan="2">압송</th>
                                <th rowspan="4">영장청구 소요시간</th>
                                <th colspan="5">압수어구</th>
                            </tr>
                            <tr>
                                <th rowspan="2">무허가 조업</th>
                                <th rowspan="2">
                                    <div>특정금지</div>
                                    <div>(무허가, 정선명령위반)</div>
                                </th>
                                <th rowspan="2">
                                    <div>EEZ</div>
                                    <div>제한조건</div>
                                </th>
                                <th rowspan="2">영해침범</th>
                                <th rowspan="2">발생건수</th>
                                <th colspan="3">인적피해</th>
                                <th colspan="3">물적피해</th>
                                <th rowspan="2" colspan="2">구분</th>
                                <th rowspan="3">선명</th>
                                <th rowspan="3">톤수(톤)</th>
                                <th rowspan="3">선원(명)</th>
                                <th rowspan="3">선질</th>
                                <th rowspan="2" colspan="2">선적</th>
                                <th rowspan="3">어종</th>
                                <th rowspan="2">어획량(kg)</th>
                                <th rowspan="2">폐기량(kg)</th>
                                <th rowspan="2">위판량(kg)</th>
                                <th rowspan="2">위판금액(원)</th>
                                <th rowspan="2">조사중</th>
                                <th rowspan="2">완료</th>
                                <th rowspan="2">척수</th>
                                <th rowspan="2">납부액</th>
                                <th rowspan="3">납부일시</th>
                                <th rowspan="2">미납</th>
                                <th rowspan="2">미납금액</th>
                                <th rowspan="2">위탁관리</th>
                                <th rowspan="3">위탁시작일</th>
                                <th rowspan="3">위탁종료일</th>
                                <th rowspan="2">퇴거</th>
                                <th rowspan="2">직접인계</th>
                                <th rowspan="2">공매</th>
                                <th colspan="2">폐선</th>
                                <th rowspan="2">침몰</th>
                                <th rowspan="2">환부</th>
                                <th colspan="3">일시</th>
                                <th rowspan="3">해점</th>
                                <th rowspan="3">인계함정</th>
                                <th rowspan="3">중측인수함정</th>
                                <th rowspan="2">계</th>
                                <th rowspan="2">선장</th>
                                <th rowspan="2">향해장</th>
                                <th rowspan="2">기관장</th>
                                <th rowspan="2">선원</th>
                                <th rowspan="2">구속척수(몰수판결)</th>
                                <th rowspan="2">계</th>
                                <th rowspan="2">선장</th>
                                <th rowspan="2">향해장</th>
                                <th rowspan="2">기관장</th>
                                <th rowspan="2">선원</th>
                                <th rowspan="2">불구속척수</th>
                                <th rowspan="2">틀(타망)</th>
                                <th rowspan="2">폭(유망)</th>
                                <th rowspan="2">조(형망)</th>
                                <th rowspan="2">개(통발)</th>
                                <th rowspan="2">기타</th>
                            </tr>
                            <tr>
                                <th>피해인원</th>
                                <th>피해액(만원)</th>
                                <th rowspan="2">상세내용</th>
                                <th>발생건수</th>
                                <th>피해액(만원)</th>
                                <th rowspan="2">상세내용</th>
                                <th>단순폐선</th>
                                <th>폐선조건부공매</th>
                            </tr>
                            <tr>
                                <th>3</th>
                                <th>4</th>
                                <th>2</th>
                                <th>1</th>
                                <th>4</th>
                                <th>3</th>
                                <th>4</th>
                                <th>9000,000</th>
                                <th>4</th>
                                <th>9099,099</th>
                                <th>단속경찰서</th>
                                <th>단속함정</th>
                                <th>성</th>
                                <th>시</th>
                                <th>이름</th>
                                <th>출생년도</th>
                                <th>어종</th>
                                <th>수량</th>
                                <th>100</th>
                                <th>100</th>
                                <th>100</th>
                                <th>8888700</th>
                                <th>10</th>
                                <th>8</th>
                                <th>400</th>
                                <th>4000</th>
                                <th>10</th>
                                <th>80000</th>
                                <th>11</th>
                                <th>10</th>
                                <th>11</th>
                                <th>12</th>
                                <th>8</th>
                                <th>2</th>
                                <th>7</th>
                                <th>6</th>
                                <th>20</th>
                                <th>10</th>
                                <th>10</th>
                                <th>10</th>
                                <th>10</th>
                                <th>10</th>
                                <th>20</th>
                                <th>10</th>
                                <th>10</th>
                                <th>2</th>
                                <th>11</th>
                                <th>10</th>
                                <th>10</th>
                                <th>나포일시</th>
                                <th>석방일시</th>
                                <th>소요시간</th>
                                <th>소요시간</th>
                                <th>거리(해리)</th>
                                <th>7</th>
                                <th>8</th>
                                <th>10</th>
                                <th>11</th>
                                <th>12</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                    <div class="row justify-content">
                        <button class="btn btn-sm btn-primary col-auto" id="">관리자마감</button>
                        <button class="btn btn-sm btn-primary col-auto" id="crackdownStatusExcelDownBtn">엑셀 다운로드</button>
                        <button class="btn btn-sm btn-primary col-auto" id="crackdownStatusAddBtn">등록</button>
                    </div>

                    <!-- 페이징 -->
                    <div class="row justify-content-center">
                        <div class="col-auto">
                            <nav aria-label="Page navigation">
                                <ul class="pagination">
                                    <th:block th:if="${searchParams.pageIndex>3}">
                                        <li class="page-item" th:data-pageindex="${(searchParams.pageIndex)-3}">
                                            <a class="page-link" href="#" aria-label="Previous">
                                                <span aria-hidden="true">&laquo;</span>
                                            </a>
                                        </li>
                                    </th:block>
                                    <th:block th:each="num : ${#numbers.sequence(searchParams.startNum, searchParams.endNum)}">
                                        <li class="page-item" th:data-pageindex="${num}" th:classappend="${searchParams.pageIndex eq num?'active':''}">
                                            <a class="page-link" href="#" th:text="${num}"></a>
                                        </li>
                                    </th:block>
                                    <th:block th:if="${searchParams.maxNum>searchParams.endNum+2}">
                                        <li class="page-item" th:data-pageindex="${(searchParams.pageIndex)+3}">
                                            <a class="page-link" href="#" aria-label="Next">
                                                <span aria-hidden="true">&raquo;</span>
                                            </a>
                                        </li>
                                    </th:block>
                                </ul>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="crackdownStatusEditModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="crackdownStatusEditModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-xl modal-dialog-scrollable">
                <div class="modal-content" id="crackdownStatusEditModalContent">

                </div>
            </div>
        </div>
        <div class="modal fade" id="crackdownStatusViewModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="crackdownStatusViewModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-xl modal-dialog-scrollable">
                <div class="modal-content" id="crackdownStatusViewBody">

                </div>
            </div>
        </div>
    </main>
</div>
</html>