@extends('website.layouts.master')

@section('site_title')طلباتي -@endsection
@section('content')
		<section class="page-title">
			<div class="container">
				<div class="title-icon">
					<i class="fas fa-tools"></i>
				</div>
				<div class="page-text">
					<h5 class="mt-0">طلباتي</h5>
					<p class="mb-0"> لديك <span class="balance">{{ $orders_count }}</span> طلب فعّال </p>
				</div>
			</div>
		</section>
		@include('website.includes.user_menu')
		<section class="personal-account  current-order">
			<div class="container-fluid">
				<div class="companies-title">
					<h4>طلبات حالية</h4>
				</div>
				@if ($orders->count())
				@foreach ($orders as $order)
				<div class="single-current-order">
					<div class="row ">
						<div class="col-md-8 col-lg-6">
							<div class="row flex-nowrap" >
								<div class="col-2 col-md-1">
									<div class="order-number">
										<i class="fas fa-tag"></i>
									</div>
								</div>
								<div class="col-10 col-md-11">
									<div class="current-order-info">
										<div class="order-number">
											<span> #{{ $order['id'] }}</span>
										</div>
									</div>
									<div class="current-order-name">
										<p>
											{{ $order->company['name'] }}
										</p>
										<p class="current-order-time">{{ $order->delivery_time }}</p>
									</div>
									<div class="current-order-process ">
										<div class="container-fluid">
											<div class="row">
												<div class="col-3">
													<div class="order-process">
														<div class="order-icon container-fluid">
															<div class="row">
																@if (($order->status == 'waiting_for_payment') || ($order->status == 'pending') || ($order->status == 'approved'))
																<div class="col-1 process-icon active">
																	<i class="fas fa-check"></i>
																</div>
																@elseif (($order->status == 'driver_accepted') || ($order->status == 'processing') || ($order->status == 'done') || ($order->status == 'rated'))
																<div class="col-1 process-icon">
																	<i class="fas fa-check"></i>
																</div>
																@else
																<div class="col-1 process-icon">
																	<i class="fas fa-check"></i>
																</div>
																@endif
																<div class="col-11 process-line"><span></span></div>
															</div>
														</div>
														<div class="order-process-info">
															<p>طلب جديد</p>
														</div>
													</div>
												</div>
												<div class="col-3">
													<div class="order-process">
														<div class="order-icon container-fluid">
															<div class="row">
																@if (($order->status == 'driver_accepted'))
																<div class="col-1 process-icon active">
																	<i class="fas fa-check"></i>
																</div>
																@elseif (($order->status == 'processing') || ($order->status == 'done') || ($order->status == 'rated'))
																<div class="col-1 process-icon">
																	<i class="fas fa-check"></i>
																</div>
																@elseif (($order->status == 'waiting_for_payment') || ($order->status == 'pending') || ($order->status == 'approved'))
																<div class="col-1 process-icon">
																	<i class="fas fa-history"></i>
																</div>
																@endif
																<div class="col-11 process-line">
																	<span></span>
																</div>
															</div>
														</div>
														<div class="order-process-info">
															<p>استلام الطلب</p>
														</div>
													</div>
												</div>
												<div class="col-3">
													<div class="order-process">
														<div class="order-icon container-fluid">
															<div class="row">
																@if (($order->status == 'processing'))
																<div class="col-1 process-icon active">
																	<i class="fas fa-history"></i>
																</div>
																@elseif (($order->status == 'done') || ($order->status == 'rated'))
																<div class="col-1 process-icon">
																	<i class="fas fa-check"></i>
																</div>
																@elseif (($order->status == 'waiting_for_payment') || ($order->status == 'pending') || ($order->status == 'approved') || ($order->status == 'driver_accepted'))
																<div class="col-1 process-icon">
																	<i class="fas fa-history"></i>
																</div>
																@endif
																<div class="col-11 process-line">
																	<span></span>
																</div>
															</div>
														</div>
														<div class="order-process-info">
															<p>في الطريق</p>
														</div>
													</div>
												</div>
												<div class="col-3">
													<div class="order-process">
														<div class="order-icon container-fluid">
															<div class="row">
																<div class="col-1 process-icon">
																	<span class="process-end"></span>
																</div>
															</div>
														</div>
														<div class="order-process-info">
															<p>تم التوصيل</p>
														</div>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="col-md-4 col-lg-6">
							<div class="current-order-btn">
								<div class="current-order">
									<p>{{ __('api.user_order_statuses.' . $order['status']) }}</p>
									<p>{{ __('api.user_order_statuses_details.' . $order['status']) }}</p>
								</div>
								<a href="{{ route('website.orders.show_details', ['slug' => $order['slug']]) }}">تفاصيل الطلب</a>
							</div>
						</div>
					</div>
				</div>
				@endforeach
				@else
				<div class="single-current-order">
					<div class="row ">
						<div class="col-md-12 col-lg-12">
							<div class="current-order-btn text-center">
							    لا يوجد طلبات حاليا!
							</div>
						</div>
					</div>
				</div>
				@endif
			</div>
		</section>
		<section class="current-order">
			<div style="text-align: center;">
				{{ $orders->links() }}
			</div>
		</section>
@endsection