{% extends 'back_office/bo_layout.html' %}
{% block head %}
{% endblock %}
{% block style %}
 <style type="text/css">
 	.list-group-item{
 		background-color: green;
 		border: 0px;
 	}
 </style>
{% endblock %}
{% block title %} Dashboard {% endblock %} 
{% block content %}
	<h1 class="text-center font-weight-bold mt-2">Membership Dashboard</h1>
	{% for mesg in get_flashed_messages(category_filter=["successMsg"]) %}
	<div class="alert alert-success text-center alert-dismissible" id="successMessage" >
		<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
		<h4><img src="/static/images/right.png" alt="right" height="21" width="21">{{ mesg }}</h4>
	</div>    
	{% endfor %}
	{% for mesg in get_flashed_messages(category_filter=["errorMsg"]) %}
	<div class="alert alert-danger text-center alert-dismissible" id="successMessage" >
		<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
		<h4><img src="/static/images/wrong_img.png" alt="wrong" height="21" width="21">{{ mesg }}</h4>
	</div>
	{% endfor %}
	<div class="row float-right">
		<div class="col-md-12">
			<a class="btn btn-primary text-white font-weight-bold" href="{{url_for('backoffice.SearchAllMembersNonMembers',society_id=society_id,society_key=society_key)}}">Search All Members</a>
			<a class="btn btn-primary text-white font-weight-bold" href="{{url_for('backoffice.SearchProsecAll',society_id=society_id,society_key=society_key)}}">Search Proposer/Seconder</a>
		</div>
	</div><br>
	<div class="row mobile-responsive mt-4">
		<div class="col-md-1"></div>
		<div class="col-md-3">
			<div class="card bg-success h-100 font-weight-bold text-center">
				<div class="card-header text-white">
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
						<h3 class="text-white font-weight-bold">Members</h5>	
						</div>
						<div class="col-md-4">
							{{total_count[0].total_mem_count}}
							<a href="{{url_for('backoffice.MembersPage',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
						</div>
					</div>
				</div>
				<div class="card-body">
					{% for i in member_type_count %}
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
							{{i.member_type or ""}}
						</div>
						<div class="col-md-4">
							{{i.member_type_count}}
							<a href="{{url_for('backoffice.MembersPage',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.50rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
						</div>
					</div>
					{% endfor %}
				</div>
			</div>			
		</div>
		<div class="col-md-3">
			<div class="card bg-primary h-100 font-weight-bold text-center">
				<div class="card-header text-white mt-1">
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
							<h3 class="text-white font-weight-bold">Non Members</h3>
						</div>
						<div class="col-md-4">
							{{non_members[0].non_members}}
							<a href="" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"></i></a>
						</div>
					</div>
				</div>
				<div class="card-body">
					<div class="row text-white text-left">
						<div class="col-md-8">
							Incomplete Members
						</div>
						<div class="col-md-4">
							{{incomplete_mem[0].incomplete_mem}}
							<a href="{{url_for('backoffice.IncompleteForm',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
							
						</div>
					</div>
					{% if waiting_for_approvel[0].waiting_for_approvel != 0 : %}
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
							Awaiting Secretariat's approval
						</div>
						<div class="col-md-4">
							{{waiting_for_approvel[0].waiting_for_approvel}}
							<a href="{{url_for('backoffice.ApprovalPage',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
							
						</div>
					</div>
					{% endif %}
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
							Awaiting for Proposer / Seconder
						</div>
						<div class="col-md-4">
							{{waiting_proposer_seconder[0].waiting_proposer_seconder}}
							<a href="{{url_for('backoffice.WaitingProposerSeconder',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
							
						</div>
					</div>
					{% if waiting_for_payment[0].waiting_for_payment: %}
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
							Awaiting For Payment
						</div>
						<div class="col-md-4">
							{{waiting_for_payment[0].waiting_for_payment}}
							<a href="{{url_for('backoffice.ApprovedAwaitingPayment',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
							
						</div>
					</div>
					{% endif %}
					{% if rejected_members[0].rejected_members: %}
					<div class="row text-white text-left mt-1">
						<div class="col-md-8 ">
							Rejected Members
						</div>
						<div class="col-md-4">
							{{rejected_members[0].rejected_members}}
							<a href="{{url_for('backoffice.RejectedPage',society_id=society_id,society_key=society_key)}}" class="btn btn-sm btn-link text-white" style="font-size:1.19rem;"><i class="fa fa-eye" aria-hidden="true"></i></a>
							
						</div>
					</div>
					{% endif %}					
				
				</div>
			</div>
			
		</div>
		<div class="col-md-3">
			<div class="card bg-secondary h-100 font-weight-bold text-center">
				<div class="card-header text-white">
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
							<h3 class="text-white font-weight-bold">Total Ratified Members</h3>	
						</div>
						<div class="col-md-4">
							<label class="btn btn-sm btn-link text-white" style="font-size:1.19rem;">{{total_ratified_count[0].total_ratified_count}}</label>
						</div>
					</div>
				</div>
				<div class="card-body">
					{% for i in ratification %}
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
						{% if i.ratified_year %}	
							{{i.ratified_year or ""}}
						{% else %}
							Old Members
						{% endif %}
						</div>
						<div class="col-md-4">
							<label class="btn btn-sm btn-link text-white" style="font-size:1.50rem;">{{i.ratified_count}}</label>
						</div>
					</div>
					{% endfor %}
					<hr>
					
					<div class="row text-white text-left mt-1">
						<div class="col-md-8">
						Non Ratified Members	
						</div>
						<div class="col-md-4">
							<label class="btn btn-sm btn-link text-white" style="font-size:1.19rem;">{{total_non_ratified_count[0].total_non_ratified_count}}</label>
						</div>
					</div>
				</div>
			</div>
		</div>
			
	</div><br>
		
		
{% endblock %}
{% block script %}
<script type="text/javascript">
	var BaseUrl = document.location.origin
	var society_id  = "{{society_id}}";
	var society_key = "{{society_key}}";
	$("#collapseFilter").hide(); 
	function btn_search() 
	{
		$('#show').show()
		var search_value    = $("#search").val();
		if (search_value.length < 3)
		{
			alert("Please select atleast 3 character");
		}	
		else
		{
		   $.ajax({
				url:"/bo/search_member_for_expire/"+society_id+"/"+society_key,
				method:"POST",
				data:{'search_value':search_value,},
				success:function(data)
				{
					$('#show').html(data);
				}
			});
		}
	}

</script>
{% endblock %}