{% include "header.html" %}
{% load static %}

<div class="mdk-header-layout__content">

<div class="mdk-drawer-layout js-mdk-drawer-layout" data-push data-responsive-width="992px">

<div class="mdk-drawer-layout__content page">

<div class="container page__heading-container">

<div class="row mb-3">

<div class="col-6">

{% if role %}
<h1 class="heading">Edit User Role</h1>
{% else %}
<h1 class="heading">Add User Role</h1>
{% endif %}

<nav aria-label="breadcrumb">
<ol class="breadcrumb mb-0">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="{% url 'user_role_management' %}">User Roles</a></li>

{% if role %}
<li class="breadcrumb-item active">Edit Role</li>
{% else %}
<li class="breadcrumb-item active">Add Role</li>
{% endif %}

</ol>
</nav>

</div>

</div>
</div>


<div class="container page__container exam-module">

<div class="card card-body">

<form method="POST">
{% csrf_token %}

{% if role %}
<input type="hidden" name="role_id" value="{{role.id}}">
{% endif %}

<div class="row">

<div class="col-md-6">
<div class="form-group">
<label>Role Name</label>
<input type="text" name="role_name" class="form-control"
value="{{role.role_name|default:''}}" required>
</div>
</div>

<div class="col-md-6">
<div class="form-group">
<label>Status</label>

<select name="status" class="form-control">

<option value="Active"
{% if role.status == "Active" %}selected{% endif %}>
Active
</option>

<option value="Inactive"
{% if role.status == "Inactive" %}selected{% endif %}>
Inactive
</option>

</select>

</div>
</div>

</div>


<hr>

<h5 class="mb-3">Feature Permissions</h5>

<div class="table-responsive">

<table class="table table-bordered text-center">

<thead class="table-heading">
<tr>
<th>Feature</th>
<th>View</th>
<!-- <th>Add</th>
<th>Edit</th>
<th>Delete</th> -->
</tr>
</thead>

<tbody>

{% for feature in features %}

<tr>

<td class="text-start">{{feature.feature_name}}</td>

<td>
<input type="checkbox"
name="view_{{feature.id}}"

{% for p in permissions %}
{% if p.feature.id == feature.id and p.can_view %}
checked
{% endif %}
{% endfor %}

>
</td>

<!-- <td>
<input type="checkbox"
name="add_{{feature.id}}"

{% for p in permissions %}
{% if p.feature.id == feature.id and p.can_add %}
checked
{% endif %}
{% endfor %}

>
</td>

<td>
<input type="checkbox"
name="edit_{{feature.id}}"

{% for p in permissions %}
{% if p.feature.id == feature.id and p.can_edit %}
checked
{% endif %}
{% endfor %}

>
</td>

<td>
<input type="checkbox"
name="delete_{{feature.id}}"

{% for p in permissions %}
{% if p.feature.id == feature.id and p.can_delete %}
checked
{% endif %}
{% endfor %}

>
</td> -->

</tr>

{% endfor %}

</tbody>

</table>

</div>


<div class="text-center mt-4">

{% if role %}
<button type="submit" class="btn btn-primary">
Update Role
</button>
{% else %}
<button type="submit" class="btn btn-primary">
Add Role
</button>
{% endif %}

<a href="{% url 'user_role_management' %}" class="btn btn-outline-secondary ms-3">
Cancel
</a>

</div>

</form>

</div>

</div>

</div>

{% include "sidebar.html" %}

</div>

</div>

{% include "footer.html" %}