property mapping validation #48

This commit is contained in:
mProjectsCode 2022-09-26 15:44:12 +02:00
parent 3e79f8ad77
commit 68ec5135cc
6 changed files with 146 additions and 23 deletions

View file

@ -49,10 +49,15 @@
margin: 0;
}
.media-db-plugin-property-binding-to {
.media-db-plugin-property-mapping-to {
display: flex;
align-items: center;
}
.media-db-plugin-property-mapping-validation {
color: var(--text-error);
margin-bottom: 5px;
}
</style>
<div class="setting-item" style="display: flex; gap: 10px; flex-direction: column; align-items: stretch;">
@ -81,18 +86,25 @@
{#if property.mapping === PropertyMappingOption.Map}
<Icon iconName="arrow-right"/>
<div class="media-db-plugin-property-binding-to">
<div class="media-db-plugin-property-mapping-to">
<input type="text" spellcheck="false" bind:value="{property.newProperty}">
</div>
{/if}
{/if}
</div>
{ /each }
{ /each }
</div>
<button class="mod-cta media-db-plugin-property-mappings-save-button" on:click={() => save(model)}>Save
{ #if !model.validate().res }
<div class="media-db-plugin-property-mapping-validation">
{model.validate().err?.message}
</div>
{/if}
<button
class="media-db-plugin-property-mappings-save-button {model.validate().res ? 'mod-cta' : 'mod-muted'}"
on:click={() => { if(model.validate().res) save(model) }}>Save
</button>
</div>
{ /each }
{ /each }
<pre>{JSON.stringify(models, null, 4)}</pre>