Compare commits
No commits in common. "fd9bf9e5171187d37e50f0be1c5e853939ebece8" and "44132c351e06655313603053b0bdb8111a1fc551" have entirely different histories.
fd9bf9e517
...
44132c351e
|
|
@ -1709,145 +1709,3 @@ tr[data-vaid]:hover {
|
||||||
.va-action:hover {
|
.va-action:hover {
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* Accordion Styles */
|
|
||||||
.accordion {
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
background: var(--card-bg, #ffffff);
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion-header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: 1.25rem 1.5rem;
|
|
||||||
background: var(--primary-color, #4f46e5);
|
|
||||||
color: white;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion-header:hover {
|
|
||||||
background: var(--primary-dark, #4338ca);
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion-title {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 1rem;
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 1.1rem;
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion-icon {
|
|
||||||
transition: transform 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion.active .accordion-icon {
|
|
||||||
transform: rotate(180deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion-content {
|
|
||||||
max-height: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
transition: max-height 0.3s ease-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
.accordion.active .accordion-content {
|
|
||||||
max-height: 5000px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-wrapper {
|
|
||||||
overflow-x: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.data-table {
|
|
||||||
width: 100%;
|
|
||||||
border-collapse: collapse;
|
|
||||||
}
|
|
||||||
|
|
||||||
.data-table th {
|
|
||||||
background: var(--bg-secondary, #f8fafc);
|
|
||||||
padding: 1rem;
|
|
||||||
text-align: left;
|
|
||||||
font-weight: 600;
|
|
||||||
color: var(--text-primary, #1e293b);
|
|
||||||
border-bottom: 2px solid var(--border-color, #e2e8f0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.data-table td {
|
|
||||||
padding: 1rem;
|
|
||||||
border-bottom: 1px solid var(--border-color, #e2e8f0);
|
|
||||||
color: var(--text-primary, #1e293b);
|
|
||||||
}
|
|
||||||
|
|
||||||
.data-table tr:hover {
|
|
||||||
background: var(--hover-bg, #f1f5f9);
|
|
||||||
}
|
|
||||||
|
|
||||||
.no-data-row td {
|
|
||||||
text-align: center;
|
|
||||||
padding: 2rem;
|
|
||||||
color: var(--text-secondary, #64748b);
|
|
||||||
}
|
|
||||||
|
|
||||||
.time-badge {
|
|
||||||
background: var(--success-color, #10b981);
|
|
||||||
color: white;
|
|
||||||
padding: 0.25rem 0.75rem;
|
|
||||||
border-radius: 20px;
|
|
||||||
font-size: 0.875rem;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
.loading-spinner {
|
|
||||||
text-align: center;
|
|
||||||
padding: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.spinner {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
border: 4px solid var(--border-color, #e2e8f0);
|
|
||||||
border-top: 4px solid var(--primary-color, #4f46e5);
|
|
||||||
border-radius: 50%;
|
|
||||||
animation: spin 1s linear infinite;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes spin {
|
|
||||||
0% { transform: rotate(0deg); }
|
|
||||||
100% { transform: rotate(360deg); }
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-state {
|
|
||||||
text-align: center;
|
|
||||||
padding: 3rem;
|
|
||||||
color: var(--text-secondary, #64748b);
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-state i {
|
|
||||||
font-size: 3rem;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
color: var(--border-color, #e2e8f0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-state h3 {
|
|
||||||
margin-bottom: 0.5rem;
|
|
||||||
color: var(--text-primary, #1e293b);
|
|
||||||
}
|
|
||||||
|
|
||||||
.logs-count {
|
|
||||||
background: var(--primary-light, #c7d2fe);
|
|
||||||
color: var(--primary-color, #4f46e5);
|
|
||||||
padding: 0.125rem 0.5rem;
|
|
||||||
border-radius: 12px;
|
|
||||||
font-size: 0.75rem;
|
|
||||||
font-weight: 600;
|
|
||||||
margin-left: 0.5rem;
|
|
||||||
}
|
|
||||||
|
|
@ -1,5 +1,3 @@
|
||||||
import { VAModel, ClientModel, ProjectModel, WorkTrackModel } from "../../../models/vaModel.js";
|
|
||||||
|
|
||||||
async function clientDashboardGetVaLogsController(req, res) {
|
async function clientDashboardGetVaLogsController(req, res) {
|
||||||
try {
|
try {
|
||||||
const clientId = req.body.clientId;
|
const clientId = req.body.clientId;
|
||||||
|
|
@ -14,59 +12,95 @@ async function clientDashboardGetVaLogsController(req, res) {
|
||||||
return res.status(404).json({ success: false, message: "Virtual Assistant not found" });
|
return res.status(404).json({ success: false, message: "Virtual Assistant not found" });
|
||||||
}
|
}
|
||||||
|
|
||||||
// Get shared active projects
|
// Get the last 15 days
|
||||||
|
const endDate = new Date();
|
||||||
|
endDate.setHours(23, 59, 59, 999); // End of day
|
||||||
|
const startDate = new Date();
|
||||||
|
startDate.setDate(startDate.getDate() - 15);
|
||||||
|
startDate.setHours(0, 0, 0, 0); // Start of day
|
||||||
|
|
||||||
|
// Get shared projects
|
||||||
const sharedProjects = await ProjectModel.find({
|
const sharedProjects = await ProjectModel.find({
|
||||||
clientId: clientUser._id,
|
clientId: clientUser._id,
|
||||||
'vaAssigned.vaId': vaId,
|
'vaAssigned.vaId': vaId,
|
||||||
status: "ACTIVE"
|
status: "ACTIVE"
|
||||||
}).select('name');
|
}).select('name hourlyRate dedicatedHours vaWorkingScheduleStart vaWorkingScheduleEnd isFlexibleAllowed');
|
||||||
|
|
||||||
if (!sharedProjects || sharedProjects.length === 0) {
|
if (!sharedProjects || sharedProjects.length === 0) {
|
||||||
return res.status(200).json({
|
return res.status(200).json({
|
||||||
success: true,
|
success: true,
|
||||||
message: "No shared projects found",
|
message: "No shared projects found",
|
||||||
data: { projectLogs: [] }
|
data: {}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const projectLogs = {};
|
||||||
const projectIds = sharedProjects.map(p => p._id);
|
const projectIds = sharedProjects.map(p => p._id);
|
||||||
|
|
||||||
// Get work tracks for the last 15 days
|
// Get all work tracks for the last 15 days
|
||||||
const fifteenDaysAgo = new Date();
|
|
||||||
fifteenDaysAgo.setDate(fifteenDaysAgo.getDate() - 15);
|
|
||||||
|
|
||||||
// Get all work tracks
|
|
||||||
const workTracks = await WorkTrackModel.find({
|
const workTracks = await WorkTrackModel.find({
|
||||||
vaId: vaId,
|
vaId: vaId,
|
||||||
projectId: { $in: projectIds },
|
projectId: { $in: projectIds },
|
||||||
from: { $gte: fifteenDaysAgo }
|
from: { $gte: startDate },
|
||||||
|
to: { $lte: endDate }
|
||||||
})
|
})
|
||||||
.sort({ from: -1 })
|
.sort({ from: -1 })
|
||||||
.lean();
|
.lean();
|
||||||
|
|
||||||
// Build project logs array
|
// Process each project
|
||||||
const projectLogs = [];
|
for (const project of sharedProjects) {
|
||||||
let totalWorkTracks = 0;
|
const projectIdStr = project._id.toString();
|
||||||
let totalHours = 0;
|
|
||||||
|
|
||||||
sharedProjects.forEach(project => {
|
|
||||||
// Filter tracks for this project
|
// Filter tracks for this project
|
||||||
const projectTracks = workTracks.filter(track =>
|
const projectTracks = workTracks.filter(track =>
|
||||||
track.projectId.toString() === project._id.toString()
|
track.projectId.toString() === projectIdStr
|
||||||
);
|
);
|
||||||
|
|
||||||
// Only add project if it has tracks
|
// Group tracks by date
|
||||||
if (projectTracks.length > 0) {
|
const tracksByDate = {};
|
||||||
// Calculate project total hours
|
projectTracks.forEach(track => {
|
||||||
const projectTotalHours = projectTracks.reduce((sum, track) => sum + (track.totalTime || 0), 0);
|
const dateKey = new Date(track.from).toISOString().split('T')[0];
|
||||||
|
if (!tracksByDate[dateKey]) {
|
||||||
|
tracksByDate[dateKey] = [];
|
||||||
|
}
|
||||||
|
tracksByDate[dateKey].push(track);
|
||||||
|
});
|
||||||
|
|
||||||
projectLogs.push({
|
// Create daily logs for the last 15 days
|
||||||
projectDetails: {
|
const dailyLogs = {};
|
||||||
id: project._id,
|
let totalProjectHours = 0;
|
||||||
name: project.name,
|
let totalProjectTracks = 0;
|
||||||
hourlyRate: project.hourlyRate
|
|
||||||
},
|
// Generate dates for the last 15 days
|
||||||
workTrackLogs: projectTracks.map(track => ({
|
for (let i = 0; i < 15; i++) {
|
||||||
|
const date = new Date();
|
||||||
|
date.setDate(date.getDate() - i);
|
||||||
|
date.setHours(0, 0, 0, 0);
|
||||||
|
const dateStr = date.toISOString().split('T')[0];
|
||||||
|
|
||||||
|
const dayTracks = tracksByDate[dateStr] || [];
|
||||||
|
const totalTimeDay = dayTracks.reduce((sum, track) => sum + (track.totalTime || 0), 0);
|
||||||
|
|
||||||
|
// Calculate productive time vs idle time if logs are available
|
||||||
|
let productiveTime = 0;
|
||||||
|
let idleTime = 0;
|
||||||
|
|
||||||
|
if (dayTracks.length > 0) {
|
||||||
|
dayTracks.forEach(track => {
|
||||||
|
if (track.logs && Array.isArray(track.logs)) {
|
||||||
|
track.logs.forEach(log => {
|
||||||
|
if (log.status === 'productive' || log.status === 'working') {
|
||||||
|
productiveTime += log.duration || 0;
|
||||||
|
} else if (log.status === 'idle' || log.status === 'away') {
|
||||||
|
idleTime += log.duration || 0;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
dailyLogs[dateStr] = {
|
||||||
|
logs: dayTracks.map(track => ({
|
||||||
id: track._id,
|
id: track._id,
|
||||||
from: track.from,
|
from: track.from,
|
||||||
to: track.to,
|
to: track.to,
|
||||||
|
|
@ -74,44 +108,86 @@ async function clientDashboardGetVaLogsController(req, res) {
|
||||||
logs: track.logs || [],
|
logs: track.logs || [],
|
||||||
createdAt: track.createdAt,
|
createdAt: track.createdAt,
|
||||||
updatedAt: track.updatedAt
|
updatedAt: track.updatedAt
|
||||||
}))
|
})),
|
||||||
});
|
summary: {
|
||||||
|
totalTracks: dayTracks.length,
|
||||||
|
totalTime: totalTimeDay,
|
||||||
|
productiveTime: productiveTime,
|
||||||
|
idleTime: idleTime,
|
||||||
|
efficiency: totalTimeDay > 0 ? (productiveTime / totalTimeDay) * 100 : 0
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
totalWorkTracks += projectTracks.length;
|
totalProjectHours += totalTimeDay;
|
||||||
totalHours += projectTotalHours;
|
totalProjectTracks += dayTracks.length;
|
||||||
}
|
}
|
||||||
});
|
|
||||||
|
|
||||||
const response = {
|
projectLogs[projectIdStr] = {
|
||||||
success: true,
|
projectDetails: {
|
||||||
message: "VA logs retrieved successfully",
|
id: project._id,
|
||||||
data: {
|
name: project.name,
|
||||||
projectLogs: projectLogs
|
hourlyRate: project.hourlyRate,
|
||||||
}
|
schedule: {
|
||||||
};
|
start: project.vaWorkingScheduleStart,
|
||||||
|
end: project.vaWorkingScheduleEnd,
|
||||||
// Add summary if needed (optional)
|
isFlexibleAllowed: project.isFlexibleAllowed
|
||||||
if (projectLogs.length > 0) {
|
}
|
||||||
response.data.summary = {
|
},
|
||||||
totalProjects: projectLogs.length,
|
dailyLogs: dailyLogs,
|
||||||
totalWorkTracks: totalWorkTracks,
|
summary: {
|
||||||
totalHours: totalHours,
|
totalWorkTracks: totalProjectTracks,
|
||||||
dateRange: {
|
totalHours: totalProjectHours,
|
||||||
startDate: fifteenDaysAgo.toISOString().split('T')[0],
|
averageDailyHours: totalProjectHours / 15,
|
||||||
endDate: new Date().toISOString().split('T')[0]
|
daysWithActivity: Object.values(dailyLogs).filter(day => day.logs.length > 0).length,
|
||||||
|
lastActivity: projectTracks.length > 0
|
||||||
|
? new Date(projectTracks[0].from)
|
||||||
|
: null
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
return res.status(200).json(response);
|
// Calculate overall statistics
|
||||||
|
const allTracks = workTracks;
|
||||||
|
const totalHoursAllProjects = allTracks.reduce((sum, track) => sum + (track.totalTime || 0), 0);
|
||||||
|
|
||||||
|
return res.status(200).json({
|
||||||
|
success: true,
|
||||||
|
message: "VA logs retrieved successfully",
|
||||||
|
data: {
|
||||||
|
vaDetails: {
|
||||||
|
id: vaUser._id,
|
||||||
|
name: `${vaUser.userDetails?.firstName || ''} ${vaUser.userDetails?.lastName || ''}`.trim(),
|
||||||
|
email: vaUser.userDetails?.email,
|
||||||
|
status: vaUser.status,
|
||||||
|
schedule: vaUser.schedule
|
||||||
|
},
|
||||||
|
dateRange: {
|
||||||
|
startDate: startDate.toISOString().split('T')[0],
|
||||||
|
endDate: endDate.toISOString().split('T')[0],
|
||||||
|
days: 15
|
||||||
|
},
|
||||||
|
projectLogs: projectLogs,
|
||||||
|
summary: {
|
||||||
|
totalProjects: sharedProjects.length,
|
||||||
|
totalWorkTracks: allTracks.length,
|
||||||
|
totalHours: totalHoursAllProjects,
|
||||||
|
averageDailyHours: totalHoursAllProjects / 15,
|
||||||
|
projectsWithActivity: Object.values(projectLogs)
|
||||||
|
.filter(project => project.summary.totalWorkTracks > 0).length
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error fetching VA logs:', error);
|
console.error('Error fetching VA logs:', error);
|
||||||
return res.status(500).json({
|
return res.status(500).json({
|
||||||
success: false,
|
success: false,
|
||||||
message: 'Failed to load VA logs'
|
message: 'Failed to load VA logs',
|
||||||
|
error: process.env.NODE_ENV === 'development' ? error.message : undefined
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export { clientDashboardGetVaLogsController };
|
export {
|
||||||
|
clientDashboardGetVaLogsController
|
||||||
|
};
|
||||||
|
|
@ -9,6 +9,20 @@
|
||||||
<link rel="stylesheet" href="/public/css/dashboard.css">
|
<link rel="stylesheet" href="/public/css/dashboard.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.void-btn-a {
|
||||||
|
background: tomato;
|
||||||
|
text-decoration: none;
|
||||||
|
color: #ffffff !important;
|
||||||
|
border: none;
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: none;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<body class="dashboard-body">
|
<body class="dashboard-body">
|
||||||
<div id="root">
|
<div id="root">
|
||||||
<nav class="dashboard-header">
|
<nav class="dashboard-header">
|
||||||
|
|
@ -86,26 +100,34 @@
|
||||||
<!-- Virtual Assistants List -->
|
<!-- Virtual Assistants List -->
|
||||||
<div class="content-section">
|
<div class="content-section">
|
||||||
<div class="section-header" style="justify-content: space-between;align-items: center;">
|
<div class="section-header" style="justify-content: space-between;align-items: center;">
|
||||||
<a href="/client/virtual-assistants" class="btn btn-secondary">
|
<a href="/client/virtual-assistants" class="btn btn-secondary">Back</a>
|
||||||
<i class="fas fa-arrow-left"></i> Back to VAs
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="table-container">
|
||||||
<!-- Loading State -->
|
<div class="table-wrapper">
|
||||||
<div id="loadingState" class="loading-spinner">
|
<table class="data-table">
|
||||||
<div class="spinner"></div>
|
<thead>
|
||||||
<p>Loading VA logs...</p>
|
<tr>
|
||||||
|
<th>Title</th>
|
||||||
|
<th>App Name</th>
|
||||||
|
<th>Link</th>
|
||||||
|
<th>From</th>
|
||||||
|
<th>To</th>
|
||||||
|
<th>Total Time</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody id="vaLogsTableBody">
|
||||||
|
<!-- Data will be loaded here -->
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div id="vaEmptyTipState" style="display: none;">
|
||||||
|
<div class="empty-state">
|
||||||
|
<i class="fas fa-users"></i>
|
||||||
|
<h3>No Logs Found</h3>
|
||||||
|
<p>VA haven't logged any time yet.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Empty State -->
|
|
||||||
<div id="emptyState" class="empty-state" style="display: none;">
|
|
||||||
<i class="fas fa-clipboard-list"></i>
|
|
||||||
<h3>No Logs Found</h3>
|
|
||||||
<p>This virtual assistant hasn't logged any time in the last 15 days.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Projects Accordion Container -->
|
|
||||||
<div id="projectsContainer" style="display: none;"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
@ -214,270 +236,6 @@
|
||||||
document.body.style.overflow = 'auto';
|
document.body.style.overflow = 'auto';
|
||||||
}
|
}
|
||||||
|
|
||||||
function toggleAccordion(accordionId) {
|
|
||||||
const accordion = document.getElementById(accordionId);
|
|
||||||
accordion.classList.toggle('active');
|
|
||||||
|
|
||||||
// const allAccordions = document.querySelectorAll('.accordion');
|
|
||||||
// allAccordions.forEach(acc => {
|
|
||||||
// if (acc.id !== accordionId && acc.classList.contains('active')) {
|
|
||||||
// acc.classList.remove('active');
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatTime(seconds) {
|
|
||||||
if (!seconds) return '0m';
|
|
||||||
|
|
||||||
const hours = Math.floor(seconds / 3600);
|
|
||||||
const minutes = Math.floor((seconds % 3600) / 60);
|
|
||||||
|
|
||||||
if (hours > 0) {
|
|
||||||
return `${hours}h ${minutes}m`;
|
|
||||||
}
|
|
||||||
return `${minutes}m`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatDate(dateString) {
|
|
||||||
const date = new Date(dateString);
|
|
||||||
return date.toLocaleDateString('en-US', {
|
|
||||||
year: 'numeric',
|
|
||||||
month: 'short',
|
|
||||||
day: 'numeric'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatTimeOnly(dateString) {
|
|
||||||
const date = new Date(dateString);
|
|
||||||
return date.toLocaleTimeString('en-US', {
|
|
||||||
hour: '2-digit',
|
|
||||||
minute: '2-digit',
|
|
||||||
second: '2-digit'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function calculateTotalIndividualLogsHours(workTrackLogs) {
|
|
||||||
let total = 0;
|
|
||||||
workTrackLogs.forEach(workTrack => {
|
|
||||||
if (workTrack.logs && Array.isArray(workTrack.logs)) {
|
|
||||||
workTrack.logs.forEach(log => {
|
|
||||||
total += log.totalTime || 0;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return total;
|
|
||||||
}
|
|
||||||
|
|
||||||
function countIndividualLogs(workTrackLogs) {
|
|
||||||
let count = 0;
|
|
||||||
workTrackLogs.forEach(workTrack => {
|
|
||||||
if (workTrack.logs && Array.isArray(workTrack.logs)) {
|
|
||||||
count += workTrack.logs.length;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return count;
|
|
||||||
}
|
|
||||||
|
|
||||||
function calculateTotalHours(logs) {
|
|
||||||
return logs.reduce((total, log) => total + (log.totalTime || 0), 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create project accordion
|
|
||||||
function createProjectAccordion(projectData, index) {
|
|
||||||
const workTrackLogs = projectData.workTrackLogs || [];
|
|
||||||
const totalHours = calculateTotalIndividualLogsHours(workTrackLogs);
|
|
||||||
const individualLogsCount = countIndividualLogs(workTrackLogs);
|
|
||||||
const projectName = projectData.projectDetails?.name || `Project ${index + 1}`;
|
|
||||||
|
|
||||||
const accordionId = `project-${index}`;
|
|
||||||
|
|
||||||
return `
|
|
||||||
<div class="accordion" id="${accordionId}">
|
|
||||||
<div class="accordion-header" onclick="toggleAccordion('${accordionId}')">
|
|
||||||
<div class="accordion-title">
|
|
||||||
${projectName}
|
|
||||||
<span class="logs-count">${individualLogsCount} activities</span>
|
|
||||||
</div>
|
|
||||||
<div style="display: flex; align-items: center; gap: 1rem;">
|
|
||||||
<div style="text-align: right;">
|
|
||||||
<div class="time-badge">${formatTime(totalHours)}</div>
|
|
||||||
</div>
|
|
||||||
<i class="fas fa-chevron-down accordion-icon"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="accordion-content">
|
|
||||||
${individualLogsCount > 0 ? createIndividualLogsTable(workTrackLogs) : createNoLogsMessage()}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create table for individual log entries
|
|
||||||
function createIndividualLogsTable(workTrackLogs) {
|
|
||||||
// Collect all individual logs from all work tracks
|
|
||||||
const allIndividualLogs = [];
|
|
||||||
workTrackLogs.forEach(workTrack => {
|
|
||||||
if (workTrack.logs && Array.isArray(workTrack.logs)) {
|
|
||||||
workTrack.logs.forEach(log => {
|
|
||||||
allIndividualLogs.push(log);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return `
|
|
||||||
<div class="table-wrapper">
|
|
||||||
<table class="data-table">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Title</th>
|
|
||||||
<th>App Name</th>
|
|
||||||
<th>From</th>
|
|
||||||
<th>To</th>
|
|
||||||
<th>Total Time</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
${allIndividualLogs.map((log, index) => createIndividualLogRow(log, index)).join('')}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create a single row for individual log entry
|
|
||||||
function createIndividualLogRow(log, index) {
|
|
||||||
const title = log.title || `Activity ${index + 1}`;
|
|
||||||
const appName = log.appName || 'Unknown App';
|
|
||||||
|
|
||||||
// Parse dates
|
|
||||||
const fromDate = log.from;
|
|
||||||
const toDate = log.to || log.from;
|
|
||||||
|
|
||||||
// Calculate duration
|
|
||||||
let duration = log.totalTime || 0;
|
|
||||||
if (!duration && fromDate && toDate) {
|
|
||||||
const from = new Date(fromDate);
|
|
||||||
const to = new Date(toDate);
|
|
||||||
duration = Math.floor((to - from) / 1000);
|
|
||||||
}
|
|
||||||
|
|
||||||
return `
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<strong>${title}</strong>
|
|
||||||
</td>
|
|
||||||
<td>${appName}</td>
|
|
||||||
<td>
|
|
||||||
<div class="datetime-cell">
|
|
||||||
<div class="date-text">${formatDate(fromDate)}</div>
|
|
||||||
<div class="time-text">${formatTimeOnly(fromDate)}</div>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<div class="datetime-cell">
|
|
||||||
<div class="date-text">${formatDate(toDate)}</div>
|
|
||||||
<div class="time-text">${formatTimeOnly(toDate)}</div>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<span class="time-badge">${formatTime(duration)}</span>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create no logs message
|
|
||||||
function createNoLogsMessage() {
|
|
||||||
return `
|
|
||||||
<div style="text-align: center; padding: 2rem; color: #64748b;">
|
|
||||||
<i class="fas fa-clipboard"></i>
|
|
||||||
<h4>No Activity Logs</h4>
|
|
||||||
<p>No detailed activity logs available for this project.</p>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Load VA logs
|
|
||||||
async function loadVALogs() {
|
|
||||||
const loadingState = document.getElementById('loadingState');
|
|
||||||
const emptyState = document.getElementById('emptyState');
|
|
||||||
const projectsContainer = document.getElementById('projectsContainer');
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Get VA ID from URL
|
|
||||||
const urlParams = new URLSearchParams(window.location.search);
|
|
||||||
const vaId = urlParams.get('va');
|
|
||||||
|
|
||||||
if (!vaId) {
|
|
||||||
window.location.href = '/client/virtual-assistants';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Fetch VA logs data
|
|
||||||
const response = await fetchWithAuth(`${API_BASE}/vaLogsData/${vaId}`);
|
|
||||||
|
|
||||||
if (!response || !response.ok) {
|
|
||||||
throw new Error('Failed to load VA logs');
|
|
||||||
}
|
|
||||||
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
if (!data.success) {
|
|
||||||
throw new Error(data.message || 'Failed to load VA logs');
|
|
||||||
}
|
|
||||||
|
|
||||||
// Hide loading state
|
|
||||||
loadingState.style.display = 'none';
|
|
||||||
|
|
||||||
const projectLogs = data.data?.projectLogs || [];
|
|
||||||
|
|
||||||
// Handle empty state
|
|
||||||
if (projectLogs.length === 0) {
|
|
||||||
emptyState.style.display = 'block';
|
|
||||||
projectsContainer.style.display = 'none';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Show projects container
|
|
||||||
projectsContainer.style.display = 'block';
|
|
||||||
emptyState.style.display = 'none';
|
|
||||||
|
|
||||||
// Create accordions for each project
|
|
||||||
let accordionsHTML = '';
|
|
||||||
projectLogs.forEach((project, index) => {
|
|
||||||
accordionsHTML += createProjectAccordion(project, index);
|
|
||||||
});
|
|
||||||
|
|
||||||
projectsContainer.innerHTML = accordionsHTML;
|
|
||||||
|
|
||||||
// Auto-open first accordion
|
|
||||||
if (projectLogs.length > 0) {
|
|
||||||
setTimeout(() => {
|
|
||||||
const firstAccordion = document.getElementById('project-0');
|
|
||||||
if (firstAccordion) {
|
|
||||||
firstAccordion.classList.add('active');
|
|
||||||
}
|
|
||||||
}, 100);
|
|
||||||
}
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
console.error("Error loading VA logs:", error);
|
|
||||||
loadingState.style.display = 'none';
|
|
||||||
projectsContainer.style.display = 'none';
|
|
||||||
|
|
||||||
// Show error in empty state
|
|
||||||
emptyState.innerHTML = `
|
|
||||||
<i class="fas fa-exclamation-triangle"></i>
|
|
||||||
<h3>Error Loading Data</h3>
|
|
||||||
<p>${error.message}</p>
|
|
||||||
<button onclick="loadVALogs()" class="btn btn-primary" style="margin-top: 1rem;">
|
|
||||||
<i class="fas fa-redo"></i> Retry
|
|
||||||
</button>
|
|
||||||
`;
|
|
||||||
emptyState.style.display = 'block';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
|
||||||
// Mobile menu toggle
|
// Mobile menu toggle
|
||||||
|
|
@ -505,11 +263,69 @@
|
||||||
|
|
||||||
// Confirm logout button
|
// Confirm logout button
|
||||||
document.getElementById('confirmLogoutBtn').addEventListener('click', handleLogout);
|
document.getElementById('confirmLogoutBtn').addEventListener('click', handleLogout);
|
||||||
|
|
||||||
// Load VA logs on page load
|
|
||||||
loadVALogs();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// ------------------------------
|
||||||
|
// TIP FORM SUBMISSION HANDLER
|
||||||
|
// ------------------------------
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
// Load VAs for tip selection
|
||||||
|
async function loadVAsLogs() {
|
||||||
|
try {
|
||||||
|
let vaId = new URLSearchParams(window.location.search).get('va');
|
||||||
|
const response = await fetchWithAuth(`${API_BASE}/vaLogsData${vaId ? `/${vaId}` : ''}`);
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
console.error("Failed to load VAs:", data.message);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
console.log("VA Logs Data:", data);
|
||||||
|
|
||||||
|
// const vaSelect = document.getElementById('vaTipTableBody');
|
||||||
|
// data.data.forEach(tip => {
|
||||||
|
// const row = document.createElement('tr');
|
||||||
|
// const cellVoid = document.createElement('td');
|
||||||
|
// const cellStatus = document.createElement('td');
|
||||||
|
// const cellName = document.createElement('td');
|
||||||
|
// const cellDescription = document.createElement('td');
|
||||||
|
// const cellDate = document.createElement('td');
|
||||||
|
// const cellAmount = document.createElement('td');
|
||||||
|
|
||||||
|
// cellVoid.innerHTML = `<button id='voidBtn' class='void-btn-a' data-id='${tip._id}'>Void</button>`;
|
||||||
|
// cellVoid.classList.add('void-btn');
|
||||||
|
|
||||||
|
// cellStatus.textContent = tip.status;
|
||||||
|
// cellName.textContent = tip.vaName;
|
||||||
|
// cellDescription.textContent = tip.description;
|
||||||
|
// cellDate.textContent = tip.createdAt ? new Date(tip.createdAt).toLocaleDateString() : '';
|
||||||
|
// cellAmount.textContent = `$${parseFloat(tip.amount).toFixed(2)}`;
|
||||||
|
|
||||||
|
// row.appendChild(cellVoid);
|
||||||
|
// row.appendChild(cellStatus);
|
||||||
|
// row.appendChild(cellName);
|
||||||
|
// row.appendChild(cellDescription);
|
||||||
|
// row.appendChild(cellDate);
|
||||||
|
// row.appendChild(cellAmount);
|
||||||
|
|
||||||
|
// vaSelect.appendChild(row);
|
||||||
|
// });
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
console.error("Error loading VAs:", error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
loadVAsLogs();
|
||||||
|
|
||||||
|
setInterval(loadVAsLogs, 30000);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue