@extends('layouts.panel')
@section('content')
<div><h2 class="text-3xl text-[#041627]">Editor Workspace</h2><p class="text-[#44474c]">{{ $article->title }}</p></div>
@if($errors->any())
<div class="bg-[#ffdad6] border border-[#ba1a1a] text-[#93000a] p-4 rounded">
  <ul class="list-disc pl-5 text-sm">@foreach($errors->all() as $error)<li>{{ $error }}</li>@endforeach</ul>
</div>
@endif
@php($canAcceptArticle = $article->canBeAcceptedByEditor())
<section class="grid lg:grid-cols-2 gap-6">
<div class="bg-white border border-[#aeb6bf] p-6 space-y-4">
<a href="{{ route('articles.edit', $article) }}" class="inline-flex items-center gap-1 text-sm font-semibold text-[#041627] underline">Open Full Metadata & Files Form</a>
<h3 class="font-semibold">Update Metadata</h3>
<form method="POST" action="{{ route('editor.articles.update',$article) }}" class="space-y-3">@csrf @method('PUT')
<div><label class="text-sm font-semibold">Article Title</label><input name="title" value="{{ old('title',$article->title) }}" required class="w-full border border-[#aeb6bf] p-2"></div>
<textarea name="synopsis" rows="6" class="w-full border border-[#aeb6bf] p-2">{{ old('synopsis',$article->synopsis) }}</textarea>
<input name="keywords" value="{{ old('keywords',$article->keywords) }}" class="w-full border border-[#aeb6bf] p-2" placeholder="keywords">
<input name="status" value="{{ old('status',$article->status) }}" class="w-full border border-[#aeb6bf] p-2" placeholder="status (optional manual override)">
<button class="bg-[#041627] text-white px-4 py-2 text-sm font-semibold">Save Changes</button>
</form>
<div class="flex flex-wrap gap-2">
  <form method="POST" action="{{ route('editor.articles.request-revision',$article) }}">@csrf<button class="mt-3 bg-[#ba1a1a] text-white px-4 py-2 text-sm font-semibold">Send Back For Revision</button></form>
  <form method="POST" action="{{ route('editor.articles.accept',$article) }}">@csrf<button @disabled(! $canAcceptArticle) class="mt-3 bg-[#204877] text-white px-4 py-2 text-sm font-semibold disabled:cursor-not-allowed disabled:opacity-50">Mark Accepted</button>@if(! $canAcceptArticle)<p class="mt-1 text-xs text-[#44474c]">Available after all assigned reviewers approve.</p>@endif</form>
  <form method="POST" action="{{ route('editor.articles.publish',$article) }}" enctype="multipart/form-data" class="mt-3 space-y-2">@csrf
    <div><label class="text-sm font-semibold">Volume</label><select name="volume_id" data-volume-select required class="border border-[#aeb6bf] p-2 w-full bg-white">
      <option value="">Select Volume</option>
      @foreach($volumes as $volume)
      <option value="{{ $volume->id }}" @selected((string) old('volume_id', $article->issue->volume_id ?? '') === (string) $volume->id)>{{ $volume->title }} @if($volume->year)({{ $volume->year }})@endif</option>
      @endforeach
    </select></div>
    <div><label class="text-sm font-semibold">Issue</label><select name="issue_id" data-issue-select required class="border border-[#aeb6bf] p-2 w-full bg-white">
      <option value="">Select Issue</option>
      @foreach($issues as $issue)
      <option value="{{ $issue->id }}" data-volume-id="{{ $issue->volume_id }}" @selected((string) old('issue_id', $article->issue_id) === (string) $issue->id)>{{ $issue->title }}</option>
      @endforeach
    </select></div>
    <input name="doi" value="{{ old('doi',$article->doi) }}" maxlength="255" class="border border-[#aeb6bf] p-2 w-full" placeholder="DOI">
    <textarea name="citation" rows="3" class="border border-[#aeb6bf] p-2 w-full" placeholder="Citation">{{ old('citation',$article->citation) }}</textarea>
    <label class="text-sm font-semibold block">Publish Date</label>
    <input type="date" name="published_on" value="{{ old('published_on', optional($article->published_on)->format('Y-m-d') ?? now()->toDateString()) }}" required class="border border-[#aeb6bf] p-2 w-full">
    <label class="text-sm font-semibold block">Formatted PDF (required if not uploaded yet)</label>
    <input type="file" name="formatted_pdf" accept=".pdf,application/pdf" data-max-kb="10240" @if(blank($article->formatted_pdf)) required @endif class="border border-[#aeb6bf] p-2 w-full bg-white">
    @if($article->formatted_pdf)
    <p class="text-xs text-[#44474c]">Existing: {{ $article->formatted_pdf }}</p>
    @endif
    <button class="bg-[#00522f] text-white px-4 py-2 text-sm font-semibold">Publish Article</button>
  </form>
</div>
</div>
<div class="bg-white border border-[#aeb6bf] p-6 space-y-4">
<h3 class="font-semibold">Assign Reviewers</h3>
<form method="POST" action="{{ route('editor.articles.assign-reviewer',$article) }}" class="grid gap-2 sm:grid-cols-[minmax(0,1fr)_auto]">@csrf<div><label class="text-sm font-semibold">Reviewer</label><select name="reviewer_id" required class="border border-[#aeb6bf] p-2 w-full">@foreach($reviewers as $r)<option value="{{ $r->id }}">{{ $r->name }} ({{ $r->email }})</option>@endforeach</select></div><button class="bg-[#041627] text-white px-4 py-2 text-sm font-semibold sm:self-end">Assign</button></form>
<form method="POST" action="{{ route('editor.articles.send-reminder',$article) }}" class="grid gap-2 sm:grid-cols-[minmax(0,1fr)_auto] mt-2">@csrf<div><label class="text-sm font-semibold">Reviewer</label><select name="reviewer_id" required class="border border-[#aeb6bf] p-2 w-full">@foreach($reviewers as $r)<option value="{{ $r->id }}">{{ $r->name }} ({{ $r->email }})</option>@endforeach</select></div><button class="bg-white border border-[#041627] text-[#041627] px-4 py-2 text-sm font-semibold sm:self-end">Send Reminder</button></form>
<div><h4 class="font-semibold mb-2">Assigned</h4><ul class="space-y-2">@forelse($article->reviews as $review)<li class="text-sm">{{ $review->reviewer->name ?? 'Reviewer' }} - {{ $review->verdict ?? 'pending' }}</li>@empty<li class="text-sm text-[#44474c]">No reviewers yet.</li>@endforelse</ul></div>
</div>
</section>
<script>
(() => {
  const volume = document.querySelector('[data-volume-select]');
  const issue = document.querySelector('[data-issue-select]');
  if (!volume || !issue) {
    return;
  }

  const filterIssues = () => {
    const selectedVolume = volume.value;
    let selectedIssueStillVisible = false;
    issue.querySelectorAll('option').forEach((option) => {
      if (!option.value) {
        return;
      }
      const visible = !selectedVolume || option.dataset.volumeId === selectedVolume;
      option.hidden = !visible;
      option.disabled = !visible;
      if (visible && option.selected) {
        selectedIssueStillVisible = true;
      }
    });
    if (!selectedIssueStillVisible) {
      issue.value = '';
    }
  };

  volume.addEventListener('change', filterIssues);
  filterIssues();
})();
</script>
@endsection