Spaces:
Configuration error
Configuration error
| <!doctype html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Nộp báo cáo công việc</title> | |
| <link rel="stylesheet" href="/css/document/document-create.css"> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"> | |
| </head> | |
| <body> | |
| <div class="bg-image"></div> | |
| <div class="layout"> | |
| <!-- SIDEBAR --> | |
| <!-- CONTENT --> | |
| <div class="container-layout"> | |
| <!-- HEADER --> | |
| <div class="container-header"> | |
| <h1>Nộp báo cáo công việc</h1> | |
| <p>Gửi báo cáo và chia sẻ cho phòng ban</p> | |
| </div> | |
| <main class="main-container"> | |
| <!-- FORM CARD --> | |
| <section class="dashboard-card"> | |
| <div class="card-header"> | |
| <h2>Gửi báo cáo</h2> | |
| </div> | |
| <div class="card-body"> | |
| <form method="post" action="/report/create" enctype="multipart/form-data"> | |
| <!-- Tiêu đề --> | |
| <div class="form-group"> | |
| <label>Tiêu đề báo cáo</label> | |
| <input type="text" name="title" placeholder="Nhập tiêu đề báo cáo..." required> | |
| </div> | |
| <!-- Nội dung --> | |
| <div class="form-group"> | |
| <label>Nội dung báo cáo</label> | |
| <textarea name="content" rows="5" placeholder="Nhập nội dung báo cáo..." | |
| required></textarea> | |
| </div> | |
| <!-- Phòng ban --> | |
| <div class="form-group"> | |
| <label>Phòng ban</label> | |
| <select name="departmentId" id="departmentSelect" required> | |
| <option value="" disabled selected>Chọn phòng ban</option> | |
| <option value="0">UNASSIGNED</option> | |
| <option value="1">SE</option> | |
| </select> | |
| </div> | |
| <!-- Người được xem --> | |
| <div class="form-group"> | |
| <label>Người được chia sẻ</label> | |
| <div id="userCheckboxes" class="checkbox-container"> | |
| <p class="placeholder-text">Chọn phòng ban trước</p> | |
| </div> | |
| </div> | |
| <!-- Upload file --> | |
| <div class="form-group"> | |
| <label>Tệp đính kèm</label> | |
| <input type="file" name="files" multiple> | |
| </div> | |
| <!-- Link --> | |
| <div class="form-group"> | |
| <label>Hoặc liên kết</label> | |
| <input type="url" name="link" placeholder="https://drive.google.com/..."> | |
| </div> | |
| <!-- BUTTON --> | |
| <div class="form-actions"> | |
| <button type="submit" class="btn-primary"> | |
| <i class="fa-regular fa-paper-plane"></i> | |
| Gửi báo cáo | |
| </button> | |
| <button type="reset" class="btn-secondary"> | |
| Reset | |
| </button> | |
| </div> | |
| </form> | |
| </div> | |
| </section> | |
| </main> | |
| <footer> | |
| <div class="footer-layout"> | |
| <div class="footer-left"> | |
| <h2 class="left-title">DXLab Attendance</h2> | |
| <div class="left-description"> | |
| Hệ thống điểm danh thông minh bằng nhận diện khuôn mặt, | |
| hỗ trợ quản lý sinh viên và giảng viên hiệu quả. | |
| </div> | |
| </div> | |
| <div class="footer-right"> | |
| <div class="right-title"> | |
| Thông tin liên hệ | |
| </div> | |
| <a href="#" class="right-description"> | |
| Liên hệ với chúng tôi | |
| </a> | |
| <a href="#" class="right-description"> | |
| Báo cáo lỗi | |
| </a> | |
| <a href="#" class="right-description"> | |
| Điều khoản sử dụng | |
| </a> | |
| </div> | |
| </div> | |
| <div class="footer-bottom"> | |
| © 2026 DXLab Attendance. All rights reserved. | |
| </div> | |
| </footer> | |
| </div> | |
| </div> | |
| <!-- FOOTER --> | |
| <!-- JS load user theo phòng --> | |
| <script> | |
| document.getElementById("departmentSelect").addEventListener("change", function () { | |
| const departmentId = this.value; | |
| fetch(`/api/report/users/by-department/${departmentId}`) | |
| .then(res => res.json()) | |
| .then(data => { | |
| const container = document.getElementById("userCheckboxes"); | |
| container.innerHTML = ""; | |
| if (data.length === 0) { | |
| container.innerHTML = "<p class='placeholder-text'>Không có người dùng trong phòng ban này</p>"; | |
| return; | |
| } | |
| data.forEach(user => { | |
| const label = document.createElement("label"); | |
| label.className = "checkbox-label"; | |
| const checkbox = document.createElement("input"); | |
| checkbox.type = "checkbox"; | |
| checkbox.name = "sharedUserIds"; | |
| checkbox.value = user.id; | |
| const span = document.createElement("span"); | |
| span.textContent = user.fullName; | |
| label.appendChild(checkbox); | |
| label.appendChild(span); | |
| container.appendChild(label); | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> |