Added delete functionality for list, hash, set, zset and stream fields.

This commit is contained in:
Stela Augustinova
2025-12-23 09:05:04 +01:00
parent 7ff84a9932
commit 4c12ee3b14
10 changed files with 239 additions and 24 deletions

View File

@@ -10,6 +10,16 @@
export let keyColumn = null;
let records = [{ value: '' }];
let lastItem = null;
$: if (item !== lastItem) {
if (item?.records && Array.isArray(item.records)) {
records = [...item.records];
} else if (!item) {
records = [{ value: '' }];
}
lastItem = item;
}
$: console.log('DbKeyValueSetEdit', { item, dbKeyFields, keyColumn, onChangeItem: !!onChangeItem });
@@ -34,7 +44,7 @@
<div class="container">
{#each records as record, index}
<div class="props flex">
<div class="field-wrapper col-12">
<div class="field-wrapper col-11">
<FormFieldTemplateLarge label="Value" type="text" noMargin>
<TextField
value={record.value}
@@ -43,6 +53,13 @@
/>
</FormFieldTemplateLarge>
</div>
<div class="delete-wrapper col-1">
<button class="delete-button" on:click={() => {
records = records.filter((_, idx) => idx !== index);
}}>
<FontIcon icon="icon delete" />
</button>
</div>
</div>
{/each}
@@ -75,6 +92,31 @@
flex-direction: column;
}
.delete-wrapper {
display: flex;
align-items: center;
justify-content: center;
margin-top: 10px;
}
.delete-button {
background: none;
border: none;
padding: 0;
cursor: pointer;
color: var(--theme-font-3);
transition: color 0.2s;
font-size: 24px;
display: flex;
align-items: center;
justify-content: center;
margin-top: 10px;
}
.delete-button:hover {
color: var(--theme-font-hover);
}
.add-button-wrapper {
display: flex;
justify-content: flex-end;