<%- include("partials/page-header", {
  user,
  title: "💊 " + t.patientMedications.selectmedication,
  subtitle: patient.firstname + " " + patient.lastname,
  showUserName: true,
  showDashboardButton: false
}) %>

<div class="content">

  <%- include("partials/flash") %>

  <div class="container-fluid">

    <div class="card shadow-sm mb-3 patient-box">
      <div class="card-body">
        <h5 class="mb-1"><%= patient.firstname %> <%= patient.lastname %></h5>
        <div class="text-muted small">
          <%= t.global.birthdate %>:
          <%= new Date(patient.birthdate).toLocaleDateString("de-DE") %>
        </div>
      </div>
    </div>

    <div class="row g-3">

      <!-- Medikament hinzufügen -->
      <div class="col-lg-6">
        <div class="card shadow-sm h-100">
          <div class="card-header fw-semibold">
            ➕ <%= t.patientMedications.selectmedication %>
          </div>
          <div class="card-body">

            <form method="POST" action="/patients/<%= patient.id %>/medications/assign">

              <div class="mb-2">
                <label class="form-label"><%= t.patientMedications.selectmedication %></label>
                <select name="medication_variant_id" class="form-select" required>
                  <option value="">-- <%= t.global.selection %> --</option>
                  <% meds.forEach(m => { %>
                    <option value="<%= m.id %>">
                      <%= m.medication %> | <%= m.form %> | <%= m.dosage %>
                      <% if (m.package) { %> | <%= m.package %><% } %>
                    </option>
                  <% }) %>
                </select>
              </div>

              <div class="mb-2">
                <label class="form-label"><%= t.patientMedications.dosageinstructions %></label>
                <input type="text" class="form-control" name="dosage_instruction"
                  placeholder="<%= t.patientMedications.example %>" />
              </div>

              <div class="row g-2 mb-2">
                <div class="col-md-6">
                  <label class="form-label"><%= t.patientMedications.startdate %></label>
                  <input type="date" class="form-control" name="start_date" />
                </div>
                <div class="col-md-6">
                  <label class="form-label"><%= t.patientMedications.enddate %></label>
                  <input type="date" class="form-control" name="end_date" />
                </div>
              </div>

              <button class="btn btn-primary">
                ✅ <%= t.patientMedications.save %>
              </button>

              <a href="/patients/<%= patient.id %>/overview" class="btn btn-outline-secondary">
                ⬅️ <%= t.patientMedications.backoverview %>
              </a>

            </form>

          </div>
        </div>
      </div>

      <!-- Aktuelle Medikation -->
      <div class="col-lg-6">
        <div class="card shadow-sm h-100">
          <div class="card-header fw-semibold">
            📋 <%= t.patientMedications.selectmedication %>
          </div>
          <div class="card-body">

            <% if (!currentMeds || currentMeds.length === 0) { %>
              <div class="text-muted"><%= t.patientMedications.nomedication %></div>
            <% } else { %>

              <div class="table-responsive">
                <table class="table table-sm table-striped align-middle">
                  <thead>
                    <tr>
                      <th><%= t.patientMedications.medication %></th>
                      <th><%= t.patientMedications.form %></th>
                      <th><%= t.patientMedications.dosage %></th>
                      <th><%= t.patientMedications.instruction %></th>
                      <th><%= t.patientMedications.from %></th>
                      <th><%= t.patientMedications.to %></th>
                    </tr>
                  </thead>
                  <tbody>
                    <% currentMeds.forEach(cm => { %>
                      <tr>
                        <td><%= cm.medication %></td>
                        <td><%= cm.form %></td>
                        <td><%= cm.dosage %></td>
                        <td><%= cm.dosage_instruction || "-" %></td>
                        <td><%= cm.start_date ? new Date(cm.start_date).toLocaleDateString("de-DE") : "-" %></td>
                        <td><%= cm.end_date ? new Date(cm.end_date).toLocaleDateString("de-DE") : "-" %></td>
                      </tr>
                    <% }) %>
                  </tbody>
                </table>
              </div>

            <% } %>

          </div>
        </div>
      </div>

    </div>

  </div>
</div>
