401 lines
11 KiB
JavaScript
401 lines
11 KiB
JavaScript
import React, { useCallback, useEffect, useState } from 'react';
|
|
import {
|
|
EditFilled,
|
|
DeleteFilled,
|
|
PlusOutlined,
|
|
ReloadOutlined,
|
|
} from '@ant-design/icons';
|
|
import { Messages } from '../../Components/Notifications/Messages';
|
|
import FormHeader from '../PageComponents/FormHeader';
|
|
import Buttons from '../../Components/Forms/Buttons';
|
|
import { Tables } from '../../Components/Tables/Table';
|
|
import { Space, Table } from 'antd';
|
|
import { useDispatch } from 'react-redux';
|
|
import {
|
|
getWholeSaleProductEntry,
|
|
getwsPreorder,
|
|
} from '../../Features/WholeSale/ProductEntry';
|
|
import { getSession } from '../../Services/Others';
|
|
import { IoEye } from 'react-icons/io5';
|
|
import { DefaultModal } from '../../Components/Modal/DefaultModal';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import {
|
|
changeBreadCrumb,
|
|
getEmpAccess,
|
|
} from '../../Features/AppPage/CenterPage';
|
|
import Search from '../../Components/Forms/Search';
|
|
import { DatePicProd } from '../../Components/Forms/DatePickerProduct';
|
|
import moment from 'moment';
|
|
import { useAuth } from '../../AuthContext';
|
|
|
|
const subDirectory = import.meta.env.BASE_URL;
|
|
const WsPreOrderList = () => {
|
|
const { SadminuserAccess } = useAuth();
|
|
let SAAccessCommonMaster = SadminuserAccess?.find(
|
|
(e) => e?.MenuName === 'Preorder'
|
|
);
|
|
|
|
const dispatch = useDispatch();
|
|
const navigate = useNavigate();
|
|
|
|
const CompId = getSession('CompId');
|
|
const BranchId = getSession('BranchId');
|
|
const AppId = getSession('AppId');
|
|
const UserType = getSession('UserType');
|
|
|
|
const [messageType, setMessageType] = useState(null);
|
|
const [messageData, setMessageData] = useState(null);
|
|
const [page, setpage] = useState(1);
|
|
const [page2, setpage2] = useState(1);
|
|
const [filteredInfo, setFilteredInfo] = useState({});
|
|
const [sortedInfo, setSortedInfo] = useState({});
|
|
const [CommonDataFilter, setCommonDataFilter] = useState([]);
|
|
const [ProductDetailopen, setProductDetailopen] = useState(false);
|
|
const [Productdata, setProductdata] = useState([]);
|
|
const [searchedText, setSearchedText] = useState('');
|
|
const [WsPreorderDate, setWsPreorderDate] = useState();
|
|
const [empData, setEmpData] = useState();
|
|
const [addnewAccess, setaddnewAccess] = useState(true);
|
|
|
|
const items = [
|
|
{
|
|
name: 'Home',
|
|
link: `${subDirectory}app-page/home`,
|
|
},
|
|
{
|
|
name: 'Preorder',
|
|
link: `${subDirectory}setting/wholesale-preorder`,
|
|
},
|
|
];
|
|
|
|
useEffect(() => {
|
|
dispatch(changeBreadCrumb({ items: items }));
|
|
const todayDate = new Date()?.toISOString()?.split('T')[0];
|
|
FetchFilterData(todayDate);
|
|
// if (UserType === "Employee") {
|
|
// fetchApi()
|
|
// }
|
|
}, []);
|
|
useEffect(() => {
|
|
if (UserType === 'Employee') {
|
|
fetchApi();
|
|
}
|
|
}, [UserType]);
|
|
useEffect(() => {
|
|
let hasAccess = false;
|
|
|
|
if (UserType === 'Admin' || UserType === 'Super Admin') {
|
|
hasAccess = true;
|
|
} else if (UserType === 'Employee') {
|
|
hasAccess = empData?.AddAccess === 'Y';
|
|
} else if (UserType === 'Super Admin User') {
|
|
hasAccess = SAAccessCommonMaster?.AddAccess === 'Y';
|
|
}
|
|
|
|
setaddnewAccess(!hasAccess);
|
|
}, [empData, SAAccessCommonMaster, UserType]);
|
|
|
|
const fetchApi = async () => {
|
|
let data = {
|
|
CompId: CompId,
|
|
BranchId: BranchId,
|
|
AppId: AppId,
|
|
EmpId: UserId,
|
|
};
|
|
let response = await dispatch(getEmpAccess(data)).unwrap();
|
|
let datas = response?.data?.data?.[0]?.EmpAccessDetails?.filter(
|
|
(item) => item.ConfigName === 'Preorder'
|
|
);
|
|
setEmpData(datas?.[0]);
|
|
};
|
|
|
|
const formatDate = (dateString) => {
|
|
const date = new Date(dateString);
|
|
const day = String(date.getDate()).padStart(2, '0'); // Ensure two digits
|
|
const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are 0-based
|
|
const year = date.getFullYear();
|
|
return `${day}-${month}-${year}`;
|
|
};
|
|
|
|
const ActionFormatter = (row, rowIndex) => {
|
|
navigate(
|
|
`${subDirectory}setting/wholesale-preorder/update`,
|
|
{ state: { editstate: row } },
|
|
{ key: rowIndex }
|
|
);
|
|
};
|
|
const columns = [
|
|
{
|
|
title: 'Sl.No',
|
|
key: 'sno',
|
|
align: 'center',
|
|
width: '100px',
|
|
render: (text, object, index) => (
|
|
<a style={{ color: 'black' }}>{(page - 1) * 10 + index + 1}</a>
|
|
),
|
|
},
|
|
{
|
|
title: 'Customer Name',
|
|
dataIndex: 'CustName',
|
|
key: 'CustName',
|
|
width: '100px',
|
|
render: (text, record, row) => (
|
|
<a style={{ color: 'black', width: '200px' }}>
|
|
{record?.CustShortName || record?.CustName || record?.CustMobile}
|
|
</a>
|
|
),
|
|
filteredValue: [searchedText],
|
|
onFilter: (value, record) => {
|
|
return (
|
|
String(record.CustShortName)
|
|
?.toLowerCase()
|
|
.includes(value?.toLowerCase()) ||
|
|
String(record.CustName)?.toLowerCase().includes(value?.toLowerCase()) ||
|
|
String(record.DueDate)?.toLowerCase().includes(value?.toLowerCase()) ||
|
|
String(record.CustMobile)?.toLowerCase().includes(value?.toLowerCase())
|
|
);
|
|
},
|
|
sorter: (a, b) => a?.CustName?.length - b?.CustName?.length,
|
|
sortOrder: sortedInfo.columnKey === 'CustName' ? sortedInfo.order : null,
|
|
ellipsis: true,
|
|
},
|
|
|
|
{
|
|
title: 'Mobile No',
|
|
dataIndex: 'CustMobile',
|
|
key: 'CustMobile',
|
|
width: '100px',
|
|
render: (text) => (
|
|
<a style={{ color: 'black', width: '200px' }}>{text}</a>
|
|
),
|
|
},
|
|
{
|
|
title: 'Date',
|
|
dataIndex: 'DueDate',
|
|
key: 'DueDate',
|
|
width: '100px',
|
|
render: (text) => (
|
|
<a style={{ color: 'black', width: '200px' }}>{formatDate(text)}</a>
|
|
),
|
|
},
|
|
{
|
|
title: 'Product_Details',
|
|
key: 'ProductDetails',
|
|
dataIndex: 'ProductDetails',
|
|
align: 'center',
|
|
width: '100px',
|
|
render: (text, row) => (
|
|
<Space size="middle">
|
|
<a>
|
|
<IoEye
|
|
style={{ color: '#1292EE', fontSize: '25px', cursor: 'pointer' }}
|
|
onClick={() => ViewProduct(row)}
|
|
/>
|
|
</a>
|
|
</Space>
|
|
),
|
|
},
|
|
// {
|
|
// title: "Action",
|
|
// key: "Action",
|
|
// dataIndex: "Action",
|
|
// width: "100px",
|
|
// render: (_, record, index) =>
|
|
// CommonDataFilter.length >= 1 ? (
|
|
// <Space size="middle">
|
|
// <a>
|
|
// <EditFilled
|
|
// style={{ color: "#1292EE" }}
|
|
// onClick ={()=>ActionFormatter(record, index)}
|
|
|
|
// />
|
|
// </a>
|
|
// </Space>
|
|
// ) : null,
|
|
// },
|
|
];
|
|
const ProductdataColumns = [
|
|
{
|
|
title: 'Sl.No',
|
|
key: 'sno',
|
|
align: 'center',
|
|
width: '50px',
|
|
render: (text, object, index) => (
|
|
<a style={{ color: 'black' }}>{(page2 - 1) * 10 + index + 1}</a>
|
|
),
|
|
},
|
|
|
|
{
|
|
title: 'Product Name',
|
|
dataIndex: 'ProdName',
|
|
key: 'ProdName',
|
|
width: '200px',
|
|
},
|
|
{
|
|
title: 'Size',
|
|
dataIndex: 'RequestedQty',
|
|
key: 'RequestedQty',
|
|
align: 'right',
|
|
},
|
|
{
|
|
title: 'UOM',
|
|
dataIndex: 'UomName',
|
|
key: 'UomName',
|
|
render: (text) => <a style={{ color: 'black' }}>{text}</a>,
|
|
},
|
|
{
|
|
title: 'Status',
|
|
dataIndex: 'ActiveStatus',
|
|
key: 'ActiveStatus',
|
|
render: (text) => (
|
|
<a style={{ color: text == 'A' ? 'green' : 'red' }}>
|
|
{text == 'A' ? 'Active' : 'Deactive'}
|
|
</a>
|
|
),
|
|
},
|
|
];
|
|
|
|
// const FetchData = async () => {
|
|
// let response = await dispatch(getwsPreorder({ "CompId": CompId, "AppId": AppId, "BranchId": BranchId })).unwrap()
|
|
|
|
// if (response?.data?.statusCode == 1) {
|
|
// setCommonDataFilter(response?.data?.data)
|
|
// }
|
|
// }
|
|
|
|
const ViewProduct = (record) => {
|
|
setProductDetailopen(true);
|
|
setProductdata(record?.ProductDetails);
|
|
};
|
|
|
|
const onComplete = useCallback(() => {
|
|
setMessageData(null);
|
|
setMessageType(null);
|
|
}, []);
|
|
|
|
const handlePageChange = (current) => {
|
|
setpage(current);
|
|
};
|
|
const handlePageChange2 = (current) => {
|
|
setpage2(current);
|
|
};
|
|
|
|
const handleChange = (pagination, filters, sorter) => {
|
|
setFilteredInfo(filters);
|
|
setSortedInfo(sorter);
|
|
};
|
|
const handleProductCancel = () => {
|
|
setProductDetailopen(false);
|
|
};
|
|
const navigateToProductEntry = () => {
|
|
navigate(`${subDirectory}setting/wholesale-preorder/new`);
|
|
};
|
|
|
|
const onSearch = (value) => {
|
|
setSearchedText(value);
|
|
};
|
|
const onSearchChange = (e) => {
|
|
setSearchedText(e?.target?.value);
|
|
};
|
|
const FetchFilterData = async (date) => {
|
|
let response = await dispatch(
|
|
getwsPreorder({
|
|
CompId: CompId,
|
|
AppId: AppId,
|
|
BranchId: BranchId,
|
|
Date: date,
|
|
})
|
|
).unwrap();
|
|
|
|
if (response?.data?.statusCode == 1) {
|
|
setCommonDataFilter(response?.data?.data);
|
|
} else {
|
|
setCommonDataFilter([]);
|
|
}
|
|
};
|
|
const wsPreOrderDate = async (date, dateString) => {
|
|
if (dateString) {
|
|
const Date1 = moment(dateString, ['DD-MM-YYYY']).format(
|
|
'YYYY-MM-DDTHH:mm:ss'
|
|
);
|
|
console.log(Date1.split('T')[0], 'Date1Date1');
|
|
setWsPreorderDate(Date1);
|
|
FetchFilterData(Date1.split('T')[0]);
|
|
} else {
|
|
setWsPreorderDate(null);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="userPageTable2">
|
|
<div className="userPageContent">
|
|
<Messages
|
|
messageType={messageType}
|
|
messageData={messageData}
|
|
onComplete={onComplete}
|
|
/>
|
|
<div>
|
|
<div>
|
|
<FormHeader title={'Preorder'} />
|
|
</div>
|
|
<div className="searchAddDiv">
|
|
<div className="formSearch">
|
|
<Search
|
|
placeholder="Search"
|
|
onSearch={onSearch}
|
|
onSearchChange={onSearchChange}
|
|
/>
|
|
</div>
|
|
<DatePicProd
|
|
canSelectPast={true}
|
|
onChange={wsPreOrderDate}
|
|
valueData={WsPreorderDate}
|
|
dontallowfeature={true}
|
|
/>
|
|
<Buttons
|
|
buttonText={'Add New'}
|
|
handleSubmit={() => navigateToProductEntry()}
|
|
disabled={addnewAccess}
|
|
color="901D77"
|
|
icon={<PlusOutlined />}
|
|
>
|
|
OPEN
|
|
</Buttons>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="reportTable">
|
|
<Tables
|
|
columns={columns}
|
|
data={CommonDataFilter}
|
|
pagination={handlePageChange}
|
|
onChange={handleChange}
|
|
/>
|
|
</div>
|
|
</div>
|
|
{console.log('Productdata', Productdata)}
|
|
<DefaultModal
|
|
open={ProductDetailopen}
|
|
title="Product Details"
|
|
handleCancel={handleProductCancel}
|
|
footer={false}
|
|
width={1000}
|
|
children={
|
|
<div style={{ height: '400px', overflowY: 'scroll' }}>
|
|
<div className="reportTable important-style">
|
|
<Tables
|
|
dataSource={Productdata}
|
|
data={Productdata}
|
|
columns={ProductdataColumns}
|
|
pagination={handlePageChange2}
|
|
/>
|
|
</div>
|
|
</div>
|
|
}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default WsPreOrderList;
|