<style>
    @media (min-width: 768px) {
        .form-horizontal .form-group {
            margin-right: -10px;
            margin-left: -10px;
        }
    }

    table i {
        font-size: 18px;
        margin: 5px
    }

    .remove {
        color: #ec0000;
        font-size: 22px;

    }

    .edit {
        color: green
    }

    .detail {
        color: #0e7fd9
    }

    .billtable thead>tr>th {
        color: #eeecda;
        background-color: #0081a8;
    }
    
    .billtable thead>tr>th.dangerBlnc {
        color: #eeecda;
        background-color: #d42424;
    }

    .billtable tfoot>tr>th {
        color: #eeecda;
        background-color: #0081a8;
    }

    .data-search {
        margin: 10px 15px 0;
    }

    .btn-dark {
        color: #fff;
        background-color: #636262;
        border-color: #646464;
        margin-bottom: 15px
    }

    .data-search .form-control {
        border-radius: 3px
    }

    .card {
        box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
        padding: 10px;
        margin: 20px 0;
        border-radius: 5px
    }
    

    @media print {
        .print-flex {
            display: flex !important;
            align-items: flex-start;
        }

        .titleDiv {
            flex-shrink: 0;
        }

        .print-image {
            position: absolute !important;
            left: 20px !important;
            width: 80px !important;
            margin-top: 10px !important;
            /* flex-shrink: 0; */
        }

        .col-lg-offset-3 {
            margin-right: 25% !important;
        }

        .totalstable {
            margin: 0 auto !important;
            width: auto !important;
        }
        .billtable thead>tr>th.dangerBlnc {
            background-color: #d42424 !important;
            color: #fff !important;
            -webkit-print-color-adjust: exact !important;
            print-color-adjust: exact !important;
        }
    }
</style>


<div class="row">

    <div class="container">


        <ol class="breadcrumb">
            <li><a href="#">المشروعات</a></li>
            <li><a href="projectreportControllerdetail.php">تقرير المشروعات مفصل</a></li>
            <li class="active">عرض</li>
        </ol>

        <div class="panel panel-default panel-m">
            <div class="panel-heading">
                <h3 class="panel-title hidden-print"> عرض تقرير المشروعات مفصل - {$projectName[0]} - {$projectName[1]} </h3>
                <a href="{$youtubes[242]->url}" target="_blank" class="hidden-print"><img
                        src="../views/default/assets/img/youtube.png" class="pull-left" alt="Youtube"
                        style="width: 2%;"></a>
            </div>

            <div class="panel-body">
                <form class="form-inline hidden-print" action="projectreportControllerdetail.php" method="post">
                    <div class="data-search">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label class="sr-only">اسم المشروع</label>
                                    <input type="hidden" name="searchvalue" id="searchvalue"
                                        value="{$Programsettingdata['searchvalue']}" />
                                    <input type="text" id="projectId" name="projectId" class="select2product wdt100"
                                        data-placeholder="اختر مشروع" />
                                </div>
                                <button type="submit" class="btn btn-primary">بحث</button>
                            </div>
                        </div>
                    </div>
                </form>

                <div class="col-lg-12 print-flex" id="reportHdr" style="display: none;">
                    <div class="col-lg-6 col-lg-offset-3 titleDiv">
                        <table class="table billtable table-noborder table-black card ">
                            <thead>
                                <tr>
                                    <th>التقرير المالي لمشروع: </th>
                                    <th>{$projectName[1]}</th>
                                </tr>
                                <tr>
                                    <th>المالك: </th>
                                    <th>{$projectName[0]}</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                    <div class="col-lg-3 pull-left">
                        <img src="../views/default/images/upload/{$Programsettingdata['logo']}" class="print-image"
                            style="width: 100px;" />
                    </div>
                </div>
                <div class="clearfix"></div>
                <div class="col-lg-12">
                    <div class="col-lg-6">
                        {if $clientdebtchangeamountint}
                        <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th>رقم الوصل</th>
                                    <th> قيمة الدفعة </th>
                                    <th> رصيد قبل</th>
                                    <th>رصيد بعد</th>
                                    <th> تاريخ الايصال </th>
                                    <th>طريقة السداد</th>
                                    <th> ملحوظة</th>
                                </tr>
                            </thead>
                            <tbody>
                                {foreach $clientdebtchangeData as $clientdebtchange}
                                <tr>
                                    <td>{$clientdebtchange.clientdebtchangeid}</td>
                                    <td>{$clientdebtchange.clientdebtchangeamount}</td>
                                    <td>{$clientdebtchange.clientdebtchangebefore}</td>
                                    <td>{$clientdebtchange.clientdebtchangeafter}</td>
                                    <td>{$clientdebtchange.clientdebtchangedate|date_format:"Y-m-d"}</td>
                                    <td>{if $clientdebtchange.tablename eq "depositcheckController.php"}بنك{else}كاش{/if}</td>
                                    <td>{$clientdebtchange.comment}</td>
                                </tr>
                                {/foreach}
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th colspan="7" style="background:#000 ">مدفوعات للمشروع
                                        {$clientdebtchangeamountint}</th>
                                </tr>
                            </tfoot>
                        </table>
                        {/if}
                        {if $allincomeValue}
                        <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th colspan="5" style="background:#000 ">الايرادات {$allincomeValue}</th>

                                </tr>
                                <tr>
                                    <th>اسم الايراد</th>
                                    <th>التصنيف الرئيسي</th>
                                    <th>قيمة الايراد</th>
                                    <th> التاريخ </th>
                                    <th> التعليق</th>
                                </tr>
                            </thead>
                            <tbody>

                                {foreach $incomeData as $income}
                                <tr>
                                    <td>{$income.incomeName}</td>
                                    <td>{$income.incomeTypeName}</td>
                                    <td>{$income.incomeValue}</td>
                                    <td>{$income.incomeDate}</td>
                                    <td>{$income.incomeDetails}</td>
                                </tr>

                                {/foreach}
                            </tbody>

                        </table>
                        {/if}


                        {if $projectexchmaterialreturn}
                        <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th colspan="3" style="background:#000 ">مرتجع صرف مواد للمشروع
                                        {$projectexchmaterialreturntotal}</th>

                                </tr>
                                <tr>
                                    <th>التاريخ</th>
                                    <th> القيمه </th>
                                    <th> المنتجات </th>
                                </tr>
                            </thead>
                            <tbody>
                                {foreach $projectexchmaterialreturn as $projectexchmaterialretur}
                                <tr>
                                    <td>{$projectexchmaterialretur.sysdate}</td>
                                    <td>{$projectexchmaterialretur.totalbuyprice}</td>
                                    <td>{foreach $projectexchmaterialretur->proname as $pro}
                                        {$pro.productName} - كميه {$pro.pronumber} - السعر
                                        {$pro.probuyprice} /
                                        {/foreach}
                                    </td>
                                </tr>
                                {/foreach}
                            </tbody>
                        </table>
                        {/if}


                    </div>

                    <div class="col-lg-6">
                        {if $projectexchmaterial}
                        <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th colspan="3" style="background:#000 ">صرف مواد للمشروع
                                        {$projectexchmaterialtotal}</th>

                                </tr>
                                <tr>
                                    <th>التاريخ</th>
                                    <th> القيمه </th>
                                    <th> المنتجات </th>
                                </tr>
                            </thead>
                            <tbody>
                                {foreach $projectexchmaterial as $projectexchmateria}
                                <tr>
                                    <td>{$projectexchmateria->sysdate}</td>
                                    <td>{$projectexchmateria->totalbuyprice}</td>
                                    <td>{foreach $projectexchmateria->proname as $pro}
                                        {$pro.productName} - كميه {$pro.pronumber} - السعر
                                        {$pro.probuyprice} /
                                        {/foreach}
                                    </td>
                                </tr>
                                {/foreach}
                            </tbody>
                        </table>
                        {/if}


                        {if $expenseexchanges}
                        <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th colspan="3" style="background:#000 ">صرف مصروف {$sumexpenseexchanges.totals}
                                    </th>

                                </tr>
                                <tr>
                                    <th>التاريخ</th>
                                    <th colspan="2"> القيمه </th>

                                </tr>
                            </thead>
                            <tbody>
                                {foreach $expenseexchanges as $expenseexchange}
                                <tr>
                                    <td>{$expenseexchange.sysdate}</td>
                                    <td colspan="2">{$expenseexchange.thevalue}</td>

                                </tr>
                                {/foreach}
                            </tbody>
                        </table>
                        {/if}


                        {if $expensesData}
                        <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th> المبلغ </th>
                                    <th> بند الصروف </th>
                                    <th> بيان الصرف</th>
                                    <th>التاريخ</th>

                                </tr>
                            </thead>
                            <tbody>
                                {foreach $expensesData as $expenses}
                                <tr>
                                    <td>{$expenses.expensesValue}</td>
                                    <td>{$expenses.expensestypename}</td>
                                    <td>{$expenses.expensesdetails}</td>
                                    <td>{$expenses.expensesdate}</td>
                                </tr>

                                {/foreach}
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th colspan="2" style="background:#000 ">مصروفات المشروع </th>
                                    <th colspan="2">{$allexpensesValue}</th> 
                                </tr>
                            </tfoot>
                        </table>
                        {/if}

                        {if $finalsupervisions}
                        <!-- <table class="table billtable table-bordered table-black card ">
                            <thead>
                                 <tr >
                                <th colspan="3" style="background:#000 ">الاشراف</th>
                                   
                                </tr>
                                
                            </thead>
                            <tbody>
                                <tr>
                                    <td colspan="3">{$finalsupervisions}</td>
                                    
                                </tr>                               
                            </tbody>
                        </table> -->
                        {/if}
                        {if $supplierdebtchangeData}
                        <!-- <table class="table billtable table-bordered table-black card ">
                            <thead>
                                <tr>
                                    <th colspan="3" style="background:#000 "> الدفعات {$allsupplierdebtchangeamountv}
                                    </th>

                                </tr>
                                <tr>

                                    <th> المبلغ </th>
                                    <th>التاريخ</th>
                                    <th> التعليق</th>

                                </tr>
                            </thead>
                            <tbody>
                                {foreach $supplierdebtchangeData as $supplierdebtchange}
                                <tr>
                                    <td>{$supplierdebtchange.supplierdebtchangeamount}</td>
                                    <td>{$supplierdebtchange.supplierdebtchangedate}</td>
                                    <td>{$supplierdebtchange.comment}</td>
                                </tr>

                                {/foreach}
                            </tbody>

                        </table> -->
                        {/if}
                    </div>
                </div>
                
                <div class="clearfix"></div>
                
                <div class="col-lg-12">
                    <div class="col-lg-6">
                        {assign var="balance" value="{$proMasrofat - $clientPaids}"}
                    <table class="table billtable table-bordered table-black card totalstable" style="margin: 0 auto;">
                        <thead>
                            <tr>
                                <th>إجمالي الدفعات </th>
                                <th>{$proMasrofat}</th>
                            </tr>
                            <!--<tr>-->
                            <!--    <th>إجمالي نسبة الإشراف </th>-->
                            <!--    <th>{$finalsupervisions}</th>-->
                            <!--</tr>-->
                            <tr>
                                <th>إجمالي المصروفات ونسبة الإشراف</th>
                                <th>{$clientPaids}</th>
                            </tr>
                            <tr>
                                <th {if $balance < 0} class="dangerBlnc" {/if}>رصيد المشروع </th>
                                <th {if $balance < 0} class="dangerBlnc" {/if}>{$balance}</th>
                            </tr>
                        </thead>
                    </table>
                    </div>
                    <!-- <div class="col-lg-12"> 
                                <button type="button" class="btn btn-dark ft-nor" style="font-size: 20px" >
                            المدفوعات: {$proMasrofat} - المصروفات: {$clientPaids} - الرصيد: {$proMasrofat - $clientPaids}</button></div> -->
                    <!-- <div class="col-lg-6"><button type="button" class="btn btn-dark ft-nor" style="font-size: 20px" > </button> </div> -->
                </div>
                <!-- {if $txt}
                <div class="col-lg-12" style="text-align: center;">
                        <button type="button" class="btn btn-dark ft-nor" style="font-size: 20px" >
                            {$txt} <span class="badge wht-clo">
                                <div >{$operation}</div>
                            </span>
                        </button>
                   
                </div>
                {/if} -->

                <div class="clearfix"></div>
                <hr />
                <div class="hidden-print">
                    <div class="col-lg-12">
                        <div class="form-group">
                            <div class="col-lg-4">
                                <button type="button" id="prntReport" class="btn btn-success pull-right">طباعة</button>
                            </div>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div> <!-- end of panel-body-->

        </div> <!-- end of panel panel-default-->

    </div> <!-- end of container-->

</div> <!-- end of row-->


{literal}
<script>
    $(document).ready(function () {
        $('.dataTableClass22').dataTable({
            "order"
                : [
                    [4, "desc"]       // order by drug cat
                ]
        });

        $('#prntReport').click(function () {
            $("#reportHdr").show();
            print_Custom('mycustomheader');
            $("#reportHdr").hide();
        });
    });
</script>
{/literal}