1
0
mirror of https://github.com/axllent/mailpit.git synced 2025-01-16 02:47:11 +02:00

UI: Set 404 page when loading a non-existent message

This commit is contained in:
Ralph Slooten 2023-09-23 15:49:43 +12:00
parent 43a1dbe3f0
commit 28ac6d2099
2 changed files with 59 additions and 31 deletions

View File

@ -67,28 +67,6 @@ export default {
return q
},
// Ajax error message
handleError: function (error) {
// handle error
if (error.response && error.response.data) {
// The request was made and the server responded with a status code
// that falls out of the range of 2xx
if (error.response.data.Error) {
alert(error.response.data.Error)
} else {
alert(error.response.data)
}
} else if (error.request) {
// The request was made but no response was received
// `error.request` is an instance of XMLHttpRequest in the browser and an instance of
// http.ClientRequest in node.js
alert('Error sending data to the server. Please try again.')
} else {
// Something happened in setting up the request that triggered an Error
alert(error.message)
}
},
// generic modal get/set function
modal: function (id) {
let e = document.getElementById(id)
@ -113,13 +91,20 @@ export default {
* @params string url
* @params array array parameters Object/array
* @params function callback function
* @params function error callback function
*/
get: function (url, values, callback) {
get: function (url, values, callback, errorCallback) {
let self = this
self.loading++
axios.get(url, { params: values })
.then(callback)
.catch(self.handleError)
.catch(function (err) {
if (typeof errorCallback == 'function') {
return errorCallback(err)
}
self.handleError(err)
})
.then(function () {
// always executed
if (self.loading > 0) {
@ -191,6 +176,26 @@ export default {
})
},
// Ajax error message
handleError: function (error) {
// handle error
if (error.response && error.response.data) {
// The request was made and the server responded with a status code
// that falls out of the range of 2xx
if (error.response.data.Error) {
alert(error.response.data.Error)
} else {
alert(error.response.data)
}
} else if (error.request) {
// The request was made but no response was received
alert('Error sending data to the server. Please try again.')
} else {
// Something happened in setting up the request that triggered an Error
alert(error.message)
}
},
allAttachments: function (message) {
let a = []
for (let i in message.Attachments) {

View File

@ -26,6 +26,7 @@ export default {
message: false,
prevLink: false,
nextLink: false,
errorMessage: false,
}
},
@ -45,6 +46,8 @@ export default {
this.message = false
let uri = self.resolve('/api/v1/message/' + this.$route.params.id)
self.get(uri, false, function (response) {
self.errorMessage = false
let d = response.data
if (self.wasUnread(d.ID)) {
@ -94,7 +97,23 @@ export default {
self.message = d
self.detectPrevNext()
})
},
function (error) {
self.errorMessage = true
if (error.response && error.response.data) {
if (error.response.data.Error) {
self.errorMessage = error.response.data.Error
} else {
self.errorMessage = error.response.data
}
} else if (error.request) {
// The request was made but no response was received
self.errorMessage = 'Error sending data to the server. Please refresh the page.'
} else {
// Something happened in setting up the request that triggered an Error
self.errorMessage = error.message
}
})
},
// try detect whether this message was unread based on messages listing
@ -194,7 +213,7 @@ export default {
<span class="ms-2 d-none d-sm-inline">Mailpit</span>
</RouterLink>
</div>
<div class="col col-md-4k col-lg-5 col-xl-6">
<div class="col col-md-4k col-lg-5 col-xl-6" v-if="!errorMessage">
<button @click="goBack()" class="btn btn-outline-light me-3 me-sm-4 d-md-none" title="Return to messages">
<i class="bi bi-arrow-return-left"></i>
</button>
@ -209,8 +228,7 @@ export default {
<i class="bi bi-trash-fill"></i> <span class="d-none d-md-inline">Delete</span>
</button>
</div>
<div class="col-auto col-lg-4 col-xl-4 text-end">
<div class="col-auto col-lg-4 col-xl-4 text-end" v-if="!errorMessage">
<div class="dropdown d-inline-block" id="DownloadBtn">
<button type="button" class="btn btn-outline-light dropdown-toggle" data-bs-toggle="dropdown"
aria-expanded="false">
@ -286,13 +304,13 @@ export default {
<i class="bi bi-arrow-return-left me-1"></i>
<span class="ms-1">Return</span>
<span class="badge rounded-pill ms-1 float-end text-bg-secondary" title="Unread messages"
v-if="mailbox.unread">
v-if="mailbox.unread && !errorMessage">
{{ formatNumber(mailbox.unread) }}
</span>
</button>
</div>
<div class="card mt-4">
<div class="card mt-4" v-if="!errorMessage">
<div class="card-body text-body-secondary small">
<p class="card-text">
<b>Message date:</b><br>
@ -311,7 +329,12 @@ export default {
<div class="col-xl-10 col-md-9 mh-100 ps-0 ps-md-2 pe-0">
<div class="mh-100" style="overflow-y: auto;" id="message-page">
<Message v-if="message" :key="message.ID" :message="message" />
<template v-if="errorMessage">
<h3 class="text-center my-3">
{{ errorMessage }}
</h3>
</template>
<Message v-else-if="message" :key="message.ID" :message="message" />
</div>
</div>
</div>