go/mailpit
1
0
Fork 0
mirror of https://github.com/axllent/mailpit.git synced 2025-05-31 23:09:51 +02:00
Code Issues Releases Activity

UI: Allow multiple tags to be searched using Ctrl-click (#216)

Browse Source
This commit is contained in:
Ralph Slooten 2023-12-17 08:24:23 +13:00
parent bc75701abd
commit 0808e4543f
1 changed files with 31 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
server/ui-src/components/NavTags.vue
View File

@ -12,6 +12,7 @@ export default {
},
methods: {
// test whether a tag is currently being searched for (in the URL)
inSearch: function (tag) {
const urlParams = new URLSearchParams(window.location.search)
const query = urlParams.get('q')
@ -21,6 +22,35 @@ export default {
let re = new RegExp(`(^|\\s)tag:"?${tag}"?($|\\s)`, 'i')
return query.match(re)
},
// toggle a tag search in the search URL, add or remove it accordingly
toggleTag: function (e, tag) {
e.preventDefault()
const urlParams = new URLSearchParams(window.location.search)
let query = urlParams.get('q') ? urlParams.get('q') : ''
let re = new RegExp(`(^|\\s)((-|\\!)?tag:"?${tag}"?)($|\\s)`, 'i')
if (query.match(re)) {
// remove is exists
query = query.replace(re, '$1$4')
} else {
// add to query
if (tag.match(/ /)) {
tag = `"${tag}"`
}
query = query + " tag:" + tag
}
query = query.trim()
if (query == '') {
this.$router.push('/')
} else {
this.$router.push('/search?q=' + encodeURIComponent(query))
}
}
}
}
@ -44,6 +74,7 @@ export default {
</div>
<div class="list-group mt-1 mb-5 pb-3">
<RouterLink v-for="tag in mailbox.tags" :to="'/search?q=' + tagEncodeURI(tag)" @click="hideNav"
v-on:click.ctrl="toggleTag($event, tag)"
:style="mailbox.showTagColors ? { borderLeftColor: colorHash(tag), borderLeftWidth: '4px' } : ''"
class="list-group-item list-group-item-action small px-2" :class="inSearch(tag) ? 'active' : ''">
<i class="bi bi-tag-fill" v-if="inSearch(tag)"></i>