From 2ef62c630c6db766413469acd4690d880215af36 Mon Sep 17 00:00:00 2001 From: "vishalsingh.qlo325" Date: Thu, 28 Mar 2024 16:04:48 +0530 Subject: [PATCH 1/3] Added: Done button into the occupacy block in the front office --- .../views/css/wk-global-search.css | 8 ++- .../views/js/wk-room-search-block.js | 51 +++++++++++++++++ .../views/templates/hook/searchForm.tpl | 26 ++++++++- .../_partials/occupancy_field.tpl | 7 ++- .../hotel-reservation-theme/js/occupancy.js | 56 +++++++++++++++++++ 5 files changed, 143 insertions(+), 5 deletions(-) diff --git a/modules/wkroomsearchblock/views/css/wk-global-search.css b/modules/wkroomsearchblock/views/css/wk-global-search.css index d70fd2e11..59f781dc3 100644 --- a/modules/wkroomsearchblock/views/css/wk-global-search.css +++ b/modules/wkroomsearchblock/views/css/wk-global-search.css @@ -206,6 +206,12 @@ text-transform: uppercase; border: none; border-radius: 4px;} + .select_occupancy_btn { + background-color: #1292FF; + font-size: 13px; + border: none; + padding: 5px 20px; + border-radius: 4px;} /* occupancy */ @@ -216,7 +222,7 @@ overflow: auto; box-shadow: 0 8px 25px -4px rgba(0,0,0,0.39); left: 0px; - padding: 20px;} + padding: 12px 20px;} #search_occupancy_wrapper .occupancy-info-separator { margin-bottom: 15px; margin-top: 15px; diff --git a/modules/wkroomsearchblock/views/js/wk-room-search-block.js b/modules/wkroomsearchblock/views/js/wk-room-search-block.js index f5d180d16..6080b36c5 100644 --- a/modules/wkroomsearchblock/views/js/wk-room-search-block.js +++ b/modules/wkroomsearchblock/views/js/wk-room-search-block.js @@ -569,6 +569,57 @@ $(document).ready(function() { } } }); + $(document).on('click', '#search_occupancy_wrapper .select_occupancy_btn', function(e) { + e.preventDefault(); + if ($('#search_occupancy_wrapper').length) { + if ($('#search_occupancy_wrapper').css('display') !== 'none') { + // Before closing the occupancy block validate the vaules inside + let hasErrors = 0; + + let adults = $("#search_occupancy_wrapper").find(".num_adults").map(function(){return $(this).val();}).get(); + let children = $("#search_occupancy_wrapper").find(".num_children").map(function(){return $(this).val();}).get(); + let child_ages = $("#search_occupancy_wrapper").find(".guest_child_age").map(function(){return $(this).val();}).get(); + + // start validating above values + if (!adults.length || (adults.length != children.length)) { + hasErrors = 1; + showErrorMessage(invalid_occupancy_txt); + } else { + $("#search_occupancy_wrapper").find('.occupancy_count').removeClass('error_border'); + + // validate values of adults and children + adults.forEach(function (item, index) { + if (isNaN(item) || parseInt(item) < 1) { + hasErrors = 1; + $("#search_occupancy_wrapper .num_adults").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); + } + if (isNaN(children[index])) { + hasErrors = 1; + $("#search_occupancy_wrapper .num_children").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); + } + }); + + // validate values of selected child ages + $("#search_occupancy_wrapper").find('.guest_child_age').removeClass('error_border'); + child_ages.forEach(function (age, index) { + age = parseInt(age); + if (isNaN(age) || (age < 0) || (age >= parseInt(max_child_age))) { + hasErrors = 1; + $("#search_occupancy_wrapper .guest_child_age").eq(index).addClass('error_border'); + } + }); + } + + if (hasErrors == 0) { + $("#search_occupancy_wrapper").hide(); + $("#search_hotel_block_form #guest_occupancy").removeClass('error_border'); + } else { + $("#search_hotel_block_form #guest_occupancy").addClass('error_border'); + return false; + } + } + } + }); }); // function to set occupancy infor in guest occupancy field(search form) function setGuestOccupancy() diff --git a/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl b/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl index 9629b5e69..3f93b5dc2 100644 --- a/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl +++ b/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl @@ -1,3 +1,22 @@ +{* +* Copyright since 2010 Webkul. +* +* NOTICE OF LICENSE +* +* All right is reserved, +* Please go through this link for complete license : https://store.webkul.com/license.html +* +* DISCLAIMER +* +* Do not edit or add to this file if you wish to upgrade this module to newer +* versions in the future. If you wish to customize this module for your +* needs please refer to https://store.webkul.com/customisation-guidelines/ for more information. +* +* @author Webkul IN +* @copyright since 2010 Webkul IN +* @license https://store.webkul.com/license.html +*} +
{if isset($location_enabled) && $location_enabled}
@@ -201,9 +220,12 @@
{/if} - + + + + diff --git a/themes/hotel-reservation-theme/_partials/occupancy_field.tpl b/themes/hotel-reservation-theme/_partials/occupancy_field.tpl index c16039713..ccd9b288e 100644 --- a/themes/hotel-reservation-theme/_partials/occupancy_field.tpl +++ b/themes/hotel-reservation-theme/_partials/occupancy_field.tpl @@ -175,11 +175,14 @@ {/if} - + + + + \ No newline at end of file diff --git a/themes/hotel-reservation-theme/js/occupancy.js b/themes/hotel-reservation-theme/js/occupancy.js index 2cb25784d..0fd907f81 100644 --- a/themes/hotel-reservation-theme/js/occupancy.js +++ b/themes/hotel-reservation-theme/js/occupancy.js @@ -160,6 +160,62 @@ $(document).ready(function(){ } }); + $(document).on('click', '.booking_occupancy_wrapper .select_occupancy_btn', function(e) { + e.preventDefault(); + if ($('.booking_occupancy_wrapper:visible').length) { + var occupancy_wrapper = $('.booking_occupancy_wrapper:visible'); + $(occupancy_wrapper).find(".occupancy_info_block").addClass('selected'); + setRoomTypeGuestOccupancy(occupancy_wrapper); + + let hasErrors = 0; + + let adults = $(occupancy_wrapper).find(".num_adults").map(function(){return $(this).val();}).get(); + let children = $(occupancy_wrapper).find(".num_children").map(function(){return $(this).val();}).get(); + let child_ages = $(occupancy_wrapper).find(".guest_child_age").map(function(){return $(this).val();}).get(); + + // start validating above values + if (!adults.length || (adults.length != children.length)) { + hasErrors = 1; + showErrorMessage(invalid_occupancy_txt); + } else { + $(occupancy_wrapper).find('.occupancy_count').removeClass('error_border'); + + // validate values of adults and children + adults.forEach(function (item, index) { + if (isNaN(item) || parseInt(item) < 1) { + hasErrors = 1; + $(occupancy_wrapper).find(".num_adults").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); + } + if (isNaN(children[index])) { + hasErrors = 1; + $(occupancy_wrapper).find(".num_children").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); + } + }); + + // validate values of selected child ages + $(occupancy_wrapper).find('.guest_child_age').removeClass('error_border'); + child_ages.forEach(function (age, index) { + age = parseInt(age); + if (isNaN(age) || (age < 0) || (age >= parseInt(max_child_age))) { + hasErrors = 1; + $(occupancy_wrapper).find(".guest_child_age").eq(index).addClass('error_border'); + } + }); + } + if (hasErrors == 0) { + if (!($(e.target).closest(".ajax_add_to_cart_button").length + || $(e.target).closest(".exclusive.book_now_submit").length + )) { + $(occupancy_wrapper).parent().removeClass('open'); + $(occupancy_wrapper).siblings(".booking_guest_occupancy").removeClass('error_border'); + $(document).trigger( "QloApps:updateRoomOccupancy", [occupancy_wrapper]); + } + } else { + $(occupancy_wrapper).siblings(".booking_guest_occupancy").addClass('error_border'); + } + } + }); + $(document).on('click', function(e) { if ($('.booking_occupancy_wrapper:visible').length) { var occupancy_wrapper = $('.booking_occupancy_wrapper:visible'); From 52b9795bf1c585138026970af2efb837c48f7741 Mon Sep 17 00:00:00 2001 From: "vishalsingh.qlo325" Date: Tue, 25 Jun 2024 16:57:23 +0530 Subject: [PATCH 2/3] Added validateBookingOccupancies function to validate the occupancy popup --- .../views/templates/hook/searchForm.tpl | 14 +- .../_partials/occupancy_field.tpl | 20 +-- .../hotel-reservation-theme/js/occupancy.js | 150 +++++++----------- 3 files changed, 73 insertions(+), 111 deletions(-) diff --git a/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl b/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl index ea0a97990..ed590139d 100644 --- a/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl +++ b/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl @@ -210,12 +210,14 @@ {/if} - - {l s='Add Room' mod='wkroomsearchblock'} - - - - +
+ + {l s='Add Room' mod='wkroomsearchblock'} + + + + +
diff --git a/themes/hotel-reservation-theme/_partials/occupancy_field.tpl b/themes/hotel-reservation-theme/_partials/occupancy_field.tpl index ccd9b288e..98981c700 100644 --- a/themes/hotel-reservation-theme/_partials/occupancy_field.tpl +++ b/themes/hotel-reservation-theme/_partials/occupancy_field.tpl @@ -175,14 +175,16 @@ {/if} - - - - {l s='Add Room'} - - - - - +
+ + + + {l s='Add Room'} + + + + + +
\ No newline at end of file diff --git a/themes/hotel-reservation-theme/js/occupancy.js b/themes/hotel-reservation-theme/js/occupancy.js index 5f7307f2f..ca7b8f7ed 100644 --- a/themes/hotel-reservation-theme/js/occupancy.js +++ b/themes/hotel-reservation-theme/js/occupancy.js @@ -163,117 +163,75 @@ $(document).ready(function(){ $(document).on('click', '.booking_occupancy_wrapper .select_occupancy_btn', function(e) { e.preventDefault(); if ($('.booking_occupancy_wrapper:visible').length) { - var occupancy_wrapper = $('.booking_occupancy_wrapper:visible'); - $(occupancy_wrapper).find(".occupancy_info_block").addClass('selected'); - setRoomTypeGuestOccupancy(occupancy_wrapper); - - let hasErrors = 0; - - let adults = $(occupancy_wrapper).find(".num_adults").map(function(){return $(this).val();}).get(); - let children = $(occupancy_wrapper).find(".num_children").map(function(){return $(this).val();}).get(); - let child_ages = $(occupancy_wrapper).find(".guest_child_age").map(function(){return $(this).val();}).get(); - - // start validating above values - if (!adults.length || (adults.length != children.length)) { - hasErrors = 1; - showErrorMessage(invalid_occupancy_txt); - } else { - $(occupancy_wrapper).find('.occupancy_count').removeClass('error_border'); - - // validate values of adults and children - adults.forEach(function (item, index) { - if (isNaN(item) || parseInt(item) < 1) { - hasErrors = 1; - $(occupancy_wrapper).find(".num_adults").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); - } - if (isNaN(children[index])) { - hasErrors = 1; - $(occupancy_wrapper).find(".num_children").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); - } - }); - - // validate values of selected child ages - $(occupancy_wrapper).find('.guest_child_age').removeClass('error_border'); - child_ages.forEach(function (age, index) { - age = parseInt(age); - if (isNaN(age) || (age < 0) || (age >= parseInt(max_child_age))) { - hasErrors = 1; - $(occupancy_wrapper).find(".guest_child_age").eq(index).addClass('error_border'); - } - }); - } - if (hasErrors == 0) { - if (!($(e.target).closest(".ajax_add_to_cart_button").length - || $(e.target).closest(".exclusive.book_now_submit").length - )) { - $(occupancy_wrapper).parent().removeClass('open'); - $(occupancy_wrapper).siblings(".booking_guest_occupancy").removeClass('error_border'); - $(document).trigger( "QloApps:updateRoomOccupancy", [occupancy_wrapper]); - } - } else { - $(occupancy_wrapper).siblings(".booking_guest_occupancy").addClass('error_border'); - } + return validateBookingOccupancies(e); } }); $(document).on('click', function(e) { if ($('.booking_occupancy_wrapper:visible').length) { - var occupancy_wrapper = $('.booking_occupancy_wrapper:visible'); - $(occupancy_wrapper).find(".occupancy_info_block").addClass('selected'); - setRoomTypeGuestOccupancy(occupancy_wrapper); if (!($(e.target).closest(".booking_occupancy_wrapper").length || $(e.target).closest(".booking_guest_occupancy").length || $(e.target).closest(".remove-room-link").length )) { - let hasErrors = 0; + return validateBookingOccupancies(e); + } + } + }); - let adults = $(occupancy_wrapper).find(".num_adults").map(function(){return $(this).val();}).get(); - let children = $(occupancy_wrapper).find(".num_children").map(function(){return $(this).val();}).get(); - let child_ages = $(occupancy_wrapper).find(".guest_child_age").map(function(){return $(this).val();}).get(); + function validateBookingOccupancies(e) { + var occupancy_wrapper = $('.booking_occupancy_wrapper:visible'); + $(occupancy_wrapper).find(".occupancy_info_block").addClass('selected'); + setRoomTypeGuestOccupancy(occupancy_wrapper); + let hasErrors = 0; + let adults = $(occupancy_wrapper).find(".num_adults").map(function(){return $(this).val();}).get(); + let children = $(occupancy_wrapper).find(".num_children").map(function(){return $(this).val();}).get(); + let child_ages = $(occupancy_wrapper).find(".guest_child_age").map(function(){return $(this).val();}).get(); + + // start validating above values + if (!adults.length || (adults.length != children.length)) { + hasErrors = 1; + showErrorMessage(invalid_occupancy_txt); + } else { + $(occupancy_wrapper).find('.occupancy_count').removeClass('error_border'); - // start validating above values - if (!adults.length || (adults.length != children.length)) { + // validate values of adults and children + adults.forEach(function (item, index) { + if (isNaN(item) || parseInt(item) < 1) { hasErrors = 1; - showErrorMessage(invalid_occupancy_txt); - } else { - $(occupancy_wrapper).find('.occupancy_count').removeClass('error_border'); - - // validate values of adults and children - adults.forEach(function (item, index) { - if (isNaN(item) || parseInt(item) < 1) { - hasErrors = 1; - $(occupancy_wrapper).find(".num_adults").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); - } - if (isNaN(children[index])) { - hasErrors = 1; - $(occupancy_wrapper).find(".num_children").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); - } - }); - - // validate values of selected child ages - $(occupancy_wrapper).find('.guest_child_age').removeClass('error_border'); - child_ages.forEach(function (age, index) { - age = parseInt(age); - if (isNaN(age) || (age < 0) || (age >= parseInt(max_child_age))) { - hasErrors = 1; - $(occupancy_wrapper).find(".guest_child_age").eq(index).addClass('error_border'); - } - }); + $(occupancy_wrapper).find(".num_adults").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); } - if (hasErrors == 0) { - if (!($(e.target).closest(".ajax_add_to_cart_button").length - || $(e.target).closest(".exclusive.book_now_submit").length - )) { - $(occupancy_wrapper).parent().removeClass('open'); - $(occupancy_wrapper).siblings(".booking_guest_occupancy").removeClass('error_border'); - $(document).trigger( "QloApps:updateRoomOccupancy", [occupancy_wrapper]); - } - } else { - $(occupancy_wrapper).siblings(".booking_guest_occupancy").addClass('error_border'); + if (isNaN(children[index])) { + hasErrors = 1; + $(occupancy_wrapper).find(".num_children").eq(index).closest('.occupancy_count_block').find('.occupancy_count').addClass('error_border'); } - } + }); + + // validate values of selected child ages + $(occupancy_wrapper).find('.guest_child_age').removeClass('error_border'); + child_ages.forEach(function (age, index) { + age = parseInt(age); + if (isNaN(age) || (age < 0) || (age >= parseInt(max_child_age))) { + hasErrors = 1; + $(occupancy_wrapper).find(".guest_child_age").eq(index).addClass('error_border'); + } + }); } - }); + if (hasErrors == 0) { + if (!($(e.target).closest(".ajax_add_to_cart_button").length + || $(e.target).closest(".exclusive.book_now_submit").length + )) { + $(occupancy_wrapper).parent().removeClass('open'); + $(occupancy_wrapper).siblings(".booking_guest_occupancy").removeClass('error_border'); + $(document).trigger( "QloApps:updateRoomOccupancy", [occupancy_wrapper]); + } + } else { + $(occupancy_wrapper).siblings(".booking_guest_occupancy").addClass('error_border'); + + return false; + } + + return true; + } $(document).on('click', '.booking_occupancy_wrapper .add_new_occupancy_btn', function(e) { e.preventDefault(); From 04485016d56e8fdeec48c867678205f257229737 Mon Sep 17 00:00:00 2001 From: "vishalsingh.qlo325" Date: Thu, 27 Jun 2024 18:12:40 +0530 Subject: [PATCH 3/3] Updated the name of the done button field in the occuancy popup --- modules/wkroomsearchblock/views/css/wk-global-search.css | 2 +- modules/wkroomsearchblock/views/js/wk-room-search-block.js | 2 +- modules/wkroomsearchblock/views/templates/hook/searchForm.tpl | 2 +- themes/hotel-reservation-theme/_partials/occupancy_field.tpl | 2 +- themes/hotel-reservation-theme/js/occupancy.js | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/modules/wkroomsearchblock/views/css/wk-global-search.css b/modules/wkroomsearchblock/views/css/wk-global-search.css index 6872355b6..3949a7c10 100644 --- a/modules/wkroomsearchblock/views/css/wk-global-search.css +++ b/modules/wkroomsearchblock/views/css/wk-global-search.css @@ -213,7 +213,7 @@ text-transform: uppercase; border: none; border-radius: 4px;} - .select_occupancy_btn { + .submit_occupancy_btn { background-color: #1292FF; font-size: 13px; border: none; diff --git a/modules/wkroomsearchblock/views/js/wk-room-search-block.js b/modules/wkroomsearchblock/views/js/wk-room-search-block.js index e4e3f06a2..72588c0e3 100644 --- a/modules/wkroomsearchblock/views/js/wk-room-search-block.js +++ b/modules/wkroomsearchblock/views/js/wk-room-search-block.js @@ -831,7 +831,7 @@ $(document).ready(function() { } }); - $(document).on('click', '#search_occupancy_wrapper .select_occupancy_btn', function(e) { + $(document).on('click', '#search_occupancy_wrapper .submit_occupancy_btn', function(e) { e.preventDefault(); if ($('#search_occupancy_wrapper').length) { if ($('#search_occupancy_wrapper').css('display') !== 'none') { diff --git a/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl b/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl index ed590139d..8bd27f7fc 100644 --- a/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl +++ b/modules/wkroomsearchblock/views/templates/hook/searchForm.tpl @@ -215,7 +215,7 @@ {l s='Add Room' mod='wkroomsearchblock'} - + diff --git a/themes/hotel-reservation-theme/_partials/occupancy_field.tpl b/themes/hotel-reservation-theme/_partials/occupancy_field.tpl index 98981c700..3717949b3 100644 --- a/themes/hotel-reservation-theme/_partials/occupancy_field.tpl +++ b/themes/hotel-reservation-theme/_partials/occupancy_field.tpl @@ -183,7 +183,7 @@ - + diff --git a/themes/hotel-reservation-theme/js/occupancy.js b/themes/hotel-reservation-theme/js/occupancy.js index ca7b8f7ed..031a37904 100644 --- a/themes/hotel-reservation-theme/js/occupancy.js +++ b/themes/hotel-reservation-theme/js/occupancy.js @@ -160,7 +160,7 @@ $(document).ready(function(){ } }); - $(document).on('click', '.booking_occupancy_wrapper .select_occupancy_btn', function(e) { + $(document).on('click', '.booking_occupancy_wrapper .submit_occupancy_btn', function(e) { e.preventDefault(); if ($('.booking_occupancy_wrapper:visible').length) { return validateBookingOccupancies(e);