@extends('layouts.master')
@section('title', 'Pricing Plans')
@section('pagetitle', 'List of Plans')
@section('content')
    <div class="main">
        <div class="header mb-30">
            <h1 class="hd">Pricing Plans</h1>
            <div class="header">
                <button
                    id="addCareerBtn" data-modal-target="#add-career" class="start">
                    <span class="material-icons-sharp">add</span>Add new Plan
                </button>
            </div>
        </div>

        <div class="subHeading mb-30">
            <div class="tabletabs">
                <div class="tabletab l-active" data-targetname="all">
                    <h4 class="tabletab-text t-active">All Plans</h4>
                    <span class="tabletab-number number active">{{ $allPricingCnt }}</span>
                </div>
            </div>


            <div class="rightsub">
                <div class="ml-10">
{{--                    <button type="submit" class="more">Import List</button>--}}
{{--                    <button type="submit" class="more">Export List</button>--}}
                </div>
            </div>
        </div>

        <div id="all" class="table-data careers">
            <table>
                <thead>
                <tr>
                    <th>Name</th>
                    <th>Role</th>
                    <th>Price</th>
                    <th>Duration(In days)</th>
                    <th>Allowable Number Of Students</th>
                    <th>Allow Alumni?</th>
                    <th class="width-l">Date Created</th>
                    <th class="width-l">Action</th>
                </tr>
                </thead>
                <tbody>
                @foreach($pricingPlans as $pricingPlan)
                    <tr>
                        <td style="max-width: 155px;">{{ !empty(data_get($pricingPlan, 'name')) ?  data_get($pricingPlan, 'name')  : "-" }}</td>
                        <td>{{ !empty(data_get($pricingPlan, 'role_id')) ?  $roles[data_get($pricingPlan, 'role_id')]  : "-" }}</td>
                        <td>{{ !empty(data_get($pricingPlan, 'price')) ?  data_get($pricingPlan, 'price')  : "-" }}</td>
                        <td>{{ !empty(data_get($pricingPlan, 'duration')) ?  data_get($pricingPlan, 'duration')  : "-" }}</td>
                        <td>{{ !empty(data_get($pricingPlan, 'student_number')) ?  data_get($pricingPlan, 'student_number')  : "-" }}</td>
                        <td>{{ !empty(data_get($pricingPlan, 'alumni_only')) ?  "Yes"  : "No" }}</td>
                        <td>{{ !empty(show_date($pricingPlan->created_at)) ?  show_date($pricingPlan->created_at)  : "-" }}</td>
                        <td class="text-center align-middle">
                            <button
                                id="editPricingBtn"
                                class="btn btn-icon edit" data-modal-target="#edit-career"
                                data-id="{{ !empty(data_get($pricingPlan, 'id')) ?  data_get($pricingPlan, 'id')  : "-" }}"
                                data-role_id="{{ !empty(data_get($pricingPlan, 'role_id')) ?  data_get($pricingPlan, 'role_id')  : "-" }}"
                                data-name="{{ !empty(data_get($pricingPlan, 'name')) ?  data_get($pricingPlan, 'name')  : "-" }}"
                                data-pricing="{{ !empty(data_get($pricingPlan, 'price')) ?  data_get($pricingPlan, 'price')  : "-" }}"
                                data-duration="{{ !empty(data_get($pricingPlan, 'duration')) ?  data_get($pricingPlan, 'duration')  : "-" }}"
                                data-alumni_only="{{ !empty(data_get($pricingPlan, 'alumni_only')) ?  data_get($pricingPlan, 'alumni_only')  : 0 }}"
                                data-student_number="{{ !empty(data_get($pricingPlan, 'student_number')) ?  data_get($pricingPlan, 'student_number')  : "-" }}"
                                data-description="{{ !empty(data_get($pricingPlan, 'description')) ?  data_get($pricingPlan, 'description')  : "-" }}"
                                title="@lang('Edit Plan')"
                                data-toggle="tooltip" data-placement="top">
                                <i class="fas fa-edit"></i>
                            </button>

                            <a href="{{ route('super.pricing.destroy', $pricingPlan) }}"
                               class="btn btn-icon js-remove-list-item"
                               title="@lang('Delete Plan')"
                               data-toggle="tooltip"
                               data-placement="top"
                               data-method="DELETE"
                               data-url = "{{ route('super.pricing.destroy', $pricingPlan) }}"
                               data-confirm-title="@lang('Please Confirm')"
                               data-confirm-text="@lang('Are you sure that you want to delete this plan?')"
                               data-confirm-delete="@lang('Yes, delete!')">
                                <i class="fas fa-trash"></i>
                            </a>
                        </td>
                    </tr>
                @endforeach


                </tbody>
            </table>

            {!! $pricingPlans->render() !!}
        </div>
    </div>

    <div id="add-career" class="addnew-modal">
        <div class="cl">
            <div id="close-school-modal" class="x-cancel close-modal-btn">
                <span class="material-icons-sharp">close</span>
                <h5 style="display: inline">Close</h5>
            </div>

            <h1>Add New Plan</h1>
        </div>
        <div class="input mt-30">
            @include('layouts.partials.messages')
            <form action="{{ route('super.pricing.addnew') }}" class="form-careers-add js-ajax-form"
                  id="form-careers-add" method="POST">
                @csrf
                <div class="form-result"></div>
                <div class="career-details">
                    <div class="row">
                        <div class="intro">
                            <select name="role_id" id="careerRole_add" required>
                                <option value="">Select the User Role</option>
                                @foreach($roles as $key=>$role)
                                    <option value="{{$key}}">{{$role}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                            <input
                                type="text"
                                class="intro_input"
                                placeholder=" "
                                required
                                name="name"
                                id="careerName_add"
                            />
                            <label for="name" class="intro_label">Pricing Name*</label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="intro">
                            <input
                                type="number"
                                class="intro_input"
                                placeholder=""
                                required
                                name="pricing"
                                id="careerPrice_add"
                            />
                            <label for="name" class="intro_label">Pricing Price*</label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="intro">
                            <input
                                type="number"
                                class="intro_input"
                                placeholder=""
                                required
                                name="duration"
                                id="careerDuration_add"
                            />
                            <label for="name" class="intro_label">Pricing Plan Duration*</label>
                        </div>
                    </div>
                    <div class="intro">
                        <textarea name="description" id="description" placeholder=" " required rows="3"
                                  class="intro_input career-description">
                        </textarea>
                        <label for="name" class="intro_label">Description*</label>
                    </div>
                    <div class="row">
                        <div class="intro">
                            <input
                                type="number"
                                class="intro_input"
                                placeholder=""
                                name="student_number"
                                id="careerStudentNumber_add"
                            />
                            <label for="name" class="intro_label">Student Number Per Plan*</label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" name="alumni_only" value="1"
                                   id="careerStatus_add">
                            <label class="form-check-label" for="careerStatus_edit">Allow mentors to be alumni?</label>
                        </div>
                    </div>
                    <div class="row">
                        <button type="submit" form="form-careers-add" class="formsubmitbtn editbtn">Add Plan</button>
                        <button type="reset" form="form-careers-add" class="formsubmitbtn more">Clear</button>
                    </div>
                </div>

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

    <div id="edit-career" class="addnew-modal">
        <div class="cl">
            <div id="close-school-modal" class="x-cancel close-modal-btn">
                <span class="material-icons-sharp">close</span>
                <h5 style="display: inline">Close</h5>
            </div>

            <h1>Edit Plan</h1>
        </div>
        <div class="input mt-30">
            @include('layouts.partials.messages')
            <form action="{{ route('super.pricing.update') }}" class="form form-careers-edit js-ajax-form"
                  id="form-careers-edit" method="PUT">
                @csrf
                <div class="form-result"></div>
                <div class="career-details">
                    <div class="row">
                        <div class="intro">
                            <input type="text" hidden name="id" id="pricingId_edit"/>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                            <input type="text" hidden name="role_id" id="pricingRoleId_edit"/>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                            <input
                                type="text"
                                class="intro_input"
                                placeholder=" "
                                required
                                name="name"
                                id="pricingName_edit"
                            />
                            <label for="" class="intro_label">Pricing Plan Name*</label>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                            <input
                                type="number"
                                class="intro_input"
                                placeholder=" "
                                required
                                name="pricing"
                                id="pricingPrice_edit"
                            />
                            <label for="" class="intro_label">Pricing Plan Cost*</label>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                            <input
                                type="number"
                                class="intro_input"
                                placeholder=" "
                                required
                                name="duration"
                                id="pricingDuration_edit"
                            />
                            <label for="" class="intro_label">Pricing Duration*</label>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                        <textarea name="description" id="pricingDescription_edit" placeholder=" " required rows="3"
                                  class="intro_input career-description">
                        </textarea>
                            <label for="name" class="intro_label">Career Description*</label>
                        </div>
                    </div>

                    <div class="row">
                        <div class="intro">
                            <input
                                type="number"
                                class="intro_input"
                                placeholder=" "
                                required
                                name="student_number"
                                id="pricingStudentNumber_edit"
                            />
                            <label for="" class="intro_label">Number of Students Allowed</label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" name="alumni_only" value="1"
                                   id="pricingAlumniOnly_edit">
                            <label class="form-check-label" for="pricingAlumniOnly_edit">Allow mentors to be
                                alumni?</label>
                        </div>
                    </div>
                    <div class="row">
                        <button type="submit" form="form-careers-edit" class="formsubmitbtn editbtn">Edit Plan</button>
                        <button type="reset" form="form-careers-edit" class="formsubmitbtn more">Clear</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection