@extends('layouts.print')

@section('content')
<style>
	.container {
		width: 215mm !important;
		margin-top: 10px;
	}

	.panelBody {
		font-family: 'Khmer OS Content' !important;
	}

	.contract-title {
		font-family: 'Khmer OS Content' !important;
	}
	.letter-bold {
		font-weight: bold !important;
	}
	b {
		padding: 0 20px !important;
	}
	.colorsd {
		color: blue !important;
	}
	.line_hight {
		line-height:25px;
	}
    table tr td.vertical {
        vertical-align:middle !important;
        text-align: center !important;
    }
    table.table-bordered tr th,table.table-bordered tr td{
        /* border: 1px rgb(117, 114, 114) solid !important; */
    }
    .table_contract td{
            border-top: 1px solid rgba(0,0,0,0.4)!important;
            border: 1px solid rgba(0,0,0,0.4);
        }
</style>
<div class="content-wrapper">
	<div class="box">
		<div class="content">
			<div class="container">
				<div class="page">
					<div id="exportContent">
						<div id="panelPrint">
							<div class="panelBody">
								<div class="bg_image">
									<br>
                                    <div><button class="btn btn-primary hidden-print pull-right" onclick="myFunction()"><span class="glyphicon glyphicon-print" aria-hidden="true"></span> Print</button></div>

                                    <table width="100%" align="center">
                                        <tr>
                                            <td class="line_hight">
                                                <div style="text-align:center;font-family: 'Khmer OS Muol Light';">
                                                    <span style="font-size: 18px;">ឧបសម្ព័ន្ធ ០១</span><br/>
                                                    <span>តារាងដំណាក់កាលទូទាត់ប្រាក់</span>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="line_hight">
                                                <table class="table table-bordered1 table_contract">
                                                    <tr>
                                                        <td colspan="6" class="text-center">{{ $construction_info->type_of_house }}</td>
                                                    </tr>
                                                    <tr>
                                                        <td style="text-align: center;" class="vertical">ល.រ</td>
                                                        <td style="text-align: center;" class="vertical">ជាន់</td>
                                                        <td style="text-align: center;" class="vertical">ប្រភេទការងារដែលត្រូវបញ្ចប់</td>
                                                        <td style="text-align: center;" class="vertical">ទឹកប្រាក់ដែលត្រូវទទួលបាន</td>
                                                        <td style="text-align: center;" class="vertical">ហត្ថលេខាអ្នកប្រគល់ប្រាក់</td>
                                                        <td style="text-align: center;" class="vertical">ហត្ថលេខាអ្នកទទួលប្រាក់</td>
                                                    </tr>
                                                    <?php $total_amount = 0;$count = 0; ?>
                                                    @foreach($constructor_tasks_title as $key=>$val)
                                                        <?php
                                                        $constructor_tasks = DB::table('nso007_task_contractor_work_construction')->where("construction_id",$val->construction_id)->where("title",$val->title)->orderBy("id")->get();
                                                        ?>
                                                        @if(!empty($constructor_tasks))

                                                            @foreach($constructor_tasks as $k=>$value)

                                                                <?php $total_amount += $value->amount;$count++; ?>

                                                                @if($k==0)

                                                                    <tr class="row-span-row">
                                                                        <td class="vertical">{{ ($k+1) }}</td>
                                                                        <td rowspan = "{{ count($constructor_tasks) }}" class="vertical rowspan">{{ $value->title }}</td>
                                                                        <td>
                                                                            {{ $value->name }}
                                                                        </td>
                                                                        <td class="vertical">
                                                                            ${{ number_format($value->amount,2) }}
                                                                        </td>
                                                                        <td></td>
                                                                        <td></td>
                                                                    </tr>

                                                                @else
                                                                    <tr>
                                                                        <td class="vertical">{{ ($k+1) }}</td>
                                                                        <td>
                                                                            {{ $value->name }}
                                                                        </td>
                                                                        <td class="vertical">
                                                                            ${{ number_format($value->amount,2) }}
                                                                        </td>
                                                                        <td></td>
                                                                        <td></td>
                                                                    </tr>
                                                                @endif

                                                            @endforeach
                                                        @endif
                                            
                                                    @endforeach
                                                    <tr>
                                                        <td colspan="3" class="vertical">សរុបទឹកលុយ</td>
                                                        <td class="vertical">
                                                            ${{ number_format($total_amount,2) }}
                                                        </td>
                                                        <td colspan="2"></td>
                                                    </tr>
                                                </table>
                                                <div style="text-align: right;">ធ្វើនៅភ្នំពេញថ្ងៃទី.............ខែ..............ឆ្នាំ 20........</div>
                                                <br>
                                                <div>

                                                    <div class="row" align="center">

                                                        <div class="col-xs-4"  align="left" style="font-family: 'Khmer OS Muol Light'">&nbsp;</div>

                                                        <div class="col-xs-4"  align="center" style="font-family: 'Khmer OS Muol Light'">
                                                            <div style="text-align: left;">
                                                                ស្នាមមេដៃស្តាំភាគី “ក”
                                                            </div>
                                                        </div>

                                                        <div class="col-xs-4"  align="center" style="font-family: 'Khmer OS Muol Light'">
                                                            <div style="text-align: left;">
                                                                ស្នាមមេដៃស្តាំភាគី “ខ”
                                                            </div>
                                                        </div>

                                                    </div>

                                                    <div class="row" align="center">

                                                        <div class="col-xs-4" >
                                                            <br/><br/><br/><br/><br/><br/><br><br><br/>
                                                            <div style="font-family: 'Khmer OS Muol Light';text-align: left;">
                                                                ចំលងជូន
                                                            </div>
                                                            <div style="text-align: left;margin-left:15px;">
                                                                - គណនេយ្យជាង
                                                                <br/>
                                                                - ប្រធានគម្រោង
                                                                <br/>
                                                                - អ្នកម៉ៅការ
                                                                <br/>
                                                                - ប្រធានការដ្ឋាន
                                                            </div>
                                                        </div>
                                                        <div class="col-xs-4" >
                                                            <div style="text-align: left;font-family: 'Khmer OS Muol Light'">
                                                                <br/><br/><br/><br/><br>
                                                                តំណាងក្រុមហ៊ុន ថៃ ឈុនគ្រី
                                                                <br/>
                                                                ឈ្មោះ...........................................
                                                                <br/>
                                                                លេខទូរស័ព្ទ៖...............................
                                                            </div>
                                                        </div>

                                                        <div class="col-xs-4" >
                                                            <div style="text-align: left;font-family: 'Khmer OS Muol Light'">
                                                                <br/><br/><br/><br/><br>
                                                                អ្នកម៉ៅការ
                                                                <br/>
                                                                ឈ្មោះ...........................................
                                                                <br/>
                                                                លេខទូរស័ព្ទ៖...............................
                                                            </div>
                                                        </div>

                                                    </div>

                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<div class="divFooter" style="text-align: left; width: 100%;">
    <div style="text-align:right;font-size: 90%;color:#58ACFA"><i>Borey Thai Chhunkry - The House You Dream</i></div>
</div>

@endsection
<style>

    /* div.divFooter:after {
        counter-increment: page !important;
        content:"ទំព័រ " counter(page) !important;
    } */
    @media screen {
          div.divFooter {
            visibility: hidden !important;
          }
    }
    @media print {
      div.divFooter {
        position: fixed;
        bottom: 1;
        margin-bottom: -3px !important;
         display: block !important;

      }
       div.divFooter div{
           color: #58ACFA !important;
       }
       .panelBody{
           font-size: 15px !important;
           line-height: 28px !important ;
       }
       .panelBody tr td{
           font-size: 15px !important;
           line-height: 28px !important ;
       }
       table tr td.vertical {
            vertical-align:middle !important;
            text-align: center !important;
            page-break-inside:auto
        }
        tr{
            page-break-inside:avoid; 
            page-break-after:auto;
        }
       
    }
</style>
@section('script')
<script>
   
    function myFunction() {
        window.print();
    }
    $(document).ready(function(){
        updateTableStyle();
    });
    function updateTableStyle(){
        let height = $('.table_contract').css('height');
        height = height.replace('px','');
        height = height?parseFloat(height):0;
        let last_row = $('.row-span-row:last');
        let index = last_row.index();
        index = index?parseFloat(index):0;
        if(height>700){
            $('.table_contract tr:nth-child('+index+')').after('<tr style="border:none!important"><td colspan="6" style="border:none!important"></td></tr>');
        }
       
    }
</script>
@endsection