@extends('frontend_template')
@section('content')
<br><br>
<section class="user_list mb-5">
    <div class="container">
        <div class="row mb-3">
            <div class="col-9">
                <h3>Audience Hall Session Visit Report</h3>
            </div>
            <div class="col-3">
                <form method="GET" action="{{ url('report-hallsession-attendance'); }}">
                    <select name="graph" class="form-control" onchange="this.form.submit()">
                        <option>Select Graph Type</option>
                        <option value="1" {{isset($_GET['graph']) && $_GET['graph'] == 1 ? 'Selected' :'selected'}}>Bar Graph</option>
                        <option value="2" {{isset($_GET['graph']) && $_GET['graph'] == 2 ? 'Selected' :''}}>Donught Graph</option>
                        <option value="3" {{isset($_GET['graph']) && $_GET['graph'] == 3 ? 'Selected' :''}}>Pie Graph</option>
                    </select>
                </form>
            </div>
        </div>
        <div class="row">
            <div class="col-6">
                              </div>
            <div class="col-6">
                <div class="table-responsive">
                    <table class="table table-bordered table-hover">
                        <tbody>
                            <tr class="table-dark">
                                <th></th>
                                <th>Audience Visit Count</th>
                            </tr>
                                                        <tr class="table-dark"></tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>
<br>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"></script>
@if(isset($_GET['graph']) && ($_GET['graph'] == 2 || $_GET['graph'] == 3 ))
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/emn178/chartjs-plugin-labels/src/chartjs-plugin-labels.js"></script>
@endif
<script type="text/javascript">
  const getRanHex = size => {
    let result = [];
    let hexRef = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f'];

    for (let n = 0; n < size; n++) {
      result.push(hexRef[Math.floor(Math.random() * 16)]);
    }
    return result.join('');
  }
    </script>
@endsection