start

frontend/src/pages/admin/ObjectListPage.tsx

@@ -0,0 +1,58 @@
+import { useState } from 'react'
+import { Link } from 'react-router'
+import { useDeleteObject, useObjectsList } from '../../hooks/useObjects'
+import { Button } from '../../components/Button'
+
+export function ObjectListPage() {
+  const [search, setSearch] = useState('')
+  const { data: objects, isLoading } = useObjectsList(search)
+  const deleteObject = useDeleteObject()
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between gap-2">
+        <h1 className="text-xl font-semibold">Объекты</h1>
+        <Link to="/admin/objects/new">
+          <Button>Добавить</Button>
+        </Link>
+      </div>
+
+      <input
+        value={search}
+        onChange={(e) => setSearch(e.target.value)}
+        placeholder="Поиск по номеру или названию..."
+        className="w-full rounded-md border border-slate-300 px-3 py-2 dark:border-slate-700 dark:bg-slate-900"
+      />
+
+      {isLoading && <p className="text-slate-500">Загрузка...</p>}
+
+      <div className="divide-y divide-slate-200 dark:divide-slate-800">
+        {objects?.map((object) => (
+          <div key={object.id} className="flex items-center justify-between gap-2 py-3">
+            <div>
+              <p className="font-medium">{object.name}</p>
+              <p className="text-sm text-slate-500 dark:text-slate-400">
+                {object.inventory_number}
+                {object.box && ` · ${object.box.name}`}
+              </p>
+            </div>
+            <div className="flex shrink-0 gap-2">
+              <Link to={`/admin/objects/${object.id}/edit`}>
+                <Button variant="secondary">Изменить</Button>
+              </Link>
+              <Button
+                variant="danger"
+                onClick={() => {
+                  if (confirm(`Удалить объект «${object.name}»?`)) deleteObject.mutate(object.id)
+                }}
+              >
+                Удалить
+              </Button>
+            </div>
+          </div>
+        ))}
+        {objects?.length === 0 && !isLoading && <p className="py-4 text-slate-500">Ничего не найдено</p>}
+      </div>
+    </div>
+  )
+}