<div class="page-content-wrapper">
    <div class="page-content">
        <form role="form" class="hidden-print" id="new_operation_form" action="{$hosturl}/controllers/operations_reports.php" method="post">
            <div class="row">
                <div class="col-md-4" style="margin-bottom: 20px;">
                    <div class="form-group">
                        <label class="col-md-3 txtl">Date</label>
                        <div class="col-md-9">
                            <input type="text" class="form-control notPop datepicker" name="choose_date" id="date" value="{$today}" required="required"/>
                        </div>
                    </div>
                </div>
                <div class="col-md-2">
                    <button type="submit" class="btn btn-sm btn-primary">Filter</button>
                    <button type="button" id="print_page" class="btn btn-sm btn-success">Print</button>
                    {*                    <a href="{$hosturl}/controllers/operations_reports.php?ac=exportPDF" class="btn btn-sm btn-success">Export PDF</a>*}
                </div>
            </div>
        </form>
        <div class="row">
            <div class="col-md-12" id="list_container">
                <!-- BEGIN EXAMPLE TABLE PORTLET-->
                <div class="portlet box blue">
                    <div class="portlet-title hidden-print">
                        <div class="caption">
                            <i class="fa fa-users"></i>Rooms Report
                        </div>
                    </div>
                    <div class="portlet-body all">

                        <!--Begin Semen-->

                        <div class="row">
                            <table class="table mt-15 dir-ar" style="border-top: 1px solid #aaa;">
                                <thead>
                                <tr class="tr-p-10">
                                    <th rowspan="2">التوقيت</th>
                                    {foreach $floors as $floor}
                                        <th colspan="{$floor.rooms|@count}">{$floor.text}</th>
                                    {/foreach}
                                </tr>
                                <tr class="tr-p-10" style="border-top: 1px solid">
                                    {foreach $floors as $floor}
                                        {foreach $floor.rooms as $room}
                                            <th>{$room.text}</th>
                                        {/foreach}
                                    {/foreach}
                                </tr>
                                </thead>
                                <tbody>
                                {foreach $hours as $hour}
                                    <tr style="font-size: 11px" class="bg-ddd">
                                        <td style="padding: 5px;background: #FFF;direction: ltr">
                                            {$hour.start|date_format:'h:i A'}-{$hour.end|date_format:'h:i A'}
                                        </td>
                                        {foreach $floors as $floor}
                                            {foreach $floor.rooms as $room}
                                                {if $room.operations[$hour.id]|@count <= 0}
                                                    <td style="padding: 5px;background: #FFF;"></td>
                                                {else}
                                                    <td style="padding: 5px;">
                                                    {foreach $room.operations[$hour.id] as $operation}
                                                        {if $operation.doctor eq 'continue'}
                                                            <div style="width: 100%;height: 26px;background: #ddd;"></div>
                                                        {else}
                                                            {$operation.doctor} {$operation.operation_type}
                                                        {/if}
                                                    {/foreach}
                                                    </td>
                                                {/if}
                                            {/foreach}
                                        {/foreach}
                                    </tr>
                                {/foreach}
                                </tbody>
                            </table>
                        </div>

                    </div>

                    <!--End Semen-->


                    <div class="clearfix"></div>

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

<style>
    body {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .dir-ar {
        direction: rtl;
    }

    .mt-15 {
        margin-top: 15px !important;
    }

    .tr-p-10 th, .tr-p-10 td {
        padding: 10px !important;
    }

    .brown-tr {
        background: #f5ead2;
    }

    .blue-tr {
        background: #d6ebfd;
    }

    .rooms_report_tab .nav-tabs > li.active > a, .rooms_report_tab .nav-tabs > li.active > a:focus, .rooms_report_tab .nav-tabs > li.active > a:hover {
        color: #342d2d;
        background: beige
    }

    .table > thead > tr > th {
        border-bottom: 1px solid #aaa;
    }

    @media print {
        .bg-ddd {
            background: #DDD !important;
        }

        .bg-ddd td {
            background: #DDD !important;
        }

        .bg-ddd th {
            background: #DDD !important;
        }
    }

</style>