111 lines
3.0 KiB
JavaScript
111 lines
3.0 KiB
JavaScript
import React from 'react';
|
|
import { ButtonGroup } from 'react-bootstrap';
|
|
|
|
import Button from '../../components/Button';
|
|
import CssEditor from './CssEditor';
|
|
import RefreshIntervalModal from './RefreshIntervalModal';
|
|
import SaveModal from './SaveModal';
|
|
import CodeModal from './CodeModal';
|
|
import SliceAdder from './SliceAdder';
|
|
|
|
const $ = window.$ = require('jquery');
|
|
|
|
const propTypes = {
|
|
dashboard: React.PropTypes.object.isRequired,
|
|
};
|
|
|
|
class Controls extends React.PureComponent {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
css: props.dashboard.css || '',
|
|
cssTemplates: [],
|
|
};
|
|
}
|
|
componentWillMount() {
|
|
$.get('/csstemplateasyncmodelview/api/read', (data) => {
|
|
const cssTemplates = data.result.map(row => ({
|
|
value: row.template_name,
|
|
css: row.css,
|
|
label: row.template_name,
|
|
}));
|
|
this.setState({ cssTemplates });
|
|
});
|
|
}
|
|
refresh() {
|
|
this.props.dashboard.sliceObjects.forEach((slice) => {
|
|
slice.render(true);
|
|
});
|
|
}
|
|
changeCss(css) {
|
|
this.setState({ css });
|
|
this.props.dashboard.onChange();
|
|
}
|
|
render() {
|
|
const dashboard = this.props.dashboard;
|
|
const canSave = dashboard.dash_save_perm;
|
|
const emailBody = `Checkout this dashboard: ${window.location.href}`;
|
|
const emailLink = 'mailto:?Subject=Superset%20Dashboard%20'
|
|
+ `${dashboard.dashboard_title}&Body=${emailBody}`;
|
|
return (
|
|
<ButtonGroup>
|
|
<Button
|
|
tooltip="Force refresh the whole dashboard"
|
|
onClick={this.refresh.bind(this)}
|
|
>
|
|
<i className="fa fa-refresh" />
|
|
</Button>
|
|
<SliceAdder
|
|
dashboard={dashboard}
|
|
triggerNode={
|
|
<i className="fa fa-plus" />
|
|
}
|
|
/>
|
|
<RefreshIntervalModal
|
|
onChange={refreshInterval => dashboard.startPeriodicRender(refreshInterval * 1000)}
|
|
triggerNode={
|
|
<i className="fa fa-clock-o" />
|
|
}
|
|
/>
|
|
<CodeModal
|
|
codeCallback={dashboard.readFilters.bind(dashboard)}
|
|
triggerNode={<i className="fa fa-filter" />}
|
|
/>
|
|
<CssEditor
|
|
dashboard={dashboard}
|
|
triggerNode={
|
|
<i className="fa fa-css3" />
|
|
}
|
|
initialCss={dashboard.css}
|
|
templates={this.state.cssTemplates}
|
|
onChange={this.changeCss.bind(this)}
|
|
/>
|
|
<Button
|
|
disabled={!canSave}
|
|
onClick={() => {
|
|
window.location = `/dashboardmodelview/edit/${dashboard.id}`;
|
|
}}
|
|
tooltip="Edit this dashboard's property"
|
|
>
|
|
<i className="fa fa-edit" />
|
|
</Button>
|
|
<SaveModal
|
|
dashboard={dashboard}
|
|
css={this.state.css}
|
|
triggerNode={
|
|
<i className="fa fa-save" />
|
|
}
|
|
/>
|
|
<Button
|
|
onClick={() => { window.location = emailLink; }}
|
|
>
|
|
<i className="fa fa-envelope" />
|
|
</Button>
|
|
</ButtonGroup>
|
|
);
|
|
}
|
|
}
|
|
Controls.propTypes = propTypes;
|
|
|
|
export default Controls;
|