Merge pull request 'Print setup Design changes' (#245) from OptimUpdate into main
Reviewed-on: Pozomind/pozo-retail-app#245
This commit is contained in:
commit
9c05ccf0bf
|
|
@ -184,9 +184,10 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
const [Notes, setNote] = useState('');
|
||||
const [BillName, setBillName] = useState('');
|
||||
const [openColorModal, setOpenColorModal] = useState(false);
|
||||
const [bgColor, setBgColor] = useState("#ffffff");
|
||||
const [fontColor, setFontColor] = useState("#000000");
|
||||
const [selectedHeaderFontColor, setSelectedHeaderFontColor] = useState("#ffffff");
|
||||
const [bgColor, setBgColor] = useState('#ffffff');
|
||||
const [fontColor, setFontColor] = useState('#000000');
|
||||
const [selectedHeaderFontColor, setSelectedHeaderFontColor] =
|
||||
useState('#ffffff');
|
||||
const [colorModalTarget, setColorModalTarget] = useState(null); // 'header' | 'tableHeader' | 'tableBody' | 'footer'
|
||||
const rowType = useSelector(GlobalRowType);
|
||||
|
||||
|
|
@ -202,7 +203,6 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
const netAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||
const netAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||
|
||||
|
||||
const items = [
|
||||
{
|
||||
name: 'Home',
|
||||
|
|
@ -440,30 +440,40 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
dispatch(changeSelectedHeaderColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedHeaderColour(false));
|
||||
dispatch(changeSelectedHeaderColor({ background: '#ffffff', font: '#000000' }));
|
||||
dispatch(
|
||||
changeSelectedHeaderColor({ background: '#ffffff', font: '#000000' })
|
||||
);
|
||||
}
|
||||
const tblHdr2 = sizeCheckList.find((item) => item.ConfigName === 'Table Header Colour')?.ConfigId;
|
||||
const tblHdr2 = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Table Header Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedList?.includes(tblHdr2)) {
|
||||
dispatch(changeSelectedTableHeaderColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedTableHeaderColour(false));
|
||||
dispatch(changeSelectedTableHeaderColor({ background: '', font: '' }));
|
||||
}
|
||||
const tblBody2 = sizeCheckList.find((item) => item.ConfigName === 'Table Body Colour')?.ConfigId;
|
||||
const tblBody2 = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Table Body Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedList?.includes(tblBody2)) {
|
||||
dispatch(changeSelectedTableBodyColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedTableBodyColour(false));
|
||||
dispatch(changeSelectedTableBodyColor({ background: '', font: '' }));
|
||||
}
|
||||
const ftr2 = sizeCheckList.find((item) => item.ConfigName === 'Footer Colour')?.ConfigId;
|
||||
const ftr2 = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Footer Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedList?.includes(ftr2)) {
|
||||
dispatch(changeSelectedFooterColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedFooterColour(false));
|
||||
dispatch(changeSelectedFooterColor({ background: '', font: '' }));
|
||||
}
|
||||
const net2 = sizeCheckList.find((item) => item.ConfigName === 'Net Amount Colour')?.ConfigId;
|
||||
const net2 = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Net Amount Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedList?.includes(net2)) {
|
||||
dispatch(changeSelectedNetAmountColour(true));
|
||||
} else {
|
||||
|
|
@ -536,27 +546,39 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
PrintHdrName: item.PrintHdrName,
|
||||
// legacy fields are filled from the array so older code still works
|
||||
PrintHdrColor:
|
||||
item.PrintHdrColor || getColor(item.PrintColors, 'headerColor')?.background,
|
||||
item.PrintHdrColor ||
|
||||
getColor(item.PrintColors, 'headerColor')?.background,
|
||||
PrintHdrFontColor:
|
||||
item.PrintHdrFontColor || getColor(item.PrintColors, 'headerColor')?.font,
|
||||
item.PrintHdrFontColor ||
|
||||
getColor(item.PrintColors, 'headerColor')?.font,
|
||||
TableHeaderColor:
|
||||
item.TableHeaderColor || getColor(item.PrintColors, 'tableHeaderColor')?.background,
|
||||
item.TableHeaderColor ||
|
||||
getColor(item.PrintColors, 'tableHeaderColor')?.background,
|
||||
TableHeaderFontColor:
|
||||
item.TableHeaderFontColor || getColor(item.PrintColors, 'tableHeaderColor')?.font,
|
||||
item.TableHeaderFontColor ||
|
||||
getColor(item.PrintColors, 'tableHeaderColor')?.font,
|
||||
TableBodyColor:
|
||||
item.TableBodyColor || getColor(item.PrintColors, 'tableBodyColor')?.background,
|
||||
item.TableBodyColor ||
|
||||
getColor(item.PrintColors, 'tableBodyColor')?.background,
|
||||
TableBodyFontColor:
|
||||
item.TableBodyFontColor || getColor(item.PrintColors, 'tableBodyColor')?.font,
|
||||
item.TableBodyFontColor ||
|
||||
getColor(item.PrintColors, 'tableBodyColor')?.font,
|
||||
footerColor:
|
||||
item.footerColor || getColor(item.PrintColors, 'footerColor')?.background,
|
||||
item.footerColor ||
|
||||
getColor(item.PrintColors, 'footerColor')?.background,
|
||||
footerFontColor:
|
||||
item.footerFontColor || getColor(item.PrintColors, 'footerColor')?.font,
|
||||
item.footerFontColor ||
|
||||
getColor(item.PrintColors, 'footerColor')?.font,
|
||||
netAmountColor:
|
||||
item.netAmountColor || getColor(item.PrintColors, 'netAmtColor')?.background,
|
||||
item.netAmountColor ||
|
||||
getColor(item.PrintColors, 'netAmtColor')?.background,
|
||||
netAmountFontColor:
|
||||
item.netAmountFontColor || getColor(item.PrintColors, 'netAmtColor')?.font,
|
||||
item.netAmountFontColor ||
|
||||
getColor(item.PrintColors, 'netAmtColor')?.font,
|
||||
rowType:
|
||||
item.rowType || getColor(item.PrintColors, 'tableBodyColor')?.rowType || 'odd',
|
||||
item.rowType ||
|
||||
getColor(item.PrintColors, 'tableBodyColor')?.rowType ||
|
||||
'odd',
|
||||
PrintColors: item.PrintColors,
|
||||
Notes: item?.Notes,
|
||||
PageSize: item?.PageSize?.trim() || '3inch',
|
||||
|
|
@ -609,7 +631,7 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
OptionDetails,
|
||||
PrintTypeId,
|
||||
PrintHdrColor,
|
||||
PrintColors
|
||||
PrintColors,
|
||||
} = row;
|
||||
if (index >= 4) setShowMore(true);
|
||||
if (index <= 4) setShowMore(false);
|
||||
|
|
@ -625,7 +647,9 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
setEdit(true);
|
||||
// load existing header color, falling back to array
|
||||
setSelectedColour(
|
||||
PrintHdrColor || getColor(PrintColors, 'headerColor')?.background || '#000000'
|
||||
PrintHdrColor ||
|
||||
getColor(PrintColors, 'headerColor')?.background ||
|
||||
'#000000'
|
||||
);
|
||||
// setSelectedHeaderFontColor(PrintHdrFontColor);
|
||||
setSelectedStyleId(StyleId);
|
||||
|
|
@ -913,36 +937,48 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
)
|
||||
? dispatch(changeNotes(true))
|
||||
: dispatch(changeNotes(false));
|
||||
const hdrId = sizeCheckList.find((item) => item.ConfigName === 'Header Colour')?.ConfigId;
|
||||
const hdrId = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Header Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedValues?.includes(hdrId)) {
|
||||
dispatch(changeSelectedHeaderColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedHeaderColour(false));
|
||||
// reset colours when option disabled
|
||||
dispatch(changeSelectedHeaderColor({ background: '#ffffff', font: '#000000' }));
|
||||
dispatch(
|
||||
changeSelectedHeaderColor({ background: '#ffffff', font: '#000000' })
|
||||
);
|
||||
}
|
||||
const tblHdrId = sizeCheckList.find((item) => item.ConfigName === 'Table Header Colour')?.ConfigId;
|
||||
const tblHdrId = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Table Header Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedValues?.includes(tblHdrId)) {
|
||||
dispatch(changeSelectedTableHeaderColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedTableHeaderColour(false));
|
||||
dispatch(changeSelectedTableHeaderColor({ background: '', font: '' }));
|
||||
}
|
||||
const tblBodyId = sizeCheckList.find((item) => item.ConfigName === 'Table Body Colour')?.ConfigId;
|
||||
const tblBodyId = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Table Body Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedValues?.includes(tblBodyId)) {
|
||||
dispatch(changeSelectedTableBodyColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedTableBodyColour(false));
|
||||
dispatch(changeSelectedTableBodyColor({ background: '', font: '' }));
|
||||
}
|
||||
const ftrId = sizeCheckList.find((item) => item.ConfigName === 'Footer Colour')?.ConfigId;
|
||||
const ftrId = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Footer Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedValues?.includes(ftrId)) {
|
||||
dispatch(changeSelectedFooterColour(true));
|
||||
} else {
|
||||
dispatch(changeSelectedFooterColour(false));
|
||||
dispatch(changeSelectedFooterColor({ background: '', font: '' }));
|
||||
}
|
||||
const netId = sizeCheckList.find((item) => item.ConfigName === 'Net Amount Colour')?.ConfigId;
|
||||
const netId = sizeCheckList.find(
|
||||
(item) => item.ConfigName === 'Net Amount Colour'
|
||||
)?.ConfigId;
|
||||
if (checkedValues?.includes(netId)) {
|
||||
dispatch(changeSelectedNetAmountColour(true));
|
||||
} else {
|
||||
|
|
@ -1003,12 +1039,12 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
PrintHdrColor: getConcatenatedArray()?.some(
|
||||
(e) => e?.ConfigName?.toLowerCase() == 'header colour'
|
||||
)
|
||||
? (headerColor || selectedColour)
|
||||
? headerColor || selectedColour
|
||||
: null,
|
||||
PrintHdrFontColor: getConcatenatedArray()?.some(
|
||||
(e) => e?.ConfigName?.toLowerCase() == 'header colour'
|
||||
)
|
||||
? (headerFontColor || selectedHeaderFontColor)
|
||||
? headerFontColor || selectedHeaderFontColor
|
||||
: null,
|
||||
// Table header / body / footer / net amount colors
|
||||
TableHeaderColor: tableHeaderColor || null,
|
||||
|
|
@ -1303,27 +1339,57 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
|
||||
const handleColorSave = (colors) => {
|
||||
// common handler called when ColorsSelected modal returns values
|
||||
console.log("Received from modal:", colors);
|
||||
console.log('Received from modal:', colors);
|
||||
switch (colorModalTarget) {
|
||||
case 'header':
|
||||
dispatch(changeSelectedHeaderColor({ background: colors.background, font: colors.font }));
|
||||
dispatch(
|
||||
changeSelectedHeaderColor({
|
||||
background: colors.background,
|
||||
font: colors.font,
|
||||
})
|
||||
);
|
||||
setSelectedColour(colors.background);
|
||||
setSelectedHeaderFontColor(colors.font);
|
||||
break;
|
||||
case 'tableHeader':
|
||||
dispatch(changeSelectedTableHeaderColor({ background: colors.background, font: colors.font }));
|
||||
dispatch(
|
||||
changeSelectedTableHeaderColor({
|
||||
background: colors.background,
|
||||
font: colors.font,
|
||||
})
|
||||
);
|
||||
break;
|
||||
case 'tableBody':
|
||||
dispatch(changeSelectedTableBodyColor({ background: colors.background, font: colors.font }));
|
||||
dispatch(
|
||||
changeSelectedTableBodyColor({
|
||||
background: colors.background,
|
||||
font: colors.font,
|
||||
})
|
||||
);
|
||||
break;
|
||||
case 'footer':
|
||||
dispatch(changeSelectedFooterColor({ background: colors.background, font: colors.font }));
|
||||
dispatch(
|
||||
changeSelectedFooterColor({
|
||||
background: colors.background,
|
||||
font: colors.font,
|
||||
})
|
||||
);
|
||||
break;
|
||||
case 'netAmount':
|
||||
dispatch(changeSelectedNetAmountColor({ background: colors.background, font: colors.font }));
|
||||
dispatch(
|
||||
changeSelectedNetAmountColor({
|
||||
background: colors.background,
|
||||
font: colors.font,
|
||||
})
|
||||
);
|
||||
break;
|
||||
default:
|
||||
dispatch(changeSelectedHeaderColor({ background: colors.background, font: colors.font }));
|
||||
dispatch(
|
||||
changeSelectedHeaderColor({
|
||||
background: colors.background,
|
||||
font: colors.font,
|
||||
})
|
||||
);
|
||||
break;
|
||||
}
|
||||
// update local previews as well (not strictly necessary if UI reads from store)
|
||||
|
|
@ -1588,329 +1654,68 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
</div>
|
||||
|
||||
<div className="selectBillFiledInput">
|
||||
{isFooterChecking && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Notes
|
||||
</Title>
|
||||
<InputField
|
||||
isOnChange={Notes}
|
||||
label={<label>notes Description</label>}
|
||||
value={Notes}
|
||||
onChange={(e) => {
|
||||
setNote(e.target.value);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
<div className="PrintCutColor" style={{marginBottom:"10px"}}>
|
||||
{isFooterChecking && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Notes
|
||||
</Title>
|
||||
<InputField
|
||||
isOnChange={Notes}
|
||||
label={<label>notes Description</label>}
|
||||
value={Notes}
|
||||
onChange={(e) => {
|
||||
setNote(e.target.value);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
BillName
|
||||
</Title>
|
||||
<InputField
|
||||
isOnChange={BillName}
|
||||
label={<label>Bill Name</label>}
|
||||
value={BillName}
|
||||
onChange={(e) => {
|
||||
setBillName(e.target.value);
|
||||
dispatch(changeBillName(e.target.value));
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
{
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
BillName
|
||||
</Title>
|
||||
<InputField
|
||||
isOnChange={BillName}
|
||||
label={<label>Bill Name</label>}
|
||||
value={BillName}
|
||||
onChange={(e) => {
|
||||
setBillName(e.target.value);
|
||||
dispatch(changeBillName(e.target.value));
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
|
||||
{isSignatureChecking && (
|
||||
<div
|
||||
style={{
|
||||
marginTop: '1rem',
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
gap: '10px',
|
||||
}}
|
||||
>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Upload Signature:
|
||||
</Title>
|
||||
<Upload
|
||||
name="file"
|
||||
action="https://api.pozo.app/pozo-common-image-api//upload"
|
||||
listType="picture-card"
|
||||
fileList={fileList}
|
||||
onChange={handleUploadChange}
|
||||
onPreview={handlePreview}
|
||||
showUploadList={{ showRemoveIcon: true }}
|
||||
maxCount={1}
|
||||
accept="image/*"
|
||||
beforeUpload={beforeUpload}
|
||||
>
|
||||
{fileList.length < 1 && (
|
||||
<div>
|
||||
<UploadOutlined
|
||||
style={{
|
||||
fontSize: 20,
|
||||
marginBottom: 0,
|
||||
marginRight: 5,
|
||||
}}
|
||||
{isTermscondChecking && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Terms and Conditions
|
||||
</Title>
|
||||
{terms.map((term, index) => (
|
||||
<Space
|
||||
key={index}
|
||||
style={{ display: 'flex', marginBottom: 4 }}
|
||||
align="center"
|
||||
>
|
||||
<Input.TextArea
|
||||
placeholder={`eg:- Amount not Refunded #${index + 1}`}
|
||||
value={term}
|
||||
onChange={(e) => handleChange(index, e.target.value)}
|
||||
autoSize={{ minRows: 1, maxRows: 3 }}
|
||||
style={{ width: 290 }}
|
||||
/>
|
||||
Click to Upload
|
||||
</div>
|
||||
)}
|
||||
</Upload>
|
||||
{terms.length > 1 && (
|
||||
<MinusCircleOutlined
|
||||
onClick={() => handleRemove(index)}
|
||||
style={{ color: 'red', cursor: 'pointer' }}
|
||||
/>
|
||||
)}
|
||||
</Space>
|
||||
))}
|
||||
|
||||
<Modal
|
||||
visible={previewOpen}
|
||||
title={previewTitle}
|
||||
footer={null}
|
||||
onCancel={handleCancelimg}
|
||||
>
|
||||
<img
|
||||
alt="Preview"
|
||||
style={{ width: '100%' }}
|
||||
src={previewImage}
|
||||
/>
|
||||
</Modal>
|
||||
</div>
|
||||
)}
|
||||
{isheadercolour && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Header Color
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('header');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 16,
|
||||
height: 16,
|
||||
backgroundColor: headerColor || '#ffffff',
|
||||
border: '1px solid #000',
|
||||
marginLeft: 6,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block', width: 16, height: 16, backgroundColor: headerFontColor,
|
||||
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{isTableHeaderColour && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Table Header Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('tableHeader');
|
||||
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 16,
|
||||
height: 16,
|
||||
backgroundColor: tableHeaderColor || '#ffffff',
|
||||
border: '1px solid #000',
|
||||
marginLeft: 6,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block', width: 16, height: 16, backgroundColor: tableHeaderFontColor || '#000000',
|
||||
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{isTableBodyColour && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Table Body Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('tableBody');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 16,
|
||||
height: 16,
|
||||
backgroundColor: tableBodyColor || '#ffffff',
|
||||
border: '1px solid #000',
|
||||
marginLeft: 6,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block', width: 16, height: 16, backgroundColor: tableBodyFontColor || '#000000',
|
||||
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
|
||||
<span style={{ margin: '0px 10px' }} className="handleAddBTN">
|
||||
<Switch
|
||||
checked={rowType === "odd"}
|
||||
unCheckedChildren="Odd"
|
||||
checkedChildren="Even"
|
||||
onChange={(checked) => dispatch(changeRowType(checked ? "odd" :"even" ))}
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
{isFooterColour && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Footer Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('footer');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 16,
|
||||
height: 16,
|
||||
backgroundColor: footerColor || '#ffffff',
|
||||
border: '1px solid #000',
|
||||
marginLeft: 6,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block', width: 16, height: 16, backgroundColor: footerFontColor || '#000000',
|
||||
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isNetAmountColour && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Net Amount Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('netAmount');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 16,
|
||||
height: 16,
|
||||
backgroundColor: netAmountColor || '#ffffff',
|
||||
border: '1px solid #000',
|
||||
marginLeft: 6,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block', width: 16, height: 16, backgroundColor: netAmountFontColor || '#000000',
|
||||
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{openColorModal && (
|
||||
<ColorsSelected
|
||||
open={openColorModal}
|
||||
onClose={() => setOpenColorModal(false)}
|
||||
onSave={handleColorSave}
|
||||
initial={{
|
||||
background:
|
||||
colorModalTarget === 'header'
|
||||
? headerColor
|
||||
: colorModalTarget === 'tableHeader'
|
||||
? tableHeaderColor
|
||||
: colorModalTarget === 'tableBody'
|
||||
? tableBodyColor
|
||||
: colorModalTarget === 'footer'
|
||||
? footerColor
|
||||
: colorModalTarget === 'netAmount'
|
||||
? netAmountColor
|
||||
: bgColor,
|
||||
font:
|
||||
colorModalTarget === 'header'
|
||||
? headerFontColor
|
||||
: colorModalTarget === 'tableHeader'
|
||||
? tableHeaderFontColor
|
||||
: colorModalTarget === 'tableBody'
|
||||
? tableBodyFontColor
|
||||
: colorModalTarget === 'footer'
|
||||
? footerFontColor
|
||||
: colorModalTarget === 'netAmount'
|
||||
? netAmountFontColor
|
||||
: fontColor,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
{isTermscondChecking && (
|
||||
<div style={{ marginTop: '1rem' }}>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Terms and Conditions
|
||||
</Title>
|
||||
{terms.map((term, index) => (
|
||||
<Space
|
||||
key={index}
|
||||
style={{ display: 'flex', marginBottom: 4 }}
|
||||
align="center"
|
||||
>
|
||||
<Input.TextArea
|
||||
placeholder={`eg:- Amount not Refunded #${index + 1}`}
|
||||
value={term}
|
||||
onChange={(e) => handleChange(index, e.target.value)}
|
||||
autoSize={{ minRows: 1, maxRows: 3 }}
|
||||
style={{ width: 290 }}
|
||||
/>
|
||||
{terms.length > 1 && (
|
||||
<MinusCircleOutlined
|
||||
onClick={() => handleRemove(index)}
|
||||
style={{ color: 'red', cursor: 'pointer' }}
|
||||
/>
|
||||
)}
|
||||
</Space>
|
||||
))}
|
||||
|
||||
{/* <Button
|
||||
{/* <Button
|
||||
type="dashed"
|
||||
onClick={handleAdd}
|
||||
icon={<PlusOutlined />}
|
||||
|
|
@ -1919,11 +1724,275 @@ const SelectionComponent = forwardRef((props, ref) => {
|
|||
>
|
||||
Add Term
|
||||
</Button> */}
|
||||
<button onClick={handleAdd} className="handleAddBTN">
|
||||
<PlusOutlined /> Add Term
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
<button onClick={handleAdd} className="AddTermBTN">
|
||||
<PlusOutlined /> Add Term
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isSignatureChecking && (
|
||||
<div
|
||||
style={{
|
||||
margin: '1rem 0',
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
gap: '10px',
|
||||
}}
|
||||
>
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Upload Signature:
|
||||
</Title>
|
||||
<Upload
|
||||
name="file"
|
||||
action="https://api.pozo.app/pozo-common-image-api//upload"
|
||||
listType="picture-card"
|
||||
fileList={fileList}
|
||||
onChange={handleUploadChange}
|
||||
onPreview={handlePreview}
|
||||
showUploadList={{ showRemoveIcon: true }}
|
||||
maxCount={1}
|
||||
accept="image/*"
|
||||
beforeUpload={beforeUpload}
|
||||
>
|
||||
{fileList.length < 1 && (
|
||||
<div>
|
||||
<UploadOutlined
|
||||
style={{
|
||||
fontSize: 20,
|
||||
marginBottom: 0,
|
||||
marginRight: 5,
|
||||
}}
|
||||
/>
|
||||
Click to Upload
|
||||
</div>
|
||||
)}
|
||||
</Upload>
|
||||
|
||||
<Modal
|
||||
visible={previewOpen}
|
||||
title={previewTitle}
|
||||
footer={null}
|
||||
onCancel={handleCancelimg}
|
||||
>
|
||||
<img
|
||||
alt="Preview"
|
||||
style={{ width: '100%' }}
|
||||
src={previewImage}
|
||||
/>
|
||||
</Modal>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="PrintCutColor">
|
||||
{isheadercolour && (
|
||||
<div className="filedCusColor">
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Header Color
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('header');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: headerColor || '#ffffff',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: headerFontColor,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{isTableHeaderColour && (
|
||||
<div className="filedCusColor">
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Table Header Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('tableHeader');
|
||||
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: tableHeaderColor || '#ffffff',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: tableHeaderFontColor || '#000000',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{isTableBodyColour && (
|
||||
<div className="filedCusColor">
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Table Body Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('tableBody');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: tableBodyColor || '#ffffff',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: tableBodyFontColor || '#000000',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
|
||||
<span className="handleAddBTN1">
|
||||
<Switch
|
||||
checked={rowType === 'odd'}
|
||||
unCheckedChildren="Odd"
|
||||
checkedChildren="Even"
|
||||
onChange={(checked) =>
|
||||
dispatch(changeRowType(checked ? 'odd' : 'even'))
|
||||
}
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
{isFooterColour && (
|
||||
<div className="filedCusColor">
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Footer Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('footer');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: footerColor || '#ffffff',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: footerFontColor || '#000000',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isNetAmountColour && (
|
||||
<div className="filedCusColor">
|
||||
<Title level={5} style={{ marginBottom: 12 }}>
|
||||
Net Amount Colour
|
||||
</Title>
|
||||
<button
|
||||
onClick={() => {
|
||||
setColorModalTarget('netAmount');
|
||||
setOpenColorModal(true);
|
||||
}}
|
||||
className="handleAddBTN"
|
||||
>
|
||||
<PlusOutlined /> select color
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: netAmountColor || '#ffffff',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
<span
|
||||
className="ColorChoosePrintColor"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
backgroundColor: netAmountFontColor || '#000000',
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{openColorModal && (
|
||||
<ColorsSelected
|
||||
open={openColorModal}
|
||||
onClose={() => setOpenColorModal(false)}
|
||||
onSave={handleColorSave}
|
||||
initial={{
|
||||
background:
|
||||
colorModalTarget === 'header'
|
||||
? headerColor
|
||||
: colorModalTarget === 'tableHeader'
|
||||
? tableHeaderColor
|
||||
: colorModalTarget === 'tableBody'
|
||||
? tableBodyColor
|
||||
: colorModalTarget === 'footer'
|
||||
? footerColor
|
||||
: colorModalTarget === 'netAmount'
|
||||
? netAmountColor
|
||||
: bgColor,
|
||||
font:
|
||||
colorModalTarget === 'header'
|
||||
? headerFontColor
|
||||
: colorModalTarget === 'tableHeader'
|
||||
? tableHeaderFontColor
|
||||
: colorModalTarget === 'tableBody'
|
||||
? tableBodyFontColor
|
||||
: colorModalTarget === 'footer'
|
||||
? footerFontColor
|
||||
: colorModalTarget === 'netAmount'
|
||||
? netAmountFontColor
|
||||
: fontColor,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div
|
||||
style={{
|
||||
width: '100%',
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@
|
|||
background-color: #fff;
|
||||
width: inherit;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
height: 80vh;
|
||||
}
|
||||
.BSBillingTable5-table-master-div-6 {
|
||||
|
|
@ -37,6 +38,7 @@
|
|||
.BSC1-Master .BSBillingTable5-billtable {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
|
||||
|
|
@ -177,7 +179,6 @@ hr.new1 {
|
|||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 10px 0px;
|
||||
// padding: 0rem 1rem;
|
||||
}
|
||||
|
||||
.payrow1 {
|
||||
|
|
@ -187,7 +188,6 @@ hr.new1 {
|
|||
}
|
||||
|
||||
.BSBillingTable-ftr {
|
||||
// position: fixed;
|
||||
bottom: 0;
|
||||
background-color: #fff;
|
||||
width: inherit;
|
||||
|
|
@ -200,7 +200,6 @@ hr.new1 {
|
|||
width: 100%;
|
||||
font-family: var(--PARA_FONT_FAMILY);
|
||||
line-height: 0;
|
||||
// font-family: 'Manrope';
|
||||
}
|
||||
|
||||
.BSBillingTable5-billtable-td {
|
||||
|
|
@ -306,9 +305,6 @@ hr.new1 {
|
|||
|
||||
.BSBIllingTable5-cnclbtn {
|
||||
margin-left: 2px;
|
||||
//dhana
|
||||
//width: 60px;
|
||||
//
|
||||
width: 70px;
|
||||
height: 50px;
|
||||
border: none;
|
||||
|
|
@ -323,10 +319,6 @@ hr.new1 {
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
// .BSBillingTable5-addpay {
|
||||
// display: none;
|
||||
// }
|
||||
|
||||
.BSBIllingTable5-ftrbtns {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -338,13 +330,10 @@ hr.new1 {
|
|||
flex-direction: row;
|
||||
row-gap: 1rem;
|
||||
column-gap: 1rem;
|
||||
// padding: 0rem 1rem;
|
||||
justify-content: space-around;
|
||||
// align-items: center;
|
||||
}
|
||||
|
||||
.BSBillingTable5-payOptsel {
|
||||
// width: 45px;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
font-weight: 550;
|
||||
|
|
@ -365,27 +354,15 @@ select:focus-visible {
|
|||
display: none;
|
||||
}
|
||||
|
||||
// .BSBIllingTable5-mobscrn{
|
||||
// display: none;
|
||||
// }
|
||||
|
||||
.smallScreensummary {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// media quries
|
||||
|
||||
/* For screens smaller than 768px (e.g., smartphones) */
|
||||
|
||||
@media (width: 280px) {
|
||||
.BSBIllingTable5-paybtn-noitems {
|
||||
width: 170px !important;
|
||||
}
|
||||
|
||||
// .BSBIllingTable5-paybtn{
|
||||
|
||||
// width: 180px !important;
|
||||
// }
|
||||
.BSBIllingTable5-cnclbtn {
|
||||
width: 55px;
|
||||
height: 45px;
|
||||
|
|
@ -455,9 +432,6 @@ select:focus-visible {
|
|||
|
||||
.BSBillingTable-ftr {
|
||||
position: fixed;
|
||||
//nk
|
||||
// bottom: 37px;
|
||||
//
|
||||
left: 0;
|
||||
background-color: #fff;
|
||||
width: 100vw;
|
||||
|
|
@ -469,10 +443,6 @@ select:focus-visible {
|
|||
z-index: 1;
|
||||
}
|
||||
|
||||
// .BSBIllingTable5-paybtn{
|
||||
// width:200px
|
||||
// }
|
||||
|
||||
.BSLayout2-bSlayer {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
|
|
@ -483,7 +453,6 @@ select:focus-visible {
|
|||
}
|
||||
|
||||
.BSBillingTable5-table-th {
|
||||
// font-size: 2.1dvh !important;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
|
|
@ -518,7 +487,6 @@ select:focus-visible {
|
|||
|
||||
.BSBIllingTable5-paybtn {
|
||||
height: 50px;
|
||||
// width: 160px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
|
|
@ -528,8 +496,6 @@ select:focus-visible {
|
|||
}
|
||||
|
||||
.BSBillingTable5-table-master-div {
|
||||
// display: none !important;
|
||||
// width: inherit !important;
|
||||
width: 0px !important;
|
||||
}
|
||||
|
||||
|
|
@ -580,10 +546,6 @@ select:focus-visible {
|
|||
/* For screens smaller than 768px (e.g., smartphones) */
|
||||
|
||||
@media all and (max-width: 499px) {
|
||||
// .payrow2{
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// }
|
||||
.smallScreensummary {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -595,7 +557,6 @@ select:focus-visible {
|
|||
}
|
||||
|
||||
.BSBIllingTable5-mobscrn {
|
||||
// display: flex;
|
||||
width: 100vw !important;
|
||||
}
|
||||
|
||||
|
|
@ -624,14 +585,6 @@ select:focus-visible {
|
|||
}
|
||||
|
||||
@media (min-width: 500px) and (max-width: 767px) {
|
||||
// .BigScreen{
|
||||
// display: none;
|
||||
// }
|
||||
// .SmallScreen{
|
||||
// display: flex;
|
||||
// font-size: 30px;
|
||||
// }
|
||||
|
||||
.Table3-Price-summarypop-tab {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -640,10 +593,6 @@ select:focus-visible {
|
|||
column-gap: 2rem;
|
||||
}
|
||||
|
||||
.BSBillingTable-billtable {
|
||||
// display: none;
|
||||
}
|
||||
|
||||
.smallScreensummary {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -654,7 +603,6 @@ select:focus-visible {
|
|||
}
|
||||
|
||||
.BSBillingTable5-table-master-div {
|
||||
// display: none;
|
||||
width: 0vw;
|
||||
}
|
||||
|
||||
|
|
@ -665,7 +613,6 @@ select:focus-visible {
|
|||
position: fixed !important;
|
||||
align-items: center !important;
|
||||
width: 100%;
|
||||
// justify-content: flex-end !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -677,10 +624,6 @@ select:focus-visible {
|
|||
height: 45px;
|
||||
}
|
||||
|
||||
// .BSBillingTable5-table-master-div {
|
||||
// display: none !important;
|
||||
// }
|
||||
|
||||
.BSBillingTable-ftr {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
|
|
@ -700,7 +643,6 @@ select:focus-visible {
|
|||
}
|
||||
|
||||
.BSBIllingTable5-mobscrn {
|
||||
// display: flex;
|
||||
height: 77px;
|
||||
width: 98vw !important;
|
||||
position: fixed;
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@
|
|||
padding: 20px;
|
||||
height: 100%;
|
||||
width: 90%;
|
||||
overflow: scroll;
|
||||
// position: fixed;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
background-color: #fff;
|
||||
padding: 5px;
|
||||
border-radius: 6px;
|
||||
|
|
@ -44,10 +44,8 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
// gap: 3rem;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
// position: fixed;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
position: unset;
|
||||
|
|
@ -55,10 +53,10 @@
|
|||
}
|
||||
|
||||
.Sales-dotted-box {
|
||||
// border: 1px dashed #5a5a5a;
|
||||
padding: 20px;
|
||||
height: 70%;
|
||||
overflow: scroll;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
background-color: #fff;
|
||||
padding: 5px;
|
||||
border-radius: 6px;
|
||||
|
|
@ -103,8 +101,8 @@
|
|||
border: 2px dashed #5a5a5a;
|
||||
padding: 20px;
|
||||
height: 70%;
|
||||
overflow: scroll;
|
||||
// position: fixed;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
background-color: #fff;
|
||||
padding: 5px;
|
||||
border-radius: 6px;
|
||||
|
|
@ -141,9 +139,9 @@
|
|||
padding: 20px;
|
||||
width: 45%;
|
||||
height: 85vh;
|
||||
overflow: scroll;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
background-color: #fff;
|
||||
// right: 25px;
|
||||
padding: 5px;
|
||||
border-radius: 6px;
|
||||
|
||||
|
|
@ -191,6 +189,7 @@
|
|||
width: 45%;
|
||||
height: 80vh;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
background-color: #f0f0f0;
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
|
|
@ -234,11 +233,6 @@
|
|||
gap: 4px;
|
||||
}
|
||||
|
||||
// .defaultandCustomisedThemeSales > div:hover {
|
||||
// background-color: #f2f2f2;
|
||||
// border-radius: 50pc;
|
||||
// }
|
||||
|
||||
.defaultandCustomisedThemeSales > div.selected {
|
||||
background-color: #ffffff;
|
||||
border-radius: 5px;
|
||||
|
|
@ -255,7 +249,6 @@
|
|||
flex-wrap: nowrap;
|
||||
flex-grow: 1;
|
||||
width: 100%;
|
||||
// gap: 20px;
|
||||
justify-content: space-between;
|
||||
border: 1px solid #dddddd;
|
||||
@media (max-width: 768px) {
|
||||
|
|
@ -301,8 +294,8 @@
|
|||
border: none;
|
||||
height: 100vh;
|
||||
background-color: #eeeeee !important;
|
||||
width: 1.5px;
|
||||
@media (max-width:768px){
|
||||
width: 1.5px;
|
||||
@media (max-width: 768px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -94,10 +94,10 @@
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
//nk
|
||||
.Selection-Component-OverallDiv {
|
||||
height: 80vh;
|
||||
overflow: auto;
|
||||
scrollbar-width: thin;
|
||||
width: 100%;
|
||||
padding-bottom: 10rem;
|
||||
background-color: #fbf9fa;
|
||||
|
|
@ -176,7 +176,6 @@
|
|||
.Selection-Component-SubDivContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// row-gap: 1rem;
|
||||
}
|
||||
|
||||
.SelectComp-SubmitButton {
|
||||
|
|
@ -203,8 +202,8 @@
|
|||
font-size: 14px;
|
||||
font-family: "Poppins";
|
||||
font-weight: 400;
|
||||
padding: 6px 12px;
|
||||
border-radius: 8px;
|
||||
padding: 6px 16px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.Selection-selectheading {
|
||||
|
|
@ -352,8 +351,9 @@
|
|||
padding-right: 4px;
|
||||
height: max-content;
|
||||
max-height: 160px;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
scrollbar-width: thin;
|
||||
border-radius: 4px;
|
||||
width: 100%;
|
||||
|
||||
|
|
@ -534,17 +534,20 @@
|
|||
}
|
||||
|
||||
.handleAddBTN {
|
||||
width: max-content;
|
||||
width: 90%;
|
||||
padding: 6px 12px;
|
||||
margin-top: 10px;
|
||||
border-radius: 6px;
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
background-color: #1292ee;
|
||||
color: #fff;
|
||||
background-color: #c9cee5;
|
||||
color: #000000;
|
||||
font-family: "Poppins";
|
||||
font-size: 12px;
|
||||
font-size: 13px;
|
||||
cursor: pointer;
|
||||
font-weight: 400;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
gap: 10px;
|
||||
}
|
||||
.selectBillFiledInput {
|
||||
display: flex;
|
||||
|
|
@ -554,7 +557,7 @@
|
|||
border-radius: 10px;
|
||||
width: 100%;
|
||||
padding: 0 14px;
|
||||
margin-top: 12px;
|
||||
margin: 12px 0;
|
||||
&:hover {
|
||||
background-color: #fff;
|
||||
box-shadow:
|
||||
|
|
@ -617,3 +620,56 @@
|
|||
margin-top: 16px !important;
|
||||
}
|
||||
}
|
||||
.PrintCutColor {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 1rem;
|
||||
.example,
|
||||
.ant-space,
|
||||
.ant-space-item {
|
||||
width: 180px;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
width: unset;
|
||||
}
|
||||
}
|
||||
.float-label {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
.filedCusColor {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 5px;
|
||||
.ant-typography {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ColorChoosePrintColor {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.AddTermBTN {
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
padding: 6px 10px;
|
||||
border-radius: 6px;
|
||||
font-family: "Poppins";
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
background-color: #1292ee;
|
||||
color: #fff;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue