@extends('driver.layouts.master')

@section('page-title') ادارة المنتجات ضمن المخزن @endsection
@section('header-title') المنتجات ضمن المخزن @endsection
@push('main-warehouses-active') m-menu__item--active @endpush

@section('content')
<div class="row">
	<div class="col-md-12">
		<!--begin::Portlet-->
		<div class="m-portlet m-portlet--tab">
			<div class="m-portlet__head">
				<div class="m-portlet__head-caption">
					<div class="m-portlet__head-title">
						<span class="m-portlet__head-icon">
							<i class="flaticon-notes"></i>
						</span>
						<h3 class="m-portlet__head-text">
							<span> المنتجات ضمن المخزن </span>
						</h3>
					</div>
				</div>
			</div>
			<div class="m-portlet__body">
				<h3 class="m-portlet__head-text" style="text-align: center;">
					<span> اسم المخزن: "{{ $warehouse->name }}" </span>
				</h3>
				@if (session('ERROR'))
				<div class="alert alert-danger alert-dismissible fade show" role="alert">
					<button type="button" class="close" data-dismiss="alert" aria-label="Close">
					</button>
					<strong>{{ session('ERROR') }}</strong>
				</div>
				@endif
				@if (session('Done'))
				<div class="alert alert-success alert-dismissible fade show" role="alert">
					<button type="button" class="close" data-dismiss="alert" aria-label="Close">
					</button>
					<strong>{{ session('Done') }}</strong>
				</div>
				@endif
				<table class="table table-striped- table-bordered table-hover table-checkable m-table m-table--head-bg-primary">
					<thead>
						<tr>
							<th class="text-center"> <b>#</b> </th>
							<th class="text-center"> <b> اسم المنتج </b> </th>
							<th class="text-center"> <b>الكمية</b> </th>
							<th class="text-center"><b><i class="flaticon-cogwheel-2"></i></b></th>
						</tr>
					</thead>
					<tbody>
						@foreach($products as $product)
						<tr class="odd gradeX">
							<td class="text-center">
								{{ $loop->index+1 }}
							</td>

							<td class="text-center">
								{{ $product['name'] }}
							</td>

							<td class="text-center">
								{{ $product->pivot['quantity'] }}
							</td>

							<td class="text-center">
								<a href="javascript:;" title="سحب كمية من المخزن" class="m-portlet__nav-link btn m-btn m-btn--hover-primary m-btn--icon m-btn--icon-only m-btn--pill add-quantity-btn" data-target="#add-quantity" data-id="{{ $product->id }}" data-name="{{ $product->name }}" data-current_quantity="{{ $product->pivot['quantity'] }}" data-toggle="modal">
									<i class="la la-plus-circle"></i>
								</a>
								<a href="javascript:;" title="ارجاع كمية للمخزن" class="m-portlet__nav-link btn m-btn m-btn--hover-danger m-btn--icon m-btn--icon-only m-btn--pill sub-quantity-btn" data-target="#sub-quantity" data-id="{{ $product->id }}" data-name="{{ $product->name }}" data-current_quantity="{{ $product->pivot['quantity'] }}" data-toggle="modal">
									<i class="la la-minus-circle"></i>
								</a>
							</td>
						</tr>
						@endforeach
					</tbody>
				</table>
				<input type="hidden" id="wid" value="{{ $warehouse->id }}">
				@include('driver.warehouse_products.add_quantity')
				@include('driver.warehouse_products.sub_quantity')
			</div>
		</div>
	</div>
</div>
@stop

@push('page_level_script')
	<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
	<script type="text/javascript">
		$('#reason').select2({
			width: '80%'
		});
		var selected_id, selected_name, current_quantity;
		$('.add-quantity-btn').on('click', function() {
			selected_id			=	$(this).data('id');
			selected_name		=	$(this).data('name');
			current_quantity	=	$(this).data('current_quantity');
			$("#product-id").val(selected_id);
			$("#product-name").html(selected_name);
			$("#current_quantity").val(current_quantity);
			// $("#add-quantity-form").attr('action', driver_url + '/orders/change_driver/' + selected_id);
		});
		$('.sub-quantity-btn').on('click', function() {
			selected_id			=	$(this).data('id');
			selected_name		=	$(this).data('name');
			current_quantity	=	$(this).data('current_quantity');
			$("#product-id").val(selected_id);
			$("#sub-product-name").html(selected_name);
			$("#sub_current_quantity").val(current_quantity);
			// $("#add-quantity-form").attr('action', driver_url + '/orders/change_driver/' + selected_id);
		});
		$('#submit-sub-quantity').on('click', function() {
			var warehouse_id = $('#wid').val();
			var changed_quantity = $('#sub_changed_quantity').val();
			var dataString = "warehouse_id=" + warehouse_id + "&product_id=" + selected_id + "&quantity=" + changed_quantity;

			$.ajax({
				type: "POST",
				url: driver_url + "/warehouse_products/sub_quantity",
				data: dataString,
				success: function(data){
					// swal('', data.message, data.status);
					if (data.status == 'error') {
						swal('', data.message, data.status);
					} else {
						swal(data.message, data.message)
						.then((value) => {
							location.reload();
						});
					}
				}
			});
		});
		$('#submit-add-quantity').on('click', function() {
			var warehouse_id = $('#wid').val();
			var added_quantity = $('#added_quantity').val();
			var dataString = "warehouse_id=" + warehouse_id + "&product_id=" + selected_id + "&quantity=" + added_quantity;

			$.ajax({
				type: "POST",
				url: driver_url + "/warehouse_products/add_quantity",
				data: dataString,
				success: function(data){
					// swal('', data.message, data.status);
					if (data.status == 'error') {
						swal('', data.message, data.status);
					} else {
						swal(data.message, data.message)
						.then((value) => {
							location.reload();
						});
					}
				}
			});
		});
	</script>
@endpush