Merge pull request 'Fix #2: Add product-wise and stock-wise QR code copy support' (#4) from Tamil into main
Reviewed-on: Pozomind/pozo-retail-app#4
This commit is contained in:
commit
81b3e4b84f
|
|
@ -12,6 +12,7 @@ import {
|
|||
Radio,
|
||||
Button,
|
||||
Empty,
|
||||
message,
|
||||
} from 'antd';
|
||||
import { debounce } from 'lodash';
|
||||
import {
|
||||
|
|
@ -99,6 +100,8 @@ import ScannedProductTable from '../../Components/PedalOCR/scannedProductTable.j
|
|||
import MultiCameraCropOCR from '../../Components/PedalOCR/MultiCameraCropOCR.jsx';
|
||||
import OCRLoader from '../../Components/PedalOCR/OCRLoader.jsx';
|
||||
import { GiHorizontalFlip, GiVerticalFlip } from 'react-icons/gi';
|
||||
import { FaPlus } from "react-icons/fa6";
|
||||
import { Tables } from '../../../ownLib/my-ui-lib.js';
|
||||
|
||||
const colorText = 'Color : Red';
|
||||
const ProductList = () => {
|
||||
|
|
@ -129,6 +132,7 @@ const ProductList = () => {
|
|||
const [SearchProdData, setSearchProdData] = useState([]);
|
||||
const [productData, setproductData] = useState([]);
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
const [activeTab, setActiveTab] = useState('stock');
|
||||
let SalesStatus = productData?.[0]?.SalesStatus;
|
||||
const UomData = useSelector(uomDataSelector);
|
||||
const ProdCatData = useSelector(prodCatDataSelector);
|
||||
|
|
@ -177,7 +181,6 @@ const ProductList = () => {
|
|||
const [uploadImageModal, setUploadImageModal] = useState(false);
|
||||
const [MultiCode, setMultiCode] = useState(false);
|
||||
const [selectedRecords, setSelectedRecords] = useState([]);
|
||||
console.log(QrandbarcodeDatas, 'QrandbarcodeDatas');
|
||||
const [imageModalRowIndex, setImageModalRowIndex] = useState(null);
|
||||
const [rowRecord, setRowRecord] = useState(null);
|
||||
const [sortedInfo, setSortedInfo] = useState({});
|
||||
|
|
@ -261,11 +264,15 @@ const ProductList = () => {
|
|||
const [imageUrl, setImageUrl] = useState('');
|
||||
const [recordIndex, setRecordIndex] = useState(null);
|
||||
|
||||
|
||||
const [rangeFrom, setRangeFrom] = useState('');
|
||||
const [rangeTo, setRangeTo] = useState('');
|
||||
const [deleteInput, setDeleteInput] = useState(null);
|
||||
const [stockWiseQrcode, setstockWiseQrcode] = useState(false);
|
||||
const [productWiseQrcode, setProductWiseQrcode] = useState(false);
|
||||
const lastRangeIdsRef = useRef([]);
|
||||
|
||||
|
||||
const subDirectory = import.meta.env.ENV_BASE_URL;
|
||||
// const [openTour, setOpenTour] = useState(false);
|
||||
|
||||
|
|
@ -289,6 +296,9 @@ const ProductList = () => {
|
|||
link: `${subDirectory}setting/product-master`,
|
||||
},
|
||||
];
|
||||
// const stockAvailableCount = selectedRecords?.filter(
|
||||
// item => item?.StockAvailable === "Y"
|
||||
// ).length
|
||||
const Qrcode = (record) => {
|
||||
setProName(record?.ProdName);
|
||||
setProdId(record?.QRCode);
|
||||
|
|
@ -882,7 +892,8 @@ const ProductList = () => {
|
|||
}
|
||||
});
|
||||
};
|
||||
const CreateQrcode = async (isChecked, code) => {
|
||||
const CreateQrcode = async (isChecked, code, productName, StockAvailable, copiesCount = 0) => {
|
||||
|
||||
if (!code) return;
|
||||
|
||||
if (isChecked) {
|
||||
|
|
@ -892,6 +903,9 @@ const ProductList = () => {
|
|||
{
|
||||
key: code,
|
||||
url: data,
|
||||
productName: productName,
|
||||
copiesCount: copiesCount,
|
||||
StockAvailable: StockAvailable
|
||||
},
|
||||
]);
|
||||
} else {
|
||||
|
|
@ -905,7 +919,7 @@ const ProductList = () => {
|
|||
for (let i = 0; i < products.length; i += batchSize) {
|
||||
const batch = products.slice(i, i + batchSize);
|
||||
await Promise.all(
|
||||
batch.map((product) => CreateQrcode(true, product.QRCode))
|
||||
batch.map((product) => CreateQrcode(true, product.QRCode, product.ProdName, product.StockAvailable, product.TotalBalanceQty))
|
||||
);
|
||||
// Small delay to prevent UI blocking
|
||||
if (i + batchSize < products.length) {
|
||||
|
|
@ -913,7 +927,7 @@ const ProductList = () => {
|
|||
}
|
||||
}
|
||||
} else {
|
||||
products.forEach((product) => CreateQrcode(false, product.QRCode));
|
||||
products.forEach((product) => CreateQrcode(false, product.QRCode, product.ProdName, product.StockAvailable, product.TotalBalanceQty));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -1080,7 +1094,7 @@ const ProductList = () => {
|
|||
)}
|
||||
onChange={(e) => {
|
||||
handleCheckboxChange(record, e.target.checked);
|
||||
CreateQrcode(e.target.checked, record.QRCode);
|
||||
CreateQrcode(e.target.checked, record.QRCode, record?.ProdName, record?.StockAvailable, record?.TotalBalanceQty);
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
|
|
@ -1735,9 +1749,17 @@ const ProductList = () => {
|
|||
}
|
||||
}
|
||||
};
|
||||
const generateQRCode = (code) =>
|
||||
QrandbarcodeDatas?.find((e) => e?.key === code)?.url;
|
||||
const generateQRCode = (code) => {
|
||||
let Data = QrandbarcodeDatas?.find((e) => e?.key === code)?.url;
|
||||
return Data
|
||||
}
|
||||
|
||||
const generateQRCodeCopy = (code) => {
|
||||
const found = QrandbarcodeDatas?.find((e) => e?.key === code);
|
||||
const count = Number(found?.copiesCount);
|
||||
return Number.isFinite(count) && count > 0 ? count : 0;
|
||||
|
||||
};
|
||||
const imageUrlToBase64 = async (url) => {
|
||||
try {
|
||||
const response = await fetch(url);
|
||||
|
|
@ -2202,6 +2224,11 @@ const ProductList = () => {
|
|||
}
|
||||
}, [ProdId]);
|
||||
|
||||
|
||||
const totalCopies = QrandbarcodeDatas?.reduce(
|
||||
(sum, item) => sum + Number(item?.copiesCount || 0),
|
||||
0
|
||||
);
|
||||
const convertSvgToBase64 = (svgElement) => {
|
||||
try {
|
||||
const svgData = new XMLSerializer().serializeToString(svgElement);
|
||||
|
|
@ -2302,6 +2329,7 @@ const ProductList = () => {
|
|||
setOpen(false);
|
||||
formRef?.current?.resetFields();
|
||||
setSelectedRecords([]);
|
||||
setQrandbarcodeDatas([])
|
||||
setMultiCode(false);
|
||||
setNickName(null);
|
||||
};
|
||||
|
|
@ -2612,6 +2640,50 @@ const ProductList = () => {
|
|||
footer={false}
|
||||
children={
|
||||
<Form ref={formRef} onFinish={onFinish}>
|
||||
|
||||
{MultiCode && <div className="printtabs">
|
||||
<div
|
||||
className={`tab-item ${activeTab === 'stock' ? 'active' : ''}`}
|
||||
onClick={() => setActiveTab('stock')}
|
||||
>
|
||||
Stock Wise <span className="count">({selectedRecords?.length})</span>
|
||||
<div>
|
||||
|
||||
<div className="AddStockMinatain" onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setstockWiseQrcode(true);
|
||||
}}
|
||||
style={{
|
||||
animation: activeTab === 'stock' ? 'blink 1s infinite' : 'none'
|
||||
}}>
|
||||
|
||||
<FaPlus
|
||||
|
||||
/> Add
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className={`tab-item ${activeTab === 'product' ? 'active' : ''}`}
|
||||
onClick={() => setActiveTab('product')}
|
||||
>
|
||||
Product Wise <span className="count">({selectedRecords?.length})</span>
|
||||
<div className="AddStockMinatain" onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setProductWiseQrcode(true);
|
||||
}} style={{
|
||||
animation: activeTab === 'product' ? 'blink 1s infinite' : 'none'
|
||||
}}>
|
||||
|
||||
<FaPlus
|
||||
|
||||
|
||||
/> Add
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>}
|
||||
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '1rem' }}>
|
||||
<Form.Item
|
||||
name="Cross"
|
||||
|
|
@ -2847,7 +2919,7 @@ const ProductList = () => {
|
|||
>
|
||||
{nickName
|
||||
? nickName
|
||||
: proName}
|
||||
: (proName || 'Product Name')}
|
||||
</div>
|
||||
)}
|
||||
{mrp && (
|
||||
|
|
@ -2895,9 +2967,9 @@ const ProductList = () => {
|
|||
<p
|
||||
className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 8 ? 'text-ellipsis' : ''}`}
|
||||
>
|
||||
{proName} ({size})
|
||||
{proName || 'Product Name'} ({size || '1 PCS'})
|
||||
</p>
|
||||
<p>{ProdId}</p>
|
||||
<p>{ProdId || 'QR579890770'}</p>
|
||||
</div>
|
||||
<img
|
||||
src={qrCodeImage}
|
||||
|
|
@ -3053,7 +3125,7 @@ const ProductList = () => {
|
|||
: 'product-sizeSmall2'
|
||||
}
|
||||
>
|
||||
({size})
|
||||
({size || '1 PCS'})
|
||||
</span>
|
||||
</p>
|
||||
<div
|
||||
|
|
@ -3066,11 +3138,11 @@ const ProductList = () => {
|
|||
}}
|
||||
>
|
||||
<img
|
||||
src={base64Image}
|
||||
src={qrCodeImage}
|
||||
className="sticker25-img"
|
||||
alt="barcode"
|
||||
/>
|
||||
<p class="product-id2">{ProdId}</p>
|
||||
<p class="product-id2">{ProdId || 'QR8575956'}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
@ -3169,9 +3241,9 @@ const ProductList = () => {
|
|||
<p
|
||||
className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
|
||||
>
|
||||
{proName} ({size})
|
||||
{proName || 'Product Name'} ({size || '1 PCS'})
|
||||
</p>
|
||||
<p>{ProdId}</p>
|
||||
<p>{ProdId || 'QR74478578'}</p>
|
||||
</div>
|
||||
<img
|
||||
src={qrCodeImage}
|
||||
|
|
@ -3266,7 +3338,7 @@ const ProductList = () => {
|
|||
)}
|
||||
{mrp && (
|
||||
<div className="MRPBQ">
|
||||
{'MRP : ' + detail?.MRP}
|
||||
{'MRP : ' + (detail?.MRP || 10.0)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
@ -3297,9 +3369,9 @@ const ProductList = () => {
|
|||
<p
|
||||
className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
|
||||
>
|
||||
{proName} ({size})
|
||||
{proName || 'Product Name'} ({size || '1 PCS'})
|
||||
</p>
|
||||
<p>{ProdId}</p>
|
||||
<p>{ProdId || 'QR987968'}</p>
|
||||
</div>
|
||||
<img
|
||||
src={qrCodeImage}
|
||||
|
|
@ -3380,7 +3452,7 @@ const ProductList = () => {
|
|||
)}
|
||||
{mrp && (
|
||||
<div className="MRPBQ">
|
||||
{'MRP : ' + detail?.MRP}
|
||||
{'MRP : ' + (detail?.MRP || '10.0')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
@ -3411,9 +3483,9 @@ const ProductList = () => {
|
|||
<p
|
||||
className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
|
||||
>
|
||||
{proName} ({size})
|
||||
{proName || 'Product Name'} ({size || '1 PCS'})
|
||||
</p>
|
||||
<p>{ProdId}</p>
|
||||
<p>{ProdId || 'QR8798639'}</p>
|
||||
</div>
|
||||
<img
|
||||
src={qrCodeImage}
|
||||
|
|
@ -3479,7 +3551,7 @@ const ProductList = () => {
|
|||
{sellingPrice && (
|
||||
<div className="SellingpriceBQ">
|
||||
{`Selling Price : ` +
|
||||
detail?.SellPrice}
|
||||
(detail?.SellPrice || '10.0')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
@ -3510,9 +3582,9 @@ const ProductList = () => {
|
|||
<p
|
||||
className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
|
||||
>
|
||||
{proName} ({size})
|
||||
{proName || 'Product Name'} ({size || '1 PCS'})
|
||||
</p>
|
||||
<p>{ProdId}</p>
|
||||
<p>{ProdId || 'QR0970970'}</p>
|
||||
</div>
|
||||
<img
|
||||
src={qrCodeImage}
|
||||
|
|
@ -3573,13 +3645,13 @@ const ProductList = () => {
|
|||
)}
|
||||
{mrp && (
|
||||
<div className="MRPBQ">
|
||||
{'MRP : ' + detail?.MRP}
|
||||
{'MRP : ' + (detail?.MRP || '10.0')}
|
||||
</div>
|
||||
)}
|
||||
{sellingPrice && (
|
||||
<div className="SellingpriceBQ">
|
||||
{`Selling Price : ` +
|
||||
detail?.SellPrice}
|
||||
(detail?.SellPrice || '10.0')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
@ -3618,9 +3690,9 @@ const ProductList = () => {
|
|||
<p
|
||||
className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
|
||||
>
|
||||
{proName} ({size})
|
||||
{proName || 'Product Name'} ({size || '1 PCS'})
|
||||
</p>
|
||||
<p>{ProdId}</p>
|
||||
<p>{ProdId || 'QR858755'}</p>
|
||||
</div>
|
||||
<img
|
||||
src={qrCodeImage}
|
||||
|
|
@ -3726,7 +3798,7 @@ const ProductList = () => {
|
|||
)}
|
||||
{mrp && (
|
||||
<div className="MRPBQ">
|
||||
{'MRP : ' + detail?.MRP}
|
||||
{'MRP : ' + (detail?.MRP || '10.0')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
@ -3773,25 +3845,25 @@ const ProductList = () => {
|
|||
<p>
|
||||
SIZE:{' '}
|
||||
<span className="field-value">
|
||||
{size}
|
||||
{size || '1 PCS'}
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
Id:{' '}
|
||||
<span className="field-value">
|
||||
{ProdId}
|
||||
{ProdId || 'QR86868'}
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
MRP:{' '}
|
||||
<span className="field-value">
|
||||
{'MRP : ' + detail?.MRP}
|
||||
{'MRP : ' + (detail?.MRP || '10.0')}
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
Selling Price:{' '}
|
||||
<span className="field-value">
|
||||
{detail?.SellPrice}
|
||||
{(detail?.SellPrice || '10.0')}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -3833,7 +3905,7 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
{!MultiCode && <Form.Item
|
||||
name="Copies"
|
||||
rules={[
|
||||
{
|
||||
|
|
@ -3857,7 +3929,7 @@ const ProductList = () => {
|
|||
CopiesOnChange(e?.target?.value);
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form.Item>}
|
||||
{proName?.length > 12 && printProductName && !MultiCode && (
|
||||
<>
|
||||
<div
|
||||
|
|
@ -3906,8 +3978,20 @@ const ProductList = () => {
|
|||
justifyContent: 'flex-end',
|
||||
}}
|
||||
>
|
||||
<Buttons buttonText={'Submit'} color="901D77"></Buttons>
|
||||
</div>
|
||||
{(!MultiCode || totalCopies > 0) && (
|
||||
<Buttons buttonText="Submit" color="901D77" />
|
||||
)}
|
||||
{MultiCode && totalCopies === 0 && (
|
||||
<button
|
||||
type="button"
|
||||
className="product_primary_Button"
|
||||
onClick={() => setstockWiseQrcode(true)}
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
)} </div>
|
||||
|
||||
|
||||
</Form>
|
||||
}
|
||||
/>
|
||||
|
|
@ -3915,8 +3999,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints0">
|
||||
<div className="grid15x15_6cross">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, "copyCountcopyCountcopyCount")
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker0"
|
||||
key={`sticker0-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -3931,8 +4017,8 @@ const ProductList = () => {
|
|||
style={{ width: '52px', height: '52px' }}
|
||||
/>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
));
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker0" key={`sticker0-${index}`}>
|
||||
<img
|
||||
|
|
@ -3946,8 +4032,9 @@ const ProductList = () => {
|
|||
<div id="StickerPrints1">
|
||||
<div className="grid22x35_3cross">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array?.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
return Array?.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker1"
|
||||
key={`sticker1-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -3972,6 +4059,7 @@ const ProductList = () => {
|
|||
/>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
)
|
||||
: Array?.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker1" key={`sticker1-${index}`}>
|
||||
|
|
@ -3993,9 +4081,11 @@ const ProductList = () => {
|
|||
</div>
|
||||
<div id="StickerPrints2">
|
||||
<div className="grid25x25_4cross">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
{(selectedRecords?.length > 0)
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount2')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="sticker25x25"
|
||||
key={`sticker2-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4048,6 +4138,9 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="sticker25x25" key={`sticker2-${index}`}>
|
||||
|
|
@ -4100,8 +4193,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints3">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount3')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker3"
|
||||
key={`sticker3-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4126,7 +4221,7 @@ const ProductList = () => {
|
|||
/>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker3" key={`sticker3-${index}`}>
|
||||
<div>
|
||||
|
|
@ -4148,8 +4243,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints4">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount4')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker4"
|
||||
key={`sticker4-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4174,7 +4271,7 @@ const ProductList = () => {
|
|||
/>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker4" key={`sticker4-${index}`}>
|
||||
<div>
|
||||
|
|
@ -4196,8 +4293,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints5">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount5')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker5"
|
||||
key={`sticker5-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4222,7 +4321,7 @@ const ProductList = () => {
|
|||
/>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker5" key={`sticker5-${index}`}>
|
||||
<div>
|
||||
|
|
@ -4244,8 +4343,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints6">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount6')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker6"
|
||||
key={`sticker6-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4270,7 +4371,7 @@ const ProductList = () => {
|
|||
/>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker6" key={`sticker6-${index}`}>
|
||||
<div className="text-section6">
|
||||
|
|
@ -4292,8 +4393,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints7">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount7')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="Sticker7"
|
||||
key={`sticker7-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4318,7 +4421,7 @@ const ProductList = () => {
|
|||
/>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="Sticker7" key={`sticker7-${index}`}>
|
||||
<div className="text-section7">
|
||||
|
|
@ -4340,8 +4443,10 @@ const ProductList = () => {
|
|||
<div id="StickerPrints8">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
console.log(copyCount, 'copyCount8')
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="OverAllSticker8"
|
||||
key={`sticker8-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4397,7 +4502,7 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
)
|
||||
})
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="OverAllSticker8">
|
||||
<div className="StikerBr8">
|
||||
|
|
@ -4444,8 +4549,9 @@ const ProductList = () => {
|
|||
<div id="25X254cross">
|
||||
<div className="grid25x25_4cross">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => {
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => {
|
||||
const hasProductName = !!templateOptions.productName;
|
||||
const hasMrp = !!templateOptions.mrp;
|
||||
|
||||
|
|
@ -4609,6 +4715,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
);
|
||||
})
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => {
|
||||
const hasProductName = !!templateOptions.productName;
|
||||
|
|
@ -4790,8 +4898,9 @@ const ProductList = () => {
|
|||
<div id="25X502cross">
|
||||
<div className="Cross25X50container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="BarQrprint8"
|
||||
key={`Barcode2-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -4816,6 +4925,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -4845,8 +4956,11 @@ const ProductList = () => {
|
|||
|
||||
<div id="50X30Single">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
|
||||
<div
|
||||
className="BarQrprint6"
|
||||
style={secondValueStyle}
|
||||
|
|
@ -4892,6 +5006,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -4946,8 +5062,10 @@ const ProductList = () => {
|
|||
<div id="50X25Single">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="BarQrprint2"
|
||||
style={secondValueStyle}
|
||||
|
|
@ -5000,6 +5118,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -5062,8 +5182,9 @@ const ProductList = () => {
|
|||
<div id="100X13(55MMPrintable)">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="BarQrprint9"
|
||||
key={`Barcode5-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -5089,6 +5210,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -5117,8 +5240,10 @@ const ProductList = () => {
|
|||
<div id="100X15(70MMPrintable)">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="BarQrprint1"
|
||||
style={valueStyleRow}
|
||||
|
|
@ -5151,6 +5276,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -5186,8 +5313,10 @@ const ProductList = () => {
|
|||
<div id="100X150">
|
||||
<div className="container">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="BarQrprint7"
|
||||
style={secondValueStyle}
|
||||
|
|
@ -5245,6 +5374,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -5312,8 +5443,10 @@ const ProductList = () => {
|
|||
}}
|
||||
>
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="label15"
|
||||
key={`Barcode8-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -5374,6 +5507,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div className="label15" key={`Barcode8-${index}`}>
|
||||
|
|
@ -5435,8 +5570,10 @@ const ProductList = () => {
|
|||
<div id="22X353cross">
|
||||
<div className="grid22x35_3cross">
|
||||
{selectedRecords?.length > 0
|
||||
? selectedRecords?.map((record, recordIndex) =>
|
||||
Array.from({ length: copies })?.map((_, copyIndex) => (
|
||||
? selectedRecords?.map((record, recordIndex) => {
|
||||
const copyCount = generateQRCodeCopy(record?.QRCode);
|
||||
|
||||
return Array.from({ length: copyCount })?.map((_, copyIndex) => (
|
||||
<div
|
||||
className="barcode-wrapper-22x35"
|
||||
key={`Barcode9-${recordIndex}-${copyIndex}`}
|
||||
|
|
@ -5492,6 +5629,8 @@ const ProductList = () => {
|
|||
</div>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
|
||||
)
|
||||
: Array.from({ length: copies })?.map((_, index) => (
|
||||
<div
|
||||
|
|
@ -5767,6 +5906,127 @@ const ProductList = () => {
|
|||
</>
|
||||
}
|
||||
/>
|
||||
<DefaultModal
|
||||
open={stockWiseQrcode}
|
||||
title="Stock Wise Qrcode"
|
||||
handleCancel={() => setstockWiseQrcode(false)}
|
||||
handleSubmit={() => {
|
||||
if (totalCopies == 0) {
|
||||
message.error("Please enter copies count")
|
||||
return;
|
||||
}
|
||||
else {
|
||||
setstockWiseQrcode(false)
|
||||
onFinish();
|
||||
}
|
||||
}}
|
||||
footer={true}
|
||||
children={
|
||||
<>
|
||||
<div className='ProductList-pwiseQrcode'>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: 'Product Name', dataIndex: 'productName', key: 'productName' },
|
||||
{
|
||||
title: 'Copies Count',
|
||||
dataIndex: 'copiesCount',
|
||||
key: 'copiesCount',
|
||||
render: (text, record) => (
|
||||
<input
|
||||
className='inputpwiseQR'
|
||||
type="number"
|
||||
min="1"
|
||||
value={record.copiesCount}
|
||||
onChange={(e) => {
|
||||
const newValue = parseInt(e.target.value);
|
||||
setQrandbarcodeDatas(prev =>
|
||||
prev.map(item =>
|
||||
item.key === record.key
|
||||
? { ...item, copiesCount: newValue }
|
||||
: item
|
||||
)
|
||||
);
|
||||
}}
|
||||
style={{ width: '80px' }}
|
||||
/>
|
||||
)
|
||||
}
|
||||
]}
|
||||
dataSource={QrandbarcodeDatas}
|
||||
rowKey="ProdId"
|
||||
pagination={false}
|
||||
size="small"
|
||||
rowClassName={(record) =>
|
||||
record.StockAvailable === "N" ? 'row-red' : ''
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
<div className='indicationInfo'>
|
||||
<p></p>
|
||||
<span>Stock is not Maintained</span>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
<DefaultModal
|
||||
open={productWiseQrcode}
|
||||
title="Product Wise Qrcode"
|
||||
handleCancel={() => setProductWiseQrcode(false)}
|
||||
handleSubmit={() => {
|
||||
if (totalCopies == 0) {
|
||||
message.error("Please enter copies count")
|
||||
return;
|
||||
}
|
||||
else {
|
||||
setProductWiseQrcode(false)
|
||||
onFinish();
|
||||
}
|
||||
|
||||
}} footer={true}
|
||||
|
||||
children={
|
||||
<>
|
||||
<div className='ProductList-pwiseQrcode'>
|
||||
<Table
|
||||
columns={[
|
||||
{ title: 'Product Name', dataIndex: 'productName', key: 'productName' },
|
||||
// { title: 'Stock Count', dataIndex: 'StockAvailable', key: 'StockAvailable' },
|
||||
{
|
||||
title: 'Copies Count',
|
||||
dataIndex: 'copiesCount',
|
||||
key: 'copiesCount',
|
||||
render: (text, record, index) => (
|
||||
<input
|
||||
type="number"
|
||||
className='inputpwiseQR'
|
||||
min="1"
|
||||
value={record.copiesCount}
|
||||
onChange={(e) => {
|
||||
const newValue = parseInt(e.target.value) || 1;
|
||||
setQrandbarcodeDatas(prev =>
|
||||
prev.map(item =>
|
||||
item.key === record.key
|
||||
? { ...item, copiesCount: newValue }
|
||||
: item
|
||||
)
|
||||
);
|
||||
}}
|
||||
style={{ width: '80px' }}
|
||||
/>
|
||||
)
|
||||
}
|
||||
]}
|
||||
dataSource={QrandbarcodeDatas}
|
||||
rowKey="ProdId"
|
||||
pagination={false}
|
||||
size="small"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
</>
|
||||
}
|
||||
/>
|
||||
|
||||
<OCRLoader
|
||||
isVisible={isOCRProcessing.Loader}
|
||||
|
|
|
|||
|
|
@ -14,6 +14,38 @@
|
|||
border-radius: 3px;
|
||||
font-size: 10px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.product_primary_Button {
|
||||
background-color: var(--ERROR_COLOR);
|
||||
color: #fff;
|
||||
padding: 15px;
|
||||
|
||||
|
||||
|
||||
border: 1px solid;
|
||||
overflow: hidden;
|
||||
|
||||
|
||||
|
||||
width: 170px;
|
||||
height: 45px;
|
||||
background-color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
|
||||
color: #fff;
|
||||
font-family: var(--HEADING_FONT_FAMILY);
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
letter-spacing: 0.5px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
z-index: 2;
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.Counter-Category-mapping {
|
||||
|
|
@ -191,6 +223,7 @@
|
|||
}
|
||||
|
||||
.address-type-section {
|
||||
|
||||
// padding: 12px;
|
||||
// background-color: #f8fafc;
|
||||
// border-radius: 8px;
|
||||
|
|
@ -453,6 +486,7 @@
|
|||
.ant-table-thead {
|
||||
z-index: 150 !important;
|
||||
}
|
||||
|
||||
.ant-table-cell {
|
||||
padding: 4px !important;
|
||||
}
|
||||
|
|
@ -601,11 +635,13 @@
|
|||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.lowStock-SaveButton:hover {
|
||||
background-color: #13c12a;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.lowStock-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -630,6 +666,7 @@
|
|||
transform: translateY(0);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.add-slot-header {
|
||||
font-size: 25px;
|
||||
font-weight: 600;
|
||||
|
|
@ -678,15 +715,18 @@
|
|||
.StorekitchenlistTable {
|
||||
scrollbar-width: thin;
|
||||
padding-right: 8px;
|
||||
@media (max-width: 600px) {
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {}
|
||||
|
||||
.ant-table-thead {
|
||||
&:hover {
|
||||
background-color: #bad4f9 !important;
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: #bad4f9 !important;
|
||||
}
|
||||
|
||||
.ant-table-cell {
|
||||
color: #ffffff;
|
||||
font-weight: 500;
|
||||
|
|
@ -700,11 +740,13 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.StoreRecipeinputForm {
|
||||
.ant-form-item-explain-error {
|
||||
top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.incenbtivepayBTN {
|
||||
.ant-btn {
|
||||
font-size: 16px !important;
|
||||
|
|
@ -733,10 +775,12 @@
|
|||
height: 45px !important;
|
||||
width: 180px !important;
|
||||
font-size: 14px !important;
|
||||
|
||||
&:hover {
|
||||
background-color: #d37305 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.smart_scan_Button {
|
||||
position: unset !important;
|
||||
left: unset !important;
|
||||
|
|
@ -765,6 +809,7 @@
|
|||
border-spacing: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.pricechangeTable {
|
||||
.ant-input {
|
||||
padding: 4px 11px 4px 11px !important;
|
||||
|
|
@ -838,6 +883,7 @@
|
|||
flex-direction: row;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.CommmasterPageHeader {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
@ -848,9 +894,11 @@
|
|||
|
||||
.comboProductList {
|
||||
width: 100%;
|
||||
|
||||
.ant-table-thead,
|
||||
.ant-table-cell {
|
||||
white-space: nowrap;
|
||||
|
||||
th {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
|
@ -863,6 +911,7 @@ table {
|
|||
font-family: 'Gilroy' !important;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
td {
|
||||
font-family: 'Poppins' !important;
|
||||
|
|
@ -1287,3 +1336,149 @@ table {
|
|||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ProductList-pwiseQrcode {
|
||||
height: max-content !important;
|
||||
max-height: 70vh;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin !important;
|
||||
}
|
||||
|
||||
.inputpwiseQR {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #e0e0e0;
|
||||
background-color: #ffffff;
|
||||
font-family: "Poppins";
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
.indicationInfo {
|
||||
font-size: 12px;
|
||||
color: #555555;
|
||||
margin: 12px 0 6px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
|
||||
p {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background-color: #C00000;
|
||||
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
font-family: "Poppins";
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.AddStockMinatain {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
background-color: #1292EE;
|
||||
color: #fff;
|
||||
font-family: "Poppins";
|
||||
font-weight: 500;
|
||||
padding: 2px 4px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.printtabs {
|
||||
display: flex;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
margin-bottom: 1rem;
|
||||
gap: 0;
|
||||
|
||||
.tab-item {
|
||||
padding: 6px 12px !important;
|
||||
}
|
||||
|
||||
.print-tabs {
|
||||
display: flex;
|
||||
border-bottom: 2px solid #f0f0f0;
|
||||
margin-bottom: 1rem;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.count {
|
||||
margin-left: 6px;
|
||||
font-weight: 600;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
display: flex;
|
||||
padding: 12px 24px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #d9d9d9;
|
||||
border-bottom: none;
|
||||
background: #fafafa;
|
||||
color: #666;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
border-radius: 6px 6px 0 0;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.tab-item:first-child {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.tab-item:hover {
|
||||
background: #f5f5f5;
|
||||
color: #901D77;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
color: #901D77;
|
||||
border-color: #901D77;
|
||||
border-bottom: 2px solid #fff;
|
||||
margin-bottom: -2px;
|
||||
z-index: 1;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.tab-item.active::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.ProductList-pwiseQrcode {
|
||||
height: 70vh;
|
||||
overflow-y: auto;
|
||||
scrollbar-width: thin;
|
||||
/* Firefox */
|
||||
scroll-behavior: auto;
|
||||
}
|
||||
|
||||
.row-red {
|
||||
background-color: #ffe6e6 !important;
|
||||
}
|
||||
|
||||
.row-red td {
|
||||
color: #c00000;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
}
|
||||
Loading…
Reference in New Issue