@extends('layouts.admin')
@section('content')
<div class="card">
    <div class="card-header">
        Promoter Sales Reports
    </div>
    <div class="card-body">
        <div class="form-group">
            <form>
                <div class="form-row d-flex align-items-center">
                    <div class="col-12 col-md-3">
                        <label class="required" for="employee">Promoter :</label>
                        <select class="form-control" name="promoter" id="promoter">
                            <option value="0" hidden>Select a promoter</option>
                            @foreach($promoters as $id => $promoter_name)
                                <option value="{{ $id }}" {{ request()->input('promoter') == $id ? 'selected' : '' }}>{{ $promoter_name }}</option>
                            @endforeach
                        </select>
                        @if($errors->has('employee'))
                            <div class="invalid-feedback">
                                {{ $errors->first('employee') }}
                            </div>
                        @endif
                    </div>
                    <div class="col-12 col-md-3">
                        <label class="required" for="available_store">Available Store :</label>
                        <select class="form-control" name="available_store" id="available_store">
                            <option value="0" hidden>Select a available store</option>
                            @foreach($availableStores as $id => $availableStorename)
                                <option value="{{ $id }}" {{ request()->input('available_store') == $id ? 'selected' : '' }}>{{ $availableStorename }}</option>
                            @endforeach
                        </select>
                        @if($errors->has('available_store'))
                            <div class="invalid-feedback">
                                {{ $errors->first('available_store') }}
                            </div>
                        @endif
                    </div>
                    <div class="col-12 col-md-2">
                        <button class="btn btn-success d-inline-block" type="submit">Filter</button>
                    </div>
                </div>
            </form>
        </div>
        <div class="form-group">
            <div class="table-responsive">
                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th style="border: unset;"></th>
                            <th style="border: unset;"></th>
                            <th style="border: unset;"></th>
                            <th colspan="8">Sales in Unit</th>
                            <th style="border: unset;"></th>
                        </tr>
                        <tr>
                            <th>PT Code</th>
                            <th>SKU Description</th>
                            <th>Opening Stock (Unit)</th>
                            <th>Mon</th>
                            <th>Tue</th>
                            <th>Wed</th>
                            <th>Thu</th>
                            <th>Fri</th>
                            <th>Sat</th>
                            <th>Sun</th>
                            <th>Total Sales (Unit)</th>
                            <th>Closing Stock (Unit)</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>101131393</td>
                            <td>HG Choco Sachet 12's</td>
                            <td>5</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td>1</td>
                            <td></td>
                            <td></td>
                            <td>4</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
@parent
{{-- <script src="https://cdn.jsdelivr.net/npm/chart.js@3.7.1/dist/chart.min.js"></script> --}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
@endsection