feat(series): chapter-aware manage view + reader — frontend (FC-6.1)

Completes FC-6.1: the series management UI now works in chapters.

- SeriesManageView: chapters as cards (inline-rename, stated-page range inputs,
  move up/down, merge-into-previous, delete, pick-as-add-target), pages
  drag-reorder WITHIN a chapter, a "gap: N-M missing" badge between chapters
  with a stated-page hole, and Add chapter / Add placeholder. The picker adds
  the selection into the targeted chapter.
- seriesManage store: chapter CRUD + reorderChapters/moveChapter/mergeChapter/
  reorderPages actions; consumes chapters[]/gaps[]; addSelected targets a chapter.
- Reader: page_number is now within-chapter, so anchors switched to a global
  `seq` (reading-order position) — fixes scroll/jump/active collisions across
  chapters — plus chapter-title dividers at each chapter boundary.
- Updated seriesManage.spec to the chaptered store shape.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/test/seriesManage.spec.js

@@ -13,6 +13,19 @@ function stubFetch(handler) {
   })
 }
 
+const SERIES_BODY = {
+  series: { id: 7, name: 'V' },
+  chapters: [
+    {
+      id: 1, chapter_number: 1, title: null, is_placeholder: false,
+      stated_page_start: null, stated_page_end: null,
+      pages: [{ image_id: 1, page_number: 1, thumbnail_url: 't' }]
+    }
+  ],
+  gaps: [],
+  pages: [{ image_id: 1, page_number: 1, thumbnail_url: 't' }]
+}
+
 describe('seriesManage', () => {
   beforeEach(() => setActivePinia(createPinia()))
   afterEach(() => vi.restoreAllMocks())
@@ -22,48 +35,61 @@ describe('seriesManage', () => {
     expect(moveItem([1, 2, 3], 0, 2)).toEqual([2, 3, 1])
   })
 
-  it('load fetches pages + series', async () => {
+  it('load fetches chapters + series and picks a default target', async () => {
     const s = useSeriesManageStore()
-    stubFetch(() => ({
-      status: 200,
-      body: { series: { id: 7, name: 'V' },
-              pages: [{ image_id: 1, page_number: 1, thumbnail_url: 't' }] }
-    }))
+    stubFetch(() => ({ status: 200, body: SERIES_BODY }))
     await s.load(7)
     expect(s.series).toEqual({ id: 7, name: 'V' })
-    expect(s.pages.map(p => p.image_id)).toEqual([1])
+    expect(s.chapters.map(c => c.id)).toEqual([1])
+    expect(s.pageCount).toBe(1)
+    expect(s.targetChapterId).toBe(1)
   })
 
-  it('reorder posts the full ordered id list', async () => {
+  it('reorderPages posts ordered ids to the chapter reorder route', async () => {
     const s = useSeriesManageStore()
     s.tagId = 7
-    s.pages = [{ image_id: 1 }, { image_id: 2 }, { image_id: 3 }]
     const calls = []
     stubFetch((url, init) => {
       calls.push({ url, body: init.body ? JSON.parse(init.body) : null })
       if (url.includes('/reorder')) return { status: 200, body: { ok: true } }
-      return { status: 200, body: { series: { id: 7, name: 'V' }, pages: [] } }
+      return { status: 200, body: SERIES_BODY }
     })
-    await s.reorder([3, 1, 2])
-    const r = calls.find(c => c.url.includes('/reorder'))
-    expect(r.url).toContain('/api/series/7/reorder')
-    expect(r.body).toEqual({ image_ids: [3, 1, 2] })
+    await s.reorderPages(3, [30, 10, 20])
+    const r = calls.find(c => c.url.includes('/chapters/3/reorder'))
+    expect(r.url).toContain('/api/series/7/chapters/3/reorder')
+    expect(r.body).toEqual({ image_ids: [30, 10, 20] })
   })
 
-  it('addSelected posts picker selection then reloads', async () => {
+  it('moveChapter reorders via the chapter id list', async () => {
     const s = useSeriesManageStore()
     s.tagId = 7
+    s.chapters = [{ id: 1 }, { id: 2 }, { id: 3 }]
+    const calls = []
+    stubFetch((url, init) => {
+      calls.push({ url, body: init.body ? JSON.parse(init.body) : null })
+      if (url.includes('/chapters/reorder')) return { status: 200, body: { ok: true } }
+      return { status: 200, body: SERIES_BODY }
+    })
+    await s.moveChapter(2, -1)
+    const r = calls.find(c => c.url.includes('/chapters/reorder'))
+    expect(r.body).toEqual({ chapter_ids: [2, 1, 3] })
+  })
+
+  it('addSelected posts selection + target chapter then clears', async () => {
+    const s = useSeriesManageStore()
+    s.tagId = 7
+    s.targetChapterId = 5
     s.pickerSelection = [9, 10]
     const calls = []
     stubFetch((url, init) => {
       calls.push({ url, body: init.body ? JSON.parse(init.body) : null })
-      if (url.includes('/pages') && init.method === 'POST')
+      if (url.endsWith('/pages') && init.method === 'POST')
         return { status: 200, body: { added_count: 2 } }
-      return { status: 200, body: { series: { id: 7, name: 'V' }, pages: [] } }
+      return { status: 200, body: SERIES_BODY }
     })
     await s.addSelected()
     const add = calls.find(c => c.url.endsWith('/api/series/7/pages'))
-    expect(add.body).toEqual({ image_ids: [9, 10] })
+    expect(add.body).toEqual({ image_ids: [9, 10], chapter_id: 5 })
     expect(s.pickerSelection).toEqual([])
   })
 })