<!DOCTYPE html>
<html lang="ko" class="h-100"
    xmlns:th="http://www.thymeleaf.org"
    xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
    xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
  <head>
    <meta charset="UTF-8" />
    <title>해양경찰청 파일관리 시스템</title>

    <!--bootstrap-->
    <link rel="stylesheet" th:href="@{/vendor/bootstrap-5.1.3-dist/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/img/bootstrap-icons-1.7.1/bootstrap-icons.css}">
    <!--bootstrap-datepicker-->
    <link rel="stylesheet" th:href="@{/vendor/bootstrap-datepicker-1.9.0-dist/css/bootstrap-datepicker.min.css}">
    <!--summernote-->
    <link rel="stylesheet" th:href="@{/vendor/summernote-0.8.18-dist/summernote-lite.min.css}">

    <link rel="stylesheet" th:href="@{/css/common.css}">
    <!-- 컨텐츠페이지의 CSS 영역이 들어감 -->
    <th:block layout:fragment="css"></th:block>

    <!--bootstrap-->
    <script type="text/javascript" th:src="@{/vendor/bootstrap-5.1.3-dist/js/bootstrap.bundle.min.js}"></script>
    <!--jquery-->
    <script type="text/javascript" th:src="@{/vendor/jquery-3.6.0/jquery-3.6.0.min.js}"></script>
    <!--bootstrap-datepicker-->
    <script type="text/javascript" th:src="@{/vendor/bootstrap-datepicker-1.9.0-dist/js/bootstrap-datepicker.min.js}"></script>
    <script type="text/javascript" th:src="@{/vendor/bootstrap-datepicker-1.9.0-dist/locales/bootstrap-datepicker.ko.min.js}"></script>
    <!--summernote-->
    <script type="text/javascript" th:src="@{/vendor/summernote-0.8.18-dist/summernote-lite.min.js}"></script>
    <script type="text/javascript" th:src="@{/vendor/summernote-0.8.18-dist/lang/summernote-ko-KR.min.js}"></script>

    <script type="text/javascript" th:src="@{/js/common.js}"></script>
    <!-- 컨텐츠페이지의 스크립트 영역이 들어감 -->
    <th:block layout:fragment="script"></th:block>
    <th:block sec:authorize="isAuthenticated()">
      <script type="text/javascript">
        $(function (){
          /*세션 체크*/
          const positionList =  '[[${session.positionList}]]';
          const departmentList =  '[[${session.departmentList}]]';
          const categoryList =  '[[${session.categoryList}]]';
          if(!positionList && !departmentList && !categoryList){
            $.ajax({
              url: '/refreshSession',
              type: 'GET',
              success: function(){location.reload();},
              error:function(){}
            });
          }
        })
      </script>
    </th:block>
  </head>
  <body class="d-flex flex-column h-100">
    <header th:replace="fragments/header :: headerFragment"></header>
    <div class="h-100" sec:authorize="isAnonymous()" layout:fragment="content"></div>
    <div sec:authorize="isAuthenticated()" class="row mx-0">
      <div class="col-2 centerDiv border-end">
        <div th:replace="fragments/leftMenu :: leftMenuFragment"></div>
      </div>
      <div class="col-10 centerDiv">
        <div layout:fragment="content"></div>
      </div>
    </div>
    <footer th:replace="fragments/footer :: footerFragment"></footer>
  </body>
</html>