@extends('layout.master')
@section('content')
    <style>
        .special-offer-text {
            text-align: center;
            margin-top: 20px;
            text-decoration: underline;
            color: #096c8f;
        }

        .wrapper {
            display: flex;
            flex-shrink: 0;
            gap: 0.5rem;
        }

        input[type="radio"] {
            display: inline-block;
            position: absolute;
            overflow: hidden;
            clip: rect(0 0 0 0);
            height: 1;
            width: 1;
            margin: -1;
            padding: 0;
            border: 0;
        }

        .icon {
            display: flex;
            justify-content: center;
            align-items: center;
            /* width: 3rem; */
            height: 3rem;
            color: rgb(13, 45, 123);
            border-radius: 0.5rem;
            padding: 0.5rem;
            overflow: hidden;
            font-weight: 600;
        }

        .icon:hover {
            cursor: pointer;
            background-color: rgba(13, 45, 123, 0.1);
        }

        .peer:checked~.icon {
            background-color: rgb(60 99 176);
            color: white;
        }
    </style>
    <div class="content pt-0">

        @if ($CompanyOffer != '' && $CompanyMaintenance != '')

            @php
                $offer_payment_div = 'd-block';
                $esignature_purchase_count_div = 'd-none';
                if ($errors->has('esignature_purchase_count')) {
                    $esignature_purchase_count_div = 'd-block';
                    $offer_payment_div = 'd-none';
                }
            @endphp
            @if (count($data['SpecialOffer']) > 0)
                <h3 class="special-offer-text text-smallcaps">Scroll Down for special offer</h3>
            @endif

            <form action="{{ route('payment', ['user_id' => encrypt($CompanyOffer->user_id)]) }}" method="POST">
                @csrf
                <div class="row">
                    <div class="col-12 col-xl-12 col-md-12 col-sm-12 order-1 order-xl-0">
                        <div class="mb-9">
                            <div class="card shadow-none border my-4" data-component-card="data-component-card">
                                <div class="row">
                                    <div class="col-12 col-xl-6 col-md-6 col-sm-12 order-1 order-xl-0">
                                        <img src="{{ asset('uploads/invoice.jpg') }}" style="width:100%" alt="">
                                    </div>
                                    <div class="col-12 col-xl-6 col-md-6 col-sm-12 order-1 order-xl-0">
                                        @if ($type == 'offer')

                                            <div class="card-header p-4 border-bottom bg-body">
                                                <div class="row g-3 justify-content-between align-items-center">
                                                    <div class="col-12 col-md">
                                                        <h4 class="text-body mb-0" data-anchor="data-anchor">Current Offer
                                                        </h4>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card-body p-0">
                                                <div class="p-4 code-to-copy">
                                                    {{-- {{Dd($errors)}} --}}

                                                    <div class="col-md-12 mb-2">
                                                        <label class="form-label" for="payment_for">Choose Payment For
                                                        </label>

                                                        <div class="wrapper">
                                                            @foreach ($paymentOption as $key => $PO)
                                                                <label for="left_{{ $key }}">
                                                                    <input type="radio" id="left_{{ $key }}"
                                                                        name="payment_for" value="{{ $key }}"
                                                                        class="peer radio payment_for"
                                                                        {{ $key == 'offer_payment' ? 'checked' : '' }} />
                                                                    <div class="icon">
                                                                        {{ $PO }}
                                                                    </div>
                                                                </label>
                                                            @endforeach

                                                        </div>

                                                        {{-- <select name="payment_for" id="payment_for" class="form-control">
                                                            @foreach ($paymentOption as $key => $PO)
                                                                <option value="{{ $key }}">{{ $PO }}
                                                                </option>
                                                            @endforeach
                                                        </select> --}}
                                                    </div>
                                                    <div class="offer_payment_div payment_div {{ $offer_payment_div }}">
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="charges">Offer Reamrk
                                                            </label>
                                                            <p>{{ @$CompanyOffer->offer_remark }}</p>
                                                        </div>
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="charges">Charges
                                                                <span class="text-danger">*</span> </label>
                                                            <input class="form-control numberonly"
                                                                onkeyup="calculateTotal()" name="charges" id="charges"
                                                                type="text"
                                                                value="{{ old('charges', @$CompanyOffer->charges) }}"
                                                                disabled />
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="gst">GST 18%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text" value="{{ @$CompanyOffer->gst }}%"
                                                                    disabled />
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="gst">Gateway charge 2%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text"
                                                                    value="{{ @$CompanyOffer->gateway_charge }}%"
                                                                    disabled />
                                                            </div>
                                                        </div>
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="gst">Total Amount
                                                            </label>
                                                            <input class="form-control numberonly" id="total_amount"
                                                                type="text" value="{{ @$CompanyOffer->total }}"
                                                                disabled />
                                                        </div>
                                                        <div class="col-md-12 mt-2">
                                                            <label class="form-label" for="due_amount">Due Amount
                                                            </label>
                                                            <input class="form-control numberonly" id="due_amount"
                                                                type="text" value="{{ @$CompanyOffer->due_amount }}"
                                                                disabled />
                                                        </div>
                                                        <div class="col-md-12 mt-3 mb-3">
                                                            <h5> Special Offer</h5>
                                                            <div class="row">
                                                                <div class="col-md-6">
                                                                    <label class="form-label" for="datepicker">Start
                                                                        Date</label>
                                                                    <input class="form-control" type="text" disabled
                                                                        placeholder="dd/mm/yyyy" name="offer_from_date"
                                                                        value="{{ old('offer_from_date', @$CompanyOffer->offer_from_date) }}"
                                                                        data-options='{"disableMobile":true,"dateFormat":"d/m/Y"}' />
                                                                </div>
                                                                <div class="col-md-6">
                                                                    <label class="form-label" for="datepicker">End
                                                                        Date</label>
                                                                    <input class="form-control " type="text"
                                                                        placeholder="dd/mm/yyyy" name="offer_to_date"
                                                                        disabled
                                                                        value="{{ old('offer_to_date', @$CompanyOffer->offer_to_date) }}"
                                                                        data-options='{"disableMobile":true,"dateFormat":"d/m/Y"}' />
                                                                </div>
                                                                <div class="col-md-6 mt-1">
                                                                    <label class="form-label" for="datepicker">Free ID On
                                                                        Purchase</label>
                                                                    <input class="form-control numberonly"
                                                                        name="free_no_of_id_on_purchase" type="text"
                                                                        placeholder="Free On Purchase ID" disabled
                                                                        value="{{ old('free_no_of_id_on_purchase', @$CompanyOffer->free_no_of_id_on_purchase) }}" />
                                                                </div>
                                                                <div class="col-md-6 mt-1">
                                                                    <label class="form-label" for="datepicker">Free
                                                                        ID</label>
                                                                    <input class="form-control numberonly"
                                                                        name="free_no_of_id" type="text"
                                                                        placeholder="Free ID" disabled
                                                                        value="{{ old('free_no_of_id', @$CompanyOffer->free_no_of_id) }}" />
                                                                </div>
                                                                <div class="col-md-12">
                                                                    <label class="form-label" for="charges">Enter no of
                                                                        id
                                                                        <span class="text-danger">*</span> </label>
                                                                    <input class="form-control numberonly"
                                                                        name="purchase_no_of_id" id="purchase_no_of_id"
                                                                        type="text" value="{{ old('no_of_id') }}" />
                                                                    @error('purchase_no_of_id')
                                                                        <div class="col-form-alert-label fs-7">
                                                                            NOTE: {{ $message }}
                                                                        </div>
                                                                    @enderror
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="website_payment_div payment_div d-none">

                                                        <div class="col-md-12">
                                                            <label class="form-label" for="charges">Website Reamrk
                                                            </label>
                                                            <p>{{ @$CompanyOffer->website_remark }}</p>
                                                        </div>
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="website_amount">Website Amount
                                                                <span class="text-danger">*</span> </label>
                                                            <input class="form-control numberonly" name="website_amount"
                                                                id="website_amount" type="text"
                                                                value="{{ old('website_amount', @$CompanyOffer->website_amount) }}"
                                                                disabled />
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="website_gst">GST 18%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text" value="{{ @$CompanyOffer->gst }}%"
                                                                    disabled />
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="gst">Gateway charge 2%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text"
                                                                    value="{{ @$CompanyOffer->gateway_charge }}%"
                                                                    disabled />
                                                            </div>
                                                        </div>
                                                        <div class="col-md-12 mb-3">
                                                            <label class="form-label" for="gst">Website Total Amount
                                                            </label>
                                                            <input class="form-control numberonly" id="total_amount"
                                                                type="text"
                                                                value="{{ @$CompanyOffer->website_total_amount }}"
                                                                disabled />
                                                        </div>
                                                    </div>

                                                    <div class="strategy_payment_div payment_div d-none">

                                                        <div class="col-md-12">
                                                            <label class="form-label" for="charges">Strategy Reamrk
                                                            </label>
                                                            <p>{{ @$CompanyOffer->strategy_remark }}</p>
                                                        </div>
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="strategy_amount">Website Amount
                                                                <span class="text-danger">*</span> </label>
                                                            <input class="form-control numberonly" name="strategy_amount"
                                                                id="strategy_amount" type="text"
                                                                value="{{ old('strategy_amount', @$CompanyOffer->strategy_amount) }}"
                                                                disabled />
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="strategy_gst">GST 18%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text" value="{{ @$CompanyOffer->gst }}%"
                                                                    disabled />
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="gst">Gateway charge 2%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text"
                                                                    value="{{ @$CompanyOffer->gateway_charge }}%"
                                                                    disabled />
                                                            </div>
                                                        </div>
                                                        <div class="col-md-12 mb-3">
                                                            <label class="form-label" for="gst">Strategy Total Amount
                                                            </label>
                                                            <input class="form-control numberonly" id="total_amount"
                                                                type="text"
                                                                value="{{ @$CompanyOffer->strategy_total_amount }}"
                                                                disabled />
                                                        </div>

                                                    </div>

                                                    <div class="kyc_payment_div payment_div d-none">

                                                        <div class="col-md-12">
                                                            <label class="form-label" for="charges">Kyc Reamrk
                                                            </label>
                                                            <p>{{ @$CompanyOffer->kyc_remark }}</p>
                                                        </div>
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="kyc_amount">Kyc Amount
                                                                <span class="text-danger">*</span> </label>
                                                            <input class="form-control numberonly" name="kyc_amount"
                                                                id="kyc_amount" type="text"
                                                                value="{{ old('kyc_amount', @$CompanyOffer->kyc_amount) }}"
                                                                disabled />
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="kyc_gst">GST 18%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text" value="{{ @$CompanyOffer->gst }}%"
                                                                    disabled />
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label class="form-label" for="gst">Gateway charge 2%
                                                                </label>
                                                                <input class="form-control numberonly" id="gst"
                                                                    type="text"
                                                                    value="{{ @$CompanyOffer->gateway_charge }}%"
                                                                    disabled />
                                                            </div>
                                                        </div>
                                                        <div class="col-md-12 mb-3">
                                                            <label class="form-label" for="gst">Kyc Total Amount
                                                            </label>
                                                            <input class="form-control numberonly" id="total_amount"
                                                                type="text"
                                                                value="{{ @$CompanyOffer->kyc_total_amount }}" disabled />
                                                        </div>
                                                    </div>
                                                    <div
                                                        class="esignature_payment_div payment_div {{ $esignature_purchase_count_div }}">
                                                        <div class="col-md-12">
                                                            <label class="form-label" for="esignature_amount">E-Signature
                                                                Amount
                                                            </label>
                                                            <input class="form-control numberonly"
                                                                name="esignature_amount" id="esignature_amount"
                                                                type="text"
                                                                value="{{ old('esignature_amount', @$CompanyOffer->esignature_total_amount) }}"
                                                                disabled />
                                                        </div>

                                                        <div class="col-md-12 mb-3">
                                                            <label class="form-label"
                                                                for="esignature_purchase_count">E-Signature
                                                                Purchase Count <span class="text-danger">*</span>
                                                            </label>
                                                            <input class="form-control numberonly"
                                                                name="esignature_purchase_count"
                                                                id="esignature_purchase_count" type="text"
                                                                value="" />
                                                            @error('esignature_purchase_count')
                                                                <div class="col-form-alert-label">
                                                                    {{ $message }}
                                                                </div>
                                                            @enderror
                                                        </div>
                                                        <div class="col-md-12 mb-3">
                                                            <label class="form-label"
                                                                for="esignature_total_amount">E-Signature
                                                                Total Amount
                                                            </label>
                                                            <input class="form-control numberonly"
                                                                id="esignature_total_amount" type="text"
                                                                value="" disabled />
                                                        </div>
                                                    </div>

                                                    <div class="col-md-12">
                                                        <button value="offer" name="type"
                                                            class="btn btn-primary w-100">Make
                                                            Payment</button>
                                                    </div>
                                                </div>
                                            </div>
                                        @elseif($type == 'maintenance')
                                            <div class="card-header p-4 border-bottom bg-body">
                                                <div class="row g-3 justify-content-between align-items-center">
                                                    <div class="col-12 col-md">
                                                        <h4 class="text-body mb-0" data-anchor="data-anchor">Maintenance
                                                        </h4>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card-body p-0">
                                                <div class="p-4 code-to-copy">
                                                    <div class="col-md-12">
                                                        <label class="form-label" for="charges">Maintenance Reamrk
                                                        </label>
                                                        <p>{{ @$CompanyMaintenance->main_remark }}</p>
                                                    </div>
                                                    <div class="col-md-12">
                                                        <label class="form-label" for="gst">Maintenance Amount
                                                        </label>
                                                        @php
                                                            $amount = 0;
                                                            if (isset($CompanyMaintenance)) {
                                                                $amount = $CompanyMaintenance->total_amout;
                                                                if (
                                                                    $CompanyMaintenance->extra_total_amount != '' &&
                                                                    $CompanyMaintenance->extra_total_amount > 0
                                                                ) {
                                                                    $amount = $CompanyMaintenance->extra_total_amount;
                                                                }
                                                            }
                                                        @endphp
                                                        <input class="form-control numberonly" disabled
                                                            name="maintenance_amount" id="maintenance_amount"
                                                            type="text" value="{{ $amount }}" />
                                                        @error('maintenance_amount')
                                                            <div class="col-form-alert-label">
                                                                {{ $message }}
                                                            </div>
                                                        @enderror
                                                    </div>
                                                    <div class="col-md-12 mt-2">
                                                        <label class="form-label" for="maintenance_due_amount">Due Amount
                                                        </label>
                                                        <input class="form-control numberonly" id="maintenance_due_amount"
                                                            type="text" disabled
                                                            value="{{ @$CompanyMaintenance->due_amount }}" />
                                                    </div>

                                                    @if (@$CompanyMaintenance->main_process == 'stop')
                                                        <h5 class="text-danger mt-2">Maintenance process stop

                                                            @php
                                                                $Maindate = 'for now';

                                                                if (isset($CompanyMaintenance->main_end_date)) {
                                                                    $main_date = date(
                                                                        'M ,d Y',
                                                                        strtotime($CompanyMaintenance->main_end_date),
                                                                    );

                                                                    $Maindate = ' till ' . $main_date;
                                                                }
                                                                echo $Maindate;
                                                            @endphp
                                                        </h5>
                                                    @else
                                                        @if ($Transaction == '')
                                                            <div class="col-md-12 mt-3">
                                                                <button value="maintenance" name="type"
                                                                    class="btn btn-primary w-100">Make
                                                                    Payment</button>
                                                            </div>
                                                        @else
                                                            <h5 class="text-danger mt-2">Payment of this month already
                                                                received
                                                            </h5>
                                                        @endif
                                                    @endif

                                                </div>
                                            </div>

                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    @if (count($data['SpecialOffer']) > 0)
                        <h4 class="mb-4">Special Offers</h4>
                        @foreach ($data['SpecialOffer'] as $key => $PI)
                            <div class="col-12 col-sm-4 col-xxl-4">

                                <div class="card">
                                    <div class="card-header">
                                        <h4 class="text-info-dark">{{ $PI['title'] }}</h4>
                                    </div>
                                    <div class="card-body">
                                        <h4 class="mb-4">What’s included</h4>
                                        <h5>Total ID : {{ $PI['total_id'] }}</h5>
                                        <h5>Per ID Cost : {{ getCurrency() . $PI['total'] }}</h5>
                                        @if ($PI['maintenance_days'] > 0)
                                            <h5>Maintenance free for : {{ $PI['maintenance_days'] }} days</h5>
                                        @endif
                                        @if ($PI['free_no_of_id'] != '' && $PI['free_no_of_id'] > 0)
                                            <h5>Free No Of ID : {{ $PI['free_no_of_id'] }}</h5>
                                        @endif
                                        @if ($PI['remark'] != '')
                                            <p>{!! $PI['remark'] !!}</p>
                                        @endif

                                        <h4 class="fw-bolder mt-2">Total Amount:
                                            {{ getCurrency() . $PI['total'] * $PI['total_id'] }}</h4>
                                        <small class="text-danger">All tax & fees included</small>

                                        <form action="{{ route('payment', ['user_id' => encrypt($user_id)]) }}"
                                            method="POST">
                                            @csrf
                                            <input type="hidden" name="offer_id" value="{{ $PI['id'] }}">
                                            <button value="special_offer" name="type"
                                                class="btn btn-lg w-100 mb-6 btn-outline-primary mt-5">Buy this
                                                Offer</button>
                                        </form>

                                    </div>
                                </div>
                            </div>
                        @endforeach
                    @endif
                </div>
            </form>
        @else
            <div class="row">
                <div class="col-12 col-xl-12 col-md-12 col-sm-12 order-1 order-xl-0">
                    <div class="mb-9">
                        <div class="card shadow-none border my-4 p-3" data-component-card="data-component-card">
                            <span class="text-center">No offer found...</span>
                        </div>
                    </div>
                </div>
            </div>
        @endif

    </div>
@section('script')
    <script>
        $(document).ready(function() {
            $("input[name='payment_for']").on("change", function() {
                var selectedValue = $("input[name='payment_for']:checked").val();
                $(".payment_div").addClass("d-none");
                $(".payment_div").removeClass("d-block");
                $("." + selectedValue + "_div").removeClass("d-none");
                $("." + selectedValue + "_div").addClass("d-block");
            })

            $("#esignature_purchase_count").on("keyup", function() {
                var esignature_total_amount = '{{ $CompanyOffer->esignature_total_amount }}';
                var esignature_purchase_count = $(this).val();
                var total_esignature_amount = esignature_purchase_count * esignature_total_amount;
                $("#esignature_total_amount").val(total_esignature_amount.toFixed(2));
            })
        })
    </script>
@endsection
@endsection