- Renamed `ServiceSelect` to `ServicesSelect` for clarity. - Updated state management to handle multiple service IDs instead of a single service ID. - Adjusted related components (`DateSelect`, `TimeSelect`, `SubmitButton`, and `NextButton`) to accommodate the new services structure. - Removed the deprecated `service-select.tsx` file and refactored related logic in the order store and API to support multiple services. - Enhanced error handling in the slots service to validate multiple services correctly.
44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import { useOrderCreate } from '@/hooks/api/orders';
|
|
import { useOrderStore } from '@/stores/order';
|
|
import { Button } from '@repo/ui/components/ui/button';
|
|
import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
|
|
import { useEffect } from 'react';
|
|
|
|
export function SubmitButton() {
|
|
const { clientId, date, serviceIds, setStep, slotId, time } = useOrderStore((store) => store);
|
|
const isDisabled = !clientId || !serviceIds.length || !date || !time || !slotId;
|
|
|
|
const { isError, isPending, isSuccess, mutate: createOrder } = useOrderCreate();
|
|
|
|
const handleSubmit = () => {
|
|
if (isDisabled) return;
|
|
|
|
createOrder({
|
|
input: {
|
|
client: clientId,
|
|
datetime_start: time,
|
|
services: serviceIds,
|
|
slot: slotId,
|
|
},
|
|
});
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (isSuccess) setStep('success');
|
|
if (isError) setStep('error');
|
|
}, [isError, isSuccess, setStep]);
|
|
|
|
return (
|
|
<Button
|
|
className="w-full"
|
|
disabled={isPending || isDisabled}
|
|
onClick={handleSubmit}
|
|
type="button"
|
|
>
|
|
{isPending ? <LoadingSpinner /> : 'Завершить'}
|
|
</Button>
|
|
);
|
|
}
|