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.
73 lines
2.1 KiB
73 lines
2.1 KiB
import React from "react"; |
|
import AddAPhotoIcon from "@material-ui/icons/AddAPhoto"; |
|
|
|
export default function Upload(props) { |
|
let { parent } = props; |
|
return ( |
|
<> |
|
{window.innerWidth < 1000 ? ( |
|
<div className="mobile-auth-profile__upload d-flex justify-content-center align-items-center mb-3"> |
|
<> |
|
{isNaN(+parent.state.file) ? ( |
|
<AddAPhotoIcon |
|
style={{ width: 40, height: 40, color: "white" }} |
|
/> |
|
) : ( |
|
<img |
|
src={ |
|
parent.state.file.name |
|
? URL.createObjectURL(parent.state.file) |
|
: window.baseURL + "file/" + parent.state.file |
|
} |
|
alt={""} |
|
/> |
|
)} |
|
<input |
|
type="file" |
|
name="file" |
|
onChange={(e) => |
|
parent.onChange(e.target.name, e.target.files[0]) |
|
} |
|
/> |
|
</> |
|
</div> |
|
) : null} |
|
{window.innerWidth > 1000 ? ( |
|
<div className="auth-profile__upload d-flex justify-content-center-align-items-center"> |
|
<> |
|
{parent.state.file === null ? ( |
|
<AddAPhotoIcon |
|
style={{ |
|
width: 40, |
|
height: 40, |
|
color: "grey", |
|
position: "absolute", |
|
left: "calc(50% - 20px)", |
|
top: "calc(50% - 20px)", |
|
}} |
|
/> |
|
) : ( |
|
<img |
|
src={ |
|
parent.state.file.name |
|
? URL.createObjectURL(parent.state.file) |
|
: window.baseURL + "file/" + parent.state.file |
|
} |
|
alt={"کاربر"} |
|
/> |
|
)} |
|
<input |
|
label={props.label} |
|
onChange={(e) => |
|
parent.onChange(e.target.name, e.target.files[0]) |
|
} |
|
name={props.name} |
|
defaultValue="" |
|
type="file" |
|
/> |
|
</> |
|
</div> |
|
) : null} |
|
</> |
|
); |
|
}
|
|
|