@extends('layouts.app')

@section('content')


<div class="layout-wrapper layout-content-navbar">
    <div class="layout-container">
      <!-- Menu -->

      @include('includes.sidebar')
      <!-- / Menu -->

      <!-- Layout container -->
      <div class="layout-page">
        <!-- Navbar -->

        @include('includes.header')

        <!-- / Navbar -->

        <!-- Content wrapper -->
        <div class="content-wrapper">
            <!-- Content -->
            {{-- @dd($contents) --}}
            <div class="container-xxl flex-grow-1 container-p-y">
              <h4 class="fw-bold py-3 mb-4"><span class="text-muted fw-light">{{$service->name}} /</span> Policies & Procedures </h4>
              <h5>{{$service->description}}</h5>
                <button class="btn btn-primary" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasBoth" aria-controls="offcanvasBoth">Add a Document</button>
                <br/><br/>
            
              
              <!-- Examples -->
              <div class="row mb-5">
                {{-- @dd($departments) --}}
                <div class="card">
                  <h5 class="card-header">Documents</h5>
                  <div class="table-responsive text-nowrap">
                    <table class="table">
                      <thead>
                        <tr>
                          <th scope="col">#</th>
                          <th scope="col">Title</th>
                          <th scope="col">Description</th>
                          <th scope="col">Start Date</th>
                          <th scope="col">Next Renewal</th>
                          <th scope="col">Doc Class</th>
                          <th scope="col">Email Alert</th>
                          <th scope="col">Action</th>
                        </tr>
                      </thead>
                      @if(!empty($policies) && $policies->count())
                      {{-- @dd($departments) --}}
                          @php $sn=1;   @endphp
                          @foreach($policies as $key => $value)
                            <tbody>
                              <tr class="col-md-12 col-lg-12 mb-12">
                                <td>{{$sn}}</td>
                                <td class="card-title"><a href="#" href="#" data-bs-toggle="modal" data-bs-target="#modalScrollable{{$value->id}}">{{$value->title}}</a></td>
                                <td class="card-text">{{$value->description}}</td>
                                <td class="card-text">{{$value->issue_date}}</td>
                                <td class="card-text">{{$value->next_renewal}}</td>
                                <td class="card-text">{{$value->doc_classification}}</td>
                                <td class="card-text">{{$value->alert}} {{($value->alert) ? 'Days before' : '' }}</td>
                                <td>
                                    <div class="card-body flex-grow-1">
                                        <div class="btn-group dropup">
                                            <button type="button" class="btn btn-outline-primary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
                                            Actions
                                            </button>
                                            <ul class="dropdown-menu" style="">
                                            {{-- <li><a class="dropdown-item" href="{{ url('/usercompliance/') }}/{{$value->file}}" target="_blank">Download</a></li> --}}
                                            <li><a class="dropdown-item" href="{{url('/delcomp',$value->id)}}" onclick="return confirm('Are you sure you want to delete this document?');">Delete</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </td>
                                  
                              </tr>
                            </tbody>
                            @php $sn++;   @endphp
                          @endforeach
                      @else
                        <tbody>
                          <tr class="col-md-12 col-lg-12 mb-12">
                            <td class="card-title" colspan="3">No policy documents Yet</td>
                                
                          </tr>
                        </tbody>
                      @endif
                    </table>
                  </div>
                </div>
              </div>

              <div class="offcanvas offcanvas-end" data-bs-scroll="true" tabindex="-1" id="offcanvasBoth" aria-labelledby="offcanvasBothLabel" aria-modal="true" role="dialog" style="visibility: visible;">
                <div class="offcanvas-header">
                  <h5 id="offcanvasBothLabel" class="offcanvas-title">Add New Policy Document</h5>
                  <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
                </div>
                <div class="offcanvas-body my-auto mx-0 flex-grow-0">
                    <form method="POST" action="{{url('/policydoc', $service->id)}}" enctype="multipart/form-data">
                        @csrf
                        <div class="mb-3">
                            <label for="title" class="form-label">Title</label>
                            <input type="text" class="form-control" id="title" name="title" aria-describedby="title" required>
                        </div>
                        <div class="mb-3">
                            <label for="description" class="form-label">Description</label>
                            <textarea class="form-control" id="description" name="description" aria-describedby="description"></textarea>
                        </div>
                        <div class="mb-3">
                            <label for="doc_classification" class="form-label">Document Classification</label>
                            <select name="doc_classification" id="doc_classification" name="doc_classification" class="form-control form-select">
                                <option value="">Select</option>
                                <option value="Low"> Low</option>
                                <option value="Medium">  Medium</option>
                                <option value="High"> High</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label for="revised_by" class="form-label">Revised By</label>
                            <input type="text" class="form-control" id="revised_by" name="revised_by" aria-describedby="revised_by" required>
                        </div>
                        <div class="mb-3">
                            <label for="issue_date" class="form-label">Issued Date</label>
                            <input type="date" class="form-control" id="issue_date" name="issue_date" aria-describedby="issue_date">
                        </div>
                        <div class="mb-3">
                            <label for="next_renewal" class="form-label">Next Renewal</label>
                            <input type="date" class="form-control" id="next_renewal" name="next_renewal" aria-describedby="next_renewal">
                        </div>
                        <div class="mb-3">
                            <label for="doc_owner" class="form-label">Document Owner</label>
                            <select name="doc_owner" id="doc_owner" name="doc_owner" class="form-control form-select">
                                <option value="">Select</option>
                                <option value="HR Manager"> HR Manager</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label for="alert" class="form-label">Email Alert</label>
                            <select name="alert" id="alert" name="alert" class="form-control form-select">
                                <option value="">No Alert</option>
                                <option value="1"> 1 Day Before</option>
                                <option value="7">  7 Days Before</option>
                                <option value="14"> 14 Days Before</option>
                                <option value="30"> 30 Days Before</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label for="file" class="form-label">Document</label>
                            <input class="form-control" type="file" name="file" id="file" accept="application/pdf,.xlsx,.xls,image/*,.doc, .docx," required>
                            <div id="defaultFormControlHelp" class="form-text">.pdf, .xlsx, .xls, .png, .jpg, .doc, .docx</div>
                        </div>
                        <button type="submit" class="btn btn-primary mb-2 d-grid w-100">Save</button>
                    </form>
                  
                  <button type="button" class="btn btn-outline-secondary d-grid w-100" data-bs-dismiss="offcanvas"> Cancel</button>
                </div>
              </div>
              <!-- Examples -->

             
              <!--/ Card layout -->
            </div>

            @if(!empty($policies) && $policies->count())
                @foreach($policies as $key => $value)
                <form method="POST" action="{{url('/policydocedit', $value->id)}}" enctype="multipart/form-data">
                    <form method="POST" action="{{url('/proputilityedit', $value->id)}}" enctype="multipart/form-data">
                        <div class="card-body">
                            <div class="row gy-3">
                                <div class="col-lg-4 col-md-3">
                                    <div class="modal fade" id="modalScrollable{{$value->id}}" tabindex="-1" aria-hidden="true">
                                        <div class="modal-dialog modal-dialog-scrollable" role="document">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                            <h5 class="modal-title" id="modalScrollableTitle">{{$value->name}}</h5>
                                            <button
                                                type="button"
                                                class="btn-close"
                                                data-bs-dismiss="modal"
                                                aria-label="Close"
                                            ></button>
                                            </div>
                                            <div class="modal-body">
                                                @csrf
                                                <div class="mb-3">
                                                    <label for="title" class="form-label">Title</label>
                                                    <input type="text" value="{{$value->title}}" class="form-control" id="title" name="title" aria-describedby="title" required>
                                                </div>
                                                <div class="mb-3">
                                                    <label for="description" class="form-label">Description</label>
                                                    <textarea class="form-control" id="description" name="description" aria-describedby="description"> {{$value->description}}</textarea>
                                                </div>
                                                <div class="mb-3">
                                                    <label for="doc_classification" class="form-label">Document Classification</label>
                                                    <select name="doc_classification" id="doc_classification" name="doc_classification" class="form-control form-select">
                                                        <option value="">Select</option>
                                                        <option value="Low"  {{$value->alert == 'Low' ? 'selected' : ''}}> Low</option>
                                                        <option value="Medium"  {{$value->alert == 'Medium' ? 'selected' : ''}}>  Medium</option>
                                                        <option value="High"  {{$value->alert == 'High' ? 'selected' : ''}}> High</option>
                                                    </select>
                                                </div>
                                                <div class="mb-3">
                                                    <label for="revised_by" class="form-label">Revised By</label>
                                                    <input type="text" class="form-control" id="revised_by" value="{{$value->title}}" name="revised_by" aria-describedby="revised_by" required>
                                                </div>
                                                <div class="mb-3">
                                                    <label for="issue_date" class="form-label">Issued Date</label>
                                                    <input type="date" class="form-control" id="issue_date" value="{{$value->title}}" name="issue_date" aria-describedby="issue_date">
                                                </div>
                                                <div class="mb-3">
                                                    <label for="next_renewal" class="form-label">Next Renewal</label>
                                                    <input type="date" class="form-control" id="next_renewal" value="{{$value->title}}" name="next_renewal" aria-describedby="next_renewal">
                                                </div>
                                                <div class="mb-3">
                                                    <label for="doc_owner" class="form-label">Document Owner</label>
                                                    <select name="doc_owner" id="doc_owner" name="doc_owner" class="form-control form-select">
                                                        <option value="">Select</option>
                                                        <option value="HR Manager"  {{$value->alert == 'HR Manager' ? 'selected' : ''}}> HR Manager</option>
                                                    </select>
                                                </div>
                                                <div class="mb-3">
                                                    <label for="alert" class="form-label">Email Alert</label>
                                                    <select name="alert" id="alert" name="alert" class="form-control form-select">
                                                        <option value="">No Alert</option>
                                                        <option value="1"  {{$value->alert == '1' ? 'selected' : ''}}> 1 Day Before</option>
                                                        <option value="7"  {{$value->alert == '7' ? 'selected' : ''}}>  7 Days Before</option>
                                                        <option value="14"  {{$value->alert == '14' ? 'selected' : ''}}> 14 Days Before</option>
                                                        <option value="30"  {{$value->alert == '30' ? 'selected' : ''}}> 30 Days Before</option>
                                                    </select>
                                                </div>
                                                <div class="mb-3">
                                                    <label for="file" class="form-label">Document</label>
                                                    <input class="form-control" type="file" name="file" id="file" accept="application/pdf,.xlsx,.xls,image/*,.doc, .docx," required>
                                                    <div id="defaultFormControlHelp" class="form-text">.pdf, .xlsx, .xls, .png, .jpg, .doc, .docx</div>
                                                </div>
                                                <button type="submit" class="btn btn-primary mb-2 d-grid w-100">Save</button>
                                        </div>
                                        <div class="modal-footer">
                                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">
                                            Close
                                        </button>
                                        <button type="submit" class="btn btn-primary">Save</button>
                                        </div>
                                    </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
                @endforeach
            @endif
            
            <!-- / Content -->

            <!-- Footer -->
            @include('includes.footer')
            <!-- / Footer -->

            <div class="content-backdrop fade"></div>
        </div>
        <!-- Content wrapper -->
      </div>
      <!-- / Layout page -->
    </div>

    <!-- Overlay -->
    <div class="layout-overlay layout-menu-toggle"></div>
</div>
@endsection