uldp-degree-mangement-system/views/admin/certificate/edit.ejs

<div class="page-title-area">
  <div>
    <h1>Edit Certificate</h1>
    <p class="subtitle"><code style="font-size:0.8rem;color:var(--info-color)"><%= cert.certification_number %></code></p>
  </div>
  <a href="/admin/certificate" class="btn btn-outline-secondary"><i class="fas fa-arrow-left"></i> Back</a>
</div>

<% if (typeof error !== 'undefined' && error) { %>
  <div class="alert d-flex align-items-center gap-2 mb-3" style="background:var(--danger-soft);color:var(--danger-color);border:none;border-radius:var(--border-radius-sm);">
    <i class="fas fa-exclamation-circle"></i> <%= error %>
  </div>
<% } %>

<form method="POST" action="/admin/certificate/<%= cert._id %>/edit" enctype="multipart/form-data">
  <div class="row g-3">
    <div class="col-lg-8">

      <div class="card border-0 mb-3">
        <div class="card-header"><h5 class="card-header-title"><i class="fas fa-id-card"></i> Basic Information</h5></div>
        <div class="card-body">
          <div class="row g-3">
            <div class="col-md-6">
              <label class="form-label">Certificate No. <span class="text-danger">*</span></label>
              <input type="text" class="form-control" name="certification_number" required value="<%= cert.certification_number %>">
            </div>
            <div class="col-md-6">
              <label class="form-label">Student Full Name <span class="text-danger">*</span></label>
              <input type="text" class="form-control" name="student_name" required value="<%= cert.student_name %>">
            </div>
            <div class="col-md-6">
              <label class="form-label">Program / Title <span class="text-danger">*</span></label>
              <input type="text" class="form-control" name="program_name" required value="<%= cert.program_name %>">
            </div>
            <div class="col-md-6">
              <label class="form-label">Passport No.</label>
              <input type="text" class="form-control" name="passport_number" value="<%= cert.passport_number || '' %>">
            </div>
            <div class="col-12">
              <label class="form-label">Address</label>
              <input type="text" class="form-control" name="address" value="<%= cert.address || '' %>">
            </div>
          </div>
        </div>
      </div>

      <div class="card border-0 mb-3">
        <div class="card-header"><h5 class="card-header-title"><i class="fas fa-tags"></i> Classification</h5></div>
        <div class="card-body">
          <div class="row g-3">
            <div class="col-md-4">
              <label class="form-label">Department <span class="text-danger">*</span></label>
              <select class="form-select" name="department" required>
                <option value="">-- Select --</option>
                <% departments.forEach(d => { %>
                  <option value="<%= d._id %>" <%= (cert.department && cert.department._id && cert.department._id.toString() === d._id.toString()) ? 'selected' : '' %>><%= d.name %></option>
                <% }); %>
              </select>
            </div>
            <div class="col-md-4">
              <label class="form-label">Level <span class="text-danger">*</span></label>
              <select class="form-select" name="level" required>
                <option value="">-- Select --</option>
                <% levels.forEach(l => { %>
                  <option value="<%= l._id %>" <%= (cert.level && cert.level._id && cert.level._id.toString() === l._id.toString()) ? 'selected' : '' %>><%= l.type %></option>
                <% }); %>
              </select>
            </div>
            <div class="col-md-4">
              <label class="form-label">Issue Date <span class="text-danger">*</span></label>
              <input type="date" class="form-control" name="issued_date" required value="<%= cert.issued_date ? new Date(cert.issued_date).toISOString().substring(0,10) : '' %>">
            </div>
            <div class="col-md-4">
              <label class="form-label">Status</label>
              <select class="form-select" name="status">
                <option value="active" <%= cert.status === 'active' ? 'selected' : '' %>>Active</option>
                <option value="revoked" <%= cert.status === 'revoked' ? 'selected' : '' %>>Revoked</option>
              </select>
            </div>
          </div>
        </div>
      </div>

    </div>

    <div class="col-lg-4">
      <div class="card border-0 mb-3">
        <div class="card-header"><h5 class="card-header-title"><i class="fas fa-file-upload"></i> Certificate Documents</h5></div>
        <div class="card-body">
          <% if (cert.certificate_image && cert.certificate_image.length) { %>
            <div class="mb-3 d-flex flex-wrap gap-2">
              <% cert.certificate_image.forEach(function(f) { %>
                <% if (f.match(/\.(pdf)$/i)) { %>
                  <a href="/admin/files/<%= f %>" target="_blank" class="btn btn-sm btn-outline-danger">
                    <i class="fas fa-file-pdf"></i> <%= f %>
                  </a>
                <% } else { %>
                  <a href="/admin/files/<%= f %>" target="_blank">
                    <img src="/admin/files/<%= f %>" alt="certificate" class="img-thumbnail" style="max-height:90px;border-radius:var(--border-radius-sm);">
                  </a>
                <% } %>
              <% }); %>
            </div>
          <% } %>
          <input type="file" class="form-control" name="certificate_image" accept="image/*,application/pdf" multiple>
          <div class="form-text">Accepted: JPG, PNG, WEBP, PDF — max 20MB each. Uploading new files will replace existing ones.</div>
        </div>
      </div>
      <div class="card border-0">
        <div class="card-body d-flex flex-column gap-2">
          <button type="submit" class="btn btn-primary w-100"><i class="fas fa-save"></i> Save Changes</button>
          <a href="/admin/certificate" class="btn btn-outline-secondary w-100">Cancel</a>
        </div>
      </div>
    </div>
  </div>
</form>