Fovway/time-tracking-eltex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Интерфейс оптимизирован для мобильных устройств

Browse Source
This commit is contained in:
Fovway 2025-10-12 14:36:09 +07:00
parent f40ff5f248
commit 8a2e95b82e
8 changed files with 88 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/index.html
View File

@ -4,10 +4,15 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/icon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css"
rel="stylesheet"
/>
<title>Неучтенное время</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

8
frontend/src/App.css
View File

@ -42,3 +42,11 @@
.read-the-docs {
color: #888;
}
/* Мобильная оптимизация */
@media (max-width: 767.98px) {
.container-fluid {
margin-top: 0 !important;
padding-top: 1rem;
}
}

2
frontend/src/components/AdminPage.jsx
View File

@ -2,7 +2,7 @@ import AdminPanel from "./AdminPanel";
const AdminPage = () => {
return (
<div className="container-fluid px-3" style={{ marginTop: "2rem" }}>
<div className="container-fluid px-0" style={{ marginTop: "2rem" }}>
<AdminPanel />
</div>
);

46
frontend/src/components/AdminPanel.jsx
View File

@ -154,14 +154,14 @@ const AdminPanel = () => {
};
return (
<div className="w-100 mt-5">
<div className="w-100 mt-5 px-0">
<h3>Админ панель</h3>
<div className="mb-3">
<Link to="/" className="btn btn-primary me-2">
<div className="mb-3 d-flex gap-2 flex-column flex-lg-row">
<Link to="/" className="btn btn-primary">
Перейти в дешборд
</Link>
<button
className="btn btn-success me-2"
className="btn btn-success"
onClick={() => setShowCreateForm(true)}
>
Создать пользователя
@ -257,24 +257,26 @@ const AdminPanel = () => {
: "Пользователь"}
</td>
<td>
<button
className="btn btn-sm btn-warning me-2"
onClick={() => setResetPasswordId(user.id)}
>
Сбросить пароль
</button>
<button
className="btn btn-sm btn-success me-2"
onClick={() => handleExportUser(user.id, user.username)}
>
Экспорт
</button>
<button
className="btn btn-sm btn-danger"
onClick={() => setDeleteUserId(user.id)}
>
Удалить
</button>
<div className="d-flex gap-1 flex-column flex-lg-row">
<button
className="btn btn-sm btn-warning"
onClick={() => setResetPasswordId(user.id)}
>
Сбросить пароль
</button>
<button
className="btn btn-sm btn-success"
onClick={() => handleExportUser(user.id, user.username)}
>
Экспорт
</button>
<button
className="btn btn-sm btn-danger"
onClick={() => setDeleteUserId(user.id)}
>
Удалить
</button>
</div>
</td>
</tr>
))}

14
frontend/src/components/Dashboard.jsx
View File

@ -100,17 +100,17 @@ const Dashboard = () => {
}
return (
<div className="w-100 dashboard-container">
<div className="d-flex justify-content-between align-items-center mb-4">
<h2>Добро пожаловать, {user.username}!</h2>
<div>
<div className="w-100 dashboard-container px-0">
<div className="d-flex justify-content-between align-items-center mb-4 flex-column flex-lg-row">
<h2 className="mb-3 mb-lg-0">Добро пожаловать, {user.username}!</h2>
<div className="d-flex flex-column flex-lg-row gap-2">
{user.role === "admin" && (
<Link to="/admin" className="btn btn-secondary me-2">
<Link to="/admin" className="btn btn-secondary">
Админ панель
</Link>
)}
{user.role === "manager" && (
<Link to="/manager" className="btn btn-secondary me-2">
<Link to="/manager" className="btn btn-secondary">
Менеджер панель
</Link>
)}
@ -120,7 +120,7 @@ const Dashboard = () => {
</div>
</div>
<div className="mb-4 d-flex gap-2">
<div className="mb-4 d-flex gap-2 flex-column flex-lg-row">
<button className="btn btn-primary" onClick={() => setShowModal(true)}>
Добавить запись о неучтенном времени
</button>

2
frontend/src/components/ManagerPage.jsx
View File

@ -2,7 +2,7 @@ import ManagerPanel from "./ManagerPanel";
const ManagerPage = () => {
return (
<div className="container-fluid px-3" style={{ marginTop: "2rem" }}>
<div className="container-fluid px-0" style={{ marginTop: "2rem" }}>
<ManagerPanel />
</div>
);

46
frontend/src/components/ManagerPanel.jsx
View File

@ -154,14 +154,14 @@ const ManagerPanel = () => {
};
return (
<div className="w-100 mt-5">
<div className="w-100 mt-5 px-0">
<h3>Менеджер панель</h3>
<div className="mb-3">
<Link to="/" className="btn btn-primary me-2">
<div className="mb-3 d-flex gap-2 flex-column flex-lg-row">
<Link to="/" className="btn btn-primary">
Перейти в дешборд
</Link>
<button
className="btn btn-success me-2"
className="btn btn-success"
onClick={() => setShowCreateForm(true)}
>
Создать пользователя
@ -256,24 +256,26 @@ const ManagerPanel = () => {
: "Пользователь"}
</td>
<td>
<button
className="btn btn-sm btn-warning me-2"
onClick={() => setResetPasswordId(user.id)}
>
Сбросить пароль
</button>
<button
className="btn btn-sm btn-success me-2"
onClick={() => handleExportUser(user.id, user.username)}
>
Экспорт
</button>
<button
className="btn btn-sm btn-danger"
onClick={() => setDeleteUserId(user.id)}
>
Удалить
</button>
<div className="d-flex gap-1 flex-column flex-lg-row">
<button
className="btn btn-sm btn-warning"
onClick={() => setResetPasswordId(user.id)}
>
Сбросить пароль
</button>
<button
className="btn btn-sm btn-success"
onClick={() => handleExportUser(user.id, user.username)}
>
Экспорт
</button>
<button
className="btn btn-sm btn-danger"
onClick={() => setDeleteUserId(user.id)}
>
Удалить
</button>
</div>
</td>
</tr>
))}

34
frontend/src/components/TimeEntriesTable.jsx
View File

@ -18,22 +18,24 @@ const TimeEntriesTable = ({ entries, onDelete, onEdit, isManager = false }) => {
<td>{entry.hours}</td>
{!isManager && (
<td>
{onEdit && (
<button
className="btn btn-sm btn-primary me-2"
onClick={() => onEdit(entry)}
>
Редактировать
</button>
)}
{onDelete && (
<button
className="btn btn-sm btn-danger"
onClick={() => onDelete(entry.id)}
>
Удалить
</button>
)}
<div className="d-flex gap-1 flex-column flex-lg-row">
{onEdit && (
<button
className="btn btn-sm btn-primary"
onClick={() => onEdit(entry)}
>
Редактировать
</button>
)}
{onDelete && (
<button
className="btn btn-sm btn-danger"
onClick={() => onDelete(entry.id)}
>
Удалить
</button>
)}
</div>
</td>
)}
</tr>