@extends('layouts.admin')

@section('css')

<style>
   

.notification-via {
    text-align: center;
    border: 2px solid #cdcdcd;
    padding: 12px 0px;
    border-radius: 5px;
    background: #efefef;
    cursor: pointer;
    transition: all 0.3s;
}
 .notification-via.active {
    border-color: #4634ff;
    position: relative;
}
</style>

@endsection
@section('content')

            <main class="content">
				<div class="container-fluid p-0">

					<div class="row mb-2 mb-xl-3 d-flex justify-content-between">
						<div class="col-auto d-none d-sm-block">
							<h3>All Plans</h3>
						
						</div>
						<div>
						    <a href="javascript:;" class="btn btn-primary me-3" data-bs-target="#addPlan" data-bs-toggle="modal">Add Plan</a>
						</div>

					</div>
				
@include('components.admin.error-message')

<div class="row">
    <div class="col-xl-12">
      
          <div class="row gy-4">
    <!-- User Sidebar -->
    @if(!empty($plans))
    @foreach($plans as $plan)
    <div class="col-xl-4 col-lg-5 col-md-5 order-1 order-md-0">
        <!-- User Card -->
    
        <!-- /User Card -->
        <!-- Plan Card -->
        <div class="card">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-start">
                    <span class="badge bg-label-primary text-dark" style="font-size:1.3rem">{{$plan->name}}</span>
                    <div class="d-flex justify-content-center">
                        <sup class="h5 pricing-currency mt-3 mt-sm-4 mb-0 me-1 text-primary">$</sup>
                        <h4 class="display-5 fw-normal mb-0 text-primary">{{$plan->min_price}}</h4>
                     
                    </div>
                </div>
                <ul class="ps-3 g-2 mb-3">
                    <li>Max Price: {{number_format($plan->max_price,2,'.',',')}}</li>
                    <li class="mb-2">Intervals: {{$plan->intervals}}</li>
                    <li class="mb-2">ROI: {{$plan->percs}}%</li>
                    
                </ul>
                <div class="d-flex justify-content-between align-items-center mb-1">
                    <h6 class="mb-0">Duration</h6>
                    <h6 class="mb-0">{{$plan->duration}} {{$plan->duration_time}}</h6>
                </div>
               
                <div class="d-grid w-100 mt-3 pt-2 justify-space-between">
                    
                    <a href="javascript:;" class="btn btn-primary me-3" data-bs-target="#editPlanModal_{{$plan->id}}" data-bs-toggle="modal">Edit</a>
                    <br/>
               
                    <a href="javascript:;" class="btn btn-primary delete_plan" data-id="{{$plan->id}}" data-name="{{$plan->name}}"  >Delete</a>
                </div>
            </div>
        </div>
        <!-- /Plan Card -->
    </div>
<div class="modal fade" id="editPlanModal_{{$plan->id}}" tabindex="-1" style="display: none;" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-simple modal-edit-user">
        <div class="modal-content p-3 p-md-5">
            <div class="modal-body">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="text-center mb-4">
                    <h3>Edit Plan Information</h3>
                   
                </div>
                <form id="editUserForm" class="row g-3" action="{{ route('admin.plan.edit') }}" method="post">
                    @csrf
                    <div class="col-12 fv-plugins-icon-container">
                        <label class="form-label" for="modalEditUserFirstName">Name</label>
                        <input type="text" id="modalEditUserFirstName" name="name" class="form-control" placeholder="" value="{{$plan->name}}" />
                        <div class="fv-plugins-message-container invalid-feedback"></div>
                    </div>
                 
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Min Price</label>
                        <input type="text" id="modalEditUserEmail" name="price" class="form-control" value="{{$plan->min_price}}" />
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditTaxID">Max Price</label>
                        <input type="text" id="" name="maxi" class="form-control" value="{{$plan->max_price}}" />
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditTaxID">Plan Type</label>
                         <select id="modalEditUserStatus" name="type" class="form-select" aria-label="Default select example">
                           <option selected="{{$plan->type}}">{{$plan->type}}</option>
                            <option value="Main">Main</option>
                            <option value="Promo">Promo</option>
                        
                        </select>
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Interval</label>
                         <select id="modalEditUserStatus" name="interv" class="form-select" aria-label="Default select example">
                             <option selected="{{$plan->intervals}}">{{$plan->intervals}}</option>
                            <option value="Hourly">Hourly</option>
                            <option value="Daily">Daily</option>
                            <option value="Weekly">Weekly</option>
                            <option value="Bi-weekly">Bi-weekly</option>
                            <option value="Monthly">Monthly</option>
                            <option value="Yearly">Yearly</option>
                        </select>
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditTaxID">Percentage</label>
                        <input type="text" id="" name="perc" class="form-control " value="{{$plan->percs}}" />
                    </div>
                    
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Duration</label>
                        <input type="text" id="modalEditUserEmail" name="dur" class="form-control" value="{{$plan->duration}}" />
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Duration Time</label>
                         <select id="modalEditUserStatus" name="dur_time" class="form-select" aria-label="Default select example">
                             <option selected="{{$plan->duration_time}}">{{$plan->duration_time}}</option>
                            <option value="hour">hour</option>
                            <option value="day">day</option>
                            <option value="week">week</option>
                            <option value="month">month</option>
                            <option value="year">year</option>
                        </select>
                    </div>
                    
                    
                    <div class="col-12 text-center mt-4">
                        <button type="submit" class="btn btn-primary ">Submit</button>
                        <button type="reset" class="btn btn-label-secondary" data-bs-dismiss="modal" aria-label="Close">Cancel</button>
                    </div>
                    <div></div>
                   <input type="hidden" /><input type="hidden" name="gixd" value="{{$plan->id}}" />
                </form>
            </div>
        </div>
    </div>
</div>



    @endforeach
    @endif
    <!--/ User Sidebar -->

    <!-- User Content -->
   
    <!--/ User Content -->
</div>

<div class="modal fade" id="addPlan" tabindex="-1" style="display: none;" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-simple modal-edit-user">
        <div class="modal-content p-3 p-md-5">
            <div class="modal-body">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="text-center mb-4">
                    <h3>Add Plan</h3>
                  
                </div>
                <form id="" class="row g-3 " action="{{ route('admin.plan.add') }}" method="post">
                    @csrf
                    <div class="col-12 fv-plugins-icon-container">
                        <label class="form-label" for="modalEditUserFirstName">Name</label>
                        <input type="text" id="modalEditUserFirstName" name="name" class="form-control" placeholder=""  />
                        <div class="fv-plugins-message-container invalid-feedback"></div>
                    </div>
                  
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Min Price</label>
                        <input type="text" id="modalEditUserEmail" name="price" class="form-control"  />
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditTaxID">Max Price</label>
                        <input type="text" id="modalEditTaxID" name="maxi" class="form-control"  />
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditTaxID">Plan Type</label>
                         <select id="modalEditUserStatus" name="type" class="form-select" aria-label="Default select example">
                           
                            <option value="Main">Main</option>
                            <option value="Promo">Promo</option>
                        
                        </select>
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Interval</label>
                         <select id="modalEditUserStatus" name="interv" class="form-select" aria-label="Default select example">
                           
                            <option selected="Hourly">Hourly</option>
                            <option value="Daily">Daily</option>
                            <option value="Weekly">Weekly</option>
                            <option value="Bi-weekly">Bi-weekly</option>
                            <option value="Monthly">Monthly</option>
                            <option value="Yearly">Yearly</option>
                        </select>
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditTaxID">Percentage</label>
                        <input type="text" id="modalEditTaxID" name="perc" class="form-control "  />
                    </div>
                    
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Duration</label>
                        <input type="text" id="modalEditUserEmail" name="dur" class="form-control"  />
                    </div>
                    <div class="col-12 col-md-6">
                        <label class="form-label" for="modalEditUserEmail">Duration Time</label>
                         <select id="modalEditUserStatus" name="dur_time" class="form-select" aria-label="Default select example">
                            
                            <option value="hour">hour</option>
                            <option value="day">day</option>
                            <option value="week">week</option>
                            <option value="month">month</option>
                            <option value="year">year</option>
                        </select>
                    </div>
                    
                    <div class="col-12 text-center mt-4">
                        <button type="submit" class="btn btn-primary ">Submit</button>
                        <button type="reset" class="btn btn-label-secondary" data-bs-dismiss="modal" aria-label="Close">Cancel</button>
                    </div>
                    <div></div>
                    <input type="hidden" />
                </form>
            </div>
        </div>
    </div>
</div>
    
    </div>
</div>

				</div>
			</main>


@endsection

@section('script')
<script>
    $(function(){
        
        $('.delete_plan').on('click' , function(){
        var dataid = $(this).attr('data-id'); 
        var dataname = $(this).attr('data-name'); 
       

        if (confirm(`are you sure want to delete ${dataname}?`)) {

            window.location.href = "{{secure_url('admin/plans/delete')}}/"+dataid;
            

        }
        })
        
       
    })
</script>
@endsection