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

feat: remove unused activeTab state and related props from ListBrandDevice component

Browse Source
This commit is contained in:
Rafiafrzl
2025-10-17 15:39:34 +07:00
parent e42d1fa3ce
commit 2df7c953c7
2 changed files with 76 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/pages/master/brandDevice/IndexBrandDevice.jsx
View File

@@ -12,7 +12,6 @@ const IndexBrandDevice = memo(function IndexBrandDevice() {
const navigate = useNavigate(); const navigate = useNavigate();
const { setBreadcrumbItems } = useBreadcrumb(); const { setBreadcrumbItems } = useBreadcrumb();
const [activeTab, setActiveTab] = useState('brandDevice');
const [actionMode, setActionMode] = useState('list'); const [actionMode, setActionMode] = useState('list');
const [selectedData, setSelectedData] = useState(null); const [selectedData, setSelectedData] = useState(null);
const [readOnly, setReadOnly] = useState(false); const [readOnly, setReadOnly] = useState(false);
@@ -62,8 +61,6 @@ const IndexBrandDevice = memo(function IndexBrandDevice() {
selectedData={selectedData} selectedData={selectedData}
setSelectedData={setSelectedData} setSelectedData={setSelectedData}
readOnly={readOnly} readOnly={readOnly}
activeTab={activeTab}
setActiveTab={setActiveTab}
/> />
<DetailBrandDevice <DetailBrandDevice
setActionMode={setMode} setActionMode={setMode}

193
src/pages/master/brandDevice/component/ListBrandDevice.jsx
View File

@@ -1,5 +1,5 @@
import React, { memo, useState, useEffect } from 'react'; import React, { memo, useState, useEffect } from 'react';
import { Button, Col, Row, Space, Input, ConfigProvider, Card, Tag, Tabs } from 'antd'; import { Button, Col, Row, Space, Input, ConfigProvider, Card, Tag } from 'antd';
import { import {
PlusOutlined, PlusOutlined,
EditOutlined, EditOutlined,
@@ -10,7 +10,6 @@ import {
import { NotifAlert, NotifConfirmDialog } from '../../../../components/Global/ToastNotif'; import { NotifAlert, NotifConfirmDialog } from '../../../../components/Global/ToastNotif';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import TableList from '../../../../components/Global/TableList'; import TableList from '../../../../components/Global/TableList';
import ListErrorMaster from './ListErrorMaster';
// Dummy data // Dummy data
const initialBrandDeviceData = [ const initialBrandDeviceData = [
@@ -265,127 +264,87 @@ const ListBrandDevice = memo(function ListBrandDevice(props) {
}); });
}; };
const tabItems = [
{
key: 'brandDevice',
label: 'Brand Device',
},
{
key: 'errorMaster',
label: 'Error Master',
},
];
return ( return (
<React.Fragment> <React.Fragment>
<Card> <Card>
<ConfigProvider <Row>
theme={{ <Col xs={24}>
components: { <Row justify="space-between" align="middle" gutter={[8, 8]}>
Tabs: { <Col xs={24} sm={24} md={12} lg={12}>
inkBarColor: '#FF8C42', <Input.Search
itemActiveColor: '#FF8C42', placeholder="Search brand device..."
itemHoverColor: '#FF8C42', value={searchValue}
itemSelectedColor: '#FF8C42', onChange={(e) => {
}, const value = e.target.value;
}, setSearchValue(value);
}} // Auto search when clearing by backspace/delete
> if (value === '') {
<Tabs setFormDataFilter({ search: '' });
activeKey={props.activeTab} setTrigerFilter((prev) => !prev);
onChange={props.setActiveTab}
items={tabItems}
style={{ marginBottom: '16px' }}
/>
</ConfigProvider>
{props.activeTab === 'brandDevice' && (
<Row>
<Col xs={24}>
<Row justify="space-between" align="middle" gutter={[8, 8]}>
<Col xs={24} sm={24} md={12} lg={12}>
<Input.Search
placeholder="Search brand device..."
value={searchValue}
onChange={(e) => {
const value = e.target.value;
setSearchValue(value);
// Auto search when clearing by backspace/delete
if (value === '') {
setFormDataFilter({ search: '' });
setTrigerFilter((prev) => !prev);
}
}}
onSearch={handleSearch}
allowClear={{
clearIcon: <span onClick={handleSearchClear}>✕</span>,
}}
enterButton={
<Button
type="primary"
icon={<SearchOutlined />}
style={{
backgroundColor: '#23A55A',
borderColor: '#23A55A',
}}
>
Search
</Button>
} }
size="large" }}
/> onSearch={handleSearch}
</Col> allowClear={{
<Col> clearIcon: <span onClick={handleSearchClear}>✕</span>,
<Space wrap size="small"> }}
<ConfigProvider enterButton={
theme={{ <Button
token: { colorBgContainer: '#E9F6EF' }, type="primary"
components: { icon={<SearchOutlined />}
Button: { style={{
defaultBg: 'white', backgroundColor: '#23A55A',
defaultColor: '#23A55A', borderColor: '#23A55A',
defaultBorderColor: '#23A55A',
defaultHoverColor: '#23A55A',
defaultHoverBorderColor: '#23A55A',
},
},
}} }}
> >
<Button Search
icon={<PlusOutlined />} </Button>
onClick={() => showAddModal()} }
size="large" size="large"
> />
Tambah Brand Device </Col>
</Button> <Col>
</ConfigProvider> <Space wrap size="small">
</Space> <ConfigProvider
</Col> theme={{
</Row> token: { colorBgContainer: '#E9F6EF' },
</Col> components: {
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}> Button: {
<TableList defaultBg: 'white',
mobile defaultColor: '#23A55A',
cardColor={'#42AAFF'} defaultBorderColor: '#23A55A',
header={'tag_name'} defaultHoverColor: '#23A55A',
showPreviewModal={showPreviewModal} defaultHoverBorderColor: '#23A55A',
showEditModal={showEditModal} },
showDeleteDialog={showDeleteDialog} },
getData={getAllBrandDevice} }}
queryParams={formDataFilter} >
columns={columns(showPreviewModal, showEditModal, showDeleteDialog)} <Button
triger={trigerFilter} icon={<PlusOutlined />}
/> onClick={() => showAddModal()}
</Col> size="large"
</Row> >
)} Tambah Brand Device
{props.activeTab === 'errorMaster' && ( </Button>
<ListErrorMaster </ConfigProvider>
actionMode={props.actionMode} </Space>
setActionMode={props.setActionMode} </Col>
selectedData={props.selectedData} </Row>
setSelectedData={props.setSelectedData} </Col>
/> <Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
)} <TableList
mobile
cardColor={'#42AAFF'}
header={'tag_name'}
showPreviewModal={showPreviewModal}
showEditModal={showEditModal}
showDeleteDialog={showDeleteDialog}
getData={getAllBrandDevice}
queryParams={formDataFilter}
columns={columns(showPreviewModal, showEditModal, showDeleteDialog)}
triger={trigerFilter}
/>
</Col>
</Row>
</Card> </Card>
</React.Fragment> </React.Fragment>
); );