Moved add panel panel and renamed it to add panel widget

This commit is contained in:
Torkel Ödegaard 2019-01-24 09:23:48 +01:00
parent 11c306abde
commit e713b0f029
5 changed files with 19 additions and 18 deletions

View File

@ -1,23 +1,23 @@
import React from 'react';
import _ from 'lodash';
import config from 'app/core/config';
import { PanelModel } from '../panel_model';
import { DashboardModel } from '../dashboard_model';
import { PanelModel } from '../../panel_model';
import { DashboardModel } from '../../dashboard_model';
import store from 'app/core/store';
import { LS_PANEL_COPY_KEY } from 'app/core/constants';
import { updateLocation } from 'app/core/actions';
import { store as reduxStore } from 'app/store/store';
export interface AddPanelPanelProps {
export interface Props {
panel: PanelModel;
dashboard: DashboardModel;
}
export interface AddPanelPanelState {
export interface State {
copiedPanelPlugins: any[];
}
export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelPanelState> {
export class AddPanelWidget extends React.Component<Props, State> {
constructor(props) {
super(props);
this.handleCloseAddPanel = this.handleCloseAddPanel.bind(this);
@ -133,15 +133,15 @@ export class AddPanelPanel extends React.Component<AddPanelPanelProps, AddPanelP
}
return (
<div className="panel-container add-panel-container">
<div className="add-panel">
<div className="add-panel__header grid-drag-handle">
<div className="panel-container add-panel-widget-container">
<div className="add-panel-widget">
<div className="add-panel-widget__header grid-drag-handle">
<i className="gicon gicon-add-panel" />
<button className="add-panel__close" onClick={this.handleCloseAddPanel}>
<button className="add-panel-widget__close" onClick={this.handleCloseAddPanel}>
<i className="fa fa-close" />
</button>
</div>
<div className="add-panel-btn-container">
<div className="add-panel-widget__btn-container">
<button className="btn-success btn btn-large" onClick={this.onCreateNewPanel}>
Edit Panel
</button>

View File

@ -1,12 +1,12 @@
.add-panel-container {
.add-panel-widget-container {
height: 100%;
}
.add-panel {
.add-panel-widget {
height: 100%;
}
.add-panel__header {
.add-panel-widget__header {
top: 0;
position: absolute;
padding: 0 15px;
@ -26,7 +26,7 @@
}
}
.add-panel__close {
.add-panel-widget__close {
margin-left: auto;
background-color: transparent;
border: 0;
@ -34,7 +34,7 @@
margin-right: -10px;
}
.add-panel-btn-container {
.add-panel-widget__btn-container {
display: flex;
justify-content: center;
align-items: center;

View File

@ -0,0 +1 @@
export { AddPanelWidget } from './AddPanelWidget';

View File

@ -5,7 +5,7 @@ import classNames from 'classnames';
import { getAngularLoader, AngularComponent } from 'app/core/services/AngularLoader';
import { importPluginModule } from 'app/features/plugins/plugin_loader';
import { AddPanelPanel } from './AddPanelPanel';
import { AddPanelWidget } from '../components/AddPanelWidget';
import { getPanelPluginNotFound } from './PanelPluginNotFound';
import { DashboardRow } from './DashboardRow';
import { PanelChrome } from './PanelChrome';
@ -53,7 +53,7 @@ export class DashboardPanel extends PureComponent<Props, State> {
}
renderAddPanel() {
return <AddPanelPanel panel={this.props.panel} dashboard={this.props.dashboard} />;
return <AddPanelWidget panel={this.props.panel} dashboard={this.props.dashboard} />;
}
onPluginTypeChanged = (plugin: PanelPlugin) => {

View File

@ -39,6 +39,7 @@
@import 'layout/page';
// COMPONENTS
@import '../app/features/dashboard/components/AddPanelWidget/AddPanelWidget';
@import 'components/scrollbar';
@import 'components/cards';
@import 'components/buttons';
@ -58,7 +59,6 @@
@import 'components/panel_table';
@import 'components/panel_text';
@import 'components/panel_heatmap';
@import 'components/panel_add_panel';
@import 'components/panel_logs';
@import 'components/settings_permissions';
@import 'components/tagsinput';