use global modal for popup messages
All checks were successful
delpoy / build-and-deploy (push) Successful in 51s
All checks were successful
delpoy / build-and-deploy (push) Successful in 51s
This commit is contained in:
@ -16,9 +16,12 @@
|
||||
import Search from '$lib/components/Input/Search.svelte';
|
||||
import { usernameSuggestions } from '$lib/utils';
|
||||
import PaginationTableBody from '$lib/components/PaginationTable/PaginationTableBody.svelte';
|
||||
import { getPopupModalShowFn } from '$lib/context';
|
||||
|
||||
let { data } = $props();
|
||||
|
||||
let showPopupModal = getPopupModalShowFn();
|
||||
|
||||
let reports: (typeof Report.prototype.dataValues)[] = $state([]);
|
||||
let reportsPerRequest = 25;
|
||||
let reportFilter = $state({ draft: false, status: null, reporter: null, reported: null });
|
||||
@ -91,7 +94,6 @@
|
||||
});
|
||||
}
|
||||
|
||||
let saveActiveReportChangesModal: HTMLDialogElement;
|
||||
let newReportModal: HTMLDialogElement;
|
||||
</script>
|
||||
|
||||
@ -327,49 +329,45 @@
|
||||
<Input
|
||||
type="submit"
|
||||
value="Speichern"
|
||||
onclick={() => saveActiveReportChangesModal.show()}
|
||||
onclick={() => {
|
||||
showPopupModal({
|
||||
title: 'Änderungen Speichern?',
|
||||
actions: [
|
||||
{
|
||||
text: 'Speichern',
|
||||
action: async () => {
|
||||
await updateActiveReport();
|
||||
if (activeReport.reported?.username) {
|
||||
if (activeReport.reported?.id === undefined) {
|
||||
activeReport.reported.id = -1;
|
||||
}
|
||||
} else {
|
||||
activeReport.reported = undefined;
|
||||
}
|
||||
reports = [...reports];
|
||||
if (
|
||||
activeReport.originalStatus !== 'reviewed' &&
|
||||
activeReport.status === 'reviewed'
|
||||
) {
|
||||
$reportCount -= 1;
|
||||
} else if (
|
||||
activeReport.originalStatus === 'reviewed' &&
|
||||
activeReport.status !== 'reviewed'
|
||||
) {
|
||||
$reportCount += 1;
|
||||
}
|
||||
}
|
||||
},
|
||||
{ text: 'Abbrechen' }
|
||||
]
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<dialog class="modal" bind:this={saveActiveReportChangesModal}>
|
||||
<form method="dialog" class="modal-box">
|
||||
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
|
||||
<h3 class="font-roboto text-xl">Änderungen Speichern?</h3>
|
||||
<div class="flex flex-row space-x-2 mt-6">
|
||||
<Input
|
||||
type="submit"
|
||||
value="Speichern"
|
||||
onclick={async () => {
|
||||
await updateActiveReport();
|
||||
if (activeReport.reported?.username) {
|
||||
if (activeReport.reported?.id === undefined) {
|
||||
activeReport.reported.id = -1;
|
||||
}
|
||||
} else {
|
||||
activeReport.reported = undefined;
|
||||
}
|
||||
reports = [...reports];
|
||||
if (activeReport.originalStatus !== 'reviewed' && activeReport.status === 'reviewed') {
|
||||
$reportCount -= 1;
|
||||
} else if (
|
||||
activeReport.originalStatus === 'reviewed' &&
|
||||
activeReport.status !== 'reviewed'
|
||||
) {
|
||||
$reportCount += 1;
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<Input type="submit" value="Abbrechen" />
|
||||
</div>
|
||||
</form>
|
||||
<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]">
|
||||
<button>close</button>
|
||||
</form>
|
||||
</dialog>
|
||||
|
||||
<dialog class="modal" bind:this={newReportModal}>
|
||||
<NewReportModal
|
||||
onSubmit={(e) => {
|
||||
|
@ -5,9 +5,12 @@
|
||||
import Search from '$lib/components/Input/Search.svelte';
|
||||
import { usernameSuggestions } from '$lib/utils';
|
||||
import type { Report } from '$lib/server/database';
|
||||
import { getPopupModalShowFn } from '$lib/context';
|
||||
|
||||
let { onSubmit }: { onSubmit: (data: typeof Report.prototype.dataValues) => void } = $props();
|
||||
|
||||
let showPopupModal = getPopupModalShowFn();
|
||||
|
||||
let reporter: string | undefined = $state();
|
||||
let reported: string | undefined = $state();
|
||||
let reason = $state('');
|
||||
@ -29,7 +32,6 @@
|
||||
let globalCloseForm: HTMLFormElement;
|
||||
|
||||
let reportForm: HTMLFormElement;
|
||||
let confirmDialog: HTMLDialogElement;
|
||||
</script>
|
||||
|
||||
<form method="dialog" class="modal-box" bind:this={reportForm}>
|
||||
@ -79,7 +81,22 @@
|
||||
onclick={(e) => {
|
||||
if (reportForm.checkValidity()) {
|
||||
e.preventDefault();
|
||||
confirmDialog.show();
|
||||
showPopupModal({
|
||||
title: 'Report Erstellen?',
|
||||
text: body
|
||||
? 'Dadurch, dass bereits Details über den Report Grund hinzugefügt wurden, ist es nach dem Erstellen nicht mehr möglich, den Report Inhalt zu ändern'
|
||||
: 'Der Report wird als Entwurf gespeichert und kann nach dem Erstellen über den Report-Link bearbeitet werden',
|
||||
actions: [
|
||||
{
|
||||
text: 'Erstellen',
|
||||
action: async () => {
|
||||
await newReport();
|
||||
globalCloseForm.submit();
|
||||
}
|
||||
},
|
||||
{ text: 'Abbrechen' }
|
||||
]
|
||||
});
|
||||
}
|
||||
}}
|
||||
/>
|
||||
@ -96,35 +113,3 @@
|
||||
<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]" bind:this={globalCloseForm}>
|
||||
<button>close</button>
|
||||
</form>
|
||||
|
||||
<dialog class="modal" bind:this={confirmDialog}>
|
||||
<form method="dialog" class="modal-box">
|
||||
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
|
||||
<h3 class="font-roboto text-xl mb-2">Report Erstellen?</h3>
|
||||
{#if body}
|
||||
<p>
|
||||
Dadurch, dass bereits Details über den Report Grund hinzugefügt wurden, ist es nach dem
|
||||
Erstellen nicht mehr möglich, den Report Inhalt zu ändern
|
||||
</p>
|
||||
{:else}
|
||||
<p>
|
||||
Der Report wird als Entwurf gespeichert und kann nach dem Erstellen über den Report-Link
|
||||
bearbeitet werden
|
||||
</p>
|
||||
{/if}
|
||||
<div class="flex flex-row space-x-2 mt-6">
|
||||
<Input
|
||||
type="submit"
|
||||
value="Erstellen"
|
||||
onclick={async () => {
|
||||
await newReport();
|
||||
globalCloseForm.submit();
|
||||
}}
|
||||
/>
|
||||
<Input type="submit" value="Abbrechen" />
|
||||
</div>
|
||||
</form>
|
||||
<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]">
|
||||
<button>close</button>
|
||||
</form>
|
||||
</dialog>
|
||||
|
@ -64,6 +64,7 @@
|
||||
|
||||
let userFilterEffectAlreadyRan = false;
|
||||
$effect(() => {
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
||||
userFilter;
|
||||
|
||||
if (!userFilterEffectAlreadyRan) {
|
||||
|
@ -3,6 +3,7 @@
|
||||
import { env } from '$env/dynamic/public';
|
||||
import Select from '$lib/components/Input/Select.svelte';
|
||||
import { errorMessage } from '$lib/stores';
|
||||
import { getPopupModalShowFn } from '$lib/context';
|
||||
|
||||
let {
|
||||
onSubmit
|
||||
@ -24,6 +25,8 @@
|
||||
}) => void;
|
||||
} = $props();
|
||||
|
||||
let showPopupModal = getPopupModalShowFn();
|
||||
|
||||
let firstname: string = $state('');
|
||||
let lastname: string = $state('');
|
||||
let birthday: string = $state('');
|
||||
@ -61,7 +64,6 @@
|
||||
let globalCloseForm: HTMLFormElement;
|
||||
|
||||
let reportForm: HTMLFormElement;
|
||||
let confirmDialog: HTMLDialogElement;
|
||||
</script>
|
||||
|
||||
<form method="dialog" class="modal-box" bind:this={reportForm}>
|
||||
@ -111,7 +113,10 @@
|
||||
onclick={(e) => {
|
||||
if (reportForm.checkValidity()) {
|
||||
e.preventDefault();
|
||||
confirmDialog.show();
|
||||
showPopupModal({
|
||||
title: 'Spieler hinzufügen?',
|
||||
actions: [{ text: 'Hinzufügen', action: newUser }, { text: 'Abbrechen' }]
|
||||
});
|
||||
}
|
||||
}}
|
||||
/>
|
||||
@ -128,17 +133,3 @@
|
||||
<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]" bind:this={globalCloseForm}>
|
||||
<button>close</button>
|
||||
</form>
|
||||
|
||||
<dialog class="modal" bind:this={confirmDialog}>
|
||||
<form method="dialog" class="modal-box">
|
||||
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
|
||||
<h3 class="font-roboto text-xl mb-2">Spieler hinzufügen?</h3>
|
||||
<div class="flex flex-row space-x-2 mt-6">
|
||||
<Input type="submit" value="Hinzufügen" onclick={newUser} />
|
||||
<Input type="submit" value="Abbrechen" />
|
||||
</div>
|
||||
</form>
|
||||
<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]">
|
||||
<button>close</button>
|
||||
</form>
|
||||
</dialog>
|
||||
|
Reference in New Issue
Block a user