Problems panel: hide acknowledge button for read-only users, fix #722

This commit is contained in:
Alexander Zobnin
2019-04-22 13:10:23 +03:00
parent bc889ffe30
commit f908376802
5 changed files with 41 additions and 16 deletions

View File

@@ -36,11 +36,13 @@ export default class AlertAcknowledges extends PureComponent<AlertAcknowledgesPr
{ackRows}
</tbody>
</table>
<div className="ack-add-button">
<button id="add-acknowledge-btn" className="btn btn-mini btn-inverse gf-form-button" onClick={this.handleClick}>
<i className="fa fa-plus"></i>
</button>
</div>
{problem.showAckButton &&
<div className="ack-add-button">
<button id="add-acknowledge-btn" className="btn btn-mini btn-inverse gf-form-button" onClick={this.handleClick}>
<i className="fa fa-plus"></i>
</button>
</div>
}
</div>
);
}

View File

@@ -44,7 +44,10 @@ export default class AlertCard extends PureComponent<AlertCardProps, AlertCardSt
}
showAckDialog = () => {
this.setState({ showAckDialog: true });
const problem = this.props.problem;
if (problem.showAckButton) {
this.setState({ showAckDialog: true });
}
}
closeAckDialog = () => {
@@ -258,14 +261,20 @@ class AlertAcknowledgesButton extends PureComponent<AlertAcknowledgesButtonProps
render() {
const { problem } = this.props;
return (
problem.acknowledges && problem.acknowledges.length ?
let content = null;
if (problem.acknowledges && problem.acknowledges.length) {
content = (
<Tooltip placement="bottom" popperClassName="ack-tooltip" content={this.renderTooltipContent}>
<span><i className="fa fa-comments"></i></span>
</Tooltip> :
</Tooltip>
);
} else if (problem.showAckButton) {
content = (
<Tooltip placement="bottom" content="Acknowledge problem">
<span role="button" onClick={this.handleClick}><i className="fa fa-comments-o"></i></span>
</Tooltip>
);
);
}
return content;
}
}

View File

@@ -110,12 +110,14 @@ export default class ProblemDetails extends PureComponent<ProblemDetailsProps, P
{problem.items && <ProblemItems items={problem.items} />}
</div>
<ProblemStatusBar problem={problem} alerts={alerts} className={compactStatusBar && 'compact'} />
<div className="problem-actions">
<ProblemActionButton className="navbar-button navbar-button--settings"
icon="reply-all"
tooltip="Acknowledge problem"
onClick={this.showAckDialog} />
</div>
{problem.showAckButton &&
<div className="problem-actions">
<ProblemActionButton className="navbar-button navbar-button--settings"
icon="reply-all"
tooltip="Acknowledge problem"
onClick={this.showAckDialog} />
</div>
}
</div>
{problem.comments &&
<div className="problem-description">