@extends('layouts.app')
@section('title', session('company_code') . ' Elite System')


<style type="text/css">
    section.add-to-bill{
        background : #FFF;
        padding    : 5px 20px 10px 20px;
        height     : 85%;
        font-size  : 14px;
    }       

    .page-header{
        margin-bottom: 10px !important;
    }  

    div.dataTables_filter input {
        font-size: 14px !important;        
    }    

    #t-01_filter{
        margin-top  : 10px; 
        margin-left : -10px;
    }         

    /*.select2-selection__arrow, */
    .select2-selection__clear{
        display : none;
    }      
</style>


@section('body')
<section class="add-to-bill">

    <input type="hidden" id="collection-id">
    <input type="hidden" id="collection-ref">
    <input type="hidden" id="or-number">

    <div class="row">
        <div class="col-xs-12">

            <div class="pull-right col-xs-2" style="margin-top: 5px;">
                <div class="row">
                    <div class="input-group input-group-sm">
                        <input id="or__number" type="text" class="form-control" style="font-size: 14px;" placeholder="Enter OR">
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" id="or__search">
                                <i class="fa fa-search"></i>
                            </button>
                        </span>
                    </div>
                </div>
            </div>   

            <h2 class="page-header">
                Cancel Payment<span style="font-size: 14px;" class="text-danger">&emsp; Please enter OR Number.</span>
            </h2>            
        </div>
    </div>

    @include('teller.cancel-payment._datatable')

    <div class="row" style="margin-top: 20px;">
		<div class="col-xs-6">
			<ul class="list-unstyled"><b>OR allowed to cancel:</b>
				<li><i class="fa fa-fw fa-check-circle text-bold text-success"></i> Water Bills Payment <small>(same day transactions)</small></li>
                <li><i class="fa fa-fw fa-check-circle text-bold text-success"></i> Advance Payment <small>(same day transactions, payments from advance payment module and with no used amount)</small></li>
                <li><i class="fa fa-fw fa-check-circle text-bold text-success"></i> Other Transactions Payment <small>(same day transactions)</small></li>
			</ul>
		</div>
		<div class="col-xs-6">
			<ul class="list-unstyled"><b>Users allowed to approve:</b>
                <li><i class="fa fa-fw fa-check-circle text-bold text-primary"></i> Central Billing and I.T.</li>
				<li><i class="fa fa-fw fa-check-circle text-bold text-primary"></i> Branch Manager</li>
				<li><i class="fa fa-fw fa-check-circle text-bold text-primary"></i> Admin Supervisor / Branch Accountant</li>
			</ul>
		</div>
	</div>
</section>
@endsection

@section('scripts')
    <script src="{{ URL::asset('js/helper.js') }}"></script>
    <script src="{{ URL::asset('js/elite.js') }}"></script>
    <script src="{{ url(mix('js/teller/cancel-payment.js')) }}"></script>
@endsection