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

camera feature added for upload

This commit is contained in:
unknown 2026-02-20 09:57:03 +05:30
parent 6e22db34c8
commit 5cd65fa104
12 changed files with 1394 additions and 1275 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/Components/Forms/CropUpload.jsx
View File

@ -9,6 +9,8 @@ import { FiPenTool } from 'react-icons/fi';
import { DefaultModal } from '../../Components/Modal/DefaultModal.jsx';
import '../../Styles/Product/Product.scss';
import { Messages } from '../Notifications/Messages.jsx';
import { isMobile } from 'react-device-detect';
import Camera from '../MobileComponent/Camera.jsx';
const allowedTypes = [
'image/jpeg',
'image/png',
@ -405,6 +407,29 @@ const CropUpload = ({
<Modal visible={previewVisible} onCancel={handleCancel} footer={null}>
<img alt="Preview" style={{ width: '100%' }} src={previewImage} />
</Modal>
{isMobile && fileList?.length == 0 && <>
<div style={{ textAlign: "center", margin: "6px 0", fontFamily: "Poppins", fontWeight: "500" }}>OR</div>
<Camera
handleCapture={async (e) => {
const file = e.target.files?.[0];
if (!file) return;
try {
await handleUpload({
file,
onSuccess: () => {
setEditImageOpen(true);
},
onError: () => {
console.error("Upload failed");
}
});
} catch (error) {
console.error(error);
}
}}
/>
</>}
<DefaultModal
title="Edit Image"
width={800}

30
src/Components/Forms/Upload.jsx
View File

@ -3,6 +3,8 @@ import { useDispatch } from 'react-redux';
import { Modal, Upload } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import { uploadImage } from '../../Features/upload/upload';
import Camera from '../MobileComponent/Camera';
import { isMobile } from 'react-device-detect';
const allowedTypes = [
'image/jpeg',
'image/png',
@ -25,6 +27,7 @@ const App = ({ singleImage, updateImageUrl, ImageLink = '', listType }) => {
const [previewImage, setPreviewImage] = useState('');
const [previewTitle, setPreviewTitle] = useState('');
const [fileList, setFileList] = useState([]);
console.log(fileList, "fileList")
useEffect(() => {
// Inside Imageupload.jsx
@ -94,6 +97,19 @@ const App = ({ singleImage, updateImageUrl, ImageLink = '', listType }) => {
</div>
);
const handleCameraCapture = async (e) => {
const file = e.target.files[0];
if (!file) return;
let data = await dispatch(uploadImage(file)).unwrap();
if (data?.data?.status) {
updateImageUrl(data?.data?.image);
setFileList([{ url: data?.data?.image }]);
}
};
return (
<>
<Upload
@ -125,6 +141,20 @@ const App = ({ singleImage, updateImageUrl, ImageLink = '', listType }) => {
src={previewImage}
/>
</Modal>
{isMobile && fileList?.length == 0 && <>
<div style={{ textAlign: "center", margin: "6px 0", fontFamily: "Poppins", fontWeight: "500" }}>OR</div>
<Camera
handleCapture={(e) => {
const files = Array.from(e.target.files);
const formattedFileList = files.map((file) => ({
originFileObj: file,
}));
handleChange({ fileList: formattedFileList });
}}
/>
</>}
</>
);
};

43
src/Components/MobileComponent/Camera.jsx Normal file
View File

@ -0,0 +1,43 @@
import { useRef } from 'react'
import { TbCapture } from "react-icons/tb";
const Camera = ({ handleCapture = () => { } }) => {
const cameraRef = useRef(null);
return (
<div>
<input
ref={cameraRef}
type="file"
accept="image/*"
capture="environment"
multiple
hidden
onChange={handleCapture}
style={{ display: "none" }}
/>
<div style={{
backgroundColor: "#1292ee",
color: "#fff",
padding: "4px 8px",
fontSize: "12px",
fontWeight: "500",
fontFamily: "Poppins",
display: "flex",
alignItems: "center",
gap: "4px",
borderRadius: "4px",
cursor: "pointer",
marginTop: "5px",
flexWrap: 'nowrap',
whiteSpace: "nowrap"
}} onClick={() => cameraRef.current.click()}>
<TbCapture size={16} />
Take Photo
</div>
</div>
)
}
export default Camera

2
src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3pay.jsx
View File

@ -355,7 +355,7 @@ const BSBillingTable3Pay = () => {
const OrderCardDetail = useSelector(GlobalOrderCardDetails);
const [customerPreviesOrders, setCustomerPreviesOrders] = useState(false);
console.log(paybtns, 'paybtnspaybtnspaybtnspaybtns', currentOrderNetAmount, previousNetAmount);
console.log(OrderCardDetail, 'OrderCardDetail');
//Total calculation
const TotalItems = OrderCardDetail?.length;
const [formattedDate, setFormattedDate] = useState('');

5
src/Pages/BookingScreen/Components/BookingFunctionality/FeaturesFunctionalities.jsx
View File

@ -1193,6 +1193,11 @@ const FeaturesFunctionalities = (props) => {
),
},
];
console.log(ReorderHoldDetails,
BookingType,
GlobalExtraCharge, "GlobalExtraCharge");
const defaultColumns1 = [
{
title: 'ExtraCharge Type',

1
src/Pages/BookingScreen/Components/OtherConponents/Reprint/BSReprint.jsx
View File

@ -1292,6 +1292,7 @@ function BSReprint({ setOpenModel = () => { } }) {
OrderQty: item?.SalesQty,
OrderRate: item?.Rate,
SellingPrice: item?.Rate,
TaxPercentage: (item?.ProdTaxPercentage || 0)
// TotalAmt: formatAmount((item.TotalAmt - item.OfferValue)),
}));

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

@ -756,12 +756,14 @@ const ProductForm = ({
<div className="upload_btn">
<p>Upload Icon</p>
<br></br>
<div style={{ width: 'max-content' }}>
<Imageupload
singleImage={true}
updateImageUrl={updateBrandImageUrl}
ImageLink={imageBrandUrl ? imageBrandUrl : ''}
/>
</div>
</div>
)}
{true && (

2
src/Pages/CommonMaster/CommonMaster.jsx
View File

@ -1158,12 +1158,14 @@ const CommonMaster = () => {
<div className="upload_btn">
<p>Upload Icon</p>
<br />
<div style={{ width: 'max-content' }}>
<Imageupload
singleImage={true}
updateImageUrl={updateImageUrl}
ImageLink={imageUrl ? imageUrl : ''}
/>
</div>
</div>
</Form>
</div>
{radioValue === 'multiple' && !EditState && (

7
src/Pages/EmpMaster/EmpMasterForm.jsx
View File

@ -33,6 +33,8 @@ import { getCommonAppPreference } from '../../Features/BrachLogin/BranchLogin.js
import { AiOutlineDownCircle, AiOutlineUpCircle } from 'react-icons/ai';
// import TextArea from 'antd/es/input/TextArea.js';
import CropUpload from '../../Components/Forms/CropUpload.jsx';
import { isMobile } from 'react-device-detect';
import Camera from '../../Components/MobileComponent/Camera.jsx';
const { Panel } = Collapse;
const { TextArea } = Input;
const subDirectory = import.meta.env.BASE_URL;
@ -1630,6 +1632,9 @@ const EmployeeForm = ({ formType }) => {
length: Math.max(1, imageUrls.length),
}).map((_, idx) => (
<div key={idx} style={{ marginBottom: 12 }}>
<div style={{ width: 'max-content' }}>
<CropUpload
onlineImage={''}
ImageLink={imageUrls[idx]?.image}
@ -1637,7 +1642,7 @@ const EmployeeForm = ({ formType }) => {
updateImageUrls(url, idx)
}
/>
</div>
<Input
placeholder={`Image name (optional)`}
value={imageUrls[idx]?.name || ''}

12
src/Pages/Product/ProductForm.jsx
View File

@ -84,6 +84,7 @@ import {
getCommonAppPreference,
} from '../../Features/BrachLogin/BranchLogin.js';
import RackForm from '../Rack/RackForm.jsx';
import { isMobile } from 'react-device-detect';
const subDirectory = import.meta.env.ENV_BASE_URL;
const ProductForm = ({ formType }) => {
@ -2594,7 +2595,7 @@ const ProductForm = ({ formType }) => {
ImageLink={imageUrl}
updateImageUrl={updateImageUrl}
/>
<div className="onlineimgplus">
<div className="onlineimgplus" style={{ paddingBottom: "1rem" }}>
<button
type="button"
className="onlinebtnProduct"
@ -2619,8 +2620,7 @@ const ProductForm = ({ formType }) => {
<div className="productonlineImg">
{imagedata?.map((item, index) => (
<div
className={`singleimg ${
selectedImage === item ? 'selected' : ''
className={`singleimg ${selectedImage === item ? 'selected' : ''
}`}
key={index}
onClick={() => setSelectedImage(item)}
@ -2640,7 +2640,7 @@ const ProductForm = ({ formType }) => {
></DefaultModal>
</div>
{qrAndTokenDtlsFields?.length > 0 && (
<div className="productcollapse">
<div className="productcollapse" style={{ marginTop: isMobile ? "2rem" : "0.5rem" }}>
<Collapse defaultActiveKey={expandCollapseActive}>
<Panel header="Qrcode and Token" key="1">
<div className="Qrcodediv">
@ -4084,6 +4084,7 @@ const ProductForm = ({ formType }) => {
<div className="upload_btn">
<p>Upload Icon</p>
<br></br>
<div style={{ width: 'max-content' }}>
<Imageupload
singleImage={true}
updateImageUrl={updateCategoryImageUrl}
@ -4092,6 +4093,7 @@ const ProductForm = ({ formType }) => {
</div>
</div>
</div>
</div>
</Form>
}
handleSubmit={submitCategory}
@ -4253,6 +4255,7 @@ const ProductForm = ({ formType }) => {
<div className="upload_btn">
<p>Upload Icon</p>
<br></br>
<div style={{ width: 'max-content' }}>
<Imageupload
singleImage={true}
updateImageUrl={updateBrandImageUrl}
@ -4261,6 +4264,7 @@ const ProductForm = ({ formType }) => {
</div>
</div>
</div>
</div>
<div className="subColumnFlex">
<div>

2
src/Pages/Ticket/TicketForm.jsx
View File

@ -699,6 +699,7 @@ const TicketForm = () => {
<div className="upload_btn">
<p>Upload Attachment</p>
<br></br>
<div style={{ width: 'max-content' }}>
<Imageupload
singleImage={true}
updateImageUrl={updateImageUrl}
@ -708,6 +709,7 @@ const TicketForm = () => {
</div>
</div>
</div>
</div>
<div className="submitButton">
<Buttons