fix: change bg select admin page

This commit is contained in:
2026-07-01 15:05:52 +03:00
parent 4089037fb7
commit 0f573cbf9c
3 changed files with 141 additions and 5 deletions
+138
View File
@@ -0,0 +1,138 @@
import { useState } from "react";
import { registerAdmin } from "../api/index";
const ROLES = [
{ value: "Рабочий", label: "Рабочий" },
{ value: "Админ", label: "Администратор" },
];
export default function AdminStaff() {
const [form, setForm] = useState({
username: "",
password: "",
first_name: "",
last_name: "",
phone: "",
role: "Рабочий",
});
const [busy, setBusy] = useState(false);
const [message, setMessage] = useState(null);
const handleChange = (field) => (e) =>
setForm({ ...form, [field]: e.target.value });
const handleSubmit = async () => {
// валидация
if (!form.username.trim()) {
setMessage({ type: "error", text: "Введите логин" });
return;
}
if (form.password.length < 8) {
setMessage({ type: "error", text: "Пароль минимум 8 символов" });
return;
}
if (!form.first_name.trim() || !form.last_name.trim()) {
setMessage({ type: "error", text: "Введите имя и фамилию" });
return;
}
setBusy(true);
setMessage(null);
try {
await registerAdmin(form);
setMessage({ type: "success", text: "Сотрудник зарегистрирован" });
// очистить форму
setForm({
username: "",
password: "",
first_name: "",
last_name: "",
phone: "",
role: "Рабочий",
});
} catch (err) {
setMessage({
type: "error",
text: err.response?.data?.error || "Не удалось зарегистрировать",
});
} finally {
setBusy(false);
}
};
const inputClass =
"bg-white/5 border border-white/10 rounded px-3 py-2 text-white placeholder-white/40 focus:border-gold focus:outline-none";
return (
<div className="max-w-md">
<h2 className="text-xl font-medium text-white mb-4">
Регистрация сотрудника
</h2>
<div className="flex flex-col gap-3">
<input
className={inputClass}
placeholder="Логин"
value={form.username}
onChange={handleChange("username")}
/>
<input
type="password"
className={inputClass}
placeholder="Пароль (минимум 8 символов)"
value={form.password}
onChange={handleChange("password")}
/>
<input
className={inputClass}
placeholder="Имя"
value={form.first_name}
onChange={handleChange("first_name")}
/>
<input
className={inputClass}
placeholder="Фамилия"
value={form.last_name}
onChange={handleChange("last_name")}
/>
<input
className={inputClass}
placeholder="Телефон (необязательно)"
value={form.phone}
onChange={handleChange("phone")}
/>
{/* роль */}
<select
className={inputClass}
value={form.role}
onChange={handleChange("role")}
>
{ROLES.map((r) => (
<option key={r.value} value={r.value}>
{r.label}
</option>
))}
</select>
{/* сообщение */}
{message && (
<p
className={`text-sm ${message.type === "success" ? "text-green-400" : "text-red-400"
}`}
>
{message.text}
</p>
)}
<button
onClick={handleSubmit}
disabled={busy}
className="bg-gold text-black px-6 py-2 rounded font-medium uppercase text-sm disabled:opacity-50"
>
{busy ? "Регистрация..." : "Зарегистрировать"}
</button>
</div>
</div>
);
}
+1 -1
View File
@@ -98,7 +98,7 @@ export default function AdminStock() {
// общий класс инпутов
const inputClass =
"bg-white/5 border border-white/10 rounded px-3 py-2 text-white placeholder-white/40 focus:border-gold focus:outline-none";
"bg-slate-800 border border-white/10 rounded px-3 py-2 text-white placeholder-white/40 focus:border-gold focus:outline-none";
return (
<div className="flex flex-col gap-8">
+2 -4
View File
@@ -3,7 +3,7 @@ import PageLayout from "../components/PageLayout";
import AdminItems from "../components/AdminItems";
import AdminOrders from "../components/AdminOrders";
import AdminStock from "../components/AdminStock";
// import AdminStaff from "../components/AdminStaff"; // добавим позже
import AdminStaff from "../components/AdminStaff";
export default function AdminPage() {
const [tab, setTab] = useState("items");
@@ -42,9 +42,7 @@ export default function AdminPage() {
{tab === "items" && <AdminItems />}
{tab === "orders" && <AdminOrders />}
{tab === "stock" && <AdminStock />}
{tab === "staff" && (
<p className="text-white/50">Раздел сотрудников в разработке</p>
)}
{tab === "staff" && <AdminStaff />}
</main>
</PageLayout>
);