feat(admin): table/card views for treatment cases, matching the patients list

The list was cards only, so comparing courses across patients meant reading four
stacked blocks instead of scanning columns. It now has the same table/card
toggle the patients page uses, reusing that page's toggle icons and keeping the
choice in the URL so back and refresh hold it. Table is the default here: the
operator, status and session progress are the columns a manager scans.

Both views derive the operator the same way, through one helper — history
(performed_by) when a session has been done, otherwise the plan
(assigned_staff), labelled as not yet performed.

Also fixes a three-states slip in the operator picker I added last time: it
rendered "no staff defined" while the staff list was still loading, which is
what an empty list looks like from the user's side. Loading now says so.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

assets/admin/pages/TreatmentCasesPage.test.tsx

@@ -47,6 +47,8 @@ describe('صفحهٔ پرونده‌های درمان', () => {
     mockList([caseRow()]);
 
     renderWithProviders(<TreatmentCasesPage />);
+    await screen.findByText('محمد رسولی');
+    fireEvent.click(screen.getByLabelText('نمایش کارتی'));
 
     const name = await screen.findByText('محمد رسولی');
     expect(name.tagName).toBe('STRONG');
@@ -120,6 +122,8 @@ describe('صفحهٔ پرونده‌های درمان', () => {
     mockList([caseRow({ opened_at: 1_786_000_000 })]);
 
     renderWithProviders(<TreatmentCasesPage />);
+    await screen.findByText('محمد رسولی');
+    fireEvent.click(screen.getByLabelText('نمایش کارتی'));
 
     // formatDateTime ساعت را با «:» می‌آورد؛ formatDate نمی‌آورد.
     const start = await screen.findByText(/^شروع:/);
@@ -131,6 +135,8 @@ describe('صفحهٔ پرونده‌های درمان', () => {
     mockList([caseRow({ performed_by: [{ uuid: 'st-1', name: 'پرسنل۱' }] })]);
 
     renderWithProviders(<TreatmentCasesPage />);
+    await screen.findByText('محمد رسولی');
+    fireEvent.click(screen.getByLabelText('نمایش کارتی'));
 
     expect(await screen.findByText(/انجام‌دهنده: پرسنل۱/)).toBeInTheDocument();
   });
@@ -140,10 +146,37 @@ describe('صفحهٔ پرونده‌های درمان', () => {
     mockList([caseRow({ assigned_staff: [{ uuid: 'st-2', name: 'پرسنل۲' }] })]);
 
     renderWithProviders(<TreatmentCasesPage />);
+    await screen.findByText('محمد رسولی');
+    fireEvent.click(screen.getByLabelText('نمایش کارتی'));
 
     expect(await screen.findByText(/اپراتور: پرسنل۲/)).toBeInTheDocument();
   });
 
+  /** نمای پیش‌فرض جدول است — همان الگوی صفحهٔ پرونده‌ها، با سوییچ به کارتی. */
+  it('پیش‌فرض جدولی است و به کارتی سوییچ می‌شود', async () => {
+    mockList([caseRow()]);
+
+    renderWithProviders(<TreatmentCasesPage />);
+    await screen.findByText('محمد رسولی');
+
+    expect(screen.getByRole('columnheader', { name: 'پرسنل' })).toBeInTheDocument();
+
+    fireEvent.click(screen.getByLabelText('نمایش کارتی'));
+    expect(screen.queryByRole('columnheader', { name: 'پرسنل' })).not.toBeInTheDocument();
+
+    fireEvent.click(screen.getByLabelText('نمایش جدولی'));
+    expect(screen.getByRole('columnheader', { name: 'پرسنل' })).toBeInTheDocument();
+  });
+
+  it('ستون پرسنل در جدول پر می‌شود', async () => {
+    mockList([caseRow({ performed_by: [{ uuid: 'st-1', name: 'پرسنل۱' }] })]);
+
+    renderWithProviders(<TreatmentCasesPage />);
+
+    const cell = await screen.findByRole('cell', { name: 'پرسنل۱' });
+    expect(cell).toBeInTheDocument();
+  });
+
   it('دکمهٔ ویرایش مودال را باز می‌کند', async () => {
     mockList([caseRow()]);