outlet-digital-menu.blade.php 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397
  1. @extends('layouts.app')
  2. @section('content')
  3. <link href="{!! env('APP_ASSETS') !!}/vendor_components/dropzone/dropzone.css" rel="stylesheet"/>
  4. <link href="{!! env('APP_ASSETS') !!}/vendor_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.css" rel="stylesheet"/>
  5. <link href="{!! env('APP_ASSETS') !!}/css/jquery.timepicker.min.css" rel="stylesheet"/>
  6. <style>
  7. .vtabs .tabs-vertical {
  8. width: 229px;
  9. }
  10. .bootstrap-tagsinput {
  11. min-height: 60px; width: 100%;
  12. }
  13. h4{ margin-top: 40px}
  14. .bootstrap-timepicker-widget table td input{ width: 46px}
  15. .content{
  16. padding: 0;
  17. }
  18. .form-control, .form-select {
  19. height: 46px !important;
  20. border-color: #E4E6EB !important;
  21. border-radius: 7px !important;
  22. }
  23. .payout-details{
  24. background-color: #fff4de;
  25. border-radius: 3px;
  26. padding: 15px;
  27. }
  28. .theme-primary [type=checkbox].filled-in:checked.chk-col-primary + label:after {
  29. border: 2px solid #ffab00;
  30. background-color: #ffab00;
  31. }
  32. .theme-primary .btn-success:hover, .theme-primary .btn-success:active, .theme-primary .btn-success:focus, .theme-primary .btn-success.active {
  33. background-color: #3fd642!important;
  34. border-color: #3fd642!important;
  35. color: #ffffff !important;
  36. }
  37. #output canvas{
  38. width: 100%;
  39. }
  40. </style>
  41. <!-- Content Wrapper. Contains page content -->
  42. <div class="content-wrapper">
  43. <div class="container-full">
  44. <!-- Content Header (Page header) -->
  45. {{-- <div class="content-header">
  46. <div class="d-flex align-items-center">
  47. <div class="me-auto">
  48. <h4 class="page-title">{{__('label.outlets')}}</h4>
  49. <div class="d-inline-block align-items-center">
  50. <nav>
  51. <ol class="breadcrumb">
  52. <li class="breadcrumb-item"><a href="{!! env('APP_URL') !!}dashboard"><i
  53. class="mdi mdi-home-outline"></i></a></li>
  54. <li class="breadcrumb-item active" aria-current="page">{{__('label.outlets')}}</li>
  55. </ol>
  56. </nav>
  57. </div>
  58. </div>
  59. </div>
  60. </div>--}}
  61. <!-- Main content -->
  62. <section class="content">
  63. <div class="row">
  64. <div class="col-3" style="padding-right: 0;background-color: #F5F5F5">
  65. @include('outlets.outlet-sidebar')
  66. </div>
  67. @php
  68. $resto = \App\Restaurants::find(\App\Helpers\CommonMethods::getRestuarantID());
  69. $lang = $resto->default_lang;
  70. app()->setLocale($lang);
  71. if(session('app_lang') !==null){
  72. $lang = session('app_lang');
  73. app()->setLocale($lang);
  74. }
  75. @endphp
  76. @php
  77. $restuarant1 = $resto;
  78. $resto_meta = isset($restuarant1->resto_metas)?$restuarant1->resto_metas:null;
  79. //dump($resto_meta);
  80. $resto_metas = [];
  81. $billing = [];
  82. if(isset($resto_meta)){
  83. foreach($resto_meta as $meta){
  84. if($meta->outlet_id!=""){
  85. continue;
  86. }
  87. $index_name = isset($meta->resto_meta_defs->parents)?$meta->resto_meta_defs->parents->meta_def_name:$meta->resto_meta_defs->meta_def_name;
  88. // dump($meta->resto_meta_defs);
  89. if($index_name=="BILLING_GATEWAY"){
  90. // dump($meta->resto_meta_defs->meta_def_name);
  91. // $resto_metas['BILLING_GATEWAY'][] = $meta->meta_val;
  92. $billing[] = array('id'=>$meta->meta_id,'value'=>$meta->meta_val);
  93. }
  94. $resto_metas[$index_name] = $meta->meta_val;
  95. }
  96. }
  97. $resto_metas['BILLING_GATEWAY'] = $billing;
  98. $currency = isset($resto_metas['BUSSINESS_CCY'])?$resto_metas['BUSSINESS_CCY']:"IQD";
  99. $business_type = isset($resto_metas['BUSSINESS_TYPE'])?$resto_metas['BUSSINESS_TYPE']:"Restaurants";
  100. $business_pwa = isset($resto_metas['USE_PWA_DMENU'])?$resto_metas['USE_PWA_DMENU']:"false";
  101. $url = env('QRCODE_HOST')."m/".$resto->resto_unique_name."&outlet=";
  102. if($business_pwa == "true")
  103. $url = "https://rjsdemo.taiftec.com/";
  104. @endphp
  105. <div class="col-9 p-15">
  106. <div id="main" >
  107. <div class="row">
  108. <div class="col-sm-12 col-md-4">
  109. <div class="card mt-4">
  110. <div class="card-header">{{__('label.digital_menu_qr_code')}}</div>
  111. <div class="card-body">
  112. <div id="output"></div>
  113. <a style="width: 100%; margin: 10px 0" class="btn btn-primary download-image ">{{__('label.download')}}</a>
  114. <p>{{__('label.this_is_your_unique_qr_code_for_customers_to_see_the_menu_and_order_from_this_outlet_print_it_and_leave_it_on_the_tables_customers_just_need_to_scan_it_with_a_smartphone_to_place_their_order')}}</p>
  115. <input type="text" class="form-control" readonly name="" value="{!! env('QRCODE_HOST') !!}m/{!! $resto->resto_unique_name !!}?outlet={!! \Illuminate\Support\Str::slug($outlet->name) !!}">
  116. <!--<input type="text" class="form-control" readonly name="" value="{!! env('QRCODE_HOST') !!}m/{!! $resto->resto_unique_name !!}/outlet/{!! \Illuminate\Support\Str::slug($outlet->name) !!}"> -->
  117. </div>
  118. </div>
  119. </div>
  120. </div>
  121. </div>
  122. </div>
  123. </div>
  124. </div>
  125. </section>
  126. <!-- /.content -->
  127. </div>
  128. <div id="download" style="display: none"></div>
  129. </div>
  130. <!-- /.content-wrapper -->
  131. @endsection
  132. @section('js')
  133. <script src="{!! env('APP_ASSETS') !!}js/jquery.timepicker.min.js"></script>
  134. <script src="{!! env('APP_ASSETS') !!}js/jquery.qrcode.min.js"></script>
  135. <script>
  136. $(function () {
  137. $('#output').qrcode({
  138. render: "canvas",
  139. text: "{!! $url !!}",
  140. width: 250,
  141. height: 250,
  142. background: "#ffffff",
  143. foreground: "#000000",
  144. /* src: "{!! isset(\Illuminate\Support\Facades\Auth::user()->restaurants) && isset(\Illuminate\Support\Facades\Auth::user()->restaurants->home_images) && !empty(\Illuminate\Support\Facades\Auth::user()->restaurants->home_images->file_name)?\Illuminate\Support\Facades\Auth::user()->restaurants->home_images->file_name:env('APP_URL').'public/layout/img/favicon.png' !!}",
  145. */ imgWidth: 50,
  146. imgHeight: 50
  147. });
  148. $('#download').qrcode({
  149. render: "canvas",
  150. text: "{!! $url !!}",
  151. width: 2000,
  152. height: 2000,
  153. background: "#ffffff",
  154. foreground: "#000000",
  155. /* src: "{!! isset(\Illuminate\Support\Facades\Auth::user()->restaurants) && isset(\Illuminate\Support\Facades\Auth::user()->restaurants->home_images) && !empty(\Illuminate\Support\Facades\Auth::user()->restaurants->home_images->file_name)?\Illuminate\Support\Facades\Auth::user()->restaurants->home_images->file_name:env('APP_URL').'public/layout/img/favicon.png' !!}",
  156. */ imgWidth: 500,
  157. imgHeight: 500
  158. });
  159. $(".download-image").click(function () {
  160. var canvas = $('#download canvas')[0];
  161. var _this = $(this);
  162. console.log(canvas.toDataURL());
  163. // Change here
  164. $.ajax({
  165. url: "{!! env('APP_URL') !!}download/qrcode",
  166. type: "POST",
  167. data: {
  168. resto:"digital-menu-{!! $resto->resto_unique_name !!}-outlet-{!! \Illuminate\Support\Str::slug($outlet->name) !!}",
  169. data: canvas.toDataURL(),
  170. '_token': "{!! csrf_token() !!}"
  171. },
  172. success: function (response) {
  173. console.log(response);
  174. var link = document.createElement('a');
  175. link.href = response;
  176. link.download = "digital-menu-{!! $resto->resto_unique_name !!}-qrcode.png";
  177. link.click();
  178. }
  179. });
  180. });
  181. $("body").on("click",".remove-hours",function () {
  182. var _id = $(this).data('id');
  183. var _this = $(this);
  184. $.ajax({
  185. url:"{!! env('APP_URL') !!}remove/hour",
  186. type:"POST",
  187. data:{
  188. id:_id,
  189. "_token":"{!! csrf_token() !!}"
  190. },
  191. success:function (response) {
  192. response = $.parseJSON(response);
  193. if(response.type=="success"){
  194. $.toast({
  195. heading: 'Hours',
  196. text: response.message,
  197. position: 'top-right',
  198. loaderBg: '#ff6849',
  199. icon: 'success',
  200. hideAfter: 3000,
  201. stack: 6
  202. });
  203. }else{
  204. $.toast({
  205. heading: 'Hours',
  206. text: response.message,
  207. position: 'top-right',
  208. loaderBg: '#ff6849',
  209. icon: 'danger',
  210. hideAfter: 3000,
  211. stack: 6
  212. });
  213. }
  214. }
  215. });
  216. _this.parents('.hour-section').remove();
  217. });
  218. $("body").on("click",".add-more-hours",function () {
  219. var _hour_section = $(this).parents(".hour-section");
  220. var day = $(this).data('day');
  221. var start_time='<div class="bootstrap-timepicker mt-1">\n' +
  222. ' <input type="text" name="start_time['+day+'][]" class="form-control timepicker time">\n' +
  223. ' </div>';
  224. var end_time='<div class="bootstrap-timepicker mt-1">\n' +
  225. ' <input type="text" name="end_time['+day+'][]" class="form-control timepicker time">\n' +
  226. ' </div><i class="fa fa-ban delete-hour"></i>';
  227. var input_start_time = _hour_section.find('.col-sm-3.time-show.start_time').append(start_time);
  228. var input_end_time = _hour_section.find('.col-sm-3.time-show.end_time').append(end_time);
  229. /* var hour_sections = _hour_section.find('.col-sm-2.time-show.hours-action').append('<div style="margin-top: 37px"><a href="#!" class="text-mute remove-hours" data-id="60" data-day="sunday"> <i class="fa fa-ban"></i> Remove hours</a></div>');
  230. */
  231. $(".timepicker").timepicker({ step:5});
  232. $('.timepicker').on('showTimepicker',function(){
  233. $("#li-11-59").remove();
  234. $("body").find(".ui-timepicker-list").append('<li id="li-11-59" class="ui-timepicker-pm" data-time="86340">11:59pm</li>');
  235. });
  236. });
  237. $("body").on("click",".update-hour-status",function () {
  238. var is_active = $(this).attr("aria-pressed");
  239. is_active = $.trim(is_active);
  240. if(is_active=="false"){
  241. // alert('off');
  242. $(this).parents('.hour-section').find('input[type=checkbox]').prop('checked',false);
  243. $(this).parents('.hour-section').find('.time-show').hide();
  244. }else{
  245. $(this).parents('.hour-section').find('input[type=checkbox]').prop('checked','checked');
  246. $(this).parents('.hour-section').find('.time-show').show();
  247. }
  248. })
  249. /*$("body").on("click",".action-on-off",function () {
  250. var unique_key =
  251. });*/
  252. $(".timepicker").timepicker({ step:5});
  253. $('.timepicker').on('showTimepicker',function(){
  254. $("#li-11-59").remove();
  255. $("body").find(".ui-timepicker-list").append('<li id="li-11-59" class="ui-timepicker-pm" data-time="86340">11:59pm</li>');
  256. });
  257. $("body").on("click",".switch",function () {
  258. var is_active = $(this).attr("aria-pressed");
  259. is_active = $.trim(is_active);
  260. if(is_active=="false"){
  261. $("#main").removeClass('active');
  262. }else{
  263. $("#main").addClass('active');
  264. }
  265. $.ajax({
  266. url:"{!! env('APP_URL') !!}update/outlet/feature/status",
  267. data:{
  268. outletId:"{!! $outlet->id !!}",
  269. feature:'is_contactless_dining',
  270. is_active:is_active,
  271. "_token":"{!! csrf_token() !!}"
  272. },
  273. type:"POST",
  274. success:function () {
  275. }
  276. });
  277. });
  278. $("body").on("click",".save-changes",function () {
  279. /*$.toast({
  280. heading: 'Welcome to my Riday Admin',
  281. text: 'Use the predefined ones, or specify a custom position object.',
  282. position: 'top-right',
  283. loaderBg: '#ff6849',
  284. icon: 'info',
  285. hideAfter: 3000,
  286. stack: 6
  287. });*/
  288. if($("#save-outlet").valid()){
  289. $("#save-outlet").ajaxForm(function (response) {
  290. response = $.parseJSON(response);
  291. if(response.type=="success"){
  292. $.toast({
  293. heading: '{{__("label.outlet_update")}}',
  294. text: response.message,
  295. position: 'top-right',
  296. loaderBg: '#ff6849',
  297. icon: 'success',
  298. hideAfter: 3000,
  299. stack: 1
  300. });
  301. setTimeout(function () {
  302. location.reload();
  303. },2000);
  304. }else{
  305. $.toast({
  306. heading: '{{__("label.outlet_update")}}',
  307. text: response.message,
  308. position: 'top-right',
  309. loaderBg: '#ff6849',
  310. icon: 'error',
  311. hideAfter: 3000,
  312. stack: 1
  313. });
  314. }
  315. }).submit();
  316. }
  317. });
  318. })
  319. </script>
  320. @endsection