feat(web): upgrade lists to ReUI Table v9 and EventCalendar

Единый kitDataGridTableLayout и ResourcePage/FrameDataGrid на всех списках. Календарь задач переведён на EventCalendar, lookup — на cascader, у операций появился вид доски. Удалены settings-7 и самописные DataGridSection/toolbar. Co-authored-by: Cursor <[email protected]>
2026-08-23 01:38:56 +07:00
parent 927e27640a
commit d56405af7b
157 changed files with 39067 additions and 6110 deletions
@@ -1,14 +1,36 @@
-import { ColumnDef } from '@tanstack/react-table'
-import { useMemo } from 'react'
+import { useMemo, useState } from 'react'
+import { ListTodo, SearchIcon } from 'lucide-react'

-import { DataGridMutedCell, DataGridPrimaryCell } from '@/components/data-grid-cell'
-import { DataGridSection } from '@/components/data-grid-shell'
+import { DataGridMutedCell, DataGridNameCell } from '@/components/data-grid-cell'
 import { StatusBadge } from '@/components/status-badge'
 import { DataGridColumnHeader } from '@/components/reui/data-grid/data-grid-column-header'
-import { useClientDataGrid } from '@/hooks/use-client-data-grid'
-import { jobKindRu } from '@/lib/ui-labels'
+import type { FilterField, FilterQuery } from '@/components/reui/filters/filters-types'
+import {
+  ResourcePage,
+  createTextFilterQuery,
+  type DataGridColumnDef,
+} from '@/components/reui-kit'
+import { isRefreshJobKind, jobKindRu } from '@/lib/ui-labels'
 import type { JobRow } from '@/types/api'

+const FAILED_STATUSES = ['failed', 'error', 'cancelled']
+
+const filterFields: FilterField[] = [
+  {
+    id: 'search',
+    label: 'Поиск',
+    icon: <SearchIcon className="size-3.5" aria-hidden />,
+    type: 'text',
+    placeholder: 'Поиск задач…',
+  },
+]
+
+function tabFilter(item: JobRow, tabId: string): boolean {
+  if (tabId === 'refresh') return isRefreshJobKind(item.kind)
+  if (tabId === 'failed') return FAILED_STATUSES.includes(item.status.toLowerCase())
+  return true
+}
+
 export function ScheduleJobsGrid({
  items,
  isLoading = false,
@@ -16,12 +38,35 @@ export function ScheduleJobsGrid({
  items: JobRow[]
  isLoading?: boolean
 }) {
-  const columns = useMemo<ColumnDef<JobRow>[]>(
+  const [filterQuery, setFilterQuery] = useState<FilterQuery>(() =>
+    createTextFilterQuery('search'),
+  )
+
+  const tabs = useMemo(
+    () => [
+      { id: 'all', label: 'Все', count: items.length },
+      {
+        id: 'refresh',
+        label: 'Обновление',
+        count: items.filter((job) => isRefreshJobKind(job.kind)).length,
+      },
+      {
+        id: 'failed',
+        label: 'С ошибкой',
+        count: items.filter((job) => FAILED_STATUSES.includes(job.status.toLowerCase())).length,
+      },
+    ],
+    [items],
+  )
+
+  const columns = useMemo<DataGridColumnDef<JobRow>[]>(
    () => [
      {
        accessorKey: 'kind',
        header: ({ column }) => <DataGridColumnHeader column={column} title="Вид" />,
-        cell: ({ row }) => <DataGridPrimaryCell title={jobKindRu(row.original.kind)} />,
+        cell: ({ row }) => (
+          <DataGridNameCell icon={ListTodo} title={jobKindRu(row.original.kind)} />
+        ),
        meta: { headerTitle: 'Вид' },
      },
      {
@@ -77,23 +122,26 @@ export function ScheduleJobsGrid({
    [],
  )

-  const { table, globalFilter, setGlobalFilter, filteredCount } = useClientDataGrid({
-    data: items,
-    columns,
-    getSearchText: (row) => `${jobKindRu(row.kind)} ${row.status} ${row.error ?? ''}`,
-    getRowId: (row) => row.job_id,
-  })
-
  return (
-    <DataGridSection
-      table={table}
-      recordCount={filteredCount}
+    <ResourcePage
+      title="Задачи"
+      description="Последние задачи из API"
+      tabs={tabs}
+      tabFilter={tabFilter}
+      filterFields={filterFields}
+      filterQuery={filterQuery}
+      onFilterQueryChange={setFilterQuery}
+      onClearFilters={() => setFilterQuery(createTextFilterQuery('search'))}
+      getFilterFieldValue={(item, field) => {
+        if (field !== 'search') return undefined
+        return `${jobKindRu(item.kind)} ${item.status} ${item.error ?? ''} ${item.job_id}`
+      }}
+      columns={columns}
+      data={items}
+      getRowId={(row) => row.job_id}
      isLoading={isLoading}
-      emptyMessage="Нет задач"
-      showPagination={items.length > 10}
-      searchValue={globalFilter}
-      onSearchChange={setGlobalFilter}
-      searchPlaceholder="Поиск задач…"
+      virtualization={items.length > 80}
+      emptyState={{ title: 'Нет задач в выборке' }}
    />
  )
 }