{% extends 'admin_base_layout.html' %}
{% load static %}
{% block content %}
<!-- html code -->
<title>Seer | Edit Fortune Teller</title>
	    <div class="main-content pt-0">
	    	<div class="content-wrapper">
	    		<div class="row">
	    			<div class="col-12">
	    				<h2 class="topHead">Edit Fortune Teller</h2>
	    			</div>	    			
	    		</div>
	    		<div class="row new-user-table bookings mt-3">
	    			<div class="col-12 col-md-12">
	    				<div class="card addService fortune dashboard-card">
	    					<form class="row g-3" action="/edit-fortuneteller/{{ fortune_obj.id }}" id="edit-fortune-teller" method="POST">
							{% csrf_token %}
	    						<div class="col-12 col-md-6">
								  	<label class="col-form-label">First Name</label>
								    <input type="text" placeholder="First Name" name="first_name" class="form-control" value="{{ fortune_obj.first_name}}" maxlength="15">
	    						</div>
								<div class="col-12 col-md-6">
								  	<label class="col-form-label">Last Name</label>
								    <input type="text" placeholder="Last Name" name="last_name" class="form-control" value="{{ fortune_obj.last_name}}" maxlength="15">
	    						</div>
	    						<div class="col-12 col-md-6">
								  	<label class="col-form-label">Email</label>
								    <input type="email" placeholder="Enter Email" name="email" class="form-control" maxlength="50" value="{{ fortune_obj.email}}" readonly >
	    						</div>
	    						<div class="col-12 col-md-6">
								  	<label class="col-form-label d-block">Phone Number</label>
                                    <input type="text" placeholder="Phone Number" name="phone_number" id="phone_number" class="form-control" maxlength="15" value="{{ fortune_obj.phone_number}}" readonly>
	    						</div>
								<input type="hidden" id="customer_id" name="customer_id" value="{{ fortune_obj.id}}"/>
                                {% comment %} <div class="col-12 col-md-6">
                                    <label class="col-form-label d-block">Date of Birth</label>
                                    <input type="date"  name="date_of_birth" class="form-control" value="{{ fortune_obj.date_of_birth|date:"Y-m-d" }}">
                              </div> {% endcomment %}

	    						<div class="col-12">
	    							<div class="save-btn text-center mt-4">
										<button type="submit" class="save-btn">Update Fortune</button>
								    </div>
	    						</div>
	    					</form>
	    				</div>
	    			</div>
	    		</div>
	    	</div>
	    </div>	

<!-- end of html code -->
{%endblock%}

{%block js%}
<!-- js code -->
<script>
	// mobile number plugin
	var input = document.querySelector("#phone_number");
		window.intlTelInput(input, {
			separateDialCode: true,
			customPlaceholder: function (
				selectedCountryPlaceholder,
				selectedCountryData
			) {
				return "e.g. " + selectedCountryPlaceholder;
			},
		});
	</script>

<!-- end of js -->
{% endblock %}