115 lines
4.3 KiB
HTML
115 lines
4.3 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Доска задач отдела</title>
|
||
<link rel="stylesheet" href="style.css">
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<h1>📋 Доска задач отдела</h1>
|
||
<p class="subtitle">Управление задачами, отслеживание сроков и журнал изменений</p>
|
||
</header>
|
||
|
||
<section class="stats" id="stats">
|
||
<div class="stat-card">
|
||
<span class="stat-value" id="stat-total">0</span>
|
||
<span class="stat-label">Всего задач</span>
|
||
</div>
|
||
<div class="stat-card">
|
||
<span class="stat-value new" id="stat-new">0</span>
|
||
<span class="stat-label">Новая</span>
|
||
</div>
|
||
<div class="stat-card">
|
||
<span class="stat-value in-progress" id="stat-progress">0</span>
|
||
<span class="stat-label">В работе</span>
|
||
</div>
|
||
<div class="stat-card">
|
||
<span class="stat-value review" id="stat-review">0</span>
|
||
<span class="stat-label">На согласовании</span>
|
||
</div>
|
||
<div class="stat-card">
|
||
<span class="stat-value done" id="stat-done">0</span>
|
||
<span class="stat-label">Готово</span>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="controls">
|
||
<div class="search-box">
|
||
<input type="text" id="search" placeholder="🔍 Поиск по задаче, исполнителю, сроку...">
|
||
</div>
|
||
<div class="chips" id="chips"></div>
|
||
<button class="btn btn-primary" id="btn-add">➕ Добавить задачу</button>
|
||
</section>
|
||
|
||
<section class="table-wrapper">
|
||
<table class="task-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Задача</th>
|
||
<th>Исполнитель</th>
|
||
<th>Срок</th>
|
||
<th>Приоритет</th>
|
||
<th>Статус</th>
|
||
<th>Действия</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="tasks-body"></tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<section class="log-section">
|
||
<h2>📜 Журнал изменений</h2>
|
||
<div class="log-container" id="log"></div>
|
||
<button class="btn btn-secondary" id="btn-export">📥 Выгрузить в CSV</button>
|
||
<button class="btn btn-danger" id="btn-reset">🔄 Сбросить демо-данные</button>
|
||
</section>
|
||
</div>
|
||
|
||
<dialog id="modal">
|
||
<form id="task-form">
|
||
<h2 id="modal-title">Новая задача</h2>
|
||
<input type="hidden" id="edit-id">
|
||
<div class="form-group">
|
||
<label for="f-task">Задача *</label>
|
||
<input type="text" id="f-task" required placeholder="Описание задачи">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="f-person">Исполнитель *</label>
|
||
<input type="text" id="f-person" required placeholder="ФИО исполнителя">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="f-date">Срок (ДД.ММ.ГГГГ) *</label>
|
||
<input type="text" id="f-date" required placeholder="12.08.2026">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="f-priority">Приоритет</label>
|
||
<select id="f-priority">
|
||
<option value="Низкий">Низкий</option>
|
||
<option value="Средний" selected>Средний</option>
|
||
<option value="Высокий">Высокий</option>
|
||
<option value="Критичный">Критичный</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="f-status">Статус</label>
|
||
<select id="f-status">
|
||
<option value="Новая">Новая</option>
|
||
<option value="В работе">В работе</option>
|
||
<option value="На согласовании">На согласовании</option>
|
||
<option value="Готово">Готово</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-actions">
|
||
<button type="button" class="btn btn-secondary" id="btn-cancel">Отмена</button>
|
||
<button type="submit" class="btn btn-primary">Сохранить</button>
|
||
</div>
|
||
</form>
|
||
</dialog>
|
||
|
||
<script src="script.js"></script>
|
||
</body>
|
||
</html>
|