{% extends "admin.html" %}

{% load url from future %}

{% block headtitle %}Add Member {% endblock %}

{% block members_active %}active{% endblock %}

{% block top_content %}

	<div class="row">
		<div class="col-lg-12">
			<ul class="breadcrumb">
				<li><a href="{% url 'admin' %}">Admin</a> </li>
				<li><a href="{% url 'admin_members' %}">Members</a> </li>
				<li class="active">Add Member</li>
			</ul>
		</div>
	</div>

    <div class="row">
        <div class="col-lg-12">
            <div class="page-header">
                <h1>Add Member</h1>
            </div>
        </div>
    </div>

{% endblock %}

{% block content %}

    <div class="row">
        <div class="col-lg-12">
        	<form action="" method="post" enctype="multipart/form-data" class="form-horizontal">{% csrf_token %}
        		<h2>User Account Details</h2>
        		{% include "admin/partials/form.html" with form=member_user_form %}
        		{% include "admin/partials/form.html" with form=member_password_form %}

        		<h2>Member Details</h2>
        		{% include "admin/partials/form.html" with form=member_form %}

				<h2>Gift Aid Details</h2>
				{% include "admin/partials/form.html" with form=gift_aid_form %}

				<h2>Invoice Details</h2>
				{% include "admin/partials/form.html" with form=invoice_form %}

				<div class="form-group form-actions">
					<div class="col-lg-offset-3 col-lg-4">
        				<a href="{% url 'admin_members' %}" title="Cancel" class="btn btn-default">Cancel</a>
						<input type="submit" class="btn btn-primary" value="Save" />
					</div>
				</div>
        	</form>

        </div>
    </div>

	<script type="text/javascript">
		$(function() {
			$( "#id_expiry_date" ).datepicker({dateFormat: 'dd/mm/yy'});
			$( "#id_date_of_birth" ).datepicker({dateFormat: 'dd/mm/yy'});
		});
    </script>

{% endblock %}