@extends('layouts/contentNavbarLayout')

@section('title', 'KPI Achievement - Type 5')

@section('content')
<br>
<div class="container my-4">
  <div class="card">
    <div class="card-header">
      <h4 class="mb-0">Achievement Details (Type 5)</h4>
    </div>

      <div class="card-body">
      <table class="table table-bordered">
        <tbody>
          <tr><th class="w-50 fw-bold">Year :</th><td>2022</td></tr>
          <tr><th class="fw-bold">Quarter :</th><td>2</td></tr>
          <tr><th class="fw-bold">Division :</th><td>EXPORTS PROMOTION & MARKET ACCESS DIVISION</td></tr>
          <tr><th class="fw-bold">Section :</th><td>EUROPE & AMERICAS SECTION</td></tr>
          <tr><th class="fw-bold">Unit/Office :</th><td>N/A</td></tr>
          <tr><th class="fw-bold">Indicator :</th><td>Companies Assisted</td></tr>
          <tr><th class="fw-bold">Indicator Type :</th><td>Type 5</td></tr>
          <tr><th class="fw-bold">Annual Target :</th><td>12</td></tr>
          <tr><th class="fw-bold">Metric :</th><td>Companies</td></tr>
          <tr>
            <th class="fw-bold">Achievement Count :</th>
            <td>100</td>
          </tr>
          <tr><th class="fw-bold">Remarks by PMU Admin :</th><td></td></tr>
        </tbody>
      </table>

      <br><br>
      <!-- Responsive Table Section -->
        <div class="table-responsive">
          <table class="table table-bordered table-sm text-nowrap">
            <thead>
              <tr>
                <th><input type="checkbox" id="checkAll"></th>
                <th>No.</th>
                <th>Year</th>
                <th>Quarter</th>
                <th>Programme <input type="radio" name="programme" value="1"></th>
                <th>Name of Importer <input type="radio" name="programme" value="2"></th>
                <th>Name of Malaysian Exporter <input type="radio" name="programme" value="3"></th>
                <th>Product/Service <input type="radio" name="programme" value="4"></th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td><input type="checkbox" class="rowCheckbox"></td>
                <td>1</td>
                <td>2022</td>
                <td>2</td>
                <td>Mentor Program</td>
                <td>ABC Sdn Bhd</td>
                <td>ABC123-Z</td>
                <td>Mentor Program</td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>

    <div class="card-footer d-flex justify-content-end gap-2">
      <button type="button" class="btn btn-primary ms-2" id="saveBtn">Save</button>
      <a href="{{ url()->previous() }}" class="btn btn-secondary">Back</a>
    </div>
  </div>
</div>
@endsection