@extends('layouts.app')

@section('title', __('sale.pos_sale'))

@section('content')

	<section class="content no-print no-margin no-padding" style="margin: 0; height: 100vh; overflow: hidden;">
		<input type="hidden" id="amount_rounding_method" value="{{ $pos_settings['amount_rounding_method'] ?? '' }}">
		@if (!empty($pos_settings['allow_overselling']))
			<input type="hidden" id="is_overselling_allowed">
		@endif
		@if (session('business.enable_rp') == 1)
			<input type="hidden" id="reward_point_enabled">
		@endif
		@php
			$is_discount_enabled = $pos_settings['disable_discount'] != 1 ? true : false;
            $is_rp_enabled = session('business.enable_rp') == 1 ? true : false;
		@endphp
		{!! Form::open([
            'url' => action([\App\Http\Controllers\SellPosController::class, 'store']),
            'method' => 'post',
            'id' => 'add_pos_sell_form',
        ]) !!}

		<!-- new header-->
		@include('sale_pos.partials.new_pos_header')

		<!-- Main Content -->
		<div class="container-fluid d-flex mt-5 mr-2 ml-2" style="height: calc(100vh - 60px);">
			<!-- القسم الأول -->
			<div class="d-flex flex-column flex-grow-1 me-2 bg-white" style="width: 50%;">
				<div  style="height: 85%; overflow-y: auto; overflow: hidden !important;">
					{!! Form::hidden('location_id', $default_location->id ?? null, [
                        'id' => 'location_id',
                        'data-receipt_printer_type' => !empty($default_location->receipt_printer_type)
                            ? $default_location->receipt_printer_type
                            : 'browser',
                        'data-default_payment_accounts' => $default_location->default_payment_accounts ?? '',
                    ]) !!}
					{!! Form::hidden('sub_type', isset($sub_type) ? $sub_type : null) !!}
					<input type="hidden" id="item_addition_method" value="{{ $business_details->item_addition_method }}">
					@include('sale_pos.partials.pos_form')

					@include('sale_pos.partials.payment_modal')

					@if (empty($pos_settings['disable_suspend']))
						@include('sale_pos.partials.suspend_note_modal')
					@endif

					@if (empty($pos_settings['disable_recurring_invoice']))
						@include('sale_pos.partials.recurring_invoice_modal')
					@endif
					@include('sale_pos.partials.pos_form_totals')

				</div>
				<div class="container-fluid">

					<div class="pos-total md:tw-flex md:tw-items-center md:tw-gap-3 tw-hidden  bg-label-primary ">
						<a class="btn btn-outline-info" type="button" data-bs-toggle="modal"
						   data-bs-target="#customersModal" aria-controls="customersModal">
							{{__('new.customer_view')}}
						</a>
						{!! Form::select('contact_id',
                                            [], null, ['class' => 'form-control mousetrap', 'id' => 'customer_id', 'placeholder' => 'Enter Customer name / phone', 'required']); !!}

						<div class="tw-text-black tw-font-bold tw-text-base md:tw-text-2xl tw-flex tw-items-center tw-flex-col">
							<div>Total</div>
						</div>
						<input type="hidden" name="final_total" id="final_total_input" value="0.00">
						<span id="total_payable"
							  class="tw-text-green-900 tw-font-bold tw-text-base md:tw-text-2xl number">0.00</span>
					</div>
				</div>
			</div>

			<!-- القسم الثاني -->
			<div class="d-flex flex-column flex-grow-1 me-2  " style="width: 50%; height: calc(100vh - 60px);">
				<!-- القسم الأول: عرض الأصناف (80% من الشاشة) -->
				<div  style="height: 80%; overflow-y: auto; overflow: hidden !important;">

						@include('sale_pos.partials.pos_sidebar')

				</div>
				<!-- القسم الثاني: أزرار الإجراءات (20% من الشاشة) -->

					@include('sale_pos.partials.pos_form_actions')


			</div>
		</div>



		{!! Form::close() !!}
	</section>

	<!-- This will be printed -->
	<section class="invoice print_section" id="receipt_section">
	</section>
	<div class="modal fade contact_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
		@include('contact.create', ['quick_add' => true])
	</div>
	@if (empty($pos_settings['hide_product_suggestion']) && isMobile())
		@include('sale_pos.partials.mobile_product_suggestions')
	@endif
	<!-- /.content -->
	<div class="modal fade register_details_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
	</div>
	<div class="modal fade close_register_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
	</div>
	<!-- quick product modal -->
	<div class="modal fade quick_add_product_modal" tabindex="-1" role="dialog" aria-labelledby="modalTitle"></div>

	<div class="modal fade" id="expense_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
	</div>

	@include('sale_pos.partials.configure_search_modal')

	@include('sale_pos.partials.recent_transactions_modal')

	@include('sale_pos.partials.weighing_scale_modal')

@stop
@section('css')

	<!-- include module css -->
	@if (!empty($pos_module_data))
		@foreach ($pos_module_data as $key => $value)
			@if (!empty($value['module_css_path']))
				@includeIf($value['module_css_path'])
			@endif
		@endforeach
	@endif


@stop
@section('javascript')

<script>
		window.addEventListener("afterprint", function() {
			location.reload();
		});
	</script>
	
	<script src="{{ asset('js/pos.js') }}"></script>
	<script src="{{ asset('js/printer.js') }}"></script>
	<script src="{{ asset('js/product.js') }}"></script>
	<script src="{{ asset('js/opening_stock.js') }}"></script>
	@include('sale_pos.partials.keyboard_shortcuts')

	<!-- Call restaurant module if defined -->
	@if (in_array('tables', $enabled_modules) ||
            in_array('modifiers', $enabled_modules) ||
            in_array('service_staff', $enabled_modules))
		<script src="{{ asset('js/restaurant.js?v=' . $asset_v) }}"></script>
	@endif
	<!-- include module js -->
	@if (!empty($pos_module_data))
		@foreach ($pos_module_data as $key => $value)
			@if (!empty($value['module_js_path']))
				@includeIf($value['module_js_path'], ['view_data' => $value['view_data']])
			@endif
		@endforeach
	@endif
	



@include('sale_pos.partials.pos_javascript')



@endsection