You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
65 lines
2.0 KiB
65 lines
2.0 KiB
import React, { useEffect } from "react"; |
|
import { connect } from "react-redux"; |
|
import { publicApi } from "../../../redux/actions"; |
|
import { useNavigate } from "react-router-dom"; |
|
import Scanner from "react-qr-reader"; |
|
import laptopImage from "../../../assets/images/laptop.svg"; |
|
|
|
const facingMode = ["environment", "user"]; |
|
|
|
export const Scan = ({ |
|
setHeaderOptions, |
|
}) => { |
|
const navigate = useNavigate(); |
|
|
|
const handleScan = (data) => { |
|
navigate(`/scan/${data}`); |
|
}; |
|
|
|
const handleError = (err) => { |
|
}; |
|
|
|
useEffect(() => { |
|
setHeaderOptions({shown : false}); |
|
}); |
|
|
|
return ( |
|
<div |
|
className="w-full h-screen overflow-hidden bg-transparent px-0 transform -translate-y-16" |
|
style={{ backgroundImage: `url(${laptopImage})` }} |
|
> |
|
<div className="w-full h-full flex flex-col justify-center bg-gray-700 items-center px-6 bg-opacity-70 backdrop-filter backdrop-blur-sm"> |
|
<div className="rounded-3xl overflow-hidden w-full"> |
|
<Scanner |
|
delay={300} |
|
onError={handleError} |
|
onScan={handleScan} |
|
style={{ width: "100%" }} |
|
facingMode={facingMode[0]} |
|
/> |
|
</div> |
|
<strong className="mt-4 text-white text-base"> |
|
اسکن کد QR فعالسازی کتاب |
|
</strong> |
|
<p className="text-sm text-white text-center mt-2 font-medium leading-5"> |
|
کد کیو آر روی کارت فعالسازی را با دوربین گوشی اسکن کنید تا محتوای |
|
دیجیتال مربوط به کتاب برای شما فعال شود |
|
</p> |
|
<button |
|
onClick={() => navigate(-1)} |
|
className="py-3 mt-16 w-2/5 rounded-3xl border-2 border-solid border-blueC0 text-blueC0 text-lg font-semibold" |
|
> |
|
بازگشت |
|
</button> |
|
</div> |
|
</div> |
|
); |
|
}; |
|
|
|
const mapStateToProps = (state) => ({}); |
|
|
|
const mapDispatchToProps = { |
|
setHeaderOptions: publicApi.setHeaderOptions, |
|
}; |
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(Scan);
|
|
|