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'],
 | 
			
		||||
  endpoints: (builder) => ({
 | 
			
		||||
    getMasters: builder.query<Master[], void>({
 | 
			
		||||
      query: () => ({ url: '/arm/masters' }),
 | 
			
		||||
    getMasters: builder.query<Master[], { date: Date }>({
 | 
			
		||||
      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[]>,
 | 
			
		||||
      providesTags: ['Masters'],
 | 
			
		||||
    }),
 | 
			
		||||
@ -32,7 +40,7 @@ export const api = createApi({
 | 
			
		||||
        method: 'PATCH',
 | 
			
		||||
        body: { status, notes, master },
 | 
			
		||||
      }),
 | 
			
		||||
      invalidatesTags: ['Orders'],
 | 
			
		||||
      invalidatesTags: ['Orders', 'Masters'],
 | 
			
		||||
    }),
 | 
			
		||||
    getOrders: builder.query<OrderArm[], { date: Date }>({
 | 
			
		||||
      query: ({ date }) => {
 | 
			
		||||
@ -54,14 +62,14 @@ export const api = createApi({
 | 
			
		||||
        method: 'POST',
 | 
			
		||||
        body: master,
 | 
			
		||||
      }),
 | 
			
		||||
      invalidatesTags: ['Masters'],
 | 
			
		||||
      invalidatesTags: ['Masters', 'Orders'],
 | 
			
		||||
    }),
 | 
			
		||||
    deleteMaster: builder.mutation<void, { id: string }>({
 | 
			
		||||
      query: ({ id }) => ({
 | 
			
		||||
        url: `/arm/masters/${id}`,
 | 
			
		||||
        method: 'DELETE',
 | 
			
		||||
      }),
 | 
			
		||||
      invalidatesTags: ['Masters'],
 | 
			
		||||
      invalidatesTags: ['Masters', 'Orders'],
 | 
			
		||||
    }),
 | 
			
		||||
    updateMaster: builder.mutation<void, UpdateMasterPayload>({
 | 
			
		||||
      query: ({ id, name, phone }) => ({
 | 
			
		||||
@ -69,7 +77,7 @@ export const api = createApi({
 | 
			
		||||
        method: 'PATCH',
 | 
			
		||||
        body: { name, phone },
 | 
			
		||||
      }),
 | 
			
		||||
      invalidatesTags: ['Masters'],
 | 
			
		||||
      invalidatesTags: ['Masters', 'Orders'],
 | 
			
		||||
    }),
 | 
			
		||||
  }),
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
@ -3,7 +3,6 @@ import { FetchBaseQueryError } from '@reduxjs/toolkit/query';
 | 
			
		||||
import { BaseResponse } from '../../models/api';
 | 
			
		||||
 | 
			
		||||
export const extractBodyFromResponse = <Body>(response: BaseResponse<Body>) => {
 | 
			
		||||
  console.log('response', response);
 | 
			
		||||
  if (response.success) {
 | 
			
		||||
    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 { useLocation, Link } from 'react-router-dom';
 | 
			
		||||
import { useTranslation } from 'react-i18next';
 | 
			
		||||
@ -30,7 +30,6 @@ const Header = () => {
 | 
			
		||||
              {t('orders')}
 | 
			
		||||
            </Button>
 | 
			
		||||
          )}
 | 
			
		||||
          <Divider orientation='vertical' height='30px' />
 | 
			
		||||
          {URLs.armMaster.isOn && (
 | 
			
		||||
            <Button
 | 
			
		||||
              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 { useTranslation } from 'react-i18next';
 | 
			
		||||
import { YMaps, Map, Placemark } from '@pbe/react-yandex-maps';
 | 
			
		||||
import { useLocation } from 'react-router-dom';
 | 
			
		||||
import dayjs from 'dayjs';
 | 
			
		||||
 | 
			
		||||
import { useGetOrdersQuery } from '../../__data__/service/api';
 | 
			
		||||
import getCoordinates from '../../utils/getCoordinates';
 | 
			
		||||
import DateNavigator from '../DateNavigator';
 | 
			
		||||
 | 
			
		||||
const OrdersMap = () => {
 | 
			
		||||
  const { t } = useTranslation('~', {
 | 
			
		||||
@ -14,14 +16,13 @@ const OrdersMap = () => {
 | 
			
		||||
 | 
			
		||||
  const location = useLocation();
 | 
			
		||||
  const params = new URLSearchParams(location.search);
 | 
			
		||||
  const latFromUrl = parseFloat(params.get('lat') || 55.78);
 | 
			
		||||
  const lonFromUrl = parseFloat(params.get('lon') || 49.12);
 | 
			
		||||
  const currentDate = useMemo(
 | 
			
		||||
    () =>
 | 
			
		||||
      params.get('currentDate')
 | 
			
		||||
        ? new Date(params.get('currentDate'))
 | 
			
		||||
        : new Date(),
 | 
			
		||||
    [],
 | 
			
		||||
  const latFromUrl = parseFloat(params.get('lat') || '55.78');
 | 
			
		||||
  const lonFromUrl = parseFloat(params.get('lon') || '49.12');
 | 
			
		||||
 | 
			
		||||
  const [currentDate, setCurrentDate] = useState(
 | 
			
		||||
    params.get('currentDate')
 | 
			
		||||
      ? new Date(params.get('currentDate'))
 | 
			
		||||
      : new Date(),
 | 
			
		||||
  );
 | 
			
		||||
 | 
			
		||||
  const {
 | 
			
		||||
@ -44,6 +45,18 @@ const OrdersMap = () => {
 | 
			
		||||
        {t('title')}
 | 
			
		||||
      </Heading>
 | 
			
		||||
 | 
			
		||||
      <DateNavigator
 | 
			
		||||
        currentDate={currentDate}
 | 
			
		||||
        onPreviousDate={() =>
 | 
			
		||||
          setCurrentDate((prevDate) =>
 | 
			
		||||
            dayjs(prevDate).subtract(1, 'day').toDate(),
 | 
			
		||||
          )
 | 
			
		||||
        }
 | 
			
		||||
        onNextDate={() =>
 | 
			
		||||
          setCurrentDate((prevDate) => dayjs(prevDate).add(1, 'day').toDate())
 | 
			
		||||
        }
 | 
			
		||||
      />
 | 
			
		||||
 | 
			
		||||
      {isLoading && (
 | 
			
		||||
        <Flex justifyContent='center' alignItems='center'>
 | 
			
		||||
          <Spinner size='lg' />
 | 
			
		||||
 | 
			
		||||
@ -1,4 +1,4 @@
 | 
			
		||||
import React, { useEffect } from 'react';
 | 
			
		||||
import React, { useEffect, useState } from 'react';
 | 
			
		||||
import {
 | 
			
		||||
  Box,
 | 
			
		||||
  Heading,
 | 
			
		||||
@ -15,11 +15,13 @@ import {
 | 
			
		||||
  Spinner,
 | 
			
		||||
} from '@chakra-ui/react';
 | 
			
		||||
import { useTranslation } from 'react-i18next';
 | 
			
		||||
import dayjs from 'dayjs';
 | 
			
		||||
 | 
			
		||||
import MasterItem from '../MasterItem';
 | 
			
		||||
import MasterDrawer from '../MasterDrawer';
 | 
			
		||||
import { useGetMastersQuery } from '../../__data__/service/api';
 | 
			
		||||
import useShowToast from '../../hooks/useShowToast';
 | 
			
		||||
import DateNavigator from '../DateNavigator';
 | 
			
		||||
 | 
			
		||||
const TABLE_HEADERS = [
 | 
			
		||||
  'name' as const,
 | 
			
		||||
@ -31,12 +33,18 @@ const TABLE_HEADERS = [
 | 
			
		||||
const Masters = () => {
 | 
			
		||||
  const { isOpen, onOpen, onClose } = useDisclosure();
 | 
			
		||||
  const showToast = useShowToast();
 | 
			
		||||
  const [currentDate, setCurrentDate] = useState(new Date());
 | 
			
		||||
 | 
			
		||||
  const { t } = useTranslation('~', {
 | 
			
		||||
    keyPrefix: 'dry-wash.arm.master',
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  const { data: masters, error, isLoading, isSuccess } = useGetMastersQuery();
 | 
			
		||||
  const {
 | 
			
		||||
    data: masters,
 | 
			
		||||
    error,
 | 
			
		||||
    isLoading,
 | 
			
		||||
    isSuccess,
 | 
			
		||||
  } = useGetMastersQuery({ date: currentDate });
 | 
			
		||||
 | 
			
		||||
  useEffect(() => {
 | 
			
		||||
    if (error) {
 | 
			
		||||
@ -46,12 +54,24 @@ const Masters = () => {
 | 
			
		||||
 | 
			
		||||
  return (
 | 
			
		||||
    <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>
 | 
			
		||||
 | 
			
		||||
        <Button colorScheme='green' onClick={onOpen}>
 | 
			
		||||
          + {t('add')}
 | 
			
		||||
        </Button>
 | 
			
		||||
      </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'>
 | 
			
		||||
        <Thead>
 | 
			
		||||
          <Tr>
 | 
			
		||||
 | 
			
		||||
@ -53,7 +53,7 @@ const Orders = () => {
 | 
			
		||||
    isSuccess: isMastersSuccess,
 | 
			
		||||
    isError: isMastersError,
 | 
			
		||||
    error: mastersError,
 | 
			
		||||
  } = useGetMastersQuery();
 | 
			
		||||
  } = useGetMastersQuery({ date: currentDate });
 | 
			
		||||
 | 
			
		||||
  const isLoading = isOrdersLoading || isMastersLoading;
 | 
			
		||||
  const isSuccess = isOrdersSuccess && isMastersSuccess;
 | 
			
		||||
 | 
			
		||||
@ -8,12 +8,12 @@ const commonError = { success: false, message: 'Что-то пошло не та
 | 
			
		||||
 | 
			
		||||
const sleep =
 | 
			
		||||
  (duration = 1000) =>
 | 
			
		||||
    (req, res, next) =>
 | 
			
		||||
      setTimeout(next, duration);
 | 
			
		||||
  (req, res, next) =>
 | 
			
		||||
    setTimeout(next, duration);
 | 
			
		||||
 | 
			
		||||
router.use(sleep());
 | 
			
		||||
 | 
			
		||||
router.get('/arm/masters', (req, res) => {
 | 
			
		||||
router.post('/arm/masters/list', (req, res) => {
 | 
			
		||||
  res
 | 
			
		||||
    .status(/error/.test(STUBS.masters) ? 500 : 200)
 | 
			
		||||
    .send(
 | 
			
		||||
@ -108,9 +108,7 @@ router.post('/order/:orderId/upload-car-img', (req, res) => {
 | 
			
		||||
      .send(require(`../json/landing-order-car-image-upload/${stubName}.json`));
 | 
			
		||||
  } catch (e) {
 | 
			
		||||
    console.error(e);
 | 
			
		||||
    res
 | 
			
		||||
      .status(500)
 | 
			
		||||
      .send(commonError);
 | 
			
		||||
    res.status(500).send(commonError);
 | 
			
		||||
  }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user