<?php 

ini_set('display_errors', '1');
ini_set('display_startup_errors', '1');
error_reporting(E_ALL);

include("config.php"); 
include 'inc/header.php'; 
include("functions.php"); 


$sad = get_rating_by_category('FoodQualityrating', 5);

$branch = 0;
$from = NULL;
$to = NULL;
if(isset($_GET['branch'])){
    $branch = $_GET['branch'];
}

if(isset($_GET['from'])){
    $from = $_GET['from'];
}

if(isset($_GET['to'])){
    $to = $_GET['to'];
}

$all_feedbacks = get_all_feedbacks("all", $branch, $from, $to);
$total_customers = $all_feedbacks->num_rows;

$all_branches = get_all_branches();
// foreach ($all_branches as $branch) {

//   var_dump($branch['name']);
// }

?>
   <style type="text/css">
     .card{
        padding: 24px 130px;
        border-radius: 11px;
     }
     .display-5{
        font-size: 100px;
     }
    .card h6{
        font-size: 20px;
     }
     .bg-label-primary{
        background-color: #e8e9ff !important;
        color: #666cff !important;
     }
     .rounded-pill {
        border-radius: 50rem !important;
    }
    .rounded {
        border-radius: .5rem !important;
    }
    .progress{
        --bs-progress-height: 0.75rem;
        --bs-progress-font-size: 0.625rem;
        --bs-progress-bg: #ededff;
        --bs-progress-border-radius: 0;
        --bs-progress-box-shadow: inset 0 1px 2px rgba(76, 78, 100, 0.075);
        --bs-progress-bar-color: #fff;
        --bs-progress-bar-bg: #666cff;
        --bs-progress-bar-transition: width 0.6s ease;
        display: flex;
        height: var(--bs-progress-height);
        overflow: hidden;
        font-size: var(--bs-progress-font-size);
        background-color: var(--bs-progress-bg);
        border-radius: var(--bs-progress-border-radius);
    }
    /*.progress-bar{
        width: 100%;
    }*/
    .gap-3 {
        gap: 1rem !important;
    }
    .d-flex {
        display: flex !important;
    }
    .w-100 {
    width: 100% !important;
}
.text-nowrap {
    white-space: nowrap !important;
}
.px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
}
.justify-content-between {
    justify-content: space-between !important;
}
.flex-column {
    flex-direction: column !important;
}
small{
    font-size: 88% !important;
    font-weight: 500;
    color: black;
}
div.dt-container .dt-search input {
    width: 250px;
    height: 22px;
    }
   </style>

    <!--== BODY CONTNAINER ==-->
    <div class="container-fluid sb2">

        <div class="row">
            <?php include 'inc/sidebar.php';?>
            <div class="sb2-2">
                <div class="sb2-2-2">
                    <ul>
                        <li><a href="#"><i class="fa fa-home" aria-hidden="true"></i> Home</a>
                        </li>
                        <li class="active-bre"><a href="#"> Stars by percentage</a>
                        </li>
                    </ul>
                </div>
                <div class="row">
                    <div class="col col-lg-4 col-md-4 col-sm-12" style="background: #fff;">
                        
                        <form class="row row-cols-lg-auto g-3 align-items-center" style="padding: 20px 10px 20px 10px;">
                            <div class="col col-md-12 col-lg-12 col-sm-12">
                            <label class="visually-hidden" for="inlineFormSelectPref">Branches</label>
                            <select data-mdb-select-init class="select" id="branch">
                              <option value="">All Branches</option>
                              <?php
                              foreach ($all_branches as $branch_row) {
                                ?>
                              <option value="<?= $branch_row['id']; ?>" <?php echo ($branch == $branch_row['id'])?("selected"):("") ?>  ><?= strtoupper($branch_row['name']); ?></option>
                                <?php
                              }
                              ?>
                            </select>
                          </div>
                          
                          <div class="col col-md-6 col-lg-6 col-sm-12">
                            <label for="from">Start Date</label>
                            <input id="from" class="form-control" type="date" value="<?php echo ($from != NULL)?($from):(NULL) ?>" />
                          </div>
                          
                          <div class="col col-md-6 col-lg-6 col-sm-12">
                            <label for="to">End Date</label>
                            <input id="to" class="form-control" type="date" value="<?php echo ($to != NULL)?($to):(NULL) ?>"  />
                          </div>
                        
                          <div class="col col-md-6 col-lg-6 col-sm-12">
                            <a data-mdb-ripple-init type="submit" class="btn btn-primary" id="searchQ">Search</a>
                          </div>
                        </form>
                    </div>
                </div>
                <div class="sb2-2-3">
                    <!-- RATING START  -->
       <div class="row mb-4 g-4">
          <div class="col-md-12">
             <div class="card h-100">
                 <h4 class="py-3 mb-4">Reviews by number</h4>
                <div class="card-body row widget-separator">

                   <div class="col-sm-2 border-shift border-end">
                      <div class="d-flex align-items-center mb-3">
                         <span class="text-primary display-5 fw-normal"><?=$total_customers?></span>
                         <span class='mdi mdi-star mdi-24px ms-1 text-primary'></span>
                      </div>
                      <h6 >Total reviews</h6>
                      <p>All reviews are from genuine customers</p>
                      <!-- <span class="badge bg-label-primary rounded-pill p-2 mb-3 mb-sm-0">+5 This week</span> -->
                      <hr class="d-sm-none">
                   </div>

                   <!-- RATING 1 -->
                   <div class="col-sm-2 g-2 text-nowrap d-flex flex-column justify-content-between px-4 gap-3">
                      <h6 style="font-size:14px">Software Performance</h6>
                      <div class="d-flex align-items-center gap-3">
                         <small>5 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodQualityrating', 5, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>4 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodQualityrating', 4, $branch, $from, $to) ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>3 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodQualityrating', 3, $branch, $from, $to) ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>2 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodQualityrating', 2, $branch, $from, $to) ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>1 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodQualityrating', 1, $branch, $from, $to) ?></small>
                      </div>
                   </div>

                   <!-- RATING 2 -->
                    <div class="col-sm-2 g-2 text-nowrap d-flex flex-column justify-content-between px-4 gap-3">
                      <h4 style="font-size:14px">Issue Resolution Time</h4>
                      <div class="d-flex align-items-center gap-3">
                         <small>5 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodPresentationrating', 5, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>4 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodPresentationrating', 4, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>3 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodPresentationrating', 3, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>2 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodPresentationrating', 2, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>1 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('FoodPresentationrating', 1, $branch, $from, $to); ?></small>
                      </div>
                   </div>

                   <!-- RATING 3 -->
                    <div class="col-sm-2 g-2 text-nowrap d-flex flex-column justify-content-between px-4 gap-3">
                      <h4 style="font-size:14px" >Support Response Time</h4>
                      <div class="d-flex align-items-center gap-3">
                         <small>5 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Atmosphererating', 5, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>4 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Atmosphererating', 4, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>3 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Atmosphererating', 3, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>2 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Atmosphererating', 2, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>1 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Atmosphererating', 1, $branch, $from, $to); ?></small>
                      </div>
                   </div>

                   <!-- RATING 4 -->
                    <div class="col-sm-2 g-2 text-nowrap d-flex flex-column justify-content-between px-4 gap-3">
                      <h4 style="font-size:14px" >Clarity of Communication</h4>
                      <div class="d-flex align-items-center gap-3">
                         <small>5 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Ambiancerating', 5, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>4 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Ambiancerating', 4, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>3 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Ambiancerating', 3, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>2 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Ambiancerating', 2, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>1 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Ambiancerating', 1, $branch, $from, $to); ?></small>
                      </div>
                   </div>

                   <!-- RATING 5 -->
                    <div class="col-sm-2 g-2 text-nowrap d-flex flex-column justify-content-between px-4 gap-3">
                      <h4 style="font-size:14px">Ease of Use</h4>
                      <div class="d-flex align-items-center gap-3">
                         <small>5 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Servicerating', 1, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>4 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Servicerating', 2, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>3 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Servicerating', 3, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>2 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Servicerating', 4, $branch, $from, $to); ?></small>
                      </div>
                      <div class="d-flex align-items-center gap-3">
                         <small>1 Star</small>
                         <div class="progress w-100 rounded" style="height:8px;">
                            <div class="progress-bar bg-primary" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
                         </div>
                         <small class="w-px-20 text-end"><?= get_rating_by_category('Servicerating', 5, $branch, $from, $to); ?></small>
                      </div>
                   </div>


                </div>
             </div>
          </div>
          
       </div>
       <!-- RATING END  -->
       <div class="row">
                        <div class="col-md-12">
                            <div class="box-inn-sp">
                                <div class="inn-title">
                                    <h4>All Customers</h4>
                                    <p>These are customers who given feedbacks.</p>
                                    <a class="dropdown-button drop-down-meta" href="#" data-activates="dr-users"><i class="material-icons">more_vert</i></a>
                                    <ul id="dr-users" class="dropdown-content">
                                        <li><a href="#!">Add New</a>
                                        </li>
                                        <li><a href="#!">Edit</a>
                                        </li>
                                        <li><a href="#!">Update</a>
                                        </li>
                                        <li class="divider"></li>
                                        <li><a href="#!"><i class="material-icons">delete</i>Delete</a>
                                        </li>
                                        <li><a href="#!"><i class="material-icons">subject</i>View All</a>
                                        </li>
                                    </ul>

                                    <!-- Dropdown Structure -->

                                </div>
                                <div class="tab-inn">
                                    <div class="table-responsive table-desi">
            <table id="datatables" class="table table-bordered table-hover table-striped">
                                        <!-- <table class="table table-hover"> -->
                                            <thead>
                                                <tr>
                                                    <th>ID</th>
                                                    <th>Name</th>
                                                    <th>Phone</th>
                                                    <th>Email</th>
                                                    <th>Branch</th>
                                                    <th>Feedback</th>
                                                    <th>View</th>
                                                    <th>Delete</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <?php
                                                     $ccc=1;
                                                     while($row=mysqli_fetch_assoc($all_feedbacks)){
                                                  ?>
                                                <tr>
                                                    <td><?=$ccc;?></td>
                                                    <td><?=$row['name'];?></td>
                                                    <td><?=$row['number'];?></td>
                                                    <td><?=$row['email'];?></td>
                                                    <td><?= get_single_branch($row['branch_id'])['name'];?></td>
                                                    <td><?=$row['message'];?></td>
                                                    <td>
                                                        <a href="feedback-details.php?userId=<?=$row['id'];?>"><i class="fa fa-eye" aria-hidden="true"></i></a>
                                                    </td>
                                                    <td>
                                                        <a href="ajax-request.php?feedback-delete-request=1&feedback_id=<?=$row['id'];?>"><i class="fa fa-trash-o" aria-hidden="true"></i></a>
                                                    </td>
                                                </tr>
                                                <?php
                                                 $ccc++;
                                                 }
                                                ?>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row">
                        <div class="col col-md-12 col-lg-12 col-sm-12">
                            <p style="color:#e8edf2 !important;">asasasasas</p>
                            <p style="color:#e8edf2 !important;">asasasasas</p>
                            <p style="color:#e8edf2 !important;">asasasasas</p>
                        </div>
                    </div>
    </div>
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.0.3/css/dataTables.dataTables.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/3.0.1/css/buttons.dataTables.css">

<script
  src="https://code.jquery.com/jquery-3.7.1.slim.min.js"
  integrity="sha256-kmHvs0B+OpCW5GVHUNjv9rOmY0IvSIRcf7zGUDTDQM8="
  crossorigin="anonymous"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/dataTables.js"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/dataTables.buttons.js"></script>

<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/buttons.dataTables.js"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/jszip.min.js"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/pdfmake.min.js"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/vfs_fonts.js"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/buttons.html5.min.js"></script>
<script src="http://modevze.com/parkinger/assets/bower_components/datatable_stuff/buttons.print.min.js"></script>
<script>
  $(document).ready(function() {
      
      $("#searchQ").click(function(){
       var branch = $('#branch').val();
       var from = $('#from').val();
       var to = $('#to').val();
       
       window.location.href = "feedbacks-by-stars.php?branch="+branch+"&from="+from+"&to="+to+"";
    }); 


      // FOR PDF EXCEL
      new DataTable('#datatables', {
          layout: {
              topStart: {
                  buttons: ['copy', 'csv', 'pdf', 'print']
              }
          }
      });
    });

</script>
<?php include 'inc/footer.php';?>