|
7 | 7 | <span v-if="bounces.total > 0">({{ bounces.total }})</span> |
8 | 8 | </h1> |
9 | 9 | </div> |
10 | | - <div class="column has-text-right buttons"> |
11 | | - <b-button v-if="bulk.checked.length > 0 || bulk.all" type="is-primary" icon-left="trash-can-outline" |
12 | | - data-cy="btn-delete" @click.prevent="$utils.confirm(null, () => deleteBounces())"> |
13 | | - {{ $t('globals.buttons.clear') }} |
| 10 | + <div class="column has-text-right buttons is-flex is-align-items-center is-justify-content-flex-end is-flex-wrap-nowrap"> |
| 11 | + <div class="bulk-actions-wrapper" style="position: relative; display: flex; align-items: center;"> |
| 12 | + |
| 13 | + <!-- Dropdown for selected bulk actions --> |
| 14 | + <div class="bulk-dropdown-wrapper"> |
| 15 | + <b-dropdown |
| 16 | + v-if="bulk.checked.length > 0 || bulk.all" |
| 17 | + aria-role="list" |
| 18 | + class="bulk-dropdown-wrapper" |
| 19 | + > |
| 20 | + <template #trigger="{ active }"> |
| 21 | + <b-button |
| 22 | + label="Selected Actions" |
| 23 | + type="is-primary" |
| 24 | + :icon-right="active ? 'arrow-up' : 'arrow-down'" |
| 25 | + /> |
| 26 | + </template> |
| 27 | + <b-dropdown-item |
| 28 | + aria-role="listitem" |
| 29 | + @click="$utils.confirm(null, () => blocklistBounces())" |
| 30 | + > |
| 31 | + {{ $t('settings.bounces.blocklist') }} |
| 32 | + </b-dropdown-item> |
| 33 | + <b-dropdown-item |
| 34 | + aria-role="listitem" |
| 35 | + @click="$utils.confirm(null, () => deleteBounces())" |
| 36 | + > |
| 37 | + {{ $t('globals.buttons.clear') }} |
| 38 | + </b-dropdown-item> |
| 39 | + </b-dropdown> |
| 40 | + </div> |
| 41 | + |
| 42 | + <!-- Actions on all bounces --> |
| 43 | + <b-button |
| 44 | + v-if="bounces.total" |
| 45 | + icon-left="account-off-outline" |
| 46 | + data-cy="btn-bulk-blocklist" |
| 47 | + @click.prevent="$utils.confirm(null, () => blocklistBounces(true))" |
| 48 | + > |
| 49 | + {{ $t('settings.bounces.blocklist') + ' ' + $t('globals.terms.all') }} |
14 | 50 | </b-button> |
15 | | - <b-button v-if="bounces.total" icon-left="trash-can-outline" data-cy="btn-delete" |
16 | | - @click.prevent="$utils.confirm(null, () => deleteBounces(true))"> |
| 51 | + |
| 52 | + <b-button |
| 53 | + v-if="bounces.total" |
| 54 | + icon-left="trash-can-outline" |
| 55 | + data-cy="btn-delete" |
| 56 | + @click.prevent="$utils.confirm(null, () => deleteBounces(true))" |
| 57 | + > |
17 | 58 | {{ $t('globals.buttons.clearAll') }} |
18 | 59 | </b-button> |
| 60 | + |
19 | 61 | </div> |
| 62 | + </div> |
20 | 63 | </header> |
21 | 64 |
|
22 | 65 | <b-table :data="bounces.results" :hoverable="true" :loading="loading.bounces" default-sort="createdAt" checkable |
@@ -166,18 +209,32 @@ export default Vue.extend({ |
166 | 209 | const ids = this.bulk.checked.map((s) => s.id); |
167 | 210 | this.$api.deleteBounces({ id: ids }).then(fnSuccess); |
168 | 211 | }, |
| 212 | + blocklistBounces(all) { |
| 213 | + const count = all? this.bounces.total : this.bulk.checked.length; |
| 214 | + const fnSuccess = () => { |
| 215 | + this.getBounces(); |
| 216 | + this.$utils.toast(this.$t( |
| 217 | + 'globals.messages.blocklistedCount', |
| 218 | + { name: this.$tc('globals.terms.bounces'), num: count}, |
| 219 | + )); |
| 220 | + }; |
| 221 | + if (all) { |
| 222 | + this.$api.blocklistSubscriberBounces({all: true}). then(fnSuccess); |
| 223 | + return; |
| 224 | + } |
| 225 | + const ids = this.bulk.checked.map((s) => s.id); |
| 226 | + this.$api.blocklistSubscriberBounces({id: ids }).then(fnSuccess); |
| 227 | + }, |
169 | 228 | }, |
170 | 229 |
|
171 | 230 | computed: { |
172 | 231 | ...mapState(['templates', 'loading']), |
173 | | -
|
174 | 232 | selectedBounces() { |
175 | 233 | if (this.bulk.all) { |
176 | 234 | return this.bounces.total; |
177 | 235 | } |
178 | 236 | return this.bulk.checked.length; |
179 | 237 | }, |
180 | | -
|
181 | 238 | }, |
182 | 239 |
|
183 | 240 | mounted() { |
|
0 commit comments