71 lines
2.7 KiB
JavaScript
71 lines
2.7 KiB
JavaScript
import React from 'react';
|
|
import { Modal } from 'antd';
|
|
import { WeaTools } from 'ecCom';
|
|
import './style/index';
|
|
|
|
class WeaBirthday extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this.state = {
|
|
visible: false,
|
|
birthdayInfo: { bgimg: '', curdate: '', congratulation: '', textcolor: '', usercolor: '', userlist: [] },
|
|
};
|
|
}
|
|
|
|
componentWillMount() {
|
|
const date = new Date();
|
|
const today = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
|
|
const __date = WeaTools.ls.getStr('birthday-date');
|
|
if (today != __date) {
|
|
WeaTools.callApi('/api/portal/plugin/birthdayinfo', 'POST', {}).then((result) => {
|
|
if (result.userlist && result.userlist.length) {
|
|
this.setState({
|
|
visible: true,
|
|
birthdayInfo: result,
|
|
});
|
|
|
|
WeaTools.ls.set('birthday-date', today);
|
|
setTimeout(() => this.setState({ visible: false }), 14 * 1000);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const { visible, birthdayInfo } = this.state;
|
|
const { bgimg, curdate, congratulation, textcolor, usercolor, userlist } = birthdayInfo;
|
|
|
|
return (
|
|
<Modal
|
|
wrapClassName="birthday-modal"
|
|
visible={visible}
|
|
title="生日提醒"
|
|
width="499px"
|
|
footer=""
|
|
onOk={() => this.setState({ visible: false })}
|
|
onCancel={() => this.setState({ visible: false })}
|
|
>
|
|
<div className="birthday-content" style={{ background: `url(${bgimg}) center center` }}>
|
|
<div className="birthday-congratulation" style={{ color: `#${textcolor}` }}>
|
|
<div className="birthday-congratulation-content" dangerouslySetInnerHTML={{ __html: congratulation }} />
|
|
<div className="birthday-congratulation-date" style={{ color: `${usercolor}` }}>{curdate}</div>
|
|
</div>
|
|
<div className="birthday-users" style={{ color: `#${textcolor}` }}>
|
|
{
|
|
userlist.map((item, index) => (
|
|
<div key={index} className="birthday-user">
|
|
<div className="birthday-user-lastname">{item.lastname}</div>
|
|
<div className="birthday-user-detial">{item.detialInfo}</div>
|
|
</div>
|
|
))
|
|
}
|
|
</div>
|
|
</div>
|
|
</Modal>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default WeaBirthday;
|