import React, { Component } from "react"; import FileTabs from "./FileTabs"; import VideocamOutlinedIcon from "@material-ui/icons/VideocamOutlined"; import CallOutlinedIcon from "@material-ui/icons/CallOutlined"; import MoreHorizOutlinedIcon from "@material-ui/icons/MoreHorizOutlined"; import Switch from "@material-ui/core/Switch"; import { withStyles } from "@material-ui/core/styles"; import BlockIcon from "@material-ui/icons/Block"; import KeyboardArrowLeftIcon from "@material-ui/icons/KeyboardArrowLeft"; import KeyboardBackspaceIcon from "@material-ui/icons/KeyboardBackspace"; import CloseIcon from "@material-ui/icons/Close"; import user2 from "../../../assets/images/user2.png"; import "./index.scss"; const maxDesktopSize = 1250; const maxMobileSize = 650; const fontSize = { desktop: { h1: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 70, h2: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 80, p: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 85, h3: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 85, span: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 85, }, mobile: { h1: window.innerWidth > maxMobileSize ? 20 : window.innerWidth / 20, h2: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 23, p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 30, h3: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 25, span: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 28, }, }; export default class ChatInfo extends Component { constructor(props) { super(props); this.state = { gallery: false, alarms: false, buttons: [ { icon: ( ), backgroundColor: "#00CC69", }, { icon: ( ), backgroundColor: "blue", }, { icon: ( ), backgroundColor: "grey", }, ], user: { profileImages: [ { id: 0, src: user2 }, { id: 1, src: user2 }, { id: 2, src: user2 }, { id: 3, src: user2 }, ], username: "MohammadReza", educationalInfo: [ window.t("استاد علوم طبیعی پایه دوازدهم"), window.t("کارشناس ارشد علوم و فنون از دانشگاه تهران"), ], name: window.t("محسن محمدی"), lastAct: window.t("2 دقیقه پیش آنلاین بوده"), bio: window.t( "لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنام" ), }, }; } setGallery = (val) => { this.setState({ gallery: val, }); }; handleChange = () => { this.setState((prevState) => ({ alarms: !prevState.alarms, })); }; render() { const { user, buttons, alarms } = this.state; return ( <> {window.innerWidth > 1000 ? ( {this.state.gallery ? ( this.setState({ gallery: false })} style={{ cursor: "pointer", width: 35, height: 35, position: "absolute", left: 10, top: 10, }} /> ) : ( this.props.parent.handleDrawerClose()} style={{ cursor: "pointer", width: 35, height: 35, position: "absolute", left: 10, top: 10, }} /> )} {!this.state.gallery ? ( {user.name} اطلاعات {user.bio} مشخصات تحصیلی {user.educationalInfo.map((item, i) => ( {item} ))} {buttons.map((item, i) => ( {item.icon} ))} نام کاربری {user.username}@ اعلانات {alarms ? "روشن " : window.t("خاموش")} this.handleChange()} /> this.setState({ gallery: true })} > رسانه,فیلم,عکس مسدود سازی مخاطب ) : ( )} ) : null} {window.innerWidth < 1000 ? ( {this.state.gallery ? ( this.setState({ gallery: false })} style={{ cursor: "pointer", width: 35, height: 35, position: "absolute", left: 10, top: 10, }} /> ) : ( window.innerWidth > 1000 ? this.props.parent.handleDrawerClose() : this.props.parent.setState({ page: "chatroom" }) } style={{ cursor: "pointer", width: 35, height: 35, position: "absolute", left: 10, top: 10, }} /> )} {!this.state.gallery ? ( {user.name} اطلاعات {user.bio} مشخصات تحصیلی {user.educationalInfo.map((item, i) => ( {item} ))} {buttons.map((item, i) => ( {item.icon} ))} نام کاربری {user.username}@ اعلانات {alarms ? "روشن " : window.t("خاموش")} this.handleChange()} /> this.setState({ gallery: true })} > رسانه,فیلم,عکس مسدود سازی مخاطب ) : ( )} ) : null} > ); } } const AntSwitch = withStyles((theme) => ({ root: { width: 28, height: 16, padding: 0, display: "flex", }, switchBase: { padding: 2, color: "", "&$checked": { transform: "translateX(12px)", color: theme.palette.common.white, "& + $track": { opacity: 1, backgroundColor: "#00CC69", borderColor: "#00CC69", }, }, }, thumb: { width: 12, height: 12, boxShadow: "none", }, track: { border: `1px solid ${theme.palette.grey[500]}`, borderRadius: 16 / 2, opacity: 1, backgroundColor: theme.palette.common.white, }, checked: {}, }))(Switch);
{user.bio}