@extends('layouts.template')

@section('template')
<!-- Content Header -->
<section class="content-header">
    <h1>EXPENSE</h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">Dashboard</li>
        <li class="active">Expense</li>
    </ol>
</section>
<!-- End Content Header -->
<!-- Main content -->
<section class="content">
    
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <button type="button" class="btn btn-default btn-sm " data-toggle="modal" data-target="#myModal"><i class="fa fa-plus"></i> Add New</button>
                        
                        
                        <!-- <button type="button" class="btn btn-default btn-sm pull-right" data-toggle="modal" data-target="#myModal_Provision"><i class="fa fa-folder-open"></i> Create Provision Voucher</button> -->
                        
                        
                        </div>
                        <!--Cash Voucher Modal -->
                        <div id="myModal" class="modal fade" role="dialog">
                          <div class="modal-dialog">
                            <div class="modal-content">
                              <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Voucher</h4>
                              </div>
                              <div class="modal-body">
                                <form class="form" action="{{ url('expense/store') }}" method="post">
                                {{ csrf_field() }}
                                <div class="form-group">
                                    <label for="">Date*</label>
                                    <input type="text" id="datepicker" name="date" class="form-control input-sm" value="@php echo date('Y-m-d'); @endphp"/>
                                </div>
                                <div class="form-group">
                                    <label for="" class="text-green">Debit Account *</label>
                                    <select name="expense_head_id" class="form-control input-sm select2" required style="width: 100%;">
                                        <option value="">--- Select ---</option>
                                        @foreach($expense_heads as $key => $expense_head)
                                        <option value="{{ $expense_head->expense_head_id }}">{{ $expense_head->expense_head }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="" class="text-danger">Credit Account *</label>
                                    <select name="bank_account_id" class="form-control input-sm select2" required style="width: 100%;">
                                       
                                        @foreach($accounts as $key => $account)
                                        <option value="{{ $account->bank_account_id }}">{{ $account->bank_name }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="">Amount*</label>
                                    <input type="number" autocomplete="OFF" name="amount" id="amount" class="form-control input-sm" placeholder="Ënter Amount" required/>
                                    @if($errors->has('amount'))
                                        <span class="text-danger">{{ $errors->first('amount')}}</span>
                                    @endif
                                </div>
                                <div class="form-group">
                                    <label for="">Description</label>
                                    <textarea rows="2" name="description" class="form-control input-sm"  placeholder="Description " ></textarea>
                                </div>
                                
                                <div class="form-group">
                                    <input type="submit" class="btn btn-success" value="Save"/>
                                    <button type="button" class="btn btn-default pull-right" data-dismiss="modal">Close</button>
                                </div>
                            </form>
                              </div>

                            </div>
                          </div>
                        </div>
                        <!--Cash Voucher Modal -->

                        <!--Provision Voucher Modal -->
                        <div id="myModal_Provision" class="modal fade" role="dialog">
                          <div class="modal-dialog">
                            <div class="modal-content">
                              <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Provision Voucher</h4>
                              </div>
                              <div class="modal-body">
                                <form class="form" action="{{ url('expense/store/provision') }}" method="post">
                                {{ csrf_field() }}
                                <div class="form-group">
                                    <label for="">Date*</label>
                                    <input type="text" id="datepicker" name="date" class="form-control input-sm" value="@php echo date('Y-m-d'); @endphp"/>
                                </div>
                                <div class="form-group">
                                    <label for="">Debit Account*</label>
                                    <select name="expense_head_id" class="form-control input-sm" required>
                                        <option value="">--- Select ---</option>
                                        @foreach($expense_heads as $key => $expense_head)
                                        <option value="{{ $expense_head->expense_head_id }}">{{ $expense_head->expense_head }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="">Credit Account*</label>
                                    <select name="supplier_id" class="form-control input-sm" required>
                                        <option value="">--- Select ---</option>
                                        @foreach($suppliers as $key => $supplier)
                                        <option value="{{ $supplier->supplier_id }}">{{ $supplier->sup_name }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="">Amount*</label>
                                    <input type="number" autocomplete="OFF" name="amount" id="amount" class="form-control input-sm" placeholder="Enter Amount" required/>
                                    @if($errors->has('amount'))
                                        <span class="text-danger">{{ $errors->first('amount')}}</span>
                                    @endif
                                </div>
                                <div class="form-group">
                                    <label for="">Description</label>
                                    <textarea rows="2" name="description" class="form-control input-sm"  placeholder="Description" ></textarea>
                                </div>
                                <div class="form-group">
                                    <input type="submit" class="btn btn-success" value="Save"/>
                                    <button type="button" class="btn btn-default pull-right" data-dismiss="modal">Close</button>
                                </div>
                            </form>
                              </div>

                            </div>
                          </div>
                        </div>
                        <!--Provision Voucher Modal -->

                        <div class="panel-body">
                            <div class="table-responsive">
                                    <table class="table-bordered" id="purchase_details" width="100%">
                                        <thead>
                                            <tr>
                                                <th height="25">Srl</th>
                                                <th>Date</th>
                                                <th>Voucher Ref</th>
                                                <th>Head</th>
                                                <th>Amount</th>
                                                <th>Description</th>
                                                
                                                <th>Action</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if(isset($expenses))
                                                @foreach($expenses as $key => $expense)
                                                <tr>
                                                    <td height="25">{{ ++$key }}</td>
                                                    <td>{{ $expense->date }}</td>
                                                    <td>{{ $expense->voucher_ref }}</td>
                                                    <td>{{ $expense->expense_head }}</td>
                                                    <td>{{ $expense->amount }}</td>
                                                    <td>{{ $expense->description }}</td>
                                                    
                                                    <td>
                                                        @if(Auth::user()->role == 'accounts' ||Auth::user()->role == 'admin')
                                                        <div style="display:flex;">
                                                            <a href="{{ url('/expense/'.$expense->expense_id.'/print') }}" title="Print" target="_blank"><button class=" btn btn-primary btn-xs">
                                                            <i class="fa fa-print" aria-hidden="true"></i> Print </button> </a>
                                                            &nbsp;&nbsp;&nbsp;

                                                            <a href="{{ url('/expense/'.$expense->expense_id.'/edit') }}" title="Edit"><button class="edit btn btn-warning btn-xs">
                                                            <i class="fa fa-pencil-square-o" aria-hidden="true"></i> Edit</button> </a>
                                                            &nbsp;&nbsp;&nbsp;
                                                            
                                                            <form action="{{ url('/expense/'.$expense->expense_id) }}" method="post">
                                                                {{ method_field('DELETE') }}
                                                                {{ csrf_field() }}
                                                                <button class="delete btn btn-danger btn-xs" title="Delete" onclick="return confirm('Are you sure you want to delete this item?');">
                                                                <i class="fa fa-trash-o" aria-hidden="true"></i> Delete</button>
                                                            </form>
                                                        </div>
                                                        @endif
                                                    </td>
                                                </tr>
                                                @endforeach
                                            @endif
                                        </tbody>

                                    </table>
                                    @if(Session::has('success'))
                                    <div class="alert alert-success" id="success">
                                        {{Session::get('success')}}
                                        @php
                                        Session::forget('success');
                                        @endphp
                                    </div>
                                    @endif
                                    @if(Session::has('update'))
                                    <div class="alert alert-warning" id="update">
                                        {{Session::get('update')}}
                                        @php
                                        Session::forget('update');
                                        @endphp
                                    </div>
                                    @endif
                                    @if(Session::has('delete'))
                                    <div class="alert alert-danger" id="delete">
                                        {{Session::get('delete')}}
                                        @php
                                        Session::forget('delete');
                                        @endphp
                                    </div>
                                    @endif
                                </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- End Main Content -->

<script type="text/javascript">
$(document).ready(function () {  


    $('#amount').on('change', function(){
        if($('#amount').val() < 0 || isNaN($('#amount').val())){
            alert("Wrong amount input");
            $('#amount').val('');
            $('#amount').focus();
        }
    });


    });

    
</script>

@endsection

@section('script')
<style>
    .select2-container{
        z-index: 99999;
    }
</style>
@endsection