Refactor UI
diff --git a/erpnext/www/book-appointment/index.html b/erpnext/www/book-appointment/index.html
index b705f9e..b915484 100644
--- a/erpnext/www/book-appointment/index.html
+++ b/erpnext/www/book-appointment/index.html
@@ -2,69 +2,60 @@
{% block title %}{{ _("Book Appointment") }}{% endblock %}
+{% block script %}
+ <script src="assets/js/moment-bundle.min.js"></script>
+ <script src="book-appointment/index.js"></script>
+{% endblock %}
+
{% block page_content %}
<div class="container">
<!-- title: Book an appointment -->
- <div id="select-date">
+ <div id="select-date-time">
<div class="text-center mb-5">
<h3>Book an appointment</h3>
- <p class="lead">Select the date and your timezone</p>
+ <p class="lead text-muted">Select the date and your timezone</p>
</div>
<div class="row justify-content-center mt-3">
- <div class="col-md-4 align-self-center ">
- <form name="myform">
- <input type="date" onchange="validate_date()" name="appointment-date" id="appointment-date"
- class="form-control mt-3">
- <select name="appointment-timezone" id="appointment-timezone" class="form-control mt-3">
+ <div class="col-md-6 align-self-center ">
+ <div class="row">
+ <input type="date" oninput="on_date_or_timezone_select()" name="appointment-date" id="appointment-date"
+ class="form-control mt-3 col-md m-3">
+ <select name="appointment-timezone" oninput="on_date_or_timezone_select()" id="appointment-timezone" class="form-control mt-3 col-md">
</select>
- </form>
- <button class="form-control mt-3 btn btn-dark" id="next-button" onclick="navigate_to_time_select()">
- Next
- </button>
- </div>
- </div>
- </div>
-
- <!--Select Time Slot-->
- <div id="select-time">
- <div class="text-center mb-5">
- <h3>Pick A Time Slot</h3>
- <p class="lead">Selected date is <span class="date-span">Date Span</span></p>
- </div>
- <div class="mt-3 justify-content-center">
- <div class="row" id="timeslot-container">
-
- </div>
- <div class="row justify-content-center">
- <div class="col-md-4 align-self-center">
- <button class="form-control mt-5 btn btn-dark" onclick="initialise_enter_details()">
- Next
- </button>
</div>
</div>
</div>
- </div>
-
- <!--Enter Details-->
- <div id="enter-details">
- <div class="text-center mb-5">
- <h3>Add details</h3>
- <p class="lead">Selected date is <span class="date-span">Date Span</span> at <span class="time-span"> time </span></p>
+ <div class="row mt-3" id="timeslot-container" >
+
</div>
<div class="row justify-content-center mt-3">
- <div class="col-md-4 align-items-center">
- <input class="form-control mt-3" type="text" name="customer_name" id="customer_name" placeholder="Your Name"
- required>
- <input class="form-control mt-3" type="tel" name="customer_number" id="customer_number"
- placeholder="Contact Number" required>
- <input class="form-control mt-3" type="text" name="customer_skype" id="customer_skype" placeholder="Skype"
- required>
- <textarea class="form-control mt-3" name="customer_notes" id="customer_notes" cols="30" rows="10"
- placeholder="Notes"></textarea>
- <button class="btn btn-primary form-control mt-3" onclick="submit()">Submit</button>
+ <div class="col-md-4">
+ <button class="btn btn-primary form-control" id="next-button">Next</button>
</div>
</div>
</div>
</div>
+<!--Enter Details-->
+<div id="enter-details">
+ <div class="text-center mb-5">
+ <h3>Add details</h3>
+ <p class="lead">Selected date is <span class="date-span"></span> at <span class="time-span">
+ </span></p>
+ </div>
+ <div class="row justify-content-center mt-3">
+ <div class="col-md-4 align-items-center">
+ <input class="form-control mt-3" type="text" name="customer_name" id="customer_name" placeholder="Your Name"
+ required>
+ <input class="form-control mt-3" type="tel" name="customer_number" id="customer_number"
+ placeholder="Contact Number" required>
+ <input class="form-control mt-3" type="text" name="customer_skype" id="customer_skype" placeholder="Skype"
+ required>
+ <textarea class="form-control mt-3" name="customer_notes" id="customer_notes" cols="30" rows="10"
+ placeholder="Notes"></textarea>
+ <button class="btn btn-primary form-control mt-3" onclick="submit()" id="submit-button">Submit</button>
+ </div>
+ </div>
+</div>
+</div>
{% endblock %}
\ No newline at end of file