@extends('layouts.master')

@section('mainContent')

    <div class="page-wrapper">
        <div class="page-header-link">
            <a href="javascript:;" class="show-menuheader">
                Project Menus
                <i class="fas fa-align-left ms-auto"></i>
            </a>
        </div>
        <div class="page-menu">
            <div class="page-menu-header">
                <h2>Project Menu</h2>
                <a href="javascript:;" class="close-header-menu"> <i class="fas fa-close"></i></a>
            </div> 
            @include('layouts.tenants.policy-header-menu') 
        </div> 
        <div class="content">
            <div class="row">
                <div class="col-12">
                    <div class="page-header">
                        <h3>Policies</h3>
                        <ul>
                            <li class="text-primary">Project Management</li>
                            <li><a href="javascript:;">Policies</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="row">

                <div class="col-12 d-flex widget-path widget-service">
                    <div class="card">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-lg-4">
                                    <div class="datatable-search"></div>
                                </div>
                                <div class="col-lg-8">
                                    <ul class="btn-header-split"> 
                                    <li>
                                        <div class="project_lists">
                                            <select class="select" name="policy_type" id="policy_type">
                                                <option value="">Select Policy Type</option>  
                                                <option value="Policy" @selected(session('policy_type')=='Policy')>Policy</option>
                                                <option value="Procedure" @selected(session('policy_type')=='Procedure')>Procedure</option> 
                                                <option value="Guidelines" @selected(session('policy_type')=='Guidelines')>Guidelines</option> 

                                            </select>
                                            </div>
                                       </li>
                                       @if(Auth::user()->hasPermission('policies','create')) 
                                       <li>
                                       <a class="btn btn-primary" id="add_policy_click"><i class="fe fe-plus me-2"></i>New Policies</a>
                                       </li>
                                       @endif  
                                       <li>
                                       <!-- {{ url('policies/export/excel') }} -->
                                            <a href="#" class="btn btn-secondary-outline export_policy">Export<i class="fe fe-copy ms-2"></i></a>
                                        </li> 
 
                                    </ul>
                                </div>
                            </div>
                        <div class="table-responsive">
                            <table class="table" id="policy_list_table">
                                <thead>
                                    <tr>
                                    <th>Policy Name</th>
                                    <th>Owner</th>
                                    <th>Standard</th>
                                    <th>Organization</th>
                                    <th>Release date</th>
                                    <th>Status</th> 
                                    <th>Action</th> 
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                        <div class="row align-items-center">
                            <div class="col-md-12">
                                <div class="datatable-paginate"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> 
    </div>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Check if a tab was saved in the session
            localStorage.setItem('activeTab', '#nav-documents');
            const activeTab = "#nav-documents";
            if (activeTab) {
                // Remove 'active' class from all tabs and tab panes
                document.querySelectorAll('.nav-link').forEach(tab => tab.classList.remove('active'));
                document.querySelectorAll('.tab-pane').forEach(pane => pane.classList.remove('show', 'active'));

                // Add 'active' class to the saved tab and its corresponding pane
                const savedTab = document.getElementById(activeTab);
                if (savedTab) {
                    savedTab.classList.add('active');
                    const targetPane = savedTab.getAttribute('data-bs-target');
                    if (targetPane) {
                        document.querySelector(targetPane).classList.add('show', 'active');
                    }
                }
            }
        });
    </script> 
@endsection
@section('customModal')
<!-- Add -->
<div class="modal fade modal-customization" id="add_policy_modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog modal-lg">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="modal-heading">Add Policies</h5>
              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                    <i class="fe fe-x"></i>
              </button>
            </div> 
            <form id="policyForm"> 
            <input type="hidden" name="edit_id" value="" id="edit_id"> 
            <input type="hidden" name="page" value="{{ $page }}" id="page"> 
            <div class="modal-body"> 
                <div class="row">
                <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="vendor_name_div">
                            <label class="form-label">Policy name <span class="manitory">*</span></label>
                            <input type="text" class="form-control" name="policy_name" id="policy_name" placeholder="Enter policy name" >
                        </div>
                </div>  
                <div class="col-lg-4 col-md-4  col-md-12 ">                        
                    <div class="mb-3" id="standard_div">
                        <label class="form-label">Standard <span class="manitory">*</span></label> 
                        <select class="select form-control" name="standard[]" id="standard" multiple> 
                        @if($standard) 
                            @foreach($standard as $row) 
                                <option value="{{ $row->id }}">{{ $row->standard_name }}</option>
                            @endforeach     
                        @endif  
                        </select>    
                    </div>
                </div>
                <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="department_div">
                          <label class="form-label">Department <span class="manitory">*</span></label> 
                           <select class="select" name="department" id="department">
                           <option value="">Select</option>
                            @if($department) 
                                @foreach($department as $row) 
                                    <option value="{{ $row->id }}">{{ $row->department_name }}</option>
                                @endforeach     
                            @endif  
                            </select>    
                        </div>
                </div>

                <div class="col-lg-4 col-md-12 ">
                        <div class="mb-3" id="created_date_div">
                            <label class="form-label">Created date <span class="manitory">*</span></label>
                            <div class="cal-icon">
                                <input type="text" class="form-control date-input datepicker" name="created_date" id="created_date" placeholder="DD-MM-YYYY" >
                            </div>
                        </div>
                </div>  

                <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="organization_div">
                            <label class="form-label"> Organization <span class="manitory">*</span></label>
                            <input type="text" class="form-control" name="organization" id="organization" placeholder="Enter organization" >
                        </div>
                </div>  

                <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="location_div">
                          <label class="form-label">Location <span class="manitory">*</span></label> 
                           <select class="select" name="location" id="location"> 
                                <option value="">Select Location</option>
                                @if (!empty($location))
                                    @foreach ($location as $org)
                                        <option value="{{ $org->id }}">{{ $org->org_name. ' ('.$org->location_city.','.$org->location_pincode.')' }}</option>
                                    @endforeach
                                @endif 
                            </select>    
                        </div>
                </div>

                    <!-- <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="status_div">
                            <label class="form-label">Status <span class="manitory">*</span></label> 
                            <select class="select" name="status" id="status" >
                            <option value="">Select</option>
                            <option value="1">Active</option>
                            <option value="0">Expired</option>
                            </select>    
                        </div>
                    </div> -->
                    <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="owner_div">
                          <label class="form-label">Owner <span class="manitory">*</span></label> 
                           <select class="select" name="owner" id="owner">
                           <option value="">Select</option>
                            @if($users) 
                                @foreach($users as $row) 
                                    <option value="{{ $row->id }}">{{ $row->first_name.' '.$row->last_name }}</option>
                                @endforeach     
                            @endif  
                            </select>    
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="policy_type_div">
                          <label class="form-label">Policy Type <span class="manitory">*</span></label> 
                           <select class="select" name="policy_type" id="policy_type">
                           <option value="">Select</option>
                           <option value="Policy">Policy</option>
                           <option value="Procedure">Procedure</option>
                           <option value="Guidelines">Guidelines</option>
                            </select>    
                        </div>
                    </div> 
                    <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="reviewer_div">
                          <label class="form-label">Reviewer <span class="manitory">*</span></label> 
                           <select class="select" name="reviewer" id="reviewer">
                           <option value="">Select</option>
                            @if($users) 
                                @foreach($users as $row) 
                                    <option value="{{ $row->id }}">{{ $row->first_name.' '.$row->last_name }}</option>
                                @endforeach     
                            @endif  
                            </select>    
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-4  col-md-12 ">                        
                        <div class="mb-3" id="approver_div">
                          <label class="form-label">Approver <span class="manitory">*</span></label> 
                           <select class="select" name="approver" id="approver">
                           <option value="">Select</option>
                            @if($users) 
                                @foreach($users as $row) 
                                    <option value="{{ $row->id }}">{{ $row->first_name.' '.$row->last_name }}</option>
                                @endforeach     
                            @endif  
                            </select>    
                        </div>
                    </div>
            </div>
 
            <div class="modal-footer">
            <!-- <button type="submit" class="btn btn-primary">Create New</button> -->
              <button type="button" class="btn btn-primary" id="add_policy_save">Create New</button>
              <button type="button" class="btn btn-cancel" data-bs-dismiss="modal">Cancel</button>
            </div>
        </form>
          </div>
        </div>
    </div>
    </div>
    </div>
<!-- /Add -->
<div class="modal fade" id="delete_policy_modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered ">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Delete Policies</h5>
                <button type="button" class="btn-close close-modal" data-bs-dismiss="modal" aria-label="Close">
                    <i class="fe fe-x"></i>
                </button>
            </div>
            <form>
                
                <div class="modal-body">
                    <div class="del-modal">
                        <p>Are you sure want to Delete?</p>
                    </div>
                </div>
                <div class="modal-footer pt-0">
                <input type="hidden" class="form-control" name="policy_id" id="policy_id" value="" readonly>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-primary" id="delete_st_btn">Yes</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection