83 lines
2.4 KiB
JavaScript
83 lines
2.4 KiB
JavaScript
import React from "react";
|
|
import { connect } from "react-redux";
|
|
import { SpinnerCircular } from 'spinners-react';
|
|
|
|
import { getImage } from '../../../actions';
|
|
|
|
class Manager extends React.Component
|
|
{
|
|
constructor(props)
|
|
{
|
|
super(props);
|
|
this.state = {
|
|
company: {},
|
|
photo: undefined,
|
|
loading: true,
|
|
};
|
|
}
|
|
|
|
static getDerivedStateFromProps(nextProps, prevState)
|
|
{
|
|
return {
|
|
company: nextProps.company,
|
|
};
|
|
}
|
|
|
|
componentDidMount()
|
|
{
|
|
const { company } = this.state;
|
|
|
|
if(company.manager_photo !== undefined && company.manager_photo !== null && company.manager_photo !== "")
|
|
{
|
|
getImage({ id: company.manager_photo })
|
|
.then((result) =>
|
|
{
|
|
this.setState({ photo: result, loading: false });
|
|
})
|
|
}
|
|
else
|
|
{
|
|
this.setState({ photo: null, loading: false });
|
|
}
|
|
}
|
|
|
|
render()
|
|
{
|
|
const { company, loading, photo, } = this.state;
|
|
|
|
return (
|
|
<div className="helpBox" { ...this.props }>
|
|
<div className="avatar" style={{ alignItems: "center", justifyContent: "center", display: "flex", }}>
|
|
{ loading ? (
|
|
<SpinnerCircular size={24} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
|
|
) : (
|
|
<img style={{ width: 62, height: 62, borderRadius: 31 }} src={ photo !== null ? photo : `/assets/images/icons/avatar.svg` } loading="lazy" alt={ company.manager_fio } />
|
|
) }
|
|
</div>
|
|
<div className="content">
|
|
<p className="message">Помогу выбрать новый автомобиль</p>
|
|
<p className="name">{ company.manager_fio }</p>
|
|
<p className="position">{ company.manager_jobtitle }</p>
|
|
<div className="info">
|
|
<a href={ `mailto:${ company.manager_email }` }>{ company.manager_email }</a>
|
|
{ company.manager_mobilephone !== undefined && company.manager_mobilephone !== null && company.manager_mobilephone !== "" && (
|
|
<a href={ `tel:+${ company.manager_mobilephone.replace('/[^\d]/m', '') }` }>{ company.manager_mobilephone }</a>
|
|
) }
|
|
{ company.manager_telegram !== undefined && company.manager_telegram !== null && company.manager_telegram !== "" && (
|
|
<a href={ `https://telegram.me/${ company.manager_telegram.replace("@", "") }` } target="_blank">{ `@${ company.manager_telegram.replace("@", "")}` }</a>
|
|
) }
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
function mapStateToProps(state, ownProps)
|
|
{
|
|
return {
|
|
company: state.company,
|
|
}
|
|
}
|
|
|
|
export default connect(mapStateToProps)(Manager); |