@extends('layout.mainlayout')
@section('content')

<div class="page-wrapper cardhead">
  <div class="content container-fluid">

    @component('components.breadcrumb')
      @slot('title') Create Ticket @endslot
    @endcomponent

    @if (session('success')) <div class="alert alert-success">{{ session('success') }}</div> @endif
    @if (session('error'))   <div class="alert alert-danger">{{ session('error') }}</div>   @endif
    @if ($errors->any())
      <div class="alert alert-danger">
        <ul class="mb-0">
          @foreach ($errors->all() as $error)
            <li>{{ $error }}</li>
          @endforeach
        </ul>
      </div>
    @endif

    <div class="row">
      <div class="col-xl-8">
        <div class="card">
          <div class="card-header">
            <h5 class="card-title mb-0">New Ticket</h5>
          </div>
          <div class="card-body">

            <form action="{{ route('tickets.store') }}" method="POST" enctype="multipart/form-data">
              @csrf

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Employee</label>
                <div class="col-md-8">
                  <input type="text" class="form-control"
                         value="{{ $user->name }} ({{ $user->email }})" disabled>
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Phone</label>
                <div class="col-md-8">
                  <input type="text" name="user_phone" class="form-control"
                         value="{{ old('user_phone') }}">
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Location</label>
                <div class="col-md-8">
                  <select name="location_id" class="form-control select2">
                    <option value="">Select Location</option>
                    @foreach($locations as $loc)
                      <option value="{{ $loc->id }}" @selected(old('location_id') == $loc->id)>
                        {{ $loc->name }}
                      </option>
                    @endforeach
                  </select>
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Project</label>
                <div class="col-md-8">
                  <select name="project_id" class="form-control select2">
                    <option value="">Select Project</option>
                    @foreach($projects as $p)
                      <option value="{{ $p->id }}" @selected(old('project_id') == $p->id)>
                        {{ $p->name }}
                      </option>
                    @endforeach
                  </select>
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Concern Department</label>
                <div class="col-md-8">
                  <select name="department_id" class="form-control" required>
                    <option value="">Select Department</option>
                    @foreach($departments as $d)
                      <option value="{{ $d->id }}" @selected(old('department_id') == $d->id)>
                        {{ $d->name }}
                      </option>
                    @endforeach
                  </select>
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Subject</label>
                <div class="col-md-8">
                  <input type="text" name="subject" class="form-control"
                         value="{{ old('subject') }}" required>
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Details</label>
                <div class="col-md-8">
                  <textarea name="details" rows="5" class="form-control" required>{{ old('details') }}</textarea>
                </div>
              </div>

              <div class="mb-3 row">
                <label class="col-md-4 col-form-label">Attachment (optional)</label>
                <div class="col-md-8">
                  <input type="file" name="attachment" class="form-control">
                </div>
              </div>

              <div class="text-center">
                <button class="btn btn-primary">Submit Ticket</button>
              </div>

            </form>

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

  </div>
</div>
@endsection