147 lines
4.2 KiB
Vue
147 lines
4.2 KiB
Vue
<template>
|
|
<emailScroll ref="scroll"
|
|
:cancel-success="cancelStar"
|
|
:star-success="addStar"
|
|
:getEmailList="getEmailList"
|
|
:emailDelete="emailDelete"
|
|
:star-add="starAdd"
|
|
:star-cancel="starCancel"
|
|
:time-sort="params.timeSort"
|
|
:email-read="emailRead"
|
|
:show-unread="true"
|
|
actionLeft="4px"
|
|
@jump="jumpContent"
|
|
>
|
|
<template #first>
|
|
<Icon class="icon" @click="changeTimeSort" icon="material-symbols-light:timer-arrow-down-outline"
|
|
v-if="params.timeSort === 0" width="28" height="28"/>
|
|
<Icon class="icon" @click="changeTimeSort" icon="material-symbols-light:timer-arrow-up-outline" v-else
|
|
width="28" height="28"/>
|
|
</template>
|
|
|
|
</emailScroll>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {useAccountStore} from "@/store/account.js";
|
|
import {useEmailStore} from "@/store/email.js";
|
|
import {useSettingStore} from "@/store/setting.js";
|
|
import emailScroll from "@/components/email-scroll/index.vue"
|
|
import {emailList, emailDelete, emailLatest, emailRead} from "@/request/email.js";
|
|
import {starAdd, starCancel} from "@/request/star.js";
|
|
import {defineOptions, h, onMounted, reactive, ref, watch} from "vue";
|
|
import {sleep} from "@/utils/time-utils.js";
|
|
import router from "@/router/index.js";
|
|
import {Icon} from "@iconify/vue";
|
|
|
|
defineOptions({
|
|
name: 'email'
|
|
})
|
|
|
|
const emailStore = useEmailStore();
|
|
const accountStore = useAccountStore();
|
|
const settingStore = useSettingStore();
|
|
const scroll = ref({})
|
|
const params = reactive({
|
|
timeSort: 0,
|
|
})
|
|
|
|
onMounted(() => {
|
|
emailStore.emailScroll = scroll;
|
|
latest()
|
|
})
|
|
|
|
|
|
watch(() => accountStore.currentAccountId, () => {
|
|
scroll.value.refreshList();
|
|
})
|
|
|
|
function changeTimeSort() {
|
|
params.timeSort = params.timeSort ? 0 : 1
|
|
scroll.value.refreshList();
|
|
}
|
|
|
|
function jumpContent(email) {
|
|
emailStore.contentData.email = email
|
|
emailStore.contentData.delType = 'logic'
|
|
emailStore.contentData.showUnread = true
|
|
emailStore.contentData.showStar = true
|
|
emailStore.contentData.showReply = true
|
|
router.push('/message')
|
|
}
|
|
|
|
const existIds = new Set();
|
|
|
|
async function latest() {
|
|
while (true) {
|
|
const latestId = scroll.value.latestEmail?.emailId
|
|
|
|
if (!scroll.value.firstLoad && settingStore.settings.autoRefreshTime) {
|
|
try {
|
|
const accountId = accountStore.currentAccountId
|
|
const curTimeSort = params.timeSort
|
|
let list = []
|
|
|
|
//确保发起请求时最后一个邮件是当前账号的,或者
|
|
if (accountId === scroll.value.latestEmail?.accountId) {
|
|
list = await emailLatest(latestId, accountId);
|
|
}
|
|
|
|
//确保请求回来后，账号没有切换，时间排序没有改变
|
|
if (accountId === accountStore.currentAccountId && params.timeSort === curTimeSort) {
|
|
if (list.length > 0) {
|
|
|
|
for (let email of list) {
|
|
|
|
if (!existIds.has(email.emailId)) {
|
|
|
|
existIds.add(email.emailId)
|
|
scroll.value.addItem(email)
|
|
|
|
if (innerWidth > 1367) {
|
|
ElNotification({
|
|
type: 'primary',
|
|
message: `<div style="cursor: pointer;"><div style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis; font-weight: bold;font-size: 16px;margin-bottom: 5px;">${email.name}</div><div style="color: teal;">${email.subject}</div></div>`,
|
|
position: 'bottom-right',
|
|
dangerouslyUseHTMLString: true,
|
|
onClick: () => {
|
|
jumpContent(email);
|
|
}
|
|
})
|
|
}
|
|
|
|
await sleep(50)
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
} catch (e) {
|
|
console.error(e)
|
|
}
|
|
}
|
|
await sleep(settingStore.settings.autoRefreshTime * 1000)
|
|
}
|
|
}
|
|
|
|
function addStar(email) {
|
|
emailStore.starScroll?.addItem(email)
|
|
}
|
|
|
|
function cancelStar(email) {
|
|
emailStore.starScroll?.deleteEmail([email.emailId])
|
|
}
|
|
|
|
function getEmailList(emailId, size) {
|
|
return emailList(accountStore.currentAccountId, emailId, params.timeSort, size, 0)
|
|
}
|
|
|
|
</script>
|
|
<style>
|
|
.icon {
|
|
cursor: pointer;
|
|
}
|
|
</style>
|