Merge pull request 'feat: add a date filter for master and maps' (#96) from feat/arm-master-filter into main

Reviewed-on: #96
This commit is contained in:
Ильназ 2025-03-17 20:36:28 +03:00
commit 066df51b58
7 changed files with 65 additions and 28 deletions

View File

@ -21,8 +21,16 @@ export const api = createApi({
}), }),
tagTypes: ['Masters', 'Orders'], tagTypes: ['Masters', 'Orders'],
endpoints: (builder) => ({ endpoints: (builder) => ({
getMasters: builder.query<Master[], void>({ getMasters: builder.query<Master[], { date: Date }>({
query: () => ({ url: '/arm/masters' }), query: ({ date }) => {
const startDate = dayjs(date).startOf('day').toISOString();
const endDate = dayjs(date).endOf('day').toISOString();
return {
url: '/arm/masters/list',
method: 'POST',
body: { startDate, endDate },
};
},
transformResponse: extractBodyFromResponse<Master[]>, transformResponse: extractBodyFromResponse<Master[]>,
providesTags: ['Masters'], providesTags: ['Masters'],
}), }),
@ -32,7 +40,7 @@ export const api = createApi({
method: 'PATCH', method: 'PATCH',
body: { status, notes, master }, body: { status, notes, master },
}), }),
invalidatesTags: ['Orders'], invalidatesTags: ['Orders', 'Masters'],
}), }),
getOrders: builder.query<OrderArm[], { date: Date }>({ getOrders: builder.query<OrderArm[], { date: Date }>({
query: ({ date }) => { query: ({ date }) => {
@ -54,14 +62,14 @@ export const api = createApi({
method: 'POST', method: 'POST',
body: master, body: master,
}), }),
invalidatesTags: ['Masters'], invalidatesTags: ['Masters', 'Orders'],
}), }),
deleteMaster: builder.mutation<void, { id: string }>({ deleteMaster: builder.mutation<void, { id: string }>({
query: ({ id }) => ({ query: ({ id }) => ({
url: `/arm/masters/${id}`, url: `/arm/masters/${id}`,
method: 'DELETE', method: 'DELETE',
}), }),
invalidatesTags: ['Masters'], invalidatesTags: ['Masters', 'Orders'],
}), }),
updateMaster: builder.mutation<void, UpdateMasterPayload>({ updateMaster: builder.mutation<void, UpdateMasterPayload>({
query: ({ id, name, phone }) => ({ query: ({ id, name, phone }) => ({
@ -69,7 +77,7 @@ export const api = createApi({
method: 'PATCH', method: 'PATCH',
body: { name, phone }, body: { name, phone },
}), }),
invalidatesTags: ['Masters'], invalidatesTags: ['Masters', 'Orders'],
}), }),
}), }),
}); });

View File

@ -3,7 +3,6 @@ import { FetchBaseQueryError } from '@reduxjs/toolkit/query';
import { BaseResponse } from '../../models/api'; import { BaseResponse } from '../../models/api';
export const extractBodyFromResponse = <Body>(response: BaseResponse<Body>) => { export const extractBodyFromResponse = <Body>(response: BaseResponse<Body>) => {
console.log('response', response);
if (response.success) { if (response.success) {
return response.body; return response.body;
} }

View File

@ -1,4 +1,4 @@
import { Box, Button, Heading, HStack, Divider, Flex } from '@chakra-ui/react'; import { Box, Button, Heading, HStack, Flex } from '@chakra-ui/react';
import React from 'react'; import React from 'react';
import { useLocation, Link } from 'react-router-dom'; import { useLocation, Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -30,7 +30,6 @@ const Header = () => {
{t('orders')} {t('orders')}
</Button> </Button>
)} )}
<Divider orientation='vertical' height='30px' />
{URLs.armMaster.isOn && ( {URLs.armMaster.isOn && (
<Button <Button
as={Link} as={Link}

View File

@ -1,11 +1,13 @@
import React, { useMemo } from 'react'; import React, { useState } from 'react';
import { Box, Flex, Heading, Spinner } from '@chakra-ui/react'; import { Box, Flex, Heading, Spinner } from '@chakra-ui/react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { YMaps, Map, Placemark } from '@pbe/react-yandex-maps'; import { YMaps, Map, Placemark } from '@pbe/react-yandex-maps';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
import dayjs from 'dayjs';
import { useGetOrdersQuery } from '../../__data__/service/api'; import { useGetOrdersQuery } from '../../__data__/service/api';
import getCoordinates from '../../utils/getCoordinates'; import getCoordinates from '../../utils/getCoordinates';
import DateNavigator from '../DateNavigator';
const OrdersMap = () => { const OrdersMap = () => {
const { t } = useTranslation('~', { const { t } = useTranslation('~', {
@ -14,14 +16,13 @@ const OrdersMap = () => {
const location = useLocation(); const location = useLocation();
const params = new URLSearchParams(location.search); const params = new URLSearchParams(location.search);
const latFromUrl = parseFloat(params.get('lat') || 55.78); const latFromUrl = parseFloat(params.get('lat') || '55.78');
const lonFromUrl = parseFloat(params.get('lon') || 49.12); const lonFromUrl = parseFloat(params.get('lon') || '49.12');
const currentDate = useMemo(
() => const [currentDate, setCurrentDate] = useState(
params.get('currentDate') params.get('currentDate')
? new Date(params.get('currentDate')) ? new Date(params.get('currentDate'))
: new Date(), : new Date(),
[],
); );
const { const {
@ -44,6 +45,18 @@ const OrdersMap = () => {
{t('title')} {t('title')}
</Heading> </Heading>
<DateNavigator
currentDate={currentDate}
onPreviousDate={() =>
setCurrentDate((prevDate) =>
dayjs(prevDate).subtract(1, 'day').toDate(),
)
}
onNextDate={() =>
setCurrentDate((prevDate) => dayjs(prevDate).add(1, 'day').toDate())
}
/>
{isLoading && ( {isLoading && (
<Flex justifyContent='center' alignItems='center'> <Flex justifyContent='center' alignItems='center'>
<Spinner size='lg' /> <Spinner size='lg' />

View File

@ -1,4 +1,4 @@
import React, { useEffect } from 'react'; import React, { useEffect, useState } from 'react';
import { import {
Box, Box,
Heading, Heading,
@ -15,11 +15,13 @@ import {
Spinner, Spinner,
} from '@chakra-ui/react'; } from '@chakra-ui/react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import dayjs from 'dayjs';
import MasterItem from '../MasterItem'; import MasterItem from '../MasterItem';
import MasterDrawer from '../MasterDrawer'; import MasterDrawer from '../MasterDrawer';
import { useGetMastersQuery } from '../../__data__/service/api'; import { useGetMastersQuery } from '../../__data__/service/api';
import useShowToast from '../../hooks/useShowToast'; import useShowToast from '../../hooks/useShowToast';
import DateNavigator from '../DateNavigator';
const TABLE_HEADERS = [ const TABLE_HEADERS = [
'name' as const, 'name' as const,
@ -31,12 +33,18 @@ const TABLE_HEADERS = [
const Masters = () => { const Masters = () => {
const { isOpen, onOpen, onClose } = useDisclosure(); const { isOpen, onOpen, onClose } = useDisclosure();
const showToast = useShowToast(); const showToast = useShowToast();
const [currentDate, setCurrentDate] = useState(new Date());
const { t } = useTranslation('~', { const { t } = useTranslation('~', {
keyPrefix: 'dry-wash.arm.master', keyPrefix: 'dry-wash.arm.master',
}); });
const { data: masters, error, isLoading, isSuccess } = useGetMastersQuery(); const {
data: masters,
error,
isLoading,
isSuccess,
} = useGetMastersQuery({ date: currentDate });
useEffect(() => { useEffect(() => {
if (error) { if (error) {
@ -46,12 +54,24 @@ const Masters = () => {
return ( return (
<Box p='8'> <Box p='8'>
<Flex justifyContent='space-between' alignItems='center' mb='5'> <Flex justifyContent='space-between' alignItems='baseline' mb='5'>
<Heading size='lg'> {t('title')}</Heading> <Heading size='lg'> {t('title')}</Heading>
<Button colorScheme='green' onClick={onOpen}> <Button colorScheme='green' onClick={onOpen}>
+ {t('add')} + {t('add')}
</Button> </Button>
</Flex> </Flex>
<DateNavigator
currentDate={currentDate}
onPreviousDate={() =>
setCurrentDate((prevDate) =>
dayjs(prevDate).subtract(1, 'day').toDate(),
)
}
onNextDate={() =>
setCurrentDate((prevDate) => dayjs(prevDate).add(1, 'day').toDate())
}
/>
<Table variant='simple' colorScheme='blackAlpha'> <Table variant='simple' colorScheme='blackAlpha'>
<Thead> <Thead>
<Tr> <Tr>

View File

@ -53,7 +53,7 @@ const Orders = () => {
isSuccess: isMastersSuccess, isSuccess: isMastersSuccess,
isError: isMastersError, isError: isMastersError,
error: mastersError, error: mastersError,
} = useGetMastersQuery(); } = useGetMastersQuery({ date: currentDate });
const isLoading = isOrdersLoading || isMastersLoading; const isLoading = isOrdersLoading || isMastersLoading;
const isSuccess = isOrdersSuccess && isMastersSuccess; const isSuccess = isOrdersSuccess && isMastersSuccess;

View File

@ -8,12 +8,12 @@ const commonError = { success: false, message: 'Что-то пошло не та
const sleep = const sleep =
(duration = 1000) => (duration = 1000) =>
(req, res, next) => (req, res, next) =>
setTimeout(next, duration); setTimeout(next, duration);
router.use(sleep()); router.use(sleep());
router.get('/arm/masters', (req, res) => { router.post('/arm/masters/list', (req, res) => {
res res
.status(/error/.test(STUBS.masters) ? 500 : 200) .status(/error/.test(STUBS.masters) ? 500 : 200)
.send( .send(
@ -108,9 +108,7 @@ router.post('/order/:orderId/upload-car-img', (req, res) => {
.send(require(`../json/landing-order-car-image-upload/${stubName}.json`)); .send(require(`../json/landing-order-car-image-upload/${stubName}.json`));
} catch (e) { } catch (e) {
console.error(e); console.error(e);
res res.status(500).send(commonError);
.status(500)
.send(commonError);
} }
}); });