<?php
$GetWhatsappUrl = Zend_Controller_Action_HelperBroker::getStaticHelper('GetWhatsappUrl')->GetWhatsappUrl();
$baseUrl = $this->baseUrl;
$mydevice = Zend_Controller_Action_HelperBroker::getStaticHelper('General')->getDevice();
//$secureCode = Zend_Controller_Action_HelperBroker::getStaticHelper('SecureCode')->secureCode(trim($this->searchParams['TPSysId']), 1);
?>

<style>
    .filterByContainer {
        border-radius: 5px;
        box-shadow: 0 0 10px #ccc;
        padding: 10px 16px;
        gap: 20px;
        align-items: center;
    }

    .filterByContainer .line {
        flex: 1 1 auto;
        background: #515151;
        height: 2px;
    }

    .filterByContainer>div {
        display: flex;
        gap: 10px;
        color: #898989;
    }

    .filterByContainer>div.active {
        color: #212121;
    }

    .filterByContainer .icon-element {
        aspect-ratio: 1/1;
        border-radius: 100%;
        width: 32px;
        background: #898989;
        color: #ffffff;
        display: grid;
        place-items: center;
    }

    .filterByContainer .active .icon-element {
        background: #212121;
    }

    .filterByContainer .success-step .icon-element {
        background: #306a9e;
    }

    .filterByContainer .success-step {
        color: #306a9e !important;
    }
</style>
<?php
echo $this->partial(
    'hotel-proposal/proposal-header.phtml',
    array(
        'arrAgencyDetails' => $this->arrAgencyDetails,
        'SourceAirport' => $this->SourceAirport,
        'DestinationAirport' => $this->DestinationAirport
    )
);
?>

<div class="container-fluid" ng-controller="HotelReviewController">

    <!-- Main Content Element  Start-->
    <div class="row" id="ngHotelList">



        <input type="hidden" id="searchID" value="<?= $this->searchID ?>">
        <input type="hidden" id="IsProposal" value="1">
        <input type="hidden" id="ActionName" value="review">
        <input type="hidden" id="AgencySysId" value='<?= ($this->AgencySysId) ?>'>
        <div class="col-md-12">
            <div class="filterByContainer d-flex align-items-center" id="sticky">
                <div class="active success-step">
                    <div class="icon-element"><i class="fa fa-check"></i></div>
                    <div>
                        <div><small>First Step</small></div>
                        <div><strong>Traveller Details</strong></div>
                    </div>
                </div>
                <div class="line"></div>
                <div class="active  success-step">
                    <div class="icon-element"><i class="fa fa-check"></i></div>
                    <div>
                        <div><small>Second Step</small></div>
                        <div><strong>Review</strong></div>
                    </div>
                </div>
                <div class="line"></div>
                <div class="active">
                    <div class="icon-element"><i class="fa fa-credit-card"></i></div>
                    <div>
                        <div><small>Third Step</small></div>
                        <div><strong>Payments</strong></div>
                    </div>
                </div>
                <div class="line"></div>
                <div class="">
                    <div class="icon-element"><i class="fa fa-check"></i></div>
                    <div>
                        <div><small>Finish</small></div>
                        <div><strong>Confirmed</strong></div>
                    </div>
                </div>
            </div>
        </div>


        <div class="col-md-12">
            <div class="col-md-12 no-padding">
                <div style="text-align: center; padding: 30px;">
                    <h2 class="BookingConfirm" style="text-align: center; font-size:18px; color:green;"></h2>
                    <h2 class="Pleasewaitmesg">[ Please do not refresh or press back button, We are Processing Your Booking... ]</h2>
                    <img src="<?php echo $this->baseUrl('public/assets/images/loader.gif'); ?>">
                </div>

            </div>
            <div class="clear"></div>
        </div>



    </div>


    <form name="paymentresponse" id="paymentresponse" action="" method="post">
        <input type="hidden" name="trxstatus" id="trxstatus" value="<?php echo $this->status; ?>" />
        <input type="hidden" name="strUrlData" id="strUrlData" value="<?php echo $this->strUrlData; ?>" />
        <input type="hidden" name="TrxSysId" id="TrxSysId" value="<?php echo $this->TrxSysId; ?>" />
        <input type="hidden" name="TPSysId" id="TPSysId" value="<?php echo $this->TPSysId; ?>" />
        <input type="hidden" name="guid" id="guid" value="<?php echo $this->guid; ?>" />
    </form>



    <!-- Loding Ajax Process Modals & Ajax Process Bar  -->
    <div class="col-md-12" id="progress-bar" style="display:none;">
        <div class="progress progress-striped active" style="height:20px; border-radius:10px;">
            <!-- aria-valuetransitiongoal="95" aria-valuenow="95" -->
            <div id="progress-bar" class="progress-bar progress-bar-warning six-sec-ease-in-out" style="width: 100%;">
                <span id="percent_complete"> </span>
            </div>
        </div>
    </div>

</div>


<script>
    var SITEURL = "<?php echo $baseUrl; ?>/";
</script>
<!--Layout Script start -->


<!--Advance Radio and checkbox demo start-->
<link rel="stylesheet" href="<?php echo $this->baseUrl('public/assets/css/plugins/jquery.toolbars.css'); ?>">
<script src="<?php echo $this->baseUrl('public/js/buyhotel/buyhotel.js'); ?>" type="text/javascript"></script>
<script src="<?php echo $this->baseUrl('public/assets/js/jquery.toolbar.min.js'); ?>"></script>
<script src="<?php echo $this->baseUrl('public/assets/js/bootstrap3-typeahead.js'); ?>"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl('public/assets/js/jquery.validate.min.js'); ?>"></script>


<script type="text/javascript">
    function processBooking() {
        var paymentresponse = $("#paymentresponse").serialize();
        $.ajax({
            url: '/hotel-proposal/book-hotel',
            data: paymentresponse,
            dataType: 'json',
            type: 'POST',
            error: function() {

            },
            beforeSend: function() {},
            success: function(response) {
                var TrackId = response.TrackId;
                if (response.success) {
                    window.location.href = '/hotel-proposal/booking-confirmation/data/' + TrackId + '?status=true';
                } else {
                    alert(response.msg);
                    ///window.location.href = '/hotel-proposal/booking-confirmation/data/' + TrackId + '';
                    // var urlData = response.urlData;
                    // var formAction = response.formAction;
                    // $("#frm").attr("action", formAction);
                    // $("#data").val(urlData);
                    // setTimeout(function() {
                    //     $("#frm").submit();
                    // }, 3000);
                }

            }

        });

    }
    processBooking();
</script>


</body>

</html>