Rename; Added EMS server; redis compose

2024-08-20 17:34:21 +09:00
parent 61339f4c26
commit 97b44a4db7
85 changed files with 2832 additions and 188 deletions
--- a/client/src/pages/Reports.tsx
+++ b/client/src/pages/Reports.tsx
@ -0,0 +1,126 @@
+import { Fragment, useEffect, useState } from "react"
+import { Autocomplete, Box, Button, CircularProgress, IconButton, TextField } from "@mui/material"
+import { DataGrid } from "@mui/x-data-grid"
+import { useCities, useReport, useReportExport } from "../hooks/swrHooks"
+import { useDebounce } from "@uidotdev/usehooks"
+import { ICity } from "../interfaces/fuel"
+import { Update } from "@mui/icons-material"
+import { mutate } from "swr"
+
+export default function Reports() {
+    const [download, setDownload] = useState(false)
+
+    const [search, setSearch] = useState<string | null>("")
+    const debouncedSearch = useDebounce(search, 500)
+    const [selectedOption, setSelectedOption] = useState<ICity | null>(null)
+    const { cities, isLoading } = useCities(10, 1, debouncedSearch)
+
+    const { report, isLoading: reportLoading } = useReport(selectedOption?.id)
+
+    const { reportExported } = useReportExport(selectedOption?.id, download)
+
+    const refreshReport = async () => {
+        mutate(`/info/reports/${selectedOption?.id}?to_export=false`)
+    }
+
+    useEffect(() => {
+        if (selectedOption && reportExported && download) {
+            const url = window.URL.createObjectURL(reportExported)
+            const link = document.createElement('a')
+            link.href = url
+            link.setAttribute('download', 'report.xlsx')
+            document.body.appendChild(link);
+            link.click();
+            link.remove();
+            setDownload(false)
+        }
+    }, [selectedOption, reportExported, download])
+
+    const exportReport = async () => {
+        setDownload(true)
+    }
+
+    return (
+        <>
+            <Box sx={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
+                <Box sx={{ display: 'flex', gap: '16px' }}>
+                    <Autocomplete
+                        fullWidth
+                        onInputChange={(_, value) => setSearch(value)}
+                        onChange={(_, value) => setSelectedOption(value)}
+                        isOptionEqualToValue={(option: ICity, value: ICity) => option.id === value.id}
+                        getOptionLabel={(option: ICity) => option.name ? option.name : ""}
+                        options={cities || []}
+                        loading={isLoading}
+                        value={selectedOption}
+                        renderInput={(params) => (
+                            <TextField
+                                {...params}
+                                size='small'
+                                label="Населенный пункт"
+                                InputProps={{
+                                    ...params.InputProps,
+                                    endAdornment: (
+                                        <Fragment>
+                                            {isLoading ? <CircularProgress color="inherit" size={20} /> : null}
+                                            {params.InputProps.endAdornment}
+                                        </Fragment>
+                                    )
+                                }}
+                            />
+                        )}
+                    />
+
+                    <IconButton onClick={() => refreshReport()}>
+                        <Update />
+                    </IconButton>
+
+                    <Button onClick={() => exportReport()}>
+                        Экспорт
+                    </Button>
+                </Box>
+
+                <DataGrid
+                    autoHeight
+                    style={{ width: "100%" }}
+                    loading={reportLoading}
+                    rows={
+                        report ?
+                            [...new Set(Object.keys(report).flatMap(key => Object.keys(report[key])))].map(id => {
+                                const row: any = { id: Number(id) };
+                                Object.keys(report).forEach(key => {
+                                    row[key] = report[key][id];
+                                });
+                                return row;
+                            })
+                            :
+                            []
+                    }
+                    columns={[
+                        { field: 'id', headerName: '№', width: 70 },
+                        ...Object.keys(report).map(key => ({
+                            field: key,
+                            headerName: key.charAt(0).toUpperCase() + key.slice(1),
+                            width: 150
+                        }))
+                    ]}
+                    initialState={{
+                        pagination: {
+                            paginationModel: { page: 0, pageSize: 10 },
+                        },
+                    }}
+                    pageSizeOptions={[10, 20, 50, 100]}
+                    checkboxSelection={false}
+                    disableRowSelectionOnClick
+
+                    processRowUpdate={(updatedRow) => {
+                        return updatedRow
+                    }}
+
+                    onProcessRowUpdateError={() => {
+                    }}
+                />
+            </Box>
+        </>
+    )
+}