added styele
This commit is contained in:
parent
467ca1b93b
commit
b592923f5f
|
|
@ -21,6 +21,8 @@ const CatalogueTemplate1 = () => {
|
||||||
const BrId = getSession('BranchId');
|
const BrId = getSession('BranchId');
|
||||||
|
|
||||||
const Globalcataloguedata1 = useSelector(GlobalCataloguedata);
|
const Globalcataloguedata1 = useSelector(GlobalCataloguedata);
|
||||||
|
console.log(Globalcataloguedata1, 'Globalcataloguedata1eqee');
|
||||||
|
|
||||||
const [Branchdatas, setBranchdatas] = useState();
|
const [Branchdatas, setBranchdatas] = useState();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -46,121 +48,7 @@ const CatalogueTemplate1 = () => {
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{/* <div className="CT1-MasterDiv">
|
{' '}
|
||||||
<div className="a">
|
|
||||||
<div className='div'>
|
|
||||||
|
|
||||||
<div className="PrintA4Style" id="PrintStyleA4" style={{width:'100%'}}>
|
|
||||||
<div className="page-header" style={{ textAlign: "center", backgroundColor: '#fff', borderBottom: '#fff',width:'100%' }}>
|
|
||||||
{Branchdatas?.map((item) => (
|
|
||||||
<>
|
|
||||||
<div className="overlap" style={{ zIndex: '2' }}>
|
|
||||||
|
|
||||||
<div className="rectangle" />
|
|
||||||
<div className="rectangle-2" />
|
|
||||||
<img
|
|
||||||
className="pngwing-com"
|
|
||||||
alt=" "
|
|
||||||
src={shopImg}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div className="overlap-wrapper">
|
|
||||||
<div className="overlap-3">
|
|
||||||
<div className="group-5">
|
|
||||||
<div className="group-6">
|
|
||||||
|
|
||||||
<div className="text-wrapper-10">{item.BrName}</div>
|
|
||||||
|
|
||||||
<div className="text-wrapper-11">{item.BrMobile}</div>
|
|
||||||
<div className="text-wrapper-11New">
|
|
||||||
{item.Address1 != null && item.Address1 + ','}{item.City != null && item.City + ','}{item.Dist != null && item.Dist + ','}{item.State != null && item.State}</div>
|
|
||||||
</div>
|
|
||||||
<img
|
|
||||||
className="pngwing-com-2"
|
|
||||||
alt="Pngwing com"
|
|
||||||
src={shopico}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="group-7">
|
|
||||||
<div className="overlap-3">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
|
||||||
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table className="A4TablePrint" style={{width:'100%'}}>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<td style={{width:'100%' }}>
|
|
||||||
<div className="page-header-space"> </div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td style={{width:'100%'}}>
|
|
||||||
|
|
||||||
<div className="page" style={{ lineHeight: "1.2" }}>
|
|
||||||
<div className="CT1itemcardGroup">
|
|
||||||
|
|
||||||
{Globalcataloguedata1?.map((item) => (
|
|
||||||
<>
|
|
||||||
<div>
|
|
||||||
|
|
||||||
<div >
|
|
||||||
|
|
||||||
<img
|
|
||||||
className="Cateimg"
|
|
||||||
src={item?.ProdLogo}
|
|
||||||
alt=''
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div >
|
|
||||||
<div >₹ {item?.SellPrice}</div>
|
|
||||||
{console.log("itemitem", item)}
|
|
||||||
</div>
|
|
||||||
<p >{item?.ProdName} {item?.UomName}</p>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<img className="image" alt="Image" src={ph} />
|
|
||||||
<img className="group-14" alt="Group" src="group-703.png" />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
|
|
||||||
<tfoot>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<div className="page-footer-space"></div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tfoot>
|
|
||||||
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div> */}
|
|
||||||
|
|
||||||
<div style={{ fontFamily: 'Montserrat,sans-serif' }}>
|
<div style={{ fontFamily: 'Montserrat,sans-serif' }}>
|
||||||
{/* <button style={{position: 'absolute',zIndex:'2'}} onClick={handlePrint}>Print</button> */}
|
{/* <button style={{position: 'absolute',zIndex:'2'}} onClick={handlePrint}>Print</button> */}
|
||||||
|
|
||||||
|
|
@ -169,14 +57,14 @@ const CatalogueTemplate1 = () => {
|
||||||
style={{ width: '100%', display: 'flex', justifyContent: 'center' }}
|
style={{ width: '100%', display: 'flex', justifyContent: 'center' }}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
className="page-header"
|
className="page-header-1"
|
||||||
style={{
|
style={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
padding: '0 1rem',
|
padding: '0 1rem',
|
||||||
textAlign: 'center',
|
textAlign: 'center',
|
||||||
backgroundColor: '#ff453a',
|
backgroundColor: '#ff453a',
|
||||||
width: '94%',
|
width: '97%',
|
||||||
borderRadius: '30px 30px 0 0',
|
borderRadius: '30px 30px 0 0',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
@ -213,28 +101,7 @@ const CatalogueTemplate1 = () => {
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>{' '}
|
||||||
|
|
||||||
{/* <div className="page-footer">
|
|
||||||
<div className=' '>
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column' }}>
|
|
||||||
|
|
||||||
<p style={{ marginLeft: '2rem', fontSize: '16px', fontWeight: '700' }}>{Branchdatas?.[0]?.BrName}</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div className='CTemplate5Fotterinfo' >
|
|
||||||
|
|
||||||
<div className='CTemplate5Fotterphone'>
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', fontSize: '9px' }}>
|
|
||||||
<div>FREE HOME</div>
|
|
||||||
<div>DELEVERY</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
|
|
||||||
<table className="" style={{ width: '100%' }}>
|
<table className="" style={{ width: '100%' }}>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
|
@ -271,11 +138,11 @@ const CatalogueTemplate1 = () => {
|
||||||
|
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
display: 'grid',
|
display: 'flex',
|
||||||
gridTemplateColumns: 'repeat( 5, 1fr)',
|
flexWrap: 'wrap',
|
||||||
gridAutoRows: '140px',
|
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
gap: '0.3rem',
|
gap: '0.3rem',
|
||||||
|
padding: '1rem 0',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{Globalcataloguedata1?.map((item) => (
|
{Globalcataloguedata1?.map((item) => (
|
||||||
|
|
@ -285,10 +152,14 @@ const CatalogueTemplate1 = () => {
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
widht: '100px',
|
width: '100px',
|
||||||
height: 'auto',
|
height: '140px',
|
||||||
backgroundColor: '#ececec',
|
backgroundColor: '#ececec',
|
||||||
justifyContent: 'space-around',
|
justifyContent: 'space-around',
|
||||||
|
pageBreakInside: 'avoid',
|
||||||
|
breakInside: 'avoid',
|
||||||
|
margin: '0.2rem',
|
||||||
|
borderRadius: '6px',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div>
|
<div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue