|
|
|
|
@ -3,7 +3,11 @@ import ReactAudioPlayer from 'react-audio-player'; |
|
|
|
|
import ReactPlayer from 'react-player'; |
|
|
|
|
import CloudDownloadIcon from '@material-ui/icons/CloudDownload'; |
|
|
|
|
import Avatar from '@material-ui/core/Avatar'; |
|
|
|
|
|
|
|
|
|
import moment from 'jalali-moment'; |
|
|
|
|
import DoneIcon from '@material-ui/icons/Done'; |
|
|
|
|
import DoneAllIcon from '@material-ui/icons/DoneAll'; |
|
|
|
|
import EditIcon from '@material-ui/icons/Edit'; |
|
|
|
|
import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; |
|
|
|
|
import './NormalMessage.scss'; |
|
|
|
|
|
|
|
|
|
export default class NormalMessage extends Component { |
|
|
|
|
@ -13,8 +17,8 @@ export default class NormalMessage extends Component { |
|
|
|
|
<div |
|
|
|
|
className="normal-message d-flex flex-column d-flex" |
|
|
|
|
style={{ |
|
|
|
|
marginRight: isSelf ? 0 : 40, |
|
|
|
|
marginLeft: isSelf ? 40 : 0, |
|
|
|
|
marginRight: isSelf ? 0 : 70, |
|
|
|
|
marginLeft: isSelf ? 70 : 0, |
|
|
|
|
filter: document !== null ? 'blur(16px)' : 'blur(0px)', |
|
|
|
|
}} |
|
|
|
|
> |
|
|
|
|
@ -22,7 +26,7 @@ export default class NormalMessage extends Component { |
|
|
|
|
alt={user.name} |
|
|
|
|
src={window.baseURL + '/file/download/' + user.fileId} |
|
|
|
|
className="" |
|
|
|
|
style={{ backgroundColor: user.color }} |
|
|
|
|
style={{ backgroundColor: user.color, alignSelf: isSelf ? 'flex-end' : 'flex-start' }} |
|
|
|
|
> |
|
|
|
|
{user.name |
|
|
|
|
.split(' ') |
|
|
|
|
@ -55,15 +59,16 @@ export default class NormalMessage extends Component { |
|
|
|
|
className="normal-message__box--detail d-flex" |
|
|
|
|
style={{ |
|
|
|
|
top: 0, |
|
|
|
|
right: isSelf ? 'auto' : 20, |
|
|
|
|
left: isSelf ? 20 : 'auto', |
|
|
|
|
|
|
|
|
|
direction: isSelf ? 'ltr' : 'rtl', |
|
|
|
|
paddingRight: isSelf ? 90 : 'auto', |
|
|
|
|
paddingLeft: isSelf ? 'auto' : 90, |
|
|
|
|
paddingRight: isSelf ? 60 : 0, |
|
|
|
|
paddingLeft: isSelf ? 15 : 70, |
|
|
|
|
}} |
|
|
|
|
> |
|
|
|
|
<div style={{ color: isSelf ? '#aaa' : 'gray' }}> |
|
|
|
|
<ExpandMoreIcon fontSize="small" /> |
|
|
|
|
</div> |
|
|
|
|
<div style={{ color: isSelf ? '#aaa' : 'gray' }}>{user.name}</div> |
|
|
|
|
<span style={{ color: isSelf ? '#aaa' : 'gray' }}>{message.date}</span> |
|
|
|
|
</div> |
|
|
|
|
) : null} |
|
|
|
|
|
|
|
|
|
@ -119,6 +124,21 @@ export default class NormalMessage extends Component { |
|
|
|
|
<div>{message.document.name}</div> |
|
|
|
|
</a> |
|
|
|
|
) : null} |
|
|
|
|
<div className="normal-message__box--dete d-flex"> |
|
|
|
|
<span style={{ color: isSelf ? '#aaa' : 'gray' }}> |
|
|
|
|
{message.status == 1 && <DoneIcon fontSize="small" />} |
|
|
|
|
{message.status == 2 && <DoneAllIcon fontSize="small" />} |
|
|
|
|
{message.updatedAt ? ( |
|
|
|
|
<> |
|
|
|
|
<span> ویرایش در</span> |
|
|
|
|
|
|
|
|
|
{moment(message.updatedAt).format(' hh:mm jMM/jDD')} |
|
|
|
|
</> |
|
|
|
|
) : ( |
|
|
|
|
moment(message.createdAt).format('hh:mm') |
|
|
|
|
)} |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
|
Gorji
