@extends('layouts.order-master')
@section('css')
    <style>
        .details {
            font-size: 15px;
        }

        .bg-color {
            background-color: #e9edfa;
            margin: auto;
            padding: 1em 0 0.1em 0;
            border-radius: 6px;
        }
    </style>
@endsection
@section('title')
    Receipt
@endsection
@section('content')
    <div class="card">
        <div class="card-header">
            <div class="col-lg-12 d-flex align-items-center">
                <h4 class="card-title mb-0 flex-grow-1">RECEIPT DETAILS</h4>
                <div>
                    <a type="button" class="btn btn-soft-primary waves-effect waves-light" onclick="history.back()"><i
                            class="las la-angle-double-left"></i> Go Back</a>
                </div>
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">RECIEPT CODE</h5>
                        <p class="details">{{ $collection->receipt_code}}</p>
                    </div>
                </div>
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">VOUCHER NUMBER</h5>
                        {{-- <p class="details">{{ $collection->Ledger->voucher->name }}</p> --}}
                    </div>
                </div>
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">COLLECTION DATE</h5>
                        <p class="details">{{ \Carbon\Carbon::parse($collection->date)->format('d M Y') }}
                        </p>
                    </div>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">LEDGER (Dr)</h5>
                        <p class="details">{{ $collection->Ledger->name }}</p>
                    </div>
                </div>
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">TOTAL</h5>
                        <p class="details">{{ $collection->amount }}</p>
                    </div>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">BANK</h5>
                        <p class="details">{{ $collection->bank_name ?? '--' }}</p>
                    </div>
                </div>
                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">REMARKS</h5>
                        <p class="details">{{ $collection->remarks ?? '--' }}</p>
                    </div>
                </div>

                <div class="col-lg-4 text-center">
                    <div class="bg-color">
                        <h5 class="text-primary">STATUS</h5>
                        @if ($collection->status != 'Cancelled')
                            <p class="text-success">NOT CANCELLED</p>
                        @else
                            <p class="text-danger">CANCELLED</p>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script src="{{ URL::asset('/assets/js/app.min.js') }}"></script>
@endsection