@extends('backend.layouts.app')

@section('content')

    <div class="feature-page">
        <h1 class="main-heading">Features</h1>
        <div class="page-content bg-white">

            <div class="section-tabs">
                <ul class="nav nav-tabs" role="tablist">
                    <li class="nav-item" role="presentation">
                        <a class="nav-link active" id="user-tab" data-toggle="tab" href="#userPlan-tab" role="tab" aria-controls="userTab" aria-selected="true"><i class="icons icon-user-plan"></i> User Subscriptions Plan</a>
                    </li>
                    <li class="nav-item" role="presentation">
                        <a class="nav-link" id="featuring-tab" data-toggle="tab" href="#feature-tab" role="tab" aria-controls="profile" aria-selected="false"><i class="icons icon-featuring"></i> Featuring Tools</a>
                    </li>
                    <li class="nav-item" role="presentation">
                        <a class="nav-link" id="featuring-tab" data-toggle="tab" href="#feature-tab" role="tab" aria-controls="profile" aria-selected="false"><i class="icons icon-featuring"></i> General Settings</a>
                    </li>
                </ul>
                <div class="tab-content" id="myTabContent">
                    <div class="div border-bottom pb-3 ">
                        <h2 class="page-heading mb-1">Create a New Plan</h2>
                        <div class="">Create subscription plan to add a new subscription plan and get started</div>
                    </div>
                    <!--user plan tab content-->
                    <div class="tab-pane fade show active" id="userPlan-tab" role="tabpanel" aria-labelledby="user-tab">


                        <!--define plan name content-->
                        <div class="definePlan-content">

                            <div class="sellerBuyers-tabs">

                                <div class="tab-content" id="pills-tabContent">

                                <!--seller tab content-->
                                <div class="admin-list-table tab-pane fade show active" id="sellers-tab" role="tabpanel" aria-labelledby="pills-seller-tab">




                                    {{-- Create Plan --}}
                        <form action="{{url('/admin/saveFeatureTool')}}" method="POST" enctype="multipart/form-data">
                                     {{ csrf_field()}}
                                     @if(isset($listPackages->id))
                                     <input type="hidden" name="id" value="{{ $listPackages->id}}">
                                     @endif
                                    <div class="userPlan-opt mt-3">
                                        <div class="select-opt row">
                                            <div class="col-md-5">
                                                <div class="row">
                                                    <div class="form-group col-md-3">
                                                        <div class="planThumbimg">
                                                            <div class="uploadThumbimg {{ $errors->has('icon') ? ' is-invalid' : '' }}" onclick="$('#myfileid').trigger('click'); return true;"><i class="icons icon-upload-img"></i></div>
                                                           @if(empty($listPackages->icon))
                                                            <img src="{{ url('/public/assets/img/define-img.png') }}" class="img-fluid" alt="" >
                                                            @else
                                                            <img src="{{ url('/public/'.$listPackages->icon) }}" class="img-fluid" alt="" >
                                                            @endif

                                                            <input type="file" name="icon" style="display:none;" id="myfileid" value="{{$listPackages->icon ?? " "}}">
                                                        </div>
                                                    </div>
                                                    <div class="form-group col-md-9">
                                                        <label >Define Plan Name</label>
                                                        <input type="text" name="name" class="form-control {{ $errors->has('name') ? ' is-invalid' : '' }}" placeholder="Enter Plan Name" value="{{$listPackages->name ?? " "}}" />
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-7">
                                                <div class="row">
                                                    <div class="form-group col-md-6">
                                                        <label >Display Name</label>
                                                        <input type="text" name="display_name" class="form-control {{ $errors->has('display_name') ? ' is-invalid' : '' }}" placeholder="Enter Plan Name" value="{{$listPackages->display_name ?? " "}}"/>
                                                    </div>


                                                    <div class="form-group col-md-6">
                                                        <label >Account Type/Role</label>
                                                        <select name="role" class="form-control aiz-selectpicker {{ $errors->has('role') ? ' is-invalid' : '' }}">
                                                            <option value=""> Select</option>
                                                            <option value="seller" @if(isset($listPackages->role) && $listPackages->role == "seller") selected @endif > Seller</option>
                                                            <option value="buyer" @if(isset($listPackages->role) && $listPackages->role == "buyer") selected @endif> Buyer</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <hr>
                                            </div>
                                            <hr>
                                            <div class="col-md-5">
                                                <div class="row">
                                                    <div class="col-md-12">
                                                        <label >Plan Description</label>
                                                        <textarea name="description" id="" cols="10" rows="5" class="form-control {{ $errors->has('description') ? ' is-invalid' : '' }}"> {{$listPackages->description ?? " "}}</textarea>
                                                        <div class="small mt-1 mb-3">Plan Description displayed to customers on product page on plan selection.</div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-7">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <div class="row form-group">
                                                            <div class="col-md-12"><label >Billing Cycle(Frequency)</label></div>
                                                            <div class="col-md-6">
                                                                <input name="billing_cycle" type="number" class="form-control {{ $errors->has('billing_cycle') ? ' is-invalid' : '' }}" value="{{$listPackages->billing_cycle ?? " "}}">
                                                            </div>
                                                            <div class="col-md-6">
                                                                <div class="dropdown bootstrap-select form-control subs-input">
                                                                    <button type="button" class="btn dropdown-toggle btn-light" data-toggle="dropdown" role="combobox" aria-expanded="false" >
                                                                    <div class="filter-option">
                                                                        <div class="filter-option-inner">
                                                                            <div class="filter-option-inner-inner">Day(s)</div>
                                                                        </div>
                                                                    </div>
                                                                    </button>
                                                                    <div class="dropdown-menu">
                                                                        <a href="#" class="dropdown-item">Day(s)</a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-md-12"><label >Discount Type</label></div>
                                                            <div class="col-md-6">
                                                                <select name="discount_type" class="form-control aiz-selectpicker {{ $errors->has('discount_type') ? ' is-invalid' : '' }}">
                                                                    <option value=""> Select</option>
                                                                    <option value="percentage" @if(isset($listPackages->discount_type) && $listPackages->discount_type == "percentage") selected @endif> Percentage</option>
                                                                    <option value="fixed" @if(isset($listPackages->discount_type) && $listPackages->discount_type == "fixed") selected @endif> Fixed</option>
                                                                </select>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <input type="number" name="discount_value" class="form-control {{ $errors->has('discount_value') ? ' is-invalid' : '' }}" placeholder="" value="{{$listPackages->discount_value ?? " "}}">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="row">


                                                            <div class="col-md-12">
                                                                <label>Payment Gateway</label>
                                                                <div class="dropdown bootstrap-select form-control subs-input">
                                                                    <select name="gateway_name" class="form-control aiz-selectpicker {{ $errors->has('gateway_name') ? ' is-invalid' : '' }}">
                                                                        <option value="Power Cozmo"> Power Cozmo</option>

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


                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-5">
                                                <label>Status</label>
                                                <div class="dropdown bootstrap-select form-control subs-input">
                                                    <select name="status" class="form-control aiz-selectpicker">
                                                        <option value="enable" @if( isset($listPackages->status) &&  $listPackages->status == "enable") selected @endif> Enable</option>
                                                        <option value="disable" @if(isset($listPackages->status) && $listPackages->status == "disable") selected @endif> Disable</option>
                                                    </select>
                                                </div>

                                            </div>
                                            <div class="col-md-12">
                                                <div class="d-flex mt-3 border-top py-2">
                                                    <input type="button" class="btn btn-primary ml-auto" value="Select Feature">
                                                </div>
                                            </div>
                                        </div>
                                    </div><!--userPlan-opt-->



                                    <div class="seller-table-heading">
                                        <h1>Plan Features List</h1>
                                        <div class="subscription-col ml-auto">
                                            <label>Subscription</label>
                                            <div class="dropdown bootstrap-select form-control subs-input">
                                                <button type="button" class="btn dropdown-toggle btn-light" data-toggle="dropdown" role="combobox" aria-expanded="false" >
                                                    <div class="filter-option">
                                                        <div class="filter-option-inner">
                                                            <div class="filter-option-inner-inner">1 Month</div>
                                                        </div>
                                                    </div>
                                                </button>
                                                <div class="dropdown-menu">
                                                    <a href="#" class="dropdown-item">1 Month</a>
                                                    <a href="#" class="dropdown-item">2 Month</a>
                                                    <a href="#" class="dropdown-item">3 Month</a>
                                                    <a href="#" class="dropdown-item">6 Month</a>
                                                    <a href="#" class="dropdown-item">1 Year</a>
                                                    <a href="#" class="dropdown-item">2 Year</a>
                                                </div>
                                            </div>
                                            <label>Discount (%)</label>
                                            <div class="dropdown bootstrap-select form-control discount-input">
                                                <button type="button" class="btn dropdown-toggle btn-light" data-toggle="dropdown" role="combobox" aria-expanded="false">
                                                    <div class="filter-option">
                                                        <div class="filter-option-inner">
                                                            <div class="filter-option-inner-inner">0</div>
                                                        </div>
                                                    </div>
                                                </button>
                                                <div class="dropdown-menu">
                                                    <a href="#" class="dropdown-item">10</a>
                                                    <a href="#" class="dropdown-item">20</a>
                                                    <a href="#" class="dropdown-item">30</a>
                                                    <a href="#" class="dropdown-item">50</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>











{{-- Start --}}


                                        <form action="" method="POST">
                                    <div class="admin-table">
                                        <div class="table-responsive">

                                            <table class="table">
                                                <thead>
                                                    <tr>
                                                        <th class="sr-no-th text-center">Sr. No.</th>
                                                        <th class="features-th">Name of Features</th>
                                                        <th class="value-th">Value</th>
                                                        <th class="price-th text-right">Price/Feature <span>(USD $)<span></th>
                                                        <th class="permission-th">Make Permission </th>
                                                    <tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td class="text-center">1.</td>
                                                        <td>Simple product Post</td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small" placeholder="Enter Number of Posts " />
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="2000" /></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>



                                                    <tr>
                                                        <td class="text-center">2.</td>
                                                        <td>Varient product Post</td>
                                                        <td>
                                                            <div class="form-inline">
                                                                <input type="text" name="value[]" class="form-control input-small mr-1" placeholder="Enter Size" />
                                                                <div class="dropdown-h dropdown bootstrap-select w-auto">
                                                                    <button type="button" class="btn dropdown-toggle " data-toggle="dropdown" role="combobox" aria-expanded="false">
                                                                        <div class="filter-option">
                                                                            <div class="filter-option-inner">
                                                                                <div class="filter-option-inner-inner">Mb.</div>
                                                                            </div>
                                                                        </div>
                                                                    </button>
                                                                    <div class="dropdown-menu">
                                                                        <a href="#" class="dropdown-item">10</a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price1">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price1" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>




                                                   <tr>
                                                        <td class="text-center">3.</td>
                                                        <td>Maximum allowed photo Size</td>
                                                        <td>
                                                            <div class="form-inline">
                                                                <input type="text" name="value[]" class="form-control input-small mr-1" placeholder="Enter Size" />
                                                                <div class="dropdown-h dropdown bootstrap-select w-auto">
                                                                    <button type="button" class="btn dropdown-toggle " data-toggle="dropdown" role="combobox" aria-expanded="false">
                                                                        <div class="filter-option">
                                                                            <div class="filter-option-inner">
                                                                                <div class="filter-option-inner-inner">Mb.</div>
                                                                            </div>
                                                                        </div>
                                                                    </button>
                                                                    <div class="dropdown-menu">
                                                                        <a href="#" class="dropdown-item">10</a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price1">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price1" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>



                                                    <tr>
                                                        <td class="text-center">4.</td>
                                                        <td>Dynamic “Pricing” Settings Tool </td>
                                                        <td>
                                                            <div class="toogle-btn">
                                                                <label  class="aiz-switch aiz-switch-success mb-0">

                                                                    <input name="value[]" type="checkbox" >
                                                                    <span class="slider round"></span>
                                                                </label><span class="toggle-lbl">Not Allowed</span>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price3">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price3" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>




                                                    <tr>
                                                        <td class="text-center">5.</td>
                                                        <td>Auto Quoting Tool </td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox" >
                                                                    <span class="slider round"></span>
                                                                </label><span class="toggle-lbl">Allowed</span>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price4">
                                                                    <input type="checkbox" name="permission[]"class="" id="negotiable_price4" value="1">
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">6.</td>
                                                        <td>Price Calculator Tool</td>
                                                        <td>
                                                            <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox" >
                                                                    <span class="slider round"></span>
                                                                </label><span class="toggle-lbl">Not Allowed</span>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price4">
                                                                    <input type="checkbox" name="permission[]"class="" id="negotiable_price4" value="1">
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                    <tr>
                                                        <td class="text-center">7.</td>
                                                        <td>Discount Level Creation </td>
                                                        <td>
                                                            <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox" >
                                                                    <span class="slider round"></span>
                                                                </label><span class="toggle-lbl">Not Allowed</span>
                                                            </div>
                                                        </td>
                                                        <td><input name="price[]" type="text" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price5">
                                                                    <input type="checkbox"  name="permission[]" class="" id="negotiable_price5" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>


                                                    <tr>
                                                        <td class="text-center">8.</td>
                                                        <td>Mini Site</td>
                                                        <td>
                                                            <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox" >
                                                                    <span class="slider round"></span>
                                                                </label><span class="toggle-lbl">Not Allowed</span>
                                                            </div>
                                                        </td>
                                                        <td><input type="text"  name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price6">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price6" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>


                                                    <tr>
                                                        <td class="text-center">9.</td>
                                                        <td>Business Verifying with Governments</td>
                                                        <td>
                                                            <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox" >
                                                                    <span class="slider round"></span>
                                                                </label><span class="toggle-lbl">Not Allowed</span>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price7">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price7" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>

                                                    <tr>
                                                        <td class="text-center">10.</td>
                                                        <td>Accept Power Cozmo Trusted Account Pay through Power Cozmo</td>
                                                        <td>
                                                            <div class="check-opt">
                                                                <label class="custom-checkbox" for="negotiable_price8">
                                                                    <input type="checkbox" name="value[]" class="" id="negotiable_price8" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="100"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price9">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price9" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>



                                                    <tr>
                                                        <td class="text-center">11.</td>
                                                        <td>Leads</td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small" placeholder="Enter No. of Shared Leads">
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="100"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price10">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price10" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">12.</td>
                                                        <td>Keywords </td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small" placeholder="Enter No. of Allowed Keywords">
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price11">
                                                                    <input type="checkbox" name="permission[]"  class="" id="negotiable_price11" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">13.</td>
                                                        <td>Subaccounts</td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small " placeholder="Enter No. of Subaccounts">
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price12">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price12" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">14.</td>
                                                        <td>Number of Received RFQs</td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small " placeholder="Enter No. of Received RFQs">
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="100"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price13">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price13" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>



                                                    <tr>
                                                        <td class="text-center">15.</td>
                                                        <td>Geo Location options</td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                            <label class="aiz-switch aiz-switch-success mb-0">
                                                                <input name="value[]" type="checkbox" >
                                                                <span class="slider round"></span>
                                                            </label><span class="toggle-lbl">On/Off</span>
                                                        </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">16.</td>
                                                        <td>Seller Chat with Buyer </td>
                                                        <td>
                                                          <span class="redTxt">Free-</span> Controlled
                                                        </td>
                                                        <td><input type="text" name="value[]" class="form-control input-small text-right" placeholder="100"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>


                                                    <tr>
                                                        <td class="text-center">17.</td>
                                                        <td>Video Creation</td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                            <label class="aiz-switch aiz-switch-success mb-0">
                                                                <input name="value[]" type="checkbox" >
                                                                <span class="slider round"></span>
                                                            </label><span class="toggle-lbl">On/Off</span>
                                                        </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>



                                                    <tr>
                                                        <td class="text-center">18.</td>
                                                        <td>By with confidence badge </td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                            <label class="aiz-switch aiz-switch-success mb-0">
                                                                <input name="value[]" type="checkbox" >
                                                                <span class="slider round"></span>
                                                            </label><span class="toggle-lbl">On/Off</span>
                                                        </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="200"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>



                                                    <tr>
                                                        <td class="text-center">19.</td>
                                                        <td>Post Booster: Big Post </td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                {{-- <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input value="71" type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label> --}}
                                                                <input type="text" name="value[]" class="form-control input-small ml-3" placeholder="No. of Products" />
                                                                <input type="text" name="2nd_value[]" class="form-control input-small ml-2" placeholder="No. of Views" />
                                                            </div>
                                                        </td>
                                                        <td><input type="text" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>


                                                    <tr>
                                                        <td class="text-center">20.</td>
                                                        <td>Post Booster: Big Post </td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small " placeholder="No. of Products">
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">21.</td>
                                                        <td>Post Poster: Twinkly Post title- 3 rotations  </td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>

                                                    <tr>
                                                        <td class="text-center">22.</td>
                                                        <td>Post Poster: Twinkly Post title- 3 rotations  </td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>





                                                    <tr>
                                                        <td class="text-center">23.</td>
                                                        <td>Buyer Databases</td>
                                                        <td>
                                                            <input type="text" name="value[]" class="form-control input-small " placeholder="Times of Search">
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]"  class="" id="negotiable_price" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">24.</td>
                                                        <td>Photos Optimization</td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" name="negotiable_price" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">25.</td>
                                                        <td>Publish on\off</td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input  name="value[]"  type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">26.</td>
                                                        <td>Show Related Products </td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">27.</td>
                                                        <td>Show More products from Supplier</td>
                                                        <td>
                                                        <div class="toogle-btn">
                                                                <label class="aiz-switch aiz-switch-success mb-0">
                                                                    <input name="value[]" type="checkbox">
                                                                    <span class="slider round"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td><input type="text" name="price[]" class="form-control input-small text-right" placeholder="1000"></td>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="negotiable_price">
                                                                    <input type="checkbox" name="permission[]" class="" id="negotiable_price" value="1" checked>
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>



                                    <div class="total-col mt-3">
                                        <div class="total-box ml-auto">
                                            <div class="val-col">
                                                <div class="total-label">Sub Totals</div>
                                                <div class="total-val text-right">$7100</div>
                                            </div>
                                            <div class="val-col">
                                                <div class="total-label">Subscription</div>
                                                <div class="total-val text-right">1 Month</div>
                                            </div>
                                            <div class="val-col">
                                                <div class="total-label">Discount (0%)</div>
                                                <div class="total-val text-right">$0.0</div>
                                            </div>
                                            <div class="val-col total-ftr">
                                                <div class="total-label">Discount (0%)</div>
                                                <div class="total-val text-right">$5700</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="page-btn-ftr">
                                        <button type="submit" class="btn btn-outline-secondary mr-2 ml-auto">Reset</button>
                                        <button type="submit" class="btn btn-outline-primary">Submit</button>
                                    </div>
                                </div>

                                <!--seller tab end-->

                                <div class="admin-list-table tab-pane fade" id="buyers-tab" role="tabpanel" aria-labelledby="pills-buyers-tab">

                                    <div class="admin-table">
                                        <div class="common-tbl-head">
                                            <ul class="contactTableTabs">
                                                <li class="active"><a href="javascript:void(0);">All Plans <span>9</span></a></li>
                                                <li><a href="javascript:void(0);">Seller Plans <span>12</span></a></li>
                                                <li><a href="javascript:void(0);">Buyer Plans <span>6</span></a></li>
                                            </ul>
                                        </div>
                                        <div class="table-responsive">
                                            <table class="table">
                                                <thead>
                                                    <tr>
                                                        <th class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="listCheck1">
                                                                    <input type="checkbox" name="listCheck1" class="" id="listCheck1" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </th>
                                                        <th>Sr. No.</th>
                                                        <th>Plan Id</th>
                                                        <th>Plan Name</th>
                                                        <th>Display Name</th>
                                                        <th class="text-center">Features/Items</th>
                                                        <th class="text-center">Status</th>
                                                        <th class="text-center">Account Type/Role</th>
                                                        <th class="text-center">Price</th>
                                                        <th class="text-center">Discount Price To Subscribers</th>
                                                        <th class="text-center">Frequency</th>
                                                        <th class="text-center">Renewal Type</th>
                                                        <th class="text-center">Created At</th>
                                                        <th class="text-center">Actions</th>
                                                    <tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="listCheck2">
                                                                    <input type="checkbox" name="listCheck3" class="" id="listCheck2" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td>1</td>
                                                        <td>PCP01</td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td class="text-center">5</td>
                                                        <td class="text-center"><span class="enabled-badge">Enabled</span></td>
                                                        <td class="text-center">Seller</td>
                                                        <td class="text-center">$5700</td>
                                                        <td class="text-center">No</td>
                                                        <td class="text-center">Day</td>
                                                        <td class="text-center">Default</td>
                                                        <td class="text-center">Jan 6, 2022 1:14:32 AM</td>
                                                        <td class="text-center">
                                                        <div class="tbl-action-link">
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="View" data-original-title="View"><i class="icons icon-show"></i></a>
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Edit" data-original-title="Edit"><i class="icons icon-edit"></i></a>
                                                            <a href="javascript:void(0);" class="del-link" data-toggle="tooltip" data-placement="top" title="Delete"><i class="icons icon-delete"></i></a>
                                                        </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="listCheck2">
                                                                    <input type="checkbox" name="listCheck3" class="" id="listCheck2" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td>1</td>
                                                        <td>PCP01</td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td class="text-center">5</td>
                                                        <td class="text-center"><span class="disabled-badge">Disabled</span></td>
                                                        <td class="text-center">Seller</td>
                                                        <td class="text-center">$5700</td>
                                                        <td class="text-center">No</td>
                                                        <td class="text-center">Day</td>
                                                        <td class="text-center">Default</td>
                                                        <td class="text-center">Jan 6, 2022 1:14:32 AM</td>
                                                        <td class="text-center">
                                                        <div class="tbl-action-link">
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="View" data-original-title="View"><i class="icons icon-show"></i></a>
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Edit" data-original-title="Edit"><i class="icons icon-edit"></i></a>
                                                            <a href="javascript:void(0);" class="del-link" data-toggle="tooltip" data-placement="top" title="Delete"><i class="icons icon-delete"></i></a>
                                                        </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="listCheck2">
                                                                    <input type="checkbox" name="listCheck3" class="" id="listCheck2" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td>1</td>
                                                        <td>PCP01</td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td class="text-center">5</td>
                                                        <td class="text-center"><span class="enabled-badge">Enabled</span></td>
                                                        <td class="text-center">Seller</td>
                                                        <td class="text-center">$5700</td>
                                                        <td class="text-center">No</td>
                                                        <td class="text-center">Day</td>
                                                        <td class="text-center">Default</td>
                                                        <td class="text-center">Jan 6, 2022 1:14:32 AM</td>
                                                        <td class="text-center">
                                                        <div class="tbl-action-link">
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="View" data-original-title="View"><i class="icons icon-show"></i></a>
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Edit" data-original-title="Edit"><i class="icons icon-edit"></i></a>
                                                            <a href="javascript:void(0);" class="del-link" data-toggle="tooltip" data-placement="top" title="Delete"><i class="icons icon-delete"></i></a>
                                                        </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="listCheck2">
                                                                    <input type="checkbox" name="listCheck3" class="" id="listCheck2" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td>1</td>
                                                        <td>PCP01</td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td class="text-center">5</td>
                                                        <td class="text-center"><span class="enabled-badge">Enabled</span></td>
                                                        <td class="text-center">Seller</td>
                                                        <td class="text-center">$5700</td>
                                                        <td class="text-center">No</td>
                                                        <td class="text-center">Day</td>
                                                        <td class="text-center">Default</td>
                                                        <td class="text-center">Jan 6, 2022 1:14:32 AM</td>
                                                        <td class="text-center">
                                                        <div class="tbl-action-link">
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="View" data-original-title="View"><i class="icons icon-show"></i></a>
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Edit" data-original-title="Edit"><i class="icons icon-edit"></i></a>
                                                            <a href="javascript:void(0);" class="del-link" data-toggle="tooltip" data-placement="top" title="Delete"><i class="icons icon-delete"></i></a>
                                                        </div>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="text-center">
                                                            <div class="check-opt m-auto" style="width:16px">
                                                                <label class="custom-checkbox m-0 p-0" for="listCheck2">
                                                                    <input type="checkbox" name="listCheck3" class="" id="listCheck2" value="1" >
                                                                    <span class="custom-checkmark"></span>
                                                                </label>
                                                            </div>
                                                        </td>
                                                        <td>1</td>
                                                        <td>PCP01</td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td><div class="startup-badge"><i class="icons icon-badge-tick"></i>Startup</div></td>
                                                        <td class="text-center">5</td>
                                                        <td class="text-center"><span class="enabled-badge">Enabled</span></td>
                                                        <td class="text-center">Seller</td>
                                                        <td class="text-center">$5700</td>
                                                        <td class="text-center">No</td>
                                                        <td class="text-center">Day</td>
                                                        <td class="text-center">Default</td>
                                                        <td class="text-center">Jan 6, 2022 1:14:32 AM</td>
                                                        <td class="text-center">
                                                        <div class="tbl-action-link">
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="View" data-original-title="View"><i class="icons icon-show"></i></a>
                                                            <a href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="Edit" data-original-title="Edit"><i class="icons icon-edit"></i></a>
                                                            <a href="javascript:void(0);" class="del-link" data-toggle="tooltip" data-placement="top" title="Delete"><i class="icons icon-delete"></i></a>
                                                        </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div><!--tab-pane-->
                                </div>
                            </div>
                        </div>

                        <!--define plan name content end-->

                    </div>
                    <!--user plan tab content end-->

                    <div class="tab-pane fade" id="feature-tab" role="tabpanel" aria-labelledby="profile-tab">...</div>

                </div>

                <!--overview Subscription plan-->
                <div class="subscriptionView d-none">
                    <div class="row border-bottom no-gutters">
                        <div class="col">
                            <div class="subscription-box border-0 active">
                                <div class="subscription_heading">Total Net Sale</div>
                                <div class="subscription_value">$0.00</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">New Subscriptions </div>
                                <div class="subscription_value">9</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">Net Sales of New Subscriptions </div>
                                <div class="subscription_value">$0.00</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">Renewed Subscriptions </div>
                                <div class="subscription_value">0</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">Net Sales of renewed Subscriptions</div>
                                <div class="subscription_value">$0.00</div>
                            </div>
                        </div>
                    </div>
                    <div class="row no-gutters">
                        <div class="col">
                            <div class="subscription-box border-0">
                                <div class="subscription_heading">Cancelled Subscriptions</div>
                                <div class="subscription_value">0</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">New Trials</div>
                                <div class="subscription_value">3</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">Trial Conversions</div>
                                <div class="subscription_value">0</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">MRR (Monthly Recurring Revenue)</div>
                                <div class="subscription_value">0</div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="subscription-box">
                                <div class="subscription_heading">ARR (Annual Recurring Revenue)</div>
                                <div class="subscription_value">$2,642.63</div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--overview Subscription plan end-->
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script type="text/javascript">



    </script>
@endsection