mirror of
https://github.com/kevin-DL/build-gmail-clone-with-vue-3.git
synced 2026-01-23 15:41:33 +00:00
MOve to Inbox button and keyboard shortcut
This commit is contained in:
@@ -47,10 +47,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function changeEmail(emails, {amount, archive, closeModal}){
|
function changeEmail(emails, {amount, toggleArchive, closeModal}){
|
||||||
let index = emails.findIndex(e => e == openedEmail.value);
|
let index = emails.findIndex(e => e == openedEmail.value);
|
||||||
|
|
||||||
if(archive) { emails[index].archived = true }
|
if(toggleArchive) { emails[index].archived = !emails[index].archived }
|
||||||
if(closeModal) { openedEmail.value = null; return null; }
|
if(closeModal) { openedEmail.value = null; return null; }
|
||||||
|
|
||||||
openEmail(emails[index + amount])
|
openEmail(emails[index + amount])
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="email" v-if="email">
|
<div class="email" v-if="email">
|
||||||
<div class="toolbar">
|
<div class="toolbar">
|
||||||
<button @click="archive">Archive</button>
|
<button @click="toggleArchive">{{email.archived ? 'Move to Inbox' : 'Archive'}}</button>
|
||||||
<button @click="goNewer">Newer</button>
|
<button @click="goNewer">Newer</button>
|
||||||
<button @click="goOlder">Older</button>
|
<button @click="goOlder">Older</button>
|
||||||
<button @click="toggleRead(email)">Mark {{email.read ? 'Unread' : 'Read'}}</button>
|
<button @click="toggleRead(email)">Mark {{email.read ? 'Unread' : 'Read'}}</button>
|
||||||
@@ -21,9 +21,9 @@
|
|||||||
setup({email}, {emit}) {
|
setup({email}, {emit}) {
|
||||||
let goNewer = () => emit('changeEmail', {amount: -1})
|
let goNewer = () => emit('changeEmail', {amount: -1})
|
||||||
let goOlder = () => emit('changeEmail', {amount: 1})
|
let goOlder = () => emit('changeEmail', {amount: 1})
|
||||||
let goNewerAndArchive = () => emit('changeEmail', {amount: -1, archive: true})
|
let goNewerAndArchive = () => emit('changeEmail', {amount: -1, toggleArchive: true})
|
||||||
let goOlderAndArchive = () => emit('changeEmail', {amount: 1, archive: true})
|
let goOlderAndArchive = () => emit('changeEmail', {amount: 1, toggleArchive: true})
|
||||||
let archive = () => emit('changeEmail', {archive: true, closeModal: true})
|
let toggleArchive = () => emit('changeEmail', {toggleArchive: true, closeModal: true})
|
||||||
let toggleRead = (email) => { email.read = !email.read }
|
let toggleRead = (email) => { email.read = !email.read }
|
||||||
|
|
||||||
useKeydown([
|
useKeydown([
|
||||||
@@ -31,13 +31,13 @@
|
|||||||
{key: 'j', fn: goOlder},
|
{key: 'j', fn: goOlder},
|
||||||
{key: '[', fn: goNewerAndArchive},
|
{key: '[', fn: goNewerAndArchive},
|
||||||
{key: ']', fn: goOlderAndArchive},
|
{key: ']', fn: goOlderAndArchive},
|
||||||
{key: 'e', fn: archive}
|
{key: 'e', fn: toggleArchive}
|
||||||
])
|
])
|
||||||
|
|
||||||
let emailMarkdown = marked(email.body);
|
let emailMarkdown = marked(email.body);
|
||||||
return {
|
return {
|
||||||
emailMarkdown,
|
emailMarkdown,
|
||||||
archive,
|
toggleArchive,
|
||||||
goNewer,
|
goNewer,
|
||||||
goOlder,
|
goOlder,
|
||||||
toggleRead
|
toggleRead
|
||||||
|
|||||||
Reference in New Issue
Block a user