<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.w3.org/1999/xhtml">
<head th:replace="_fragments :: head('Home Page')"></head>
<body>
<!-- sidebar starts -->
<aside class="col-sm-2" th:fragment="sidebar">
    <div class="page-filters-sidebar">
        <form th:action="@{${#strings.replace(#httpServletRequest.requestURI, #request.getContextPath(), '')}}">
            <h5 class="mb-4">Refine Your Search</h5>
            <div class="form-group"  th:with="id=${param['site-id']},title=${param['site-title']}" data-vue-app>
                <job-card-for-reporting th:attr="id=${id},title=${title}"
                                      v-bind:id-field-name="'job-card-id'"
                                      v-bind:title-field-name="'site-title'"
                ></job-card-for-reporting>
            </div>
            <input type="submit" class="btn btn-secondary btn-block" value="Search">
            <a th:href="@{${#strings.replace(#httpServletRequest.requestURI, #request.getContextPath(), '')}}"
               class="btn btn-secondary btn-block">Reset</a>
        </form>
        <div th:replace="_fragments :: page-footer-scripts"></div>
    </div>
</aside>
</body>
</html>