Add product picture to ozw node dashboard (#7203)

This commit is contained in:
Charles Garwood 2020-10-15 17:20:54 -04:00 committed by GitHub
parent 213c53e307
commit 2dd7f292b1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -87,11 +87,13 @@ class OZWNodeDashboard extends LitElement {
${this._node ${this._node
? html` ? html`
<ha-card class="content"> <ha-card class="content">
<div class="card-content"> <div class="card-content flex">
<b <div class="node-details">
>${this._node.node_manufacturer_name} <b>
${this._node.node_product_name}</b ${this._node.node_manufacturer_name}
><br /> ${this._node.node_product_name}
</b>
<br />
Node ID: ${this._node.node_id}<br /> Node ID: ${this._node.node_id}<br />
Query Stage: ${this._node.node_query_stage} Query Stage: ${this._node.node_query_stage}
${this._metadata?.metadata.ProductManualURL ${this._metadata?.metadata.ProductManualURL
@ -102,6 +104,14 @@ class OZWNodeDashboard extends LitElement {
</a>` </a>`
: ``} : ``}
</div> </div>
${this._metadata?.metadata.ProductPicBase64
? html`<img
class="product-image"
src="data:image/png;base64,${this._metadata?.metadata
.ProductPicBase64}"
/>`
: ``}
</div>
<div class="card-actions"> <div class="card-actions">
<mwc-button @click=${this._refreshNodeClicked}> <mwc-button @click=${this._refreshNodeClicked}>
Refresh Node Refresh Node
@ -199,6 +209,11 @@ class OZWNodeDashboard extends LitElement {
max-width: 600px; max-width: 600px;
} }
.flex {
display: flex;
justify-content: space-between;
}
.card-actions.warning ha-call-service-button { .card-actions.warning ha-call-service-button {
color: var(--error-color); color: var(--error-color);
} }
@ -219,6 +234,15 @@ class OZWNodeDashboard extends LitElement {
[hidden] { [hidden] {
display: none; display: none;
} }
.product-image {
padding: 12px;
max-height: 140px;
max-width: 140px;
}
.card-actions {
clear: right;
}
`, `,
]; ];
} }