<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:uind="http://www.w3.org/1999/xhtml"
      xmlns:ctp="http://www.w3.org/1999/xhtml">
<head th:replace="_fragments :: head('POs Job Card Details')"></head>
<body>
<div class="container-fluid">
    <header class="row page-header" th:replace="_fragments :: page-header"></header>
    <main class="row page-main">
        <aside class="col-sm-2" th:replace="/reporting/po-job-card-report-sidebar :: sidebar"></aside>
        <div class="col-sm">
            <h3>PO Job Cards</h3>
            <table class="table">
                <tbody>
                <tr th:if="${allJobCard != null}" th:each="jobCard : ${allJobCard.keySet()}"
                    style="padding-bottom:10px">
                    <td class="m-0 pb-3">
                        <table class="table mb-0 table-bordered text-center">
                            <thead>
                            <tr>
                                <th colspan="10" class="text-center bg-dark text-white">
                                    <span th:text="${jobCard}"></span>
                                </th>
                            </tr>
                            <tr>
                                <th th:each="headings : ${allJobCard.get(jobCard).keySet()}" th:text="${headings}"></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>
                                    <span style="font-size: 14px; font-weight: bold;"
                                          th:text="'Total : ' + ${allJobCard.get(jobCard).get('Cutting Progress')}"></span>
                                    <br>
                                    <span style="font-size: 14px; font-weight: bold;"
                                          th:text="'Complete Products : ' + ${allJobCard.get(jobCard).get('Job Card Progress')}"></span>
                                </td>
                                <td style="font-size: 14px;" th:if="${values != 'Job Card Progress'}"
                                    th:each="values : ${allJobCard.get(jobCard).keySet()}"
                                    th:text="${allJobCard.get(jobCard).get(values)}"></td>
                            </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
                </tbody>
            </table>

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

<div th:replace="_fragments :: page-footer-scripts"></div>
</body>
</html>