Android_Retail/src/Pages/CommonMaster/CommonMaster.jsx

1207 lines
39 KiB
JavaScript

import React, { useState, useEffect, useCallback } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { Form, Space } from 'antd';
import {
EditFilled,
DeleteFilled,
PlusOutlined,
ReloadOutlined,
} from '@ant-design/icons';
import { InputField } from '../../Components/Forms/InputField';
import { DropDowns } from '../../Components/Forms/DropDown';
import { DefaultModal } from '../../Components/Modal/DefaultModal';
import Buttons from '../../Components/Forms/Buttons';
import { Tables } from '../../Components/Tables/Table';
import { Messages } from '../../Components/Notifications/Messages';
import {
changeBreadCrumb,
getEmpAccess,
} from '../../Features/AppPage/CenterPage.js';
import Imageupload from '../../Components/Forms/Upload.jsx';
import { Search } from '../../Components/Forms/Search';
import FormHeader from '../PageComponents/FormHeader.jsx';
import ConfigExcel from './ConfigExcelUpload.jsx';
import {
configDataSelector,
getConfiguration,
getConfigTypeData,
deleteConfiguration,
postConfiguration,
putConfiguration,
postBulkConfiguration,
postbulkconfigdata,
} from '../../Features/ConfigMasterPage/ConfigMasterPage.js';
import {
configTypeActiveDataSelector,
getActiveConfigTypeNames,
} from '../../Features/ConfigTypePage/ConfigTypePage.js';
import { emptyExcelData } from '../../Features/ExcelUploadPage/ExcelUploadPage.js';
import { getSession, validateSafeInput } from '../../Services/Others';
import TertiaryButton from '../../Components/Forms/tertiaryButton.jsx';
import '../../Components/Forms/main.scss';
import '../../Styles/OverAllStyle/OverAllStyle.scss';
import {
getAllsubcatdata,
getProdCatData,
} from '../../Features/ProductPage/ProductPage.js';
import { useAuth } from '../../AuthContext.jsx';
const subDirectory = import.meta.env.BASE_URL;
const items = [
{
name: 'Home',
link: `${subDirectory}app-page/home`,
},
];
const CommonMaster = () => {
const { SadminuserAccess } = useAuth();
let SAAccessCommonMaster = SadminuserAccess?.find(
(e) => e?.MenuName === 'Common Master'
);
const dispatch = useDispatch();
const [form] = Form.useForm();
const CompId = getSession('CompId');
const BranchId = getSession('BranchId');
const AppId = getSession('AppId');
const UserId = getSession('UserId');
const UserType = getSession('UserType');
const AppType = getSession('AppType');
const CommonData = useSelector(configDataSelector);
const ConfigTypeNames = useSelector(configTypeActiveDataSelector);
const baseConfigTypeOptions = [
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
];
const configTypeOptions =
UserType === 'Super Admin' || UserType === 'Super Admin User'
? [...baseConfigTypeOptions, 'Master Access']
: baseConfigTypeOptions;
const TypeNames =
AppType === 'Wholesale'
? ConfigTypeNames.filter((item) =>
baseConfigTypeOptions.includes(item.TypeName)
) // include only these for Wholesale
: ConfigTypeNames.filter(
(item) => !baseConfigTypeOptions.includes(item.TypeName)
);
const [open, setOpen] = useState(false);
const [EditState, setEditState] = useState(false);
const [filteredInfo, setFilteredInfo] = useState({});
const [sortedInfo, setSortedInfo] = useState({});
const [searchedText, setSearchedText] = useState('');
const [selectedRow, setSelectedRow] = useState(null);
const [messageType, setMessageType] = useState(null);
const [messageData, setMessageData] = useState(null);
const [CommonDataFilter, setCommonDataFilter] = useState([]);
const [showHomeComponent, setShowHomeComponent] = useState(false);
const [imageUrl, setImageUrl] = useState('');
const [radioValue, setRadioValue] = useState('single');
const [categoryOpen, setCategoryOpen] = useState(false);
const [categoryData, setCategoryData] = useState([]);
const [selectedCategory, setSelectedCategory] = useState();
const [selectedSubCategory, setSelectedSubCategory] = useState();
const [subCategoryOpen, setSubCategoryOpen] = useState(false);
const [subCategoryData, setSubCategoryData] = useState([]);
const [selectedNumericId, setselectedNumericId] = useState(null);
const [page, setpage] = useState(1);
const [Exceldatasubmit, setExceldatasubmit] = useState(null);
const [openS, setOpenS] = useState(false);
const [ProductCatdata, setProductCatdata] = useState();
const [subCatData, setSubCatData] = useState();
const [empData, setEmpData] = useState();
const [addnewAccess, setaddnewAccess] = useState(true);
const excludeTypeNames = [
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
];
const systemTypes = [
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'PackingType',
];
useEffect(() => {
try {
dispatch(changeBreadCrumb({ items: items }));
if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
dispatch(getConfiguration({ Type: 'SA' })).unwrap();
dispatch(getActiveConfigTypeNames({ Type: 'SA' })).unwrap();
} else if (UserType === 'Admin' || UserType === 'Employee') {
let TypeName = AppType === 'Wholesale' ? 'AW' : 'A';
dispatch(getActiveConfigTypeNames({ Type: TypeName })).unwrap();
dispatch(getConfiguration({ Type: TypeName })).unwrap();
}
} catch (err) {
console.log(err, 'err');
}
// 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 === 'Common Master'
);
setEmpData(datas?.[0]);
};
useEffect(() => {
if (AppType === 'Wholesale') {
updateCommonDataFilter();
} else {
setCommonDataFilter([
...(Array.isArray(CommonData)
? CommonData.filter(
(data) =>
![
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName)
)
: []),
...(Array.isArray(CommonData)
? CommonData.filter((data) =>
[
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'PackingType',
].includes(data?.TypeName)
).filter((item) => item.AlphaNumFId == AppId)
: []),
]);
}
}, [CommonData]);
const updateCommonDataFilter = () => {
if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
setCommonDataFilter(
CommonData?.filter(
(data) =>
data?.TypeName === 'Master Access' ||
([
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName) &&
data?.AlphaNumFId == AppId)
)
);
} else {
setCommonDataFilter(
CommonData?.filter(
(data) =>
[
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName) && data?.AlphaNumFId == AppId
)
);
}
};
const handleChange = (pagination, filters, sorter) => {
setFilteredInfo(filters);
setSortedInfo(sorter);
};
const handlePageChange = (current) => {
setpage(current);
};
const onComplete = useCallback(() => {
setMessageData(null);
setMessageType(null);
}, []);
const updateImageUrl = (url) => {
setImageUrl(url);
};
//edit
const actionsFormatter = async (row) => {
if (row.ActiveStatus !== 'D') {
await setOpen(true);
await setEditState(true);
setImageUrl(row.SmallIcon);
form.setFieldsValue(row);
setSelectedRow(row);
}
};
const statusFormatter = async (row) => {
let deleteData = {
ConfigId: row.ConfigId,
ActiveStatus: row.ActiveStatus == 'A' ? 'D' : 'A',
UpdatedBy: getSession('UserId'),
};
let response = await dispatch(deleteConfiguration(deleteData)).unwrap();
if (response?.data?.statusCode == 1) {
if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
dispatch(getConfiguration({ Type: 'SA' })).unwrap();
} else if (UserType === 'Admin' || UserType === 'Employee') {
let TypeName = AppType === 'Wholesale' ? 'AW' : 'A';
dispatch(getConfiguration({ Type: TypeName })).unwrap();
}
setMessageType('success');
setMessageData(
row.ActiveStatus == 'A'
? 'In-Activated Successfully'
: 'Activated Successfully'
);
}
};
const openModal = () => {
setOpen(true);
setSelectedSubCategory(null);
form.resetFields();
// Reset the editState to false
setEditState(false);
};
const handleDropDownChange = async (value) => {
form.setFieldsValue({ TypeId: value });
let SubCategoryData = TypeNames?.filter(
(item) => item.TypeId == value && item.TypeName == 'Product Sub-Category'
);
if (SubCategoryData?.length > 0) {
setCategoryOpen(true);
setSubCategoryOpen(false);
let CategoryData = await dispatch(
getConfigTypeData({ TypeName: 'Product Category', AppId: AppId })
).unwrap();
if (CategoryData?.data?.statusCode == 1) {
setCategoryData(CategoryData?.data?.data);
setSubCategoryData([]);
}
} else {
setCategoryOpen(false);
form.resetFields(['CategoryId']);
setSelectedCategory();
}
let BrandData = TypeNames?.filter(
(item) => item.TypeId == value && item.TypeName == 'Product Brand'
);
if (BrandData?.length > 0) {
setSubCategoryOpen(true);
setCategoryOpen(false);
let SubCategoryData = await dispatch(
getConfigTypeData({ TypeName: 'Product Sub-Category', AppId: AppId })
).unwrap();
if (SubCategoryData?.data?.statusCode == 1) {
setSubCategoryData(SubCategoryData?.data?.data);
setCategoryData([]);
}
}
if (SubCategoryData?.data?.data?.length == 0 && BrandData?.length == 0) {
setCategoryOpen(false);
setSubCategoryOpen(false);
setSubCategoryData([]);
setCategoryData([]);
form.setFieldsValue({ NumFId: null });
}
};
const handleCategoryDropDownChange = async (value) => {
setSelectedCategory(value);
form.setFieldsValue({ NumFId: value, CategoryId: value });
setselectedNumericId(value);
};
const handleSubCategoryDropDownChange = async (value) => {
setSelectedSubCategory(value);
form.setFieldsValue({ NumFId: value, SubCategoryId: value });
setselectedNumericId(value);
};
const ConfigSelect = async (e) => {
e !== 'Select' && setpage(1);
if (e === 'Select' && AppType != 'Wholesale') {
setCommonDataFilter([
...CommonData?.filter(
(data) =>
![
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName)
),
...CommonData?.filter((data) =>
[
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
].includes(data?.TypeName)
)?.filter((item) => item.AlphaNumFId == AppId),
]);
} else if (AppType === 'Wholesale' && e === 'Select') {
updateCommonDataFilter();
} else if (AppType === 'Wholesale') {
if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
setCommonDataFilter(
CommonData?.filter(
(data) =>
(data?.TypeName === 'Master Access' ||
([
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName) &&
data?.AlphaNumFId == AppId)) &&
data?.TypeId === parseInt(e)
)
);
} else {
setCommonDataFilter(
CommonData?.filter(
(data) =>
[
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName) &&
data?.AlphaNumFId == AppId &&
data?.TypeId === parseInt(e)
)
);
}
} else {
const filteredItems = [
...CommonData?.filter(
(data) =>
![
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
'Wholesale Designation',
].includes(data?.TypeName)
),
...CommonData?.filter((data) =>
[
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'PackingType',
].includes(data?.TypeName)
)?.filter((item) => item.AlphaNumFId == AppId),
]?.filter((item) => item?.TypeId === parseInt(e));
setCommonDataFilter(filteredItems);
}
};
const SearchFilterFun = async (value) => {
const searchValue = value?.toLowerCase();
if (AppType != 'Wholesale') {
const relevantItems =
CommonData?.filter((item) => {
// ❌ Exclude unwanted types first
if (excludeTypeNames.includes(item.TypeName)) return false;
// ✅ For systemTypes, only include if AppId matches
if (systemTypes.includes(item.TypeName)) {
return item.AlphaNumFId == AppId;
}
// ✅ For all other types, include them
return true;
}) || [];
// Optional: for reference, not used directly here
// alert("jhi")
const filteredItems = relevantItems.filter((item) => {
const typeMatch = item?.TypeName?.toLowerCase().includes(searchValue);
const configMatch =
item?.ConfigName?.toLowerCase().includes(searchValue);
return typeMatch || configMatch;
});
// console.log(relevantItems, "filteredItems");
setCommonDataFilter(filteredItems);
}
// Filter by AppId first
else if (AppType === 'Wholesale') {
if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
setCommonDataFilter(
CommonData?.filter(
(data) =>
(data?.TypeName === 'Master Access' ||
([
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
].includes(data?.TypeName) &&
data?.AlphaNumFId == AppId)) &&
data?.TypeId === parseInt(e)
)
);
} else {
setCommonDataFilter(
CommonData?.filter(
(data) =>
[
'Payment Mode',
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
].includes(data?.TypeName) &&
data?.AlphaNumFId == AppId &&
data?.TypeId === parseInt(e)
)
);
}
}
};
const handleRadioChange = (value) => {
setRadioValue(value);
// Reset the form values
form.resetFields();
};
const onSearch = (value) => {
setSearchedText(value);
SearchFilterFun(value);
};
const onSearchChange = (e) => {
setSearchedText(e?.target?.value);
SearchFilterFun(e?.target?.value);
};
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: 'Type Name',
dataIndex: 'TypeName',
key: 'TypeName',
width: '100px',
render: (text) => (
<a style={{ color: 'black', width: '200px' }}>{text}</a>
),
filteredValue: [searchedText],
onFilter: (value, record) => {
return (
String(record.TypeName)
?.toLowerCase()
.includes(value?.toLowerCase()) ||
String(record.ConfigName)
?.toLowerCase()
.includes(value?.toLowerCase())
);
},
sorter: (a, b) => a?.TypeName?.localeCompare(b.TypeName),
sortOrder: sortedInfo.columnKey === 'TypeName' ? sortedInfo.order : null,
ellipsis: true,
},
{
title: 'Config Name',
dataIndex: 'ConfigName',
key: 'ConfigName',
width: '100px',
render: (text) => <a style={{ color: 'black' }}>{text}</a>,
sorter: (a, b) => a?.ConfigName?.localeCompare(b.ConfigName),
sortOrder:
sortedInfo.columnKey === 'ConfigName' ? sortedInfo.order : null,
ellipsis: true,
},
{
title: 'Action',
key: 'Action',
dataIndex: 'Action',
width: '100px',
align: 'center',
render: (_, record, index) =>
[
...CommonData?.filter(
(data) =>
![
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
].includes(data?.TypeName)
),
...CommonData?.filter((data) =>
[
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
].includes(data?.TypeName)
)?.filter((item) => item.AlphaNumFId == AppId),
]?.length >= 1 ? (
<Space size="middle">
{record.ActiveStatus === 'A' ? (
<a>
<EditFilled
style={{ color: '#1292EE' }}
onClick={() =>
UserType === 'Super Admin' ||
(UserType === 'Super Admin User' &&
SAAccessCommonMaster?.UpdateAccess === 'Y') ||
(UserType === 'Employee' &&
empData?.UpdateAccess === 'Y') ||
UserType === 'Admin'
? actionsFormatter(record, index)
: ''
}
/>
</a>
) : (
''
)}
<a>
{record.ActiveStatus === 'A' ? (
<DeleteFilled
style={{
color: '#FF4D4F',
}}
onClick={() =>
UserType === 'Super Admin' ||
(UserType === 'Super Admin User' &&
SAAccessCommonMaster?.DeleteAccess === 'Y') ||
(UserType === 'Employee' &&
empData?.DeleteAccess === 'Y') ||
UserType === 'Admin'
? statusFormatter(record)
: ''
}
/>
) : (
<ReloadOutlined
style={{
color: '#52C41A',
}}
onClick={() =>
UserType === 'Super Admin' ||
(UserType === 'Super Admin User' &&
SAAccessCommonMaster?.DeleteAccess === 'Y') ||
(UserType === 'Employee' &&
empData?.DeleteAccess === 'Y') ||
UserType === 'Admin'
? statusFormatter(record)
: ''
}
/>
)}
</a>
</Space>
) : null,
},
];
useEffect(() => {
Bulkuploadsubdata();
}, []);
const Bulkuploadsubdata = async () => {
let res = await dispatch(getProdCatData({ AppId: AppId })).unwrap();
setProductCatdata(res?.data?.data);
let response = await dispatch(
getAllsubcatdata({ AppId: AppId, TypeName: 'Product Sub-Category' })
).unwrap();
setSubCatData(response?.data?.data);
};
const handleCancel = () => {
setImageUrl('');
setOpen(false);
handleResetExcelData();
};
const handleCancelNew = () => {
setOpenS(false);
setOpen(false);
handleResetExcelData();
};
const openModal1 = () => {
setOpenS(true);
};
const handleResetExcelData = () => {
dispatch(emptyExcelData());
};
const handleSubmitbulk = (excelData) => {
setExceldatasubmit(excelData);
};
const handleSubmit = async () => {
if (radioValue === 'single') {
const values = await form.validateFields();
const AppCommonData = TypeNames?.filter((data) =>
[
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
].includes(data?.TypeName)
)?.filter((item) => item.TypeId == values.TypeId);
const postData = {
TypeId: values.TypeId,
ConfigName: values.ConfigName,
AlphaNumFId: AppCommonData?.length > 0 ? AppId : null,
NumFId: selectedNumericId,
SmallIcon: imageUrl,
CreatedBy: getSession('UserId'),
};
let response = {};
if (!EditState) {
response = await dispatch(postConfiguration(postData)).unwrap();
} else {
if (selectedRow) {
const AppCommonData = TypeNames?.filter((data) =>
[
'Product Category',
'Product Sub-Category',
'Product Brand',
'Product Tax',
'Designation',
'Product Quality',
'Wholesale Extra Charges',
'Wholesale Unit Of Measure',
'Wholesale Quantity',
'Wholesale Screen Name',
'Wholesale Payment Mode',
].includes(data?.TypeName)
)?.filter((item) => item.TypeId == selectedRow.TypeId);
const putData = {
ConfigId: selectedRow.ConfigId,
ConfigName: values.ConfigName,
AlphaNumFId: AppCommonData?.length > 0 ? AppId : null,
TypeId: selectedRow.TypeId,
NumFId: selectedRow.NumFId,
UpdatedBy: getSession('UserId'),
SmallIcon: imageUrl,
// AlphaNumFId: EditData.AlphaNumFId,
// NumFId: EditData.NumFId,
};
response = await dispatch(putConfiguration(putData)).unwrap();
}
}
if (response?.data?.statusCode == 1) {
setImageUrl('');
setMessageType('success');
setMessageData(response?.data?.response);
handleCancel();
form.resetFields();
setSelectedCategory();
if (UserType === 'Super Admin' || UserType === 'Super Admin User') {
dispatch(getConfiguration({ Type: 'SA' })).unwrap();
} else if (UserType === 'Admin' || UserType === 'Employee') {
let TypeName = AppType === 'Wholesale' ? 'AW' : 'A';
dispatch(getConfiguration({ Type: TypeName })).unwrap();
}
} else {
setImageUrl('');
setMessageType('error');
setMessageData(response?.data?.response);
}
}
};
const handleSubmitNew = async () => {
let FilterData = Exceldatasubmit?.filter((a) => a['CategoryName'] != '');
if (FilterData && FilterData.length > 0) {
const formattedData = FilterData.map((data) => {
// Declare configDetails before any conditional logic
let configDetails = [];
// Validation logic based on TypeName
if (data?.TypeName === 'Product Category') {
configDetails.push({
ConfigName: data?.CategoryName,
// NumFId: data?.CategoryName, // Use CategoryName for NumFId
});
} else if (data?.TypeName === 'Product Sub-Category') {
configDetails.push({
ConfigName: data?.CategoryName,
NumFId: data?.SubCategoryName, // Use SubCategory for NumFId
});
} else if (data?.TypeName === 'Product Brand') {
configDetails.push({
ConfigName: data?.SubCategoryName,
NumFId: data?.BrandName, // Use Brand for NumFId
});
} else {
// Handle unrecognized TypeName
console.error(`Unknown TypeName: ${data?.TypeName}`);
}
// Return the formatted object
return {
TypeName: data?.TypeName,
AlphaNumFId: getSession('AppId'),
CreatedBy: getSession('UserId'),
ConfigDetails: configDetails,
};
});
let postData = { configMasterDetailsJson: formattedData };
let response = await dispatch(postbulkconfigdata(postData)).unwrap();
if (response?.data?.statusCode == 1) {
setMessageType('success');
setMessageData(response?.data?.response);
dispatch(getConfiguration({ Type: 'SA' }));
} else {
setMessageType('error');
setMessageData(response?.data?.response);
}
handleResetExcelData();
handleCancelNew();
} else {
setMessageType('error');
setMessageData('No data to submit. Please upload an Excel file.');
}
};
const CategoryNames = ProductCatdata?.map((e) => e.ConfigName);
const Subcatnames = subCatData?.map((e) => e.ConfigName);
return (
<div className="userPageTable">
<div className="userPageContent">
<Messages
messageType={messageType}
messageData={messageData}
onComplete={onComplete}
/>
<div className="CommmasterPageHeader">
<div>
<FormHeader title={'Common Master'} />
</div>
<div className="formFields">
<div className="formSearch">
<Search
placeholder="Search by Type Name/Config Name"
onSearch={onSearch}
onSearchChange={onSearchChange}
/>
</div>
{/* {CommonDataFilter?.length > 0 && */}
<Form.Item
name="Config Type"
rules={[
{
required: true,
message: 'Please Select Config Type',
},
]}
>
<DropDowns
options={[
{ value: 'Select', label: 'All' }, // Add "Select" option
...TypeNames?.map((option) => ({
value: option.TypeId,
label: option.TypeName,
})),
]}
defaultValue="Select" // Set "Select" as the default value
// placeholder="Config Type"
label="Config Type"
onChangeFunction={(e) => ConfigSelect(e)}
isOnchanges={true}
className="field-DropDown"
onFilter={(value, record) =>
String(record.TypeName)
?.toLowerCase()
?.includes(value?.toLowerCase())
}
/>
</Form.Item>
{/* // } */}
</div>
</div>
<div>
{AppType !== 'Wholesale' ? (
<div
className="commonMaster-btn"
style={{
display: 'flex',
height: '50px',
gap: '5px',
justifyContent: 'flex-end',
}}
>
<div>
<TertiaryButton
buttonText="Import / Export Excel"
className="tertiary_Button"
disabled={addnewAccess}
handleSubmit={openModal1}
/>
</div>
<div>
<div className="productMaster-input">
<Buttons
buttonText="Add New"
className="tertiary_Button"
color="901D77"
handleSubmit={openModal}
disabled={addnewAccess}
icon={<PlusOutlined />}
>
OPEN
</Buttons>
</div>
</div>
</div>
) : (
<div>
<div className="productMaster-input">
<Buttons
buttonText="Add New"
className="tertiary_Button"
color="901D77"
handleSubmit={openModal}
disabled={addnewAccess}
icon={<PlusOutlined />}
>
OPEN
</Buttons>
</div>
</div>
)}
</div>
<div className="reportTable">
<Tables
columns={columns}
data={CommonDataFilter}
pagination={handlePageChange}
onChange={handleChange}
/>
</div>
</div>
<DefaultModal
open={open}
title="Common Master"
footer={true}
children={
<>
<div className="configMsrMainDiv">
<Form form={form}>
<div className="configMsrSubDiv">
<Form.Item
name="TypeId"
rules={[
{
required: true,
message: 'Please Select Config Type',
},
]}
>
<DropDowns
options={[
// { value: "Select", label: "All" }, // Add "Select" option
...TypeNames?.map((option) => ({
value: option.TypeId,
label: option.TypeName,
})),
]}
// placeholder="ConfigType"
label={<label class="required">Config Type</label>}
optionsNames={{ value: 'TypeId', label: 'TypeName' }}
className="field-DropDown"
// isOnchanges={true}
onChangeFunction={handleDropDownChange}
// defaultValue="Select" // Set "Select" as the default value
valueData={EditState ? selectedRow?.TypeId : undefined}
disabled={!!EditState}
/>
</Form.Item>
{categoryOpen && (
<Form.Item
name="CategoryId"
rules={[
{
required: true,
message: 'Please Select Category',
},
]}
>
<DropDowns
options={[
// // Add "Select" option
// { value: "Select", label: "All" },
...categoryData?.map((option) => ({
value: option.ConfigId,
label: option.ConfigName,
})),
]}
// placeholder="Category"
label={<label class="required">Category</label>}
optionsNames={{
value: 'ConfigId',
label: 'ConfigName',
}}
className="field-DropDown"
// isOnchanges={true}
onChangeFunction={handleCategoryDropDownChange}
// defaultValue="Select" // Set "Select" as the default value
valueData={selectedCategory}
/>
</Form.Item>
)}
{subCategoryOpen && (
<Form.Item
name="SubCategoryId"
rules={[
{
required: true,
message: 'Please Select SubCategory',
},
]}
>
<DropDowns
options={[
// // Add "Select" option
// { value: "Select", label: "All" },
...subCategoryData?.map((option) => ({
value: option.ConfigId,
label: option.ConfigName,
})),
]}
// placeholder="Sub-Category"
label={<label class="required">Sub-Category</label>}
optionsNames={{
value: 'ConfigId',
label: 'ConfigName',
}}
className="field-DropDown"
// isOnchanges={true}
onChangeFunction={handleSubCategoryDropDownChange}
// defaultValue="Select" // Set "Select" as the default value
valueData={selectedSubCategory}
/>
</Form.Item>
)}
<Form.Item
name="ConfigName"
rules={[
{
required: true,
pattern: /^(?!\s*$).+/,
message: 'Please Enter Config Name',
},
{
validator: async (_, value) => {
await validateSafeInput(value);
if (value && value.length > 50) {
return Promise.reject(
'Config Name should not exceed 50 characters'
);
}
return Promise.resolve();
},
},
]}
>
<InputField
label={<label class="required">Config Name</label>}
autocomplete="off"
isOnChange={EditState ? true : false}
/>
</Form.Item>
</div>
<div className="upload_btn">
<p>Upload Icon</p>
<br />
<div style={{ width: 'max-content' }}>
<Imageupload
singleImage={true}
updateImageUrl={updateImageUrl}
ImageLink={imageUrl ? imageUrl : ''}
/>
</div>
</div>
</Form>
</div>
{radioValue === 'multiple' && !EditState && (
// Render the content for the "Multiple" option
<div>
<ConfigExcel
handleSubmit={handleSubmitbulk}
showHomeComponent={showHomeComponent}
/>
</div>
)}
</>
}
handleCancel={handleCancel}
handleSubmit={handleSubmit}
/>
<DefaultModal
open={openS}
title="Bulk Upload"
footer={true}
width={700}
children={
<>
<ConfigExcel
CategoryNames={CategoryNames}
SubCatData={Subcatnames}
handleSubmit={handleSubmitbulk}
/>
</>
}
handleSubmit={handleSubmitNew}
handleCancel={handleCancelNew}
/>
</div>
);
};
export default CommonMaster;