mirror of
https://github.com/hay-kot/homebox.git
synced 2024-11-25 01:55:43 +00:00
feat: support cmd+s / ctrl+s and rework button display on edit (#523)
This commit is contained in:
parent
895017b28e
commit
5a219f6a9c
2 changed files with 58 additions and 37 deletions
|
@ -360,24 +360,6 @@
|
|||
return v;
|
||||
});
|
||||
|
||||
const confirm = useConfirm();
|
||||
|
||||
async function deleteItem() {
|
||||
const confirmed = await confirm.open("Are you sure you want to delete this item?");
|
||||
|
||||
if (!confirmed.data) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { error } = await api.items.delete(itemId.value);
|
||||
if (error) {
|
||||
toast.error("Failed to delete item");
|
||||
return;
|
||||
}
|
||||
toast.success("Item deleted");
|
||||
navigateTo("/home");
|
||||
}
|
||||
|
||||
const refDialog = ref<HTMLDialogElement>();
|
||||
const dialoged = reactive({
|
||||
src: "",
|
||||
|
@ -480,10 +462,6 @@
|
|||
{{ t.name }}
|
||||
</NuxtLink>
|
||||
</div>
|
||||
<BaseButton class="btn btn-sm" @click="deleteItem()">
|
||||
<Icon name="mdi-delete" class="mr-2" />
|
||||
Delete
|
||||
</BaseButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
|
@ -361,6 +361,44 @@
|
|||
|
||||
const { query, results } = useItemSearch(api, { immediate: false });
|
||||
const parent = ref();
|
||||
|
||||
async function deleteItem() {
|
||||
const confirmed = await confirm.open("Are you sure you want to delete this item?");
|
||||
|
||||
if (!confirmed.data) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { error } = await api.items.delete(itemId.value);
|
||||
if (error) {
|
||||
toast.error("Failed to delete item");
|
||||
return;
|
||||
}
|
||||
toast.success("Item deleted");
|
||||
navigateTo("/home");
|
||||
}
|
||||
|
||||
async function keyboardSave(e: KeyboardEvent) {
|
||||
// Cmd + S
|
||||
if (e.metaKey && e.key === "s") {
|
||||
e.preventDefault();
|
||||
await saveItem();
|
||||
}
|
||||
|
||||
// Ctrl + S
|
||||
if (e.ctrlKey && e.key === "s") {
|
||||
e.preventDefault();
|
||||
await saveItem();
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
window.addEventListener("keydown", keyboardSave);
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener("keydown", keyboardSave);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -382,25 +420,30 @@
|
|||
</div>
|
||||
</BaseModal>
|
||||
|
||||
<section>
|
||||
<section class="relative">
|
||||
<div class="my-4 justify-end flex gap-2 items-center sticky z-10 top-1">
|
||||
<div class="mr-auto tooltip tooltip-right" data-tip="Show Advanced View Options">
|
||||
<label class="label cursor-pointer mr-auto">
|
||||
<input v-model="preferences.editorAdvancedView" type="checkbox" class="toggle toggle-primary" />
|
||||
<span class="label-text ml-4"> Advanced </span>
|
||||
</label>
|
||||
</div>
|
||||
<BaseButton size="sm" @click="saveItem">
|
||||
<template #icon>
|
||||
<Icon name="mdi-content-save-outline" />
|
||||
</template>
|
||||
Save
|
||||
</BaseButton>
|
||||
<BaseButton class="btn btn-sm btn-error" @click="deleteItem()">
|
||||
<Icon name="mdi-delete" class="mr-2" />
|
||||
Delete
|
||||
</BaseButton>
|
||||
</div>
|
||||
<div class="space-y-6">
|
||||
<BaseCard class="overflow-visible">
|
||||
<template #title> Edit Details </template>
|
||||
<template #title-actions>
|
||||
<div class="flex flex-wrap justify-between items-center mt-2 gap-4">
|
||||
<div class="mr-auto tooltip" data-tip="Show Advanced Options">
|
||||
<label class="label cursor-pointer mr-auto">
|
||||
<input v-model="preferences.editorAdvancedView" type="checkbox" class="toggle toggle-primary" />
|
||||
<span class="label-text ml-4"> Advanced </span>
|
||||
</label>
|
||||
</div>
|
||||
<BaseButton size="sm" @click="saveItem">
|
||||
<template #icon>
|
||||
<Icon name="mdi-content-save-outline" />
|
||||
</template>
|
||||
Save
|
||||
</BaseButton>
|
||||
</div>
|
||||
<div class="flex flex-wrap justify-between items-center mt-2 gap-4"></div>
|
||||
</template>
|
||||
<div class="px-5 pt-2 border-t mb-6 grid md:grid-cols-2 gap-4">
|
||||
<LocationSelector v-model="item.location" />
|
||||
|
|
Loading…
Reference in a new issue