@extends('layouts.main')

@section('main-content')

    <section class="main-content-section thin-section-border">
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header page-title-row">
                        <p class="float-left">Please select the serfvice you want to generate a bill for</p>
                        <button type="button" class="btn btn-success float-right" data-toggle="modal" data-target="#createMinistry">Add Ministry</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-content collapse show">
                        <div class="card-body card-dashboard">
                            <div class="col-lg-6 col-sm-12 m-auto p-2 thin-section-border">
                                <form action="" class="form-validate" method="POST" id="billServiceSelectorForm">
                                @csrf
                                <input type="hidden" name="type" value="bill_gen_select_service">
                                @if(!empty($ministriesAccessible))
                                    <div class="form-group">
                                        <label class="form-label" for="bill_gen_ministry">Ministry</label>
                                        <div class="form-control-wrap">
                                            <select data-preselected="{{ old('bill_gen_ministry') }}" class="form-select" name="bill_gen_ministry" id="bill_gen_ministry">
                                                <option value=" ">Select Ministry</option>
                                                @foreach($ministriesAccessible as $ministry)
                                                    <option value="{{$ministry->id}}">{{$ministry->display_name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                @endif
                                @if(!empty($departmentAccessible))

                                    <div class="form-group">
                                        <label class="form-label" for="bill_gen_department">Department</label>
                                        <select disabled name="bill_gen_department" id="bill_gen_department" class="form-control" data-preselected="{{ old('bill_gen_department') }}">
                                            <option value="">Select Department</option>
                                            @foreach($departmentAccessible as $dept)
                                                <option data-ministry="{{ $dept->ministry_id }}" value="{{$dept->id}}">{{$dept->display_name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                @endif
                                <div class="form-group">
                                    <label class="form-label" for="bill_gen_service">Service</label>
                                    <div class="form-control-wrap">
                                        <select disabled data-preselected="{{ old('bill_gen_service') }}" class="form-control" name="bill_gen_service" id="bill_gen_service">
                                            <option value="">Select Service</option>
                                            @foreach($servicesAccessible as $service)
                                                <option data-ministry="{{ $service->department->ministry_id }}" data-department="{{ $service->supervisory_department_id }}" value="{{$service->id}}">{{$service->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <button type="submit" class="btn btn-lg btn-success btn-block disabled-btn">Proceed to generate bill</button>
                                </div>
                            </form><!-- form -->

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>


@endsection