yogiedigital/cod-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hidden jadwal shift and master-shift

Browse Source
This commit is contained in:
Rafiafrzl
2025-11-15 14:57:25 +07:00
parent 8cf5878d46
commit da9cf0d554
2 changed files with 75 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/layout/LayoutMenu.jsx
View File

@@ -76,7 +76,7 @@ const allItems = [
icon: <NodeExpandOutlined style={{ fontSize: '19px' }} />, icon: <NodeExpandOutlined style={{ fontSize: '19px' }} />,
label: <Link to="/dashboard-svg/compressor-c">Compressor C</Link>, label: <Link to="/dashboard-svg/compressor-c">Compressor C</Link>,
}, },
] ],
}, },
{ {
key: 'dashboard-svg-airdryer', key: 'dashboard-svg-airdryer',
@@ -103,7 +103,7 @@ const allItems = [
icon: <NodeExpandOutlined style={{ fontSize: '19px' }} />, icon: <NodeExpandOutlined style={{ fontSize: '19px' }} />,
label: <Link to="/dashboard-svg/airdryer-c">Air Dryer C</Link>, label: <Link to="/dashboard-svg/airdryer-c">Air Dryer C</Link>,
}, },
] ],
}, },
], ],
}, },
@@ -142,11 +142,11 @@ const allItems = [
icon: <SafetyOutlined style={{ fontSize: '19px' }} />, icon: <SafetyOutlined style={{ fontSize: '19px' }} />,
label: <Link to="/master/status">Status</Link>, label: <Link to="/master/status">Status</Link>,
}, },
{ // {
key: 'master-shift', // key: 'master-shift',
icon: <ClockCircleOutlined style={{ fontSize: '19px' }} />, // icon: <ClockCircleOutlined style={{ fontSize: '19px' }} />,
label: <Link to="/master/shift">Shift</Link>, // label: <Link to="/master/shift">Shift</Link>,
}, // },
], ],
}, },
{ {
@@ -219,15 +219,15 @@ const allItems = [
</Link> </Link>
), ),
}, },
{ // {
key: 'jadwal-shift', // key: 'jadwal-shift',
icon: <CalendarOutlined style={{ fontSize: '19px' }} />, // icon: <CalendarOutlined style={{ fontSize: '19px' }} />,
label: ( // label: (
<Link to="/jadwal-shift" className="fontMenus"> // <Link to="/jadwal-shift" className="fontMenus">
Jadwal Shift // Jadwal Shift
</Link> // </Link>
), // ),
}, // },
]; ];
const LayoutMenu = () => { const LayoutMenu = () => {
@@ -255,11 +255,11 @@ const LayoutMenu = () => {
const masterKeyMap = { const masterKeyMap = {
'plant-sub-section': 'master-plant-sub-section', 'plant-sub-section': 'master-plant-sub-section',
'brand-device': 'master-brand-device', 'brand-device': 'master-brand-device',
'device': 'master-device', device: 'master-device',
'unit': 'master-unit', unit: 'master-unit',
'tag': 'master-tag', tag: 'master-tag',
'status': 'master-status', status: 'master-status',
'shift': 'master-shift' shift: 'master-shift',
}; };
return masterKeyMap[subPath] || `master-${subPath}`; return masterKeyMap[subPath] || `master-${subPath}`;
} }
@@ -276,7 +276,7 @@ const LayoutMenu = () => {
if (subPath === 'airdryer-a') return 'dashboard-svg-airdryer-airdryer-a'; if (subPath === 'airdryer-a') return 'dashboard-svg-airdryer-airdryer-a';
if (subPath === 'airdryer-b') return 'dashboard-svg-airdryer-airdryer-b'; if (subPath === 'airdryer-b') return 'dashboard-svg-airdryer-airdryer-b';
if (subPath === 'airdryer-c') return 'dashboard-svg-airdryer-airdryer-c'; if (subPath === 'airdryer-c') return 'dashboard-svg-airdryer-airdryer-c';
return `dashboard-svg-${subPath}`; return `dashboard-svg-${subPath}`;
} }
@@ -284,8 +284,8 @@ const LayoutMenu = () => {
if (pathname.startsWith('/report/')) { if (pathname.startsWith('/report/')) {
const subPath = pathParts[1]; const subPath = pathParts[1];
const reportKeyMap = { const reportKeyMap = {
'trending': 'report-trending', trending: 'report-trending',
'report': 'report-report' report: 'report-report',
}; };
return reportKeyMap[subPath] || `report-${subPath}`; return reportKeyMap[subPath] || `report-${subPath}`;
} }
@@ -294,8 +294,8 @@ const LayoutMenu = () => {
if (pathname.startsWith('/history/')) { if (pathname.startsWith('/history/')) {
const subPath = pathParts[1]; const subPath = pathParts[1];
const historyKeyMap = { const historyKeyMap = {
'alarm': 'history-alarm', alarm: 'history-alarm',
'event': 'history-event' event: 'history-event',
}; };
return historyKeyMap[subPath] || `history-${subPath}`; return historyKeyMap[subPath] || `history-${subPath}`;
} }
@@ -306,7 +306,7 @@ const LayoutMenu = () => {
// Function to get parent keys from menu key // Function to get parent keys from menu key
const getParentKeys = (key) => { const getParentKeys = (key) => {
const parentKeys = []; const parentKeys = [];
if (key.startsWith('dashboard-svg-compressor-')) { if (key.startsWith('dashboard-svg-compressor-')) {
parentKeys.push('dashboard-svg', 'dashboard-svg-compressor'); parentKeys.push('dashboard-svg', 'dashboard-svg-compressor');
} else if (key.startsWith('dashboard-svg-airdryer-')) { } else if (key.startsWith('dashboard-svg-airdryer-')) {
@@ -320,7 +320,7 @@ const LayoutMenu = () => {
} else if (key.startsWith('history-')) { } else if (key.startsWith('history-')) {
parentKeys.push('history'); parentKeys.push('history');
} }
return parentKeys; return parentKeys;
}; };
@@ -330,7 +330,7 @@ const LayoutMenu = () => {
setSelectedKeys([currentKey]); setSelectedKeys([currentKey]);
const parentKeys = getParentKeys(currentKey); const parentKeys = getParentKeys(currentKey);
// Always keep the parent menus open when a child is selected // Always keep the parent menus open when a child is selected
if (parentKeys.length > 0) { if (parentKeys.length > 0) {
setStateOpenKeys(parentKeys); setStateOpenKeys(parentKeys);
@@ -359,13 +359,13 @@ const LayoutMenu = () => {
const onOpenChange = (openKeys) => { const onOpenChange = (openKeys) => {
const currentOpenKey = openKeys.find((key) => stateOpenKeys.indexOf(key) === -1); const currentOpenKey = openKeys.find((key) => stateOpenKeys.indexOf(key) === -1);
// If clicking on a menu that was previously closed // If clicking on a menu that was previously closed
if (currentOpenKey !== undefined) { if (currentOpenKey !== undefined) {
const repeatIndex = openKeys const repeatIndex = openKeys
.filter((key) => key !== currentOpenKey) .filter((key) => key !== currentOpenKey)
.findIndex((key) => levelKeys[key] === levelKeys[currentOpenKey]); .findIndex((key) => levelKeys[key] === levelKeys[currentOpenKey]);
setStateOpenKeys( setStateOpenKeys(
openKeys openKeys
.filter((_, index) => index !== repeatIndex) .filter((_, index) => index !== repeatIndex)
@@ -376,12 +376,10 @@ const LayoutMenu = () => {
// but keep other parent menus open if they have active children // but keep other parent menus open if they have active children
const currentKey = getMenuKeyFromPath(location.pathname); const currentKey = getMenuKeyFromPath(location.pathname);
const necessaryParentKeys = getParentKeys(currentKey); const necessaryParentKeys = getParentKeys(currentKey);
// Filter out only the menus that are necessary to keep open // Filter out only the menus that are necessary to keep open
const filteredOpenKeys = openKeys.filter(key => const filteredOpenKeys = openKeys.filter((key) => necessaryParentKeys.includes(key));
necessaryParentKeys.includes(key)
);
setStateOpenKeys(filteredOpenKeys); setStateOpenKeys(filteredOpenKeys);
} }
}; };
@@ -391,9 +389,7 @@ const LayoutMenu = () => {
const karyawan = () => { const karyawan = () => {
return allItems return allItems
.filter( .filter((item) => item.key !== 'setting')
(item) => item.key !== 'setting'
)
.map((item) => { .map((item) => {
if (item.key === 'master') { if (item.key === 'master') {
return { return {
@@ -403,7 +399,7 @@ const LayoutMenu = () => {
return item; return item;
}); });
}; };
const items = isAdmin === 1 ? allItems : karyawan(); const items = isAdmin === 1 ? allItems : karyawan();
return ( return (
@@ -423,4 +419,4 @@ const LayoutMenu = () => {
/> />
); );
}; };
export default LayoutMenu; export default LayoutMenu;

53
src/pages/contact/component/ListContact.jsx
View File

@@ -12,8 +12,6 @@ import { useNavigate } from 'react-router-dom';
import { NotifAlert, NotifConfirmDialog } from '../../../components/Global/ToastNotif'; import { NotifAlert, NotifConfirmDialog } from '../../../components/Global/ToastNotif';
import { getAllContact, deleteContact } from '../../../api/contact'; import { getAllContact, deleteContact } from '../../../api/contact';
const { TabPane } = Tabs;
const ContactCard = memo(function ContactCard({ contact, showEditModal, showDeleteModal }) { const ContactCard = memo(function ContactCard({ contact, showEditModal, showDeleteModal }) {
return ( return (
<Col xs={24} sm={12} md={8} lg={6}> <Col xs={24} sm={12} md={8} lg={6}>
@@ -118,7 +116,14 @@ const ContactCard = memo(function ContactCard({ contact, showEditModal, showDele
</div> </div>
{/* Edit and Delete Buttons - Bottom Right */} {/* Edit and Delete Buttons - Bottom Right */}
<div style={{ display: 'flex', justifyContent: 'flex-end', gap: '8px', marginTop: '8px' }}> <div
style={{
display: 'flex',
justifyContent: 'flex-end',
gap: '8px',
marginTop: '8px',
}}
>
<Space> <Space>
<Button <Button
type="text" type="text"
@@ -127,9 +132,11 @@ const ContactCard = memo(function ContactCard({ contact, showEditModal, showDele
borderColor: '#faad14', borderColor: '#faad14',
padding: '2px 6px', padding: '2px 6px',
fontSize: '11px', fontSize: '11px',
height: '24px' height: '24px',
}} }}
icon={<EditOutlined style={{ color: '#faad14', fontSize: '11px' }} />} icon={
<EditOutlined style={{ color: '#faad14', fontSize: '11px' }} />
}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
showEditModal(contact); showEditModal(contact);
@@ -145,7 +152,7 @@ const ContactCard = memo(function ContactCard({ contact, showEditModal, showDele
borderColor: 'red', borderColor: 'red',
padding: '2px 6px', padding: '2px 6px',
fontSize: '11px', fontSize: '11px',
height: '24px' height: '24px',
}} }}
icon={<DeleteOutlined style={{ fontSize: '11px' }} />} icon={<DeleteOutlined style={{ fontSize: '11px' }} />}
onClick={(e) => { onClick={(e) => {
@@ -282,7 +289,6 @@ const ListContact = memo(function ListContact(props) {
} }
}; };
return ( return (
<React.Fragment> <React.Fragment>
<Card> <Card>
@@ -302,7 +308,11 @@ const ListContact = memo(function ListContact(props) {
}} }}
onSearch={(value) => setFormDataFilter({ criteria: value })} onSearch={(value) => setFormDataFilter({ criteria: value })}
allowClear={{ allowClear={{
clearIcon: <span onClick={() => setFormDataFilter(defaultFilter)}>✕</span>, clearIcon: (
<span onClick={() => setFormDataFilter(defaultFilter)}>
✕
</span>
),
}} }}
enterButton={ enterButton={
<Button <Button
@@ -353,12 +363,25 @@ const ListContact = memo(function ListContact(props) {
marginBottom: '16px', marginBottom: '16px',
}} }}
> >
<Tabs activeKey={activeTab} onChange={setActiveTab} size="large"> <Tabs
<TabPane tab="All" key="all" /> activeKey={activeTab}
<TabPane tab="Operator" key="operator" /> onChange={setActiveTab}
<TabPane tab="Gudang" key="gudang" /> size="large"
</Tabs> items={[
{
key: 'all',
label: 'All',
},
{
key: 'operator',
label: 'Operator',
},
{
key: 'gudang',
label: 'Gudang',
},
]}
/>
</div> </div>
{getFilteredContacts().length === 0 ? ( {getFilteredContacts().length === 0 ? (
@@ -377,7 +400,7 @@ const ListContact = memo(function ListContact(props) {
id: contact.contact_id || contact.id, id: contact.contact_id || contact.id,
name: contact.contact_name || contact.name, name: contact.contact_name || contact.name,
phone: contact.contact_phone || contact.phone, phone: contact.contact_phone || contact.phone,
status: contact.is_active ? 'active' : 'inactive' status: contact.is_active ? 'active' : 'inactive',
}} }}
showEditModal={showEditModal} showEditModal={showEditModal}
showDeleteModal={showDeleteModal} showDeleteModal={showDeleteModal}