@extends('customer.layout.main')

@section('content')
        <div class="container-fluid">
        <div class="row px-xl-5">
            <div class="col-12">
                <nav class="breadcrumb bg-light mb-30">
                    <a class="breadcrumb-item text-dark" href="/">Home</a>
                    <a class="breadcrumb-item text-dark" href="{{ route('client.carts') }}">Cart</a>
                    <span class="breadcrumb-item active">{{ $title ?? 'None' }}</span>
                </nav>
            </div>
        </div>
    </div>


    <!-- Checkout Start -->
    <div class="container-fluid">
        <form action="{{ route('checkout') }}" method="POST">
            @csrf
            <div class="row px-xl-5">
                @include('admin.layout_admin.hide')
                @if ($user)
                    <div class="col-lg-7">
                        <div class="bg-light p-30 mb-5">
                            <div class="row">
                                <div class="col-md-12 form-group">
                                    <label>Tên liên lạc</label>
                                    <input class="form-control" name="name" type="text"
                                        placeholder="Nhập tên liên lạc" value="{{ $user->name }}" readonly>
                                </div>
                                {{-- <div class="col-md-6 form-group">
                                <label>Last Name</label>
                                <input class="form-control" type="text" placeholder="Doe">
                            </div> --}}
                                <div class="col-md-12 form-group">
                                    <label>E-mail</label>
                                    <input class="form-control" name="email" type="text"
                                        placeholder="example@email.com" value="{{ $user->email }}" readonly>
                                </div>
                                <div class="col-md-12 form-group">
                                    <label>Số điện thoại</label>
                                    <input class="form-control" name="phone" type="text" placeholder="+123 456 789"
                                        value="{{ $user->phone != null ? $user->phone : '' }}">
                                </div>
                                <div class="col-md-12 form-group">
                                    <label>Địa chỉ nhận hàng</label>
                                    <input class="form-control" name="address" type="text"
                                        placeholder="Nhập địa chỉ nhận hàng"
                                        value="{{ $user->address != null ? $user->address : '' }}">
                                </div>

                            </div>
                        </div>

                    </div>
                @else
                    <div class="col-lg-7">
                        <h5 class="section-title position-relative text-uppercase mb-3"><span class="bg-secondary pr-3">Bạn
                                đã có tài khoản? </span></h5>
                        <div class="bg-light p-30 mb-5">
                            <div class="row">
                                <div class="col-md-12 form-group">
                                    <label>Tên liên lạc</label>
                                    <input class="form-control" name="name" type="text"
                                        placeholder="Nhập tên liên lạc">
                                    @error('name')
                                        <div class="message-error">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-12 form-group">
                                    <label>E-mail</label>
                                    <input class="form-control" name="email" type="text"
                                        placeholder="example@email.com">
                                    @error('email')
                                        <div class="message-error">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-12 form-group">
                                    <label>Số điện thoại</label>
                                    <input class="form-control" name="phone" type="text" placeholder="+123 456 789">
                                    @error('phone')
                                        <div class="message-error">{{ $message }}</div>
                                    @enderror
                                </div>
                                <div class="col-md-12 form-group">
                                    <label>Địa chỉ nhận hàng</label>
                                    <input class="form-control" name="address" type="text"
                                        placeholder="Nhập địa chỉ nhận hàng">
                                    @error('address')
                                        <div class="message-error">{{ $message }}</div>
                                    @enderror
                                </div>

                            </div>
                        </div>

                    </div>
                @endif
                <div class="col-lg-5">
                    <h5 class="section-title position-relative text-uppercase mb-3"><span class="bg-secondary pr-3">Thông
                            tin đơn hàng</span></h5>
                    <div class="bg-light p-30 mb-5">
                        <div class="border-bottom">
                            {{-- <h6 class="mb-3">Products</h6> --}}
                            @foreach ($carts as $item)
                                                                <div class="d-flex justify-content-between">
                                    <p> <span class="font-weight-bold text-warning">{{ $item['quantity'] }}</span> -
                                        {{ $item['name'] }}</p>
                                    <p>{{ number_format($item['quantity'] * $item['price']) }}đ</p>
                                </div>
                            @endforeach
                        </div>
                        <div class="border-bottom pt-3 pb-2">
                            <div class="d-flex justify-content-between mb-3">
                                <h6>Tạm tính</h6>
                                <h6>{{ number_format($subtotal) }}</h6>
                            </div>
                            <div class="d-flex justify-content-between">
                                <h6 class="font-weight-medium">Phí vận chuyển</h6>
                                <h6 class="font-weight-medium">10.000đ</h6>
                            </div>
                        </div>
                        <div class="pt-2">
                            <div class="d-flex justify-content-between mt-2">
                                <h5>Tổng cộng</h5>
                                <h5>{{ number_format($subtotal + 10000) }}</h5>
                            </div>
                        </div>
                    </div>
                    <div class="mb-5">
                        <h5 class="section-title position-relative text-uppercase mb-3"><span
                                class="bg-secondary pr-3">Phương thức thanh toán</span></h5>
                        <div class="bg-light p-30">
                            <div class="form-group">
                                <div class="custom-control custom-radio">
                                    <input type="radio" class="custom-control-input" value="vnpay" name="payment"
                                        id="paypal">
                                    <label class="custom-control-label" for="paypal">VN Pay</label>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="custom-control custom-radio">
                                    <input type="radio" class="custom-control-input" value="cod" checked
                                        name="payment" id="directcheck">
                                    <label class="custom-control-label" for="directcheck">Thanh toán khi nhận hàng</label>
                                </div>
                            </div>
                            <button type="submit" class="btn btn-block btn-primary font-weight-bold py-3">Đặt
                                hàng</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <!-- Checkout End -->
@endsection