{% extends "base.html" %}

{% block extrahead %}
  {{ form.media }}
{% endblock %}

{% block content %}
{% if username %}
	<h3>Edit user {{form.firstname.value|default_if_none:""}} {{form.lastname.value|default_if_none:""}}</h3>
	<form action="{% url 'people_edit' username=username %}" method="post">
{% else %}
	<h3>Create new user</h3>
	<form action="{% url 'people_create' %}" method="post">
{% endif %}
		{% csrf_token %}
		<div class="row mb-3">
			<label for="{{form.firstname.name}}" class="col-sm-2 col-col-sm-2 col-form-label">First name</label>
			<div class="col-sm-10">
				<input type="text" class="form-control" placeholder="First name" aria-label="First name" name="{{form.firstname.name}}" id="{{form.firstname.name}}" {% if form.firstname.field.required %}required{% endif %} value="{{form.firstname.value|default_if_none:""}}">
			</div>
		</div>
		<div class="row mb-3">
			<label for="{{form.lastname.name}}" class="col-sm-2 col-form-label">Last name</label>
			<div class="col-sm-10">
				<input type="text" class="form-control" placeholder="Last name" aria-label="Last name" name="{{form.lastname.name}}" id="{{form.lastname.name}}" {% if form.lastname.field.required %}required{% endif %} value="{{form.lastname.value|default_if_none:""}}">
			</div>
		</div>
		<div class="row mb-3">
			<label for="{{form.email.name}}" class="col-sm-2 col-form-label">Email</label>
			<div class="col-sm-10">
				<input type="text" class="form-control" placeholder="Email" aria-label="Email" type="email" name="{{form.email.name}}" id="{{form.email.name}}" {% if form.email.field.required %}required{% endif %} value="{{form.email.value|default_if_none:""}}">
			</div>
		</div>
		<div class="row mb-3">
			<label for="{{form.job_title.name}}" class="col-sm-2 col-form-label">Job title</label>
			<div class="col-sm-10">
				<input type="text" class="form-control" placeholder="Software Engineer" aria-label="Job title" name="{{form.job_title.name}}" {% if form.job_title.field.required %}required{% endif %} value="{{form.job_title.value|default_if_none:""}}">
			</div>
		</div>
		<div class="row mb-3">
			<label for="" class="col-sm-2 col-form-label">Manager</label>
			<div class="col-sm-10">
				{{form.manager}}
			</div>
		</div>
		<div class="row mb-3">
			<label for="{{form.location.name}}" class="col-sm-2 col-form-label">Location</label>
			<div class="col-sm-10">
				<input type="text" class="form-control" placeholder="Munich" aria-label="Location" name="{{form.location.name}}" {% if form.location.field.required %}required{% endif %} value="{{form.location.value|default_if_none:""}}">
			</div>
		</div>
		<div class="row mb-3">
			<label for="{{form.employee_type.name}}" class="col-sm-2 col-form-label">Employee Type</label>
			<div class="col-sm-10">
				<select name="{{form.employee_type.name}}" id="{{form.employee_type.name}}" class="form-select">
					{% for choice in form.employee_type.field.choices %}
						{% if form.employee_type.value == choice.0 %}
							<option value="{{ choice.0 }}" selected>{{ choice.1 }}</option>
						{% else %}
							<option value="{{ choice.0 }}">{{ choice.1 }}</option>
						{% endif %}
					{% endfor %}
				</select>
			</div>
		</div>
{% if username %}
{% else %}
		<div class="row mb-3">
			<label for="{{form.password.name}}" class="col-sm-2 col-form-label">Password</label>
			<div class="col-sm-10">
				<input type="password" class="form-control" placeholder="Password" aria-label="Password" name="{{form.password.name}}" value="">
			</div>
		</div>
{% endif %}
		<div class="row mb-3">
			<div class="col-sm-10">
				<input class="form-check-input" type="checkbox" name="{{form.with_smartcard_required.name}}" id="{{form.with_smartcard_required.name}}" {% if form.with_smartcard_required.value %}checked{% endif %}>
				<label class="form-check-label" for="{{form.with_smartcard_required.name}}">Require smartcard</label>
			</div>
		</div>
		<div class="row mb-3">
			<div class="col-sm-10">
				<input class="form-check-input" type="checkbox" name="{{form.enabled.name}}" id="{{form.enabled.name}}" {% if form.enabled.value %}checked{% endif %}>
      			<label class="form-check-label" for="{{form.enabled.name}}">Enabled user</label>
			</div>
		</div>
		<div class="row mb-3">
			<div class="col-sm-10">
				<input class="form-check-input" type="checkbox" name="{{form.vpn_enabled.name}}" id="{{form.vpn_enabled.name}}" {% if form.vpn_enabled.value %}checked{% endif %}>
      			<label class="form-check-label" for="{{form.vpn_enabled.name}}">Enabled VPN</label>
			</div>
		</div>

{% if username %}
		<button type="submit" class="btn btn-primary">Save</button>
{% else %}
		<button type="submit" class="btn btn-primary">Create</button>
{% endif %}
	</form>
{% endblock %}