{{-- resources/views/admin/posts/_form.blade.php --}}
@csrf
<div class="card-body">
  <div class="row">
    {{-- KOLOM KIRI (KONTEN) --}}
    <div class="col-md-8">
      <div class="mb-3">
        <label for="post_title" class="form-label">Judul Berita <span class="text-danger">*</span></label>
        <input type="text" class="form-control @error('post_title') is-invalid @enderror" 
               id="post_title" name="post_title" 
               value="{{ old('post_title', $post->post_title ?? null) }}" required>
        @error('post_title') <div class="invalid-feedback">{{ $message }}</div> @enderror
      </div>

      <div class="mb-3">
        <label for="post_content" class="form-label">Isi Berita <span class="text-danger">*</span></label>
        <textarea class="form-control @error('post_content') is-invalid @enderror" 
                  id="post-content-summernote" name="post_content" rows="15">{{ old('post_content', $post->post_content ?? null) }}</textarea>
        @error('post_content') <div class="invalid-feedback">{{ $message }}</div> @enderror
      </div>
    </div>

    {{-- KOLOM KANAN (META & GAMBAR) --}}
    <div class="col-md-4">
      {{-- Kategori --}}
      <div class="mb-3">
        <label for="category_id" class="form-label">Kategori <span class="text-danger">*</span></label>
        <select class="form-select @error('category_id') is-invalid @enderror" id="category_id" name="category_id" required>
          <option value="" disabled selected>-- Pilih Kategori --</option>
          @foreach($categories as $category)
            <option value="{{ $category->id }}" 
              {{ old('category_id', $post->category_id ?? null) == $category->id ? 'selected' : '' }}>
              {{ $category->category_name }}
            </option>
          @endforeach
        </select>
        @error('category_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
      </div>

      {{-- Status (Aktif/Draft) --}}
      <div class="mb-3">
        <label class="form-label fw-bold">Status</label>
        <div class="form-check form-switch">
          <input class="form-check-input" type="checkbox" name="isActive" id="isActive"
                 {{ old('isActive', $post->isActive ?? false) ? 'checked' : '' }}>
          <label class="form-check-label" for="isActive">Publikasikan Berita</label>
        </div>
      </div>

      {{-- Gambar Unggulan --}}
      <div class="mb-3">
        <label for="img_input" class="form-label fw-bold">Gambar Unggulan <span class="text-danger">*</span></label>
        <div class="my-2" style="height: 150px; display: flex; align-items: center; justify-content: center; background: #f8f9fa; border-radius: 5px; border: 1px dashed #ddd; overflow: hidden;">
          <img id="img_preview" 
               src="{{ $post?->featured_image ? asset('uploads/posts/' . $post->featured_image) : '' }}" 
               alt="Pratinjau Foto" 
               style="height: 100%; width: 100%; object-fit: cover; {{ !$post?->featured_image ? 'display: none;' : '' }}">
          <small id="img_placeholder" style="{{ $post?->featured_image ? 'display: none;' : '' }}">Tidak ada gambar</small>
        </div>
        <input type="file" class="form-control @error('featured_image') is-invalid @enderror" 
               id="img_input" name="featured_image" accept="image/png, image/jpeg, image/webp">
        @if($post)
          <small class="form-text text-muted">Kosongkan jika tidak ingin mengubah gambar.</small>
        @else
          <small class="form-text text-muted">Wajib diisi untuk berita baru.</small>
        @endif
        @error('featured_image') <div class="invalid-feedback">{{ $message }}</div> @enderror
      </div>

      {{-- Tags --}}
      <div class="mb-3">
        <label for="post_tags" class="form-label">Tags (Pisahkan dengan koma)</label>
        <input type="text" class="form-control @error('post_tags') is-invalid @enderror" 
               id="post_tags" name="post_tags" 
               value="{{ old('post_tags', $post->post_tags ?? null) }}">
      </div>

    </div>
  </div>
</div>
<div class="card-footer text-end">
  <a href="{{ route('admin.posts.index') }}" class="btn btn-secondary btn-round">Batal</a>
  <button type="submit" class="btn btn-primary btn-round">Simpan Berita</button>
</div>

@push('scripts')
{{-- Script ini hanya akan dimuat di halaman create/edit --}}
<script>
  // Pratinjau Gambar
  function setupImagePreview(inputId, previewId, placeholderId) {
    const input = document.getElementById(inputId);
    const preview = document.getElementById(previewId);
    const placeholder = document.getElementById(placeholderId);

    input.addEventListener('change', function () {
      if (this.files && this.files[0]) {
        const reader = new FileReader();
        reader.onload = function (e) {
          preview.src = e.target.result;
          preview.style.display = 'block';
          placeholder.style.display = 'none';
        }
        reader.readAsDataURL(this.files[0]);
      }
    });
  }

  $(document).ready(function() {
    // Inisialisasi Summernote
    $('#post-content-summernote').summernote({
      placeholder: 'Tuliskan isi berita di sini...',
      tabsize: 2,
      height: 400,
      toolbar: [
        ['style', ['style']],
        ['font', ['bold', 'italic', 'underline', 'clear']],
        ['para', ['ul', 'ol', 'paragraph']],
        ['insert', ['link', 'picture', 'video']],
        ['view', ['fullscreen', 'codeview', 'help']]
      ]
    });

    // Inisialisasi Pratinjau Gambar
    setupImagePreview('img_input', 'img_preview', 'img_placeholder');
  });
</script>
@endpush