{% extends "layout/base.html" %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-3">
  <h2 class="mb-0">User Settings</h2>
</div>

<div class="card" style="max-width: 40rem;">
  <div class="card-body">
    <h2 class="h6">Change password</h2>
    <form method="post" class="row g-3">
      <input type="hidden" name="form_name" value="password" />
      <div class="col-12">
        <label class="form-label" for="current_password">Current password</label>
        <input class="form-control" type="password" id="current_password" name="current_password" autocomplete="current-password" required />
      </div>

      <div class="col-12">
        <label class="form-label" for="new_password">New password</label>
        <input class="form-control" type="password" id="new_password" name="new_password" autocomplete="new-password" required />
      </div>

      <div class="col-12">
        <label class="form-label" for="confirm_password">Confirm new password</label>
        <input class="form-control" type="password" id="confirm_password" name="confirm_password" autocomplete="new-password" required />
      </div>

      <div class="col-12">
        <button class="btn btn-primary" type="submit">Update password</button>
      </div>
    </form>
  </div>
</div>

<div class="card mt-3" style="max-width: 50rem;">
  <div class="card-body">
    <h2 class="h6">Run Checks preferences</h2>
    <form method="post" class="row g-3">
      <input type="hidden" name="form_name" value="run_checks_preferences" />

      <div class="col-12 col-md-8">
        <label class="form-label" for="run_checks_sort_mode">Default sort order</label>
        <select class="form-select" id="run_checks_sort_mode" name="run_checks_sort_mode">
          <option value="customer" {% if run_checks_sort_mode == 'customer' %}selected{% endif %}>Customer &gt; Backup &gt; Type &gt; Job</option>
          <option value="status" {% if run_checks_sort_mode == 'status' %}selected{% endif %}>Critical &gt; Missed &gt; Warning &gt; Success (override) &gt; Success</option>
        </select>
      </div>

      <div class="col-12">
        <label class="form-label d-block">Default status filter</label>
        <div class="d-flex flex-wrap gap-3">
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_status_critical" name="run_checks_status" value="critical" {% if 'critical' in run_checks_selected_statuses %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_status_critical">Critical</label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_status_missed" name="run_checks_status" value="missed" {% if 'missed' in run_checks_selected_statuses %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_status_missed">Missed</label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_status_warning" name="run_checks_status" value="warning" {% if 'warning' in run_checks_selected_statuses %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_status_warning">Warning</label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_status_success_override" name="run_checks_status" value="success_override" {% if 'success_override' in run_checks_selected_statuses %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_status_success_override">Success (override)</label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_status_success" name="run_checks_status" value="success" {% if 'success' in run_checks_selected_statuses %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_status_success">Success</label>
          </div>
        </div>
      </div>

      <div class="col-12">
        <div class="d-flex flex-wrap gap-4">
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_filter_has_ticket" name="run_checks_filter_has_ticket" value="1" {% if run_checks_filter_has_ticket %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_filter_has_ticket">Only jobs with active ticket</label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" id="run_checks_filter_has_remark" name="run_checks_filter_has_remark" value="1" {% if run_checks_filter_has_remark %}checked{% endif %}>
            <label class="form-check-label" for="run_checks_filter_has_remark">Only jobs with active remark</label>
          </div>
        </div>
      </div>

      <div class="col-12">
        <button class="btn btn-primary" type="submit">Save Run Checks preferences</button>
      </div>
    </form>
  </div>
</div>
{% endblock %}