79 lines
2.3 KiB
JavaScript
79 lines
2.3 KiB
JavaScript
import { useState } from 'react';
|
|
import { IoMdAdd, IoMdSettings } from 'react-icons/io';
|
|
import { DefaultModal } from '../../../../Components/Modal/DefaultModal';
|
|
import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
|
|
import './AllSalesPageSettings.scss';
|
|
import TableHeadersetting from './TableHeadersetting';
|
|
import PaymentOptions from '../../../Payment/PaymentOptions/PaymentOptions';
|
|
|
|
const AllSalesPageSettings = () => {
|
|
const [settingModal, setsettingModal] = useState(false);
|
|
const [selectedComponent, setselectedComponent] = useState('Payment');
|
|
|
|
const onclose = () => {
|
|
setsettingModal(false);
|
|
};
|
|
const ComponentSelect = (value) => {
|
|
setselectedComponent(value);
|
|
};
|
|
return (
|
|
<>
|
|
<TooltipWrapper>
|
|
<div
|
|
onClick={() => setsettingModal(true)}
|
|
style={{
|
|
cursor: 'pointer',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
gap: '5px',
|
|
padding: '5px 10px',
|
|
borderRadius: '4px',
|
|
fontSize: '14px',
|
|
backgroundColor: '#f0f0f0',
|
|
}}
|
|
>
|
|
<IoMdSettings size={16} />
|
|
</div>
|
|
</TooltipWrapper>
|
|
|
|
<DefaultModal
|
|
open={settingModal}
|
|
footer={false}
|
|
handleCancel={onclose}
|
|
title={'Settings'}
|
|
width={850}
|
|
>
|
|
<div className="AllSalesPageSettingsMainDiv">
|
|
<div className="SettingsListSwitchBTN">
|
|
<div
|
|
className={selectedComponent === 'Payment' ? 'selected' : ''}
|
|
onClick={() => ComponentSelect('Payment')}
|
|
>
|
|
Payment Option
|
|
</div>
|
|
<div
|
|
className={selectedComponent === 'Table' ? 'selected' : ''}
|
|
onClick={() => ComponentSelect('Table')}
|
|
>
|
|
Table
|
|
</div>
|
|
</div>
|
|
<div className="SettingsComponentDiv">
|
|
{selectedComponent == 'Payment' && (
|
|
<div>
|
|
<PaymentOptions setModalOpen={setsettingModal}/>
|
|
</div>
|
|
)}
|
|
|
|
{selectedComponent === 'Table' && (
|
|
<TableHeadersetting setModalOpen={setsettingModal} />
|
|
)}
|
|
</div>
|
|
</div>
|
|
</DefaultModal>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default AllSalesPageSettings;
|