passing json direct to component

This commit is contained in:
Dmitry Borisenko
2021-10-16 21:27:57 +08:00
parent eaae5c7708
commit 2d290b9541
2 changed files with 13 additions and 16 deletions

View File

@@ -120,21 +120,21 @@
<Card title="Corridor"> <Card title="Corridor">
{#each wigets as widget, i} {#each wigets as widget, i}
{#if widget.widget === "input"} {#if widget.widget === "input"}
<Myinput bind:value={widget.status} descr={widget.descr} topic={widget.topic} ws={1} type={widget.type} /> <Myinput bind:value={widget.status} widget={widget} />
{/if} {/if}
{/each} {/each}
</Card> </Card>
<Card title="Living room"> <Card title="Living room">
{#each wigets as widget, i} {#each wigets as widget, i}
{#if widget.widget === "input"} {#if widget.widget === "input"}
<Myinput bind:value={widget.status} descr={widget.descr} topic={widget.topic} ws={1} type={widget.type} /> <Myinput bind:value={widget.status} widget={widget} />
{/if} {/if}
{/each} {/each}
</Card> </Card>
<Card title="Bedroom"> <Card title="Bedroom">
{#each wigets as widget, i} {#each wigets as widget, i}
{#if widget.widget === "input"} {#if widget.widget === "input"}
<Myinput bind:value={widget.status} descr={widget.descr} topic={widget.topic} ws={1} type={widget.type} /> <Myinput bind:value={widget.status} widget={widget} />
{/if} {/if}
{/each} {/each}
</Card> </Card>

View File

@@ -4,31 +4,28 @@
<script> <script>
export let value; export let value;
export let descr; export let widget;
export let topic;
export let ws;
export let type;
//style="min-width:50%; max-width:100%; width:{value.length * 10}px" on:change={(WSpush(ws, topic, value), console.log(value.length))} //style="min-width:50%; max-width:100%; width:{value.length * 10}px" on:change={(WSpush(ws, topic, value), console.log(value.length))}
</script> </script>
<div class="card-items"> <div class="card-items">
<div class="md:w-2/3 lg:w-2/3 2xl:w-2/3"> <div class="md:w-2/3 lg:w-2/3 2xl:w-2/3">
<!-- svelte-ignore a11y-label-has-associated-control --> <!-- svelte-ignore a11y-label-has-associated-control -->
<label class="widget-descr-gray-left">{!descr ? "" : descr}</label> <label class="widget-descr-gray-left">{!widget.descr ? "" : widget.descr}</label>
</div> </div>
<div class="md:w-1/3 lg:w-1/3 2xl:w-1/3"> <div class="md:w-1/3 lg:w-1/3 2xl:w-1/3">
<!-- on:change={WSpush(ws, topic, value)} --> <!-- on:change={WSpush(ws, topic, value)} -->
{#if type == "number"} {#if widget.type == "number"}
<input class="widget-input-indigo text-right" step="0.1" on:change={WSpush(ws, topic, value)} bind:value type="number" /> <input class="widget-input-indigo text-right" step="0.1" on:change={WSpush(widget.ws, widget.topic, widget.value)} bind:value type="number" />
{/if} {/if}
{#if type == "text"} {#if widget.type == "text"}
<input class="widget-input-indigo text-right" on:change={WSpush(ws, topic, value)} bind:value type="text" /> <input class="widget-input-indigo text-right" on:change={WSpush(widget.ws, widget.topic, widget.value)} bind:value type="text" />
{/if} {/if}
{#if type == "date"} {#if widget.type == "date"}
<input class="widget-input-indigo text-right" on:change={WSpush(ws, topic, value)} bind:value type="date" /> <input class="widget-input-indigo text-right" on:change={WSpush(widget.ws, widget.topic, widget.value)} bind:value type="date" />
{/if} {/if}
{#if type == "time"} {#if widget.type == "time"}
<input class="widget-input-indigo text-right" on:change={WSpush(ws, topic, value)} bind:value type="time" /> <input class="widget-input-indigo text-right" on:change={WSpush(widget.ws, widget.topic, widget.value)} bind:value type="time" />
{/if} {/if}
</div> </div>
</div> </div>