63 lines
1.8 KiB
TypeScript
63 lines
1.8 KiB
TypeScript
import { Button, Flex, Layout, Popconfirm, Tooltip, Typography } from 'antd';
|
|
import { ReactNode, useState } from 'react';
|
|
import { Content, Header } from 'antd/es/layout/layout';
|
|
import { API_URL, handleLogout, IconWrapper } from '@pos/base';
|
|
import { FaUser } from 'react-icons/fa';
|
|
import axios from 'axios';
|
|
|
|
interface AdminLayoutProps {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export default function AdminLayout(props: AdminLayoutProps) {
|
|
const { children } = props;
|
|
const [loadingLogout, setLoadingLogout] = useState(false);
|
|
|
|
async function handleClickLogout() {
|
|
setLoadingLogout(true);
|
|
try {
|
|
await axios({ url: `${API_URL.LOGOUT}`, method: 'delete' });
|
|
setLoadingLogout(false);
|
|
await handleLogout();
|
|
} catch (err: any) {
|
|
setLoadingLogout(false);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Layout>
|
|
<Header
|
|
style={{
|
|
position: 'sticky',
|
|
top: 0,
|
|
zIndex: 1,
|
|
width: '100%',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
// background: token.colorPrimary,
|
|
background: '#fff',
|
|
borderBottom: '1px solid #ddd',
|
|
}}
|
|
>
|
|
<Flex style={{ width: '100%' }} align="center">
|
|
<Flex>
|
|
<div style={{ fontWeight: 800, fontSize: 16 }}>LAPORAN</div>
|
|
</Flex>
|
|
<Flex style={{ marginLeft: 'auto' }}>
|
|
<Popconfirm
|
|
title="Are you sure want to logout?"
|
|
placement="bottomRight"
|
|
onConfirm={() => handleClickLogout()}
|
|
>
|
|
<Tooltip title="Logout" placement="bottom">
|
|
<FaUser style={{ fontSize: 16 }} />
|
|
</Tooltip>
|
|
</Popconfirm>
|
|
</Flex>
|
|
</Flex>
|
|
</Header>
|
|
<Content style={{ overflow: 'initial', background: '#fff', padding: 10 }}>{children}</Content>
|
|
</Layout>
|
|
);
|
|
}
|