add option for create without closing the current dialog.

This commit is contained in:
Hayden 2023-01-20 20:35:57 -09:00
parent 9145de1b5e
commit 56e0452390
No known key found for this signature in database
GPG key ID: 17CF79474E257545

View file

@ -1,7 +1,7 @@
<template> <template>
<BaseModal v-model="modal"> <BaseModal v-model="modal">
<template #title> Create Item </template> <template #title> Create Item </template>
<form @submit.prevent="create"> <form @submit.prevent="create(true)">
<FormSelect v-model="form.location" label="Location" :items="locations ?? []" /> <FormSelect v-model="form.location" label="Location" :items="locations ?? []" />
<FormTextField <FormTextField
ref="locationNameRef" ref="locationNameRef"
@ -13,13 +13,23 @@
<FormTextArea v-model="form.description" label="Item Description" /> <FormTextArea v-model="form.description" label="Item Description" />
<FormMultiselect v-model="form.labels" label="Labels" :items="labels ?? []" /> <FormMultiselect v-model="form.labels" label="Labels" :items="labels ?? []" />
<div class="modal-action"> <div class="modal-action">
<BaseButton ref="submitBtn" type="submit" :loading="loading"> <div class="flex justify-center">
<template #icon> <BaseButton ref="submitBtn" type="submit" class="rounded-r-none" :loading="loading">
<Icon name="mdi-package-variant" class="swap-off" /> <template #icon>
<Icon name="mdi-package-variant-closed" class="swap-on" /> <Icon name="mdi-package-variant" class="swap-off h-5 w-5" />
</template> <Icon name="mdi-package-variant-closed" class="swap-on h-5 w-5" />
Create </template>
</BaseButton> Create
</BaseButton>
<div class="dropdown dropdown-top">
<label tabindex="0" class="btn rounded-l-none rounded-r-xl">
<Icon class="h-5 w-5" name="mdi-chevron-down" />
</label>
<ul tabindex="0" class="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-64">
<li><button @click.prevent="create(false)">Create and Add Another</button></li>
</ul>
</div>
</div>
</div> </div>
</form> </form>
</BaseModal> </BaseModal>
@ -75,15 +85,6 @@
labels: [], labels: [],
}); });
function reset() {
form.name = "";
form.description = "";
form.color = "";
focused.value = false;
modal.value = false;
loading.value = false;
}
whenever( whenever(
() => modal.value, () => modal.value,
() => { () => {
@ -99,7 +100,7 @@
} }
); );
async function create() { async function create(close = false) {
if (!form.location) { if (!form.location) {
return; return;
} }
@ -119,7 +120,17 @@
} }
toast.success("Item created"); toast.success("Item created");
reset();
navigateTo(`/item/${data.id}`); // Reset
form.name = "";
form.description = "";
form.color = "";
focused.value = false;
loading.value = false;
if (close) {
modal.value = false;
navigateTo(`/item/${data.id}`);
}
} }
</script> </script>