mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-19 07:16:39 +00:00
Use ha-dialog for dialog-system-log-details, add close icon button (#7513)
This commit is contained in:
parent
7499892bc2
commit
394d552856
@ -1,6 +1,6 @@
|
||||
import "../../../components/ha-header-bar";
|
||||
import "@material/mwc-icon-button/mwc-icon-button";
|
||||
import { mdiContentCopy } from "@mdi/js";
|
||||
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
|
||||
import { mdiContentCopy, mdiClose } from "@mdi/js";
|
||||
import "@polymer/paper-tooltip/paper-tooltip";
|
||||
import type { PaperTooltipElement } from "@polymer/paper-tooltip/paper-tooltip";
|
||||
import {
|
||||
@ -14,7 +14,7 @@ import {
|
||||
TemplateResult,
|
||||
} from "lit-element";
|
||||
import { fireEvent } from "../../../common/dom/fire_event";
|
||||
import "../../../components/dialog/ha-paper-dialog";
|
||||
import "../../../components/ha-dialog";
|
||||
import "../../../components/ha-svg-icon";
|
||||
import {
|
||||
domainToName,
|
||||
@ -23,7 +23,6 @@ import {
|
||||
IntegrationManifest,
|
||||
} from "../../../data/integration";
|
||||
import { getLoggedErrorIntegration } from "../../../data/system_log";
|
||||
import type { PolymerChangedEvent } from "../../../polymer-types";
|
||||
import { haStyleDialog } from "../../../resources/styles";
|
||||
import type { HomeAssistant } from "../../../types";
|
||||
import type { SystemLogDetailDialogParams } from "./show-dialog-system-log-detail";
|
||||
@ -36,7 +35,7 @@ class DialogSystemLogDetail extends LitElement {
|
||||
|
||||
@internalProperty() private _manifest?: IntegrationManifest;
|
||||
|
||||
@query("paper-tooltip", true) private _toolTip?: PaperTooltipElement;
|
||||
@query("paper-tooltip") private _toolTip?: PaperTooltipElement;
|
||||
|
||||
public async showDialog(params: SystemLogDetailDialogParams): Promise<void> {
|
||||
this._params = params;
|
||||
@ -69,23 +68,23 @@ class DialogSystemLogDetail extends LitElement {
|
||||
const integration = getLoggedErrorIntegration(item);
|
||||
|
||||
return html`
|
||||
<ha-paper-dialog
|
||||
with-backdrop
|
||||
opened
|
||||
@opened-changed="${this._openedChanged}"
|
||||
>
|
||||
<div class="heading">
|
||||
<h2>
|
||||
<ha-dialog open @closed=${this.closeDialog} hideActions heading=${true}>
|
||||
<ha-header-bar slot="heading">
|
||||
<mwc-icon-button slot="navigationIcon" dialogAction="cancel">
|
||||
<ha-svg-icon .path=${mdiClose}></ha-svg-icon>
|
||||
</mwc-icon-button>
|
||||
<span slot="title">
|
||||
${this.hass.localize(
|
||||
"ui.panel.config.logs.details",
|
||||
"level",
|
||||
item.level
|
||||
)}
|
||||
</h2>
|
||||
<mwc-icon-button id="copy" @click=${this._copyLog}>
|
||||
</span>
|
||||
<mwc-icon-button id="copy" @click=${this._copyLog} slot="actionItems">
|
||||
<ha-svg-icon .path=${mdiContentCopy}></ha-svg-icon>
|
||||
</mwc-icon-button>
|
||||
<paper-tooltip
|
||||
slot="actionItems"
|
||||
manual-mode
|
||||
for="copy"
|
||||
position="left"
|
||||
@ -93,8 +92,8 @@ class DialogSystemLogDetail extends LitElement {
|
||||
offset="4"
|
||||
>${this.hass.localize("ui.common.copied")}</paper-tooltip
|
||||
>
|
||||
</div>
|
||||
<paper-dialog-scrollable>
|
||||
</ha-header-bar>
|
||||
<div class="contents">
|
||||
<p>
|
||||
Logger: ${item.name}<br />
|
||||
Source: ${item.source.join(":")}
|
||||
@ -150,8 +149,8 @@ class DialogSystemLogDetail extends LitElement {
|
||||
`
|
||||
: item.message[0]}
|
||||
${item.exception ? html` <pre>${item.exception}</pre> ` : html``}
|
||||
</paper-dialog-scrollable>
|
||||
</ha-paper-dialog>
|
||||
</div>
|
||||
</ha-dialog>
|
||||
`;
|
||||
}
|
||||
|
||||
@ -163,15 +162,9 @@ class DialogSystemLogDetail extends LitElement {
|
||||
}
|
||||
}
|
||||
|
||||
private _openedChanged(ev: PolymerChangedEvent<boolean>): void {
|
||||
if (!(ev.detail as any).value) {
|
||||
this.closeDialog();
|
||||
}
|
||||
}
|
||||
|
||||
private _copyLog(): void {
|
||||
const copyElement = this.shadowRoot?.querySelector(
|
||||
"paper-dialog-scrollable"
|
||||
".contents"
|
||||
) as HTMLElement;
|
||||
|
||||
const selection = window.getSelection()!;
|
||||
@ -192,9 +185,6 @@ class DialogSystemLogDetail extends LitElement {
|
||||
return [
|
||||
haStyleDialog,
|
||||
css`
|
||||
ha-paper-dialog {
|
||||
direction: ltr;
|
||||
}
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
@ -205,13 +195,19 @@ class DialogSystemLogDetail extends LitElement {
|
||||
margin-bottom: 0;
|
||||
font-family: var(--code-font-family, monospace);
|
||||
}
|
||||
.heading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
ha-header-bar {
|
||||
--mdc-theme-on-primary: var(--primary-text-color);
|
||||
--mdc-theme-primary: var(--mdc-theme-surface);
|
||||
flex-shrink: 0;
|
||||
border-bottom: 1px solid
|
||||
var(--mdc-dialog-scroll-divider-color, rgba(0, 0, 0, 0.12));
|
||||
}
|
||||
|
||||
@media all and (min-width: 451px) and (min-height: 501px) {
|
||||
ha-dialog {
|
||||
--mdc-dialog-max-width: 90vw;
|
||||
}
|
||||
.heading ha-svg-icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
`,
|
||||
];
|
||||
|
Loading…
x
Reference in New Issue
Block a user