loan/user-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

recode and add editor config

Browse Source
This commit is contained in:
Amirhossein Mahmoodi
2023-07-31 15:27:34 +03:30
parent 8a3e82bb9a
commit 51228f3c02
88 changed files with 5121 additions and 4138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

257
src/core/components/UploadSystem.jsx
View File

@@ -1,148 +1,147 @@
import { Box, Button, TextField, Typography } from "@mui/material";
import { useTranslations } from "next-intl";
import {Box, Button, TextField, Typography} from "@mui/material";
import {useTranslations} from "next-intl";
import Image from "next/image";
import DeleteForeverIcon from "@mui/icons-material/DeleteForever";
import { useRef } from "react";
import {useRef} from "react";
const UploadSystem = ({
selectedImage,
setselectedImage,
handleUploadChange,
fieldname,
setFieldValue,
imageAlt,
imageSize,
fileType,
fileName,
label,
}) => {
const t = useTranslations();
const fileInputRef = useRef(null);
selectedImage,
setselectedImage,
handleUploadChange,
fieldname,
setFieldValue,
imageAlt,
imageSize,
fileType,
fileName,
label,
}) => {
const t = useTranslations();
const fileInputRef = useRef(null);
const handleClick = () => {
fileInputRef.current.click();
};
const handleDeleteImage = () => {
setselectedImage("/images/upload-image.svg");
setFieldValue(fieldname, null);
};
const handleClick = () => {
fileInputRef.current.click();
};
const handleDeleteImage = () => {
setselectedImage("/images/upload-image.svg");
setFieldValue(fieldname, null);
};
const isDocumentFormat = (fileType) => {
const documentFormats = [
"application/pdf",
"application/msword",
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
"application/vnd.ms-excel",
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
];
return documentFormats.includes(fileType);
};
const isDocumentFormat = (fileType) => {
const documentFormats = [
"application/pdf",
"application/msword",
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
"application/vnd.ms-excel",
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
];
return documentFormats.includes(fileType);
};
return (
<Box sx={{ width: imageSize[0], my: 2 }}>
<Typography
margin={2}
sx={{
fontWeight: 500,
fontSize: "1rem",
color: "#a19d9d",
}}
textAlign="center"
>
{label}
</Typography>
{selectedImage === "/images/upload-image.svg" ? (
<Image
width={imageSize[0]}
height={imageSize[1]}
src={selectedImage}
priority
alt={imageAlt}
onClick={handleClick}
style={{
cursor: "pointer",
objectFit: "contain",
border: "1px dashed #e1e1e1",
borderBottom: "unset",
padding: "5px",
}}
/>
) : fileType && fileType.startsWith("image/") ? (
<Image
width={imageSize[0]}
height={imageSize[1]}
src={selectedImage}
priority
alt={imageAlt}
onClick={handleClick}
style={{
cursor: "pointer",
objectFit: "contain",
border: "1px dashed #e1e1e1",
borderBottom: "unset",
padding: "5px",
}}
/>
) : (
fileType &&
isDocumentFormat(fileType) && (
<Box
sx={{
width: imageSize[0],
height: imageSize[1],
display: "flex",
border: "1px dashed #e1e1e1",
borderBottom: "unset",
alignItems: "center",
justifyContent: "center",
}}
onClick={handleClick}
>
return (
<Box sx={{width: imageSize[0], my: 2}}>
<Typography
margin={2}
sx={{
fontWeight: 600,
fontSize: "1rem",
color: "#a19d9d",
}}
textAlign="center"
margin={2}
sx={{
fontWeight: 500,
fontSize: "1rem",
color: "#a19d9d",
}}
textAlign="center"
>
{fileName}
{label}
</Typography>
</Box>
)
)}
{selectedImage === "/images/upload-image.svg" ? (
<Image
width={imageSize[0]}
height={imageSize[1]}
src={selectedImage}
priority
alt={imageAlt}
onClick={handleClick}
style={{
cursor: "pointer",
objectFit: "contain",
border: "1px dashed #e1e1e1",
borderBottom: "unset",
padding: "5px",
}}
/>
) : fileType && fileType.startsWith("image/") ? (
<Image
width={imageSize[0]}
height={imageSize[1]}
src={selectedImage}
priority
alt={imageAlt}
onClick={handleClick}
style={{
cursor: "pointer",
objectFit: "contain",
border: "1px dashed #e1e1e1",
borderBottom: "unset",
padding: "5px",
}}
/>
) : (
fileType &&
isDocumentFormat(fileType) && (
<Box
sx={{
width: imageSize[0],
height: imageSize[1],
display: "flex",
border: "1px dashed #e1e1e1",
borderBottom: "unset",
alignItems: "center",
justifyContent: "center",
}}
onClick={handleClick}
>
<Typography
margin={2}
sx={{
fontWeight: 600,
fontSize: "1rem",
color: "#a19d9d",
}}
textAlign="center"
>
{fileName}
</Typography>
</Box>
)
)}
<TextField
id="avatar-upload"
type="file"
accept="image/*"
style={{ display: "none" }}
onChange={handleUploadChange}
inputRef={fileInputRef}
/>
<Button
sx={{
width: "100%",
borderTopLeftRadius: "unset",
borderTopRightRadius: "unset",
}}
color="error"
disabled={selectedImage === "/images/upload-image.svg"}
endIcon={<DeleteForeverIcon />}
variant="contained"
onClick={handleDeleteImage}
>
{t("delete")}
</Button>
</Box>
);
<TextField
id="avatar-upload"
type="file"
accept="image/*"
style={{display: "none"}}
onChange={handleUploadChange}
inputRef={fileInputRef}
/>
<Button
sx={{
width: "100%",
borderTopLeftRadius: "unset",
borderTopRightRadius: "unset",
}}
color="error"
disabled={selectedImage === "/images/upload-image.svg"}
endIcon={<DeleteForeverIcon/>}
variant="contained"
onClick={handleDeleteImage}
>
{t("delete")}
</Button>
</Box>
);
};
export default UploadSystem;
//////****** usage document ******/////////
// 1.) use <UploadSystem /> component inside your page
// 2.) list of props that you need to send is down below