@extends('layout.template')
@section('title', 'Register')
@section('content')
    <div class="container my-5">
        <div class="row"> 
            <h3 class="blue_title">Add User</h3>
            @if (session('status'))
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                    {{ session('status') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>
            @elseif(session('failed'))
                <div class="alert alert-danger alert-dismissible fade show" role="alert">
                    {{ session('status') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>
            @endif
            @if ($errors->any())
                <div class="alert alert-danger" role="alert">
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
            <form action="{{route('register.store')}}" method="post" enctype="multipart/form-data" id="user_form">
                @csrf
                <div class="form-floating mb-3">
                    <input type="email" class="form-control" id="email" name="email" placeholder="name@example.com" required>
                    <label for="email">Email<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <input type="password" class="form-control" id="password" name="password" placeholder="Password" required>
                    <label for="password">Password<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <input type="text" class="form-control" id="first_name" name="first_name" placeholder="First Name" required>
                    <label for="first_name">First Name<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <input type="text" class="form-control" id="last_name" name="last_name" placeholder="Last Name" required>
                    <label for="last_name">Last Name<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <input type="text" class="form-control" id="tel" name="tel" placeholder="tel" required>
                    <label for="tel">Phone number<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <input type="text" class="form-control" id="company" name="company" placeholder="Company" required>
                    <label for="company">Company<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <input type="text" class="form-control" id="position" name="position" placeholder="Position" required>
                    <label for="position">Position<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <select id="country" name="country" class="form-select">
                        <option value="">Select Country</option>
                        @foreach($data['country'] as $country)
                            <option value="{{$country->id}}">{{$country->name}}</option>
                        @endforeach
                    </select>
                    <label for="country">Country<span style="color:red">*</span></label>
                </div>
                <div class="form-floating mb-3">
                    <select name="user_type" class="form-select">
                        <option value="">Select User Type</option>
                        @foreach($data['user_type'] as $user_type)
                            <option value="{{$user_type->id}}">{{$user_type->type_name}}</option>
                        @endforeach
                    </select>
                    <label for="country">User Type<span style="color:red">*</span></label>
                </div>
                <div class="mt-2" align="left">
                    <label>Payment Type:<span style="color: red;">*</span></label>
                    <input type="radio" name="payment_type" value="1" checked="checked"> Free
                    <input type="radio" name="payment_type" value="2"> Paid
                </div>
                <div class="mb-3">
                                        <input type="hidden" name="ip_address" value="{{$ipaddress}}">
                    <input type="hidden" id="agree" name="agree" value="1">
                </div>
                <div>
                    <button class="btn btn_grz_blue submit_user">Save</button>
                </div>
            </form>
        </div>
    </div>
@endsection
@section('footer')
<script type="text/javascript">
    $(document).ready(function() {
        $('.submit_user').click(function(e, obj){
            if ($('#user_form')[0].checkValidity() === false) {
                $('#user_form').addClass('was-validated');
                e.preventDefault()
                e.stopPropagation()
            }else{
                $('#user_form').submit();
            }
        });
    });
</script>
@endsection