use the filenames instead of indexes on delete
This commit is contained in:
@@ -12,7 +12,7 @@
|
||||
export let record;
|
||||
export let value = "";
|
||||
export let uploadedFiles = []; // Array<File> array
|
||||
export let deletedFileIndexes = []; // Array<int> array
|
||||
export let deletedFileNames = []; // Array<string> array
|
||||
export let field = new SchemaField();
|
||||
|
||||
let fileInput;
|
||||
@@ -25,9 +25,9 @@
|
||||
uploadedFiles = CommonHelper.toArray(uploadedFiles);
|
||||
}
|
||||
|
||||
// normalize delited file indexes
|
||||
$: if (!Array.isArray(deletedFileIndexes)) {
|
||||
deletedFileIndexes = CommonHelper.toArray(deletedFileIndexes);
|
||||
// normalize deleted files
|
||||
$: if (!Array.isArray(deletedFileNames)) {
|
||||
deletedFileNames = CommonHelper.toArray(deletedFileNames);
|
||||
}
|
||||
|
||||
$: isMultiple = field.options?.maxSelect > 1;
|
||||
@@ -40,20 +40,20 @@
|
||||
|
||||
$: maxReached =
|
||||
(valueAsArray.length || uploadedFiles.length) &&
|
||||
field.options?.maxSelect <= valueAsArray.length + uploadedFiles.length - deletedFileIndexes.length;
|
||||
field.options?.maxSelect <= valueAsArray.length + uploadedFiles.length - deletedFileNames.length;
|
||||
|
||||
$: if (uploadedFiles !== -1 || deletedFileIndexes !== -1) {
|
||||
$: if (uploadedFiles !== -1 || deletedFileNames !== -1) {
|
||||
triggerListChange();
|
||||
}
|
||||
|
||||
function restoreExistingFile(valueIndex) {
|
||||
CommonHelper.removeByValue(deletedFileIndexes, valueIndex);
|
||||
deletedFileIndexes = deletedFileIndexes;
|
||||
function restoreExistingFile(name) {
|
||||
CommonHelper.removeByValue(deletedFileNames, name);
|
||||
deletedFileNames = deletedFileNames;
|
||||
}
|
||||
|
||||
function removeExistingFile(valueIndex) {
|
||||
CommonHelper.pushUnique(deletedFileIndexes, valueIndex);
|
||||
deletedFileIndexes = deletedFileIndexes;
|
||||
function removeExistingFile(name) {
|
||||
CommonHelper.pushUnique(deletedFileNames, name);
|
||||
deletedFileNames = deletedFileNames;
|
||||
}
|
||||
|
||||
function removeNewFile(index) {
|
||||
@@ -67,7 +67,7 @@
|
||||
function triggerListChange() {
|
||||
filesListElem?.dispatchEvent(
|
||||
new CustomEvent("change", {
|
||||
detail: { value, uploadedFiles, deletedFileIndexes },
|
||||
detail: { value, uploadedFiles, deletedFileNames },
|
||||
bubbles: true,
|
||||
})
|
||||
);
|
||||
@@ -85,7 +85,7 @@
|
||||
}
|
||||
|
||||
for (const file of files) {
|
||||
const currentTotal = valueAsArray.length + uploadedFiles.length - deletedFileIndexes.length;
|
||||
const currentTotal = valueAsArray.length + uploadedFiles.length - deletedFileNames.length;
|
||||
|
||||
if (field.options?.maxSelect <= currentTotal) {
|
||||
break;
|
||||
@@ -131,7 +131,7 @@
|
||||
|
||||
<div bind:this={filesListElem} class="list">
|
||||
{#each valueAsArray as filename, i (filename + record.id)}
|
||||
{@const isDeleted = deletedFileIndexes.includes(i)}
|
||||
{@const isDeleted = deletedFileNames.includes(filename)}
|
||||
<Draggable
|
||||
bind:list={value}
|
||||
group={field.name + "_uploaded"}
|
||||
@@ -141,7 +141,7 @@
|
||||
let:dragover
|
||||
>
|
||||
<div class="list-item" class:dragging class:dragover>
|
||||
<div class:fade={deletedFileIndexes.includes(i)}>
|
||||
<div class:fade={isDeleted}>
|
||||
<RecordFileThumb {record} {filename} />
|
||||
</div>
|
||||
|
||||
@@ -161,11 +161,11 @@
|
||||
</div>
|
||||
|
||||
<div class="actions">
|
||||
{#if deletedFileIndexes.includes(i)}
|
||||
{#if isDeleted}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-danger btn-transparent"
|
||||
on:click={() => restoreExistingFile(i)}
|
||||
on:click={() => restoreExistingFile(filename)}
|
||||
>
|
||||
<span class="txt">Restore</span>
|
||||
</button>
|
||||
@@ -174,7 +174,7 @@
|
||||
type="button"
|
||||
class="btn btn-transparent btn-hint btn-sm btn-circle btn-remove"
|
||||
use:tooltip={"Remove file"}
|
||||
on:click={() => removeExistingFile(i)}
|
||||
on:click={() => removeExistingFile(filename)}
|
||||
>
|
||||
<i class="ri-close-line" />
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user