@extends('layouts.nebulox', [
  'title' => 'Machines',
  'subtitle' => 'Add and manage machines'
])

@section('content')

<div class="nx-grid nx-grid-2">

  <div class="nx-card">
    <div class="nx-card-header">Add Machine</div>
    <div class="nx-card-body">
      <form method="POST" action="{{ route('admin.machines.store') }}">
        @csrf

        <label class="nx-label">Machine Name</label>
        <input class="nx-input" type="text" name="machineName" required placeholder="e.g. SARMC1">

        <div class="nx-mt-12"></div>

        <label class="nx-label">Machine Serial Number</label>
        <input class="nx-input" type="text" name="machineSerialNumber" required placeholder="e.g. 3554773378257592">

        <button class="nx-btn nx-btn-primary nx-w-full nx-mt-12" type="submit">
          Add Machine
        </button>
      </form>

      <div class="nx-muted nx-mt-12">
        New machines are created as <strong>unlinked</strong>. Use “Link” page to assign them to a location.
      </div>
    </div>
  </div>

  <div class="nx-card">
    <div class="nx-card-header">Existing Machines</div>
    <div class="nx-card-body">

      @if(session('status'))
        <div class="nx-alert nx-alert-ok" style="margin-bottom:12px;">
          {{ session('status') }}
        </div>
      @endif

      @if($errors->any())
        <div class="nx-alert nx-alert-bad" style="margin-bottom:12px;">
          <div style="font-weight:800; margin-bottom:6px;">Fix the errors below</div>
          <ul style="margin:0; padding-left:18px;">
            @foreach($errors->all() as $e) <li>{{ $e }}</li> @endforeach
          </ul>
        </div>
      @endif

      <div class="nx-scroll">
        <table class="nx-table">
          <thead>
            <tr>
              <th>ID</th>
              <th>Machine</th>
              <th>Serial</th>
              <th style="white-space:nowrap;">Location</th>
              <th style="white-space:nowrap;">Location ID</th>
              <th style="white-space:nowrap;">Created</th>
              <th style="white-space:nowrap;">Actions</th>
            </tr>
          </thead>

          <tbody>
            @forelse($machines as $m)
              @php
                // your controller returns stdClass rows; be defensive
                $created = $m->created_at ?? null;
                $locationName = $m->locationName ?? '';
              @endphp

              <tr>
                <td>{{ $m->id }}</td>
                <td><strong>{{ $m->machineName }}</strong></td>
                <td>{{ $m->machineSerialNumber }}</td>
                <td>{{ $locationName !== '' ? $locationName : '-' }}</td>
                <td>{{ $m->location_id ?? '-' }}</td>
                <td>{{ $created ? $created : '-' }}</td>

                <td>
                  <form method="POST"
                        action="{{ route('admin.machines.destroy', $m->id) }}"
                        onsubmit="return confirm('Delete this machine? This cannot be undone.');"
                        style="display:inline;">
                    @csrf
                    @method('DELETE')
                    <button class="nx-btn" type="submit"
                            style="background:#fee2e2; border:1px solid #fecaca; color:#991b1b;">
                      Delete
                    </button>
                  </form>
                </td>
              </tr>
            @empty
              <tr>
                <td colspan="7" class="nx-muted">No machines yet.</td>
              </tr>
            @endforelse
          </tbody>
        </table>
      </div>

      <div class="nx-muted" style="margin-top:10px;">
        Note: “Created” shows “-” if the controller query does not select <code>created_at</code>.
      </div>

    </div>
  </div>

</div>

@endsection