@extends('layouts.app')
@section('content')
<div class="px-6 py-4">
  @if(session('success'))<div class="mb-3 p-3 bg-green-50 border border-green-200 text-green-800 rounded">{{ session('success') }}</div>@endif

  <div class="grid md:grid-cols-2 gap-6">
    <div class="bg-white rounded shadow p-4">
      <h2 class="font-semibold text-lg mb-3">Edit Group</h2>
      <form method="POST" action="{{ route('applications.timegroups.update',$timegroup->id) }}" class="space-y-3">
        @csrf @method('PUT')
        <div>
          <label class="block text-sm font-medium">Name</label>
          <input name="name" value="{{ old('name',$timegroup->name) }}" class="mt-1 w-full border rounded p-2">
          @error('name')<p class="text-red-600 text-sm">{{ $message }}</p>@enderror
        </div>
        <div>
          <label class="block text-sm font-medium">Description</label>
          <input name="description" value="{{ old('description',$timegroup->description) }}" class="mt-1 w-full border rounded p-2">
        </div>
        <div class="pt-2 flex items-center gap-3">
          <button class="bg-indigo-600 text-white px-4 py-2 rounded">Save</button>
        </div>
      </form>

      <form method="POST" action="{{ route('applications.timegroups.destroy',$timegroup->id) }}" onsubmit="return confirm('Delete group?')" class="mt-3">
        @csrf @method('DELETE')
        <button class="px-4 py-2 bg-red-600 text-white rounded">Delete</button>
      </form>
    </div>

    <div class="bg-white rounded shadow p-4">
      <h2 class="font-semibold text-lg mb-3">Rules</h2>
      <form method="POST" action="{{ route('applications.timegroups.rules.add',$timegroup->id) }}" class="grid sm:grid-cols-2 gap-3 items-end">
        @csrf
        <div>
          <label class="block text-sm font-medium">Kind</label>
          <select name="kind" class="mt-1 w-full border rounded p-2">
            <option value="weekly">Weekly</option>
            <option value="date">Date</option>
            <option value="range">Date Range</option>
          </select>
        </div>
        <div>
          <label class="block text-sm font-medium">DOW Mask (e.g., Mon-Fri or Mon,Wed,Fri)</label>
          <input name="dow_mask" class="mt-1 w-full border rounded p-2" placeholder="Mon-Fri">
        </div>
        <div>
          <label class="block text-sm font-medium">Date</label>
          <input type="date" name="date" class="mt-1 w-full border rounded p-2">
        </div>
        <div class="grid grid-cols-2 gap-2">
          <div>
            <label class="block text-sm font-medium">Start Date</label>
            <input type="date" name="start_date" class="mt-1 w-full border rounded p-2">
          </div>
          <div>
            <label class="block text-sm font-medium">End Date</label>
            <input type="date" name="end_date" class="mt-1 w-full border rounded p-2">
          </div>
        </div>
        <div class="grid grid-cols-2 gap-2">
          <div>
            <label class="block text-sm font-medium">Start Time</label>
            <input type="time" name="start_time" class="mt-1 w-full border rounded p-2">
          </div>
          <div>
            <label class="block text-sm font-medium">End Time</label>
            <input type="time" name="end_time" class="mt-1 w-full border rounded p-2">
          </div>
        </div>
        <div class="sm:col-span-2">
          <button class="bg-green-600 text-white px-4 py-2 rounded">Add Rule</button>
        </div>
      </form>

      <div class="mt-4">
        @forelse($rules as $r)
        <div class="flex items-center justify-between border rounded p-2 mb-2">
          <div class="text-sm">
            <span class="font-medium">{{ strtoupper($r->kind) }}</span>
            <span class="text-gray-600 ml-2">
              @if($r->kind==='weekly') DOW: {{ $r->dow_mask ?? '' }} @endif
              @if($r->kind==='date') Date: {{ $r->date }} @endif
              @if($r->kind==='range') {{ $r->start_date }} ? {{ $r->end_date }} @endif
              | {{ $r->start_time ?? '00:00' }} - {{ $r->end_time ?? '23:59' }}
            </span>
          </div>
          <form method="POST" action="{{ route('applications.timegroups.rules.delete',[$timegroup->id,$r->id]) }}" onsubmit="return confirm('Delete rule?')">
            @csrf @method('DELETE')
            <button class="text-red-600 text-sm">Delete</button>
          </form>
        </div>
        @empty
        <p class="text-sm text-gray-500">No rules yet.</p>
        @endforelse
      </div>
    </div>
  </div>
</div>
@endsection