import React, { Component } from "react"; import ChatIcon from "@material-ui/icons/Chat"; import FileTabs from "./FileTabs"; import Gallery from "./Gallery"; 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: [ "استاد علوم طبیعی پایه دوازدهم", "کارشناس ارشد علوم و فنون از دانشگاه تهران", ], name: "محسن محمدی", lastAct: "2 دقیقه پیش آنلاین بوده", bio: "لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنام", }, }; } setGallery = (val) => { this.setState({ gallery: val, }); }; handleChange = () => { this.setState((prevState) => ({ alarms: !prevState.alarms, })); }; render() { const { user, gallery, 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 ? 'روشن ': 'خاموش'} 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 ? 'روشن ': 'خاموش'} 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}