@extends('layouts.dashboard.layout')

@section('content')

<!-- Content Header (Page header) -->
<section class="content-header">
    @if(Session::has('flash_message_error'))
    <div class="alert alert-error alert-danger alert-block">
        <button type="button" class="close" data-dismiss="alert">×</button>
        <strong>{!! session('flash_message_error') !!}</strong>
    </div>
    @endif
    @if(Session::has('flash_message_success'))
    <div class="alert alert-success alert-block">
        <button type="button" class="close" data-dismiss="alert">×</button>
        <strong>{!! session('flash_message_success') !!}</strong>
    </div>
    @endif
</section>


<div class="container-fluid ">
    <div class="row">
        <div class="col-md-12">
            <!-- Content Header (Page header) -->
            <section class="content-header">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-sm-12">
                            <h2 class="text-white">Archive Claim List</h2>
                        </div>
                    </div>
                </div>
            </section>
            <div class="card">
                <!-- /.card-header -->
                <div class="card-body">
                    <table id="example" class="table table-bordered table-striped">
                        <thead>
                            <tr style="text-align:center;">
                                <!-- <th>Claim ID</th> -->
                                <th>Claim Date</th>
                                <th>Cus. Name</th>
                                <!-- <th>Picture</th> -->
                                <!-- <th style="width:200px!important">Note</th> -->
                                <!-- <th>Type</th> -->
                                <th>It. Count</th>
                                <th>Open</th>
                                <th>Resolved</th>
                                <th hidden>Status</th>
                                <th>Action</th>
                                <th></th>
                                <th></th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($ClaimArray as $key => $item)

                            @if($item['status'] == "Resolved")
                            <tr style="text-align: center;">
                                <!-- <td>{{$item['id']}}</td> -->
                                <td>{{ $item['created_at'] }}</td>
                                <td>{{ $item['name'] }}</td>

                                <td>{{ $item['totalCount'] }} </td>
                                <td>{{ $item['openCount'] }}</td>
                                <td>{{ $item['resCount'] }}</td>

                                <!-- status ki jagah ab hum main claim se "Dynamic Status" uthayegy to isliye purana td hidden krdiya ha wo old project me ha -->
                                <td hidden>
                                    @if($item['overallCount'] == "")

                                    @if($item['status'] == "Pending")
                                    {{$item['status']}}
                                    @else
                                    <span class="text-primary text-bold">{{$item['status']}}</span>
                                    @endif

                                    @else
                                    <span class="text-primary text-bold">{{$item['overallCount']}}</span>
                                    @endif
                                </td>

                                <!-- action ki jagah is br dropdown kiwajah se aik td lagaya ha or purane 2 tb hidden krdiye wo old project me ha , Or upar mene iske th ko colspan=2 diya hua tha -->
                                <td>
                                    <input type="hidden" id="claimrowid" value="{{ $item['id'] }}">
                                    <select name="statusid" id="statusid" class="form-control statusid"
                                        style="text-align:center; cursor: pointer">
                                        <!-- <option disabled selected>Status</option> -->
                                        <!-- <option disabled selected>Claim Status</option> -->
                                        <option disabled selected>Pending</option>

                                        @foreach($status as $stat)
                                        @if($item['status'] == $stat->status_name || $item['overallCount'] ==
                                        $stat->status_name)
                                        <option value="{{ $stat->status_name }}" selected>{{ $stat->status_name }}
                                        </option>
                                        @else
                                        <option value="{{ $stat->status_name }}">{{ $stat->status_name }}</option>
                                        @endif
                                        @endforeach

                                    </select>
                                </td>

                                <td>
                                    <a href="{{ route('claimdetail', $item['id']) }}">
                                        <i class="fa fa-eye text-dark" aria-hidden="true"></i>
                                    </a>
                                </td>

                                <td>
                                    <a class="readclaimstatus" style="cursor:pointer">
                                        <input type="text" id="claim_id" value="{{ $item['id'] }}" hidden>
                                        @if($item['readcount'] > 0)
                                        <i class="fas fa-envelope text-danger" aria-hidden="true">
                                            <sup class="text-light bg-danger"
                                                style="border-radius: 10px; padding: 2px 6px 3px 5px; font-size:10px">
                                                {{ $item['readcount'] }}
                                            </sup>
                                        </i>
                                        @else
                                        <i class="fas fa-envelope" aria-hidden="true">
                                            <!-- <sup>{{ $item['readcount'] }}</sup> -->
                                        </i>
                                        @endif
                                    </a>
                                </td>

                                <td>
                                    @if((int)$item['totalCount'] == (int)$item['resCount'])
                                    <a href="{{ route('claimoffers', $item['id']) }}" data-toggle="tooltip"
                                        title="Create Offer" class="text-primary">
                                        <i class="fa fa-gift" aria-hidden="true"></i>
                                    </a>
                                    @else
                                    <a data-toggle="tooltip" disabled
                                        title="Offer button will only be enabled when no claim item is opened and all are marked as resolved">
                                        <i class="fa fa-gift text-dark" aria-hidden="true"></i>
                                    </a>
                                    @endif
                                </td>
                            </tr>
                            @endif

                            @endforeach
                        </tbody>
                    </table>
                </div>
                <!-- /.card-body -->
            </div>
            <!-- /.card -->
        </div>
    </div>
</div>

<div class="modal" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">

            <form action="{{ route('claimstatus') }}" method="post">
                {{ csrf_field() }}

                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Claim <span id="claimtitle"></span></h4>
                    <!-- <button type="button" class="close" data-dismiss="modal">&times;</button> -->
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <input name="claimid" id="claimid" value="" hidden>
                    <input name="statusname" id="statusname" value="" hidden>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label><b>Message</b></label>
                                <textarea name="message" class="form-control" rows="3" class="txtarea"
                                    style="height:50%; width:100%" placeholder="Tell me more"></textarea>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success">Save</button>
                    <button type="button" class="btn btn-danger modalclose" data-dismiss="modal">Close</button>
                </div>

            </form>
        </div>
    </div>
</div>

<!-- Accept Modal Box -->
<div class="modal" id="myModal1">
    <div class="modal-dialog">
        <div class="modal-content">

            <form action="{{ route('claimaccept') }}" method="post">
                {{ csrf_field() }}

                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Claim Accept</h4>
                    <!-- <button type="button" class="close" data-dismiss="modal">&times;</button> -->
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <input name="claimid" id="claimid" value="" hidden>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label><b>Message</b></label>
                                <textarea name="message" class="form-control" rows="3" class="txtarea"
                                    style="height:50%; width:100%" placeholder="Tell me more"></textarea>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success">Save</button>
                    <button type="button" class="btn btn-danger modalclose" data-dismiss="modal">Close</button>
                </div>

            </form>
        </div>
    </div>
</div>

<!-- Reject Modal Box -->
<div class="modal" id="myModal2">
    <div class="modal-dialog">
        <div class="modal-content">

            <form action="{{ route('claimreject') }}" method="post">
                {{ csrf_field() }}

                <!-- Modal Header -->
                <div class="modal-header">
                    <!-- <h4 class="modal-title">Claim Reject</h4> -->
                    <h4 class="modal-title">Claim Resolve</h4>
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <input name="claimid" id="claimidd" value="" hidden>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label><b>Message</b></label>
                                <textarea name="message" class="form-control" rows="3" class="txtarea"
                                    style="height:50%; width:100%" placeholder="Tell me more"></textarea>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success">Save</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>

            </form>
        </div>
    </div>
</div>

<!-- Resolved Modal Box -->
<div class="modal" id="myModal3">
    <div class="modal-dialog">
        <div class="modal-content">

            <form action="{{ route('claimresolve') }}" method="post">
                {{ csrf_field() }}

                <!-- Modal Header -->
                <div class="modal-header">
                    <!-- <h4 class="modal-title">Claim Resolve</h4> -->
                    <h4 class="modal-title">Claim Repair</h4>
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <input name="claimid" id="claimiddd" value="" hidden>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label><b>Message</b></label>
                                <textarea name="message" class="form-control" rows="3" class="txtarea"
                                    style="height:50%; width:100%" placeholder="Tell me more"></textarea>
                            </div>
                        </div>
                        <div class="col-md-12">
                            <div class="form-group">
                                <label><b>Price</b></label>
                                <input type="text" name="price" class="form-control">
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success">Save</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>

            </form>
        </div>
    </div>
</div>


<script>
$('.AcceptButton').on('click', function() {
    var id = $(this).val();
    $('#claimid').val(id);

})

$('.RejectButton').on('click', function() {
    var id = $(this).val();
    $('#claimidd').val(id);

})

$('.ResolvedButton').on('click', function() {
    var id = $(this).val();
    $('#claimiddd').val(id);
})

// $('.UpdateResolvedButton').on('click', function() {
//     var id = $(this).val();
//     $('#claimiddd').val(id);
// })
</script>

<script type="text/javascript">
$(document).ready(function() {
    $('#example').dataTable();
});
</script>

<!-- OnClick readCount Queries  -->
<script type="text/javascript">
$('.readclaimstatus').on('click', function(event) {
    // debugger;
    var clmid = $(event.currentTarget).find("#claim_id").val();

    // console.log(clmid);

    $.ajax({
        type: "POST",
        url: "{{ route('readstatus.post') }}",
        data: {
            clid: clmid,
            _token: '{{csrf_token()}}'
        },
        dataType: "json",

        success: function(response) {
            console.log(response.success);

            location.href = "/admin/claim-queries/" + clmid;
        }
    });
})
</script>

<!-- OnChange Status then Modal Open  -->
<script>
$('.statusid').on('change', function() {
    var claimrowid = $(this).parent().parent().find('input').val() //getting row id
    var name = $(this).val();
    // console.log(claimrowid);
    // console.log(name);

    $('#claimtitle').text(name);
    $('#statusname').val(name);
    $('#claimid').val(claimrowid);
    $('#myModal').show();
})
</script>

<script>
$('.modalclose').on('click', function() {
    $('#myModal').hide();
})
</script>

@endsection