{% extends "base.html" %}
{% block content %}
<div class="page-head">
  <div>
    <p class="eyebrow">{{ t('create_login') }}</p>
    <h1>{{ t('company_profiles') }}</h1>
  </div>
  <button class="btn solid" type="button" data-open="company-modal">{{ t('add_company') }}</button>
</div>

{% if profiles %}
<div class="profile-grid">
  {% for row in profiles %}
    <article class="profile-card {{ row.status }}">
      <header>
        <div>
          <p class="eyebrow">{{ t('viewing_profile') }}</p>
          <h2>{{ row.company.name }}</h2>
        </div>
        <span class="pill {{ row.status }}">
          {% if row.status == 'ok' %}{{ t('healthy') }}
          {% elif row.status == 'watch' %}{{ t('needs_check') }}
          {% elif row.status == 'alert' %}{{ t('critical') }}
          {% else %}{{ t('no_readings') }}{% endif %}
        </span>
      </header>
      <p>{{ row.company.contact_person or '—' }}{% if row.company.phone %} · {{ row.company.phone }}{% endif %}</p>
      {% if row.company.address %}<p class="hint">{{ row.company.address }}</p>{% endif %}
      <ul class="profile-meta">
        <li>{{ row.machine_count }} {{ t('profile_machines') }}</li>
        <li>{{ t('login_account') }}: <span class="mono">{{ row.username or '—' }}</span></li>
        <li>{{ t('operator_logins') }}: {{ row.operator_count }}</li>
      </ul>
      <div class="row-actions">
        <a class="btn solid" href="{{ url_for('set_profile', company_id=row.company.id) }}">{{ t('open_profile') }}</a>
        <a class="btn tiny" href="{{ url_for('set_profile', company_id=row.company.id, next=url_for('operators_page')) }}">{{ t('operator_logins') }}</a>
        <a class="btn tiny" href="{{ url_for('set_profile', company_id=row.company.id, next=url_for('machines_page')) }}">{{ t('machines') }}</a>
        <button class="btn tiny" type="button" data-edit-company="{{ row.company.id }}">{{ t('edit') }}</button>
        <form method="post" action="{{ url_for('delete_company', company_id=row.company.id) }}" onsubmit="return confirm('{{ t('confirm_delete') }}')">
          <button class="btn tiny danger" type="submit">{{ t('delete') }}</button>
        </form>
      </div>
    </article>
  {% endfor %}
</div>
{% else %}
  <p class="empty">{{ t('no_company_profiles') }}</p>
{% endif %}

<dialog id="company-modal" class="modal">
  <form method="post" class="modal-card">
    <h2 id="company-modal-title" data-add="{{ t('add_company') }}">{{ t('add_company') }}</h2>
    <input type="hidden" name="company_id" id="company_id">
    <label>{{ t('company_name') }}
      <input name="name" id="company_name" required>
    </label>
    <label>{{ t('contact') }}
      <input name="contact_person" id="contact_person">
    </label>
    <label>{{ t('phone') }}
      <input name="phone" id="phone">
    </label>
    <label>{{ t('address') }}
      <input name="address" id="address">
    </label>
    <label>{{ t('target_tons') }}
      <input name="target_tons" id="target_tons" type="number" step="0.01" min="0" placeholder="22">
      <small class="hint">{{ t('plant_target_hint') }}</small>
    </label>
    <label>{{ t('full_name') }}
      <input name="full_name" id="full_name">
    </label>
    <label>{{ t('username') }}
      <input name="username" id="username" autocomplete="off">
    </label>
    <label>{{ t('password') }}
      <input name="password" id="password" type="password" autocomplete="new-password">
      <small class="hint">{{ t('password_optional') }}</small>
    </label>
    <div class="modal-actions">
      <button class="btn" type="button" data-close="company-modal">{{ t('cancel') }}</button>
      <button class="btn solid" type="submit">{{ t('save') }}</button>
    </div>
  </form>
</dialog>
{% endblock %}