Fix partly email
This commit is contained in:
@@ -1,280 +0,0 @@
|
||||
<script setup>
|
||||
|
||||
const supabase = useSupabaseClient()
|
||||
const dataStore = useDataStore()
|
||||
const profileStore = useProfileStore()
|
||||
|
||||
|
||||
const selectedTab = ref(0)
|
||||
const selectedMail = ref(null)
|
||||
const selectedMailboxPath = ref("INBOX")
|
||||
const emails = ref([])
|
||||
const accountData = ref(null)
|
||||
const availableAccounts = ref(null)
|
||||
const selectedAccount = ref(null)
|
||||
const setupPage = async () => {
|
||||
availableAccounts.value = (await supabase.from("emailAccounts").select("*").contains("profiles",[profileStore.activeProfile.id])).data
|
||||
console.log(availableAccounts.value)
|
||||
|
||||
if(availableAccounts.value.length > 0) {
|
||||
selectedAccount.value = availableAccounts.value[0].id
|
||||
accountData.value = await useSupabaseSelectSingle("emailAccounts", selectedAccount.value)
|
||||
emails.value = await useSupabaseSelect("emailMessages", "*", "date", false)
|
||||
}
|
||||
}
|
||||
|
||||
const filteredMails = computed(() => {
|
||||
|
||||
let temp = emails.value.filter(i => i.mailboxPath.toLowerCase() === selectedMailboxPath.value.toLowerCase())
|
||||
|
||||
|
||||
if(selectedTab.value === 0){
|
||||
return temp
|
||||
} else {
|
||||
return temp.filter(i => !i.seen)
|
||||
}
|
||||
|
||||
|
||||
return emails.value
|
||||
})
|
||||
|
||||
const isMailPanelOpen = computed({
|
||||
get() {
|
||||
return !!selectedMail.value
|
||||
},
|
||||
set(value) {
|
||||
if (!value) {
|
||||
selectedMail.value = null
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const changeSeen = async (seen) => {
|
||||
const {data,error} = await supabase.functions.invoke('emailcontrol',{
|
||||
body: {
|
||||
method: seen ? "makeSeen" : "makeUnseen",
|
||||
emailId: selectedMail.value.id
|
||||
}
|
||||
})
|
||||
|
||||
if(data) {
|
||||
setupPage()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
setupPage()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- <UDashboardNavbar title="E-Mails">
|
||||
|
||||
</UDashboardNavbar>
|
||||
<UDashboardToolbar>
|
||||
|
||||
</UDashboardToolbar>-->
|
||||
<UDashboardPage
|
||||
v-if="selectedAccount"
|
||||
>
|
||||
<UDashboardPanel
|
||||
id="inbox"
|
||||
:width="400"
|
||||
:resizable="{ min: 300, max: 500 }"
|
||||
|
||||
>
|
||||
<UDashboardNavbar>
|
||||
<template #left>
|
||||
<USelectMenu
|
||||
v-if="accountData"
|
||||
class="w-40"
|
||||
:options="accountData.mailboxes"
|
||||
option-attribute="name"
|
||||
value-attribute="path"
|
||||
v-model="selectedMailboxPath"
|
||||
/>
|
||||
</template>
|
||||
<template #right>
|
||||
<UButton
|
||||
icon="i-heroicons-arrow-path"
|
||||
variant="ghost"
|
||||
color="gray"
|
||||
@click="setupPage"
|
||||
/>
|
||||
|
||||
<UTabs
|
||||
v-model="selectedTab"
|
||||
:items="[{label: 'All'}, {label: 'Ungelesen'}]"
|
||||
:ui="{ wrapper: '', list: { height: 'h-9', tab: { height: 'h-7', size: 'text-[13px]' } } }"
|
||||
/>
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
|
||||
<!-- ~/components/inbox/InboxList.vue -->
|
||||
<InboxList
|
||||
v-model="selectedMail"
|
||||
:mails="filteredMails"
|
||||
@emailSelected=" !selectedMail.seen ? changeSeen(true): ''"
|
||||
/>
|
||||
</UDashboardPanel>
|
||||
<UDashboardPanel
|
||||
v-model="isMailPanelOpen"
|
||||
collapsible
|
||||
grow
|
||||
side="right"
|
||||
>
|
||||
<template v-if="selectedMail">
|
||||
<UDashboardNavbar>
|
||||
<template #toggle>
|
||||
<UDashboardNavbarToggle icon="i-heroicons-x-mark" />
|
||||
|
||||
<UDivider
|
||||
orientation="vertical"
|
||||
class="mx-1.5 lg:hidden"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template #left>
|
||||
<UTooltip text="Ungelesen">
|
||||
<UButton
|
||||
icon="i-heroicons-eye-slash"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
@click="changeSeen(false)"
|
||||
/>
|
||||
</UTooltip>
|
||||
<!-- <UTooltip text="Archive">
|
||||
<UButton
|
||||
icon="i-heroicons-archive-box"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
/>
|
||||
</UTooltip>
|
||||
|
||||
<UTooltip text="Move to junk">
|
||||
<UButton
|
||||
icon="i-heroicons-archive-box-x-mark"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
/>
|
||||
</UTooltip>
|
||||
|
||||
<UDivider
|
||||
orientation="vertical"
|
||||
class="mx-1.5"
|
||||
/>
|
||||
|
||||
<UPopover :popper="{ placement: 'bottom-start' }">
|
||||
<template #default="{ open }">
|
||||
<UTooltip
|
||||
text="Snooze"
|
||||
:prevent="open"
|
||||
>
|
||||
<UButton
|
||||
icon="i-heroicons-clock"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
:class="[open && 'bg-gray-50 dark:bg-gray-800']"
|
||||
/>
|
||||
</UTooltip>
|
||||
</template>
|
||||
|
||||
<template #panel="{ close }">
|
||||
<DatePicker @close="close" />
|
||||
</template>
|
||||
</UPopover>-->
|
||||
</template>
|
||||
|
||||
<template #right>
|
||||
<UTooltip text="Reply">
|
||||
<UButton
|
||||
icon="i-heroicons-arrow-uturn-left"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
/>
|
||||
</UTooltip>
|
||||
|
||||
<UTooltip text="Forward">
|
||||
<UButton
|
||||
icon="i-heroicons-arrow-uturn-right"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
/>
|
||||
</UTooltip>
|
||||
|
||||
<!-- <UDivider
|
||||
orientation="vertical"
|
||||
class="mx-1.5"
|
||||
/>
|
||||
|
||||
<UDropdown :items="dropdownItems">
|
||||
<UButton
|
||||
icon="i-heroicons-ellipsis-vertical"
|
||||
color="gray"
|
||||
variant="ghost"
|
||||
/>
|
||||
</UDropdown>-->
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
|
||||
<!-- ~/components/inbox/InboxMail.vue -->
|
||||
<InboxMail :mail="selectedMail" />
|
||||
</template>
|
||||
<div
|
||||
v-else
|
||||
class="flex-1 hidden lg:flex items-center justify-center"
|
||||
>
|
||||
<UIcon
|
||||
name="i-heroicons-inbox"
|
||||
class="w-32 h-32 text-gray-400 dark:text-gray-500"
|
||||
/>
|
||||
</div>
|
||||
</UDashboardPanel>
|
||||
</UDashboardPage>
|
||||
<div
|
||||
v-else
|
||||
class="flex-1 flex-col hidden lg:flex items-center justify-center"
|
||||
>
|
||||
<UIcon
|
||||
name="i-heroicons-inbox"
|
||||
class="w-32 h-32 text-gray-400 dark:text-gray-500"
|
||||
/>
|
||||
<span class="font-bold text-2xl">Kein E-Mail Account verfügbar</span>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <UInput
|
||||
placeholder="Empfänger"
|
||||
variant="ghost"
|
||||
class="m-2"
|
||||
/>
|
||||
<UInput
|
||||
placeholder="Betreff"
|
||||
variant="ghost"
|
||||
class="m-2"
|
||||
/>
|
||||
<UInput
|
||||
placeholder="CC"
|
||||
variant="ghost"
|
||||
class="m-2"
|
||||
/>
|
||||
<UInput
|
||||
placeholder="BCC"
|
||||
variant="ghost"
|
||||
class="m-2"
|
||||
/>
|
||||
|
||||
<UDivider
|
||||
class="my-5"
|
||||
/>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<Tiptap/>-->
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,11 +1,12 @@
|
||||
<script setup>
|
||||
|
||||
//TODO: BACKENDCHANGE EMAIL SENDING
|
||||
const supabase = useSupabaseClient()
|
||||
const dataStore = useDataStore()
|
||||
const profileStore = useProfileStore()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const toast = useToast()
|
||||
const auth = useAuthStore()
|
||||
|
||||
const emailData = ref({
|
||||
to:"",
|
||||
@@ -23,7 +24,7 @@ const loadedDocuments = ref([])
|
||||
const loaded = ref(false)
|
||||
const noAccountsPresent = ref(false)
|
||||
const setupPage = async () => {
|
||||
emailAccounts.value = await useSupabaseSelect("emailAccounts")
|
||||
emailAccounts.value = await useEntities("emailAccounts").select()
|
||||
|
||||
if(emailAccounts.value.length === 0) {
|
||||
noAccountsPresent.value = true
|
||||
|
||||
Reference in New Issue
Block a user