karthikalakshmi
/
Android_Retail
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

i just added Custom Field Feature

This commit is contained in:
Tamilselvan 2026-01-28 18:55:01 +05:30
parent 81b3e4b84f
commit 7e2f18ce33
1 changed files with 201 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

178
src/Pages/BookingScreen/Forms/QuickAdd/QuickAdd.jsx
View File

@ -6,6 +6,7 @@ import {
PlusCircleOutlined,
InfoCircleOutlined,
} from '@ant-design/icons';
import { IoSettingsOutline } from "react-icons/io5";
import Buttons from '../../../../Components/Forms/Buttons.jsx';
import { InputField } from '../../../../Components/Forms/InputField.jsx';
import { Messages } from '../../../../Components/Notifications/Messages';
@ -31,7 +32,9 @@ import {
supplierSelector,
postProductData,
postTax,
getHsnData
getHsnData,
getFieldSetupData,
postFieldSetup
} from '../../../../Features/ProductPage/ProductPage.js';
import {
ChangeNewQrProduct,
@ -78,8 +81,12 @@ const ProductForm = ({
const productFieldPreferences = appPreferences?.find(
(preference) => preference?.PreferredCatName?.toLowerCase() === "product form fields"
)?.PreferenceCatDetails;
// const CustomQuickAddField = appPreferences?.find(
// (preference) => preference?.PreferredCatName?.toLowerCase() === "quick add custom fields"
// )?.PreferenceCatDetails;
const categoryId = appPreferences?.find(
p => p?.PreferredCatName?.toLowerCase() === "quick add custom fields"
)?.PreferredCatId;
const UomTypePreference = appPreferences?.find((preference) => preference?.PreferredCatName === 'Product Uom')?.PreferenceCatDetails
const UomPreference = UomData?.filter((item) => UomTypePreference?.some?.((e) => e?.PreferredSubCatName?.toLowerCase() == item?.ConfigName?.toLowerCase() && e?.PreferredStatus == "Y"))
@ -87,6 +94,7 @@ const ProductForm = ({
const filteredFields = productFieldPreferences?.filter(
(field) => field?.PreferredStatus === 'Y'
);
const cessField = filteredFields?.find((field) => field?.PreferredSubCatName === 'Cess');
const hsnField = filteredFields?.find((field) => field?.PreferredSubCatName === 'HSN');
const taxField = filteredFields?.find((field) => field?.PreferredSubCatName === 'Tax');
@ -95,15 +103,21 @@ const ProductForm = ({
const [messageType, setMessageType] = useState(null);
const [messageData, setMessageData] = useState(null);
const [SelectedUom, setSelectedUom] = useState(null);
const [SelectedTaxId, setSelectedTaxId] = useState(null);
const [SelectedTaxNameId, setSelectedTaxNameId] = useState(null);
const [OpenTaxModel, setOpenTaxModel] = useState(false);
const [OpenAdd, setOpenAdd] = useState(false);
// const [OpenAdd, setOpenAdd] = useState(false);
const [imageBrandUrl, setBrandImageUrl] = useState('');
const [selectedHsn, setSelectedHsn] = useState("");
const [HsnDetails, setHsnDetails] = useState([]);
const [selectedAdditionalColumn, setSelectedAdditionalColumn] = useState([]);
const [showColumnModal, setShowColumnModal] = useState(false);
const [tempSelectedColumns, setTempSelectedColumns] = useState([]);
const [tableFieldPreferences, setTableFieldPreferences] = useState([]);
const [selectedFields, setSelectedFields] = useState([]);
console.log(selectedAdditionalColumn, "selectedAdditionalColumn")
console.log(tempSelectedColumns, "tempSelectedColumns")
const CompId = getSession('CompId');
const BranchId = getSession('BranchId');
const AppId = getSession('AppId');
@ -149,19 +163,39 @@ const ProductForm = ({
setSelectedTaxId(TaxId);
}
}, [TaxData]);
useEffect(() => {
getFieldSetup();
}, [categoryId])
const getFieldSetup = async () => {
try {
const response = await dispatch(getFieldSetupData({ AppId, CompId, BranchId, categoryId, Type: "QA" })).unwrap();
if (response?.data?.statusCode === 1) {
console.log(response?.data?.data?.[0]?.ConfigDtl, "Field Setup Data");
setSelectedFields(response?.data?.data?.[0]?.ConfigDtl?.filter(c => c.ConfigId && c.Access === 'Y')?.map(c => c.ConfigId) || []);
setSelectedAdditionalColumn(response?.data?.data?.[0]?.ConfigDtl?.filter(c => c.ConfigId && c.Access === 'Y')?.map(c => c.ConfigName) || [])
setTableFieldPreferences(response?.data?.data?.[0]?.ConfigDtl?.map(c => ({
value: c.ConfigId,
label: c.ConfigName,
access: c.Access
})) || []);
}
} catch (error) {
console.error('Error fetching field setup:', error);
}
};
const onComplete = useCallback(() => {
setMessageData(null);
setMessageType(null);
}, []);
const openAdditionalDetails = () => {
if (OpenAdd) {
setOpenAdd(false);
} else {
setOpenAdd(true);
}
};
// const openAdditionalDetails = () => {
// if (OpenAdd) {
// setOpenAdd(false);
// } else {
// setOpenAdd(true);
// }
// };
const getApplicationPreference = async () => {
@ -367,7 +401,7 @@ const ProductForm = ({
setSelectedUom(null);
setSelectedTaxId(null);
handleCancelData();
setOpenAdd(false);
// setOpenAdd(false);
if (ProductSearchType != 'C') {
let data = {
CompId: CompId,
@ -444,6 +478,36 @@ const ProductForm = ({
}
}
const handleFieldSetupSubmit = async () => {
const postData = {
"AppId": AppId,
"CompId": CompId,
"BranchId": BranchId,
"Type": "QA",
"FormType": "Quick Add",
"TypeId": categoryId,
"ConfigDtl": selectedFields?.map((field) => ({
"ConfigId": field,
"Access": 'Y',
})),
"CreatedBy": UserId
}
const response = await dispatch(postFieldSetup(postData))?.unwrap();
if (response?.data?.statusCode === 1) {
setSelectedAdditionalColumn([...tempSelectedColumns]);
setShowColumnModal(false);
setTempSelectedColumns([])
setMessageType("success");
setMessageData(response?.data?.response);
await getFieldSetup();
} else {
setMessageType("error");
setMessageData("Failed to set up fields");
}
}
return (
<div>
<Messages
@ -455,6 +519,27 @@ const ProductForm = ({
<FormHeader title={'Quick Add'} />
</div>
<div>
<div style={{
display: 'flex', alignItems: 'center', gap: '10px', justifyContent: "flex-end"
, fontFamily: "Poppins", fontWeight: "500", textDecoration: "underline", cursor: "Pointer", width: "100%"
}}
onClick={() => {
setTempSelectedColumns([...selectedAdditionalColumn]);
setShowColumnModal(true);
}}>
<Tooltip title="Add Fields" placement="left">
{/* <span>Additional Fields</span> */}
<IoSettingsOutline
onClick={() => {
setTempSelectedColumns([...selectedAdditionalColumn]);
setShowColumnModal(true);
}}
style={{ cursor: 'pointer', fontSize: '20px' }}
/>
</Tooltip>
</div>
<Form ref={formRef} className="formDivAnt" onFinish={onFinish}>
<div>
<div className="productinputForm">
@ -667,9 +752,10 @@ const ProductForm = ({
</div>
)}
{OpenAdd && (
{true && (
<>
{taxField && <Form.Item name="TaxId">
{(taxField && selectedAdditionalColumn?.includes('Tax')) &&
<Form.Item name="TaxId">
<DropDowns
options={TaxData?.map((option) => ({
value: option.TaxId,
@ -685,12 +771,16 @@ const ProductForm = ({
onChangeFunction={handleTaxDropDownChange}
valueData={SelectedTaxId}
/>
</Form.Item>
}
{(taxField && selectedAdditionalColumn?.includes('Tax')) &&
<Form.Item name="TaxId">
<Tooltip title="Add Tax" placement="top">
<PlusCircleOutlined onClick={addTax} />
</Tooltip>
</Form.Item>}
{cessField && <Form.Item
{(cessField && selectedAdditionalColumn?.includes('Cess')) && <Form.Item
name="Cess"
rules={[
{
@ -708,7 +798,7 @@ const ProductForm = ({
<InputField autoComplete="off" label="Cess" />
</Form.Item>}
{hsnField &&
{(hsnField && selectedAdditionalColumn?.includes('Hsn Code')) &&
<Form.Item
name="HSNCode"
rules={[
@ -779,6 +869,7 @@ const ProductForm = ({
}
{selectedAdditionalColumn?.includes('WholeSale') &&
<Form.Item
name="WhSalePrice"
rules={[
@ -799,12 +890,13 @@ const ProductForm = ({
label={<label>WholeSale</label>}
/>
</Form.Item>
}
</>
)}
</div>
<div className="prodAddDetails" onClick={openAdditionalDetails}>
{/* <div className="prodAddDetails" onClick={openAdditionalDetails}>
Additional Details
</div>
</div> */}
</div>
</div>
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
@ -823,6 +915,7 @@ const ProductForm = ({
open={OpenTaxModel}
footer={true}
buttonText="Submit"
destroyOnClose={true}
children={
<Form ref={formTaxRef} className="formDivAnt">
<div className="subRowFlex">
@ -901,6 +994,51 @@ const ProductForm = ({
handleSubmit={submitTax}
handleCancel={handleTax}
></DefaultModal>
<DefaultModal
title="Select Additional Fields"
open={showColumnModal}
footer={true}
buttonText="Apply"
destroyOnClose={true}
handleSubmit={handleFieldSetupSubmit}
handleCancel={() => {
setShowColumnModal(false);
setSelectedFields([...selectedAdditionalColumn.map(col =>
tableFieldPreferences?.find(pref => pref.label === col)?.value
).filter(Boolean)]);
setTempSelectedColumns([...selectedAdditionalColumn]);
}}
>
<div style={{ padding: '20px' }}>
{tableFieldPreferences?.map((option) => (
<div key={option.value} className='Customized_QuickAdd'>
<label>
<input
type="checkbox"
checked={selectedFields?.includes(option.value)}
onChange={(e) => {
const isChecked = e.target.checked;
setSelectedFields(prev =>
isChecked
? [...prev, option.value]
: prev.filter(item => item !== option.value)
);
setTempSelectedColumns(prev =>
isChecked
? [...prev, option.label]
: prev.filter(item => item !== option.label)
);
}}
style={{ marginRight: '8px' }}
/>
{option.label}
</label>
</div>
))}
</div>
</DefaultModal>
</div>
</div>
);