@extends('admin.admin_master')
@section('admin')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<div class="page-content">
<div class="container-fluid">

<div class="row">
<div class="col-12">
    <div class="card">
        <div class="card-body">

            <h4 class="card-title">Approve/Reject Hisa Page </h4><br><br>


            <form method="post" action="{{ route('approve.hisa') }}" id="myForm" enctype="multipart/form-data">
                @csrf

                <input type="hidden" name="id" value="{{ $h_review->id }}">
                

            <div class="row mb-3">
                    <label class="col-sm-2 col-form-label">Member Name</label>
                <div class="form-group col-sm-10">
                    @foreach($all_users as $users)
                    <input name="member_id" value="{{ $users->membership_no.'-'. $users->name.' '. $users->sname.' '. $users->lname }}" class="form-control" type="text" disabled>
                    @endforeach
                </div>
            </div>
            <!-- end row -->


             


            <div class="row mb-3">
                <label class="col-sm-2 col-form-label">Payment Type</label>
                   <div class="form-group col-sm-10">
                       @foreach($p_type as $pt)
                       <input id="paymenttype_id" name="paymenttype_id" value="{{ $pt->name }}" class="form-control" type="text" disabled>
                       @endforeach
                   </div>
            </div>
            <!-- end row -->

            <div class="row mb-3">
                <label for="example-text-input" class="col-sm-2 col-form-label">Payment date </label>
                <div class="form-group col-sm-10">
                    <input name="pdate" value="{{ $h_review->pdate }}"class="form-control" type="date" disabled>
                </div>
            </div>
            <!-- end row -->

            <div class="row mb-3">
                <label for="example-text-input" class="col-sm-2 col-form-label">Enter amount </label>
                <div class="form-group col-sm-10">
                    <input name="amount" value="{{ $h_review->amount }}"class="form-control" type="text" disabled>
                </div>
            </div>
            <!-- end row -->

            <div class="row mb-3">
                <label for="example-text-input" class="col-sm-2 col-form-label">Review risiti </label>
                <div class="col-sm-10">
       <input name="risit_image" class="form-control" type="file"  id="image" disabled>
                </div>
            </div>
            <!-- end row -->

             <div class="row mb-3">
                 <label for="example-text-input" class="col-sm-2 col-form-label">  </label>
                <div class="col-sm-10">
                    <img id="showImage" class="rounded avatar-lg" src="{{ url($h_review->risiti) }}" alt="Card image cap">
                </div>
            </div>
            <!-- end row -->


<input type="submit" class="btn btn-info waves-effect waves-light" value="Approve">
<!-- <input type="submit" class="btn btn-info waves-effect waves-light" value="Reject"> -->

<div class="col-sm-6 col-md-4 col-xl-3">
                                                <div class="my-4 text-center">
                                                    <button type="button" class="btn btn-primary waves-effect waves-light" data-bs-toggle="modal" data-bs-target="#myModal">Reject</button>
                                                </div>
        
                                                <!-- sample modal content -->
                                                <div id="myModal" class="modal fade" tabindex="-1" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
                                                    <div class="modal-dialog">
                                                        <div class="modal-content">
                                                            <div class="modal-header">
                                                                <h5 class="modal-title" id="myModalLabel">Reasons for rejection</h5>
                                                                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                                            </div>
                                                            <div class="modal-body">
                                                                <form method="post" action="{{ route('reject.hisa') }}" >
                @csrf

            <div class="row mb-10">
                
                <div class="col-sm-12">
                    <input name="name" class="form-control" type="text">
                </div>
            </div>
            <!-- end row -->
        </form>
                                                            </div>
                                                            <div class="modal-footer">
                                                                <button type="button" class="btn btn-light waves-effect" data-bs-dismiss="modal">Close</button>
                                                                <button type="button" class="btn btn-primary waves-effect waves-light">Save changes</button>
                                                            </div>
                                                        </div><!-- /.modal-content -->
                                                    </div><!-- /.modal-dialog -->
                                                </div><!-- /.modal -->
                                            </div>
            </form>



        </div>
    </div>
</div> <!-- end col -->
</div>



</div>
</div>

<!-- <script type="text/javascript">
    
    $(document).ready(function() {
        $('#myForm').validate({
            rules: {
                name: {
                    required : true,
                },

                supplier_id: {
                    required : true,
                },

                category_id: {
                    required : true,
                },

                unit_id: {
                    required : true,
                },
            },

            messages :{
                name: {
                    required : 'Product name is required',
                },

                supplier_id: {
                    required : 'Supplier name is mandatory',
                },

                category_id: {
                    required : 'Category name is mandatory',
                },

                unit_id: {
                    required : 'Unit name is mandatory',
                },
            },

            errorElement : 'span',
            errorPlacement: function(error, element) {
                error.addClass('invalid-feedback');
                element.closest('.form-group').append(error);
            },

            highlight : function(element, errorClass, validClass) {
                $(element).addClass('is-invalid');
            },

            unhighlight : function(element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
            },
        });

    });

</script> -->

<script type="text/javascript">
    
    $(document).ready(function(){
        $('#image').change(function(e){
            var reader = new FileReader();
            reader.onload = function(e){
                $('#showImage').attr('src',e.target.result);
            }
            reader.readAsDataURL(e.target.files['0']);
        });
    });

</script>



    <script type="text/javascript">
    $(function(){
        $(document).on('change','#paymentmethod_id',function(){
            var paymentmethod_id = $(this).val();
            $.ajax({
                url:"{{ route('get-paymentmethod') }}",
                type: "GET",
                data:{paymentmethod_id:paymentmethod_id},
                success:function(data){
                    var html = '<option value="">Select Payment type</option>';
                    $.each(data,function(key,v){
                        html += '<option value=" '+v.id+' "> '+v.name+'</option>';
                    });
                    $('#paymenttype_id').html(html);
                }
            })
        });
    });

</script>

@endsection