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:
commit
066df51b58
@ -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'],
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
|
@ -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;
|
||||||
}
|
}
|
||||||
|
@ -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}
|
||||||
|
@ -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' />
|
||||||
|
@ -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>
|
||||||
|
@ -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;
|
||||||
|
@ -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);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user