ttvtlb's picture
Xây dựng một hệ thống đầy đủ và hoàn chỉnh quản lý KPI, nhân viên có thể cập nhật KPI thực hiện hàng ngày, tổ trưởng cũng có thể cập nhật cho nhân viên trong tổ thống kê và xem trong tổ, admin quản lý tất cả bao gồm thống kê, xuất excel.
9092603 verified
document.addEventListener('DOMContentLoaded', function() {
let tasks = JSON.parse(localStorage.getItem('tasks')) || [
{ id: 1, title: 'Complete project proposal', dueDate: new Date().toISOString().split('T')[0], priority: 'high', completed: false },
{ id: 2, title: 'Review team documents', dueDate: new Date(Date.now() + 86400000).toISOString().split('T')[0], priority: 'medium', completed: false },
{ id: 3, title: 'Schedule meeting with client', dueDate: new Date(Date.now() - 86400000).toISOString().split('T')[0], priority: 'low', completed: true }
];
// Update KPI report
function updateKpiReport() {
document.getElementById('dailyKpi').shadowRoot.querySelector('kpi-report').updateStats(tasks);
}
// Add new task
document.addEventListener('task-added', (e) => {
const newTask = {
id: Date.now(),
...e.detail
};
tasks.push(newTask);
localStorage.setItem('tasks', JSON.stringify(tasks));
renderTasks();
updateKpiReport();
});
// Complete task
document.addEventListener('task-completed', (e) => {
const taskId = parseInt(e.detail.taskId);
tasks = tasks.map(task =>
task.id === taskId ? {...task, completed: !task.completed} : task
);
localStorage.setItem('tasks', JSON.stringify(tasks));
renderTasks();
updateKpiReport();
});
const documents = [
{ id: 1, title: 'Project Requirements', type: 'pdf', lastModified: '2023-06-01', size: '2.4 MB' },
{ id: 2, title: 'Meeting Notes', type: 'doc', lastModified: '2023-06-03', size: '1.1 MB' },
{ id: 3, title: 'Budget Plan', type: 'xls', lastModified: '2023-05-28', size: '3.7 MB' }
];
// Render tasks
const tasksContainer = document.getElementById('tasks-container');
tasks.forEach(task => {
const taskCard = document.createElement('custom-task-card');
taskCard.setAttribute('task-id', task.id);
taskCard.setAttribute('task-title', task.title);
taskCard.setAttribute('due-date', task.dueDate);
taskCard.setAttribute('priority', task.priority);
taskCard.setAttribute('completed', task.completed);
tasksContainer.appendChild(taskCard);
});
// Render documents
const documentsContainer = document.getElementById('documents-container');
documents.forEach(doc => {
const docCard = document.createElement('custom-document-card');
docCard.setAttribute('doc-id', doc.id);
docCard.setAttribute('doc-title', doc.title);
docCard.setAttribute('doc-type', doc.type);
docCard.setAttribute('last-modified', doc.lastModified);
docCard.setAttribute('size', doc.size);
documentsContainer.appendChild(docCard);
});
});