1(function($) { 2 "use strict"; 3 4 var $owl = []; 5 var ajax_request = {}; 6 var timer = {}; 7 var sticky_sidebar; 8 var sticky_cart; 9 const $timeout = 80000; 10 const $content_type = { 11 'form':'application/x-www-form-urlencoded; charset=UTF-8', 12 'json':'application/json' 13 }; 14 var $instance_lazy; 15 16 const map_style =[ 17 { 18 "featureType": "administrative.country", 19 "elementType": "geometry", 20 "stylers": [ 21 { 22 "visibility": "off" 23 } 24 ] 25 } 26 ]; 27 28 var dump = function(data) 29 { 30 console.debug(data); 31 } 32 33 var dump2 = function(data) { 34 alert(JSON.stringify(data)); 35 }; 36 37 var setStorage = function(key,value) 38 { 39 localStorage.setItem(key,value); 40 } 41 42 var getStorage = function(key) 43 { 44 return localStorage.getItem(key); 45 } 46 47 var removeStorage = function(key) 48 { 49 localStorage.removeItem(key); 50 } 51 52 var checkCart = function(){ 53 let cartCount = parseInt($('.cart-handle .badge').text()) || 0; 54 55 if(cartCount < 1){ 56 $('#orderNowBtn').show(); 57 } else { 58 $('#orderNowBtn').hide(); 59 } 60 } 61 62 jQuery.fn.exists = function(){return this.length>0;} 63 64 var empty = function(data){ 65 if (typeof data === "undefined" || data==null || data=="" || data=="null" || data=="undefined" ) { 66 return true; 67 } 68 return false; 69 }; 70 71 jQuery(document).ready(function() { 72 //banner 73 /*if( localStorage.getItem('banner-open') != '1'){ 74 var id = '#dialog'; 75 var maskHeight = $(document).height(); 76 var maskWidth = $(window).width(); 77 $('#mask').css({'width':maskWidth,'height':maskHeight}); 78 $('#mask').fadeIn(500); 79 $('#mask').fadeTo("slow",0.9); 80 var winH = $(window).height(); 81 var winW = $(window).width(); 82 $(id).css('top', '200px'); 83 $(id).css('left', winW/2-$(id).width()/2); 84 $(id).fadeIn(2000); 85 localStorage.setItem('banner-open', 1); 86 $('.window .close').click(function (e) { 87 e.preventDefault(); 88 $('#mask').hide(); 89 $('.window').hide(); 90 }); 91 $('#mask').click(function () { 92 $(this).hide(); 93 $('.window').hide(); 94 }); 95 } 96 97 jQuery(document).on("click", "#close-banner", function() { 98 localStorage.setItem('banner-open', 1); 99 });*/ 100 101 window.addEventListener('scroll', function() { 102 const container = document.querySelector('.order-toggle-container'); 103 104 if (!container) return; 105 106 if(window.pageYOffset > 100) { // adjust trigger if needed 107 container.classList.add('fixed'); 108 } else { 109 container.classList.remove('fixed'); 110 } 111 }); 112 113 checkCart(); 114 setInterval(checkCart, 500); // because API updates badge 115 116 $(window).scroll(function(e){ 117 var $el = $('.fixedElement'); 118 var isPositionFixed = ($el.css('position') == 'fixed'); 119 if ($(this).scrollTop() > 200 && !isPositionFixed){ 120 $el.css({'position': 'fixed', 'top': '-20px'}); 121 $('.closeButton').css({'display': 'block'}); 122 } 123 if ($(this).scrollTop() < 200 && isPositionFixed){ 124 $el.css({'position': 'static', 'top': '0px'}); 125 $('.closeButton').css({'display': 'none'}); 126 } 127 }); 128 129 if( $('.sidebar-panel').exists() ) { 130 $('.sidebar-panel').slideAndSwipe(); 131 } 132 133 if( $('.headroom').exists() ) { 134 var myElement = document.querySelector(".headroom"); 135 dump(myElement); 136 var headroom = new Headroom(myElement); 137 headroom.init(); 138 } 139 140 $( document ).ready( function() { 141 $( '.dropdown' ).on( 'show.bs.dropdown', function() { 142 $( this ).find( '.dropdown-menu' ).first().stop( true, true ).slideDown( 150 ); 143 } ); 144 $('.dropdown').on( 'hide.bs.dropdown', function(){ 145 $( this ).find( '.dropdown-menu' ).first().stop( true, true ).slideUp( 150 ); 146 } ); 147 }); 148 149 /*if( $('.owl-carousel').exists() ) { 150 $owl = $(".owl-carousel").owlCarousel({ 151 items:5, 152 lazyLoad:true, 153 loop:true, 154 margin:15 155 }); 156 }*/ 157 158 // Filter 159 $( '.js-filter' ).on( 'click', function() { 160 var $color = $(this).attr('data-color'); 161 if ( $color == 'all' ) { 162 $( '.js-filterable' ).removeClass( 'is-hidden' ); 163 } else { 164 $( '.js-filterable' ).addClass( 'is-hidden' ); 165 $( '.js-filterable[data-color=' + $color + ']' ).removeClass( 'is-hidden' ); 166 } 167 168 $( '.js-filter').removeClass( 'active' ); 169 $(this).addClass('active'); 170 }); 171 // Filter end 172 173 if( $('.star-rating').exists() ) { 174 initStarRating(); 175 } 176 177 $( document ).on( "change", "#min_range_slider", function() { 178 $(".min-selected-range").html( $(this).val()); 179 }); 180 181 $('.collapse').on('show.bs.collapse', function(){ 182 $(this).parent().find("a").removeClass("closed").addClass("opened"); 183 }).on('hidden.bs.collapse', function(){ 184 $(this).parent().find("a").removeClass("opened").addClass("closed"); 185 }); 186 187 /*$( document ).on( "click", ".quantity-add-cart", function() { 188 var $_this = $(this); 189 var $_this_qty = $(this).closest('.quantity-wrapper').find('.qty'); 190 $_this_qty.html(1); 191 $_this.hide().parent().find(".quantity-parent").show(); 192 }); */ 193 194 /*$( document ).on( "click", ".qty-btn", function() { 195 var $_this_qty = $(this).parent().parent().find(".qty"); 196 var $_add_to_cart = $(this).closest('.quantity-wrapper').find('.quantity-add-cart'); 197 var $_qty_parent = $(this).closest('.quantity-parent'); 198 199 var $cart_do = $(this).data("id"); 200 var $qty = parseInt( $_this_qty.html() ); 201 202 switch($cart_do){ 203 case "plus": 204 $qty = $qty+1; 205 break 206 207 case "less": 208 $qty = $qty-1; 209 break 210 } 211 212 if($qty<=0){ 213 $_qty_parent.hide(); 214 $_add_to_cart.show(); 215 } 216 $_this_qty.html( $qty ); 217 218 });*/ 219 220 /*STICKY SIDEBAR*/ 221 /*sticky_sidebar = $('.sticky-sidebar').stickySidebar({ 222 topSpacing: 20, 223 });*/ 224 225 if( $('.sticky-sidebar').exists() ) { 226 sticky_sidebar = new StickySidebar('.sticky-sidebar', {topSpacing: 20}); 227 } 228 if( $('.sticky-cart').exists() ) { 229 sticky_cart = new StickySidebar('.sticky-cart', {topSpacing: 20}); 230 } 231 232 /*STICKY*/ 233 $(".category-nav").sticky({topSpacing:0}); 234 235 /*GALLERY*/ 236 $('.gallery_magnific').magnificPopup({ 237 delegate: 'a', 238 type: 'image', 239 gallery: { 240 enabled: true 241 }, 242 removalDelay: 300, 243 mainClass: 'mfp-fade' 244 }); 245 246 247 /*$( document ).on( "click", ".list-selection li, .single-select", function(event) { 248 var $input = $(this).find('input'); 249
250 if( $(event.target).hasClass('qty-btn') || $(event.target).hasClass('zmdi') ){ 251 return; 252 } 253 254 if ( $input.attr("type")=="checkbox"){ 255 $input.prop('checked', !($input.is(':checked'))); 256 } else $input.prop('checked',true); 257 258 var $parent = $(this).parent().parent().find("a"); 259 $parent.each(function(index, $obj){ 260 $($obj).removeClass("active"); 261 }); 262 $(this).addClass("active"); 263 });*/ 264 265 $( document ).on( "click", ".toogle-radio", function() { 266 var $_this = $(this).find('input'); 267 if($_this.prop('checked')==false){ 268 $_this.prop('checked',true); 269 } else { 270 $_this.prop('checked',false); 271 } 272 }); 273 274 $( document ).on( "click", ".desired_delivery", function() { 275 HideandShow( $(this).find("input").val() ,{ 276 'now':'hide', 277 'schedule':'show' 278 }, '.schedule-section' ); 279 }); 280 281 /*$( document ).on( "click", ".add_tips", function() { 282 HideandShow( $(this).find("input").val() ,{ 283 '10':'hide', 284 '20':'hide', 285 '30':'hide', 286 'other':'show' 287 }, '.tips-other-section' ); 288 });*/ 289 290 $( document ).on( "click", ".a-account", function() { 291 $(".login-wrap,.signup-wrap,.account-section").hide(); 292 $( "."+$(this).data("id") ).show(); 293 }); 294 295 $( document ).on( "click", ".close-modal", function() { 296 closeModal( $(this).data('id') ); 297 }); 298 299 300 /*TYPEEHEAD*/ 301 if( $('.auto_typehead').exists() ) { 302 var $typehead_settings = {}; 303 $('.auto_typehead').each(function(index, $obj){ 304 var $_this = $(this); 305 var $api = $_this.data("api"); 306 var $display = $_this.data("display"); 307 308 var $temp_settings = parseQuery( $_this.data("settings") ); 309 310 $.each($temp_settings,function(key, val) { 311 if(val=="true"){ 312 $typehead_settings[key]=true; 313 } else if ( val=="false"){ 314 $typehead_settings[key]=false; 315 } else { 316 $typehead_settings[key]=val; 317 } 318 }); 319 320 $typehead_settings['input'] = $_this; 321 322 $typehead_settings['source'] = { 323 user: { 324 display: $display.split(","), 325 ajax: { 326 method: "POST", 327 url: ajaxurl +"/"+$api, 328 path: "details.data", 329 data: { 330 q: "{{query}}", 331 'YII_CSRF_TOKEN': $('meta[name=YII_CSRF_TOKEN]').attr('content') 332 }, 333 beforeSend: function (jqXHR, options) { 334 dump('before send'); 335 //$(".typhead-error").remove(); 336 337 if($api=="getlocation_autocomplete"){ 338 if( $('.change-address-modal').exists() ) { 339 $(".change-address-modal").find(".modal-content").addClass("opened"); 340 } 341 } 342 }, 343 callback: { 344 done: function (data) { 345 /*if(data.code==2){ 346 var $found_err = $_this.parent().find(".typhead-error"); 347 if($found_err.length<=0){ 348 $_this.after('<p class="typhead-error m-0 text-danger">'+ data.msg+'</p>'); 349 } else { 350 $found_err.html( data.msg ); 351 } 352 $(".typeahead__container").removeClass("loading"); 353 return false; 354 }*/ 355 return data; 356 }, 357 fail: function (jqXHR, textStatus, errorThrown) {}, 358 always :function (data, textStatus, jqXHR) { 359 dump("always"); 360 }, 361 then: function (jqXHR, textStatus) {} 362 } 363 } 364 } 365 }; 366 367 $typehead_settings['template'] = function (query, item) { 368 return $_this.data("template"); 369 }; 370 371 $typehead_settings['emptyTemplate'] = $_this.data("emptytemplate"); 372 373 $typehead_settings['callback'] = { 374 onClickAfter: function (node, a, item, event) { 375 376 var $method = node.data("api"); 377 378 switch($method){ 379 case "getlocation_autocomplete": 380 381 var $services = getServiceSelected(); 382 var $params ='id='+ item.id + "&addressLine1="+ item.addressLine1 + "&addressLine2="+item.addressLine2; 383 384 if(item.provider=="google.maps"){ 385 if ((typeof item.place_type !== "undefined") && ( item.place_type !== null)) { 386 $params+="&place_type=" + item.place_type; 387 } 388 } else if( item.provider=="mapbox" ) { 389 if ((typeof item.latitude !== "undefined") && ( item.latitude !== null)) { 390 $params+="&latitude=" + item.latitude; 391 $params+="&longitude=" + item.longitude; 392 $params+="&place_type=" + item.place_type; 393 } 394 } 395 396 $params+="&services="+$services;
397 processAjax('getLocationDetails',$params,'typeahead_loader',1); 398 399 break; 400 401 case "getSearchSuggestion": 402 window.location.href = item.url; 403 break; 404 405 } //end switch 406 407 // onClickAfter 408 }, 409 onCancel: function (node, item, event) { 410 411 if($api=="getlocation_autocomplete"){ 412 if( $('.change-address-modal').exists() ) { 413 $(".change-address-modal").find(".modal-content").removeClass("opened"); 414 } 415 } 416 // onCancel 417 } 418 // 419 }; 420 421 $typehead_settings['selector'] = { 422 list: "typeahead__list list-unstyled", 423 }; 424 425 //dump($typehead_settings); 426 $.typeahead($typehead_settings); 427 }); 428 } 429 /*END TYPEEHEAD*/ 430 431 $( document ).on( "click", ".get_current_location", function() { 432 getCurrentLocation('get_place_details'); 433 }); 434 435 436 /*SHOW FILTER*/ 437 if( $('.load-ajax').exists() ) { 438 $('.load-ajax').each(function(index, $obj){ 439 var $ajax_method = $($obj).data("action"); 440 var $params = $($obj).data("params"); 441 var $loader_type = $($obj).data("loader_type"); 442 var $single_call = $($obj).data("single_call"); 443 var $silent = $($obj).data("silent"); 444 var $method = $($obj).data("method"); 445 var $content_type = $($obj).data("content_type"); 446 var $data = parseQuery($params); 447 if($content_type=="json"){ 448 if($ajax_method=="getFeed"){ 449 var $services = $data.services; 450 $params = { 451 'local_id':$data.local_id, 452 'target':$data.target, 453 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 454 'filters':{ 455 'services':$services.split(",") 456 } 457 }; 458 } 459 $params = JSON.stringify($params); 460 } 461 processAjax($ajax_method,$params,$loader_type,$single_call,$silent,$method,$content_type); 462 }); 463 } 464 465 /*if( $('.list-loader').exists() ) { 466 $('.list-loader').each(function(index, $obj){ 467 listPlaceholder($(this) , $obj); 468 }); 469 }*/ 470 471 $( document ).on( "click", ".show-more", function($obj) { 472 var $ajax_method = $(this).data("action"); 473 var $params = $(this).data("params"); 474 var $loader_type = $(this).data("loader_type"); 475 var $single_call = $(this).data("single_call"); 476 var $data = parseQuery($params); 477 var $filters = $data.filters; 478 $filters = $filters.replace(/\\/g, ''); 479 $filters = JSON.parse( $filters ); 480 481 $params = { 482 'local_id':$data.local_id, 483 'page': $data.page, 484 'target':$data.target, 485 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 486 'filters': $filters 487 }; 488 $params = JSON.stringify($params); 489 processAjax($ajax_method,$params,$loader_type,$single_call,null,'PUT','json'); 490 }); 491 492 $( document ).on( "click", ".restaurants-filter", function($obj) { 493 var $local_id = $("#local_id").val(); 494 var $target = $("#target").val(); 495 var $params=''; 496 var $sort = $(".sort:checked").val(); 497 var $price_range = $(".price_range:checked").val(); 498 var $max_fee = $("#min_range_slider").val(); 499 var $ratings = $(".ratings_selected").val(); 500 var $services = []; var $cuisine=[]; 501 502 $(".services:checked").each(function() { 503 $services.push( $(this).val() ); 504 }); 505 $(".cuisine:checked").each(function() { 506 $cuisine.push( $(this).val() ); 507 }); 508 509 if ((typeof $sort !== "undefined") && ( $sort !== null)) { 510 // 511 } else $sort=''; 512 513 $params = { 514 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 515 'local_id':$local_id, 516 'target':$target, 517 'filters': { 518 'services':$services, 519 'cuisine':$cuisine, 520 'price_range':$price_range, 521 'max_fee':parseInt($max_fee), 522 'ratings':parseInt($ratings), 523 'sort':$sort 524 } 525 }; 526 $params = JSON.stringify($params); 527 processAjax('getFeed',$params,'restaurants_filter',1,1,'PUT','json'); 528 }); 529 530 531 // init lazy load 532 $(function(){ 533 initLazyImage(); 534 }); 535 536 $('#changeAddress').on('shown.bs.modal', function (e) { 537 $(".auto_typehead").val(''); 538 $(".auto_typehead").focus(); 539 }); 540 $('#changeAddress').on('hidden.bs.modal', function (e) {
541 $(".change-address-modal").find(".modal-content").removeClass("opened"); 542 }); 543 544 $( document ).on( "click", ".get-item-details", function($obj) { 545 var $item_uuid = $(this).data("item_uuid"); 546 var $cat_id = $(this).closest('section').data("cat_id"); 547 processAjax("getMenuItem","&merchant_id="+ merchant_id + "&item_uuid=" + $item_uuid + "&cat_id="+ $cat_id ); 548 }); 549 550 551 $( document ).on( "click", ".choose-size", function() { 552 var $item_size_id = $(this).find('input:checked').val(); 553 if ((typeof $item_size_id !== "undefined") && ( $item_size_id !== null)) { 554 AddonCategoryRows($item_size_id); 555 } 556 }); 557 558 $( document ).on( "click", ".addon-items", function(event) { 559 /*var $parent = $(this).closest("ul"); 560 var $addon_multi_option = $parent.data("multi_option"); 561 var $addon_multi_option_value = $parent.data("multi_option_value"); 562 563 dump("$addon_multi_option=>"+$addon_multi_option); 564 565 switch($addon_multi_option){ 566 case "custom": 567 var $inputs = $parent.find("input:checked"); 568 var $total_selected = $inputs.length; 569 dump($total_selected+"=>"+$addon_multi_option_value); 570 if($total_selected>=$addon_multi_option_value){ 571 $parent.find("input:checkbox:not(:checked)").attr("disabled",true); 572 } else { 573 $parent.find("input:disabled").attr("disabled",false); 574 } 575 break; 576 }*/ 577 /*setTimeout(function() { 578 ItemSummary(); 579 }, 1); */ 580 }); 581 582 /*$( document ).on( "click", ".multiple_qty", function(event) { 583 setTimeout(function() { 584 ItemSummary(); 585 }, 1); 586 });*/ 587 588 /*$( document ).on( "click", ".add_to_cart", function(event) { 589 addToCart(); 590 });*/ 591 592 }); 593 /*end doc ready*/ 594 595 var listPlaceholder = function($_this){ 596 var $html=''; 597 var $itemlimit = parseInt( list_limit ); 598 dump("$itemlimit=>"+$itemlimit); 599 for (let i = 0; i < $itemlimit; i++) { 600 $html+='<div class="col-lg-3 col-md-3 mb-4 mb-lg-3">'; 601 $html+='<div class="position-relative skeleton-height">'; 602 $html+='<div class="skeleton-placeholder"></div>'; 603 $html+='</div>'; 604 $html+='</div>'; 605 } 606 $_this.html( $html ); 607 }; 608 609 var getCurrentLocation = function(next_steps){ 610 611 var options = { 612 enableHighAccuracy: true, 613 timeout: 5000, 614 maximumAge: 0 615 }; 616 617 if (navigator.geolocation) { 618 initLoader('typeahead_loader',1); 619 navigator.geolocation.getCurrentPosition(function(position){ 620 621 var $services = getServiceSelected(); 622 623 processAjax("reverseGeocoding","lat="+ position.coords.latitude + "&lng=" + position.coords.longitude + "&services=" + $services + "&next_steps="+next_steps ,'typeahead_loader',1); 624 625 }, function(err){ 626 initLoader('typeahead_loader',false); 627 notify( err.message ); 628 }, options); 629 } else { 630 notify( t("Error: Your browser doesn't support geolocation.") ); 631 initLoader('typeahead_loader',false); 632 } 633 }; 634 635 var getServiceSelected = function(){ 636 var $services =''; 637 if( $('#services').exists() ) { 638 $("#services option:selected").each(function(){ 639 $services+=$(this).val()+','; 640 }); 641 } 642 return $services; 643 }; 644 645 function parseQuery(str) 646 { 647 if(typeof str != "string" || str.length == 0) return {}; 648 var s = str.split("&"); 649 var s_length = s.length; 650 var bit, query = {}, first, second; 651 for(var i = 0; i < s_length; i++) 652 { 653 bit = s[i].split("="); 654 first = decodeURIComponent(bit[0]); 655 if(first.length == 0) continue; 656 second = decodeURIComponent(bit[1]); 657 if(typeof query[first] == "undefined") query[first] = second; 658 else if(query[first] instanceof Array) query[first].push(second); 659 else query[first] = [query[first], second]; 660 } 661 return query; 662 } 663 664 var HideandShow = function($value, $data , $target){ 665 $.each($data,function(key, val) { 666 dump(key+"=>"+val +"=>"+$value); 667 if($value==key){ 668 if(val=="show"){ 669 $($target).show(); 670 } else { 671 $($target).hide(); 672 } 673 } 674 }); 675 }; 676 677 var closeModal = function($modal_id){ 678 $('#'+$modal_id).modal('hide') 679 }; 680 681 var initLazyImage = function(){ 682 $instance_lazy = $(".lazy").Lazy({ 683 chainable: false, 684 beforeLoad: function(element) { 685 //dump('before load'); 686 }, 687 afterLoad: function(element) { 688 /*dump('after load'); 689 dump(element);*/ 690 element.parent().parent().addClass("image-loaded"); 691 //element.parent().addClass("image-loaded"); 692 }, 693 onError: function(element) { 694 //dump('error loading image'); 695 }, 696 onFinishedAll: function() { 697 //dump('finish loading all image'); 698 } 699 }); 700 }; 701 702 var updateLazyImage = function(){ 703 704 setTimeout(() => { 705 /*$instance_lazy.addItems( $('.lazy') ); 706 $instance_lazy.loadAll(); */ 707 initLazyImage(); 708 }, 500); 709 }; 710 711 var t = function(words){ 712 return words; 713 }; 714 715 /*var notify = function($message, $message_type){ 716 dump2($message); 717 };*/ 718
719 const notyf = new Notyf({ 720 'duration':1000*4 721 }); 722 723 var notify = function($message, $message_type){ 724 switch($message_type){ 725 case "error": 726 notyf.error($message); 727 break; 728 729 default: 730 notyf.success($message); 731 break; 732 } 733 }; 734 735 const DEMO_notyf = new Notyf({ 736 'duration':10000*6, 737 'dismissible':true, 738 'icon':'', 739 }); 740 741 var helpNotify = function(message){ 742 DEMO_notyf.success(message); 743 }; 744 745 var getTimeNow = function(){ 746 /*var d = new Date(); 747 var n = d.getTime(); 748 n = parseInt(n) + parseInt(d.getMilliseconds()); 749 return n;*/ 750 var n = Date.now() + ( (Math.random()*100000).toFixed()); 751 return n; 752 }; 753 754 var addValidationRequest = function(){ 755 var params=''; 756 var lang = document.documentElement.lang 757 var yii_token = $('meta[name=YII_CSRF_TOKEN]').attr('content'); 758 params+="&YII_CSRF_TOKEN="+yii_token; 759 params+="&lang="+lang; 760 return params; 761 } 762 763 /*mycall*/ 764 var processAjax = function(action , data , loader_type, single_call, silent, method , content_type){ 765 766 var timenow = getTimeNow(); 767 if(!empty(single_call)){ 768 timenow = single_call; 769 } 770 771 //dump("timenow=>"+ timenow); 772 773 if(empty(silent)){ 774 silent = null; 775 } 776 777 var $content_type =''; 778 779 if(empty(method)){ 780 method="POST"; 781 } 782 if(empty(content_type)){ 783 $content_type = 'application/x-www-form-urlencoded; charset=UTF-8'; 784 data+=addValidationRequest(); 785 } else { 786 $content_type = 'application/json'; 787 } 788 789 ajax_request[timenow] = $.ajax({ 790 url: ajaxurl+"/"+action, 791 method: method, 792 data: data , 793 dataType: "json", 794 contentType : $content_type , 795 timeout: $timeout, 796 crossDomain: true, 797 beforeSend: function( xhr ) { 798 //dump("is silent=>"+silent); 799 //if ((typeof silent !== "undefined") && ( silent !== null)) { 800 if(silent==null){ 801 //dump("ok silent => " + action); 802 } else { 803 //dump("show loader_type=> "+ loader_type); 804 initLoader(loader_type,true); 805 } 806 if(ajax_request[timenow] != null) { 807 //dump("request aborted"); 808 ajax_request[timenow].abort(); 809 clearTimeout( timer[timenow] ); 810 } else { 811 timer[timenow] = setTimeout(function() { 812 ajax_request[timenow].abort(); 813 //notify( t('Request taking lot of time. Please try again') ); 814 }, $timeout); 815 } 816 } 817 }); 818 819 820 ajax_request[timenow].done(function( data ) { 821 //dump('done'); 822 var next_action=''; 823 if ((typeof data.details !== "undefined") && ( data.details !== null)) { 824 if ((typeof data.details.next_action !== "undefined") && ( data.details.next_action !== null)) { 825 next_action = data.details.next_action; 826 } 827 } 828 829 if(data.code==1){ 830 switch(next_action){ 831 case "redirect": 832 window.location.href = data.details.redirect_url; 833 break; 834 835 case "get_place_details": 836 var $data = data.details.data; 837 $(".auto_typehead").val( $data.address.address1 ); 838 var $params ='id='+ $data.place_id + "&addressLine1="+ $data.address.address1 + "&addressLine2="+$data.address.address2; 839 if(data.details.provider=="google.maps"){ 840 if ((typeof $data.place_type !== "undefined") && ( $data.place_type !== null)) { 841 $params+="&place_type=" + $data.place_type; 842 } 843 } else if( data.details.provider=="mapbox" ) { 844 if ((typeof $data.latitude !== "undefined") && ( $data.latitude !== null)) { 845 $params+="&latitude=" + $data.latitude; 846 $params+="&longitude=" + $data.longitude; 847 $params+="&place_type=" + $data.place_type; 848 } 849 } 850 851 $params+="&services="+data.details.services; 852 processAjax('getLocationDetails',$params,'typeahead_loader',1); 853 break; 854 855 case "sidebar_filter": 856 $(".sidenav-filter").html( data.details.data ); 857 $(".min-selected-range").html( $("#min_range_slider").val()); 858 initStarRating(); 859 860 $('#moreCuisine').on('shown.bs.collapse', function () { 861 $(".more-cuisine u").html( t("View less") ); 862 }); 863 $('#moreCuisine').on('hidden.bs.collapse', function () { 864 $(".more-cuisine u").html( t("Show more +") ); 865 }); 866 867 break; 868 869 case "fill_feed": 870 871 fillFeed({ 872 'action': data.details.action, 873 'title':data.details.total_message, 874 'data': data.details.data , 875 'target':data.details.target , 876 'append': data.details.append , 877 'show_next_page': data.details.show_next_page, 878 'next_page_data': data.details.next_page_data 879 }); 880 break; 881 882 case "merchant_menu": 883 884 /*MerchantMenu({ 885 'data':data.details.data, 886 'target':data.details.target , 887 });*/ 888 889 MerchantMenu({ 890 'data':data.details.data, 891 }); 892 893 break; 894 895 case "show_item_details": 896 $('#itemModal').modal('show'); 897 ItemDetails( data.details.data ); 898 break; 899 900 case "fill_price_format": 901 $(data.details.data.target).html( data.details.data.pretty_price ); 902 break; 903 904 } 905 } else { 906 switch(next_action){ 907 case "location_details_no_results": 908 notify( data.msg ); 909 $(".typeahead__container").removeClass("loading") 910 break; 911 912 case "clear_restaurant_results": 913 var $target = data.details.target; 914 var $html=''; 915 $html+='<div class="list-items mt-4 row hover01 list-loader load-ajax"></div>'; 916 $html+=data.details.data; 917 $($target).html($html); 918 break; 919 920 default: 921 notify( data.msg ); 922 break; 923 } 924 } 925 926 }); 927 928 /*ALWAYS*/
929 ajax_request[timenow].always(function() { 930 //dump("ajax always"); 931 initLoader(loader_type,false); 932 ajax_request[timenow]=null; 933 clearTimeout(timer[timenow]); 934 }); 935 936 /*FAIL*/ 937 ajax_request[timenow].fail(function( jqXHR, textStatus ) { 938 clearTimeout(timer[timenow]); 939 //notify( t("Failed") + ": " + textStatus ,'danger' ); 940 }); 941 942 }; 943 /*end mycall*/ 944 945 var fillFeed = function($data){ 946 //dump( $data ); 947 948 var $html=''; var $items =''; var $bgcolor; var $fncolor; var $attrs=''; 949 var $append = parseInt($data.append); 950 var $target = $data.target; 951 var $show_next_page = $data.show_next_page; 952 953 $html+='<h4 class="total_message title">'; 954 $html+= '<span>'+ $data.title +'</span>' ; 955 $html+='<div class="skeleton-placeholder"></div>'; 956 $html+='</h4>'; 957 958 $html+='<div class="list-items mt-4 row hover01 list-loader load-ajax">'; 959 960 $.each($data.data, function(key, val){ 961 962 $items+='<div class="col-lg-3 col-md-3 mb-4 mb-lg-3">'; 963 $items+='<a href="'+ val.url +'">'; 964 $items+='<div class="position-relative">'; 965 $items+='<div class="skeleton-placeholder"></div>'; 966 $items+='<figure><img class="rounded lazy" data-src="'+ val.url_logo +'"/></figure>'; 967 $items+='<h6 class="mt-2">'+ val.restaurant_name +'</h6>'; 968 969 $items+='<div class="row">'; 970 $items+='<div class="col d-flex justify-content-start align-items-center"> '; 971 $items+='<p class="m-0"><i class="zmdi zmdi-time"></i> '+ val.delivery_estimation +'</p>'; 972 $items+='</div>'; 973 $items+='<div class="col d-flex justify-content-end align-items-center">'; 974 if(val.delivery_fee_raw>0){ 975 $items+='<p class="m-0"><i class="zmdi zmdi-car"></i> '+ val.delivery_fee +'</p>'; 976 } 977 $items+='</div>'; 978 $items+='</div>'; 979 980 $items+='<div class="position-top">'; 981 982 if ((typeof val.cuisine !== "undefined") && ( val.cuisine !== null)) { 983 if(val.cuisine.length>0){ 984 $bgcolor = val.cuisine[0].bgcolor; 985 $fncolor = val.cuisine[0].fncolor; 986 $items+='<span class="badge" style="background:'+ $bgcolor +';font-color:'+ $fncolor +';">'+ val.cuisine[0].cuisine_name +'</span>'; 987 } 988 } 989 990 $items+='<span class="badge rounded-pill float-right" style="background:'+ $bgcolor +';font-color:'+ $fncolor +';" >'+ val.ratings +'</span>'; 991 $items+='</div>'; 992 993 $items+='</div>'; 994 $items+='</a>'; 995 $items+='</div>'; 996 }); 997 998 if($append<=0){ 999 $html+=$items; 1000 } 1001 1002 $html+='</div>'; 1003 1004 if($show_next_page==true){ 1005 dump("SHOW NEXT"); 1006 $.each($data.next_page_data, function(key, val){ 1007 if(key=="filters"){ 1008 $attrs+="&filters="+ addslashes(JSON.stringify(val)); 1009 } else $attrs+=key+"="+val+"&"; 1010 }); 1011 1012 dump("ATTRIBUTES"); 1013 dump($attrs); 1014 1015 $html+='<div class="text-center show_more_section mt-5">'; 1016 $html+='<a href="javascript:;" class="btn btn-black show-more" '; 1017 $html+='data-action='+$data.action+' data-params='+$attrs ; 1018 $html+='\n'; 1019 $html+='data-loader_type='+ 'show_more' +' data-single_call="1"' ; 1020 $html+='data-silent=""' ; 1021 $html+='>'+ t("Show more") +'</a>'; 1022 $html+='<div class="m-auto circle-loader medium" data-loader="circle-side"></div>'; 1023 $html+='</div>'; 1024 } else { 1025 $(".show_more_section").hide(); 1026 } 1027 1028 1029 if($append>0){ 1030 $(".list-items").append( $items ); 1031 } else { 1032 $($target).html( $html ); 1033 } 1034 1035 updateLazyImage(); 1036 }; 1037 1038 var addslashes = function(str) 1039 { 1040 return (str + '') 1041 .replace(/[\\"']/g, '\\$&') 1042 .replace(/\u0000/g, '\\0') 1043 }; 1044 1045 /*myloader*/ 1046 var initLoader = function(loader_type,is_show){ 1047 //dump("loader_type=>"+loader_type + " =>" + is_show); 1048 switch(loader_type){ 1049 case "getLocationDetails": 1050 case "typeahead_loader": 1051 if(is_show){ 1052 $(".typeahead__container").addClass("loading"); 1053 } else { 1054 setTimeout(function() { 1055 $(".typeahead__container").removeClass("loading") 1056 }, 1000); 1057 } 1058 break; 1059 1060 case "show_more": 1061 if(is_show){ 1062 $(".show_more_section").addClass("loading"); 1063 } else { 1064 $(".show_more_section").removeClass("loading"); 1065 } 1066 break; 1067 1068 case "results_loader": 1069 if(is_show){ 1070 listPlaceholder( $('.list-loader') ); 1071 } else { 1072 // 1073 } 1074 break; 1075 1076 case "restaurants_filter": 1077 if(is_show){ 1078 listPlaceholder( $('.list-loader') ); 1079 $(".restaurants-filter").addClass("loading"); 1080 $(".total_message").addClass("loading"); 1081 $(".show_more_section").hide(); 1082 } else { 1083 $(".restaurants-filter").removeClass("loading"); 1084 $(".total_message").removeClass("loading"); 1085 } 1086 break; 1087 1088 case "add_to_cart": 1089 if(is_show){ 1090 $(".add_to_cart").addClass("loading"); 1091 } else { 1092 $(".add_to_cart").removeClass("loading"); 1093 } 1094 break; 1095 1096 default: 1097 break; 1098 } 1099 }; 1100 1101 var initStarRating = function(){ 1102 1103 var $star_settings = {}; 1104 $('.star-rating').each(function(index, $obj){ 1105 var $_this = $(this); 1106 var $totalstars = $(this).data("totalstars"); 1107 var $initialrating = $(this).data("initialrating"); 1108 var $strokecolor = $(this).data("strokecolor"); 1109 var $ratedcolor = $(this).data("ratedcolor"); 1110 var $strokewidth = parseInt($(this).data("strokewidth")); 1111 var $starsize = parseInt($(this).data("starsize")); 1112 var $readonly = $(this).data("readonly"); 1113 var $minrating = $(this).data("minrating"); 1114 var $disableafterrate = $(this).data("disableafterrate"); 1115 var $usefullstars = $(this).data("usefullstars"); 1116 var $hovercolor = $(this).data("hovercolor"); 1117 1118 $star_settings['totalStars'] = !empty($totalstars)?$totalstars:''; 1119 $star_settings['initialRating'] = !empty($initialrating)?$initialrating:''; 1120 $star_settings['minRating'] = !empty($minrating)?$minrating:''; 1121 $star_settings['strokeColor'] = !empty($strokecolor)?$strokecolor:''; 1122 $star_settings['ratedColor'] = !empty($ratedcolor)?$ratedcolor:''; 1123 $star_settings['hoverColor'] = !empty($hovercolor)?$hovercolor:''; 1124 $star_settings['strokeWidth'] = !empty($strokewidth)?$strokewidth:''; 1125 $star_settings['starSize'] = !empty($starsize)?$starsize:''; 1126 $star_settings['readOnly'] = !empty($readonly)?$readonly:''; 1127 $star_settings['disableAfterRate'] = $disableafterrate; 1128 $star_settings['useFullStars'] = !empty($usefullstars)?$usefullstars:''; 1129 1130 $star_settings['callback'] = function(currentRating, $el){ 1131 $el.parent().find(".ratings_selected").val(currentRating); 1132 //vue_app_review.rating_value = currentRating; 1133 vm_my_order.$refs.ReviewRef.rating_value = currentRating; 1134 }; 1135 1136 //dump($star_settings); 1137 $(this).starRating($star_settings); 1138 }); /*end each*/ 1139 1140 }; 1141 1142 var updateStickySibader = function(){ 1143 setTimeout(function() { 1144 sticky_sidebar.updateSticky(); 1145 }, 1); 1146 }; 1147 1148 var updateStickyCart = function(){ 1149 setTimeout(function() { 1150 if ((typeof sticky_cart !== "undefined") && ( sticky_cart !== null)) { 1151 sticky_cart.updateSticky(); 1152 } 1153 }, 1); 1154 }; 1155 1156 var MerchantMenux = function($results){ 1157 1158 $(".menu-left").removeClass("loading"); 1159 $("#merchant-menu").removeClass("loading"); 1160 1161 var $category = $results.data.category; 1162 var $items = $results.data.items; 1163 1164 /*FILL CATEGORY*/ 1165 Vue.createApp({ 1166 data(){ 1167 return $results.data 1168 } 1169 }).mount('#menu-category'); 1170 var $new_category = []; var $new_items = []; 1171 1172 /*FILL ITEMS*/
1173 if($category.length>0){ 1174 $.each($category, function(key, val){ 1175 1176 $.each(val.items, function(items_key, $item_id){ 1177 $new_items.push( $items[$item_id] ); 1178 }); // loop 1179 1180 $new_category.push({ 1181 'cat_id': val.cat_id, 1182 'category_name': val.category_name, 1183 'category_description': val.category_description, 1184 'category_information': val.category_information, 1185 'category_image': val.url_image, 1186 'category_uiid': val.category_uiid, 1187 'items':$new_items 1188 }); 1189 1190 $new_items = []; 1191 }); // loop 1192 } 1193 1194 var $new_category = {"category":$new_category}; 1195 Vue.createApp({ 1196 data(){ 1197 return $new_category 1198 } 1199 }).mount('#merchant-menu'); 1200 1201 updateStickySibader(); 1202 }; 1203 1204 1205 var $items; 1206 var $addons; 1207 var $addon_items; 1208 //var vm; 1209 1210 var ItemDetails = function($data){ 1211 $items = $data.items; 1212 $addons = $data.addons; 1213 $addon_items = $data.addon_items; 1214 1215 var $new_data = {"items":$items}; 1216 1217 if ((typeof vm !== "undefined") && ( vm !== null)) { 1218 vm.$data.items = $items; 1219 $("#item-details .lazy").attr("src", $items.url_image ); 1220 } else { 1221 vm = Vue.createApp({ 1222 data(){ 1223 return $new_data 1224 }, 1225 created () { 1226 // 1227 }, 1228 // 1229 }).mount('#item-details'); 1230 } 1231 }; 1232 1233 var ItemDetailsx = function($data){ 1234 1235 var $target = $("#itemModal .modal-body"); 1236 $items = $data.items; 1237 $addons = $data.addons; 1238 $addon_items = $data.addon_items; 1239 1240 var $html=''; 1241 1242 $html+='<div class="item_s" data-item_token="'+ $items.item_token +'" >'; 1243 1244 $html+='<div class="list-items">'; 1245 $html+='<div class="position-relative">'; 1246 $html+='<div class="skeleton-placeholder"></div>'; 1247 $html+='<img class="rounded lazy" data-src="'+ $items.url_image +'"/>'; 1248 $html+='</div>'; 1249 $html+='</div>'; 1250 1251 $html+='</div>'; 1252 1253 $html+='<h4 class="m-0 mt-2 mb-2">'+ $items.item_name +'</h4>'; 1254 if(!empty($items.item_description)){ 1255 $html+='<p>'+ $items.item_description +'</p>'; 1256 } 1257 1258 /*PRICE*/ 1259 var $item_price_count = 0; 1260 if ((typeof $items.price !== "undefined") && ( $items.price !== null)) { 1261 $item_price_count = Object.keys($items.price).length; 1262 } 1263 if($item_price_count>0){ 1264 $html+='<div class="mb-4 btn-group btn-group-toggle input-group-small choose-size flex-wrap" data-toggle="buttons">'; 1265 var $price_x = 1; 1266 $.each( $items.price , function($pkey,$prices){ 1267 var $active = $price_x==1?"active":''; 1268 var $checked = $price_x==1?"checked='checked'":''; 1269 $html+='<label class="btn '+ $active +' ">'; 1270 $html+='<input value="'+ $prices.item_size_id +'" name="size_uuid" id="size_uuid" class="size_uuid" type="radio" '+ $checked +'> '; 1271 1272 if ( $prices.discount<=0){ 1273 $html+= $prices.size_name+" "+$prices.pretty_price; 1274 } else { 1275 $html+= $prices.size_name+' <del>'+ $prices.pretty_price +'</del> ' + $prices.pretty_price_after_discount; 1276 } 1277 1278 $html+='</label>'; 1279 $price_x++; 1280 }); 1281 $html+='</div>'; 1282 } 1283 /*PRICE*/ 1284 1285 $html+='<div class="addon-list"></div>'; 1286 1287 $target.html($html); 1288 1289 $html=''; 1290 1291 var $item_size_id = $('input[name="size_uuid"]:checked').val(); 1292 //dump("=>"+ $item_size_id); 1293 1294 AddonCategoryRows($item_size_id); 1295 }; 1296 1297 var AddonCategoryRows = function( $item_size_id ){ 1298 var $html=''; 1299 var $target = $("#itemModal .addon-list"); 1300 1301 if ((typeof $items.item_addons !== "undefined") && ( $items.item_addons !== null)) { 1302 if ((typeof $items.item_addons[$item_size_id] !== "undefined") && ( $items.item_addons[$item_size_id] !== null)) { 1303 $.each( $items.item_addons[$item_size_id] , function($key,$addon_category_id){ 1304 1305 if ((typeof $addons[$addon_category_id] !== "undefined") && ( $addons[$addon_category_id] !== null)) { 1306 1307 var $multi_options = { 1308 'multi_option':$addons[$addon_category_id].multi_option, 1309 'multi_option_value':$addons[$addon_category_id].multi_option_value, 1310 'require_addon':$addons[$addon_category_id].require_addon, 1311 'pre_selected':$addons[$addon_category_id].pre_selected, 1312 'sub_items':$addons[$addon_category_id].sub_items, 1313 }; 1314 1315 $html+='<DIV class="addon-rows">'; 1316 1317 $html+='<div class="d-flex align-items-center heads">'; 1318 $html+='<div class="flexcol flex-grow-1">'; 1319 $html+='<h5 class="m-0">'+ $addons[$addon_category_id].subcategory_name +'</h5>';
1320 $html+='<p class="text-grey m-0 mb-1">'+ AddonCategoryMultiOption( $multi_options ) +'</p>'; 1321 $html+='</div>'; 1322 $html+='<div class="flexcol">'; 1323 $html+='<h6 class="m-0">'+ AddonCategoryRequired($addons[$addon_category_id].require_addon) +'</h6>'; 1324 $html+='</div>'; 1325 $html+='</div>'; 1326 1327 var $sub_items = $addons[$addon_category_id].sub_items; 1328 if($sub_items.length>0){ 1329 $html+='<ul class="list-unstyled list-selection list-addon no-hover m-0 p-0"'; 1330 $html+='data-subcat_id="'+ $addon_category_id +'" '; 1331 $html+='data-multi_option="'+ $multi_options.multi_option +'" data-multi_option_value="'+ $multi_options.multi_option_value +'" '; 1332 $html+='data-require_addon="'+ $multi_options.require_addon +'" data-pre_selected="'+ $multi_options.pre_selected +'" '; 1333 $html+='>'; 1334 1335 $.each( $sub_items , function($key,$addon_items_id){ 1336 if ((typeof $addon_items[$addon_items_id] !== "undefined") && ( $addon_items[$addon_items_id] !== null)) { 1337 $html+=AddonItemsRows( $addon_items[$addon_items_id] , $addon_category_id , $multi_options ); 1338 } 1339 }); 1340 $html+='</ul>'; 1341 } 1342 1343 $html+='</DIV>'; 1344 1345 } 1346 1347 }); 1348 } 1349 } 1350 1351 $target.html($html); 1352 ItemSummary(); 1353 }; 1354 1355 var AddonItemsRows = function($data, $addon_category_id , $multi_options){ 1356 1357 dump("AddonItemsRows"); 1358 dump($multi_options); 1359 var $multi_option= !empty($multi_options.multi_option)?$multi_options.multi_option:''; 1360 var $multi_option_value= !empty($multi_options.multi_option_value)?$multi_options.multi_option_value:''; 1361 dump("multi_option=>"+ $multi_option); 1362 dump("multi_option_value=>"+ $multi_option_value); 1363 1364 var $html=''; 1365 $html+='<li class="d-flex align-items-center" >'; 1366 //$html+='<div class="flexcol mr-2">'; 1367 1368 switch($multi_option){ 1369 1370 case "custom": 1371 $html+='<div class="custom-control custom-checkbox flex-grow-1">'; 1372 $html+='<input type="checkbox" id="sub_item_id'+ $data.sub_item_id +'" name="sub_item_id_'+ $addon_category_id +'" value="'+ $data.sub_item_id +'" class="addon-items custom-control-input">'; 1373 $html+='<label class="custom-control-label font14 bold" for="sub_item_id'+ $data.sub_item_id +'">'; 1374 $html+='<h6 class="m-0">'+ $data.sub_item_name +'</h6>'; 1375 $html+='</label>'; 1376 $html+='</div>'; 1377 $html+='<p class="m-0">+'+ $data.pretty_price +'</p>'; 1378 break; 1379 1380 case "multiple": 1381 1382 $html+='<div class="position-relative quantity-wrapper ">'; 1383 $html+='<div class="quantity-parent">'; 1384 $html+='<div class="quantity d-flex justify-content-between m-auto">'; 1385 $html+='<div><a href="javascript:;" class="rounded-pill qty-btn multiple_qty" data-id="less"><i class="zmdi zmdi-minus"></i></a></div>'; 1386 $html+='<div class="qty" data-id="'+ $data.sub_item_id +'">0</div>'; 1387 $html+='<div><a href="javascript:;" class="rounded-pill qty-btn multiple_qty" data-id="plus"><i class="zmdi zmdi-plus"></i></a></div>'; 1388 $html+='</div>'; 1389 $html+='</div> '; 1390 1391 $html+='<a href="javascript:;" class="btn quantity-add-cart multiple_qty">'; 1392 $html+='<i class="zmdi zmdi-plus"></i>'; 1393 $html+='</a>'; 1394 $html+='</div>'; 1395 1396 $html+='<div class="flexcol ml-3">'; 1397 $html+='<h6 class="m-0">'+ $data.sub_item_name +'</h6>'; 1398 $html+='<p class="m-0 text-grey">+'+ $data.pretty_price +'</p>'; 1399 $html+='</div>'; 1400 1401 break; 1402 1403 default: 1404 $html+='<div class="custom-control custom-radio flex-grow-1">'; 1405 $html+='<input type="radio" id="sub_item_id'+ $data.sub_item_id +'" name="sub_item_id_'+ $addon_category_id +'" value="'+ $data.sub_item_id +'" class="addon-items custom-control-input">'; 1406 $html+='<label class="custom-control-label font14 bold" for="sub_item_id'+ $data.sub_item_id +'">'; 1407 $html+='<h6 class="m-0">'+ $data.sub_item_name +'</h6>'; 1408 $html+='</label>'; 1409 $html+='</div>'; 1410 $html+='<p class="m-0">+'+ $data.pretty_price +'</p>'; 1411 break; 1412 } 1413 1414 //$html+='</div>'; 1415 1416 /*if($multi_option=="multiple"){ 1417 $html+='<div class="flexcol">'; 1418 $html+='<h6 class="m-0">'+ $data.sub_item_name +'</h6>'; 1419 $html+='<p class="m-0 text-grey">+'+ $data.pretty_price +'</p>'; 1420 $html+='</div>'; 1421 } else { 1422 $html+='<div class="flexcol flex-grow-1">'; 1423 $html+='<h6 class="m-0">'+ $data.sub_item_name +'</h6>'; 1424 $html+='</div>'; 1425 1426 $html+='<div class="flexcol ">'; 1427 $html+='<p class="m-0">+'+ $data.pretty_price +'</p>'; 1428 $html+='</div>'; 1429 }*/ 1430 1431 $html+='</li>'; 1432 return $html; 1433 1434 }; 1435 1436 var AddonCategoryMultiOption = function($data){ 1437 var $display_msg = ''; 1438 var $multi_option= !empty($data.multi_option)?$data.multi_option:''; 1439 var $sub_items= !empty($data.sub_items)?$data.sub_items:''; 1440 var $multi_option_value= !empty($data.multi_option_value)?$data.multi_option_value:''; 1441 1442 switch($multi_option){ 1443 case "one": 1444 $display_msg = t("Select 1"); 1445 break; 1446 1447 case "multiple":
1448 $display_msg = t("Choose up to ") + $multi_option_value; 1449 break; 1450 1451 case "two_flavor": 1452 $display_msg = t("Select flavor " + $multi_option_value); 1453 break; 1454 1455 case "custom": 1456 $display_msg = t("Choose up to ") + $multi_option_value; 1457 break; 1458 1459 default: 1460 break; 1461 } 1462 return $display_msg; 1463 }; 1464 1465 var AddonCategoryRequired = function($data){ 1466 if($data>0){ 1467 return t("Required"); 1468 } else return t("Optional"); 1469 }; 1470 1471 var $sub_item_id = 0; 1472 var $sub_item_qty = 0; 1473 var $addon_price = 0; 1474 var $item_size_id = 0; 1475 var $item_token = ''; 1476 var $item_total = 0; 1477 var $item_price = 0; 1478 var $addon_multi_option; 1479 var $addon_child; 1480 var $subcat_id = 0; 1481 var $addons_category = []; 1482 var $addons_items = []; 1483 var $require_addon=0; 1484 var $addon_multi_option_value=0; 1485 1486 var ItemSummaryx = function(){ 1487 dump("ItemSummary"); 1488 $item_total = 0; 1489 $sub_item_id = 0; 1490 $addon_price = 0; 1491 $sub_item_qty = 0; 1492 $item_size_id = vm.size_id; 1493 $item_price = 0; 1494 1495 $items = $global_items; 1496 $addon_items = $global_addon_items; 1497 1498 if(!empty($items.price[$item_size_id])){ 1499 if( $items.price[$item_size_id].discount>0 ){ 1500 $item_price = !empty($items.price[$item_size_id]) ? parseFloat($items.price[$item_size_id].price_after_discount) : 0; 1501 } else $item_price = !empty($items.price[$item_size_id]) ? parseFloat($items.price[$item_size_id].price) : 0; 1502 } 1503 1504 //dump("price=>" + $item_price); 1505 1506 $item_total+=$item_price; 1507 var $added = []; 1508 var $required_addon = []; 1509 1510 $('.list-addon').each(function(index, $obj){ 1511 $addon_multi_option = $($obj).attr("data-multi_option"); 1512 $require_addon = $($obj).attr("data-require_addon"); 1513 $subcat_id = $($obj).attr("data-subcat_id"); 1514 $addon_multi_option_value = $($obj).attr("data-multi_option_value"); 1515 1516 if($addon_multi_option=="custom" || $addon_multi_option=="one"){ 1517 $addon_child = $($obj).find(".addon-items:checked"); 1518 } else if ( $addon_multi_option=="multiple"){ 1519 $addon_child = $($obj).find(".qty"); 1520 } 1521 1522 if($require_addon==1){ 1523 $required_addon.push($subcat_id); 1524 } 1525 1526 if($addon_multi_option_value>0){ 1527 var $inputs = $($obj).find("input:checked"); 1528 var $total_selected = $inputs.length; 1529 if($total_selected>=$addon_multi_option_value){ 1530 $($obj).find("input:checkbox:not(:checked)").attr("disabled",true); 1531 } else { 1532 $($obj).find("input:disabled").attr("disabled",false); 1533 } 1534 } 1535 1536 if ((typeof $addon_child !== "undefined") && ( $addon_child !== null)) { 1537 $addon_child.each(function(child_index, child_object){ 1538 if($addon_multi_option=="multiple"){ 1539 //dump("==>x"+$addon_multi_option_value); 1540 $sub_item_id = $(child_object).data("id"); 1541 $sub_item_qty = parseInt( $(child_object).html() ) ; 1542 $addon_price = !empty($addon_items[$sub_item_id])? parseFloat($addon_items[$sub_item_id].price) : 0; 1543 $item_total+= ($sub_item_qty*$addon_price); 1544 if($sub_item_qty>0){ 1545 $added.push($subcat_id); 1546 } 1547 } else { 1548 $sub_item_id = $(child_object).val(); 1549 $addon_price = !empty($addon_items[$sub_item_id])? parseFloat($addon_items[$sub_item_id].price) : 0; 1550 $item_total+=$addon_price; 1551 $added.push($subcat_id); 1552 } 1553 }); //loop 1554 } 1555 1556 }); //loop 1557 1558 dump("REQUIRED"); 1559 dump($required_addon); 1560 dump($added); 1561 dump("END REQUIRED"); 1562 1563 var $required_meet=true; 1564 if($required_addon.length>0){ 1565 $.each($required_addon, function(i, val){ 1566 if($added.includes(val)===false){ 1567 $required_meet = false; 1568 return false; 1569 } 1570 }); 1571 } 1572 1573 dump("$required_meet=>"+$required_meet); 1574 1575 if($required_meet==false){ 1576 $(".add_to_cart").attr("disabled",true); 1577 } else $(".add_to_cart").attr("disabled",false); 1578 1579 processAjax('priceFormat','price='+$item_total + "&target=.item-summary",''); 1580 }; 1581 1582 var addToCart = function(){ 1583 $item_size_id = $('input[name="size_uuid"]:checked').val(); 1584 $item_token = $(".item_s").attr("data-item_token"); 1585 $sub_item_id = 0; 1586 $sub_item_qty = 0; 1587 $addon_price = 0; 1588 $addons_category = []; 1589 $addons_items = ''; 1590 var $addon_rows = ''; 1591 1592 $('.list-addon').each(function(index, $obj){ 1593 1594 $addon_multi_option = $($obj).attr("data-multi_option"); 1595 $subcat_id = $($obj).attr("data-subcat_id"); 1596 1597 if($addon_multi_option=="custom" || $addon_multi_option=="one"){ 1598 $addon_child = $($obj).find(".addon-items:checked"); 1599 } else if ( $addon_multi_option=="multiple"){ 1600 $addon_child = $($obj).find(".qty"); 1601 } 1602 1603 /*$addons_category.push({ 1604 'subcat_id':$subcat_id, 1605 'multi_option':$addon_multi_option, 1606 'multi_option_value' : $($obj).data("multi_option_value") 1607 }); */ 1608 1609 var $x = 0; 1610 if ((typeof $addon_child !== "undefined") && ( $addon_child !== null)) { 1611 //$addon_rows = ''; 1612 $addon_child.each(function(child_index, child_object){ 1613 if($addon_multi_option=="multiple"){ 1614 $sub_item_id = $(child_object).attr("data-id"); 1615 $sub_item_qty = parseInt( $(child_object).html() ) ; 1616 $addon_price = !empty($global_addon_items[$sub_item_id])? parseFloat($global_addon_items[$sub_item_id].price) : 0; 1617 } else { 1618 $sub_item_id = $(child_object).val(); 1619 $addon_price = !empty($global_addon_items[$sub_item_id])? parseFloat($global_addon_items[$sub_item_id].price) : 0; 1620 $sub_item_qty = 1; 1621 } 1622 1623 if($sub_item_qty>0){ 1624 $addon_rows+='{"sub_item_id":'+$sub_item_id+', "sub_item_qty":'+$sub_item_qty+'},'; 1625 } 1626 1627 }); // loop 1628 1629 1630 } 1631 1632 if(!empty($addon_rows)){ 1633 $addon_rows = $addon_rows.slice(0, -1); 1634 $addons_items+= '"'+$subcat_id+'":['+$addon_rows+'],'; 1635 $addon_rows = ''; 1636 1637 $addons_category.push({ 1638 'subcat_id':$subcat_id, 1639 'multi_option':$addon_multi_option, 1640 'multi_option_value' : $($obj).attr("data-multi_option_value") 1641 }); 1642 1643 } 1644 1645 }); // loop 1646 1647 $addons_items = $addons_items.slice(0, -1); 1648 $addons_items = '{'+$addons_items+'}'; 1649 $addons_items = JSON.parse( $addons_items ); 1650 dump($addons_items); 1651 1652 var $params = { 1653 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 1654 'item_token':$item_token, 1655 'item_size_id':$item_size_id, 1656 'addons_category':$addons_category, 1657 'addons_items':$addons_items 1658 }; 1659 $params = JSON.stringify($params); 1660 processAjax('addCartItems',$params,'add_to_cart',1,1,'PUT','json'); 1661 }; 1662 1663 1664 var setCookie = function(cname, cvalue, exdays){ 1665 const d = new Date(); 1666 d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); 1667 let expires = "expires="+d.toUTCString(); 1668 document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; 1669 } 1670 1671 var getCookie = function(cname, cvalue, exdays){ 1672 let name = cname + "="; 1673 let ca = document.cookie.split(';'); 1674 for(let i = 0; i < ca.length; i++) { 1675 let c = ca[i]; 1676 while (c.charAt(0) == ' ') { 1677 c = c.substring(1); 1678 } 1679 if (c.indexOf(name) == 0) { 1680 return c.substring(name.length, c.length); 1681 } 1682 } 1683 return ""; 1684 } 1685 1686 /* 1687 VUE STARTS HERE 1688 */ 1689 1690 /* 1691 =============================================================================== 1692 START COMPONENTS HERE 1693 =============================================================================== 1694 */ 1695 1696 const loadingBox = { 1697 props: ['message','donnot_close'], 1698 data(){ 1699 return { 1700 new_message : '' 1701 } 1702 }, 1703 methods :{ 1704 show(){ 1705 $('#loadingBox').modal('show'); 1706 }, 1707 close(){ 1708 $('#loadingBox').modal('hide'); 1709 }, 1710 setMessage(new_message){ 1711 this.new_message = new_message; 1712 }, 1713 }, 1714 template:` 1715 <div class="modal" id="loadingBox" tabindex="-1" role="dialog" aria-labelledby="loadingBox" aria-hidden="true" 1716 data-backdrop="static" data-keyboard="false" 1717 >
1718 <div class="modal-dialog modal-dialog-centered modal-loadingbox" role="document"> 1719 <div class="modal-content"> 1720 <div class="modal-body"> 1721 <div class="loading mt-2"> 1722 <div class="m-auto circle-loader medium" data-loader="circle-side"></div> 1723 </div> 1724 <p class="text-center mt-2"> 1725 <div v-if="!new_message">{{message}}</div> 1726 <div v-if="new_message">{{new_message}}</div> 1727 <div>{{donnot_close}}</div> 1728 </p> 1729 </div> 1730 </div> <!--content--> 1731 </div> <!--dialog--> 1732 </div> <!--modal--> 1733 ` 1734 }; 1735 1736 /* 1737 COMPONENTS SEARCH 1738 */ 1739 const ComponentsSearch = { 1740 props: ['title','label','next_url','auto_generate_uuid','enabled_auto_detect_address'], 1741 components : { 1742 'loading-box' : loadingBox 1743 }, 1744 data(){ 1745 return { 1746 q: '', 1747 awaitingSearch : false, 1748 show_list : false, 1749 data : [], 1750 error : [], 1751 autosaved_addres : true, 1752 }; 1753 }, 1754 created() { 1755 if(this.enabled_auto_detect_address){ 1756 this.detectLocation(); 1757 } 1758 }, 1759 watch: { 1760 q(newsearch,oldsearch){ 1761 if (!this.awaitingSearch) { 1762 1763 if(empty(newsearch)){ 1764 return false; 1765 } 1766 1767 this.show_list = true; 1768 1769 setTimeout(() => { 1770 1771 var $params; var timenow = 2; 1772 $params="q=" + this.q; 1773 $params+=addValidationRequest(); 1774 ajax_request[timenow] = $.ajax({ 1775 url: ajaxurl+"/getlocation_autocomplete", 1776 method: "POST", 1777 dataType: "json", 1778 data: $params, 1779 contentType : $content_type.form , 1780 timeout: $timeout, 1781 crossDomain: true, 1782 beforeSend: data => { 1783 if(ajax_request[timenow] != null) { 1784 ajax_request[timenow].abort(); 1785 } 1786 } 1787 }); 1788 1789 ajax_request[timenow].done( data => { 1790 if ( data.code==1){ 1791 this.data = data.details.data; 1792 } else { 1793 this.data = []; 1794 } 1795 }); // ajax done 1796 1797 ajax_request[timenow].always( data => { 1798 this.awaitingSearch = false; 1799 }); 1800 1801 }, 1000); // 1 sec delay 1802 } 1803 1804 this.data = []; 1805 this.awaitingSearch = true; 1806 }, 1807 }, 1808 methods: { 1809 detectLocation(){ 1810 if (navigator.geolocation) { 1811 navigator.geolocation.getCurrentPosition( 1812 (data) => { 1813 this.reverseGeocoding(data.coords.latitude,data.coords.longitude); 1814 }, 1815 (error) => { 1816 ElementPlus.ElNotification({ 1817 title: "", 1818 message: error.message, 1819 position: 'bottom-right', 1820 type: 'warning', 1821 }); 1822 } 1823 ); 1824 } else { 1825 // 1826 } 1827 }, 1828 reverseGeocoding(lat,lng){ 1829 axios({ 1830 method: 'POST', 1831 url: ajaxurl+"/reverseGeocoding" , 1832 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&lat=" + lat + "&lng=" + lng, 1833 timeout: $timeout, 1834 }).then( response => { 1835 if(response.data.code==1){ 1836 let $auto_address = { 1837 id : response.data.details.data.place_id, 1838 country : response.data.details.data.address.country, 1839 country_code : response.data.details.data.address.country_code 1840 }; 1841 1842 let $some_words = JSON.parse(some_words); 1843 let $we_detected = $some_words.we_detected; 1844 $we_detected = $we_detected.replace("{address}", response.data.details.data.address.formatted_address); 1845 1846 ElementPlus.ElMessageBox.confirm( 1847 $we_detected, 1848 $some_words.address_detected, 1849 { 1850 confirmButtonText: $some_words.yes, 1851 cancelButtonText: $some_words.no, 1852 type: 'info', 1853 } 1854 ) 1855 .then(() => { 1856 this.getLocationDetails($auto_address); 1857 }) 1858 .catch(() => { 1859 // 1860 }); 1861 1862 } 1863 }).catch(error => { 1864 // 1865 }).then(data => { 1866 // 1867 }); 1868 }, 1869 showList(){ 1870 this.show_list = true; 1871 }, 1872 clearData(){ 1873 this.data = []; 1874 this.q = ''; 1875 }, 1876 getLocationDetails(items){ 1877 1878 this.show_list = false; 1879 var $params; var timenow = 3; 1880 $params="id=" + items.id; 1881 $params+="&country=" + items.country; 1882 $params+="&country_code=" + items.country_code; 1883 $params+="&description=" + items.description; 1884 $params+="&autosaved_addres=" + this.autosaved_addres; 1885 $params+="&auto_generate_uuid=" + this.auto_generate_uuid; 1886 $params+="&cart_uuid=" + getCookie('cart_uuid'); 1887 1888 $params+=addValidationRequest(); 1889 ajax_request[timenow] = $.ajax({
1890 url: ajaxurl+"/getLocationDetails", 1891 method: "POST", 1892 dataType: "json", 1893 data: $params, 1894 contentType : $content_type.form , 1895 timeout: $timeout, 1896 crossDomain: true, 1897 beforeSend: data => { 1898 this.awaitingSearch = true; 1899 if(ajax_request[timenow] != null) { 1900 ajax_request[timenow].abort(); 1901 } 1902 } 1903 }); 1904 1905 ajax_request[timenow].done( data => { 1906 if ( data.code==1){ 1907 this.q = data.details.data.address.formatted_address; 1908 if(this.auto_generate_uuid==true || this.auto_generate_uuid=="true"){ 1909 setCookie('cart_uuid',data.details.cart_uuid,30); 1910 } 1911 window.location.href = this.next_url; 1912 } else { 1913 this.error[0] = data.msg; 1914 } 1915 }); // ajax done 1916 1917 ajax_request[timenow].always( data => { 1918 this.awaitingSearch = false; 1919 }); 1920 1921 }, 1922 }, 1923 computed: { 1924 hasData(){ 1925 if(this.data.length>0){ 1926 return true; 1927 } 1928 return false; 1929 }, 1930 }, 1931 template: ` 1932 <loading-box ref="loading_box" message="Getting address" donnot_close="do not close this window" ></loading-box> 1933 <div class="position-relative search-geocomplete"> 1934 <div v-if="!awaitingSearch" class="img-20 m-auto pin_placeholder icon"></div> 1935 <div v-if="awaitingSearch" class="icon" data-loader="circle"></div> 1936 1937 <input @click="showList" v-model="q" class="form-control form-control-text" 1938 :placeholder="label.enter_address" > 1939 1940 <div v-if="hasData" @click="clearData" class="icon-remove"><i class="zmdi zmdi-close"></i></div> 1941 <div v-if="!hasData" class="search_placeholder pos-right img-20"></div> 1942 </div> 1943 1944 <div class="search-geocomplete-results" v-if="show_list"> 1945 <ul class="list-unstyled m-0 border"> 1946 <li v-for="items in data"> 1947 <a href="javascript:;" @click="getLocationDetails(items)" > 1948 <h6 class="m-0">{{items.addressLine1}}</h6> 1949 <p class="m-0 text-grey">{{items.addressLine2}}</p> 1950 </a> 1951 </li> 1952 </ul> 1953 </div> 1954 ` 1955 }; 1956 /*END COMPONENTS SEARCH*/ 1957 1958 1959 /* 1960 COMPONENTS CHANGE ADDRESS 1961 */ 1962 const changeAddressComponent = { 1963 props: ['label','addresses','location_data','saveplace'], 1964 data(){ 1965 return { 1966 q: '', 1967 awaitingSearch : false, 1968 show_list : false, 1969 data : [], 1970 error : [], 1971 autosaved_addres : true, 1972 is_fullwidth : false, 1973 visible : false 1974 }; 1975 }, 1976 mounted() { 1977 if ((typeof is_mobile !== "undefined") && ( is_mobile !== null)) { 1978 if(is_mobile){ 1979 this.is_fullwidth = true; 1980 } 1981 } 1982 }, 1983 computed: { 1984 hasAddress(){ 1985 if(!empty(this.addresses)){ 1986 if (Object.keys(this.addresses).length > 0) { 1987 return true; 1988 } 1989 } 1990 return false; 1991 }, 1992 hasData(){ 1993 if(this.data.length>0){ 1994 return true; 1995 } 1996 return false; 1997 }, 1998 }, 1999 methods: { 2000 showList(){ 2001 this.show_list = true; 2002 }, 2003 clearData(){ 2004 this.data = []; 2005 this.q = ''; 2006 }, 2007 showModal(){ 2008 //$( this.$refs.change_address_modal ).modal('show'); 2009 this.visible = true; 2010 }, 2011 closeModal(){ 2012 //$( this.$refs.change_address_modal ).modal('hide'); 2013 this.visible = false; 2014 this.$emit('afterClose'); 2015 }, 2016 close(){ 2017 //$( this.$refs.change_address_modal ).modal('hide'); 2018 this.visible = false; 2019 }, 2020 getLocationDetails(items){ 2021 2022 this.show_list = false; 2023 var $params; var timenow = 3; 2024 $params="id=" + items.id; 2025 $params+="&country=" + items.country; 2026 $params+="&country_code=" + items.country_code; 2027 $params+="&autosaved_addres=" + this.autosaved_addres; 2028 $params+="&saveplace=" + this.saveplace; 2029 $params+="&description=" + items.description; 2030 2031 $params+=addValidationRequest(); 2032 ajax_request[timenow] = $.ajax({ 2033 url: ajaxurl+"/getLocationDetails", 2034 method: "POST", 2035 dataType: "json", 2036 data: $params, 2037 contentType : $content_type.form , 2038 timeout: $timeout, 2039 crossDomain: true, 2040 beforeSend: data => { 2041 this.awaitingSearch = true; 2042 if(ajax_request[timenow] != null) { 2043 ajax_request[timenow].abort(); 2044 } 2045 } 2046 }); 2047 2048 ajax_request[timenow].done( data => { 2049 if ( data.code==1){ 2050 this.q=''; 2051 this.closeModal(); 2052 this.$emit('setLocation',data.details.data); 2053 } else { 2054 this.error[0] = data.msg; 2055 } 2056 }); // ajax done 2057 2058 ajax_request[timenow].always( data => { 2059 this.awaitingSearch = false;
2060 }); 2061 2062 }, 2063 setPlaceID(place_id){ 2064 var $params; var timenow = 4; 2065 $params="place_id=" + place_id; 2066 $params+=addValidationRequest(); 2067 ajax_request[timenow] = $.ajax({ 2068 url: ajaxurl+"/setPlaceID", 2069 method: "POST", 2070 dataType: "json", 2071 data: $params, 2072 contentType : $content_type.form , 2073 timeout: $timeout, 2074 crossDomain: true, 2075 beforeSend: data => { 2076 if(ajax_request[timenow] != null) { 2077 ajax_request[timenow].abort(); 2078 } 2079 } 2080 }); 2081 2082 ajax_request[timenow].done( data => { 2083 if ( data.code==1){ 2084 this.$emit('setPlaceid'); 2085 } else { 2086 this.error[0] = data.msg; 2087 } 2088 }); // ajax done 2089 2090 ajax_request[timenow].always( data => { 2091 }); 2092 2093 }, 2094 editAddress(address_data){ 2095 //this.$emit('setLocation',address_data); 2096 this.$emit('setEdit',address_data); 2097 }, 2098 deleteAddress(address_uuid){ 2099 2100 var $params; var timenow = 5; 2101 $params="address_uuid=" + address_uuid; 2102 $params+=addValidationRequest(); 2103 ajax_request[timenow] = $.ajax({ 2104 url: ajaxurl+"/deleteAddress", 2105 method: "POST", 2106 dataType: "json", 2107 data: $params, 2108 contentType : $content_type.form , 2109 timeout: $timeout, 2110 crossDomain: true, 2111 beforeSend: data => { 2112 if(ajax_request[timenow] != null) { 2113 ajax_request[timenow].abort(); 2114 } 2115 } 2116 }); 2117 2118 ajax_request[timenow].done( data => { 2119 if ( data.code==1){ 2120 this.$emit('loadData'); 2121 this.$emit('afterDelete',data); 2122 } else { 2123 this.error[0] = data.msg; 2124 } 2125 }); // ajax done 2126 2127 ajax_request[timenow].always( data => { 2128 }); 2129 2130 }, 2131 locateLocation(){ 2132 this.awaitingSearch = true; 2133 if (navigator.geolocation) { 2134 navigator.geolocation.getCurrentPosition( 2135 (data) => { 2136 this.reverseGeocoding(data.coords.latitude,data.coords.longitude); 2137 }, 2138 (error) => { 2139 this.awaitingSearch = false; 2140 ElementPlus.ElNotification({ 2141 title: "", 2142 message: error.message, 2143 position: 'bottom-right', 2144 type: 'warning', 2145 }); 2146 } 2147 ); 2148 } else { 2149 this.awaitingSearch = false; 2150 ElementPlus.ElNotification({ 2151 title: "", 2152 message: "Your browser doesn't support geolocation.", 2153 position: 'bottom-right', 2154 type: 'warning', 2155 }); 2156 } 2157 }, 2158 reverseGeocoding(lat,lng){ 2159 axios({ 2160 method: 'POST', 2161 url: ajaxurl+"/reverseGeocoding" , 2162 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&lat="+ lat+ "&lng="+lng, 2163 timeout: $timeout, 2164 }).then( response => { 2165 if(response.data.code==1){ 2166 let data_items = []; 2167 data_items.id = response.data.details.data.place_id; 2168 data_items.country = response.data.details.data.address.country; 2169 data_items.country_code = response.data.details.data.address.country_code; 2170 this.getLocationDetails(data_items); 2171 } else { 2172 ElementPlus.ElNotification({ 2173 title: "", 2174 message: response.data.msg, 2175 position: 'bottom-right', 2176 type: 'warning', 2177 }); 2178 } 2179 }).catch(error => { 2180 // 2181 }).then(data => { 2182 this.awaitingSearch = false; 2183 }); 2184 }, 2185 searchLocation(queryString,cb){ 2186 let data = []; 2187 axios({ 2188 method: 'POST', 2189 url: ajaxurl+"/getlocationAutocomplete" , 2190 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content')+"&q="+queryString, 2191 timeout: $timeout, 2192 }).then( response => { 2193 if(response.data.code==1){ 2194 data = response.data.details.data; 2195 } else { 2196 data = [] 2197 } 2198 cb(data); 2199 }).catch(error => { 2200 // 2201 }).then(data => { 2202 }); 2203 }, 2204 // 2205 }, 2206 template: ` 2207 <el-dialog v-model="visible" :close-on-click-modal="false" :show-close="true" :title="label.title" > 2208 2209 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 2210 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 2211 </div> 2212 2213 <div class="position-relative search-geocomplete" v-loading="awaitingSearch" > 2214 <el-autocomplete 2215 v-model="q" 2216 :placeholder="label.enter_address" 2217 size="large" 2218 class="w-100" 2219 :trigger-on-focus="false" 2220 value-key="description" 2221 :fit-input-width="is_fullwidth" 2222 clearable 2223 :fetch-suggestions="searchLocation"
2224 @select="getLocationDetails" 2225 > 2226 <template #suffix> 2227 <button @click="locateLocation" type="button" class="btn btn-link"> 2228 <i class="zmdi zmdi-my-location font20" style="color:#000;"></i> 2229 </button> 2230 </template> 2231 </el-autocomplete> 2232 </div> 2233 2234 <template v-if="hasAddress"> 2235 <div class="p-2"></div> 2236 <el-scrollbar max-height="200px" class="w-100"> 2237 <ul class="m-0 list-unstyled w-100 list-with-icon-button" > 2238 <li v-for="valadd in addresses" class="row align-items-center no-gutters" > 2239 2240 <div class="col-1" @click="setPlaceID(valadd.place_id)" ><i class="zmdi zmdi-pin icon-25"></i></div> 2241 <div class="col-9" @click="setPlaceID(valadd.place_id)" > 2242 <h5 class="m-0">{{valadd.address.formatted_address_pretty}}</h5> 2243 </div> 2244 2245 <div class="col-2 "> 2246 <div class="float-right"> 2247 <a href="javascript:;" @click="editAddress(valadd)" class="rounded-pill rounded-button-icon d-inline-block mr-2"> 2248 <i class="zmdi zmdi-edit"></i> 2249 </a> 2250 2251 <a href="javascript:;" v-if="location_data.address_uuid != valadd.address_uuid " @click="deleteAddress(valadd.address_uuid)" 2252 class="rounded-pill rounded-button-icon d-inline-block"> 2253 <i class="zmdi zmdi-close"></i> 2254 </a> 2255 2256 </div> 2257 </div> 2258 </li> 2259 </ul> 2260 </el-scrollbar> 2261 </template> 2262 2263 </el-dialog> 2264 ` 2265 }; 2266 2267 /* 2268 END COMPONENTS CHANGE ADDRESS 2269 */ 2270 2271 2272 /* 2273 COMPONENTS ADDRESS FORM 2274 */ 2275 const ComponentsAddress = { 2276 props: ['label','set_place_id','cmaps_config'], 2277 data(){ 2278 return { 2279 data:[], 2280 is_loading : false, 2281 error:[], 2282 cmaps : undefined, 2283 cmaps_full : false, 2284 //cmaps_config : [], 2285 location_name : '', 2286 delivery_options : '', 2287 address_label : '', 2288 delivery_instructions : '', 2289 delivery_options_data : [], 2290 address_label_data : [], 2291 address1 : '', 2292 formatted_address : '', 2293 new_coordinates : [], 2294 inline_edit : false, 2295 address2 : '', 2296 postal_code :'', 2297 company : '', 2298 street: '', 2299 house_number: '', 2300 city: '' 2301 }; 2302 }, 2303 mounted() { 2304 autosize( document.getElementById("delivery_instructions") ); 2305 this.getAddressAttributes(); 2306 }, 2307 computed: { 2308 DataValid(){ 2309 if(Object.keys(this.data).length>0){ 2310 return true; 2311 } 2312 return false; 2313 }, 2314 DataValidNew(){ 2315 if(Object.keys(this.new_coordinates).length>0){ 2316 return true; 2317 } 2318 return false; 2319 }, 2320 }, 2321 methods :{ 2322 show( address_uuid ){ 2323 this.cmaps_full = false; 2324 this.getAdddress( address_uuid ); 2325 $( this.$refs.modal_address ).modal('show'); 2326 }, 2327 clearForms(){ 2328 this.data = []; 2329 this.location_name = ''; 2330 this.delivery_options =''; 2331 this.address_label = ''; 2332 this.delivery_instructions = ''; 2333 this.address1 = ''; 2334 this.formatted_address = ''; 2335 this.address2 = ''; 2336 this.postal_code = ''; 2337 this.company = ''; 2338 this.street = ''; 2339 this.house_number = ''; 2340 this.city = ''; 2341 }, 2342 showWithData(data){ 2343 this.clearForms(); 2344 $( this.$refs.modal_address ).modal('show'); 2345 2346 this.data = data; 2347 this.address1 = data.address.address1; 2348 this.formatted_address = data.address.formatted_address; 2349 2350 if ((typeof data.parsed_address !== "undefined") && ( data.parsed_address !== null)) { 2351 this.street = data.parsed_address.street_name; 2352 this.house_number = data.parsed_address.street_number; 2353 this.postal_code = data.parsed_address.postal_code; 2354 this.city = data.parsed_address.city; 2355 } 2356 this.loadMap(); 2357 }, 2358 close(){ 2359 //$('#ModalAddress').modal('hide'); 2360 $( this.$refs.modal_address ).modal('hide'); 2361 }, 2362 closeModal(){ 2363 //$('#ModalAddress').modal('hide'); 2364 $( this.$refs.modal_address ).modal('hide'); 2365 this.$emit('afterClose'); 2366 }, 2367 getAddressAttributes(){ 2368 2369 var $params = { 2370 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 2371 }; 2372 var timenow = getTimeNow(); 2373 $params = JSON.stringify($params); 2374 2375 ajax_request[timenow] = $.ajax({ 2376 url: ajaxurl+"/getAddressAttributes", 2377 method: "PUT", 2378 dataType: "json", 2379 data: $params , 2380 contentType : $content_type.json , 2381 timeout: $timeout, 2382 crossDomain: true, 2383 beforeSend: data => { 2384 this.is_loading = true; 2385 if(ajax_request[timenow] != null) { 2386 ajax_request[timenow].abort(); 2387 } 2388 } 2389 }); 2390 2391 ajax_request[timenow].done( data => { 2392 if ( data.code==1){ 2393 this.delivery_options_data = data.details.delivery_option; 2394 this.address_label_data = data.details.address_label; 2395 this.delivery_options = data.details.default_atts.delivery_options; 2396 this.address_label = data.details.default_atts.address_label; 2397 //this.cmaps_config = data.details.maps_config; 2398 } else { 2399 this.delivery_options_data = []; 2400 this.address_label_data = []; 2401 this.delivery_options = ''; 2402 this.address_label = ''; 2403 } 2404 }); 2405 2406 ajax_request[timenow].always( data => { 2407 this.is_loading = false;
2408 }); 2409 2410 }, 2411 getAdddress(address_uuid){ 2412 2413 var $params = { 2414 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 2415 'address_uuid': address_uuid, 2416 }; 2417 var timenow = getTimeNow(); 2418 $params = JSON.stringify($params); 2419 2420 ajax_request[timenow] = $.ajax({ 2421 url: ajaxurl+"/getAdddress", 2422 method: "PUT", 2423 dataType: "json", 2424 data: $params , 2425 contentType : $content_type.json , 2426 timeout: $timeout, 2427 crossDomain: true, 2428 beforeSend: data => { 2429 this.is_loading = true; 2430 if(ajax_request[timenow] != null) { 2431 ajax_request[timenow].abort(); 2432 } 2433 } 2434 }); 2435 2436 ajax_request[timenow].done( data => { 2437 if ( data.code==1){ 2438 this.data = data.details.data; 2439 this.location_name = data.details.data.attributes.location_name; 2440 this.delivery_options = data.details.data.attributes.delivery_options; 2441 this.address_label = data.details.data.attributes.address_label; 2442 this.delivery_instructions = data.details.data.attributes.delivery_instructions; 2443 this.address1 = data.details.data.address.address1; 2444 this.formatted_address = data.details.data.address.formatted_address; 2445 2446 this.address2 = data.details.data.address.address2; 2447 this.postal_code = data.details.data.address.postal_code; 2448 this.company = data.details.data.address.company; 2449 2450 this.street = data.details.data.address.street; 2451 this.house_number = data.details.data.address.house_number; 2452 this.city = data.details.data.address.city; 2453 2454 this.loadMap(); 2455 } else { 2456 this.clearForms(); 2457 } 2458 }); 2459 2460 ajax_request[timenow].always( data => { 2461 this.is_loading = false; 2462 }); 2463 }, 2464 loadMap(){ 2465 this.renderMap(); 2466 }, 2467 renderMap(){ 2468 switch(this.cmaps_config.provider){ 2469 case "google.maps": 2470 if ((typeof this.cmaps !== "undefined") && ( this.cmaps !== null)) { 2471 this.removeMarker(); 2472 } else { 2473 dump('render map here'); 2474 this.cmaps = new google.maps.Map( this.$refs.cmaps , { 2475 center: { lat: parseFloat(this.data.latitude), lng: parseFloat(this.data.longitude) }, 2476 zoom: parseInt(this.cmaps_config.zoom) , 2477 disableDefaultUI: true, 2478 }); 2479 } 2480 2481 this.addMarker({ 2482 position: { lat: parseFloat(this.data.latitude) , lng: parseFloat(this.data.longitude) }, 2483 map: this.cmaps, 2484 icon : this.cmaps_config.icon, 2485 animation: google.maps.Animation.DROP, 2486 }); 2487 break; 2488 2489 case "mapbox": 2490 mapboxgl.accessToken = this.cmaps_config.key; 2491 this.cmaps = new mapboxgl.Map({ 2492 container: this.$refs.cmaps , 2493 style: 'mapbox://styles/mapbox/streets-v12', 2494 center: [ parseFloat(this.data.longitude) , parseFloat(this.data.latitude)], 2495 zoom: 14 2496 }); 2497 this.addMarker({ 2498 position: { lat: parseFloat(this.data.latitude) , lng: parseFloat(this.data.longitude) }, 2499 map: this.cmaps, 2500 icon : this.cmaps_config.icon, 2501 animation: null 2502 }); 2503 break; 2504 2505 case "yandex": 2506 this.initYandexAddress(); 2507 break; 2508 } 2509 }, 2510 async initYandexAddress(){ 2511 console.debug("initYandexAddress"); 2512 await ymaps3.ready; 2513 const {YMap, YMapDefaultSchemeLayer,YMapMarker,YMapDefaultFeaturesLayer,YMapListener,YMapControls } = ymaps3; 2514 const {YMapDefaultMarker} = await ymaps3.import('@yandex/[email protected]'); 2515 const {YMapZoomControl,YMapGeolocationControl} = await ymaps3.import('@yandex/[email protected]'); 2516 2517 const LOCATION = { 2518 center: [ parseFloat(this.data.longitude), parseFloat(this.data.latitude) ], 2519 zoom: yandex_zoom 2520 }; 2521 2522 if(yandex_map){ 2523 yandex_map.destroy(); 2524 yandex_map = null; 2525 } 2526 2527 if (!yandex_map) { 2528 yandex_map = new YMap( 2529 this.$refs.cmaps, 2530 { 2531 location: LOCATION, 2532 showScaleInCopyrights: false, 2533 behaviors: ['drag','scrollZoom'] 2534 }, 2535 [ 2536 new YMapDefaultSchemeLayer({}), 2537 new YMapDefaultFeaturesLayer({}) 2538 ] 2539 ); 2540 2541 cmaps_marker = new YMapDefaultMarker({ 2542 coordinates: LOCATION.center, 2543 }); 2544 yandex_map.addChild(cmaps_marker); 2545 } 2546 }, 2547 addMarker(properties){ 2548 switch(this.cmaps_config.provider){ 2549 case "google.maps": 2550 cmaps_marker = new google.maps.Marker(properties); 2551 this.cmaps.panTo(new google.maps.LatLng(properties.position.lat,properties.position.lng)); 2552 break; 2553 case "mapbox": 2554 let markerProperties = {}; 2555 if(properties.draggable){ 2556 markerProperties = {draggable: true}; 2557 } 2558 cmaps_marker = new mapboxgl.Marker(markerProperties) 2559 .setLngLat([properties.position.lng, properties.position.lat]) 2560 .addTo(this.cmaps); 2561 break; 2562 } 2563 }, 2564 removeMarker(){ 2565 switch(this.cmaps_config.provider){ 2566 case "google.maps": 2567 cmaps_marker.setMap(null); 2568 break; 2569 case "mapbox": 2570 dump("remove marker"); 2571 cmaps_marker.remove(); 2572 break; 2573 } 2574 },
2575 adjustPin(){ 2576 console.debug("adjustPin"); 2577 this.new_coordinates = []; 2578 this.cmaps_full = true; 2579 try { 2580 this.removeMarker(); 2581 } catch(err) { 2582 dump(err); 2583 } 2584 2585 this.addMarker({ 2586 position: { lat: parseFloat(this.data.latitude) , lng: parseFloat(this.data.longitude) }, 2587 map: this.cmaps, 2588 icon : this.cmaps_config.icon, 2589 animation: this.cmaps_config.provider=="google.maps" ? google.maps.Animation.DROP : null, 2590 draggable:true, 2591 }); 2592 2593 if(this.cmaps_config.provider=="google.maps"){ 2594 cmaps_marker.addListener('dragend', event => { 2595 this.new_coordinates = { 2596 'lat': event.latLng.lat(), 2597 'lng': event.latLng.lng(), 2598 }; 2599 }); 2600 } else if ( this.cmaps_config.provider=="mapbox" ) { 2601 cmaps_marker.on('dragend', (event)=>{ 2602 const lngLat = cmaps_marker.getLngLat(); 2603 this.new_coordinates = { 2604 'lat': lngLat.lat, 2605 'lng': lngLat.lng, 2606 }; 2607 }); 2608 this.mapBoxResize(); 2609 } else if ( this.cmaps_config.provider=="yandex" ) { 2610 const LOCATION = { 2611 center: [ parseFloat(this.data.longitude), parseFloat(this.data.latitude) ], 2612 zoom: yandex_zoom 2613 }; 2614 cmaps_marker.update({ 2615 coordinates : LOCATION.center, 2616 draggable: true, 2617 onDragEnd: (coordinates)=>{ 2618 this.new_coordinates = { 2619 'lat': coordinates[1], 2620 'lng': coordinates[0], 2621 }; 2622 } 2623 }); 2624 } 2625 2626 }, 2627 mapBoxResize(){ 2628 if(this.cmaps_config.provider=="mapbox"){ 2629 setTimeout(()=>{ 2630 this.cmaps.resize(); 2631 }, 500); 2632 } 2633 }, 2634 cancelPin(){ 2635 this.error = []; 2636 this.cmaps_full=false; 2637 2638 if(this.cmaps_config.provider=="yandex"){ 2639 const LOCATION = { 2640 center: [ parseFloat(this.data.longitude), parseFloat(this.data.latitude) ], 2641 zoom: yandex_zoom 2642 }; 2643 cmaps_marker.update({ 2644 coordinates : LOCATION.center, 2645 draggable: false 2646 }); 2647 } else { 2648 this.removeMarker(); 2649 this.addMarker({ 2650 position: { lat: parseFloat(this.data.latitude) , lng: parseFloat(this.data.longitude) }, 2651 map: this.cmaps, 2652 icon : this.cmaps_config.icon, 2653 animation: this.cmaps_config.provider=="google.maps" ? google.maps.Animation.DROP : null, 2654 }); 2655 this.mapBoxResize(); 2656 } 2657 }, 2658 setNewCoordinates(){ 2659 2660 var $params = { 2661 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 2662 'lat' : this.data.latitude, 2663 'lng' : this.data.longitude, 2664 'new_lat' : this.new_coordinates.lat, 2665 'new_lng' : this.new_coordinates.lng, 2666 }; 2667 2668 var timenow = 1; 2669 $params = JSON.stringify($params); 2670 2671 ajax_request[timenow] = $.ajax({ 2672 url: ajaxurl+"/checkoutValidateCoordinates", 2673 method: "PUT", 2674 dataType: "json", 2675 data: $params , 2676 contentType : $content_type.json , 2677 timeout: $timeout, 2678 crossDomain: true, 2679 beforeSend: data => { 2680 this.is_loading = true; 2681 this.error = []; 2682 if(ajax_request[timenow] != null) { 2683 ajax_request[timenow].abort(); 2684 } 2685 } 2686 }); 2687 2688 ajax_request[timenow].done( data => { 2689 if ( data.code==1){ 2690 this.data.latitude = this.new_coordinates.lat; 2691 this.data.longitude = this.new_coordinates.lng; 2692 this.cmaps_full=false; 2693 2694 if(this.cmaps_config.provider=="yandex"){ 2695 } else { 2696 this.removeMarker(); 2697 this.addMarker({ 2698 position: { lat: parseFloat(this.data.latitude) , lng: parseFloat(this.data.longitude) }, 2699 map: this.cmaps, 2700 icon : this.cmaps_config.icon, 2701 animation: google.maps.Animation.DROP, 2702 }); 2703 } 2704 } else { 2705 this.error = data.msg; 2706 setTimeout(function() { 2707 location.href = "#error_message"; 2708 }, 1); 2709 } 2710 }); 2711 2712 ajax_request[timenow].always( data => { 2713 this.is_loading = false;
2714 }); 2715 }, 2716 save(){ 2717 2718 var $params = { 2719 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 2720 'address_uuid': this.data.address_uuid, 2721 'location_name' : this.location_name, 2722 'delivery_instructions' : this.delivery_instructions, 2723 'delivery_options' : this.delivery_options, 2724 'address_label' : this.address_label, 2725 'latitude' : this.data.latitude, 2726 'longitude' : this.data.longitude, 2727 'address1' : this.address1, 2728 'formatted_address' : this.formatted_address, 2729 'set_place_id' : this.set_place_id, 2730 'address2' : this.address2, 2731 'postal_code' : this.postal_code, 2732 'company' : this.company, 2733 'data': this.data, 2734 'address_format_use': this.cmaps_config.address_format_use, 2735 'street': this.street, 2736 'house_number': this.house_number, 2737 'city': this.city 2738 }; 2739 2740 var timenow = 1; 2741 $params = JSON.stringify($params); 2742 2743 ajax_request[timenow] = $.ajax({ 2744 url: ajaxurl+"/SaveAddress", 2745 method: "PUT", 2746 dataType: "json", 2747 data: $params , 2748 contentType : $content_type.json , 2749 timeout: $timeout, 2750 crossDomain: true, 2751 beforeSend: data => { 2752 this.is_loading = true; 2753 this.error = [] ; 2754 if(ajax_request[timenow] != null) { 2755 ajax_request[timenow].abort(); 2756 } 2757 } 2758 }); 2759 2760 ajax_request[timenow].done( data => { 2761 if ( data.code==1){ 2762 this.close(); 2763 this.$emit('afterSave',true); 2764 } else { 2765 this.error = data.msg; 2766 setTimeout(function() { 2767 location.href = "#error_message"; 2768 }, 1); 2769 } 2770 }); 2771 2772 ajax_request[timenow].always( data => { 2773 this.is_loading = false; 2774 }); 2775 2776 }, 2777 ConfirmDelete(address_uuid){ 2778 vm_bootbox.confirm().then((result) => { 2779 if(result){ 2780 this.deleteAddress(address_uuid); 2781 } 2782 }); 2783 }, 2784 deleteAddress(address_uuid){ 2785 var $params; var timenow = 5; 2786 $params="address_uuid=" + address_uuid; 2787 $params+=addValidationRequest(); 2788 ajax_request[timenow] = $.ajax({ 2789 url: ajaxurl+"/deleteAddress", 2790 method: "POST", 2791 dataType: "json", 2792 data: $params, 2793 contentType : $content_type.form , 2794 timeout: $timeout, 2795 crossDomain: true, 2796 beforeSend: data => { 2797 if(ajax_request[timenow] != null) { 2798 ajax_request[timenow].abort(); 2799 } 2800 } 2801 }); 2802 2803 ajax_request[timenow].done( data => { 2804 if ( data.code==1){ 2805 this.close(); 2806 this.$emit('afterDelete',true); 2807 } else { 2808 this.error[0] = data.msg; 2809 } 2810 }); // ajax done 2811 2812 ajax_request[timenow].always( data => { 2813 }); 2814 }, 2815 }, 2816 template: ` 2817 <div class="modal" ref="modal_address" id="ModalAddress" tabindex="-1" role="dialog" 2818 aria-labelledby="ModalAddress" aria-hidden="true" data-backdrop="static" data-keyboard="false" > 2819 <div class="modal-dialog modal-lg" role="document"> 2820 <div class="modal-content"> 2821 2822 <div class="modal-header border-bottom-0" style="padding-bottom:0px !important;"> 2823 <h5 class="modal-title">{{label.title}}</h5> 2824 <a href="javascript:;" @click="closeModal" class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 2825 </div> 2826 2827 <div class="modal-body"> 2828 2829 <template v-if="cmaps_config.provider=='mapbox'"> 2830 <div :class="{ 'map-large': cmaps_full, 'map-small': !cmaps_full }" > 2831 <div ref="cmaps" id="cmaps" style="height:100%; width:100%;"></div> 2832 </div> 2833 </template> 2834 <template v-else> 2835 <div ref="cmaps" id="cmaps" :class="{ 'map-large': cmaps_full, 'map-small': !cmaps_full }"></div> 2836 </template> 2837 2838 <template v-if="!cmaps_full"> 2839 2840 <div class="row mt-3" > 2841 <div class="col"> 2842 <h5 class="m-0">{{address1}}</h5> 2843 <p class="m-0">{{formatted_address}}</p> 2844 </div> 2845 <div class="col text-right">
2846 <button class="btn small btn-black" @click="adjustPin" :disabled="!DataValid" >{{label.adjust_pin}}</button> 2847 </div> 2848 </div> 2849 <!--row--> 2850 2851 <div class="forms mt-3 mb-2"> 2852 2853 <template v-if="cmaps_config.address_format_use==2"> 2854 <!--<div class="row"> 2855 <div class="col"> 2856 <div class="form-label-group"> 2857 <input v-model="formatted_address" class="form-control form-control-text" placeholder="" id="formatted_address" type="text"> 2858 <label for="formatted_address"> 2859 {{label.street_name}} ({{label.mandatory}}) 2860 </label> 2861 </div> 2862 </div> 2863 <div class="col"> 2864 <div class="form-label-group"> 2865 <input v-model="address1" class="form-control form-control-text" placeholder="" id="address1" type="text"> 2866 <label for="address1"> 2867 {{label.street_number}} ({{label.mandatory}}) 2868 </label> 2869 </div> 2870 </div> 2871 </div>--> 2872 2873 <div class="row"> 2874 <div class="col"> 2875 <div class="form-label-group"> 2876 <input v-model="street" class="form-control form-control-text" placeholder="" id="street" type="text"> 2877 <label for="street"> 2878 {{label.street}} ({{label.mandatory}}) 2879 </label> 2880 </div> 2881 </div> 2882 <div class="col"> 2883 <div class="form-label-group"> 2884 <input v-model="house_number" class="form-control form-control-text" placeholder="" id="house_number" type="text"> 2885 <label for="house_number"> 2886 {{label.house_number}} ({{label.mandatory}}) 2887 </label> 2888 </div> 2889 </div> 2890 </div> 2891 2892 <div class="row"> 2893 <div class="col"> 2894 <div class="form-label-group"> 2895 <input v-model="postal_code" class="form-control form-control-text" placeholder="" id="postal_code" type="text"> 2896 <label for="postal_code"> 2897 {{label.postal_code}} ({{label.mandatory}}) 2898 </label> 2899 </div> 2900 </div> 2901 2902 <div class="col"> 2903 <div class="form-label-group"> 2904 <input v-model="city" class="form-control form-control-text" placeholder="" id="city" type="text"> 2905 <label for="city"> 2906 {{label.city}} ({{label.mandatory}}) 2907 </label> 2908 </div> 2909 </div> 2910 </div> 2911 2912 <div class="row"> 2913 <div class="col"> 2914 <div class="form-label-group"> 2915 <input v-model="location_name" class="form-control form-control-text" placeholder="" id="location_name" type="text"> 2916 <label for="location_name"> 2917 {{label.entrance}} 2918 </label> 2919 </div> 2920 </div> 2921 <div class="col"> 2922 <div class="form-label-group"> 2923 <input v-model="company" class="form-control form-control-text" placeholder="" id="company" type="text"> 2924 <label for="company"> 2925 {{label.company}} 2926 </label> 2927 </div> 2928 </div> 2929 2930 <!--<div class="col"> 2931 <div class="form-label-group"> 2932 <input v-model="address2" class="form-control form-control-text" placeholder="" id="address2" type="text"> 2933 <label for="address2"> 2934 {{label.floor}} 2935 </label> 2936 </div> 2937 </div>--> 2938 </div> 2939 </template> 2940 2941 <template v-else> 2942 <div class="form-label-group"> 2943 <input v-model="formatted_address" class="form-control form-control-text" placeholder="" id="formatted_address" type="text"> 2944 <label for="formatted_address"> 2945 {{label.street_name}} 2946 </label> 2947 </div> 2948 2949 <div class="form-label-group"> 2950 <input v-model="address1" class="form-control form-control-text" placeholder="" id="address1" type="text"> 2951 <label for="address1"> 2952 {{label.street_number}} 2953 </label> 2954 </div> 2955 2956 <div class="form-label-group"> 2957 <input class="form-control form-control-text" v-model="location_name" 2958 id="location_name" type="text" > 2959 <label for="location_name">{{label.location_name}}</label> 2960 </div> 2961 </template> 2962 2963 <!--<h5 class="m-0 mt-2 mb-2">{{label.delivery_options}}</h5> 2964 <select class="form-control custom-select" v-model="delivery_options"> 2965 <option v-for="(items, key) in delivery_options_data" :value="key" >{{items}}</option> 2966 </select>--> 2967 2968 <h5 class="m-0 mt-3 mb-2">{{label.delivery_instructions}}</h5> 2969 <div class="form-label-group"> 2970 <textarea id="delivery_instructions" style="max-height:150px;" v-model="delivery_instructions" class="form-control form-control-text font13" :placeholder="label.notes"></textarea> 2971 </div> 2972 2973 <p>{{label.address_label}}</p> 2974 <div class="btn-group btn-group-toggle input-group-small mb-4" > 2975 <label class="btn" v-for="(items, key) in address_label_data" :class="{ active: address_label==key }" >
2976 <input v-model="address_label" type="radio" :value="key" > 2977 {{ items }} 2978 </label> 2979 </div> 2980 <!--btn-group--> 2981 2982 </div> <!--forms--> 2983 2984 </template> 2985 2986 <div id="error_message" v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 2987 <p v-for="err in error" class="m-0">{{err}}</p> 2988 </div> 2989 2990 2991 </div> <!--modal-body--> 2992 2993 2994 <div class="modal-footer justify-content-start"> 2995 2996 <template v-if="!cmaps_full"> 2997 <div class="border flex-fill"> 2998 <button class="btn btn-black w-100" @click="closeModal" > 2999 {{label.cancel}} 3000 </button> 3001 </div> 3002 <div class="border flex-fill"> 3003 <button class="btn btn-green w-100" @click="save" :class="{ loading: is_loading }" :disabled="!DataValid" > 3004 <span class="label">{{label.save}}</span> 3005 <div class="m-auto circle-loader" data-loader="circle-side"></div> 3006 </button> 3007 </div> 3008 </template> 3009 3010 <template v-else-if="cmaps_full"> 3011 <div class="border flex-fill"> 3012 <button class="btn btn-black w-100" @click="cancelPin" > 3013 {{label.cancel}} 3014 </button> 3015 </div> 3016 <div class="border flex-fill"> 3017 <button class="btn btn-green w-100" @click="setNewCoordinates" 3018 :class="{ loading: is_loading }" :disabled="!DataValidNew" > 3019 <span class="label">{{label.save}}</span> 3020 <div class="m-auto circle-loader" data-loader="circle-side"></div> 3021 </button> 3022 </div> 3023 </template> 3024 3025 </div> <!--content--> 3026 </div> <!--dialog--> 3027 </div> <!--modal--> 3028 `, 3029 }; 3030 3031 3032 /* 3033 DIRECTIVE CLICK OUTSIDE 3034 */ 3035 const clickOutside = { 3036 beforeMount: (el, binding) => { 3037 el.clickOutsideEvent = event => { 3038 // here I check that click was outside the el and his children 3039 if (!(el == event.target || el.contains(event.target))) { 3040 // and if it did, call method provided in attribute value 3041 binding.value(); 3042 } 3043 }; 3044 document.addEventListener("click", el.clickOutsideEvent); 3045 }, 3046 unmounted: el => { 3047 document.removeEventListener("click", el.clickOutsideEvent); 3048 }, 3049 }; 3050 3051 3052 /* 3053 COMPONENTS MERCHANT SERVICES 3054 */ 3055 const ComponentsMerchantServices = { 3056 props: ['title','label'], 3057 data(){ 3058 return { 3059 transaction_list :[], 3060 transaction : '', 3061 transaction_type : 'pickup', 3062 loading : false, 3063 charge_type : '', 3064 estimation : [] 3065 }; 3066 }, 3067 mounted () { 3068 this.transaction_type = window.transaction_type || ''; 3069 this.getMerchantServices(); 3070 }, 3071 methods :{ 3072 getMerchantServices(){ 3073 var $params; var timenow = getTimeNow(); 3074 $params="merchant_id=" + merchant_id; 3075 $params+="&cart_uuid=" + getCookie('cart_uuid'); 3076 $params+=addValidationRequest(); 3077 ajax_request[timenow] = $.ajax({ 3078 url: ajaxurl+"/servicesList", 3079 method: "POST", 3080 dataType: "json", 3081 data: $params, 3082 contentType : $content_type.form , 3083 timeout: $timeout, 3084 crossDomain: true, 3085 beforeSend: function( xhr ) { 3086 this.loading = false; 3087 if(ajax_request[timenow] != null) { 3088 ajax_request[timenow].abort(); 3089 } 3090 } 3091 }); 3092 3093 ajax_request[timenow].done( data => { 3094 if ( data.code==1){ 3095 this.transaction_list = data.details.data; 3096 this.transaction = data.details.transaction; 3097 this.charge_type = data.details.charge_type; 3098 this.estimation = data.details.estimation; 3099 3100 if(this.transaction_type){ 3101 this.transaction = this.transaction_type; 3102 } else { 3103 this.transaction = data.details.transaction; 3104 } 3105 3106 } else { 3107 this.transaction_list = []; 3108 this.transaction = ''; 3109 this.charge_type = ''; 3110 this.estimation = []; 3111 } 3112 }); // ajax done 3113 3114 ajax_request[timenow].always( data => { 3115 this.loading = false; 3116 }); 3117 3118 }, 3119 doUpdateService(data){ 3120 this.transaction = data; 3121 this.updateService(); 3122 }, 3123 updateService(){ 3124 axios({ 3125 method: 'POST', 3126 url: ajaxurl+"/updateService" , 3127 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&transaction_type="+this.transaction + "&cart_uuid=" + getCookie('cart_uuid'), 3128 timeout: $timeout, 3129 }).then( response => { 3130 if(response.data.code==1){
3131 setCookie('cart_transaction_type', this.transaction ,30); 3132 setCookie('cart_uuid', response.data.details.cart_uuid ,30); 3133 } 3134 if ((typeof vm_addres_needed !== "undefined") && ( vm_addres_needed !== null)) { 3135 vm_addres_needed.addressNeeded(); 3136 } 3137 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 3138 vm_cart_preview.getCartPreview(); 3139 vm_cart_preview.showCartPreview(); 3140 } 3141 }).catch(error => { 3142 // 3143 }).then(data => { 3144 //vue_cart.loadcart(); 3145 this.$emit('afterUpdate',this.transaction); 3146 }); 3147 }, 3148 capitalizeFirst(text) { 3149 if (!text) return ''; 3150 return text.charAt(0).toUpperCase() + text.slice(1); 3151 } 3152 }, 3153 template: ` 3154 <div class="btn-group-rounded btn-group btn-group-toggle"> 3155 <label class="btn d-flex" 3156 v-for="trans in transaction_list" :class="{ active: transaction== trans.service_code }" > 3157 <input type="radio" :value="trans.service_code" v-model="transaction" @click="doUpdateService(trans.service_code)" > 3158 <div class="align-self-center"> 3159 <div class="bold font-16"><i class="zmdi zmdi-hc-lg" :class="trans.icon"></i> {{ capitalizeFirst(trans.service_name) }}</div> 3160 <template v-if="estimation[trans.service_code]"> 3161 <template v-for="(item,index) in estimation[trans.service_code] "> 3162 <template v-if="trans.service_code=='delivery'"> 3163 <template v-if="item.charge_type==charge_type"> 3164 <p class="m-0">{{item.estimation}} {{label.min}}</p> 3165 </template> 3166 </template> 3167 <template v-else> 3168 <template v-if="item.charge_type=='fixed'"> 3169 <p class="m-0">{{item.estimation}} {{label.min}}</p> 3170 </template> 3171 </template> 3172 </template> 3173 </template> 3174 </div> 3175 </label> 3176 </div> 3177 `, 3178 }; 3179 3180 3181 /* 3182 COMPONENTS RECAPCHA 3183 https://github.com/bbonch/vue3-recaptcha2 3184 */ 3185 3186 const componentsRecaptcha = { 3187 props: ['sitekey','size','theme','is_enabled','captcha_lang'], 3188 data() { 3189 return { 3190 recaptcha: null, 3191 } 3192 }, 3193 mounted() { 3194 if(this.is_enabled==1 || this.is_enabled=="true" || this.is_enabled==true){ 3195 this.initCapcha(); 3196 } 3197 }, 3198 methods: { 3199 initCapcha(){ 3200 if (window.grecaptcha == null) { 3201 new Promise((resolve) => { 3202 window.recaptchaReady = function () { 3203 resolve(); 3204 }; 3205 3206 const doc = window.document; 3207 const scriptId = "recaptcha-script"; 3208 const scriptTag = doc.createElement("script"); 3209 scriptTag.id = scriptId; 3210 scriptTag.setAttribute("src", "https://www.google.com/recaptcha/api.js?onload=recaptchaReady&render=explicit&hl="+ this.captcha_lang); 3211 doc.head.appendChild(scriptTag); 3212 }).then(() => { 3213 this.renderRecaptcha(); 3214 }); 3215 } else { 3216 this.renderRecaptcha(); 3217 } 3218 }, 3219 renderRecaptcha(){ 3220 this.recaptcha = grecaptcha.render( this.$refs.recaptcha_target , { 3221 'sitekey' : this.sitekey, 3222 'theme': this.theme, 3223 'size': this.size, 3224 'tabindex': this.tabindex, 3225 'callback': (response) => this.$emit("verify", response), 3226 'expired-callback': () => this.$emit("expire"), 3227 'error-callback': () => this.$emit("fail") 3228 }); 3229 }, 3230 reset() { 3231 grecaptcha.reset(this.recaptcha); 3232 } 3233 }, 3234 template: ` 3235 <div class="mb-2 mt-2" ref="recaptcha_target"></div> 3236 ` 3237 }; 3238 3239 3240 /* 3241 COMPONENTS PHONE NUMBER 3242 */ 3243 const ComponentsPhoneNumber = { 3244 props: ['label','mobile_number','mobile_prefix','default_country','only_countries'], 3245 emits: ['update:mobile_number','update:mobile_prefix'], 3246 data(){ 3247 return { 3248 data : [], 3249 country_flag : '' 3250 }; 3251 }, 3252 updated () { 3253 3254 }, 3255 mounted () { 3256 this.getLocationCountries(); 3257 }, 3258 methods :{ 3259 getLocationCountries(){ 3260 3261 var $params = { 3262 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 3263 'default_country': this.default_country, 3264 'only_countries': this.only_countries 3265 }; 3266 var timenow = getTimeNow(); 3267 $params = JSON.stringify($params); 3268 3269 ajax_request[timenow] = $.ajax({ 3270 url: ajaxurl+"/getLocationCountries", 3271 method: "PUT", 3272 dataType: "json", 3273 data: $params , 3274 contentType : $content_type.json , 3275 timeout: $timeout, 3276 crossDomain: true, 3277 beforeSend: data => { 3278 this.is_loading = true; 3279 if(ajax_request[timenow] != null) { 3280 ajax_request[timenow].abort(); 3281 } 3282 } 3283 }); 3284 3285 ajax_request[timenow].done( data => { 3286 if ( data.code==1){ 3287 this.data = data.details.data; 3288 this.country_flag = data.details.default_data.flag; 3289 this.$emit('update:mobile_prefix', data.details.default_data.phonecode ); 3290 } else { 3291 this.data = []; 3292 this.country_flag=''; 3293 this.mobile_prefix=''; 3294 } 3295 }); 3296 3297 ajax_request[timenow].always( data => { 3298 3299 }); 3300 3301 }, 3302 setValue(data){ 3303 this.country_flag = data.flag; 3304 this.$emit('update:mobile_prefix', data.phonecode ); 3305 this.$refs.ref_mobile_number.focus(); 3306 }, 3307 }, 3308 template: ` 3309 <div class="inputs-with-dropdown d-flex align-items-center mb-3" > 3310 <div class="dropdown"> 3311 <button class="dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 3312 <img v-if="country_flag" :src="country_flag"> 3313 </button> 3314 <div class="dropdown-menu" > 3315 <a v-for="item in data" @click="setValue(item)" 3316 href="javascript:;" class="dropdown-item d-flex align-items-center"> 3317 <div class="mr-2"> 3318 <img :src="item.flag"> 3319 </div> 3320 <div>{{item.country_name}}</div> 3321 </a>
3322 </div> 3323 </div> <!--dropdown--> 3324 3325 <div class="mr-0 ml-1" v-if="mobile_prefix">+{{mobile_prefix}}</div> 3326 <input type="text" v-maska="'###################'" ref="ref_mobile_number" 3327 :value="mobile_number" @input="$emit('update:mobile_number', $event.target.value)" > 3328 3329 </div> <!--inputs--> 3330 ` 3331 }; 3332 3333 3334 3335 /*COMPONENTS CONFIRM AND ALERT*/ 3336 const Componentsbootbox = { 3337 props: ['label','size'], 3338 methods :{ 3339 confirm(){ 3340 3341 bootbox.confirm({ 3342 size: this.size, 3343 title : this.label.confirm , 3344 message: this.label.are_you_sure, 3345 centerVertical: true, 3346 animate: false, 3347 buttons: { 3348 cancel: { 3349 label: this.label.cancel, 3350 className: 'btn btn-black small pl-4 pr-4' 3351 }, 3352 confirm: { 3353 label: this.label.yes, 3354 className: 'btn btn-green small pl-4 pr-4' 3355 }, 3356 }, 3357 callback: result => { 3358 this.$emit('callback',result); 3359 } 3360 }); 3361 3362 }, 3363 alert(message,options){ 3364 bootbox.alert({ 3365 size: !empty(options.size)?options.size:'' , 3366 closeButton: false, 3367 message: message , 3368 animate: false, 3369 centerVertical: true, 3370 buttons: { 3371 ok:{ 3372 label: this.label.ok, 3373 className: 'btn btn-green small pl-4 pr-4' 3374 } 3375 } 3376 }); 3377 }, 3378 }, 3379 }; 3380 3381 // const loadingBox = { 3382 // props: ['message','donnot_close'], 3383 // data(){ 3384 // return { 3385 // new_message : '' 3386 // } 3387 // }, 3388 // methods :{ 3389 // show(){ 3390 // $('#loadingBox').modal('show'); 3391 // }, 3392 // close(){ 3393 // $('#loadingBox').modal('hide'); 3394 // }, 3395 // setMessage(new_message){ 3396 // this.new_message = new_message; 3397 // }, 3398 // }, 3399 // template:` 3400 // <div class="modal" id="loadingBox" tabindex="-1" role="dialog" aria-labelledby="loadingBox" aria-hidden="true" 3401 // data-backdrop="static" data-keyboard="false" 3402 // > 3403 // <div class="modal-dialog modal-dialog-centered modal-loadingbox" role="document"> 3404 // <div class="modal-content"> 3405 // <div class="modal-body"> 3406 // <div class="loading mt-2"> 3407 // <div class="m-auto circle-loader medium" data-loader="circle-side"></div> 3408 // </div> 3409 // <p class="text-center mt-2"> 3410 // <div v-if="!new_message">{{message}}</div> 3411 // <div v-if="new_message">{{new_message}}</div> 3412 // <div>{{donnot_close}}</div> 3413 // </p> 3414 // </div> 3415 // </div> <!--content--> 3416 // </div> <!--dialog--> 3417 // </div> <!--modal--> 3418 // ` 3419 // }; 3420 3421 3422 3423 /* 3424 COMPONENTS REVIEW MODAL 3425 */ 3426 var tagify,tagify2,$dropzone; 3427 const ComponentsReview = { 3428 components: { 3429 'star-rating' : VueStarRating.default, 3430 }, 3431 props: ['label','accepted_files','max_file'], 3432 data(){ 3433 return { 3434 upload_images : [], 3435 required_message :[], 3436 rating_value : '', 3437 review_content : '', 3438 as_anonymous : false, 3439 order_uuid : '', 3440 is_loading : false, 3441 error : [] , 3442 is_reset : false, 3443 }; 3444 }, 3445 mounted () { 3446 tagify = new Tagify ( document.querySelector(".tags_like") ); 3447 tagify2 = new Tagify ( document.querySelector(".tags_not_like") ); 3448 autosize( document.getElementById("review_content") ); 3449 this.initDropZone(this.label , this); 3450 }, 3451 methods :{ 3452 show(){ 3453 $('#reviewModal').modal('show'); 3454 }, 3455 close(){ 3456 $( this.$refs.review_modal ).modal('hide'); 3457 Dropzone.forElement('#dropzone_multiple').removeAllFiles(true); 3458 }, 3459 reset(){ 3460 Dropzone.forElement('#dropzone_multiple').files = []; 3461 $('.dz-preview').remove(); 3462 $('.dropzone').removeClass('dz-started'); 3463 this.upload_images = []; 3464 this.rating_value = ''; 3465 this.review_content = ''; 3466 this.as_anonymous = false; 3467 this.order_uuid = ''; 3468 this.error = []; 3469 tagify.removeAllTags(); 3470 tagify2.removeAllTags(); 3471 3472 }, 3473 initDropZone(label, object){ 3474 var $upload_params = { 3475 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 3476 }; 3477 Dropzone.autoDiscover = false;
3478 $dropzone = $("#dropzone_multiple").dropzone({ 3479 dictDefaultMessage : label.dictDefaultMessage, 3480 dictFallbackMessage : label.dictFallbackMessage , 3481 dictFallbackText : label.dictFallbackText, 3482 dictFileTooBig : label.dictFileTooBig, 3483 dictInvalidFileType : label.dictInvalidFileType, 3484 dictResponseError : label.dictResponseError, 3485 dictCancelUpload : label.dictCancelUpload, 3486 dictCancelUploadConfirmation : label.dictCancelUploadConfirmation, 3487 dictRemoveFile : label.dictRemoveFile, 3488 dictMaxFilesExceeded : label.dictMaxFilesExceeded, 3489 paramName: "file", 3490 url: ajaxurl+"/uploadReview" , 3491 params: $upload_params, 3492 addRemoveLinks : true, 3493 maxFiles : parseInt(this.max_file), 3494 acceptedFiles: this.accepted_files , 3495 autoProcessQueue : true, 3496 init: function() { 3497 var instance = this; 3498 instance.on("maxfilesexceeded", function(file) { 3499 //component_alert.alert( [label.max_file_exceeded] ); 3500 notify(label.max_file_exceeded,'error'); 3501 instance.removeFile(file); 3502 }); 3503 instance.on("removedfile", function (file) { 3504 dump("removedfile"); 3505 object.removeUpload(file.upload_uuid); 3506 //file.previewElement.remove(); 3507 }); 3508 instance.on("success", (file,response) => { 3509 dump(response); 3510 var $resp = response; 3511 if($resp.code==1){ 3512 file.upload_uuid = $resp.details.id; 3513 object.upload_images.push( $resp.details ); 3514 } else { 3515 var $resp = JSON.parse(response); 3516 notify($resp.msg,'error'); 3517 instance.removeFile(file); 3518 } 3519 }); 3520 instance.on("addedfile", function() { 3521 dump("addedfile"); 3522 }); 3523 }, 3524 }); 3525 }, 3526 removeUpload(id){ 3527 3528 return new Promise((resolve, reject) => { 3529 3530 var $params = { 3531 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 3532 'id':id, 3533 }; 3534 var timenow = getTimeNow(); 3535 3536 ajax_request[timenow] = $.ajax({ 3537 url: ajaxurl+"/removeReviewImage", 3538 method: "PUT", 3539 dataType: "json", 3540 data: JSON.stringify($params) , 3541 contentType : $content_type.json , 3542 timeout: $timeout, 3543 crossDomain: true, 3544 beforeSend: data => { 3545 this.is_loading = true; 3546 if(ajax_request[timenow] != null) { 3547 ajax_request[timenow].abort(); 3548 this.is_loading = false; 3549 } 3550 } 3551 }); 3552 3553 ajax_request[timenow].done( data => { 3554 this.is_loading = false; 3555 resolve(true); 3556 if(data.code==1){ 3557 //this.remove(data.details); 3558 } 3559 }); // ajax done 3560 3561 ajax_request[timenow].always( data => { 3562 this.is_loading = false; 3563 }); 3564 3565 }); 3566 }, 3567 remove(uuid){ 3568 if(this.upload_images){ 3569 this.upload_images.forEach((item,index) => { 3570 if ( item.id==uuid){ 3571 dump("index remove=>" + index); 3572 this.upload_images.splice(index,1); 3573 } 3574 }); 3575 } 3576 }, 3577 getTag(data){ 3578 var $tag_data = []; 3579 if(data){ 3580 data.forEach((data,index) => { 3581 $tag_data.push( data.value ); 3582 }); 3583 } 3584 return $tag_data; 3585 }, 3586 addReview(){ 3587 3588 var $params = { 3589 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 3590 'order_uuid' : this.order_uuid, 3591 'review_content':this.review_content, 3592 'rating_value':this.rating_value, 3593 'as_anonymous':this.as_anonymous, 3594 'tags_like': this.getTag(tagify.value), 3595 'tags_not_like': this.getTag(tagify2.value), 3596 'upload_images':this.upload_images, 3597 }; 3598 var timenow = 1; 3599 3600 ajax_request[timenow] = $.ajax({ 3601 url: ajaxurl+"/addReview", 3602 method: "PUT", 3603 dataType: "json", 3604 data: JSON.stringify($params) , 3605 contentType : $content_type.json , 3606 timeout: $timeout, 3607 crossDomain: true, 3608 beforeSend: data => { 3609 this.is_loading = true; 3610 this.error = []; 3611 if(ajax_request[timenow] != null) { 3612 ajax_request[timenow].abort(); 3613 this.is_loading = false;
3614 } 3615 } 3616 }); 3617 3618 ajax_request[timenow].done( data => { 3619 dump(data); 3620 if(data.code==1){ 3621 notify(data.msg); 3622 this.reset(); 3623 $( this.$refs.review_modal ).modal('hide'); 3624 } else { 3625 this.error = data.msg; 3626 setTimeout(function() { 3627 location.href = "#error_message"; 3628 }, 1); 3629 } 3630 }); 3631 3632 ajax_request[timenow].always( data => { 3633 this.is_loading = false; 3634 }); 3635 }, 3636 deleteAllImages(){ 3637 3638 if(this.upload_images.length<=0){ 3639 return false; 3640 } 3641 3642 var $params = { 3643 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 3644 'upload_images':this.upload_images, 3645 }; 3646 3647 var timenow = getTimeNow(); 3648 ajax_request[timenow] = $.ajax({ 3649 url: ajaxurl+"/removeAllReviewImage", 3650 method: "PUT", 3651 dataType: "json", 3652 data: JSON.stringify($params) , 3653 contentType : $content_type.json , 3654 timeout: $timeout, 3655 crossDomain: true, 3656 beforeSend: data => { 3657 if(ajax_request[timenow] != null) { 3658 ajax_request[timenow].abort(); 3659 } 3660 } 3661 }); 3662 3663 ajax_request[timenow].done( data => { 3664 if(data.code==1){ 3665 this.upload_images = []; 3666 Dropzone.forElement('#dropzone_multiple').removeAllFiles(true); 3667 } 3668 }); // ajax done 3669 }, 3670 }, 3671 template: ` 3672 <div class="modal" ref="review_modal" id="reviewModal" tabindex="-1" role="dialog" aria-labelledby="reviewModal" aria-hidden="true" data-backdrop="static" data-keyboard="false" > 3673 <div class="modal-dialog modal-dialog-centered" role="document"> 3674 <div class="modal-content"> 3675 3676 3677 <div class="modal-body" > 3678 3679 <a href="javascript:;" @click="close" 3680 class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 3681 3682 <h4 class="bold m-0 mb-3 mt-3">{{label.write_review}}</h4> 3683 3684 <star-rating 3685 v-model:rating="rating_value" 3686 :star-size="30" 3687 :show-rating="false" 3688 @update:rating="rating_value = $event" 3689 > 3690 </star-rating> 3691 3692 <h5 class="m-0 mt-3 mb-2">{{label.what_did_you_like}}</h5> 3693 <input type="text" name="tags_like" class="tags_like" id="tags_like" :placeholder="label.search_tag"> 3694 3695 <h5 class="m-0 mt-2 mb-2">{{label.what_did_you_not_like}}</h5> 3696 <input type="text" name="tags_not_like" class="tags_not_like" id="tags_not_like" :placeholder="label.search_tag"> 3697 3698 <h5 class="m-0 mt-3 mb-2">{{label.add_photo}}</h5> 3699 <div class="mb-3"> 3700 <div class="dropzone dropzone_container" id="dropzone_multiple" data-action="gallery_create"> 3701 <div class="dz-default dz-message"> 3702 <i class="fas fa-cloud-upload-alt"></i> 3703 <p>{{label.drop_files_here}}</p> 3704 </div> 3705 </div> 3706 </div> 3707 3708 <!-- <div v-if="upload_images.length>0" class="row gallery m-0"> 3709 <div v-for="images in upload_images" class="col-lg-4 col-md-4 col-sm-12 mb-0 mb-lg-0 p-1"> 3710 <div class="position-relative"> 3711 <img :src="images.url_image"> 3712 <a href="javascript:;" 3713 @click="removeUpload(images.id)" data-dz-remove 3714 class="remove btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-plus"></i></a> 3715 </div> 3716 </div> 3717 </div>--> 3718 3719 <h5 class="m-0 mt-2 mb-2">{{label.write_your_review}}</h5> 3720 <div class="form-label-group"> 3721 <textarea id="review_content" class="form-control form-control-text font13" 3722 :placeholder="label.review_helps" 3723 v-model="review_content" 3724 style="max-height:150px;" 3725 > 3726 </textarea> 3727 </div> 3728 3729 <div class="custom-control custom-checkbox flex-grow-1"> 3730 <input type="checkbox" class="custom-control-input" 3731 name="as_anonymous" value="1" 3732 id="as_anonymous" 3733 v-model="as_anonymous" 3734 > 3735 <label class="custom-control-label font14 bold" for="as_anonymous" > 3736 {{label.post_review_anonymous}} 3737 </label> 3738 </div> 3739 3740 3741 <div id="error_message" v-cloak v-if="error.length>0" class="alert alert-warning mb-2 mt-2" role="alert"> 3742 <p v-cloak v-for="message in error" class="m-0">{{message}}</p> 3743 </div> 3744
3745 </div> <!--modal body--> 3746 3747 <div class="modal-footer justify-content-start"> 3748 <button class="btn btn-black w-100" @click="addReview" :class="{ loading: is_loading }" > 3749 <span class="label">{{label.add_review}}</span> 3750 <div class="m-auto circle-loader" data-loader="circle-side"></div> 3751 </button> 3752 </div> <!--footer--> 3753 3754 </div> <!--content--> 3755 </div> <!--dialog--> 3756 </div> <!--modal--> 3757 `, 3758 }; 3759 3760 3761 /* 3762 COMPONENTS MONEY 3763 */ 3764 const ComponentsMoney = { 3765 props: ['ajax_url', 'amount','price_format'], 3766 data(){ 3767 return { 3768 data : 0, 3769 config : JSON.parse(money_config) 3770 /*config : { 3771 prefix : '$', 3772 suffix: '', 3773 thousands : ',', 3774 decimal : '.', 3775 precision : 2, 3776 }, */ 3777 }; 3778 }, 3779 mounted() { 3780 this.data = window["v-money3"].format(this.amount, this.config); 3781 }, 3782 watch: { 3783 price_format(newval,oldval){ 3784 this.config = newval; 3785 } 3786 }, 3787 updated(){ 3788 this.data = window["v-money3"].format(this.amount, this.config); 3789 }, 3790 methods :{ 3791 formatNumber(data){ 3792 return window["v-money3"].format(data, this.config); 3793 }, 3794 }, 3795 template:` 3796 {{data}} 3797 ` 3798 }; 3799 3800 var MoneyFormat = function(amount){ 3801 return window["v-money3"].format(amount, JSON.parse(money_config)); 3802 }; 3803 3804 3805 // START 1.0.8 COMPONENTS 3806 //let bounds; 3807 let yandex_map; 3808 let yandex_zoom = 16.6; 3809 const ComponentsMaps = { 3810 props: ["keys", "provider", "zoom", "center", "markers", "size"], 3811 template : ` 3812 <div ref="cmaps" class="map border" :class="size"></div> 3813 3814 <div class="position-absolute map-buttons-wrap" v-if="size=='map-lg-large'" > 3815 <div class="btn-group-vertical" v-loading="loading" v-if="provider!='yandex'" > 3816 <div class="mb-2"> 3817 <button @click="locateLocation" type="button" class="btn btn-white rounded-circle"> 3818 <i class="zmdi zmdi-gps-dot font25"></i> 3819 </button> 3820 </div> 3821 <button @click="setPlusZoom()" type="button" class="btn btn-white"> 3822 <i class="zmdi zmdi-plus font25"></i> 3823 </button> 3824 <div class="divider py-1 bg-dark"></div> 3825 <button @click="setLessZoom()" type="button" class="btn btn-white"> 3826 <i class="zmdi zmdi-minus font25"></i> 3827 </button> 3828 </div> 3829 </div> 3830 `, 3831 // setup(props) { 3832 // const enabled_controls = props.enabled_controls !== undefined ? props.enabled_controls : true; 3833 // return { 3834 // enabled_controls 3835 // }; 3836 // }, 3837 data() { 3838 return { 3839 cmapsMarker : [], 3840 latLng : [], 3841 cmaps: undefined, 3842 bounds : undefined, 3843 loading : false, 3844 } 3845 }, 3846 mounted() { 3847 this.renderMap(); 3848 }, 3849 watch: { 3850 markers(newval, oldval) { 3851 this.renderMap(); 3852 }, 3853 }, 3854 methods: { 3855 locateLocation(){ 3856 this.$emit("dragMarker", true); 3857 this.loading = true; 3858 if (navigator.geolocation) { 3859 navigator.geolocation.getCurrentPosition( 3860 (data) => { 3861 this.$emit("dragMarker", false); 3862 this.loading = false; 3863 this.$emit("afterSelectmap", data.coords.latitude,data.coords.longitude); 3864 dump(data); 3865 }, 3866 (error) => { 3867 this.$emit("dragMarker", false); 3868 this.loading = false; 3869 ElementPlus.ElNotification({ 3870 title: "", 3871 message: error.message, 3872 position: 'bottom-right', 3873 type: 'warning', 3874 }); 3875 } 3876 ); 3877 } else { 3878 this.$emit("dragMarker", false); 3879 this.loading = false; 3880 ElementPlus.ElNotification({ 3881 title: "", 3882 message: "Your browser doesn't support geolocation.", 3883 position: 'bottom-right', 3884 type: 'warning', 3885 }); 3886 } 3887 }, 3888 renderMap(){ 3889 try { 3890 switch (this.provider) { 3891 case "google.maps": 3892 this.bounds = new window.google.maps.LatLngBounds(); 3893 if (typeof this.cmaps !== "undefined" && this.cmaps !== null && Object.keys(this.cmapsMarker).length>0 ) { 3894 this.moveAllMarker(); 3895 } else { 3896 this.cmaps = new window.google.maps.Map(this.$refs.cmaps, { 3897 center: { 3898 lat: parseFloat(this.center.lat), 3899 lng: parseFloat(this.center.lng), 3900 }, 3901 zoom: parseInt(this.zoom), 3902 disableDefaultUI: true , 3903 styles : map_style 3904 }); 3905
3906 Object.entries(this.markers).forEach(([key, items]) => { 3907 this.addMarker( 3908 { 3909 position: { 3910 lat: parseFloat(items.lat), 3911 lng: parseFloat(items.lng), 3912 }, 3913 map: this.cmaps, 3914 draggable: items.draggable==1?true:false, 3915 label: items.label, 3916 }, 3917 items.id, 3918 items.draggable 3919 ); 3920 }); 3921 3922 } 3923 break; 3924 3925 case "mapbox": 3926 if (typeof this.cmaps !== "undefined" && this.cmaps !== null && Object.keys(this.cmapsMarker).length>0 ) { 3927 this.moveAllMarker(); 3928 } else { 3929 mapboxgl.accessToken = this.keys; 3930 this.bounds = new mapboxgl.LngLatBounds(); 3931 this.cmaps = new mapboxgl.Map({ 3932 container: this.$refs.cmaps, 3933 style: 'mapbox://styles/mapbox/streets-v12', 3934 center: [ parseFloat(this.center.lng), parseFloat(this.center.lat)], 3935 zoom: 14 3936 }); 3937 3938 this.cmaps.on('error', (response) => { 3939 dump(response.error.message) 3940 }); 3941 3942 Object.entries(this.markers).forEach(([key, items]) => { 3943 this.addMarker( 3944 { 3945 position: { 3946 lat: parseFloat(items.lat), 3947 lng: parseFloat(items.lng), 3948 }, 3949 map: this.cmaps, 3950 draggable: items.draggable==1?true:false, 3951 }, 3952 items.id, 3953 items.draggable 3954 ); 3955 }); 3956 3957 if (Object.keys(this.markers).length > 1) { 3958 this.FitBounds(); 3959 } else { 3960 if(this.markers[0]){ 3961 this.setCenter(this.markers[0].lat, this.markers[0].lng); 3962 } 3963 } 3964 } 3965 break; 3966 3967 case "yandex": 3968 this.initYandex(); 3969 break; 3970 3971 } 3972 } catch (err) { 3973 console.error(err); 3974 } 3975 }, 3976 async initYandex(){ 3977 console.debug("initYandex"); 3978 await ymaps3.ready; 3979 const {YMap, YMapDefaultSchemeLayer,YMapMarker,YMapDefaultFeaturesLayer,YMapListener,YMapControls } = ymaps3; 3980 const {YMapDefaultMarker} = await ymaps3.import('@yandex/[email protected]'); 3981 const {YMapZoomControl,YMapGeolocationControl} = await ymaps3.import('@yandex/[email protected]'); 3982 3983 const LOCATION = { 3984 center: [ parseFloat(this.center.lng), parseFloat(this.center.lat) ], 3985 zoom: yandex_zoom 3986 }; 3987 3988 if ((typeof this.$refs.cmaps !== "undefined") && ( this.$refs.cmaps !== null)) { 3989 } else { 3990 return; 3991 } 3992 3993 console.debug("yandex_map",yandex_map); 3994 console.debug("this.markers",this.markers); 3995 3996 if (!yandex_map) { 3997 console.debug("ADD Yandex map"); 3998 yandex_map = new YMap( 3999 this.$refs.cmaps, 4000 { 4001 location: LOCATION, 4002 showScaleInCopyrights: false, 4003 behaviors: ['drag','scrollZoom'] 4004 }, 4005 [ 4006 new YMapDefaultSchemeLayer({}), 4007 new YMapDefaultFeaturesLayer({}) 4008 ] 4009 ); 4010 4011 let is_dragable = true; 4012 if (Object.keys(this.markers).length > 0) { 4013 is_dragable = this.markers[0].draggable; 4014 } 4015 console.debug("is_dragable",is_dragable); 4016 4017 if(is_dragable){ 4018 yandex_map.addChild( 4019 new YMapListener({ 4020 onUpdate : (data)=>{ 4021 if(data.mapInAction){ 4022 this.cmapsMarker[0].update({ 4023 coordinates : data.location.center 4024 }); 4025 this.$emit("dragMarker", true); 4026 } else { 4027 this.$emit("dragMarker", false); 4028 } 4029 }, 4030 onActionEnd : (data)=>{ 4031 console.log("onActionEnd",data.type); 4032 if(data.type=="drag"){ 4033 this.cmapsMarker[0].update({ 4034 coordinates : data.location.center 4035 }); 4036 this.$emit( 4037 "afterSelectmap", 4038 data.location.center[1], 4039 data.location.center[0] 4040 ); 4041 } else if ( data.type=="scrollZoom" ){ 4042 yandex_zoom = data.location.zoom; 4043 } 4044 }, 4045 }) 4046 ); 4047 } 4048 4049 if(this.size=='map-lg-large'){ 4050 yandex_map.addChild(
4051 new YMapControls({position: 'right'}) 4052 .addChild(new YMapZoomControl({})) 4053 ); 4054 4055 yandex_map.addChild( 4056 new YMapControls({position: 'top right'}) 4057 .addChild(new YMapGeolocationControl({ 4058 onGeolocatePosition:(results)=>{ 4059 console.log("onGeolocatePosition",results); 4060 this.$emit( 4061 "afterSelectmap", 4062 results[1], 4063 results[0] 4064 ); 4065 } 4066 })) 4067 ); 4068 } 4069 4070 Object.entries(this.markers).forEach(([key, items]) => { 4071 let index = items.id; 4072 this.cmapsMarker[index] = new YMapDefaultMarker({ 4073 coordinates: [ parseFloat(items.lng), parseFloat(items.lat) ] , 4074 draggable: items.draggable, 4075 onDragEnd: (coordinates)=>{ 4076 console.log("onDragEnd",coordinates); 4077 this.$emit( 4078 "afterSelectmap", 4079 coordinates[1], 4080 coordinates[0] 4081 ); 4082 } 4083 }); 4084 yandex_map.addChild(this.cmapsMarker[index]); 4085 }); 4086 4087 4088 if (Object.keys(this.markers).length > 1) { 4089 //this.FitBounds(); 4090 } else { 4091 if(this.markers[0]){ 4092 //console.log("set Center"); 4093 const NEWLOCATION = { 4094 center : [this.markers[0].lng,this.markers[0].lat], 4095 zoom :yandex_zoom 4096 }; 4097 yandex_map.update({ 4098 location : NEWLOCATION 4099 }); 4100 } 4101 } 4102 } else { 4103 console.debug("move all marker"); 4104 Object.entries(this.markers).forEach(([key, items]) => { 4105 let index = items.id; 4106 if(this.cmapsMarker[index]){ 4107 this.cmapsMarker[index].update({ 4108 coordinates: [ items.lng, items.lat ] , 4109 }); 4110 } 4111 }); 4112 4113 if (Object.keys(this.markers).length > 1) { 4114 //this.FitBounds(); 4115 } else { 4116 if(this.markers[0]){ 4117 const NEWLOCATION = { 4118 center : [this.markers[0].lng,this.markers[0].lat], 4119 zoom : yandex_zoom 4120 }; 4121 yandex_map.update({ 4122 location : NEWLOCATION 4123 }); 4124 } 4125 } 4126 } 4127 4128 4129 }, 4130 async addMarker(properties, index, draggable) { 4131 try { 4132 4133 switch (this.provider) { 4134 case "google.maps": 4135 this.cmapsMarker[index] = new window.google.maps.Marker(properties); 4136 4137 this.cmaps.panTo( 4138 new window.google.maps.LatLng( 4139 properties.position.lat, 4140 properties.position.lng 4141 ) 4142 ); 4143 this.bounds.extend(this.cmapsMarker[index].position); 4144 4145 if (draggable === true) { 4146 google.maps.event.addListener(this.cmaps, 'drag',(data)=>{ 4147 this.$emit("dragMarker", true); 4148 let new_position = new google.maps.LatLng(this.cmaps.getCenter().lat(),this.cmaps.getCenter().lng()); 4149 this.cmapsMarker[index].setPosition(new_position); 4150 }); 4151 4152 google.maps.event.addListener(this.cmaps, 'dragend',(data)=>{ 4153 let wrapped = new google.maps.LatLng(this.cmaps.getCenter().lat(), this.cmaps.getCenter().lng()); 4154 this.$emit("dragMarker", false); 4155 this.$emit("afterSelectmap",wrapped.lat() , wrapped.lng()); 4156 }); 4157 4158 window.google.maps.event.addListener( 4159 this.cmapsMarker[index], 4160 "drag", 4161 (marker) => { 4162 this.$emit("dragMarker", true); 4163 } 4164 ); 4165 4166 window.google.maps.event.addListener( 4167 this.cmapsMarker[index], 4168 "dragend", 4169 (marker) => { 4170 const latLng = marker.latLng; 4171 this.latLng = { 4172 lat :latLng.lat(), 4173 lng : latLng.lng() 4174 } 4175 this.$emit("dragMarker", false); 4176 this.$emit("afterSelectmap", latLng.lat(), latLng.lng()); 4177 } 4178 ); 4179 } 4180 4181 break; 4182 4183 case "mapbox": 4184 this.cmapsMarker[index] = new mapboxgl.Marker(properties) 4185 .setLngLat([properties.position.lng, properties.position.lat]) 4186 .addTo(this.cmaps); 4187 4188 this.bounds.extend(new mapboxgl.LngLat(properties.position.lng, properties.position.lat)); 4189 4190 if (draggable === true) { 4191 this.cmapsMarker[index].on("dragend", (event) => { 4192 const lngLat = this.cmapsMarker[index].getLngLat(); 4193 dump( lngLat.lat +"=>"+ lngLat.lng); 4194 this.$emit("afterSelectmap", lngLat.lat, lngLat.lng); 4195 }); 4196 4197 this.cmaps.on("drag", () => { 4198 this.cmapsMarker[index].setLngLat([ 4199 this.cmaps.getCenter().lng.toFixed(4), 4200 this.cmaps.getCenter().lat.toFixed(4), 4201 ]); 4202 }); 4203 4204 this.cmaps.on("dragend", () => { 4205 this.cmapsMarker[index].setLngLat([ 4206 this.cmaps.getCenter().lng.toFixed(4), 4207 this.cmaps.getCenter().lat.toFixed(4), 4208 ]); 4209 this.$emit( 4210 "afterSelectmap", 4211 this.cmaps.getCenter().lat.toFixed(4), 4212 this.cmaps.getCenter().lng.toFixed(4) 4213 ); 4214 }); 4215 4216 } 4217 4218 this.mapBoxResize(); 4219 break; 4220 4221 } 4222 4223 } catch (err) { 4224 console.error(err); 4225 } 4226 }, 4227 mapBoxResize() { 4228 if (this.provider == "mapbox") { 4229 setTimeout(() => { 4230 this.cmaps.resize(); 4231 }, 500); 4232 } 4233 }, 4234 moveAllMarker(){ 4235 console.log("moveAllMarker"); 4236 console.log(this.markers); 4237 4238 if(this.provider=='google.maps'){ 4239 if (Object.keys(this.markers).length > 0) {
4240 Object.entries(this.markers).forEach(([key, items]) => { 4241 let latlng = new google.maps.LatLng(parseFloat(items.lat), parseFloat(items.lng)); 4242 if(!empty(this.cmapsMarker[items.id])){ 4243 this.cmapsMarker[items.id].setPosition(latlng); 4244 } 4245 }); 4246 4247 if (Object.keys(this.markers).length > 1) { 4248 this.FitBounds(); 4249 } else { 4250 this.cmaps.panTo( 4251 new window.google.maps.LatLng( 4252 this.markers[0].lat, 4253 this.markers[0].lng 4254 ) 4255 ); 4256 } 4257 } 4258 } else { 4259 if (Object.keys(this.markers).length > 0) { 4260 Object.entries(this.markers).forEach(([key, items]) => { 4261 if(!empty(this.cmapsMarker[items.id])){ 4262 this.cmapsMarker[items.id].setLngLat([items.lng, items.lat]) 4263 .addTo(this.cmaps); 4264 } 4265 }); 4266 4267 if (Object.keys(this.markers).length > 1) { 4268 this.FitBounds(); 4269 } else { 4270 this.cmaps.flyTo({ 4271 center : [ this.markers[0].lng , this.markers[0].lat ], 4272 essential: true, 4273 zoom: 14, 4274 }); 4275 } 4276 } 4277 } 4278 }, 4279 centerMap() { 4280 this.FitBounds(); 4281 }, 4282 FitBounds() { 4283 try { 4284 switch (this.provider) { 4285 case "google.maps": 4286 if (!empty(this.bounds)) { 4287 this.cmaps.fitBounds(this.bounds); 4288 } 4289 break; 4290 case "mapbox": 4291 if (!empty(this.bounds)) { 4292 this.cmaps.fitBounds(this.bounds, { duration: 0, padding: 50 }); 4293 } 4294 break; 4295 } 4296 } catch (err) { 4297 //console.error(err); 4298 } 4299 }, 4300 setCenter(lat, lng) { 4301 try { 4302 switch (this.provider) { 4303 case "google.maps": 4304 this.cmaps.setCenter(new window.google.maps.LatLng(lat, lng)); 4305 break; 4306 case "mapbox": 4307 this.cmaps.flyTo({ 4308 center: [lng, lat], 4309 essential: true, 4310 }); 4311 break; 4312 } 4313 } catch (err) { 4314 console.error(err); 4315 } 4316 }, 4317 setPlusZoom(){ 4318 if(this.provider=="yandex"){ 4319 } else { 4320 this.cmaps.setZoom(this.cmaps.getZoom() + 2); 4321 } 4322 }, 4323 setLessZoom(){ 4324 if(this.provider=="yandex"){ 4325 } else { 4326 this.cmaps.setZoom(this.cmaps.getZoom() - 2); 4327 } 4328 }, 4329 //methods 4330 }, 4331 }; 4332 4333 /* 4334 COMPONENTS MAPS AUTO COMPLETE 4335 */ 4336 const ComponentsAutoCompleteAdress = { 4337 props: ['label','modelValue','formatted_address','enabled_locate'], 4338 emits: ['update:modelValue'], 4339 data(){ 4340 return { 4341 q: '', 4342 awaitingSearch : false, 4343 show_list : false, 4344 data : [], 4345 error : [], 4346 hasSelected : false, 4347 loading : false, 4348 addressData : [], 4349 auto_locate : false, 4350 is_fullwidth : false, 4351 selectedData : [] 4352 }; 4353 }, 4354 created() { 4355 this.q = this.formatted_address; 4356 if ((typeof is_mobile !== "undefined") && ( is_mobile !== null)) { 4357 if(is_mobile){ 4358 this.is_fullwidth = true; 4359 } 4360 } 4361 }, 4362 watch: { 4363 formatted_address(newval,oldval){ 4364 this.q = newval; 4365 }, 4366 }, 4367 computed: { 4368 hasData(){ 4369 if(this.data.length>0){ 4370 return true; 4371 } 4372 return false; 4373 }, 4374 }, 4375 methods: { 4376 showList(){ 4377 this.show_list = true; 4378 }, 4379 clearData(){ 4380 this.data = []; 4381 this.q = ''; 4382 }, 4383 setData(data){ 4384 this.clearData(); 4385 this.q = data.description; 4386 this.$emit('update:modelValue', data.description); 4387 this.$emit('afterChoose',data); 4388 }, 4389 locateLocation(){ 4390 this.loading = true; 4391 if (navigator.geolocation) { 4392 navigator.geolocation.getCurrentPosition( 4393 (data) => { 4394 //this.loading = false; 4395 this.reverseGeocoding(data.coords.latitude,data.coords.longitude); 4396 }, 4397 (error) => { 4398 this.loading = false; 4399 ElementPlus.ElNotification({ 4400 title: "", 4401 message: error.message, 4402 position: 'bottom-right', 4403 type: 'warning', 4404 }); 4405 } 4406 ); 4407 } else { 4408 this.loading = false; 4409 ElementPlus.ElNotification({ 4410 title: "", 4411 message: "Your browser doesn't support geolocation.", 4412 position: 'bottom-right', 4413 type: 'warning', 4414 }); 4415 } 4416 }, 4417 reverseGeocoding(lat,lng){ 4418 axios({ 4419 method: 'POST', 4420 url: ajaxurl+"/reverseGeocoding" , 4421 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&lat="+ lat+ "&lng="+lng, 4422 timeout: $timeout, 4423 }).then( response => { 4424 if(response.data.code==1){ 4425 this.q = response.data.details.data.address.formatted_address; 4426 this.addressData = response.data.details.data; 4427 //if(this.auto_locate){ 4428 this.$emit('afterGetcurrentlocation',this.addressData); 4429 //} 4430 } else { 4431 this.addressData = []; 4432 ElementPlus.ElNotification({ 4433 title: "", 4434 message: response.data.msg, 4435 position: 'bottom-right', 4436 type: 'warning', 4437 }); 4438 } 4439 }).catch(error => { 4440 // 4441 }).then(data => { 4442 this.loading = false; 4443 this.auto_locate = false; 4444 }); 4445 }, 4446 setAddressData(data){ 4447 this.addressData = data; 4448 },
4449 setLoading(data){ 4450 this.loading = data; 4451 }, 4452 onSubmit(){ 4453 if (Object.keys(this.addressData).length > 0) { 4454 console.log("selectedData",this.selectedData); 4455 if(this.selectedData.from_addressbook){ 4456 this.$emit('afterPointaddress',this.selectedData); 4457 } else { 4458 this.$emit('afterGetcurrentlocation',this.addressData); 4459 } 4460 } else { 4461 this.auto_locate = true; 4462 this.locateLocation(); 4463 } 4464 }, 4465 searchLocation(queryString,cb){ 4466 let data = []; 4467 let is_guest = 1; 4468 if ((typeof isGuest !== "undefined") && ( isGuest !== null)) { 4469 is_guest = isGuest; 4470 } 4471 let methods = empty(queryString)?'getRecentAddress':'getlocationAutocomplete'; 4472 methods = is_guest==1?'getlocationAutocomplete':methods; 4473 if(is_guest==1 && empty(queryString)){ 4474 cb(data); 4475 return; 4476 } 4477 axios({ 4478 method: 'POST', 4479 url: ajaxurl+"/"+methods , 4480 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content')+"&q="+queryString, 4481 timeout: $timeout, 4482 }).then( response => { 4483 if(response.data.code==1){ 4484 data = response.data.details.data; 4485 } else { 4486 data = [] 4487 } 4488 cb(data); 4489 }).catch(error => { 4490 // 4491 }).then(data => { 4492 }); 4493 }, 4494 handleSelect(item){ 4495 this.selectedData = item; 4496 this.$emit('update:modelValue', item.description); 4497 this.$emit('afterChoose',item); 4498 }, 4499 // 4500 }, 4501 template: ` 4502 <div class="d-flex flex-sm-row flex-column align-items-center justify-content-between"> 4503 <div class="position-relative search-geocomplete" v-loading="loading" :class="{width_87 : enabled_locate , 'w-100' : !enabled_locate}" > 4504 <div class="p-0"> 4505 <el-autocomplete 4506 v-model="q" 4507 :placeholder="label.enter_address" 4508 size="large" 4509 class="w-100" 4510 :trigger-on-focus="true" 4511 value-key="description" 4512 :fit-input-width="is_fullwidth" 4513 clearable 4514 :fetch-suggestions="searchLocation" 4515 @select="handleSelect" 4516 > 4517 <template #suffix> 4518 <button v-if="enabled_locate" @click="locateLocation" type="button" class="btn btn-link"> 4519 <i class="zmdi zmdi-my-location font20" style="color:#000;"></i> 4520 </button> 4521 </template> 4522 </el-autocomplete> 4523 </div> 4524 </div> 4525 <div v-if="enabled_locate" class="flex-enabled-locate"> 4526 <button @click="onSubmit" type="button" class="btn btn-green pl-3 pr-3" :disabled="loading"> 4527 <i class="zmdi zmdi-arrow-right font25"></i> 4528 </button> 4529 </div> 4530 </div> 4531 ` 4532 }; 4533 /*END AUTO COMPLETE*/ 4534 4535 const ComponentsSelectAddress = { 4536 props : ['data','keys','provider','zoom','center' ,'label'], 4537 components: { 4538 'components-maps' : ComponentsMaps, 4539 'component-auto-complete' : ComponentsAutoCompleteAdress, 4540 }, 4541 data() { 4542 return { 4543 markers :[], 4544 address_data :[], 4545 loading : false, 4546 drag : false, 4547 visible : false 4548 } 4549 }, 4550 computed: { 4551 hasFormatAddress(){ 4552 if (Object.keys(this.address_data).length > 0) { 4553 return true; 4554 } 4555 return false; 4556 }, 4557 getFormatAddress(){ 4558 return this.address_data; 4559 }, 4560 isMobileView(){ 4561 if ((typeof is_mobile !== "undefined") && ( is_mobile !== null)) { 4562 if(is_mobile==1){ 4563 return true; 4564 } 4565 } 4566 return false; 4567 }, 4568 }, 4569 watch: { 4570 data(newval,oldval){ 4571 console.debug("new data",newval); 4572 this.address_data = newval; 4573 }, 4574 address_data(newval,oldval){ 4575 dump("watch address_data"); 4576 dump(newval); 4577 this.dataMarkers(newval.latitude,newval.longitude); 4578 } 4579 }, 4580 methods: { 4581 getFormatAddress(){ 4582 return 'test'; 4583 }, 4584 setInitialMarker(){ 4585 console.debug("setInitialMarker",this.data); 4586 if(yandex_map){ 4587 yandex_map.destroy(); 4588 yandex_map = null; 4589 } 4590 this.dataMarkers(this.data.latitude,this.data.longitude); 4591 }, 4592 dataMarkers(lat,lng){ 4593 this.markers = [ 4594 { 4595 id: 0, 4596 lat: parseFloat(lat), 4597 lng: parseFloat(lng), 4598 draggable: true, 4599 } 4600 ]; 4601 },
4602 setLoading(data){ 4603 this.loading = data; 4604 }, 4605 show(data){ 4606 if(data){ 4607 this.address_data = this.data; 4608 $(this.$refs.modal).modal('show'); 4609 } else { 4610 $(this.$refs.modal).modal('hide'); 4611 } 4612 }, 4613 afterChoose(data){ 4614 this.getLocationDetails(data); 4615 }, 4616 getLocationDetails(data){ 4617 axios({ 4618 method: 'POST', 4619 url: ajaxurl+"/getLocationDetails" , 4620 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&id="+ data.id + "&saveplace=0" + "&description="+data.description, 4621 timeout: $timeout, 4622 }).then( response => { 4623 if(response.data.code==1){ 4624 this.dataMarkers( 4625 response.data.details.data.latitude, 4626 response.data.details.data.longitude 4627 ); 4628 this.address_data = response.data.details.data; 4629 } else { 4630 4631 } 4632 }).catch(error => { 4633 // 4634 }).then(data => { 4635 4636 }); 4637 }, 4638 afterSelectmap(lat,lng){ 4639 this.loading = true; 4640 axios({ 4641 method: 'POST', 4642 url: ajaxurl+"/reverseGeocoding" , 4643 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&lat="+ lat+ "&lng="+lng, 4644 timeout: $timeout, 4645 }).then( response => { 4646 if(response.data.code==1){ 4647 if (Object.keys(response.data.details.data).length > 0) { 4648 this.address_data = response.data.details.data; 4649 this.address_data.latitude = lat; 4650 this.address_data.longitude = lng; 4651 } 4652 } else { 4653 4654 } 4655 }).catch(error => { 4656 // 4657 }).then(data => { 4658 this.loading = false; 4659 }); 4660 }, 4661 dragMarker(data){ 4662 this.drag = data; 4663 }, 4664 setNewAdress(){ 4665 this.$emit("afterChangeaddress", this.address_data); 4666 }, 4667 afterClosemodal(){ 4668 this.$emit("afterClosemodal",this.provider); 4669 } 4670 // 4671 }, 4672 template : ` 4673 <el-dialog v-model="visible" :close-on-click-modal="false" :show-close="true" :title="label.exact_location" width="55%" @closed="afterClosemodal" > 4674 4675 <div class="position-relative" > 4676 4677 <component-auto-complete 4678 ref="auto_complete" 4679 :label="{ 4680 enter_address : label.enter_address 4681 }" 4682 :formatted_address="hasFormatAddress?getFormatAddress.address.formatted_address:''" 4683 @after-choose="afterChoose" 4684 > 4685 </component-auto-complete> 4686 4687 <div class="pt-2"></div> 4688 4689 <components-maps 4690 ref="cmaps" 4691 :keys="keys" 4692 :provider="provider" 4693 :zoom="zoom" 4694 size="map-lg-large" 4695 :center="center" 4696 :markers="markers" 4697 @after-selectmap="afterSelectmap" 4698 @drag-marker="dragMarker" 4699 > 4700 </components-maps> 4701 4702 <div v-if="!drag" class="w-100 position-absolute" style="bottom:20px;"> 4703 <div class="w-50 m-auto"> 4704 <button type="button" @click="setNewAdress" class="btn btn-green w-100" :class="{ loading: loading }" > 4705 <span class="label"> 4706 {{label.submit}} 4707 </span> 4708 <div class="m-auto circle-loader" data-loader="circle-side"></div> 4709 </button> 4710 </div> 4711 </div> 4712 4713 </div> 4714 4715 </el-dialog> 4716 `, 4717 }; 4718 4719 const ComponentsSavedAddress = { 4720 data() { 4721 return { 4722 loading : false, 4723 data : [], 4724 address_data : '' 4725 } 4726 }, 4727 created() { 4728 this.getSavedAddress(); 4729 }, 4730 computed: { 4731 getData(){ 4732 return this.data; 4733 }, 4734 totalCount(){ 4735 return Object.keys(this.data).length-1; 4736 }, 4737 hasSelectAddress(){ 4738 if (Object.keys(this.address_data).length > 0) { 4739 return false; 4740 } 4741 return true; 4742 } 4743 }, 4744 methods: { 4745 show(data){ 4746 if(data){ 4747 $(this.$refs.modal).modal('show'); 4748 } else { 4749 $(this.$refs.modal).modal('hide'); 4750 } 4751 }, 4752 getSavedAddress(){ 4753 this.loading = true; 4754 axios({ 4755 method: 'POST', 4756 url: ajaxurl+"/getAddresses" , 4757 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') , 4758 timeout: $timeout, 4759 }).then( response => { 4760 if(response.data.code==1){ 4761 this.data = response.data.details.data; 4762 } else { 4763 this.data = []; 4764 } 4765 }).catch(error => { 4766 // 4767 }).then(data => { 4768 this.loading = false; 4769 }); 4770 }, 4771 setAddress(data){ 4772 this.show(false); 4773 this.$emit("afterSelectaddress",data); 4774 } 4775 }, 4776 template : ` 4777 <div class="modal" ref="modal" id="modal" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true" data-backdrop="static" data-keyboard="false" > 4778 <div class="modal-dialog modal-dialog-centered" role="document"> 4779 <div class="modal-content"> 4780 <div class="modal-header border-bottom-0" > 4781 <h5 class="modal-title" id="exampleModalLongTitle">Saved Addresses</h5> 4782 <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 4783 <span aria-hidden="true">×</span> 4784 </button> 4785 </div> 4786 <div class="modal-body"> 4787 4788 <el-radio-group v-model="address_data" class="ml-4"> 4789 <template v-for="(items,index) in getData" :keys="items" > 4790 <el-radio :label="items" size="large"> 4791 <div class="text-dark font-weight-bold">{{items.attributes.address_label}}</div> 4792 <div class="text-truncatex max-width-addressx"> 4793 {{items.address.formatted_address_pretty}} 4794 </div> 4795 </el-radio> 4796 </template> 4797 </el-radio-group> 4798 4799 </div> 4800 4801 <div class="modal-footer"> 4802 <button type="button" class="btn btn-light" data-dismiss="modal">Cancel</button> 4803 <button @click="setAddress(address_data)" type="button" class="btn btn-green pl-3 pr-3" 4804 :disabled="hasSelectAddress" 4805 > 4806 Save 4807 </button> 4808 </div> 4809
4810 </div> 4811 </div> 4812 </div> 4813 `, 4814 }; 4815 4816 /* 4817 COMPONENTS ADDRESS FORM 4818 */ 4819 let cmapsMarker = []; 4820 const ComponentsAddressForm = { 4821 template: '#xtemplate_address_form', 4822 props : ['location_data'], 4823 data() { 4824 return { 4825 error : [], 4826 cmaps_config : [], 4827 address1 : '', 4828 formatted_address : '', 4829 location_name :'', 4830 delivery_options : '', 4831 delivery_options_data : [], 4832 delivery_instructions :'', 4833 address_label : '', 4834 address_label_data : [], 4835 cmaps_full : false, 4836 new_coordinates : [], 4837 is_loading : false, 4838 address2 : '', 4839 postal_code :'', 4840 company : '', 4841 street : '', 4842 house_number : '', 4843 city : '' 4844 } 4845 }, 4846 created() { 4847 this.getAddressAttributes(); 4848 }, 4849 watch: { 4850 location_data(newval,oldval){ 4851 if(empty(newval)){ 4852 return; 4853 } 4854 //console.log("location_data",newval); 4855 if ((typeof newval.parsed_address !== "undefined") && ( newval.parsed_address !== null)) { 4856 if(!empty(newval.parsed_address.street_name)){ 4857 this.formatted_address = newval.parsed_address.street_name; 4858 this.address1 = newval.parsed_address.street_number; 4859 this.street = newval.parsed_address.street_name; 4860 this.house_number = newval.parsed_address.street_number; 4861 } else { 4862 this.formatted_address = newval.address.formatted_address; 4863 this.address1 = newval.address.address1; 4864 } 4865 } else { 4866 this.formatted_address = newval.address.formatted_address; 4867 this.address1 = newval.address.address1; 4868 } 4869 4870 // this.formatted_address = newval.address.formatted_address; 4871 // this.address1 = newval.address.address1; 4872 4873 // this.address2 = newval.address.address2; 4874 // this.postal_code = newval.address.postal_code; 4875 // this.company = newval.address.company; 4876 4877 if(!empty(newval.attributes)){ 4878 this.location_name = newval.attributes.location_name; 4879 this.delivery_options = newval.attributes.delivery_options; 4880 this.delivery_instructions = newval.attributes.delivery_instructions; 4881 this.address_label = newval.attributes.address_label; 4882 } else { 4883 this.location_name = ''; 4884 this.delivery_instructions = ''; 4885 this.delivery_options = 'Leave it at my door'; 4886 this.address_label = 'Home'; 4887 } 4888 this.show(); 4889 } 4890 }, 4891 computed: { 4892 hasLocationData(){ 4893 if ((typeof this.location_data !== "undefined") && ( this.location_data !== null)) { 4894 var count = Object.keys(this.location_data).length; 4895 if(count>0){ 4896 return true; 4897 } 4898 } 4899 return false; 4900 }, 4901 hasNewCoordinates(){ 4902 var count = Object.keys(this.new_coordinates).length; 4903 if(count>0){ 4904 return true; 4905 } 4906 return false; 4907 }, 4908 }, 4909 methods: { 4910 show(){ 4911 this.cmaps_full = false; 4912 $( this.$refs.address_modal ).modal('show'); 4913 setTimeout(() => { 4914 this.renderMap(); 4915 }, 100); 4916 }, 4917 hide(){ 4918 this.error=[]; 4919 $(this.$refs.address_modal).modal('hide'); 4920 }, 4921 close(){ 4922 this.hide(); 4923 },
4924 setLoading(data){ 4925 this.is_loading = data; 4926 }, 4927 closeModal(){ 4928 dump('closeModal'); 4929 this.hide() 4930 this.$emit('afterClosemodal'); 4931 }, 4932 getAddressAttributes(){ 4933 axios({ 4934 method: 'POST', 4935 url: ajaxurl+"/getAddressAttributes" , 4936 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') , 4937 timeout: $timeout, 4938 }).then( response => { 4939 if(response.data.code==1){ 4940 this.cmaps_config = response.data.details.maps_config; 4941 this.delivery_options_data = response.data.details.delivery_option; 4942 this.address_label_data = response.data.details.address_label; 4943 this.delivery_options = response.data.details.default_atts.delivery_options; 4944 this.address_label = response.data.details.default_atts.address_label; 4945 } else { 4946 this.cmaps_config = []; 4947 this.delivery_options_data = []; 4948 this.address_label_data = []; 4949 } 4950 }).catch(error => { 4951 // 4952 }).then(data => { 4953 // 4954 }); 4955 }, 4956 renderMap(){ 4957 this.cmaps_provider = this.cmaps_config.provider; 4958 4959 switch(this.cmaps_provider){ 4960 case "google.maps": 4961 if ((typeof this.cmaps !== "undefined") && ( this.cmaps !== null)) { 4962 this.removeMarker(); 4963 } else { 4964 this.cmaps = new google.maps.Map( this.$refs.ref_map, { 4965 center: { lat: parseFloat(this.location_data.latitude), lng: parseFloat(this.location_data.longitude) }, 4966 zoom: parseInt(this.cmaps_config.zoom) , 4967 disableDefaultUI: true, 4968 }); 4969 } 4970 this.addMarker({ 4971 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 4972 map: this.cmaps, 4973 animation: google.maps.Animation.DROP, 4974 }); 4975 break; 4976 case "mapbox": 4977 mapboxgl.accessToken = this.cmaps_config.key; 4978 this.cmaps = new mapboxgl.Map({ 4979 container: this.$refs.ref_map, 4980 style: 'mapbox://styles/mapbox/streets-v12', 4981 center: [ parseFloat(this.location_data.longitude) , parseFloat(this.location_data.latitude)], 4982 zoom: 14 4983 }); 4984 this.addMarker({ 4985 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 4986 map: this.cmaps, 4987 icon : this.cmaps_config.icon, 4988 animation: null 4989 }); 4990 break; 4991 4992 case "yandex": 4993 this.initYandexDeliveryDetails(); 4994 break; 4995 4996 } 4997 }, 4998 async initYandexDeliveryDetails(){ 4999 await ymaps3.ready; 5000 const {YMap, YMapDefaultSchemeLayer,YMapMarker,YMapDefaultFeaturesLayer,YMapListener,YMapControls } = ymaps3; 5001 const {YMapDefaultMarker} = await ymaps3.import('@yandex/[email protected]'); 5002 const {YMapZoomControl,YMapGeolocationControl} = await ymaps3.import('@yandex/[email protected]'); 5003 5004 const LOCATION = { 5005 center: [ parseFloat(this.location_data.longitude), parseFloat(this.location_data.latitude) ], 5006 zoom: yandex_zoom 5007 }; 5008 5009 if (!yandex_map) { 5010 yandex_map = new YMap( 5011 this.$refs.ref_map, 5012 { 5013 location: LOCATION, 5014 showScaleInCopyrights: false, 5015 behaviors: ['drag','scrollZoom'] 5016 }, 5017 [ 5018 new YMapDefaultSchemeLayer({}), 5019 new YMapDefaultFeaturesLayer({}) 5020 ] 5021 ); 5022 5023 cmapsMarker = new YMapDefaultMarker({ 5024 coordinates: LOCATION.center, 5025 }); 5026 yandex_map.addChild(cmapsMarker); 5027 } else { 5028 console.debug('here here'); 5029 } 5030 }, 5031 addMarker(properties){ 5032 switch(this.cmaps_provider){ 5033 case "google.maps": 5034 cmapsMarker = new google.maps.Marker(properties); 5035 this.cmaps.panTo(new google.maps.LatLng(properties.position.lat,properties.position.lng)); 5036 break; 5037 case "mapbox": 5038 let markerProperties = {}; 5039 if(properties.draggable){ 5040 markerProperties = {draggable: true}; 5041 } 5042 cmapsMarker = new mapboxgl.Marker(markerProperties) 5043 .setLngLat([properties.position.lng, properties.position.lat]) 5044 .addTo(this.cmaps); 5045 break; 5046 } 5047 }, 5048 removeMarker(){ 5049 switch(this.cmaps_provider){ 5050 case "google.maps": 5051 cmapsMarker.setMap(null); 5052 break; 5053 case "mapbox": 5054 cmapsMarker.remove(); 5055 break; 5056 } 5057 },
5058 adjustPin(){ 5059 this.new_coordinates = []; 5060 this.cmaps_full = true; 5061 try { 5062 this.removeMarker(); 5063 } catch(err) { 5064 dump(err); 5065 } 5066 5067 console.log("adjustPin" , this.cmaps_provider); 5068 5069 this.addMarker({ 5070 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 5071 map: this.cmaps, 5072 animation: this.cmaps_provider=="google.maps" ? google.maps.Animation.DROP : null, 5073 draggable:true, 5074 }); 5075 5076 if(this.cmaps_provider=="google.maps"){ 5077 cmapsMarker.addListener('dragend', event => { 5078 this.new_coordinates = { 5079 'lat': event.latLng.lat(), 5080 'lng': event.latLng.lng(), 5081 }; 5082 }); 5083 } else if ( this.cmaps_provider=="mapbox" ) { 5084 cmapsMarker.on('dragend', (event)=>{ 5085 const lngLat = cmapsMarker.getLngLat(); 5086 this.new_coordinates = { 5087 'lat': lngLat.lat, 5088 'lng': lngLat.lng, 5089 }; 5090 }); 5091 this.mapBoxResize(); 5092 } else if ( this.cmaps_provider=="yandex" ) { 5093 const LOCATION = { 5094 center: [ parseFloat(this.location_data.longitude), parseFloat(this.location_data.latitude) ], 5095 zoom: yandex_zoom 5096 }; 5097 cmapsMarker.update({ 5098 coordinates : LOCATION.center, 5099 draggable: true, 5100 onDragEnd: (coordinates)=>{ 5101 console.log("onDragEnd",coordinates); 5102 this.new_coordinates = { 5103 'lat': coordinates[1], 5104 'lng': coordinates[0], 5105 }; 5106 } 5107 }); 5108 } 5109 // end if 5110 }, 5111 cancelPin(){ 5112 this.error = []; 5113 this.cmaps_full=false; 5114 5115 if(this.cmaps_provider=="yandex"){ 5116 const LOCATION = { 5117 center: [ parseFloat(this.location_data.longitude), parseFloat(this.location_data.latitude) ], 5118 zoom: yandex_zoom 5119 }; 5120 cmapsMarker.update({ 5121 coordinates : LOCATION.center, 5122 draggable: false 5123 }); 5124 } else { 5125 this.removeMarker(); 5126 this.addMarker({ 5127 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 5128 map: this.cmaps, 5129 animation: this.cmaps_provider=="google.maps" ? google.maps.Animation.DROP : null, 5130 }); 5131 this.mapBoxResize(); 5132 } 5133 }, 5134 mapBoxResize(){ 5135 if(this.cmaps_provider=="mapbox"){ 5136 setTimeout(()=>{ 5137 this.cmaps.resize(); 5138 }, 500); 5139 } 5140 }, 5141 setNewCoordinates(){ 5142 let params = "YII_CSRF_TOKEN="+$('meta[name=YII_CSRF_TOKEN]').attr('content'); 5143 params+="&cart_uuid="+getCookie('cart_uuid'); 5144 params+="&lat="+this.location_data.latitude; 5145 params+="&lng="+this.location_data.longitude; 5146 params+="&new_lat="+this.new_coordinates.lat; 5147 params+="&new_lng="+this.new_coordinates.lng; 5148 axios({ 5149 method: 'POST', 5150 url: ajaxurl + "/checkoutValidateCoordinates" , 5151 data : params, 5152 timeout: $timeout, 5153 }).then( response => { 5154 if(response.data.code==1){ 5155 this.location_data.latitude = this.new_coordinates.lat; 5156 this.location_data.longitude = this.new_coordinates.lng; 5157 this.cmaps_full=false; 5158 this.removeMarker(); 5159 this.addMarker({ 5160 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 5161 map: this.cmaps, 5162 animation: this.cmaps_provider=="google.maps" ? google.maps.Animation.DROP : null, 5163 }); 5164 this.mapBoxResize(); 5165 } else { 5166 ElementPlus.ElNotification({ 5167 title: "", 5168 message: response.data.msg[0], 5169 position: 'bottom-right', 5170 type: 'warning', 5171 }); 5172 } 5173 }).catch(error => { 5174 // 5175 }).then(data => { 5176 5177 }); 5178 }, 5179 save(){ 5180 this.$emit('onSavelocation',this.location_data,{ 5181 address1 : this.address1, 5182 formatted_address : this.formatted_address, 5183 location_name : this.location_name, 5184 delivery_options : this.delivery_options, 5185 address_label : this.address_label, 5186 delivery_instructions : this.delivery_instructions, 5187 address2 : this.address2, 5188 postal_code : this.postal_code, 5189 company : this.company, 5190 address_format_use : this.cmaps_config.address_format_use, 5191 }); 5192 }, 5193 // 5194 }, 5195 }; 5196 5197 // END 1.0.8 COMPONENTS 5198 5199 /* 5200 =============================================================================== 5201 END OF ALL COMPONENTS 5202 =============================================================================== 5203 */ 5204 5205 5206 /* 5207 LOADING BOX 5208 */ 5209 const vm_loading = Vue.createApp({ 5210 components: { 5211 'components-loading-box': loadingBox, 5212 }, 5213 }).mount('#vue-loading-box'); 5214 5215 5216 /* 5217 HOME SEARCH 5218 */ 5219 const vm_search = Vue.createApp({ 5220 components: { 5221 'component-home-search' : ComponentsSearch, 5222 }, 5223 }).mount('#vue-home-search'); 5224 5225 const vm_search_mobile = Vue.createApp({ 5226 components: { 5227 'component-home-search' : ComponentsSearch, 5228 }, 5229 }).mount('#vue-home-search-mobile'); 5230 5231 5232 /* 5233 COMPONENTS CAROUSEL 5234 */ 5235 //let owl; 5236 const ComponentsCarousel = { 5237 props: ['title','featured_name','settings','responsive'], 5238 data(){ 5239 return { 5240 is_loading : false, 5241 owl : undefined, 5242 data : [], 5243 services : [], 5244 estimation : [], 5245 location_details : [], 5246 isFirstSlide: true, 5247 isLastSlide: false, 5248 }; 5249 }, 5250 mounted () { 5251 this.GetFeaturedLocation(); 5252 }, 5253 computed: { 5254 hasData(){ 5255 if(this.data.length>0){ 5256 return true; 5257 } 5258 return false;
5259 }, 5260 classObject() { 5261 return { 5262 'w-100' : this.settings.theme==='rounded', 5263 'w-75' : this.settings.theme==='rounded-circle' 5264 } 5265 } 5266 }, 5267 methods: { 5268 GetFeaturedLocation(){ 5269 var $params = { 5270 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 5271 'featured_name': this.featured_name 5272 }; 5273 var timenow = getTimeNow(); 5274 $params = JSON.stringify($params); 5275 5276 ajax_request[timenow] = $.ajax({ 5277 url: ajaxurl+"/GetFeaturedLocation", 5278 method: "PUT", 5279 dataType: "json", 5280 data: $params , 5281 contentType : $content_type.json , 5282 timeout: $timeout, 5283 crossDomain: true, 5284 beforeSend: data => { 5285 this.is_loading = true; 5286 if(ajax_request[timenow] != null) { 5287 ajax_request[timenow].abort(); 5288 } 5289 } 5290 }); 5291 5292 ajax_request[timenow].done( data => { 5293 if ( data.code==1){ 5294 this.location_details = data.details.location_details; 5295 this.data = data.details.data; 5296 this.services = data.details.services; 5297 this.estimation = data.details.estimation; 5298 setTimeout(() => { 5299 this.RenderCarousel(); 5300 }, 1); 5301 } else { 5302 this.location_details = ''; 5303 this.data = ''; 5304 this.services = ''; 5305 this.estimation = ''; 5306 } 5307 }); 5308 5309 ajax_request[timenow].always( data => { 5310 this.is_loading = false; 5311 }); 5312 5313 }, 5314 RenderCarousel(){ 5315 let $is_rtl = false; 5316 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 5317 $is_rtl = is_rtl=='1'?true:false; 5318 } 5319 this.owl = $(this.$refs.owl_carousel).owlCarousel({ 5320 items: parseInt(this.settings.items), 5321 lazyLoad: this.settings.lazyLoad=="1"?true:false , 5322 loop: this.settings.loop=="1"?true:false , 5323 margin: parseInt(this.settings.margin) , 5324 nav: this.settings.nav=="1"?true:false , 5325 dots: this.settings.dots=="1"?true:false , 5326 stagePadding: parseInt(this.settings.stagePadding), 5327 responsive : this.responsive, 5328 rtl : $is_rtl, 5329 onChanged: (event) => { 5330 this.updateCarouselNav(event); 5331 } 5332 }); 5333 }, 5334 updateCarouselNav(event) { 5335 const current = event.item.index; 5336 const count = event.item.count; 5337 //const visible = event.page?.size || this.settings.items; 5338 const visible = $("#item-suggestion-list .owl-item.active").length - 1; 5339 this.isFirstSlide = current === 0; 5340 this.isLastSlide = (current + visible) >= count; 5341 }, 5342 SlideNext(){ 5343 this.owl.trigger('next.owl.carousel'); 5344 if (!this.isLastSlide) { 5345 $('#item-suggestion-list').trigger('next.owl.carousel'); 5346 } 5347 }, 5348 SlidePrev(){ 5349 this.owl.trigger('prev.owl.carousel', [300]); 5350 if (!this.isFirstSlide) { 5351 $('#item-suggestion-list').trigger('prev.owl.carousel'); 5352 } 5353 }, 5354 }, 5355 template: ` 5356 5357 <DIV class="mt-5 mb-5"> 5358 5359 <div class="row no-gutters mb-4 " v-if="hasData" > 5360 <div class="col d-flex justify-content-start align-items-center "> 5361 <h5 class="m-0 section-title"> 5362 {{title}} <span>{{location_details.location_name}}</span> 5363 </h5> 5364 </div> 5365 <div class="col d-flex justify-content-end align-items-center "> 5366 <a @click="SlidePrev" href="javascript:;" class="owl-carousel-nav prev mr-4"> </a> 5367 <a @click="SlideNext" href="javascript:;" class="owl-carousel-nav next"> </a> 5368 </div> <!--col--> 5369 </div> <!--row--> 5370 5371 <div ref="owl_carousel" class="owl-carousel restaurant-carousel" :class="settings.theme" v-if="hasData" > 5372 5373 <div v-for="item in data" class="row equal align-items-center position-relative" 5374 :class="classObject" 5375 > 5376 5377 <template v-for="(cuisine,index) in item.cuisine_name" > 5378 <template v-if="index <= 0"> 5379 5380 <span class="badge mr-1 top-left" v-if="settings.theme==='rounded'" 5381 :style="'background:'+cuisine.bgcolor+';font-color:'+cuisine.fncolor" 5382 >{{cuisine.cuisine_name}}</span> 5383 5384 <div class="rounded-pill badge top-right" v-if="item.ratings.rating>0" 5385 :style="'background:'+cuisine.bgcolor+';font-color:'+cuisine.fncolor" 5386 > 5387 {{item.ratings.rating}} 5388 </div> 5389 5390 </template> 5391 </template> 5392 5393 5394 <div class="w-100 list-items p-0 " > 5395 <a :href="item.merchant_url" ><img :class="settings.theme" :src="item.url_logo" /></a> 5396 </div> 5397 5398 <!--ROUNDED TEMPLATE-->
5399 <template v-if="settings.theme==='rounded'"> 5400 <div class="d-flex justify-content-between mt-2 w-100 pl-1 pr-1 "> 5401 <div class="flex-col "> 5402 <a :href="item.merchant_url" ><h6>{{item.restaurant_name}}</h6></a> 5403 </div> 5404 </div> <!--flex--> 5405 5406 <div class="d-flex justify-content-between w-100 pl-1 pr-1"> 5407 <div class="flex-col"> 5408 <p class="m-0"> 5409 <i class="zmdi zmdi-time mr-1"></i> 5410 5411 <template v-if="estimation[item.merchant_id]"> 5412 <template v-if="services[item.merchant_id]"> 5413 <template v-for="(service_name,index_service) in services[item.merchant_id]" > 5414 <template v-if="index_service<=0"> 5415 5416 <template v-if="estimation[item.merchant_id][service_name]"> 5417 <template v-if="estimation[item.merchant_id][service_name][item.charge_type] "> 5418 {{ estimation[item.merchant_id][service_name][item.charge_type].estimation }} <?php echo t("min")?> 5419 </template> 5420 </template> 5421 5422 </template> 5423 </template> 5424 </template> 5425 </template> 5426 5427 </p> 5428 </div> 5429 <div class="flex-col"><p class="m-0" v-if="item.free_delivery==='1'" >{{ settings.free_delivery}}</p></div> 5430 </div> <!--flex--> 5431 </template> 5432 <!--END ROUNDED TEMPLATE--> 5433 5434 <!-- ROUNDED CIRCLE TEMPLATE--> 5435 <template v-else > 5436 <div class="mt-3 text-center w-100"> 5437 <a :href="item.merchant_url" ><h6 class="mb-1">{{item.restaurant_name}}</h6></a> 5438 5439 <template v-for="(cuisine,index) in item.cuisine_name" > 5440 <template v-if="index <= 0"> 5441 5442 <span class="badge" 5443 :style="'background:'+cuisine.bgcolor+';font-color:'+cuisine.fncolor" 5444 >{{cuisine.cuisine_name}}</span> 5445 5446 5447 </template> 5448 </template> 5449 5450 </div> 5451 </template> 5452 <!-- END ROUNDED CIRCLE TEMPLATE--> 5453 5454 </div> <!-- row--> 5455 5456 </div><!-- owl-carousel--> 5457 5458 </DIV> 5459 ` 5460 }; 5461 5462 //NEW COMPONENT 5463 const componentCategory = { 5464 props: ['data'], 5465 data(){ 5466 return { 5467 owl : undefined, 5468 }; 5469 }, 5470 mounted(){ 5471 }, 5472 watch: { 5473 data(new_data,old_data){ 5474 setTimeout(() => { 5475 this.renderCarousel(); 5476 }, 1); 5477 } 5478 }, 5479 methods: { 5480 renderCarousel(){ 5481 this.owl = $(this.$refs.category_carousel).owlCarousel({ 5482 loop:true, 5483 dots:false, 5484 nav:false, 5485 autoWidth:true, 5486 }); 5487 }, 5488 }, 5489 template: ` 5490 <div ref="category_carousel" class="owl-carousel owl-theme category_carousel"> 5491 <div v-for="(item, index) in data" class="mr-2"> 5492 <a :href="item.url" class="d-block bg-little-dark rounded-pill" 5493 :class="{active : index==0 }" 5494 > 5495 {{item.category_name}} 5496 </a> 5497 </div> 5498 </div> 5499 ` 5500 }; 5501 5502 const componentCuisine = { 5503 props: ['data'], 5504 data(){ 5505 return { 5506 owl : undefined, 5507 }; 5508 }, 5509 mounted(){ 5510 5511 }, 5512 watch: { 5513 data(new_data,old_data){ 5514 setTimeout(() => { 5515 this.renderCarousel(); 5516 }, 1); 5517 } 5518 }, 5519 methods: { 5520 renderCarousel(){ 5521 let $is_rtl = false; 5522 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 5523 $is_rtl = is_rtl=='1'?true:false; 5524 } 5525 this.owl = $(this.$refs.cuisine_carousel).owlCarousel({ 5526 loop:true, 5527 dots:false, 5528 nav:false, 5529 autoWidth:true, 5530 rtl : $is_rtl 5531 }); 5532 }, 5533 }, 5534 template: ` 5535 <div ref="cuisine_carousel" class="owl-carousel owl-theme cuisine_carousel"> 5536 <div v-for="(item, index) in data" class="mr-2"> 5537 <a :href="item.url" class="d-block bg-light rounded-pill" 5538 :class="{active : index==0 }" 5539 > 5540 {{item.cuisine_name}} 5541 </a> 5542 </div> 5543 </div> 5544 ` 5545 }; 5546 5547 //NEW COMPONENT 5548 const componentCategoryList = { 5549 props: ['data'], 5550 data(){ 5551 return { 5552 owl : undefined, 5553 slug : 'vorspeisen' 5554 }; 5555 }, 5556 mounted(){ 5557 var currentUrl = window.location.pathname.split('/'); 5558 var item_slug = currentUrl.pop() || currentUrl.pop(); 5559 this.slug = item_slug; 5560 }, 5561 watch: { 5562 data(new_data,old_data){ 5563 setTimeout(() => { 5564 this.renderCarousel(); 5565 }, 1); 5566 } 5567 }, 5568 methods: { 5569 renderCarousel(){ 5570 this.owl = $(this.$refs.category_carousel).owlCarousel({ 5571 loop:true, 5572 dots:false, 5573 nav:true, 5574 autoWidth:true, 5575 }); 5576 5577 $(".category_carousel").trigger("to.owl.carousel", [$(".category_carousel").find(".catactive").attr('id'), 500, true]); 5578 }, 5579 }, 5580 template: ` 5581 <div ref="category_carousel" class="owl-carousel owl-theme category_carousel"> 5582 <div v-for="(item, index) in data" class="mr-2"> 5583 <a :href="item.url" class="d-block bg-little-dark rounded-pill" 5584 :class="{active : item.slug==this.slug }" 5585 > 5586 <span :class="{catactive : item.slug==this.slug}" :id="index">{{item.category_name}}</span> 5587 </a> 5588 </div> 5589 </div> 5590 ` 5591 }; 5592 5593 const componentThreeSteps = { 5594 props: ['responsive','label'], 5595 data(){ 5596 return { 5597 owl : undefined, 5598 }; 5599 }, 5600 mounted(){ 5601 this.renderCarousel(); 5602 }, 5603 methods : { 5604 renderCarousel(){ 5605 let $is_rtl = false;
5606 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 5607 $is_rtl = is_rtl=='1'?true:false; 5608 } 5609 this.owl = $(this.$refs.carousel_three_steps).owlCarousel({ 5610 rtl : $is_rtl, 5611 loop:true, 5612 dots:true, 5613 nav:false, 5614 responsive:{ 5615 0:{ 5616 items:1, 5617 loop : false, 5618 }, 5619 320:{ 5620 items:1, 5621 loop : false, 5622 }, 5623 480:{ 5624 items:1, 5625 loop : false, 5626 }, 5627 600:{ 5628 items:1, 5629 loop : false, 5630 }, 5631 700:{ 5632 items:2, 5633 loop : false, 5634 }, 5635 1000:{ 5636 items:2, 5637 loop : false, 5638 } 5639 } 5640 }); 5641 }, 5642 }, 5643 template: '#three-steps-ordering', 5644 }; 5645 5646 /* 5647 COMPONENTS ITEM FEATURED 5648 */ 5649 const ComponentsItemFeaturedSuggestion = { 5650 props: ['title','merchant_id','settings','image_use' , 'responsive'], 5651 components : { 5652 'money-format': ComponentsMoney, 5653 }, 5654 data(){ 5655 return { 5656 owl : undefined, 5657 menu_data: [], 5658 items : [], 5659 item_addons : [], 5660 item_addons_load : false, 5661 size_id : 0, 5662 disabled_cart : true, 5663 item_qty : 1, 5664 item_total : 0, 5665 add_to_cart : false, 5666 meta : [], 5667 special_instructions : '', 5668 sold_out_options : [], 5669 if_sold_out : 'substitute', 5670 transaction_type : '', 5671 item_loading :false, 5672 item_gallery : [], 5673 image_featured : '', 5674 money_config : '', 5675 showText: null, 5676 isFirstSlide: true, 5677 isLastSlide: false, 5678 }; 5679 }, 5680 mounted () { 5681 this.itemSuggestion(); 5682 }, 5683 updated () { 5684 if(this.item_addons_load==true){ 5685 this.ItemSummary(); 5686 $('.item_s .lazy').each(function(index, $obj){ 5687 if ( !empty($(this).attr("src")) && !empty($(this).attr("data-src")) ){ 5688 $(this).attr("src", $(this).attr("data-src") ); 5689 } 5690 }); 5691 } 5692 5693 if ((typeof vm_checkout_transaction !== "undefined") && ( vm_checkout_transaction !== null)) { 5694 this.transaction_type = vm_checkout_transaction.transaction_type; 5695 } 5696 5697 }, // 5698 computed: { 5699 getItemGallery(){ 5700 return this.item_gallery; 5701 } 5702 }, 5703 methods: { 5704 toggleText(idx) { 5705 this.showText === idx ? this.showText = null : this.showText = idx 5706 }, 5707 itemSuggestion(){ 5708 let currency_code = getCookie('currency_code'); 5709 currency_code = !empty(currency_code)?currency_code:''; 5710 var $params = { 5711 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 5712 'merchant_id' : this.merchant_id, 5713 'with_item_filter' : 1, 5714 'image_use' : this.image_use, 5715 'currency_code': currency_code 5716 }; 5717 var timenow = getTimeNow(); 5718 $params = JSON.stringify($params); 5719 ajax_request[timenow] = $.ajax({ 5720 url: ajaxurl+"/geStoreMenu", 5721 method: "PUT", 5722 dataType: "json", 5723 data: $params , 5724 contentType : $content_type.json , 5725 timeout: $timeout, 5726 crossDomain: true, 5727 beforeSend: data => { 5728 this.is_loading = true; 5729 if(ajax_request[timenow] != null) { 5730 ajax_request[timenow].abort(); 5731 } 5732 } 5733 }).done( data => { 5734 if ( data.code==1){ 5735 var $category = data.details.data.category; 5736 var $items = data.details.data.items; 5737 var $new_category = []; var $new_items = []; 5738 5739 /*if($category.length>0){ 5740 $.each($category, function(key, val){ 5741 $.each(val.items, function(items_key, $item_id){ 5742 $new_items.push( $items[$item_id] ); 5743 }); // loop 5744 $new_category.push({ 5745 'cat_id': val.cat_id, 5746 'category_name': val.category_name, 5747 'category_uiid': val.category_uiid, 5748 'items':$new_items 5749 }); 5750 $new_items = []; 5751 }); // loop 5752 }*/ 5753 5754 $new_category.push({ 5755 'cat_id': 1, 5756 'category_name': 1, 5757 'category_uiid': 1, 5758 'items':$items 5759 }); 5760 5761 this.menu_data = $new_category; 5762 console.log("menu_data",this.menu_data); 5763 setTimeout(() => { 5764 this.RenderCarousel(); 5765 }, 10); 5766 5767 } else this.menu_data = []; 5768 }).always( data => { 5769 this.is_loading = false;
5770 }); 5771 }, 5772 RenderCarousel(){ 5773 this.owl = $("#item-suggestion-list").owlCarousel({ 5774 items: parseInt(this.settings.items), 5775 lazyLoad: this.settings.lazyLoad=="1"?true:false , 5776 loop: this.settings.loop=="1"?true:false , 5777 margin: parseInt(this.settings.margin) , 5778 nav: this.settings.nav=="1"?true:false , 5779 dots: this.settings.dots=="1"?true:false , 5780 stagePadding: parseInt(this.settings.stagePadding), 5781 autoWidth:true, 5782 onChanged: (event) => { 5783 this.updateCarouselNav(event); 5784 } 5785 }); 5786 }, 5787 updateCarouselNav(event) { 5788 const current = event.item.index; 5789 const count = event.item.count; 5790 //const visible = event.page?.size || this.settings.items; 5791 const visible = $("#item-suggestion-list .owl-item.active").length - 1; 5792 this.isFirstSlide = current === 0; 5793 this.isLastSlide = (current + visible) >= count; 5794 }, 5795 SlideNext(){ 5796 this.owl.trigger('next.owl.carousel'); 5797 if (!this.isLastSlide) { 5798 $('#item-suggestion-list').trigger('next.owl.carousel'); 5799 } 5800 }, 5801 SlidePrev(){ 5802 this.owl.trigger('prev.owl.carousel', [300]); 5803 if (!this.isFirstSlide) { 5804 $('#item-suggestion-list').trigger('prev.owl.carousel'); 5805 } 5806 }, 5807 viewItem(data){ 5808 this.item_loading = true; 5809 NProgress.start(); 5810 5811 let currency_code = getCookie('currency_code'); 5812 currency_code = !empty(currency_code)?currency_code:''; 5813 5814 var $params = { 5815 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 5816 'merchant_id': this.merchant_id, 5817 'item_uuid' : data.item_uuid, 5818 'cat_id' : data.cat_id, 5819 'currency_code': currency_code, 5820 'lang': document.documentElement.lang 5821 }; 5822 var timenow = 1; 5823 $params = JSON.stringify($params); 5824 5825 ajax_request[timenow] = $.ajax({ 5826 url: ajaxurl+"/getMenuItem", 5827 method: "PUT", 5828 dataType: "json", 5829 data: $params , 5830 contentType : $content_type.json , 5831 timeout: $timeout, 5832 crossDomain: true, 5833 beforeSend: data => { 5834 if(ajax_request[timenow] != null) { 5835 ajax_request[timenow].abort(); 5836 } 5837 } 5838 }).done( data => { 5839 5840 if(data.code==1){ 5841 5842 $global_items = data.details.data.items; 5843 $global_addons = data.details.data.addons; 5844 $global_addon_items = data.details.data.addon_items; 5845 $global_item_addons = data.details.data.items.item_addons; 5846 5847 this.money_config = data.details.money_config; 5848 this.item_gallery = data.details.data.meta.item_gallery; 5849 this.image_featured = ''; 5850 this.renderGallery(); 5851 5852 var $meta = data.details.data.meta; 5853 var $meta_details = data.details.data.meta_details; 5854 var $new_meta = { 5855 'cooking_ref' : [], 5856 'ingredients' : [], 5857 'dish' : [], 5858 }; 5859 5860 let $ingredients_preselected = data.details.data.items.ingredients_preselected; 5861 5862 if( !empty($meta)){ 5863 $.each($meta,function(key, item) { 5864 $.each(item,function(key2, item2) { 5865 if(!empty($meta_details[key])){ 5866 if(!empty($meta_details[key][item2])){ 5867 let $defaul_check = false; 5868 if(key=="ingredients" && $ingredients_preselected){ 5869 $defaul_check = true; 5870 } 5871 $new_meta[key].push({ 5872 'meta_id': $meta_details[key][item2].meta_id, 5873 'meta_name': $meta_details[key][item2].meta_name, 5874 'checked': $defaul_check 5875 }); 5876 } 5877 } 5878 }); 5879 }); 5880 } 5881 5882 var $price = $global_items.price; 5883 var $size_id = Object.keys($price)[0]; 5884 5885 this.item_qty = 1; 5886 this.service = getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery'; 5887 this.items = $global_items; 5888 this.size_id = $size_id; 5889 this.meta = $new_meta; 5890 this.getSizeData($size_id); 5891 this.sold_out_options = data.details.sold_out_options; 5892 5893 $( this.$refs.modal_item_details ).modal('show'); 5894 this.updateImage(); 5895 5896 } /*end if*/ 5897 5898 }).always( data => { 5899 this.item_loading = false;
5900 NProgress.done(); 5901 }); 5902 }, 5903 renderGallery(){ 5904 setTimeout(() => { 5905 $(this.$refs.owl_item_gallery).owlCarousel({ 5906 loop:false, 5907 margin:10, 5908 nav:false, 5909 dots:false, 5910 responsive:{ 5911 0:{ 5912 items:1 5913 }, 5914 600:{ 5915 items:3 5916 }, 5917 1000:{ 5918 items:5 5919 } 5920 } 5921 }); 5922 }, 10); 5923 }, 5924 setImage(data){ 5925 this.image_featured = data; 5926 }, 5927 updateImage(){ 5928 updateLazyImage(); 5929 }, 5930 setItemSize(event){ 5931 var $size_id = event.currentTarget.firstElementChild.value; 5932 this.size_id = $size_id; 5933 this.getSizeData($size_id); 5934 }, // end setItemSize 5935 getSizeData($size_id){ 5936 var item_size_id = $global_items.price[$size_id].size_id; 5937 $new_item_addons = []; var $sub_items=[]; 5938 if( !empty($global_item_addons[$size_id]) ){ 5939 $.each($global_item_addons[$size_id],function(key, item) { 5940 if(!empty($global_addons[$size_id])){ 5941 if(!empty($global_addons[$size_id][item])){ 5942 $global_addons[$size_id][item].subcat_id 5943 $.each($global_addons[$size_id][item].sub_items,function(key2, item2) { 5944 if ((typeof $global_addon_items[item2] !== "undefined") && ( $global_addon_items[item2] !== null)) { 5945 $sub_items.push({ 5946 'sub_item_id':$global_addon_items[item2].sub_item_id, 5947 'sub_item_name':$global_addon_items[item2].sub_item_name, 5948 'item_description':$global_addon_items[item2].item_description, 5949 //'price':$global_addon_items[item2].price, 5950 //'pretty_price':$global_addon_items[item2].pretty_price, 5951 'price':$global_addon_items[item2].addon_price != '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 5952 'pretty_price':$global_addon_items[item2].addon_price!= '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 5953 'checked':false, 5954 'disabled':false, 5955 'qty':1 5956 }); 5957 } 5958 }); 5959 5960 $new_item_addons.push({ 5961 'subcat_id' : $global_addons[$size_id][item].subcat_id, 5962 'subcategory_name' : $global_addons[$size_id][item].subcategory_name, 5963 'subcategory_description' : $global_addons[$size_id][item].subcategory_description, 5964 'multi_option' : $global_addons[$size_id][item].multi_option, 5965 'multi_option_min' : $global_addons[$size_id][item].multi_option_min, 5966 'multi_option_value' : $global_addons[$size_id][item].multi_option_value, 5967 'require_addon' : $global_addons[$size_id][item].require_addon, 5968 'pre_selected' : $global_addons[$size_id][item].pre_selected, 5969 'sub_items_checked':$global_addons[$size_id][item].multi_option == "one" ? $sub_items[0].sub_item_id : '', 5970 'sub_items':$sub_items 5971 }); 5972 $sub_items = [] ; 5973 } 5974 } 5975 }); 5976 } 5977 this.item_addons = $new_item_addons; 5978 this.item_addons_load = true; 5979 }, // end getSizeData 5980 ItemSummary(data){ 5981 $item_total = 0; 5982 var $required_addon = []; 5983 var $required_addon_added = []; 5984 let $min_addon = []; 5985 let $min_addon_added = []; 5986 5987 if(!empty(this.items.price)){ 5988 if(!empty(this.items.price[this.size_id])){ 5989 var item = this.items.price[this.size_id]; 5990 if( item.discount>0){ 5991 $item_total+=( this.item_qty * parseFloat(item.price_after_discount) ); 5992 } else $item_total+=( this.item_qty * parseFloat(item.price) ); 5993 } 5994 } 5995 5996 dump("item_total=>" + $item_total); 5997 5998 this.item_addons.forEach((item,index) => { 5999 6000 //dump("=>" + item.multi_option); 6001 if ( item.require_addon==1){ 6002 $required_addon.push(item.subcat_id); 6003 } 6004 6005 if(item.multi_option=="custom"){ 6006 var total_check = 0; 6007 let multi_option_min = item.multi_option_min; 6008 var multi_option_value = item.multi_option_value; 6009 var item_index=[]; var item_index2=[]; 6010 6011 if(multi_option_value>0){ 6012 $min_addon.push({ 6013 'subcat_id': item.subcat_id, 6014 'min':multi_option_min, 6015 'max':multi_option_value 6016 }); 6017 } 6018
6019 item.sub_items.forEach((item2,index2) => { 6020 if(item2.checked==true){ 6021 total_check++; 6022 $item_total+=( this.item_qty * parseFloat(item2.price) ); 6023 $required_addon_added.push( item.subcat_id ); 6024 } else item_index.push(index2); 6025 6026 if(item2.disabled==true){ 6027 item_index2.push(index2); 6028 } 6029 6030 }) 6031 6032 $min_addon_added[item.subcat_id] = { 6033 'total' : total_check 6034 }; 6035 6036 if(total_check>=multi_option_value){ 6037 item_index.forEach((item3,index3) => { 6038 this.item_addons[index].sub_items[item3].disabled = true; 6039 }); 6040 } else { 6041 item_index2.forEach((item3,index3) => { 6042 this.item_addons[index].sub_items[item3].disabled = false; 6043 }); 6044 } 6045 6046 } else if ( item.multi_option=="one" ){ 6047 item.sub_items.forEach((item2,index2) => { 6048 if( item2.sub_item_id == item.sub_items_checked ) { 6049 $item_total+=( this.item_qty * parseFloat(item2.price) ); 6050 $required_addon_added.push( item.subcat_id ); 6051 } 6052 }); 6053 } else if ( item.multi_option=="multiple" ){ 6054 6055 var item_index=[]; 6056 let multi_option_min = item.multi_option_min; 6057 var multi_option_value = item.multi_option_value; 6058 var limit = 0; 6059 6060 if(multi_option_value>0){ 6061 $min_addon.push({ 6062 'subcat_id': item.subcat_id, 6063 'min':multi_option_min, 6064 'max':multi_option_value 6065 }); 6066 } 6067 6068 item.sub_items.forEach((item2,index2) => { 6069 if(item2.checked==true){ 6070 $item_total+=( item2.qty * parseFloat(item2.price) ); 6071 $required_addon_added.push( item.subcat_id ); 6072 limit += item2.qty; 6073 } 6074 item_index.push(index2); 6075 }); 6076 6077 $min_addon_added[item.subcat_id] = { 6078 'total' : limit 6079 }; 6080 6081 this.item_addons[index].qty_selected =limit; 6082 if ( this.item_addons[index].qty_selected>= multi_option_value){ 6083 item_index.forEach((item3,index2) => { 6084 this.item_addons[index].sub_items[item3].disabled = true; 6085 }); 6086 } else { 6087 item_index.forEach((item3,index2) => { 6088 this.item_addons[index].sub_items[item3].disabled = false; 6089 }); 6090 } 6091 6092 } /*endif custom*/ 6093 6094 });/* end loop*/ 6095 6096 6097 this.item_total = $item_total; 6098 6099 var $required_meet=true; 6100 if($required_addon.length>0){ 6101 $.each($required_addon, function(i, val){ 6102 if($required_addon_added.includes(val)===false){ 6103 $required_meet = false; 6104 return false; 6105 } 6106 }); 6107 } 6108 6109 // CHECK COOKING REF 6110 if(this.items.cooking_ref_required){ 6111 let $cooking_ref_check = false; 6112 if (Object.keys(this.meta.cooking_ref).length > 0) { 6113 Object.entries(this.meta.cooking_ref).forEach(([cooking_key, cooking_items]) => { 6114 if(cooking_items.checked){ 6115 $cooking_ref_check = true; 6116 } 6117 }); 6118 } 6119 if(!$cooking_ref_check){ 6120 $required_meet = false; 6121 } 6122 } 6123 6124 if (Object.keys($min_addon).length > 0) { 6125 let min_value,min_selected; 6126 Object.entries($min_addon).forEach(([key_min_addon, items_min_addon]) => { 6127 min_value = parseInt(items_min_addon.min); 6128 if($min_addon_added[items_min_addon.subcat_id]){ 6129 min_selected = parseInt($min_addon_added[items_min_addon.subcat_id].total); 6130 } 6131 if(min_selected>0){ 6132 if(min_value>min_selected){ 6133 $required_meet = false; 6134 } 6135 } 6136 }); 6137 } 6138 6139 if($required_meet){ 6140 this.disabled_cart = false; 6141 } else this.disabled_cart = true; 6142 6143 }, // end ItemSummary 6144 CheckaddCartItems(){ 6145 this.addCartItems(); 6146 }, 6147 addCartItems(event){ 6148 if (event) { 6149 event.preventDefault() 6150 } 6151 6152 this.add_to_cart = true; 6153 6154 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 6155
6156 try { 6157 if(empty(transactionType)){ 6158 if ((typeof vm_merchant_details.$refs.ref_services !== "undefined") && ( vm_merchant_details.$refs.ref_services !== null)) { 6159 transactionType = vm_merchant_details.$refs.ref_services.transaction; 6160 } else if ( (typeof vm_merchant_details.$refs.ref_location_services !== "undefined") && ( vm_merchant_details.$refs.ref_location_services !== null) ){ 6161 transactionType = vm_merchant_details.$refs.ref_location_services.transaction_type; 6162 } 6163 } 6164 } catch(err){} 6165 var $params = { 6166 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6167 'merchant_id' : this.items.merchant_id, 6168 'cat_id' : this.items.cat_id, 6169 'item_token': this.items.item_token, 6170 'item_size_id': this.size_id, 6171 'item_qty': this.item_qty, 6172 'item_addons': this.item_addons, 6173 'special_instructions': this.special_instructions, 6174 'meta' : this.meta, 6175 'cart_uuid':getCookie('cart_uuid'), 6176 'transaction_type': transactionType , 6177 'if_sold_out' : this.if_sold_out, 6178 }; 6179 6180 var timenow = 1; 6181 $params = JSON.stringify($params); 6182 6183 ajax_request[timenow] = $.ajax({ 6184 url: ajaxurl+"/addCartItems", 6185 method: "PUT", 6186 dataType: "json", 6187 data: $params , 6188 contentType : $content_type.json , 6189 timeout: $timeout, 6190 crossDomain: true, 6191 beforeSend: function( xhr ) { 6192 if(ajax_request[timenow] != null) { 6193 ajax_request[timenow].abort(); 6194 } 6195 } 6196 }); 6197 6198 ajax_request[timenow].done( data => { 6199 if ( data.code==1){ 6200 $( this.$refs.modal_item_details ).modal('hide'); 6201 //vue_cart.loadcart(); 6202 //location.reload(); 6203 setCookie('cart_uuid',data.details.cart_uuid,30); 6204 6205 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 6206 vm_cart_preview.getCartPreview(); 6207 vm_cart_preview.showCartPreview(); 6208 } 6209 } 6210 }); 6211 6212 ajax_request[timenow].always( data => { 6213 this.add_to_cart = false; 6214 }); 6215 6216 } // end addCartItems 6217 // 6218 }, 6219 template: '#item_suggestion', 6220 }; 6221 6222 /* 6223 HOME WIDGET 6224 */ 6225 const vm_home_widget = Vue.createApp({ 6226 components: { 6227 /*'component-carousel' : ComponentsCarousel, 6228 'component-cuisine' : componentCuisine, 6229 'component-three-steps' : componentThreeSteps,*/ 6230 'component-category' : componentCategory, 6231 }, 6232 data(){ 6233 return { 6234 data_cuisine : [], 6235 cuisine_url : '', 6236 data_category : [], 6237 }; 6238 }, 6239 mounted () { 6240 //this.getCuisineList(false); 6241 this.getCategoryList(false); 6242 }, 6243 methods :{ 6244 /*getCuisineList(){ 6245 var $params = { 6246 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6247 }; 6248 var timenow = getTimeNow(); 6249 $params = JSON.stringify($params); 6250 6251 ajax_request[timenow] = $.ajax({ 6252 url: ajaxurl+"/CuisineList", 6253 method: "PUT", 6254 dataType: "json", 6255 data: $params , 6256 contentType : $content_type.json , 6257 timeout: $timeout, 6258 crossDomain: true, 6259 beforeSend: data => { 6260 if(ajax_request[timenow] != null) { 6261 ajax_request[timenow].abort(); 6262 } 6263 } 6264 }); 6265 6266 ajax_request[timenow].done( data => { 6267 if ( data.code==1){ 6268 this.data_cuisine = data.details.data_cuisine; 6269 this.cuisine_url = data.details.cuisine_url; 6270 } else { 6271 this.data_cuisine = []; 6272 this.cuisine_url = ''; 6273 } 6274 }); 6275 6276 ajax_request[timenow].always( data => { 6277 6278 }); 6279 6280 },*/ 6281 getCategoryList(){ 6282 var $params = { 6283 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6284 'lang': document.documentElement.lang 6285 }; 6286 var timenow = getTimeNow(); 6287 $params = JSON.stringify($params); 6288 6289 ajax_request[timenow] = $.ajax({ 6290 url: ajaxurl+"/CategoryList", 6291 method: "PUT", 6292 dataType: "json", 6293 data: $params , 6294 contentType : $content_type.json , 6295 timeout: $timeout, 6296 crossDomain: true, 6297 beforeSend: data => { 6298 if(ajax_request[timenow] != null) { 6299 ajax_request[timenow].abort(); 6300 } 6301 } 6302 }); 6303 6304 ajax_request[timenow].done( data => { 6305 if ( data.code==1){ 6306 this.data_category = data.details.data_category; 6307 } else { 6308 this.data_category = []; 6309 } 6310 }); 6311 6312 ajax_request[timenow].always( data => { 6313 6314 }); 6315 6316 }, 6317 } 6318 }
6318).mount('#vue-home-widgets'); 6319 6320 /* 6321 Category List WIDGET 6322 */ 6323 const vm_category_list_widget = Vue.createApp({ 6324 components: { 6325 'component-category' : componentCategoryList, 6326 }, 6327 data(){ 6328 return { 6329 data_category : [], 6330 }; 6331 }, 6332 mounted () { 6333 this.getCategoryList(false); 6334 }, 6335 methods :{ 6336 getCategoryList(){ 6337 var $params = { 6338 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6339 'lang':document.documentElement.lang 6340 }; 6341 var timenow = getTimeNow(); 6342 $params = JSON.stringify($params); 6343 6344 ajax_request[timenow] = $.ajax({ 6345 url: ajaxurl+"/CategoryList", 6346 method: "PUT", 6347 dataType: "json", 6348 data: $params , 6349 contentType : $content_type.json , 6350 timeout: $timeout, 6351 crossDomain: true, 6352 beforeSend: data => { 6353 if(ajax_request[timenow] != null) { 6354 ajax_request[timenow].abort(); 6355 } 6356 } 6357 }); 6358 6359 ajax_request[timenow].done( data => { 6360 if ( data.code==1){ 6361 this.data_category = data.details.data_category; 6362 } else { 6363 this.data_category = []; 6364 } 6365 }); 6366 6367 ajax_request[timenow].always( data => { 6368 6369 }); 6370 6371 }, 6372 } 6373 }).mount('#vue-category-list'); 6374 6375 /* 6376 COMPONENTS SAVE STORE HEARTH BUTTON 6377 */ 6378 const ComponentsSaveStore = { 6379 props: ['active','merchant_id','is_guest','please_login'], 6380 data() { 6381 return { 6382 data : [], 6383 loading : false, 6384 } 6385 }, 6386 methods :{ 6387 SaveStore(){ 6388 if(this.is_guest){ 6389 ElementPlus.ElNotification({ 6390 title: "", 6391 message: this.please_login, 6392 position: 'bottom-right', 6393 type: 'warning', 6394 }); 6395 return ; 6396 } 6397 var $params = { 6398 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6399 'merchant_id': this.merchant_id, 6400 }; 6401 var timenow = 500; 6402 $params = JSON.stringify($params); 6403 this.loading = true; 6404 ajax_request[timenow] = $.ajax({ 6405 url: ajaxurl+"/SaveStore", 6406 method: "PUT", 6407 dataType: "json", 6408 data: $params , 6409 contentType : $content_type.json , 6410 timeout: $timeout, 6411 crossDomain: true, 6412 beforeSend: data => { 6413 if(ajax_request[timenow] != null) { 6414 ajax_request[timenow].abort(); 6415 } 6416 } 6417 }); 6418 6419 ajax_request[timenow].done( data => { 6420 if ( data.code==1){ 6421 this.$emit('afterSave',true); 6422 } else { 6423 vm_bootbox.alert( data.msg , {} ); 6424 } 6425 }); 6426 6427 ajax_request[timenow].always( data => { 6428 this.loading = false; 6429 }); 6430 6431 }, 6432 }, 6433 template:` 6434 <div class="d-none d-lg-block" > 6435 <a @click="SaveStore()" href="javascript:;" class="btn bg-light btn-circle rounded-pill"> 6436 <i class="zmdi" :class="{'zmdi-favorite text-green': active, 'zmdi-favorite-outline': !active }"></i> 6437 </a> 6438 </div> 6439 <div class="d-block d-lg-none"> 6440 <a @click="SaveStore()" href="javascript:;" class="btn bg-light btn-circle rounded-pill"> 6441 <i class="zmdi" :class="{'zmdi-favorite text-green': active, 'zmdi-favorite-outline': !active }"></i> 6442 </a> 6443 </div> 6444 `, 6445 }; 6446 6447 /* 6448 GET THE SELECTED DELIVERY TIME 6449 */ 6450 var getChoosenDeliveryTime = function(){ 6451 var $response = []; 6452 var $choosen_delivery = !empty(getCookie('choosen_delivery'))? JSON.parse(getCookie('choosen_delivery')) : [] ; 6453 var $count = Object.keys($choosen_delivery).length; 6454 if($count>0){ 6455 $response = { 6456 'whento_deliver' : $choosen_delivery.whento_deliver 6457 }; 6458 if($choosen_delivery.whento_deliver=="schedule"){ 6459 $response = { 6460 'whento_deliver' : $choosen_delivery.whento_deliver, 6461 'delivery_date' : $choosen_delivery.delivery_date, 6462 'delivery_time' : $choosen_delivery.delivery_time.start_time, 6463 'delivery_time_raw' : $choosen_delivery.delivery_time, 6464 }; 6465 } 6466 return $response; 6467 } 6468 return false; 6469 }; 6470 6471 6472 /* 6473 MOBILE FILTER FOR FEED 6474 */ 6475 const ComponentsFilterFeed = { 6476 components: { 6477 'star-rating' : VueStarRating.default, 6478 }, 6479 props : ['data_attributes', 'data_cuisine' ,'label'], 6480 data(){ 6481 return { 6482 sortby : '', 6483 cuisine : [], 6484 price_range : 0, 6485 max_delivery_fee : 0, 6486 rating : 0, 6487 }; 6488 }, 6489 computed: { 6490 hasFilter(){ 6491 if(!empty(this.sortby)){ 6492 return true; 6493 } 6494 if(this.price_range>0){ 6495 return true; 6496 } 6497 if(this.max_delivery_fee>0){ 6498 return true; 6499 } 6500 if(this.cuisine.length>0){ 6501 return true; 6502 } 6503 if(this.rating>0){ 6504 return true; 6505 } 6506 return false;
6507 }, 6508 }, 6509 methods: { 6510 show(data){ 6511 $(this.$refs.filterFeed).modal('show'); 6512 }, 6513 close(){ 6514 $(this.$refs.filterFeed).modal('hide'); 6515 }, 6516 clearFilter(){ 6517 this.sortby = ''; 6518 this.price_range = 0; 6519 this.max_delivery_fee = 0; 6520 this.cuisine = []; 6521 this.rating = 0; 6522 }, 6523 applyFilter(){ 6524 this.close(); 6525 this.$emit('afterFilter',{ 6526 sortby : this.sortby, 6527 cuisine : this.cuisine, 6528 price_range : this.price_range, 6529 max_delivery_fee : this.max_delivery_fee, 6530 rating : this.rating 6531 }); 6532 }, 6533 }, 6534 template: ` 6535 <div class="modal" ref="filterFeed" tabindex="-1" role="dialog" 6536 aria-labelledby="filterFeed" aria-hidden="true" > 6537 <div class="modal-dialog modal-full modal-dialog-scrollable" role="document"> 6538 <div class="modal-content"> 6539 <div class="modal-body" > 6540 6541 <a href="javascript:;" @click="close" 6542 class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 6543 6544 <h5 class="mt-3">{{label.filters}}</h5> 6545 6546 <div v-for="(sort_by, key) in data_attributes.sort_by" class="row m-0 ml-2 mb-2"> 6547 <div class="custom-control custom-radio"> 6548 <input v-model="sortby" :value="key" type="radio" :id="key+1" class="custom-control-input"> 6549 <label class="custom-control-label" :for="key+1">{{sort_by}}</label> 6550 </div> 6551 </div><!--row--> 6552 6553 <h5 class="mt-3">{{label.price_range}}</h5> 6554 6555 <div class="btn-group btn-group-toggle input-group-small mt-2 mb-2 w-100" > 6556 <label v-for="(price, key) in data_attributes.price_range" class="btn" :class="{ active: price_range==key }" > 6557 <input type="radio" :value="key" v-model="price_range"> 6558 <!-- {{price}} -->
6559 <span v-html="price"></span> 6560 </label> 6561 </div> 6562 6563 <h5 class="mt-3">{{label.cuisine}}</h5> 6564 6565 <div class="row m-0"> 6566 <template v-for="(item_cuisine, index) in data_cuisine" > 6567 <div class="col-6 mb-1" > 6568 <div class="custom-control custom-checkbox"> 6569 <input type="checkbox" class="custom-control-input cuisine" :id="'cuisine'+item_cuisine.cuisine_id+1" 6570 :value="item_cuisine.cuisine_id" 6571 v-model="cuisine" 6572 > 6573 <label class="custom-control-label" :for="'cuisine'+item_cuisine.cuisine_id+1"> 6574 {{item_cuisine.cuisine_name}} 6575 </label> 6576 </div> 6577 </div> <!--col--> 6578 </template> 6579 </div><!-- row--> 6580 6581 <h5 class="mt-3">{{label.max_delivery_fee}}</h5> 6582 6583 <div class="form-group"> 6584 <label for="formControlRange">{{label.delivery_fee}} <b><span class="min-selected-range"></span></b></label> 6585 <input v-model="max_delivery_fee" 6586 id="min_range_slider" value="10" type="range" class="custom-range" id="formControlRange" min="1" max="20" > 6587 </div> 6588 6589 <h5 class="mt-3">{{label.ratings}}</h5> 6590 <p class="bold">{{label.over}} {{rating}}</p> 6591 <star-rating 6592 v-model:rating="rating" 6593 :star-size="30" 6594 :show-rating="false" 6595 @update:rating="rating = $event" 6596 > 6597 </star-rating> 6598 6599 </div> <!--content--> 6600 6601 <div class="modal-footer border-top-0"> 6602 <template v-if="hasFilter"> 6603 <button @click="clearFilter" class="btn btn-light rounded-0 w-50" > 6604 {{label.clear_all}} 6605 </button> 6606 <button @click="applyFilter" class="btn btn-black rounded-0 w-50" > 6607 {{label.done}} 6608 </button> 6609 </template> 6610 <template v-else> 6611 <button @click="applyFilter" class="btn btn-black rounded-0 w-100" > 6612 {{label.done}} 6613 </button> 6614 </template> 6615 </div> 6616 <!--- modal footer --> 6617 6618 </div> <!--dialog--> 6619 </div> <!--modal--> 6620 ` 6621 }; 6622 6623 6624 /* 6625 MOBILE SEARCH SUGGESTION 6626 */ 6627 const ComponentsMobileSearchSuggestion = { 6628 props : ['ajax_url','tabs_suggestion' , 'label'], 6629 data() { 6630 return { 6631 active_tab : 'restaurant', 6632 data : [], 6633 q: '', 6634 awaitingSearch : false, 6635 is_loading : false 6636 }; 6637 }, 6638 watch: { 6639 q(newsearch,oldsearch){ 6640 if (!this.awaitingSearch) { 6641 6642 if(empty(newsearch)){ 6643 this.clearData(); 6644 return false; 6645 } 6646 6647 this.show_list = true; 6648 this.is_loading = true; 6649 6650 setTimeout(() => { 6651 axios({ 6652 method: 'POST', 6653 url: ajaxurl+"/getSearchSuggestionV1" , 6654 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&q=" + this.q + "&category=" + this.active_tab, 6655 timeout: $timeout, 6656 }).then( response => { 6657 if(response.data.code==1){ 6658 this.data = response.data.details.data; 6659 } else { 6660 this.data = []; 6661 } 6662 }).catch(error => { 6663 // 6664 }).then(data => { 6665 this.awaitingSearch = false; 6666 this.is_loading = false; 6667 }); 6668 6669 }, 1000); // 1 sec delay 6670 } 6671 6672 this.data = []; 6673 this.awaitingSearch = true; 6674 } 6675 }, 6676 methods: { 6677 show(data){ 6678 this.clearData(); 6679 $(this.$refs.suggestion).modal('show'); 6680 setTimeout(() => { 6681 this.$refs.q.focus(); 6682 }, 500); 6683 }, 6684 close(){ 6685 $(this.$refs.suggestion).modal('hide'); 6686 }, 6687 showList(){ 6688 this.show_list = true; 6689 }, 6690 clearData(){ 6691 this.data = []; 6692 this.q = ''; 6693 this.show_list = false; 6694 }, 6695 setTab(index){ 6696 this.clearData(); 6697 this.show_list = false; 6698 this.active_tab = index; 6699 }, 6700 }, 6701 computed : { 6702 hasData(){ 6703 if(this.data.length>0){ 6704 return true; 6705 } 6706 return false; 6707 }, 6708 }, 6709 template: ` 6710 <div class="modal" ref="suggestion" tabindex="-1" role="dialog" 6711 aria-labelledby="suggestion" aria-hidden="true" > 6712 <div class="modal-dialog modal-full modal-dialog-scrollable" role="document"> 6713 <div class="modal-content"> 6714 <div class="modal-body p-0" > 6715 6716 <div class="container-fluid mt-3 mb-2"> 6717 <a href="javascript:;" @click="close" 6718 class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 6719 6720 <div class="position-relative inputs-box-wrap mt-3 "> 6721 <input @click="showList" ref="q" v-model="q" class="inputs-box-grey rounded w-100" :placeholder="label.search"> 6722 <div class="search_placeholder pos-right img-15"></div> 6723 <button @click="clearData" v-if="show_list" class="btn btn-sm icon-remove">{{label.clear}}</button> 6724 </div> 6725 6726 </div> 6727 <!-- container --> 6728 6729 <ul class="suggestion-tab row no-gutters list-unstyled list-inline"> 6730 <li v-for="(item, index) in tabs_suggestion" 6731 class="col list-inline-item mr-0" 6732 :class="{active : active_tab==index }" 6733 @click="setTab(index)" 6734 > 6735 {{item}} 6736 </li> 6737 </ul> 6738 6739 <div class="container-fluid "> 6740 6741 <el-skeleton :count="9" animated :loading="is_loading" > 6742 <template #template> 6743 <div class="row mb-2"> 6744 <div class="col-2">
6745 <el-skeleton style="--el-skeleton-circle-size: 40px"> 6746 <template #template> 6747 <el-skeleton-item variant="circle" /> 6748 </template> 6749 </el-skeleton> 6750 </div> <!-- col --> 6751 6752 <div class="col"> 6753 <el-skeleton animated> 6754 <template #template> 6755 <div style="padding: 0px"> 6756 <el-skeleton-item variant="p" style="width: 50%" /> 6757 <div 6758 style=" 6759 display: flex; 6760 align-items: center; 6761 justify-items: space-between; 6762 " 6763 > 6764 <el-skeleton-item variant="text" style="margin-right: 16px" /> 6765 <el-skeleton-item variant="text" style="width: 30%" /> 6766 </div> 6767 </div> 6768 </template> 6769 </el-skeleton> 6770 </div> <!-- col --> 6771 </div> 6772 <!-- row --> 6773 </template> 6774 6775 <template #default> 6776 <template v-if="hasData"> 6777 <ul class="list-unstyled m-0"> 6778 <li v-for="items in data"> 6779 <a :href="items.url"> 6780 <div class="row align-items-center no-gutters"> 6781 <div class="col-1 mr-3"> 6782 <img class="img-30 rounded-pill" :src="items.url_logo"> 6783 </div> 6784 <div class="col text-truncate border-bottom p-2"> 6785 <h6 class="m-0 text-truncate">{{items.title}}</h6> 6786 <p class="m-0 text-truncate text-grey "> 6787 <span class="mr-1" v-for="cuisine in items.cuisine_name" >{{cuisine.cuisine_name}},</span> 6788 </p> 6789 </div> 6790 </div> 6791 </a> 6792 </li> 6793 </ul> 6794 </template> 6795 <template v-else> 6796 <template v-if="q"> 6797 <el-empty :description="label.no_results"></el-empty> 6798 </template> 6799 </template> 6800 6801 </template> 6802 6803 </el-skeleton> 6804 6805 6806 </div> 6807 <!-- container --> 6808 6809 6810 6811 6812 </div> <!--content--> 6813 </div> <!--dialog--> 6814 </div> <!--modal--> 6815 ` 6816 }; 6817 6818 6819 /* 6820 FEED / SEARCH RESULTS 6821 @target = vue-feed 6822 */ 6823 const app_feed = Vue.createApp({ 6824 components: { 6825 'component-save-store' : ComponentsSaveStore, 6826 'star-rating' : VueStarRating.default, 6827 'component-filter-feed' : ComponentsFilterFeed, 6828 'component-mobile-search-suggestion' : ComponentsMobileSearchSuggestion 6829 }, 6830 data(){ 6831 return { 6832 is_loading : false, 6833 reload_loading : false, 6834 collapse : true, 6835 data_attributes : [], 6836 data_cuisine : [], 6837 cuisine : [], 6838 sortby : '', 6839 price_range : 0, 6840 max_delivery_fee : 0, 6841 page : 0, 6842 show_next_page : false, 6843 datas : [], 6844 services : [], 6845 estimation : [], 6846 total_message : '', 6847 rating: 0, 6848 transaction_type : '', 6849 whento_deliver : '', 6850 delivery_date : '', 6851 delivery_time : '', 6852 response_code : 1, 6853 pause_reason_data : [], 6854 data_attributes_loading : false, 6855 enabled_review : true 6856 }; 6857 }, 6858 mounted () { 6859 this.getCuisineList(); 6860 this.searchAttributes(); 6861 this.pauseReasonList(); 6862 6863 if ((typeof cuisine_filter !== "undefined") && ( cuisine_filter !== null)) { 6864 let $cuisine_filter = JSON.parse(cuisine_filter); 6865 this.cuisine = $cuisine_filter; 6866 } 6867 6868 this.Search(false); 6869 }, 6870 computed: { 6871 hasFilter(){ 6872 if(!empty(this.sortby)){ 6873 return true; 6874 } 6875 if(this.price_range>0){ 6876 return true; 6877 } 6878 if(this.max_delivery_fee>0){ 6879 this.AutoFeed(); 6880 return true; 6881 } 6882 if(this.cuisine.length>0){ 6883 return true; 6884 } 6885 if(this.rating>0){ 6886 this.AutoFeed(); 6887 return true; 6888 } 6889 return false; 6890 }, 6891 hasMore(){ 6892 if(this.show_next_page){ 6893 return true; 6894 } 6895 return false; 6896 }, 6897 hasData(){ 6898 if(this.datas.length>0){ 6899 return true; 6900 } 6901 return false; 6902 }, 6903 hasFilter() { 6904 if (Object.keys(this.cuisine).length > 0) { 6905 return true; 6906 } 6907 if(!empty(this.sortby)){ 6908 return true; 6909 } 6910 if(!empty(this.price_range)){ 6911 return true; 6912 } 6913 if(!empty(this.max_delivery_fee)){ 6914 return true; 6915 } 6916 if(!empty(this.rating)){ 6917 return true; 6918 } 6919 return false; 6920 } 6921 }, 6922 updated () { 6923 dump("updated data"); 6924 }, 6925 methods: { 6926 clearFilter(){ 6927 this.sortby = ''; 6928 this.price_range = 0; 6929 this.max_delivery_fee = 0; 6930 this.cuisine = []; 6931 this.rating = 0; 6932 this.Search(false); 6933 }, 6934 getCuisineList(){ 6935 6936 var $params = { 6937 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6938 }; 6939 var timenow = getTimeNow(); 6940 $params = JSON.stringify($params); 6941 6942 ajax_request[timenow] = $.ajax({ 6943 url: ajaxurl+"/CuisineList", 6944 method: "PUT", 6945 dataType: "json", 6946 data: $params , 6947 contentType : $content_type.json , 6948 timeout: $timeout, 6949 crossDomain: true, 6950 beforeSend: data => { 6951 if(ajax_request[timenow] != null) { 6952 ajax_request[timenow].abort(); 6953 } 6954 } 6955 }); 6956 6957 ajax_request[timenow].done( data => { 6958 if ( data.code==1){ 6959 this.data_cuisine = data.details.data_cuisine; 6960 } else { 6961 this.data_cuisine = []; 6962 } 6963 }); 6964 6965 ajax_request[timenow].always( data => { 6966 6967 }); 6968 }, 6969 6970 searchAttributes(){ 6971 6972 let currency_code = getCookie('currency_code'); 6973 currency_code = !empty(currency_code)?currency_code:''; 6974 var $params = { 6975 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 6976 'currency_code' : currency_code 6977 }; 6978 var timenow = getTimeNow(); 6979 $params = JSON.stringify($params); 6980 6981 this.data_attributes_loading = true; 6982 ajax_request[timenow] = $.ajax({ 6983 url: ajaxurl+"/searchAttributes", 6984 method: "PUT", 6985 dataType: "json", 6986 data: $params , 6987 contentType : $content_type.json , 6988 timeout: $timeout, 6989 crossDomain: true, 6990 beforeSend: data => { 6991 if(ajax_request[timenow] != null) { 6992 ajax_request[timenow].abort(); 6993 } 6994 } 6995 }); 6996 6997 ajax_request[timenow].done( data => { 6998 if ( data.code==1){ 6999 this.data_attributes = data.details; 7000 } else { 7001 this.data_attributes = []; 7002 } 7003 }); 7004 7005 ajax_request[timenow].always( data => { 7006 this.data_attributes_loading = false; 7007 }); 7008 7009 }, 7010 ShowMore(){ 7011 this.Search( this.show_next_page ); 7012 }, 7013 AutoFeed(){ 7014 setTimeout(() => { 7015 this.Search(false); 7016 }, 100); 7017 }, 7018 Search($reload){ 7019 7020 if($reload){ 7021 var timenow = 11; 7022 } else { 7023 var timenow = getTimeNow(); 7024 this.page=0; 7025 } 7026 7027 var $data_delivery; 7028 if($data_delivery = getChoosenDeliveryTime()){ 7029 if(empty(this.whento_deliver)){ 7030 this.whento_deliver = $data_delivery.whento_deliver; 7031 this.delivery_date = $data_delivery.delivery_date; 7032 this.delivery_time = $data_delivery.delivery_time; 7033 } 7034 } 7035 7036 var $params = { 7037 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 7038 'local_id': getCookie('kmrs_local_id'), 7039 'cart_uuid':getCookie('cart_uuid'), 7040 'page' : this.page, 7041 'filters':{ 7042 'cuisine': this.cuisine, 7043 'sortby' : this.sortby, 7044 'price_range': this.price_range, 7045 'max_delivery_fee': this.max_delivery_fee, 7046 'rating': this.rating, 7047 'transaction_type':this.transaction_type, 7048 'whento_deliver': this.whento_deliver, 7049 'delivery_date': this.delivery_date, 7050 'delivery_time': this.delivery_time, 7051 }, 7052 }; 7053 7054 $params = JSON.stringify($params); 7055 ajax_request[timenow] = $.ajax({ 7056 url: ajaxurl+"/getFeedV1", 7057 method: "PUT", 7058 dataType: "json", 7059 data: $params , 7060 contentType : $content_type.json , 7061 timeout: $timeout, 7062 crossDomain: true, 7063 beforeSend: data => { 7064 //if(!$reload) { this.is_loading = true; } else { this.reload_loading = true; } 7065 this.is_loading = true; 7066 if(ajax_request[timenow] != null) { 7067 ajax_request[timenow].abort(); 7068 } 7069 } 7070 }); 7071 7072 ajax_request[timenow].done( data => { 7073 this.response_code = data.code; 7074 if ( data.code==1){ 7075 if(!$reload){ 7076 this.datas = []; 7077 this.services = []; 7078 this.estimation = []; 7079 } 7080 7081 this.datas.push(data.details.data); 7082 this.services = data.details.services; 7083 this.estimation = data.details.estimation; 7084 this.total_message = data.details.total_message; 7085 this.show_next_page = data.details.show_next_page; 7086 this.page = data.details.page; 7087 this.transaction_type = data.details.transaction_type; 7088 this.enabled_review = data.details.enabled_review; 7089 this.updateImage(); 7090 } else { 7091 this.datas = []; 7092 this.services = []; 7093 this.estimation = []; 7094 this.total_message=''; 7095 this.show_next_page = false;
7096 this.page = 0; 7097 this.transaction_type = ''; 7098 } 7099 }); 7100 7101 ajax_request[timenow].always( data => { 7102 this.is_loading = false; 7103 this.reload_loading = false; 7104 }); 7105 }, 7106 pauseReasonList(){ 7107 7108 axios({ 7109 method: 'POST', 7110 url: ajaxurl+"/pauseReasonList" , 7111 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 7112 timeout: $timeout, 7113 }).then( response => { 7114 if(response.data.code==1){ 7115 this.pause_reason_data = response.data.details; 7116 } else { 7117 this.pause_reason_data = []; 7118 } 7119 }).catch(error => { 7120 // 7121 }).then(data => { 7122 7123 }); 7124 7125 }, 7126 updateImage(){ 7127 updateLazyImage(); 7128 }, 7129 afterSaveStore(item){ 7130 item.saved_store = item.saved_store==1?false:true; 7131 }, 7132 showFilter(){ 7133 this.$refs.filter_feed.show(); 7134 }, 7135 afterApplyFilter(data){ 7136 this.sortby = data.sortby; 7137 this.cuisine = data.cuisine; 7138 this.price_range = data.price_range; 7139 this.max_delivery_fee = data.max_delivery_fee; 7140 this.rating = data.rating; 7141 this.AutoFeed(); 7142 }, 7143 showSearchSuggestion(){ 7144 this.$refs.search_suggestion.show(); 7145 }, 7146 }, 7147 }); 7148 app_feed.use(ElementPlus); 7149 const vm_feed = app_feed.mount('#vue-feed'); 7150 7151 7152 /* 7153 COMPONENTS SERVICES BUTTON 7154 */ 7155 7156 const ComponentsServices = { 7157 data() { 7158 return { 7159 data : [], 7160 transaction_type : '', 7161 is_loading : false, 7162 } 7163 }, 7164 mounted () { 7165 this.getServices(); 7166 }, 7167 methods: { 7168 getServices(){ 7169 7170 var timenow = getTimeNow(); 7171 var $params = { 7172 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 7173 'cart_uuid':getCookie('cart_uuid'), 7174 }; 7175 7176 ajax_request[timenow] = $.ajax({ 7177 url: ajaxurl+"/getServices", 7178 method: "PUT", 7179 dataType: "json", 7180 data: JSON.stringify($params), 7181 contentType : $content_type.json , 7182 timeout: $timeout, 7183 crossDomain: true, 7184 beforeSend: data => { 7185 this.is_loading = true; 7186 if(ajax_request[timenow] != null) { 7187 ajax_request[timenow].abort(); 7188 } 7189 } 7190 }); 7191 7192 ajax_request[timenow].done( data => { 7193 if ( data.code==1){ 7194 this.data = data.details.data; 7195 this.transaction_type = data.details.transaction_type; 7196 this.$emit('setTransaction',this.transaction_type,data.details.data); 7197 } else { 7198 this.data = []; 7199 this.transaction_type = ''; 7200 } 7201 }); 7202 7203 ajax_request[timenow].always( data => { 7204 this.is_loading = false; 7205 }); 7206 7207 }, 7208 setTransactionType(transaction_type){ 7209 7210 var timenow = getTimeNow(); 7211 var $params = { 7212 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 7213 'transaction_type':transaction_type, 7214 'cart_uuid':getCookie('cart_uuid'), 7215 }; 7216 7217 ajax_request[timenow] = $.ajax({ 7218 url: ajaxurl+"/setTransactionType", 7219 method: "PUT", 7220 dataType: "json", 7221 data: JSON.stringify($params), 7222 contentType : $content_type.json , 7223 timeout: $timeout, 7224 crossDomain: true, 7225 beforeSend: data => { 7226 if(ajax_request[timenow] != null) { 7227 ajax_request[timenow].abort(); 7228 } 7229 } 7230 }); 7231 7232 ajax_request[timenow].done( data => { 7233 if ( data.code==1){ 7234 setCookie('cart_uuid',data.details.cart_uuid,30); 7235 this.transaction_type = data.details.transaction_type; 7236 this.$emit('afterSettransaction',this.transaction_type); 7237 } else { 7238 this.this.transaction_type = ''; 7239 } 7240 }); 7241 7242 ajax_request[timenow].always( data => { 7243 // 7244 }); 7245 7246 }, 7247 }, 7248 template: ` 7249 7250 <template v-if="is_loading" > 7251 <el-skeleton animated style="width:auto;" class="mr-2"> 7252 <template #template> 7253 <el-skeleton-item variant="button"></el-skeleton-item> 7254 </template> 7255 </el-skeleton> 7256 </template> 7257 7258 <div v-else class="dropdown widget-dropdown mr-2" >
7259 <button class="" type="button" id="dropdownMenuButton" 7260 data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 7261 <template v-if="data[transaction_type]"> 7262 {{data[transaction_type].service_name}} 7263 </template> 7264 </button> 7265 7266 <div class="dropdown-menu" aria-labelledby="services"> 7267 <a v-for="item in data" href="javascript:;" @click="setTransactionType(item.service_code)" > 7268 {{item.service_name}} 7269 </a> 7270 </div> 7271 7272 </div> <!--dropdown--> 7273 `, 7274 }; 7275 7276 /* 7277 COMPONENTS TRANSACTION INFORMATION 7278 */ 7279 7280 const ComponentsTransactionInfo = { 7281 props: ['layout' , 'transaction_type', 'label','transaction_list'], 7282 data() { 7283 return { 7284 address1 : '', 7285 whento_deliver : '', 7286 formatted_address : '', 7287 loading : false, 7288 delivery_option : [], 7289 delivery_datetime : '', 7290 visible : false, 7291 } 7292 }, 7293 mounted () { 7294 this.TransactionInfo(); 7295 }, 7296 methods: { 7297 TransactionInfo(){ 7298 7299 var $merchant_id = 0; 7300 if ((typeof merchant_id !== "undefined") && ( merchant_id !== null)) { 7301 $merchant_id = merchant_id; 7302 } 7303 7304 var $choosen_delivery = !empty(getCookie('choosen_delivery'))? JSON.parse(getCookie('choosen_delivery')) : [] ; 7305 var timenow = getTimeNow(); 7306 var $params = { 7307 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 7308 'cart_uuid':getCookie('cart_uuid'), 7309 'choosen_delivery' : $choosen_delivery, 7310 'merchant_id': $merchant_id 7311 }; 7312 7313 ajax_request[timenow] = $.ajax({ 7314 url: ajaxurl+"/TransactionInfo", 7315 method: "PUT", 7316 dataType: "json", 7317 data: JSON.stringify($params), 7318 contentType : $content_type.json , 7319 timeout: $timeout, 7320 crossDomain: true, 7321 beforeSend: data => { 7322 this.loading = true; 7323 if(ajax_request[timenow] != null) { 7324 ajax_request[timenow].abort(); 7325 } 7326 } 7327 }); 7328 7329 ajax_request[timenow].done( data => { 7330 if(data.code==1){ 7331 this.address1 = data.details.address1; 7332 this.whento_deliver = data.details.whento_deliver; 7333 this.formatted_address = data.details.formatted_address; 7334 this.delivery_option = data.details.delivery_option; 7335 this.delivery_datetime = data.details.delivery_datetime; 7336 this.visible = true; 7337 7338 if(data.details.time_already_passed){ 7339 setCookie('choosen_delivery', [] ,30); 7340 } 7341 } else { 7342 this.address1 = ''; 7343 this.whento_deliver = ''; 7344 this.formatted_address = ''; 7345 this.delivery_option = []; 7346 this.delivery_datetime = ''; 7347 this.visible = false; 7348 } 7349 }); // ajax done 7350 7351 ajax_request[timenow].always( data => { 7352 this.loading = false; 7353 }); 7354 7355 }, 7356 setTransactionInfo(){ 7357 this.$emit('afterClick',{ 7358 address1 : this.address1, 7359 delivery_option : this.delivery_option, 7360 whento_deliver : this.whento_deliver, 7361 formatted_address : this.formatted_address, 7362 delivery_datetime : this.delivery_datetime 7363 }); 7364 7365 }, 7366 }, 7367 template: ` 7368 <template v-if="loading" > 7369 <el-skeleton animated style="width:auto;"> 7370 <template #template> 7371 <el-skeleton-item variant="button"></el-skeleton-item> 7372 </template> 7373 </el-skeleton> 7374 </template> 7375 <div v-else class="position-relative"> 7376 <template v-if="layout=='widget-dropdown-address'"> 7377 <p class="m-0"> 7378 7379 <template v-if="whento_deliver=='schedule'"> 7380 {{delivery_datetime}} 7381 </template> 7382 <template v-else> 7383 <span class="text-capitalize"> 7384 <template v-if="transaction_list[transaction_type]"> 7385 {{transaction_list[transaction_type].service_name}} 7386 </template> 7387 <template v-else> 7388 {{transaction_type}} 7389 </template> 7390 </span> {{label.now}} 7391 </template> 7392 7393 </p> 7394 <div class="dropdown"> 7395 <button @click="setTransactionInfo()" class="btn-text dropdown-toggle" type="button" > 7396 <span class="text-truncate">{{address1}}</span> 7397 </button> 7398 </template> 7399 7400 <template v-else> 7401 7402 <div class="widget-dropdown" v-if="visible" > 7403 <button class="no-icons d-flex align-items-center" @click="setTransactionInfo()" >
7404 <span class="d-inline text-truncate"> 7405 <template v-if="address1"> 7406 {{address1}} {{formatted_address}} 7407 </template> 7408 <template v-else> 7409 {{label.select_address}} 7410 </template> 7411 </span> 7412 <span class="d-inline"> • 7413 7414 <template v-if="whento_deliver=='schedule'"> 7415 {{delivery_datetime}} 7416 </template> 7417 <template v-else> 7418 <template v-if="delivery_option[whento_deliver]"> 7419 {{ delivery_option[whento_deliver].short_name }} 7420 </template> 7421 </template> 7422 7423 </span> 7424 </button> 7425 </div> 7426 </template> 7427 </div> 7428 `, 7429 }; 7430 7431 7432 /* 7433 COMPONENTS DELIVERY DETAILS 7434 */ 7435 const ComponentsDeliveryDetails = { 7436 props: ['label'], 7437 data() { 7438 return { 7439 data : [], 7440 screen_size: { 7441 width: 0, 7442 height: 0 7443 }, 7444 openingHours:{ 7445 monday:["10:30 AM - 02:00 PM","5:00 PM - 10:00 PM"], 7446 tuesday:["10:30 AM - 02:00 PM","5:00 PM - 10:00 PM"], 7447 wednesday:["10:30 AM - 02:00 PM","5:00 PM - 10:00 PM"], 7448 thursday:["10:30 AM - 02:00 PM","5:00 PM - 10:00 PM"], 7449 friday:["10:30 AM - 02:00 PM","5:00 PM - 10:00 PM"], 7450 saturday:["10:30 AM - 10:00 PM"], 7451 sunday:["10:30 AM - 10:00 PM"] 7452 } 7453 } 7454 }, 7455 mounted () { 7456 this.handleResize(); 7457 window.addEventListener('resize', this.handleResize); 7458 }, 7459 computed : { 7460 isMobileView(){ 7461 return this.screen_size.width <= 991; 7462 }, 7463 7464 berlinNow(){ 7465 return new Date(new Date().toLocaleString("en-US", { timeZone: "Europe/Berlin" })); 7466 }, 7467 7468 todayDay(){ 7469 return this.berlinNow.toLocaleString('en-US',{weekday:'long'}).toLowerCase(); 7470 }, 7471 7472 storeStatus(){ 7473 return this.checkStoreStatus(); 7474 } 7475 }, 7476 methods: { 7477 parseTime(str){ 7478 return new Date(this.berlinNow.toDateString() + " " + str); 7479 }, 7480 7481 checkStoreStatus(){ 7482 7483 const today = this.todayDay; 7484 const slots = this.openingHours[today] || []; 7485 const now = this.berlinNow; 7486 7487 let isOpen = false; 7488 let closingSoon = false; 7489 let nextOpen = null; 7490 7491 for(let slot of slots){ 7492 let parts = slot.split(" - "); 7493 let start = this.parseTime(parts[0]); 7494 let end = this.parseTime(parts[1]); 7495 7496 if(now >= start && now <= end){ 7497 isOpen = true; 7498 7499 // closing in 30 minutes? 7500 let diff = (end - now) / 60000; 7501 if(diff <= 30){ 7502 closingSoon = true; 7503 } 7504 7505 return { 7506 status:"open", 7507 message: closingSoon 7508 ? this.formatLabel('store_closing_soon',{time: parts[1]}) 7509 : this.formatLabel('store_open_until',{time: parts[1]}) 7510 }; 7511 } 7512 7513 if(now < start && !nextOpen){ 7514 nextOpen = parts[0]; 7515 } 7516 } 7517 7518 if(nextOpen){ 7519 return { 7520 status:"closed", 7521 message: this.formatLabel('store_closed_today',{time: nextOpen}) 7522 }; 7523 } 7524 7525 // find next day opening 7526 const days = Object.keys(this.openingHours); 7527 let todayIndex = days.indexOf(today); 7528 7529 for(let i=1;i<=7;i++){ 7530 let d = days[(todayIndex+i)%7]; 7531 if(this.openingHours[d].length){ 7532 return { 7533 status:"closed", 7534 message: this.formatLabel('store_closed_day',{ 7535 day: d.charAt(0).toUpperCase()+d.slice(1), 7536 time: this.openingHours[d][0].split(" - ")[0] 7537 }) 7538 }; 7539 } 7540 } 7541 7542 return { 7543 status:"closed", 7544 message: this.label.store_closed 7545 }; 7546 }, 7547 7548 show(data){ 7549 this.data = data; 7550 $(this.$refs.ModalDeliveryDetails).modal('show'); 7551 }, 7552 7553 close(){ 7554 $(this.$refs.ModalDeliveryDetails).modal('hide'); 7555 }, 7556 7557 handleResize() { 7558 this.screen_size.width = window.innerWidth; 7559 this.screen_size.height = window.innerHeight; 7560 }, 7561 7562 formatLabel(key, params={}){ 7563 let text = this.label[key] || ''; 7564 for(let p in params){ 7565 text = text.replace('{'+p+'}', params[p]); 7566 } 7567 return text; 7568 }, 7569 }, 7570 template: ` 7571 <div class="modal" ref="ModalDeliveryDetails" tabindex="-1" role="dialog" 7572 aria-labelledby="ModalDeliveryDetails" aria-hidden="true" data-backdrop="static" data-keyboard="false" >
7573 <div class="modal-dialog modal-dialog-centered modal-lg" role="document"> 7574 <div class="modal-content" :class="{ 'modal-mobile': isMobileView }" > 7575 7576 <div class="modal-header border-bottom-0" style="padding-bottom:0px !important;"> 7577 <h5 class="modal-title">{{label.title}} (We deliver in Jena)</h5> 7578 <a href="javascript:;" @click="close" class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 7579 </div> 7580 7581 <div class="modal-body" > 7582 7583 <div class="store-status mb-3" 7584 :class="storeStatus.status"> 7585 7586 <i class="zmdi" 7587 :class="storeStatus.status=='open' ? 'zmdi-check-circle text-success' : 'zmdi-close-circle text-danger'"></i> 7588 7589 <span class="ml-2">{{ storeStatus.message }}</span> 7590 </div> 7591 7592 <!-- Opening Hours --> 7593 <div class="opening-hours-section rounded p-3 mb-3"> 7594 7595 <div class="d-flex align-items-center mb-2"> 7596 <i class="zmdi zmdi-time mr-2 font20"></i> 7597 <span class="bold">Opening Hours</span> 7598 </div> 7599 7600 <ul class="opening-hours-list"> 7601 <li v-for="(slots,day) in openingHours" 7602 :key="day" 7603 :class="{ today: day === todayDay }"> 7604 7605 <span class="day">{{ day }}</span> 7606 <span class="time"> 7607 <template v-if="slots.length"> 7608 <span v-for="(slot,index) in slots" :key="index"> 7609 {{ slot }} 7610 <span v-if="index < slots.length-1"> , </span> 7611 </span> 7612 </template> 7613 <template v-else> 7614 Closed 7615 </template> 7616 </span> 7617 </li> 7618 </ul> 7619 </div> 7620 7621 <a href="javascript:;" @click="$emit('showAddress')" 7622 class="d-block chevron-section promo-section d-flex align-items-center rounded mb-2"> 7623 <div class="flexcol mr-2"><i class="zmdi zmdi-pin"></i></div> 7624 <div class="flexcol" > 7625 <template v-if="data.address1"> 7626 <span class="bold mr-1">{{data.address1}}</span> 7627 <p class="m-0 text-muted">{{data.formatted_address}}</p> 7628 </template> 7629 <template v-else> 7630 <span class="bold mr-1">{{label.select_address}}</span> 7631 </template> 7632 </div> 7633 </a> 7634 7635 <a v-if="data" href="javascript:;" @click="$emit('showTransOptions')" 7636 class="d-block chevron-section promo-section d-flex align-items-center rounded mb-2"> 7637 <div class="flexcol mr-2"><i class="zmdi zmdi-time"></i></div> 7638 <div class="flexcol" > 7639 <template v-if="data.whento_deliver=='schedule'"> 7640 {{data.delivery_datetime}} 7641 </template> 7642 <template v-else> 7643 <template v-if="data.delivery_option"> 7644 {{ data.delivery_option[data.whento_deliver].short_name }} 7645 </template> 7646 </template> 7647 </div> 7648 </a> 7649 7650 </div> <!--modal-body--> 7651 7652 <div class="modal-footer justify-content-start"> 7653 7654 <button class="btn btn-black w-100" @click="close();" > 7655 {{label.done}} 7656 </button> 7657 7658 </div> <!--modal-footer--> 7659 7660 </div> <!--content--> 7661 </div> <!--dialog--> 7662 </div> <!--modal--> 7663 `, 7664 }; 7665 7666 /* 7667 COMPONENTS DELIVERY OPTIONS 7668 */ 7669 const ComponenstTransactionOptions = { 7670 props: ['label'], 7671 data() { 7672 return { 7673 data : [], 7674 loading : false, 7675 delivery_option : [], 7676 whento_deliver : '', 7677 opening_hours_date : [], 7678 opening_hours_time : [], 7679 delivery_date : '', 7680 delivery_time : '', 7681 error : [] 7682 } 7683 }, 7684 mounted () { 7685 7686 }, 7687 computed: { 7688 hasError(){ 7689 if(this.error.length>0){ 7690 return true; 7691 } 7692 return false; 7693 }, 7694 }, 7695 methods: { 7696 show(data){ 7697 $(this.$refs.modalselecttime).modal('show'); 7698 this.getDeliveryTimes(); 7699 }, 7700 close(){ 7701 $(this.$refs.modalselecttime).modal('hide'); 7702 this.$emit('afterClose'); 7703 }, 7704 getDeliveryTimes(){ 7705 7706 var timenow = getTimeNow(); 7707 var $merchant_id = 0; 7708 if ((typeof merchant_id !== "undefined") && ( merchant_id !== null)) { 7709 $merchant_id = merchant_id; 7710 } 7711 var $params = { 7712 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 7713 'cart_uuid':getCookie('cart_uuid'), 7714 'merchant_id': $merchant_id 7715 }; 7716 7717 ajax_request[timenow] = $.ajax({ 7718 url: ajaxurl+"/getDeliveryTimes", 7719 method: "PUT", 7720 dataType: "json", 7721 data: JSON.stringify($params), 7722 contentType : $content_type.json , 7723 timeout: $timeout, 7724 crossDomain: true, 7725 beforeSend: data => { 7726 this.loading = true; 7727 if(ajax_request[timenow] != null) { 7728 ajax_request[timenow].abort(); 7729 } 7730 } 7731 }); 7732 7733 ajax_request[timenow].done( data => { 7734 if(data.code==1){ 7735 this.delivery_option = data.details.delivery_option; 7736 this.whento_deliver = data.details.whento_deliver; 7737 this.opening_hours_date = data.details.opening_hours.dates; 7738 this.opening_hours_time = data.details.opening_hours.time_ranges; 7739 7740 var keys = Object.keys(data.details.opening_hours.dates); 7741 this.delivery_date = keys[0]; 7742 7743 var keys = data.details.opening_hours.time_ranges[this.delivery_date][0]; 7744 this.delivery_time = JSON.stringify(keys); 7745 7746 if(!empty(data.details.delivery_date)){ 7747 this.delivery_date = data.details.delivery_date; 7748 } 7749 if(!empty(data.details.delivery_time)){ 7750 this.delivery_time = data.details.delivery_time; 7751 } 7752 7753 dump("SELECTED=>"); 7754 dump(this.delivery_date); 7755 dump(this.delivery_time); 7756 dump(this.delivery_option); 7757 7758 7759 } else { 7760 this.delivery_option = []; 7761 this.whento_deliver = ''; 7762 this.error = data.msg; 7763 } 7764 }); // ajax done 7765 7766 ajax_request[timenow].always( data => { 7767 this.loading = false;
7768 }); 7769 7770 }, 7771 save(){ 7772 var timenow = 1; 7773 var $params = { 7774 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 7775 'cart_uuid':getCookie('cart_uuid'), 7776 'delivery_date': this.delivery_date, 7777 'whento_deliver': this.whento_deliver, 7778 'delivery_time': !empty(this.delivery_time)?JSON.parse(this.delivery_time):'' 7779 //'delivery_time': this.delivery_time, 7780 }; 7781 7782 ajax_request[timenow] = $.ajax({ 7783 url: ajaxurl+"/saveTransactionInfo", 7784 method: "PUT", 7785 dataType: "json", 7786 data: JSON.stringify($params), 7787 contentType : $content_type.json , 7788 timeout: $timeout, 7789 crossDomain: true, 7790 beforeSend: data => { 7791 this.loading = true; 7792 if(ajax_request[timenow] != null) { 7793 ajax_request[timenow].abort(); 7794 } 7795 } 7796 }); 7797 7798 ajax_request[timenow].done( data => { 7799 this.$emit('afterSave',data.details); 7800 if(data.code==1){ 7801 var $json = { 7802 'whento_deliver' : data.details.whento_deliver, 7803 'delivery_date' : data.details.delivery_date, 7804 'delivery_time' : data.details.delivery_time 7805 /*'delivery_time' : { 7806 'start_time' : data.details.delivery_time_raw.start_time, 7807 'end_time' : data.details.delivery_time_raw.end_time, 7808 'pretty_time' : data.details.delivery_time_raw.pretty_time, 7809 }*/ 7810 }; 7811 setCookie('choosen_delivery', JSON.stringify($json) ,30); 7812 } 7813 }); 7814 7815 ajax_request[timenow].always( data => { 7816 this.loading = false; 7817 }); 7818 }, 7819 JsonValue(item){ 7820 return JSON.stringify({ 7821 start_time : item.start_time, 7822 end_time : item.end_time, 7823 pretty_time : item.pretty_time 7824 }); 7825 } 7826 }, 7827 template: ` 7828 <div class="modal" ref="modalselecttime" id="ModalTRNOptions" tabindex="-1" role="dialog" 7829 aria-labelledby="ModalTRNOptions" aria-hidden="true" > 7830 <div class="modal-dialog" role="document"> 7831 <div class="modal-content"> 7832 <div class="modal-body" > 7833 7834 <a href="javascript:;" @click="close" 7835 class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 7836 7837 <h4 class="m-0 mb-3 mt-3">{{label.title}}</h4> 7838 7839 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 7840 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 7841 </div> 7842 7843 <div class="btn-group btn-group-toggle input-group-small mt-2 mb-3" > 7844 <label v-for="(item, index) in delivery_option" class="font-weight-bold btn" :class="{ active: whento_deliver==item.value }" > 7845 <input type="radio" :value="item.value" name="whento_deliver" v-model="whento_deliver"> 7846 {{item.name}} 7847 </label> 7848 </div> 7849 7850 <template v-if="whento_deliver=='schedule'"> 7851 7852 <select class="form-control custom-select mb-3" v-model="delivery_date"> 7853 <option v-for="(item, index) in opening_hours_date" :value="item.value" > 7854 {{ item.name}} 7855 </option> 7856 </select> 7857 7858 <select id="delivery_time" class="form-control custom-select" 7859 v-model="delivery_time" v-if="opening_hours_date[delivery_date]" > 7860 <option v-for="(item, index) in opening_hours_time[delivery_date]" 7861 :value="JsonValue(item)" > 7862 {{item.pretty_time}} 7863 </option> 7864 </select> 7865 7866 </template> 7867 7868 </div> <!--modal-body--> 7869 7870 7871 <div class="modal-footer justify-content-start"> 7872 7873 <button @click="save" 7874 class="btn btn-green w-100" :class="{ loading: loading }" 7875 :disabled="hasError" 7876 >
7877 <span class="label">{{label.save}}</span> 7878 <div class="m-auto circle-loader" data-loader="circle-side"></div> 7879 </button> 7880 7881 </div> <!--modal-footer--> 7882 7883 </div> <!--content--> 7884 </div> <!--dialog--> 7885 </div> <!--modal--> 7886 `, 7887 }; 7888 7889 /* 7890 COMPONENTS searchSuggestion 7891 */ 7892 const ComponentSearchSuggestion = { 7893 props: ['label'], 7894 data(){ 7895 return { 7896 q: '', 7897 awaitingSearch : false, 7898 show_list : false, 7899 data : [], 7900 }; 7901 }, 7902 watch: { 7903 q(newsearch,oldsearch){ 7904 if (!this.awaitingSearch) { 7905 7906 if(empty(newsearch)){ 7907 this.clearData(); 7908 return false; 7909 } 7910 7911 this.show_list = true; 7912 7913 setTimeout(() => { 7914 7915 var $params; var timenow = 2; 7916 $params="q=" + this.q; 7917 $params+=addValidationRequest(); 7918 ajax_request[timenow] = $.ajax({ 7919 url: ajaxurl+"/getSearchSuggestion", 7920 method: "POST", 7921 dataType: "json", 7922 data: $params, 7923 contentType : $content_type.form , 7924 timeout: $timeout, 7925 crossDomain: true, 7926 beforeSend: data => { 7927 if(ajax_request[timenow] != null) { 7928 ajax_request[timenow].abort(); 7929 } 7930 } 7931 }); 7932 7933 ajax_request[timenow].done( data => { 7934 if ( data.code==1){ 7935 this.data = data.details.data; 7936 } else { 7937 this.data = []; 7938 } 7939 }); // ajax done 7940 7941 ajax_request[timenow].always( data => { 7942 this.awaitingSearch = false; 7943 }); 7944 7945 }, 1000); // 1 sec delay 7946 } 7947 7948 this.data = []; 7949 this.awaitingSearch = true; 7950 } 7951 }, 7952 computed: { 7953 hasData(){ 7954 if(this.data.length>0){ 7955 return true; 7956 } 7957 return false; 7958 }, 7959 }, 7960 methods: { 7961 showList(){ 7962 this.show_list = true; 7963 }, 7964 clearData(){ 7965 this.data = []; 7966 this.q = ''; 7967 }, 7968 }, 7969 template: ` 7970 7971 <div class="mr-2 position-relative inputs-box-wrap d-none d-md-block"> 7972 <input @click="showList" v-model="q" class="inputs-box-grey " :placeholder="label.placeholder" /> 7973 <div v-if="!awaitingSearch" class="search_placeholder pos-right img-15"></div> 7974 <div v-if="awaitingSearch" class="icon img-15" data-loader="circle"></div> 7975 7976 <div v-if="hasData" @click="clearData" class="icon-remove"><i class="zmdi zmdi-close"></i></div> 7977 7978 <div class="results with-border" v-if="show_list" > 7979 <ul class="list-unstyled m-0"> 7980 <li v-for="items in data" > 7981 <a :href="items.url" > 7982 <div class="row align-items-center no-gutters"> 7983 <div class="col col-md-auto mr-2"> 7984 <img class="img-30 rounded-pill" :src="items.url_logo" > 7985 </div> 7986 <div class="col text-truncate"> 7987 <h6 class="m-0 text-truncate">{{items.title}}</h6> 7988 <p class="m-0 text-truncate text-grey "> 7989 <span class="mr-1" v-for="cuisine in items.cuisine_name" >{{cuisine.cuisine_name}},</span> 7990 </p> 7991 </div> 7992 </div> 7993 </a> 7994 </li> 7995 </ul> 7996 </div> 7997 </div> 7998 7999 <!--- 8000 <div class="d-block d-md-none mr-3 mr-md-2"> 8001 <button class="btn btn-search rounded-circle bg-light"><i class="zmdi zmdi-search"></i></button> 8002 </div> 8003 ---> 8004 ` 8005 }; 8006 8007 8008 /* 8009 WIDGET SEARCH NAV 8010 */ 8011 const app_search_widget = Vue.createApp({ 8012 components: { 8013 'component-search-suggestion' : ComponentSearchSuggestion, 8014 }, 8015 methods: { 8016 closeSuggestion(){ 8017 this.$refs.suggestion.show_list = false; 8018 } 8019 }, 8020 }); 8021 app_search_widget.directive("click-outside",clickOutside); 8022 const vm_search_nav = app_search_widget.mount('#vue-search-nav'); 8023 8024 8025 /* 8026 WIDGET TOP NAV 8027 */ 8028 const app_widget_nav = Vue.createApp({ 8029 data() { 8030 return { 8031 data : [], 8032 addresses : [], 8033 deliveryAddress : [], 8034 location_data : [] 8035 } 8036 }, 8037 components: { 8038 'component-services' : ComponentsServices, 8039 'component-transaction-info' : ComponentsTransactionInfo, 8040 'component-delivery-details' : ComponentsDeliveryDetails, 8041 'component-change-address': changeAddressComponent, 8042 'component-trans-options' : ComponenstTransactionOptions, 8043 //'component-address': ComponentsAddress, 8044 'components-select-address': ComponentsSelectAddress, 8045 'components-address-form' : ComponentsAddressForm, 8046 }, 8047 mounted () { 8048 8049 }, 8050 methods: { 8051 setTransaction(transaction_type){ 8052 this.transaction_type = transaction_type; 8053 }, 8054 reloadFeed(transaction_type){ 8055 vm_feed.transaction_type = transaction_type; 8056 vm_feed.Search(false); 8057 }, 8058 setTransactionInfo(data){ 8059 this.data = data; 8060 this.$refs.transaction.show(this.data); 8061 }, 8062 showAddress(){ 8063 this.$refs.transaction.close(); 8064 this.$refs.address.showModal(); 8065 this.getClientAddresses(); 8066 }, 8067 afterChangeAddress(data){ 8068 if(isGuest==='1'){ 8069 this.deliveryAddress = data; 8070 this.$refs.transaction.close(); 8071 //this.$refs.address_modal.show(true); 8072 this.$refs.address_modal.visible = true; 8073 } else { 8074 this.$refs.transaction.close(); 8075 this.location_data = data; 8076 } 8077 }, 8078 onSavelocation(data,addressData){ 8079 dump('onSavelocation 1'); 8080 dump(data); 8081 dump(addressData); 8082 this.$refs.address_form.setLoading(true); 8083 let params = { 8084 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 8085 'cart_uuid':getCookie('cart_uuid'), 8086 'data': data, 8087 'location_name' : addressData.location_name, 8088 'delivery_instructions' : addressData.delivery_instructions, 8089 'delivery_options' : addressData.delivery_options, 8090 'address_label' : addressData.address_label, 8091 'formatted_address' : addressData.formatted_address, 8092 'address1' : addressData.address1, 8093 'address2' : addressData.address2, 8094 'postal_code' : addressData.postal_code, 8095 'company' : addressData.company, 8096 'street': addressData.street, 8097 'house_number': addressData.house_number, 8098 'city': addressData.city 8099 }; 8100 axios({ 8101 method: 'PUT', 8102 url: ajaxurl+"/checkoutSaveAddress" , 8103 data : params, 8104 timeout: $timeout, 8105 }).then( response => { 8106 if(response.data.code==1){ 8107 this.refreshWidget(); 8108 this.$refs.address_form.close(); 8109 } else { 8110 ElementPlus.ElNotification({ 8111 title: "", 8112 message: response.data.msg, 8113 position: 'bottom-right', 8114 type: 'warning', 8115 }); 8116 } 8117 }).catch(error => { 8118 ElementPlus.ElNotification({ 8119 title: "", 8120 message: error, 8121 position: 'bottom-right', 8122 type: 'warning', 8123 }); 8124 }).then(data => { 8125 this.$refs.address_form.setLoading(false); 8126 }); 8127 }, 8128 afterPointaddress(data){ 8129 this.$refs.address_modal.setLoading(true); 8130 axios({ 8131 method: 'POST', 8132 url: ajaxurl+"/setPlaceID" , 8133 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&place_id="+ data.place_id , 8134 timeout: $timeout, 8135 }).then( response => { 8136 this.refreshWidget(); 8137 //this.$refs.address_modal.show(false); 8138 this.$refs.address_modal.visible = false;
8139 }).catch(error => { 8140 ElementPlus.ElNotification({ 8141 title: "", 8142 message: error, 8143 position: 'bottom-right', 8144 type: 'warning', 8145 }); 8146 }).then(data => { 8147 this.$refs.address_modal.setLoading(false); 8148 }); 8149 }, 8150 refreshWidget(data){ 8151 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 8152 vm_feed.Search(false); 8153 } 8154 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8155 vue_cart.loadcart(); 8156 } 8157 this.$refs.transaction_info.TransactionInfo(); 8158 this.$refs.transaction.close(); 8159 8160 if ((typeof vm_merchant_details !== "undefined") && ( vm_merchant_details !== null)) { 8161 vm_merchant_details.$refs.ref_services.getMerchantServices(); 8162 } 8163 }, 8164 afterSetAddress(){ 8165 dump('afterSetAddress'); 8166 this.$refs.address.close(); 8167 this.refreshWidget(); 8168 }, 8169 afterCloseAddress(){ 8170 this.$refs.transaction.show(this.data); 8171 }, 8172 ShowTransOptions(){ 8173 this.$refs.transaction.close(); 8174 this.$refs.transaction_options.show(); 8175 }, 8176 afterSaveTransOptions(data){ 8177 this.$refs.transaction_options.close(); 8178 8179 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 8180 dump("afterSaveTransOptions"); 8181 dump(data.delivery_time); 8182 vm_feed.whento_deliver = data.whento_deliver; 8183 vm_feed.delivery_date = data.delivery_date; 8184 vm_feed.delivery_time = data.delivery_time.start_time; 8185 vm_feed.Search(false); 8186 } 8187 8188 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8189 vue_cart.loadcart(); 8190 } 8191 8192 this.$refs.transaction_info.whento_deliver = data.whento_deliver; 8193 this.$refs.transaction_info.delivery_datetime = data.delivery_datetime; 8194 8195 this.$refs.transaction.close(); 8196 }, 8197 editAddress(data){ 8198 dump("editAddress=>"); 8199 dump(data); 8200 this.$refs.address.close(); 8201 this.location_data = data; 8202 }, 8203 afterCloseAddForm(){ 8204 this.$refs.address.showModal(); 8205 }, 8206 afterSaveAddForm(){ 8207 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 8208 vm_feed.Search(false); 8209 } 8210 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8211 vue_cart.loadcart(); 8212 } 8213 this.$refs.transaction_info.TransactionInfo(); 8214 }, 8215 afterDeleteAddress(){ 8216 this.getClientAddresses(); 8217 }, 8218 afterDeleteAddForm(){ 8219 8220 }, 8221 getClientAddresses(){ 8222 axios({ 8223 method: 'POST', 8224 url: ajaxurl +"/getAddresses" , 8225 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 8226 timeout: $timeout, 8227 }).then( response => { 8228 if(response.data.code==1){ 8229 this.addresses = response.data.details.data; 8230 } else { 8231 this.addresses = []; 8232 } 8233 }).catch(error => { 8234 // 8235 }).then(data => { 8236 8237 }); 8238 }, 8239 }, 8240 }); 8241 app_widget_nav.use(ElementPlus); 8242 const vm_widget_nav = app_widget_nav.mount('#vue-widget-nav'); 8243 8244 8245 const app_widget_nav_mobile = Vue.createApp({ 8246 data() { 8247 return { 8248 data : [], 8249 addresses : [], 8250 transaction_type : '', 8251 transaction_list : [], 8252 deliveryAddress : [], 8253 location_data : [] 8254 } 8255 }, 8256 components: { 8257 'component-services' : ComponentsServices, 8258 'component-transaction-info' : ComponentsTransactionInfo, 8259 'component-delivery-details' : ComponentsDeliveryDetails, 8260 'component-change-address': changeAddressComponent, 8261 'component-trans-options' : ComponenstTransactionOptions, 8262 'component-address': ComponentsAddress, 8263 'component-mobile-search-suggestion' : ComponentsMobileSearchSuggestion , 8264 'components-select-address': ComponentsSelectAddress, 8265 'components-address-form' : ComponentsAddressForm, 8266 }, 8267 mounted () { 8268 8269 }, 8270 methods: { 8271 setTransaction(transaction_type,transaction_list){ 8272 this.transaction_type = transaction_type; 8273 this.transaction_list = transaction_list; 8274 }, 8275 reloadFeed(transaction_type){ s 8276 this.transaction_type = transaction_type; 8277 vm_feed.transaction_type = transaction_type; 8278 vm_feed.Search(false); 8279 }, 8280 setTransactionInfo(data){ 8281 this.data = data; 8282 this.$refs.transaction.show(this.data); 8283 }, 8284 showAddress(){ 8285 this.$refs.transaction.close(); 8286 this.$refs.address.showModal(); 8287 this.getClientAddresses(); 8288 }, 8289 afterChangeAddress(data){ 8290 if(isGuest==='1'){ 8291 this.deliveryAddress = data; 8292 //this.$refs.address_modal.show(true); 8293 this.$refs.address_modal.visible = true; 8294 } else { 8295 this.$refs.transaction.close(); 8296 this.location_data = data; 8297 } 8298 }, 8299 afterPointaddress(data){ 8300 this.$refs.address_modal.setLoading(true); 8301 axios({ 8302 method: 'POST', 8303 url: ajaxurl+"/setPlaceID" , 8304 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&place_id="+ data.place_id , 8305 timeout: $timeout, 8306 }).then( response => { 8307 this.afterSetAddress(); 8308 //this.$refs.address_modal.show(false); 8309 this.$refs.address_modal.visible = false;
8310 }).catch(error => { 8311 ElementPlus.ElNotification({ 8312 title: "", 8313 message: error, 8314 position: 'bottom-right', 8315 type: 'warning', 8316 }); 8317 }).then(data => { 8318 this.$refs.address_modal.setLoading(false); 8319 }); 8320 }, 8321 afterSetAddress(){ 8322 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 8323 vm_feed.Search(false); 8324 } 8325 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8326 vue_cart.loadcart(); 8327 } 8328 this.$refs.transaction_info.TransactionInfo(); 8329 this.$refs.address.close(); 8330 this.$refs.transaction.close(); 8331 8332 if ((typeof vm_merchant_details !== "undefined") && ( vm_merchant_details !== null)) { 8333 vm_merchant_details.$refs.ref_services.getMerchantServices(); 8334 } 8335 }, 8336 afterCloseAddress(){ 8337 this.$refs.transaction.show(this.data); 8338 }, 8339 ShowTransOptions(){ 8340 this.$refs.transaction.close(); 8341 this.$refs.transaction_options.show(); 8342 }, 8343 afterSaveTransOptions(data){ 8344 this.$refs.transaction_options.close(); 8345 8346 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 8347 dump("afterSaveTransOptions"); 8348 dump(data.delivery_time); 8349 vm_feed.whento_deliver = data.whento_deliver; 8350 vm_feed.delivery_date = data.delivery_date; 8351 vm_feed.delivery_time = data.delivery_time.start_time; 8352 vm_feed.Search(false); 8353 } 8354 8355 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8356 vue_cart.loadcart(); 8357 } 8358 8359 this.$refs.transaction_info.whento_deliver = data.whento_deliver; 8360 this.$refs.transaction_info.delivery_datetime = data.delivery_datetime; 8361 8362 this.$refs.transaction.close(); 8363 }, 8364 editAddress(data){ 8365 this.$refs.address.close(); 8366 this.$refs.addressform.show( data.address_uuid ); 8367 }, 8368 afterCloseAddForm(){ 8369 this.$refs.address.showModal(); 8370 }, 8371 afterSaveAddForm(){ 8372 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 8373 vm_feed.Search(false); 8374 } 8375 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8376 vue_cart.loadcart(); 8377 } 8378 this.$refs.transaction_info.TransactionInfo(); 8379 }, 8380 afterDeleteAddress(){ 8381 this.getClientAddresses(); 8382 }, 8383 afterDeleteAddForm(){ 8384 8385 }, 8386 getClientAddresses(){ 8387 8388 var timenow = getTimeNow(); 8389 var $params = { 8390 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 8391 }; 8392 8393 $params = JSON.stringify($params); 8394 8395 ajax_request[timenow] = $.ajax({ 8396 url: ajaxurl+"/getAddresses", 8397 method: "PUT", 8398 dataType: "json", 8399 data: $params , 8400 contentType : $content_type.json , 8401 timeout: $timeout, 8402 crossDomain: true, 8403 beforeSend: function( xhr ) { 8404 if(ajax_request[timenow] != null) { 8405 ajax_request[timenow].abort(); 8406 } 8407 } 8408 }); 8409 8410 ajax_request[timenow].done( data => { 8411 if ( data.code==1){ 8412 this.addresses = data.details.data; 8413 } else { 8414 this.addresses = []; 8415 } 8416 }); 8417 8418 }, 8419 showSearchSuggestion(){ 8420 this.$refs.search_suggestion.show(); 8421 }, 8422 onSavelocation(data,addressData){ 8423 dump('onSavelocation here'); 8424 this.$refs.address_form.setLoading(true); 8425 let params = { 8426 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 8427 'cart_uuid':getCookie('cart_uuid'), 8428 'data': data, 8429 'location_name' : addressData.location_name, 8430 'delivery_instructions' : addressData.delivery_instructions, 8431 'delivery_options' : addressData.delivery_options, 8432 'address_label' : addressData.address_label, 8433 'formatted_address' : addressData.formatted_address, 8434 'address1' : addressData.address1, 8435 }; 8436 axios({ 8437 method: 'PUT', 8438 url: ajaxurl+"/checkoutSaveAddress" , 8439 data : params, 8440 timeout: $timeout, 8441 }).then( response => { 8442 if(response.data.code==1){ 8443 this.afterSetAddress(); 8444 this.$refs.address_form.close(); 8445 } else { 8446 ElementPlus.ElNotification({ 8447 title: "", 8448 message: response.data.msg, 8449 position: 'bottom-right', 8450 type: 'warning', 8451 }); 8452 } 8453 }).catch(error => { 8454 ElementPlus.ElNotification({ 8455 title: "", 8456 message: error, 8457 position: 'bottom-right', 8458 type: 'warning', 8459 }); 8460 }).then(data => { 8461 this.$refs.address_form.setLoading(false); 8462 }); 8463 }, 8464 editAddress(data){ 8465 this.$refs.address.close(); 8466 this.location_data = data; 8467 }, 8468 }, 8469 }); 8470 app_widget_nav_mobile.use(ElementPlus); 8471 const vm_widget_nav_mobile = app_widget_nav_mobile.mount('#vue-widget-nav-mobile'); 8472 8473 8474 const ComponentsPromoDetails = { 8475 props: ['merchant_id','label'], 8476 data() { 8477 return { 8478 loading : false, 8479 data :[], 8480 modal : false, 8481 } 8482 }, 8483 created() { 8484 this.getPromoDetails(); 8485 }, 8486 computed: { 8487 getData(){ 8488 return this.data; 8489 }, 8490 hasData(){ 8491 if (Object.keys(this.data).length > 0) { 8492 return true; 8493 } 8494 return false;
8495 }, 8496 }, 8497 methods: { 8498 getPromoDetails(){ 8499 this.loading = true; 8500 8501 let $params; 8502 let currency_code = getCookie('currency_code'); 8503 currency_code = !empty(currency_code)?currency_code:''; 8504 8505 $params="merchant_id=" + this.merchant_id; 8506 $params+="¤cy_code=" + currency_code; 8507 $params+=addValidationRequest(); 8508 8509 axios({ 8510 method: 'POST', 8511 url: ajaxurl+"/getPromoDetails" , 8512 data : $params, 8513 timeout: $timeout, 8514 }).then( response => { 8515 if(response.data.code==1){ 8516 this.data = response.data.details; 8517 } 8518 }).catch(error => { 8519 // 8520 }).then(data => { 8521 this.loading = false; 8522 }); 8523 }, 8524 }, 8525 template :` 8526 <el-skeleton :rows="1" animated :loading="loading" ></el-skeleton> 8527 <div v-if="hasData" class="d-flex align-self-center"> 8528 <div class="mr-1"><i style="transform: rotate(90deg);" class="fas fa-tag"></i></div> 8529 <p class="mr-1">{{label.enjoy}}</p> 8530 <p class="mr-1"> 8531 <a href="javascript:;" class="text-green" @click="modal=true"> 8532 {{label.see_details}} 8533 </a> 8534 </p> 8535 </div> 8536 8537 <el-dialog 8538 v-model="modal" 8539 :title="label.title" 8540 width="40%" 8541 > 8542 8543 <template v-for="items in getData" :key="items" > 8544 <div class="mb-2"> 8545 <h6>{{items.title}}</h6> 8546 <p v-if="items.sub_title" class="m-0"><div class="info-items-dot-separator"></div> {{items.sub_title}}</p> 8547 <p v-if="items.valid_to" class="m-0"><div class="info-items-dot-separator"></div> {{items.valid_to}}</p> 8548 </div> 8549 </template> 8550 8551 </el-dialog> 8552 ` 8553 }; 8554 8555 /* 8556 MENU MERCHANT DETAILS 8557 */ 8558 const app_merchant_details = Vue.createApp({ 8559 components: { 8560 'component-save-store' : ComponentsSaveStore, 8561 'component-merchant-services' : ComponentsMerchantServices, 8562 'component-promo-details' : ComponentsPromoDetails, 8563 }, 8564 data(){ 8565 return { 8566 found : false, 8567 is_loading : false, 8568 image_background : '' 8569 }; 8570 }, 8571 mounted () { 8572 this.getSaveStore(); 8573 }, 8574 methods :{ 8575 afterUpdateServices(data){ 8576 /*if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 8577 vue_cart.loadcart(); 8578 }*/ 8579 vm.updateTransactionType(data); 8580 }, 8581 afterUpdateServicesMobile(data){ 8582 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 8583 vm_cart_preview.getCartPreview(); 8584 } 8585 }, 8586 getSaveStore(){ 8587 8588 var $params = { 8589 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 8590 'merchant_id': merchant_id, 8591 }; 8592 var timenow = getTimeNow(); 8593 $params = JSON.stringify($params); 8594 8595 ajax_request[timenow] = $.ajax({ 8596 url: ajaxurl+"/getSaveStore", 8597 method: "PUT", 8598 dataType: "json", 8599 data: $params , 8600 contentType : $content_type.json , 8601 timeout: $timeout, 8602 crossDomain: true, 8603 beforeSend: data => { 8604 this.is_loading = true; 8605 if(ajax_request[timenow] != null) { 8606 ajax_request[timenow].abort(); 8607 } 8608 } 8609 }); 8610 8611 ajax_request[timenow].done( data => { 8612 if ( data.code==1){ 8613 this.found = true; 8614 } else { 8615 this.found = false; 8616 } 8617 }); 8618 8619 ajax_request[timenow].always( data => { 8620 this.is_loading = false; 8621 }); 8622 8623 }, 8624 }, 8625 }); 8626 app_merchant_details.use(ElementPlus); 8627 const vm_merchant_details = app_merchant_details.mount('#vue-merchant-details'); 8628 8629 8630 /* 8631 CATEGORY CAROUSEL 8632 */ 8633 const componentsCategoryCarousel = { 8634 props : ['data','restaurant_name'], 8635 data(){ 8636 return { 8637 owl : undefined, 8638 drawer : false 8639 }; 8640 }, 8641 watch: { 8642 data(new_data,old_data){ 8643 setTimeout(() => { 8644 this.renderCarousel(); 8645 }, 1); 8646 } 8647 }, 8648 mounted () { 8649 setTimeout(() => { 8650 $(window).on('activate.bs.scrollspy', (e,obj)=>{ 8651 var myElement = $("a[href='"+ obj.relatedTarget +"']"); 8652 var index = parseInt(myElement[1].dataset.id); 8653 this.SlideTo( index ); 8654 }) 8655 }, 500); 8656 }, 8657 methods: { 8658 renderCarousel(){ 8659 let $is_rtl = false;
8660 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 8661 $is_rtl = is_rtl=='1'?true:false; 8662 } 8663 this.owl = $(this.$refs.category_carousel).owlCarousel({ 8664 loop:false, 8665 dots:false, 8666 nav:false, 8667 autoWidth:true, 8668 rtl : $is_rtl 8669 }); 8670 }, 8671 nextSlide(){ 8672 this.owl.trigger('next.owl.carousel'); 8673 }, 8674 prevSlide(){ 8675 this.owl.trigger('prev.owl.carousel'); 8676 }, 8677 SlideTo(index){ 8678 this.owl.trigger('to.owl.carousel', [index, 500, true]); 8679 }, 8680 }, 8681 template : ` 8682 <el-affix target=".section-menu" :offset="0" z-index="9" > 8683 <div class="row no-gutters align-items-center category-carousel border-bottom"> 8684 <div class="col-1 text-left"> 8685 <a @click="drawer=true" class="btn font-weight-bold"><i class="zmdi zmdi-menu"></i></a> 8686 </div> 8687 <div class="col-1 text-left"> 8688 <a @click="prevSlide" class="btn font-weight-bold"><i class="zmdi zmdi-chevron-left"></i></a> 8689 </div> 8690 <div class="col-9"> 8691 <div ref="category_carousel" id="menu-category" class="owl-carousel owl-theme"> 8692 <template v-for="(item, index) in data" > 8693 <a :href="'#'+item.category_uiid" :data-id="index" :class="{active : index==0}" class="nav-link d-flex align-items-center font-weight-bolder mr-3"> 8694 <p class="m-0">{{item.category_name}}</p> 8695 </a> 8696 </template> 8697 </div> 8698 </div> 8699 <div class="col-1 text-right"> 8700 <a @click="nextSlide" class="btn font-weight-bold"><i class="zmdi zmdi-chevron-right"></i></a> 8701 </div> 8702 </div> 8703 </el-affix> 8704 8705 <el-drawer 8706 v-model="drawer" 8707 direction="btt" 8708 size="65%" 8709 append-to-body="true" 8710 :title="restaurant_name" 8711 :with-header="true" 8712 custom-class="drawer-category" 8713 > 8714 <div class="list-group list-group-modified"> 8715 <a @click="drawer=false" v-for="(item, index) in data" :href="'#'+item.category_uiid" class="list-group-item d-flex justify-content-between"> 8716 <div class="">{{item.category_name}}</div> 8717 <div class=""> 8718 <div class="bg-light btn-circle rounded-pill">{{item.items.length}}</div> 8719 </div> 8720 </a> 8721 </div> 8722 </el-drawer> 8723 ` 8724 }; 8725 8726 const componentsSearchMenu = { 8727 data() { 8728 return { 8729 awaitingSearch : false, 8730 q :'', 8731 some_words : [], 8732 } 8733 }, 8734 created() { 8735 this.some_words = JSON.parse(some_words); 8736 }, 8737 computed: { 8738 hasSearch(){ 8739 if(this.q){ 8740 return true; 8741 } 8742 return false; 8743 } 8744 }, 8745 watch: { 8746 q(newsearch,oldsearch){ 8747 if (!this.awaitingSearch) { 8748 if(empty(newsearch)){ 8749 return false; 8750 } 8751
8752 let currency_code = getCookie('currency_code'); 8753 currency_code = !empty(currency_code)?currency_code:''; 8754 8755 setTimeout(() => { 8756 axios({ 8757 method: 'POST', 8758 url: ajaxurl+"/searchmenu" , 8759 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&q=" + this.q + "&merchant_id="+ merchant_id + "¤cy_code="+currency_code, 8760 timeout: $timeout, 8761 }).then( response => { 8762 if(response.data.code==1){ 8763 this.$emit("afterSearch",this.q,response.data.details.data); 8764 } else { 8765 this.$emit("afterSearch",this.q,[]); 8766 } 8767 }).catch(error => { 8768 // 8769 }).then(data => { 8770 this.awaitingSearch = false; 8771 }); 8772 }, 1000); // 1 sec delay 8773 8774 this.awaitingSearch = true; 8775 } 8776 }, 8777 }, 8778 methods: { 8779 clearSearch(){ 8780 this.q = ''; 8781 this.$emit("clearSearch"); 8782 }, 8783 }, 8784 template : ` 8785 <el-input 8786 v-model="q" 8787 class="w-100" 8788 size="large" 8789 :placeholder="some_words.search_in_menu" 8790 > 8791 <template #prefix> 8792 <i class="zmdi zmdi-search" class="font20"></i> 8793 </template> 8794 <template #suffix> 8795 <div v-if="awaitingSearch" class="loading"> 8796 <div class="circle-loader" data-loader="circle-side"></div> 8797 </div> 8798 <template v-else> 8799 <template v-if="hasSearch"> 8800 <el-link type="primary" @click="clearSearch" > 8801 {{some_words.clear}} 8802 </el-link> 8803 </template> 8804 </template> 8805 </template> 8806 </el-input> 8807 ` 8808 }; 8809 8810 const componentsTopCategory = { 8811 props : ['data'], 8812 components : { 8813 'component-search-menu' : componentsSearchMenu, 8814 }, 8815 data() { 8816 return { 8817 mySwiper : undefined, 8818 some_words : [] 8819 } 8820 }, 8821 mounted () { 8822 setTimeout(() => { 8823 $(window).on('activate.bs.scrollspy', (e,obj)=>{ 8824 let myElement = $("a[href='"+ obj.relatedTarget +"']"); 8825 let index = parseInt(myElement[1].dataset.id); 8826 this.SlideTo( index ); 8827 }) 8828 }, 500); 8829 this.some_words = JSON.parse(some_words); 8830 }, 8831 watch: { 8832 data(newval,oldval){ 8833 setTimeout(() => { 8834 this.renderCarousel(); 8835 }, 1); 8836 }, 8837 }, 8838 methods: { 8839 renderCarousel(){ 8840 let $is_rtl = false; 8841 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 8842 $is_rtl = is_rtl=='1'?true:false; 8843 } 8844 this.owl = $(this.$refs.category_carousel).owlCarousel({ 8845 loop:false, 8846 dots:false, 8847 nav:true, 8848 autoWidth:true, 8849 rtl : $is_rtl 8850 }); 8851 }, 8852 SlideTo(index){ 8853 this.owl.trigger('to.owl.carousel', [index, 500, true]); 8854 }, 8855 afterSearch(q,data){ 8856 this.$emit('afterSearch',q,data); 8857 }, 8858 clearSearch(){ 8859 this.$emit('clearSearch'); 8860 }, 8861 }, 8862 template : ` 8863 <el-affix target=".section-menu" :offset="0" z-index="9" > 8864 <div class="bg-white p-1 mb-4 d-none d-lg-block category-owlcarousel"> 8865 <div class="row no-gutters"> 8866 <div class="col-12"> 8867 <div ref="category_carousel" id="menu-category" class="owl-carousel owl-theme"> 8868 <template v-for="(item, index) in data" > 8869 <a :href="'#'+item.category_uiid" :data-id="index" :class="{active : index==0}" class="nav-link d-flex align-items-center mr-3"> 8870 <div class="m-0">{{item.category_name}}</div> 8871 </a> 8872 </template> 8873 </div> 8874 </div> 8875 8876 <div class="col-12 mt-2 mb-2 p-2"> 8877 <component-search-menu 8878 @after-search="afterSearch" 8879 @clear-search="clearSearch" 8880 > 8881 </component-search-menu> 8882 </div> 8883 </div> 8884 </div> 8885 </el-affix> 8886 ` 8887 }; 8888 8889 const componentsMenuSearchResult = { 8890 template: '#xtemplate_menusearch', 8891 props: ['q','data'], 8892 computed: { 8893 hasSearch(){ 8894 if(!empty(this.q)){ 8895 return true; 8896 } 8897 return false; 8898 }, 8899 getData(){ 8900 if (Object.keys(this.data).length > 0) { 8901 return this.data; 8902 } 8903 return false; 8904 }, 8905 hasResults(){ 8906 if (Object.keys(this.data).length > 0) { 8907 return true; 8908 } 8909 return false; 8910 }, 8911 }, 8912 methods: { 8913 viewItem(data){ 8914 if ((typeof vm !== "undefined") && ( vm !== null)) { 8915 vm.viewItemBefore(data); 8916 } 8917 }, 8918 }, 8919 }; 8920 8921 const componentsSearchMenuMobile = { 8922 components : { 8923 'component-search-menu' : componentsSearchMenu, 8924 }, 8925 methods: { 8926 afterSearch(q,data){ 8927 this.$emit('afterSearch',q,data); 8928 }, 8929 clearSearch(){ 8930 this.$emit('clearSearch'); 8931 }, 8932 }, 8933 template : ` 8934 <div class="pt-2"> 8935 <component-search-menu 8936 @after-search="afterSearch" 8937 @clear-search="clearSearch" 8938 > 8939 </component-search-menu>
8940 </div> 8941 ` 8942 }; 8943 8944 /** 8945 CATEGORY VUE RENDER 8946 this is function for displaying category 8947 target = vue-merchant-category 8948 */ 8949 const app_merchant_category = Vue.createApp({ 8950 components : { 8951 'components-category-carousel' : componentsCategoryCarousel, 8952 'component-topcategory' : componentsTopCategory, 8953 'component-menu-search-result' : componentsMenuSearchResult, 8954 'components-search-menu-mobile' : componentsSearchMenuMobile 8955 }, 8956 data(){ 8957 return { 8958 category_loading : true, 8959 category_data : [], 8960 q : '', 8961 search_menu_data : [] 8962 }; 8963 }, 8964 mounted () { 8965 //var $cart_uuid = getCookie('cart_uuid'); 8966 //if(!empty($cart_uuid)){ 8967 var $params; var timenow = getTimeNow(); 8968 $params="merchant_id=" + merchant_id; 8969 $params+=addValidationRequest(); 8970 ajax_request[timenow] = $.ajax({ 8971 url: ajaxurl+"/getCategory", 8972 method: "POST", 8973 dataType: "json", 8974 data: $params, 8975 contentType : $content_type.form , 8976 timeout: $timeout, 8977 crossDomain: true, 8978 beforeSend: function( xhr ) { 8979 if(ajax_request[timenow] != null) { 8980 ajax_request[timenow].abort(); 8981 } 8982 } 8983 }); 8984 8985 ajax_request[timenow].done( data => { 8986 this.category_loading = false; 8987 if(data.code==1){ 8988 this.category_data = data.details.data.category 8989 } 8990 }); // ajax done 8991 8992 //} // end if 8993 }, 8994 methods: { 8995 afterSearch(q,data){ 8996 this.q = q; 8997 this.search_menu_data = data; 8998 this.scrollToResults(); 8999 }, 9000 clearSearch(){ 9001 this.q = ''; 9002 this.search_menu_data = []; 9003 }, 9004 scrollToResults() { 9005 this.$refs["search_result"].scrollIntoView({ behavior: "smooth" }) 9006 }, 9007 }, 9008 }); 9009 app_merchant_category.use(ElementPlus); 9010 const vm_merchant_category = app_merchant_category.mount('#vue-merchant-category'); 9011 9012 9013 /** 9014 TRANSACTION VUE RENDER 9015 this is function for displaying merchant transaction list 9016 target = vue-transaction-list 9017 */ 9018 const vm_services = Vue.createApp({ 9019 9020 data(){ 9021 return { 9022 transaction_list :[], 9023 transaction : '' 9024 }; 9025 }, 9026 mounted () { 9027 this.getTransactionList() 9028 }, 9029 updated () { 9030 dump( "=>"+this.transaction ); 9031 this.updateService(); 9032 }, 9033 methods: { 9034 getTransactionList(){ 9035 9036 var $params; var timenow = getTimeNow(); 9037 $params="merchant_id=" + merchant_id; 9038 $params+="&cart_uuid=" + getCookie('cart_uuid'); 9039 $params+=addValidationRequest(); 9040 ajax_request[timenow] = $.ajax({ 9041 url: ajaxurl+"/servicesList", 9042 method: "POST", 9043 dataType: "json", 9044 data: $params, 9045 contentType : $content_type.form , 9046 timeout: $timeout, 9047 crossDomain: true, 9048 beforeSend: function( xhr ) { 9049 if(ajax_request[timenow] != null) { 9050 ajax_request[timenow].abort(); 9051 } 9052 } 9053 }); 9054 9055 ajax_request[timenow].done( data => { 9056 if ( data.code==1){ 9057 this.transaction_list = data.details.data; 9058 this.transaction = data.details.transaction; 9059 } else { 9060 this.transaction_list = []; 9061 this.transaction = ''; 9062 } 9063 }); // ajax done 9064 }, 9065 updateService(){ 9066 9067 if(!empty(vue_cart.cart_uuid)){ 9068 9069 var $params; var timenow = getTimeNow(); 9070 $params="cart_uuid=" + vue_cart.cart_uuid; 9071 $params+="&transaction_type=" + this.transaction; 9072 9073 $params+=addValidationRequest(); 9074 ajax_request[timenow] = $.ajax({ 9075 url: ajaxurl+"/updateService", 9076 method: "POST", 9077 dataType: "json", 9078 data: $params, 9079 contentType : $content_type.form , 9080 timeout: $timeout, 9081 crossDomain: true, 9082 beforeSend: function( xhr ) { 9083 if(ajax_request[timenow] != null) { 9084 ajax_request[timenow].abort(); 9085 } 9086 } 9087 }); 9088 9089 ajax_request[timenow].done( data => { 9090 vue_cart.loadcart(); 9091 }); // ajax done 9092 9093 } 9094 }, 9095 }, 9096 }).mount('#vue-services-list'); 9097 9098 9099 const componentsAllergens = { 9100 props : ['label','merchant_id'], 9101 data() { 9102 return { 9103 modal : false, 9104 loading : false, 9105 item_id : '', 9106 allergen : [], 9107 allergen_data : [], 9108 allergenData : [] 9109 } 9110 }, 9111 methods: { 9112 show(data){ 9113 this.modal = true; 9114 this.item_id = data; 9115 this.getAllergenInfo(); 9116 }, 9117 getAllergenInfo(){ 9118 this.loading = true; 9119 axios({ 9120 method: 'POST', 9121 url: ajaxurl+"/getAllergenInfo" , 9122 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&item_id=" + this.item_id + "&merchant_id=" + this.merchant_id + "&lang=" + document.documentElement.lang, 9123 timeout: $timeout, 9124 }).then( response => { 9125 if(response.data.code==1){ 9126 this.allergen = response.data.details.allergen; 9127 this.allergen_data = response.data.details.allergen_data; 9128 this.allergenData = response.data.details.result; 9129 9130 } else { 9131 this.allergen = []; 9132 this.allergen_data = []; 9133 } 9134 }).catch(error => { 9135 // 9136 }).then(data => { 9137 this.loading = false;
9138 }); 9139 }, 9140 }, 9141 template : ` 9142 <el-dialog 9143 v-model="modal" 9144 :title="label.title" 9145 width="40%" 9146 class="modal-allergens" 9147 > 9148 9149 <template v-if="loading" > 9150 <div style="min-height:100px;" v-loading="loading"> 9151 </div> 9152 </template> 9153 <template v-else > 9154 <h5>{{label.sub_title}}</h5> 9155 <ul> 9156 <template v-for="item in allergen"> 9157 <li v-if="allergen_data[item]"> 9158 {{ allergen_data[item] }} 9159 </li> 9160 </template> 9161 </ul> 9162 <div v-for="(items, category) in allergenData" :key="category" class="category-block"> 9163 <h5>{{ category }}</h5> 9164 <ul> 9165 <li v-for="item in items" :key="item.id"> 9166 <strong>{{ item.name }} 9167 </li> 9168 </ul> 9169 </div> 9170 </template> 9171 9172 </el-dialog> 9173 ` 9174 }; 9175 9176 9177 /** 9178 MENU VUE RENDER 9179 this is function for displaying menu and item details 9180 target = vue-merchant-menu 9181 */ 9182 var $global_items = []; 9183 var $global_addons = []; 9184 var $global_addon_items = []; 9185 var $global_item_addons = []; 9186 var $new_item_addons 9187 9188 const app_vm = Vue.createApp({ 9189 components: { 9190 'component-change-address': changeAddressComponent, 9191 'money-format': ComponentsMoney, 9192 'components-search-menu' : componentsSearchMenuMobile, 9193 'component-menu-search-result' : componentsMenuSearchResult, 9194 'component-allergens' : componentsAllergens 9195 }, 9196 data(){ 9197 return { 9198 merchant_id : 0, 9199 menu_loading : true, 9200 menu_data: [], 9201 items : [], 9202 item_addons : [], 9203 item_addons_load : false, 9204 size_id : 0, 9205 disabled_cart : true, 9206 item_qty : 1, 9207 item_total : 0, 9208 add_to_cart : false, 9209 meta : [], 9210 special_instructions : '', 9211 sold_out_options : [], 9212 if_sold_out : 'substitute', 9213 view_data : [] , 9214 item_loading : false, 9215 item_in_cart : 0, 9216 subtotal_in_cart : 0, 9217 merchant_data : [], 9218 items_not_available : [], 9219 category_not_available : [], 9220 showText: null, 9221 menu_layout :'list', 9222 q: '', 9223 search_menu_data : [], 9224 allergen : [], 9225 allergen_data : [], 9226 allergenData : [], 9227 item_gallery : [], 9228 image_featured : '', 9229 money_config : '', 9230 dish : [], 9231 transaction_type: transaction_type // delivery or pickup only 9232 } 9233 }, 9234 created() { 9235 this.geStoreMenu(); 9236 }, 9237 mounted () { 9238 let menu_layout = getCookie('menu_layout'); 9239 if(!empty(menu_layout)){ 9240 this.menu_layout = menu_layout; 9241 } 9242 }, 9243 updated () { 9244 if(this.item_addons_load==true){ 9245 this.ItemSummary(); 9246 } 9247 updateStickySibader(); 9248 }, // 9249 computed: { 9250 getAllergen(){ 9251 return this.allergen; 9252 }, 9253 hasAllergen(){ 9254 if (Object.keys(this.allergen).length > 0) { 9255 return true; 9256 } 9257 return false; 9258 }, 9259 getItemGallery(){ 9260 return this.item_gallery; 9261 } 9262 }, 9263 methods: { 9264 toggleText(idx) { 9265 this.showText === idx ? this.showText = null : this.showText = idx 9266 }, 9267 updateTransactionType(type){ 9268 this.transaction_type = type; 9269 vm_cart_preview.showCartPreview(); 9270 }, 9271 geStoreMenu(){ 9272 var $params; 9273 let currency_code = getCookie('currency_code'); 9274 currency_code = !empty(currency_code)?currency_code:''; 9275 9276 let transactionType = this.transaction_type?.trim() || getCookie('cart_transaction_type') || 'delivery'; 9277 9278 this.transaction_type = transactionType; 9279 9280 $params="merchant_id=" + merchant_id; 9281 $params+="¤cy_code=" + currency_code; 9282 $params+="&transaction_type=" + this.transaction_type; 9283 9284 $params+=addValidationRequest(); 9285 var timenow = getTimeNow(); 9286 ajax_request[timenow] = $.ajax({ 9287 url: ajaxurl+"/geStoreMenu", 9288 method: "POST", 9289 dataType: "json", 9290 data: $params , 9291 contentType : $content_type.form , 9292 timeout: $timeout, 9293 crossDomain: true, 9294 beforeSend: function( xhr ) { 9295 if(ajax_request[timenow] != null) { 9296 ajax_request[timenow].abort(); 9297 } 9298 } 9299 }).done( data => { 9300 this.menu_loading = false; 9301 if(data.code==1) { 9302 this.transaction_type = transactionType; 9303 this.merchant_id = data.details.merchant_id; 9304 var $category = data.details.data.category; 9305 var $items = data.details.data.items; 9306 var $new_category = []; var $new_items = []; 9307 9308 this.items_not_available = data.details.data.items_not_available; 9309 this.category_not_available = data.details.data.category_not_available; 9310 this.dish = data.details.data.dish; 9311 9312 if($category.length>0){ 9313 $.each($category, function(key, val){
9314 $.each(val.items, function(items_key, $item_id){ 9315 if(!empty($items[$item_id])){ 9316 $new_items.push( $items[$item_id] ); 9317 } 9318 }); // loop 9319 $new_category.push({ 9320 'cat_id': val.cat_id, 9321 'category_name': val.category_name, 9322 'category_description': val.category_description, 9323 'category_information': val.category_information, 9324 'category_image': val.url_image, 9325 'category_uiid': val.category_uiid, 9326 'items':$new_items 9327 }); 9328 $new_items = []; 9329 }); // loop 9330 } 9331 9332 this.menu_data = $new_category; 9333 this.updateImage(); 9334 } 9335 9336 }); 9337 // 9338 }, 9339 itemAvailable(item_id,cat_id){ 9340 if(this.items_not_available.includes(parseInt(item_id))===false){ 9341 if(this.category_not_available.includes(parseInt(cat_id))===false){ 9342 return true; 9343 } 9344 } 9345 return false; 9346 }, 9347 updateImage(){ 9348 updateLazyImage(); 9349 }, 9350 viewItemBefore(data){ 9351 this.viewItem(data); 9352 }, 9353 afterChangeAddress(){ 9354 9355 if ((typeof vm_addres_needed !== "undefined") && ( vm_addres_needed !== null)) { 9356 vm_addres_needed.visible = false; 9357 } 9358 9359 if ((typeof vm_widget_nav !== "undefined") && ( vm_widget_nav !== null)) { 9360 vm_widget_nav.afterChangeAddress(); 9361 } 9362 9363 if ((typeof vm_merchant_details !== "undefined") && ( vm_merchant_details !== null)) { 9364 vm_merchant_details.$refs.ref_services.getMerchantServices(); 9365 } 9366 9367 var count = Object.keys(this.view_data).length; 9368 dump("count=>"+ count); 9369 dump(this.view_data); 9370 if(count>0){ 9371 this.viewItem( this.view_data ); 9372 this.view_data = []; 9373 } 9374 }, 9375 viewItem(data) { 9376 this.special_instructions = ''; 9377 9378 $(this.$refs.modal_item_details).modal('show'); 9379 9380 var $item_uuid = data.item_uuid; 9381 var $cat_id = data.cat_id; 9382 9383 var $params; 9384 let currency_code = getCookie('currency_code'); 9385 currency_code = !empty(currency_code)?currency_code:''; 9386 9387 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 9388 9389 $params="merchant_id=" + merchant_id; 9390 $params+="&item_uuid="+ $item_uuid; 9391 $params+="&cat_id="+ $cat_id; 9392 $params+="¤cy_code="+ currency_code; 9393 $params+="&transaction_type="+ transactionType; 9394 9395 $params+=addValidationRequest(); 9396 var timenow = 1; 9397 this.item_loading = true; 9398 NProgress.start(); 9399 9400 ajax_request[timenow] = $.ajax({ 9401 url: ajaxurl+"/getMenuItem", 9402 method: "POST", 9403 dataType: "json", 9404 data: $params , 9405 contentType : $content_type.form, 9406 timeout: $timeout, 9407 crossDomain: true, 9408 beforeSend: function( xhr ) { 9409 if(ajax_request[timenow] != null) { 9410 ajax_request[timenow].abort(); 9411 } 9412 } 9413 }); 9414 9415 ajax_request[timenow].done( data => { 9416 9417 if(data.code==2){ 9418 $('#itemModal').modal('hide'); 9419 return; 9420 } 9421 9422 $global_items = data.details.data.items; 9423 $global_addons = data.details.data.addons; 9424 $global_addon_items = data.details.data.addon_items; 9425 $global_item_addons = data.details.data.items.item_addons; 9426 9427 var $meta = data.details.data.meta; 9428 this.money_config = data.details.money_config; 9429 this.item_gallery = data.details.data.meta.item_gallery; 9430 this.image_featured = ''; 9431 this.renderGallery(); 9432 9433 var $meta_details = data.details.data.meta_details; 9434 var $new_meta = { 9435 'cooking_ref' : [], 9436 'ingredients' : [], 9437 'dish' : [], 9438 }; 9439 9440 let $ingredients_preselected = data.details.data.items.ingredients_preselected; 9441 9442 if( !empty($meta)){ 9443 $.each($meta,function(key, item) { 9444 $.each(item,function(key2, item2) { 9445 if(!empty($meta_details[key])){ 9446 if(!empty($meta_details[key][item2])){ 9447 let $defaul_check = false;
9448 if(key=="ingredients" && $ingredients_preselected){ 9449 $defaul_check = true; 9450 } 9451 $new_meta[key].push({ 9452 'meta_id': $meta_details[key][item2].meta_id, 9453 'meta_name': $meta_details[key][item2].meta_name, 9454 'checked': $defaul_check 9455 }); 9456 } 9457 } 9458 }); 9459 }); 9460 } 9461 9462 var $price = $global_items.price; 9463 var $size_id = Object.keys($price)[0]; 9464 9465 //$('#itemModal').modal('show'); 9466 9467 this.item_qty = 1; 9468 this.service = getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery'; 9469 this.items = $global_items; 9470 this.size_id = $size_id; 9471 this.meta = $new_meta; 9472 this.getSizeData($size_id); 9473 this.sold_out_options = data.details.sold_out_options; 9474 this.updateImage(); 9475 9476 }); 9477 9478 ajax_request[timenow].always( data => { 9479 this.item_loading = false; 9480 NProgress.done(); 9481 }); 9482 9483 }, // end viewitem 9484 renderGallery(){ 9485 setTimeout(() => { 9486 let $is_rtl = false; 9487 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 9488 $is_rtl = is_rtl=='1'?true:false; 9489 } 9490 $(this.$refs.owl_item_gallery).owlCarousel({ 9491 rtl : $is_rtl, 9492 loop:false, 9493 margin:10, 9494 nav:false, 9495 dots:false, 9496 responsive:{ 9497 0:{ 9498 items:1 9499 }, 9500 600:{ 9501 items:3 9502 }, 9503 1000:{ 9504 items:5 9505 } 9506 } 9507 }); 9508 }, 10); 9509 }, 9510 setImage(data){ 9511 this.image_featured = data; 9512 }, 9513 updateImage(){ 9514 updateLazyImage(); 9515 }, 9516 setItemSize(event){ 9517 var $size_id = event.currentTarget.firstElementChild.value; 9518 this.size_id = $size_id;
9519 this.getSizeData($size_id); 9520 9521 }, // end setItemSize 9522 getSizeData($size_id){ 9523 //console.log($global_items.price[$size_id].size_id); 9524 if ( 9525 !$global_items || 9526 !$global_items.price || 9527 !$global_items.price[$size_id] 9528 ) { 9529 console.error("Invalid size_id:", $size_id, $global_items.price); 9530 return; 9531 } 9532 var item_size_id = $global_items.price[$size_id].size_id; 9533 $new_item_addons = []; var $sub_items=[]; 9534 if( !empty($global_item_addons[$size_id]) ){ 9535 $.each($global_item_addons[$size_id],function(key, item) { 9536 if(!empty($global_addons[$size_id])){ 9537 if(!empty($global_addons[$size_id][item])){ 9538 $global_addons[$size_id][item].subcat_id 9539 $.each($global_addons[$size_id][item].sub_items,function(key2, item2) { 9540 if ((typeof $global_addon_items[item2] !== "undefined") && ( $global_addon_items[item2] !== null)) { 9541 $sub_items.push({ 9542 'sub_item_id':$global_addon_items[item2].sub_item_id, 9543 'sub_item_name':$global_addon_items[item2].sub_item_name, 9544 'item_description':$global_addon_items[item2].item_description, 9545 //'price':$global_addon_items[item2].price, 9546 //'pretty_price':$global_addon_items[item2].pretty_price, 9547 'price':$global_addon_items[item2].addon_price != '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 9548 'pretty_price':$global_addon_items[item2].addon_price!= '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 9549 'checked':false, 9550 'disabled':false, 9551 'qty':1 9552 }); 9553 } 9554 }); 9555 9556 $new_item_addons.push({ 9557 'subcat_id' : $global_addons[$size_id][item].subcat_id, 9558 'subcategory_name' : $global_addons[$size_id][item].subcategory_name, 9559 'subcategory_description' : $global_addons[$size_id][item].subcategory_description, 9560 'multi_option' : $global_addons[$size_id][item].multi_option, 9561 'multi_option_min' : $global_addons[$size_id][item].multi_option_min, 9562 'multi_option_value' : $global_addons[$size_id][item].multi_option_value, 9563 'require_addon' : $global_addons[$size_id][item].require_addon, 9564 'pre_selected' : $global_addons[$size_id][item].pre_selected, 9565 'sub_items_checked': $global_addons[$size_id][item].multi_option == "one" ? $sub_items[0].sub_item_id : '', 9566 'sub_items':$sub_items 9567 }); 9568 $sub_items = [] ; 9569 } 9570 } 9571 }); 9572 } 9573 9574 9575 this.item_addons = $new_item_addons; 9576 this.item_addons_load = true; 9577 }, // end getSizeData 9578 9579 ItemSummary(data){ 9580 let transactionType = this.transaction_type?.trim() || getCookie('cart_transaction_type') || 'delivery'; 9581 $item_total = 0; 9582 var $required_addon = []; 9583 var $required_addon_added = []; 9584 let $min_addon = []; 9585 let $min_addon_added = []; 9586 9587 if(!empty(this.items.price)){ 9588 if(!empty(this.items.price[this.size_id])){ 9589 var item = this.items.price[this.size_id]; 9590 if( item.discount>0){ 9591 $item_total+=( this.item_qty * parseFloat(item.price_after_discount) ); 9592 } else $item_total+=( this.item_qty * parseFloat(transactionType == 'pickup' ? item.pickup_price : item.price) ); 9593 } 9594 } 9595 9596 this.item_addons.forEach((item,index) => { 9597 9598 //dump("=>" + item.multi_option); 9599 if ( item.require_addon==1){ 9600 $required_addon.push(item.subcat_id); 9601 } 9602 9603 if(item.multi_option=="custom"){ 9604 var total_check = 0; 9605 let multi_option_min = item.multi_option_min; 9606 var multi_option_value = item.multi_option_value; 9607 9608 if(multi_option_value>0){ 9609 $min_addon.push({ 9610 'subcat_id': item.subcat_id, 9611 'min':multi_option_min, 9612 'max':multi_option_value 9613 }); 9614 } 9615 9616 var item_index=[]; var item_index2=[];
9617 item.sub_items.forEach((item2,index2) => { 9618 if(item2.checked==true){ 9619 total_check++; 9620 $item_total+=( this.item_qty * parseFloat(item2.price) ); 9621 $required_addon_added.push( item.subcat_id ); 9622 } else item_index.push(index2); 9623 9624 if(item2.disabled==true){ 9625 item_index2.push(index2); 9626 } 9627 9628 }); 9629 9630 9631 $min_addon_added[item.subcat_id] = { 9632 'total' : total_check 9633 }; 9634 9635 if(total_check>=multi_option_value){ 9636 item_index.forEach((item3,index3) => { 9637 this.item_addons[index].sub_items[item3].disabled = true; 9638 }); 9639 } else { 9640 item_index2.forEach((item3,index3) => { 9641 this.item_addons[index].sub_items[item3].disabled = false; 9642 }); 9643 } 9644 9645 } else if ( item.multi_option=="one" ){ 9646 item.sub_items.forEach((item2,index2) => { 9647 if( item2.sub_item_id == item.sub_items_checked ) { 9648 $item_total+=( this.item_qty * parseFloat(item2.price) ); 9649 $required_addon_added.push( item.subcat_id ); 9650 } 9651 }); 9652 } else if ( item.multi_option=="multiple" ){ 9653 var item_index=[]; 9654 let multi_option_min = item.multi_option_min; 9655 var multi_option_value = item.multi_option_value; 9656 var limit = 0; 9657 9658 if(multi_option_value>0){ 9659 $min_addon.push({ 9660 'subcat_id': item.subcat_id, 9661 'min':multi_option_min, 9662 'max':multi_option_value 9663 }); 9664 } 9665 9666 item.sub_items.forEach((item2,index2) => { 9667 if(item2.checked==true){ 9668 $item_total+=( item2.qty * parseFloat(item2.price) ); 9669 $required_addon_added.push( item.subcat_id ); 9670 limit += item2.qty; 9671 } 9672 item_index.push(index2); 9673 }); 9674 9675 $min_addon_added[item.subcat_id] = { 9676 'total' : limit 9677 }; 9678 9679 this.item_addons[index].qty_selected =limit; 9680 if ( this.item_addons[index].qty_selected>= multi_option_value){ 9681 item_index.forEach((item3,index2) => { 9682 this.item_addons[index].sub_items[item3].disabled = true; 9683 }); 9684 } else { 9685 item_index.forEach((item3,index2) => { 9686 this.item_addons[index].sub_items[item3].disabled = false; 9687 }); 9688 } 9689 9690 } /*endif custom*/ 9691 9692 });/* end loop*/ 9693 9694 9695 this.item_total = $item_total; 9696 9697 var $required_meet=true; 9698 if($required_addon.length>0){ 9699 $.each($required_addon, function(i, val){ 9700 if($required_addon_added.includes(val)===false){ 9701 $required_meet = false; 9702 return false; 9703 } 9704 }); 9705 } 9706 9707 // CHECK COOKING REF 9708 if(this.items.cooking_ref_required){ 9709 let $cooking_ref_check = false; 9710 if (Object.keys(this.meta.cooking_ref).length > 0) { 9711 Object.entries(this.meta.cooking_ref).forEach(([cooking_key, cooking_items]) => { 9712 if(cooking_items.checked){ 9713 $cooking_ref_check = true; 9714 } 9715 }); 9716 } 9717 if(!$cooking_ref_check){ 9718 $required_meet = false; 9719 } 9720 } 9721 9722 if (Object.keys($min_addon).length > 0) { 9723 let min_value,min_selected; 9724 Object.entries($min_addon).forEach(([key_min_addon, items_min_addon]) => { 9725 min_value = parseInt(items_min_addon.min); 9726 if($min_addon_added[items_min_addon.subcat_id]){ 9727 min_selected = parseInt($min_addon_added[items_min_addon.subcat_id].total); 9728 } 9729 if(min_selected>0){ 9730 if(min_value>min_selected){ 9731 $required_meet = false; 9732 } 9733 } 9734 }); 9735 } 9736 9737 //dump("required_meet=>"+$required_meet); 9738 if($required_meet){ 9739 this.disabled_cart = false; 9740 } else this.disabled_cart = true; 9741 9742 }, // end ItemSummary 9743 updateInlineQtyBefore(dos,data,cat_id){ 9744 // this.view_data = []; 9745 // var $local_id = getCookie('kmrs_local_id'); 9746 // if(empty($local_id)){ 9747 // this.$refs.address.showModal(); 9748 // } else this.updateInlineQty(dos,data,cat_id); 9749 9750 this.updateInlineQty(dos,data,cat_id); 9751 }, 9752 updateInlineQty(dos,data,cat_id){ 9753 if(!empty(vue_cart.cart_merchant.merchant_id)){ 9754 if ( this.merchant_id != vue_cart.cart_merchant.merchant_id ){
9755 //var message = t("Your order contains items from") + " " + vue_cart.cart_merchant.restaurant_name + t(". Create a new order to add items."); 9756 var message = vue_cart.cart_merchant.confirm_add_item; 9757 vue_confirm_neworder.show({ content:message }).then((result) => { 9758 if(result){ 9759 vue_confirm_neworder.clearCart(vue_cart.cart_uuid).then((result) => { 9760 this.inlineQty( dos,data,cat_id ); 9761 }); 9762 } 9763 }); 9764 } else this.inlineQty( dos,data,cat_id ); 9765 } else this.inlineQty( dos,data,cat_id ); 9766 }, 9767 inlineQty(dos,data,cat_id) { 9768 if(dos=="add"){ 9769 data.qty+= 1; 9770 } else data.qty-= 1; 9771 9772 var item_size_id = $(".active .item_size_id_"+ data.item_uuid ).val(); 9773 if(empty(item_size_id)){ 9774 item_size_id = data.price[0]? data.price[0].item_size_id : ''; 9775 } 9776 9777 var $params = { 9778 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 9779 'merchant_id' : this.merchant_id, 9780 'cat_id' : cat_id, 9781 'item_token': data.item_uuid, 9782 'item_size_id': item_size_id, 9783 'item_qty': data.qty, 9784 'item_addons': [], 9785 'special_instructions': '', 9786 'meta' : [], 9787 'cart_uuid':getCookie('cart_uuid'), 9788 'inline_qty':1, 9789 'transaction_type': vm_merchant_details.$refs.ref_services.transaction, 9790 'if_sold_out' : this.if_sold_out, 9791 }; 9792 9793 var $data_delivery; 9794 if($data_delivery = getChoosenDeliveryTime()){ 9795 $params.whento_deliver = $data_delivery.whento_deliver; 9796 $params.delivery_date = $data_delivery.delivery_date; 9797 $params.delivery_time = $data_delivery.delivery_time; 9798 $params.delivery_time_raw = $data_delivery.delivery_time_raw; 9799 } 9800 9801 var timenow = 1; 9802 $params = JSON.stringify($params); 9803 9804 ajax_request[timenow] = $.ajax({ 9805 url: ajaxurl+"/addCartItems", 9806 method: "PUT", 9807 dataType: "json", 9808 data: $params , 9809 contentType : $content_type.json , 9810 timeout: $timeout, 9811 crossDomain: true, 9812 beforeSend: function( xhr ) { 9813 if(ajax_request[timenow] != null) { 9814 ajax_request[timenow].abort(); 9815 } 9816 } 9817 }); 9818 9819 ajax_request[timenow].done( data => { 9820 if ( data.code==1){ 9821 setCookie('cart_uuid',data.details.cart_uuid,30); 9822 9823 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 9824 vue_cart.loadcart(); 9825 } 9826 9827 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 9828 vm_cart_preview.getCartPreview(); 9829 } 9830 9831 } 9832 }); 9833 9834 },// 9835 CheckaddCartItems(){ 9836 if(!empty(vue_cart.cart_merchant.merchant_id)){ 9837 if ( this.items.merchant_id != vue_cart.cart_merchant.merchant_id ){ 9838 $('#itemModal').modal('hide'); 9839 //var message = t("Your order contains items from") + " " + vue_cart.cart_merchant.restaurant_name + t(". Create a new order to add items."); 9840 var message = vue_cart.cart_merchant.confirm_add_item; 9841 vue_confirm_neworder.show({ content:message } ).then((result) => { 9842 if(result){ 9843 vue_confirm_neworder.clearCart(vue_cart.cart_uuid).then((result) => { 9844 dump("resp:"+ result); 9845 this.addCartItems(); 9846 }); 9847 } 9848 }); 9849 } else this.addCartItems(); 9850 } else this.addCartItems(); 9851 9852 }, 9853 addCartItems(event){ 9854 if (event) { 9855 event.preventDefault() 9856 } 9857 9858 this.add_to_cart = true; 9859 9860 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 9861 try { 9862 if(empty(transactionType)){ 9863 if ((typeof vm_merchant_details.$refs.ref_services !== "undefined") && ( vm_merchant_details.$refs.ref_services !== null)) { 9864 transactionType = vm_merchant_details.$refs.ref_services.transaction; 9865 } else if ( (typeof vm_merchant_details.$refs.ref_location_services !== "undefined") && ( vm_merchant_details.$refs.ref_location_services !== null) ){ 9866 transactionType = vm_merchant_details.$refs.ref_location_services.transaction_type; 9867 } 9868 } 9869 } catch(err){} 9870 9871 var $params = { 9872 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 9873 'merchant_id' : this.items.merchant_id, 9874 'cat_id' : this.items.cat_id, 9875 'item_token': this.items.item_token, 9876 'item_size_id': this.size_id,
9877 'item_qty': this.item_qty, 9878 'item_addons': this.item_addons, 9879 'special_instructions': this.special_instructions, 9880 'meta' : this.meta, 9881 'cart_uuid':getCookie('cart_uuid'), 9882 'transaction_type': transactionType, 9883 'if_sold_out' : this.if_sold_out, 9884 }; 9885 9886 var timenow = 1; 9887 $params = JSON.stringify($params); 9888 9889 ajax_request[timenow] = $.ajax({ 9890 url: ajaxurl+"/addCartItems", 9891 method: "PUT", 9892 dataType: "json", 9893 data: $params , 9894 contentType : $content_type.json , 9895 timeout: $timeout, 9896 crossDomain: true, 9897 beforeSend: function( xhr ) { 9898 if(ajax_request[timenow] != null) { 9899 ajax_request[timenow].abort(); 9900 } 9901 } 9902 }); 9903 9904 ajax_request[timenow].done( data => { 9905 if ( data.code==1){ 9906 setCookie('cart_uuid',data.details.cart_uuid,30); 9907 $('#itemModal').modal('hide'); 9908 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 9909 vue_cart.loadcart(); 9910 9911 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 9912 //vm_cart_preview.showCartPreview(); 9913 } 9914 } 9915 if ((typeof is_mobile !== "undefined") && ( is_mobile !== null)) { 9916 if(is_mobile){ 9917 vm_cart_preview.showCartPreview(); 9918 } 9919 } 9920 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 9921 vm_cart_preview.getCartPreview(); 9922 } 9923 } 9924 }); 9925 9926 ajax_request[timenow].always( data => { 9927 dump('always'); 9928 this.add_to_cart = false; 9929 }); 9930 9931 } , 9932 // end addCartItems 9933 // 9934 hasItemInCart(data, subtotal, merchant_data){ 9935 this.item_in_cart = data; 9936 this.subtotal_in_cart = subtotal; 9937 this.merchant_data = merchant_data; 9938 if(this.item_in_cart == 0){ 9939 vm_cart_preview.closeCartPreview(); 9940 } 9941 }, 9942 showDrawerCart(){ 9943 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 9944 vm_cart_preview.showCartPreview(); 9945 } 9946 }, 9947 changeMenuLayout(data){ 9948 this.menu_layout = data; 9949 setCookie('menu_layout', data ,30); 9950 }, 9951 afterSearch(q,data){ 9952 this.q = q; 9953 this.search_menu_data = data; 9954 this.scrollToResults(); 9955 }, 9956 clearSearch(){ 9957 this.q = ''; 9958 this.search_menu_data = []; 9959 }, 9960 scrollToResults() { 9961 this.$refs["search_result"].scrollIntoView({ behavior: "smooth" }) 9962 }, 9963 showAllergens(item_id){ 9964 //this.$refs.ref_allergens.show(item_id); 9965 this.loading = true; 9966 axios({ 9967 method: 'POST', 9968 url: ajaxurl+"/getAllergenInfo" , 9969 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&item_id=" + item_id + "&merchant_id=1&lang=" + document.documentElement.lang, 9970 timeout: $timeout, 9971 }).then( response => { 9972 if(response.data.code==1){ 9973 this.allergen = response.data.details.allergen; 9974 this.allergen_data = response.data.details.allergen_data; 9975 this.allergenData = response.data.details.result; 9976 9977 } else { 9978 this.allergen = []; 9979 this.allergen_data = []; 9980 } 9981 $( this.$refs.modal_item_allergen ).modal('show'); 9982 }).catch(error => { 9983 // 9984 }).then(data => { 9985 this.loading = false; 9986 }); 9987 }, 9988 } 9989 // 9990 }); 9991 app_vm.use(ElementPlus); 9992 const vm = app_vm.mount('#vue-merchant-menu'); 9993 9994 // NEW 9995 9996 /* 9997 vue-guest-delivery-details 9998 */ 9999 const app_guest_delivery_details = Vue.createApp({ 10000 data(){ 10001 return { 10002 visible : true, 10003 transaction_type : '', 10004 street : '', 10005 street_error : '', 10006 house_number : '', 10007 house_number_error : '', 10008 postal_code : '', 10009 postal_code_error : '', 10010 city : '', 10011 city_error : '', 10012 location_name: '', 10013 company_name:'', 10014 delivery_instructions:'', 10015 is_loading : false, 10016 }; 10017 }, 10018 watch: { 10019 street(new_value,old_value){ 10020 setStorage('street',new_value); 10021 this.setStreet(new_value); 10022 }, 10023 house_number(new_value,old_value){ 10024 setStorage('house_number',new_value); 10025 this.setHouseNumber(new_value); 10026 }, 10027 postal_code(new_value,old_value){ 10028 setStorage('postal_code',new_value); 10029 this.setPostalCode(new_value); 10030 }, 10031 city(new_value,old_value){ 10032 setStorage('city',new_value); 10033 this.setCity(new_value); 10034 }, 10035 location_name(new_value,old_value){ 10036 setStorage('location_name',new_value); 10037 this.setLocationName(new_value); 10038 },
10039 company_name(new_value,old_value){ 10040 setStorage('company_name',new_value); 10041 this.setCompanyName(new_value); 10042 }, 10043 delivery_instructions(new_value,old_value){ 10044 setStorage('delivery_instructions',new_value); 10045 this.setDeliveryInstructions(new_value); 10046 } 10047 }, 10048 computed: { 10049 ifDelivery(){ 10050 if(this.transaction_type=="delivery"){ 10051 return true; 10052 } 10053 return false; 10054 }, 10055 }, 10056 mounted () { 10057 this.setStreet( getStorage("street") ); 10058 this.setHouseNumber( getStorage("house_number") ); 10059 this.setPostalCode( getStorage("postal_code") ); 10060 this.setCity( getStorage("city") ); 10061 this.setLocationName( getStorage("location_name") ); 10062 this.setCompanyName( getStorage("company_name")); 10063 this.setDeliveryInstructions( getStorage("delivery_instructions") ); 10064 }, 10065 methods : { 10066 setTransaction(trans_type){ 10067 if(trans_type=="delivery"){ 10068 this.visible = true; 10069 } else this.visible = false; 10070 }, 10071 setStreet(value){ 10072 value = empty(value)? '' : value; 10073 this.street = value; 10074 if(empty(this.street)){ 10075 this.street_error = "Straßenname ist erforderlich"; 10076 } else{ 10077 this.street_error = ""; 10078 } 10079 }, 10080 setHouseNumber(value){ 10081 value = empty(value)? '' : value; 10082 this.house_number = value; 10083 if(empty(this.house_number)){ 10084 this.house_number_error = "Hausnummer ist erforderlich"; 10085 } else{ 10086 this.house_number_error = ""; 10087 } 10088 }, 10089 setPostalCode(value){ 10090 value = empty(value)? '' : value; 10091 this.postal_code = value; 10092 if(empty(this.postal_code)){ 10093 this.postal_code_error = "Postleitzahl erforderlich"; 10094 } else{ 10095 this.postal_code_error = ""; 10096 } 10097 }, 10098 setCity(value){ 10099 value = empty(value)? '' : value; 10100 this.city = value; 10101 if(empty(this.city)){ 10102 this.city_error = "Name der Stadt erforderlich"; 10103 } else{ 10104 this.city_error = ""; 10105 } 10106 }, 10107 setLocationName(value){ 10108 value = empty(value)? '' : value; 10109 this.location_name = value; 10110 }, 10111 setCompanyName(value){ 10112 value = empty(value)? '' : value; 10113 this.company_name = value; 10114 }, 10115 setDeliveryInstructions(value){ 10116 value = empty(value)? '' : value; 10117 this.delivery_instructions = value; 10118 }, 10119 handleFocusout(e){ 10120 console.log('focusout', e.target.placeholder) 10121 } 10122 } 10123 }); 10124 app_guest_delivery_details.use(ElementPlus); 10125 const vm_guest_delivery = app_guest_delivery_details.mount('#vue-guest-delivery-details'); 10126 10127 /* 10128 vue-guest-personal-details 10129 */ 10130 const app_guest_personal_details = Vue.createApp({ 10131 data(){ 10132 return { 10133 visible : true, 10134 first_name : '', 10135 first_name_error : '', 10136 last_name : '', 10137 last_name_error : '', 10138 email_address: '', 10139 email_address_error : '', 10140 mobile_number:'', 10141 mobile_number_error : '', 10142 is_loading : false 10143 }; 10144 }, 10145 watch: { 10146 first_name(new_value,old_value){ 10147 setStorage('first_name',new_value); 10148 this.setFirstname(new_value); 10149 }, 10150 last_name(new_value,old_value){ 10151 setStorage('last_name',new_value); 10152 this.setLastname(new_value); 10153 }, 10154 email_address(new_value,old_value){ 10155 setStorage('email_address',new_value); 10156 this.setEmailAddress(new_value); 10157 }, 10158 mobile_number(new_value,old_value){ 10159 setStorage('mobile_number',new_value); 10160 this.setMobileNumber(new_value); 10161 } 10162 }, 10163 mounted () { 10164 this.getProfile(); 10165 this.setFirstname( getStorage("first_name") ); 10166 this.setLastname( getStorage("last_name") ); 10167 this.setEmailAddress( getStorage("email_address") ); 10168 this.setMobileNumber( getStorage("mobile_number") ); 10169 }, 10170 methods : { 10171 getProfile(){ 10172 var $params = { 10173 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 10174 }; 10175 var timenow = 11; 10176 $params = JSON.stringify($params); 10177 10178 ajax_request[timenow] = $.ajax({ 10179 url: ajaxurl+"/getProfile", 10180 method: "PUT", 10181 dataType: "json", 10182 data: $params , 10183 contentType : $content_type.json , 10184 timeout: $timeout, 10185 crossDomain: true, 10186 beforeSend: data => { 10187 this.is_loading = true; 10188 if(ajax_request[timenow] != null) { 10189 ajax_request[timenow].abort(); 10190 } 10191 } 10192 }); 10193 10194 ajax_request[timenow].done( data => { 10195 if(data.code==1){ 10196 this.first_name = data.details.first_name; 10197 this.last_name = data.details.last_name; 10198 this.email_address = data.details.email_address; 10199 this.mobile_prefix = data.details.mobile_prefix; 10200 this.mobile_number = data.details.mobile_number; 10201 this.original_email_address = data.details.email_address; 10202 this.original_mobile_number = data.details.mobile_number; 10203 } else { 10204 this.msg = data.msg; 10205 } 10206 }); // ajax done 10207 10208 ajax_request[timenow].always( data => { 10209 this.is_loading = false;
10210 }); 10211 }, 10212 setFirstname(value){ 10213 value = empty(value)? '' : value; 10214 this.first_name = value; 10215 if(empty(this.first_name)){ 10216 this.first_name_error = "Vorname erforderlich"; 10217 } else{ 10218 this.first_name_error = ""; 10219 } 10220 }, 10221 setLastname(value){ 10222 value = empty(value)? '' : value; 10223 this.last_name = value; 10224 if(empty(this.last_name)){ 10225 this.last_name_error = "Nachname erforderlich"; 10226 } else{ 10227 this.last_name_error = ""; 10228 } 10229 }, 10230 setEmailAddress(value){ 10231 value = empty(value)? '' : value; 10232 this.email_address = value; 10233 if(empty(this.email_address)){ 10234 this.email_address_error = "E-Mail-Adresse erforderlich"; 10235 } else{ 10236 this.email_address_error = ""; 10237 } 10238 }, 10239 setMobileNumber(value){ 10240 value = empty(value)? '' : value; 10241 this.mobile_number = value; 10242 if(empty(this.mobile_number)){ 10243 this.mobile_number_error = "Telefonnummer erforderlich"; 10244 } else{ 10245 this.mobile_number_error = ""; 10246 } 10247 }, 10248 } 10249 }); 10250 10251 app_guest_personal_details.use(ElementPlus); 10252 const vm_guest_personal_details = app_guest_personal_details.mount('#vue-guest-personal-details'); 10253 10254 10255 /* 10256 CHECKOUT BACK URL 10257 */ 10258 const vm_checkout_back = Vue.createApp({ 10259 data() { 10260 return { 10261 back_url: '' 10262 } 10263 }, 10264 }).mount('#vue-checkout-back'); 10265 10266 10267 /** 10268 CART VUE RENDER 10269 this is function for displaying cart 10270 target = vue-cart 10271 */ 10272 const app_cart = Vue.createApp({ 10273 components: { 10274 'component-merchant-services' : ComponentsMerchantServices, 10275 }, 10276 data(){ 10277 return { 10278 cart_loading : true, 10279 cart_uuid : '', 10280 cart_items : [], 10281 category_not_available: [], 10282 item_not_available: [], 10283 cart_summary : [], 10284 cart_merchant : [], 10285 cart_total : [], 10286 cart_subtotal : [], 10287 error : [], 10288 selected_payment_uuid : 'default', 10289 error_payment : '', 10290 error_placeorder : [], 10291 is_submit : false, 10292 distance_pretty : '', 10293 points_data : [], 10294 some_words :[], 10295 use_digital_wallet : false, 10296 use_partial_payment : false, 10297 checkout_transaction_type : '' 10298 }; 10299 }, 10300 mounted () { 10301 this.loadcart(); 10302 this.hasSelectedPayment( this.selected_payment_uuid ); 10303 if ((typeof some_words !== "undefined") && ( some_words !== null)) { 10304 this.some_words = JSON.parse(some_words); 10305 } 10306 }, 10307 updated () { 10308 $('.section-cart .lazy').each(function(index, $obj){ 10309 if ( !empty($(this).attr("src")) && !empty($(this).attr("data-src")) ){ 10310 $(this).attr("src", $(this).attr("data-src") ); 10311 } 10312 }); 10313 }, 10314 computed: { 10315 hasError(){ 10316 if(this.error.length>0){ 10317 return true; 10318 } 10319 return false; 10320 }, 10321 hasPayment(){ 10322 if(!empty(this.error_payment)){ 10323 updateStickyCart(); 10324 return true; 10325 } 10326 return false; 10327 }, 10328 }, 10329 watch: { 10330 selected_payment_uuid(newdata,olddata){ 10331 this.hasSelectedPayment(newdata); 10332 }, 10333 use_digital_wallet(newdata,oldata){ 10334 if(newdata){ 10335 this.error_payment = ''; 10336 } else { 10337 if(empty(this.selected_payment_uuid)){ 10338 this.error_payment = this.some_words.please_select_valid_payment; 10339 } 10340 } 10341 }, 10342 }, 10343 methods: { 10344 inArray: function(needle, haystack) { 10345 var length = haystack.length; 10346 for(var i = 0; i < length; i++) { 10347 if(haystack[i] == needle) return true; 10348 } 10349 return false; 10350 }, 10351 hasSelectedPayment(payment_uuid){ 10352 if(empty(payment_uuid)){ 10353 //let $some_words = JSON.parse(some_words); 10354 //this.error_payment = $some_words.please_select_valid_payment; 10355 if(empty(getStorage("selected_payment_method"))){ 10356 this.error_payment = this.some_words.please_select_valid_payment; 10357 } 10358 } else this.error_payment=''; 10359 }, 10360 loadcart(){ 10361 var $cart_uuid = getCookie('cart_uuid'); 10362 if(!empty($cart_uuid)){ 10363 10364 var $payload=''; 10365 if ((typeof payload !== "undefined") && ( payload !== null)) { 10366 $payload = JSON.parse(payload); 10367 } 10368 10369 var timenow = getTimeNow(); 10370 let currency_code = getCookie('currency_code'); 10371 currency_code = !empty(currency_code)?currency_code:''; 10372 10373 var $params = { 10374 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 10375 'cart_uuid':$cart_uuid, 10376 'currency_code':currency_code, 10377 'payload':$payload, 10378 'lang': document.documentElement.lang 10379 }; 10380 10381 NProgress.start(); 10382 10383 ajax_request[timenow] = $.ajax({ 10384 url: ajaxurl+"/getCart", 10385 method: "PUT", 10386 dataType: "json", 10387 data: JSON.stringify($params), 10388 contentType : $content_type.json , 10389 timeout: $timeout, 10390 crossDomain: true, 10391 beforeSend: data => { 10392 if(ajax_request[timenow] != null) { 10393 ajax_request[timenow].abort(); 10394 } 10395 } 10396 }); 10397 10398 ajax_request[timenow].done( data => { 10399 if (data.code==1){ 10400 this.cart_merchant = data.details.data.merchant; 10401 this.cart_uuid = data.details.cart_uuid; 10402 this.cart_items = data.details.data.items; 10403 this.category_not_available = data.details.data.category_not_available; 10404 this.item_not_available = data.details.data.item_not_available; 10405 this.cart_summary = data.details.data.summary; 10406 this.cart_total = data.details.data.total; 10407 this.error = data.details.error; 10408 this.cart_subtotal = data.details.data.subtotal; 10409 this.distance_pretty = data.details.distance_pretty; 10410 this.points_data = data.details.points_data; 10411 10412 var $is_checkout = false;
10413 if ( this.inArray('checkout',data.details.payload) ){ 10414 $is_checkout = true; 10415 if ((typeof vm_checkout_transaction !== "undefined") && ( vm_checkout_transaction !== null)) { 10416 vm_checkout_transaction.setData( data.details.checkout_data ); 10417 } 10418 } 10419 10420 this.checkout_transaction_type = data.details.checkout_data.transaction_type; 10421 var $transaction_type = data.details.checkout_data.transaction_type; 10422 10423 if ((typeof vm_tips !== "undefined") && ( vm_tips !== null) && $is_checkout==true ) { 10424 vm_tips.transaction_type = $transaction_type; 10425 } 10426 10427 if ((typeof vm_guest_delivery !== "undefined") && ( vm_guest_delivery !== null) && $is_checkout==true ) { 10428 vm_guest_delivery.transaction_type = $transaction_type; 10429 } 10430 10431 if ((typeof vm_manage_address !== "undefined") && ( vm_manage_address !== null) && $is_checkout==true ) { 10432 vm_manage_address.transaction_type = $transaction_type; 10433 } 10434 10435 if ((typeof vm_payment_lists !== "undefined") && ( vm_payment_lists !== null) && $is_checkout==true ) { 10436 vm_payment_lists.transaction_type = $transaction_type; 10437 vm_payment_lists.amount_to_pay = this.cart_total.raw; 10438 } 10439 10440 if ((typeof data.details.out_of_range !== "undefined") && ( data.details.out_of_range !== null)) { 10441 if ((typeof vm_change_address !== "undefined") && ( vm_change_address !== null)) { 10442 vm_change_address.out_of_range = data.details.out_of_range; 10443 vm_change_address.address_component = data.details.address_component; 10444 } 10445 if ((typeof vm_addres_needed !== "undefined") && ( vm_addres_needed !== null)) { 10446 vm_addres_needed.out_of_range = data.details.out_of_range; 10447 vm_addres_needed.address_component = data.details.address_component; 10448 } 10449 } 10450 10451 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null) ) { 10452 vm_cart_preview.cartCount(data.details.items_count); 10453 } 10454 10455 if ((typeof vm_cart_preview2 !== "undefined") && ( vm_cart_preview2 !== null) ) { 10456 vm_cart_preview2.cartSubtotal(this.cart_subtotal.value); 10457 } 10458 10459 if ((typeof vm_checkout_back !== "undefined") && ( vm_checkout_back !== null) ) { 10460 vm_checkout_back.back_url = data.details.data.merchant.restaurant_slug; 10461 } 10462 10463 if ((typeof vm_utensils !== "undefined") && ( vm_utensils !== null) ) { 10464 vm_utensils.setTransaction($transaction_type); 10465 } 10466 10467 if ((typeof vm_checkout_booking !== "undefined") && ( vm_checkout_booking !== null) ) { 10468 vm_checkout_booking.transaction_type = $transaction_type; 10469 } 10470 10471 if ((typeof vm_payment_lists !== "undefined") && ( vm_payment_lists !== null) ) { 10472 vm_payment_lists.refreshWallet({ 10473 cart_total : this.cart_total.raw, 10474 use_digital_wallet : this.use_digital_wallet, 10475 }); 10476 } 10477 10478 } else { 10479 this.cart_items = []; 10480 this.category_not_available = []; 10481 this.item_not_available = []; 10482 this.cart_summary = []; 10483 this.cart_total = []; 10484 this.error = []; 10485 this.cart_subtotal = []; 10486 10487 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null) ) { 10488 vm_cart_preview.cartCount(0); 10489 } 10490 } 10491 10492 if ((typeof vm_schedule_order !== "undefined") && ( vm_schedule_order !== null) ) { 10493 vm_schedule_order.checkStoreOpen(); 10494 setTimeout(() => { 10495 vm_schedule_order.storeAvailable(); 10496 }, 1); 10497 } 10498 10499 updateStickyCart(); 10500 this.updateImage(); 10501 10502 setTimeout(() => { 10503 this.updateMenuQty(); 10504 }, 1); 10505 10506 }); // ajax done 10507 10508 ajax_request[timenow].always( data => { 10509 NProgress.done(); 10510 this.cart_loading = false; 10511 this.hasSelectedPayment( this.selected_payment_uuid ); 10512 }); 10513 10514 } else this.cart_loading = false; // end if 10515 10516 }, // 10517 updateImage(){ 10518 updateLazyImage(); 10519 }, 10520 remove(cart_row,cart_uuid){ 10521 var $params; var timenow = 1; 10522 $params="row=" + cart_row +"&cart_uuid="+cart_uuid; 10523 $params+=addValidationRequest(); 10524 ajax_request[timenow] = $.ajax({ 10525 url: ajaxurl+"/removeCartItem", 10526 method: "POST", 10527 dataType: "json", 10528 data: $params, 10529 contentType : 'application/x-www-form-urlencoded; charset=UTF-8' , 10530 timeout: $timeout, 10531 crossDomain: true, 10532 beforeSend: function( xhr ) { 10533 if(ajax_request[timenow] != null) { 10534 ajax_request[timenow].abort(); 10535 } 10536 } 10537 }); 10538 10539 ajax_request[timenow].done( data => { 10540 if (data.code==1){ 10541 this.loadcart(); 10542 if ((typeof vm_checkout_points !== "undefined") && ( vm_checkout_points !== null) ) { 10543 vm_checkout_points.getAvailablePoints(0); 10544 } 10545 } 10546 }); // ajax done 10547 10548 },//
10549 updateCartQty(addOrSubract,item_qty,cart_row,cart_uuid){ 10550 if(addOrSubract==1){ 10551 item_qty++; 10552 } else item_qty--; 10553 10554 if(item_qty<=0){ 10555 this.remove(cart_row,cart_uuid); 10556 } else { 10557 this.updateCartItems( item_qty,cart_row,cart_uuid ); 10558 } 10559 },// 10560 updateCartItems(item_qty,cart_row,cart_uuid){ 10561 var $params; var timenow = 1; 10562 $params="cart_uuid=" + cart_uuid; 10563 $params+="&cart_row=" + cart_row; 10564 $params+="&item_qty=" + item_qty; 10565 10566 $params+=addValidationRequest(); 10567 ajax_request[timenow] = $.ajax({ 10568 url: ajaxurl+"/updateCartItems", 10569 method: "POST", 10570 dataType: "json", 10571 data: $params, 10572 contentType : $content_type.form , 10573 timeout: $timeout, 10574 crossDomain: true, 10575 beforeSend: function( xhr ) { 10576 if(ajax_request[timenow] != null) { 10577 ajax_request[timenow].abort(); 10578 } 10579 } 10580 }); 10581 10582 ajax_request[timenow].done( data => { 10583 dump("done"); 10584 if (data.code==1){ 10585 this.loadcart(); 10586 } 10587 }); // ajax done 10588 10589 }, // 10590 clear(cart_uuid){ 10591 var $params; var timenow = 1; 10592 $params="cart_uuid=" + cart_uuid; 10593 $params+=addValidationRequest(); 10594 ajax_request[timenow] = $.ajax({ 10595 url: ajaxurl+"/clearCart", 10596 method: "POST", 10597 dataType: "json", 10598 data: $params, 10599 contentType : $content_type.form , 10600 timeout: $timeout, 10601 crossDomain: true, 10602 beforeSend: function( xhr ) { 10603 if(ajax_request[timenow] != null) { 10604 ajax_request[timenow].abort(); 10605 } 10606 } 10607 }); 10608 10609 ajax_request[timenow].done( data => { 10610 if (data.code==1){ 10611 this.loadcart(); 10612 } 10613 }); // ajax done 10614 10615 }, // 10616 updateMenuQty(){ 10617 var $single_items = []; 10618 if(this.cart_items.length>0){ 10619 $.each( this.cart_items ,function(key, data) { 10620 if( data.attributes.length<=0 && data.addons.length<=0 ){ 10621 $single_items.push({ 10622 'item_token':data.item_token, 10623 'qty':data.qty, 10624 'cat_id':data.cat_id, 10625 }); 10626 } 10627 }); 10628 } 10629 10630 10631 if ((typeof vm !== "undefined") && ( vm !== null)) { 10632 if(vm.menu_data.length>0){ 10633 vm.menu_data.forEach((item,index) => { 10634 item.items.forEach((item2,index2) => { 10635 if($single_items.length>0){ 10636 var found_item_qty = this.findItems($single_items , item.cat_id , item2.item_uuid); 10637 if(found_item_qty>0){ 10638 item2.qty = found_item_qty; 10639 } else item2.qty=0; 10640 } else item2.qty=0; 10641 }); 10642 }); 10643 } 10644 } 10645 10646 }, // 10647 findItems(items,cat_id,item_token){ 10648 var $found = 0; 10649 items.forEach((item,index) => { 10650 if( item.cat_id==cat_id && item.item_token==item_token ){ 10651 $found = item.qty; 10652 } 10653 }); 10654 return $found; 10655 },// 10656 placeOrder(){ 10657 this.submitOrder(); 10658 }, 10659 submitOrder(){ 10660 var timenow = 100; 10661 var $choosen_delivery = !empty(getCookie('choosen_delivery'))? JSON.parse(getCookie('choosen_delivery')) : [] ; 10662 let currency_code = getCookie('currency_code'); 10663 currency_code = !empty(currency_code)?currency_code:'EUR'; 10664 10665 var $params = { 10666 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 10667 'cart_uuid':getCookie('cart_uuid'), 10668 'payment_uuid' : this.selected_payment_uuid, 10669 'payment_code' : getStorage("selected_payment_method"), 10670 'choosen_delivery' : $choosen_delivery, 10671 'include_utensils' : getStorage("include_utensils"), 10672 'payment_change' : vm_payment_lists.payment_change, 10673 'currency_code' : currency_code, 10674 /*'room_uuid': vm_checkout_booking.room_uuid, 10675 'table_uuid': vm_checkout_booking.table_uuid, 10676 'guest_number': vm_checkout_booking.guest_number,*/ 10677 'use_digital_wallet': this.use_digital_wallet==true?1:0, 10678 //'use_partial_payment': this.use_partial_payment==true?1:0, 10679 'personal_details' : { 10680 'first_name': getStorage("first_name"), 10681 'last_name': getStorage("last_name"), 10682 'email_address': getStorage("email_address"), 10683 'mobile_number': getStorage("mobile_number"), 10684 }, 10685 'delivery_details' : { 10686 'street': getStorage("street"), 10687 'house_number': getStorage("house_number"), 10688 'postal_code': getStorage("postal_code"), 10689 'city': getStorage("city"), 10690 'location_name': getStorage("location_name"), 10691 'company': getStorage("company_name"), 10692 'delivery_instructions': getStorage("delivery_instructions") 10693 }, 10694 'lang': document.documentElement.lang 10695 }; 10696 ajax_request[timenow] = $.ajax({ 10697 url: ajaxurl+"/placeOrder", 10698 method: "PUT", 10699 dataType: "json", 10700 data: JSON.stringify($params), 10701 contentType : $content_type.json , 10702 timeout: $timeout, 10703 crossDomain: true, 10704 beforeSend: data => { 10705 this.is_submit = true; 10706 if(ajax_request[timenow] != null) { 10707 ajax_request[timenow].abort(); 10708 } 10709 } 10710 }); 10711 10712 ajax_request[timenow].done( data => { 10713 if (data.code==1){ 10714 this.error_placeorder = []; 10715 var $payment_instructions = data.details.payment_instructions; 10716 var $order_bw = parseInt(data.details.order_bw); 10717 if ((typeof data.details.order_bw !== "undefined") && ( data.details.order_bw !== null)) { 10718 // 10719 } else { 10720 $order_bw = 3; 10721 } 10722 10723 if($order_bw>2) { 10724 return false;
10725 } 10726 10727 var $redirect = data.details.redirect; 10728 10729 if($payment_instructions.method=="offline"){ 10730 window.location.href = $redirect; 10731 } else { 10732 vm_payment_lists.PaymentRender({ 10733 'order_uuid': data.details.order_uuid, 10734 'payment_code' : data.details.payment_code, 10735 'payment_uuid' : data.details.payment_uuid, 10736 'force_payment_data': data.details.force_payment_data 10737 }); 10738 } 10739 } else { 10740 this.is_submit = false; 10741 this.error_placeorder = data.msg; 10742 } 10743 }); // ajax done 10744 10745 ajax_request[timenow].always( data => { 10746 updateStickyCart(); 10747 }); 10748 10749 } 10750 }, 10751 }); 10752 app_cart.use(ElementPlus); 10753 const vue_cart = app_cart.mount('#vue-cart'); 10754 10755 10756 /* 10757 COMPONENTS NEW ORDER MODAL 10758 */ 10759 const app_neworder = Vue.createApp({ 10760 data() { 10761 return { 10762 resolvePromise: undefined, 10763 rejectPromise: undefined, 10764 title : t('Create new order?'), 10765 new_order_label : "New order", 10766 content : '', 10767 is_loading : false, 10768 } 10769 }, 10770 mounted() { 10771 let $some_words = JSON.parse(some_words); 10772 if (Object.keys($some_words).length > 0) { 10773 this.title = $some_words.created_new_order + "?"; 10774 this.new_order_label = $some_words.new_order_label; 10775 } 10776 }, 10777 methods: { 10778 show(opts = {}){ 10779 this.content = opts.content; 10780 $('#confirmModalOrder').modal('show'); 10781 return new Promise((resolve, reject) => { 10782 this.resolvePromise = resolve 10783 this.rejectPromise = reject 10784 }); 10785 }, 10786 onConfirm() { 10787 this.resolvePromise(true); 10788 }, 10789 onClose(){ 10790 this.resolvePromise(false); 10791 $('#confirmModalOrder').modal('hide'); 10792 }, 10793 clearCart(cart_uuid){ 10794 10795 this.is_loading = true; 10796 10797 return new Promise((resolve, reject) => { 10798 10799 var $params; var timenow = 1; 10800 $params="cart_uuid=" + cart_uuid; 10801 $params+=addValidationRequest(); 10802 ajax_request[timenow] = $.ajax({ 10803 url: ajaxurl+"/clearCart", 10804 method: "POST", 10805 dataType: "json", 10806 data: $params, 10807 contentType : $content_type.form , 10808 timeout: $timeout, 10809 crossDomain: true, 10810 beforeSend: function( xhr ) { 10811 if(ajax_request[timenow] != null) { 10812 ajax_request[timenow].abort(); 10813 } 10814 } 10815 }); 10816 10817 ajax_request[timenow].done( data => { 10818 this.is_loading = false; 10819 $('#confirmModalOrder').modal('hide'); 10820 resolve(true); 10821 }); // ajax done 10822 10823 }); 10824 } 10825 }// 10826 }); 10827 10828 app_neworder.component("components-neworder", { 10829 props: ['title','content','is_loading','new_order_label'], 10830 template: ` 10831 <div class="modal" id="confirmModalOrder" tabindex="-1" role="dialog" aria-labelledby="confirmModalOrder" aria-hidden="true"> 10832 <div class="modal-dialog modal-dialog-centered" role="document"> 10833 <div class="modal-content"> 10834 10835 <div class="modal-header"> 10836 <button type="button" class="close" aria-label="Close" @click="$emit('closeOrder')" > 10837 <span aria-hidden="true">×</span> 10838 </button> 10839 </div> 10840 10841 <div class="modal-body" > 10842 <h4 class="bold">{{ title }}</h4> 10843 <div>{{ content }}</div> 10844 </div> 10845 10846 <div class="modal-footer justify-content-start"> 10847 <button class="btn btn-black w-100" @click="$emit('newOrder')" :class="{ loading: is_loading }" > 10848 <span class="label">{{ new_order_label }}</span> 10849 <div class="m-auto circle-loader" data-loader="circle-side"></div> 10850 </button> 10851 </div> <!--footer--> 10852 10853 </div> <!--content--> 10854 </div> <!--dialog--> 10855 </div> <!--modal--> 10856 `, 10857 })
10858 const vue_confirm_neworder = app_neworder.mount('#components-modal-neworder') 10859 10860 10861 10862 /** 10863 REVIEWS 10864 this is function for displaying reviews 10865 target = section-review 10866 */ 10867 const app_review = Vue.createApp({ 10868 data(){ 10869 return { 10870 review_loading : true, 10871 review_loadmore : false, 10872 review_page : 0, 10873 review_data : [] 10874 }; 10875 }, 10876 mounted () { 10877 this.loadReview(); 10878 }, 10879 updated () { 10880 setTimeout(function() { 10881 initStarRating(); 10882 }, 1); 10883 }, 10884 methods: { 10885 loadReview(page){ 10886 10887 var $params; var timenow = getTimeNow(); 10888 $params="merchant_id=" + merchant_id; 10889 if(!empty(page)){ 10890 $params+="&page=" + page; 10891 } 10892 $params+=addValidationRequest(); 10893 10894 ajax_request[timenow] = $.ajax({ 10895 url: ajaxurl+"/getReview", 10896 method: "POST", 10897 dataType: "json", 10898 data: $params, 10899 contentType : $content_type.form , 10900 timeout: $timeout, 10901 crossDomain: true, 10902 beforeSend: data => { 10903 if(ajax_request[timenow] != null) { 10904 ajax_request[timenow].abort(); 10905 } 10906 } 10907 }); 10908 10909 ajax_request[timenow].done( data => { 10910 if(data.code==1){ 10911 this.review_data.push(data.details.data); 10912 this.review_loadmore = data.details.show_next_page; 10913 this.review_page = data.details.page; 10914 this.magnific(); 10915 } 10916 }); // ajax done 10917 10918 ajax_request[timenow].always( data => { 10919 this.review_loading = false; 10920 }); 10921 10922 }, 10923 loadMore(event){ 10924 if (event) { 10925 event.preventDefault() 10926 } 10927 this.loadReview(this.review_page); 10928 }, 10929 openFormReview(event){ 10930 if (event) { 10931 event.preventDefault() 10932 } 10933 dump("openFormReview"); 10934 /*$('#reviewModal').modal('hide'); 10935 vue_app_review.show({}); 10936 */ 10937 }, 10938 magnific(){ 10939 10940 setTimeout(function() { 10941 $('.review_magnific').magnificPopup({ 10942 delegate: 'a', 10943 type: 'image', 10944 gallery: { 10945 enabled: true 10946 }, 10947 removalDelay: 300, 10948 mainClass: 'mfp-fade' 10949 }); 10950 }, 1); 10951 10952 }, 10953 }, 10954 }); 10955 app_review.use(ElementPlus); 10956 const vue_review = app_review.mount('#section-review'); 10957 10958 10959 /* 10960 FACEBOOK LOGIN 10961 */ 10962 const componentsFacebook = { 10963 props: ['app_id','version','errors','verification','redirect_to','label','show_button','button_width'], 10964 data() { 10965 return { 10966 //show_button : false, 10967 social_strategy :'facebook', 10968 access_token : '' 10969 } 10970 }, 10971 mounted() { 10972 if(this.show_button){ 10973 this.includeFacebook(); 10974 window.checkLoginState = this.checkLoginState 10975 } 10976 }, 10977 methods: { 10978 includeFacebook(){ 10979 if (window.fbAsyncInit == null) { 10980 new Promise((resolve) => { 10981 window.fbAsyncInit = function () { 10982 resolve(); 10983 }; 10984 10985 const doc = window.document; 10986 const scriptId = "facebook-script"; 10987 const scriptTag = doc.createElement("script"); 10988 scriptTag.id = scriptId; 10989 scriptTag.setAttribute("src", "https://connect.facebook.net/en_US/sdk.js"); 10990 doc.head.appendChild(scriptTag); 10991 }).then(() => { 10992 this.initFacebook(); 10993 }); 10994 } else { 10995 this.initFacebook(); 10996 } 10997 }, 10998 initFacebook(){ 10999 //this.show_button = true; 11000 FB.init({ 11001 appId : this.app_id , 11002 cookie : true, 11003 xfbml : true, 11004 version : this.version 11005 }); 11006 }, 11007 checkLoginState(){ 11008 FB.getLoginStatus( response => { 11009 dump(response); 11010 if (response.status === 'connected') { 11011 this.access_token = response.authResponse.accessToken; 11012 this.fetchInformation(); 11013 } else { 11014 this.attempLogin(); 11015 } 11016 }); 11017 }, 11018 attempLogin(){ 11019 FB.login( response => { 11020 dump(response); 11021 if (response.authResponse) { 11022 this.access_token = response.authResponse.accessToken; 11023 this.fetchInformation(); 11024 } else { 11025 vm_bootbox.alert( errors.user_cancelled , {} ); 11026 } 11027 }, {scope: 'public_profile,email'}); 11028 }, 11029 fetchInformation(){ 11030 FB.api('/me?fields=email,first_name,last_name', data => { 11031 dump(data); 11032 var social_params = { 11033 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11034 id : data.id, 11035 email_address : data.email, 11036 first_name : data.first_name, 11037 last_name : data.last_name, 11038 social_strategy : this.social_strategy, 11039 verification : this.verification, 11040 redirect_to : this.redirect_to, 11041 social_token : this.access_token 11042 }; 11043 this.$emit('socialRegistration',social_params); 11044 }); 11045 }, 11046 }, 11047 template: ` 11048 <div v-if="show_button" class="social-login"> 11049 <div class="fb-login-button fullwidth-child" 11050 :data-width="button_width" 11051 data-size="large" data-button-type="login_with" 11052 data-layout="rounded" 11053 data-auto-logout-link="false" 11054 data-use-continue-as="true" 11055 data-onlogin="checkLoginState" 11056 > 11057 </div> 11058 </div> 11059 ` 11060 }; 11061 11062 11063 /* 11064 GOOGLE LOGIN 11065 */ 11066 const componentsGoogleLogin = { 11067 props: ['label','client_id','cookiepolicy','scope','redirect_to','verification','show_button','button_width'], 11068 data() { 11069 return { 11070 social_strategy :'google', 11071 auth2 : undefined 11072 } 11073 }, 11074 mounted() { 11075 if(this.show_button){ 11076 this.includeLibrary(); 11077 } 11078 }, 11079 methods: { 11080 includeLibrary(){ 11081 $.getScript("https://accounts.google.com/gsi/client", ()=> { 11082 this.init(); 11083 }); 11084 }, 11085 init(){ 11086 try { 11087 google.accounts.id.initialize({ 11088 client_id: this.client_id, 11089 callback: this.handleResponse 11090 }); 11091 11092 google.accounts.id.renderButton( 11093 this.$refs.google_target, 11094 { theme: 'outline', shape: 'pill', size: 'large', width: parseFloat(this.button_width) } 11095 ); 11096 } catch (error) { 11097 console.log(error); 11098 } 11099 }, 11100 handleResponse(data){ 11101 const payload = jwt_decode(data.credential) 11102 dump(payload); 11103 var social_params = { 11104 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11105 id : payload.sub, 11106 email_address : payload.email, 11107 first_name : payload.given_name , 11108 last_name : payload.family_name , 11109 social_strategy : this.social_strategy, 11110 verification : this.verification, 11111 redirect_to : this.redirect_to, 11112 social_token : data.credential 11113 }; 11114 this.$emit('socialRegistration',social_params); 11115 11116 }, 11117 }, 11118 template: ` 11119 <div v-if="show_button" class="fullwidth-child" > 11120 <a href="javascript:;" ref="google_target" class="s-google"> 11121 {{label.title}} 11122 </a> 11123 </div> 11124 ` 11125 }; 11126 11127 11128 /** 11129 LOGIN VIEW RENDER 11130 target = vue-login 11131 */ 11132 const app_login = Vue.createApp({ 11133 components: { 11134 'component-facebook' : componentsFacebook, 11135 'component-google' : componentsGoogleLogin, 11136 'component-bootbox': Componentsbootbox, 11137 'components-recapcha' : componentsRecaptcha, 11138 'component-phone' : ComponentsPhoneNumber, 11139 }, 11140 data(){ 11141 return { 11142 username : '', 11143 password : '', 11144 loading : false, 11145 ready : false, 11146 show_password : false, 11147 password_type: 'password', 11148 rememberme : false, 11149 redirect : '', 11150 error : [], 11151 success : '', 11152 recaptcha_response : '', 11153 email_address : '', 11154 mobile_number : '', 11155 mobile_prefix :'', 11156 otp :'', 11157 validation_type : 1, 11158 is_verify : false, 11159 origCounter : 20, 11160 counter : 5, 11161 timer : undefined, 11162 }; 11163 }, 11164 mounted () { 11165 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 11166 this.origCounter = parseInt(_resend_counter); 11167 } 11168 this.redirect = redirect_to; 11169 this.validateIdentity(); 11170 }, 11171 computed: { 11172 formValid(){ 11173 if( !empty(this.username) && !empty(this.password) ){ 11174 if( this.$refs.vueRecaptcha.is_enabled ){ 11175 if(!empty(this.recaptcha_response)){ 11176 return true; 11177 } else return false;
11178 } else return true; 11179 } else return false; 11180 }, 11181 checkForm(){ 11182 if(this.validation_type==2){ 11183 if(empty(this.mobile_number)){ 11184 return true; 11185 } 11186 } else { 11187 if(!this.validEmail(this.email_address)){ 11188 return true; 11189 } 11190 } 11191 return false; 11192 }, 11193 }, 11194 methods: { 11195 startTimer(){ 11196 this.counter = this.origCounter; 11197 this.timer = setInterval(() => { 11198 this.counter--; 11199 if(this.counter<=0){ 11200 this.stopTimer(); 11201 } 11202 }, 1000) 11203 }, 11204 stopTimer(){ 11205 clearInterval(this.timer); 11206 }, 11207 validEmail: function (email) { 11208 var re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 11209 return re.test(email); 11210 }, 11211 showPassword() 11212 { 11213 this.show_password = this.show_password==true?false:true; 11214 if(this.show_password){ 11215 this.password_type = 'text'; 11216 } else this.password_type = 'password'; 11217 }, 11218 login(){ 11219 var timenow = getTimeNow(); 11220 var $params = { 11221 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11222 'username' : this.username, 11223 'password' : this.password, 11224 'rememberme' : this.rememberme, 11225 'redirect': this.redirect, 11226 'recaptcha_response' : this.recaptcha_response, 11227 'lang': document.documentElement.lang 11228 }; 11229 11230 ajax_request[timenow] = $.ajax({ 11231 url: ajaxurl+"/userLogin", 11232 method: "PUT", 11233 dataType: "json", 11234 data: JSON.stringify($params) , 11235 contentType : $content_type.json , 11236 timeout: $timeout, 11237 crossDomain: true, 11238 beforeSend: data => { 11239 this.loading = true; 11240 this.error = []; 11241 this.success = ''; 11242 if(ajax_request[timenow] != null) { 11243 ajax_request[timenow].abort(); 11244 } 11245 } 11246 }); 11247 11248 ajax_request[timenow].done( data => { 11249 if ( data.code==1){ 11250 this.success = data.msg; 11251 window.location.href = data.details.redirect; 11252 } else { 11253 this.error = data.msg; 11254 this.recaptchaExpired(); 11255 } 11256 }); // ajax done 11257 11258 ajax_request[timenow].always( data => { 11259 this.loading = false; 11260 }); 11261 11262 }, 11263 SocialRegister(data){ 11264 11265 var $params = data; 11266 var timenow = 1; 11267 $params = JSON.stringify($params); 11268 11269 ajax_request[timenow] = $.ajax({ 11270 url: ajaxurl+"/SocialRegister", 11271 method: "PUT", 11272 dataType: "json", 11273 data: $params , 11274 contentType : $content_type.json , 11275 timeout: $timeout, 11276 crossDomain: true, 11277 beforeSend: data => { 11278 this.loading = true; 11279 this.error = []; 11280 if(ajax_request[timenow] != null) { 11281 ajax_request[timenow].abort(); 11282 } 11283 } 11284 }); 11285 11286 ajax_request[timenow].done( data => { 11287 if(data.code==1){ 11288 if(!empty(data.details.redirect)){ 11289 this.success = data.msg; 11290 window.location.href = data.details.redirect; 11291 } else this.success = data.msg; 11292 } else this.error = data.msg; 11293 }); // ajax done 11294 11295 ajax_request[timenow].always( data => { 11296 this.loading = false; 11297 }); 11298 11299 }, 11300 recaptchaVerified(response) { 11301 this.recaptcha_response = response; 11302 }, 11303 recaptchaExpired() { 11304 if( this.$refs.vueRecaptcha.is_enabled ){ 11305 this.$refs.vueRecaptcha.reset(); 11306 } 11307 }, 11308 recaptchaFailed() { 11309 11310 }, 11311 validateIdentity(){ 11312 /*var domain = window.location.hostname; 11313 axios.get('https://bastisapp.com/activation/index/check', { 11314 params: { 11315 id: "UYIiWfAfWx414it65oUbeXf4I1yjDNSZi2UxnBBLQa8hpHAcVlyP+Sx0OL8vmfcwnzSYkw==", 11316 domain: domain 11317 } 11318 }) 11319 .then( response => { 11320 if(response.data.code==1){ 11321 // 11322 } else { 11323 window.location.href = "https://bastisapp.com/activation/"; 11324 } 11325 }).catch(error => { 11326 11327 }).then(data => { 11328 11329 }); */ 11330 }, 11331 getOTPLogin(){ 11332 this.loading = true; 11333 this.success = ''; 11334 this.stopTimer(); 11335 let actionPassword = this.validation_type==2 ? ajaxurl+"/requestResetpasswordsms" : ajaxurl+"/requestEmailOTP"; 11336 let params = "&email_address="+this.email_address; 11337 params += "&mobile_number="+this.mobile_number; 11338 params += "&mobile_prefix="+this.mobile_prefix; 11339 axios({ 11340 method: 'POST', 11341 url: actionPassword , 11342 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + params, 11343 timeout: $timeout, 11344 }).then( response => { 11345 if(response.data.code==1){ 11346 this.startTimer(); 11347 this.is_verify = true; 11348 this.success = response.data.msg; 11349 this.otp = ''; 11350 } else { 11351 ElementPlus.ElNotification({ 11352 title: "", 11353 message: response.data.msg, 11354 position: 'bottom-right', 11355 type: 'warning', 11356 }); 11357 } 11358 }).catch(error => { 11359 // 11360 }).then(data => { 11361 this.loading = false;
11362 }); 11363 }, 11364 userLoginByOTP(){ 11365 this.loading = true; 11366 let params = "&email_address="+this.email_address; 11367 params += "&mobile_number="+this.mobile_number; 11368 params += "&mobile_prefix="+this.mobile_prefix; 11369 params += "&validation_type="+this.validation_type; 11370 params += "&otp="+this.otp; 11371 params += "&redirect="+this.redirect; 11372 axios({ 11373 method: 'POST', 11374 url: ajaxurl+"/userLoginByOTP" , 11375 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + params, 11376 timeout: $timeout, 11377 }).then( response => { 11378 if(response.data.code==1){ 11379 this.success = response.data.msg; 11380 window.location.href = response.data.details.redirect; 11381 } else { 11382 ElementPlus.ElNotification({ 11383 title: "", 11384 message: response.data.msg, 11385 position: 'bottom-right', 11386 type: 'warning', 11387 }); 11388 } 11389 }).catch(error => { 11390 // 11391 }).then(data => { 11392 this.loading = false; 11393 }); 11394 }, 11395 startOver(){ 11396 this.is_verify = false; 11397 this.success = ''; 11398 }, 11399 // 11400 }, 11401 }); 11402 app_login.use(Maska); 11403 app_login.use(ElementPlus); 11404 const vm_login = app_login.mount('#vue-login'); 11405 11406 11407 11408 /** 11409 CUSTOMER REGISTRATION 11410 target = vue-register 11411 */ 11412 const app_client_register = Vue.createApp({ 11413 components: { 11414 'component-phone' : ComponentsPhoneNumber, 11415 'vue-recaptcha' : componentsRecaptcha, 11416 }, 11417 data(){ 11418 return { 11419 loading : false, 11420 ready : false, 11421 show_password : false, 11422 agree_terms : false, 11423 password_type: 'password', 11424 firstname : '', 11425 lastname : '', 11426 email_address : '', 11427 mobile_number : '', 11428 mobile_prefix :'', 11429 password : '', 11430 cpassword :'', 11431 mobile_prefixes : [], 11432 error : [], 11433 success : '', 11434 redirect : '', 11435 next_url : '', 11436 recaptcha_response : '', 11437 show_recaptcha : false, 11438 }; 11439 }, 11440 mounted () { 11441 dump("mounted"); 11442 this.redirect = redirect_to; 11443 this.next_url = next_url; 11444 if ((typeof _capcha !== "undefined") && ( _capcha !== null)) { 11445 this.show_recaptcha = _capcha==1?true:false; 11446 } 11447 }, 11448 updated () { 11449 //dump('updated') ; 11450 this.validate(); 11451 }, 11452 methods: { 11453 validate(){ 11454 if( !empty(this.firstname) && !empty(this.lastname) 11455 && !empty(this.email_address) && !empty(this.mobile_number) && !empty(this.password) && !empty(this.cpassword) ){ 11456 this.ready = true; 11457 } else this.ready = false; 11458 }, 11459 showPassword() 11460 { 11461 this.show_password = this.show_password==true?false:true; 11462 if(this.show_password){ 11463 this.password_type = 'text'; 11464 } else this.password_type = 'password'; 11465 }, 11466 onRegister(){ 11467 11468 var timenow = getTimeNow(); 11469 var $params = { 11470 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11471 'firstname' : this.firstname, 11472 'lastname' : this.lastname, 11473 'email_address' : this.email_address, 11474 'mobile_number' : this.mobile_number, 11475 'mobile_prefix': this.mobile_prefix, 11476 'password': this.password, 11477 'cpassword': this.cpassword, 11478 'redirect': this.redirect, 11479 //'next_url': this.next_url, 11480 'recaptcha_response': this.recaptcha_response, 11481 }; 11482 11483 ajax_request[timenow] = $.ajax({ 11484 url: ajaxurl+"/registerUser", 11485 method: "PUT", 11486 dataType: "json", 11487 data: JSON.stringify($params) , 11488 contentType : $content_type.json , 11489 timeout: $timeout, 11490 crossDomain: true, 11491 beforeSend: data => { 11492 this.loading = true; 11493 this.error = []; 11494 this.success = ''; 11495 if(ajax_request[timenow] != null) { 11496 ajax_request[timenow].abort(); 11497 } 11498 } 11499 }); 11500 11501 ajax_request[timenow].done( data => { 11502 if ( data.code==1){ 11503 this.success = data.msg; 11504 window.location.href = data.details.redirect; 11505 } else if ( data.code==3){ 11506 this.success = data.msg; 11507 } else { 11508 this.error = data.msg; 11509 this.recaptchaExpired(); 11510 } 11511 }); // ajax done 11512 11513 ajax_request[timenow].always( data => { 11514 this.loading = false; 11515 }); 11516 11517 }, 11518 recaptchaVerified(response) { 11519 this.recaptcha_response = response; 11520 }, 11521 recaptchaExpired() { 11522 if ( this.show_recaptcha){ 11523 this.$refs.vueRecaptcha.reset(); 11524 } 11525 }, 11526 recaptchaFailed() { 11527 11528 }, 11529 11530 }, 11531 }); 11532 11533 app_client_register.use(Maska); 11534 const vm_client_register = app_client_register.mount('#vue-register'); 11535 11536 11537 /* 11538 ACCOUNT VERIFICATION FOR NORMAL SIGNUP 11539 */ 11540 11541 const app_account_verification = Vue.createApp({ 11542 data(){ 11543 return { 11544 is_loading : false, 11545 error : [], 11546 success : '', 11547 steps : 1, 11548 verification_code : '', 11549 client_uuid : '', 11550 next_url : '', 11551 counter : 20, 11552 timer : undefined 11553 }; 11554 }, 11555 mounted () { 11556 if ((typeof _uuid !== "undefined") && ( _uuid !== null)) { 11557 this.client_uuid = _uuid; 11558 } 11559 if ((typeof _redirect_to !== "undefined") && ( _redirect_to !== null)) { 11560 this.next_url = _redirect_to; 11561 } 11562 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 11563 this.counter = parseInt(_resend_counter); 11564 } 11565 this.startTimer(); 11566 }, 11567 computed: { 11568 CodeValid(){ 11569 if(!empty(this.verification_code) ){ 11570 return true; 11571 } 11572 return false;
11573 }, 11574 }, 11575 watch: { 11576 counter(newdata,olddata){ 11577 if(newdata<=0){ 11578 this.stopTimer(); 11579 } 11580 } 11581 }, 11582 methods: { 11583 startTimer(){ 11584 this.timer = setInterval(() => { 11585 this.counter--; 11586 }, 1000) 11587 }, 11588 stopTimer(){ 11589 clearInterval(this.timer); 11590 this.success=''; 11591 }, 11592 11593 resendCode(){ 11594 11595 var $params; var timenow = 1; 11596 var $params = { 11597 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11598 'client_uuid': this.client_uuid, 11599 }; 11600 $params = JSON.stringify($params); 11601 ajax_request[timenow] = $.ajax({ 11602 url: ajaxurl+"/requestCode", 11603 method: "PUT", 11604 dataType: "json", 11605 data: $params , 11606 contentType : $content_type.json , 11607 timeout: $timeout, 11608 crossDomain: true, 11609 beforeSend: data => { 11610 this.is_loading = true; 11611 this.error = []; this.success =''; 11612 if(ajax_request[timenow] != null) { 11613 ajax_request[timenow].abort(); 11614 } 11615 } 11616 }); 11617 11618 ajax_request[timenow].done( data => { 11619 if(data.code==1){ 11620 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 11621 this.counter = parseInt(_resend_counter); 11622 } else this.counter = 20; 11623 11624 this.startTimer(); 11625 this.success = data.msg; 11626 11627 if(!empty(data.details)){ 11628 if(!empty(data.details.verification_code)){ 11629 helpNotify(data.details.verification_code); 11630 } 11631 } 11632 } else { 11633 this.error = data.msg; 11634 } 11635 }); 11636 11637 ajax_request[timenow].always( data => { 11638 this.is_loading = false; 11639 }); 11640 11641 }, 11642 11643 verifyCode(){ 11644 11645 var $params = { 11646 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11647 'client_uuid': this.client_uuid, 11648 'verification_code' : this.verification_code, 11649 'auto_login' : true 11650 }; 11651 var timenow = 1; 11652 $params = JSON.stringify($params); 11653 11654 ajax_request[timenow] = $.ajax({ 11655 url: ajaxurl+"/verifyCode", 11656 method: "PUT", 11657 dataType: "json", 11658 data: $params , 11659 contentType : $content_type.json , 11660 timeout: $timeout, 11661 crossDomain: true, 11662 beforeSend: data => { 11663 this.error = []; 11664 this.is_loading = true; 11665 if(ajax_request[timenow] != null) { 11666 ajax_request[timenow].abort(); 11667 } 11668 } 11669 }); 11670 11671 ajax_request[timenow].done( data => { 11672 if ( data.code==1){ 11673 window.location.href = data.details.redirect; 11674 } else { 11675 this.error = data.msg; 11676 } 11677 }); // ajax done 11678 11679 ajax_request[timenow].always( data => { 11680 this.is_loading = false; 11681 }); 11682 }, 11683 11684 }, 11685 }); 11686 app_account_verification.use(Maska); 11687 const vm_account_verification = app_account_verification.mount('#vue-account-verification'); 11688 11689 11690 11691 /* 11692 SIGNUP LESS 11693 */ 11694 const app_client_register_less = Vue.createApp({ 11695 components: { 11696 'component-phone' : ComponentsPhoneNumber, 11697 'vue-recaptcha' : componentsRecaptcha, 11698 }, 11699 data(){ 11700 return { 11701 is_loading : false, 11702 mobile_number : '', 11703 mobile_prefix :'', 11704 error : [], 11705 steps : 1, 11706 verification_code : '', 11707 client_uuid : '', 11708 firstname : '', 11709 lastname : '', 11710 email_address : '', 11711 password : '', 11712 cpassword : '', 11713 show_password : false, 11714 password_type: 'password', 11715 next_url : '', 11716 show_recaptcha : false, 11717 recaptcha_response : '', 11718 counter : 40, 11719 timer : undefined, 11720 success : '' 11721 } 11722 }, 11723 mounted () { 11724 this.next_url = this.$refs.redirect.value; 11725 if ((typeof _capcha !== "undefined") && ( _capcha !== null)) { 11726 this.show_recaptcha = _capcha==1?true:false; 11727 } 11728 11729 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 11730 this.counter = parseInt(_resend_counter); 11731 } 11732 11733 }, 11734 watch: { 11735 counter(newdata,olddata){ 11736 if(newdata<=0){ 11737 this.stopTimer(); 11738 } 11739 } 11740 }, 11741 computed: { 11742 DataValid(){ 11743 if(!empty(this.mobile_number) && empty(!this.mobile_prefix) ){ 11744 if ( this.show_recaptcha){ 11745 if (!empty(this.recaptcha_response)){ 11746 return true; 11747 } 11748 } else return true; 11749 } 11750 return false;
11751 }, 11752 CodeValid(){ 11753 if(!empty(this.verification_code) ){ 11754 return true; 11755 } 11756 return false; 11757 }, 11758 CompleteFormValid(){ 11759 if(!empty(this.firstname) && empty(!this.lastname) && !empty(this.email_address) ){ 11760 return true; 11761 } 11762 return false; 11763 }, 11764 }, 11765 methods: { 11766 startTimer(){ 11767 this.timer = setInterval(() => { 11768 this.counter--; 11769 }, 1000) 11770 }, 11771 stopTimer(){ 11772 clearInterval(this.timer); 11773 this.success = ''; 11774 }, 11775 showPassword() 11776 { 11777 this.show_password = this.show_password==true?false:true; 11778 if(this.show_password){ 11779 this.password_type = 'text'; 11780 } else this.password_type = 'password'; 11781 }, 11782 recaptchaVerified(response) { 11783 this.recaptcha_response = response; 11784 }, 11785 recaptchaExpired() { 11786 if ( this.show_recaptcha){ 11787 this.$refs.vueRecaptcha.reset(); 11788 } 11789 }, 11790 recaptchaFailed() { 11791 11792 }, 11793 registerPhone(){ 11794 11795 var $params = { 11796 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11797 'mobile_prefix': this.mobile_prefix, 11798 'mobile_number': this.mobile_number, 11799 'recaptcha_response' : this.recaptcha_response 11800 }; 11801 11802 var timenow = 1; 11803 $params = JSON.stringify($params); 11804 11805 ajax_request[timenow] = $.ajax({ 11806 url: ajaxurl+"/RegistrationPhone", 11807 method: "PUT", 11808 dataType: "json", 11809 data: $params , 11810 contentType : $content_type.json , 11811 timeout: $timeout, 11812 crossDomain: true, 11813 beforeSend: data => { 11814 this.is_loading = true; 11815 this.error = []; 11816 if(ajax_request[timenow] != null) { 11817 ajax_request[timenow].abort(); 11818 } 11819 } 11820 }); 11821 11822 ajax_request[timenow].done( data => { 11823 if ( data.code==1){ 11824 this.steps = 2; 11825 this.client_uuid = data.details.client_uuid; 11826 setTimeout(() => { 11827 this.$refs.code.focus(); 11828 }, 500); 11829 11830 if(!empty(data.details.verification_code)){ 11831 helpNotify(data.details.verification_code); 11832 } 11833 11834 this.startTimer(); 11835 } else { 11836 this.recaptchaExpired(); 11837 this.error = data.msg; 11838 this.client_uuid = ''; 11839 } 11840 }); 11841 11842 ajax_request[timenow].always( data => { 11843 this.is_loading = false; 11844 }); 11845 11846 }, 11847 verifyPhoneCode(){ 11848 11849 var $params = { 11850 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11851 'client_uuid': this.client_uuid, 11852 'verification_code': this.verification_code, 11853 }; 11854 11855 var timenow = 1; 11856 $params = JSON.stringify($params); 11857 11858 ajax_request[timenow] = $.ajax({ 11859 url: ajaxurl+"/verifyCode", 11860 method: "PUT", 11861 dataType: "json", 11862 data: $params , 11863 contentType : $content_type.json , 11864 timeout: $timeout, 11865 crossDomain: true, 11866 beforeSend: data => { 11867 this.is_loading = true; 11868 this.error = []; 11869 if(ajax_request[timenow] != null) { 11870 ajax_request[timenow].abort(); 11871 } 11872 } 11873 }); 11874 11875 ajax_request[timenow].done( data => { 11876 if ( data.code==1){ 11877 this.steps = 3; 11878 } else { 11879 this.error = data.msg; 11880 } 11881 }); 11882 11883 ajax_request[timenow].always( data => { 11884 this.is_loading = false; 11885 }); 11886 11887 }, 11888 resendCode(){ 11889 11890 var $params; var timenow = 1; 11891 var $params = { 11892 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11893 'client_uuid': this.client_uuid, 11894 }; 11895 $params = JSON.stringify($params); 11896 ajax_request[timenow] = $.ajax({ 11897 url: ajaxurl+"/requestCodePhone", 11898 method: "PUT", 11899 dataType: "json", 11900 data: $params , 11901 contentType : $content_type.json , 11902 timeout: $timeout, 11903 crossDomain: true, 11904 beforeSend: data => { 11905 this.is_loading = true; 11906 this.error = []; this.success = ''; 11907 if(ajax_request[timenow] != null) { 11908 ajax_request[timenow].abort(); 11909 } 11910 } 11911 }); 11912 11913 ajax_request[timenow].done( data => { 11914 if(data.code==1){ 11915 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 11916 this.counter = parseInt(_resend_counter) ; 11917 } else this.counter = 40; 11918 11919 this.startTimer(); 11920 this.success = data.msg; 11921 } else { 11922 this.error = data.msg; 11923 } 11924 }); 11925 11926 ajax_request[timenow].always( data => { 11927 this.is_loading = false;
11928 }); 11929 11930 }, 11931 completeSignup(){ 11932 11933 var $params = { 11934 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 11935 'client_uuid': this.client_uuid, 11936 'firstname': this.firstname, 11937 'lastname': this.lastname, 11938 'email_address': this.email_address, 11939 'password': this.password, 11940 'cpassword': this.cpassword, 11941 'next_url': this.next_url 11942 }; 11943 11944 var timenow = 1; 11945 $params = JSON.stringify($params); 11946 11947 ajax_request[timenow] = $.ajax({ 11948 url: ajaxurl+"/completeSignup", 11949 method: "PUT", 11950 dataType: "json", 11951 data: $params , 11952 contentType : $content_type.json , 11953 timeout: $timeout, 11954 crossDomain: true, 11955 beforeSend: data => { 11956 this.is_loading = true; 11957 this.error = []; 11958 if(ajax_request[timenow] != null) { 11959 ajax_request[timenow].abort(); 11960 } 11961 } 11962 }); 11963 11964 ajax_request[timenow].done( data => { 11965 if ( data.code==1){ 11966 window.location.href = data.details.redirect_url; 11967 } else { 11968 this.error = data.msg; 11969 } 11970 }); 11971 11972 ajax_request[timenow].always( data => { 11973 this.is_loading = false; 11974 }); 11975 11976 }, 11977 }, 11978 }); 11979 app_client_register_less.use(Maska); 11980 const vm_client_register_less = app_client_register_less.mount('#vue-register-less'); 11981 11982 11983 /** 11984 COMPLETE ACCOUNT SIGNUP 11985 */ 11986 11987 const app_account_information = Vue.createApp({ 11988 components: { 11989 'component-phone' : ComponentsPhoneNumber, 11990 }, 11991 data(){ 11992 return { 11993 is_loading : false, 11994 error : [], 11995 success : '', 11996 steps : 1, 11997 verification_code : '', 11998 client_uuid : '', 11999 next_url : '', 12000 firstname : '', 12001 lastname : '', 12002 email_address : '', 12003 mobile_number : '', 12004 mobile_prefix : '', 12005 counter : 20, 12006 timer : undefined 12007 }; 12008 }, 12009 mounted () { 12010 12011 if ((typeof _uuid !== "undefined") && ( _uuid !== null)) { 12012 this.client_uuid = _uuid; 12013 } 12014 if ((typeof _redirect_to !== "undefined") && ( _redirect_to !== null)) { 12015 this.next_url = _redirect_to; 12016 } 12017 12018 if ((typeof _steps !== "undefined") && ( _steps !== null)) { 12019 this.steps = _steps; 12020 } 12021 12022 if( this.steps==2){ 12023 this.getCustomerInfo(); 12024 } 12025 12026 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 12027 this.counter = parseInt(_resend_counter); 12028 } 12029 12030 this.startTimer(); 12031 12032 }, 12033 computed: { 12034 CodeValid(){ 12035 if(!empty(this.verification_code) ){ 12036 return true; 12037 } 12038 return false; 12039 }, 12040 CompleteFormValid(){ 12041 if(!empty(this.firstname) && empty(!this.lastname) && !empty(this.mobile_number) ){ 12042 return true; 12043 } 12044 return false; 12045 }, 12046 }, 12047 watch: { 12048 counter(newdata,olddata){ 12049 if(newdata<=0){ 12050 this.stopTimer(); 12051 } 12052 } 12053 }, 12054 methods: { 12055 startTimer(){ 12056 this.timer = setInterval(() => { 12057 this.counter--; 12058 }, 1000) 12059 }, 12060 stopTimer(){ 12061 clearInterval(this.timer); 12062 this.success=''; 12063 }, 12064 verifyCode(){ 12065 12066 var $params = { 12067 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12068 'client_uuid': this.client_uuid, 12069 'verification_code' : this.verification_code 12070 }; 12071 var timenow = 1; 12072 $params = JSON.stringify($params); 12073 12074 ajax_request[timenow] = $.ajax({ 12075 url: ajaxurl+"/verifyCode", 12076 method: "PUT", 12077 dataType: "json", 12078 data: $params , 12079 contentType : $content_type.json , 12080 timeout: $timeout, 12081 crossDomain: true, 12082 beforeSend: data => { 12083 this.error = []; 12084 this.is_loading = true; 12085 if(ajax_request[timenow] != null) { 12086 ajax_request[timenow].abort(); 12087 } 12088 } 12089 }); 12090 12091 ajax_request[timenow].done( data => { 12092 if ( data.code==1){ 12093 this.steps = 2; 12094 this.getCustomerInfo(); 12095 } else { 12096 this.error = data.msg; 12097 } 12098 }); // ajax done 12099 12100 ajax_request[timenow].always( data => { 12101 this.is_loading = false;
12102 }); 12103 }, 12104 resendCode(){ 12105 12106 var $params; var timenow = 1; 12107 var $params = { 12108 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12109 'client_uuid': this.client_uuid, 12110 }; 12111 $params = JSON.stringify($params); 12112 ajax_request[timenow] = $.ajax({ 12113 url: ajaxurl+"/requestCode", 12114 method: "PUT", 12115 dataType: "json", 12116 data: $params , 12117 contentType : $content_type.json , 12118 timeout: $timeout, 12119 crossDomain: true, 12120 beforeSend: data => { 12121 this.is_loading = true; 12122 this.error = []; this.success =''; 12123 if(ajax_request[timenow] != null) { 12124 ajax_request[timenow].abort(); 12125 } 12126 } 12127 }); 12128 12129 ajax_request[timenow].done( data => { 12130 if(data.code==1){ 12131 if ((typeof _resend_counter !== "undefined") && ( _resend_counter !== null)) { 12132 this.counter = parseInt(_resend_counter); 12133 } else this.counter = 20; 12134 12135 this.startTimer(); 12136 this.success = data.msg; 12137 } else { 12138 this.error = data.msg; 12139 } 12140 }); 12141 12142 ajax_request[timenow].always( data => { 12143 this.is_loading = false; 12144 }); 12145 12146 }, 12147 getCustomerInfo(){ 12148 12149 var $params = { 12150 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12151 'client_uuid': this.client_uuid, 12152 }; 12153 var timenow = getTimeNow(); 12154 $params = JSON.stringify($params); 12155 12156 ajax_request[timenow] = $.ajax({ 12157 url: ajaxurl+"/getCustomerInfo", 12158 method: "PUT", 12159 dataType: "json", 12160 data: $params , 12161 contentType : $content_type.json , 12162 timeout: $timeout, 12163 crossDomain: true, 12164 beforeSend: data => { 12165 this.error = []; 12166 this.is_loading = true; 12167 if(ajax_request[timenow] != null) { 12168 ajax_request[timenow].abort(); 12169 } 12170 } 12171 }); 12172 12173 ajax_request[timenow].done( data => { 12174 if(data.code==1){ 12175 this.firstname = data.details.firstname; 12176 this.lastname = data.details.lastname; 12177 this.email_address = data.details.email_address; 12178 } else { 12179 this.error = data.msg; 12180 } 12181 }); 12182 12183 ajax_request[timenow].always( data => { 12184 this.is_loading = false; 12185 }); 12186 12187 }, 12188 completeSignup(){ 12189 12190 var $params = { 12191 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12192 'client_uuid': this.client_uuid, 12193 'firstname': this.firstname, 12194 'lastname': this.lastname, 12195 'mobile_prefix': this.mobile_prefix, 12196 'mobile_number': this.mobile_number, 12197 'next_url': this.next_url 12198 }; 12199 12200 var timenow = 1; 12201 $params = JSON.stringify($params); 12202 12203 ajax_request[timenow] = $.ajax({ 12204 url: ajaxurl+"/completeSocialSignup", 12205 method: "PUT", 12206 dataType: "json", 12207 data: $params , 12208 contentType : $content_type.json , 12209 timeout: $timeout, 12210 crossDomain: true, 12211 beforeSend: data => { 12212 this.is_loading = true; 12213 this.error = []; 12214 if(ajax_request[timenow] != null) { 12215 ajax_request[timenow].abort(); 12216 } 12217 } 12218 }); 12219 12220 ajax_request[timenow].done( data => { 12221 if ( data.code==1){ 12222 window.location.href = data.details.redirect_url; 12223 } else { 12224 this.error = data.msg; 12225 } 12226 }); 12227 12228 ajax_request[timenow].always( data => { 12229 this.is_loading = false; 12230 }); 12231 12232 }, 12233 }, 12234 }); 12235 app_account_information.use(Maska); 12236 const vm_account_information = app_account_information.mount('#vue-account-information'); 12237 12238 12239 /* 12240 FORGOT PASSWORD 12241 */ 12242 const fpCounter = 5; 12243 const app_forgot_password = Vue.createApp({ 12244 components: { 12245 'component-phone' : ComponentsPhoneNumber, 12246 }, 12247 data (){ 12248 return { 12249 loading : false, 12250 error : [], 12251 email_address : '', 12252 steps :1, 12253 uuid : '', 12254 success : '', 12255 counter : fpCounter, 12256 timer : undefined, 12257 mobile_number : '', 12258 mobile_prefix :'', 12259 password_reset_options :'', 12260 otp :'', 12261 validation_type : 1 12262 } 12263 }, 12264 watch: { 12265 counter(newdata,olddata){ 12266 if(newdata<=0){ 12267 this.stopTimer(); 12268 } 12269 } 12270 }, 12271 mounted() { 12272 if ((typeof password_reset_options !== "undefined") && ( password_reset_options !== null)) { 12273 this.password_reset_options = password_reset_options 12274 } 12275 if(this.password_reset_options=='sms'){ 12276 this.validation_type = 2; 12277 } 12278 }, 12279 computed: { 12280 checkForm(){ 12281 if(this.validation_type==2){ 12282 if(empty(this.mobile_number)){ 12283 return true; 12284 } 12285 } else { 12286 if(!this.validEmail(this.email_address)){ 12287 return true; 12288 } 12289 } 12290 return false;
12291 }, 12292 }, 12293 methods: { 12294 validEmail: function (email) { 12295 var re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 12296 return re.test(email); 12297 }, 12298 startTimer(){ 12299 this.counter = fpCounter; 12300 this.timer = setInterval(() => { 12301 this.counter--; 12302 }, 1000) 12303 }, 12304 stopTimer(){ 12305 clearInterval(this.timer); 12306 }, 12307 startOver(){ 12308 this.steps = 1; 12309 this.stopTimer(); 12310 }, 12311 requestResetPassword(){ 12312 12313 var $params = { 12314 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12315 'email_address': this.email_address, 12316 'password_reset_options' : this.password_reset_options, 12317 'mobile_number': this.mobile_number, 12318 'mobile_prefix': this.mobile_prefix, 12319 }; 12320 12321 var timenow = 1; 12322 $params = JSON.stringify($params); 12323 12324 let actionPassword = this.validation_type==2 ? ajaxurl+"/requestResetpasswordsms" : ajaxurl+"/requestResetPassword"; 12325 12326 ajax_request[timenow] = $.ajax({ 12327 url: actionPassword, 12328 method: "PUT", 12329 dataType: "json", 12330 data: $params , 12331 contentType : $content_type.json , 12332 timeout: $timeout, 12333 crossDomain: true, 12334 beforeSend: data => { 12335 this.loading = true; this.error = []; this.success=''; 12336 if(ajax_request[timenow] != null) { 12337 ajax_request[timenow].abort(); 12338 } 12339 } 12340 }); 12341 12342 ajax_request[timenow].done( data => { 12343 if ( data.code==1){ 12344 this.steps = !empty(data.details.steps)? data.details.steps: 2; 12345 this.uuid = data.details.uuid; 12346 this.success = data.msg; 12347 this.startTimer(); 12348 } else { 12349 this.error = data.msg; 12350 this.success = ''; 12351 } 12352 }); 12353 12354 ajax_request[timenow].always( data => { 12355 this.loading = false; 12356 }); 12357 12358 }, 12359 resendResetEmail(){ 12360 12361 var $params = { 12362 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12363 'client_uuid': this.uuid, 12364 'password_reset_options' : this.password_reset_options, 12365 'mobile_number': this.mobile_number, 12366 'mobile_prefix': this.mobile_prefix, 12367 }; 12368 12369 var timenow = 1; 12370 $params = JSON.stringify($params); 12371 12372 ajax_request[timenow] = $.ajax({ 12373 url: this.validation_type==2? ajaxurl+"/resendResetpasswordsms" : ajaxurl+"/resendResetEmail", 12374 method: "PUT", 12375 dataType: "json", 12376 data: $params , 12377 contentType : $content_type.json , 12378 timeout: $timeout, 12379 crossDomain: true, 12380 beforeSend: data => { 12381 this.loading = true; this.error = []; this.success=''; 12382 if(ajax_request[timenow] != null) { 12383 ajax_request[timenow].abort(); 12384 } 12385 } 12386 }); 12387 12388 ajax_request[timenow].done( data => { 12389 if ( data.code==1){ 12390 this.success = data.msg; 12391 this.counter = fpCounter; 12392 this.startTimer(); 12393 } else { 12394 this.error = data.msg; 12395 } 12396 }); 12397 12398 ajax_request[timenow].always( data => { 12399 this.loading = false; 12400 }); 12401 12402 }, 12403 verifyOTP(){ 12404 this.loading = true; 12405 axios({ 12406 method: 'POST', 12407 url: ajaxurl+"/verifyOTP" , 12408 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&client_uuid="+ this.uuid + "&otp=" + this.otp, 12409 timeout: $timeout, 12410 }).then( response => { 12411 if(response.data.code==1){ 12412 window.location.href = response.data.details.redirect; 12413 } else { 12414 ElementPlus.ElNotification({ 12415 title: "", 12416 message: response.data.msg, 12417 position: 'bottom-right', 12418 type: 'warning', 12419 }); 12420 } 12421 }).catch(error => { 12422 // 12423 }).then(data => { 12424 this.loading = false; 12425 }); 12426 } 12427 }, 12428 }); 12429 app_forgot_password.use(Maska); 12430 app_forgot_password.use(ElementPlus); 12431 const vm_forgot_password = app_forgot_password.mount('#vue-forgot-password'); 12432 12433 12434 /* 12435 RESET PASSWORD 12436 */ 12437 const vm_reset_password = Vue.createApp({ 12438 data (){ 12439 return { 12440 loading : false, 12441 success :'', 12442 error : [], 12443 uuid : '', 12444 password : '', 12445 cpassword : '', 12446 steps : 1, 12447 } 12448 }, 12449 mounted () { 12450 if ((typeof _client_id !== "undefined") && ( _client_id !== null)) {
12451 this.uuid = _client_id; 12452 } 12453 }, 12454 computed: { 12455 checkForm(){ 12456 if(!empty(this.password) && !empty(this.cpassword) ){ 12457 return true; 12458 } 12459 return false; 12460 } 12461 }, 12462 methods: { 12463 resetPassword(){ 12464 12465 var $params = { 12466 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12467 'client_uuid': this.uuid, 12468 'password': this.password, 12469 'cpassword': this.cpassword, 12470 }; 12471 12472 var timenow = 1; 12473 $params = JSON.stringify($params); 12474 12475 ajax_request[timenow] = $.ajax({ 12476 url: ajaxurl+"/resetPassword", 12477 method: "PUT", 12478 dataType: "json", 12479 data: $params , 12480 contentType : $content_type.json , 12481 timeout: $timeout, 12482 crossDomain: true, 12483 beforeSend: data => { 12484 this.loading = true; this.error = []; this.success=''; 12485 if(ajax_request[timenow] != null) { 12486 ajax_request[timenow].abort(); 12487 } 12488 } 12489 }); 12490 12491 ajax_request[timenow].done( data => { 12492 if ( data.code==1){ 12493 this.success = data.msg; 12494 this.steps = 2; 12495 } else { 12496 this.error = data.msg; 12497 } 12498 }); 12499 12500 ajax_request[timenow].always( data => { 12501 this.loading = false; 12502 }); 12503 12504 }, 12505 }, 12506 }).mount('#vue-reset-password'); 12507 12508 /** 12509 VUE TRANSACTION 12510 this is function for displaying transaction during checkout 12511 target = vue-transaction 12512 */ 12513 const app_checkout_transaction = Vue.createApp({ 12514 data(){ 12515 return { 12516 is_loading : false, 12517 error : [], 12518 transactions :[], 12519 transaction_type : '', 12520 delivery_option : [], 12521 whento_deliver : 'now', 12522 opening_hours : [], 12523 delivery_date : '', 12524 delivery_time : '', 12525 opt_contact_delivery : false, 12526 display_transaction_type:'', 12527 display_data : [], 12528 checkout_error : [], 12529 opening_hours_date : [], 12530 opening_hours_time : [] 12531 }; 12532 }, 12533 mounted () { 12534 this.getTransaction() 12535 }, 12536 updated () { 12537 //dump("display_transaction_type=>"+this.display_transaction_type); 12538 }, 12539 methods: { 12540 show(){ 12541 this.error = []; 12542 $('#orderTypeTime').modal('show'); 12543 }, 12544 close(){ 12545 $('#orderTypeTime').modal('hide'); 12546 }, 12547 JsonValue(item){ 12548 return JSON.stringify({ 12549 start_time : item.start_time, 12550 end_time : item.end_time, 12551 pretty_time : item.pretty_time 12552 }); 12553 }, 12554 getTransaction(){ 12555 var $params=''; var timenow = getTimeNow(); 12556 var $cart_uuid = getCookie('cart_uuid'); 12557 $params="cart_uuid=" + $cart_uuid; 12558 $params+=addValidationRequest(); 12559 12560 this.is_loading = true; 12561 12562 ajax_request[timenow] = $.ajax({ 12563 url: ajaxurl+"/checkoutTransaction", 12564 method: "POST", 12565 dataType: "json", 12566 data: $params, 12567 contentType : $content_type.form , 12568 timeout: $timeout, 12569 crossDomain: true, 12570 beforeSend: function( xhr ) { 12571 if(ajax_request[timenow] != null) { 12572 ajax_request[timenow].abort(); 12573 } 12574 } 12575 }); 12576 12577 ajax_request[timenow].done( data => { 12578 if ( data.code==1){ 12579 this.transactions = data.details.transactions; 12580 this.delivery_option = data.details.delivery_option; 12581 this.opening_hours_date = data.details.opening_hours.dates; 12582 this.opening_hours_time = data.details.opening_hours.time_ranges; 12583 12584 /* 12585 this.opening_hours = data.details.opening_hours; 12586 var keys = Object.keys(data.details.opening_hours); 12587 keys = keys[0]; 12588 this.delivery_date = data.details.opening_hours[keys].value; 12589 */ 12590 12591 // ✅ Extract the first date key from the object 12592 const dateKeys = Object.keys(this.opening_hours_date); 12593 if (dateKeys.length > 0) { 12594 const firstKey = dateKeys[0]; 12595 const firstDateObj = this.opening_hours_date[firstKey]; 12596 12597 // Set the delivery_date to the first value 12598 this.delivery_date = firstDateObj.value; 12599 12600 // ✅ If there are time slots for that date, set the first one 12601 if ( 12602 this.opening_hours_time[firstDateObj.value] && 12603 this.opening_hours_time[firstDateObj.value].length > 0 12604 ) { 12605 this.delivery_time = this.JsonValue(this.opening_hours_time[firstDateObj.value][0]); 12606 } 12607 } 12608 12609 } else { 12610 this.transactions = []; 12611 this.delivery_option = []; 12612 this.opening_hours = []; 12613 this.display_data = []; 12614 this.checkout_error = []; 12615 this.opening_hours_date = []; 12616 } 12617 }); // ajax done 12618 12619 ajax_request[timenow].always( data => { 12620 this.is_loading = false;
12621 }); 12622 }, 12623 setData(item){ 12624 this.transaction_type = item.transaction_type; 12625 this.display_transaction_type = item.transaction_type; 12626 this.display_data = item.data; 12627 12628 if ((typeof item.data.whento_deliver !== "undefined") && ( item.data.whento_deliver !== null)) { 12629 this.whento_deliver = item.data.whento_deliver; 12630 } 12631 12632 if ((typeof item.data.delivery_date !== "undefined") && ( item.data.delivery_date !== null)) { 12633 this.delivery_date = item.data.delivery_date; 12634 } 12635 12636 if ((typeof item.data.delivery_time !== "undefined") && ( item.data.delivery_time !== null)) { 12637 this.delivery_time = item.data.delivery_time; 12638 } 12639 12640 if ((typeof item.data.error !== "undefined") && ( item.data.error !== null)) { 12641 this.checkout_error = item.data.error; 12642 } else this.checkout_error = []; 12643 }, 12644 validate(){ 12645 this.error = []; 12646 if(this.whento_deliver=="now"){ 12647 this.save(); 12648 } else { 12649 if(empty(this.delivery_date)){ 12650 this.error.push( t("Delivery Date is required") ); 12651 } else if( empty(this.delivery_time) ){ 12652 this.error.push( t("Time is required") ); 12653 } else { 12654 this.save(); 12655 } 12656 } 12657 }, 12658 save(){ 12659 var $params = { 12660 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12661 'cart_uuid':getCookie('cart_uuid'), 12662 'transaction_type': this.transaction_type, 12663 'whento_deliver' : this.whento_deliver, 12664 'delivery_date': this.delivery_date, 12665 'delivery_time': !empty(this.delivery_time)?JSON.parse(this.delivery_time):'' 12666 }; 12667 var timenow = 1; 12668 $params = JSON.stringify($params); 12669 12670 ajax_request[timenow] = $.ajax({ 12671 url: ajaxurl+"/checkoutSave", 12672 method: "PUT", 12673 dataType: "json", 12674 data: $params , 12675 contentType : $content_type.json , 12676 timeout: $timeout, 12677 crossDomain: true, 12678 beforeSend: data => { 12679 this.is_loading = true; 12680 if(ajax_request[timenow] != null) { 12681 ajax_request[timenow].abort(); 12682 } 12683 } 12684 }); 12685 12686 ajax_request[timenow].done( data => { 12687 if ( data.code==1){ 12688 var $json = { 12689 'whento_deliver' : data.details.whento_deliver, 12690 'delivery_date' : data.details.delivery_date, 12691 'delivery_time' : data.details.delivery_time 12692 }; 12693 setCookie('choosen_delivery', JSON.stringify($json) ,30); 12694 setCookie('cart_transaction_type', this.transaction_type ,30); 12695 12696 $('#orderTypeTime').modal('hide'); 12697 location.reload(); 12698 vue_cart.loadcart(); 12699 vm_tips.loadTips(); 12700 if ((typeof vm_delivery_details !== "undefined") && ( vm_delivery_details !== null)) { 12701 vm_delivery_details.addressNeeded(); 12702 } 12703 if ((typeof vm_checkout_booking !== "undefined") && ( vm_checkout_booking !== null)) { 12704 vm_checkout_booking.getTableAttributes(); 12705 } 12706 } 12707 }); 12708 12709 ajax_request[timenow].always( data => { 12710 this.is_loading = false; 12711 }); 12712 }, 12713 }, 12714 }); 12715 app_checkout_transaction.use(ElementPlus); 12716 const vm_checkout_transaction = app_checkout_transaction.mount('#vue-transaction'); 12717 12718 12719 /*COMPONENTS CHANGE PHONE*/ 12720 const ComponentsChangePhone = { 12721 components: { 12722 'component-phone' : ComponentsPhoneNumber, 12723 }, 12724 props: ['label','is_mobile','default_country','only_countries'], 12725 data() { 12726 return { 12727 error: [], 12728 is_loading : false, 12729 mobile_prefix : '', 12730 mobile_prefixes : [], 12731 mobile_number : '', 12732 mobile_number_old : '' 12733 } 12734 }, 12735 computed: { 12736 PhoneValid(){ 12737 if(!empty(this.mobile_number) && this.mobile_number!=this.mobile_number_old ){ 12738 return true; 12739 } 12740 return false; 12741 }, 12742 }, 12743 methods: { 12744 show(){ 12745 $('#changephoneModal').modal('show'); 12746 this.error = []; 12747 }, 12748 close(){ 12749 $('#changephoneModal').modal('hide'); 12750 }, 12751 SendCode(){ 12752 12753 var $params; var timenow = 1; 12754 var $params = { 12755 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12756 }; 12757 $params = JSON.stringify($params); 12758 ajax_request[timenow] = $.ajax({ 12759 url: ajaxurl+"/RequestEmailCode", 12760 method: "PUT", 12761 dataType: "json", 12762 data: $params , 12763 contentType : $content_type.json , 12764 timeout: $timeout, 12765 crossDomain: true, 12766 beforeSend: data => { 12767 this.is_loading = true; 12768 this.error = []; 12769 if(ajax_request[timenow] != null) { 12770 ajax_request[timenow].abort(); 12771 } 12772 } 12773 }); 12774 12775 ajax_request[timenow].done( data => { 12776 if(data.code==1){ 12777 this.close(); 12778 this.$emit('setPhone',{ 12779 mobile_prefix:this.mobile_prefix, 12780 mobile_number: this.mobile_number, 12781 message : data.msg 12782 }); 12783 } else { 12784 this.error = data.msg; 12785 } 12786 }); 12787 12788 ajax_request[timenow].always( data => { 12789 this.is_loading = false;
12790 }); 12791 12792 }, 12793 }, 12794 template: ` 12795 <div class="modal" id="changephoneModal" tabindex="-1" role="dialog" 12796 aria-labelledby="changephoneModal" aria-hidden="true" > 12797 <div class="modal-dialog" role="document"> 12798 <div class="modal-content" :class="{ 'modal-mobile' : is_mobile==1 }"> 12799 12800 <div class="modal-header border-bottom-0" style="padding-bottom:0px !important;"> 12801 <h5 class="modal-title" id="exampleModalLongTitle"> 12802 {{label.edit_phone}} 12803 </h5> 12804 <div class="close"> 12805 <a href="javascript:;" @click="close" class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 12806 </div> 12807 </div> 12808 12809 <div class="modal-body" style="overflow-y:inherit !important;"> 12810 12811 <form class="forms mt-2 mb-2" @submit.prevent="SendCode" > 12812 12813 <!--COMPONENTS--> 12814 <component-phone 12815 :default_country="default_country" 12816 :only_countries="only_countries" 12817 v-model:mobile_number="mobile_number" 12818 v-model:mobile_prefix="mobile_prefix" 12819 > 12820 </component-phone> 12821 <!--END COMPONENTS--> 12822 12823 12824 </form> 12825 12826 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 12827 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 12828 </div> 12829 12830 </div> <!--modal body--> 12831 12832 <div class="modal-footer justify-content-start"> 12833 12834 <div class="border flex-fill"> 12835 <button class="btn btn-black w-100" @click="close" > 12836 {{label.cancel}} 12837 </button> 12838 </div> 12839 <div class="border flex-fill"> 12840 <button @click="SendCode" 12841 class="btn btn-green w-100" :class="{ loading: is_loading }" :disabled="!PhoneValid" > 12842 <span class="label">{{label.continue}}</span> 12843 <div class="m-auto circle-loader" data-loader="circle-side"></div> 12844 </button> 12845 </div> 12846 12847 </div> <!--footer--> 12848 12849 </div> <!--content--> 12850 </div> <!--dialog--> 12851 </div> <!--modal--> 12852 ` 12853 }; 12854 /*END COMPONENTS CHANGE PHONE*/ 12855 12856 /* 12857 ComponentsChangePhoneVerification 12858 */ 12859 const ComponentsChangePhoneVerification = { 12860 props: ['label'], 12861 data() { 12862 return { 12863 error: [], 12864 is_loading : false, 12865 code : '', 12866 data : [], 12867 counter : 20, 12868 timer : undefined 12869 } 12870 }, 12871 computed: { 12872 CodeisValid(){ 12873 if(!empty(this.code)){ 12874 return true; 12875 } 12876 return false; 12877 }, 12878 }, 12879 watch: { 12880 counter(newdata,olddata){ 12881 if(newdata<=0){ 12882 this.stopTimer(); 12883 } 12884 } 12885 }, 12886 methods: { 12887 show(data){ 12888 this.data = data; 12889 this.code = ''; 12890 this.error = []; 12891 this.startTimer(); 12892 $('#verifyCodeModal').modal('show'); 12893 12894 setInterval(() => { 12895 this.$refs.refcode.focus(); 12896 }, 500) 12897 12898 }, 12899 startTimer(){ 12900 this.stopTimer(); 12901 this.counter = 20; 12902 this.timer = setInterval(() => { 12903 this.counter--; 12904 }, 1000) 12905 }, 12906 stopTimer(){ 12907 clearInterval(this.timer); 12908 }, 12909 close(){ 12910 $('#verifyCodeModal').modal('hide'); 12911 }, 12912 submit(){ 12913 this.$emit('afterSubmit',this.code); 12914 }, 12915 resendCode(){ 12916 12917 var $params; var timenow = 1; 12918 var $params = { 12919 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 12920 }; 12921 dump("resendCode"); 12922 $params = JSON.stringify($params); 12923 ajax_request[timenow] = $.ajax({ 12924 url: ajaxurl+"/RequestEmailCode", 12925 method: "PUT", 12926 dataType: "json", 12927 data: $params , 12928 contentType : $content_type.json , 12929 timeout: $timeout, 12930 crossDomain: true, 12931 beforeSend: data => { 12932 this.is_loading = true; 12933 this.error = []; 12934 if(ajax_request[timenow] != null) { 12935 ajax_request[timenow].abort(); 12936 } 12937 } 12938 }); 12939 12940 ajax_request[timenow].done( data => { 12941 if(data.code==1){ 12942 this.counter = 20; 12943 this.startTimer(); 12944 if(!empty(data.details)){ 12945 if(!empty(data.details.verification_code)){ 12946 helpNotify(data.details.verification_code); 12947 } 12948 } 12949 } else { 12950 this.error = data.msg; 12951 } 12952 }); 12953 12954 ajax_request[timenow].always( data => { 12955 this.is_loading = false;
12956 }); 12957 12958 }, 12959 }, 12960 template: ` 12961 <div class="modal" id="verifyCodeModal" tabindex="-1" role="dialog" 12962 aria-labelledby="verifyCodeModal" aria-hidden="true" data-backdrop="static" data-keyboard="false" > 12963 <div class="modal-dialog" role="document"> 12964 <div class="modal-content"> 12965 12966 <form class="forms" @submit.prevent="submit" > 12967 12968 <div class="modal-body"> 12969 12970 12971 <a href="javascript:;" @click="close" 12972 class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 12973 12974 <div class="text-center"> 12975 <h4 class="m-0 mb-3 mt-3">{{label.steps}}</h4> 12976 <h6>{{label.for_security}}</h6> 12977 </div> 12978 12979 12980 12981 <p class="bold">{{label.enter_digit}}</p> 12982 <div class="form-label-group"> 12983 <input v-model="code" ref="refcode" v-maska="'######'" 12984 class="form-control form-control-text" 12985 placeholder="" type="text" maxlength="6" id="code" > 12986 <label for="code" class="required">{{label.code}}</label> 12987 </div> 12988 12989 12990 12991 <p class="bold">{{data.message}}</p> 12992 12993 <template v-if="counter===0"> 12994 <div class="mt-1 mb-3"> 12995 <a href="javascript:;" @click="resendCode" :disabled="is_loading" > 12996 <p class="m-0"><u>{{label.resend_code}}</u></p> 12997 </a> 12998 </div> 12999 </template> 13000 <template v-else> 13001 <p><u>{{label.resend_code_in}} {{counter}}</u></p> 13002 </template> 13003 13004 13005 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 13006 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 13007 </div> 13008 13009 </div> <!--modal body--> 13010 13011 <div class="modal-footer justify-content-start"> 13012 <button class="btn btn-green w-100" 13013 :class="{ loading: is_loading }" :disabled="!CodeisValid" >
13014 <span class="label">{{label.submit}}</span> 13015 <div class="m-auto circle-loader" data-loader="circle-side"></div> 13016 </button> 13017 </div> <!--footer--> 13018 13019 </form> 13020 </div> <!--content--> 13021 </div> <!--dialog--> 13022 </div> <!--modal--> 13023 ` 13024 }; 13025 13026 13027 /** 13028 CHECKOUT CONTACT PHONE 13029 target = vue-contactphone 13030 */ 13031 const vm_contactphone = Vue.createApp({ 13032 components: { 13033 'component-change-phone' : ComponentsChangePhone, 13034 'component-change-phoneverify' : ComponentsChangePhoneVerification, 13035 }, 13036 mounted () { 13037 this.getCheckoutPhone(); 13038 }, 13039 data() { 13040 return { 13041 contact_number: '', 13042 data :[], 13043 is_loading : false, 13044 } 13045 }, 13046 methods: { 13047 showChangePhone(){ 13048 this.$refs.cphone.show(); 13049 }, 13050 loadVerification(data){ 13051 this.data = data; 13052 this.$refs.cphoneverify.show( data ); 13053 }, 13054 getCheckoutPhone(){ 13055 var $params; var timenow = getTimeNow(); 13056 var $params = { 13057 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13058 'cart_uuid':getCookie('cart_uuid'), 13059 }; 13060 $params = JSON.stringify($params); 13061 this.is_loading = true; 13062 ajax_request[timenow] = $.ajax({ 13063 url: ajaxurl+"/getCheckoutPhone", 13064 method: "PUT", 13065 dataType: "json", 13066 data: $params , 13067 contentType : $content_type.json , 13068 timeout: $timeout, 13069 crossDomain: true, 13070 beforeSend: data => { 13071 if(ajax_request[timenow] != null) { 13072 ajax_request[timenow].abort(); 13073 } 13074 } 13075 }); 13076 13077 ajax_request[timenow].done( data => { 13078 if(data.code==1){ 13079 this.contact_number = data.details.contact_number_w_prefix; 13080 13081 this.$refs.cphone.mobile_prefixes = data.details.prefixes; 13082 this.$refs.cphone.mobile_prefix = data.details.default_prefix; 13083 this.$refs.cphone.mobile_number = data.details.contact_number; 13084 this.$refs.cphone.mobile_number_old = data.details.contact_number; 13085 } else { 13086 this.contact_number = ''; 13087 this.$refs.cphone.mobile_prefixes = []; 13088 } 13089 }); 13090 13091 ajax_request[timenow].always( data => { 13092 this.is_loading = false; 13093 }); 13094 13095 }, 13096 ChangePhone(code){ 13097 dump("change phone"); 13098 13099 var $params; var timenow = 1; 13100 var $params = { 13101 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13102 'cart_uuid':getCookie('cart_uuid'), 13103 'data': this.data, 13104 'code': code 13105 }; 13106 $params = JSON.stringify($params); 13107 ajax_request[timenow] = $.ajax({ 13108 url: ajaxurl+"/ChangePhone", 13109 method: "PUT", 13110 dataType: "json", 13111 data: $params , 13112 contentType : $content_type.json , 13113 timeout: $timeout, 13114 crossDomain: true, 13115 beforeSend: data => { 13116 this.$refs.cphoneverify.is_loading = true; 13117 this.$refs.cphoneverify.error = []; 13118 if(ajax_request[timenow] != null) { 13119 ajax_request[timenow].abort(); 13120 } 13121 } 13122 }); 13123 13124 ajax_request[timenow].done( data => { 13125 if(data.code==1){ 13126 this.$refs.cphoneverify.close(); 13127 vm_contactphones.getCheckoutPhone(); 13128 } else { 13129 this.$refs.cphoneverify.error = data.msg; 13130 } 13131 }); 13132 13133 ajax_request[timenow].always( data => { 13134 this.$refs.cphoneverify.is_loading = false; 13135 }); 13136 13137 } 13138 }, 13139 }); 13140 13141 vm_contactphone.use(Maska); 13142 vm_contactphone.use(ElementPlus); 13143 const vm_contactphones = vm_contactphone.mount('#vue-contactphone'); 13144 13145 13146 13147 13148 /* 13149 COMPONENTS PROMO CODE 13150 */ 13151 const componentPromocode = { 13152 props: ['title','add_promo_code','cancel_text','apply_text','is_mobile'], 13153 data() { 13154 return { 13155 is_loading: false, 13156 promo_code : '', 13157 error : [] 13158 } 13159 }, 13160 methods: { 13161 showModal(){ 13162 $('#promocodeModal').modal('show'); 13163 }, 13164 closeModal(){ 13165 $('#promocodeModal').modal('hide'); 13166 this.error = []; 13167 this.promo_code = ''; 13168 }, 13169 applyCode(){ 13170 this.error = []; 13171 var $params; var timenow = 1; 13172 $params="promo_code="+ this.promo_code; 13173 $params+="&cart_uuid=" + getCookie('cart_uuid'); 13174 $params+=addValidationRequest(); 13175 ajax_request[timenow] = $.ajax({ 13176 url: ajaxurl+"/applyPromoCode", 13177 method: "POST", 13178 dataType: "json", 13179 data: $params, 13180 contentType : $content_type.form , 13181 timeout: $timeout, 13182 crossDomain: true, 13183 beforeSend: data => { 13184 this.is_loading = true; 13185 if(ajax_request[timenow] != null) { 13186 ajax_request[timenow].abort(); 13187 } 13188 } 13189 }); 13190 13191 ajax_request[timenow].done( data => { 13192 if ( data.code==1){ 13193 this.closeModal(); 13194 13195 if(vm_apply_promocode.enabled){ 13196 vm_apply_promocode.getAppliedPromo(); 13197 } else { 13198 this.$emit('setLoadpromo'); 13199 } 13200 vue_cart.loadcart(); 13201 } else { 13202 this.error[0] = data.msg; 13203 } 13204 }); // ajax done 13205 13206 ajax_request[timenow].always( data => { 13207 this.is_loading = false; 13208 }); 13209 13210 }, 13211 back(){ 13212 this.closeModal(); 13213 this.$emit('back'); 13214 } 13215 }, 13216 computed: { 13217 hasData(){ 13218 if(this.promo_code==""){ 13219 this.error = []; 13220 return true; 13221 } 13222 return false;
13223 }, 13224 }, 13225 template: ` 13226 <div class="modal" id="promocodeModal" tabindex="-1" role="dialog" 13227 aria-labelledby="promocodeModal" aria-hidden="true" data-backdrop="static" > 13228 <div class="modal-dialog" role="document"> 13229 <div class="modal-content" :class="{ 'modal-mobile' : is_mobile==1 }" > 13230 13231 <div class="modal-header border-bottom-0" style="padding-bottom:0px !important;"> 13232 <h5 class="modal-title" id="exampleModalLongTitle"> 13233 {{title}} 13234 </h5> 13235 <div class="close"> 13236 <a href="javascript:;" data-dismiss="modal" class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 13237 </div> 13238 </div> 13239 13240 <div class="modal-body"> 13241 13242 <form class="forms mt-2 mb-2" @submit.prevent="applyCode" > 13243 13244 <div class="form-label-group"> 13245 <input v-model="promo_code" class="form-control form-control-text" placeholder="" 13246 id="promo_code" type="text" maxlength="20" > 13247 <label for="promo_code" class="required">{{add_promo_code}}</label> 13248 </div> 13249 13250 </form> <!--forms--> 13251 13252 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 13253 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 13254 </div> 13255 13256 </div> <!--modal body--> 13257 13258 <div class="modal-footer"> 13259 <button type="button" class="btn btn-black pl-4 pr-4" @click="back" v-if="cancel_text">{{cancel_text}}</button> 13260 <button type="button" class="btn btn btn-green pl-4 pr-4" 13261 @click="applyCode" :class="{ loading: is_loading }" :disabled="hasData" 13262 >
13263 <span class="label">{{apply_text}}</span><div class="m-auto circle-loader" data-loader="circle-side"></div> 13264 </button> 13265 </div> 13266 13267 </div> <!--content--> 13268 </div> <!--dialog--> 13269 </div> <!--modal--> 13270 ` 13271 }; 13272 /* 13273 END COMPONENTS PROMO CODE 13274 */ 13275 13276 /** 13277 PROMO 13278 this is function for displaying promo in checkout 13279 target = vue-promo 13280 */ 13281 const app_promo = Vue.createApp({ 13282 components: { 13283 'component-promocode': componentPromocode, 13284 }, 13285 data(){ 13286 return { 13287 is_loading : false, 13288 loading : false, 13289 remove_loading : false, 13290 saved_disabled : true, 13291 promo_id : [], 13292 data : [], 13293 error : '', 13294 promo_selected :[] 13295 }; 13296 }, 13297 created () { 13298 this.loadPromo(); 13299 }, 13300 updated () { 13301 if(this.promo_id.length>0){ 13302 this.saved_disabled = true; 13303 } else { 13304 this.saved_disabled = false; 13305 } 13306 }, 13307 computed: { 13308 hasSelectedPromo(){ 13309 if (Object.keys(this.promo_id).length > 0) { 13310 return true; 13311 } 13312 return false; 13313 } 13314 }, 13315 methods: { 13316 loadPromo(){ 13317 13318 this.is_loading = true; 13319 var $params; var timenow = getTimeNow(); 13320 let currency_code = getCookie('currency_code'); 13321 currency_code = !empty(currency_code)?currency_code:''; 13322 13323 $params="cart_uuid=" + getCookie('cart_uuid'); 13324 $params+="¤cy_code=" + currency_code; 13325 $params+=addValidationRequest(); 13326 ajax_request[timenow] = $.ajax({ 13327 url: ajaxurl+"/loadPromo", 13328 method: "POST", 13329 dataType: "json", 13330 data: $params, 13331 contentType : $content_type.form , 13332 timeout: $timeout, 13333 crossDomain: true, 13334 beforeSend: data => { 13335 if(ajax_request[timenow] != null) { 13336 ajax_request[timenow].abort(); 13337 } 13338 } 13339 }); 13340 13341 ajax_request[timenow].done( data => { 13342 if ( data.code===1){ 13343 this.data = data.details.data; 13344 this.promo_selected = data.details.promo_selected; 13345 vm_apply_promocode.enabled = false; 13346 } else { 13347 this.data = []; 13348 this.promo_selected = []; 13349 vm_apply_promocode.enabled = true; 13350 } 13351 }); // ajax done 13352 13353 ajax_request[timenow].always( data => { 13354 this.is_loading = false; 13355 }); 13356 13357 }, 13358 show(){ 13359 this.error = ''; 13360 $( this.$refs.promo_modal ).modal('show'); 13361 }, 13362 hide(){ 13363 $(this.$refs.promo_modal).modal('hide'); 13364 }, 13365 close(){ 13366 $(this.$refs.promo_modal).modal('hide'); 13367 }, 13368 save(){ 13369 this.loading = true; 13370 axios({ 13371 method: 'PUT', 13372 url: ajaxurl+"/applyPromo" , 13373 data : { 13374 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13375 'cart_uuid':getCookie('cart_uuid'), 13376 'promo_type': this.promo_id[0], 13377 'promo_id': this.promo_id[1], 13378 'currency_code': getCookie('currency_code') 13379 }, 13380 timeout: $timeout, 13381 }).then( response => { 13382 console.debug(response.data.code); 13383 if(response.data.code==1){ 13384 this.error = ''; 13385 this.close(); 13386 this.loadPromo(); 13387 vue_cart.loadcart(); 13388 } else { 13389 this.error = response.data.msg; 13390 } 13391 }).catch(error => { 13392 // 13393 }).then(data => { 13394 this.loading = false; 13395 }); 13396 }, 13397 removePromo(promo_type,promo_id){ 13398 13399 var $params = { 13400 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13401 'cart_uuid':getCookie('cart_uuid'), 13402 'promo_id': promo_id, 13403 'promo_type':promo_type 13404 }; 13405 13406 var timenow = 1; 13407 $params = JSON.stringify($params); 13408 13409 ajax_request[timenow] = $.ajax({ 13410 url: ajaxurl+"/removePromo", 13411 method: "PUT", 13412 dataType: "json", 13413 data: $params , 13414 contentType : $content_type.json , 13415 timeout: $timeout, 13416 crossDomain: true, 13417 beforeSend: data => { 13418 this.remove_loading = true; 13419 if(ajax_request[timenow] != null) { 13420 ajax_request[timenow].abort(); 13421 } 13422 } 13423 }); 13424 13425 ajax_request[timenow].done( data => { 13426 if ( data.code==1){ 13427 this.close(); 13428 this.loadPromo(); 13429 this.promo_id = []; 13430 vue_cart.loadcart(); 13431 } else this.error = data.msg; 13432 }); 13433 13434 ajax_request[timenow].always( data => { 13435 this.remove_loading = false;
13436 }); 13437 13438 }, 13439 showPromoCode(){ 13440 this.$refs.childref.showModal(); 13441 this.hide(); 13442 }, 13443 }, 13444 }); 13445 app_promo.use(ElementPlus); 13446 const vm_promo = app_promo.mount('#vue-promo'); 13447 13448 13449 /** 13450 APPLY PROMO CODE MANUALLY 13451 target = vue-add-promocode 13452 */ 13453 const vm_apply_promocode = Vue.createApp({ 13454 components: { 13455 'component-apply-promocode': componentPromocode, 13456 }, 13457 data(){ 13458 return { 13459 enabled : false, 13460 has_promocode : false, 13461 saving : '', 13462 data : [] 13463 }; 13464 }, 13465 mounted () { 13466 13467 }, 13468 watch: { 13469 enabled(newdata,olddata){ 13470 if(newdata){ 13471 this.getAppliedPromo(); 13472 } 13473 } 13474 }, 13475 methods :{ 13476 show(){ 13477 if(this.has_promocode){ 13478 this.removePromoCode(); 13479 } else { 13480 this.$refs.childref.showModal(); 13481 } 13482 }, 13483 getAppliedPromo(){ 13484 13485 var $params; var timenow = 1; 13486 $params="cart_uuid=" + getCookie('cart_uuid'); 13487 $params+=addValidationRequest(); 13488 ajax_request[timenow] = $.ajax({ 13489 url: ajaxurl+"/getAppliedPromo", 13490 method: "POST", 13491 dataType: "json", 13492 data: $params, 13493 contentType : $content_type.form , 13494 timeout: $timeout, 13495 crossDomain: true, 13496 beforeSend: data => { 13497 if(ajax_request[timenow] != null) { 13498 ajax_request[timenow].abort(); 13499 } 13500 } 13501 }); 13502 13503 ajax_request[timenow].done( data => { 13504 if ( data.code==1){ 13505 this.data = data.details.data; 13506 this.has_promocode = true; 13507 this.saving = data.details.saving; 13508 } else { 13509 this.has_promocode = false; 13510 this.saving = ''; 13511 this.data = []; 13512 } 13513 }); // ajax done 13514 13515 ajax_request[timenow].always( data => { 13516 13517 }); 13518 13519 }, 13520 removePromoCode(){ 13521 13522 var $params = { 13523 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13524 'cart_uuid':getCookie('cart_uuid'), 13525 'promo_id': this.data.id, 13526 'promo_type': this.data.type 13527 }; 13528 13529 var timenow = 1; 13530 $params = JSON.stringify($params); 13531 13532 ajax_request[timenow] = $.ajax({ 13533 url: ajaxurl+"/removePromo", 13534 method: "PUT", 13535 dataType: "json", 13536 data: $params , 13537 contentType : $content_type.json , 13538 timeout: $timeout, 13539 crossDomain: true, 13540 beforeSend: data => { 13541 if(ajax_request[timenow] != null) { 13542 ajax_request[timenow].abort(); 13543 } 13544 } 13545 }); 13546 13547 ajax_request[timenow].done( data => { 13548 if ( data.code==1){ 13549 this.has_promocode = false; 13550 this.data = []; 13551 this.getAppliedPromo(); 13552 vue_cart.loadcart(); 13553 } 13554 }); 13555 13556 ajax_request[timenow].always( data => { 13557 13558 }); 13559 13560 }, 13561 }, 13562 }).mount('#vue-add-promocode'); 13563 13564 /** 13565 TIPS VUE RENDER 13566 this is function for displaying tips 13567 target = vue-tips 13568 */ 13569 const app_tips = Vue.createApp({ 13570 data(){ 13571 return { 13572 data : [], 13573 tips : '', 13574 manual_tip : 0, 13575 transaction_type : '', 13576 is_loading : false, 13577 enabled_tips : false, 13578 in_transaction : false 13579 }; 13580 }, 13581 mounted () { 13582 this.loadTips() 13583 }, 13584 computed: { 13585 ifOthers(){ 13586 if(this.tips=="fixed"){ 13587 return true; 13588 } 13589 return false; 13590 }, 13591 ifDelivery(){ 13592 return this.in_transaction; 13593 }, 13594 }, 13595 updated () { 13596 //dump("tips:" + this.tips); 13597 }, 13598 methods: { 13599 loadTips(){ 13600 13601 this.is_loading = true; 13602 var $params; var timenow = getTimeNow(); 13603 let currency_code = getCookie('currency_code'); 13604 currency_code = !empty(currency_code)?currency_code:''; 13605 13606 $params="cart_uuid=" + getCookie('cart_uuid'); 13607 $params+="¤cy_code=" + currency_code; 13608 $params+=addValidationRequest(); 13609 ajax_request[timenow] = $.ajax({ 13610 url: ajaxurl+"/loadTips", 13611 method: "POST", 13612 dataType: "json", 13613 data: $params, 13614 contentType : $content_type.form , 13615 timeout: $timeout, 13616 crossDomain: true, 13617 beforeSend: data => { 13618 if(ajax_request[timenow] != null) { 13619 ajax_request[timenow].abort(); 13620 } 13621 } 13622 }); 13623 13624 ajax_request[timenow].done( data => { 13625 if ( data.code==1){ 13626 this.data=data.details.data; 13627 this.tips = data.details.tips; 13628 this.transaction_type = data.details.transaction_type; 13629 this.enabled_tips = data.details.enabled_tips; 13630 this.in_transaction = data.details.in_transaction; 13631 this.setOther(); 13632 } else { 13633 this.data=[]; 13634 } 13635 }); // ajax done 13636 13637 ajax_request[timenow].always( data => { 13638 this.is_loading= false;
13639 }); 13640 13641 }, 13642 checkoutAddTips(value,is_manual){ 13643 13644 if(value=="fixed"){ 13645 return; 13646 } 13647 13648 this.tips = value; 13649 13650 var $params = { 13651 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13652 'cart_uuid':getCookie('cart_uuid'), 13653 'value': value, 13654 'is_manual' : is_manual 13655 }; 13656 13657 var timenow = 1; 13658 $params = JSON.stringify($params); 13659 13660 this.is_loading= true; 13661 13662 ajax_request[timenow] = $.ajax({ 13663 url: ajaxurl+"/checkoutAddTips", 13664 method: "PUT", 13665 dataType: "json", 13666 data: $params , 13667 contentType : $content_type.json , 13668 timeout: $timeout, 13669 crossDomain: true, 13670 beforeSend: data => { 13671 if(ajax_request[timenow] != null) { 13672 ajax_request[timenow].abort(); 13673 } 13674 } 13675 }); 13676 13677 ajax_request[timenow].done( data => { 13678 if ( data.code==1){ 13679 vue_cart.loadcart(); 13680 } else { 13681 /// 13682 } 13683 }); 13684 13685 ajax_request[timenow].always( data => { 13686 this.is_loading= false; 13687 }); 13688 13689 }, 13690 setOther(){ 13691 if(this.tips>0){ 13692 var $found = false; 13693 this.data.forEach((item,index) => { 13694 if (this.tips==item.value){ 13695 $found=true; 13696 } 13697 }); 13698 if(!$found){ 13699 this.manual_tip = this.tips; 13700 this.tips="fixed"; 13701 } 13702 } 13703 } 13704 }, 13705 }); 13706 app_tips.use(ElementPlus); 13707 const vm_tips = app_tips.mount('#vue-tips'); 13708 13709 13710 13711 /** 13712 CHECKOUT ADDRESS 13713 this is function for selecting checkout address 13714 target = vue-manage-address 13715 */ 13716 let cmaps_marker; 13717 let currentMarkers = []; 13718 const vm_manage_address = Vue.createApp({ 13719 components: { 13720 'component-address': changeAddressComponent, 13721 }, 13722 data(){ 13723 return { 13724 q: '', 13725 awaitingSearch : false, 13726 is_loading : false, 13727 transaction_type : '', 13728 data : [], 13729 error : [], 13730 show_list : true, 13731 location_data : [], 13732 new_coordinates : [], 13733 location_name : '', 13734 delivery_instructions : '', 13735 delivery_options : '', 13736 address_label : '', 13737 delivery_options_data : [], 13738 address_label_data : [], 13739 auto_load_data : false, 13740 cmaps : null, 13741 cmaps_config : [], 13742 cmaps_provider : '', 13743 cmaps_marker: undefined, 13744 cmaps_full : false, 13745 current_page : 'checkout', 13746 out_of_range: false, 13747 address_component : [], 13748 addresses : [], 13749 inline_edit : false, 13750 formatted_address : '', 13751 address1 : '' 13752 }; 13753 }, 13754 beforeMount() { 13755 13756 }, 13757 mounted () { 13758 const el = document.getElementById("autoload"); 13759 if ((typeof el !== "undefined") && ( el !== null)) { 13760 this.auto_load_data = el.value; 13761 } 13762 13763 if(this.auto_load_data==1){ 13764 autosize( document.getElementById("delivery_instructions") ); 13765 this.loadData(); 13766 } 13767 }, 13768 updated () { 13769 13770 }, 13771 computed: { 13772 ifDelivery(){ 13773 if ( this.transaction_type=="delivery"){ 13774 return true; 13775 } 13776 return false; 13777 }, 13778 hasData(){ 13779 if(this.data.length>0){ 13780 return true; 13781 } 13782 return false; 13783 }, 13784 hasLocationData(){ 13785 if ((typeof this.location_data !== "undefined") && ( this.location_data !== null)) { 13786 var count = Object.keys(this.location_data).length; 13787 if(count>0){ 13788 return true; 13789 } 13790 } 13791 return false; 13792 }, 13793 hasNewCoordinates(){ 13794 var count = Object.keys(this.new_coordinates).length; 13795 if(count>0){ 13796 return true; 13797 } 13798 return false; 13799 }, 13800 }, 13801 methods: { 13802 show(){ 13803 this.cmaps_full = false; 13804 $('#addressModal').modal('show'); 13805 this.loadMap(); 13806 }, 13807 hide(){ 13808 this.error=[]; 13809 $('#addressModal').modal('hide'); 13810 }, 13811 close(){ 13812 this.error=[]; 13813 $('#addressModal').modal('hide'); 13814 }, 13815 showNewAddress(){ 13816 this.$refs.childref.showModal(); 13817 }, 13818 hideChange(){ 13819 $('#changeAddressModal').modal('hide'); 13820 }, 13821 save(){ 13822 13823 var $params = { 13824 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 13825 'cart_uuid':getCookie('cart_uuid'), 13826 'data': this.location_data, 13827 'location_name' : this.location_name, 13828 'delivery_instructions' : this.delivery_instructions, 13829 'delivery_options' : this.delivery_options, 13830 'address_label' : this.address_label, 13831 'formatted_address' : this.formatted_address, 13832 'address1': this.address1 13833 }; 13834 13835 var timenow = 1; 13836 $params = JSON.stringify($params); 13837 13838 ajax_request[timenow] = $.ajax({ 13839 url: ajaxurl+"/checkoutSaveAddress", 13840 method: "PUT", 13841 dataType: "json", 13842 data: $params , 13843 contentType : $content_type.json , 13844 timeout: $timeout, 13845 crossDomain: true, 13846 beforeSend: data => { 13847 this.is_loading = true; 13848 if(ajax_request[timenow] != null) { 13849 ajax_request[timenow].abort(); 13850 } 13851 } 13852 }); 13853 13854 ajax_request[timenow].done( data => { 13855 if ( data.code==1){ 13856 this.hide(); 13857 this.loadData(); 13858 vue_cart.loadcart(); 13859 } else { 13860 this.error[0] = data.msg; 13861 } 13862 }); 13863 13864 ajax_request[timenow].always( data => { 13865 this.is_loading = false;
13866 }); 13867 13868 }, 13869 clearData(){ 13870 this.data = []; 13871 this.q = ''; 13872 }, 13873 showList(){ 13874 this.show_list = true; 13875 }, 13876 setLocationDetails(data){ 13877 this.location_data = data; 13878 this.formatted_address = data.address.formatted_address; 13879 this.address1 = data.address.address1; 13880 13881 if(!empty(data.attributes)){ 13882 this.location_name = data.attributes.location_name; 13883 this.delivery_instructions = data.attributes.delivery_instructions; 13884 this.delivery_options = data.attributes.delivery_options; 13885 this.address_label = data.attributes.address_label; 13886 } else { 13887 this.location_name = ''; 13888 this.delivery_instructions = ''; 13889 this.delivery_options = 'Leave it at my door'; 13890 this.address_label = 'Home'; 13891 } 13892 this.hideChange(); 13893 this.show(); 13894 }, 13895 setPlaceData(){ 13896 this.hideChange(); 13897 this.loadData(); 13898 vue_cart.loadcart(); 13899 }, 13900 loadData(){ 13901 13902 var $params=''; var timenow = getTimeNow(); 13903 $params="cart_uuid=" + getCookie('cart_uuid'); 13904 $params+=addValidationRequest(); 13905 ajax_request[timenow] = $.ajax({ 13906 url: ajaxurl+"/checkoutAddress", 13907 method: "POST", 13908 dataType: "json", 13909 data: $params, 13910 contentType : $content_type.form , 13911 timeout: $timeout, 13912 crossDomain: true, 13913 beforeSend: data => { 13914 if(ajax_request[timenow] != null) { 13915 ajax_request[timenow].abort(); 13916 } 13917 } 13918 }); 13919 13920 ajax_request[timenow].done( data => { 13921 if ( data.code==1){ 13922 this.transaction_type = data.details.transaction_type; 13923 this.location_data = data.details.data; 13924 13925 if ((typeof data.details.data.address !== "undefined") && ( data.details.data.address !== null)) { 13926 this.formatted_address = data.details.data.address.formatted_address; 13927 this.address1 = data.details.data.address.address1; 13928 } 13929 13930 if ((typeof data.details.data.address !== "undefined") && ( data.details.data.address !== null)) { 13931 this.formatted_address = data.details.data.address.formatted_address; 13932 this.street = data.details.data.address.street; 13933 this.house_number = data.details.data.address.house_number; 13934 this.postal_code = data.details.data.address.postal_code; 13935 this.city = data.details.data.address.city; 13936 this.location_name = data.details.data.attributes.location_name; 13937 this.company_name = data.details.data.attributes.company_name; 13938 this.delivery_instructions= data.details.data.attributes.delivery_instructions; 13939 13940 setStorage('street',this.street ); 13941 setStorage('house_number',this.house_number ); 13942 setStorage('postal_code',this.postal_code ); 13943 setStorage('city',this.city ); 13944 setStorage('location_name',this.location_name ); 13945 setStorage('company_name',this.company_name ); 13946 setStorage('delivery_instructions',this.delivery_instructions ); 13947 13948 if ((typeof vm_guest_delivery !== "undefined") && ( vm_guest_delivery !== null) ) { 13949 vm_guest_delivery.street = this.street; 13950 vm_guest_delivery.house_number = this.house_number; 13951 vm_guest_delivery.postal_code = this.postal_code; 13952 vm_guest_delivery.city = this.city; 13953 vm_guest_delivery.location_name = this.location_name; 13954 vm_guest_delivery.company_name = this.company_name; 13955 vm_guest_delivery.delivery_instructions = this.delivery_instructions; 13956 vm_guest_personal_details.first_name = data.details.data.client.first_name; 13957 vm_guest_personal_details.last_name = data.details.data.client.last_name; 13958 13959 } 13960 } 13961 13962 this.cmaps_config = data.details.maps_config; 13963 this.delivery_options_data = data.details.delivery_option; 13964 this.address_label_data = data.details.address_label; 13965 this.addresses = data.details.addresses; 13966 13967 var keys = Object.keys(data.details.delivery_option); 13968 keys = keys[0]; 13969 this.delivery_options = keys; 13970 13971 var keys = Object.keys(data.details.address_label); 13972 keys = keys[0];
13973 this.address_label = keys; 13974 13975 if(!empty(data.details.data.attributes)){ 13976 this.location_name = data.details.data.attributes.location_name; 13977 this.delivery_instructions = data.details.data.attributes.delivery_instructions; 13978 this.delivery_options = data.details.data.attributes.delivery_options; 13979 this.address_label = data.details.data.attributes.address_label; 13980 } 13981 13982 } else { 13983 this.transaction_type = ''; 13984 this.error[0] = data.msg; 13985 this.location_data = []; 13986 this.cmaps_config = []; 13987 this.delivery_options_data = []; 13988 this.address_label_data = []; 13989 this.addresses = []; 13990 this.formatted_address = ''; 13991 this.address1 = ''; 13992 } 13993 }); // ajax done 13994 13995 ajax_request[timenow].always( data => { 13996 13997 }); 13998 13999 }, 14000 loadMap(){ 14001 14002 this.cmaps_provider = this.cmaps_config.provider; 14003 14004 switch(this.cmaps_provider){ 14005 case "google.maps": 14006 if ((typeof this.cmaps !== "undefined") && ( this.cmaps !== null)) { 14007 this.removeMarker(); 14008 } else { 14009 this.cmaps = new google.maps.Map(document.getElementById("cmaps"), { 14010 center: { lat: parseFloat(this.location_data.latitude), lng: parseFloat(this.location_data.longitude) }, 14011 zoom: parseInt(this.cmaps_config.zoom) , 14012 disableDefaultUI: true, 14013 }); 14014 } 14015 14016 this.addMarker({ 14017 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 14018 map: this.cmaps, 14019 icon : this.cmaps_config.icon, 14020 animation: google.maps.Animation.DROP, 14021 }); 14022 break; 14023 case "mapbox": 14024 mapboxgl.accessToken = this.cmaps_config.key; 14025 this.cmaps = new mapboxgl.Map({ 14026 container: document.getElementById("cmaps"), 14027 style: 'mapbox://styles/mapbox/streets-v12', 14028 center: [ parseFloat(this.location_data.longitude) , parseFloat(this.location_data.latitude)], 14029 zoom: 14 14030 }); 14031 this.addMarker({ 14032 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 14033 map: this.cmaps, 14034 icon : this.cmaps_config.icon, 14035 animation: null 14036 }); 14037 break; 14038 14039 } 14040 }, 14041 addMarker(properties){ 14042 dump("add markerx"); 14043 dump(this.cmaps_provider); 14044 dump(properties); 14045 switch(this.cmaps_provider){ 14046 case "google.maps": 14047 cmaps_marker = new google.maps.Marker(properties); 14048 this.cmaps.panTo(new google.maps.LatLng(properties.position.lat,properties.position.lng)); 14049 break; 14050 case "mapbox": 14051 let markerProperties = {}; 14052 if(properties.draggable){ 14053 markerProperties = {draggable: true}; 14054 } 14055 cmaps_marker = new mapboxgl.Marker(markerProperties) 14056 .setLngLat([properties.position.lng, properties.position.lat]) 14057 .addTo(this.cmaps); 14058 break; 14059 } 14060 }, 14061 removeMarker(){ 14062 dump("remove marker"); 14063 switch(this.cmaps_provider){ 14064 case "google.maps": 14065 cmaps_marker.setMap(null); 14066 break; 14067 case "mapbox": 14068 cmaps_marker.remove(); 14069 //this.cmaps.clearMarkers(); 14070 break; 14071 } 14072 }, 14073 cancelPin(){ 14074 this.error = []; 14075 this.cmaps_full=false; 14076 this.removeMarker(); 14077 this.addMarker({ 14078 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 14079 map: this.cmaps, 14080 icon : this.cmaps_config.icon, 14081 animation: this.cmaps_provider=="google.maps" ? google.maps.Animation.DROP : null, 14082 }); 14083 this.mapBoxResize(); 14084 }, 14085 adjustPin(){ 14086 14087 dump("adjustPin"); 14088 this.new_coordinates = []; 14089 this.cmaps_full = true; 14090 try { 14091 this.removeMarker(); 14092 } catch(err) { 14093 dump(err); 14094 } 14095 14096 this.addMarker({ 14097 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 14098 map: this.cmaps, 14099 icon : this.cmaps_config.icon, 14100 animation: this.cmaps_provider=="google.maps" ? google.maps.Animation.DROP : null, 14101 draggable:true, 14102 }); 14103 14104 if(this.cmaps_provider=="google.maps"){ 14105 cmaps_marker.addListener('dragend', event => {
14106 this.new_coordinates = { 14107 'lat': event.latLng.lat(), 14108 'lng': event.latLng.lng(), 14109 }; 14110 }); 14111 } else if ( this.cmaps_provider=="mapbox" ) { 14112 cmaps_marker.on('dragend', (event)=>{ 14113 const lngLat = cmaps_marker.getLngLat(); 14114 this.new_coordinates = { 14115 'lat': lngLat.lat, 14116 'lng': lngLat.lng, 14117 }; 14118 }); 14119 this.mapBoxResize(); 14120 } 14121 }, 14122 mapBoxResize(){ 14123 if(this.cmaps_provider=="mapbox"){ 14124 setTimeout(()=>{ 14125 this.cmaps.resize(); 14126 }, 500); 14127 } 14128 }, 14129 setNewCoordinates(){ 14130 var $params = { 14131 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 14132 'cart_uuid':getCookie('cart_uuid'), 14133 'lat' : this.location_data.latitude, 14134 'lng' : this.location_data.longitude, 14135 'new_lat' : this.new_coordinates.lat, 14136 'new_lng' : this.new_coordinates.lng, 14137 }; 14138 14139 var timenow = 1; 14140 $params = JSON.stringify($params); 14141 14142 ajax_request[timenow] = $.ajax({ 14143 url: ajaxurl+"/checkoutValidateCoordinates", 14144 method: "PUT", 14145 dataType: "json", 14146 data: $params , 14147 contentType : $content_type.json , 14148 timeout: $timeout, 14149 crossDomain: true, 14150 beforeSend: data => { 14151 this.is_loading = true; 14152 this.error = []; 14153 if(ajax_request[timenow] != null) { 14154 ajax_request[timenow].abort(); 14155 } 14156 } 14157 }); 14158 14159 ajax_request[timenow].done( data => { 14160 if ( data.code==1){ 14161 this.location_data.latitude = this.new_coordinates.lat; 14162 this.location_data.longitude = this.new_coordinates.lng; 14163 this.cmaps_full=false; 14164 this.removeMarker(); 14165 this.addMarker({ 14166 position: { lat: parseFloat(this.location_data.latitude) , lng: parseFloat(this.location_data.longitude) }, 14167 map: this.cmaps, 14168 icon : this.cmaps_config.icon, 14169 animation: this.cmaps_provider=="google.maps" ? google.maps.Animation.DROP : null, 14170 }); 14171 this.mapBoxResize(); 14172 } else { 14173 this.error = data.msg; 14174 } 14175 }); 14176 14177 ajax_request[timenow].always( data => { 14178 this.is_loading = false; 14179 }); 14180 14181 }, 14182 }, 14183 }).mount('#vue-manage-address'); 14184 14185 14186 /* 14187 CHANGE ADDRESS POPUP 14188 this is function for selecting checkout address 14189 target = vue-change-address 14190 */ 14191 const vm_change_address = Vue.createApp({ 14192 components: { 14193 'component-change-address': changeAddressComponent, 14194 'component-address': ComponentsAddress, 14195 }, 14196 data(){ 14197 return { 14198 out_of_range : false, 14199 address_component : [], 14200 addresses : [] 14201 }; 14202 }, 14203 mounted () { 14204 //this.getAddresses(); 14205 }, 14206 methods :{ 14207 show(){ 14208 this.$refs.address.showModal(); 14209 this.getAddresses(); 14210 }, 14211 afterChangeAddress(data){ 14212 vue_cart.loadcart(); 14213 14214 if ((typeof vm_widget_nav !== "undefined") && ( vm_widget_nav !== null)) { 14215 vm_widget_nav.afterChangeAddress(); 14216 } 14217 14218 if ((typeof vm_merchant_details !== "undefined") && ( vm_merchant_details !== null)) { 14219 vm_merchant_details.$refs.ref_services.getMerchantServices(); 14220 } 14221 14222 }, 14223 afterSetAddress(){ 14224 this.$refs.address.closeModal(); 14225 vue_cart.loadcart(); 14226 }, 14227 afterDeleteAddress(){ 14228 this.getAddresses(); 14229 }, 14230 editAddress(data){ 14231 this.$refs.address.close(); 14232 this.$refs.addressform.show( data.address_uuid ); 14233 }, 14234 afterSaveAddForm(){ 14235 vue_cart.loadcart(); 14236 }, 14237 getAddresses(){ 14238 14239 var $params = { 14240 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 14241 }; 14242 var timenow = getTimeNow(); 14243 $params = JSON.stringify($params); 14244 14245 ajax_request[timenow] = $.ajax({ 14246 url: ajaxurl+"/getAddresses", 14247 method: "PUT", 14248 dataType: "json", 14249 data: $params , 14250 contentType : $content_type.json , 14251 timeout: $timeout, 14252 crossDomain: true, 14253 beforeSend: data => { 14254 if(ajax_request[timenow] != null) { 14255 ajax_request[timenow].abort(); 14256 } 14257 } 14258 }); 14259 14260 ajax_request[timenow].done( data => { 14261 if ( data.code==1){ 14262 this.addresses = data.details.data; 14263 } else { 14264 this.addresses = []; 14265 } 14266 }); 14267 14268 }, 14269 }, 14270 }).mount('#vue-change-address'); 14271 14272 14273 /* 14274 DIGITAL WALLET COMPONENTS 14275 */
14276 const componentsDigitalWallet = { 14277 props :['ajax_url','amount_to_pay' ,'enabled_digital_wallet'], 14278 data() { 14279 return { 14280 use_wallet : false, 14281 data : [], 14282 loading : false, 14283 currency_code : '', 14284 message : '' 14285 } 14286 }, 14287 created() { 14288 let currency_code = getCookie('currency_code'); 14289 this.currency_code = !empty(currency_code)?currency_code:''; 14290 this.getCartWallet(); 14291 }, 14292 computed: { 14293 canUseWallet(){ 14294 if (Object.keys(this.data).length > 0) { 14295 if(this.data.balance_raw>0){ 14296 return true; 14297 } 14298 } 14299 return false; 14300 } 14301 }, 14302 watch: { 14303 use_wallet(newval,oldval){ 14304 this.applyDigitalWallet(newval==true?1:0,null); 14305 } 14306 }, 14307 methods: { 14308 getCartWallet(){ 14309 this.loading = true; 14310 axios({ 14311 method: 'POST', 14312 url: this.ajax_url+"/getCartWallet" , 14313 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid') + "¤cy_code=" + this.currency_code, 14314 timeout: $timeout, 14315 }).then( response => { 14316 if(response.data.code==1){ 14317 this.data = response.data.details; 14318 this.use_wallet = response.data.details.use_wallet; 14319 } else { 14320 this.data = []; 14321 this.use_wallet = false; 14322 } 14323 }).catch(error => { 14324 // 14325 }).then(data => { 14326 this.loading = false; 14327 }); 14328 }, 14329 applyDigitalWallet(use_wallet,amount_to_pay){ 14330 this.loading = true; 14331 let $amount_to_pay = this.amount_to_pay; 14332 if ((typeof amount_to_pay !== "undefined") && ( amount_to_pay !== null)) { 14333 $amount_to_pay = amount_to_pay; 14334 } 14335 axios({ 14336 method: 'POST', 14337 url: this.ajax_url+"/applyDigitalWallet" , 14338 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid') + 14339 "¤cy_code=" + this.currency_code + "&use_wallet=" + use_wallet + "&amount_to_pay="+ $amount_to_pay, 14340 timeout: $timeout, 14341 }).then( response => { 14342 if(response.data.code==1){ 14343 if(use_wallet){ 14344 this.message = response.data.msg; 14345 } else { 14346 this.message = ''; 14347 } 14348 this.$emit('afterApplywallet',response.data.details); 14349 } else { 14350 this.use_wallet = false; 14351 this.message = ''; 14352 ElementPlus.ElNotification({ 14353 title: "", 14354 message: response.data.msg, 14355 position: 'bottom-right', 14356 type: 'warning', 14357 }); 14358 } 14359 }).catch(error => { 14360 // 14361 }).then(data => { 14362 this.loading = false; 14363 }); 14364 }, 14365 }, 14366 template: '#xtemplate_digital_wallet', 14367 }; 14368 /* 14369 END DIGITAL WALLET COMPONENTS 14370 */ 14371 14372 /* 14373 PAYMENT LIST 14374 target = vue-payment-list 14375 */ 14376 const app_payment_list = Vue.createApp({ 14377 data(){ 14378 return { 14379 error : [], 14380 data : [], 14381 data_saved_payment : [], 14382 saved_payment_error : [], 14383 default_payment_uuid : '', 14384 transaction_type : '', 14385 amount_to_pay : 0, 14386 cart_uuid : getCookie('cart_uuid'), 14387 saved_payment_loading : false, 14388 payment_list_loading : false, 14389 payment_change : 0, 14390 selected_payment_method: 'cod', 14391 wallet_data : [] 14392 }; 14393 }, 14394 14395 watch: { 14396 selected_payment_method(new_value,old_value){ 14397 setStorage('selected_payment_method',new_value); 14398 this.setDefaultPaymentMethod(new_value); 14399 } 14400 }, 14401 mounted () { 14402 this.PaymentList(); 14403 this.SavedPaymentList(); 14404 this.setDefaultPaymentMethod(getStorage("selected_payment_method")); 14405 }, 14406 computed: { 14407 hasData(){ 14408 if(this.data.length>0){ 14409 return true; 14410 } 14411 return false; 14412 }, 14413 hasSavedPayment(){ 14414 if(this.data_saved_payment.length>0){ 14415 return true; 14416 } 14417 return false; 14418 }, 14419 validatePaymentChange(){ 14420 let $payment_change = parseFloat(this.payment_change); 14421 if( $payment_change>0){ 14422 return true; 14423 } 14424 return false; 14425 }, 14426 validatePaymentChangeValue(){ 14427 if(vue_cart.cart_total.raw<=this.payment_change){ 14428 return true; 14429 } 14430 return false; 14431 }, 14432 isWalletFullPayment(){ 14433 if (Object.keys(this.wallet_data).length > 0) { 14434 if(this.wallet_data.use_wallet && this.wallet_data.amount_due_raw<=0){ 14435 return true; 14436 } 14437 } 14438 return false;
14439 }, 14440 usePartialPayment(){ 14441 if (Object.keys(this.wallet_data).length > 0) { 14442 if(this.wallet_data.use_wallet && this.wallet_data.amount_due_raw>0){ 14443 vue_cart.use_partial_payment = true; 14444 return true; 14445 } 14446 } 14447 vue_cart.use_partial_payment = false; 14448 return false; 14449 }, 14450 getPayRemaining(){ 14451 if (Object.keys(this.wallet_data).length > 0) { 14452 if(this.wallet_data.use_wallet){ 14453 return this.wallet_data.pay_remaining; 14454 } 14455 } 14456 return false; 14457 }, 14458 }, 14459 methods :{ 14460 NumbersOnly(evt) { 14461 evt = (evt) ? evt : window.event; 14462 var charCode = (evt.which) ? evt.which : evt.keyCode; 14463 if ((charCode > 31 && (charCode < 48 || charCode > 57)) && charCode !== 46) { 14464 evt.preventDefault();; 14465 } else { 14466 return true; 14467 } 14468 }, 14469 showPayment(payment_code){ 14470 try { 14471 this.$refs[payment_code].showPaymentForm(); 14472 } catch(err) { 14473 vm_bootbox.alert( err , {} ); 14474 } 14475 }, 14476 PaymentRender(data){ 14477 this.$refs[ data.payment_code ].PaymentRender( data ); 14478 }, 14479 AfterCancelPayment(){ 14480 vue_cart.is_submit = false; 14481 }, 14482 Alert(message){ 14483 vm_bootbox.alert( message , {} ); 14484 }, 14485 showLoadingBox(message){ 14486 if(!empty(message)){ 14487 vm_loading.$refs.box.setMessage(message); 14488 } 14489 vm_loading.$refs.box.show(); 14490 }, 14491 closeLoadingBox(){ 14492 vm_loading.$refs.box.close(); 14493 }, 14494 PaymentList(){ 14495 14496 this.payment_list_loading = true; 14497 var $params; var timenow = getTimeNow(); 14498 let currency_code = getCookie('currency_code'); 14499 currency_code = !empty(currency_code)?currency_code:''; 14500 14501 $params="cart_uuid=" + getCookie('cart_uuid'); 14502 $params+="¤cy_code="+ currency_code; 14503 $params+=addValidationRequest(); 14504 ajax_request[timenow] = $.ajax({ 14505 url: ajaxurl+"/PaymentList", 14506 method: "POST", 14507 dataType: "json", 14508 data: $params, 14509 contentType : $content_type.form , 14510 timeout: $timeout, 14511 crossDomain: true, 14512 beforeSend: data => { 14513 if(ajax_request[timenow] != null) { 14514 ajax_request[timenow].abort(); 14515 } 14516 } 14517 }); 14518 14519 ajax_request[timenow].done( data => { 14520 if ( data.code==1){ 14521 this.data = data.details.data; 14522 } else { 14523 this.error[0] = data.msg; 14524 } 14525 }); // ajax done 14526 14527 ajax_request[timenow].always( data => { 14528 this.payment_list_loading = false; 14529 }); 14530 }, 14531 SavedPaymentList(){ 14532 14533 this.saved_payment_loading = true; 14534 var $params; var timenow = getTimeNow(); 14535 let currency_code = getCookie('currency_code'); 14536 currency_code = !empty(currency_code)?currency_code:''; 14537 $params="cart_uuid=" + getCookie('cart_uuid') ; 14538 $params+="¤cy_code="+ currency_code; 14539 $params+=addValidationRequest(); 14540 ajax_request[timenow] = $.ajax({ 14541 url: ajaxurl+"/SavedPaymentList", 14542 method: "POST", 14543 dataType: "json", 14544 data: $params, 14545 contentType : $content_type.form , 14546 timeout: $timeout, 14547 crossDomain: true, 14548 beforeSend: data => { 14549 if(ajax_request[timenow] != null) { 14550 ajax_request[timenow].abort(); 14551 } 14552 } 14553 }); 14554 14555 ajax_request[timenow].done( data => { 14556 if ( data.code==1){ 14557 this.data_saved_payment = data.details.data; 14558 this.default_payment_uuid = data.details.default_payment_uuid; 14559 vue_cart.selected_payment_uuid = this.default_payment_uuid; 14560 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 14561 // THIS IS FOR CARD FEE 14562 //vue_cart.loadcart(); 14563 } 14564 } else { 14565 this.error[0] = data.msg; 14566 this.data_saved_payment = []; 14567 this.default_payment_uuid = ''; 14568 vue_cart.selected_payment_uuid = ''; 14569 } 14570 }); // ajax done 14571 14572 ajax_request[timenow].always( data => { 14573 this.saved_payment_loading = false; 14574 updateStickyCart(); 14575 }); 14576 }, 14577 deleteSavedPaymentMethod(payment_uuid,payment_code){ 14578 var $params = { 14579 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 14580 'payment_uuid' : payment_uuid, 14581 'payment_code' : payment_code 14582 }; 14583 14584 var timenow = 1; 14585 $params = JSON.stringify($params); 14586 14587 ajax_request[timenow] = $.ajax({ 14588 url: ajaxurl+"/deleteSavedPaymentMethod", 14589 method: "PUT", 14590 dataType: "json", 14591 data: $params , 14592 contentType : $content_type.json , 14593 timeout: $timeout, 14594 crossDomain: true, 14595 beforeSend: function( xhr ) { 14596 if(ajax_request[timenow] != null) { 14597 ajax_request[timenow].abort(); 14598 } 14599 } 14600 }); 14601 14602 ajax_request[timenow].done( data => { 14603 if ( data.code==1){ 14604 this.SavedPaymentList(); 14605 } else { 14606 this.saved_payment_error[0] = data.msg; 14607 } 14608 }); 14609 14610 }, 14611 setDefaultPayment(payment_uuid){ 14612 14613 var $params = { 14614 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 14615 'payment_uuid' : payment_uuid 14616 }; 14617 14618 var timenow = 1; 14619 $params = JSON.stringify($params); 14620 14621 ajax_request[timenow] = $.ajax({ 14622 url: ajaxurl+"/setDefaultPayment", 14623 method: "PUT", 14624 dataType: "json", 14625 data: $params , 14626 contentType : $content_type.json , 14627 timeout: $timeout, 14628 crossDomain: true, 14629 beforeSend: function( xhr ) { 14630 if(ajax_request[timenow] != null) { 14631 ajax_request[timenow].abort(); 14632 } 14633 } 14634 }); 14635 14636 ajax_request[timenow].done( data => { 14637 if ( data.code==1){ 14638 this.SavedPaymentList();
14639 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 14640 // THIS IS FOR CARD FEE 14641 //vue_cart.loadcart(); 14642 } 14643 } else { 14644 this.saved_payment_error[0] = data.msg; 14645 } 14646 }); 14647 14648 }, 14649 setDefaultPaymentMethod(payment_code){ 14650 payment_code = empty(payment_code)? 'cod' : payment_code; 14651 setStorage('selected_payment_method',payment_code); 14652 this.selected_payment_method = payment_code; 14653 }, 14654 afterApplywallet(data){ 14655 this.wallet_data = data; 14656 if (Object.keys(this.wallet_data).length > 0) { 14657 vue_cart.use_digital_wallet = data.use_wallet; 14658 } 14659 }, 14660 refreshWallet(data){ 14661 if ((typeof this.$refs.digital_wallet !== "undefined") && ( this.$refs.digital_wallet !== null)) { 14662 if(data.use_digital_wallet){ 14663 let usewallet = data.use_digital_wallet?1:0; 14664 this.$refs.digital_wallet.applyDigitalWallet(usewallet,data.cart_total); 14665 } 14666 } 14667 }, 14668 }, 14669 }); 14670 14671 if ((typeof components_bundle !== "undefined") && ( components_bundle !== null)) { 14672 $.each(components_bundle,function(components_name, components_value) { 14673 app_payment_list.component(components_name, components_value ); 14674 }); 14675 } 14676 14677 app_payment_list.component('components-digital-wallet',componentsDigitalWallet); 14678 14679 app_payment_list.use(Maska); 14680 app_payment_list.use(ElementPlus); 14681 const vm_payment_lists = app_payment_list.mount('#vue-payment-list'); 14682 14683 /*END PAYMENT LIST*/ 14684 14685 14686 /* 14687 COMPONENTS ORER TRACKING 14688 */ 14689 14690 const ComponentsOrderTracking = { 14691 props: ['ajax_url' ,'realtime'], 14692 data(){ 14693 return { 14694 ably : undefined, 14695 channel : undefined, 14696 piesocket : undefined, 14697 pusher : undefined, 14698 }; 14699 }, 14700 mounted() { 14701 if(this.realtime.enabled){ 14702 this.initRealTime(); 14703 } 14704 }, 14705 methods:{ 14706 initRealTime(){ 14707 14708 if(this.realtime.provider == "pusher"){ 14709 14710 Pusher.logToConsole = false; 14711 this.pusher = new Pusher( this.realtime.key , { 14712 cluster: this.realtime.cluster 14713 }); 14714 14715 this.channel = this.pusher.subscribe( this.realtime.channel ); 14716 this.channel.bind( this.realtime.event , (data)=> { 14717 dump("receive tracking"); 14718 dump(data); 14719 this.$emit('afterReceive', data ); 14720 }); 14721 14722 } else if ( this.realtime.provider =="ably" ){ 14723 14724 this.ably = new Ably.Realtime(this.realtime.ably_apikey); 14725 this.ably.connection.on('connected', () => { 14726 14727 this.channel = this.ably.channels.get( this.realtime.channel ); 14728 14729 this.channel.subscribe( this.realtime.event , (data) => { 14730 dump("receive ably"); 14731 dump(data); 14732 this.$emit('afterReceive', data ); 14733 }); 14734 14735 }); 14736 14737 } else if ( this.realtime.provider =="piesocket" ){ 14738 14739 this.piesocket = new PieSocket({ 14740 clusterId: this.realtime.piesocket_clusterid , 14741 apiKey: this.realtime.piesocket_api_key 14742 }); 14743 this.channel = this.piesocket.subscribe(this.realtime.channel); 14744 14745 this.channel.listen( this.realtime.event , (data)=> { 14746 dump("receive piesocket"); 14747 dump(data); 14748 this.$emit('afterReceive', data ); 14749 }); 14750 14751 } 14752 14753 } // end real time 14754 }, 14755 }; 14756 14757 14758 /* 14759 ORDERS 14760 target = vue-orders-track 14761 */ 14762 let track_marker = []; 14763 let track_bounds; 14764 const vm_orders_track = Vue.createApp({ 14765 components: { 14766 'component-order-tracking' : ComponentsOrderTracking, 14767 'components-review' : ComponentsReview, 14768 }, 14769 data(){ 14770 return { 14771 order_uuid : php_order_uuid, 14772 merchant_info : [], 14773 items : [], 14774 meta : [], 14775 error : [], 14776 maps_config : [], 14777 maps_provider : '', 14778 cmaps : null, 14779 items_count : 0, 14780 order_progress : -1, 14781 order_status : '', 14782 order_status_details : '', 14783 order_info : [], 14784 instructions : [], 14785 points_label : '', 14786 enabled_review : true 14787 }; 14788 }, 14789 mounted () { 14790 this.getOrder(); 14791 }, 14792 computed: { 14793 isActive(){ 14794 return { 14795 'active': true 14796 } 14797 }, 14798 hasInstructions(){ 14799 if(this.instructions){ 14800 if(!empty(this.instructions.text)){ 14801 if(this.order_progress>=3){ 14802 return true; 14803 } 14804 } 14805 } 14806 return false;
14807 } 14808 }, 14809 methods :{ 14810 updateImage(){ 14811 updateLazyImage(); 14812 }, 14813 getOrder(){ 14814 var $params; var timenow = getTimeNow(); 14815 $params="order_uuid=" + this.order_uuid; 14816 $params+=addValidationRequest(); 14817 ajax_request[timenow] = $.ajax({ 14818 url: ajaxurl+"/getOrder", 14819 method: "POST", 14820 dataType: "json", 14821 data: $params, 14822 contentType : $content_type.form , 14823 timeout: $timeout, 14824 crossDomain: true, 14825 beforeSend: function( xhr ) { 14826 if(ajax_request[timenow] != null) { 14827 ajax_request[timenow].abort(); 14828 } 14829 } 14830 }); 14831 14832 ajax_request[timenow].done( data => { 14833 if(data.code==1){ 14834 this.merchant_info = data.details.merchant_info; 14835 this.order_info = data.details.order_info; 14836 this.items = data.details.items; 14837 this.meta = data.details.meta; 14838 this.updateImage(); 14839 this.maps_config = data.details.maps_config; 14840 this.items_count = data.details.items_count; 14841 14842 this.order_progress = data.details.progress.order_progress; 14843 this.order_status = data.details.progress.order_status; 14844 this.order_status_details = data.details.progress.order_status_details; 14845 14846 this.instructions = data.details.instructions; 14847 this.points_label = data.details.points_label; 14848 14849 this.enabled_review = data.details.enabled_review; 14850 14851 } else { 14852 this.error = data.msg; 14853 this.items_count = 0; 14854 this.order_info = []; 14855 this.points_label = ''; 14856 } 14857 14858 if ((typeof this.maps_config.provider !== "undefined") && ( this.maps_config.provider !== null)) { 14859 this.loadTrackMap(); 14860 } 14861 14862 }); // ajax done 14863 14864 ajax_request[timenow].always( data => { 14865 14866 }); 14867 }, 14868 afterProgress(data){ 14869 //dump(data.order_id +"=>" + this.order_info.order_id); 14870 if(data.order_id!=this.order_info.order_id){ 14871 return; 14872 } 14873 if(data.order_progress==0){ 14874 this.order_progress = data.order_progress; 14875 this.order_status = data.order_status; 14876 this.order_status_details = data.order_status_details; 14877 } else if( data.order_progress==-1){ 14878 // do nothing 14879 } else { 14880 this.order_progress = data.order_progress; 14881 this.order_status = data.order_status; 14882 this.order_status_details = data.order_status_details; 14883 } 14884 }, 14885 writeReview(order_uuid){ 14886 dump('writeReview=>' + order_uuid); 14887 this.$refs.ReviewRef.order_uuid = order_uuid; 14888 this.$refs.ReviewRef.show(); 14889 }, 14890 loadTrackMap(){ 14891 14892 this.maps_provider = this.maps_config.provider; 14893 14894 switch(this.maps_provider){ 14895 case "google.maps": 14896 track_bounds = new google.maps.LatLngBounds(); 14897 this.cmaps = new google.maps.Map(document.getElementById("cmaps"), { 14898 center: { lat: parseFloat(this.merchant_info.latitude), lng: parseFloat(this.merchant_info.longitude) }, 14899 zoom: this.maps_config.zoom , 14900 disableDefaultUI: true, 14901 }); 14902 14903 if(!empty(this.merchant_info.latitude)){ 14904 this.addMarker({ 14905 position: { lat: parseFloat(this.merchant_info.latitude) , lng: parseFloat(this.merchant_info.longitude) }, 14906 map: this.cmaps, 14907 icon : this.maps_config.icon_merchant, 14908 animation: google.maps.Animation.DROP, 14909 },1); 14910 } 14911 14912 if(!empty(this.meta.latitude)){ 14913 this.addMarker({ 14914 position: { lat: parseFloat(this.meta.latitude) , lng: parseFloat(this.meta.longitude) }, 14915 map: this.cmaps, 14916 icon : this.maps_config.icon_destination, 14917 animation: google.maps.Animation.DROP, 14918 },2); 14919 } 14920 14921 this.FitBounds(); 14922 14923 break; 14924 14925 case "mapbox": 14926 track_bounds = new mapboxgl.LngLatBounds(); 14927 14928 mapboxgl.accessToken = this.maps_config.key; 14929 this.cmaps = new mapboxgl.Map({ 14930 container: this.$refs.cmaps , 14931 style: 'mapbox://styles/mapbox/streets-v12', 14932 center: [ parseFloat(this.maps_config.default_lng) , parseFloat(this.maps_config.default_lat)], 14933 zoom: 14 14934 }); 14935 14936 this.cmaps.on('error', (response) => { 14937 //alert(response.error.message) 14938 }); 14939 14940 this.mapBoxResize(); 14941 14942 if(!empty(this.merchant_info.latitude)){ 14943 this.addMarker({ 14944 position: { lat: parseFloat(this.merchant_info.latitude) , lng: parseFloat(this.merchant_info.longitude) }, 14945 map: this.cmaps, 14946 icon : 'marker_icon_merchant', 14947 animation: null, 14948 },1); 14949 } 14950 14951 if(!empty(this.meta.latitude)){ 14952 this.addMarker({ 14953 position: { lat: parseFloat(this.meta.latitude) , lng: parseFloat(this.meta.longitude) }, 14954 map: this.cmaps, 14955 icon : 'marker_icon_destination', 14956 animation: null, 14957 },2); 14958 } 14959 this.FitBounds(); 14960 break; 14961 14962 case "yandex": 14963 this.initYandexTrackMap(); 14964 break; 14965 } 14966 }, 14967 async initYandexTrackMap(){ 14968 console.debug("initYandexTrackMap"); 14969 await ymaps3.ready; 14970 const {YMap, YMapDefaultSchemeLayer,YMapMarker,YMapDefaultFeaturesLayer } = ymaps3; 14971 14972 const LOCATION = { 14973 center: [ parseFloat(this.maps_config.default_lng), parseFloat(this.maps_config.default_lat) ], 14974 zoom: yandex_zoom 14975 }; 14976 14977 if(yandex_map){ 14978 yandex_map.destroy(); 14979 yandex_map = null; 14980 } 14981 14982 if (!yandex_map) { 14983 yandex_map = new YMap( 14984 this.$refs.cmaps, 14985 { 14986 location: LOCATION, 14987 showScaleInCopyrights: false, 14988 behaviors: ['drag','scrollZoom'] 14989 }, 14990 [ 14991 new YMapDefaultSchemeLayer({}), 14992 new YMapDefaultFeaturesLayer({}) 14993 ] 14994 ); 14995 14996 let yandex_bounds = []; 14997 14998 if(!empty(this.merchant_info.latitude)){ 14999 let location1 = [ 15000 parseFloat(this.merchant_info.longitude), parseFloat(this.merchant_info.latitude) 15001 ]; 15002 yandex_bounds.push(location1); 15003 const markerElement = document.createElement('img'); 15004 markerElement.className = 'icon-marker'; 15005 markerElement.src = this.maps_config.icon_merchant; 15006 yandex_map.addChild(new YMapMarker({coordinates: location1 }, markerElement)); 15007 } 15008 15009 if(!empty(this.meta.latitude)){ 15010 let location2 = [ 15011 parseFloat(this.meta.longitude), parseFloat(this.meta.latitude) 15012 ]; 15013 yandex_bounds.push(location2); 15014 const markerElement = document.createElement('img'); 15015 markerElement.className = 'icon-marker'; 15016 markerElement.src = this.maps_config.icon_destination; 15017 yandex_map.addChild(new YMapMarker({coordinates: location2 }, markerElement)); 15018 } 15019 15020 const NEWLOCATION = { 15021 center : yandex_bounds[0], 15022 zoom: yandex_zoom 15023 }; 15024 yandex_map.update({ 15025 location : NEWLOCATION 15026 }); 15027 15028 } 15029 }, 15030 mapBoxResize(){ 15031 if(this.maps_config.provider=="mapbox"){ 15032 setTimeout(()=>{ 15033 this.cmaps.resize(); 15034 }, 500); 15035 } 15036 }, 15037 addMarker(properties,index){ 15038 switch(this.maps_provider){ 15039 case "google.maps": 15040 track_marker[index] = new google.maps.Marker(properties); 15041 //this.cmaps.panTo(new google.maps.LatLng(properties.position.lat,properties.position.lng)); 15042 track_bounds.extend(track_marker[index].position); 15043 break; 15044 case "mapbox": 15045 const el = document.createElement('div'); 15046 el.className = properties.icon; 15047 track_marker[index] = new mapboxgl.Marker(el) 15048 .setLngLat([properties.position.lng, properties.position.lat]) 15049 .addTo(this.cmaps); 15050 track_bounds.extend(new mapboxgl.LngLat(properties.position.lng, properties.position.lat)); 15051 break; 15052 } 15053 }, 15054 FitBounds(){ 15055 switch(this.maps_provider){ 15056 case "google.maps": 15057 this.cmaps.fitBounds(track_bounds); 15058 break; 15059 case "mapbox": 15060 this.cmaps.fitBounds(track_bounds); 15061 break; 15062 } 15063 }, 15064 }, 15065 }).mount('#vue-orders-track'); 15066 15067 15068 /* 15069 COMPONENTS CART PREVIEW 15070 */ 15071 const ComponentCartPreview = { 15072 props: ['payload','label','cart_preview','drawer','transaction_list'], 15073 data(){ 15074 return { 15075 cart_loading : true, 15076 cart_uuid : '', 15077 cart_items : [], 15078 category_not_available : [], 15079 item_not_available : [], 15080 cart_summary : [], 15081 cart_merchant : [], 15082 cart_total : [], 15083 error : [], 15084 go_checkout : [], 15085 subtotal : [], 15086 items_count : 0, 15087 transaction_type : getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery', 15088 update_cart_loading : false, 15089 suggestedItems: [ 15090 { id: 101, name: 'Green Tea', image: '/img/tea.jpg' }, 15091 { id: 102, name: 'Cookies', image: '/img/cookies.jpg' }, 15092 { id: 103, name: 'Soda', image: '/img/soda.jpg' } 15093 ] 15094 }; 15095 }, 15096 computed: { 15097 hasError(){ 15098 if(this.error.length>0){ 15099 return true; 15100 } 15101 return false;
15102 } 15103 }, 15104 methods:{ 15105 getCartPreview(){ 15106 dump("cart_preview=>"+this.cart_preview); 15107 if(!this.cart_preview){ 15108 this.getCartCount(); 15109 return ; 15110 } 15111 15112 var timenow = getTimeNow(); 15113 let currency_code = getCookie('currency_code'); 15114 currency_code = !empty(currency_code)?currency_code:''; 15115 15116 var $params = { 15117 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 15118 'cart_uuid':getCookie('cart_uuid'), 15119 'currency_code': currency_code, 15120 'payload': this.payload, 15121 'lang': document.documentElement.lang 15122 }; 15123 ajax_request[timenow] = $.ajax({ 15124 url: ajaxurl+"/getCart", 15125 method: "PUT", 15126 dataType: "json", 15127 data: JSON.stringify($params), 15128 contentType : $content_type.json , 15129 timeout: $timeout, 15130 crossDomain: true, 15131 beforeSend: data => { 15132 if(ajax_request[timenow] != null) { 15133 ajax_request[timenow].abort(); 15134 } 15135 } 15136 }); 15137 15138 ajax_request[timenow].done( data => { 15139 this.cart_loading = false; 15140 if (data.code==1){ 15141 this.cart_merchant = data.details.data.merchant; 15142 this.cart_uuid = data.details.cart_uuid; 15143 this.cart_items = data.details.data.items; 15144 this.category_not_available = data.details.data.category_not_available; 15145 this.item_not_available = data.details.data.item_not_available; 15146 this.cart_summary = data.details.data.summary; 15147 this.cart_total = data.details.data.total; 15148 this.error = data.details.error; 15149 this.go_checkout = data.details.go_checkout; 15150 this.subtotal = data.details.data.subtotal; 15151 this.items_count = data.details.items_count; 15152 this.transaction_type = data.details.checkout_data.transaction_type; 15153 } else { 15154 this.cart_items = []; 15155 this.category_not_available = []; 15156 this.item_not_available = []; 15157 this.cart_summary = []; 15158 this.cart_total = []; 15159 this.error = []; 15160 this.subtotal = 0; 15161 this.items_count = 0; 15162 } 15163 15164 this.updateImage(); 15165 this.$emit('setCartcount',this.items_count); 15166 15167 if ((typeof vm !== "undefined") && ( vm !== null)) { 15168 vm.hasItemInCart(this.items_count , this.subtotal.value, this.cart_merchant); 15169 } 15170 15171 }); // ajax done 15172 15173 }, 15174 getCartCount(){ 15175 var timenow = getTimeNow(); 15176 let currency_code = getCookie('currency_code'); 15177 currency_code = !empty(currency_code)?currency_code:''; 15178 var $params = { 15179 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 15180 'cart_uuid':getCookie('cart_uuid'), 15181 'currency_code': currency_code, 15182 'payload': ['items_count'], 15183 'lang': document.documentElement.lang 15184 }; 15185 15186 ajax_request[timenow] = $.ajax({ 15187 url: ajaxurl+"/getCart", 15188 method: "PUT", 15189 dataType: "json", 15190 data: JSON.stringify($params), 15191 contentType : $content_type.json , 15192 timeout: $timeout, 15193 crossDomain: true, 15194 beforeSend: data => { 15195 if(ajax_request[timenow] != null) { 15196 ajax_request[timenow].abort(); 15197 } 15198 } 15199 }); 15200 15201 ajax_request[timenow].done( data => { 15202 if (data.code==1){ 15203 this.items_count = data.details.items_count; 15204 } else this.items_count = 0; 15205 15206 this.$emit('setCartcount',this.items_count); 15207 15208 }); // ajax done 15209 15210 }, 15211 updateCartQty(addOrSubract,item_qty,cart_row,cart_uuid){ 15212 if(addOrSubract==1){ 15213 item_qty++; 15214 } else item_qty--; 15215 15216 if(item_qty<=0){ 15217 this.remove(cart_row,cart_uuid); 15218 } else { 15219 this.updateCartItems( item_qty,cart_row,cart_uuid ); 15220 } 15221 },// 15222 updateCartItems(item_qty,cart_row,cart_uuid){ 15223 var $params; var timenow = 1; 15224 $params="cart_uuid=" + cart_uuid; 15225 $params+="&cart_row=" + cart_row; 15226 $params+="&item_qty=" + item_qty; 15227 15228 this.update_cart_loading = true; 15229 15230 $params+=addValidationRequest(); 15231 ajax_request[timenow] = $.ajax({ 15232 url: ajaxurl+"/updateCartItems", 15233 method: "POST", 15234 dataType: "json", 15235 data: $params, 15236 contentType : $content_type.form , 15237 timeout: $timeout, 15238 crossDomain: true, 15239 beforeSend: function( xhr ) { 15240 if(ajax_request[timenow] != null) { 15241 ajax_request[timenow].abort(); 15242 } 15243 } 15244 }); 15245 15246 ajax_request[timenow].done( data => { 15247 dump("done"); 15248 if (data.code==1){ 15249 this.getCartPreview(); 15250 } 15251 }); // ajax done 15252 15253 ajax_request[timenow].always( data => { 15254 this.update_cart_loading = false;
15255 }); 15256 15257 }, // 15258 remove(cart_row,cart_uuid){ 15259 var $params; var timenow = 1; 15260 $params="row=" + cart_row +"&cart_uuid="+cart_uuid; 15261 $params+=addValidationRequest(); 15262 ajax_request[timenow] = $.ajax({ 15263 url: ajaxurl+"/removeCartItem", 15264 method: "POST", 15265 dataType: "json", 15266 data: $params, 15267 contentType : 'application/x-www-form-urlencoded; charset=UTF-8' , 15268 timeout: $timeout, 15269 crossDomain: true, 15270 beforeSend: function( xhr ) { 15271 if(ajax_request[timenow] != null) { 15272 ajax_request[timenow].abort(); 15273 } 15274 } 15275 }); 15276 15277 ajax_request[timenow].done( data => { 15278 dump(data); 15279 if (data.code==1){ 15280 this.getCartPreview(); 15281 } 15282 }); // ajax done 15283 15284 },// 15285 clear(cart_uuid){ 15286 var $params; var timenow = 1; 15287 $params="cart_uuid=" + cart_uuid; 15288 $params+=addValidationRequest(); 15289 ajax_request[timenow] = $.ajax({ 15290 url: ajaxurl+"/clearCart", 15291 method: "POST", 15292 dataType: "json", 15293 data: $params, 15294 contentType : $content_type.form , 15295 timeout: $timeout, 15296 crossDomain: true, 15297 beforeSend: function( xhr ) { 15298 if(ajax_request[timenow] != null) { 15299 ajax_request[timenow].abort(); 15300 } 15301 } 15302 }); 15303 15304 ajax_request[timenow].done( data => { 15305 if (data.code==1){ 15306 this.getCartPreview(); 15307 } 15308 }); // ajax done 15309 15310 }, // 15311 updateImage(){ 15312 updateLazyImage(); 15313 }, 15314 beforeClose(done){ 15315 this.$emit('afterDrawerclose',false); 15316 done(); 15317 }, 15318 updateService(transaction,cart_uuid){ 15319 axios({ 15320 method: 'POST', 15321 url: ajaxurl+"/updateService" , 15322 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&transaction_type="+transaction + "&cart_uuid=" + cart_uuid, 15323 timeout: $timeout, 15324 }).then( response => { 15325 if(response.data.code==1){ 15326 setCookie('cart_transaction_type', transaction ,30); 15327 setCookie('cart_uuid', response.data.details.cart_uuid ,30); 15328 this.getCartPreview(); 15329 } 15330 }).catch(error => { 15331 // 15332 }).then(data => { 15333 this.$emit('afterUpdate',transaction); 15334 }); 15335 }, 15336 capitalizeFirst(text) { 15337 if (!text) return ''; 15338 return text.charAt(0).toUpperCase() + text.slice(1); 15339 } 15340 }, 15341 template: ` 15342 15343 <el-drawer 15344 v-model="drawer" 15345 direction="rtl" 15346 size="380px" 15347 append-to-body="true" 15348 :with-header="true" 15349 :before-close="beforeClose" 15350 custom-class="drawer-preview-cart" 15351 > 15352 15353 <template v-if="cart_loading==false"> 15354 <template v-if="cart_items.length>0"> 15355 <div class="mb-2"> 15356 <h3 class="text-center font-weight-bold mb-3 text-black">{{label.your_cart}}</h3> 15357 </div> 15358 15359 <div class="d-flex justify-content-between align-items-center mb-1"> 15360 <div class="btn-group-rounded btn-group btn-group-toggle flex-grow-1 flex-wrap" > 15361 <label v-for="trans in transaction_list" class="btn d-flex justify-content-center" :class="{ active: transaction_type == trans.name }" > 15362 <div class="align-self-center"> 15363 <div class="bold font-16" @click="updateService(trans.name,cart_uuid)"><i class="zmdi zmdi-hc-lg" :class="trans.icon"></i> {{ capitalizeFirst(trans.service_name) }}</div> 15364 </div> 15365 </label> 15366 </div> 15367 </div> 15368 15369 <!--<div class="chevron-cart-section items d-flex justify-content-between" v-if="transaction_type == 'pickup'"> 15370 <div class="flex-fill pl-2"> 15371 <h5 class="m-0 chevron d-inline position-relative">{{label.pickup_at}}</h5> 15372 <a href="https://maps.app.goo.gl/jawizsXnJqgWDvhu7" target="_blank" class="m-0 p-0"> 15373 <p class="m-0">{{cart_merchant.merchant_address}}</p> 15374 </a> 15375 </div> 15376 <div ref_key="container" class="el-image" style="width: 80px; height: 60px;"> 15377 <a href="https://maps.app.goo.gl/jawizsXnJqgWDvhu7" target="_blank"> 15378 <img src="../upload/all/map.png" class="el-image__inner" style="width:80px;object-fit: cover;"> 15379 </a> 15380 </div>
15381 </div>--> 15382 15383 <div class="d-flex justify-content-between align-items-center mb-1"> 15384 <div><h6 class="m-0">{{label.summary}}</h6></div> 15385 <div> 15386 <a href="javascript:;" @click="clear(cart_uuid)" class="javascript:;"> 15387 <p class="m-0"><u><i class="zmdi zmdi-delete zmdi-hc-2x"></i></u></p> 15388 </a> 15389 </div> 15390 </div> 15391 </template> 15392 15393 <template v-else> 15394 <h3 class="text-center font-weight-bold mb-3 text-black">{{label.cart}}</h3> 15395 <div class="cart-empty text-center" > 15396 <div class="mt-5"> 15397 <div class="no-results m-auto"></div> 15398 <h6 class="m-0 mt-3">{{label.no_order}}</h6> 15399 <p class="mt-3">{{label.lets_change_that}}</p> 15400 </div> 15401 </div> 15402 </template> 15403 </template> 15404 15405 <!--section-cart--> 15406 <DIV class="section-cart" style="height:70%;overflow: auto;overflow-x: hidden;scrollbar-width: thin;"> 15407 <div v-cloak class="items" v-for="(items, index) in cart_items"> 15408 <div class="line-items row mb-1" :class="{'inset-shadow-down blink_me': category_not_available && category_not_available.includes(items.cat_id) || item_not_available && item_not_available.includes(items.item_id),}"> 15409 <div class="col pl-3 p-0 d-flex justify-content-start flex-column"> 15410 <p class="mb-1 bold"> 15411 {{items.item_code ? items.item_code + '.' : '' }} {{ items.item_name }} 15412 <template v-if=" items.price.size_name!='' "> 15413 ({{items.price.size_name}}) 15414 </template> 15415 </p> 15416 15417 <template v-if="items.price.discount>0"> 15418 <p class="m-0 font14"><del>{{items.price.pretty_price}}</del> {{items.price.pretty_price_after_discount}}</p> 15419 </template> 15420 <template v-else> 15421 <p class="m-0 font14">{{items.price.pretty_price}}</p> 15422 </template> 15423 15424 <!--quantity--> 15425 <div class="quantity d-flex justify-content-between"> 15426 <div> 15427 <a href="javascript:;" @click="updateCartQty(0,items.qty,items.cart_row,cart_uuid)" class="rounded-pill qty-btn" data-id="less"> 15428 <i class="zmdi zmdi-minus"></i> 15429 </a> 15430 </div> 15431 <div class="qty">{{ items.qty }}</div> 15432 <div> 15433 <a href="javascript:;" @click="updateCartQty(1,items.qty,items.cart_row,cart_uuid)" class="rounded-pill qty-btn" data-id="plus"> 15434 <i class="zmdi zmdi-plus"></i> 15435 </a> 15436 </div> 15437 </div> 15438 <!--quantity--> 15439 15440 <p class="mb-0" v-if=" items.special_instructions!='' ">{{ items.special_instructions }}</p> 15441 15442 <template v-if=" items.attributes!='' "> 15443 <template v-for="(attributes, attributes_key) in items.attributes"> 15444 <p class="mb-0"> 15445 <template v-for="(attributes_data, attributes_index) in attributes"> 15446 {{attributes_data}}<template v-if=" attributes_index<(attributes.length-1) ">, </template> 15447 </template> 15448 </p> 15449 </template> 15450 </template> 15451 </div> <!--col--> 15452 15453 <div class="col-3 quantity d-flex justify-content-start flex-column text-right"> 15454 <a href="javascript:;" @click="remove(items.cart_row,cart_uuid)" class="rounded-pill ml-auto mb-1"><i class="zmdi zmdi-close"></i></a> 15455 <template v-if="items.price.discount<=0 "> 15456 <p class="mb-0 bold">{{ items.price.pretty_total }}</p> 15457 </template> 15458 <template v-else> 15459 <p class="mb-0">{{ items.price.pretty_total_after_discount }}</p> 15460 </template> 15461 </div> <!--col--> 15462 </div><!-- line-items--> 15463 15464 <!--addon-items--> 15465 <div class="addon-items row mb-1" v-for="(addons, index_addon) in items.addons" > 15466 <div class="col pl-5 d-flex justify-content-start flex-column"> 15467 <p class="m-0 bold">{{ addons.subcategory_name }}</p> 15468 15469 <template v-cloak v-for="addon_items in addons.addon_items"> 15470 <div class="d-flex justify-content-between mb-1"> 15471 <div class="flexrow"><p class="m-0">{{addon_items.qty}} x {{addon_items.pretty_price}} {{addon_items.sub_item_name}}</p></div> 15472 <div class="flexrow"><p class="m-0">{{addon_items.pretty_addons_total}}</p></div> 15473 </div> <!--flex--> 15474 </template> 15475 </div> <!--col--> 15476 </div> 15477 <!-- addon-items--> 15478 </div><!--items--> 15479
15480 <!--<div class="suggestion-slider mb-3 px-3"> 15481 <h6 class="mb-2">You might also like</h6> 15482 <div class="slider-wrapper d-flex overflow-auto"> 15483 <div v-for="item in suggestedItems" :key="item.id" class="suggestion-card mr-2"> 15484 <img :src="item.image" alt="item.name" class="img-fluid rounded mb-1" /> 15485 <div class="item-name">{{ item.name }}</div> 15486 <el-button 15487 type="primary" 15488 size="mini" 15489 @click="addToCart(item)" 15490 class="w-100" 15491 >Add</el-button> 15492 </div> 15493 </div> 15494 </div>--> 15495 15496 </DIV> 15497 15498 <template v-if="cart_items.length>0"> 15499 <div class="drawer-footer p-2 border-top"> 15500 <div class="divider"></div> 15501 <a class="btn btn-green w-100 pointer position-relative" :disabled="hasError" 15502 :href="hasError?'javascript:;':go_checkout.link" 15503 :class="{ loading: update_cart_loading }" 15504 > 15505 <div class="d-flex justify-content-between"> 15506 <div>{{label.go_checkout}}</div> 15507 <div v-if="!update_cart_loading">{{subtotal.value}}</div> 15508 <div class="m-auto circle-loader" data-loader="circle-side"></div> 15509 </div> 15510 </a> 15511 </div> 15512 </template> 15513 15514 <div v-cloak class="alert alert-warning m-0 mt-2" v-if="error.length>0"> 15515 <p class="m-0" v-for="error_msg in error"> 15516 {{ error_msg }} 15517 </p> 15518 </div> 15519 </el-drawer> 15520 ` 15521 }; 15522 15523 /* 15524 COMPONENTS ComponentsWebPush 15525 */ 15526 15527 const ComponentsWebPush = { 15528 props: ['ajax_url' , 'message'], 15529 data(){ 15530 return { 15531 settings : [], 15532 beams : undefined, 15533 }; 15534 }, 15535 mounted() { 15536 this.getWebpushSettings(); 15537 }, 15538 methods:{ 15539 getWebpushSettings(){ 15540 axios({ 15541 method: 'POST', 15542 url: this.ajax_url+"/getWebpushSettings" , 15543 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') , 15544 timeout: $timeout, 15545 }).then( response => { 15546 if(response.data.code==1){ 15547 this.settings = response.data.details; 15548 if(this.settings.enabled==1){ 15549 this.webPushInit(); 15550 } 15551 } else { 15552 this.settings = []; 15553 } 15554 }).catch(error => { 15555 // 15556 }).then(data => { 15557 15558 }); 15559 }, 15560 webPushInit(){ 15561 if ( this.settings.provider=="pusher" && this.settings.user_settings.enabled==1 ){ 15562 15563 this.beams = new PusherPushNotifications.Client({ 15564 instanceId: this.settings.pusher_instance_id , 15565 }); 15566 15567 this.beams.start() 15568 .then(() => { 15569 this.beams.setDeviceInterests( this.settings.user_settings.interest ) 15570 .then(() =>{ 15571 console.log('Device interests have been set'); 15572 }) 15573 .then(() => this.beams.getDeviceInterests()) 15574 .then((interests) => console.log("Current interests:", interests)) 15575 .catch(e => { 15576 var data = { 15577 notification_type :"push", 15578 message : "Beams " + e, 15579 date : '', 15580 image_type : 'icon', 15581 image : 'zmdi zmdi-info-outline' 15582 }; 15583 vm_cart_preview.$refs.notification.addData(data); 15584 }); 15585 }).catch(e => { 15586 var data = { 15587 notification_type :"push", 15588 message : "Beams " + e, 15589 date : '', 15590 image_type : 'icon', 15591 image : 'zmdi zmdi-info-outline' 15592 }; 15593 vm_cart_preview.$refs.notification.addData(data); 15594 }); 15595 15596 15597 } else if ( this.settings.provider=="onesignal" ){ 15598 // 15599 } 15600 }, 15601 }, 15602 template:` 15603 ` 15604 }; 15605 15606 15607 /* 15608 COMPONENTS NOTIFICATIONS 15609 */ 15610 const ComponentsNotification = { 15611 components: { 15612 'components-webpush': ComponentsWebPush, 15613 }, 15614 props: ['ajax_url','label','realtime','view_url','avatar','image_background'], 15615 data(){ 15616 return { 15617 data : [], 15618 count : 0, 15619 new_message : false, 15620 player : undefined, 15621 ably : undefined, 15622 channel : undefined, 15623 piesocket : undefined, 15624 observer : undefined, 15625 pusher : undefined, 15626 }; 15627 }, 15628 mounted() { 15629 this.getAllNotification(); 15630 if(this.realtime.enabled){ 15631 this.initRealTime(); 15632 } 15633 15634 this.observer = lozad('.lozad',{ 15635 loaded: function(el) { 15636 el.classList.add('loaded'); 15637 } 15638 }); 15639 }, 15640 updated () { 15641 this.observer.observe(); 15642 }, 15643 computed: { 15644 hasData(){ 15645 if(this.data.length>0){ 15646 return true; 15647 } 15648 return false;
15649 }, 15650 ReceiveMessage(){ 15651 if(this.new_message){ 15652 return true; 15653 } 15654 return false; 15655 }, 15656 }, 15657 methods:{ 15658 initRealTime(){ 15659 dump(this.realtime.event_tracking_order); 15660 if(this.realtime.provider == "pusher"){ 15661 15662 Pusher.logToConsole = false; 15663 this.pusher = new Pusher( this.realtime.key , { 15664 cluster: this.realtime.cluster 15665 }); 15666 15667 this.channel = this.pusher.subscribe( this.realtime.channel ); 15668 15669 this.channel.bind( this.realtime.event , (data)=> { 15670 dump("receive pusher"); 15671 dump(data); 15672 this.playAlert(); 15673 this.addData(data); 15674 }); 15675 15676 } else if ( this.realtime.provider =="ably" ){ 15677 15678 this.ably = new Ably.Realtime(this.realtime.ably_apikey); 15679 this.ably.connection.on('connected', () => { 15680 15681 this.channel = this.ably.channels.get( this.realtime.channel ); 15682 15683 this.channel.subscribe( this.realtime.event , (message) => { 15684 dump("receive ably"); 15685 dump(message.data); 15686 this.playAlert(); 15687 this.addData(message.data); 15688 }); 15689 15690 }); 15691 15692 } else if ( this.realtime.provider =="piesocket" ){ 15693 15694 this.piesocket = new PieSocket({ 15695 clusterId: this.realtime.piesocket_clusterid , 15696 apiKey: this.realtime.piesocket_api_key 15697 }); 15698 this.channel = this.piesocket.subscribe(this.realtime.channel); 15699 15700 this.channel.listen( this.realtime.event , (data)=> { 15701 dump("receive piesocket"); 15702 dump(data); 15703 this.playAlert(); 15704 this.addData( data ); 15705 }); 15706 15707 } 15708 15709 }, 15710 playAlert(){ 15711 this.player = new Howl({ 15712 //src: ['../assets/sound/notify.mp3', '../assets/sound/notify.ogg' ], 15713 src: [site_url+'/assets/sound/notify.mp3', site_url+'/assets/sound/notify.ogg' ], 15714 html5: true, 15715 }); 15716 this.player.play(); 15717 }, 15718 getAllNotification(){ 15719 15720 axios({ 15721 method: 'POST', 15722 url: this.ajax_url+"/getNotifications" , 15723 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + '&lang=' + document.documentElement.lang, 15724 timeout: $timeout, 15725 }).then( response => { 15726 if(response.data.code==1){ 15727 this.data = response.data.details.data; 15728 this.count = response.data.details.count; 15729 } else { 15730 this.data = []; 15731 this.count = 0; 15732 } 15733 }).catch(error => { 15734 // 15735 }).then(data => { 15736 15737 }); 15738 15739 }, 15740 addData($data){ 15741 this.playAlert(); 15742 this.data.unshift($data); 15743 this.count++; 15744 this.new_message = true; 15745 15746 setTimeout(()=>{ 15747 this.new_message = false; 15748 this.player.stop(); 15749 }, 1000); 15750 15751 }, 15752 clearAll(){ 15753 15754 axios({ 15755 method: 'POST', 15756 url: this.ajax_url+"/clearNotifications" , 15757 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 15758 timeout: $timeout, 15759 }).then( response => { 15760 if(response.data.code==1){ 15761 this.data = []; 15762 this.count = 0; 15763 } else { 15764 notify( response.data.msg ,'error') 15765 } 15766 15767 this.new_message = false; 15768 15769 }).catch(error => { 15770 // 15771 }).then(data => { 15772 15773 }); 15774 }, 15775 }, 15776 template: ` 15777 15778 <components-webpush 15779 :ajax_url="ajax_url" 15780 :message='label' 15781 /> 15782 </components-webpush> 15783 15784 <div class="btn-group pull-right notification-dropdown"> 15785 <button type="button" class="btn p-0 btn-default" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 15786 <img class="img-30 rounded-pill lozad" :src="avatar" :data-background-image="image_background" /> 15787 <span v-if="count>0" :class="{'shake-constant shake-chunk' : ReceiveMessage }" class="badge rounded-circle badge-danger count">{{count}}</span> 15788 </button> 15789 <div class="dropdown-menu dropdown-menu-right"> 15790 <div class="dropdown-header d-flex justify-content-between"> 15791 <div class="flex-col"> 15792 <div class="d-flex align-items-center"> 15793 <h5 class="m-0 mr-2">{{label.title}}</h5>
15794 <span class="badge rounded-circle badge-green badge-25">{{count}}</span> 15795 </div> 15796 </div> 15797 <div class="flex-col" v-if="hasData"> 15798 <a @click="clearAll">{{label.clear}}</a> 15799 </div> 15800 </div> 15801 <!--header--> 15802 15803 <!--content--> 15804 <ul v-if="hasData" class="list-unstyled m-0"> 15805 <li v-for="(item,index) in data"> 15806 <a :class="{ active: index<=0 }" > 15807 <div class="d-flex"> 15808 <div v-if="item.image!=''" class="flex-col mr-3"> 15809 <template v-if="item.image_type=='icon'"> 15810 <div class="notify-icon rounded-circle bg-soft-primary"> 15811 <i :class="item.image"></i> 15812 </div> 15813 </template> 15814 <template v-else> 15815 <div class="notify-icon"> 15816 <img class="img-40 rounded-circle" :src="item.image" /> 15817 </div> 15818 </template> 15819 </div> 15820 <div class="flex-col"> 15821 <div class="text-heading" v-html="item.message"></div> 15822 <div class="dropdown-text-light">{{item.date}}</div> 15823 </div> 15824 </div> 15825 </a> 15826 </li> 15827 </ul> 15828 <!--content--> 15829 15830 <div v-if="!hasData" class="none-notification text-center"> 15831 <div class="image-notification m-auto"></div> 15832 <h5 class="m-0 mb-1 mt-2">{{label.no_notification}}</h5> 15833 <p class="m-0 font11 text-muted">{{label.no_notification_content}}</p> 15834 </div> 15835 15836 <div v-if="hasData" class="footer-dropdown text-center"> 15837 <a :href="view_url" target="_blank" class="text-primary">{{label.view}}</a> 15838 </div> 15839 15840 </div> <!--dropdown-menu--> 15841 </div> 15842 <!--btn-group--> 15843 ` 15844 }; 15845 15846 const ComponentsLanguage = { 15847 props : ['ajax_url'], 15848 data(){ 15849 return { 15850 data : [], 15851 is_loading : false 15852 }; 15853 }, 15854 mounted () { 15855 this.getLanguage(); 15856 }, 15857 methods :{ 15858 getLanguage(){ 15859 this.is_loading = true; 15860 axios({ 15861 method: 'POST', 15862 url: this.ajax_url+"/getLanguage" , 15863 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + '&lang=' + document.documentElement.lang, 15864 timeout: $timeout, 15865 }).then( response => { 15866 if(response.data.code==1){ 15867 this.data = response.data.details; 15868 } else { 15869 this.data = []; 15870 } 15871 }).catch(error => { 15872 // 15873 }).then(data => { 15874 this.is_loading = false; 15875 }); 15876 }, 15877 setLang(link){ 15878 window.location.href = link; 15879 } 15880 }, 15881 template : ` 15882 <el-skeleton style="width: 150px" :loading="is_loading" animated> 15883 <template #template> 15884 <el-skeleton-item variant="image" style="width: 150px; height: 20px" /> 15885 </template> 15886 <template #default> 15887 15888 <el-dropdown trigger="click" v-if="data.enabled"> 15889 <span class="el-dropdown-link"> 15890 15891 <div class="d-flex align-items-center"> 15892 <div class="mr-2"> 15893 <el-image 15894 style="width: 30px; height: 25px" 15895 :src="data.default.flag" 15896 :fit="contain" 15897 lazy 15898 ></el-image> 15899 </div> 15900 <div class="mr-2">{{data.default.title}}</div> 15901 <div><i class="zmdi zmdi-chevron-down"></i></div> 15902 </div> 15903 </span> 15904 <template #dropdown> 15905 <el-dropdown-menu> 15906 <el-dropdown-item v-for="item in data.data" > 15907 15908 <el-dropdown-item @click="setLang(item.link)"> 15909 <div class="row no-gutters align-items-center"> 15910 <div class="col mr-3"> 15911 <el-image 15912 style="width: 30px; height: 25px" 15913 :src="item.flag" 15914 :fit="contain" 15915 ></el-image> 15916 </div> 15917 <div class="col">{{item.title}}</div> 15918 </div> 15919 </el-dropdown-item> 15920 15921 </el-dropdown-item> 15922 </el-dropdown-menu> 15923 </template> 15924 </el-dropdown> 15925 15926 </template> 15927 </el-skeleton> 15928 ` 15929 }; 15930 15931 const ComponentsNotificationCart = { 15932 props : ['ajax_url','realtime'], 15933 data() { 15934 return { 15935 merchant_uuid : '' 15936 } 15937 }, 15938 created() { 15939 this.getMerchantByCart(); 15940 }, 15941 methods: { 15942 getMerchantByCart(){ 15943 axios({ 15944 method: 'POST', 15945 url: this.ajax_url+"/getMerchantByCart" , 15946 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid'), 15947 timeout: $timeout, 15948 }).then( response => { 15949 if(response.data.code==1){ 15950 this.merchant_uuid = response.data.details.merchant_uuid; 15951 this.initRealTime(); 15952 } else { 15953 this.merchant_uuid = ''; 15954 } 15955 }).catch(error => { 15956 // 15957 }).then(data => { 15958 }); 15959 }, 15960 initRealTime(){ 15961 if(this.realtime.provider == "pusher" && this.realtime.enabled==1){ 15962 Pusher.logToConsole = false;
15963 this.pusher = new Pusher( this.realtime.key , { 15964 cluster: this.realtime.cluster 15965 }); 15966 this.channel = this.pusher.subscribe( this.merchant_uuid ); 15967 this.channel.bind( this.realtime.event , (data)=> { 15968 let message = JSON.parse(data.message); 15969 this.$emit('afterReceiveitemupdate', message ); 15970 }); 15971 } 15972 } 15973 // 15974 }, 15975 }; 15976 15977 15978 const ComponentsCurrencySelection = { 15979 data() { 15980 return { 15981 data : [], 15982 loading : false, 15983 based_currency : '' 15984 } 15985 }, 15986 created() { 15987 this.getCurrencyList(); 15988 }, 15989 methods: { 15990 getCurrencyList(){ 15991 this.loading = true; 15992 let currency_code = getCookie('currency_code'); 15993 currency_code = !empty(currency_code)?currency_code:''; 15994 axios({ 15995 method: 'POST', 15996 url: ajaxurl +"/getCurrencyList" , 15997 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "¤cy_code="+currency_code, 15998 timeout: $timeout, 15999 }).then( response => { 16000 if(response.data.code==1){ 16001 this.data = response.data.details.data; 16002 this.based_currency = response.data.details.based_currency; 16003 } else { 16004 this.data = []; 16005 this.based_currency = ''; 16006 } 16007 }).catch(error => { 16008 // 16009 }).then(data => { 16010 this.loading = false; 16011 }); 16012 }, 16013 setCurrency(currencyCode){ 16014 this.based_currency = currencyCode; 16015 this.$emit('afterSelectcurrency',currencyCode); 16016 }, 16017 }, 16018 template: ` 16019 <div class="dropdown language-bar d-inline" v-if="!loading" > 16020 <a class="dropdown-toggle text-truncate" href="javascript:;" 16021 role="button" id="currencySelection" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 16022 {{based_currency}} 16023 </a> 16024 <div class="dropdown-menu" aria-labelledby="currencySelection"> 16025 <template v-for="(items,code) in data"> 16026 <a @click="setCurrency(code)" class="dropdown-item" :class="{active : based_currency==code}" > 16027 <div class="d-flex align-items-center"> 16028 <div class="text-truncate">{{items}}</div> 16029 </div> 16030 </a> 16031 </template> 16032 </div> 16033 </div> 16034 `, 16035 }; 16036 16037 16038 /* 16039 CART PREVIEW 16040 target = vue-cart-preview 16041 */ 16042 const app_cart_preview = Vue.createApp({ 16043 components: { 16044 'component-cart-preview': ComponentCartPreview, 16045 'components-notification': ComponentsNotification, 16046 'components-language': ComponentsLanguage, 16047 'component-notification-cart': ComponentsNotificationCart, 16048 'component-currency-selection': ComponentsCurrencySelection, 16049 }, 16050 mounted () { 16051 this.getCartPreview(); 16052 }, 16053 data(){ 16054 return { 16055 items_count:0, 16056 drawer : false, 16057 drawer_preview_cart : false, 16058 }; 16059 }, 16060 methods :{ 16061 getCartPreview(){ 16062 this.$refs.childref.getCartPreview(); 16063 }, 16064 cartCount(items){ 16065 this.items_count = items; 16066 }, 16067 showCartPreview(){ 16068 this.drawer_preview_cart = true; 16069 }, 16070 closeCartPreview(){ 16071 this.drawer_preview_cart = false; 16072 }, 16073 afterDrawerclose(){ 16074 this.drawer_preview_cart = false; 16075 }, 16076 afterReceiveitemupdate(data){ 16077 axios({ 16078 method: 'POST', 16079 url: ajaxurl+"/validateCartItems" , 16080 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid')+"&item_id="+data.item_id, 16081 timeout: $timeout, 16082 }).then( response => { 16083 if(response.data.code==1){ 16084 let $some_words = JSON.parse(some_words); 16085 ElementPlus.ElMessageBox.alert( response.data.msg, '', { 16086 confirmButtonText: $some_words.ok, 16087 callback: (action) => { 16088 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 16089 vm_cart_preview.getCartPreview(); 16090 } 16091 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 16092 vue_cart.loadcart(); 16093 } 16094 if ((typeof vm !== "undefined") && ( vm !== null)) { 16095 vm.geStoreMenu(); 16096 } 16097 }, 16098 }); 16099 } 16100 }).catch(error => { 16101 // 16102 }).then(data => { 16103 }); 16104 }, 16105 afterSelectcurrency(data){ 16106 setCookie('currency_code',data,30); 16107 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 16108 vm_cart_preview.getCartPreview(); 16109 }
16110 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 16111 vue_cart.loadcart(); 16112 } 16113 if ((typeof vm !== "undefined") && ( vm !== null)) { 16114 vm.geStoreMenu(); 16115 } 16116 if ((typeof vm_app_search !== "undefined") && ( vm_app_search !== null)) { 16117 if ((typeof vm_app_search.$refs.food_list_recommended !== "undefined") && ( vm_app_search.$refs.food_list_recommended !== null)) { 16118 vm_app_search.$refs.food_list_recommended.getFoodList(); 16119 vm_app_search.$refs.food_list.getFoodList(); 16120 } 16121 } 16122 }, 16123 }, 16124 }); 16125 app_cart_preview.use(ElementPlus); 16126 const vm_cart_preview = app_cart_preview.mount('#vue-cart-preview'); 16127 16128 16129 /* 16130 CART PREVIEW FOR CATEGORY PAGE 16131 target = vue-cart-preview 16132 */ 16133 const app_cart_preview2 = Vue.createApp({ 16134 components: { 16135 'component-cart-preview': ComponentCartPreview, 16136 }, 16137 mounted () { 16138 // this.getCartPreview(); 16139 }, 16140 data(){ 16141 return { 16142 items_subtotal:0, 16143 drawer : false, 16144 drawer_preview_cart : false, 16145 }; 16146 }, 16147 methods :{ 16148 getCartPreview(){ 16149 this.$refs.childref.getCartPreview(); 16150 }, 16151 cartSubtotal(items){ 16152 this.items_subtotal = items; 16153 }, 16154 showCartPreview(){ 16155 vm_cart_preview.showCartPreview(); 16156 this.drawer_preview_cart = true; 16157 }, 16158 afterDrawerclose(){ 16159 this.drawer_preview_cart = false; 16160 }, 16161 }, 16162 }); 16163 app_cart_preview2.use(ElementPlus); 16164 const vm_cart_preview2 = app_cart_preview2.mount('#vue-cart-preview2'); 16165 16166 /* 16167 COMPONENTS ALERT 16168 */ 16169 const ComponentsAlert = { 16170 props: ['title','button'], 16171 data(){ 16172 return { 16173 data:[] 16174 }; 16175 }, 16176 methods :{ 16177 show(){ 16178 $('#ModalAlert').modal('show'); 16179 }, 16180 close(){ 16181 $('#ModalAlert').modal('hide'); 16182 }, 16183 alert(data){ 16184 this.data = data; 16185 dump(this.data); 16186 this.show(); 16187 }, 16188 }, 16189 template: ` 16190 <div class="modal" id="ModalAlert" tabindex="-1" role="dialog" aria-labelledby="ModalAlert" aria-hidden="true"> 16191 <div class="modal-dialog modal-dialog-centered" role="document"> 16192 <div class="modal-content"> 16193 16194 <div class="modal-header"> 16195 <h5 class="modal-title" id="exampleModalLabel">{{ title }}</h5> 16196 <button type="button" class="close" aria-label="Close" @click="close" > 16197 <span aria-hidden="true">×</span> 16198 </button> 16199 </div> 16200 16201 <div class="modal-body" > 16202 <div v-for="item in data.text" > 16203 {{ item }} 16204 </div> 16205 </div> 16206 16207 <div class="modal-footer justify-content-center"> 16208 <button class="btn btn-black w-25" @click="close" > 16209 {{button}} 16210 </button> 16211 </div> <!--footer--> 16212 16213 </div> <!--content--> 16214 </div> <!--dialog--> 16215 </div> <!--modal--> 16216 `, 16217 }; 16218 16219 16220 const component_alert = Vue.createApp({ 16221 components: { 16222 'component-alert': ComponentsAlert, 16223 }, 16224 methods :{ 16225 alert(message){ 16226 this.$refs.Alertref.alert( {'text': message } ); 16227 }, 16228 }, 16229 }).mount('#component_alert'); 16230 16231 /* 16232 COMPONENTS CANCEL ORDER 16233 */ 16234 const ComponentsCancelOrder = { 16235 props: ['label'], 16236 data(){ 16237 return { 16238 data:[], 16239 loading : false, 16240 merchant_name : '', 16241 cancel_status : false, 16242 cancel_msg : '', 16243 order_uuid : '', 16244 error : [], 16245 is_loading : false, 16246 cancel_response : [] 16247 }; 16248 }, 16249 methods :{ 16250 show(){ 16251 $('#ModalCancelOrder').modal('show'); 16252 }, 16253 close(){ 16254 $('#ModalCancelOrder').modal('hide'); 16255 this.order_uuid = ''; 16256 }, 16257 cancel(data){ 16258 this.merchant_name = data.merchant_name; 16259 this.show(); 16260 16261 this.order_uuid = data.order_uuid; 16262 16263 var $params = { 16264 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16265 'order_uuid' : this.order_uuid 16266 }; 16267 16268 var timenow = 1; 16269 $params = JSON.stringify($params); 16270 16271 ajax_request[timenow] = $.ajax({ 16272 url: ajaxurl+"/cancelOrderStatus", 16273 method: "PUT", 16274 dataType: "json", 16275 data: $params , 16276 contentType : $content_type.json , 16277 timeout: $timeout, 16278 crossDomain: true, 16279 beforeSend: data => { 16280 this.loading = true; 16281 this.cancel_status = false; 16282 this.cancel_msg = ''; 16283 if(ajax_request[timenow] != null) { 16284 ajax_request[timenow].abort(); 16285 } 16286 } 16287 }); 16288 16289 ajax_request[timenow].done( data => { 16290 if ( data.code==1){ 16291 this.cancel_status = data.details.cancel_status; 16292 this.cancel_msg = data.details.cancel_msg; 16293 this.cancel_response = data.details; 16294 } else { 16295 this.cancel_status = false;
16296 this.cancel_response = []; 16297 } 16298 }); 16299 16300 ajax_request[timenow].always( data => { 16301 this.loading = false; 16302 }); 16303 16304 }, 16305 applyCancelOrder(){ 16306 16307 var $params = { 16308 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16309 'order_uuid' : this.order_uuid 16310 }; 16311 16312 var timenow = 1; 16313 $params = JSON.stringify($params); 16314 16315 ajax_request[timenow] = $.ajax({ 16316 url: ajaxurl+"/applyCancelOrder", 16317 method: "PUT", 16318 dataType: "json", 16319 data: $params , 16320 contentType : $content_type.json , 16321 timeout: $timeout, 16322 crossDomain: true, 16323 beforeSend: data => { 16324 this.error = []; 16325 this.is_loading = true; 16326 if(ajax_request[timenow] != null) { 16327 ajax_request[timenow].abort(); 16328 } 16329 } 16330 }); 16331 16332 ajax_request[timenow].done( data => { 16333 if ( data.code==1){ 16334 notify(data.msg,'success'); 16335 this.close(); 16336 vm_my_order.page = 0; 16337 vm_my_order.data = []; 16338 vm_my_order.orderHistory(); 16339 } else { 16340 this.error = data.msg; 16341 } 16342 }); 16343 16344 ajax_request[timenow].always( data => { 16345 this.is_loading = false; 16346 }); 16347 }, 16348 }, 16349 template: ` 16350 <div class="modal" id="ModalCancelOrder" tabindex="-1" role="dialog" aria-labelledby="ModalCancelOrder" aria-hidden="true" data-backdrop="static" data-keyboard="false" > 16351 <div class="modal-dialog modal-dialog-centered" role="document"> 16352 <div class="modal-content"> 16353 <div class="modal-header"> 16354 <h5 class="modal-title" id="exampleModalLabel">{{merchant_name}}</h5> 16355 <button type="button" class="close" aria-label="Close" @click="close" :disabled="is_loading" > 16356 <span aria-hidden="true">×</span> 16357 </button> 16358 </div> 16359 16360 <DIV v-if="loading"> 16361 <div class="loading mt-5 mb-5"> 16362 <div class="m-auto circle-loader" data-loader="circle-side"></div> 16363 </div> 16364 </DIV> 16365 16366 <DIV v-else> 16367 16368 <div class="modal-body" > 16369 16370 <h5 v-if="cancel_response.refund_status==='full_refund'">{{label.are_you_sure}}</h5> 16371 <h5 v-else>{{label.how}}</h5> 16372 16373 <div class="mt-3"> 16374 <p>{{cancel_msg}}</p> 16375 </div> 16376 16377 <div class="mt-3 mb-2" v-if="cancel_response.refund_msg"> 16378 <p>{{cancel_response.refund_msg}}</p> 16379 </div> 16380 16381 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 16382 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 16383 </div> 16384 16385 </div> <!--body--> 16386 16387 <div class="modal-footer justify-content-center"> 16388 <button class="btn btn-black w-100" @click="close" :disabled="is_loading" > 16389 {{label.dont}} 16390 </button> 16391 <button class="btn btn-green w-100" :disabled="!cancel_status" @click="applyCancelOrder()" 16392 :class="{ loading: is_loading }" > 16393 <span class="label">{{label.cancel}}</span> 16394 <div class="m-auto circle-loader" data-loader="circle-side"></div> 16395 </button> 16396 </div> <!--footer--> 16397 </DIV> <!--end if--> 16398 </div> <!--content--> 16399 </div> <!--dialog--> 16400 </div> <!--modal--> 16401 `, 16402 }; 16403 16404 16405 /* 16406 MY ORDER 16407 target = vue-my-order 16408 */ 16409 const app_my_order = Vue.createApp({ 16410 components: { 16411 'component-cancel-order' : ComponentsCancelOrder, 16412 'components-review' : ComponentsReview, 16413 }, 16414 mounted () { 16415 this.orderHistory(); 16416 this.orderSummary(); 16417 }, 16418 data(){ 16419 return { 16420 show_next_page : false, 16421 loading : false, 16422 load_more : false, 16423 page : 0, 16424 data : [], 16425 merchants : [], 16426 items : [], 16427 size : [], 16428 status : [], 16429 services : [], 16430 show_details : false, 16431 order_loading : false, 16432 order_merchant : [], 16433 order_items : [], 16434 order_summary : [], 16435 order_info : [], 16436 order_status : [], 16437 order_services : [], 16438 order_label : [], 16439 status_allowed_cancelled : [], 16440 status_allowed_review : [], 16441 q : '', 16442 awaitingSearch : false, 16443 search_found : false, 16444 summary_data : [], 16445 total_qty : 0, 16446 animated_total_qty : 0, 16447 total_order_raw : 0, 16448 animated_total_order : 0, 16449 refund_transaction : [], 16450 order_table_data : [] 16451 }; 16452 }, 16453 watch: { 16454 q(newsearch,oldsearch){ 16455 if (!this.awaitingSearch) { 16456 if(empty(newsearch)){ 16457 return false;
16458 } 16459 16460 setTimeout(() => { 16461 16462 var $params; var timenow = getTimeNow(); 16463 $params="page=0"; 16464 $params+="&q="+ this.q; 16465 $params+=addValidationRequest(); 16466 ajax_request[timenow] = $.ajax({ 16467 url: ajaxurl+"/orderHistory", 16468 method: "POST", 16469 dataType: "json", 16470 data: $params, 16471 contentType : $content_type.form , 16472 timeout: $timeout, 16473 crossDomain: true, 16474 beforeSend: function( xhr ) { 16475 if(ajax_request[timenow] != null) { 16476 ajax_request[timenow].abort(); 16477 } 16478 } 16479 }); 16480 16481 ajax_request[timenow].done( data => { 16482 if (data.code==1){ 16483 this.data = []; 16484 this.show_next_page = data.details.show_next_page; 16485 this.page = data.details.page; 16486 //this.data = data.details.data.data; 16487 this.data.push(data.details.data.data); 16488 this.merchants = data.details.data.merchants; 16489 this.items = data.details.data.items; 16490 this.size = data.details.data.size; 16491 this.status = data.details.data.status; 16492 this.services = data.details.data.services; 16493 this.status_allowed_cancelled = data.details.data.status_allowed_cancelled; 16494 this.status_allowed_review = data.details.data.status_allowed_review; 16495 this.search_found = true; 16496 } else { 16497 this.data = []; 16498 this.search_found = true; 16499 } 16500 }); // ajax done 16501 16502 ajax_request[timenow].always( data => { 16503 this.awaitingSearch = false; 16504 }); 16505 16506 }, 1000); // 1 sec delay 16507 16508 this.awaitingSearch = true; 16509 } 16510 }, 16511 16512 total_qty(newValue){ 16513 gsap.to(this.$data, { duration: 0.6, animated_total_qty : newValue }); 16514 }, 16515 16516 total_order_raw(newValue){ 16517 gsap.to(this.$data, { duration: 0.6, animated_total_order : newValue }); 16518 }, 16519 16520 }, 16521 computed: { 16522 hasData(){ 16523 if(this.search_found){ 16524 return true; 16525 } 16526 return false; 16527 }, 16528 hasResults(){ 16529 if(this.data.length>0){ 16530 return true; 16531 } 16532 return false; 16533 }, 16534 hasRefund(){ 16535 if(this.refund_transaction.length>0){ 16536 return true; 16537 } 16538 return false; 16539 }, 16540 animatedNumber() { 16541 return this.animated_total_qty.toFixed(0); 16542 }, 16543 animatedTotal() { 16544 return this.animated_total_order.toFixed(2); 16545 }, 16546 hasBooking(){ 16547 if (Object.keys(this.order_table_data).length > 0) { 16548 return true; 16549 } 16550 return false; 16551 } 16552 }, 16553 methods :{ 16554 clearData(){ 16555 this.search_found = false; 16556 this.q = ''; 16557 this.page = 0; 16558 this.data = []; 16559 this.orderHistory(); 16560 }, 16561 orderHistory(){ 16562 16563 if(!this.load_more){ 16564 this.loading = true; 16565 } 16566 16567 var $params; var timenow = getTimeNow(); 16568 $params="page="+ this.page; 16569 $params+=addValidationRequest(); 16570 ajax_request[timenow] = $.ajax({ 16571 url: ajaxurl+"/orderHistory", 16572 method: "POST", 16573 dataType: "json", 16574 data: $params, 16575 contentType : $content_type.form , 16576 timeout: $timeout, 16577 crossDomain: true, 16578 beforeSend: data => { 16579 if(ajax_request[timenow] != null) { 16580 ajax_request[timenow].abort(); 16581 } 16582 } 16583 }); 16584 16585 ajax_request[timenow].done( data => { 16586 if (data.code==1){ 16587 this.show_next_page = data.details.show_next_page; 16588 this.page = data.details.page; 16589 16590 /*this.data = data.details.data.data; 16591 this.merchants = data.details.data.merchants; 16592 this.items = data.details.data.items; 16593 this.size = data.details.data.size; 16594 this.status = data.details.data.status; 16595 this.services = data.details.data.services; 16596 this.status_allowed_cancelled = data.details.data.status_allowed_cancelled; 16597 this.status_allowed_review = data.details.data.status_allowed_review;*/ 16598 16599 this.data.push(data.details.data.data); 16600 this.merchants = this.addObjectToArray( this.merchants, data.details.data.merchants ); 16601 this.items = this.addObjectToArray( this.items, data.details.data.items ); 16602 this.status = data.details.data.status; 16603 this.services = data.details.data.services; 16604 this.status_allowed_cancelled = data.details.data.status_allowed_cancelled; 16605 this.status_allowed_review = data.details.data.status_allowed_review; 16606 16607 } else { 16608 16609 } 16610 }); // ajax done 16611 16612 ajax_request[timenow].always( data => { 16613 this.loading = false;
16614 this.load_more = false; 16615 }); 16616 16617 }, 16618 addObjectToArray(element, element_new){ 16619 var new_object = {}; 16620 Object.entries(element).forEach(([key,value]) => { new_object[key] = value }); 16621 Object.entries(element_new).forEach(([key,value]) => { new_object[key] = value }); 16622 return new_object; 16623 }, 16624 loadMoreOrders(page){ 16625 this.page = page; 16626 this.load_more = true; 16627 this.orderHistory(); 16628 }, 16629 orderDetails(order_uuid){ 16630 this.show_details = true; 16631 16632 var $params = { 16633 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16634 'order_uuid' : order_uuid, 16635 'lang': document.documentElement.lang 16636 }; 16637 16638 var timenow = 1; 16639 $params = JSON.stringify($params); 16640 16641 ajax_request[timenow] = $.ajax({ 16642 url: ajaxurl+"/orderDetails", 16643 method: "PUT", 16644 dataType: "json", 16645 data: $params , 16646 contentType : $content_type.json , 16647 timeout: $timeout, 16648 crossDomain: true, 16649 beforeSend: data => { 16650 16651 this.order_loading = true; 16652 this.order_merchant = []; 16653 this.order_items = []; 16654 this.order_summary = []; 16655 this.order_info = []; 16656 this.order_status = []; 16657 this.order_services = []; 16658 this.order_label = []; 16659 16660 if(ajax_request[timenow] != null) { 16661 ajax_request[timenow].abort(); 16662 } 16663 } 16664 }); 16665 16666 ajax_request[timenow].done( data => { 16667 if ( data.code==1){ 16668 this.order_merchant = data.details.data.merchant; 16669 this.order_items = data.details.data.items; 16670 this.order_summary = data.details.data.summary; 16671 this.order_info = data.details.data.order.order_info; 16672 this.order_label = data.details.data.label; 16673 this.refund_transaction = data.details.data.refund_transaction; 16674 16675 this.order_status = data.details.data.order.status; 16676 this.order_services = data.details.data.order.services; 16677 16678 this.order_table_data = data.details.data.order_table_data; 16679 16680 if(!empty(this.order_services[this.order_info.service_code])){ 16681 this.order_services = this.order_services[this.order_info.service_code]; 16682 } 16683 if(!empty(this.order_status[this.order_info.status])){ 16684 this.order_status = this.order_status[this.order_info.status]; 16685 } 16686 16687 } 16688 }); 16689 16690 ajax_request[timenow].always( data => { 16691 this.order_loading = false; 16692 this.updateImage(); 16693 }); 16694 16695 }, 16696 closeOrderDetails(){ 16697 this.show_details = false; 16698 }, 16699 updateImage(){ 16700 updateLazyImage(); 16701 }, 16702 buyAgain(order_uuid , close_view){ 16703 var $params = { 16704 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16705 'order_uuid' : order_uuid, 16706 'cart_uuid' : getCookie('cart_uuid') 16707 }; 16708 16709 var timenow = 1; 16710 $params = JSON.stringify($params); 16711 16712 ajax_request[timenow] = $.ajax({ 16713 url: ajaxurl+"/orderBuyAgain", 16714 method: "PUT", 16715 dataType: "json", 16716 data: $params , 16717 contentType : $content_type.json , 16718 timeout: $timeout, 16719 crossDomain: true, 16720 beforeSend: data => { 16721 if(ajax_request[timenow] != null) { 16722 ajax_request[timenow].abort(); 16723 } 16724 } 16725 }); 16726 16727 ajax_request[timenow].done( data => { 16728 if ( data.code==1){ 16729 setCookie('cart_uuid',data.details.cart_uuid,30); 16730 16731 if(close_view==1){ 16732 this.show_details = false; 16733 } 16734 16735 vm_cart_preview.getCartPreview(); 16736 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 16737 vm_cart_preview.showCartPreview(); 16738 } 16739 } else { 16740 component_alert.alert(data.msg); 16741 } 16742 }); 16743 16744 }, 16745 callCancel(order_uuid,merchant_name){ 16746 this.$refs.orderCancelRef.cancel( {'merchant_name': merchant_name ,'order_uuid' : order_uuid } ); 16747 }, 16748 writeReview(order_uuid){ 16749 dump('writeReview' + order_uuid); 16750 this.$refs.ReviewRef.order_uuid = order_uuid; 16751 this.$refs.ReviewRef.show(); 16752 }, 16753 orderSummary(){ 16754 16755 var $params = { 16756 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16757 }; 16758 16759 var timenow = getTimeNow(); 16760 $params = JSON.stringify($params); 16761 16762 ajax_request[timenow] = $.ajax({ 16763 url: ajaxurl+"/orderSummary", 16764 method: "PUT", 16765 dataType: "json", 16766 data: $params , 16767 contentType : $content_type.json , 16768 timeout: $timeout, 16769 crossDomain: true, 16770 beforeSend: data => { 16771 if(ajax_request[timenow] != null) { 16772 ajax_request[timenow].abort(); 16773 } 16774 } 16775 }); 16776 16777 ajax_request[timenow].done( data => { 16778 this.summary_data = data.details.summary; 16779 this.total_qty = data.details.summary.total_qty; 16780 this.total_order_raw = data.details.summary.total_order_raw>0?data.details.summary.total_order_raw:0; 16781 }); 16782 16783 }, 16784 }, 16785 }); 16786 app_my_order.use(ElementPlus); 16787 const vm_my_order = app_my_order.mount('#vue-my-order'); 16788 16789 16790 16791 const vm_bootbox = Vue.createApp({ 16792 components: { 16793 'component-bootbox': Componentsbootbox, 16794 }, 16795 data(){ 16796 return { 16797 resolvePromise: undefined, 16798 rejectPromise: undefined, 16799 } 16800 }, 16801 methods :{ 16802 confirm(){ 16803 return new Promise((resolve, reject) => { 16804 this.resolvePromise = resolve 16805 this.rejectPromise = reject 16806 this.$refs.bootbox.confirm(); 16807 }); 16808 }, 16809 Callback(result){ 16810 this.resolvePromise(result); 16811 }, 16812 alert(message,options){ 16813 this.$refs.bootbox.alert(message,options); 16814 }, 16815 }, 16816 }).mount('#vue-bootbox'); 16817 16818 16819 16820 16821 /* 16822 CUSTOMER ADDRESS 16823 */ 16824 const app_address = Vue.createApp({ 16825 components: { 16826 'component-new-address': changeAddressComponent, 16827 'component-address': ComponentsAddress, 16828 }, 16829 mounted () { 16830 this.getAddresses(false); 16831 }, 16832 data(){ 16833 return { 16834 data : [], 16835 error : [], 16836 is_loading : false, 16837 reload_loading : false, 16838 total_address : 0, 16839 total_address_animated : 0, 16840 }; 16841 }, 16842 watch: { 16843 total_address(newValue) { 16844 gsap.to(this.$data, { duration: 0.5, total_address_animated: newValue }) 16845 }, 16846 }, 16847 computed: { 16848 animatedTotal() { 16849 return this.total_address_animated.toFixed(0) 16850 } 16851 }, 16852 methods :{ 16853 getAddresses($reload){ 16854 16855 this.reload_loading = $reload; 16856 16857 var $params = { 16858 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16859 }; 16860 var timenow = getTimeNow(); 16861 $params = JSON.stringify($params); 16862 16863 ajax_request[timenow] = $.ajax({ 16864 url: ajaxurl+"/getAddresses", 16865 method: "PUT", 16866 dataType: "json", 16867 data: $params , 16868 contentType : $content_type.json , 16869 timeout: $timeout, 16870 crossDomain: true, 16871 beforeSend: data => { 16872 if(!$reload) { this.is_loading = true; } else { this.reload_loading = true; } 16873 if(ajax_request[timenow] != null) { 16874 ajax_request[timenow].abort(); 16875 } 16876 } 16877 }); 16878 16879 ajax_request[timenow].done( data => { 16880 if ( data.code==1){ 16881 this.data = data.details.data; 16882 this.total_address = this.data.length; 16883 } else { 16884 this.data = []; 16885 this.total_address = 0; 16886 } 16887 }); 16888 16889 ajax_request[timenow].always( data => { 16890 this.is_loading = false;
16891 this.reload_loading = false; 16892 }); 16893 16894 }, 16895 showNewAddress(){ 16896 this.$refs.refnewaddress.autosaved_addres = false; 16897 this.$refs.refnewaddress.showModal(); 16898 }, 16899 ShowAddress(address_uuid){ 16900 this.$refs.address.show( address_uuid ); 16901 }, 16902 setLocationDetails(data){ 16903 this.$refs.address.showWithData( data ); 16904 }, 16905 ConfirmDelete(address_uuid){ 16906 this.$refs.address.ConfirmDelete( address_uuid ); 16907 }, 16908 }, 16909 }); 16910 app_address.use(ElementPlus); 16911 const vm_addresses = app_address.mount('#vue-my-address'); 16912 16913 16914 16915 /* 16916 COMPONENTS PAYMENT METHOD 16917 */ 16918 const ComponentsPaymentMethod = { 16919 props: ['label','payment_type','show_payment'], 16920 data() { 16921 return { 16922 data : [], 16923 display : false, 16924 } 16925 }, 16926 mounted () { 16927 this.getPaymentMethod(); 16928 this.display = this.show_payment; 16929 }, 16930 methods :{ 16931 getPaymentMethod(){ 16932 16933 var $params = { 16934 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 16935 'payment_type' : this.payment_type 16936 }; 16937 16938 var timenow = getTimeNow(); 16939 $params = JSON.stringify($params); 16940 16941 ajax_request[timenow] = $.ajax({ 16942 url: ajaxurl+"/PaymentMethod", 16943 method: "PUT", 16944 dataType: "json", 16945 data: $params , 16946 contentType : $content_type.json , 16947 timeout: $timeout, 16948 crossDomain: true, 16949 beforeSend: function( xhr ) { 16950 if(ajax_request[timenow] != null) { 16951 ajax_request[timenow].abort(); 16952 } 16953 } 16954 }); 16955 16956 ajax_request[timenow].done( data => { 16957 if ( data.code==1){ 16958 this.data = data.details.data; 16959 } else { 16960 this.data = []; 16961 } 16962 }); 16963 16964 }, 16965 showPayment(payment_code){ 16966 this.$emit('setPayment',payment_code); 16967 }, 16968 }, 16969 template: ` 16970 <!--PAYMENT METHODS--> 16971 <transition name="slide-fade"> 16972 <div class="card mb-3" v-if="display" > 16973 <div class="card-body"> 16974 16975 <h5 class="mb-3">{{label.add_new_payment}}</h5> 16976 16977 <a v-for="payment in data" @click="showPayment(payment.payment_code)" 16978 href="javascript:;" class="d-block chevron-section medium d-flex align-items-center rounded mb-2"> 16979 <div class="flexcol mr-2 payment-logo-wrap"> 16980 <i v-if="payment.logo_type=='icon'" :class="payment.logo_class"></i> 16981 <img v-else class="img-35" :src="payment.logo_image" /> 16982 </div> 16983 16984 <div class="flexcol" > 16985 <span class="mr-1">{{payment.payment_name}}</span> 16986 </div> 16987 </a> 16988 16989 </div> <!--card body--> 16990 </div> <!--card--> 16991 </transition> 16992 <!--END PAYMENT METHODS--> 16993 `, 16994 }; 16995 16996 16997 /* 16998 CUSTOMER PAYMENTS 16999 */ 17000 const app_payments = Vue.createApp({ 17001 data(){ 17002 return { 17003 data : [], 17004 default_payment_uuid : '', 17005 error : [], 17006 is_loading : false, 17007 reload_loading : false, 17008 payment_method : false, 17009 }; 17010 }, 17011 mounted () { 17012 this.getMyPayments(false); 17013 }, 17014 watch: { 17015 payment_method(newdata,olddata){ 17016 this.$refs.payment_method.display = newdata; 17017 } 17018 }, 17019 methods :{ 17020 getMyPayments($reload){ 17021 17022 this.reload_loading = $reload; 17023 17024 var $params = { 17025 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17026 }; 17027 var timenow = getTimeNow(); 17028 $params = JSON.stringify($params); 17029 17030 ajax_request[timenow] = $.ajax({ 17031 url: ajaxurl+"/MyPayments", 17032 method: "PUT", 17033 dataType: "json", 17034 data: $params , 17035 contentType : $content_type.json , 17036 timeout: $timeout, 17037 crossDomain: true, 17038 beforeSend: data => { 17039 if(!$reload) { this.is_loading = true; } else { this.reload_loading = true; } 17040 if(ajax_request[timenow] != null) { 17041 ajax_request[timenow].abort(); 17042 } 17043 } 17044 }); 17045 17046 ajax_request[timenow].done( data => { 17047 if ( data.code==1){ 17048 this.data = data.details.data; 17049 this.default_payment_uuid = data.details.default_payment_uuid; 17050 } else { 17051 this.data = []; 17052 this.default_payment_uuid = ''; 17053 } 17054 }); 17055 17056 ajax_request[timenow].always( data => { 17057 this.is_loading = false;
17058 this.reload_loading = false; 17059 }); 17060 17061 }, 17062 ConfirmDelete(payment_uuid){ 17063 vm_bootbox.confirm().then((result) => { 17064 if(result){ 17065 this.deletePayment(payment_uuid); 17066 } 17067 }); 17068 }, 17069 deletePayment(payment_uuid){ 17070 17071 var $params = { 17072 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17073 'payment_uuid' : payment_uuid 17074 }; 17075 var timenow = getTimeNow(); 17076 $params = JSON.stringify($params); 17077 17078 ajax_request[timenow] = $.ajax({ 17079 url: ajaxurl+"/deletePayment", 17080 method: "PUT", 17081 dataType: "json", 17082 data: $params , 17083 contentType : $content_type.json , 17084 timeout: $timeout, 17085 crossDomain: true, 17086 beforeSend: data => { 17087 if(ajax_request[timenow] != null) { 17088 ajax_request[timenow].abort(); 17089 } 17090 } 17091 }); 17092 17093 ajax_request[timenow].done( data => { 17094 if ( data.code==1){ 17095 this.getMyPayments(true); 17096 } else { 17097 vm_bootbox.alert( data.msg , {} ); 17098 } 17099 }); 17100 17101 ajax_request[timenow].always( data => { 17102 17103 }); 17104 17105 }, 17106 editPayment(data){ 17107 this.$refs[data.payment_code].Get(data.reference_id); 17108 }, 17109 SavedPaymentList(){ 17110 this.getMyPayments(true); 17111 }, 17112 showPayment(payment_code){ 17113 try { 17114 this.$refs[payment_code].showPaymentForm(); 17115 } catch(err) { 17116 vm_bootbox.alert( err , {} ); 17117 } 17118 }, 17119 setDefaultPayment(payment_uuid){ 17120 17121 var $params = { 17122 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17123 'payment_uuid' : payment_uuid 17124 }; 17125 17126 var timenow = 1; 17127 $params = JSON.stringify($params); 17128 17129 ajax_request[timenow] = $.ajax({ 17130 url: ajaxurl+"/setDefaultPayment", 17131 method: "PUT", 17132 dataType: "json", 17133 data: $params , 17134 contentType : $content_type.json , 17135 timeout: $timeout, 17136 crossDomain: true, 17137 beforeSend: function( xhr ) { 17138 if(ajax_request[timenow] != null) { 17139 ajax_request[timenow].abort(); 17140 } 17141 } 17142 }); 17143 17144 ajax_request[timenow].done( data => { 17145 if ( data.code==1){ 17146 this.getMyPayments(true); 17147 } else { 17148 vm_bootbox.alert( data.msg , {} ); 17149 } 17150 }); 17151 17152 }, 17153 }, 17154 }); 17155 //.mount('#vue-my-payments'); 17156 17157 if ((typeof components_bundle !== "undefined") && ( components_bundle !== null)) { 17158 $.each(components_bundle,function(components_name, components_value) { 17159 app_payments.component(components_name, components_value ); 17160 }); 17161 } 17162 17163 app_payments.component("components-payment-method",ComponentsPaymentMethod); 17164 17165 app_payments.use(Maska); 17166 app_payments.use(ElementPlus); 17167 const vm_my_payments = app_payments.mount('#vue-my-payments'); 17168 17169 17170 /* 17171 LIST SAVED STORES 17172 */ 17173 const app_my_store = Vue.createApp({ 17174 components: { 17175 'component-save-store' : ComponentsSaveStore, 17176 }, 17177 data(){ 17178 return { 17179 data : [], 17180 is_loading : false, 17181 reload_loading : false, 17182 services : [], 17183 estimation : [], 17184 }; 17185 }, 17186 mounted () { 17187 this.saveStoreList(false); 17188 }, 17189 updated () { 17190 dump("updated"); 17191 17192 $('.list-items .lazy').each(function(index, $obj){ 17193 if ( !empty($(this).attr("src")) && !empty($(this).attr("data-src")) ){ 17194 $(this).attr("src", $(this).attr("data-src") ); 17195 } 17196 }); 17197 17198 }, 17199 methods :{ 17200 17201 saveStoreList($reload) { 17202 17203 this.reload_loading = $reload; 17204 17205 var $params = { 17206 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17207 }; 17208 var timenow = getTimeNow(); 17209 $params = JSON.stringify($params); 17210 17211 ajax_request[timenow] = $.ajax({ 17212 url: ajaxurl+"/saveStoreList", 17213 method: "PUT", 17214 dataType: "json", 17215 data: $params , 17216 contentType : $content_type.json , 17217 timeout: $timeout, 17218 crossDomain: true, 17219 beforeSend: data => { 17220 if(!$reload) { this.is_loading = true; } else { this.reload_loading = true; } 17221 if(ajax_request[timenow] != null) { 17222 ajax_request[timenow].abort(); 17223 } 17224 } 17225 }); 17226 17227 ajax_request[timenow].done( data => { 17228 if ( data.code==1){ 17229 this.data = data.details.data; 17230 this.services = data.details.services; 17231 this.estimation = data.details.estimation; 17232 } else { 17233 this.data = []; this.services = []; this.estimation = []; 17234 } 17235 }); 17236 17237 ajax_request[timenow].always( data => { 17238 this.is_loading = false; 17239 this.reload_loading = false; 17240 17241 }); 17242 17243 }, 17244 afterSaveStore(item){ 17245 item.saved_store = item.saved_store==1?false:true; 17246 }, 17247 }, 17248 }); 17249 app_my_store.use(ElementPlus); 17250 const vm_my_store = app_my_store.mount('#vue-saved-store'); 17251 17252 17253 17254 /* 17255 COMPONENTS MAPS AUTO COMPLETE 17256 */ 17257 const ComponentsAutoComplete = { 17258 props: ['label','modelValue'],
17259 emits: ['update:modelValue'], 17260 data(){ 17261 return { 17262 q: '', 17263 awaitingSearch : false, 17264 show_list : false, 17265 data : [], 17266 error : [], 17267 hasSelected : false, 17268 }; 17269 }, 17270 watch: { 17271 q(newsearch,oldsearch){ 17272 17273 this.$emit('update:modelValue', newsearch); 17274 17275 if (!this.awaitingSearch) { 17276 17277 if(empty(newsearch)){ 17278 return false; 17279 } 17280 17281 if(this.q.length>20){ 17282 return false; 17283 } 17284 17285 this.show_list = true; 17286 17287 setTimeout(() => { 17288 17289 var $params; var timenow = 2; 17290 $params="q=" + this.q; 17291 $params+=addValidationRequest(); 17292 ajax_request[timenow] = $.ajax({ 17293 url: ajaxurl+"/getlocation_autocomplete", 17294 method: "POST", 17295 dataType: "json", 17296 data: $params, 17297 contentType : $content_type.form , 17298 timeout: $timeout, 17299 crossDomain: true, 17300 beforeSend: data => { 17301 if(ajax_request[timenow] != null) { 17302 ajax_request[timenow].abort(); 17303 } 17304 } 17305 }); 17306 17307 ajax_request[timenow].done( data => { 17308 if ( data.code==1){ 17309 this.data = data.details.data; 17310 } else { 17311 this.data = []; 17312 } 17313 }); // ajax done 17314 17315 ajax_request[timenow].always( data => { 17316 this.awaitingSearch = false; 17317 }); 17318 17319 }, 1000); // 1 sec delay 17320 } 17321 17322 this.data = []; 17323 this.awaitingSearch = true; 17324 }, 17325 }, 17326 methods: { 17327 showList(){ 17328 this.show_list = true; 17329 }, 17330 clearData(){ 17331 this.data = []; 17332 this.q = ''; 17333 }, 17334 setData(data){ 17335 this.clearData(); 17336 this.q = data.description; 17337 this.$emit('update:modelValue', data.description); 17338 this.$emit('afterChoose',data); 17339 }, 17340 }, 17341 computed: { 17342 hasData(){ 17343 if(this.data.length>0){ 17344 return true; 17345 } 17346 return false; 17347 }, 17348 }, 17349 template: ` 17350 <div class="position-relative search-geocomplete"> 17351 <div v-if="!awaitingSearch" class="img-20 m-auto pin_placeholder icon"></div> 17352 <div v-if="awaitingSearch" class="icon" data-loader="circle"></div> 17353 17354 <input @click="showList" v-model="q" class="form-control form-control-text" 17355 :placeholder="label.enter_address" > 17356 17357 <div v-if="hasData" @click="clearData" class="icon-remove"><i class="zmdi zmdi-close"></i></div> 17358 17359 </div> 17360 17361 <div class="search-geocomplete-results" v-if="show_list"> 17362 <ul class="list-unstyled m-0 border"> 17363 <li v-for="items in data"> 17364 <a href="javascript:;" @click="setData(items)" > 17365 <h6 class="m-0">{{items.description}}</h6> 17366 </a> 17367 </li> 17368 </ul> 17369 </div> 17370 ` 17371 }; 17372 /*END AUTO COMPLETE*/ 17373 17374 17375 17376 /* 17377 MERCHANT SIGNUP 17378 */ 17379 const app_merchant_signup = Vue.createApp({ 17380 components: { 17381 'component-auto-complete' : ComponentsAutoComplete, 17382 'component-phone' : ComponentsPhoneNumber, 17383 'vue-recaptcha' : componentsRecaptcha, 17384 }, 17385 data(){ 17386 return { 17387 data : [], 17388 loading : false, 17389 mobile_prefixes : [], 17390 restaurant_name : '', 17391 address : '', 17392 contact_email : '', 17393 mobile_prefix : '', 17394 mobile_number : '', 17395 membership_type : '', 17396 membership_list : [], 17397 response : [], 17398 recaptcha_response : '', 17399 show_recaptcha : true, 17400 membership_commission : [], 17401 services_list : [], 17402 services : [], 17403 currency_list : [], 17404 currency : '' 17405 }; 17406 }, 17407 mounted () { 17408 this.getSignupAttributes(); 17409 }, 17410 computed: { 17411 checkForm(){ 17412 17413 if(empty(this.restaurant_name)){ 17414 return true; 17415 } 17416 if(empty(this.address)){ 17417 return true; 17418 } 17419 if(empty(this.contact_email)){ 17420 return true; 17421 } 17422 if(!this.validEmail(this.contact_email)){ 17423 return true; 17424 } 17425 if(empty(this.mobile_number)){ 17426 return true; 17427 } 17428 if(empty(this.mobile_prefix)){ 17429 return true; 17430 } 17431 if(empty(this.membership_type)){ 17432 return true; 17433 } 17434 17435 return false; 17436 }, 17437 }, 17438 methods :{ 17439 getSignupAttributes(){ 17440 var $params; var timenow = getTimeNow(); 17441 $params+=addValidationRequest(); 17442 ajax_request[timenow] = $.ajax({ 17443 url: ajaxurl+"/getSignupAttributes", 17444 method: "POST", 17445 dataType: "json", 17446 data: $params, 17447 contentType : $content_type.form , 17448 timeout: $timeout, 17449 crossDomain: true, 17450 beforeSend: function( xhr ) { 17451 if(ajax_request[timenow] != null) { 17452 ajax_request[timenow].abort(); 17453 } 17454 } 17455 }); 17456 17457 ajax_request[timenow].done( data => { 17458 if(data.code==1){ 17459 this.mobile_prefixes = data.details.mobile_prefixes; 17460 this.membership_list = data.details.membership_list; 17461 this.show_recaptcha = data.details.capcha; 17462 this.membership_commission = data.details.membership_commission; 17463 this.services_list = data.details.services_list; 17464 this.currency_list = data.details.currency_list; 17465 } else { 17466 this.mobile_prefixes = []; 17467 this.membership_list = ''; 17468 this.show_recaptcha = false; 17469 this.membership_commission = []; 17470 this.services_list = []; 17471 this.currency_list = []; 17472 } 17473 }); // ajax done 17474 }, 17475 verifyForms(){ 17476 if ( this.show_recaptcha){ 17477 this.verifyRecaptcha(); 17478 } else { 17479 this.submit(); 17480 } 17481 }, 17482 verifyRecaptcha(){ 17483 17484 var $params = { 17485 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17486 'recaptcha_response': this.recaptcha_response, 17487 }; 17488 var timenow = 11; 17489 $params = JSON.stringify($params); 17490 17491 ajax_request[timenow] = $.ajax({ 17492 url: ajaxurl+"/verifyRecaptcha", 17493 method: "PUT", 17494 dataType: "json", 17495 data: $params , 17496 contentType : $content_type.json , 17497 timeout: $timeout, 17498 crossDomain: true, 17499 beforeSend: data => { 17500 this.loading = true; 17501 if(ajax_request[timenow] != null) { 17502 ajax_request[timenow].abort(); 17503 } 17504 } 17505 }); 17506 17507 ajax_request[timenow].done( data => { 17508 if(data.code==1){ 17509 this.submit(); 17510 } else if ( data.code==3){ 17511 this.recaptchaExpired(); 17512 this.response.code = 2; 17513 this.response.msg = data.msg; 17514 } else { 17515 this.response = data; 17516 } 17517 }); // ajax done 17518 17519 ajax_request[timenow].always( data => { 17520 this.loading = false;
17521 }); 17522 }, 17523 submit(){ 17524 17525 var $params = { 17526 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17527 'restaurant_name': this.restaurant_name, 17528 'address': this.address, 17529 'contact_email': this.contact_email, 17530 'mobile_prefix': this.mobile_prefix, 17531 'mobile_number': this.mobile_number, 17532 'membership_type' : this.membership_type, 17533 'services': this.services, 17534 'currency' : this.currency 17535 }; 17536 var timenow = 22; 17537 $params = JSON.stringify($params); 17538 17539 ajax_request[timenow] = $.ajax({ 17540 url: ajaxurl+"/CreateAccountMerchant", 17541 method: "PUT", 17542 dataType: "json", 17543 data: $params , 17544 contentType : $content_type.json , 17545 timeout: $timeout, 17546 crossDomain: true, 17547 beforeSend: data => { 17548 this.loading = true; 17549 if(ajax_request[timenow] != null) { 17550 ajax_request[timenow].abort(); 17551 } 17552 } 17553 }); 17554 17555 ajax_request[timenow].done( data => { 17556 this.response = data; 17557 if(data.code==1){ 17558 window.location.href = data.details.redirect; 17559 } 17560 }); // ajax done 17561 17562 ajax_request[timenow].always( data => { 17563 this.loading = false; 17564 }); 17565 17566 }, 17567 validEmail: function (email) { 17568 var re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 17569 return re.test(email); 17570 }, 17571 recaptchaVerified(response) { 17572 this.recaptcha_response = response; 17573 }, 17574 recaptchaExpired() { 17575 this.$refs.vueRecaptcha.reset(); 17576 }, 17577 recaptchaFailed() { 17578 17579 }, 17580 replaceText(text,replace1,replace2){ 17581 let result = text.replace("{transaction_type}", replace1); 17582 result = result.replace("{site_name}", replace2); 17583 return result; 17584 }, 17585 }, 17586 }); 17587 17588 app_merchant_signup.use(Maska); 17589 app_merchant_signup.use(ElementPlus); 17590 const vm_merchant_signup = app_merchant_signup.mount('#vue-merchant-signup'); 17591 17592 17593 /* 17594 MERCHANT USER SIGNUP 17595 */ 17596 17597 const app_merchant_user = Vue.createApp({ 17598 components: { 17599 'component-phone' : ComponentsPhoneNumber, 17600 'vue-recaptcha' : componentsRecaptcha, 17601 }, 17602 data(){ 17603 return { 17604 is_loading : false, 17605 show_password : false, 17606 agree_terms : false, 17607 password_type: 'password', 17608 first_name : '', 17609 last_name : '', 17610 contact_email : '', 17611 mobile_number : '', 17612 mobile_prefix :'', 17613 password : '', 17614 cpassword :'', 17615 mobile_prefixes : [], 17616 error : [], 17617 success : '', 17618 redirect : '', 17619 next_url : '', 17620 recaptcha_response : '', 17621 show_recaptcha : false, 17622 merchant_uuid : '', 17623 username : '' 17624 }; 17625 }, 17626 mounted () { 17627 this.merchant_uuid = _merchant_uuid; 17628 }, 17629 computed: { 17630 DataValid(){ 17631 if(!empty(this.first_name) && empty(!this.last_name) && empty(!this.contact_email) && empty(!this.mobile_number) 17632 && empty(!this.password) && empty(!this.cpassword) && empty(!this.username) ){ 17633 return true; 17634 } 17635 return false; 17636 }, 17637 }, 17638 methods: { 17639 showPassword() 17640 { 17641 this.show_password = this.show_password==true?false:true; 17642 if(this.show_password){ 17643 this.password_type = 'text'; 17644 } else this.password_type = 'password'; 17645 }, 17646 onRegister(){ 17647 17648 this.is_loading = true; 17649 this.error = []; 17650 axios({ 17651 method: 'PUT', 17652 url: ajaxurl+"/createMerchantUser" , 17653 data : { 17654 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17655 'username' : this.username, 17656 'password' : this.password, 17657 'cpassword' : this.cpassword, 17658 'first_name' : this.first_name, 17659 'last_name' : this.last_name, 17660 'contact_email' : this.contact_email, 17661 'mobile_number' : this.mobile_number, 17662 'mobile_prefix' : this.mobile_prefix, 17663 'merchant_uuid' : this.merchant_uuid, 17664 }, 17665 timeout: $timeout, 17666 }).then( response => { 17667 if(response.data.code==1){ 17668 window.location.href = response.data.details.redirect; 17669 } else { 17670 this.data = []; 17671 this.error = response.data.msg; 17672 } 17673 }).catch(error => { 17674 // 17675 }).then(data => { 17676 this.is_loading = false; 17677 }); 17678 17679 }, 17680 }, 17681 }); 17682 app_merchant_user.use(Maska); 17683 const vm_merchant_user = app_merchant_user.mount('#vue-merchant-user'); 17684 17685 17686 17687 /* 17688 COMPONENTS PAYMENT PLANS 17689 */ 17690 const ComponentsPaymentPlans = { 17691 props: ['label','payment_type','ajax_url','actions'], 17692 data() { 17693 return { 17694 is_loading : false, 17695 data : [], 17696 payment_code : '' 17697 } 17698 }, 17699 mounted () { 17700 this.getPaymentMethod(); 17701 }, 17702 methods :{ 17703 getPaymentMethod(){ 17704 17705 this.is_loading = true; 17706 axios({ 17707 method: 'POST', 17708 url: this.ajax_url+"/" + this.actions , 17709 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 17710 timeout: $timeout, 17711 }).then( response => { 17712 if(response.data.code==1){ 17713 this.data = response.data.details; 17714 } else { 17715 this.data = []; 17716 } 17717 }).catch(error => { 17718 // 17719 }).then(data => { 17720 this.is_loading = false; 17721 }); 17722 17723 }, 17724 isActive(data){ 17725 return { 17726 'border-vertical-green': data.payment_code==this.payment_code 17727 } 17728 }, 17729 setPayment(payment_code){ 17730 this.payment_code = payment_code; 17731 this.$emit('setPayment', this.payment_code ); 17732 }, 17733 }, 17734 template: ` 17735 <!--PAYMENT METHODS--> 17736 <div class="card mb-3" > 17737 <div class="card-body"> 17738 17739 <h4 class="mb-3">{{label.select_payment}}</h4> 17740 17741 <a v-for="payment in data" 17742 @click="setPayment(payment.payment_code)" 17743 :class="isActive(payment)" 17744 class="d-block chevron-section medium d-flex align-items-center rounded mb-2"> 17745 <div class="flexcol mr-2 payment-logo-wrap"> 17746 <i v-if="payment.logo_type=='icon'" :class="payment.logo_class"></i> 17747 <img v-else class="img-35" :src="payment.logo_image" /> 17748 </div> 17749 17750 <div class="flexcol" >
17751 <span class="mr-1">{{payment.payment_name}}</span> 17752 </div> 17753 </a> 17754 17755 </div> <!--card body--> 17756 </div> <!--card--> 17757 <!--END PAYMENT METHODS--> 17758 `, 17759 }; 17760 17761 17762 /* 17763 SUBSCRIPTION 17764 */ 17765 const app_subscription = Vue.createApp({ 17766 data(){ 17767 return { 17768 data : [], 17769 plan_details : [], 17770 is_loading : true, 17771 }; 17772 }, 17773 mounted () { 17774 this.getPlan(); 17775 }, 17776 methods :{ 17777 getPlan(){ 17778 this.is_loading = true; 17779 axios({ 17780 method: 'POST', 17781 url: ajaxurl +"/getPlan" , 17782 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 17783 }).then( response => { 17784 if(response.data.code==1){ 17785 this.data = response.data.details.data; 17786 this.plan_details = response.data.details.plan_details; 17787 } else { 17788 this.data = []; 17789 this.plan_details = []; 17790 } 17791 }).catch(error => { 17792 // 17793 }).then(data => { 17794 this.is_loading = false; 17795 }); 17796 }, 17797 }, 17798 }); 17799 app_subscription.use(ElementPlus); 17800 const vm_subscription = app_subscription.mount('#vue-subscription'); 17801 17802 const app_payment_plan = Vue.createApp({ 17803 data(){ 17804 return { 17805 data : [], 17806 loading : false, 17807 merchant_uuid : null, 17808 package_uuid : null, 17809 plan_details : [], 17810 payment_list : [], 17811 payment_code : '', 17812 subscriber_id : null 17813 }; 17814 }, 17815 mounted () { 17816 if ((typeof plan_merchant_uuid !== "undefined") && ( plan_merchant_uuid !== null)) { 17817 this.merchant_uuid = plan_merchant_uuid; 17818 } 17819 if ((typeof plan_uuid !== "undefined") && ( plan_uuid !== null)) { 17820 this.package_uuid = plan_uuid; 17821 } 17822 if ((typeof subscriber_id !== "undefined") && ( subscriber_id !== null)) { 17823 this.subscriber_id = subscriber_id; 17824 } 17825 this.getSelectPaymentPlan(); 17826 }, 17827 computed: { 17828 hasPaymentSelected(){ 17829 return empty(this.payment_code)? false : true; 17830 }, 17831 }, 17832 methods: { 17833 isActive(data){ 17834 return this.payment_code==data?true:false; 17835 }, 17836 getSelectPaymentPlan(){ 17837 this.loading = true; 17838 axios({ 17839 method: 'POST', 17840 url: ajaxurl +"/getSelectPaymentPlan" , 17841 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&plan_uuid="+this.package_uuid, 17842 }).then( response => { 17843 if(response.data.code==1){ 17844 this.plan_details = response.data.details.plan_details; 17845 this.payment_list = response.data.details.payment_list; 17846 } else { 17847 this.plan_details = []; 17848 this.payment_list = []; 17849 } 17850 }).catch(error => { 17851 // 17852 }).then(data => { 17853 this.loading = false; 17854 }); 17855 }, 17856 showPayment(){ 17857 console.log("this.payment_code",this.payment_code);
17858 try { 17859 this.$refs[this.payment_code].showPaymentForm(); 17860 } catch(err) { 17861 console.log("error",err); 17862 ElementPlus.ElNotification({ 17863 title: "", 17864 message: 'This payment is not available for plan', 17865 position: 'bottom-right', 17866 type: 'warning', 17867 }); 17868 } 17869 }, 17870 showLoader(){ 17871 this.loading = true; 17872 }, 17873 closeLoader(){ 17874 this.loading = false; 17875 }, 17876 errorMessage(data){ 17877 ElementPlus.ElNotification({ 17878 title: "", 17879 message: data, 17880 position: 'bottom-right', 17881 type: 'warning', 17882 }); 17883 }, 17884 // 17885 }, 17886 }); 17887 17888 if ((typeof components_bundle !== "undefined") && ( components_bundle !== null)) { 17889 console.debug("components_bundle",components_bundle); 17890 $.each(components_bundle,function(components_name, components_value) { 17891 app_payment_plan.component(components_name, components_value ); 17892 }); 17893 } 17894 17895 app_payment_plan.use(ElementPlus); 17896 const vm_payment_plan = app_payment_plan.mount('#payment-plan'); 17897 17898 17899 /* 17900 UPDATE PROFILE 17901 */ 17902 const app_update_profle = Vue.createApp({ 17903 components: { 17904 'component-phone' : ComponentsPhoneNumber, 17905 'component-change-phoneverify' : ComponentsChangePhoneVerification, 17906 }, 17907 data(){ 17908 return { 17909 is_loading: false, 17910 data : [], 17911 first_name : '', 17912 last_name : '', 17913 email_address :'', 17914 mobile_prefix : '', 17915 mobile_number :'', 17916 original_email_address : '', 17917 original_mobile_number : '', 17918 error : [], 17919 success : '' 17920 }; 17921 }, 17922 computed: { 17923 DataValid(){ 17924 if(!empty(this.first_name) && empty(!this.last_name) && empty(!this.email_address) && empty(!this.mobile_number) ){ 17925 return true; 17926 } 17927 return false; 17928 }, 17929 }, 17930 mounted () { 17931 this.getProfile(); 17932 }, 17933 methods :{ 17934 getProfile(){ 17935 17936 var $params = { 17937 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 17938 }; 17939 var timenow = 11; 17940 $params = JSON.stringify($params); 17941 17942 ajax_request[timenow] = $.ajax({ 17943 url: ajaxurl+"/getProfile", 17944 method: "PUT", 17945 dataType: "json", 17946 data: $params , 17947 contentType : $content_type.json , 17948 timeout: $timeout, 17949 crossDomain: true, 17950 beforeSend: data => { 17951 this.is_loading = true; 17952 if(ajax_request[timenow] != null) { 17953 ajax_request[timenow].abort(); 17954 } 17955 } 17956 }); 17957 17958 ajax_request[timenow].done( data => { 17959 if(data.code==1){ 17960 this.first_name = data.details.first_name; 17961 this.last_name = data.details.last_name; 17962 this.email_address = data.details.email_address; 17963 this.mobile_prefix = data.details.mobile_prefix; 17964 this.mobile_number = data.details.mobile_number; 17965 this.original_email_address = data.details.email_address; 17966 this.original_mobile_number = data.details.mobile_number; 17967 } else { 17968 this.msg = data.msg; 17969 } 17970 }); // ajax done 17971 17972 ajax_request[timenow].always( data => { 17973 this.is_loading = false; 17974 }); 17975 }, 17976 17977 checkForm(){ 17978 var _change = false; 17979 if( this.email_address != this.original_email_address ) { 17980 _change = true; 17981 } 17982 if( this.mobile_number != this.original_mobile_number ) { 17983 _change = true; 17984 } 17985 17986 this.success =''; 17987 this.error = []; 17988 17989 if(_change){ 17990 this.$refs.cphoneverify.show({ 17991 mobile_prefix : this.mobile_prefix, 17992 mobile_number : this.mobile_number, 17993 message : _message 17994 }); 17995 this.$refs.cphoneverify.resendCode(); 17996 } else { 17997 this.saveProfile(''); 17998 } 17999 }, 18000 18001 saveProfile(code){ 18002 18003 var $params = { 18004 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18005 'code': code, 18006 'first_name' : this.first_name, 18007 'last_name' : this.last_name, 18008 'email_address' : this.email_address, 18009 'mobile_prefix' : this.mobile_prefix, 18010 'mobile_number' : this.mobile_number, 18011 }; 18012 var timenow = getTimeNow(); 18013 $params = JSON.stringify($params); 18014 18015 ajax_request[timenow] = $.ajax({ 18016 url: ajaxurl+"/saveProfile", 18017 method: "PUT", 18018 dataType: "json", 18019 data: $params , 18020 contentType : $content_type.json , 18021 timeout: $timeout, 18022 crossDomain: true, 18023 beforeSend: data => { 18024 if (!empty(code)){ 18025 this.$refs.cphoneverify.is_loading = true; 18026 } else { 18027 this.is_loading = true; 18028 } 18029 if(ajax_request[timenow] != null) { 18030 ajax_request[timenow].abort(); 18031 } 18032 } 18033 }); 18034 18035 ajax_request[timenow].done( data => { 18036 if(data.code==1){ 18037 this.$refs.cphoneverify.close(); 18038 this.success = data.msg; 18039 this.original_email_address = this.email_address; 18040 this.original_mobile_number = this.mobile_number; 18041 } else { 18042 if (!empty(code)){ 18043 this.$refs.cphoneverify.error = data.msg; 18044 } else this.error = data.msg; 18045 } 18046 }); 18047 18048 ajax_request[timenow].always( data => { 18049 if (!empty(code)){ 18050 this.$refs.cphoneverify.is_loading = false;
18051 } else { 18052 this.is_loading = false; 18053 } 18054 }); 18055 }, 18056 }, 18057 }); 18058 18059 app_update_profle.use(Maska); 18060 const vm_update_profle = app_update_profle.mount('#vue-update-profile'); 18061 18062 /* 18063 UPDATE PASSWORD 18064 */ 18065 const app_update_password = Vue.createApp({ 18066 components: { 18067 'component-change-phoneverify' : ComponentsChangePhoneVerification, 18068 }, 18069 data(){ 18070 return { 18071 is_loading: false, 18072 data : [], 18073 error : [], 18074 success : '', 18075 old_password : '', 18076 new_password : '', 18077 confirm_password : '', 18078 }; 18079 }, 18080 computed: { 18081 DataValid(){ 18082 if(!empty(this.old_password) && empty(!this.new_password) && empty(!this.confirm_password) ){ 18083 return true; 18084 } 18085 return false; 18086 }, 18087 }, 18088 methods :{ 18089 updatePassword(){ 18090 18091 var $params = { 18092 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18093 'old_password' : this.old_password, 18094 'new_password' : this.new_password, 18095 'confirm_password' : this.confirm_password, 18096 }; 18097 var timenow = getTimeNow(); 18098 $params = JSON.stringify($params); 18099 18100 ajax_request[timenow] = $.ajax({ 18101 url: ajaxurl+"/updatePassword", 18102 method: "PUT", 18103 dataType: "json", 18104 data: $params , 18105 contentType : $content_type.json , 18106 timeout: $timeout, 18107 crossDomain: true, 18108 beforeSend: data => { 18109 this.is_loading = true; 18110 this.error = ''; this.success = ''; 18111 if(ajax_request[timenow] != null) { 18112 ajax_request[timenow].abort(); 18113 } 18114 } 18115 }); 18116 18117 ajax_request[timenow].done( data => { 18118 if(data.code==1){ 18119 this.success = data.msg; 18120 this.old_password =''; 18121 this.new_password =''; 18122 this.confirm_password =''; 18123 } else this.error = data.msg; 18124 }); 18125 18126 ajax_request[timenow].always( data => { 18127 this.is_loading = false; 18128 }); 18129 18130 }, 18131 }, 18132 }).mount('#vue-update-password'); 18133 18134 18135 /* 18136 MANAGE MY ACCOUNT 18137 */ 18138 18139 const app_manage_account = Vue.createApp({ 18140 components: { 18141 'component-change-phoneverify' : ComponentsChangePhoneVerification, 18142 }, 18143 data(){ 18144 return { 18145 is_loading: false, 18146 error : [], 18147 success : '', 18148 steps : 1, 18149 steps_request_data : 1, 18150 }; 18151 }, 18152 methods :{ 18153 requestArchive(){ 18154 18155 var $params = { 18156 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18157 }; 18158 var timenow = getTimeNow(); 18159 $params = JSON.stringify($params); 18160 18161 ajax_request[timenow] = $.ajax({ 18162 url: ajaxurl+"/requestData", 18163 method: "PUT", 18164 dataType: "json", 18165 data: $params , 18166 contentType : $content_type.json , 18167 timeout: $timeout, 18168 crossDomain: true, 18169 beforeSend: data => { 18170 this.is_loading = true; 18171 this.steps_request_data = 1; 18172 this.error = ''; 18173 if(ajax_request[timenow] != null) { 18174 ajax_request[timenow].abort(); 18175 } 18176 } 18177 }); 18178 18179 ajax_request[timenow].done( data => { 18180 if(data.code==1){ 18181 this.steps_request_data = 2; 18182 } else { 18183 this.error = data.msg; 18184 } 18185 }); 18186 18187 ajax_request[timenow].always( data => { 18188 this.is_loading = false; 18189 }); 18190 18191 }, 18192 confirm(){ 18193 this.$refs.cphoneverify.show({ 18194 mobile_prefix : _phone_prefix, 18195 mobile_number : _contact_phone, 18196 message : _message 18197 }); 18198 this.$refs.cphoneverify.resendCode(); 18199 }, 18200 verifyAccountDelete(code){ 18201 18202 var $params = { 18203 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18204 'code' : code, 18205 }; 18206 var timenow = getTimeNow(); 18207 $params = JSON.stringify($params); 18208 18209 ajax_request[timenow] = $.ajax({ 18210 url: ajaxurl+"/verifyAccountDelete", 18211 method: "PUT", 18212 dataType: "json", 18213 data: $params , 18214 contentType : $content_type.json , 18215 timeout: $timeout, 18216 crossDomain: true, 18217 beforeSend: data => { 18218 this.$refs.cphoneverify.is_loading = true; 18219 this.$refs.cphoneverify.error = []; 18220 if(ajax_request[timenow] != null) { 18221 ajax_request[timenow].abort(); 18222 } 18223 } 18224 }); 18225 18226 ajax_request[timenow].done( data => { 18227 if(data.code==1){ 18228 this.$refs.cphoneverify.close(); 18229 18230 vm_bootbox.confirm().then((result) => { 18231 if(result){ 18232 this.deleteAccount( code ); 18233 } 18234 }); 18235 18236 } else this.$refs.cphoneverify.error = data.msg; 18237 }); 18238 18239 ajax_request[timenow].always( data => { 18240 this.$refs.cphoneverify.is_loading = false;
18241 }); 18242 18243 }, 18244 18245 deleteAccount(code){ 18246 18247 var $params = { 18248 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18249 'code' : code, 18250 }; 18251 var timenow = getTimeNow(); 18252 $params = JSON.stringify($params); 18253 18254 ajax_request[timenow] = $.ajax({ 18255 url: ajaxurl+"/deleteAccount", 18256 method: "PUT", 18257 dataType: "json", 18258 data: $params , 18259 contentType : $content_type.json , 18260 timeout: $timeout, 18261 crossDomain: true, 18262 beforeSend: data => { 18263 this.is_loading = true; 18264 this.error = ''; this.success = ''; 18265 if(ajax_request[timenow] != null) { 18266 ajax_request[timenow].abort(); 18267 } 18268 } 18269 }); 18270 18271 ajax_request[timenow].done( data => { 18272 if(data.code==1){ 18273 this.steps = 2; 18274 setTimeout(() => { 18275 window.location.href = data.details.redirect; 18276 }, 4000); 18277 } else vm_bootbox.alert( data.msg , {} ); 18278 }); 18279 18280 ajax_request[timenow].always( data => { 18281 this.is_loading = false; 18282 }); 18283 }, 18284 } 18285 }); 18286 app_manage_account.use(Maska); 18287 const vm_manage_account = app_manage_account.mount('#vue-manage-account'); 18288 18289 18290 /* 18291 COMPONENTS PROFILE PHOTO 18292 */ 18293 const ComponentsProfilePhoto = { 18294 components: { 18295 Cropper: VueAdvancedCropper.Cropper 18296 }, 18297 props: ['label'], 18298 data(){ 18299 return { 18300 upload_images : '', 18301 filename : '', 18302 required_message :[], 18303 is_loading : false, 18304 error : [], 18305 steps: 1, 18306 photo : undefined, 18307 }; 18308 }, 18309 mounted () { 18310 this.initDropZone(this.label , this); 18311 }, 18312 methods :{ 18313 show(){ 18314 this.steps=1; 18315 $('#photoModal').modal('show'); 18316 }, 18317 close(){ 18318 $('#photoModal').modal('hide'); 18319 }, 18320 closeReset(){ 18321 this.reset(); 18322 $('#photoModal').modal('hide'); 18323 }, 18324 reset(){ 18325 Dropzone.forElement('#dropzone_multiple').removeAllFiles(true); 18326 this.removeUpload(this.filename); 18327 this.upload_images = []; 18328 this.filename = ''; 18329 this.error = []; 18330 }, 18331 initDropZone(label, object){ 18332 var $upload_params = { 18333 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18334 }; 18335 Dropzone.autoDiscover = false; 18336 //$dropzone = $("#dropzone_multiple").dropzone({ 18337 $dropzone = $( this.$refs.profile_dropzone ).dropzone({ 18338 dictDefaultMessage : label.dictDefaultMessage, 18339 dictFallbackMessage : label.dictFallbackMessage , 18340 dictFallbackText : label.dictFallbackText, 18341 dictFileTooBig : label.dictFileTooBig, 18342 dictInvalidFileType : label.dictInvalidFileType, 18343 dictResponseError : label.dictResponseError, 18344 dictCancelUpload : label.dictCancelUpload, 18345 dictCancelUploadConfirmation : label.dictCancelUploadConfirmation, 18346 dictRemoveFile : label.dictRemoveFile, 18347 dictMaxFilesExceeded : label.dictMaxFilesExceeded, 18348 paramName: "file", 18349 url: ajaxurl+"/uploadProfilePhoto" , 18350 maxFiles: 20, 18351 params: $upload_params, 18352 addRemoveLinks : true, 18353 maxFiles : 2, 18354 init: function() { 18355 this.on("maxfilesexceeded", function(file) { 18356 vm_bootbox.alert( label.max_file_exceeded , {} ); 18357 }); 18358 this.on("removedfile", function (file) { 18359 }); 18360 }, 18361 success: (file,response) => { 18362 var $resp = JSON.parse(response); 18363 if($resp.code==1){ 18364 this.upload_images = $resp.details.url_image; 18365 this.filename = $resp.details.filename; 18366 this.steps = 2; 18367 } else { 18368 vm_bootbox.alert( $resp.msg , {} ); 18369 this.reset(); 18370 } 18371 } 18372 }); 18373 }, 18374 removeUpload(id){ 18375 18376 return new Promise((resolve, reject) => { 18377 18378 var $params = { 18379 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18380 'id':id, 18381 }; 18382 var timenow = getTimeNow(); 18383 18384 ajax_request[timenow] = $.ajax({ 18385 url: ajaxurl+"/removeProfilePhoto", 18386 method: "PUT", 18387 dataType: "json", 18388 data: JSON.stringify($params) , 18389 contentType : $content_type.json , 18390 timeout: $timeout, 18391 crossDomain: true, 18392 beforeSend: data => { 18393 this.is_loading = true; 18394 if(ajax_request[timenow] != null) { 18395 ajax_request[timenow].abort(); 18396 this.is_loading = false;
18397 } 18398 } 18399 }); 18400 18401 ajax_request[timenow].done( data => { 18402 this.is_loading = false; 18403 resolve(true); 18404 if(data.code==1){ 18405 //this.remove(data.details); 18406 } 18407 }); // ajax done 18408 18409 ajax_request[timenow].always( data => { 18410 this.is_loading = false; 18411 }); 18412 18413 }); 18414 }, 18415 change({coordinates, canvas}) { 18416 this.photo = canvas.toDataURL('image/png'); 18417 }, 18418 save(){ 18419 this.$emit('onSave', this.photo , this.filename ); 18420 }, 18421 }, 18422 template: ` 18423 <div class="modal" id="photoModal" tabindex="-1" role="dialog" aria-labelledby="photoModal" aria-hidden="true" 18424 data-backdrop="static" data-keyboard="false" > 18425 <div class="modal-dialog modal-dialog-centered" role="document"> 18426 <div class="modal-content"> 18427 18428 <div class="modal-body" style="overflow-y:inherit !important;" > 18429 18430 <a href="javascript:;" @click="closeReset" 18431 class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 18432 18433 <template :class="{ 'd-block': steps==1 }"> 18434 <h5 class="m-0 mt-3 mb-2">{{label.add_photo}}</h5> 18435 <div class="mb-3"> 18436 <div class="dropzone dropzone_container" id="dropzone_multiple" ref="profile_dropzone" > 18437 <div class="dz-default dz-message"> 18438 <i class="fas fa-cloud-upload-alt"></i> 18439 <p>{{label.drop_files_here}}</p> 18440 </div> 18441 </div> 18442 </div> 18443 </template> 18444 18445 <template v-if="steps==2"> 18446 <h5 class="m-0 mt-3 mb-2">{{label.crop_photo}}</h5> 18447 18448 <div class="crop-images-wrap"> 18449 <cropper 18450 :src="upload_images" 18451 @change="change" 18452 :stencil-props="{ 18453 handlers: {}, 18454 movable: false, 18455 scalable: false, 18456 }" 18457 :stencil-size="{ 18458 width: 120, 18459 height: 120 18460 }" 18461 image-restriction="stencil" 18462 ></cropper> 18463 </div> 18464 18465 </template> 18466 18467 18468 </div> <!--modal body--> 18469 18470 <template v-if="steps==2"> 18471 18472 <div v-cloak v-if="error.length>0" class="alert alert-warning mb-2" role="alert"> 18473 <p v-cloak v-for="err in error" class="m-0">{{err}}</p> 18474 </div> 18475 18476 <div class="modal-footer justify-content-start"> 18477 <button class="btn btn-green w-100" @click="save" :class="{ loading: is_loading }" > 18478 <span class="label">{{label.save_photo}}</span> 18479 <div class="m-auto circle-loader" data-loader="circle-side"></div> 18480 </button> 18481 </div> <!--footer--> 18482 </template> 18483 18484 </div> <!--content--> 18485 </div> <!--dialog--> 18486 </div> <!--modal--> 18487 `, 18488 }; 18489 18490 18491 /* 18492 CUSTOMER PROFILE PHOTO 18493 */ 18494 const app_profile_photo = Vue.createApp({ 18495 components: { 18496 'components-profile-photo' : ComponentsProfilePhoto, 18497 }, 18498 data(){ 18499 return { 18500 avatar : '' 18501 }; 18502 }, 18503 mounted () { 18504 dump("mounted"); 18505 }, 18506 methods :{ 18507 showUpload(){ 18508 this.$refs.profile_photo.show(); 18509 }, 18510 SavePhoto(photo,filename){ 18511 18512 var $params; var timenow = 1; 18513 $params="photo=" + photo; 18514 $params+="&filename=" + filename; 18515 $params+=addValidationRequest(); 18516 ajax_request[timenow] = $.ajax({ 18517 url: ajaxurl+"/saveProfilePhoto", 18518 method: "POST", 18519 dataType: "json", 18520 data: $params, 18521 contentType : $content_type.form , 18522 timeout: $timeout, 18523 crossDomain: true, 18524 beforeSend: data => { 18525 this.$refs.profile_photo.is_loading = true; 18526 if(ajax_request[timenow] != null) { 18527 ajax_request[timenow].abort(); 18528 } 18529 } 18530 }); 18531 18532 ajax_request[timenow].done( data => { 18533 if(data.code==1){ 18534 this.$refs.profile_photo.close(); 18535 this.avatar = data.details.url_image; 18536 this.updateImage(); 18537 } else { 18538 this.$refs.profile_photo.error = data.msg; 18539 } 18540 }); // ajax done 18541 18542 ajax_request[timenow].always( data => { 18543 this.$refs.profile_photo.is_loading = false; 18544 }); 18545 18546 }, 18547 updateImage(){ 18548 var el = this.$refs.refavatar.getElementsByTagName("img"); 18549 el[0].src = this.avatar; 18550 }, 18551 }, 18552 }); 18553 app_profile_photo.use(ElementPlus); 18554 const vm_profile_photo = app_profile_photo.mount('#vue-profile-photo'); 18555 18556 18557 /* 18558 CHECK MERCHANT OPEN HOURS 18559 vue-schedule-order 18560 */ 18561 const vm_schedule_order = Vue.createApp({ 18562 components: { 18563 'component-select-time' : ComponenstTransactionOptions, 18564 }, 18565 data(){ 18566 return { 18567 store_close : false, 18568 time_required : false, 18569 time_required_message : '', 18570 time_selection : 1, 18571 seen: false 18572 }; 18573 }, 18574 mounted () { 18575 // 18576 }, 18577 methods:{ 18578 checkStoreOpen(){ 18579 var $merchant_id = 0; 18580 if ((typeof merchant_id !== "undefined") && ( merchant_id !== null)) { 18581 $merchant_id = merchant_id; 18582 } 18583 var $choosen_delivery = !empty(getCookie('choosen_delivery'))? JSON.parse(getCookie('choosen_delivery')) : [] ; 18584 18585 var $params = { 18586 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18587 'merchant_id' : $merchant_id, 18588 'cart_uuid' : getCookie('cart_uuid'), 18589 'choosen_delivery' : $choosen_delivery, 18590 'lang': document.documentElement.lang 18591 }; 18592 var timenow = getTimeNow(); 18593 $params = JSON.stringify($params); 18594 18595 ajax_request[timenow] = $.ajax({ 18596 url: ajaxurl+"/checkStoreOpen", 18597 method: "PUT", 18598 dataType: "json", 18599 data: $params , 18600 contentType : $content_type.json , 18601 timeout: $timeout, 18602 crossDomain: true, 18603 beforeSend: data => { 18604 if(ajax_request[timenow] != null) { 18605 ajax_request[timenow].abort(); 18606 } 18607 } 18608 }).done( data => { 18609 if(data.code==1){ 18610 if(data.details.merchant_open_status<=0){ 18611 this.store_close = true; 18612 vue_cart.error.push(data.msg); 18613 } else { 18614 this.store_close = false; 18615 } 18616 18617 this.time_required = data.details.time_required; 18618 this.time_selection = data.details.time_selection; 18619 18620 if(this.time_required){ 18621 vue_cart.error.push(data.details.time_required_message); 18622 } 18623 18624 if(data.details.time_already_passed){
18625 setCookie('choosen_delivery', [] ,30); 18626 } 18627 } else { 18628 this.store_close = true; 18629 vue_cart.error.push(data.msg); 18630 } 18631 }).always( data => { 18632 18633 }); 18634 }, 18635 show(){ 18636 this.$refs.select_time.show(); 18637 }, 18638 hidethis(){ 18639 this.seen = true; 18640 }, 18641 afterSaveTransOptions(data){ 18642 this.$refs.select_time.close(); 18643 18644 if ((typeof vm_feed !== "undefined") && ( vm_feed !== null)) { 18645 vm_feed.whento_deliver = data.whento_deliver; 18646 vm_feed.delivery_date = data.delivery_date; 18647 vm_feed.delivery_time = data.delivery_time; 18648 vm_feed.Search(false); 18649 } 18650 18651 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 18652 vue_cart.loadcart(); 18653 } 18654 18655 if ((typeof vm_widget_nav !== "undefined") && ( vm_widget_nav !== null)) { 18656 vm_widget_nav.$refs.transaction_info.whento_deliver = data.whento_deliver; 18657 vm_widget_nav.$refs.transaction_info.delivery_datetime = data.delivery_datetime; 18658 } 18659 18660 }, 18661 storeAvailable(){ 18662 18663 var $merchant_uuid = ''; 18664 if ((typeof merchant_uuid !== "undefined") && ( merchant_uuid !== null)) { 18665 $merchant_uuid = merchant_uuid; 18666 } 18667 18668 axios({ 18669 method: 'POST', 18670 url: ajaxurl +"/storeAvailable" , 18671 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&merchant_uuid=" + $merchant_uuid, 18672 timeout: $timeout, 18673 }).then( response => { 18674 if(response.data.code==1){ 18675 // 18676 } else { 18677 vue_cart.error.push(response.data.msg); 18678 } 18679 }).catch(error => { 18680 // 18681 }).then(data => { 18682 18683 }); 18684 }, 18685 }, 18686 }).mount('#vue-schedule-order'); 18687 18688 18689 /* 18690 UTENSILS 18691 vue-utensils 18692 */ 18693 const vm_utensils = Vue.createApp({ 18694 data(){ 18695 return { 18696 visible : false, 18697 include_utensils : false, 18698 is_loading : false, 18699 }; 18700 }, 18701 watch: { 18702 include_utensils(new_value,old_value){ 18703 setStorage('include_utensils',new_value); 18704 this.setUtensils(new_value); 18705 } 18706 }, 18707 mounted () { 18708 this.setUtensils( getStorage("include_utensils") ); 18709 }, 18710 methods : { 18711 setTransaction(trans_type){ 18712 if(trans_type=="delivery"){ 18713 this.visible = true; 18714 } else this.visible = false; 18715 }, 18716 setUtensils(is_include){ 18717 is_include = empty(is_include)? false : is_include; 18718 this.include_utensils = is_include; 18719 }, 18720 } 18721 }).mount('#vue-utensils'); 18722 18723 18724 /* 18725 COMPONENTS ITEM SUGGESTION 18726 */ 18727 const ComponentsItemSuggestion = { 18728 props: ['title','merchant_id','settings','image_use' , 'responsive', 'category_id'], 18729 components : { 18730 'money-format': ComponentsMoney, 18731 }, 18732 data(){ 18733 return { 18734 owl : undefined, 18735 menu_data: [], 18736 items : [], 18737 item_addons : [], 18738 item_addons_load : false, 18739 size_id : 0, 18740 disabled_cart : true, 18741 item_qty : 1, 18742 item_total : 0, 18743 add_to_cart : false, 18744 meta : [], 18745 special_instructions : '', 18746 sold_out_options : [], 18747 if_sold_out : 'substitute', 18748 transaction_type : '', 18749 item_loading :false, 18750 item_gallery : [], 18751 image_featured : '', 18752 money_config : '', 18753 showText: null, 18754 isFirstSlide: true, 18755 isLastSlide: false, 18756 }; 18757 }, 18758 mounted () { 18759 this.itemSuggestion(); 18760 }, 18761 updated () { 18762 if(this.item_addons_load==true){ 18763 this.ItemSummary(); 18764 $('.item_s .lazy').each(function(index, $obj){ 18765 if ( !empty($(this).attr("src")) && !empty($(this).attr("data-src")) ){ 18766 $(this).attr("src", $(this).attr("data-src") ); 18767 } 18768 }); 18769 } 18770 18771 if ((typeof vm_checkout_transaction !== "undefined") && ( vm_checkout_transaction !== null)) { 18772 this.transaction_type = vm_checkout_transaction.transaction_type; 18773 } 18774 18775 }, // 18776 computed: { 18777 getItemGallery(){ 18778 return this.item_gallery; 18779 } 18780 }, 18781 methods: { 18782 toggleText(idx) { 18783 this.showText === idx ? this.showText = null : this.showText = idx 18784 }, 18785 itemSuggestion(){ 18786 let currency_code = getCookie('currency_code'); 18787 currency_code = !empty(currency_code)?currency_code:''; 18788 var $params = { 18789 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18790 'merchant_id' : this.merchant_id, 18791 'category_id' : this.category_id, 18792 'image_use' : this.image_use, 18793 'currency_code': currency_code 18794 }; 18795 var timenow = getTimeNow(); 18796 $params = JSON.stringify($params); 18797 ajax_request[timenow] = $.ajax({ 18798 url: ajaxurl+"/geStoreMenu", 18799 method: "PUT", 18800 dataType: "json", 18801 data: $params , 18802 contentType : $content_type.json , 18803 timeout: $timeout, 18804 crossDomain: true, 18805 beforeSend: data => { 18806 this.is_loading = true; 18807 if(ajax_request[timenow] != null) { 18808 ajax_request[timenow].abort(); 18809 } 18810 } 18811 }).done( data => { 18812 if ( data.code==1){ 18813 var $category = data.details.data.category; 18814 var $items = data.details.data.items; 18815 var $new_category = []; var $new_items = []; 18816 18817 /*if($category.length>0){ 18818 $.each($category, function(key, val){
18819 $.each(val.items, function(items_key, $item_id){ 18820 $new_items.push( $items[$item_id] ); 18821 }); // loop 18822 $new_category.push({ 18823 'cat_id': val.cat_id, 18824 'category_name': val.category_name, 18825 'category_description': val.category_description, 18826 'category_information': val.category_information, 18827 'category_image': val.url_image, 18828 'category_uiid': val.category_uiid, 18829 'items':$new_items 18830 }); 18831 $new_items = []; 18832 }); // loop 18833 }*/ 18834 18835 $new_category.push({ 18836 'cat_id': 1, 18837 'category_name': 1, 18838 'category_uiid': 1, 18839 'items':$items 18840 }); 18841 18842 this.menu_data = $new_category; 18843 18844 setTimeout(() => { 18845 this.RenderCarousel(); 18846 }, 10); 18847 18848 } else this.menu_data = []; 18849 }).always( data => { 18850 this.is_loading = false; 18851 }); 18852 }, 18853 RenderCarousel(){ 18854 let $is_rtl = false; 18855 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 18856 $is_rtl = is_rtl=='1'?true:false; 18857 } 18858 this.owl = $("#item-suggestion-list").owlCarousel({ 18859 items: parseInt(this.settings.items), 18860 lazyLoad: this.settings.lazyLoad=="1"?true:false , 18861 loop: this.settings.loop=="1"?true:false , 18862 margin: parseInt(this.settings.margin) , 18863 nav: this.settings.nav=="1"?true:false , 18864 dots: this.settings.dots=="1"?true:false , 18865 stagePadding: parseInt(this.settings.stagePadding), 18866 autoWidth:true, 18867 rtl : $is_rtl, 18868 onChanged: (event) => { 18869 this.updateCarouselNav(event); 18870 } 18871 }); 18872 }, 18873 updateCarouselNav(event) { 18874 const current = event.item.index; 18875 const count = event.item.count; 18876 //const visible = event.page?.size || this.settings.items; 18877 const visible = $("#item-suggestion-list .owl-item.active").length - 1; 18878 this.isFirstSlide = current === 0; 18879 this.isLastSlide = (current + visible) >= count; 18880 }, 18881 SlideNext(){ 18882 this.owl.trigger('next.owl.carousel'); 18883 if (!this.isLastSlide) { 18884 $('#item-suggestion-list').trigger('next.owl.carousel'); 18885 } 18886 }, 18887 SlidePrev(){ 18888 this.owl.trigger('prev.owl.carousel', [300]); 18889 if (!this.isFirstSlide) { 18890 $('#item-suggestion-list').trigger('prev.owl.carousel'); 18891 } 18892 }, 18893 viewItem(data){ 18894 this.item_loading = true; 18895 NProgress.start(); 18896 18897 let currency_code = getCookie('currency_code'); 18898 currency_code = !empty(currency_code)?currency_code:''; 18899 18900 var $params = { 18901 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 18902 'merchant_id': this.merchant_id, 18903 'item_uuid' : data.item_uuid, 18904 'cat_id' : data.cat_id, 18905 'currency_code': currency_code, 18906 'lang': document.documentElement.lang 18907 }; 18908 var timenow = 1; 18909 $params = JSON.stringify($params); 18910 18911 ajax_request[timenow] = $.ajax({ 18912 url: ajaxurl+"/getMenuItem", 18913 method: "PUT", 18914 dataType: "json", 18915 data: $params , 18916 contentType : $content_type.json , 18917 timeout: $timeout, 18918 crossDomain: true, 18919 beforeSend: data => { 18920 if(ajax_request[timenow] != null) { 18921 ajax_request[timenow].abort(); 18922 } 18923 } 18924 }).done( data => { 18925 18926 if(data.code==1){ 18927 18928 $global_items = data.details.data.items; 18929 $global_addons = data.details.data.addons; 18930 $global_addon_items = data.details.data.addon_items; 18931 $global_item_addons = data.details.data.items.item_addons; 18932 18933 this.money_config = data.details.money_config; 18934 this.item_gallery = data.details.data.meta.item_gallery; 18935 this.image_featured = ''; 18936 this.renderGallery(); 18937 18938 var $meta = data.details.data.meta; 18939 var $meta_details = data.details.data.meta_details; 18940 var $new_meta = { 18941 'cooking_ref' : [], 18942 'ingredients' : [], 18943 'dish' : [], 18944 }; 18945 18946 let $ingredients_preselected = data.details.data.items.ingredients_preselected; 18947 18948 if( !empty($meta)){ 18949 $.each($meta,function(key, item) { 18950 $.each(item,function(key2, item2) { 18951 if(!empty($meta_details[key])){ 18952 if(!empty($meta_details[key][item2])){ 18953 let $defaul_check = false;
18954 if(key=="ingredients" && $ingredients_preselected){ 18955 $defaul_check = true; 18956 } 18957 $new_meta[key].push({ 18958 'meta_id': $meta_details[key][item2].meta_id, 18959 'meta_name': $meta_details[key][item2].meta_name, 18960 'checked': $defaul_check 18961 }); 18962 } 18963 } 18964 }); 18965 }); 18966 } 18967 18968 var $price = $global_items.price; 18969 var $size_id = Object.keys($price)[0]; 18970 18971 this.item_qty = 1; 18972 this.service = getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery'; 18973 this.items = $global_items; 18974 this.size_id = $size_id; 18975 this.meta = $new_meta; 18976 this.getSizeData($size_id); 18977 this.sold_out_options = data.details.sold_out_options; 18978 18979 $( this.$refs.modal_item_details ).modal('show'); 18980 this.updateImage(); 18981 18982 } /*end if*/ 18983 18984 }).always( data => { 18985 this.item_loading = false; 18986 NProgress.done(); 18987 }); 18988 }, 18989 renderGallery(){ 18990 setTimeout(() => { 18991 let $is_rtl = false; 18992 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 18993 $is_rtl = is_rtl=='1'?true:false; 18994 } 18995 $(this.$refs.owl_item_gallery).owlCarousel({ 18996 loop:false, 18997 margin:10, 18998 nav:false, 18999 dots:false, 19000 rtl : $is_rtl, 19001 responsive:{ 19002 0:{ 19003 items:1 19004 }, 19005 600:{ 19006 items:3 19007 }, 19008 1000:{ 19009 items:5 19010 } 19011 } 19012 }); 19013 }, 10); 19014 }, 19015 setImage(data){ 19016 this.image_featured = data; 19017 }, 19018 updateImage(){ 19019 updateLazyImage(); 19020 }, 19021 setItemSize(event){ 19022 var $size_id = event.currentTarget.firstElementChild.value; 19023 this.size_id = $size_id;
19024 this.getSizeData($size_id); 19025 }, // end setItemSize 19026 getSizeData($size_id){ 19027 var item_size_id = $global_items.price[$size_id].size_id; 19028 $new_item_addons = []; var $sub_items=[]; 19029 if( !empty($global_item_addons[$size_id]) ){ 19030 $.each($global_item_addons[$size_id],function(key, item) { 19031 if(!empty($global_addons[$size_id])){ 19032 if(!empty($global_addons[$size_id][item])){ 19033 $global_addons[$size_id][item].subcat_id 19034 $.each($global_addons[$size_id][item].sub_items,function(key2, item2) { 19035 if ((typeof $global_addon_items[item2] !== "undefined") && ( $global_addon_items[item2] !== null)) { 19036 $sub_items.push({ 19037 'sub_item_id':$global_addon_items[item2].sub_item_id, 19038 'sub_item_name':$global_addon_items[item2].sub_item_name, 19039 'item_description':$global_addon_items[item2].item_description, 19040 //'price':$global_addon_items[item2].price, 19041 //'pretty_price':$global_addon_items[item2].pretty_price, 19042 'price':$global_addon_items[item2].addon_price != '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 19043 'pretty_price':$global_addon_items[item2].addon_price!= '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 19044 'checked':false, 19045 'disabled':false, 19046 'qty':1 19047 }); 19048 } 19049 }); 19050 19051 $new_item_addons.push({ 19052 'subcat_id' : $global_addons[$size_id][item].subcat_id, 19053 'subcategory_name' : $global_addons[$size_id][item].subcategory_name, 19054 'subcategory_description' : $global_addons[$size_id][item].subcategory_description, 19055 'multi_option' : $global_addons[$size_id][item].multi_option, 19056 'multi_option_min' : $global_addons[$size_id][item].multi_option_min, 19057 'multi_option_value' : $global_addons[$size_id][item].multi_option_value, 19058 'require_addon' : $global_addons[$size_id][item].require_addon, 19059 'pre_selected' : $global_addons[$size_id][item].pre_selected, 19060 'sub_items_checked': $global_addons[$size_id][item].multi_option == "one" ? $sub_items[0].sub_item_id : '', 19061 'sub_items':$sub_items 19062 }); 19063 $sub_items = [] ; 19064 } 19065 } 19066 }); 19067 } 19068 19069 this.item_addons = $new_item_addons; 19070 this.item_addons_load = true; 19071 }, // end getSizeData 19072 19073 ItemSummary(data){ 19074 $item_total = 0; 19075 var $required_addon = []; 19076 var $required_addon_added = []; 19077 let $min_addon = []; 19078 let $min_addon_added = []; 19079 19080 if(!empty(this.items.price)){ 19081 if(!empty(this.items.price[this.size_id])){ 19082 var item = this.items.price[this.size_id]; 19083 if( item.discount>0){ 19084 $item_total+=( this.item_qty * parseFloat(item.price_after_discount) ); 19085 } else $item_total+=( this.item_qty * parseFloat(item.price) ); 19086 } 19087 } 19088 19089 dump("item_total=>" + $item_total); 19090 19091 this.item_addons.forEach((item,index) => { 19092 19093 //dump("=>" + item.multi_option); 19094 if ( item.require_addon==1){ 19095 $required_addon.push(item.subcat_id); 19096 } 19097 19098 if(item.multi_option=="custom"){ 19099 var total_check = 0; 19100 let multi_option_min = item.multi_option_min; 19101 var multi_option_value = item.multi_option_value; 19102 var item_index=[]; var item_index2=[]; 19103 19104 if(multi_option_value>0){ 19105 $min_addon.push({ 19106 'subcat_id': item.subcat_id, 19107 'min':multi_option_min, 19108 'max':multi_option_value 19109 }); 19110 } 19111 19112 item.sub_items.forEach((item2,index2) => { 19113 if(item2.checked==true){ 19114 total_check++; 19115 $item_total+=( this.item_qty * parseFloat(item2.price) ); 19116 $required_addon_added.push( item.subcat_id ); 19117 } else item_index.push(index2); 19118 19119 if(item2.disabled==true){ 19120 item_index2.push(index2); 19121 } 19122 19123 }) 19124 19125 $min_addon_added[item.subcat_id] = { 19126 'total' : total_check 19127 }; 19128 19129 if(total_check>=multi_option_value){ 19130 item_index.forEach((item3,index3) => { 19131 this.item_addons[index].sub_items[item3].disabled = true; 19132 }); 19133 } else { 19134 item_index2.forEach((item3,index3) => { 19135 this.item_addons[index].sub_items[item3].disabled = false;
19136 }); 19137 } 19138 19139 } else if ( item.multi_option=="one" ){ 19140 item.sub_items.forEach((item2,index2) => { 19141 if( item2.sub_item_id == item.sub_items_checked ) { 19142 $item_total+=( this.item_qty * parseFloat(item2.price) ); 19143 $required_addon_added.push( item.subcat_id ); 19144 } 19145 }); 19146 } else if ( item.multi_option=="multiple" ){ 19147 19148 var item_index=[]; 19149 let multi_option_min = item.multi_option_min; 19150 var multi_option_value = item.multi_option_value; 19151 var limit = 0; 19152 19153 if(multi_option_value>0){ 19154 $min_addon.push({ 19155 'subcat_id': item.subcat_id, 19156 'min':multi_option_min, 19157 'max':multi_option_value 19158 }); 19159 } 19160 19161 item.sub_items.forEach((item2,index2) => { 19162 if(item2.checked==true){ 19163 $item_total+=( item2.qty * parseFloat(item2.price) ); 19164 $required_addon_added.push( item.subcat_id ); 19165 limit += item2.qty; 19166 } 19167 item_index.push(index2); 19168 }); 19169 19170 $min_addon_added[item.subcat_id] = { 19171 'total' : limit 19172 }; 19173 19174 this.item_addons[index].qty_selected =limit; 19175 if ( this.item_addons[index].qty_selected>= multi_option_value){ 19176 item_index.forEach((item3,index2) => { 19177 this.item_addons[index].sub_items[item3].disabled = true; 19178 }); 19179 } else { 19180 item_index.forEach((item3,index2) => { 19181 this.item_addons[index].sub_items[item3].disabled = false; 19182 }); 19183 } 19184 19185 19186 } /*endif custom*/ 19187 19188 });/* end loop*/ 19189 19190 19191 this.item_total = $item_total; 19192 19193 var $required_meet=true; 19194 if($required_addon.length>0){ 19195 $.each($required_addon, function(i, val){ 19196 if($required_addon_added.includes(val)===false){ 19197 $required_meet = false; 19198 return false; 19199 } 19200 }); 19201 } 19202 19203 // CHECK COOKING REF 19204 if(this.items.cooking_ref_required){ 19205 let $cooking_ref_check = false; 19206 if (Object.keys(this.meta.cooking_ref).length > 0) { 19207 Object.entries(this.meta.cooking_ref).forEach(([cooking_key, cooking_items]) => { 19208 if(cooking_items.checked){ 19209 $cooking_ref_check = true; 19210 } 19211 }); 19212 } 19213 if(!$cooking_ref_check){ 19214 $required_meet = false; 19215 } 19216 } 19217 19218 if (Object.keys($min_addon).length > 0) { 19219 let min_value,min_selected; 19220 Object.entries($min_addon).forEach(([key_min_addon, items_min_addon]) => { 19221 min_value = parseInt(items_min_addon.min); 19222 if($min_addon_added[items_min_addon.subcat_id]){ 19223 min_selected = parseInt($min_addon_added[items_min_addon.subcat_id].total); 19224 } 19225 if(min_selected>0){ 19226 if(min_value>min_selected){ 19227 $required_meet = false; 19228 } 19229 } 19230 }); 19231 } 19232 19233 if($required_meet){ 19234 this.disabled_cart = false; 19235 } else this.disabled_cart = true; 19236 19237 }, // end ItemSummary 19238 19239 CheckaddCartItems(){ 19240 this.addCartItems(); 19241 }, 19242 19243 addCartItems(event){ 19244 if (event) { 19245 event.preventDefault() 19246 } 19247 19248 this.add_to_cart = true; 19249 19250 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 19251 19252 try { 19253 if(empty(transactionType)){ 19254 if ((typeof vm_merchant_details.$refs.ref_services !== "undefined") && ( vm_merchant_details.$refs.ref_services !== null)) { 19255 transactionType = vm_merchant_details.$refs.ref_services.transaction; 19256 } else if ( (typeof vm_merchant_details.$refs.ref_location_services !== "undefined") && ( vm_merchant_details.$refs.ref_location_services !== null) ){ 19257 transactionType = vm_merchant_details.$refs.ref_location_services.transaction_type; 19258 } 19259 } 19260 } catch(err){} 19261 19262 var $params = { 19263 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 19264 'merchant_id' : this.items.merchant_id, 19265 'cat_id' : this.items.cat_id, 19266 'item_token': this.items.item_token, 19267 'item_size_id': this.size_id,
19268 'item_qty': this.item_qty, 19269 'item_addons': this.item_addons, 19270 'special_instructions': this.special_instructions, 19271 'meta' : this.meta, 19272 'cart_uuid':getCookie('cart_uuid'), 19273 'transaction_type': transactionType , 19274 'if_sold_out' : this.if_sold_out, 19275 }; 19276 19277 var timenow = 1; 19278 $params = JSON.stringify($params); 19279 19280 ajax_request[timenow] = $.ajax({ 19281 url: ajaxurl+"/addCartItems", 19282 method: "PUT", 19283 dataType: "json", 19284 data: $params , 19285 contentType : $content_type.json , 19286 timeout: $timeout, 19287 crossDomain: true, 19288 beforeSend: function( xhr ) { 19289 if(ajax_request[timenow] != null) { 19290 ajax_request[timenow].abort(); 19291 } 19292 } 19293 }); 19294 19295 ajax_request[timenow].done( data => { 19296 if ( data.code==1){ 19297 $( this.$refs.modal_item_details ).modal('hide'); 19298 vue_cart.loadcart(); 19299 } 19300 }); 19301 19302 ajax_request[timenow].always( data => { 19303 this.add_to_cart = false; 19304 }); 19305 19306 } // end addCartItems 19307 // 19308 19309 }, 19310 template: '#item_suggestion', 19311 }; 19312 19313 /* 19314 ITEM SUGGESTION 19315 vue-item-suggestion 19316 vm_item_suggestion 19317 */ 19318 const app_item_suggestion = Vue.createApp({ 19319 components: { 19320 'components-item-suggestion' : ComponentsItemSuggestion 19321 }, 19322 data(){ 19323 return { 19324 data : [] 19325 }; 19326 }, 19327 }) 19328 app_item_suggestion.use(ElementPlus); 19329 const vm_item_suggestion = app_item_suggestion.mount('#vue-item-suggestion'); 19330 19331 19332 19333 // NEW 19334 const app_item_featured_suggestion = Vue.createApp({ 19335 components: { 19336 'components-item-featured-suggestion' : ComponentsItemFeaturedSuggestion 19337 }, 19338 data(){ 19339 return { 19340 data : [] 19341 }; 19342 }, 19343 }) 19344 app_item_featured_suggestion.use(ElementPlus); 19345 const vm_item_featured_suggestion = app_item_featured_suggestion.mount('#vue-item-featured-suggestion'); 19346 19347 //NEW COMPONENT 19348 /* 19349 COMPONENTS ITEM FROM CATEGORY 19350 */ 19351 const ComponentsItemCategories = { 19352 props: ['title','merchant_id', 'category_id', 'settings','image_use' , 'responsive'], 19353 components : { 19354 'money-format': ComponentsMoney, 19355 }, 19356 data(){ 19357 return { 19358 owl : undefined, 19359 menu_data: [], 19360 items : [], 19361 item_addons : [], 19362 item_addons_load : false, 19363 size_id : 0, 19364 disabled_cart : true, 19365 item_qty : 1, 19366 item_total : 0, 19367 add_to_cart : false, 19368 meta : [], 19369 special_instructions : '', 19370 sold_out_options : [], 19371 if_sold_out : 'substitute', 19372 transaction_type : '', 19373 service:'', 19374 items_not_available : [], 19375 category_not_available : [], 19376 showText: null, 19377 allergen : [], 19378 allergen_data : [], 19379 allergenData : [] 19380 }; 19381 }, 19382 mounted () { 19383 this.itemSuggestion(); 19384 }, 19385 updated () { 19386 if(this.item_addons_load==true){ 19387 this.ItemSummary(); 19388 $('.item_s .lazy').each(function(index, $obj){ 19389 if ( !empty($(this).attr("src")) && !empty($(this).attr("data-src")) ){ 19390 $(this).attr("src", $(this).attr("data-src") ); 19391 } 19392 }); 19393 } 19394 if ((typeof vm_checkout_transaction !== "undefined") && ( vm_checkout_transaction !== null)) { 19395 this.transaction_type = vm_checkout_transaction.transaction_type; 19396 } 19397 }, // 19398 methods: { 19399 toggleText(idx) { 19400 this.showText === idx ? this.showText = null : this.showText = idx 19401 }, 19402 itemSuggestion(){ 19403 var $params = { 19404 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 19405 'merchant_id' : this.merchant_id, 19406 'cat_id' : this.category_id, 19407 'image_use' : this.image_use, 19408 'lang': document.documentElement.lang 19409 }; 19410 var timenow = getTimeNow(); 19411 $params = JSON.stringify($params); 19412 ajax_request[timenow] = $.ajax({ 19413 url: ajaxurl+"/geStoreMenuByCategory", 19414 method: "PUT", 19415 dataType: "json", 19416 data: $params , 19417 contentType : $content_type.json , 19418 timeout: $timeout, 19419 crossDomain: true, 19420 beforeSend: data => { 19421 this.is_loading = true; 19422 if(ajax_request[timenow] != null) { 19423 ajax_request[timenow].abort(); 19424 } 19425 } 19426 }).done( data => { 19427 if ( data.code==1){ 19428 var $category = data.details.data.category; 19429 var $items = data.details.data.items; 19430 var $new_category = []; var $new_items = []; 19431 this.category_not_available = data.details.data.category_not_available; 19432 $new_category.push({ 19433 'cat_id': $category.cat_id, 19434 'category_name': $category.category_name, 19435 'category_description': $category.category_description, 19436 'category_information': $category.category_information, 19437 'category_image': $category.url_image, 19438 'category_uiid': $category.category_uiid, 19439 'items':$items 19440 }); 19441 this.menu_data = $new_category; 19442 19443 } else this.menu_data = []; 19444 }).always( data => { 19445 this.is_loading = false;
19446 }); 19447 }, 19448 itemAvailable(item_id,cat_id){ 19449 console.log(this.items_not_available); 19450 if(this.items_not_available.includes(parseInt(item_id))===false){ 19451 if(this.category_not_available.includes(parseInt(cat_id))===false){ 19452 return true; 19453 } 19454 } 19455 return false; 19456 }, 19457 viewItem(data){ 19458 var $params = { 19459 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 19460 'merchant_id': this.merchant_id, 19461 'item_uuid' : data.item_uuid, 19462 'cat_id' : data.cat_id, 19463 'lang': document.documentElement.lang 19464 }; 19465 var timenow = 1; 19466 $params = JSON.stringify($params); 19467 19468 //category page 19469 ajax_request[timenow] = $.ajax({ 19470 url: ajaxurl+"/getMenuItem", 19471 method: "PUT", 19472 dataType: "json", 19473 data: $params , 19474 contentType : $content_type.json , 19475 timeout: $timeout, 19476 crossDomain: true, 19477 beforeSend: data => { 19478 if(ajax_request[timenow] != null) { 19479 ajax_request[timenow].abort(); 19480 } 19481 } 19482 }).done( data => { 19483 if(data.code==1){ 19484 $global_items = data.details.data.items; 19485 $global_addons = data.details.data.addons; 19486 $global_addon_items = data.details.data.addon_items; 19487 $global_item_addons = data.details.data.items.item_addons; 19488 var $meta = data.details.data.meta; 19489 var $meta_details = data.details.data.meta_details; 19490 var $new_meta = { 19491 'cooking_ref' : [], 19492 'ingredients' : [], 19493 'dish' : [], 19494 }; 19495 19496 let $ingredients_preselected = data.details.data.items.ingredients_preselected; 19497 19498 if( !empty($meta)){ 19499 $.each($meta,function(key, item) { 19500 $.each(item,function(key2, item2) { 19501 if(!empty($meta_details[key])){ 19502 if(!empty($meta_details[key][item2])){ 19503 let $defaul_check = false; 19504 if(key=="ingredients" && $ingredients_preselected){ 19505 $defaul_check = true; 19506 } 19507 $new_meta[key].push({ 19508 'meta_id': $meta_details[key][item2].meta_id, 19509 'meta_name': $meta_details[key][item2].meta_name, 19510 'checked': $defaul_check 19511 }); 19512 } 19513 } 19514 }); 19515 }); 19516 } 19517 19518 var $price = $global_items.price; 19519 var $size_id = Object.keys($price)[0]; 19520 19521 this.item_qty = 1; 19522 this.service = getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery'; 19523 this.items = $global_items; 19524 this.size_id = $size_id; 19525 this.meta = $new_meta;
19526 this.getSizeData($size_id); 19527 this.sold_out_options = data.details.sold_out_options; 19528 19529 $( this.$refs.modal_item_details ).modal('show'); 19530 this.updateImage(); 19531 19532 } /*end if*/ 19533 19534 }); 19535 }, 19536 updateImage(){ 19537 updateLazyImage(); 19538 }, 19539 setItemSize(event){ 19540 var $size_id = event.currentTarget.firstElementChild.value; 19541 this.size_id = $size_id; 19542 this.getSizeData($size_id); 19543 }, // end setItemSize 19544 //category page 19545 getSizeData($size_id){ 19546 var item_size_id = $global_items.price[$size_id].size_id; 19547 $new_item_addons = []; var $sub_items=[]; 19548 19549 if( !empty($global_item_addons[$size_id]) ){ 19550 $.each($global_item_addons[$size_id],function(key, item) { 19551 if(!empty($global_addons[$size_id])){ 19552 if(!empty($global_addons[$size_id][item])){ 19553 19554 $global_addons[$size_id][item].subcat_id 19555 $.each($global_addons[$size_id][item].sub_items,function(key2, item2) { 19556 if ((typeof $global_addon_items[item2] !== "undefined") && ( $global_addon_items[item2] !== null)) { 19557 $sub_items.push({ 19558 'sub_item_id':$global_addon_items[item2].sub_item_id, 19559 'sub_item_name':$global_addon_items[item2].sub_item_name, 19560 'item_description':$global_addon_items[item2].item_description, 19561 //'price':$global_addon_items[item2].price, 19562 //'pretty_price':$global_addon_items[item2].pretty_price, 19563 'price':$global_addon_items[item2].addon_price != '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 19564 'pretty_price':$global_addon_items[item2].addon_price!= '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 19565 'checked':false, 19566 'disabled':false, 19567 'qty':1 19568 }); 19569 } 19570 }); 19571 19572 $new_item_addons.push({ 19573 'subcat_id' : $global_addons[$size_id][item].subcat_id, 19574 'subcategory_name' : $global_addons[$size_id][item].subcategory_name, 19575 'subcategory_description' : $global_addons[$size_id][item].subcategory_description, 19576 'multi_option' : $global_addons[$size_id][item].multi_option, 19577 'multi_option_value' : $global_addons[$size_id][item].multi_option_value, 19578 'require_addon' : $global_addons[$size_id][item].require_addon, 19579 'pre_selected' : $global_addons[$size_id][item].pre_selected, 19580 'sub_items_checked': $global_addons[$size_id][item].multi_option == "one" ? $sub_items[0].sub_item_id : '', 19581 'sub_items':$sub_items 19582 }); 19583 $sub_items = [] ; 19584 } 19585 } 19586 }); 19587 } 19588 19589 this.item_addons = $new_item_addons; 19590 this.item_addons_load = true; 19591 }, // end getSizeData 19592 ItemSummary(data){ 19593 $item_total = 0; 19594 var $required_addon = []; 19595 var $required_addon_added = []; 19596 19597 if(!empty(this.items.price)){ 19598 if(!empty(this.items.price[this.size_id])){ 19599 var item = this.items.price[this.size_id]; 19600 if( item.discount>0){ 19601 $item_total+=( this.item_qty * parseFloat(item.price_after_discount) ); 19602 } else $item_total+=( this.item_qty * parseFloat(item.price) ); 19603 } 19604 } 19605 19606 dump("item_total=>" + $item_total); 19607 19608 this.item_addons.forEach((item,index) => { 19609 19610 //dump("=>" + item.multi_option); 19611 if ( item.require_addon==1){ 19612 $required_addon.push(item.subcat_id); 19613 } 19614 19615 if(item.multi_option=="custom"){ 19616 var total_check = 0; 19617 var multi_option_value = item.multi_option_value; 19618 var item_index=[]; var item_index2=[]; 19619 item.sub_items.forEach((item2,index2) => { 19620 if(item2.checked==true){ 19621 total_check++; 19622 $item_total+=( this.item_qty * parseFloat(item2.price) ); 19623 $required_addon_added.push( item.subcat_id ); 19624 } else item_index.push(index2); 19625 19626 if(item2.disabled==true){ 19627 item_index2.push(index2); 19628 } 19629 19630 }) 19631 if(total_check>=multi_option_value){ 19632 item_index.forEach((item3,index3) => { 19633 this.item_addons[index].sub_items[item3].disabled = true; 19634 }); 19635 } else { 19636 item_index2.forEach((item3,index3) => { 19637 this.item_addons[index].sub_items[item3].disabled = false;
19638 }); 19639 } 19640 19641 } else if ( item.multi_option=="one" ){ 19642 item.sub_items.forEach((item2,index2) => { 19643 if( item2.sub_item_id == item.sub_items_checked ) { 19644 $item_total+=( this.item_qty * parseFloat(item2.price) ); 19645 $required_addon_added.push( item.subcat_id ); 19646 } 19647 }); 19648 } else if ( item.multi_option=="multiple" ){ 19649 item.sub_items.forEach((item2,index2) => { 19650 if(item2.checked==true){ 19651 $item_total+=( item2.qty * parseFloat(item2.price) ); 19652 $required_addon_added.push( item.subcat_id ); 19653 } 19654 }); 19655 } /*endif custom*/ 19656 19657 });/* end loop*/ 19658 19659 19660 this.item_total = $item_total; 19661 19662 var $required_meet=true; 19663 if($required_addon.length>0){ 19664 $.each($required_addon, function(i, val){ 19665 if($required_addon_added.includes(val)===false){ 19666 $required_meet = false; 19667 return false; 19668 } 19669 }); 19670 } 19671 19672 // CHECK COOKING REF 19673 if(this.items.cooking_ref_required){ 19674 let $cooking_ref_check = false; 19675 if (Object.keys(this.meta.cooking_ref).length > 0) { 19676 Object.entries(this.meta.cooking_ref).forEach(([cooking_key, cooking_items]) => { 19677 if(cooking_items.checked){ 19678 $cooking_ref_check = true; 19679 } 19680 }); 19681 } 19682 if(!$cooking_ref_check){ 19683 $required_meet = false; 19684 } 19685 } 19686 19687 if($required_meet){ 19688 this.disabled_cart = false; 19689 } else this.disabled_cart = true; 19690 19691 }, // end ItemSummary 19692 CheckaddCartItems(){ 19693 this.addCartItems(); 19694 }, 19695 addCartItems(event){ 19696 if (event) { 19697 event.preventDefault() 19698 } 19699 this.add_to_cart = true; 19700 19701 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 19702 19703 try { 19704 if(empty(transactionType)){ 19705 if ((typeof vm_merchant_details.$refs.ref_services !== "undefined") && ( vm_merchant_details.$refs.ref_services !== null)) { 19706 transactionType = vm_merchant_details.$refs.ref_services.transaction; 19707 } else if ( (typeof vm_merchant_details.$refs.ref_location_services !== "undefined") && ( vm_merchant_details.$refs.ref_location_services !== null) ){ 19708 transactionType = vm_merchant_details.$refs.ref_location_services.transaction_type; 19709 } 19710 } 19711 } catch(err){} 19712 19713 var $params = { 19714 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 19715 'merchant_id' : this.items.merchant_id, 19716 'cat_id' : this.items.cat_id, 19717 'item_token': this.items.item_token, 19718 'item_size_id': this.size_id, 19719 'item_qty': this.item_qty, 19720 'item_addons': this.item_addons, 19721 'special_instructions': this.special_instructions, 19722 'meta' : this.meta, 19723 'cart_uuid':getCookie('cart_uuid'), 19724 'transaction_type': transactionType, 19725 'if_sold_out' : this.if_sold_out, 19726 }; 19727 19728 var timenow = 1; 19729 $params = JSON.stringify($params); 19730 19731 ajax_request[timenow] = $.ajax({ 19732 url: ajaxurl+"/addCartItems", 19733 method: "PUT", 19734 dataType: "json", 19735 data: $params , 19736 contentType : $content_type.json , 19737 timeout: $timeout, 19738 crossDomain: true, 19739 beforeSend: function( xhr ) { 19740 if(ajax_request[timenow] != null) { 19741 ajax_request[timenow].abort(); 19742 } 19743 } 19744 }); 19745 19746 ajax_request[timenow].done( data => { 19747 if ( data.code==1){ 19748 setCookie('cart_uuid',data.details.cart_uuid,30); 19749 $('#itemModal').modal('hide'); 19750 vue_cart.loadcart(); 19751 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 19752 vm_cart_preview.showCartPreview(); 19753 } 19754 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 19755 vm_cart_preview.getCartPreview(); 19756 } 19757 //location.reload(); 19758 } 19759 }); 19760 19761 ajax_request[timenow].always( data => { 19762 this.add_to_cart = false;
19763 }); 19764 19765 }, // end addCartItems 19766 showProductInfo(item_id){ 19767 //$( this.$refs.modal_item_details ).modal('show'); 19768 this.loading = true; 19769 axios({ 19770 method: 'POST', 19771 url: ajaxurl+"/getProductInfo" , 19772 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&item_id=" + item_id + "&merchant_id=1&lang=" + document.documentElement.lang, 19773 timeout: $timeout, 19774 }).then( response => { 19775 if(response.data.code==1){ 19776 this.allergen = response.data.details.allergen; 19777 this.allergen_data = response.data.details.allergen_data; 19778 this.allergenData = response.data.details.result; 19779 } else { 19780 this.allergen = []; 19781 this.allergen_data = []; 19782 } 19783 $( this.$refs.modal_item_allergen ).modal('show'); 19784 }).catch(error => { 19785 // 19786 }).then(data => { 19787 this.loading = false; 19788 }); 19789 }, 19790 }, 19791 template: '#item_suggestion', 19792 }; 19793 19794 /* 19795 ITEM BY CATEGORY PAGE 19796 vue-item-categories 19797 */ 19798 const vm_item_categories = Vue.createApp({ 19799 components: { 19800 'components-item-categories' : ComponentsItemCategories 19801 }, 19802 }).mount('#vue-item-categories'); 19803 19804 19805 /* 19806 Single items WIDGET 19807 */ 19808 const vm_item_widgets = Vue.createApp({ 19809 components: { 19810 'component-category' : componentCategory, 19811 'money-format': ComponentsMoney, 19812 }, 19813 data(){ 19814 return { 19815 menu_data: [], 19816 items : [], 19817 item_addons : [], 19818 item_addons_load : false, 19819 size_id : 0, 19820 disabled_cart : true, 19821 item_qty : 1, 19822 item_total : 0, 19823 add_to_cart : false, 19824 meta : [], 19825 special_instructions : '', 19826 sold_out_options : [], 19827 if_sold_out : 'contact', 19828 transaction_type : '', 19829 visible: true, 19830 money_config : [] 19831 }; 19832 }, 19833 updated () { 19834 if(this.item_addons_load==true){ 19835 this.ItemSummary(); 19836 } 19837 }, 19838 mounted () { 19839 this.getMenuItemById(false); 19840 }, 19841 computed: { 19842 selectedPrice() { 19843 if (!this.items || !this.items.price || !this.size_id) return null; 19844 const selected = Object.values(this.items.price).find( 19845 p => p.item_size_id == this.size_id 19846 ); 19847 return selected ? selected.item_size_id : null; 19848 } 19849 }, 19850 methods :{ 19851 getMenuItemById(){ 19852 var currentUrl = window.location.pathname.split('/'); 19853 var item_slug = currentUrl.pop() || currentUrl.pop(); 19854 var $params = { 19855 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 19856 'merchant_id' : this.merchant_id, 19857 'slug' : item_slug, 19858 'image_use' : this.image_use, 19859 'lang': document.documentElement.lang 19860 }; 19861 var timenow = getTimeNow(); 19862 $params = JSON.stringify($params); 19863 ajax_request[timenow] = $.ajax({ 19864 url: ajaxurl+"/getMenuItemById", 19865 method: "PUT", 19866 dataType: "json", 19867 data: $params , 19868 contentType : $content_type.json , 19869 timeout: $timeout, 19870 crossDomain: true, 19871 beforeSend: data => { 19872 this.is_loading = true; 19873 if(ajax_request[timenow] != null) { 19874 ajax_request[timenow].abort(); 19875 } 19876 } 19877 }).done( data => { 19878 if ( data.code==1){ 19879 this.items = data.details.data.items; 19880 } else this.menu_data = []; 19881 }).always( data => { 19882 this.is_loading = false; 19883 }); 19884 }, 19885 viewItem(data) { 19886 console.log("data", data); 19887 //$('#itemModal').modal('show'); 19888 $(this.$refs.modal_item_details).modal('show'); 19889 19890 var $item_uuid = data.item_uuid; 19891 var $cat_id = data.cat_id; 19892 var $selected_price = data.selected_price; 19893 var $params; 19894 $params="merchant_id=" + 1; 19895 $params+="&item_uuid="+ $item_uuid; 19896 $params+="&cat_id="+ $cat_id; 19897 $params+="&lang="+ document.documentElement.lang; 19898 $params+=addValidationRequest(); 19899 var timenow = 1; 19900 this.item_loading = true; 19901 ajax_request[timenow] = $.ajax({ 19902 url: ajaxurl+"/getMenuItem", 19903 method: "POST", 19904 dataType: "json", 19905 data: $params , 19906 contentType : $content_type.form, 19907 timeout: $timeout, 19908 crossDomain: true, 19909 beforeSend: function( xhr ) { 19910 if(ajax_request[timenow] != null) { 19911 ajax_request[timenow].abort(); 19912 } 19913 } 19914 }); 19915 19916 ajax_request[timenow].done( data => { 19917 $global_items = data.details.data.items; 19918 $global_addons = data.details.data.addons; 19919 $global_addon_items = data.details.data.addon_items; 19920 $global_item_addons = data.details.data.items.item_addons; 19921 19922 var $meta = data.details.data.meta; 19923 this.money_config = data.details.money_config; 19924 var $meta_details = data.details.data.meta_details; 19925 var $new_meta = { 19926 'cooking_ref' : [], 19927 'ingredients' : [], 19928 'dish' : [], 19929 }; 19930 if( !empty($meta)){ 19931 $.each($meta,function(key, item) { 19932 $.each(item,function(key2, item2) { 19933 if(!empty($meta_details[key][item2])){ 19934 $new_meta[key].push({ 19935 'meta_id': $meta_details[key][item2].meta_id, 19936 'meta_name': $meta_details[key][item2].meta_name, 19937 'checked': false 19938 }); 19939 } 19940 }); 19941 }); 19942 } 19943 19944 var $price = $global_items.price; 19945 var $size_id = Object.keys($price)[0]; 19946 19947 //$('#itemModal').modal('show'); 19948 19949 this.item_qty = 1; 19950 this.service = getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery'; 19951 this.items = $global_items; 19952 this.size_id = $size_id; 19953 this.meta = $new_meta; 19954 19955 this.sold_out_options = data.details.sold_out_options; 19956 this.updateImage(); 19957 19958 if($selected_price != null) { 19959 this.setItemSizeM($selected_price); 19960 } else {
19961 this.getSizeData($size_id); 19962 } 19963 }); 19964 19965 ajax_request[timenow].always( data => { 19966 this.item_loading = false; 19967 }); 19968 19969 }, // end viewitem 19970 CheckaddCartItems(){ 19971 this.addCartItems(); 19972 }, 19973 updateImage(){ 19974 updateLazyImage(); 19975 }, 19976 setItemSize(event){ 19977 var $size_id = event.currentTarget.firstElementChild.value; 19978 this.size_id = $size_id; 19979 this.getSizeData($size_id); 19980 }, // end setItemSize 19981 setItemSizeF(event){ 19982 var $size_id = event.currentTarget.firstElementChild.value; 19983 this.size_id = $size_id; 19984 }, // end setItemSize 19985 setItemSizeM(id){ 19986 var $size_id = id; 19987 this.size_id = $size_id; 19988 this.getSizeData($size_id); 19989 }, // end setItemSize 19990 getSizeData($size_id){ 19991 var item_size_id = $global_items.price[$size_id].size_id; 19992 $new_item_addons = []; var $sub_items=[]; 19993 19994 if( !empty($global_item_addons[$size_id]) ){ 19995 $.each($global_item_addons[$size_id],function(key, item) { 19996 if(!empty($global_addons[$size_id])){ 19997 if(!empty($global_addons[$size_id][item])){ 19998 19999 $global_addons[$size_id][item].subcat_id 20000 $.each($global_addons[$size_id][item].sub_items,function(key2, item2) { 20001 if ((typeof $global_addon_items[item2] !== "undefined") && ( $global_addon_items[item2] !== null)) { 20002 $sub_items.push({ 20003 'sub_item_id':$global_addon_items[item2].sub_item_id, 20004 'sub_item_name':$global_addon_items[item2].sub_item_name, 20005 'item_description':$global_addon_items[item2].item_description, 20006 //'price':$global_addon_items[item2].price, 20007 //'pretty_price':$global_addon_items[item2].pretty_price, 20008 'price':$global_addon_items[item2].addon_price != '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 20009 'pretty_price':$global_addon_items[item2].addon_price!= '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 20010 'checked':false, 20011 'disabled':false, 20012 'qty':1 20013 }); 20014 } 20015 }); 20016 $new_item_addons.push({ 20017 'subcat_id' : $global_addons[$size_id][item].subcat_id, 20018 'subcategory_name' : $global_addons[$size_id][item].subcategory_name, 20019 'subcategory_description' : $global_addons[$size_id][item].subcategory_description, 20020 'multi_option' : $global_addons[$size_id][item].multi_option, 20021 'multi_option_value' : $global_addons[$size_id][item].multi_option_value, 20022 'require_addon' : $global_addons[$size_id][item].require_addon, 20023 'pre_selected' : $global_addons[$size_id][item].pre_selected, 20024 'sub_items_checked': $global_addons[$size_id][item].multi_option == "one" ? $sub_items[0].sub_item_id : '', 20025 'sub_items':$sub_items 20026 }); 20027 $sub_items = [] ; 20028 } 20029 } 20030 }); 20031 } 20032 this.item_addons = $new_item_addons; 20033 this.item_addons_load = true; 20034 }, // end getSizeData 20035 ItemSummary(data){ 20036 $item_total = 0; 20037 var $required_addon = []; 20038 var $required_addon_added = []; 20039 20040 if(!empty(this.items.price)){ 20041 if(!empty(this.items.price[this.size_id])){ 20042 var item = this.items.price[this.size_id]; 20043 if( item.discount>0){ 20044 $item_total+=( this.item_qty * parseFloat(item.price_after_discount) ); 20045 } else $item_total+=( this.item_qty * parseFloat(item.price) ); 20046 } 20047 } 20048 20049 this.item_addons.forEach((item,index) => { 20050 //dump("=>" + item.multi_option); 20051 if ( item.require_addon==1){ 20052 $required_addon.push(item.subcat_id); 20053 } 20054 20055 if(item.multi_option=="custom"){ 20056 var total_check = 0; 20057 var multi_option_value = item.multi_option_value; 20058 var item_index=[]; var item_index2=[];
20059 item.sub_items.forEach((item2,index2) => { 20060 if(item2.checked==true){ 20061 total_check++; 20062 $item_total+=( this.item_qty * parseFloat(item2.price) ); 20063 $required_addon_added.push( item.subcat_id ); 20064 } else item_index.push(index2); 20065 20066 if(item2.disabled==true){ 20067 item_index2.push(index2); 20068 } 20069 20070 }) 20071 if(total_check>=multi_option_value){ 20072 item_index.forEach((item3,index3) => { 20073 this.item_addons[index].sub_items[item3].disabled = true; 20074 }); 20075 } else { 20076 item_index2.forEach((item3,index3) => { 20077 this.item_addons[index].sub_items[item3].disabled = false; 20078 }); 20079 } 20080 20081 } else if ( item.multi_option=="one" ){ 20082 item.sub_items.forEach((item2,index2) => { 20083 if( item2.sub_item_id == item.sub_items_checked ) { 20084 $item_total+=( this.item_qty * parseFloat(item2.price) ); 20085 $required_addon_added.push( item.subcat_id ); 20086 } 20087 }); 20088 } else if ( item.multi_option=="multiple" ){ 20089 var item_index=[]; 20090 var multi_option_value = item.multi_option_value; 20091 var limit = 0; 20092 20093 item.sub_items.forEach((item2,index2) => { 20094 if(item2.checked==true){ 20095 $item_total+=( item2.qty * parseFloat(item2.price) ); 20096 $required_addon_added.push( item.subcat_id ); 20097 limit += item2.qty; 20098 } 20099 item_index.push(index2); 20100 }); 20101 20102 this.item_addons[index].qty_selected =limit; 20103 if ( this.item_addons[index].qty_selected>= multi_option_value){ 20104 item_index.forEach((item3,index2) => { 20105 this.item_addons[index].sub_items[item3].disabled = true; 20106 }); 20107 } else { 20108 item_index.forEach((item3,index2) => { 20109 this.item_addons[index].sub_items[item3].disabled = false; 20110 }); 20111 } 20112 20113 } /*endif custom*/ 20114 20115 });/* end loop*/ 20116 20117 this.item_total = $item_total; 20118 20119 var $required_meet=true; 20120 if($required_addon.length>0){ 20121 $.each($required_addon, function(i, val){ 20122 if($required_addon_added.includes(val)===false){ 20123 $required_meet = false; 20124 return false; 20125 } 20126 }); 20127 } 20128 20129 // CHECK COOKING REF 20130 if(this.items.cooking_ref_required){ 20131 let $cooking_ref_check = false; 20132 if (Object.keys(this.meta.cooking_ref).length > 0) { 20133 Object.entries(this.meta.cooking_ref).forEach(([cooking_key, cooking_items]) => { 20134 if(cooking_items.checked){ 20135 $cooking_ref_check = true; 20136 } 20137 }); 20138 } 20139 if(!$cooking_ref_check){ 20140 $required_meet = false; 20141 } 20142 } 20143 20144 if($required_meet){ 20145 this.disabled_cart = false; 20146 } else this.disabled_cart = true; 20147 20148 }, // end ItemSummary 20149 updateCartQty(addOrSubract,item_qty,cart_row,cart_uuid){ 20150 if(addOrSubract==1){ 20151 item_qty++; 20152 } else item_qty--; 20153 20154 if(item_qty<=0){ 20155 this.remove(cart_row,cart_uuid); 20156 } else { 20157 this.updateCartItems( item_qty,cart_row,cart_uuid ); 20158 } 20159 },// 20160 addCartItems(event){ 20161 if (event) { 20162 event.preventDefault() 20163 } 20164 this.add_to_cart = true; 20165 20166 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 20167 20168 var $params = { 20169 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 20170 'merchant_id' : this.items.merchant_id, 20171 'cat_id' : this.items.cat_id, 20172 'item_token': this.items.item_token, 20173 'item_size_id': this.size_id, 20174 'item_qty': this.item_qty, 20175 'item_addons': this.item_addons, 20176 'special_instructions': this.special_instructions, 20177 'meta' : this.meta, 20178 'cart_uuid':getCookie('cart_uuid'), 20179 'transaction_type': transactionType, 20180 'if_sold_out' : this.if_sold_out, 20181 }; 20182 20183 var timenow = 1; 20184 $params = JSON.stringify($params); 20185 20186 ajax_request[timenow] = $.ajax({ 20187 url: ajaxurl+"/addCartItems", 20188 method: "PUT", 20189 dataType: "json", 20190 data: $params , 20191 contentType : $content_type.json , 20192 timeout: $timeout, 20193 crossDomain: true, 20194 beforeSend: function( xhr ) { 20195 if(ajax_request[timenow] != null) { 20196 ajax_request[timenow].abort(); 20197 } 20198 } 20199 }); 20200 20201 ajax_request[timenow].done( data => { 20202 if ( data.code==1){ 20203 $( this.$refs.modal_item_details ).modal('hide'); 20204 //vue_cart.loadcart(); 20205 location.reload(); 20206 } 20207 }); 20208 20209 ajax_request[timenow].always( data => { 20210 this.add_to_cart = false;
20211 }); 20212 20213 } // end addCartItems 20214 } 20215 }).mount('#vue-item-widgets'); 20216 20217 /* 20218 CHANGE ADDRESS POPUP 20219 this is function for selecting checkout address 20220 target = 20221 */ 20222 const app_addres_needed = Vue.createApp({ 20223 components: { 20224 'component-change-address': changeAddressComponent, 20225 'components-address-form' : ComponentsAddressForm, 20226 'components-select-address': ComponentsSelectAddress, 20227 }, 20228 data(){ 20229 return { 20230 addresses : [], 20231 address_needed : false, 20232 out_of_range : false, 20233 location_data : [], 20234 deliveryAddress : [], 20235 address_component : [] 20236 }; 20237 }, 20238 created() { 20239 this.addressNeeded(); 20240 }, 20241 methods: { 20242 addressNeeded(){ 20243 axios({ 20244 method: 'POST', 20245 url: ajaxurl + "/addressNeeded" , 20246 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&merchant_id="+ merchant_id + "&cart_uuid="+ getCookie('cart_uuid'), 20247 timeout: $timeout, 20248 }).then( response => { 20249 if(response.data.code==1){ 20250 this.address_needed = response.data.details.address_needed; 20251 } else { 20252 this.address_needed = false; 20253 } 20254 }).catch(error => { 20255 // 20256 }).then(data => { 20257 20258 }); 20259 }, 20260 show(){ 20261 this.$refs.address.showModal(); 20262 }, 20263 afterChangeAddress(data){ 20264 dump('afterChangeAddress'); 20265 dump(data); 20266 dump("isGuest=>"+isGuest); 20267 if(isGuest==='1'){ 20268 this.deliveryAddress = data; 20269 //this.$refs.address_modal.show(true); 20270 this.$refs.address_modal.visible = true; 20271 } else { 20272 dump('not guest'); 20273 this.location_data = data; 20274 } 20275 }, 20276 onSavelocation(data,addressData){ 20277 dump('onSavelocation here1'); 20278 dump(addressData); 20279 this.$refs.address_form.setLoading(true); 20280 let params = { 20281 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 20282 'cart_uuid':getCookie('cart_uuid'), 20283 'data': data, 20284 'location_name' : addressData.location_name, 20285 'delivery_instructions' : addressData.delivery_instructions, 20286 'delivery_options' : addressData.delivery_options, 20287 'address_label' : addressData.address_label, 20288 'formatted_address' : addressData.formatted_address, 20289 'address1' : addressData.address1, 20290 'address2' : addressData.address2, 20291 'postal_code' : addressData.postal_code, 20292 'company' : addressData.company, 20293 'street': addressData.street, 20294 'house_number': addressData.house_number, 20295 'city': addressData.city 20296 }; 20297 axios({ 20298 method: 'PUT', 20299 url: ajaxurl+"/checkoutSaveAddress" , 20300 data : params, 20301 timeout: $timeout, 20302 }).then( response => { 20303 if(response.data.code==1){ 20304 this.address_needed = false; 20305 this.$refs.address_form.close(); 20306 this.refreshWidget(); 20307 } else { 20308 ElementPlus.ElNotification({ 20309 title: "", 20310 message: response.data.msg, 20311 position: 'bottom-right', 20312 type: 'warning', 20313 }); 20314 } 20315 }).catch(error => { 20316 ElementPlus.ElNotification({ 20317 title: "", 20318 message: error, 20319 position: 'bottom-right', 20320 type: 'warning', 20321 }); 20322 }).then(data => { 20323 this.$refs.address_form.setLoading(false); 20324 }); 20325 }, 20326 afterPointaddress(data){ 20327 dump('afterPointaddress'); 20328 dump(data.place_id ); 20329 this.$refs.address_modal.setLoading(true); 20330 axios({ 20331 method: 'POST', 20332 url: ajaxurl+"/setPlaceID" , 20333 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&place_id="+ data.place_id , 20334 timeout: $timeout, 20335 }).then( response => { 20336 this.address_needed = false; 20337 this.refreshWidget(); 20338 //this.$refs.address_modal.show(false); 20339 this.$refs.address_modal.visible = false; 20340 }).catch(error => { 20341 ElementPlus.ElNotification({ 20342 title: "", 20343 message: error, 20344 position: 'bottom-right', 20345 type: 'warning', 20346 }); 20347 }).then(data => { 20348 this.$refs.address_modal.setLoading(false); 20349 }); 20350 }, 20351 refreshWidget(){ 20352 if ((typeof vm_widget_nav !== "undefined") && ( vm_widget_nav !== null)) { 20353 //vm_widget_nav.afterChangeAddress(); 20354 vm_widget_nav.afterSetAddress(); 20355 } else { 20356 if ((typeof vm_merchant_details !== "undefined") && ( vm_merchant_details !== null)) { 20357 vm_merchant_details.$refs.ref_services.getMerchantServices(); 20358 } 20359 } 20360 }, 20361 afterChangeAddressOLD(data){ 20362 this.location_data = data; 20363 this.visible = false; 20364 this.$refs.address.closeModal(); 20365 if ((typeof vm_widget_nav !== "undefined") && ( vm_widget_nav !== null)) { 20366 vm_widget_nav.afterChangeAddress(); 20367 } 20368 20369 if ((typeof vm_merchant_details !== "undefined") && ( vm_merchant_details !== null)) { 20370 vm_merchant_details.$refs.ref_services.getMerchantServices(); 20371 } 20372 }, 20373 // 20374 }, 20375 }); 20376 app_addres_needed.use(ElementPlus);
20377 const vm_addres_needed = app_addres_needed.mount('#vue-address-needed'); 20378 20379 20380 20381 /* 20382 COMPONENTS ComponentsWebpushSettings 20383 */ 20384 const ComponentsWebpushSettings = { 20385 template: '#xtemplate_webpushsettings', 20386 props: ['ajax_url','settings','iterest_list', 'message'], 20387 data(){ 20388 return { 20389 beams: undefined, 20390 is_loading : false, 20391 is_submitted : false, 20392 webpush_enabled : '', 20393 interest : [], 20394 device_id : '' 20395 }; 20396 }, 20397 mounted() { 20398 this.initBeam(); 20399 }, 20400 methods :{ 20401 initBeam(){ 20402 this.beams = new PusherPushNotifications.Client({ 20403 instanceId: this.settings.instance_id, 20404 }); 20405 20406 this.is_loading = true; 20407 axios({ 20408 method: 'POST', 20409 url: this.ajax_url+"/getwebnotifications" , 20410 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 20411 timeout: $timeout, 20412 }).then( response => { 20413 if(response.data.code==1){ 20414 this.webpush_enabled = response.data.details.enabled==1?true:false; 20415 this.device_id = response.data.details.device_token; 20416 this.interest = response.data.details.interest; 20417 } else { 20418 this.webpush_enabled = false; 20419 this.device_id = ''; 20420 this.interest = []; 20421 } 20422 }).catch(error => { 20423 // 20424 }).then(data => { 20425 this.is_loading = false; 20426 }); 20427 20428 }, 20429 enabledWebPush(){ 20430 this.is_loading = true; 20431 if( this.webpush_enabled){ 20432 this.beams.start().then(() => { 20433 dump("start"); 20434 this.beams.getDeviceId().then( (device_id)=>{ 20435 this.device_id = device_id; 20436 }); 20437 }).catch(e => { 20438 notify( this.message.notification_start ,'error'); 20439 }).then(data => { 20440 this.is_loading = false; 20441 }); 20442 } else { 20443 this.beams.stop().then(() => { 20444 dump("stop"); 20445 this.device_id = ''; 20446 }).catch(e => { 20447 notify( this.message.notification_stop ,'error'); 20448 }).then(data => { 20449 this.is_loading = false; 20450 }); 20451 } 20452 }, 20453 saveWebNotifications(){ 20454 this.is_submitted = true; 20455 axios({ 20456 method: 'PUT', 20457 url: this.ajax_url+"/savewebnotifications" , 20458 data : { 20459 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 20460 'webpush_enabled' : this.webpush_enabled, 20461 'interest' : this.interest, 20462 'device_id' : this.device_id, 20463 }, 20464 timeout: $timeout, 20465 }).then( response => { 20466 if(response.data.code==1){ 20467 notify( response.data.msg); 20468 } else { 20469 notify( response.data.msg ,'error'); 20470 } 20471 }).catch(error => { 20472 // 20473 }).then(data => { 20474 this.is_submitted = false; 20475 }); 20476 20477 }, 20478 }, 20479 }; 20480 20481 20482 20483 /* 20484 PUSH SETTINGS 20485 */ 20486 const app_webpushsettings = Vue.createApp({ 20487 components: { 20488 'components-web-pusher': ComponentsWebpushSettings, 20489 }, 20490 }); 20491 const vm_webpushsettings = app_webpushsettings.mount('#vue-webpush-settings'); 20492 20493 20494 /* 20495 ALL NOTIFICATION LIST 20496 */ 20497 const app_notification_list = Vue.createApp({ 20498 data(){ 20499 return { 20500 is_loading : false, 20501 data : [] , 20502 page: 0, 20503 show_next_page : false, 20504 }; 20505 }, 20506 mounted() { 20507 this.getData(this.page); 20508 }, 20509 computed: { 20510 hasData(){ 20511 if(this.data.length>0){ 20512 return true; 20513 } 20514 return false; 20515 }, 20516 isFirstLoad(){ 20517 if(this.is_loading && this.page<=0){ 20518 return true; 20519 } 20520 return false; 20521 }, 20522 }, 20523 methods: { 20524 getData(page){ 20525 this.is_loading = true; 20526 axios({ 20527 method: 'POST', 20528 url: ajaxurl +"/notificationList" , 20529 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&page=" + page + '&lang=' + document.documentElement.lang, 20530 timeout: $timeout, 20531 }).then( response => { 20532 if(response.data.code==1){ 20533 //this.data = response.data.details.data; 20534 this.data.push(response.data.details.data); 20535 this.show_next_page = response.data.details.show_next_page; 20536 this.page = response.data.details.page; 20537 } else { 20538 this.data = []; 20539 } 20540 }).catch(error => { 20541 // 20542 }).then(data => { 20543 this.is_loading = false;
20544 }); 20545 } 20546 }, 20547 }); 20548 app_notification_list.use(ElementPlus); 20549 const vm_notification_list = app_notification_list.mount('#vue-notifications-list'); 20550 20551 20552 /* 20553 COMPONENTS PAYMENT LIST 20554 */ 20555 const ComponentsPaymentList = { 20556 props: ['ajax_url' , 'label' ,'payment_type' ], 20557 data(){ 20558 return { 20559 data : [], 20560 is_loading : true, 20561 error_message : '' 20562 }; 20563 }, 20564 mounted() { 20565 this.getPaymentList(); 20566 }, 20567 computed: { 20568 hasData(){ 20569 if(this.data.length>0){ 20570 return true; 20571 } 20572 return false; 20573 }, 20574 }, 20575 methods: { 20576 getPaymentList(){ 20577 this.is_loading = true; 20578 axios({ 20579 method: 'POST', 20580 url: this.ajax_url + "/getPaymentList" , 20581 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&payment_type=" + this.payment_type, 20582 timeout: $timeout, 20583 }).then( response => { 20584 if(response.data.code==1){ 20585 this.data = response.data.details.data; 20586 this.error_message = ''; 20587 } else { 20588 this.data = []; 20589 this.error_message = response.data.msg; 20590 } 20591 }).catch(error => { 20592 // 20593 }).then(data => { 20594 this.is_loading = false; 20595 }); 20596 }, 20597 }, 20598 template: ` 20599 <DIV class="position-relative"> 20600 <div v-if="is_loading" class="loading cover-loader d-flex align-items-center justify-content-center"> 20601 <div> 20602 <div class="m-auto circle-loader medium" data-loader="circle-side"></div> 20603 </div> 20604 </div> 20605 20606 <h5 class="mb-3 mt-4">Add New Payment Method</h5> 20607 20608 <template v-if="!is_loading && hasData"> 20609 here 20610 <a v-for="items in data" @click="$emit('afterClickpayment',items.payment_code)" 20611 class="d-block chevron-section medium d-flex align-items-center rounded mb-2"> 20612 <div class="flexcol mr-2 payment-logo-wrap"> 20613 <i v-if="items.logo_type=='icon'" :class="items.logo_class"></i> 20614 <img v-else class="img-35" :src="items.logo_image" /> 20615 </div> 20616 <div class="flexcol"> 20617 <span class="mr-1">{{items.payment_name}}</span> 20618 </div> 20619 </a> 20620 </template> 20621 20622 <template v-if="!is_loading && !hasData"> 20623 <div class="alert alert-warning mb-2" role="alert"> 20624 <p class="m-0">{{error_message}}</p> 20625 </div> 20626 </template> 20627 20628 20629 </DIV> 20630 ` 20631 }; 20632 20633 20634 /* 20635 COMPONENTS SAVED PAYMENT LIST 20636 */ 20637 const ComponentsMerchantSavedPayment = { 20638 props: ['ajax_url' , 'merchant_uuid' ], 20639 data(){ 20640 return { 20641 data : [], 20642 default_payment_uuid : '', 20643 is_loading : false, 20644 message : '' 20645 }; 20646 }, 20647 computed: { 20648 hasData(){ 20649 if(this.data.length>0){ 20650 return true; 20651 } 20652 return false; 20653 }, 20654 }, 20655 mounted() { 20656 this.MerchantSavedPayment(); 20657 }, 20658 methods: { 20659 MerchantSavedPayment(){ 20660 this.is_loading = true; 20661 axios({ 20662 method: 'POST', 20663 url: this.ajax_url + "/MerchantSavedPayment" , 20664 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&merchant_uuid=" + this.merchant_uuid , 20665 timeout: $timeout, 20666 }).then( response => { 20667 if(response.data.code==1){ 20668 this.data = response.data.details.data; 20669 this.default_payment_uuid = response.data.details.default_payment_uuid; 20670 this.$emit('setDefaultpayment',response.data.details.default_payment); 20671 } else { 20672 this.data = []; 20673 this.message = response.data.msg; 20674 } 20675 }).catch(error => { 20676 // 20677 }).then(data => { 20678 this.is_loading = false; 20679 }); 20680 }, 20681 setDefaultPayment(data){ 20682 axios({ 20683 method: 'POST', 20684 url: this.ajax_url + "/MerchantsetDefaultPayment" , 20685 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&payment_uuid=" + data.payment_uuid , 20686 timeout: $timeout, 20687 }).then( response => { 20688 if(response.data.code==1){ 20689 this.MerchantSavedPayment(); 20690 } else { 20691 notify( response.data.msg ,'error'); 20692 } 20693 }).catch(error => { 20694 // 20695 }).then(data => { 20696 20697 }); 20698 }, 20699 deleteSavedPaymentMethod(data){ 20700 axios({ 20701 method: 'POST', 20702 url: this.ajax_url + "/MerchantDeleteSavedPaymentMethod" , 20703 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&payment_uuid=" + data.payment_uuid , 20704 timeout: $timeout, 20705 }).then( response => { 20706 if(response.data.code==1){ 20707 this.MerchantSavedPayment(); 20708 } else { 20709 notify( response.data.msg ,'error'); 20710 } 20711 }).catch(error => { 20712 // 20713 }).then(data => { 20714 20715 }); 20716 }, 20717 }, 20718 template: ` 20719 <DIV class="position-relative"> 20720 20721 <div v-if="is_loading" class="loading cover-loader d-flex align-items-center justify-content-center"> 20722 <div> 20723 <div class="m-auto circle-loader medium" data-loader="circle-side"></div> 20724 </div> 20725 </div> 20726 20727 <template v-if="hasData"> 20728 <h5 class="mb-3">Saved Payment Methods</h5> 20729 20730 <div v-for="saved_payment in data" class="row no-gutters align-items-center chevron-section medium rounded mb-2" :class="{ selected: saved_payment.as_default==1 }" > 20731 20732 <div class="col-md-8 d-flex align-items-center"> 20733 <div class="flexcol mr-2 payment-logo-wrap"> 20734 <i v-if="saved_payment.logo_type=='icon'" :class="saved_payment.logo_class"></i> 20735 <img v-else class="img-35" :src="saved_payment.logo_image" /> 20736 </div> <!--flex-col--> 20737 <div class="flexcol" >
20738 <span class=" mr-1">{{saved_payment.attr1}}</span> 20739 <p class="m-0 text-muted">{{saved_payment.attr2}}</p> 20740 </div> 20741 </div> <!--col--> 20742 <div class="col-md-4 d-flex align-items-center justify-content-end"> 20743 20744 <template v-if="saved_payment.as_default==1"> 20745 <div class="mr-1"><i class="zmdi zmdi-check text-success"></i></div> 20746 <div class="mr-3"><p class="m-0">Default</p></div> 20747 </template> 20748 20749 <div class="dropdown"> 20750 <a href="javascript:;" class="rounded-pill rounded-button-icon d-inline-block" 20751 id="dropdownMenuLink" data-toggle="dropdown" > 20752 <i class="zmdi zmdi-more" style="font-size: inherit;"></i> 20753 </a> 20754 <div class="dropdown-menu" aria-labelledby="dropdownMenuLink"> 20755 <a v-if="saved_payment.as_default!=1" 20756 @click="setDefaultPayment(saved_payment)" 20757 class="dropdown-item a-12" href="javascript:;">Set Default</a> 20758 <a @click="deleteSavedPaymentMethod(saved_payment)" class="dropdown-item a-12" href="javascript:;"> 20759 Delete 20760 </a> 20761 </div> 20762 </div> <!--dropdown--> 20763 20764 </div> <!--col--> 20765 </div> <!--row--> 20766 </template> 20767 </DIV> 20768 ` 20769 }; 20770 20771 20772 /* 20773 CASH IN PAYMENT 20774 */ 20775 const ComponentsCashinPayment = { 20776 props: ['ajax_url' ,'amount' , 'label' ,'default_payment' , 'merchant_uuid' ], 20777 data(){ 20778 return { 20779 data : [], 20780 is_loading : false, 20781 }; 20782 }, 20783 computed: { 20784 ValidAmount(){ 20785 if(this.amount<=0){ 20786 return true; 20787 } 20788 if(empty(this.default_payment.payment_uuid)){ 20789 return true; 20790 } 20791 return false; 20792 }, 20793 }, 20794 mounted() { 20795 dump(this.amount); 20796 }, 20797 methods: { 20798 DoCashin(){ 20799 20800 bootbox.confirm({ 20801 size: "small", 20802 title : this.label.confirm , 20803 message: this.label.are_you_sure, 20804 centerVertical: true, 20805 animate: false, 20806 buttons: { 20807 cancel: { 20808 label: this.label.cancel, 20809 className: 'btn btn-black small pl-4 pr-4' 20810 }, 20811 confirm: { 20812 label: this.label.yes, 20813 className: 'btn btn-green small pl-4 pr-4' 20814 }, 20815 }, 20816 callback: result => { 20817 if(result){ 20818 var data = { 20819 'payment_uuid' : this.default_payment.payment_uuid, 20820 'payment_code' : this.default_payment.payment_code, 20821 'merchant_uuid' : this.merchant_uuid, 20822 'amount' : this.amount, 20823 }; 20824 try { 20825 vm_cashin.$refs[ this.default_payment.payment_code ].DoPaymentRender( data ,'PaymentIntentCashin' ); 20826 } catch(err) { 20827 notify(err.message,'error'); 20828 } 20829 } 20830 } 20831 }); 20832 }, 20833 }, 20834 template: ` 20835 <button class="btn btn-green w-100 pointer mt-3" 20836 :disabled="ValidAmount" 20837 @click="DoCashin" 20838 > 20839 <span class="label">{{label.continue}}</span> 20840 <div class="m-auto circle-loader" data-loader="circle-side"></div> 20841 </button> 20842 ` 20843 }; 20844 20845 20846 /* 20847 CASHIN 20848 */ 20849 const app_cashin = Vue.createApp({ 20850 data(){ 20851 return { 20852 data : [], 20853 default_payment : '' 20854 }; 20855 }, 20856 mounted() { 20857 dump(this.amount_cashin); 20858 }, 20859 methods: { 20860 afterClickpayment(payment_code){ 20861 try { 20862 this.$refs[payment_code].showPaymentForm(); 20863 } catch(err) { 20864 notify(err.message,'error'); 20865 } 20866 }, 20867 SavedPaymentList(){ 20868 this.$refs.merchant_saved_payment.MerchantSavedPayment(); 20869 }, 20870 setDefaultpayment(data){ 20871 this.default_payment = data; 20872 }, 20873 showLoadingBox(message){ 20874 if(!empty(message)){ 20875 vm_loading.$refs.box.setMessage(message); 20876 } 20877 vm_loading.$refs.box.show(); 20878 }, 20879 closeLoadingBox(){ 20880 vm_loading.$refs.box.close(); 20881 }, 20882 Alert(message){ 20883 notify(message,'error'); 20884 }, 20885 }, 20886 }); 20887 app_cashin.component('components-payment-list', ComponentsPaymentList ); 20888 app_cashin.component('components-merchant-saved-payment', ComponentsMerchantSavedPayment ); 20889 app_cashin.component('components-cashin-payment', ComponentsCashinPayment ); 20890 if ((typeof components_bundle !== "undefined") && ( components_bundle !== null)) { 20891 $.each(components_bundle,function(components_name, components_value) {
20892 app_cashin.component(components_name, components_value ); 20893 }); 20894 } 20895 const vm_cashin = app_cashin.mount('#vue-cashin'); 20896 20897 20898 /* 20899 CAROUSEL RESTAURANT 20900 */ 20901 const vm_carousel = Vue.createApp({ 20902 components: { 20903 'component-carousel' : ComponentsCarousel, 20904 }, 20905 }).mount('#vue-carousel'); 20906 20907 20908 const ComponentsProfileMenu = { 20909 props: ['data','index_selected'], 20910 data(){ 20911 return { 20912 owl : undefined, 20913 }; 20914 }, 20915 mounted() { 20916 setTimeout(() => { 20917 this.renderCarousel(); 20918 }, 1); 20919 }, 20920 methods: { 20921 renderCarousel(){ 20922 let $is_rtl = false; 20923 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 20924 $is_rtl = is_rtl=='1'?true:false; 20925 } 20926 this.owl = $(this.$refs.menu).owlCarousel({ 20927 loop:false, 20928 dots:false, 20929 nav:false, 20930 autoWidth:true, 20931 rtl : $is_rtl 20932 }); 20933 }, 20934 }, 20935 template : ` 20936 <div ref="menu" class="owl-carousel owl-theme menu-carousel"> 20937 <div v-for="(item, index) in data" class="mr-2"> 20938 <a :href="item.url" class="d-block" 20939 :class="{active : index==index_selected }" 20940 > 20941 {{item.label}} 20942 </a> 20943 </div> 20944 </div> 20945 ` 20946 }; 20947 const vm_profile_menu = Vue.createApp({ 20948 components: { 20949 'component-profile-menu' : ComponentsProfileMenu, 20950 }, 20951 }).mount('#vue-profile-menu'); 20952 20953 const vm_captcha = Vue.createApp({ 20954 data() { 20955 return { 20956 recaptcha_response : '' 20957 } 20958 }, 20959 components: { 20960 'components-recapcha' : componentsRecaptcha, 20961 }, 20962 methods: { 20963 recaptchaVerified(response) { 20964 this.recaptcha_response = response; 20965 }, 20966 recaptchaExpired() { 20967 if( this.$refs.vueRecaptcha.is_enabled ){ 20968 this.$refs.vueRecaptcha.reset(); 20969 } 20970 }, 20971 recaptchaFailed() { 20972 20973 }, 20974 }, 20975 }).mount('#vue-captcha'); 20976 20977 20978 /** 20979 GUEST REGISTRATION 20980 target = vue-guest-register 20981 */ 20982 const app_guest_register = Vue.createApp({ 20983 components: { 20984 'component-phone' : ComponentsPhoneNumber, 20985 'vue-recaptcha' : componentsRecaptcha, 20986 }, 20987 data(){ 20988 return { 20989 loading : false, 20990 ready : false, 20991 show_password : false, 20992 agree_terms : false, 20993 password_type: 'password', 20994 firstname : '', 20995 lastname : '', 20996 email_address : '', 20997 mobile_number : '', 20998 mobile_prefix :'', 20999 password : '', 21000 cpassword :'', 21001 mobile_prefixes : [], 21002 error : [], 21003 success : '', 21004 redirect : '', 21005 next_url : '', 21006 recaptcha_response : '', 21007 show_recaptcha : false, 21008 }; 21009 }, 21010 mounted () { 21011 dump("mounted"); 21012 this.redirect = redirect_to; 21013 this.next_url = next_url; 21014 if ((typeof _capcha !== "undefined") && ( _capcha !== null)) { 21015 this.show_recaptcha = _capcha==1?true:false; 21016 } 21017 }, 21018 updated () { 21019 this.validate(); 21020 }, 21021 methods: { 21022 validate(){ 21023 if( !empty(this.firstname) && !empty(this.lastname) && !empty(this.mobile_number) ){ 21024 this.ready = true; 21025 } else this.ready = false; 21026 }, 21027 showPassword() 21028 { 21029 this.show_password = this.show_password==true?false:true; 21030 if(this.show_password){ 21031 this.password_type = 'text'; 21032 } else this.password_type = 'password'; 21033 }, 21034 onRegister(){ 21035 21036 var timenow = getTimeNow(); 21037 var $params = { 21038 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 21039 'firstname' : this.firstname, 21040 'lastname' : this.lastname, 21041 'email_address' : this.email_address, 21042 'mobile_number' : this.mobile_number, 21043 'mobile_prefix': this.mobile_prefix, 21044 'password': this.password, 21045 'cpassword': this.cpassword, 21046 'redirect': this.redirect, 21047 'recaptcha_response': this.recaptcha_response, 21048 }; 21049 21050 ajax_request[timenow] = $.ajax({ 21051 url: ajaxurl+"/registerGuestUser", 21052 method: "PUT", 21053 dataType: "json", 21054 data: JSON.stringify($params) , 21055 contentType : $content_type.json , 21056 timeout: $timeout, 21057 crossDomain: true, 21058 beforeSend: data => { 21059 this.loading = true; 21060 this.error = []; 21061 this.success = ''; 21062 if(ajax_request[timenow] != null) { 21063 ajax_request[timenow].abort(); 21064 } 21065 } 21066 }); 21067 21068 ajax_request[timenow].done( data => { 21069 if ( data.code==1){ 21070 this.success = data.msg; 21071 window.location.href = data.details.redirect; 21072 } else { 21073 this.error = data.msg; 21074 this.recaptchaExpired(); 21075 } 21076 }); // ajax done 21077 21078 ajax_request[timenow].always( data => { 21079 this.loading = false; 21080 }); 21081 21082 }, 21083 recaptchaVerified(response) { 21084 this.recaptcha_response = response; 21085 }, 21086 recaptchaExpired() { 21087 if ( this.show_recaptcha){ 21088 this.$refs.vueRecaptcha.reset(); 21089 } 21090 }, 21091 recaptchaFailed() { 21092 21093 }, 21094 21095 }, 21096 }); 21097 app_guest_register.use(Maska); 21098 const vm_guest_register = app_guest_register.mount('#vue-guest-register'); 21099 21100 21101 // START NEW JS 1.0.8 21102 const app_delivery_details = Vue.createApp({ 21103 components: { 21104 'components-maps' : ComponentsMaps, 21105 'components-select-address': ComponentsSelectAddress, 21106 'components-saveaddress' : ComponentsSavedAddress 21107 }, 21108 data() { 21109 return { 21110 loading : false, 21111 loading_save : false, 21112 data :[], 21113 address1 : '', 21114 location_name : '', 21115 delivery_options :'Leave it at my door', 21116 delivery_instructions :'', 21117 address_label :'Home', 21118 markers : [], 21119 address_data : [], 21120 address_found : false, 21121 address_uuid : '', 21122 isEdit : false, 21123 isAdd : false, 21124 formatted_address : '', 21125 save_address_data : [], 21126 default_address : [], 21127 count_address : 0, 21128 address_needed : true, 21129 address_label_list : [], 21130 address2 : '', 21131 postal_code : '', 21132 company : '', 21133 street : '', 21134 house_number : '', 21135 city : '', 21136 } 21137 }, 21138 created() { 21139 this.addressNeeded(); 21140 }, 21141 computed: { 21142 hasDeliveryAddress(){ 21143 if (Object.keys(this.address_data).length > 0) { 21144 return true; 21145 } 21146 return false;
21147 }, 21148 deliveryAddress(){ 21149 return this.address_data; 21150 }, 21151 hasSavedAddress(){ 21152 return this.address_found; 21153 }, 21154 hasAddressList(){ 21155 return this.count_address>0?true:false; 21156 }, 21157 isAddressNeeded(){ 21158 return this.address_needed; 21159 }, 21160 getAddressLabel(){ 21161 return this.address_label_list; 21162 } 21163 }, 21164 mounted () { 21165 this.setStreet( getStorage("street") ); 21166 this.setHouseNumber( getStorage("house_number") ); 21167 this.setPostalCode( getStorage("postal_code") ); 21168 this.setCity( getStorage("city") ); 21169 this.setLocationName( getStorage("location_name") ); 21170 this.setCompanyName( getStorage("company_name")); 21171 this.setDeliveryInstructions( getStorage("delivery_instructions") ); 21172 }, 21173 watch: { 21174 address_data(newval,oldval){ 21175 this.setMarker(newval.latitude,newval.longitude); 21176 }, 21177 street(new_value,old_value){ 21178 setStorage('street',new_value); 21179 this.setStreet(new_value); 21180 }, 21181 house_number(new_value,old_value){ 21182 setStorage('house_number',new_value); 21183 this.setHouseNumber(new_value); 21184 }, 21185 postal_code(new_value,old_value){ 21186 setStorage('postal_code',new_value); 21187 this.setPostalCode(new_value); 21188 }, 21189 city(new_value,old_value){ 21190 setStorage('city',new_value); 21191 this.setCity(new_value); 21192 }, 21193 location_name(new_value,old_value){ 21194 setStorage('location_name',new_value); 21195 this.setLocationName(new_value); 21196 }, 21197 company(new_value,old_value){ 21198 setStorage('company_name',new_value); 21199 this.setCompanyName(new_value); 21200 }, 21201 delivery_instructions(new_value,old_value){ 21202 setStorage('delivery_instructions',new_value); 21203 this.setDeliveryInstructions(new_value); 21204 } 21205 }, 21206 methods: { 21207 setStreet(value){ 21208 value = empty(value)? '' : value; 21209 this.street = value; 21210 if(empty(this.street)){ 21211 this.street_error = "Straßenname ist erforderlich"; 21212 } else{ 21213 this.street_error = ""; 21214 } 21215 }, 21216 setHouseNumber(value){ 21217 value = empty(value)? '' : value; 21218 this.house_number = value; 21219 if(empty(this.house_number)){ 21220 this.house_number_error = "Hausnummer ist erforderlich"; 21221 } else{ 21222 this.house_number_error = ""; 21223 } 21224 }, 21225 setPostalCode(value){ 21226 value = empty(value)? '' : value; 21227 this.postal_code = value; 21228 if(empty(this.postal_code)){ 21229 this.postal_code_error = "Postleitzahl erforderlich"; 21230 } else{ 21231 this.postal_code_error = ""; 21232 } 21233 }, 21234 setCity(value){ 21235 value = empty(value)? '' : value; 21236 this.city = value; 21237 if(empty(this.city)){ 21238 this.city_error = "Name der Stadt erforderlich"; 21239 } else{ 21240 this.city_error = ""; 21241 } 21242 }, 21243 setLocationName(value){ 21244 value = empty(value)? '' : value; 21245 this.location_name = value; 21246 }, 21247 setCompanyName(value){ 21248 value = empty(value)? '' : value; 21249 this.company = value; 21250 }, 21251 setDeliveryInstructions(value){ 21252 value = empty(value)? '' : value; 21253 this.delivery_instructions = value; 21254 }, 21255 addressNeeded(){ 21256 this.loading = true; 21257 axios({ 21258 method: 'POST', 21259 url: ajaxurl + "/checkoutAddressNeeded" , 21260 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&merchant_id="+ merchant_id + "&cart_uuid="+ getCookie('cart_uuid'), 21261 timeout: $timeout, 21262 }).then( response => { 21263 if(response.data.code==1){ 21264 this.address_needed = response.data.details.address_needed; 21265 this.getAddress(); 21266 } else { 21267 this.address_needed = false; 21268 } 21269 }).catch(error => { 21270 // 21271 }).then(data => { 21272 this.loading = false; 21273 }); 21274 }, 21275 setMarker(lat,lng){ 21276 this.markers = [ 21277 { 21278 id: 0, 21279 lat: parseFloat(lat), 21280 lng: parseFloat(lng), 21281 draggable: false, 21282 } 21283 ]; 21284 }, 21285 afterClosemodal(provider){ 21286 console.debug("afterClosemodal xx",provider); 21287 if(provider=="yandex"){ 21288 if(yandex_map){ 21289 yandex_map.destroy(); 21290 yandex_map = null; 21291 } 21292 this.$refs.maps.renderMap(); 21293 } 21294 }, 21295 getAddress(){ 21296 this.loading = true; 21297 axios({ 21298 method: 'POST',
21299 url: ajaxurl+"/getAddressDetails" , 21300 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 21301 timeout: $timeout, 21302 }).then( response => { 21303 if(response.data.code==1){ 21304 this.data = response.data.details; 21305 this.address_found = response.data.details.address_found; 21306 this.address_data = response.data.details.data; 21307 this.default_address = this.address_data; 21308 this.save_address_data = this.address_data; 21309 this.address_uuid = response.data.details.data.address_uuid; 21310 this.count_address = response.data.details.count_address; 21311 this.address_label_list = response.data.details.address_label; 21312 21313 } else { 21314 this.data = response.data.details; 21315 this.address_data = response.data.details.data; 21316 this.default_address = this.address_data; 21317 this.save_address_data = ''; 21318 this.formatted_address = this.address_data.address.formatted_address; 21319 this.address1 = this.address_data.address.address1; 21320 21321 this.address_found = response.data.details.address_found; 21322 this.count_address = response.data.details.count_address; 21323 this.address_label_list = response.data.details.address_label; 21324 } 21325 }).catch(error => { 21326 // 21327 }).then(data => { 21328 this.loading = false; 21329 }); 21330 }, 21331 saveAddress(){ 21332 this.loading_save = true; 21333 axios({ 21334 method: 'PUT', 21335 url: ajaxurl+"/SaveAddress" , 21336 data : { 21337 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 21338 'address_uuid': this.address_uuid, 21339 'location_name' : this.location_name, 21340 'delivery_instructions' : this.delivery_instructions, 21341 'delivery_options' : this.delivery_options, 21342 'address_label' : this.address_label, 21343 'latitude' : this.address_data.latitude, 21344 'longitude' : this.address_data.longitude, 21345 'address1' : this.address1, 21346 'formatted_address' : this.formatted_address, 21347 'set_place_id' : this.address_data.place_id, 21348 'data': this.address_data, 21349 'address2' : this.address2, 21350 'postal_code' : this.postal_code, 21351 'company' : this.company, 21352 'street' : this.street, 21353 'house_number' : this.house_number, 21354 'city' : this.city 21355 }, 21356 timeout: $timeout, 21357 }).then( response => { 21358 if(response.data.code==1){ 21359 if(yandex_map){ 21360 yandex_map.destroy(); 21361 yandex_map = null; 21362 } 21363 ElementPlus.ElNotification({ 21364 title: "", 21365 message: response.data.msg, 21366 position: 'bottom-right', 21367 type: 'success', 21368 }); 21369 if ((typeof redirect_to !== 'undefined') && (redirect_to !== null)) { 21370 window.location.href = redirect_to; 21371 } else { 21372 this.isEdit = false; 21373 this.isAdd = false; 21374 this.getAddress(); 21375 this.$refs.save_address.getSavedAddress(); 21376 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 21377 vue_cart.loadcart(); 21378 } 21379 } 21380 } else { 21381 ElementPlus.ElNotification({ 21382 title: "", 21383 message: response.data.msg, 21384 position: 'bottom-right', 21385 type: 'warning', 21386 }); 21387 } 21388 }).catch(error => { 21389 // 21390 }).then(data => { 21391 this.loading_save = false; 21392 }); 21393 }, 21394 showSelectAddress(){ 21395 dump("showSelectAddress"); 21396 this.$refs.address_modal.setInitialMarker(); 21397 this.$refs.address_modal.visible = true; 21398 }, 21399 afterChangeaddress(data){ 21400 console.debug("afterChangeaddress xx1",data); 21401 21402 if(yandex_map){ 21403 yandex_map.destroy(); 21404 yandex_map = null; 21405 } 21406 this.address_data = data; 21407 21408 if ((typeof data.parsed_address !== "undefined") && ( data.parsed_address !== null)) { 21409 if(!empty(data.parsed_address.street_name)){ 21410 this.formatted_address = data.parsed_address.street_name; 21411 this.address1 = data.parsed_address.street_number; 21412 this.street = newval.parsed_address.street_name; 21413 this.house_number = newval.parsed_address.street_number; 21414 } else { 21415 this.formatted_address = this.address_data.address.formatted_address; 21416 this.address1 = this.address_data.address.address1; 21417 } 21418 } else { 21419 this.formatted_address = this.address_data.address.formatted_address; 21420 this.address1 = this.address_data.address.address1; 21421 } 21422 21423 this.$refs.address_modal.visible = false;
21424 }, 21425 editSaveAddress(){ 21426 console.debug("editSaveAddress"); 21427 this.isEdit = true; 21428 this.address_data = this.save_address_data; 21429 this.address_uuid = this.save_address_data.address_uuid; 21430 21431 this.formatted_address = this.address_data.address.formatted_address; 21432 this.address1 = this.address_data.address.address1; 21433 this.location_name = this.address_data.attributes.location_name; 21434 this.delivery_options = this.address_data.attributes.delivery_options; 21435 this.delivery_instructions = this.address_data.attributes.delivery_instructions; 21436 this.address_label = this.address_data.attributes.address_label; 21437 21438 this.address2 = this.address_data.address.address2; 21439 this.postal_code = this.address_data.address.postal_code; 21440 this.company = this.address_data.address.company; 21441 21442 this.street = this.address_data.address.street; 21443 this.house_number = this.address_data.address.house_number; 21444 this.city = this.address_data.address.city; 21445 }, 21446 CancelEdit(){ 21447 console.debug('CancelEdit'); 21448 21449 if(yandex_map){ 21450 yandex_map.destroy(); 21451 yandex_map = null; 21452 } 21453 21454 this.isEdit = false; 21455 this.address_data = this.default_address; 21456 this.formatted_address = ''; 21457 this.address1 = ''; 21458 this.location_name = ''; 21459 this.delivery_options = ''; 21460 this.delivery_instructions = ''; 21461 this.address_label = ''; 21462 this.address2 = ''; 21463 this.postal_code = ''; 21464 this.company = ''; 21465 this.street = ''; 21466 this.house_number = ''; 21467 this.city = ''; 21468 }, 21469 AddNewAddress(){ 21470 this.isAdd = true; 21471 this.address_data = this.default_address; 21472 this.formatted_address = this.address_data.address.formatted_address; 21473 this.address1 = this.address_data.address.address1; 21474 this.address_uuid = ''; 21475 this.location_name = ''; 21476 this.delivery_instructions = ''; 21477 this.address2 = ''; 21478 this.postal_code = ''; 21479 this.company = ''; 21480 this.street = ''; 21481 this.house_number = ''; 21482 this.city = ''; 21483 }, 21484 CanceAdd(){ 21485 console.log('CanceAdd'); 21486 this.isAdd = false; 21487 this.address_data = this.default_address; 21488 }, 21489 afterSelectaddress(data){ 21490 this.setPlaceID(data.place_id); 21491 this.address_found = true; 21492 this.save_address_data = data; 21493 this.address_data = this.save_address_data; 21494 this.address_uuid = this.save_address_data.address_uuid; 21495 21496 this.formatted_address = this.address_data.address.formatted_address; 21497 this.address1 = this.address_data.address.address1; 21498 this.location_name = this.address_data.attributes.location_name; 21499 this.delivery_options = this.address_data.attributes.delivery_options; 21500 this.delivery_instructions = this.address_data.attributes.delivery_instructions; 21501 this.address_label = this.address_data.attributes.address_label; 21502 }, 21503 setPlaceID(place_id){ 21504 axios({ 21505 method: 'POST', 21506 url: ajaxurl+"/setPlaceID" , 21507 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&place_id="+ place_id , 21508 timeout: $timeout, 21509 }).then( response => { 21510 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 21511 vue_cart.loadcart(); 21512 } 21513 }).catch(error => { 21514 // 21515 }).then(data => { 21516 21517 }); 21518 }, 21519 confirmDelete(address_uuid){ 21520 21521 let $some_words = JSON.parse(some_words); 21522 21523 ElementPlus.ElMessageBox.confirm( 21524 $some_words.confirm_delete_address, 21525 $some_words.delete, 21526 { 21527 confirmButtonText: $some_words.delete_adress, 21528 cancelButtonText: $some_words.cancel, 21529 type: 'info', 21530 } 21531 ) 21532 .then(() => { 21533 this.deleteAddress(address_uuid); 21534 }) 21535 .catch(() => { 21536 // 21537 }); 21538 }, 21539 deleteAddress(address_uuid){ 21540 axios({ 21541 method: 'POST', 21542 url: ajaxurl+"/deleteAddress" , 21543 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&address_uuid="+ address_uuid , 21544 timeout: $timeout, 21545 }).then( response => { 21546 this.getAddress(); 21547 this.$refs.save_address.getSavedAddress(); 21548 }).catch(error => { 21549 // 21550 }).then(data => { 21551 21552 }); 21553 } 21554 // 21555 }, 21556 }); 21557 app_delivery_details.use(ElementPlus); 21558 const vm_delivery_details = app_delivery_details.mount('#vm_delivery_details'); 21559 21560 21561 const app_home_search = Vue.createApp({ 21562 components: { 21563 'component-auto-complete' : ComponentsAutoCompleteAdress, 21564 'components-select-address': ComponentsSelectAddress, 21565 'components-address-form' : ComponentsAddressForm, 21566 }, 21567 data() { 21568 return { 21569 deliveryAddress : [], 21570 location_data : [] 21571 } 21572 }, 21573 methods: { 21574 afterChoose(data){ 21575 console.log("afterChoosexx",data); 21576 this.$refs.auto_complete.setLoading(true); 21577 axios({ 21578 method: 'POST',
21579 url: ajaxurl+"/getLocationDetails" , 21580 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&id="+ data.id + "&saveplace=0" + "&description="+data.description, 21581 timeout: $timeout, 21582 }).then( response => { 21583 if(response.data.code==1){ 21584 this.$refs.auto_complete.setAddressData(response.data.details.data); 21585 } else { 21586 ElementPlus.ElNotification({ 21587 title: "", 21588 message: response.data.msg, 21589 position: 'bottom-right', 21590 type: 'warning', 21591 }); 21592 } 21593 }).catch(error => { 21594 // 21595 }).then(data => { 21596 this.$refs.auto_complete.setLoading(false); 21597 }); 21598 }, 21599 afterFormclose(){ 21600 dump('afterFormclose'); 21601 this.location_data = []; 21602 }, 21603 afterGetcurrentlocation(data){ 21604 dump("afterGetcurrentlocation"); 21605 console.log("isGuest=>"+isGuest); 21606 21607 if(isGuest==='1'){ 21608 this.deliveryAddress = data; 21609 this.$refs.address_modal.visible = true; 21610 } else { 21611 this.location_data = data; 21612 } 21613 }, 21614 afterPointaddress(data){ 21615 console.log("afterPointaddress",data); 21616 this.$refs.address_modal.setLoading(true); 21617 axios({ 21618 method: 'POST', 21619 url: ajaxurl+"/setPlaceID" , 21620 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&place_id="+ data.place_id , 21621 timeout: $timeout, 21622 }).then( response => { 21623 window.location.href = next_url; 21624 }).catch(error => { 21625 ElementPlus.ElNotification({ 21626 title: "", 21627 message: error, 21628 position: 'bottom-right', 21629 type: 'warning', 21630 }); 21631 }).then(data => { 21632 this.$refs.address_modal.setLoading(false); 21633 }); 21634 }, 21635 onSavelocation(data,addressData){ 21636 this.$refs.address_form.setLoading(true); 21637 let params = { 21638 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 21639 'cart_uuid':getCookie('cart_uuid'), 21640 'data': data, 21641 'location_name' : addressData.location_name, 21642 'delivery_instructions' : addressData.delivery_instructions, 21643 'delivery_options' : addressData.delivery_options, 21644 'address_label' : addressData.address_label, 21645 'latitude' : data.latitude, 21646 'longitude' : data.longitude, 21647 'formatted_address' : addressData.formatted_address, 21648 'address1' : addressData.address1, 21649 'address2' : addressData.address2, 21650 'postal_code' : addressData.postal_code, 21651 'company' : addressData.company, 21652 'street': addressData.street, 21653 'house_number': addressData.house_number, 21654 'city': addressData.city, 21655 'address_format_use': addressData.address_format_use 21656 }; 21657 axios({ 21658 method: 'PUT', 21659 url: ajaxurl+"/SaveAddress" , 21660 data : params, 21661 timeout: $timeout, 21662 }).then( response => { 21663 if(response.data.code==1){ 21664 ElementPlus.ElNotification({ 21665 title: "", 21666 message: response.data.msg, 21667 position: 'bottom-right', 21668 type: 'success', 21669 }); 21670 window.location.href = next_url; 21671 } else { 21672 ElementPlus.ElNotification({ 21673 title: "", 21674 message: response.data.msg, 21675 position: 'bottom-right', 21676 type: 'warning', 21677 }); 21678 } 21679 }).catch(error => { 21680 ElementPlus.ElNotification({ 21681 title: "", 21682 message: error, 21683 position: 'bottom-right', 21684 type: 'warning', 21685 }); 21686 }).then(data => { 21687 this.$refs.address_form.setLoading(false); 21688 }); 21689 }, 21690 // 21691 }, 21692 }); 21693 app_home_search.use(ElementPlus); 21694 const vm_home_search = app_home_search.mount('#vm_home_search'); 21695 21696 21697 const app_cart_notifiations = Vue.createApp({ 21698 components: { 21699 'component-notification-cart': ComponentsNotificationCart 21700 }, 21701 methods: { 21702 afterReceiveitemupdate(data){ 21703 axios({ 21704 method: 'POST', 21705 url: ajaxurl+"/validateCartItems" , 21706 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid')+"&item_id="+data.item_id, 21707 timeout: $timeout, 21708 }).then( response => { 21709 if(response.data.code==1){ 21710 let $some_words = JSON.parse(some_words); 21711 ElementPlus.ElMessageBox.alert( response.data.msg, '', { 21712 confirmButtonText: $some_words.ok, 21713 callback: (action) => { 21714 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 21715 vm_cart_preview.getCartPreview(); 21716 }
21717 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 21718 vue_cart.loadcart(); 21719 } 21720 if ((typeof vm_item_suggestion !== "undefined") && ( vm_item_suggestion !== null)) { 21721 vm_item_suggestion.$refs.ref_item_suggestion.itemSuggestion(); 21722 } 21723 if ((typeof vm_item_featured_suggestion !== "undefined") && ( vm_item_featured_suggestion !== null)) { 21724 vm_item_featured_suggestion.$refs.ref_item_featured_suggestion.itemSuggestion(); 21725 } 21726 }, 21727 }); 21728 } 21729 }).catch(error => { 21730 // 21731 }).then(data => { 21732 }); 21733 } 21734 // 21735 }, 21736 }); 21737 app_cart_notifiations.use(ElementPlus); 21738 const vm_cart_notifiations = app_cart_notifiations.mount('#vue-notification-cart'); 21739 21740 21741 const ComponentsRiderVerifyCode = { 21742 props : ['resend_counter','uuid','label'], 21743 data() { 21744 return { 21745 loading : false, 21746 counter :0, 21747 timer:undefined, 21748 } 21749 }, 21750 created() { 21751 this.startTimer(); 21752 }, 21753 watch: { 21754 counter(newval, oldval) { 21755 if (newval <= 0) { 21756 this.stopTimer(); 21757 } 21758 }, 21759 }, 21760 methods: { 21761 startTimer() { 21762 this.counter = this.resend_counter; 21763 this.stopTimer(); 21764 this.timer = setInterval(() => { 21765 this.counter--; 21766 }, 1000); 21767 }, 21768 stopTimer() { 21769 clearInterval(this.timer); 21770 }, 21771 resendCode(){ 21772 this.loading = true; 21773 axios({ 21774 method: 'POST', 21775 url: ajaxurl+"/ResendRiderverificationcode" , 21776 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&uuid=" + this.uuid, 21777 timeout: $timeout, 21778 }).then( response => { 21779 if(response.data.code==1){ 21780 this.startTimer(); 21781 ElementPlus.ElNotification({ 21782 title: "", 21783 message: response.data.msg, 21784 position: 'bottom-right', 21785 type: 'success', 21786 }); 21787 window.location.href = response.data.details.redirect; 21788 } else { 21789 ElementPlus.ElNotification({ 21790 title: "", 21791 message: response.data.msg, 21792 position: 'bottom-right', 21793 type: 'warning', 21794 }); 21795 } 21796 }).catch(error => { 21797 // 21798 }).then(data => { 21799 this.loading = false; 21800 }); 21801 }, 21802 }, 21803 template : ` 21804 <div class="d-flex justify-content-between align-items-center"> 21805 <div><b>{{label.resend_code}} {{ counter }}</b></div> 21806 <div> 21807 <el-button type="text" 21808 :loading="loading" 21809 :disabled="counter != 0" 21810 @click="resendCode" 21811 > 21812 {{label.resend}} 21813 </el-button> 21814 </div> 21815 </div> 21816 `, 21817 }; 21818 21819 const app_rider_register = Vue.createApp({ 21820 components: { 21821 'component-phone' : ComponentsPhoneNumber, 21822 'component-rider-verifycode' : ComponentsRiderVerifyCode, 21823 }, 21824 data() { 21825 return { 21826 loading : false, 21827 mobile_number : '', 21828 mobile_prefix :'', 21829 first_name : '', 21830 last_name : '', 21831 email : '', 21832 address : '', 21833 password :'', 21834 cpassword : '', 21835 show_password : false, 21836 password_type: 'password', 21837 } 21838 }, 21839 computed: { 21840 validForm(){ 21841 if(empty(this.first_name)){ 21842 return false; 21843 } 21844 if(empty(this.last_name)){ 21845 return false; 21846 } 21847 if(empty(this.email)){ 21848 return false; 21849 } 21850 if(empty(this.password)){ 21851 return false; 21852 } 21853 if(empty(this.cpassword)){ 21854 return false; 21855 } 21856 if(empty(this.address)){ 21857 return false; 21858 } 21859 return true; 21860 } 21861 }, 21862 methods: { 21863 onRegister(){ 21864 this.loading = true; 21865 let data = "&mobile_prefix="+ this.mobile_prefix; 21866 data+="&mobile_number=" + this.mobile_number; 21867 data+="&first_name=" + this.first_name; 21868 data+="&last_name=" + this.last_name; 21869 data+="&email=" + this.email; 21870 data+="&address=" + this.address; 21871 data+="&password=" + this.password; 21872 data+="&cpassword=" + this.cpassword; 21873 axios({ 21874 method: 'POST', 21875 url: ajaxurl+"/riderRegistration" , 21876 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + data, 21877 timeout: $timeout, 21878 }).then( response => { 21879 if(response.data.code==1){ 21880 this.loading = true; 21881 ElementPlus.ElNotification({ 21882 title: "", 21883 message: response.data.msg, 21884 position: 'bottom-right', 21885 type: 'success', 21886 }); 21887 window.location.href = response.data.details.redirect; 21888 } else { 21889 ElementPlus.ElNotification({ 21890 title: "", 21891 message: response.data.msg, 21892 position: 'bottom-right', 21893 type: 'warning', 21894 }); 21895 } 21896 }).catch(error => { 21897 // 21898 }).then(data => { 21899 this.loading = false;
21900 }); 21901 }, 21902 showPassword() 21903 { 21904 this.show_password = this.show_password==true?false:true; 21905 if(this.show_password){ 21906 this.password_type = 'text'; 21907 } else this.password_type = 'password'; 21908 }, 21909 }, 21910 }); 21911 app_rider_register.use(Maska); 21912 app_rider_register.use(ElementPlus); 21913 const vm_rider_register = app_rider_register.mount('#vue-rider-registration'); 21914 21915 // END JS 1.0.8 21916 21917 21918 const ComponentsAvailablePoints = { 21919 data() { 21920 return { 21921 total : 0, 21922 total_animated: 0, 21923 loading : true, 21924 } 21925 }, 21926 watch: { 21927 total(newValue){ 21928 gsap.to(this.$data, { duration: 0.6, total_animated : newValue }); 21929 }, 21930 }, 21931 computed: { 21932 animatedTotal() { 21933 return this.total_animated.toFixed(0); 21934 }, 21935 }, 21936 mounted() { 21937 this.getAvailablePoints(); 21938 }, 21939 methods: { 21940 getAvailablePoints(){ 21941 this.loading = true; 21942 axios({ 21943 method: 'POST', 21944 url: ajaxurl+"/getAvailablePoints" , 21945 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 21946 timeout: $timeout, 21947 }).then( response => { 21948 this.total = response.data.details.total; 21949 }).catch(error => { 21950 // 21951 }).then(data => { 21952 this.loading = false; 21953 }); 21954 }, 21955 }, 21956 template : `{{animatedTotal}}` 21957 }; 21958 21959 const app_points = Vue.createApp({ 21960 components: { 21961 'component-available-points' : ComponentsAvailablePoints, 21962 }, 21963 data() { 21964 return { 21965 loading : false, 21966 data :[], 21967 has_data : false, 21968 show_next : false, 21969 tab : 'transaction', 21970 loading1 : false, 21971 data1 : [], 21972 show_next1 : false, 21973 page : 1, 21974 page2 : 1, 21975 loading_next : false, 21976 loading_next1 : false, 21977 } 21978 }, 21979 created() { 21980 this.getPointsTransaction(false); 21981 }, 21982 mounted() { 21983 this.getPointsTransactionMerchant(false); 21984 }, 21985 computed: { 21986 hasData(){ 21987 return this.has_data; 21988 }, 21989 getData(){ 21990 return this.data; 21991 }, 21992 showNext(){ 21993 return this.show_next; 21994 }, 21995 getData1(){ 21996 return this.data1; 21997 }, 21998 showNext1(){ 21999 return this.show_next1; 22000 }, 22001 }, 22002 methods: { 22003 getPointsTransaction(data){ 22004 this.has_data = false; 22005 if(data){ 22006 this.loading_next = true; 22007 } else this.loading = true; 22008 axios({ 22009 method: 'POST', 22010 url: ajaxurl+"/getPointsTransaction" , 22011 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&page="+this.page, 22012 timeout: $timeout, 22013 }).then( response => { 22014 this.data.push(response.data.details.data); 22015 this.has_data = true; 22016 this.show_next = response.data.details.show_next_page; 22017 this.page = response.data.details.page; 22018 }).catch(error => { 22019 // 22020 }).then(data => { 22021 this.loading = false; 22022 this.loading_next = false; 22023 }); 22024 }, 22025 getPointsTransactionMerchant(data){ 22026 if(data){ 22027 this.loading_next1 = true; 22028 } else this.loading1 = true; 22029 axios({ 22030 method: 'POST', 22031 url: ajaxurl+"/getPointsTransactionMerchant" , 22032 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&page="+this.page2, 22033 timeout: $timeout, 22034 }).then( response => { 22035 this.data1.push(response.data.details.data); 22036 this.show_next1 = response.data.details.show_next_page; 22037 this.page2 = response.data.details.page; 22038 }).catch(error => { 22039 // 22040 }).then(data => { 22041 this.loading1 = false; 22042 this.loading_next1 = false; 22043 }); 22044 }, 22045 nextPage(data){ 22046 this.getPointsTransaction(true); 22047 }, 22048 nextPage2(data){ 22049 this.getPointsTransactionMerchant(true); 22050 } 22051 }, 22052 }); 22053 app_points.use(ElementPlus); 22054 const vm_points = app_points.mount('#vue-my-points'); 22055 22056 22057 const formatTest = (percentage) => (percentage === 100 ? 'Full' : `${percentage}%`) 22058 22059 22060 const ComponentsApplyPoints = { 22061 props : ['title', 'is_mobile' , 'cancel_text', 'apply_text' , 'enter_points' ,'data' ,'use_thresholds'], 22062 data() { 22063 return { 22064 points : 0, 22065 is_submit : false, 22066 points_tab : undefined, 22067 data_points: [], 22068 balance: 0, 22069 points_id: 0, 22070 loading : false 22071 } 22072 }, 22073 computed: { 22074 hasData(){ 22075 if(this.points>0){ 22076 return false; 22077 } 22078 return true; 22079 } 22080 }, 22081 watch: { 22082 points_tab(newval,oldval){ 22083 dump(this.balance +"=>"+ newval.points); 22084 if(this.balance > newval.points){ 22085 this.points = newval.points; 22086 this.points_id = newval.id; 22087 } else { 22088 this.points = 0; 22089 this.points_id = 0 22090 } 22091 } 22092 }, 22093 created() { 22094 }, 22095 methods: { 22096 showModal(data){ 22097 if(data){ 22098 $(this.$refs.modal).modal('show'); 22099 } else { 22100 $(this.$refs.modal).modal('hide'); 22101 } 22102 22103 if(this.use_thresholds && data){ 22104 this.getPointsthresholds(); 22105 } 22106 }, 22107 applyPoints(){ 22108 this.is_submit = true; 22109 let currency_code = getCookie('currency_code'); 22110 currency_code = !empty(currency_code)?currency_code:''; 22111 axios({ 22112 method: 'POST', 22113 url: ajaxurl+"/applyPoints" , 22114 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&points=" + this.points + "&cart_uuid="+ getCookie('cart_uuid') + "¤cy_code=" + currency_code + "&points_id="+this.points_id, 22115 timeout: $timeout, 22116 }).then( response => { 22117 22118 if(response.data.code==1){ 22119 this.showModal(false); 22120 this.$emit('afterApplypoints'); 22121 } else { 22122 ElementPlus.ElNotification({ 22123 title: "", 22124 message: response.data.msg, 22125 position: 'bottom-right', 22126 type: 'warning', 22127 }); 22128 } 22129 22130 }).catch(error => { 22131 // 22132 }).then(data => { 22133 this.is_submit = false;
22134 }); 22135 }, 22136 getPointsthresholds(){ 22137 this.loading = true; 22138 let currency_code = getCookie('currency_code'); 22139 currency_code = !empty(currency_code)?currency_code:''; 22140 axios({ 22141 method: 'POST', 22142 url: ajaxurl+"/getPointsthresholds" , 22143 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid') + "¤cy_code=" + currency_code, 22144 timeout: $timeout, 22145 }).then( response => { 22146 if(response.data.code==1){ 22147 this.data_points = response.data.details.data; 22148 this.balance = response.data.details.balance; 22149 } 22150 }).catch(error => { 22151 // 22152 }).then(data => { 22153 this.loading = false; 22154 }); 22155 }, 22156 }, 22157 template : ` 22158 <div class="modal" ref="modal" tabindex="-1" role="dialog" 22159 aria-labelledby="promocodeModal" aria-hidden="true" data-backdrop="static" > 22160 <div class="modal-dialog" role="document"> 22161 <div class="modal-content" :class="{ 'modal-mobile' : is_mobile==1 }" > 22162 22163 <div class="modal-header border-bottom-0" style="padding-bottom:0px !important;"> 22164 <h5 class="modal-title" id="exampleModalLongTitle"> 22165 {{title}} 22166 </h5> 22167 <div class="close"> 22168 <a href="javascript:;" data-dismiss="modal" class="btn btn-black btn-circle rounded-pill"><i class="zmdi zmdi-close font20"></i></a> 22169 </div> 22170 </div> 22171 22172 <div class="modal-body"> 22173 22174 <form class="forms mt-2 apply-points-form" @submit.prevent="applyCode" > 22175 22176 22177 <template v-if="use_thresholds"> 22178 22179 <div v-loading="loading"> 22180 22181 <el-tabs 22182 v-model="points_tab" 22183 stretch 22184 > 22185 <template v-for="items in data_points" :keys="items"> 22186 <el-tab-pane label="User" :name="items" > 22187 <template #label> 22188 <Div v-if="balance < items.points" class="disabled-class"></Div> 22189 <span class="custom-tabs-label"> 22190 <div class="font13 font-weight-light">{{ items.label }}</div> 22191 <div class="font-weight-bold font20">{{ items.amount }}</div> 22192 <div> 22193 <el-progress 22194 :text-inside="true" 22195 :stroke-width="20" 22196 :percentage=" ((balance / items.points)*100)>100?100: (balance / items.points)*100 " 22197 :status="balance >= items.points ? 'success' : 'primary'" 22198 > 22199 <span> 22200 <template v-if="balance >= items.points"> 22201 REDEEM 22202 </template> 22203 </span> 22204 </el-progress> 22205 </div> 22206 </span> 22207 </template> 22208 </el-tab-pane> 22209 </template> 22210 </el-tabs> 22211 22212 </div> 22213 22214 </template> 22215 <template v-else> 22216 <div class="form-label-group"> 22217 <input v-model="points" class="form-control form-control-text" placeholder="" 22218 id="points" type="text" maxlength="20" > 22219 <label for="points" class="required">{{enter_points}}</label> 22220 </div> 22221 </template> 22222 22223 </form> <!--forms--> 22224 22225 </div> <!--modal body--> 22226 22227 <div class="modal-footer"> 22228 <button type="button" class="btn btn-black pl-4 pr-4" @click="showModal(false)" >{{cancel_text}}</button> 22229 <button type="button" class="btn btn btn-green pl-4 pr-4" 22230 @click="applyPoints" :class="{ loading: is_submit }" :disabled="hasData" 22231 >
22232 <span class="label">{{apply_text}}</span><div class="m-auto circle-loader" data-loader="circle-side"></div> 22233 </button> 22234 </div> 22235 22236 </div> <!--content--> 22237 </div> <!--dialog--> 22238 </div> <!--modal--> 22239 ` 22240 }; 22241 22242 const app_checkout_points = Vue.createApp({ 22243 components: { 22244 'components-apply-points' : ComponentsApplyPoints, 22245 }, 22246 data() { 22247 return { 22248 loading : true, 22249 loading_remove : false, 22250 data : [], 22251 } 22252 }, 22253 created() { 22254 this.getAvailablePoints(); 22255 }, 22256 methods: { 22257 getAvailablePoints(){ 22258 this.loading = true; 22259 let currency_code = getCookie('currency_code'); 22260 currency_code = !empty(currency_code)?currency_code:''; 22261 axios({ 22262 method: 'POST', 22263 url: ajaxurl+"/getCartpoints" , 22264 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid') + "¤cy_code=" + currency_code, 22265 timeout: $timeout, 22266 }).then( response => { 22267 this.data = response.data.details; 22268 }).catch(error => { 22269 // 22270 }).then(data => { 22271 this.loading = false; 22272 }); 22273 }, 22274 showApplyPoints(){ 22275 this.$refs.apply_points.showModal(true); 22276 }, 22277 afterApplypoints(){ 22278 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 22279 vue_cart.loadcart(); 22280 } 22281 this.getAvailablePoints(); 22282 }, 22283 removePoints(){ 22284 this.loading_remove = true; 22285 axios({ 22286 method: 'POST', 22287 url: ajaxurl+"/removePoints" , 22288 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid="+ getCookie('cart_uuid'), 22289 timeout: $timeout, 22290 }).then( response => { 22291 if ((typeof vue_cart !== "undefined") && ( vue_cart !== null)) { 22292 vue_cart.loadcart(); 22293 } 22294 this.getAvailablePoints(); 22295 }).catch(error => { 22296 // 22297 }).then(data => { 22298 this.loading_remove = false; 22299 }); 22300 }, 22301 }, 22302 }); 22303 app_checkout_points.use(ElementPlus); 22304 const vm_checkout_points = app_checkout_points.mount('#vue-checkout-points'); 22305 22306 22307 const ComponentSearchFood = { 22308 props : ['label'], 22309 data() { 22310 return { 22311 q :'', 22312 data : [] 22313 } 22314 }, 22315 computed: { 22316 hasSearch(){ 22317 if(this.q==''){ 22318 return false; 22319 } 22320 return true; 22321 } 22322 }, 22323 methods: { 22324 async querySearch(queryString,callbackfn){ 22325 axios({ 22326 method: 'POST', 22327 url: ajaxurl+"/SearchSuggestion" , 22328 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&q=" + queryString, 22329 timeout: $timeout, 22330 }).then( response => { 22331 if(response.data.code==1){ 22332 callbackfn(response.data.details); 22333 } else { 22334 callbackfn([]); 22335 } 22336 }).catch(error => { 22337 callbackfn([]); 22338 }).then(data => { 22339 22340 }); 22341 }, 22342 handleSelect(data){ 22343 this.$emit("afterSuggestion",data.name); 22344 } 22345 }, 22346 template : ` 22347 <el-autocomplete 22348 v-model="q" 22349 :fetch-suggestions="querySearch" 22350 @select="handleSelect" 22351 :placeholder="label.search" 22352 :trigger-on-focus="false" 22353 :fit-input-width="false" 22354 class="w-100" 22355 size="large" 22356 value-key="name" 22357 :clearable="true" 22358 :select-when-unmatched="true" 22359 :highlight-first-item="true" 22360 > 22361 <template #default="{ item }"> 22362 <div class="value" v-html="item.name"></div> 22363 </template> 22364 </el-autocomplete> 22365 ` 22366 }; 22367 22368 const ComponentsItemList = { 22369 props : ['data','items_not_available', 'category_not_available'], 22370 template: '#xtemplate_item_list', 22371 methods: { 22372 viewItem(data){ 22373 this.$emit('handleView',{ 22374 cat_id : data.cat_id, 22375 item_uuid : data.item_uuid, 22376 merchant_id : data.merchant_id, 22377 }); 22378 }, 22379 itemAvailable(item_id,cat_id){ 22380 if(this.items_not_available.includes(parseInt(item_id))===false){ 22381 if(this.category_not_available.includes(parseInt(cat_id))===false){ 22382 return true; 22383 } 22384 } 22385 return false; 22386 }, 22387 }, 22388 }; 22389 22390 const ComponentSearchFoodResult = { 22391 props : ['q'], 22392 components : { 22393 'components-item-list' : ComponentsItemList 22394 }, 22395 data() { 22396 return { 22397 tabs : 'searchFood', 22398 loading : false, 22399 food_list : [], 22400 merchant_list : [], 22401 total_food : 0, 22402 merchant_data : [], 22403 total_merchant : 0, 22404 cuisine : [], 22405 items_not_available : [], 22406 category_not_available : [] 22407 } 22408 }, 22409 watch: { 22410 q(newval,oldval){ 22411 this.doSearch(newval,this.tabs); 22412 } 22413 }, 22414 computed: { 22415 hasDataFood(){ 22416 if (Object.keys(this.food_list).length > 0) { 22417 return true; 22418 } 22419 return false;
22420 }, 22421 getFood(){ 22422 return this.food_list; 22423 }, 22424 getFoodCount(){ 22425 return this.total_food; 22426 }, 22427 hasQ(){ 22428 return !empty(this.q) ? true: false; 22429 }, 22430 hasMerchant(){ 22431 if (Object.keys(this.merchant_data).length > 0) { 22432 return true; 22433 } 22434 return false; 22435 }, 22436 getMerchant(){ 22437 return this.merchant_data; 22438 }, 22439 getMerchantCount(){ 22440 return this.total_merchant; 22441 }, 22442 }, 22443 methods: { 22444 tabClick(tab,Event){ 22445 this.doSearch(this.q,tab.paneName); 22446 }, 22447 doSearch(data,tabName){ 22448 let currency_code = getCookie('currency_code'); 22449 currency_code = !empty(currency_code)?currency_code:''; 22450 this.loading = true; 22451 axios({ 22452 method: 'POST', 22453 url: ajaxurl+"/"+tabName , 22454 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&q=" + data + "¤cy_code=" + currency_code, 22455 timeout: $timeout, 22456 }).then( response => { 22457 if(response.data.code==1){ 22458 if(tabName=="searchFood"){ 22459 this.food_list = response.data.details.food_list; 22460 this.merchant_list = response.data.details.merchant_list; 22461 this.total_food = response.data.details.total; 22462 this.items_not_available = response.data.details.items_not_available; 22463 this.category_not_available = response.data.details.category_not_available; 22464 } else { 22465 this.merchant_data = response.data.details.merchant_data; 22466 this.cuisine = response.data.details.cuisine; 22467 this.total_merchant = response.data.details.total; 22468 } 22469 this.$emit('setSearch',true) 22470 } else { 22471 this.clearData(); 22472 } 22473 }).catch(error => { 22474 this.clearData(); 22475 }).then(data => { 22476 this.loading = false; 22477 }); 22478 }, 22479 clearData(){ 22480 this.food_list = []; 22481 this.merchant_list = []; 22482 this.total_food = 0; 22483 }, 22484 handleView(data){ 22485 this.$emit('handleView',{ 22486 cat_id : data.cat_id, 22487 item_uuid : data.item_uuid, 22488 merchant_id : data.merchant_id, 22489 }); 22490 } 22491 }, 22492 template: '#xtemplate_search_food_result', 22493 }; 22494 22495 const ComponentItemDetails = { 22496 template: '#xtemplate_item_details', 22497 components : { 22498 'money-format': ComponentsMoney, 22499 }, 22500 data() { 22501 return { 22502 merchant_id : 0, 22503 menu_loading : true, 22504 menu_data: [], 22505 items : [], 22506 item_addons : [], 22507 item_addons_load : false, 22508 size_id : 0, 22509 disabled_cart : true, 22510 item_qty : 1, 22511 item_total : 0, 22512 add_to_cart : false, 22513 meta : [], 22514 special_instructions : '', 22515 sold_out_options : [], 22516 if_sold_out : 'substitute', 22517 view_data : [] , 22518 item_loading : false, 22519 item_in_cart : 0, 22520 merchant_data : [], 22521 items_not_available : [], 22522 category_not_available : [], 22523 showText: null, 22524 menu_layout :'list', 22525 q: '', 22526 search_menu_data : [], 22527 allergen : [], 22528 allergen_data : [], 22529 item_gallery : [], 22530 image_featured : '', 22531 title : '', 22532 new_order_label : '', 22533 money_config : [] 22534 } 22535 }, 22536 mounted() { 22537 let $some_words = JSON.parse(some_words); 22538 if (Object.keys($some_words).length > 0) { 22539 this.title = $some_words.created_new_order + "?"; 22540 this.new_order_label = $some_words.new_order_label; 22541 } 22542 }, 22543 updated () { 22544 if(this.item_addons_load==true){ 22545 this.ItemSummary(); 22546 } 22547 }, // 22548 computed: { 22549 getAllergen(){ 22550 return this.allergen; 22551 }, 22552 hasAllergen(){ 22553 if (Object.keys(this.allergen).length > 0) { 22554 return true; 22555 } 22556 return false; 22557 }, 22558 getItemGallery(){ 22559 return this.item_gallery; 22560 } 22561 }, 22562 methods: { 22563 toggleText(idx) { 22564 this.showText === idx ? this.showText = null : this.showText = idx 22565 }, 22566 getMenuItem(data){ 22567 let currency_code = getCookie('currency_code'); 22568 currency_code = !empty(currency_code)?currency_code:''; 22569 22570 let parameters = 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&merchant_id=" + data.merchant_id; 22571 parameters+="&cat_id="+data.cat_id; 22572 parameters+="&item_uuid="+data.item_uuid; 22573 parameters+="¤cy_code="+currency_code; 22574 22575 this.item_loading = true; 22576 NProgress.start(); 22577 axios({ 22578 method: 'POST', 22579 url: ajaxurl+"/getMenuItem" , 22580 data : parameters, 22581 timeout: $timeout, 22582 }).then( response => { 22583 //dump(response.data.details); 22584 if(response.data.code==1){ 22585 $('#itemModal').modal('show'); 22586 22587 $global_items = response.data.details.data.items; 22588 $global_addons = response.data.details.data.addons; 22589 $global_addon_items = response.data.details.data.addon_items; 22590 $global_item_addons = response.data.details.data.items.item_addons; 22591 22592 var $meta = response.data.details.data.meta; 22593 this.money_config = response.data.details.money_config; 22594 this.item_gallery = response.data.details.data.meta.item_gallery; 22595 this.image_featured = ''; 22596 this.renderGallery(); 22597 22598 var $meta_details = response.data.details.data.meta_details; 22599 var $new_meta = { 22600 'cooking_ref' : [], 22601 'ingredients' : [], 22602 'dish' : [], 22603 }; 22604 22605 let $ingredients_preselected = response.data.details.data.items.ingredients_preselected; 22606 22607 if( !empty($meta)){ 22608 $.each($meta,function(key, item) { 22609 $.each(item,function(key2, item2) { 22610 if(!empty($meta_details[key])){ 22611 if(!empty($meta_details[key][item2])){ 22612 let $defaul_check = false;
22613 if(key=="ingredients" && $ingredients_preselected){ 22614 $defaul_check = true; 22615 } 22616 $new_meta[key].push({ 22617 'meta_id': $meta_details[key][item2].meta_id, 22618 'meta_name': $meta_details[key][item2].meta_name, 22619 'checked': $defaul_check 22620 }); 22621 } 22622 } 22623 }); 22624 }); 22625 } 22626 22627 var $price = $global_items.price; 22628 var $size_id = Object.keys($price)[0]; 22629 22630 this.item_qty = 1; 22631 this.service = getCookie('cart_transaction_type') ? getCookie('cart_transaction_type') : 'delivery'; 22632 this.items = $global_items; 22633 // dump("=>"); 22634 // dump(this.items); 22635 this.size_id = $size_id; 22636 this.meta = $new_meta; 22637 this.getSizeData($size_id); 22638 this.sold_out_options = response.data.details.sold_out_options; 22639 22640 } else { 22641 $('#itemModal').modal('hide'); 22642 } 22643 }).catch(error => { 22644 22645 }).then(data => { 22646 this.item_loading = false; 22647 NProgress.done(); 22648 }); 22649 }, 22650 setItemSize(event){ 22651 var $size_id = event.currentTarget.firstElementChild.value; 22652 this.size_id = $size_id;
22653 this.getSizeData($size_id); 22654 22655 }, // end setItemSize 22656 getSizeData($size_id){ 22657 var item_size_id = $global_items.price[$size_id].size_id; 22658 $new_item_addons = []; var $sub_items=[]; 22659 22660 if( !empty($global_item_addons[$size_id]) ){ 22661 $.each($global_item_addons[$size_id],function(key, item) { 22662 if(!empty($global_addons[$size_id])){ 22663 if(!empty($global_addons[$size_id][item])){ 22664 22665 $global_addons[$size_id][item].subcat_id 22666 $.each($global_addons[$size_id][item].sub_items,function(key2, item2) { 22667 if ((typeof $global_addon_items[item2] !== "undefined") && ( $global_addon_items[item2] !== null)) { 22668 $sub_items.push({ 22669 'sub_item_id':$global_addon_items[item2].sub_item_id, 22670 'sub_item_name':$global_addon_items[item2].sub_item_name, 22671 'item_description':$global_addon_items[item2].item_description, 22672 //'price':$global_addon_items[item2].price, 22673 //'pretty_price':$global_addon_items[item2].pretty_price, 22674 'price':$global_addon_items[item2].addon_price != '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 22675 'pretty_price':$global_addon_items[item2].addon_price!= '' && $global_addon_items[item2].addon_price !== null ? $global_addon_items[item2].addon_price[item_size_id] : $global_addon_items[item2].price, 22676 'checked':false, 22677 'disabled':false, 22678 'qty':1 22679 }); 22680 } 22681 }); 22682 22683 $new_item_addons.push({ 22684 'subcat_id' : $global_addons[$size_id][item].subcat_id, 22685 'subcategory_name' : $global_addons[$size_id][item].subcategory_name, 22686 'subcategory_description' : $global_addons[$size_id][item].subcategory_description, 22687 'multi_option' : $global_addons[$size_id][item].multi_option, 22688 'multi_option_min' : $global_addons[$size_id][item].multi_option_min, 22689 'multi_option_value' : $global_addons[$size_id][item].multi_option_value, 22690 'require_addon' : $global_addons[$size_id][item].require_addon, 22691 'pre_selected' : $global_addons[$size_id][item].pre_selected, 22692 'sub_items_checked': $global_addons[$size_id][item].multi_option == "one" ? $sub_items[0].sub_item_id : '', 22693 'sub_items':$sub_items 22694 }); 22695 $sub_items = [] ; 22696 } 22697 } 22698 }); 22699 } 22700 22701 22702 this.item_addons = $new_item_addons; 22703 this.item_addons_load = true; 22704 }, // end getSizeData 22705 renderGallery(){ 22706 setTimeout(() => { 22707 let $is_rtl = false; 22708 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 22709 $is_rtl = is_rtl=='1'?true:false; 22710 } 22711 $(this.$refs.owl_item_gallery).owlCarousel({ 22712 loop:false, 22713 margin:10, 22714 nav:false, 22715 dots:false, 22716 rtl : $is_rtl, 22717 responsive:{ 22718 0:{ 22719 items:1 22720 }, 22721 600:{ 22722 items:3 22723 }, 22724 1000:{ 22725 items:5 22726 } 22727 } 22728 }); 22729 }, 10); 22730 }, 22731 setImage(data){ 22732 this.image_featured = data; 22733 }, 22734 ItemSummary(data){ 22735 $item_total = 0; 22736 var $required_addon = []; 22737 var $required_addon_added = []; 22738 let $min_addon = []; 22739 let $min_addon_added = []; 22740 22741 if(!empty(this.items.price)){ 22742 if(!empty(this.items.price[this.size_id])){ 22743 var item = this.items.price[this.size_id]; 22744 if( item.discount>0){ 22745 $item_total+=( this.item_qty * parseFloat(item.price_after_discount) ); 22746 } else $item_total+=( this.item_qty * parseFloat(item.price) ); 22747 } 22748 } 22749 22750 this.item_addons.forEach((item,index) => { 22751 22752 //dump("=>" + item.multi_option); 22753 if ( item.require_addon==1){ 22754 $required_addon.push(item.subcat_id); 22755 } 22756 22757 if(item.multi_option=="custom"){ 22758 var total_check = 0; 22759 let multi_option_min = item.multi_option_min; 22760 var multi_option_value = item.multi_option_value; 22761 22762 if(multi_option_value>0){ 22763 $min_addon.push({ 22764 'subcat_id': item.subcat_id, 22765 'min':multi_option_min, 22766 'max':multi_option_value 22767 }); 22768 } 22769 22770 var item_index=[]; var item_index2=[];
22771 item.sub_items.forEach((item2,index2) => { 22772 if(item2.checked==true){ 22773 total_check++; 22774 $item_total+=( this.item_qty * parseFloat(item2.price) ); 22775 $required_addon_added.push( item.subcat_id ); 22776 } else item_index.push(index2); 22777 22778 if(item2.disabled==true){ 22779 item_index2.push(index2); 22780 } 22781 22782 }); 22783 22784 22785 $min_addon_added[item.subcat_id] = { 22786 'total' : total_check 22787 }; 22788 22789 if(total_check>=multi_option_value){ 22790 item_index.forEach((item3,index3) => { 22791 this.item_addons[index].sub_items[item3].disabled = true; 22792 }); 22793 } else { 22794 item_index2.forEach((item3,index3) => { 22795 this.item_addons[index].sub_items[item3].disabled = false; 22796 }); 22797 } 22798 22799 } else if ( item.multi_option=="one" ){ 22800 item.sub_items.forEach((item2,index2) => { 22801 if( item2.sub_item_id == item.sub_items_checked ) { 22802 $item_total+=( this.item_qty * parseFloat(item2.price) ); 22803 $required_addon_added.push( item.subcat_id ); 22804 } 22805 }); 22806 } else if ( item.multi_option=="multiple" ){ 22807 var item_index=[]; 22808 let multi_option_min = item.multi_option_min; 22809 var multi_option_value = item.multi_option_value; 22810 var limit = 0; 22811 22812 if(multi_option_value>0){ 22813 $min_addon.push({ 22814 'subcat_id': item.subcat_id, 22815 'min':multi_option_min, 22816 'max':multi_option_value 22817 }); 22818 } 22819 22820 item.sub_items.forEach((item2,index2) => { 22821 if(item2.checked==true){ 22822 $item_total+=( item2.qty * parseFloat(item2.price) ); 22823 $required_addon_added.push( item.subcat_id ); 22824 limit += item2.qty; 22825 } 22826 item_index.push(index2); 22827 }); 22828 22829 $min_addon_added[item.subcat_id] = { 22830 'total' : limit 22831 }; 22832 22833 this.item_addons[index].qty_selected =limit; 22834 if ( this.item_addons[index].qty_selected>= multi_option_value){ 22835 item_index.forEach((item3,index2) => { 22836 this.item_addons[index].sub_items[item3].disabled = true; 22837 }); 22838 } else { 22839 item_index.forEach((item3,index2) => { 22840 this.item_addons[index].sub_items[item3].disabled = false; 22841 }); 22842 } 22843 22844 } /*endif custom*/ 22845 22846 });/* end loop*/ 22847 22848 22849 this.item_total = $item_total; 22850 22851 var $required_meet=true; 22852 if($required_addon.length>0){ 22853 $.each($required_addon, function(i, val){ 22854 if($required_addon_added.includes(val)===false){ 22855 $required_meet = false; 22856 return false; 22857 } 22858 }); 22859 } 22860 22861 // CHECK COOKING REF 22862 if(this.items.cooking_ref_required){ 22863 let $cooking_ref_check = false; 22864 if (Object.keys(this.meta.cooking_ref).length > 0) { 22865 Object.entries(this.meta.cooking_ref).forEach(([cooking_key, cooking_items]) => { 22866 if(cooking_items.checked){ 22867 $cooking_ref_check = true; 22868 } 22869 }); 22870 } 22871 if(!$cooking_ref_check){ 22872 $required_meet = false; 22873 } 22874 } 22875 22876 if (Object.keys($min_addon).length > 0) { 22877 let min_value,min_selected; 22878 Object.entries($min_addon).forEach(([key_min_addon, items_min_addon]) => { 22879 min_value = parseInt(items_min_addon.min); 22880 if($min_addon_added[items_min_addon.subcat_id]){ 22881 min_selected = parseInt($min_addon_added[items_min_addon.subcat_id].total); 22882 } 22883 if(min_selected>0){ 22884 if(min_value>min_selected){ 22885 $required_meet = false; 22886 } 22887 } 22888 }); 22889 } 22890 22891 //dump("required_meet=>"+$required_meet); 22892 if($required_meet){ 22893 this.disabled_cart = false; 22894 } else this.disabled_cart = true; 22895 22896 }, // end ItemSummary 22897 CheckaddCartItems(){ 22898 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 22899 let cart_merchant_id = vm_cart_preview.$refs.childref.cart_merchant.merchant_id; 22900 if ((typeof cart_merchant_id !== "undefined") && ( cart_merchant_id !== null)) { 22901 if ( this.items.merchant_id != vm_cart_preview.$refs.childref.cart_merchant.merchant_id ){ 22902 $('#itemModal').modal('hide'); 22903 22904 ElementPlus.ElMessageBox.confirm( 22905 vm_cart_preview.$refs.childref.cart_merchant.confirm_add_item, 22906 this.title, 22907 { 22908 confirmButtonText: this.new_order_label,
22909 showCancelButton: false, 22910 type: 'info', 22911 buttonSize : 'large' 22912 } 22913 ).then(() => { 22914 this.clearCart( vm_cart_preview.$refs.childref.cart_uuid ); 22915 }).catch(() => { 22916 // 22917 }); 22918 } else this.addCartItems(); 22919 } else this.addCartItems(); 22920 } else this.addCartItems(); 22921 }, 22922 clearCart(cart_uuid){ 22923 NProgress.start(); 22924 axios({ 22925 method: 'POST', 22926 url: ajaxurl+"/clearCart" , 22927 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&cart_uuid=" + cart_uuid, 22928 timeout: $timeout, 22929 }).then( response => { 22930 if(response.data.code==1){ 22931 this.addCartItems(); 22932 } else { 22933 ElementPlus.ElNotification({ 22934 title: "", 22935 message: response.data.msg, 22936 position: 'bottom-right', 22937 type: 'warning', 22938 }); 22939 } 22940 }).catch(error => { 22941 22942 }).then(data => { 22943 NProgress.done(); 22944 }); 22945 }, 22946 addCartItems(event){ 22947 if (event) { 22948 event.preventDefault() 22949 } 22950 22951 this.add_to_cart = true; 22952 22953 let transactionType = this.transaction_type ? this.transaction_type : getCookie('cart_transaction_type'); 22954 22955 var $params = { 22956 'YII_CSRF_TOKEN':$('meta[name=YII_CSRF_TOKEN]').attr('content'), 22957 'merchant_id' : this.items.merchant_id, 22958 'cat_id' : this.items.cat_id, 22959 'item_token': this.items.item_token, 22960 'item_size_id': this.size_id, 22961 'item_qty': this.item_qty, 22962 'item_addons': this.item_addons, 22963 'special_instructions': this.special_instructions, 22964 'meta' : this.meta, 22965 'cart_uuid':getCookie('cart_uuid'), 22966 'transaction_type': transactionType, 22967 'if_sold_out' : this.if_sold_out, 22968 }; 22969 22970 var timenow = 1; 22971 $params = JSON.stringify($params); 22972 22973 ajax_request[timenow] = $.ajax({ 22974 url: ajaxurl+"/addCartItems", 22975 method: "PUT", 22976 dataType: "json", 22977 data: $params , 22978 contentType : $content_type.json , 22979 timeout: $timeout, 22980 crossDomain: true, 22981 beforeSend: function( xhr ) { 22982 if(ajax_request[timenow] != null) { 22983 ajax_request[timenow].abort(); 22984 } 22985 } 22986 }); 22987 22988 ajax_request[timenow].done( data => { 22989 if ( data.code==1){ 22990 setCookie('cart_uuid',data.details.cart_uuid,30); 22991 $('#itemModal').modal('hide'); 22992 if ((typeof vm_cart_preview !== "undefined") && ( vm_cart_preview !== null)) { 22993 vm_cart_preview.getCartPreview(); 22994 vm_cart_preview.showCartPreview(); 22995 } 22996 } 22997 }); 22998 22999 ajax_request[timenow].always( data => { 23000 dump('always'); 23001 this.add_to_cart = false; 23002 }); 23003 23004 } , 23005 // end addCartItems 23006 // 23007 }, 23008 }; 23009 23010 const ComponentsFoodList = { 23011 props : ['meta_name','sub_title'], 23012 components : { 23013 'components-item-list' : ComponentsItemList 23014 }, 23015 data() { 23016 return { 23017 loading : false, 23018 food_list : [], 23019 merchant_list : [], 23020 items_not_available : [], 23021 category_not_available : [], 23022 title : '' 23023 } 23024 }, 23025 created() { 23026 this.getFoodList() 23027 }, 23028 computed: { 23029 hasDataFood(){ 23030 if (Object.keys(this.food_list).length > 0) { 23031 return true; 23032 } 23033 return false; 23034 }, 23035 getFood(){ 23036 return this.food_list; 23037 }, 23038 }, 23039 methods: { 23040 getFoodList(){ 23041 let currency_code = getCookie('currency_code'); 23042 currency_code = !empty(currency_code)?currency_code:''; 23043 this.loading = true; 23044 axios({ 23045 method: 'POST', 23046 url: ajaxurl+"/getFoodList" , 23047 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') +"&meta_name="+this.meta_name + "¤cy_code="+currency_code, 23048 timeout: $timeout, 23049 }).then( response => { 23050 if(response.data.code==1){ 23051 this.title = response.data.details.title; 23052 this.food_list = response.data.details.food_list; 23053 this.merchant_list = response.data.details.merchant_list; 23054 this.total_food = response.data.details.total; 23055 this.items_not_available = response.data.details.items_not_available; 23056 this.category_not_available = response.data.details.category_not_available; 23057 this.renderSlide(); 23058 } 23059 }).catch(error => { 23060 // 23061 }).then(data => { 23062 this.loading = false;
23063 }); 23064 }, 23065 renderSlide(){ 23066 setTimeout(() => { 23067 let $is_rtl = false; 23068 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 23069 $is_rtl = is_rtl=='1'?true:false; 23070 } 23071 $(this.$refs.owl_item_slide).owlCarousel({ 23072 loop:false, 23073 margin:10, 23074 nav:true, 23075 dots:false, 23076 navText: [$( this.$refs.owl_next ),$( this.$refs.owl_previous )], 23077 rtl : $is_rtl, 23078 responsive:{ 23079 0:{ 23080 items:1 23081 }, 23082 600:{ 23083 items:3 23084 }, 23085 1000:{ 23086 items:5 23087 } 23088 } 23089 }); 23090 }, 10); 23091 }, 23092 viewItem(data){ 23093 this.$emit('handleView',{ 23094 cat_id : data.cat_id, 23095 item_uuid : data.item_uuid, 23096 merchant_id : data.merchant_id, 23097 }); 23098 }, 23099 itemAvailable(item_id,cat_id){ 23100 if(this.items_not_available.includes(parseInt(item_id))===false){ 23101 if(this.category_not_available.includes(parseInt(cat_id))===false){ 23102 return true; 23103 } 23104 } 23105 return false; 23106 }, 23107 }, 23108 template: '#xtemplate_food_carousel', 23109 }; 23110 23111 //vue-search 23112 const app_search = Vue.createApp({ 23113 data() { 23114 return { 23115 searchString : '', 23116 isSearch : false 23117 } 23118 }, 23119 components: { 23120 'components-search-food' : ComponentSearchFood, 23121 'components-search-food-result' : ComponentSearchFoodResult, 23122 'components-item-details' : ComponentItemDetails, 23123 'components-food-list' : ComponentsFoodList 23124 }, 23125 computed: { 23126 getisSearch(){ 23127 return this.isSearch; 23128 } 23129 }, 23130 methods: { 23131 afterSuggestion(data){ 23132 this.searchString = data; 23133 }, 23134 handleView(data){ 23135 this.$refs.item_details.getMenuItem(data); 23136 }, 23137 setSearch(data){ 23138 this.isSearch = data; 23139 } 23140 }, 23141 }); 23142 app_search.use(ElementPlus); 23143 const vm_app_search = app_search.mount('#vue-search'); 23144 23145 const app_checkout_booking = Vue.createApp({ 23146 data() { 23147 return { 23148 loading : false, 23149 room_list : [], 23150 table_list : [], 23151 room_uuid :"", 23152 table_uuid :"", 23153 transaction_type :'', 23154 guest_number : 1, 23155 booking_enabled : false, 23156 } 23157 }, 23158 created() { 23159 this.getTableAttributes(); 23160 }, 23161 methods: { 23162 getTableAttributes(){ 23163 this.loading = true; 23164 axios({ 23165 method: 'POST', 23166 url: ajaxurl+"/getTableAttributes" , 23167 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&cart_uuid=" + getCookie('cart_uuid'), 23168 timeout: $timeout, 23169 }).then( response => { 23170 if(response.data.code==1){ 23171 this.room_list = response.data.details.room_list; 23172 this.table_list = response.data.details.table_list; 23173 this.booking_enabled = response.data.details.booking_enabled; 23174 } 23175 }).catch(error => { 23176 // 23177 }).then(data => { 23178 this.loading = false; 23179 }); 23180 }, 23181 clearTableList(){ 23182 this.table_uuid = ''; 23183 }, 23184 // 23185 }, 23186 }); 23187 app_checkout_booking.use(ElementPlus); 23188 const vm_checkout_booking = app_checkout_booking.mount('#vue-checkout-booking'); 23189 23190 const ComponentsWalletBalance = { 23191 data() { 23192 return { 23193 total : 0, 23194 total_animated: 0, 23195 loading : true, 23196 } 23197 }, 23198 watch: { 23199 total(newValue){ 23200 gsap.to(this.$data, { duration: 0.6, total_animated : newValue }); 23201 }, 23202 }, 23203 computed: { 23204 animatedTotal() { 23205 return this.total_animated; 23206 }, 23207 }, 23208 mounted() { 23209 this.getBalance(); 23210 }, 23211 methods: { 23212 getBalance(){ 23213 this.loading = true; 23214 axios({ 23215 method: 'POST', 23216 url: ajaxurl+"/getWalletBalance" , 23217 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 23218 timeout: $timeout, 23219 }).then( response => { 23220 this.total = response.data.details.total; 23221 }).catch(error => { 23222 // 23223 }).then(data => { 23224 this.loading = false; 23225 }); 23226 }, 23227 }, 23228 template : `{{animatedTotal}}` 23229 }; 23230 23231 const ComponentsWalletTransaction = { 23232 props:['data','has_data','loading','show_next'], 23233 template: '#xtemplate_wallet_transaction', 23234 }; 23235 23236 const componentsTopupForm = { 23237 props:['label', 'topup_minimum' ,'topup_maximum'], 23238 data() { 23239 return { 23240 modal:false, 23241 amount :1, 23242 loading : false, 23243 default_payment : [], 23244 loading_submit : false, 23245 loading_payment : false, 23246 } 23247 }, 23248 created() { 23249 this.getCustomerDefaultPayment() 23250 }, 23251 computed: { 23252 getPayment(){ 23253 return this.default_payment; 23254 } 23255 }, 23256 methods: { 23257 show(){ 23258 this.modal = true; 23259 }, 23260 close(){ 23261 this.modal = false;
23262 }, 23263 getCustomerDefaultPayment(){ 23264 this.loading = true; 23265 axios({ 23266 method: 'POST', 23267 url: ajaxurl+"/getCustomerDefaultPayment" , 23268 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content'), 23269 timeout: $timeout, 23270 }).then( response => { 23271 if(response.data.code==1){ 23272 this.default_payment = response.data.details.data; 23273 } 23274 }).catch(error => { 23275 // 23276 }).then(data => { 23277 this.loading = false; 23278 }); 23279 }, 23280 onAddfunds(){ 23281 this.loading_submit = true; 23282 let currency_code = getCookie('currency_code'); 23283 currency_code = !empty(currency_code)?currency_code:''; 23284 axios({ 23285 method: 'POST', 23286 url: ajaxurl+"/prepareAddFunds" , 23287 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&amount="+this.amount + 23288 "&payment_code="+this.default_payment.payment_code + "&payment_uuid="+ this.default_payment.payment_uuid + "¤cy_code="+currency_code, 23289 timeout: $timeout, 23290 }).then( response => { 23291 if(response.data.code==1){ 23292 this.$emit('afterPreparepayment',response.data.details); 23293 } else { 23294 ElementPlus.ElNotification({ 23295 title: "", 23296 message: response.data.msg, 23297 position: 'bottom-right', 23298 type: 'warning', 23299 }); 23300 } 23301 }).catch(error => { 23302 // 23303 }).then(data => { 23304 this.loading_submit = false; 23305 }); 23306 }, 23307 }, 23308 template: '#xtemplate_topupform', 23309 }; 23310 23311 const componentSuccesfulModal = { 23312 props : ['data'], 23313 data() { 23314 return { 23315 modal:false 23316 } 23317 }, 23318 template: '#xtemplate_succesful_modal', 23319 }; 23320 23321 const componentBonusFunds = { 23322 props : ['transaction_type'], 23323 data(){ 23324 return { 23325 owl : undefined, 23326 data :[], 23327 loading :false 23328 }; 23329 }, 23330 mounted(){ 23331 this.bonusFunds(); 23332 }, 23333 computed: { 23334 hasData(){ 23335 if (Object.keys(this.data).length > 0) { 23336 return true; 23337 } 23338 return false; 23339 }, 23340 }, 23341 watch: { 23342 data(new_data,old_data){ 23343 setTimeout(() => { 23344 this.renderCarousel(); 23345 }, 1); 23346 } 23347 }, 23348 methods: { 23349 bonusFunds(){ 23350 this.loading = true; 23351 axios({ 23352 method: 'POST', 23353 url: ajaxurl+"/getDiscount" , 23354 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&transaction_type="+this.transaction_type, 23355 timeout: $timeout, 23356 }).then( response => { 23357 if(response.data.code==1){ 23358 this.data = response.data.details; 23359 } else { 23360 this.data = []; 23361 } 23362 }).catch(error => { 23363 // 23364 }).then(data => { 23365 this.loading = false; 23366 }); 23367 }, 23368 renderCarousel(){ 23369 let $is_rtl = false; 23370 if ((typeof is_rtl !== "undefined") && ( is_rtl !== null)) { 23371 $is_rtl = is_rtl=='1'?true:false; 23372 } 23373 this.owl = $(this.$refs.carousel_bonusfunds).owlCarousel({ 23374 loop:true, 23375 dots:false, 23376 nav:false, 23377 autoWidth:true, 23378 rtl : $is_rtl 23379 }); 23380 }, 23381 }, 23382 template: ` 23383 <div ref="carousel_bonusfunds" class="owl-carousel owl-theme carousel_bonusfunds"> 23384 <div v-for="(items, index) in data" class="mr-2"> 23385 <el-card shadow="hover" class="gradient-yellow-bg" style="max-width:350px;"> 23386 <h6>{{items.title}}</h6> 23387 <div class="mb-1">{{items.discount_details}}</div> 23388 <div class="font-weight-bold">{{items.valid_discount}}</div> 23389 </el-card> 23390 </div> 23391 </div> 23392 ` 23393 }; 23394 23395 const app_wallet = Vue.createApp({ 23396 components: { 23397 'component-wallet-balance' : ComponentsWalletBalance, 23398 'components-wallet-transaction':ComponentsWalletTransaction, 23399 'components-topup-form' : componentsTopupForm, 23400 'components-succesful-modal' : componentSuccesfulModal, 23401 'component-bonusfunds' : componentBonusFunds 23402 }, 23403 created() { 23404 this.getWalletTransaction(); 23405 }, 23406 data() { 23407 return { 23408 loading : false, 23409 tab : 'all', 23410 data:[], 23411 page : 1, 23412 show_next : false, 23413 loading :false, 23414 loading_next : false, 23415 payment_data : [] 23416 } 23417 }, 23418 computed: { 23419 hasData(){ 23420 if (Object.keys(this.data).length > 0) { 23421 return true; 23422 } 23423 return false;
23424 }, 23425 getData(){ 23426 return this.data; 23427 }, 23428 showNext(){ 23429 return this.show_next; 23430 }, 23431 }, 23432 methods: { 23433 showFundsForm(){ 23434 this.$refs.topup.show(); 23435 }, 23436 tabChange(){ 23437 this.data = []; 23438 this.page = 1; 23439 this.getWalletTransaction(false); 23440 }, 23441 nextPage(data){ 23442 this.getWalletTransaction(true); 23443 }, 23444 showLoadingBox(message){ 23445 this.$refs.topup.loading_payment = true; 23446 }, 23447 closeLoadingBox(){ 23448 this.$refs.topup.loading_payment = false; 23449 }, 23450 closeTopup(){ 23451 this.$refs.topup.close(); 23452 }, 23453 getWalletTransaction(data){ 23454 if(data){ 23455 this.loading_next = true; 23456 } else this.loading = true; 23457 axios({ 23458 method: 'POST', 23459 url: ajaxurl+"/getWalletTransaction" , 23460 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&page="+this.page + "&transaction_type="+this.tab, 23461 timeout: $timeout, 23462 }).then( response => { 23463 if(response.data.code==1){ 23464 this.data.push(response.data.details.data); 23465 this.show_next = response.data.details.show_next_page; 23466 this.page = response.data.details.page; 23467 } else { 23468 this.show_next = false; 23469 } 23470 }).catch(error => { 23471 // 23472 }).then(data => { 23473 this.loading = false; 23474 this.loading_next = false; 23475 }); 23476 }, 23477 afterPreparepayment(data){ 23478 try { 23479 this.$refs[ data.payment_code ].Dopayment( data.data, data ); 23480 } catch(err) { 23481 ElementPlus.ElNotification({ 23482 title: "", 23483 message: err, 23484 position: 'bottom-right', 23485 type: 'warning', 23486 }); 23487 } 23488 }, 23489 AfterCancelPayment(data){ 23490 if(!empty(data)){ 23491 ElementPlus.ElNotification({ 23492 title: "", 23493 message: data, 23494 position: 'bottom-right', 23495 type: 'warning', 23496 }); 23497 } 23498 }, 23499 afterSuccessfulpayment(data){ 23500 this.payment_data = data; 23501 this.$refs.topup.close(); 23502 23503 if ((typeof this.$refs.wallet_balance !== "undefined") && ( this.$refs.wallet_balance !== null)) { 23504 this.$refs.wallet_balance.getBalance(); 23505 } 23506 23507 if ((typeof this.$refs.wallet_balance_mobile !== "undefined") && ( this.$refs.wallet_balance_mobile !== null)) { 23508 this.$refs.wallet_balance_mobile.getBalance(); 23509 } 23510 23511 this.$refs.succesful_modal.modal =true 23512 if(this.tab!="all"){ 23513 this.tab = "all"; 23514 } else { 23515 this.tabChange(); 23516 } 23517 }, 23518 }, 23519 }); 23520 23521 if ((typeof components_bundle !== "undefined") && ( components_bundle !== null)) { 23522 $.each(components_bundle,function(components_name, components_value) { 23523 app_wallet.component(components_name, components_value ); 23524 }); 23525 } 23526 23527 app_wallet.use(ElementPlus); 23528 app_wallet.use(Maska); 23529 const vm_wallet = app_wallet.mount('#vue-my-wallet'); 23530 23531 23532 const app_esubscription = Vue.createApp({ 23533 data() { 23534 return { 23535 email_address :'', 23536 loading : false, 23537 } 23538 }, 23539 methods: { 23540 submit(){ 23541 this.loading = true; 23542 axios({ 23543 method: 'POST', 23544 url: ajaxurl+"/subscribetoemail" , 23545 data : 'YII_CSRF_TOKEN=' + $('meta[name=YII_CSRF_TOKEN]').attr('content') + "&email_address="+ this.email_address, 23546 timeout: $timeout, 23547 }).then( response => { 23548 if(response.data.code==1){ 23549 this.email_address = ''; 23550 ElementPlus.ElNotification({ 23551 title: "", 23552 message: response.data.msg, 23553 position: 'bottom-right', 23554 type: 'success', 23555 }); 23556 } else { 23557 ElementPlus.ElNotification({ 23558 title: "", 23559 message: response.data.msg, 23560 position: 'bottom-right', 23561 type: 'warning', 23562 }); 23563 } 23564 }).catch(error => { 23565 // 23566 }).then(data => { 23567 this.loading = false; 23568 }); 23569 } 23570 }, 23571 }); 23572 app_esubscription.use(ElementPlus); 23573 const vm_esubscription = app_esubscription.mount('#vue-esubscription'); 23574 23575 })(jQuery); 23576 /*end strict*/
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.