@extends('backend.layouts.app')
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<style>
    table thead tr th{
        font-size:11px;
    }
</style>
<script>
    $('document').ready(function(){
        var table = $('#example').DataTable({
                "bLengthChange": false,
                'ordering':false,
                initComplete: function () {
                this.api().columns([1,2]).every(function () {
                    var column = this;
                    var select = $('<select class="form-control select2"><option value="">Search</option></select>')
                        .appendTo($(column.header()).empty()).on('change', function () {
                            var val = $.fn.dataTable.util.escapeRegex($(this).val());
                            column.search(val ? '^' + val + '$' : '', true, false).draw();
                        });
                    column.data().unique().sort().each(function (d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>');
                    });
                });
            }
        });
        // $(".filterhead").each( function ( i ) {
        //     var select = $('<select class="select2" width="100%;"><option value="">Search</option></select>')
        //     .appendTo( $(this).empty() )
        //     .on( 'change', function () {
        //        var term = $(this).val();
        //         table.column().search(term, false, false ).draw();
        //     } );
 	    //      table.column().data().unique().sort().each( function ( d, j ) {
        //           console.log(j);
        //     	select.append( '<option value="'+d+'">'+d+'</option>' )
        //     } );
		// } );
        $('.select2').select2();
    }); 
</script>

@section('content')

<div class="col-xl-12">
	<div class="breadcrumb-holder">
		<h5 style="text-align: center"> Accounts Details</h5>
		    <a href="{{ route('accounts.mainPage') }}" class="btn btn-success" style="color: #000000; border: 1px solid #eee; margin: 0px auto;">
                <i class="fa fa-home" aria-hidden="true" style="font-size: 20px; "></i>
                {{-- <img src="{{ route('accounts') }}" style="width: 20px"> --}}
                    Account Dashboard
            </a>
            <a href="{{ route('logout-submit') }}" class="pull-right btn btn-danger" class="btn btn-success" style="color: #000000; border: 1px solid #eee; margin: 0px auto;">
                <i class="fa fa-sign-out" aria-hidden="true" style="font-size: 20px; "></i>
                Logout
            </a>
		<ol class="breadcrumb float-right">
		</ol>
		<div class="clearfix"></div>
	</div>
</div>
<div class="container-fluid" style="margin-top: -19px;">
	<div class="col-md-12">
		<div style="text-align: right; margin-bottom: 20px;">

        </div>
        <div class="card">
            <div class="card-header" style=" display: inline-flex; ">
                <!-- <p> <b style="font-size: 15px; ">Accounts</b> </p> -->
            </div>
            <div class="card-body">		
                <div id="conditionalRow">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label>Department Name </label>
                                <input type="text" class="form-control" value="{{ $depDetails->name }}" id="department_name" placeholder="Department Name" autocomplete="off" readonly>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="box-body">
                                <div class="form-group">
                                    <label>Account No </label>
                                    <input type="text" class="form-control" value="{{ $depDetails->acc_no }}" id="acc_no" name="" placeholder="Account No" autocomplete="off" readonly>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="box-body">
                                <div class="form-group">
                                    <label>Account Name </label>
                                    <input type="text" class="form-control" value="{{ $depDetails->acc_name }}" id="acc_name" name="" placeholder="Account Name" autocomplete="off" readonly>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label>Contact Person</label>
                                <input type="text" class="form-control" value="{{ $depDetails->contact_person }}" id="contact_person"  name="" placeholder="Contact Person" autocomplete="off" readonly>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label>Telephone</label>
                                <input type="text" class="form-control" value="{{ $depDetails->telephone }}" id="telephone" name="" placeholder="Telephone" autocomplete="off" readonly>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label>Accountant Name</label>
                                <input type="text" class="form-control" value="{{ $depDetails->accountant_name }}" id="accountant_name"  name="" placeholder="Accountant Name" autocomplete="off" readonly>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="row" style="text-align:center;">
                        <div class="col-sm-6" style="; padding: 10px; border-radius: 10px; text-align: center;">
                            <a href="{{ route('source-of-income.mainPage',$dep_id) }}" style="color: #000000;">
                                <i class="fa fa-bandcamp" aria-hidden="true" style="font-size: 30px; "></i>
                                {{-- <img src="{{ url('public/backend/images/icons/admission.png') }}" style="width: 20px"> --}}
                                <br/> Source Of Income
                            </a>
                        </div>
                        <div class="col-sm-6" style="; padding: 10px; border-radius: 10px; text-align: center;">
                            <a href="{{ route('expenditure.mainPage',$dep_id) }}" style="color: #000000;">
                                <i class="fa fa-bandcamp" aria-hidden="true" style="font-size: 30px; "></i>
                                {{-- <img src="{{ url('public/backend/images/icons/admission.png') }}" style="width: 20px"> --}}
                                <br/> Expenditure Head
                            </a>
                        </div>
                    </div>
                    <hr>
                    <u><h4 style="text-align: center">Menu</h4></u> 
                    <div class="row" style="text-align:center;">
                        <div class="col-md-4">
                            <a id="debitEntry" href="{{ route('debitCreate',$dep_id) }}" style="color: #000000;">
                                <!-- <i class="fas fa-funnel-dollar"></i> -->
                                <i class="fa fa-money" aria-hidden="true" style="font-size: 30px"></i>
                                {{-- <img src="#" style="width: 30px"> --}}
                                <br/>Debit Entry
                            </a>
                        </div>
                        <div class="col-md-4">
                            <a id="creditEntry" href="{{ route('creditCreate',$dep_id) }}" style="color: #000000;">
                                <i class="fa fa-money" aria-hidden="true" style="font-size: 30px"></i>
                                {{-- <img src="#" style="width: 30px"> --}}
                                <br/>Credit Entry
                            </a>
                        </div>
                        <!-- <div class="col-md-3">
                            <a id="balanceSheetEntry" href="{{ route('balance-sheet-entry',$dep_id) }}" style="color: #000000;">
                                <i class="fa fa-money" aria-hidden="true" style="font-size: 30px"></i>
                                {{-- <img src="#" style="width: 30px"> --}}
                                <br/> Balance Sheet Entry
                            </a>
                        </div> -->
                        <div class="col-md-4">
                            <a id="balanceSheetEntry" href="{{ route('opening-balance-entry',$dep_id) }}" style="color: #000000;">
                                <i class="fa fa-money" aria-hidden="true" style="font-size: 30px"></i>
                                {{-- <img src="#" style="width: 30px"> --}}
                                <br/> Opening Balance Entry
                            </a>
                        </div>
                    </div>
                    <hr>
                    <u><h4 style="text-align: center">Reports </h4>	</u>	
                    <div class = "row">
                        <div class="col-sm-12"></div>
                            <div class="col-sm-3" style="; padding: 10px; border-radius: 10px; text-align: center;">
                                <a id="debitReport" href="{{ route('debitReport',$dep_id) }}" style="color: #000000;">
                                    <i class="fa fa-university" aria-hidden="true" style="font-size: 30px"></i>
                                    {{-- <img src="#" style="width: 50px"> --}}
                                    <br/>Debit
                                </a>
                            </div>
                            <div class="col-sm-3" style="; padding: 10px; border-radius: 10px; text-align: center;">
                                <a id="creditReport" href="{{ route('creditReport',$dep_id) }}" style="color: #000000;">
                                    <i class="fa fa-university" aria-hidden="true" style="font-size: 30px"></i>
                                    {{-- <img src="#" style="width: 50px"> --}}
                                    <br/>Credit
                                </a>
                            </div>
                            <!-- <div class="col-sm-2" style="; padding: 10px; border-radius: 10px; text-align: center;">
                                <a id="incomeStatementReport" href="{{ route('incomeStatementReport',$dep_id) }}" style="color: #000000;">
                                    <i class="fa fa-university" aria-hidden="true" style="font-size: 30px"></i>
                                    {{-- <img src="#" style="width: 50px"> --}}
                                    <br/>Income Statement
                                </a>
                            </div> -->
                            <div class="col-sm-3" style="; padding: 10px; border-radius: 10px; text-align: center;">
                                <a id="balanceSheetReport"  href="{{ route('summaryOfCreditDebitReport',$dep_id) }}" style="color: #000000;">
                                    <i class="fa fa-university" aria-hidden="true" style="font-size: 30px"></i>
                                    {{-- <img src="#" style="width: 50px"> --}}
                                    <br/>Income Statement
                                </a>
                            </div>
                            <div class="col-sm-3" style="; padding: 10px; border-radius: 10px; text-align: center;">
                                <a id="balanceSheetReport"  href="{{ route('balanceSheetReport',$dep_id) }}" style="color: #000000;">
                                    <i class="fa fa-university" aria-hidden="true" style="font-size: 30px"></i>
                                    {{-- <img src="#" style="width: 50px"> --}}
                                    <br/>Balance Sheet
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>			
	</div>
</div>
@endsection

@section('modal_content')

@endsection
@section('page_script')>
<script>
    // $('document').ready(function(){ 
    //     $('#bank_id option')
    //     .filter(function() { return $.trim( $(this).text() ) == 'Trust bank'; })
    //     .attr('selected',true);

    //     $('#bank_id option')
    //     .filter(function() { return $.trim( $(this).text() ) == 'Trust Bank'; })
    //     .attr('selected',true);

    //     $('#conditionalRow').hide();
    //     var bank_id,text;
    //     $('#bank_id').change(function(){
    //         bank_id = $(this).val();
    //         text = $('#search').val();
    //         if(text != '' && bank_id != ''){
    //             getSearchElement(text,bank_id);
    //         }else{
    //             $('#conditionalRow').hide();
    //         }

    //         if(bank_id == '' || text == ''){
    //             $('#conditionalRow').hide();
    //         }
                
    //     });
    //     $('#search').keyup(function(){
    //         bank_id = $('#bank_id').val();
    //         text = $(this).val();
    //         if(text != '' && bank_id != ''){
    //             getSearchElement(text,bank_id);
    //         }else{
    //             $('#conditionalRow').hide();
    //         }

    //         if(bank_id == '' || text == ''){
    //             $('#conditionalRow').hide();
    //         }
    //     });
    // });
    // function getSearchElement(text,bank_id){
    //     if(text != '' && bank_id != ''){
    //         $.ajax({
    //             type:'get',
    //             url: "{{ route('getDepartmentDetailsOnAccount') }}",
    //             data:{
    //                 'text':text,
    //                 'bank_id': bank_id,
    //             },
    //             success:function(data){
    //                 // console.log(data);
    //                 if(data){
    //                     var data = jQuery.parseJSON(data);
    //                     $('#conditionalRow').show();
    //                     $('#department_name').val(data.name);
    //                     $('#acc_no').val(data.acc_no);
    //                     $('#acc_name').val(data.acc_name);
    //                     $('#contact_person').val(data.contact_person);
    //                     $('#telephone').val(data.telephone);
    //                     $('#accountant_name').val(data.accountant_name);

    //                     $('#debitEntry').attr('href','debit-entry/'+data.id);
    //                     $('#creditEntry').attr('href','credit-entry/'+data.id);
    //                     $('#balanceSheetEntry').attr('href','balance-sheet-entry/'+data.id);

    //                     $('#debitReport').attr('href','debitReport/'+data.id);
    //                     $('#creditReport').attr('href','creditReport/'+data.id);
    //                     $('#incomeStatementReport').attr('href','incomeStatementReport/'+data.id);
    //                     $('#balanceSheetReport').attr('href','balanceSheetReport/'+data.id);
    //                 }else{
    //                     $('#conditionalRow').hide();
                        
    //                     $('#department_name').val('');
    //                     $('#acc_no').val('');
    //                     $('#acc_name').val('');
    //                     $('#contact_person').val('');
    //                     $('#telephone').val('');;
    //                     $('#accountant_name').val('');

    //                     $('#debitEntry').attr('href','');
    //                     $('#creditEntry').attr('href','');
    //                     $('#balanceSheetEntry').attr('href','');

    //                     $('#debitReport').attr('href','');
    //                     $('#creditReport').attr('href','');
    //                     $('#incomeStatementReport').attr('href','');
    //                     $('#balanceSheetReport').attr('href','');
    //                 }
    //             },
    //             error:function(data){
    //                 console.log(data);
    //             },
    //         });
    //     }
    // }
</script>

@endsection