| @@ -1,25 +1,22 @@ | |||||
| import { | import { | ||||
| Box, | Box, | ||||
| Button, | |||||
| Grid, | Grid, | ||||
| Stack, | |||||
| Table, | Table, | ||||
| TableBody, | TableBody, | ||||
| TableCell, | TableCell, | ||||
| TableContainer, | TableContainer, | ||||
| TableHead, | |||||
| TablePagination, | TablePagination, | ||||
| TableRow, | TableRow, | ||||
| TextField, | |||||
| Typography, | Typography, | ||||
| } from "@mui/material"; | } from "@mui/material"; | ||||
| import { Dictionary } from "@types"; | |||||
| import { | import { | ||||
| UseSummary, | UseSummary, | ||||
| getUseSummaries, | getUseSummaries, | ||||
| getUseSummaryYYYYMMs, | getUseSummaryYYYYMMs, | ||||
| } from "api/custom/hello-techno/use-summary"; | } from "api/custom/hello-techno/use-summary"; | ||||
| import { PageID, TabID } from "codes/page"; | import { PageID, TabID } from "codes/page"; | ||||
| import { FormProvider, RHFTextField } from "components/hook-form"; | |||||
| import { FormProvider } from "components/hook-form"; | |||||
| import RHFSelect, { SelectOptionProps } from "components/hook-form/RHFSelect"; | import RHFSelect, { SelectOptionProps } from "components/hook-form/RHFSelect"; | ||||
| import { TableHeadCustom } from "components/table"; | import { TableHeadCustom } from "components/table"; | ||||
| import { SearchConditionContextProvider } from "contexts/SearchConditionContext"; | import { SearchConditionContextProvider } from "contexts/SearchConditionContext"; | ||||
| @@ -30,9 +27,7 @@ import useSearchConditionContext from "hooks/useSearchConditionContext"; | |||||
| import useTable, { UseTableReturn } from "hooks/useTable"; | import useTable, { UseTableReturn } from "hooks/useTable"; | ||||
| import { useEffect, useMemo, useState } from "react"; | import { useEffect, useMemo, useState } from "react"; | ||||
| import { useForm } from "react-hook-form"; | import { useForm } from "react-hook-form"; | ||||
| import { getPath } from "routes/path"; | |||||
| import { sprintf } from "sprintf-js"; | import { sprintf } from "sprintf-js"; | ||||
| import { formatYYYYMMStr, now } from "utils/datetime"; | |||||
| export default function UseSummaryList() { | export default function UseSummaryList() { | ||||
| const { setHeaderTitle, setTabs } = useDashboard( | const { setHeaderTitle, setTabs } = useDashboard( | ||||
| @@ -99,6 +94,19 @@ function SearchBox({ table }: CommonProps) { | |||||
| }); | }); | ||||
| }, [yyyymm]); | }, [yyyymm]); | ||||
| const downloadCsvUrl = useMemo(() => { | |||||
| if (!selectedYYYYMM) return ""; | |||||
| const param = new URLSearchParams({ | |||||
| summary_yyyymm: selectedYYYYMM, | |||||
| }); | |||||
| return ( | |||||
| process.env.REACT_APP_HOST_API_KEY + | |||||
| "/custom/hello-techno/use-summary/csv?" + | |||||
| param.toString() | |||||
| ); | |||||
| }, [selectedYYYYMM]); | |||||
| const { callAPI: callGetUseSummaryYYYYMMs } = useAPICall({ | const { callAPI: callGetUseSummaryYYYYMMs } = useAPICall({ | ||||
| apiMethod: getUseSummaryYYYYMMs, | apiMethod: getUseSummaryYYYYMMs, | ||||
| onSuccess: ({ data: { records } }) => { | onSuccess: ({ data: { records } }) => { | ||||
| @@ -180,6 +188,14 @@ function SearchBox({ table }: CommonProps) { | |||||
| size="small" | size="small" | ||||
| /> | /> | ||||
| </Grid> | </Grid> | ||||
| {!!selectedYYYYMM && ( | |||||
| <Grid item xs={3} lg={2}> | |||||
| <Typography>CSV</Typography> | |||||
| <Button variant="contained" color="info" href={downloadCsvUrl}> | |||||
| ダウンロード | |||||
| </Button> | |||||
| </Grid> | |||||
| )} | |||||
| </Grid> | </Grid> | ||||
| </Box> | </Box> | ||||
| </FormProvider> | </FormProvider> | ||||