@php
    use Illuminate\Support\Carbon;

@endphp
@extends('admin.layout.master')
@section('title', 'Ticket')

@push('plugin-styles')
    <link href="{{ asset('assets/plugins/datatables-net-bs5/dataTables.bootstrap5.css') }}" rel="stylesheet" />
@endpush

@section('content')
    <nav class="page-breadcrumb">
        {{-- <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="{{route('user.annual')}}">Annual</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data Table</li>
  </ol>  --}}
        @if (session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif
    </nav>



    <div class="row">

        <div class="col-md-12">
            {{-- <a class="btn btn-primary" href="{{ route('user.add.returnfiling') }}" style="float: right; margin: 5px">Add Return
                Filing</a> --}}
        </div>
        <br>
        <div class="col-md-12 grid-margin stretch-card">

            <div class="card">
                <div class="card-body">
                    <h6 class="card-title">Ticket</h6>
                    <p class="text-muted mb-3"><a href="https://datatables.net/" target="_blank"></a></p>
                    <div class="table-responsive">
                        <table id="dataTableExample" class="table">
                            <thead>
                                <tr>
                                    <th>User Name</th>
                                    <th>Title</th>
                                    <th>Description</th>
                                    <th>File</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($tickets as $ticket)
                                    <tr>

                                        <td>{{ $ticket->user_name }}</td>
                                        <td>{{ $ticket->title }}</td>
                                        <td>{{ $ticket->description }}</td>
                                        <td>
                                            <img src="{{asset('/uploads/support/file/'.$ticket->file)}}" style="width:50px">
                                        </td>
                                        <td>
                                            <a href="{{route('admin.ticket_messages',['id'=>$ticket->id])}}" class="message" data-id="{{ $ticket->user_id }}"
                                                data-ticket_id="{{ $ticket->id }}">
                                                Sent Message
                                            </a>
                                        </td>
                                    </tr>
                                @endforeach

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal View Msg -->
    <div class="modal fade" id="comment" tabindex="-1" aria-labelledby="comment" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Sent Message</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="btn-close"></button>
                </div>
                <div class="modal-body">
                    <form action="{{route('admin.ticket.message.process')}}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <input type="hidden" name="user_id" class="user">
                        <input type="hidden" name="ticket_id" class="ticket">

                        <div class="mb-3">
                            <h6 class="card-title">Message</h6>
                            <textarea id="name" class="form-control" name="message" type="text" rows="5"
                                cols="50" required>
                            </textarea>
                            <span class="text-danger">{{ $errors->first('message') }}</span>
                        </div>

                        

                        <div class="mb-3">
                            <h6 class="card-title">File</h6>
                            <input id="name" class="form-control" name="file" type="file" required>

                            <span class="text-danger">{{ $errors->first('file') }}</span>
                        </div>
                    </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Save changes</button>

                </div>
            </form>
            </div>
        </div>
    </div>
@endsection

@push('plugin-scripts')
    <script src="{{ asset('assets/plugins/datatables-net/jquery.dataTables.js') }}"></script>
    <script src="{{ asset('assets/plugins/datatables-net-bs5/dataTables.bootstrap5.js') }}"></script>
@endpush

@push('custom-scripts')
    <script src="{{ asset('assets/js/data-table.js') }}"></script>
    <script>
        $(".message").on("click", function() {
            var dataId = $(this).attr("data-id");
            var dataticket_id = $(this).attr("data-ticket_id");

            $(".user").val(dataId); 
            $(".ticket").val(dataticket_id); 

            // alert("The data-id of clicked item is: " + dataId);
        });

        $(".payment").on("click", function() {
            var dataId = $(this).attr("data-id");
            $(".gstr1").val(dataId); 
            // alert("The data-id of clicked item is: " + dataId);
        });

        $(".payment1").on("click", function() {
            var dataId = $(this).attr("data-id");
            $(".gstr3b").val(dataId);
            // alert("The data-id of clicked item is: " + dataId);
        });
    </script>
@endpush