Update
This commit is contained in:
@@ -94,6 +94,8 @@ export default function Table<T>({
|
||||
selected,
|
||||
openRowId, // Receive the currently opened row ID
|
||||
setOpenRowId, // Receive the function to set the opened row ID
|
||||
dialogIDRow,
|
||||
setDialogIDRow,
|
||||
reloadData,
|
||||
}: TableListProps<T>) {
|
||||
/* ------------------------------- handle sort ------------------------------ */
|
||||
@@ -249,7 +251,8 @@ const allowedStatusesForCSLMS = ['waiting_pharmacy', 'order_prepared', 'ready',
|
||||
|
||||
|
||||
const [openDialogStatus, setOpenDialogStatus] = useState(false);
|
||||
const [dialogIDRow, setDialogIDRow] = useState<number | null>(null);
|
||||
// const [dialogIDRow, setDialogIDRow] = useState<number | null>(null);
|
||||
console.log(dialogIDRow);
|
||||
const [dialogIDRowDriver, setDialogIDRowDriver] = useState<number | null>(null);
|
||||
const [txtStatusDriver, setTxtStatusDriver] = useState('');
|
||||
const [txtIDDriver, setTxtIDDriver] = useState('');
|
||||
@@ -565,11 +568,87 @@ const allowedStatusesForCSLMS = ['waiting_pharmacy', 'order_prepared', 'ready',
|
||||
</TableCell>
|
||||
))}
|
||||
</TableRow>
|
||||
{/* Dialog Update Status */}
|
||||
<Dialog open={dialogIDRow === row.id} fullWidth={true}>
|
||||
<DialogTitle sx={{ backgroundColor: '#19BBBB', color: '#FFF', padding: 2 }}>
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between">
|
||||
<Stack direction="row" alignItems='center' spacing={1}>
|
||||
<Typography variant="h6">{localeData.txtConfirmation}</Typography>
|
||||
</Stack>
|
||||
<IconButton sx={{ color: '#FFF' }} onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
</Stack>
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2} padding={2}>
|
||||
<Typography variant='body1'>{localeData.txtDialogConfirmation}</Typography>
|
||||
<Card sx={{padding:2}} >
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '50%'}}>{localeData.txtNomorResep}</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '50%'}}>{row.no_resep}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '50%'}}>{localeData.txtTanggalTerbitResep}</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '50%'}}>{row.tanggal}</Typography>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button sx={{backgroundColor: '#19BBBB'}} variant="contained" onClick={() => handleClickKonfirmasi(row)} disabled={isDisabled}>{localeData.txtOK}</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
{/* Modal for fullscreen display */}
|
||||
<Modal open={dialogIDRowDriver === row.id} onClose={() => handleClose(row)}>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100vh',
|
||||
// backgroundColor: 'rgba(0, 0, 0, 0.8)', // semi-transparent background
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
}}
|
||||
>
|
||||
{loading ? (
|
||||
<>
|
||||
<CircularProgress color="inherit" />
|
||||
<Typography variant="h6" sx={{ mt: 2 }}>
|
||||
{localeData.txtFindingDriver}
|
||||
</Typography>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Typography variant="h4">Info!</Typography>
|
||||
<Typography variant="h6" sx={{ mt: 2 }}>
|
||||
{txtIDDriver ? (
|
||||
`${localeData.txtDriverFound} ${txtIDDriver} status ${txtStatusDriver}.`
|
||||
) : (
|
||||
// You can add an alternative UI or message here, or leave it empty
|
||||
`Failed to get driver, please check the message info.`
|
||||
)}
|
||||
|
||||
|
||||
</Typography>
|
||||
<Button
|
||||
sx={{ mt: 4, backgroundColor: '#19BBBB' }}
|
||||
variant="contained"
|
||||
onClick={() => handleClose(row)}
|
||||
>
|
||||
{localeData.txtOK}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
</Modal>
|
||||
{/* COLLAPSIBLE ROW */}
|
||||
<TableRow
|
||||
sx={{ cursor: 'pointer' }} // Use pointer cursor always, or conditionally based on your preference
|
||||
>
|
||||
<TableCell colSpan={6}>
|
||||
<TableCell colSpan={7}>
|
||||
<Collapse in={openRowId === row.id} timeout="auto" unmountOnExit>
|
||||
<Card sx={{padding:2}}>
|
||||
{/* Icon inside a Box for spacing and alignment */}
|
||||
@@ -724,12 +803,17 @@ const allowedStatusesForCSLMS = ['waiting_pharmacy', 'order_prepared', 'ready',
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.pengiriman}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTotal} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.total_kirim}</strong></Typography>
|
||||
</Grid>
|
||||
{formattedRoleName === 'cs-lms' ? (
|
||||
<>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTotal} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.total_kirim}</strong></Typography>
|
||||
</Grid>
|
||||
</>
|
||||
):''}
|
||||
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
@@ -842,7 +926,7 @@ const allowedStatusesForCSLMS = ['waiting_pharmacy', 'order_prepared', 'ready',
|
||||
{localeData.txtButtonClose}
|
||||
</Button>
|
||||
{/* Accept Button on the Right */}
|
||||
{row.button_accept && formattedRoleName === 'admin-apotek' && allowedStatusesForApotek.includes(row.sStatus) ? (
|
||||
{/* {row.button_accept && formattedRoleName === 'admin-apotek' && allowedStatusesForApotek.includes(row.sStatus) ? (
|
||||
<Button variant="contained" color="primary" onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
{row.button_accept}
|
||||
</Button>
|
||||
@@ -851,87 +935,13 @@ const allowedStatusesForCSLMS = ['waiting_pharmacy', 'order_prepared', 'ready',
|
||||
<Button variant="contained" color="primary" onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
{row.button_accept}
|
||||
</Button>
|
||||
) : ''}
|
||||
) : ''} */}
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
{/* Dialog Update Status */}
|
||||
<Dialog open={dialogIDRow === row.id} fullWidth={true}>
|
||||
<DialogTitle sx={{ backgroundColor: '#19BBBB', color: '#FFF', padding: 2 }}>
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between">
|
||||
<Stack direction="row" alignItems='center' spacing={1}>
|
||||
<Typography variant="h6">{localeData.txtConfirmation}</Typography>
|
||||
</Stack>
|
||||
<IconButton sx={{ color: '#FFF' }} onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
</Stack>
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2} padding={2}>
|
||||
<Typography variant='body1'>{localeData.txtDialogConfirmation}</Typography>
|
||||
<Card sx={{padding:2}} >
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '50%'}}>{localeData.txtNomorResep}</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '50%'}}>{row.no_resep}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '50%'}}>{localeData.txtTanggalTerbitResep}</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '50%'}}>{row.tanggal}</Typography>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button sx={{backgroundColor: '#19BBBB'}} variant="contained" onClick={() => handleClickKonfirmasi(row)} disabled={isDisabled}>{localeData.txtOK}</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
{/* Modal for fullscreen display */}
|
||||
<Modal open={dialogIDRowDriver === row.id} onClose={() => handleClose(row)}>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100vh',
|
||||
// backgroundColor: 'rgba(0, 0, 0, 0.8)', // semi-transparent background
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
}}
|
||||
>
|
||||
{loading ? (
|
||||
<>
|
||||
<CircularProgress color="inherit" />
|
||||
<Typography variant="h6" sx={{ mt: 2 }}>
|
||||
{localeData.txtFindingDriver}
|
||||
</Typography>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Typography variant="h4">Info!</Typography>
|
||||
<Typography variant="h6" sx={{ mt: 2 }}>
|
||||
{txtIDDriver ? (
|
||||
`${localeData.txtDriverFound} ${txtIDDriver} status ${txtStatusDriver}.`
|
||||
) : (
|
||||
// You can add an alternative UI or message here, or leave it empty
|
||||
`Failed to get driver, please check the message info.`
|
||||
)}
|
||||
{/* Dialog Update Status confirmation */}
|
||||
|
||||
|
||||
</Typography>
|
||||
<Button
|
||||
sx={{ mt: 4, backgroundColor: '#19BBBB' }}
|
||||
variant="contained"
|
||||
onClick={() => handleClose(row)}
|
||||
>
|
||||
{localeData.txtOK}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
</Modal>
|
||||
</Card>
|
||||
</Collapse>
|
||||
</TableCell>
|
||||
|
||||
@@ -125,11 +125,11 @@
|
||||
"txtTinggi" : "Tinggi / Berat",
|
||||
"txtLabelNew": "Baru",
|
||||
"txtLabelAccepted": "Diterima Apotek",
|
||||
"txtLabelReady": "Pesanan Siap Diambil",
|
||||
"txtLabelReady": "Siap Diambil",
|
||||
"txtLabelWaitingCourir": "Menunggu Kurir",
|
||||
"txtLabelPackagePickedUp": "Paket Sudah Diambil",
|
||||
"txtLabelPackageOnDelivery": "Sedang Diantar ke Alamat Tujuan",
|
||||
"txtLabelPackageDelivered": "Sudah diterima Pasien",
|
||||
"txtLabelPackagePickedUp": "Sudah Diambil",
|
||||
"txtLabelPackageOnDelivery": "Sedang Diantar",
|
||||
"txtLabelPackageDelivered": "Diterima Pasien",
|
||||
"txtLabelWaitingForPayment": "Menunggu Pembayaran",
|
||||
"txtOK": "Ya",
|
||||
"txtFindingDriver" : "Sedang mencari driver...",
|
||||
|
||||
@@ -30,11 +30,18 @@ import MuiDialog from '@/components/MuiDialog';
|
||||
import DialogMember from '@/sections/dashboard/DialogMember';
|
||||
import DialogClaimSubmit from '@/sections/dashboard/DialogClaimSubmit';
|
||||
import { fPostFormat } from '@/utils/formatTime';
|
||||
import useAuth from '@/hooks/useAuth';
|
||||
|
||||
export default function TableList() {
|
||||
const navigate = useNavigate();
|
||||
const { localeData }: any = useContext(LanguageContext);
|
||||
|
||||
const {user} = useAuth();
|
||||
const formattedRoleName = user?.role.name;
|
||||
// List of statuses for 'apotek'
|
||||
const allowedStatusesForApotek = ['waiting_pharmacy', 'order_prepared'];
|
||||
const allowedStatusesForCSLMS = ['waiting_pharmacy', 'order_prepared', 'ready', 'waiting_for_courir', 'package_picked_up', 'package_on_delivery', 'failed'];
|
||||
|
||||
const [data, setData] = useState([]);
|
||||
|
||||
// Download Resep
|
||||
@@ -288,6 +295,13 @@ export default function TableList() {
|
||||
label: localeData.txtStatus,
|
||||
isSort: true,
|
||||
},
|
||||
// Conditionally include button_accept if the role is 'admin-apotek'
|
||||
...(formattedRoleName === 'admin-apotek' ? [{
|
||||
id: 'button_accept',
|
||||
align: 'left',
|
||||
label: localeData.txtConfirmation,
|
||||
isSort: false,
|
||||
}] : []),
|
||||
{
|
||||
id: 'action',
|
||||
align: 'right',
|
||||
@@ -301,6 +315,7 @@ export default function TableList() {
|
||||
getData();
|
||||
}, [appliedParams, searchParams, order, orderBy, setSearchParams]);
|
||||
const [openRowId, setOpenRowId] = useState<number | null>(null);
|
||||
const [dialogIDRow, setDialogIDRow] = useState<number | null>(null);
|
||||
function getData()
|
||||
{
|
||||
(async () => {
|
||||
@@ -372,6 +387,18 @@ export default function TableList() {
|
||||
{obj.valid_tanggal ? fDateTime(obj.valid_tanggal) : ''}
|
||||
</Label>
|
||||
,
|
||||
...(formattedRoleName === 'admin-apotek' && obj.button_accept && {
|
||||
button_accept: (
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{ width: 'auto' }}
|
||||
onClick={() => setDialogIDRow(obj.id === dialogIDRow ? null : obj.id)}
|
||||
>
|
||||
{obj.button_accept}
|
||||
</Button>
|
||||
),
|
||||
}),
|
||||
action:
|
||||
<TableMoreMenu actions={
|
||||
<>
|
||||
@@ -433,6 +460,8 @@ export default function TableList() {
|
||||
// filterEndDate={filterEndDate}
|
||||
openRowId={openRowId} // Pass the currently opened row ID
|
||||
setOpenRowId={setOpenRowId} // Pass the function to set the opened row ID
|
||||
dialogIDRow={dialogIDRow}
|
||||
setDialogIDRow={setDialogIDRow}
|
||||
reloadData={getData}
|
||||
/>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user