@extends('backend.layout.master')
@include('backend.kg-settings.css')
@section('content')

    <div class="page-body">
        <div class="container">
            <div class="page-header">
                <div class="row">
                    <div class="col-lg-6 main-header">
                        <h2><span>Settings</span></h2>

                    </div>
                    <!-- <div class="col-lg-6 breadcrumb-right">
                      <button class="btn btn-pill btn-primary btn-air-primary" type="button" data-original-title="btn btn-pill btn-primary btn-air-primary" title=""><i class="fas fa-calendar-week"></i>  View Report</button>
                      <button class="btn btn-pill btn-light round-pill" type="button" data-original-title="btn btn-pill btn-primary btn-air-primary" title=""><i class="fas fa-archive"></i></button>
                      <button class="btn btn-pill btn-danger round-pill" type="button" data-original-title="btn btn-pill btn-primary btn-air-primary" title=""><i class="fas fa-user-times"></i></button>

                    </div> -->
                </div>
            </div>
        </div>

        <div class="container">
            <div class="row">
                <div class="col-sm-12 col-xl-12 xl-100">
                    <div class="validation-errors mt-3"></div>
                    <ul class="nav nav-tabs nav-material" id="top-tab" role="tablist">
                        <li class="nav-item"><a class="nav-link active show" id="top-general-tab" data-toggle="tab"
                                                href="#top-general" role="tab" aria-controls="top-general"
                                                aria-selected="true"><i class="icofont icofont-ui-home"></i>General</a>
                            <div class="material-border"></div>
                        </li>
                        <li class="nav-item"><a class="nav-link" id="profile-top-tab" data-toggle="tab"
                                                href="#top-holidays" role="tab" aria-controls="top-holidays"
                                                aria-selected="false"><i class="icofont icofont-man-in-glasses"></i>Holidays</a>
                            <div class="material-border"></div>
                        </li>
                        <li class="nav-item"><a class="nav-link" id="contact-top-tab" data-toggle="tab"
                                                href="#top-group" role="tab" aria-controls="top-group"
                                                aria-selected="false"><i class="icofont icofont-contacts"></i>Groups</a>
                            <div class="material-border"></div>
                        </li>
                        <li class="nav-item"><a class="nav-link" id="contact-top-tab" data-toggle="tab"
                                                href="#top-billing" role="tab" aria-controls="top-billing"
                                                aria-selected="false"><i
                                    class="icofont icofont-contacts"></i>Billing</a>
                            <div class="material-border"></div>
                        </li>
                    </ul>
                    <div class="tab-content" id="top-tabContent">
                        <div class="tab-pane fade active show" id="top-general" role="tabpanel"
                             aria-labelledby="top-general-tab">
                            <div class="col-sm-12 col-xl-6">
                                <div class="card shadow-0 border">
                                    <div class="card-body">
                                        <form class="form theme-form" id="generalForm">
                                            <div class="card-body">
                                                <div class="row">
                                                    <div class="col">
                                                        <div class="form-group">
                                                            <label for="exampleFormControlInput1">Full Time
                                                                Price</label>
                                                            <input class="form-control" name="full_time_price"
                                                                   type="number" min="0"
                                                                   value="{{ $user->full_time_price }}">
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row">
                                                    <div class="col">
                                                        <div class="form-group">
                                                            <label for="exampleFormControlInput1">Part Time
                                                                Price</label>
                                                            <input class="form-control" name="part_time_price"
                                                                   type="number" min="0"
                                                                   value="{{ $user->part_time_price }}">
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row">
                                                    <div class="col">
                                                        <div class="form-group">
                                                            <button class="btn btn-pill btn-primary" type="submit">
                                                                Update
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane fade" id="top-holidays" role="tabpanel" aria-labelledby="profile-top-tab">
                            <div class="row">
                                <div class="col-md-6">

                                    <div class="order-history table-responsive">
                                        <table class="table display " id="holiday-table">
                                            <thead>
                                            <tr>
                                                <th scope="col">Date</th>
                                                <th class="no-sort" scope="col">Name</th>
                                                <th class="no-sort" scope="col">Actions</th>
                                            </tr>
                                            </thead>
                                            <tbody>

                                            </tbody>
                                        </table>

                                    </div>

                                </div>
                                <div class="col-md-6">
                                    <div class="loading">
                                        <div class="spinner-border" role="status">
                                            <span class="sr-only">Loading...</span>
                                        </div>
                                    </div>
                                    <div class="card shadow-0 border">
                                        <div class="card-header">
                                            <h5 id="holiday_form_title">Add Holiday</h5>
                                        </div>
                                        <div class="card-body  overlay-div">

                                            <form class="form theme-form" id="holidayForm">
                                                <input type="hidden" name="holiday_id" id="holiday_id" value="0">
                                                <div class="card-body">
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <label>Name</label>
                                                                <input class="form-control"
                                                                       id="holiday_name" name="holiday_name" type="text"
                                                                       placeholder="Name">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <label>Date</label>
                                                                <input class="datepicker-here form-control"
                                                                       type="text" id="holiday_date" name="holiday_date"
                                                                       data-language="en"
                                                                       readonly
                                                                       placeholder="MM/DD/YYYY">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <button class="btn btn-pill btn-primary"
                                                                        id="holidaySubmitBtn" type="submit">
                                                                    Add
                                                                </button>

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

                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane fade" id="top-group" role="tabpanel" aria-labelledby="contact-top-tab">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="order-history table-responsive">
                                        <table class="table display " id="group-table">
                                            <thead>
                                            <tr>
                                                <th scope="col">GROUP</th>
                                                <th scope="col"></i>ACTIONS</th>
                                            </tr>
                                            </thead>
                                            <tbody>

                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                                <div class="col-md-6">

                                    <div class="loading">
                                        <div class="spinner-border" role="status">
                                            <span class="sr-only">Loading...</span>
                                        </div>
                                    </div>
                                    <div class="card shadow-0 border">
                                        <div class="card-header">
                                            <h5 id="group_form_title">Add Group</h5>
                                        </div>
                                        <div class="card-body  overlay-div">
                                            <form class="form theme-form" id="groupForm">
                                                <input type="hidden" name="group_id" id="group_id" value="0">
                                                <div class="card-body">
                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <label for="exampleFormControlInput1">Group Name</label>
                                                                <input class="form-control" id="group_name" type="text"
                                                                       name="group_name"
                                                                       placeholder="Group Name">
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="row">
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <button class="btn btn-pill btn-primary"
                                                                        id="groupSubmitBtn" type="submit">
                                                                    Add
                                                                </button>

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

                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane fade" id="top-billing" role="tabpanel" aria-labelledby="contact-top-tab">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="order-history table-responsive">
                                        <table class="table display" id="basic-36">
                                            <thead>
                                            <tr>
                                                <th scope="col">DATE</th>
                                                <th scope="col">ACTIVITY</th>
                                                <th scope="col"></i>AMOUNT</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @foreach($billing as $bill)
                                                <tr>
                                                    <td>
                                                        <div
                                                            class="product-name">{{ date('m/d/Y',strtotime($bill->created_at)) }} </div>
                                                    </td>
                                                    <td>
                                                        <div class="product-name">Subscription</div>
                                                    </td>
                                                    <td>
                                                        <div class="product-name">
                                                            ${{ round($bill->amount,2) }} </div>
                                                    </td>
                                                </tr>
                                            @endforeach

                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>


            </div>
        </div>
    </div>
@endsection
@section('page_js')
    @include('backend.kg-settings.js')
@endsection