Fixed glitches in new Z-Wave panel [WIP]
This commit is contained in:
parent
a1e2bf9b3a
commit
297c18e176
12 changed files with 80 additions and 29 deletions
2
platypush/backend/http/dist/index.html
vendored
2
platypush/backend/http/dist/index.html
vendored
|
|
@ -1 +1 @@
|
||||||
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>platypush</title><link href="/static/css/chunk-134ec1dc.849ccfd5.css" rel="prefetch"><link href="/static/css/chunk-13b07ca5.029dd736.css" rel="prefetch"><link href="/static/css/chunk-15e147cf.7e460329.css" rel="prefetch"><link href="/static/css/chunk-2606c898.75269c9b.css" rel="prefetch"><link href="/static/css/chunk-283aacba.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-2ca39dde.efa1eae8.css" rel="prefetch"><link href="/static/css/chunk-2e526448.44bbe779.css" rel="prefetch"><link href="/static/css/chunk-2f304dee.a8a2d99a.css" rel="prefetch"><link href="/static/css/chunk-3b435dde.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-49211740.43a25f0f.css" rel="prefetch"><link href="/static/css/chunk-5145872a.197de139.css" rel="prefetch"><link href="/static/css/chunk-53e279b3.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-5a1e13e4.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-62c72861.1a52303d.css" rel="prefetch"><link href="/static/css/chunk-64076603.e451beea.css" rel="prefetch"><link href="/static/css/chunk-6ca797c1.5b949e24.css" rel="prefetch"><link href="/static/css/chunk-711696bb.b7730bd4.css" rel="prefetch"><link href="/static/css/chunk-7c7c5604.678c9c97.css" rel="prefetch"><link href="/static/css/chunk-7fae0422.c233115f.css" rel="prefetch"><link href="/static/css/chunk-81641df8.92b3713e.css" rel="prefetch"><link href="/static/css/chunk-d22da0c0.7c71cffb.css" rel="prefetch"><link href="/static/css/chunk-d28a86c4.cdd32c08.css" rel="prefetch"><link href="/static/css/chunk-da9476ec.f1965e2d.css" rel="prefetch"><link href="/static/css/chunk-ed83bcf4.75b51be7.css" rel="prefetch"><link href="/static/js/chunk-134ec1dc.87638287.js" rel="prefetch"><link href="/static/js/chunk-13b07ca5.11833bcd.js" rel="prefetch"><link href="/static/js/chunk-15e147cf.e4b94eac.js" rel="prefetch"><link href="/static/js/chunk-2606c898.c61d9a34.js" rel="prefetch"><link href="/static/js/chunk-283aacba.52472391.js" rel="prefetch"><link href="/static/js/chunk-2ca39dde.bfb67629.js" rel="prefetch"><link href="/static/js/chunk-2d0cc2be.71e3fcd8.js" rel="prefetch"><link href="/static/js/chunk-2d2091df.90a98553.js" rel="prefetch"><link href="/static/js/chunk-2d21da1a.707bd994.js" rel="prefetch"><link href="/static/js/chunk-2d237d41.b4b87abb.js" rel="prefetch"><link href="/static/js/chunk-2e526448.03b6c08c.js" rel="prefetch"><link href="/static/js/chunk-2f304dee.649e4dc7.js" rel="prefetch"><link href="/static/js/chunk-3b435dde.bd4904a1.js" rel="prefetch"><link href="/static/js/chunk-49211740.e4dea096.js" rel="prefetch"><link href="/static/js/chunk-5145872a.f0bd0577.js" rel="prefetch"><link href="/static/js/chunk-53e279b3.cf489a46.js" rel="prefetch"><link href="/static/js/chunk-5a1e13e4.287f68a0.js" rel="prefetch"><link href="/static/js/chunk-62c72861.7013ee39.js" rel="prefetch"><link href="/static/js/chunk-64076603.2c344ed9.js" rel="prefetch"><link href="/static/js/chunk-6ca797c1.b1d321c6.js" rel="prefetch"><link href="/static/js/chunk-711696bb.a8f62738.js" rel="prefetch"><link href="/static/js/chunk-7c7c5604.430dfc96.js" rel="prefetch"><link href="/static/js/chunk-7fae0422.0d9be069.js" rel="prefetch"><link href="/static/js/chunk-81641df8.bad85c33.js" rel="prefetch"><link href="/static/js/chunk-d22da0c0.da01e99e.js" rel="prefetch"><link href="/static/js/chunk-d28a86c4.d0c1f74e.js" rel="prefetch"><link href="/static/js/chunk-da9476ec.f8c15985.js" rel="prefetch"><link href="/static/js/chunk-ed83bcf4.429119bf.js" rel="prefetch"><link href="/static/css/app.a59326af.css" rel="preload" as="style"><link href="/static/css/chunk-vendors.5dad8b00.css" rel="preload" as="style"><link href="/static/js/app.4738c3c8.js" rel="preload" as="script"><link href="/static/js/chunk-vendors.32426ed3.js" rel="preload" as="script"><link href="/static/css/chunk-vendors.5dad8b00.css" rel="stylesheet"><link href="/static/css/app.a59326af.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but platypush doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="/static/js/chunk-vendors.32426ed3.js"></script><script src="/static/js/app.4738c3c8.js"></script></body></html>
|
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>platypush</title><link href="/static/css/chunk-134ec1dc.849ccfd5.css" rel="prefetch"><link href="/static/css/chunk-13b07ca5.029dd736.css" rel="prefetch"><link href="/static/css/chunk-15e147cf.7e460329.css" rel="prefetch"><link href="/static/css/chunk-2606c898.75269c9b.css" rel="prefetch"><link href="/static/css/chunk-283aacba.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-2ca39dde.efa1eae8.css" rel="prefetch"><link href="/static/css/chunk-2e526448.44bbe779.css" rel="prefetch"><link href="/static/css/chunk-2f304dee.a8a2d99a.css" rel="prefetch"><link href="/static/css/chunk-3b435dde.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-49211740.43a25f0f.css" rel="prefetch"><link href="/static/css/chunk-5145872a.197de139.css" rel="prefetch"><link href="/static/css/chunk-53e279b3.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-5a1e13e4.f186cc51.css" rel="prefetch"><link href="/static/css/chunk-64076603.e451beea.css" rel="prefetch"><link href="/static/css/chunk-6ca797c1.5b949e24.css" rel="prefetch"><link href="/static/css/chunk-711696bb.b7730bd4.css" rel="prefetch"><link href="/static/css/chunk-7c7c5604.678c9c97.css" rel="prefetch"><link href="/static/css/chunk-7fae0422.c233115f.css" rel="prefetch"><link href="/static/css/chunk-81641df8.92b3713e.css" rel="prefetch"><link href="/static/css/chunk-845a3022.9214de81.css" rel="prefetch"><link href="/static/css/chunk-d22da0c0.7c71cffb.css" rel="prefetch"><link href="/static/css/chunk-d28a86c4.cdd32c08.css" rel="prefetch"><link href="/static/css/chunk-da9476ec.f1965e2d.css" rel="prefetch"><link href="/static/css/chunk-ed83bcf4.75b51be7.css" rel="prefetch"><link href="/static/js/chunk-134ec1dc.87638287.js" rel="prefetch"><link href="/static/js/chunk-13b07ca5.11833bcd.js" rel="prefetch"><link href="/static/js/chunk-15e147cf.e4b94eac.js" rel="prefetch"><link href="/static/js/chunk-2606c898.c61d9a34.js" rel="prefetch"><link href="/static/js/chunk-283aacba.52472391.js" rel="prefetch"><link href="/static/js/chunk-2ca39dde.bfb67629.js" rel="prefetch"><link href="/static/js/chunk-2d0cc2be.71e3fcd8.js" rel="prefetch"><link href="/static/js/chunk-2d2091df.90a98553.js" rel="prefetch"><link href="/static/js/chunk-2d21da1a.707bd994.js" rel="prefetch"><link href="/static/js/chunk-2d237d41.b4b87abb.js" rel="prefetch"><link href="/static/js/chunk-2e526448.03b6c08c.js" rel="prefetch"><link href="/static/js/chunk-2f304dee.649e4dc7.js" rel="prefetch"><link href="/static/js/chunk-3b435dde.bd4904a1.js" rel="prefetch"><link href="/static/js/chunk-49211740.e4dea096.js" rel="prefetch"><link href="/static/js/chunk-5145872a.f0bd0577.js" rel="prefetch"><link href="/static/js/chunk-53e279b3.cf489a46.js" rel="prefetch"><link href="/static/js/chunk-5a1e13e4.287f68a0.js" rel="prefetch"><link href="/static/js/chunk-64076603.2c344ed9.js" rel="prefetch"><link href="/static/js/chunk-6ca797c1.b1d321c6.js" rel="prefetch"><link href="/static/js/chunk-711696bb.a8f62738.js" rel="prefetch"><link href="/static/js/chunk-7c7c5604.430dfc96.js" rel="prefetch"><link href="/static/js/chunk-7fae0422.0d9be069.js" rel="prefetch"><link href="/static/js/chunk-81641df8.bad85c33.js" rel="prefetch"><link href="/static/js/chunk-845a3022.827b24b1.js" rel="prefetch"><link href="/static/js/chunk-d22da0c0.da01e99e.js" rel="prefetch"><link href="/static/js/chunk-d28a86c4.d0c1f74e.js" rel="prefetch"><link href="/static/js/chunk-da9476ec.f8c15985.js" rel="prefetch"><link href="/static/js/chunk-ed83bcf4.429119bf.js" rel="prefetch"><link href="/static/css/app.a59326af.css" rel="preload" as="style"><link href="/static/css/chunk-vendors.5dad8b00.css" rel="preload" as="style"><link href="/static/js/app.a92b1e47.js" rel="preload" as="script"><link href="/static/js/chunk-vendors.32426ed3.js" rel="preload" as="script"><link href="/static/css/chunk-vendors.5dad8b00.css" rel="stylesheet"><link href="/static/css/app.a59326af.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but platypush doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="/static/js/chunk-vendors.32426ed3.js"></script><script src="/static/js/app.a92b1e47.js"></script></body></html>
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
platypush/backend/http/dist/static/js/chunk-845a3022.827b24b1.js
vendored
Normal file
2
platypush/backend/http/dist/static/js/chunk-845a3022.827b24b1.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
platypush/backend/http/dist/static/js/chunk-845a3022.827b24b1.js.map
vendored
Normal file
1
platypush/backend/http/dist/static/js/chunk-845a3022.827b24b1.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -41,9 +41,9 @@
|
||||||
<div class="title">Select nodes to add</div>
|
<div class="title">Select nodes to add</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="body">
|
<div class="body" v-if="selected.groupId != null">
|
||||||
<div class="row clickable" @click="addToGroup(node.node_id, selected.groupId)" :key="node.node_id"
|
<div class="row clickable" @click="addToGroup(node.node_id, selected.groupId)" :key="node.node_id"
|
||||||
v-for="node in Object.values(nodes).filter((n) => groups[selected.groupId].associations.indexOf(n.node_id) < 0)">
|
v-for="node in Object.values(nodes || {}).filter((n) => groups[selected.groupId].associations.indexOf(n.node_id) < 0)">
|
||||||
<div class="param-name" v-text="node.name"></div>
|
<div class="param-name" v-text="node.name"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -172,10 +172,12 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="section values" v-if="scene.values?.length">
|
<div class="section values" v-if="scene.values?.length">
|
||||||
<div class="value-container"
|
<div class="value-container" v-for="(value, valueId) in valuesMap" :key="valueId">
|
||||||
v-if="value.id_on_network && value.id_on_network in scenes.values[sceneId]" :scenes="scenes">
|
<div class="value-display"
|
||||||
<Value v-for="(value, valueId) in valuesMap" :key="valueId" :value="value" :node="node" :sceneId="sceneId"
|
v-if="value.valueId && value.valueId in scenes.values[sceneId]" :scenes="scenes">
|
||||||
@add-to-scene="addValueToScene" @remove-from-scene="removeValueFromScene" @refresh="refreshNodes" />
|
<Value :value="value" :node="node" :sceneId="sceneId" @add-to-scene="addValueToScene"
|
||||||
|
@remove-from-scene="removeValueFromScene" @refresh="refreshNodes" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -188,20 +190,20 @@
|
||||||
<div class="empty">No nodes found on the network</div>
|
<div class="empty">No nodes found on the network</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="node-container"
|
<div class="node-container" v-for="(node, nodeId) in nodes" :key="nodeId">
|
||||||
v-if="selected.view === 'values' || Object.values(node.values).filter((value) => value.id_on_network in values[selected.view]).length > 0">
|
|
||||||
<div class="item node"
|
<div class="item node"
|
||||||
:class="{selected: selected.nodeId === nodeId}"
|
:class="{selected: selected.nodeId === nodeId}"
|
||||||
v-for="(node, nodeId) in nodes"
|
v-if="selected.view === 'values' || Object.values(node.values).filter((value) => value.id_on_network in values[selected.view]).length > 0">
|
||||||
:key="nodeId">
|
|
||||||
<div class="row name vertical-center" :class="{selected: selected.nodeId === nodeId}" v-text="node.name"
|
<div class="row name vertical-center" :class="{selected: selected.nodeId === nodeId}" v-text="node.name"
|
||||||
@click="onNodeClick(nodeId)"></div>
|
@click="onNodeClick(nodeId)"></div>
|
||||||
|
|
||||||
<div class="params" v-if="selected.nodeId === nodeId">
|
<div class="params" v-if="selected.nodeId === nodeId">
|
||||||
<div class="value-container"
|
<div class="value-container" v-for="(value, valueId) in node.values" :key="valueId">
|
||||||
v-if="value.id_on_network && (selected.view === 'values' || value.id_on_network in values[selected.view])">
|
<div class="value-display"
|
||||||
<Value v-for="(value, valueId) in node.values" :key="valueId" :value="value" :node="node" :scenes="scenes"
|
v-if="valueId && (selected.view === 'values' || value.valueId in values[selected.view])">
|
||||||
@add-to-scene="addValueToScene" @remove-from-scene="removeValueFromScene" @refresh="refreshNodes" />
|
<Value :value="value" :node="node" :scenes="scenes" @add-to-scene="addValueToScene"
|
||||||
|
@remove-from-scene="removeValueFromScene" @refresh="refreshNodes" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -692,6 +694,7 @@ export default {
|
||||||
@import "common";
|
@import "common";
|
||||||
|
|
||||||
.zwave-container {
|
.zwave-container {
|
||||||
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 0 .5em;
|
padding: 0 .5em;
|
||||||
background: $container-bg;
|
background: $container-bg;
|
||||||
|
|
@ -703,14 +706,24 @@ export default {
|
||||||
.view-options {
|
.view-options {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
height: $header-height;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
padding: 1em 0;
|
align-items: center;
|
||||||
|
padding: 0;
|
||||||
|
background: $header-bg;
|
||||||
|
border-bottom: $default-border-2;
|
||||||
|
box-shadow: $border-shadow-bottom;
|
||||||
|
|
||||||
.view-selector {
|
.view-selector {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
padding-left: .5em;
|
||||||
|
|
||||||
|
label {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.buttons {
|
.view-selector {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="param-name">Name</div>
|
<div class="param-name">Name</div>
|
||||||
<div class="param-value">
|
<div class="param-value">
|
||||||
<div :class="{hidden: !editMode.name}">
|
<div class="edit-cell" :class="{hidden: !editMode.name}">
|
||||||
<form ref="nameForm" @submit.prevent="editName">
|
<form ref="nameForm" @submit.prevent="editName">
|
||||||
<label>
|
<label>
|
||||||
<input type="text" name="name" :value="node.name" :disabled="commandRunning">
|
<input type="text" name="name" :value="node.name" :disabled="commandRunning">
|
||||||
|
|
|
||||||
|
|
@ -26,6 +26,10 @@
|
||||||
background: $params-bg;
|
background: $params-bg;
|
||||||
padding-bottom: 1em;
|
padding-bottom: 1em;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
|
||||||
.section {
|
.section {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
@ -132,6 +136,17 @@
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.edit-cell {
|
||||||
|
width: 100%;
|
||||||
|
display: inline-flex;
|
||||||
|
justify-content: right;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.buttons {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -222,4 +237,25 @@
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
padding: 0 .75em;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $default-hover-fg;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.buttons {
|
||||||
|
display: inline-flex;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
.dropdown {
|
||||||
|
.item {
|
||||||
|
padding: .5em 2em .5em .5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,8 +5,10 @@ $view-box-shadow: 1px 2px 2px #ccc;
|
||||||
$item-border: 1px solid #dddddd;
|
$item-border: 1px solid #dddddd;
|
||||||
$no-items-color: #555555;
|
$no-items-color: #555555;
|
||||||
$params-bg: white;
|
$params-bg: white;
|
||||||
$param-even-row-bg: #ededed;
|
$param-even-row-bg: #f0f0f0;
|
||||||
$param-odd-row-bg: white;
|
$param-odd-row-bg: white;
|
||||||
$param-section-header-border: 1px solid #e8e8e8;
|
$param-section-header-border: 1px solid #e8e8e8;
|
||||||
$selected-item-box-shadow: 0 2px 4px 0 #bbb;
|
$selected-item-box-shadow: 0 2px 4px 0 #bbb;
|
||||||
$error-color: #aa0000;
|
$error-color: #aa0000;
|
||||||
|
$header-bg: #f9fafa;
|
||||||
|
$header-height: 3.5em;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue