Initial commit - restaurant dashboard
This commit is contained in:
RaghadMAlkous
@@ -1,165 +1,159 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Box, useTheme, useMediaQuery } from '@mui/material';
|
||||
import KitchPlusAppBar from '../AppBar';
|
||||
import Sidebar from '../SideHome';
|
||||
import LoginRestaurant from './contcet/LoginRestaurant';
|
||||
import React, { useState } from 'react';
|
||||
import { Box } from '@mui/material';
|
||||
import BasicInformation from './contcet/BasicInformation';
|
||||
import ContactInformation from './contcet/ContactInformation';
|
||||
import BusinessHours from './contcet/BusinessHours';
|
||||
import UploadMenu from './contcet/UploadMenu';
|
||||
import Equipment from './contcet/Equipment';
|
||||
import TypeOfRestaurant from './contcet/TypeOfRestaurant';
|
||||
import OperationalCapacity from './contcet/OperationalCapacity';
|
||||
import UploadPhotos from './contcet/UploadPhotos';
|
||||
import SideProfile from './SideProfile';
|
||||
|
||||
const drawerWidth = 230;
|
||||
import AccountProfile from '../Settings/AccountProfile';
|
||||
import authService from '../../../services/authService';
|
||||
import { useRestaurant } from '../../../contexts/RestaurantContext';
|
||||
import ConfirmationDialog from './contcet/ConfirmationDialog';
|
||||
|
||||
const RestaurantProfile = () => {
|
||||
const theme = useTheme();
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
|
||||
const [hasProducts, setHasProducts] = useState(false);
|
||||
const [sidebarOpen, setSidebarOpen] = useState(!isMobile);
|
||||
|
||||
// ⬇️ إدارة الخطوة الحالية
|
||||
const { restaurantId } = useRestaurant();
|
||||
const [currentStep, setCurrentStep] = useState(0);
|
||||
const [formData, setFormData] = useState({});
|
||||
const [modalOpen, setModalOpen] = useState(false);
|
||||
const [showSetting, setShowSetting] = useState(false);
|
||||
|
||||
const updateFormData = (newData) =>
|
||||
setFormData((prev) => ({ ...prev, ...newData }));
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!restaurantId) return;
|
||||
|
||||
const payload = {
|
||||
restaurant_name: formData.restaurant_name || '',
|
||||
restaurant_type: formData.restaurant_type || '',
|
||||
Address: formData.Address || '',
|
||||
City: formData.City || '',
|
||||
Postal_code: formData.Postal_code || '',
|
||||
Phone: formData.Phone || '',
|
||||
Email: formData.Email || '',
|
||||
Operation_hour: formData.Operation_hour || '',
|
||||
closed_days: formData.closed_days || [],
|
||||
equipment: {
|
||||
...formData.equipment // ✅ أخذ جميع المعدات من Equipment مباشرة
|
||||
},
|
||||
Maximum_orders_per_day: formData.Maximum_orders_per_day || 0,
|
||||
Number_of_Cheff: formData.Number_of_Cheff || 0,
|
||||
Number_of_Waiters: formData.Number_of_Waiters || 0,
|
||||
Number_of_Cookers: formData.Number_of_Cookers || 0,
|
||||
host_type: formData.ownRestaurantType || '',
|
||||
collaboration_type: formData.collaborateRestaurantType || ''
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await authService.createRestaurantProfile(restaurantId, payload);
|
||||
if (res.success) {
|
||||
setModalOpen(true);
|
||||
|
||||
// بعد 10 ثواني يغلق المودال ويظهر الـ AccountProfile
|
||||
setTimeout(() => {
|
||||
setModalOpen(false);
|
||||
setShowSetting(true);
|
||||
}, 10000); // ✅ صار 10 ثواني بدل 5
|
||||
} else {
|
||||
console.error("Profile creation failed:", res.message, res.errors);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
const steps = [
|
||||
<BasicInformation onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<ContactInformation onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<BusinessHours onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<UploadMenu onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<Equipment onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<OperationalCapacity onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<TypeOfRestaurant onNext={() => setCurrentStep(currentStep + 1)} onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<UploadPhotos onBack={() => setCurrentStep(currentStep - 1)} />,
|
||||
<BasicInformation
|
||||
key="step-0"
|
||||
formData={formData}
|
||||
updateFormData={updateFormData}
|
||||
onNext={() => setCurrentStep((p) => p + 1)}
|
||||
/>,
|
||||
<ContactInformation
|
||||
key="step-1"
|
||||
formData={formData}
|
||||
updateFormData={updateFormData}
|
||||
onNext={() => setCurrentStep((p) => p + 1)}
|
||||
onBack={() => setCurrentStep((p) => p - 1)}
|
||||
/>,
|
||||
<BusinessHours
|
||||
key="step-2"
|
||||
formData={formData}
|
||||
updateFormData={updateFormData}
|
||||
onNext={() => setCurrentStep((p) => p + 1)}
|
||||
onBack={() => setCurrentStep((p) => p - 1)}
|
||||
/>,
|
||||
<Equipment
|
||||
key="step-3"
|
||||
formData={formData}
|
||||
updateFormData={updateFormData}
|
||||
onNext={() => setCurrentStep((p) => p + 1)}
|
||||
onBack={() => setCurrentStep((p) => p - 1)}
|
||||
/>,
|
||||
<OperationalCapacity
|
||||
key="step-4"
|
||||
formData={formData}
|
||||
updateFormData={updateFormData}
|
||||
onNext={() => setCurrentStep((p) => p + 1)}
|
||||
onBack={() => setCurrentStep((p) => p - 1)}
|
||||
/>,
|
||||
<TypeOfRestaurant
|
||||
key="step-5"
|
||||
formData={formData}
|
||||
updateFormData={updateFormData}
|
||||
onBack={() => setCurrentStep((p) => p - 1)}
|
||||
onRegister={handleSubmit}
|
||||
/>
|
||||
];
|
||||
|
||||
useEffect(() => {
|
||||
const checkProducts = async () => {
|
||||
const productsExist = await checkIfProductsExist();
|
||||
setHasProducts(productsExist);
|
||||
};
|
||||
checkProducts();
|
||||
}, []);
|
||||
|
||||
const checkIfProductsExist = async () => {
|
||||
return false;
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (window.innerWidth >= theme.breakpoints.values.md) {
|
||||
setSidebarOpen(true);
|
||||
} else {
|
||||
setSidebarOpen(false);
|
||||
}
|
||||
}, [theme.breakpoints.values.md]);
|
||||
|
||||
useEffect(() => {
|
||||
const handleResize = () => {
|
||||
if (window.innerWidth >= theme.breakpoints.values.md) {
|
||||
setSidebarOpen(true);
|
||||
} else {
|
||||
setSidebarOpen(false);
|
||||
}
|
||||
};
|
||||
|
||||
handleResize();
|
||||
window.addEventListener('resize', handleResize);
|
||||
return () => window.removeEventListener('resize', handleResize);
|
||||
}, [theme.breakpoints.values.md]);
|
||||
|
||||
const handleDrawerToggle = () => {
|
||||
setSidebarOpen(!sidebarOpen);
|
||||
};
|
||||
|
||||
return (
|
||||
<Box sx={{
|
||||
display: 'flex',
|
||||
height: '100vh',
|
||||
backgroundColor: '#F6F6F6',
|
||||
overflow: 'hidden',
|
||||
}}>
|
||||
<Sidebar
|
||||
open={sidebarOpen}
|
||||
onClose={handleDrawerToggle}
|
||||
isMobile={isMobile}
|
||||
drawerWidth={drawerWidth}
|
||||
/>
|
||||
|
||||
<Box sx={{
|
||||
flexGrow: 1,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
width: { xs: '100%', sm: '100%', md: '100%' },
|
||||
marginLeft: { xs: 0, sm: sidebarOpen ? `${drawerWidth}px` : 0, md: 0 },
|
||||
transition: theme.transitions.create(['width'], {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.leavingScreen,
|
||||
}),
|
||||
}}>
|
||||
<KitchPlusAppBar
|
||||
onDrawerToggle={handleDrawerToggle}
|
||||
sidebarOpen={sidebarOpen}
|
||||
isMobile={isMobile}
|
||||
/>
|
||||
<Box>
|
||||
<Box sx={{
|
||||
display: 'flex', height: '100vh',
|
||||
|
||||
}}>
|
||||
<Box sx={{
|
||||
height: '100vh',
|
||||
ml: 3,
|
||||
mb: 2,
|
||||
width: { md: '30%' },
|
||||
display: { xs: 'none', sm: 'none', md: 'block' },
|
||||
overflowY: 'auto',
|
||||
scrollbarWidth: 'none',
|
||||
'&::-webkit-scrollbar': {
|
||||
display: 'none',
|
||||
},
|
||||
}}>
|
||||
|
||||
<Box sx={{
|
||||
minHeight: '100%', pb: 15, pt: 3,
|
||||
|
||||
}}>
|
||||
<SideProfile
|
||||
currentStepIndex={currentStep}
|
||||
onBack={() => setCurrentStep(prev => Math.max(prev - 1, 0))}
|
||||
/>
|
||||
|
||||
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box sx={{
|
||||
ml: { xs: 2, md: 3 },
|
||||
|
||||
flexGrow: 1,
|
||||
height: '100vh',
|
||||
pr: { sm: 2, md: 1 },
|
||||
|
||||
pt: 3,
|
||||
mb: { sm: 20 },
|
||||
width: { md: '60%' }, display: { xs: 'block', sm: 'block', md: 'block' },
|
||||
overflowY: 'auto',
|
||||
scrollbarWidth: 'none',
|
||||
'&::-webkit-scrollbar': {
|
||||
display: 'none',
|
||||
},
|
||||
}}>
|
||||
<Box sx={{
|
||||
minHeight: '100%', pb: 18,
|
||||
|
||||
}}>
|
||||
{steps[currentStep]}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', height: '100%', backgroundColor: '#F6F6F6', overflow: 'hidden' }}>
|
||||
|
||||
{/* إظهار SideProfile فقط إذا لم يتم التحويل إلى AccountProfile */}
|
||||
{!showSetting && (
|
||||
<Box
|
||||
sx={{
|
||||
height: '100%',
|
||||
width: { md: '30%' },
|
||||
display: { xs: 'none', sm: 'none', md: 'block' },
|
||||
overflowY: 'auto',
|
||||
scrollbarWidth: 'none',
|
||||
'&::-webkit-scrollbar': { display: 'none' }
|
||||
}}
|
||||
>
|
||||
<Box sx={{ minHeight: '100%', pb: 15, pt: 1 }}>
|
||||
<SideProfile
|
||||
currentStepIndex={currentStep}
|
||||
onBack={() => setCurrentStep((prev) => Math.max(prev - 1, 0))}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
)}
|
||||
|
||||
<Box
|
||||
sx={{
|
||||
ml: { xs: 2, md: 3 },
|
||||
flexGrow: 1,
|
||||
height: '100%',
|
||||
pr: { sm: 2, md: 1 },
|
||||
pt: 1,
|
||||
mb: { sm: 20 },
|
||||
width: { md: '60%' },
|
||||
display: 'block',
|
||||
overflowY: 'auto',
|
||||
scrollbarWidth: 'none',
|
||||
'&::-webkit-scrollbar': { display: 'none' }
|
||||
}}
|
||||
>
|
||||
<Box sx={{ minHeight: '100%', pb: 18 }}>
|
||||
{showSetting ? <AccountProfile /> : steps[currentStep]}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
{/* مودال بدون أزرار */}
|
||||
<ConfirmationDialog open={modalOpen} onClose={() => {}} hideButtons={true} />
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user