@extends('layouts.app')

@section('content')
<main class="container mx-auto mt-10">
	<div class="w-full sm:px-6">
		<h1 class="text-3xl font-bold border-b mb-10">購入履歴</h1>
		<div class="my-8">
			<div class="mb-4">ご注文情報</div>
			@if($pay_logs)
			<ul>
				@foreach ($pay_logs as $pay_log)
				<li class="border rounded-lg p-4 mb-6">
					<div class="mb-2">
						お届け先：{{ $pay_log->zipcode }} {{ $pay_log->adress }}
					</div>
					<ul>
						@foreach ($pay_log->attributes as $pay_log_attribute)
						<li class="flex flex-wrap mb-2">
							@if($pay_log_attribute->product_detail_id)
								<div class="w-4/12"><img class="w-full" src="{{ $pay_log_attribute->product_detail->img1 }}"></div>
								<div class="w-8/12">
									<div>商品：{{ $pay_log_attribute->product_detail->name }}</div>
									<div>サイズ：{{ $pay_log_attribute->product_detail->size }}</div>
									<div>色：{{ $pay_log_attribute->product_detail->color }}</div>
								</div>
							@else
								<div class="w-4/12"><img class="w-full" src="{{ $pay_log_attribute->product->img1 }}"></div>
								<div class="w-8/12">
									<div>商品：{{ $pay_log_attribute->product->name }}</div>
									<div>サイズ：{{ $pay_log_attribute->product->size }}</div>
									<div>色：{{ $pay_log_attribute->product->color }}</div>
								</div>
								
							@endif
							<div>個数：{{ $pay_log_attribute->num }}</div>
						</li>
						@endforeach
					</ul>
					<div>
						購入日：{{ $pay_log->created_at->format('Y年m月d日') }}
					</div>
					<div>【ご注文番号】: {{ $pay_log->stripe_pay_id }}</div>
					<div>
						@if($pay_log->status == 1)
							発送完了までもうしばらくお待ちください。
						@elseif($pay_log->status == 2)
							発送完了
						@endif
					</div>
				</li>
				@endforeach
			</ul>
			@endif
		</div>
	</div>
</main>
@endsection