Nearle_express/dailygrubs_console
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

overall updates

Browse Source
This commit is contained in:
joshikannan
2025-11-26 18:24:03 +05:30
parent 12df2e9dc4
commit e71e44319c
35 changed files with 3145 additions and 2404 deletions
Download Patch File Download Diff File Expand all files Collapse all files

212
src/pages/nearle/reports/riderLogs.js
View File

@@ -1,7 +1,209 @@
import React from 'react';
import * as React from 'react';
import { useState } from 'react';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
import { DatePicker } from '@mui/x-date-pickers/DatePicker';
import { useQuery } from '@tanstack/react-query';
// material-ui
import {
Divider,
Table,
TableBody,
TableCell,
TableContainer,
TableHead,
TableRow,
FormControl,
OutlinedInput,
InputAdornment,
Chip,
Stack
} from '@mui/material';
const riderLogs = () => {
return <div>riderLogs</div>;
};
import dayjs from 'dayjs';
var utc = require('dayjs/plugin/utc');
dayjs.extend(utc);
import { SearchOutlined, CloseOutlined } from '@ant-design/icons';
import Loader from 'components/Loader';
// project imports
import MainCard from 'components/MainCard';
import { Empty } from 'antd';
import TitleCard from '../titleCard';
import { fetchAppLocations, fetchRidersLogs } from '../api/api';
export default riderLogs;
function formatDate(dateString) {
const date = dayjs(dateString);
const formattedDate = date.format('DD-MM-YYYY ');
return formattedDate;
}
const formatTime = (timeString) =>
new Date('2024-01-01T' + timeString + 'Z').toLocaleTimeString('en-US', {
timeZone: 'UTC',
hour12: true,
hour: '2-digit',
minute: '2-digit'
});
// ==============================|| RidersLogs ||============================== //
export default function RidersLogs() {
const tenantid = localStorage.getItem('tenantid');
const [rowsPerPage, setRowsPerPage] = useState(10);
const [startdate, setStartdate] = useState(dayjs().format('YYYY-MM-DD'));
const [searchword, setSearchword] = useState('');
const [showClose, SetShowClose] = useState(false);
/* ============================================= || fetchRidersLogs| ============================================= */
const {
data: rows = [], // Default to empty array
isLoading: IsRiderLogsLoading,
isError: IsRiderLogsError,
error: RiderLogsError
} = useQuery({
queryKey: [tenantid, startdate], // Meaningful query key
queryFn: fetchRidersLogs,
enabled: !!tenantid && !!startdate, // Fetch only if appId & startdate exist
refetchInterval: 300000 // Auto-fetch every 5 minutes
});
React.useEffect(() => {
setRowsPerPage(rows?.length + 1);
}, [rows]);
{
IsRiderLogsError && console.log('RiderLogsError', RiderLogsError);
}
return (
<>
{IsRiderLogsLoading && <Loader />}
<TitleCard title="Riders Logs" />
<MainCard
content={false}
title={
<Stack display={'flex'} flexDirection={'row'} alignItems={'center'} justifyContent={'space-between'} flexWrap={'wrap'} gap={1}>
<Stack>
<FormControl sx={{ width: 250 }}>
<OutlinedInput
sx={{ background: 'white' }}
size="medium"
id="header-search"
startAdornment={
<InputAdornment position="start" sx={{ mr: -0.5 }}>
<SearchOutlined />
</InputAdornment>
}
endAdornment={
showClose && (
<InputAdornment position="end" sx={{ mr: -0.5 }}>
<CloseOutlined
onClick={() => {
setSearchword('');
SetShowClose(false);
}}
/>
</InputAdornment>
)
}
aria-describedby="header-search-text"
inputProps={{
'aria-label': 'weight'
}}
placeholder="Search"
value={searchword}
onChange={(e) => {
setSearchword(e.target.value);
if (e.target.value == '') {
SetShowClose(false);
} else {
SetShowClose(true);
}
}}
autoComplete="off"
/>
</FormControl>{' '}
</Stack>
<Stack flexDirection="row" alignItems="center" gap={2}>
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DatePicker
label="Choose Date"
value={dayjs(startdate)}
format="DD-MM-YYYY"
onChange={(e) => {
if (e) {
setStartdate(dayjs(e.$d).format('YYYY-MM-DD'));
}
}}
/>
</LocalizationProvider>
</Stack>
</Stack>
}
>
<TableContainer>
<Table>
<TableHead>
<TableRow>
<TableCell>S.No</TableCell>
<TableCell>ID</TableCell>
<TableCell>Rider</TableCell>
<TableCell>LogDate</TableCell>
<TableCell>Shift(HRS)</TableCell>
<TableCell>Login</TableCell>
<TableCell>Logout</TableCell>
<TableCell>WRK(HRS)</TableCell>
<TableCell>Shift(HRS)</TableCell>
<TableCell>BRK(HRS)</TableCell>
<TableCell>Status</TableCell>
</TableRow>
</TableHead>
<TableBody>
{rows.length == 0 ? (
<TableRow>
<TableCell colSpan={11}>
<Empty />
</TableCell>
</TableRow>
) : (
rows.map((row, index) => (
<TableRow key={index + 1}>
<TableCell align="left">{index + 1}</TableCell>
<TableCell align="left">{row.userid}</TableCell>
<TableCell align="left">{row.username}</TableCell>
<TableCell align="left">
{' '}
<Chip label={formatDate(row.logdate)} color="warning" variant="outlined" size="small" sx={{ bgcolor: '#fffde7' }} />
</TableCell>
<TableCell align="left">{row.shifthours}</TableCell>
<TableCell align="left">
{row.login != '' && (
<Chip label={formatTime(row.login)} color="info" variant="outlined" size="small" sx={{ bgcolor: '#e0f7fa' }} />
)}
</TableCell>
<TableCell align="left">
{row.logout != '' && (
<Chip label={formatTime(row.logout)} color="info" variant="outlined" size="small" sx={{ bgcolor: '#e0f7fa' }} />
)}
</TableCell>
<TableCell align="left">{row.workhours}</TableCell>
<TableCell align="left">{row.shorthours}</TableCell>
<TableCell align="left">{row.breakhours}</TableCell>
<TableCell align="left">
{row.logstatus == 0 ? (
<Chip label="Active" color="success" variant="outlined" size="small" sx={{ bgcolor: '#e8f5e9' }} />
) : (
<Chip label="Inactive" color="error" variant="outlined" size="small" sx={{ bgcolor: '#fce4ec' }} />
)}
</TableCell>
</TableRow>
))
)}
</TableBody>
</Table>
</TableContainer>
</MainCard>
</>
);
}