@php
    $name = ($type == 1) ? 'Recieve' : 'Payment';
@endphp
@extends('admin.layouts.master')
@section('title', $name)
@section('content')
    <style>
        .some-text {
            color: red;
            font-style: italic;
            font-size: 15px;
        }

        .help-block {
            color: red;
            font-size: 13px;
            font-weight: normal;
        }
    </style>
    <link href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css"
          rel="stylesheet">
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <!-- Page Wrapper -->
    <div class="page-wrapper">
        <div class="content container-fluid">

            <!-- Page Header -->
            <div class="page-header">
                <div class="row">
                    <div class="col">
                        <h3 class="page-title">{{$name}}</h3>
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item active"> @if($data ?? '') Update @else Add @endif {{$name}}</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- /Page Header -->

            <div class="row">

                <div class="col-md-12">
                    @include('admin.includes.msg')
                    <div class="card">

                        <div class="card-body">
<!--                            <ul class="nav nav-tabs">
                                <li class="nav-item"><a class="nav-link active" href="#basictab1"
                                                        data-toggle="tab">General</a></li>
                            </ul>-->

                            <form method="POST" action="{{ route('cashpayment.store') }}" enctype="multipart/form-data">
                                {{ csrf_field() }}
                                @if($data ?? '')
                                    <input type="hidden" name="id" value="{{ $data->id }}">
                                @else
                                    <input type="hidden" name="retailerId" value="{{ Auth::id() }}">                                
                                @endif
                                <div class="tab-content">
                                    <div class="tab-pane show active" id="basictab1">

                                        <div class="form-group row">
                                            <label class="col-form-label col-md-2">Ledger</label>                                            
                                            <div class="col-md-8">
                                                <select class="form-control" name="ledger">
                                                    <option value="">Choose a Ledger</option>
                                                    @foreach($ledgers as $c)
                                                        <option value="{{$c->id}}" @if($data ?? '') @if($data->ledger==$c->id) selected="selected" @endif @endif>
                                                            {{$c->name}}
                                                        </option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        
                                        <div class="form-group row">
                                            <label class="col-form-label col-md-2">Amount</label>
                                            <div class="col-md-8">
                                                <input id="amount" class="form-control" placeholder="Enter Amount" name="amount" type="text"
                                                       value="@if($data ?? '') {{ $data->amount }} @endif">
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <label class="col-form-label col-md-2">Mode</label>
                                            <div class="col-md-8">
                                                <input id="mode" class="form-control" placeholder="Enter Mode" name="mode" type="text"
                                                       value="@if($data ?? '') {{ $data->mode }} @endif">
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <label class="col-form-label col-md-2">Reference</label>
                                            <div class="col-md-8">
                                                <input id="referance" class="form-control" placeholder="Enter Referance No." name="referance" type="text"
                                                       value="@if($data ?? '') {{ $data->referance }} @endif">
                                            </div>
                                        </div>
                                        
                                        <div class="form-group row">
                                            <label class="col-form-label col-md-2">Created Date</label>
                                            <div class="col-md-8">
                                                <input type="date" name="payment_date" class="form-control" id="my_date_picker2"
                                                       value="@php if(isset($_GET['payment_date'])){echo $_GET['payment_date'];}else{ echo date('Y-m-d');} @endphp" readonly="readonly">
                                            </div>
                                        </div>
                                        
                                        <div class="form-group row">
                                            <label class="col-form-label col-md-2">Effective Date</label>
                                            <div class="col-md-8">
                                                <input type="date" name="effective_date" class="form-control" id="my_date_picker1"
                                                value="@php if(isset($_GET['effective_date'])){echo $_GET['effective_date'];}else{ echo date('Y-m-d', strtotime('-1 day'));} @endphp">
                                            </div>
                                        </div>

                                    </div>

                                    <div class="form-group row">
                                        <label class="col-form-label col-md-4">
                                            <input type="hidden" name="type" value="{{$type}}">
                                            <button type="submit" class="btn btn-primary">Submit</button>
                                        </label>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    </div>
    <!-- /Main Wrapper -->

    </div>
    <script>
        // Set the min value of effective_date to payment_date
        const paymentDate = document.getElementById('my_date_picker2');
        const effectiveDate = document.getElementById('my_date_picker1');

        // When the page loads, set the min attribute of effective_date to the payment_date value
        effectiveDate.setAttribute('max', paymentDate.value);

        // Add an event listener to ensure that effective_date is always <= payment_date
        paymentDate.addEventListener('input', function() {
          effectiveDate.setAttribute('max', paymentDate.value);
        });
        
        
        $(document).ready(function () {
            $('#publishDate').datepicker({
                dateFormat: 'yy-mm-dd'
            });
        });

        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                var id = $(input).attr('name');
                reader.onload = function (e) {
                    $('#' + id).attr('src', e.target.result);
                }

                reader.readAsDataURL(input.files[0]); // convert to base64 string
            }
        }

        $(".imgInp").change(function () {
            readURL(this);
        });

    </script>
@endsection