@extends('layouts.master_app')
@section('title') Dashboard @endsection

@section('css')
@endsection

@section('content')
	<!--begin::Toolbar-->
	<div class="toolbar py-2" id="kt_toolbar">
		<!--begin::Container-->
		<div id="kt_toolbar_container" class="container-fluid d-flex align-items-center">
			<!--begin::Page title-->
			<div class="flex-grow-1 flex-shrink-0 me-5">
				<!--begin::Page title-->
				<div data-kt-swapper="true" data-kt-swapper-mode="prepend" data-kt-swapper-parent="{default: '#kt_content_container', 'lg': '#kt_toolbar_container'}" class="page-title d-flex align-items-center flex-wrap me-3 mb-5 mb-lg-0">
					<!--begin::Title-->
					<h1 class="d-flex align-items-center text-dark fw-bold my-1 fs-3">Dashboard
					<!--begin::Separator-->
					<span class="h-20px border-gray-200 border-start ms-3 mx-2"></span>
					<!--end::Separator-->
					<!--begin::Description-->
					<small class="text-muted fs-7 fw-semibold my-1 ms-1"></small>
					<!--end::Description--></h1>
					<!--end::Title-->
				</div>
				<!--end::Page title-->
			</div>
			<!--end::Page title-->
			<!--begin::Action group-->
			<div class="d-flex align-items-center flex-wrap">
				<!--begin::Wrapper-->
				<div class="flex-shrink-0 me-2">
					
				</div>
				<!--end::Wrapper-->
				<!--begin::Wrapper-->
				<div class="d-flex align-items-center">
					
				</div>
				<!--end::Wrapper-->
			</div>
			<!--end::Action group-->
		</div>
		<!--end::Container-->
	</div>
	<!--end::Toolbar-->
	
	<div class="content d-flex flex-column flex-column-fluid" id="kt_content">
		<!--begin::Container-->
		<div id="kt_content_container" class="container-xxl">
			
			<!--begin::Row-->
			<div class="row g-5 g-xl-10 mb-5 mb-xl-10">

				<div class="col-lg-12 col-xl-12 col-xxl-6 mb-5 mb-xl-0">
					<!--begin::Tables widget 14-->
					<div class="card card-flush h-md-100">
						<!--begin::Header-->
						<div class="card-header pt-7">
							<!--begin::Title-->
							<h3 class="card-title align-items-start flex-column">
								<span class="card-label fw-bold text-gray-800">Salida a ruta</span>
							</h3>
							<!--end::Title-->
							<!--begin::Toolbar-->
							<div class="card-toolbar">
								<span>{{ date('d-m-Y')}} </span>
							</div>
							<!--end::Toolbar-->
						</div>
						<!--end::Header-->
						<!--begin::Body-->
						<div class="card-body pt-6">
							<!--begin::Table container-->
							<div class="table-responsive">
								<!--begin::Table-->
								<table class="table table-row-dashed align-middle gs-0 gy-3 my-0">
									<!--begin::Table head-->
									<thead>
										<tr class="fs-7 fw-bold text-gray-400 border-bottom-0">
											<th class="p-0 pb-3 min-w-175px text-start">VENDEDOR</th>
											<th class="p-0 pb-3 min-w-100px text-end">VENTA DIARIA</th>
											<th class="p-0 pb-3 min-w-175px text-end pe-12"></th>
										</tr>
									</thead>
									<!--end::Table head-->
									<!--begin::Table body-->
									<tbody>
										@foreach($users as $user)
										<tr>
											<td>
												<div class="d-flex align-items-center">
													<div class="symbol symbol-50px me-3">
														<span class="symbol-label bg-primary text-inverse-primary fw-bold">{{$user->person->letters_name}}</span>
													</div>
													<div class="d-flex justify-content-start flex-column">
														<span class="text-gray-800 fw-bold text-hover-primary mb-1 fs-6">{{$user->person->fullname}}</span>
														<span class="text-gray-400 fw-semibold d-block fs-7"></span>
													</div>
												</div>
											</td>
											<td class="text-end pe-0">
												<span class="text-gray-600 fw-bold fs-6">${{ $user->total_proposals}}</span>
											</td>
											<td class="text-end pe-12">
												<a href="/salida_ruta/{{$user->id}}" class="btn btn-sm btn-info">Detalles</a>
											</td>
										</tr>
										@endforeach
										
									</tbody>
									<!--end::Table body-->
								</table>
							</div>
							<!--end::Table-->
						</div>
						<!--end: Card Body-->
					</div>
					<!--end::Tables widget 14-->
				</div>
				<!--end::Col-->

				<!--begin::Col-->
				<div class="col-xxl-6">
					<!--begin::Tables widget 14-->
					<div class="card card-flush h-md-100">
						<!--begin::Header-->
						<div class="card-header pt-7">
							<!--begin::Title-->
							<h3 class="card-title align-items-start flex-column">
								<span class="card-label fw-bold text-gray-800">Pagos de hoy</span>
							</h3>
							<!--end::Title-->
							<!--begin::Toolbar-->
							<div class="card-toolbar">
								<a href="/payments" class="btn btn-sm btn-light">Historial</a>
							</div>
							<!--end::Toolbar-->
						</div>
						<!--end::Header-->
						<!--begin::Body-->
						<div class="card-body pt-6">
							<!--begin::Table container-->
							<div class="table-responsive">
								<!--begin::Table-->
								<table class="table align-middle table-row-dashed fs-6 gy-5" id="kt_table_users">
									<!--begin::Table head-->
									<thead>
										<!--begin::Table row-->
										<tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
											<th class="min-w-125px">Cliente</th>
											<th class="min-w-125px"></th>
											<th class="text-end min-w-100px"></th>
										</tr>
										<!--end::Table row-->
									</thead>
									<!--end::Table head-->
									<!--begin::Table body-->
									<tbody class="text-gray-600 fw-semibold">
										@foreach($payments_today as $item)
										<!--begin::Table row-->
										<tr>
											<td>{{$item->client->person->fullname}}</td>
											<td>
												${{$item->amount}}
												<br><div class="badge badge-{{$item->status->color}} fw-bold">{{$item->status->name}}</div>
											</td>
											<td>
												<a href="#" class="btn btn-light btn-active-light-primary btn-sm" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">Acciones
													<!--begin::Svg Icon | path: icons/duotune/arrows/arr072.svg-->
													<span class="svg-icon svg-icon-5 m-0">
														<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
															<path d="M11.4343 12.7344L7.25 8.55005C6.83579 8.13583 6.16421 8.13584 5.75 8.55005C5.33579 8.96426 5.33579 9.63583 5.75 10.05L11.2929 15.5929C11.6834 15.9835 12.3166 15.9835 12.7071 15.5929L18.25 10.05C18.6642 9.63584 18.6642 8.96426 18.25 8.55005C17.8358 8.13584 17.1642 8.13584 16.75 8.55005L12.5657 12.7344C12.2533 13.0468 11.7467 13.0468 11.4343 12.7344Z" fill="currentColor" />
														</svg>
													</span>
													<!--end::Svg Icon-->
												</a>
												<!--begin::Menu-->
												<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-semibold fs-7 w-125px py-4" data-kt-menu="true">
													<div class="menu-item px-3">
														<a href="/payments/{{$item->id}}" class="menu-link px-3">Ver pago</a>
													</div>
													<div class="menu-item px-3">
														<a href="/payments/edit/{{$item->id}}" class="menu-link px-3">Editar</a>
													</div>
													<div class="menu-item px-3">
														<a onclick="delete_item(this);" data="{{ route('payments.destroy', [$item->id]) }}" class="menu-link px-3" >Eliminar</a>
													</div>
												</div>
												<!--end::Menu-->
											</td>
										</tr>
										<!--end::Table row-->
										@endforeach
								
									</tbody>
									<!--end::Table body-->
								</table>
								<!--end::Table-->
							</div>
							<!--end::Table-->
						</div>
						<!--end: Card Body-->
					</div>
					<!--end::Tables widget 14-->
				</div>
				<!--end::Col-->
			</div>
			<!--end::Row-->
			
			<div class="row g-5 g-xl-10 mb-5 mb-xl-10">
				<!--begin::Col-->
				<div class="col-xxl-6">
					<!--begin::Tables widget 14-->
					<div class="card card-flush h-md-100">
						<!--begin::Header-->
						<div class="card-header pt-7">
							<!--begin::Title-->
							<h3 class="card-title align-items-start flex-column">
								<span class="card-label fw-bold text-gray-800">Adeudo de clientes</span>
							</h3>
							<!--end::Title-->
							
						</div>
						<!--end::Header-->
						<!--begin::Body-->
						<div class="card-body pt-6">
							<!--begin::Table container-->
							<div class="table-responsive">
								<!--begin::Table-->
								<table class="table align-middle table-row-dashed fs-6 gy-5" id="kt_table_users">
									<!--begin::Table head-->
									<thead>
										<!--begin::Table row-->
										<tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
											<th class="min-w-125px">Cliente</th>
											<th class="min-w-125px"></th>
											<th class="min-w-125px"></th>
											<th class="text-end min-w-100px"></th>
										</tr>
										<!--end::Table row-->
									</thead>
									<!--end::Table head-->
									<!--begin::Table body-->
									<tbody class="text-gray-600 fw-semibold">
										@foreach($contacts as $item)
										<!--begin::Table row-->
										@if( ($item->total_proposals - $item->total_payments) > 0 )
										<tr>
											<td><a href="/contacts/{{ $item->id }}">{{$item->person->fullname}} </a></td>
											<td>
												${{ number_format($item->total_proposals - $item->total_payments,2) }}
											</td>
										</tr>
										<!--end::Table row-->
										@endif
										@endforeach
								
									</tbody>
									<!--end::Table body-->
								</table>
								<!--end::Table-->
							</div>
							<!--end::Table-->
						</div>
						<!--end: Card Body-->
					</div>
					<!--end::Tables widget 14-->
				</div>
				<!--end::Col-->
			</div>
		</div>
		<!--end::Container-->
	</div>
@endsection

@section('js')


		<script src="/assets/app/js/widgets.bundle.js"></script>
@endsection